/* =========================================================================
   Villa Inlet Galle — stylesheet
   Coastal-luxury visual system. Fluid type, minimal media queries.
   Sections: tokens · base · typography · layout · components · sections · a11y
   ========================================================================= */

/* ----------------------------- Design tokens ---------------------------- */
:root{
  /* Neutrals — warm sand paper */
  --sand-50:#FCFAF4;
  --sand-100:#F4EEE0;
  --sand-200:#E7DDC7;
  --paper:#FFFFFF;

  /* Ink */
  --ink:#172A2E;
  --ink-soft:#556468;
  --ink-faint:#8C979A;

  /* Brand — deep teal + warm gold */
  --teal-900:#0C2428;
  --teal-800:#103036;
  --teal-700:#1A484F;
  --teal-600:#256A6E;
  --teal-500:#3A8A87;
  --gold-500:#C79A57;
  --gold-600:#A87C3B;
  --gold-100:#EEE0C4;

  /* Roles */
  --bg:var(--sand-50);
  --fg:var(--ink);
  --card:var(--paper);
  --border:rgba(23,42,46,.10);
  --hairline:rgba(23,42,46,.07);
  --primary:var(--teal-700);
  --accent:var(--gold-500);
  --deep:var(--teal-900);
  --deep-fg:#ECE4D2;

  /* Shape + depth — layered, colour-tinted shadows */
  --radius:16px;
  --radius-sm:11px;
  --radius-lg:24px;
  --shadow-sm:0 1px 2px rgba(12,36,40,.05), 0 6px 18px -8px rgba(12,36,40,.14);
  --shadow-md:0 2px 6px rgba(12,36,40,.06), 0 26px 52px -24px rgba(12,36,40,.32);
  --shadow-lg:0 4px 12px rgba(12,36,40,.07), 0 52px 96px -34px rgba(12,36,40,.44);
  --shadow-gold:0 2px 6px rgba(150,110,50,.18), 0 22px 44px -18px rgba(199,154,87,.55);

  /* Type */
  --font-display:'Playfair Display', ui-serif, Georgia, 'Times New Roman', serif;
  --font-sans:'Plus Jakarta Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  /* Rhythm */
  --container:1200px;
  --gutter:clamp(1.25rem, 4vw, 2.75rem);
  --section-y:clamp(5rem, 10vw, 9rem);
  --header-h:76px;

  --ease:cubic-bezier(.22,1,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
}

/* ------------------------- Language-specific type --------------------- */
html[lang="ar"] body{font-family:'Noto Sans Arabic', var(--font-sans);}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3,html[lang="ar"] h4{
  font-family:'Noto Kufi Arabic','Noto Sans Arabic', var(--font-display);
  font-weight:600; letter-spacing:0; line-height:1.25;
}
html[lang="ar"] .eyebrow,html[lang="ar"] .btn,html[lang="ar"] .chip{letter-spacing:.02em;}
html[lang="zh"] body{font-family:'Noto Sans SC', var(--font-sans);}
html[lang="zh"] h1,html[lang="zh"] h2,html[lang="zh"] h3,html[lang="zh"] h4{
  font-family:'Noto Serif SC', var(--font-display); font-weight:600; letter-spacing:0; line-height:1.3;
}
html[lang="zh"] .eyebrow{letter-spacing:.14em;}

/* ------------------------------- Reset -------------------------------- */
*,*::before,*::after{box-sizing:border-box;}
*{margin:0;padding:0;}
html{scroll-behavior:smooth; scroll-padding-top:calc(var(--header-h) + 16px); -webkit-text-size-adjust:100%; overflow-x:clip;}
body{
  background:var(--bg); color:var(--fg);
  font-family:var(--font-sans); font-size:1.02rem; line-height:1.72; letter-spacing:-.003em;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility;
  overflow-x:clip;
}
/* barely-there paper grain for tactile depth */
body::after{
  content:""; position:fixed; inset:0; z-index:9998; pointer-events:none; opacity:.025;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
img,svg,video{display:block; max-width:100%;}
img{height:auto;}
a{color:inherit; text-decoration:none;}
button,input,select,textarea{font:inherit; color:inherit;}
::selection{background:rgba(199,154,87,.26); color:var(--ink);}
:focus-visible{outline:2px solid var(--accent); outline-offset:3px; border-radius:4px;}

h1,h2,h3,h4{font-family:var(--font-display); font-weight:500; letter-spacing:-.025em; line-height:1.1; color:var(--ink);}
h1{font-size:clamp(2.9rem, 6.4vw, 5rem); letter-spacing:-.032em;}
h2{font-size:clamp(2.05rem, 4.2vw, 3.05rem); letter-spacing:-.028em;}
h3{font-size:clamp(1.22rem, 2vw, 1.5rem);}
p{text-wrap:pretty;}

/* --------------------------- Utility layout --------------------------- */
.wrap{max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter);}
.section{padding-block:var(--section-y);}
.eyebrow{
  display:inline-flex; align-items:center; gap:.7rem; font-family:var(--font-sans);
  font-size:.66rem; font-weight:700; letter-spacing:.28em; text-transform:uppercase;
  color:var(--gold-600);
}
.eyebrow::before{content:""; width:26px; height:1px; background:currentColor; opacity:.55;}
.section-head{max-width:660px;}
.section-head .eyebrow{margin-bottom:1.1rem;}
.section-head p{margin-top:1.15rem; color:var(--ink-soft); font-size:1.06rem;}
.lead{font-size:1.08rem; color:var(--ink-soft);}
.ltr{unicode-bidi:isolate; direction:ltr; display:inline-block;}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}
.skip-link{position:fixed; inset-inline-start:0; top:0; z-index:300; padding:.7rem 1.2rem; background:var(--primary); color:#fff; font-size:.78rem; font-weight:600; letter-spacing:.04em; border-radius:0 0 10px 10px; transform:translateY(-130%); transition:transform .2s var(--ease-out);}
.skip-link:focus{transform:translateY(0);}

/* ------------------------------ Buttons ------------------------------ */
.btn{
  --btn-bg:var(--primary); --btn-fg:#fff; --btn-bd:transparent;
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  min-height:3.1rem; padding:.9rem 1.8rem;
  font-size:.7rem; font-weight:600; letter-spacing:.11em; text-transform:uppercase;
  border-radius:999px; border:1px solid var(--btn-bd); background:var(--btn-bg); color:var(--btn-fg);
  cursor:pointer; white-space:nowrap; overflow:hidden;
  transition:transform .4s var(--ease-out), box-shadow .4s var(--ease-out), background-color .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease);
}
.btn svg{width:16px; height:16px;}
.btn:hover{transform:translateY(-2px);}
.btn:active{transform:translateY(0);}
.btn-primary{--btn-bg:var(--primary); box-shadow:0 1px 2px rgba(12,36,40,.12), 0 16px 32px -14px rgba(26,72,79,.5);}
.btn-primary:hover{--btn-bg:var(--teal-800); box-shadow:0 2px 4px rgba(12,36,40,.14), 0 26px 50px -16px rgba(26,72,79,.62);}
.btn-gold{
  --btn-fg:#20303a; background:linear-gradient(135deg,#D3AB69 0%, #C79A57 45%, #B98C46 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28), var(--shadow-gold);
}
.btn-gold:hover{background:linear-gradient(135deg,#D8B171 0%, #C99C58 45%, #B0843F 100%); box-shadow:inset 0 1px 0 rgba(255,255,255,.32), 0 3px 8px rgba(150,110,50,.24), 0 30px 56px -18px rgba(199,154,87,.65);}
.btn-ghost{--btn-bg:transparent; --btn-fg:var(--ink); --btn-bd:rgba(23,42,46,.2);}
.btn-ghost:hover{--btn-bg:var(--ink); --btn-fg:var(--sand-50); --btn-bd:var(--ink);}
.btn-on-dark{--btn-bg:rgba(255,255,255,.1); --btn-fg:#fff; --btn-bd:rgba(255,255,255,.55); backdrop-filter:blur(6px); box-shadow:0 1px 2px rgba(8,24,27,.25);}
.btn-on-dark:hover{--btn-bg:var(--deep-fg); --btn-fg:var(--deep); --btn-bd:var(--deep-fg);}
.btn-block{width:100%;}

.arrow-link{display:inline-flex; align-items:center; gap:.55rem; font-weight:600; color:var(--primary); padding-bottom:2px; background-image:linear-gradient(var(--accent),var(--accent)); background-size:0% 1px; background-position:0 100%; background-repeat:no-repeat; transition:background-size .4s var(--ease-out);}
.arrow-link:hover{background-size:100% 1px;}
.arrow-link svg{width:16px; height:16px; transition:transform .35s var(--ease-out);}
.arrow-link:hover svg{transform:translateX(5px);}
html[dir="rtl"] .arrow-link svg{transform:scaleX(-1);}
html[dir="rtl"] .arrow-link:hover svg{transform:translateX(-5px) scaleX(-1);}

.chip{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.4rem .8rem; border:1px solid var(--border); border-radius:999px;
  font-size:.72rem; font-weight:500; letter-spacing:.01em; color:var(--ink-soft); background:var(--paper);
}
.chip svg{width:14px; height:14px; color:var(--primary);}

/* ------------------------------ Header ------------------------------- */
.site-header{
  position:fixed; inset-inline:0; top:0; z-index:100;
  transition:background-color .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
  border-bottom:1px solid transparent;
}
.site-header.scrolled,.site-header.nav-open{
  background:rgba(252,250,244,.82); backdrop-filter:blur(20px) saturate(1.4);
  border-bottom-color:var(--hairline);
  box-shadow:0 1px 0 rgba(255,255,255,.5) inset, 0 10px 30px -20px rgba(12,36,40,.35);
}
.header-inner{
  max-width:1280px; margin-inline:auto; padding:16px var(--gutter);
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  color:var(--deep-fg); transition:color .4s var(--ease), padding .4s var(--ease);
}
.site-header.scrolled .header-inner,.site-header.nav-open .header-inner{color:var(--ink); padding-block:11px;}
.brand{display:flex; flex-direction:column; line-height:1.05;}
.brand b{font-family:var(--font-display); font-weight:600; font-size:1.2rem; letter-spacing:-.01em;}
.brand span{font-size:.56rem; font-weight:700; text-transform:uppercase; letter-spacing:.34em; color:var(--gold-500); margin-top:4px;}
.primary-nav{display:none; align-items:center; gap:1.9rem;}
.primary-nav a{position:relative; font-size:.8rem; font-weight:500; letter-spacing:.01em; opacity:.9; transition:opacity .2s, color .2s;}
.primary-nav a::after{content:""; position:absolute; inset-inline:0; bottom:-7px; height:1px; background:currentColor; transform:scaleX(0); transform-origin:left; transition:transform .35s var(--ease-out);}
html[dir="rtl"] .primary-nav a::after{transform-origin:right;}
.primary-nav a:hover{opacity:1;}
.primary-nav a:hover::after{transform:scaleX(1);}
.primary-nav a.active{opacity:1; color:var(--gold-500);}
.primary-nav a.active::after{transform:scaleX(1);}
.header-actions{display:flex; align-items:center; gap:.6rem;}
.header-cta{display:none;}

.icon-btn{
  display:grid; place-items:center; width:44px; height:44px; border-radius:999px;
  border:1px solid currentColor; background:transparent; cursor:pointer; opacity:.85;
}
.icon-btn:hover{opacity:1;}

@media(min-width:1024px){
  .primary-nav{display:flex;}
  .menu-toggle{display:none;}
}
@media(min-width:600px){ .header-cta{display:inline-flex;} }

/* ---------------------- Language switcher --------------------------- */
.lang{position:relative;}
.lang-btn{
  display:inline-flex; align-items:center; gap:.4rem; height:40px; padding:0 .7rem;
  border-radius:999px; border:1px solid currentColor; background:transparent; cursor:pointer;
  font-size:.72rem; font-weight:700; letter-spacing:.06em; opacity:.9;
}
.lang-btn:hover{opacity:1;}
.lang-btn svg{width:14px; height:14px;}
.lang-btn .chev{transition:transform .25s var(--ease);}
.lang.open .lang-btn .chev{transform:rotate(180deg);}
.lang-menu{
  position:absolute; top:calc(100% + 10px); inset-inline-end:0; min-width:190px;
  background:var(--card); color:var(--ink); border:1px solid var(--border);
  border-radius:14px; box-shadow:var(--shadow-lg); padding:6px;
  opacity:0; visibility:hidden; transform:translateY(-8px);
  transition:opacity .2s var(--ease), transform .2s var(--ease), visibility .2s;
  z-index:110;
}
.lang.open .lang-menu{opacity:1; visibility:visible; transform:translateY(0);}
.lang-menu button{
  display:flex; align-items:center; justify-content:space-between; gap:.6rem; width:100%;
  padding:.6rem .7rem; border:0; border-radius:9px; background:transparent; cursor:pointer;
  font-size:.9rem; text-align:start;
}
.lang-menu button:hover{background:var(--sand-100);}
.lang-menu button[aria-selected="true"]{color:var(--primary); font-weight:700;}
.lang-menu button .tick{width:15px; height:15px; color:var(--accent); opacity:0;}
.lang-menu button[aria-selected="true"] .tick{opacity:1;}

/* --------------------------- Mobile nav ---------------------------- */
.mobile-nav{
  position:fixed; inset:0; z-index:99;
  background:var(--sand-50); padding:calc(var(--header-h) + 1.5rem) var(--gutter) 2.5rem;
  display:flex; flex-direction:column; gap:.25rem;
  transform:translateX(100%); transition:transform .4s var(--ease);
  overflow-y:auto;
}
html[dir="rtl"] .mobile-nav{transform:translateX(-100%);}
.mobile-nav.open{transform:translateX(0);}
.mobile-nav a{
  padding:1rem 0; border-bottom:1px solid var(--border);
  font-family:var(--font-display); font-size:1.4rem; color:var(--ink);
}
.mobile-nav .btn{margin-top:1.5rem;}
.mobile-lang{margin-top:1.75rem;}
.mobile-lang p{font-size:.66rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:.75rem;}
.mobile-lang-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:.5rem;}
.mobile-lang-grid button{
  padding:.7rem .9rem; border:1px solid var(--border); border-radius:10px; background:transparent;
  font-size:.9rem; cursor:pointer;
}
.mobile-lang-grid button[aria-selected="true"]{border-color:var(--accent); background:var(--sand-100); color:var(--primary); font-weight:700;}

/* ------------------------------- Hero ------------------------------- */
.hero{position:relative; min-height:100svh; display:flex; align-items:flex-end; isolation:isolate; overflow:hidden;}
.hero-media{position:absolute; inset:0; z-index:-2; overflow:hidden;}
.hero-media img{width:100%; height:100%; object-fit:cover; object-position:50% 58%; transform:scale(1.04); animation:kenburns 22s var(--ease-out) forwards;}
.hero-media::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(8,24,27,.55) 0%, rgba(8,24,27,.16) 20%, rgba(8,24,27,.34) 40%, rgba(8,24,27,.52) 58%, rgba(8,24,27,.74) 78%, rgba(8,24,27,.92) 100%),
    radial-gradient(135% 100% at 50% -8%, transparent 40%, rgba(8,24,27,.42) 100%);
}
.hero-inner{max-width:var(--container); margin-inline:auto; width:100%; padding:8.5rem var(--gutter) 3rem; color:var(--deep-fg);}
.hero .eyebrow{color:var(--gold-100);}
.hero h1{color:#fff; max-width:15ch; margin-top:1.15rem; line-height:1.16; text-shadow:0 2px 30px rgba(8,24,27,.35);}
.hero h1 .row{display:block; overflow:hidden; padding-bottom:.14em;}
.hero h1 .row span{display:block; transform:translateY(110%); animation:rise 1s var(--ease-out) forwards;}
.hero h1 .row:nth-child(2) span{animation-delay:.12s;}
.hero-rule{width:88px; height:2px; background:linear-gradient(90deg,var(--accent),rgba(199,154,87,0)); margin-top:1.7rem; transform:scaleX(0); transform-origin:left; animation:draw .9s .55s var(--ease-out) forwards;}
html[dir="rtl"] .hero-rule{transform-origin:right; background:linear-gradient(270deg,var(--accent),rgba(199,154,87,0));}
.hero-copy{margin-top:1.5rem; max-width:44ch; font-size:1.06rem; color:rgba(236,228,210,.88); opacity:0; animation:fade .8s .7s var(--ease) forwards;}
.hero-cta{margin-top:2.1rem; display:flex; flex-wrap:wrap; gap:.75rem; opacity:0; animation:fade .8s .85s var(--ease) forwards;}

/* availability quick-bar — frosted glass */
.availbar{
  margin-top:2.5rem; background:rgba(252,250,244,.68); color:var(--ink);
  border:1px solid rgba(255,255,255,.5); border-radius:18px;
  box-shadow:0 1px 0 rgba(255,255,255,.4) inset, 0 34px 70px -30px rgba(8,24,27,.7);
  backdrop-filter:blur(22px) saturate(1.4); -webkit-backdrop-filter:blur(22px) saturate(1.4);
  padding:1.15rem; display:grid; gap:.8rem; grid-template-columns:1fr; max-width:560px;
  opacity:0; animation:fade .8s 1s var(--ease) forwards;
}
.availbar .field{display:flex; flex-direction:column; gap:.35rem;}
.availbar label{font-size:.6rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-soft);}
.availbar input,.availbar select{
  border:1px solid rgba(23,42,46,.14); border-radius:11px; background:rgba(255,255,255,.72);
  padding:.62rem .7rem; font-size:.92rem; transition:border-color .2s, background-color .2s;
}
.availbar input:focus,.availbar select:focus{outline:none; border-color:var(--primary); background:#fff;}
.availbar .btn{margin-top:.2rem;}
@media(min-width:560px){
  .availbar{grid-template-columns:1fr 1fr; align-items:end;}
  .availbar .availbar-submit{grid-column:1 / -1;}
}
@media(min-width:900px){
  .availbar{grid-template-columns:1fr 1fr 90px auto; max-width:none;}
  .availbar .availbar-submit{grid-column:auto;}
}

.hero-scroll{
  position:absolute; inset-inline:0; bottom:1.1rem; margin-inline:auto; width:1px; height:44px;
  background:linear-gradient(rgba(238,231,215,0), rgba(238,231,215,.8));
  animation:pulse 2.4s ease-in-out infinite;
}

@media(max-width:600px){
  .hero{min-height:86svh;}
  .hero-inner{padding:6rem var(--gutter) 2.25rem;}
  .hero h1{font-size:2.35rem; max-width:none;}
  .hero-copy{margin-top:1.1rem; font-size:1rem;}
  .hero-cta{margin-top:1.6rem;}
  .hero-cta .btn{flex:1 1 auto;}
  .availbar{display:none;}   /* dates are collected in the full booking form below */
  .hero-scroll{display:none;}
}

@keyframes rise{to{transform:translateY(0);}}
@keyframes draw{to{transform:scaleX(1);}}
@keyframes fade{to{opacity:1;}}
@keyframes pulse{0%,100%{opacity:.2;}50%{opacity:1;}}
@keyframes kenburns{to{transform:scale(1.12);}}

/* ------------------------- Amenity trust strip --------------------- */
.trust{background:linear-gradient(180deg,var(--sand-100),var(--sand-50)); border-block:1px solid var(--hairline);}
.trust-grid{
  max-width:var(--container); margin-inline:auto; padding:2.75rem var(--gutter);
  display:grid; grid-template-columns:repeat(2,1fr); gap:1.75rem 1.5rem;
}
.trust-item{display:flex; align-items:center; gap:.8rem; color:var(--teal-800);}
.trust-item svg{width:22px; height:22px; color:var(--primary); flex-shrink:0; transition:transform .45s var(--ease-out);}
.trust-item:hover svg{transform:translateY(-3px) scale(1.1);}
.trust-item span{font-size:.88rem; font-weight:500; line-height:1.3;}
@media(min-width:640px){.trust-grid{grid-template-columns:repeat(3,1fr);}}
@media(min-width:1024px){
  .trust-grid{grid-template-columns:repeat(6,1fr); gap:1.5rem 0;}
  .trust-item{justify-content:center; text-align:center; flex-direction:column; gap:.6rem; padding-inline:.75rem; position:relative;}
  .trust-item + .trust-item::before{content:""; position:absolute; inset-inline-start:0; top:50%; transform:translateY(-50%); width:1px; height:34px; background:var(--border);}
  .trust-item svg{width:24px; height:24px;}
}

/* ------------------------------ About ----------------------------- */
.about-grid{display:grid; gap:clamp(2rem,5vw,3.5rem); align-items:center;}
@media(min-width:900px){.about-grid{grid-template-columns:1.05fr .95fr;}}
.about-copy h2{margin-top:.85rem;}
.about-copy .divider{width:64px; height:1px; background:var(--border); margin:1.6rem 0;}
.about-copy p + p{margin-top:1.1rem;}
.about-copy p{color:var(--ink-soft); font-size:1.04rem;}
.about-copy .arrow-link{margin-top:1.9rem;}
.about-media{position:relative;}
.about-media img{width:100%; border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); aspect-ratio:5/4; object-fit:cover;}
.about-media img{aspect-ratio:4/5;}
.about-media::after{content:""; position:absolute; inset-inline-start:-14px; bottom:-14px; width:120px; height:120px; border:1px solid var(--gold-500); border-radius:var(--radius-lg); z-index:-1; opacity:.5;}
.service-grid{margin-top:clamp(3rem,6vw,4.5rem); display:grid; gap:1.15rem;}
@media(min-width:720px){.service-grid{grid-template-columns:repeat(3,1fr);}}
.service-card{
  position:relative; overflow:hidden;
  background:var(--card); border:1px solid var(--border); border-radius:var(--radius); padding:1.75rem;
  box-shadow:var(--shadow-sm);
  transition:transform .5s var(--ease-out), box-shadow .5s var(--ease-out);
}
.service-card::before{content:""; position:absolute; inset-inline:0; top:0; height:2px; background:var(--gold-500); transform:scaleX(0); transform-origin:left; transition:transform .5s var(--ease-out);}
html[dir="rtl"] .service-card::before{transform-origin:right;}
.service-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-lg);}
.service-card:hover::before{transform:scaleX(1);}
.service-card .ic{display:grid; place-items:center; width:44px; height:44px; border-radius:12px; background:var(--sand-100); color:var(--primary); margin-bottom:1.1rem; transition:background-color .4s, color .4s;}
.service-card:hover .ic{background:var(--primary); color:#fff;}
.service-card .ic svg{width:20px; height:20px;}
.service-card p{margin-top:.65rem; font-size:.92rem; color:var(--ink-soft);}

/* ----------------------------- Gallery ---------------------------- */
.gallery{background:radial-gradient(120% 60% at 50% 0%, #123036, var(--deep) 70%); color:var(--deep-fg); overflow:hidden; padding-block:var(--section-y);}
.gallery .section-head{color:var(--deep-fg);}
.gallery .section-head h2{color:#fff;}
.gallery .section-head p{color:rgba(238,231,215,.75);}
.marquee{margin-top:3rem; display:flex; flex-direction:column; gap:1.15rem; direction:ltr;}
.marquee-row{overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);}
.marquee-track{display:flex; gap:1.15rem; width:max-content; animation:scroll 50s linear infinite;}
.marquee-track.rev{animation-direction:reverse; animation-duration:60s;}
.marquee-row:hover .marquee-track{animation-play-state:paused;}
.marquee-track button{border:0; padding:0; background:none; cursor:pointer; flex-shrink:0; border-radius:var(--radius); overflow:hidden; box-shadow:0 20px 40px -24px rgba(0,0,0,.6);}
.marquee-track img{height:224px; width:328px; object-fit:cover; transition:transform .7s var(--ease-out), filter .7s var(--ease-out); filter:saturate(.88) brightness(.96);}
.marquee-track button:hover img{transform:scale(1.05); filter:saturate(1.05) brightness(1);}
@keyframes scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.gallery-cta{margin-top:2.5rem;}

/* Lightbox */
.lightbox{
  position:fixed; inset:0; z-index:200; display:none;
  background:rgba(9,20,23,.94); padding:clamp(1rem,4vw,3rem);
  place-items:center;
}
.lightbox.open{display:grid;}
.lightbox figure{max-width:min(1100px,100%); max-height:100%; display:flex; flex-direction:column; gap:.75rem;}
.lightbox img{width:100%; max-height:80vh; object-fit:contain; border-radius:var(--radius);}
.lightbox figcaption{color:rgba(238,231,215,.8); font-size:.85rem; text-align:center;}
.lightbox .lb-close{position:absolute; top:1rem; inset-inline-end:1rem; width:46px; height:46px; border-radius:999px; border:1px solid rgba(238,231,215,.4); background:transparent; color:var(--deep-fg); cursor:pointer; display:grid; place-items:center;}
.lightbox .lb-nav{position:absolute; top:50%; transform:translateY(-50%); width:48px; height:48px; border-radius:999px; border:1px solid rgba(238,231,215,.4); background:rgba(9,20,23,.4); color:var(--deep-fg); cursor:pointer; display:grid; place-items:center;}
.lightbox .lb-prev{inset-inline-start:1rem;}
.lightbox .lb-next{inset-inline-end:1rem;}

/* ------------------------------ Rooms ---------------------------- */
.rooms{background:linear-gradient(180deg,var(--sand-100),var(--sand-50));}
.rooms-head{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1rem;}
.room-grid{margin-top:3.25rem; display:grid; gap:2rem;}
@media(min-width:768px){.room-grid{grid-template-columns:repeat(3,1fr);}}
.room-card{
  display:flex; flex-direction:column; background:var(--card); border:1px solid var(--hairline); border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:var(--shadow-sm); transition:transform .55s var(--ease-out), box-shadow .55s var(--ease-out);
}
.room-card:hover{transform:translateY(-8px); box-shadow:var(--shadow-lg);}
.room-card .media{height:238px; overflow:hidden;}
.room-card .media img{width:100%; height:100%; object-fit:cover; transition:transform 1.1s var(--ease-out); filter:saturate(.95);}
.room-card:hover .media img{transform:scale(1.06); filter:saturate(1.02);}
.room-card .body{padding:1.65rem 1.65rem 0; display:flex; flex-direction:column; gap:.8rem; flex:1;}
.room-card .detail{font-size:.64rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-600);}
.room-card h3{line-height:1.25; letter-spacing:-.02em;}
.room-card .features{display:flex; flex-wrap:wrap; gap:.45rem; margin-top:.2rem;}
.room-card .price{margin-top:auto; padding:1.1rem 0 .2rem; border-top:1px solid var(--hairline); display:flex; align-items:baseline; justify-content:space-between; gap:.5rem;}
.room-card .price b{font-family:var(--font-display); font-size:1.55rem; color:var(--ink); font-weight:600; font-variant-numeric:tabular-nums; letter-spacing:-.01em;}
.room-card .price small{font-size:.72rem; color:var(--ink-faint); font-weight:500;}
.room-card .btn{margin:1.4rem 1.65rem 1.65rem;}

/* --------------------------- Experiences ------------------------ */
.exp-head{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1rem;}
.exp-grid{margin-top:3.25rem; display:grid; gap:1.75rem;}
@media(min-width:768px){.exp-grid{grid-template-columns:repeat(2,1fr);}}
.exp-card{
  position:relative; isolation:isolate; min-height:360px; display:flex; align-items:flex-end;
  border-radius:var(--radius-lg); overflow:hidden; color:var(--deep-fg);
  transition:transform .55s var(--ease-out), box-shadow .55s var(--ease-out);
}
.exp-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-lg);}
.exp-card img{position:absolute; inset:0; z-index:-2; width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease-out);}
.exp-card:hover img{transform:scale(1.07);}
.exp-card::after{content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(8,24,27,0) 30%, rgba(8,24,27,.55) 65%, rgba(8,24,27,.92));}
.exp-card .body{padding:2rem;}
.exp-card .eyebrow{color:var(--gold-100);}
.exp-card h3{color:#fff; margin-top:.65rem; font-size:clamp(1.35rem,2.4vw,1.65rem);}
.exp-card p{margin-top:.7rem; font-size:.92rem; line-height:1.65; color:rgba(236,228,210,.85); max-width:44ch;}
.exp-card .more{margin-top:.85rem; display:inline-flex; align-items:center; gap:.4rem; color:var(--gold-100); font-size:.82rem; font-weight:600; letter-spacing:.02em; text-decoration:underline; text-underline-offset:2px;}
.exp-card .more:hover{color:#fff;}

/* ----------------------------- Location ------------------------ */
.loc-grid{display:grid; gap:clamp(2rem,5vw,3.5rem);}
@media(min-width:960px){.loc-grid{grid-template-columns:1fr 1.15fr; align-items:center;}}
.loc-copy h2{margin-top:.75rem;}
.loc-copy p{margin-top:1rem; color:var(--ink-soft);}
.loc-address{margin-top:1.15rem !important; font-size:.95rem; font-weight:600; color:var(--teal-800); line-height:1.5;}
.distances{margin-top:2rem; display:grid; gap:0;}
.distances li{display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.85rem 0; border-bottom:1px solid var(--hairline); font-size:.93rem;}
.distances li:first-child{border-top:1px solid var(--hairline);}
.distances li span:last-child{color:var(--gold-600); font-weight:600; white-space:nowrap; font-size:.82rem; letter-spacing:.02em;}
.loc-map{border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg); border:1px solid var(--hairline);}
.loc-map iframe{width:100%; height:clamp(320px,44vw,480px); border:0; display:block; filter:saturate(.88) contrast(.98);}
.loc-copy .btn{margin-top:2rem;}
.btn-row{display:flex; flex-wrap:wrap; gap:.75rem;}

/* ----------------------------- Reviews ------------------------- */
.reviews{background:radial-gradient(120% 60% at 50% 0%, #123036, var(--deep) 68%); color:var(--deep-fg); padding-block:var(--section-y);}
.reviews .section-head h2{color:#fff;}
.reviews .section-head .eyebrow{color:var(--gold-100);}
.rating-badge{
  display:inline-flex; align-items:center; gap:.85rem; margin-top:1.75rem;
  padding:.55rem 1rem .55rem .55rem; border:1px solid rgba(236,228,210,.18); border-radius:999px;
  background:rgba(236,228,210,.04);
}
.rating-badge b{display:grid; place-items:center; width:46px; height:46px; border-radius:999px; background:linear-gradient(135deg,#D3AB69,#B98C46); color:#20303a; font-family:var(--font-display); font-size:1.1rem; font-weight:600;}
.rating-badge span{font-size:.82rem; color:rgba(236,228,210,.75);}
.rating-badge span i{display:block; color:#fff; font-style:normal; font-weight:600; font-size:.92rem;}
.review-grid{margin-top:3rem; display:grid; gap:1.75rem;}
@media(min-width:768px){.review-grid{grid-template-columns:repeat(2,1fr);}}
.review-card{position:relative; border:1px solid rgba(236,228,210,.14); border-radius:var(--radius-lg); padding:2rem; background:rgba(236,228,210,.02); transition:border-color .45s, background-color .45s, transform .45s var(--ease-out);}
.review-card:hover{border-color:rgba(199,154,87,.5); background:rgba(236,228,210,.045); transform:translateY(-4px);}
.review-card .stars{display:flex; gap:.2rem; color:var(--accent); margin-bottom:1rem;}
.review-card .stars svg{width:15px; height:15px;}
.review-card blockquote{font-family:var(--font-display); font-size:1.2rem; line-height:1.62; color:#fff; letter-spacing:-.01em;}
html[lang="ar"] .review-card blockquote,html[lang="zh"] .review-card blockquote{font-size:1.05rem; line-height:1.75;}
.review-card figcaption{margin-top:1.25rem; padding-top:1rem; border-top:1px solid rgba(236,228,210,.1); font-size:.84rem; color:rgba(236,228,210,.62);}

/* ---------------------------- Booking form --------------------- */
.booking-grid{display:grid; gap:clamp(2rem,5vw,3.5rem);}
@media(min-width:960px){.booking-grid{grid-template-columns:.85fr 1.15fr;}}
.booking-aside h2{margin-top:.75rem;}
.booking-aside p{margin-top:1rem; color:var(--ink-soft);}
.booking-aside .contact-quick{margin-top:2rem; display:grid; gap:.75rem;}
.booking-aside .contact-quick a{display:flex; align-items:center; gap:.75rem; font-size:.92rem; padding:.9rem 1.1rem; border:1px solid var(--hairline); border-radius:12px; background:var(--card); transition:border-color .3s, transform .3s var(--ease-out);}
.booking-aside .contact-quick a:hover{border-color:var(--gold-500); transform:translateX(3px);}
html[dir="rtl"] .booking-aside .contact-quick a:hover{transform:translateX(-3px);}
.booking-aside .contact-quick svg{width:18px; height:18px; color:var(--primary); flex-shrink:0;}
.form-card{background:var(--card); border:1px solid var(--hairline); border-radius:var(--radius-lg); padding:clamp(1.6rem,4vw,2.75rem); box-shadow:var(--shadow-md);}
.form-row{display:grid; gap:1.1rem;}
@media(min-width:560px){.form-row.two{grid-template-columns:1fr 1fr;}}
.form-field{display:flex; flex-direction:column; gap:.45rem; margin-top:1.1rem;}
.form-field:first-child{margin-top:0;}
.form-row .form-field{margin-top:0;}
.form-field label{font-size:.64rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint);}
.form-field label .req{color:var(--gold-600);}
.form-field input,.form-field select,.form-field textarea{
  border:1px solid var(--border); border-radius:12px; background:var(--sand-50);
  padding:.8rem .9rem; font-size:.95rem; transition:border-color .25s, background-color .25s, box-shadow .25s;
}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{outline:none; border-color:var(--primary); background:var(--paper); box-shadow:0 0 0 4px rgba(26,72,79,.1);}
.form-field textarea{resize:vertical; min-height:120px;}
.form-field.invalid input,.form-field.invalid textarea{border-color:#c0553f; box-shadow:0 0 0 4px rgba(192,85,63,.1);}
.hp{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;}
.form-card .btn{margin-top:1.5rem;}
.form-note{margin-top:1rem; font-size:.82rem; color:var(--ink-soft); min-height:1.2em;}
.form-note.ok{color:var(--teal-600);}
.form-note.err{color:#c0553f;}
.form-status{margin-top:1.25rem; padding:1rem 1.1rem; border-radius:12px; background:var(--sand-100); border:1px solid var(--border); font-size:.9rem; display:none;}
.form-status.show{display:block;}
.form-status.ok{background:#e8f1ec; border-color:#bcdccb;}
.form-status .btn{margin-top:.9rem;}

/* --------------------------- Good to know --------------------- */
.gtk{background:linear-gradient(180deg,var(--sand-50),var(--sand-100)); border-block:1px solid var(--hairline);}
.gtk-grid{display:grid; gap:1.25rem; grid-template-columns:1fr;}
@media(min-width:600px){.gtk-grid{grid-template-columns:repeat(2,1fr);}}
@media(min-width:960px){.gtk-grid{grid-template-columns:repeat(3,1fr);}}
.gtk-item{display:flex; gap:.9rem; padding:1.25rem; background:var(--card); border:1px solid var(--hairline); border-radius:var(--radius); box-shadow:var(--shadow-sm);}
.gtk-item svg{width:20px; height:20px; color:var(--primary); flex-shrink:0; margin-top:2px;}
.gtk-item b{display:block; font-family:var(--font-sans); font-size:.66rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint);}
.gtk-item p{margin-top:.3rem; font-size:.92rem; color:var(--ink);}

/* ------------------------------- CTA ------------------------- */
.cta{text-align:center; position:relative;}
.cta .wrap{max-width:720px;}
.cta h2{font-size:clamp(2.2rem,4.6vw,3.3rem);}
.cta p{margin:1.15rem auto 0; max-width:48ch; color:var(--ink-soft); font-size:1.06rem;}
.cta-buttons{margin-top:2.25rem; display:flex; flex-wrap:wrap; justify-content:center; gap:.75rem;}

/* ------------------------------ Footer --------------------- */
.site-footer{background:linear-gradient(180deg,#103036,var(--deep)); color:var(--deep-fg);}
.footer-grid{max-width:1280px; margin-inline:auto; padding:clamp(3.5rem,7vw,5rem) var(--gutter); display:grid; gap:2.5rem;}
@media(min-width:640px){.footer-grid{grid-template-columns:repeat(2,1fr);}}
@media(min-width:1024px){.footer-grid{grid-template-columns:1.2fr .9fr 1fr .9fr 1.1fr;}}
.footer-grid h4{font-family:var(--font-sans); font-size:.68rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:rgba(238,231,215,.55);}
.f-brand b{font-family:var(--font-display); font-size:1.4rem; font-weight:600;}
.f-brand .tag{margin-top:.25rem; font-size:.58rem; font-weight:700; letter-spacing:.3em; text-transform:uppercase; color:var(--gold-500);}
.f-brand p.desc{margin-top:1.1rem; font-size:.88rem; color:rgba(238,231,215,.7); max-width:34ch;}
.socials{margin-top:1.25rem; display:flex; flex-wrap:wrap; gap:.5rem;}
.socials a{border:1px solid rgba(238,231,215,.22); padding:.45rem .9rem; border-radius:999px; font-size:.75rem; transition:border-color .2s,color .2s;}
.socials a:hover{border-color:var(--gold-500); color:var(--gold-500);}
.f-links{margin-top:1.1rem; display:grid; gap:.6rem; font-size:.9rem; color:rgba(238,231,215,.8);}
.f-links a:hover{color:var(--gold-500);}
.f-contact{margin-top:1.1rem; display:grid; gap:.9rem; font-size:.9rem; color:rgba(238,231,215,.8);}
.f-contact li{display:flex; gap:.6rem; align-items:flex-start;}
.f-contact svg{width:16px; height:16px; margin-top:3px; color:var(--gold-500); flex-shrink:0;}
.f-contact a:hover{color:var(--gold-500);}
html[dir="rtl"] .f-contact li{flex-direction:row-reverse; text-align:right;}
.newsletter form{margin-top:1.1rem; display:flex; gap:.5rem;}
html[dir="rtl"] .newsletter form{flex-direction:row-reverse;}
.newsletter input{min-width:0; flex:1; border:1px solid rgba(238,231,215,.25); border-radius:999px; background:transparent; padding:.7rem 1rem; font-size:.85rem; color:var(--deep-fg);}
.newsletter input::placeholder{color:rgba(238,231,215,.45);}
.newsletter input:focus{outline:none; border-color:var(--gold-500);}
.newsletter button{width:46px; height:46px; flex-shrink:0; display:grid; place-items:center; border:0; border-radius:999px; background:var(--accent); color:#20303a; cursor:pointer; transition:transform .2s;}
.newsletter button:hover{transform:translateY(-2px);}
.newsletter .note{margin-top:.6rem; font-size:.78rem; color:var(--gold-500); min-height:1em;}
.footer-bottom{border-top:1px solid rgba(238,231,215,.1);}
@media(max-width:1023px){.footer-bottom{padding-bottom:4.75rem;}}  /* clear the fixed mobile book-bar */
.footer-bottom-inner{max-width:1280px; margin-inline:auto; padding:1.4rem var(--gutter); display:flex; flex-direction:column; gap:.75rem; align-items:center; justify-content:space-between; font-size:.78rem; color:rgba(238,231,215,.55);}
@media(min-width:600px){.footer-bottom-inner{flex-direction:row;}}
.footer-bottom-inner .links{display:flex; gap:1.5rem;}
.footer-bottom-inner a:hover{color:var(--gold-500);}
.footer-bottom-inner.photo-credits{padding-top:0; justify-content:center; border-top:1px solid rgba(238,231,215,.08);}
.photo-credit{font-size:.68rem; color:rgba(238,231,215,.4); text-align:center;}
.photo-credit a{color:rgba(238,231,215,.55); text-decoration:underline;}
.photo-credit a:hover{color:var(--gold-500);}

/* --------------------------- Back to top ------------------- */
.to-top{
  position:fixed; inset-inline-end:1.25rem; bottom:1.25rem; z-index:90;
  width:48px; height:48px; border-radius:999px; border:1px solid var(--hairline);
  background:rgba(252,250,244,.86); backdrop-filter:blur(10px); color:var(--ink); box-shadow:var(--shadow-md); cursor:pointer;
  display:grid; place-items:center; opacity:0; transform:translateY(12px) scale(.9); pointer-events:none;
  transition:opacity .35s var(--ease-out), transform .35s var(--ease-out);
}
.to-top:hover{border-color:var(--gold-500); color:var(--primary);}
.to-top.show{opacity:1; transform:translateY(0) scale(1); pointer-events:auto;}

/* mobile sticky book bar */
.book-bar{
  position:fixed; inset-inline:0; bottom:0; z-index:95;
  background:rgba(252,250,244,.9); backdrop-filter:blur(16px) saturate(1.3); border-top:1px solid var(--hairline);
  box-shadow:0 -10px 30px -18px rgba(12,36,40,.4);
  padding:.75rem var(--gutter); display:flex; gap:.6rem; align-items:center; justify-content:space-between;
  transform:translateY(105%); transition:transform .4s var(--ease-out);
}
.book-bar.show{transform:translateY(0);}
.book-bar b{font-family:var(--font-display); color:var(--ink); font-size:1.08rem; font-weight:600;}
.book-bar small{display:block; font-size:.74rem; color:var(--ink-soft); letter-spacing:.01em; margin-top:1px;}
.book-bar .btn{flex-shrink:0;}
@media(min-width:1024px){.book-bar{display:none;}}

/* ---------------------------- Reveal ---------------------- */
.reveal{opacity:0; transform:translateY(24px); filter:blur(4px); transition:opacity .85s var(--ease-out), transform .85s var(--ease-out), filter .85s var(--ease-out);}
.reveal.in{opacity:1; transform:none; filter:blur(0);}

/* --------------------------- Legal pages ----------------- */
.legal{padding-top:calc(var(--header-h) + var(--section-y));}
.legal .wrap{max-width:760px;}
.legal h1{font-size:clamp(2rem,5vw,3rem);}
.legal .updated{margin-top:.75rem; color:var(--ink-faint); font-size:.85rem;}
.legal h2{font-size:clamp(1.3rem,3vw,1.7rem); margin-top:2.5rem;}
.legal p{margin-top:1rem; color:var(--ink-soft);}
.legal a{color:var(--primary); text-decoration:underline;}
.legal .back{margin-top:3rem;}

/* --------------------------- Guide pages ------------------ */
/* Travel-guide / accommodation / facilities pages: reuses the same
   design tokens and card components as the homepage (.exp-card,
   .hosp-card, .gtk-item, .cta) so no new visual language is introduced. */
.guide-hero{position:relative; min-height:44vh; display:flex; align-items:flex-end; padding-top:var(--header-h); isolation:isolate; overflow:hidden;}
.guide-hero img{position:absolute; inset:0; z-index:-2; width:100%; height:100%; object-fit:cover;}
.guide-hero::after{content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(8,24,27,.28) 0%, rgba(8,24,27,.82) 100%);}
.guide-hero .wrap{padding-block:2.5rem; color:#fff;}
.guide-hero .eyebrow{color:var(--gold-100);}
.guide-hero h1{color:#fff; max-width:24ch; text-shadow:0 2px 24px rgba(8,24,27,.4);}
.guide-hero .lede{margin-top:1rem; max-width:62ch; color:rgba(236,228,210,.92); font-size:1.05rem;}

.breadcrumb{list-style:none; display:flex; flex-wrap:wrap; gap:.35rem; padding:0; margin:0 0 1.1rem; font-size:.78rem; color:rgba(236,228,210,.65);}
.breadcrumb li{display:flex; align-items:center; gap:.35rem;}
.breadcrumb li:not(:last-child)::after{content:"/"; opacity:.5;}
.breadcrumb a{color:rgba(236,228,210,.85); text-decoration:underline;}
.breadcrumb a:hover{color:var(--gold-500);}
html[dir="rtl"] .breadcrumb li:not(:last-child)::after{content:"\\";}

.guide-body{max-width:760px; margin-inline:auto;}
.guide-body .lead{font-size:1.12rem; color:var(--ink-soft);}
.guide-body h2{margin-top:2.75rem; font-size:clamp(1.45rem,3vw,2rem); letter-spacing:-.02em;}
.guide-body h3{margin-top:1.75rem; font-size:1.15rem;}
.guide-body p{margin-top:1rem; color:var(--ink-soft);}
.guide-body ul{margin-top:1rem; padding-inline-start:1.3rem; color:var(--ink-soft); display:grid; gap:.55rem;}
.guide-body figure{margin-top:2rem;}
.guide-body figure img{width:100%; border-radius:var(--radius-lg); box-shadow:var(--shadow-md); aspect-ratio:4/3; object-fit:cover;}
.guide-body figcaption{margin-top:.6rem; font-size:.82rem; color:var(--ink-faint);}
.guide-cta-inline{margin-top:2.5rem; padding:1.5rem; background:var(--sand-100); border:1px solid var(--hairline); border-radius:var(--radius-lg); text-align:center;}
.guide-cta-inline p{margin-top:0; font-weight:600; color:var(--ink);}
.guide-cta-inline .btn{margin-top:1rem;}
.guide-index-card{display:block; text-decoration:none; border-radius:var(--radius-lg); overflow:hidden; background:#fff; box-shadow:var(--shadow-sm); transition:transform .25s ease, box-shadow .25s ease;}
.guide-index-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-md);}
.guide-index-card img{display:block; width:100%; aspect-ratio:4/3; object-fit:cover;}
.guide-index-card div{padding:1.25rem 1.4rem 1.5rem;}
.guide-index-card h3{font-size:1.1rem; color:var(--ink); margin:0;}
.guide-index-card p{margin-top:.5rem; font-size:.92rem; color:var(--ink-soft);}

/* ---------------------- Editorial accents --------------- */
html[lang="en"] .hero h1 .row:nth-child(2) span,
html[lang="ru"] .hero h1 .row:nth-child(2) span{font-style:italic; font-weight:400;}

.cta p,
.booking-aside .lead{
  font-family:var(--font-display); font-style:italic; font-weight:400;
  font-size:1.22rem; line-height:1.6; letter-spacing:0; color:var(--ink-soft);
}
html[lang="ar"] .cta p, html[lang="zh"] .cta p,
html[lang="ar"] .booking-aside .lead, html[lang="zh"] .booking-aside .lead{
  font-family:var(--font-sans); font-style:normal; font-size:1.04rem;
}

/* first-letter flourish on the story's opening paragraph */
html[lang="en"] .about-copy .divider + p::first-letter,
html[lang="ru"] .about-copy .divider + p::first-letter{
  font-family:var(--font-display); font-size:3em; line-height:.8; float:left;
  margin-right:.09em; margin-top:.04em; color:var(--primary); font-weight:500;
}
html[dir="rtl"] .about-copy .divider + p::first-letter{float:right; margin-right:0; margin-left:.09em;}

/* ================= v2 — repositioned sections ================= */

/* ---- Thoughtful hospitality (6 cards) ---- */
.hosp-grid{margin-top:3rem; display:grid; gap:1.15rem;}
@media(min-width:640px){.hosp-grid{grid-template-columns:repeat(2,1fr);}}
@media(min-width:980px){.hosp-grid{grid-template-columns:repeat(3,1fr);}}
.hosp-card{
  background:var(--card); border:1px solid var(--border); border-radius:var(--radius); padding:1.75rem;
  box-shadow:var(--shadow-sm); transition:transform .5s var(--ease-out), box-shadow .5s var(--ease-out);
}
.hosp-card:hover{transform:translateY(-5px); box-shadow:var(--shadow-md);}
.hosp-card .ic{display:grid; place-items:center; width:46px; height:46px; border-radius:13px; background:var(--sand-100); color:var(--primary); margin-bottom:1.1rem;}
.hosp-card .ic svg{width:22px; height:22px;}
.hosp-card h3{font-size:1.14rem; letter-spacing:-.01em;}
.hosp-card p{margin-top:.55rem; font-size:.92rem; color:var(--ink-soft);}


/* ---- Whole-villa card ---- */
.room-card-wide{grid-column:1 / -1;}
@media(min-width:768px){
  .room-card-wide{flex-direction:row; align-items:stretch;}
  .room-card-wide .media{height:auto; width:42%; flex-shrink:0;}
  .room-card-wide .body{justify-content:center; padding:2rem 2.25rem 0;}
  .room-card-wide .btn{align-self:flex-start; margin:1.5rem 2.25rem 2rem;}
}
.room-card .room-lead{font-size:.95rem; color:var(--ink-soft); line-height:1.6;}

/* ---- Dining ---- */
.dining{background:linear-gradient(180deg,var(--sand-50),var(--sand-100));}
.dining-grid{display:grid; gap:clamp(2rem,5vw,3.5rem); align-items:center;}
@media(min-width:900px){.dining-grid{grid-template-columns:1fr 1fr;}}
.dining-media img{width:100%; border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); aspect-ratio:4/5; object-fit:cover;}
.dining-copy h2{margin-top:.75rem;}
.dining-copy p{margin-top:1rem; color:var(--ink-soft);}
.dining-points{list-style:none; margin:1.5rem 0 0; padding:0; display:grid; gap:.7rem;}
.dining-points li{display:flex; align-items:flex-start; gap:.7rem; font-size:.95rem;}
.dining-points svg{width:18px; height:18px; color:var(--primary); flex-shrink:0; margin-top:3px;}
.dining-copy .btn{margin-top:1.75rem;}

/* ---- Feature split (family / privacy) ---- */
.fs-grid{display:grid; gap:clamp(2rem,5vw,3.5rem); align-items:center;}
@media(min-width:900px){
  .fs-grid{grid-template-columns:1fr 1fr;}
  .feature-split.reversed .fs-media{order:2;}
}
.fs-media img{width:100%; border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); aspect-ratio:4/5; object-fit:cover;}
.fs-copy h2{margin-top:.75rem;}
.fs-copy h2 em{font-style:italic; font-weight:400; color:var(--primary);}
html[lang="ar"] .fs-copy h2 em, html[lang="zh"] .fs-copy h2 em{font-style:normal;}
.fs-copy p{margin-top:1rem; color:var(--ink-soft);}
.fs-copy .btn{margin-top:1.75rem;}

/* ---- Reviews (theme cards + links) ---- */
.review-card .rc-title{font-family:var(--font-display); font-weight:600; font-size:1.2rem; color:#fff; letter-spacing:-.01em;}
.review-card p{margin-top:.7rem; font-size:.98rem; line-height:1.65; color:rgba(236,228,210,.86);}
.reviews-links{margin-top:2rem; display:flex; flex-wrap:wrap; gap:.6rem; align-items:center;}
.reviews-links a{border:1px solid rgba(236,228,210,.28); border-radius:999px; padding:.5rem 1.1rem; font-size:.8rem; font-weight:600; color:var(--deep-fg); transition:border-color .3s, color .3s;}
.reviews-links a:hover{border-color:var(--gold-500); color:var(--gold-500);}

.loc-note{margin-top:1rem; font-size:.85rem; color:var(--ink-faint); font-style:italic;}
html[lang="ar"] .loc-note{font-style:normal;}

/* ---- Your stay, your way ---- */
.stay{background:radial-gradient(120% 60% at 50% 0%, #123036, var(--deep) 70%); color:var(--deep-fg); text-align:center;}
.stay-inner{max-width:760px; margin-inline:auto;}
.stay .eyebrow{justify-content:center; color:var(--gold-100);}
.stay h2{color:#fff; margin-top:.9rem;}
.stay-desc{margin:1.1rem auto 0; max-width:48ch; color:rgba(236,228,210,.8);}
.stay-opts{list-style:none; margin:2rem auto 0; padding:0; display:flex; flex-wrap:wrap; justify-content:center; gap:.6rem; max-width:640px;}
.stay-opts li{border:1px solid rgba(236,228,210,.22); border-radius:999px; padding:.5rem 1rem; font-size:.85rem; color:rgba(236,228,210,.9);}
.stay .btn{margin-top:2.25rem;}

/* ---- FAQ accordion ---- */
.faq-wrap{max-width:760px; margin-inline:auto;}
.faq-list{margin-top:2.5rem; border-top:1px solid var(--border);}
.faq-item{border-bottom:1px solid var(--border);}
.faq-item summary{
  list-style:none; cursor:pointer; padding:1.15rem 2.5rem 1.15rem 0; position:relative;
  font-family:var(--font-display); font-size:1.1rem; font-weight:500; color:var(--ink); letter-spacing:-.01em;
}
html[dir="rtl"] .faq-item summary{padding:1.15rem 0 1.15rem 2.5rem;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{
  content:""; position:absolute; inset-inline-end:.2rem; top:1.5rem; width:12px; height:12px;
  border-right:2px solid var(--ink-faint); border-bottom:2px solid var(--ink-faint);
  transform:rotate(45deg); transition:transform .3s var(--ease-out);
}
.faq-item[open] summary::after{transform:rotate(225deg);}
.faq-item summary:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:4px;}
.faq-a{padding:0 2.5rem 1.3rem 0;}
html[dir="rtl"] .faq-a{padding:0 0 1.3rem 2.5rem;}
.faq-a p{color:var(--ink-soft); font-size:.98rem;}
@media(prefers-reduced-motion:no-preference){
  .faq-item[open] .faq-a{animation:faqIn .35s var(--ease-out);}
}
@keyframes faqIn{from{opacity:0; transform:translateY(-6px);}to{opacity:1; transform:none;}}

/* ---- Floating WhatsApp ---- */
.wa-float{
  position:fixed; inset-inline-end:1.25rem; bottom:1.25rem; z-index:96;
  width:54px; height:54px; border-radius:999px; display:grid; place-items:center;
  background:#25D366; color:#fff; box-shadow:0 6px 16px -4px rgba(37,211,102,.55), 0 2px 6px rgba(0,0,0,.2);
  transition:transform .3s var(--ease-out), box-shadow .3s var(--ease-out);
}
.wa-float svg{width:28px; height:28px;}
.wa-float:hover{transform:scale(1.06); box-shadow:0 10px 24px -4px rgba(37,211,102,.6), 0 3px 8px rgba(0,0,0,.22);}
.to-top{bottom:5.6rem;}                 /* sit above the WhatsApp button */
@media(min-width:1024px){
  .to-top{bottom:1.25rem; inset-inline-end:5.6rem;}
}
@media(max-width:1023px){
  .wa-float{bottom:5.2rem;}              /* clear the mobile sticky bar */
  .to-top{bottom:9.4rem;}
}

/* ------------------------ Reduced motion ---------------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important;}
  .hero h1 .row span{transform:none;}
  .hero-rule{transform:scaleX(1);}
  .hero-media img{transform:none;}
  .hero-copy,.hero-cta,.availbar,.eyebrow{opacity:1;}
  .reveal{opacity:1; transform:none; filter:none;}
  .marquee-track{animation:none; flex-wrap:wrap; justify-content:center;}
  .marquee-row{mask-image:none; -webkit-mask-image:none;}
}