/* ============================================================
   Yinkentara Desert — warm-earth design system
   Palette: sand #faf6f3 / surface #f5ece5 / ink #3c3835
            soft #6e6862 / terracotta #bc773f / night #171310
   ============================================================ */

:root {
	--sand-bg: #faf6f3;
	--sand-surface: #f5ece5;
	--ink: #3c3835;
	--ink-soft: #6e6862;
	--terracotta: #bc773f;
	--night: #171310;
	--font-display: "Marcellus", "Songti SC", Georgia, serif;
	--font-body: "Helvetica Neue", "PingFang SC", "Microsoft YaHei", sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

html {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	font-family: var(--font-body);
	background: var(--sand-bg);
	color: var(--ink);
	line-height: 1.6;
	overflow-x: hidden;
}

img { max-width: 100%; display: block; }

::selection { background: var(--terracotta); color: #fff; }

/* ---------- Header ---------- */
.ykt-header {
	position: fixed;
	top: 0; left: 0;
	width: 100%;
	height: 88px;
	z-index: 100;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 clamp(20px, 4vw, 60px);
	background: transparent;
	border-bottom: 1px solid rgba(255,255,255,0.18);
	transition: height .4s cubic-bezier(.16,1,.3,1), background-color .4s ease, border-color .4s ease;
}
.ykt-header.is-solid {
	height: 64px;
	background: var(--sand-bg);
	border-bottom: 1px solid var(--ink);
}
.ykt-header__brand {
	font-family: var(--font-display);
	font-size: 19px;
	letter-spacing: .24em;
	cursor: pointer;
	color: #fff;
	transition: color .4s ease;
}
.ykt-header.is-solid .ykt-header__brand { color: var(--ink); }
.ykt-header__nav { display: flex; align-items: stretch; height: 100%; }
.ykt-nav-btn {
	display: flex; align-items: center; justify-content: center;
	padding: 0 24px;
	font-size: 13px; letter-spacing: .08em;
	background: transparent; color: #fff;
	border: none; cursor: pointer;
	text-transform: uppercase;
	font-family: var(--font-body);
	transition: background-color .25s ease, color .25s ease;
	white-space: nowrap;
}
.ykt-nav-btn:hover { background: #fff; color: var(--ink); }
.ykt-header.is-solid .ykt-nav-btn { color: var(--ink); }
.ykt-header.is-solid .ykt-nav-btn:hover { background: var(--ink); color: var(--sand-bg); }

/* ---------- Buttons ---------- */
.ykt-btn {
	font-size: 13px; font-weight: 500; letter-spacing: .14em;
	padding: 16px 36px;
	cursor: pointer;
	text-transform: uppercase;
	font-family: var(--font-body);
	transition: all .3s ease;
	text-decoration: none;
	display: inline-block;
}
.ykt-btn--outline-light {
	color: #fff; background: transparent; border: 1px solid #fff;
}
.ykt-btn--outline-light:hover { background: #fff; color: var(--night); }
.ykt-btn--link-light {
	color: #fff; background: transparent; border: none;
	padding: 16px 8px;
	text-decoration: underline; text-underline-offset: 6px;
}
.ykt-btn--solid-dark {
	color: #fff; background: var(--ink); border: 1px solid var(--ink);
}
.ykt-btn--solid-dark:hover { background: transparent; color: var(--ink); }

/* ---------- Hero ---------- */
.ykt-hero {
	position: relative;
	width: 100%; height: 100vh; min-height: 640px;
	overflow: hidden;
	background: var(--night);
}
.ykt-hero__img {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
}
.ykt-hero__overlay {
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(23,19,16,.55) 0%, rgba(23,19,16,.22) 35%, rgba(23,19,16,.58) 100%);
}
.ykt-hero__content {
	position: relative; z-index: 2;
	height: 100%;
	display: flex; flex-direction: column;
	align-items: flex-start; justify-content: center;
	gap: 28px;
	padding: 0 clamp(32px, 4.5vw, 72px);
}
.ykt-hero__eyebrow {
	font-size: 12px; font-weight: 500; letter-spacing: .28em;
	color: rgba(255,255,255,.85); text-transform: uppercase;
}
.ykt-hero__title {
	font-family: var(--font-display);
	font-size: clamp(44px, 7vw, 108px);
	font-weight: 400; letter-spacing: -.02em; line-height: 1.04;
	color: #fff; margin: 0;
	max-width: 980px;
	text-shadow: 0 2px 24px rgba(0,0,0,.3);
}
.ykt-hero__lede {
	font-size: clamp(15px, 1.2vw, 18px);
	font-weight: 300; line-height: 1.65;
	color: rgba(255,255,255,.9);
	max-width: 560px; margin: 0;
}
.ykt-hero__cta { display: flex; gap: 16px; margin-top: 12px; flex-wrap: wrap; }
.ykt-hero__scroll {
	position: absolute; bottom: 28px; left: 50%;
	transform: translateX(-50%);
	z-index: 2;
	font-size: 10px; letter-spacing: .3em;
	color: rgba(255,255,255,.75); text-transform: uppercase;
}

@keyframes kenburns {
	from { transform: scale(1.14) translate3d(-1.6%, -1%, 0); }
	to   { transform: scale(1.02) translate3d(0, 0, 0); }
}
.kenburns-slow {
	animation: kenburns 7s cubic-bezier(.2,.6,0,1) forwards;
	will-change: transform;
}
@media (prefers-reduced-motion: reduce) {
	.kenburns-slow { animation: none; }
}

/* ---------- Philosophy ---------- */
.ykt-philosophy {
	background: var(--sand-bg);
	padding: 160px clamp(20px, 4vw, 60px);
}
.ykt-philosophy__inner {
	max-width: 1400px; margin: 0 auto;
	display: flex; gap: 80px;
	flex-wrap: wrap; align-items: flex-start;
}
.ykt-philosophy__text {
	flex: 1 1 700px;
	font-family: var(--font-display);
	font-size: clamp(28px, 4vw, 56px);
	font-weight: 400; line-height: 1.28; letter-spacing: -.015em;
	color: var(--ink);
	max-width: 1200px; margin: 0;
}
.ykt-philosophy__tags {
	display: flex; flex-direction: column; gap: 12px;
	padding-top: 12px;
}
.ykt-tag {
	font-size: 11px; font-weight: 500; letter-spacing: .18em;
	color: var(--ink);
	padding: 10px 18px;
	border: 1px solid var(--terracotta);
	white-space: nowrap; text-transform: uppercase;
}

/* ---------- Stays grid ---------- */
.ykt-stays {
	background: var(--sand-surface);
	padding: 120px clamp(20px, 4vw, 60px);
}
.ykt-stays__head {
	max-width: 1560px; margin: 0 auto 60px;
	display: flex; justify-content: space-between; align-items: baseline;
	border-bottom: 1px solid var(--ink);
	padding-bottom: 20px;
}
.ykt-stays__title {
	font-family: var(--font-display);
	font-size: clamp(36px, 5vw, 64px);
	font-weight: 400; letter-spacing: -.02em; line-height: 1;
	color: var(--ink); margin: 0;
}
.ykt-stays__sub {
	font-size: 12px; letter-spacing: .18em;
	color: var(--terracotta); text-transform: uppercase;
}
.ykt-stays__grid {
	max-width: 1560px; margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 640px), 1fr));
	gap: 2px;
}
.ykt-stay-card {
	border: 1px solid var(--ink);
	background: var(--sand-bg);
	text-decoration: none;
	display: block;
	transition: transform .3s ease;
}
.ykt-stay-card:hover { transform: translateY(-4px); }
.ykt-stay-card__imgwrap {
	position: relative; width: 100%;
	padding-bottom: 56.25%;
	overflow: hidden;
	background: #dec9b8;
}
.ykt-stay-card__imgwrap img {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform .6s ease;
}
.ykt-stay-card:hover .ykt-stay-card__imgwrap img { transform: scale(1.04); }
.ykt-stay-card__body {
	padding: 20px 24px;
	border-top: 1px solid var(--ink);
	display: flex; justify-content: space-between; align-items: center;
	gap: 16px;
}
.ykt-stay-card__meta {
	font-size: 11px; letter-spacing: .2em;
	color: var(--ink-soft); text-transform: uppercase;
	margin: 0 0 6px;
}
.ykt-stay-card__name {
	font-size: 18px; font-weight: 500;
	color: var(--ink); letter-spacing: -.01em; line-height: 1.3;
	margin: 0;
}
.ykt-stay-card__view {
	font-size: 12px; letter-spacing: .14em;
	color: var(--terracotta); text-transform: uppercase;
	white-space: nowrap;
}

/* ---------- Experiences ---------- */
.ykt-experiences {
	position: relative;
	overflow: hidden;
	background: var(--night);
	padding: clamp(100px, 12vw, 160px) clamp(20px, 4vw, 60px);
}
.ykt-experiences__bg {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover; z-index: 0;
}
.ykt-experiences__overlay {
	position: absolute; inset: 0;
	background: rgba(23,19,16,.62); z-index: 1;
}
.ykt-experiences__inner {
	position: relative; z-index: 2;
	max-width: 1400px; margin: 0 auto;
}
.ykt-experiences__head {
	display: flex; gap: clamp(32px, 6vw, 80px);
	align-items: flex-start; justify-content: space-between;
	flex-wrap: wrap;
	margin-bottom: 60px; padding-bottom: 28px;
	border-bottom: 1px solid rgba(255,255,255,.35);
}
.ykt-experiences__headtext { flex: 1 1 500px; }
.ykt-experiences__eyebrow {
	font-size: 11px; letter-spacing: .24em;
	color: rgba(255,255,255,.7); text-transform: uppercase;
	margin: 0 0 18px;
}
.ykt-experiences__title {
	font-family: var(--font-display);
	font-size: clamp(40px, 6vw, 80px);
	font-weight: 400; letter-spacing: -.02em; line-height: 1;
	color: #fff; margin: 0 0 24px;
}
.ykt-experiences__lede {
	font-size: clamp(15px, 1.2vw, 18px);
	font-weight: 300; line-height: 1.6;
	color: rgba(255,255,255,.78);
	max-width: 640px; margin: 0;
}
.ykt-experiences__badge {
	flex: 0 0 clamp(180px, 22vw, 280px);
	aspect-ratio: 1;
	display: flex; align-items: center; justify-content: center;
}
.ykt-orbital { width: 100%; height: 100%; transform: rotate(-15deg); }
.ykt-orbital svg { width: 100%; height: 100%; }
.ykt-orbital text {
	fill: #fff;
	font-family: var(--font-body);
	font-size: 18px; font-weight: 500; letter-spacing: 2px;
}
.ykt-experiences__grid {
	list-style: none; padding: 0; margin: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
	gap: 2px;
	background: rgba(255,255,255,.18);
	border: 1px solid rgba(255,255,255,.18);
}
.ykt-exp-item {
	background: rgba(23,19,16,.55);
	padding: 28px 32px;
	display: flex; gap: 20px; align-items: flex-start;
	min-height: 140px;
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}
.ykt-exp-item__num {
	flex: 0 0 auto; width: 28px;
	font-size: 11px; letter-spacing: .14em;
	color: rgba(255,255,255,.55);
	font-variant-numeric: tabular-nums;
	padding-top: 7px;
}
.ykt-exp-item__label {
	font-size: clamp(18px, 1.6vw, 24px);
	font-weight: 500; letter-spacing: -.01em; line-height: 1.2;
	color: #fff; margin: 0 0 10px;
}
.ykt-exp-item__detail {
	font-size: 14px; line-height: 1.55;
	color: rgba(255,255,255,.72); margin: 0;
}

/* ---------- Reservation ---------- */
.ykt-reserve {
	position: relative;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 480px), 1fr));
	min-height: 700px;
	background: var(--night);
}
.ykt-reserve__shader {
	position: relative; min-height: 420px; overflow: hidden;
}
#ykt-dune-canvas {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	display: block;
}
.ykt-reserve__shader-text {
	position: absolute;
	bottom: clamp(24px, 4vw, 48px);
	left: clamp(24px, 4vw, 48px);
	right: clamp(24px, 4vw, 48px);
	z-index: 2; pointer-events: none;
}
.ykt-reserve__shader-text h2 {
	font-family: var(--font-display);
	font-size: clamp(36px, 4.5vw, 64px);
	font-weight: 400; letter-spacing: -.02em; line-height: 1.05;
	color: #fff; margin: 0 0 16px;
	text-shadow: 0 2px 24px rgba(0,0,0,.25);
}
.ykt-reserve__shader-text p {
	font-size: 13px; letter-spacing: .18em;
	color: rgba(255,255,255,.9); text-transform: uppercase;
	margin: 0;
}
.ykt-reserve__form {
	background: var(--night); color: #fff;
	padding: clamp(40px, 5vw, 72px) clamp(24px, 4vw, 60px);
	display: flex; flex-direction: column; justify-content: center;
}
.ykt-reserve__form-inner { max-width: 520px; width: 100%; margin: 0 auto; }
.ykt-reserve__eyebrow {
	font-size: 11px; letter-spacing: .24em;
	color: rgba(255,255,255,.6); text-transform: uppercase;
	margin: 0 0 14px;
}
.ykt-reserve__title {
	font-family: var(--font-display);
	font-size: clamp(28px, 3.2vw, 40px);
	font-weight: 400; letter-spacing: -.015em; line-height: 1.15;
	margin: 0 0 36px;
}
.ykt-reserve__success {
	border: 1px solid rgba(255,255,255,.4);
	padding: 32px 28px;
	font-size: 15px; line-height: 1.6;
	color: rgba(255,255,255,.85);
}
.ykt-reserve__error {
	border: 1px solid rgba(255,100,100,.5);
	padding: 14px 18px;
	font-size: 13px; line-height: 1.5;
	color: rgba(255,150,150,.9);
	margin-bottom: 20px;
}

.ykt-form { display: flex; flex-direction: column; gap: 20px; }
.ykt-form__row {
	display: grid; grid-template-columns: 1fr 1fr; gap: 20px;
}
.ykt-field { display: block; }
.ykt-field span {
	font-size: 11px; letter-spacing: .2em;
	color: rgba(255,255,255,.6); text-transform: uppercase;
	margin-bottom: 4px; display: block;
}
.ykt-field input,
.ykt-field select,
.ykt-field textarea {
	width: 100%;
	padding: 12px 0;
	font-size: 15px;
	background: transparent;
	color: #fff;
	border: none;
	border-bottom: 1px solid rgba(255,255,255,.35);
	outline: none;
	font-family: inherit;
	letter-spacing: .01em;
	appearance: none;
	-webkit-appearance: none;
	border-radius: 0;
	color-scheme: dark;
}
.ykt-field textarea { resize: vertical; padding-top: 12px; }
.ykt-field input:focus,
.ykt-field select:focus,
.ykt-field textarea:focus { border-bottom-color: #fff; }
.ykt-field select option { color: #000; background: #fff; }
.ykt-form__submit { margin-top: 12px; width: 100%; }

.ykt-field--dark span { color: var(--ink-soft); }
.ykt-field--dark input,
.ykt-field--dark select,
.ykt-field--dark textarea {
	color: var(--ink);
	border-bottom-color: rgba(60,56,53,.35);
	color-scheme: light;
}
.ykt-field--dark input:focus { border-bottom-color: var(--ink); }

/* ---------- Footer ---------- */
.ykt-footer {
	background: var(--sand-bg);
	border-top: 1px solid var(--ink);
	padding: 80px clamp(20px, 4vw, 60px) 0;
	min-height: 600px;
	display: flex; flex-direction: column; justify-content: space-between;
	overflow: hidden;
}
.ykt-footer__cols {
	max-width: 1400px; margin: 0 auto;
	width: 100%;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 40px;
	padding-bottom: 80px;
}
.ykt-footer__label {
	font-size: 12px; font-weight: 500; letter-spacing: .18em;
	color: var(--ink); margin: 0 0 20px;
}
.ykt-footer__city {
	font-size: 16px; font-weight: 500;
	color: var(--ink); margin: 0 0 8px;
}
.ykt-footer__text {
	font-size: 14px; color: var(--ink-soft);
	line-height: 1.6; margin: 0 0 12px;
	max-width: 260px;
}
.ykt-footer__text--lines { line-height: 2; }
.ykt-footer__coords {
	font-size: 11px; letter-spacing: .05em;
	color: var(--ink-soft);
	font-variant-numeric: tabular-nums;
	margin: 0;
}
.ykt-footer__wordmark {
	width: 100%;
	overflow: hidden;
	line-height: .85;
	font-family: var(--font-display);
	font-size: clamp(64px, 15vw, 260px);
	font-weight: 400; letter-spacing: .02em;
	color: var(--ink);
	white-space: nowrap;
	transform: translateY(15%);
	user-select: none;
	text-align: center;
}

/* ---------- Stay detail page ---------- */
.ykt-detail { background: var(--sand-bg); min-height: 100vh; }
.ykt-detail__hero {
	position: relative; width: 100%;
	height: clamp(400px, 70vh, 720px);
	overflow: hidden; background: var(--night);
}
.ykt-detail__hero img {
	position: absolute; inset: 0;
	width: 100%; height: 100%; object-fit: cover;
}
.ykt-detail__hero-overlay {
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,0) 40%, rgba(0,0,0,.55) 100%);
}
.ykt-detail__back {
	position: absolute;
	top: clamp(100px, 14vh, 140px);
	left: clamp(24px, 4vw, 60px);
	font-size: 12px; letter-spacing: .16em;
	padding: 12px 24px;
	border: 1px solid #fff;
	background: rgba(0,0,0,.35);
	color: #fff;
	cursor: pointer;
	text-transform: uppercase;
	font-family: var(--font-body);
	backdrop-filter: blur(6px);
	text-decoration: none;
}
.ykt-detail__hero-text {
	position: absolute;
	bottom: clamp(32px, 5vw, 60px);
	left: clamp(24px, 4vw, 60px);
	right: clamp(24px, 4vw, 60px);
	color: #fff;
}
.ykt-detail__meta {
	font-size: 12px; letter-spacing: .2em;
	text-transform: uppercase;
	opacity: .8; margin: 0 0 12px;
}
.ykt-detail__title {
	font-family: var(--font-display);
	font-size: clamp(36px, 6vw, 80px);
	font-weight: 400; letter-spacing: -.02em; line-height: 1.02;
	margin: 0; max-width: 900px;
}
.ykt-detail__body {
	max-width: 1400px; margin: 0 auto;
	padding: 80px clamp(24px, 4vw, 60px) 120px;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
	gap: clamp(40px, 5vw, 80px);
	align-items: flex-start;
}
.ykt-detail__tagline {
	font-family: var(--font-display);
	font-size: clamp(20px, 2.2vw, 30px);
	font-weight: 400; line-height: 1.4; letter-spacing: -.015em;
	color: var(--ink);
	margin: 0 0 48px; max-width: 680px;
}
.ykt-detail__desc p {
	font-size: 16px; line-height: 1.8;
	color: #333; margin: 0 0 24px;
	max-width: 680px;
}
.ykt-detail__features {
	margin-top: 64px; padding-top: 32px;
	border-top: 1px solid var(--ink);
}
.ykt-detail__features-label {
	font-size: 11px; letter-spacing: .22em;
	color: var(--ink); text-transform: uppercase;
	margin: 0 0 28px;
}
.ykt-detail__features-list {
	list-style: none; padding: 0; margin: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
	gap: 14px 40px;
}
.ykt-detail__features-list li {
	font-size: 15px; line-height: 1.6;
	color: #333;
	padding-left: 20px;
	position: relative;
}
.ykt-detail__features-list li::before {
	content: '';
	position: absolute; left: 0; top: 12px;
	width: 8px; height: 1px;
	background: var(--ink);
}
.ykt-detail__panel {
	position: sticky; top: 112px;
	border: 1px solid var(--ink);
	padding: 32px 28px;
	background: var(--sand-bg);
}
.ykt-detail__from {
	font-size: 11px; letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--ink-soft); margin: 0 0 12px;
}
.ykt-detail__price {
	font-family: var(--font-display);
	font-size: clamp(36px, 4vw, 52px);
	font-weight: 400; letter-spacing: -.02em; line-height: 1;
	color: var(--ink); margin: 0 0 6px;
}
.ykt-detail__pricenote {
	font-size: 13px; color: var(--ink-soft);
	line-height: 1.5; margin: 0 0 28px;
}
.ykt-detail__specs {
	border-top: 1px solid #e5e0da;
	border-bottom: 1px solid #e5e0da;
	padding: 16px 0;
	margin: 0 0 28px;
	display: grid; gap: 10px;
}
.ykt-detail__specs > div {
	display: flex; justify-content: space-between;
	font-size: 13px; color: #333;
}
.ykt-detail__specs dt { color: var(--ink-soft); }
.ykt-detail__specs dd { margin: 0; font-weight: 500; color: var(--ink); }
.ykt-detail__reserve { width: 100%; margin-top: 12px; }
.ykt-detail__backlink {
	display: block;
	width: 100%; margin-top: 14px;
	font-size: 12px; letter-spacing: .14em;
	color: var(--ink-soft);
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	padding: 10px;
}

/* ---------- Responsive ---------- */
@media (max-width: 720px) {
	.ykt-nav-btn { padding: 0 12px; font-size: 11px; }
	.ykt-header__brand { font-size: 15px; letter-spacing: .18em; }
	.ykt-philosophy { padding: 100px 24px; }
	.ykt-stays { padding: 80px 24px; }
	.ykt-form__row { grid-template-columns: 1fr; }
}