/* Kivara Massage & Spa — Royal Thai calm.
   Layout: dark photographic openers → cream reading bands → indigo brand band with contour lines; one gold action everywhere. */
:root{
  --indigo:#1D3F74;        /* Chakri Indigo */
  --indigo-deep:#13294D;
  --sand:#D8CCB0;          /* Dusit Sand Beige */
  --cream:#EFEAE0;
  --paper:#F8F5EF;
  --gold:#CFAC2B;          /* Golden Mandala */
  --gold-hi:#DDBE45;
  --gold-soft:#F3E7C9;     /* Royal Lemongrass Gold */
  --ink:#1B2336;
  --muted:#5A6275;
  --rule:rgba(29,63,116,.16);
  --on-dark:#F8F5EF;
  --on-dark-muted:rgba(248,245,239,.72);

  --f-display:"Cormorant Garamond","Cormorant",Georgia,"Times New Roman",serif;
  --f-body:"Kanit","Noto Sans Thai",system-ui,sans-serif;

  --wrap:1180px;
  --gutter:clamp(16px,4vw,40px);
  --header-h:76px;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-body);font-weight:300;font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-weight:300;line-height:1.35;margin:0;text-wrap:balance}
p{margin:0}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
.nw{white-space:nowrap}
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}

/* type roles */
.eyebrow{font-family:var(--f-display);font-weight:500;font-size:.95rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.en{font-family:var(--f-display)}
.h-xl{font-size:clamp(2.1rem,5.4vw,3.9rem);font-weight:300;line-height:1.28}
.h-lg{font-size:clamp(1.7rem,3.4vw,2.6rem)}
.h-md{font-size:clamp(1.25rem,2vw,1.5rem);font-weight:400}
.lede{font-size:clamp(1.02rem,1.4vw,1.15rem);color:var(--muted);max-width:60ch}
.dark .lede,.hero .lede,.banner .lede{color:var(--on-dark-muted)}

/* buttons */
.btn{--bg:transparent;--fg:inherit;display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:48px;padding:.7em 1.6em;border-radius:999px;border:1px solid transparent;background:var(--bg);color:var(--fg);font:inherit;font-weight:400;font-size:1rem;letter-spacing:.02em;text-decoration:none;cursor:pointer;transition:background .25s,color .25s,border-color .25s,transform .25s}
.btn-book{--bg:var(--gold);--fg:var(--indigo-deep);font-weight:500;box-shadow:0 6px 20px -8px rgba(207,172,43,.7)}
.btn-book:hover{--bg:var(--gold-hi);transform:translateY(-1px)}
.btn-ghost{border-color:currentColor}
.btn-ghost:hover{background:rgba(255,255,255,.1)}
.light .btn-ghost:hover{background:rgba(29,63,116,.06)}
.btn-indigo{--bg:var(--indigo);--fg:var(--on-dark)}
.btn-indigo:hover{--bg:var(--indigo-deep)}
.btn svg{width:18px;height:18px;flex:none}
.link-arrow{white-space:nowrap;display:inline-flex;align-items:center;gap:.5em;text-decoration:none;font-weight:400;color:var(--indigo);border-bottom:1px solid var(--rule);padding-bottom:2px}
.link-arrow svg{width:18px;height:18px}
.link-arrow:hover{border-color:var(--indigo)}

/* ---------- header ---------- */
.site-header{position:fixed;inset:0 0 auto 0;z-index:40;padding-top:env(safe-area-inset-top,0px);color:var(--on-dark);transition:background .35s,box-shadow .35s}
.site-header.solid{background:rgba(19,41,77,.96);box-shadow:0 1px 0 rgba(255,255,255,.06);backdrop-filter:blur(8px)}
.nav{display:flex;align-items:center;gap:clamp(12px,2.4vw,36px);height:var(--header-h)}
.brand{display:flex;align-items:center;flex:none}
.brand img{height:26px;width:auto}
.nav-links{display:flex;gap:clamp(14px,2.4vw,34px);list-style:none;margin:0 0 0 auto;padding:0}
.nav-links a{text-decoration:none;font-size:.98rem;font-weight:300;padding:.4em 0;border-bottom:1px solid transparent;opacity:.9}
.nav-links a:hover{opacity:1;border-color:rgba(255,255,255,.5)}
.nav-links a[aria-current="page"]{opacity:1;border-color:var(--gold);font-weight:400}
.lang{display:flex;align-items:center;font-family:var(--f-display);font-weight:500;letter-spacing:.12em;font-size:.95rem;border:1px solid rgba(255,255,255,.28);border-radius:999px;overflow:hidden;flex:none}
.lang a{padding:.25em .8em;color:var(--on-dark-muted);text-decoration:none}
.lang a:hover{color:var(--on-dark)}
.lang a[aria-current="page"]{background:var(--on-dark);color:var(--indigo-deep)}
.drawer-lang{width:max-content;font-size:1.05rem}
.nav .btn-book{min-height:44px;padding:.55em 1.5em;flex:none}
.menu-toggle{all:unset;display:none;cursor:pointer;width:44px;height:44px;place-items:center;margin-left:auto}
.menu-toggle span{display:block;width:22px;height:1.5px;background:currentColor;position:relative}
.menu-toggle span::before,.menu-toggle span::after{content:"";position:absolute;left:0;width:22px;height:1.5px;background:currentColor}
.menu-toggle span::before{top:-7px}.menu-toggle span::after{top:7px}

.drawer{position:fixed;inset:0;z-index:60;background:var(--indigo-deep) url("img/texture.jpg") center/cover;color:var(--on-dark);padding:calc(env(safe-area-inset-top,0px) + 18px) var(--gutter) calc(env(safe-area-inset-bottom,0px) + 28px);display:flex;flex-direction:column;gap:28px}
.drawer-top{display:flex;justify-content:space-between;align-items:center}
.drawer-top img{height:24px}
.drawer-close{all:unset;cursor:pointer;font-size:2rem;line-height:1;width:44px;height:44px;display:grid;place-items:center}
.drawer nav{display:flex;flex-direction:column}
.drawer nav a{text-decoration:none;font-size:1.6rem;padding:.55em 0;border-bottom:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;align-items:baseline}
.drawer nav a small{font-family:var(--f-display);letter-spacing:.2em;font-size:.8rem;color:var(--gold);text-transform:uppercase}
.drawer nav a[aria-current="page"]{color:var(--gold-soft)}
.drawer .drawer-foot{margin-top:auto;display:flex;flex-direction:column;gap:14px;color:var(--on-dark-muted);font-size:.95rem}

/* ---------- hero (home) ---------- */
.hero{position:relative;color:var(--on-dark);background:var(--indigo-deep);overflow:hidden;isolation:isolate}
.hero-media{position:absolute;inset:0;z-index:-1}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:60% 40%}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(19,41,77,.94) 0%,rgba(19,41,77,.78) 38%,rgba(19,41,77,.18) 75%),linear-gradient(0deg,rgba(19,41,77,.7),transparent 35%)}
.hero-inner{padding-block:calc(var(--header-h) + clamp(64px,11vw,150px)) clamp(48px,7vw,90px);display:grid;gap:26px;max-width:var(--wrap)}
.hero-inner > *{max-width:640px}
.h-en{font-family:var(--f-display);font-weight:400;font-size:clamp(2.6rem,6.4vw,4.8rem);line-height:1.02;letter-spacing:-.005em}
.h-en em{font-style:italic}
.hero h1 em{font-style:normal;color:var(--gold-soft)}
.hero .tagline{font-family:var(--f-display);font-style:italic;font-size:clamp(1.2rem,2vw,1.5rem);color:var(--gold-soft);letter-spacing:.02em}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
.facts{display:flex;flex-wrap:wrap;gap:0;border-top:1px solid rgba(255,255,255,.18);margin-top:clamp(28px,5vw,56px);max-width:none !important}
.fact{flex:1 1 200px;padding:18px 22px 4px 0;display:flex;gap:12px;align-items:flex-start;min-width:0}
.fact svg{width:20px;height:20px;flex:none;margin-top:4px;color:var(--gold)}
.fact b{display:block;font-weight:400;font-size:1rem}
.fact span{color:var(--on-dark-muted);font-size:.9rem}

/* page banner (sub pages) */
.banner{position:relative;color:var(--on-dark);background:var(--indigo-deep);isolation:isolate;overflow:hidden}
.banner-media{position:absolute;inset:0;z-index:-1}
.banner-media img{width:100%;height:100%;object-fit:cover}
.banner-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(19,41,77,.93) 0%,rgba(19,41,77,.7) 50%,rgba(19,41,77,.35) 100%)}
.banner-inner{padding-block:calc(var(--header-h) + clamp(48px,7vw,96px)) clamp(40px,6vw,72px);display:grid;gap:14px}
.crumbs{font-size:.88rem;color:var(--on-dark-muted)}
.crumbs a{text-decoration:none}.crumbs a:hover{text-decoration:underline}

/* ---------- sections ---------- */
.section{padding-block:clamp(64px,9vw,120px)}
.section.cream{background:var(--cream)}
.section.dark{background:var(--indigo) url("img/texture.jpg") center/cover;color:var(--on-dark);position:relative;overflow:hidden;isolation:isolate}
.sec-head{display:grid;gap:14px;margin-bottom:clamp(36px,5vw,56px);max-width:720px}
.sec-head.row{max-width:none;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:20px}
.sec-head.row > div{display:grid;gap:14px;max-width:640px}

/* intro */
.intro{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(36px,6vw,96px);align-items:start}
.intro .quote{font-family:var(--f-display);font-style:italic;font-weight:400;font-size:clamp(2rem,4.2vw,3.2rem);line-height:1.12;color:var(--indigo);letter-spacing:-.005em}
.intro .quote + p{margin-top:24px;color:var(--muted);max-width:52ch}
.pillars{list-style:none;margin:0;padding:0;display:grid}
.pillars li{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;padding:22px 0;border-top:1px solid var(--rule)}
.pillars li:last-child{border-bottom:1px solid var(--rule)}
.pillars .mark{grid-row:span 2;width:40px;height:40px;border-radius:50%;background:var(--gold-soft);display:grid;place-items:center;color:var(--indigo)}
.pillars .mark svg{width:20px;height:20px}
.pillars h3{font-size:1.15rem;font-weight:400;color:var(--indigo)}
.pillars p{color:var(--muted);font-size:.97rem}

/* experiences */
.exp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,32px)}
.exp{display:grid;gap:16px;text-decoration:none;min-width:0}
.exp figure{margin:0;aspect-ratio:4/5;overflow:hidden;border-radius:2px;background:var(--sand)}
.exp img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.exp:hover img{transform:scale(1.04)}
.exp .en{font-size:.95rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);font-weight:500}
.exp h3{font-size:1.35rem;font-weight:400;color:var(--indigo)}
.exp p{color:var(--muted);font-size:.97rem}

/* story (dark) */
.contour{position:absolute;right:-6%;top:-10%;width:min(760px,70%);opacity:.32;z-index:-1;pointer-events:none;-webkit-mask-image:radial-gradient(closest-side,#000 55%,transparent);mask-image:radial-gradient(closest-side,#000 55%,transparent)}
.story{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(32px,6vw,90px);align-items:center}
.story figure{margin:0;aspect-ratio:4/5;overflow:hidden;border-radius:2px}
.story figure img{width:100%;height:100%;object-fit:cover;object-position:60% 50%}
.story-text{display:grid;gap:20px}
.story-text p{color:var(--on-dark-muted);max-width:54ch}
.story-text .sig{font-family:var(--f-display);font-style:italic;font-size:1.35rem;color:var(--gold-soft)}

/* steps */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px);counter-reset:s}
.steps li{counter-increment:s;display:grid;gap:10px;padding-top:22px;border-top:1px solid var(--indigo);min-width:0}
.steps li::before{content:counter(s,decimal-leading-zero);font-family:var(--f-display);font-size:2.6rem;line-height:1;color:var(--gold);font-weight:500}
.steps h3{font-size:1.2rem;font-weight:400;color:var(--indigo)}
.steps p{color:var(--muted);font-size:.97rem}
.steps-cta{margin-top:clamp(32px,4vw,48px);display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.steps-cta small{color:var(--muted)}

/* location */
.loc{display:grid;grid-template-columns:1.35fr 1fr;gap:0;background:var(--paper);border:1px solid var(--rule);border-radius:4px;overflow:hidden}
.map{position:relative;min-height:420px;background:var(--sand)}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.loc-info{padding:clamp(28px,4vw,48px);display:grid;gap:22px;align-content:start}
.loc-info h3{font-size:1.5rem;color:var(--indigo);font-weight:400}
.dl{display:grid;gap:16px;margin:0}
.dl > div{display:grid;grid-template-columns:24px 1fr;gap:12px;align-items:start}
.dl svg{width:20px;height:20px;color:var(--gold);margin-top:4px}
.dl .dt{font-size:.85rem;color:var(--muted)}
.dl .dd{margin:0;font-weight:400;font-size:1.05rem;color:var(--ink);font-variant-numeric:tabular-nums}
.loc-actions{display:flex;flex-wrap:wrap;gap:10px}
.light{color:var(--indigo)}

/* closing */
.closing{position:relative;color:var(--on-dark);text-align:center;isolation:isolate;overflow:hidden}
.closing-media{position:absolute;inset:0;z-index:-1}
.closing-media img{width:100%;height:100%;object-fit:cover}
.closing-media::after{content:"";position:absolute;inset:0;background:rgba(19,41,77,.72)}
.closing .wrap{display:grid;gap:22px;justify-items:center;padding-block:clamp(80px,11vw,140px)}
.closing p{color:var(--on-dark-muted);max-width:46ch}

/* menu page */
.mtabs{position:sticky;top:calc(var(--header-h) + env(safe-area-inset-top,0px));z-index:30;background:rgba(248,245,239,.97);backdrop-filter:blur(8px);border-bottom:1px solid var(--rule)}
.mtabs-row{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-block:12px}
.mtabs-row::-webkit-scrollbar{display:none}
.mtabs a{flex:none;text-decoration:none;padding:.4em 1.1em;border-radius:999px;border:1px solid var(--rule);color:var(--indigo);font-size:.95rem;white-space:nowrap;transition:background .2s,color .2s,border-color .2s}
.mtabs a:hover{border-color:var(--indigo)}
.mtabs a.on{background:var(--indigo);color:var(--on-dark);border-color:var(--indigo)}
.mcat{padding-block:clamp(56px,7vw,96px);scroll-margin-top:calc(var(--header-h) + 64px)}
.mcat.alt{background:var(--cream)}
.mcat-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,2fr);gap:clamp(28px,5vw,80px);align-items:start}
.mcat-head{display:grid;gap:12px;position:sticky;top:calc(var(--header-h) + 90px)}
.mcat-head h2{color:var(--indigo)}
.mcat-head p:last-child{color:var(--muted)}
.mi-list{display:grid}
.mi{display:grid;gap:12px;padding-block:26px;border-top:1px solid var(--rule)}
.mi:first-child{border-top:0;padding-top:0}
.mi-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 16px}
.mi-head h3{font-size:clamp(1.2rem,1.8vw,1.4rem);font-weight:400;color:var(--indigo)}
.mi-en{font-family:var(--f-display);font-style:italic;font-size:1.1rem;color:#9a7d14}
.mi-desc{color:var(--muted);max-width:62ch}
.mi-inc{font-size:.93rem;color:var(--indigo);display:flex;flex-wrap:wrap;gap:4px 10px}
.mi-inc span{color:#9a7d14;font-weight:400}
.mi-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.mi-prices{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.mi-prices li{display:flex;align-items:baseline;gap:8px;padding:.35em .95em;border-radius:999px;background:var(--paper);border:1px solid var(--rule);font-variant-numeric:tabular-nums}
.mcat:not(.alt) .mi-prices li{background:var(--cream);border-color:transparent}
.mi-prices span{font-size:.88rem;color:var(--muted)}
.mi-prices b{font-weight:500;color:var(--ink)}
.mi-book{display:inline-flex;align-items:center;gap:6px;text-decoration:none;color:var(--indigo);font-weight:400;padding:.35em 0;border-bottom:1px solid var(--rule)}
.mi-book svg{width:16px;height:16px}
.mi-book:hover{border-color:var(--indigo)}
.exp .from{font-size:.92rem;color:var(--indigo);font-weight:400;font-variant-numeric:tabular-nums}
.story-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
.tips{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px)}
.tip{display:grid;gap:10px;padding-top:20px;border-top:1px solid var(--rule)}
.tip svg{width:26px;height:26px;color:var(--gold)}
.tip h3{font-size:1.12rem;font-weight:400;color:var(--indigo)}
.tip p{color:var(--muted);font-size:.97rem}

/* membership */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,28px);align-items:stretch}
.tier{position:relative;display:flex;flex-direction:column;gap:14px;padding:clamp(28px,3vw,40px);border-radius:6px;min-width:0}
.tier-sand{background:var(--sand);color:var(--ink)}
.tier-indigo{background:var(--indigo) url("img/texture.jpg") center/cover;color:var(--on-dark)}
.tier-gold{background:linear-gradient(150deg,var(--gold-soft) 0%,#E6CE7A 55%,var(--gold) 100%);color:var(--indigo-deep)}
.tier-en{font-family:var(--f-display);font-weight:500;letter-spacing:.24em;text-transform:uppercase;font-size:.9rem;opacity:.8}
.tier h3{font-size:1.5rem;font-weight:400}
.tier-credit{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding-block:14px;border-block:1px solid currentColor;border-color:color-mix(in srgb,currentColor 25%,transparent)}
.tier-credit span{font-size:.95rem;opacity:.8}
.tier-credit b{font-size:1.5rem;font-weight:500;font-variant-numeric:tabular-nums}
.tier-pct{display:flex;align-items:baseline;gap:12px}
.tier-pct b{font-family:var(--f-display);font-weight:500;font-size:clamp(3.4rem,6vw,4.6rem);line-height:1}
.tier-pct span{font-size:1rem}
.tier-facts{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:.95rem}
.tier-facts li{display:grid;grid-template-columns:20px 1fr;gap:10px;align-items:start}
.tier-facts svg{width:18px;height:18px;margin-top:4px;opacity:.8}
.tier-bday svg{margin-top:0!important}
.tier-bday{padding:.55em .8em;border-radius:6px;background:color-mix(in srgb,currentColor 9%,transparent);align-items:center!important}
.tier-bday b{font-weight:500;font-size:1.1rem}
.tier-join{margin-top:auto;display:flex;align-items:center;gap:8px;padding-top:14px;border-top:1px solid color-mix(in srgb,currentColor 25%,transparent);font-weight:400}
.tier-join svg{width:18px;height:18px}
.tier-cta{margin-top:auto;--bg:var(--indigo);--fg:var(--on-dark)}
.tier-cta:hover{--bg:var(--indigo-deep)}
.tier-indigo .tier-cta{--bg:var(--gold);--fg:var(--indigo-deep)}
.tier-indigo .tier-cta:hover{--bg:var(--gold-hi)}
.tier-badge{position:absolute;top:18px;right:18px;background:var(--indigo-deep);color:var(--gold-soft);font-size:.8rem;padding:.25em .8em;border-radius:999px}
.terms{list-style:none;margin:0;padding:0;display:grid}
.terms li{padding:16px 0 16px 28px;border-top:1px solid var(--rule);position:relative;color:var(--ink)}
.terms li:last-child{border-bottom:1px solid var(--rule)}
.terms li::before{content:"";position:absolute;left:4px;top:1.55em;width:8px;height:8px;border-radius:50%;background:var(--gold)}

/* branch */
.branch{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:center}
.branch figure{margin:0;aspect-ratio:5/4;overflow:hidden;border-radius:2px}
.branch figure img{width:100%;height:100%;object-fit:cover}
.branch-info{display:grid;gap:24px}
.tag{display:inline-flex;align-items:center;gap:8px;font-size:.85rem;color:var(--indigo);background:var(--gold-soft);padding:.3em .9em;border-radius:999px;width:max-content}
.tag i{width:7px;height:7px;border-radius:50%;background:#3d8b5a;display:block}
.map-wide{margin-top:clamp(40px,6vw,72px);position:relative;aspect-ratio:21/9;min-height:360px;border-radius:4px;overflow:hidden;background:var(--sand);border:1px solid var(--rule)}
.map-wide iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* contact */
.channels{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,2.4vw,28px)}
.channel{background:var(--paper);border:1px solid var(--rule);border-radius:4px;padding:clamp(24px,3vw,36px);display:grid;gap:14px;align-content:start;min-width:0}
.channel .ico{width:48px;height:48px;border-radius:50%;background:var(--indigo);color:var(--on-dark);display:grid;place-items:center}
.channel .ico svg{width:22px;height:22px}
.channel .label{font-size:.9rem;color:var(--muted)}
.channel .value{font-size:clamp(1.25rem,2vw,1.5rem);font-weight:400;color:var(--indigo);word-break:break-word;font-variant-numeric:tabular-nums;user-select:all}
.channel .row{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.btn-sm{min-height:40px;padding:.45em 1.1em;font-size:.93rem}
.btn-line{--bg:#06C755;--fg:#fff}
.btn-line:hover{--bg:#05b04b}
.copy{--fg:var(--indigo);border-color:var(--rule)}
.copy:hover{border-color:var(--indigo)}
.socials{list-style:none;margin:0;padding:0;display:grid}
.socials li+li{border-top:1px solid var(--rule)}
.socials a{display:grid;grid-template-columns:22px auto 1fr;align-items:center;gap:12px;padding:12px 0;text-decoration:none;color:var(--indigo)}
.socials a:hover b{text-decoration:underline}
.socials svg{width:20px;height:20px;color:var(--indigo)}
.socials span{font-size:.9rem;color:var(--muted);min-width:5.5em}
.socials b{font-weight:400;font-size:1.1rem;text-align:right;word-break:break-word}
.contact-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:start}
.faq{display:grid}
.faq details{border-top:1px solid var(--rule);padding:18px 0}
.faq details:last-child{border-bottom:1px solid var(--rule)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;font-weight:400;color:var(--indigo);font-size:1.05rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--f-display);font-size:1.6rem;line-height:1;color:var(--gold);transition:transform .25s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin-top:10px;color:var(--muted)}

.map-ph{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:8px;text-align:center;padding:24px;text-decoration:none;color:var(--indigo);background:var(--sand) url("img/contour.png") center/cover;background-blend-mode:multiply}
.map-ph span{width:56px;height:56px;border-radius:50%;background:var(--indigo);color:var(--gold-soft);display:grid;place-items:center}
.map-ph span svg{width:26px;height:26px}
.map-ph b{font-weight:400;font-size:1.15rem}
.map-ph small{color:var(--ink);opacity:.75;max-width:32ch}
/* ---------- footer ---------- */
.site-footer{background:var(--indigo-deep);color:var(--on-dark-muted);padding-block:clamp(56px,7vw,88px) calc(28px + env(safe-area-inset-bottom,0px));font-size:.95rem}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:clamp(28px,4vw,56px)}
.foot-grid h4{margin:0 0 14px;font-family:var(--f-display);font-weight:500;letter-spacing:.22em;text-transform:uppercase;font-size:.85rem;color:var(--gold)}
.foot-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.foot-grid a{text-decoration:none}.foot-grid a:hover{color:var(--on-dark)}
.foot-brand{display:grid;gap:18px;align-content:start}
.foot-brand img{width:170px}
.foot-brand p{font-family:var(--f-display);font-style:italic;font-size:1.15rem;color:var(--gold-soft)}
.foot-bottom{margin-top:48px;padding-top:22px;border-top:1px solid rgba(255,255,255,.1);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:.85rem}

/* mobile booking bar */
.mbar{display:none}

/* modal + toast */
.modal{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:20px;background:rgba(19,41,77,.6);backdrop-filter:blur(4px)}
.modal-card{background:var(--paper);color:var(--ink);border-radius:6px;max-width:440px;width:100%;padding:32px 28px 26px;display:grid;gap:16px;text-align:center;position:relative}
.modal-card h3{font-size:1.4rem;color:var(--indigo);font-weight:400}
.modal-card p{color:var(--muted)}
.modal-card .row{display:grid;gap:10px}
.modal-x{all:unset;cursor:pointer;position:absolute;top:10px;right:12px;width:40px;height:40px;display:grid;place-items:center;font-size:1.6rem;color:var(--muted)}
.toast{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:90;background:var(--ink);color:var(--paper);padding:.7em 1.3em;border-radius:999px;font-size:.93rem;box-shadow:0 10px 30px -10px rgba(0,0,0,.4);max-width:calc(100% - 32px);text-align:center}

/* entrance */
@media (prefers-reduced-motion:no-preference){
  .hero-inner > *{animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
  .hero-inner > *:nth-child(2){animation-delay:.08s}.hero-inner > *:nth-child(3){animation-delay:.16s}
  .hero-inner > *:nth-child(4){animation-delay:.24s}.hero-inner > *:nth-child(5){animation-delay:.32s}
  .hero-media img{animation:settle 2.4s cubic-bezier(.2,.7,.2,1) both}
}
@keyframes rise{from{opacity:.001;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes settle{from{transform:scale(1.06)}to{transform:none}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ---------- responsive ---------- */
@media (max-width:960px){
  .nav-links,.nav .btn-book{display:none}
  .menu-toggle{display:grid}
  .lang{margin-left:auto}
  .menu-toggle{margin-left:4px}
  .intro,.story,.branch,.socials{list-style:none;margin:0;padding:0;display:grid}
.socials li+li{border-top:1px solid var(--rule)}
.socials a{display:grid;grid-template-columns:22px auto 1fr;align-items:center;gap:12px;padding:12px 0;text-decoration:none;color:var(--indigo)}
.socials a:hover b{text-decoration:underline}
.socials svg{width:20px;height:20px;color:var(--indigo)}
.socials span{font-size:.9rem;color:var(--muted);min-width:5.5em}
.socials b{font-weight:400;font-size:1.1rem;text-align:right;word-break:break-word}
.contact-split{grid-template-columns:1fr}
  .loc{grid-template-columns:1fr}
  .map{min-height:320px}
  .foot-grid{grid-template-columns:1fr 1fr}
  .channels{grid-template-columns:1fr}
  .tiers{grid-template-columns:1fr;max-width:520px}
  .story figure{aspect-ratio:16/11}
  .mbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:45;gap:10px;padding:10px var(--gutter) calc(10px + env(safe-area-inset-bottom,0px));background:rgba(248,245,239,.96);backdrop-filter:blur(8px);border-top:1px solid var(--rule)}
  .mbar .btn-book{flex:1}
  .mbar .btn-ghost{color:var(--indigo);padding-inline:1em}
  body{padding-bottom:calc(70px + env(safe-area-inset-bottom,0px))}
}
@media (max-width:720px){
  :root{--header-h:64px}
  .brand img{height:22px}
  .exp-grid,.steps,.tips{grid-template-columns:1fr}
  .mcat-grid{grid-template-columns:1fr}
  .mcat-head{position:static}
  :root{--mtabs:0}
  .exp figure{aspect-ratio:16/11}
  .hero-media::after{background:linear-gradient(0deg,rgba(19,41,77,.96) 0%,rgba(19,41,77,.82) 50%,rgba(19,41,77,.45) 100%)}
  .hero-actions .btn{flex:1 1 auto}
  .map-wide{aspect-ratio:4/5}
  .foot-grid{grid-template-columns:1fr}
}