/* ==========================================================
   Chourouk's Tours — styles
   Uses logical properties so Arabic (RTL) mirrors correctly.
   ========================================================== */
:root{
  --terra:#B7472A; --terra-d:#8E3320; --terra-l:#D9683F;
  --saffron:#E09F3E; --gold:#F2C46D;
  --cream:#FAF1E4; --cream-2:#FFFBF3; --sand:#F3E4CB; --line:#E6D3B3;
  --ink:#2A1810; --ink-soft:#5A4336;
  --night:#14122B; --night-2:#1E1A3D; --night-3:#2B1E3F;
  --wa:#1FA855; --wa-d:#168a45;
  --r-lg:30px; --r-md:20px; --r-sm:14px;
  --f-display:"Cormorant Garamond","Times New Roman",serif;
  --f-body:"Jost","Helvetica Neue",Arial,sans-serif;
  --shadow:0 18px 50px -20px rgba(80,32,16,.35);
  --pattern:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cg fill='none' stroke='%23B7472A' stroke-opacity='.10' stroke-width='1.2'%3E%3Cpath d='M36 6 46 26l20 10-20 10-10 20-10-20L6 36l20-10z'/%3E%3Ccircle cx='36' cy='36' r='5'/%3E%3C/g%3E%3C/svg%3E");
  --pattern-light:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-opacity='.10' stroke-width='1.2'%3E%3Cpath d='M36 6 46 26l20 10-20 10-10 20-10-20L6 36l20-10z'/%3E%3Ccircle cx='36' cy='36' r='5'/%3E%3C/g%3E%3C/svg%3E");
}
html[lang="ar"]{ --f-display:"Amiri","Times New Roman",serif; --f-body:"Cairo","Segoe UI",Tahoma,sans-serif; }
html[lang="zh"]{ --f-display:"Noto Serif SC","Songti SC",serif; --f-body:"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif; }

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:84px; -webkit-text-size-adjust:100%; }
body{
  margin:0; font-family:var(--f-body); font-size:17px; line-height:1.65; color:var(--ink);
  background:var(--cream); -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button,input,select,textarea{ font:inherit; color:inherit; }
button{ cursor:pointer; }
h1,h2,h3,h4{ font-family:var(--f-display); font-weight:700; line-height:1.08; margin:0; letter-spacing:-.01em; }
p{ margin:0; }
ul,ol{ margin:0; padding:0; list-style:none; }
[hidden]{ display:none !important; }
.container{ width:min(1200px,100% - 40px); margin-inline:auto; }
.ic{ width:1.25em; height:1.25em; flex:none; }
.ic-sm{ width:1em; height:1em; } .ic-lg{ width:34px; height:34px; }
:focus-visible{ outline:3px solid var(--saffron); outline-offset:3px; border-radius:6px; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  min-height:50px; padding:0 26px; border-radius:999px; border:0; font-weight:600; font-size:1rem;
  letter-spacing:.01em; transition:transform .25s, box-shadow .25s, background .25s, color .25s; white-space:nowrap;
}
.btn:hover{ transform:translateY(-2px); }
.btn-primary{ background:linear-gradient(135deg,var(--gold),var(--saffron)); color:#3A1D0E; box-shadow:0 10px 28px -10px rgba(224,159,62,.9); }
.btn-primary:hover{ box-shadow:0 16px 34px -10px rgba(224,159,62,1); }
.btn-wa{ background:var(--wa); color:#fff; box-shadow:0 10px 26px -10px rgba(31,168,85,.9); }
.btn-wa:hover{ background:var(--wa-d); }
.btn-ghost{ background:rgba(255,255,255,.12); color:#fff; border:1.5px solid rgba(255,255,255,.55); backdrop-filter:blur(6px); }
.btn-ghost:hover{ background:rgba(255,255,255,.22); }
.btn-line{ background:transparent; color:var(--terra-d); border:1.5px solid rgba(183,71,42,.45); }
.btn-line:hover{ background:rgba(183,71,42,.08); }
.btn-sm{ min-height:42px; padding:0 20px; font-size:.95rem; }
.btn-lg{ min-height:58px; font-size:1.08rem; }
[dir="rtl"] .ic-arrow{ transform:scaleX(-1); }

/* ---------- Header ---------- */
.site-header{
  position:fixed; inset:0 0 auto 0; z-index:50; color:#fff;
  transition:background .35s, box-shadow .35s, color .35s, padding .35s;
}
.header-inner{ display:flex; align-items:center; gap:24px; min-height:78px; }
.brand{ display:flex; align-items:center; gap:12px; }
.brand-logo{ width:52px; height:52px; border-radius:50%; box-shadow:0 4px 18px rgba(0,0,0,.3); background:#fff; }
.brand-name{ font-family:var(--f-display); font-weight:700; font-size:1.55rem; line-height:1; white-space:nowrap; }
.brand-name em{ font-style:italic; color:var(--gold); font-weight:500; }
html[lang="ar"] .brand-name em, html[lang="zh"] .brand-name em{ font-style:normal; }
.main-nav{ display:flex; gap:30px; margin-inline-start:auto; font-weight:500; }
.main-nav a{ position:relative; padding:6px 0; opacity:.92; }
.main-nav a::after{ content:""; position:absolute; inset:auto 0 0 0; height:2px; background:var(--saffron); transform:scaleX(0); transform-origin:center; transition:transform .3s; }
.main-nav a:hover::after{ transform:scaleX(1); }
.header-actions{ display:flex; align-items:center; gap:12px; }
.site-header.scrolled{ background:rgba(250,241,228,.94); backdrop-filter:blur(14px); color:var(--ink); box-shadow:0 6px 30px -16px rgba(60,24,10,.45); }
.site-header.scrolled .brand-name em{ color:var(--terra); }
.site-header.scrolled .brand-logo{ box-shadow:0 2px 10px rgba(0,0,0,.18); }

.lang{ position:relative; }
.lang-btn{
  display:flex; align-items:center; gap:8px; height:42px; padding:0 14px; border-radius:999px;
  background:rgba(255,255,255,.14); border:1.5px solid rgba(255,255,255,.4); color:inherit; font-weight:500; font-size:.95rem;
  backdrop-filter:blur(6px);
}
.site-header.scrolled .lang-btn{ background:#fff; border-color:var(--line); }
.lang-menu{
  position:absolute; inset-block-start:calc(100% + 10px); inset-inline-end:0; min-width:190px; padding:8px; z-index:5;
  background:var(--cream-2); color:var(--ink); border-radius:18px; box-shadow:0 24px 60px -18px rgba(30,12,4,.55); border:1px solid var(--line);
}
.lang-menu li button{
  display:flex; width:100%; align-items:center; justify-content:space-between; padding:10px 14px; background:none; border:0; border-radius:12px;
  text-align:start; font-size:1rem;
}
.lang-menu li button:hover{ background:var(--sand); }
.lang-menu li button[aria-selected="true"]{ background:var(--terra); color:#fff; }
.lang-menu .code{ font-size:.75rem; opacity:.65; letter-spacing:.08em; text-transform:uppercase; }

.burger{ display:none; width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.14); border:1.5px solid rgba(255,255,255,.4); padding:0; flex-direction:column; align-items:center; justify-content:center; gap:4px; }
.burger span{ display:block; width:18px; height:2px; background:currentColor; border-radius:2px; transition:transform .3s, opacity .3s; }
.site-header.scrolled .burger{ background:#fff; border-color:var(--line); }
.site-header.open .burger span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.site-header.open .burger span:nth-child(2){ opacity:0; }
.site-header.open .burger span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

@media (max-width: 920px){
  .burger{ display:flex; }
  .header-cta{ display:none; }
  .main-nav{
    position:fixed; inset:78px 16px auto 16px; flex-direction:column; gap:0; padding:10px; margin:0;
    background:var(--cream-2); color:var(--ink); border-radius:24px; box-shadow:0 30px 70px -20px rgba(30,12,4,.6);
    opacity:0; visibility:hidden; transform:translateY(-10px); transition:.3s;
  }
  .site-header.open .main-nav{ opacity:1; visibility:visible; transform:none; }
  .main-nav a{ padding:14px 16px; border-radius:14px; font-size:1.1rem; }
  .main-nav a:hover{ background:var(--sand); }
  .main-nav a::after{ display:none; }
  .header-actions{ margin-inline-start:auto; }
  .site-header.open{ background:rgba(250,241,228,.97); color:var(--ink); }
}
@media (max-width: 460px){
  .brand-name{ font-size:1.25rem; } .brand-logo{ width:44px; height:44px; }
  .lang-btn #langCurrent{ display:none; } .lang-btn{ padding:0 12px; }
}

/* ---------- Typography helpers ---------- */
.kicker{
  display:inline-flex; align-items:center; gap:10px; font-size:.82rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--terra);
}
.kicker.light{ color:var(--gold); }
.kicker .ic{ color:var(--saffron); }
html[lang="ar"] .kicker, html[lang="zh"] .kicker{ letter-spacing:.04em; text-transform:none; font-size:.95rem; }
.lead{ font-size:1.12rem; color:var(--ink-soft); max-width:60ch; }
.section{ padding:clamp(78px,10vw,132px) 0; position:relative; }
.section-head{ display:grid; gap:14px; margin-bottom:clamp(36px,5vw,64px); max-width:760px; }
.section-head h2{ font-size:clamp(2.3rem,5vw,3.9rem); }
.section-head.light h2{ color:#fff; } .section-head.light .lead{ color:rgba(255,255,255,.85); }
html[lang="ar"] h1, html[lang="ar"] h2, html[lang="ar"] h3{ line-height:1.3; letter-spacing:0; }
html[lang="zh"] h1, html[lang="zh"] h2, html[lang="zh"] h3{ line-height:1.25; letter-spacing:0; }

/* ---------- Hero ---------- */
.hero{ position:relative; min-height:100svh; display:grid; color:#fff; overflow:hidden; isolation:isolate; background:var(--night); }
.hero-media{ position:absolute; inset:-6% 0 -6% 0; z-index:-3; }
.hero-media img{ width:100%; height:100%; object-fit:cover; object-position:50% 62%; animation:kenburns 26s ease-in-out infinite alternate; will-change:transform; }
@keyframes kenburns{ from{ transform:scale(1.04); } to{ transform:scale(1.16); } }
.hero-shade{ position:absolute; inset:0; z-index:-2; background:
  linear-gradient(180deg,rgba(20,18,43,.72) 0%,rgba(20,18,43,.18) 34%,rgba(20,18,43,.5) 70%,rgba(20,18,43,.88) 100%),
  radial-gradient(90% 60% at 20% 80%,rgba(142,51,32,.45),transparent 70%); }
.hero-inner{ align-self:end; padding-block:150px 150px; display:grid; gap:22px; justify-items:start; }
.hero-kicker{ color:var(--gold); text-shadow:0 2px 14px rgba(0,0,0,.65); background:rgba(20,18,43,.45); padding:7px 16px; border-radius:999px; backdrop-filter:blur(6px); }
.hero-title{ font-size:clamp(3rem,8.2vw,7rem); font-weight:700; line-height:.98; text-shadow:0 8px 40px rgba(0,0,0,.35); max-width:14ch; }
.hero-title span{ display:block; }
.hero-title em{ display:block; font-style:italic; font-weight:500; color:var(--gold); }
html[lang="ar"] .hero-title, html[lang="zh"] .hero-title{ line-height:1.2; }
html[lang="ar"] .hero-title em, html[lang="zh"] .hero-title em{ font-style:normal; }
.hero-sub{ font-size:clamp(1.05rem,1.8vw,1.3rem); max-width:52ch; color:rgba(255,255,255,.92); text-shadow:0 2px 20px rgba(0,0,0,.4); }
.hero-cta{ display:flex; flex-wrap:wrap; gap:14px; margin-top:6px; }

.quickbar{
  margin-top:26px; display:grid; grid-template-columns:2fr 1.2fr .6fr auto; gap:6px; align-items:stretch; padding:10px; width:min(860px,100%);
  background:rgba(250,241,228,.96); border-radius:26px; color:var(--ink); box-shadow:0 30px 70px -26px rgba(0,0,0,.7);
}
.q-field{ display:grid; gap:2px; padding:8px 16px; border-radius:18px; transition:background .2s; }
.q-field:hover,.q-field:focus-within{ background:#fff; }
.q-field > span{ font-size:.7rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--terra); }
html[lang="ar"] .q-field > span, html[lang="zh"] .q-field > span{ letter-spacing:0; text-transform:none; font-size:.82rem; }
.q-field select,.q-field input{ background:none; border:0; outline:0; width:100%; font-weight:500; font-size:1rem; padding:2px 0; min-width:0; text-overflow:ellipsis; }
.q-field select{ appearance:none; cursor:pointer; }
.q-go{ border-radius:18px; min-height:56px; }
@media (max-width: 820px){
  .quickbar{ grid-template-columns:1fr 1fr; }
  .quickbar .q-field:first-child{ grid-column:1/-1; }
  .q-go{ grid-column:1/-1; }
}
.dunes{ position:absolute; inset:auto 0 -1px 0; width:100%; height:clamp(60px,9vw,120px); z-index:-1; }

.lanterns{ position:absolute; inset:74px 0 auto 0; height:260px; z-index:-1; pointer-events:none; }
.lantern{ position:absolute; top:0; transform-origin:50% 0; filter:drop-shadow(0 0 16px rgba(242,178,74,.75)); animation:sway 5.5s ease-in-out infinite alternate; }
.l1{ inset-inline-end:8%;  width:76px; height:180px; }
.l2{ inset-inline-end:16%; width:56px; height:132px; animation-duration:4.4s; animation-delay:-1.4s; }
.l3{ inset-inline-end:23%; width:40px; height:94px;  animation-duration:6.2s; animation-delay:-2.7s; }
@keyframes sway{ from{ transform:rotate(-3.5deg); } to{ transform:rotate(3.5deg); } }
@media (max-width: 700px){ .l3{ display:none; } .l1{ width:56px; height:132px; inset-inline-end:5%; } .l2{ width:42px; height:98px; inset-inline-end:17%; } }

/* ---------- Marquee ---------- */
.marquee{ background:var(--terra); color:var(--cream); overflow:hidden; direction:ltr; padding:16px 0; position:relative; z-index:1; margin-top:-1px; }
.marquee-track{ display:flex; width:max-content; animation:marquee 46s linear infinite; }
.marquee-set{ display:flex; }
.marquee-item{ display:flex; align-items:center; gap:26px; padding-inline-end:26px; font-family:var(--f-display); font-style:italic; font-size:1.55rem; white-space:nowrap; }
html[lang="ar"] .marquee-item, html[lang="zh"] .marquee-item{ font-style:normal; font-size:1.35rem; }
.marquee-item .ic{ color:var(--gold); }
@keyframes marquee{ to{ transform:translateX(-50%); } }

/* ---------- Tours ---------- */
.tours{ background:var(--cream) var(--pattern); }
.cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(310px,1fr)); gap:30px; }
.card{
  background:var(--cream-2); border-radius:var(--r-lg); padding:14px; border:1px solid rgba(183,71,42,.14); box-shadow:var(--shadow);
  display:flex; flex-direction:column; transition:transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .45s;
}
.card:hover{ transform:translateY(-8px); box-shadow:0 30px 70px -26px rgba(80,32,16,.5); }
.card-media{ position:relative; aspect-ratio:4/4.3; overflow:hidden; border-radius:50% 50% 20px 20px / 34% 34% 20px 20px; background:var(--sand); }
.card-media::after{ content:""; position:absolute; inset:10px; border:1.5px solid rgba(242,196,109,.85); border-radius:inherit; pointer-events:none; }
.card-media img{ width:100%; height:100%; object-fit:cover; transition:transform 1.1s cubic-bezier(.2,.8,.2,1); }
.card:hover .card-media img{ transform:scale(1.08); }
.badges{ position:absolute; inset:auto 0 22px 0; display:flex; flex-wrap:wrap; gap:8px; justify-content:center; padding-inline:20px; z-index:2; }
.badge{ background:rgba(20,18,43,.78); backdrop-filter:blur(6px); color:#fff; font-size:.78rem; font-weight:500; padding:6px 12px; border-radius:999px; display:inline-flex; align-items:center; gap:6px; }
.badge .ic{ color:var(--gold); }
.badge.green{ background:rgba(31,168,85,.92); } .badge.green .ic{ color:#fff; }
.card-body{ padding:22px 14px 12px; display:flex; flex-direction:column; gap:14px; flex:1; }
.chips{ display:flex; flex-wrap:wrap; gap:8px; }
.chip{ font-size:.82rem; font-weight:600; letter-spacing:.04em; color:var(--terra-d); background:rgba(224,159,62,.2); padding:5px 12px; border-radius:999px; }
.card h3{ font-size:1.62rem; }
.card .desc{ color:var(--ink-soft); font-size:.98rem; }
.hl-list{ display:grid; gap:7px; font-size:.95rem; }
.hl-list li{ display:flex; gap:10px; align-items:flex-start; }
.hl-list .ic{ color:var(--terra); margin-top:.28em; width:1em; height:1em; }
.card-foot{ margin-top:auto; padding-top:18px; border-top:1px dashed var(--line); display:grid; gap:16px; }
.price{ display:flex; align-items:baseline; flex-wrap:wrap; gap:6px 8px; }
.price small{ color:var(--ink-soft); font-size:.88rem; }
.price strong{ font-family:var(--f-display); font-size:2.5rem; color:var(--terra); line-height:1; }
.price .req{ font-family:var(--f-display); font-size:1.5rem; color:var(--terra); font-weight:700; }
.card-actions{ display:grid; grid-template-columns:1fr 1.25fr; gap:10px; }
.card-actions .btn{ padding:0 14px; font-size:.95rem; }

/* ---------- Camp / bento ---------- */
.camp{ background:var(--sand); }
.camp::before{ content:""; position:absolute; inset:0; background:var(--pattern); opacity:.7; pointer-events:none; }
.camp .container{ position:relative; }
.bento{
  display:grid; gap:16px; grid-template-columns:repeat(4,1fr); grid-auto-rows:clamp(150px,19vw,230px);
  grid-template-areas:
    "tent tent buffet fire"
    "tent tent buffet fire"
    "bath alley alley dinner"
    "night night night dinner";
}
.tile{
  position:relative; overflow:hidden; border:0; padding:0; border-radius:24px; background:var(--night-2); cursor:zoom-in;
  box-shadow:0 18px 40px -22px rgba(60,24,10,.55); isolation:isolate;
}
.tile img{ width:100%; height:100%; object-fit:cover; transition:transform 1s cubic-bezier(.2,.8,.2,1); }
.tile:hover img{ transform:scale(1.07); }
.tile::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(20,18,43,.82)); z-index:1; transition:opacity .4s; }
.tile .cap{ position:absolute; inset:auto 18px 14px 18px; z-index:2; color:#fff; text-align:start; font-family:var(--f-display); font-size:1.3rem; font-weight:700; line-height:1.15; text-shadow:0 2px 14px rgba(0,0,0,.5); }
.tile:nth-child(1) img{ object-position:50% 60%; }
.tile[data-img="night"] img{ object-position:50% 70%; }
@media (max-width: 760px){
  .bento{ grid-template-columns:repeat(2,1fr); grid-auto-rows:150px; gap:12px;
    grid-template-areas:"tent tent" "tent tent" "buffet fire" "buffet fire" "bath alley" "night night" "dinner dinner" "dinner dinner"; }
  .tile .cap{ font-size:1.05rem; inset:auto 12px 10px 12px; }
  .tile{ border-radius:18px; }
}

/* ---------- Night ---------- */
.night{ position:relative; overflow:hidden; color:var(--cream); padding:clamp(86px,11vw,150px) 0; background:linear-gradient(180deg,var(--night) 0%,var(--night-2) 55%,var(--night-3) 100%); }
.stars{ position:absolute; inset:0; pointer-events:none; }
.star{ position:absolute; width:var(--s); height:var(--s); border-radius:50%; background:#fff; opacity:.85; animation:twinkle var(--t) ease-in-out infinite; animation-delay:var(--dl); }
@keyframes twinkle{ 0%,100%{ opacity:.15; transform:scale(.8); } 50%{ opacity:1; transform:scale(1.25); } }
.moon{ position:absolute; inset-block-start:7%; inset-inline-end:7%; width:clamp(64px,9vw,120px); height:clamp(64px,9vw,120px); color:#F6E3B0; filter:drop-shadow(0 0 28px rgba(246,227,176,.55)); }
[dir="rtl"] .moon{ transform:scaleX(-1); }
.night-inner{ position:relative; display:grid; grid-template-columns:1fr 1.15fr; gap:clamp(30px,6vw,80px); align-items:center; }
.night h2{ font-size:clamp(2.3rem,5vw,3.9rem); color:#fff; margin-block:14px; }
.night .lead{ color:rgba(250,241,228,.82); }
.pills{ display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.pills li{ display:flex; align-items:center; gap:10px; padding:10px 18px; border-radius:999px; border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.06); backdrop-filter:blur(4px); font-weight:500; }
.pills .ic{ color:var(--saffron); }
.night-photo{ margin:0; position:relative; border-radius:34px 34px 34px 34px; box-shadow:0 0 0 1.5px rgba(242,196,109,.5), 0 0 0 12px rgba(242,196,109,.08), 0 40px 90px -30px rgba(224,159,62,.45); overflow:hidden; }
.night-photo img{ width:100%; height:auto; aspect-ratio:1600/852; object-fit:cover; }
@media (max-width: 880px){ .night-inner{ grid-template-columns:1fr; } }

/* ---------- Why ---------- */
.why{ background:var(--cream) var(--pattern); }
.why-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:22px; }
.why-card{ background:var(--cream-2); border:1px solid rgba(183,71,42,.14); border-radius:var(--r-lg); padding:30px 26px; display:grid; gap:12px; align-content:start; transition:transform .35s, box-shadow .35s; }
.why-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow); }
.why-card .ic-lg{ width:68px; height:68px; padding:17px; border-radius:50% 50% 14px 14px; background:linear-gradient(160deg,var(--gold),var(--saffron)); color:#3A1D0E; }
.why-card h3{ font-size:1.5rem; }
.why-card p{ color:var(--ink-soft); font-size:.98rem; }
.ta-strip{
  margin-top:34px; display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:10px 18px; padding:18px 26px;
  border-radius:999px; background:var(--night); color:#fff; transition:transform .3s, box-shadow .3s; box-shadow:var(--shadow);
}
.ta-strip:hover{ transform:translateY(-3px); }
.ta-stars{ display:flex; gap:3px; color:var(--saffron); }
.ta-more{ display:inline-flex; align-items:center; gap:8px; color:var(--gold); font-weight:500; }

/* ---------- Booking ---------- */
.book{ background:linear-gradient(155deg,var(--terra-d),var(--terra) 55%,var(--terra-l)); color:#fff; overflow:hidden; }
.book::before{ content:""; position:absolute; inset:0; background:var(--pattern-light); pointer-events:none; }
.book .container{ position:relative; }
.book-grid{ display:grid; grid-template-columns:1.25fr .9fr; gap:28px; align-items:start; }
.form-card{
  background:var(--cream); color:var(--ink); border-radius:var(--r-lg); padding:clamp(22px,3.4vw,38px);
  display:grid; grid-template-columns:1fr 1fr; gap:18px 16px; box-shadow:0 40px 80px -30px rgba(40,10,4,.7);
}
.span2{ grid-column:1/-1; }
.field{ display:grid; gap:7px; align-content:start; min-width:0; }
.field > span{ font-size:.78rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--terra-d); }
html[lang="ar"] .field > span, html[lang="zh"] .field > span{ letter-spacing:0; text-transform:none; font-size:.92rem; }
.field input,.field select,.field textarea,.stepper{
  width:100%; min-height:52px; padding:0 16px; background:#fff; border:1.5px solid var(--line); border-radius:var(--r-sm); outline:0;
  transition:border-color .2s, box-shadow .2s;
}
.field textarea{ padding:14px 16px; resize:vertical; min-height:92px; }
.field select{ appearance:none; cursor:pointer; padding-inline-end:44px;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23B7472A' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat;
  background-position:right 14px center; }
[dir="rtl"] .field select{ background-position:left 14px center; }
.field input:focus,.field select:focus,.field textarea:focus,.stepper:focus-within{ border-color:var(--saffron); box-shadow:0 0 0 4px rgba(224,159,62,.25); }
.field input[readonly]{ background:#F6EBD8; color:var(--ink-soft); }
.field input.bad,.field select.bad{ border-color:#C8362B; }
.err{ color:#B3261E; font-size:.84rem; min-height:1.1em; font-weight:500; }
.stepper{ display:flex; align-items:center; padding:0; overflow:hidden; }
.stepper button{ width:52px; align-self:stretch; border:0; background:var(--sand); font-size:1.4rem; font-weight:600; color:var(--terra-d); transition:background .2s; flex:none; }
.stepper button:hover{ background:var(--gold); }
.stepper input{ border:0 !important; box-shadow:none !important; text-align:center; min-height:50px; padding:0; -moz-appearance:textfield; border-radius:0; }
.stepper input::-webkit-outer-spin-button,.stepper input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.check{ display:flex; align-items:center; gap:12px; cursor:pointer; font-weight:500; }
.check input{ position:absolute; opacity:0; width:0; height:0; }
.check .box{ width:26px; height:26px; border-radius:8px; border:1.5px solid var(--line); background:#fff; display:grid; place-items:center; color:transparent; transition:.2s; }
.check input:checked + .box{ background:var(--terra); border-color:var(--terra); color:#fff; }
.check input:focus-visible + .box{ outline:3px solid var(--saffron); outline-offset:2px; }
.form-note{ text-align:center; font-size:.9rem; color:var(--ink-soft); }
@media (max-width: 980px){ .book-grid{ grid-template-columns:1fr; } }
@media (max-width: 520px){ .form-card{ grid-template-columns:1fr; } .field.span2,.form-card > *{ grid-column:1/-1; } .form-card .field:not(.span2){ grid-column:auto; } }

.summary{ background:var(--night); color:var(--cream); border-radius:var(--r-lg); overflow:hidden; position:sticky; top:96px; box-shadow:0 40px 80px -30px rgba(10,6,30,.8); }
.summary-top{ position:relative; height:190px; }
.summary-top img{ width:100%; height:100%; object-fit:cover; }
.summary-shade{ position:absolute; inset:0; background:linear-gradient(180deg,rgba(20,18,43,.15),rgba(20,18,43,.95)); }
.summary-title{ position:absolute; inset:auto 22px 16px 22px; }
.summary-title small{ color:var(--gold); font-weight:600; letter-spacing:.14em; text-transform:uppercase; font-size:.75rem; }
html[lang="ar"] .summary-title small, html[lang="zh"] .summary-title small{ letter-spacing:0; text-transform:none; font-size:.85rem; }
.summary-title h3{ font-size:1.35rem; line-height:1.2; margin-top:4px; }
.sum-list{ margin:0; padding:10px 22px 0; }
.sum-list div{ display:flex; justify-content:space-between; gap:18px; padding:12px 0; border-bottom:1px dashed rgba(255,255,255,.18); }
.sum-list dt{ color:rgba(250,241,228,.65); font-size:.9rem; }
.sum-list dd{ margin:0; font-weight:600; text-align:end; }
#sumPrice{ color:var(--gold); font-family:var(--f-display); font-size:1.5rem; line-height:1.2; }
.sum-note{ padding:10px 22px 0; font-size:.82rem; color:rgba(250,241,228,.6); }
.timeline{ padding:16px 22px 22px; max-height:300px; overflow:auto; display:grid; gap:0; }
.timeline li{ position:relative; display:grid; grid-template-columns:16px 1fr; gap:14px; padding-bottom:14px; font-size:.95rem; }
.timeline li::before{ content:""; position:absolute; inset-block:18px 0; inset-inline-start:7px; width:2px; background:rgba(242,196,109,.35); }
.timeline li:last-child::before{ display:none; }
.timeline li i{ width:16px; height:16px; border-radius:50%; background:var(--saffron); box-shadow:0 0 0 4px rgba(224,159,62,.25); margin-top:.35em; }
.timeline li b{ display:block; color:var(--gold); font-weight:600; }
.timeline li span{ color:rgba(250,241,228,.78); }
.sum-empty{ padding:6px 22px 24px; color:rgba(250,241,228,.7); }
.summary.filled .sum-empty{ display:none; }
.summary:not(.filled) .timeline{ display:none; }
@media (max-width: 980px){ .summary{ position:static; } }

/* ---------- Footer ---------- */
.footer{ background:#0E0C20; color:#CFC3AE; padding-top:70px; }
.footer-inner{ display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:40px; padding-bottom:48px; }
.footer-brand{ display:grid; gap:16px; align-content:start; max-width:340px; }
.footer-brand img{ border-radius:50%; background:#fff; }
.footer h4{ color:#fff; font-size:1.25rem; margin-bottom:14px; }
.footer-col{ display:grid; gap:12px; align-content:start; }
.footer-col a,.footer-col .loc{ display:flex; align-items:center; gap:10px; width:fit-content; transition:color .2s; }
.footer-col a:hover{ color:var(--gold); }
.footer .ic{ color:var(--saffron); }
.foot-langs{ display:flex; flex-wrap:wrap; gap:8px; }
.foot-langs button{ background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14); color:#E8DFCE; padding:7px 14px; border-radius:999px; font-size:.92rem; transition:.2s; }
.foot-langs button:hover{ background:rgba(255,255,255,.16); }
.foot-langs button[aria-current="true"]{ background:var(--saffron); border-color:var(--saffron); color:#2A1810; font-weight:600; }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.1); padding-block:22px; font-size:.9rem; color:#9A8E7B; }
@media (max-width: 820px){ .footer-inner{ grid-template-columns:1fr; } }

/* ---------- Floating WhatsApp ---------- */
.wa-float{
  position:fixed; inset-block-end:18px; inset-inline-end:18px; z-index:45; display:flex; align-items:center; gap:10px; height:56px; padding:0 22px 0 18px;
  background:var(--wa); color:#fff; border-radius:999px; font-weight:600; box-shadow:0 14px 34px -10px rgba(31,168,85,.9); transition:transform .25s;
}
.wa-float:hover{ transform:translateY(-3px) scale(1.03); }
.wa-float .ic{ width:28px; height:28px; }
.wa-float::before{ content:""; position:absolute; inset:0; border-radius:inherit; box-shadow:0 0 0 0 rgba(31,168,85,.6); animation:pulse 2.4s infinite; }
@keyframes pulse{ 0%{ box-shadow:0 0 0 0 rgba(31,168,85,.55); } 70%{ box-shadow:0 0 0 20px rgba(31,168,85,0); } 100%{ box-shadow:0 0 0 0 rgba(31,168,85,0); } }
@media (max-width: 600px){ .wa-float span{ display:none; } .wa-float{ width:58px; padding:0; justify-content:center; } }

/* ---------- Dialogs ---------- */
dialog{ border:0; padding:0; color:inherit; }
dialog::backdrop{ background:rgba(14,12,32,.74); backdrop-filter:blur(6px); }
.modal{ width:min(1020px,94vw); max-height:92vh; overflow:auto; border-radius:32px; background:var(--cream); box-shadow:0 50px 120px -30px rgba(0,0,0,.8); animation:pop .35s cubic-bezier(.2,.8,.2,1); }
@keyframes pop{ from{ opacity:0; transform:translateY(18px) scale(.98); } to{ opacity:1; transform:none; } }
.modal-x,.lb-x{ position:absolute; inset-block-start:14px; inset-inline-end:14px; z-index:5; width:44px; height:44px; border-radius:50%; border:0; background:rgba(255,255,255,.92); color:var(--ink); display:grid; place-items:center; box-shadow:0 6px 20px rgba(0,0,0,.25); }
.modal-x:hover,.lb-x:hover{ background:var(--gold); }
.modal-body{ display:grid; grid-template-columns:1.05fr 1fr; }
.m-gallery{ padding:18px; display:grid; gap:12px; align-content:start; background:var(--sand); }
.m-main{ position:relative; aspect-ratio:4/4.4; border-radius:50% 50% 20px 20px / 30% 30% 20px 20px; overflow:hidden; background:var(--night-2); }
.m-main img{ width:100%; height:100%; object-fit:cover; }
.m-thumbs{ display:grid; grid-template-columns:repeat(auto-fit,minmax(64px,1fr)); gap:8px; }
.m-thumbs button{ padding:0; border:2px solid transparent; border-radius:14px; overflow:hidden; aspect-ratio:1; background:var(--night-2); opacity:.7; transition:.2s; }
.m-thumbs button img{ width:100%; height:100%; object-fit:cover; }
.m-thumbs button[aria-current="true"]{ border-color:var(--terra); opacity:1; }
.m-info{ padding:clamp(24px,3.4vw,40px); display:grid; gap:16px; align-content:start; }
.m-info h3{ font-size:clamp(1.7rem,3vw,2.3rem); padding-inline-end:36px; }
.m-info .desc{ color:var(--ink-soft); }
.m-info h4{ font-size:1.1rem; color:var(--terra-d); margin-top:4px; }
.m-note{ display:flex; gap:10px; padding:14px 16px; border-radius:16px; background:rgba(224,159,62,.18); font-size:.94rem; }
.m-note .ic{ color:var(--terra); margin-top:.15em; }
.m-foot{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; padding-top:16px; border-top:1px dashed var(--line); }
@media (max-width: 800px){ .modal-body{ grid-template-columns:1fr; } .m-main{ aspect-ratio:4/3.2; border-radius:24px; } }

.lightbox{ width:100vw; height:100vh; max-width:none; max-height:none; background:transparent; display:none; place-items:center; }
.lightbox[open]{ display:grid; }
.lightbox figure{ margin:0; display:grid; gap:12px; justify-items:center; max-width:94vw; }
.lightbox img{ max-width:min(94vw,1400px); max-height:80vh; object-fit:contain; border-radius:18px; box-shadow:0 30px 80px rgba(0,0,0,.6); }
.lightbox figcaption{ color:#fff; font-family:var(--f-display); font-size:1.5rem; }
.lb-nav{ position:absolute; inset-block-start:50%; transform:translateY(-50%); width:52px; height:52px; border-radius:50%; border:0; background:rgba(255,255,255,.92); display:grid; place-items:center; z-index:5; }
.lb-nav:hover{ background:var(--gold); }
.lb-prev{ inset-inline-start:16px; } .lb-next{ inset-inline-end:16px; }
.lb-prev .ic{ transform:rotate(90deg); } .lb-next .ic{ transform:rotate(-90deg); }
[dir="rtl"] .lb-prev .ic{ transform:rotate(-90deg); } [dir="rtl"] .lb-next .ic{ transform:rotate(90deg); }

/* ---------- Reveal on scroll ---------- */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .9s cubic-bezier(.2,.8,.2,1), transform .9s cubic-bezier(.2,.8,.2,1); transition-delay:var(--d,0s); }
.reveal.in{ opacity:1; transform:none; }
.no-js .reveal{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation:none !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
  .reveal{ opacity:1; transform:none; }
}