/* ════════════════════════════════════════════════════════════
   ARAM · A NAVALAKHA HOSPITALITY RESIDENCE — Balewadi, Pune
   Heritage-blue system (operator) + warm-brass accent (property).
   Display: Fraunces · UI/data: Manrope.
   ════════════════════════════════════════════════════════════ */
:root{
  --ink:#0A2138;          /* deepest heritage — intro / dark sections */
  --navy:#0C2A47;
  --heritage:#123F70;
  --arch:#28689D;
  --river:#6F9DBB;
  --ivory:#F4F0E7;
  --cream:#FAF8F3;
  --paper:#FDFBF6;
  --stone:#DED6C7;
  --line:#CDC3B0;
  --aram:#B4894E;         /* property accent — warm brass, from Aram identity */
  --aram-soft:#D8C29A;
  --text:#22323F;         /* warm charcoal-blue body */
  --muted:#5C6670;
  --white:#FDFCF8;
  --display:"Fraunces", Georgia, "Times New Roman", serif;
  --sans:"Manrope", -apple-system, "Segoe UI", sans-serif;
  --ease:cubic-bezier(.22,.68,.24,.99);
  --nav-h:82px;
}
*{margin:0;padding:0;box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
html.lock{overflow:hidden}
body{font-family:var(--sans);font-weight:400;color:var(--text);background:var(--cream);font-size:clamp(16.5px,1.05vw,18.5px);line-height:1.68;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg,video{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
.num{font-variant-numeric:tabular-nums;letter-spacing:.01em}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--aram);outline-offset:3px}
::selection{background:var(--river);color:var(--ink)}

/* paper grain */
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:2000;opacity:.045;mix-blend-mode:multiply;
  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='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E")}

/* ─── type ─── */
h1,h2,h3,.serif-xl,.serif-hero{font-family:var(--display);font-weight:400;line-height:1.03;letter-spacing:-.01em;color:var(--ink);font-optical-sizing:auto}
h1{font-size:clamp(3rem,8.2vw,7rem);font-weight:350}
h2{font-size:clamp(2.3rem,4.9vw,4.6rem);margin-bottom:.35em;text-wrap:balance;font-weight:380}
h3{font-size:clamp(1.55rem,2.7vw,2.4rem)}
.serif-xl{font-size:clamp(2.1rem,4.4vw,3.9rem)}
em{font-style:italic}
.eyebrow{font-family:var(--sans);font-size:clamp(.66rem,.78vw,.78rem);font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:var(--river);margin-bottom:22px;display:flex;align-items:center;gap:14px}
.eyebrow::before{content:"";width:26px;height:1px;background:currentColor;flex:0 0 auto}
.eyebrow-aram{color:var(--aram)}
.body-l{font-size:clamp(1.02rem,1.35vw,1.26rem);line-height:1.62;max-width:54ch;color:var(--muted)}

/* mask reveals (JS-gated) */
.mask{display:block;overflow:hidden}
.mask .mask-inner{display:inline-block}
html.js.motion .mask .mask-inner{transform:translateY(112%)}
html.no-motion .mask .mask-inner,html:not(.js) .mask .mask-inner{transform:none!important}

/* buttons — architectural */
.btn-solid,.btn-line{display:inline-flex;align-items:center;justify-content:center;gap:.4em;font-weight:600;font-size:.92rem;letter-spacing:.04em;text-decoration:none;padding:17px 32px;min-height:50px;transition:background .3s var(--ease),color .3s var(--ease),border-color .3s}
.btn-solid{background:var(--ink);color:var(--ivory);border:1px solid var(--ink)}
.btn-solid:hover{background:var(--heritage);border-color:var(--heritage)}
.btn-line{border:1px solid currentColor;color:var(--ink)}
.btn-line:hover{background:rgba(18,63,112,.06)}

/* ════════ INTRO ════════ */
#intro{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;overflow:hidden;background:var(--ink)}
.intro-half{position:absolute;left:0;right:0;height:50.6%;background:var(--ink);z-index:5}
.intro-half.top{top:0}.intro-half.bottom{bottom:0}
#introCanvas{position:absolute;inset:0;width:100%;height:100%;z-index:2}
.intro-wordmark{position:relative;z-index:3;text-align:center;opacity:0;display:flex;flex-direction:column;align-items:center;gap:16px}
.iw-logo{width:clamp(90px,13vw,150px);height:auto;filter:drop-shadow(0 6px 30px rgba(0,0,0,.4))}
.iw-serif{display:block;font-family:var(--display);font-weight:350;color:var(--ivory);font-size:clamp(2rem,5.6vw,4.4rem);line-height:1.04}
.iw-sans{display:block;font-family:var(--sans);color:var(--river);font-size:clamp(.62rem,1.2vw,.82rem);font-weight:500;letter-spacing:.42em;text-transform:uppercase;padding-left:.42em}
.intro-line{position:absolute;z-index:4;left:0;top:50%;width:100%;height:1.5px;background:linear-gradient(90deg,transparent,var(--river) 18%,var(--aram) 50%,var(--river) 82%,transparent);transform:scaleX(0)}
html:not(.js) #intro{display:none}

/* ════════ NAV ════════ */
.site-nav{position:fixed;top:0;left:0;right:0;z-index:200;display:flex;align-items:center;justify-content:space-between;height:var(--nav-h);padding:0 clamp(20px,4vw,56px);transition:background .45s var(--ease),backdrop-filter .45s,box-shadow .45s;opacity:0}
html.no-motion .site-nav,html:not(.js) .site-nav{opacity:1}
.site-nav.scrolled{background:rgba(10,33,56,.86);backdrop-filter:blur(14px)}
.wordmark{text-decoration:none;line-height:1;display:flex;align-items:center;gap:12px}
.wm-logo{height:40px;width:auto}
.wm-serif{display:block;font-family:var(--display);font-weight:400;font-size:1.25rem;color:var(--ivory)}
.wm-sans{display:block;font-size:.58rem;font-weight:600;letter-spacing:.36em;text-transform:uppercase;color:var(--river);margin-top:3px;padding-left:.3em}
.nav-right{display:flex;align-items:center;gap:clamp(14px,2.4vw,32px)}
.nav-cta{font-size:.78rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--ivory);text-decoration:none;border-bottom:1px solid rgba(180,137,78,.55);padding-bottom:4px;transition:border-color .3s,color .3s}
.nav-cta:hover{border-color:var(--aram);color:var(--aram-soft)}
.menu-btn{display:flex;align-items:center;gap:11px;color:var(--ivory);padding:10px 0}
.menu-lines{display:flex;flex-direction:column;gap:6px;width:28px}
.menu-lines i{height:1.5px;background:var(--ivory);transition:transform .3s}
.menu-btn:hover .menu-lines i:first-child{transform:translateX(4px)}
.menu-word{font-size:.76rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase}
@media(max-width:640px){.nav-cta{display:none}.wm-logo{height:34px}}

/* ════════ MENU ════════ */
#menu{position:fixed;inset:0;z-index:400;background:var(--ink);color:var(--ivory);display:flex;flex-direction:column;justify-content:center;padding:0 clamp(28px,8vw,120px)}
.menu-crop{position:absolute;top:0;right:0;bottom:0;width:min(44vw,600px);background:url('assets/aram-building-view.jpg') center/cover;opacity:.18;-webkit-mask-image:linear-gradient(90deg,transparent,#000 45%);mask-image:linear-gradient(90deg,transparent,#000 45%)}
.menu-river{position:absolute;left:0;right:0;bottom:14%;height:1px;background:linear-gradient(90deg,transparent,var(--aram),transparent);opacity:.5}
.menu-close{position:absolute;top:24px;right:clamp(22px,4vw,56px);font-size:1.15rem;color:var(--ivory);padding:12px}
.menu-nav{display:flex;flex-direction:column;gap:clamp(6px,1.6vh,18px);position:relative;z-index:2}
.menu-nav a{font-family:var(--display);font-weight:350;font-size:clamp(1.9rem,5vw,3.9rem);color:var(--ivory);text-decoration:none;line-height:1.14;width:fit-content;position:relative;transition:color .3s}
.menu-nav a::after{content:"";position:absolute;left:0;bottom:6px;width:0;height:1px;background:var(--aram);transition:width .45s var(--ease)}
.menu-nav a:hover{color:var(--aram-soft)}
.menu-nav a:hover::after{width:100%}
.menu-foot{position:absolute;bottom:clamp(24px,5vh,48px);left:clamp(28px,8vw,120px)}
.menu-foot .wm-serif{font-size:1.05rem}

/* ════════ HERO ════════ */
#hero{position:relative;height:100svh;min-height:640px;overflow:hidden;background:var(--ink)}
.hero-media{position:absolute;inset:0}
#heroVideo{width:100%;height:100%;object-fit:cover;transform:scale(1.06);transform-origin:center}
html.no-motion #heroVideo{transform:none}
.hero-grade{position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(10,33,56,.5) 0%,rgba(10,33,56,.05) 28%,rgba(10,33,56,.02) 52%,rgba(10,33,56,.68) 100%),
  radial-gradient(120% 90% at 82% 92%,rgba(10,33,56,.4),transparent 55%)}
.hero-copy{position:absolute;left:clamp(20px,4.5vw,64px);right:clamp(20px,4.5vw,64px);bottom:clamp(52px,11vh,120px);z-index:2;max-width:1100px}
.hero-brand{margin-bottom:26px}
.hero-brand .mask-inner{display:flex;flex-direction:column;gap:8px}
.hero-logo{width:clamp(120px,15vw,190px);height:auto}
.hero-logo-fallback{font-size:clamp(3rem,7vw,5.4rem);color:var(--ivory);letter-spacing:.02em;line-height:1}
.hero-endorse{font-size:clamp(.72rem,1vw,.9rem);font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--aram-soft)}
#hero h1{color:var(--white);font-weight:330}
#hero h1 em{color:var(--ivory)}
.hero-sub{color:var(--ivory);font-size:clamp(1.02rem,1.45vw,1.3rem);max-width:46ch;margin:24px 0 32px;line-height:1.58;opacity:.94}
.hero-ctas .mask-inner{display:flex;gap:14px;flex-wrap:wrap}
#hero .btn-solid{background:var(--ivory);color:var(--ink);border-color:var(--ivory)}
#hero .btn-solid:hover{background:var(--white)}
#hero .btn-line{color:var(--ivory)}
#hero .btn-line:hover{background:rgba(244,240,231,.12)}
.hero-micro{margin-top:24px;font-size:.8rem;letter-spacing:.05em;color:rgba(244,240,231,.78)}
.scroll-cue{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);z-index:2;width:1px;height:52px;overflow:hidden;background:rgba(244,240,231,.18)}
.scroll-cue span{position:absolute;left:0;top:-40%;width:100%;height:40%;background:var(--aram-soft);animation:cue 2.4s var(--ease) infinite}
@keyframes cue{0%{top:-40%}60%,100%{top:110%}}
@media(max-width:640px){.scroll-cue{display:none}}

/* ════════ SPEC — the 422 experience ════════ */
#spec{background:var(--ink);color:var(--ivory)}
.spec-pin{position:relative;min-height:100svh;padding:calc(var(--nav-h) + 5vh) clamp(20px,4.5vw,64px) 8vh;overflow:hidden;display:flex;flex-direction:column;justify-content:center}
.spec-ghost{position:absolute;top:4%;right:-3%;font-family:var(--display);font-weight:300;font-size:clamp(13rem,36vw,34rem);line-height:.8;color:transparent;-webkit-text-stroke:1px rgba(180,137,78,.4);pointer-events:none;user-select:none;z-index:1}
.spec-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,80px);align-items:center}
#spec h2{color:var(--ivory);font-weight:360}
#spec .body-l{color:rgba(244,240,231,.82)}
#spec .body-l .num{color:var(--aram-soft)}
.spec-list{list-style:none;margin-top:40px;border-left:1px solid rgba(180,137,78,.35);display:flex;flex-direction:column}
.spec-list li{display:flex;align-items:baseline;gap:20px;padding:16px 0 16px 26px;border-bottom:1px solid rgba(111,157,187,.14)}
.spec-list li:last-child{border-bottom:none}
html.js.motion .spec-list li[data-spec]{opacity:0;transform:translateX(-12px)}
.sl-i{font-family:var(--display);font-weight:400;font-size:clamp(1.2rem,1.9vw,1.7rem);color:var(--ivory);min-width:6.4em}
.sl-d{font-size:.9rem;letter-spacing:.02em;color:rgba(244,240,231,.7)}
.spec-note{margin-top:24px;font-size:.86rem;color:var(--river);letter-spacing:.02em}
.spec-visual{position:relative}
.spec-plan{position:relative;overflow:hidden;background:var(--paper);border:1px solid rgba(180,137,78,.25)}
.spec-plan img{width:100%;height:auto;object-fit:contain}
html.js.motion .spec-plan{clip-path:inset(6% 6% 6% 6%)}
.spec-stack{position:absolute;left:-8px;bottom:-10px;display:flex;flex-direction:column-reverse;gap:5px;z-index:3}
.spec-stack span{display:block;width:clamp(60px,8vw,104px);height:9px;background:var(--aram);opacity:.9;transform-origin:left;box-shadow:0 2px 10px rgba(0,0,0,.3)}
html.js.motion .spec-stack span{transform:scaleX(0)}
.spec-stack-label{position:absolute;left:clamp(72px,9vw,120px);bottom:0;font-size:.74rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--aram-soft);opacity:0}
@media(max-width:900px){
  .spec-grid{grid-template-columns:1fr}
  .spec-ghost{font-size:11rem;top:1%}
  .sl-i{min-width:5.6em}
  .spec-stack{position:static;flex-direction:row;flex-wrap:wrap;margin-top:18px}
  .spec-stack span{width:38px;height:8px}
  .spec-stack-label{position:static;margin-top:10px}
}

/* ════════ CONFIG — two ways to live ════════ */
#config{background:var(--cream);padding:clamp(80px,12vh,150px) clamp(20px,4.5vw,64px)}
.cfg-head{max-width:1240px;margin:0 auto clamp(40px,6vh,72px)}
.cfg-grid{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3vw,44px)}
.cfg-card{background:var(--paper);border:1px solid var(--line);display:flex;flex-direction:column;overflow:hidden}
.cfg-media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--stone)}
.cfg-media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.cfg-card:hover .cfg-media img{transform:scale(1.04)}
.cfg-body{padding:clamp(26px,3vw,40px);display:flex;flex-direction:column;flex:1}
.cfg-tag{font-size:.72rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--aram);margin-bottom:14px}
.cfg-card h3{margin-bottom:14px}
.cfg-line{color:var(--muted);font-size:1rem;line-height:1.6;max-width:44ch}
.cfg-facts{list-style:none;display:flex;gap:36px;margin:26px 0;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cfg-facts li{display:flex;flex-direction:column;gap:4px}
.cf-n{font-family:var(--display);font-size:clamp(2rem,3.2vw,2.8rem);color:var(--heritage);line-height:1}
.cf-t{font-size:.82rem;letter-spacing:.04em;color:var(--muted);max-width:12ch}
.cfg-price{margin-top:auto;display:flex;flex-direction:column;gap:3px}
.cp-label{font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.cp-n{font-family:var(--display);font-size:clamp(2.2rem,3.6vw,3.1rem);color:var(--ink);line-height:1.05}
.cp-sub{font-size:.86rem;color:var(--muted)}
.cfg-foot{margin-top:18px;padding-top:18px;border-top:1px solid var(--line);font-size:.9rem;color:var(--muted)}
.cfg-foot a{color:var(--heritage);text-decoration:underline;text-underline-offset:3px}
@media(max-width:820px){.cfg-grid{grid-template-columns:1fr}}

/* ════════ FIND — mid CTA ════════ */
#find{background:var(--ink);color:var(--ivory);padding:clamp(80px,13vh,150px) clamp(20px,4.5vw,64px);position:relative;text-align:center;overflow:hidden}
.find-inner{max-width:760px;margin:0 auto;position:relative;z-index:2}
#find h2{color:var(--ivory);font-weight:360}
#find .body-l{color:rgba(244,240,231,.84);margin:0 auto 32px}
#find .btn-solid{background:var(--aram);color:var(--ink);border-color:var(--aram)}
#find .btn-solid:hover{background:var(--aram-soft);border-color:var(--aram-soft)}
.find-sub{margin-top:20px;font-size:.84rem;color:var(--river);letter-spacing:.03em}
#find .river-line{position:absolute;left:0;right:0;bottom:8%;width:100%;height:40px;opacity:.4;z-index:1}
#find .river-line path{stroke:var(--aram);stroke-width:1.2}

/* ════════ WALKTHROUGH ════════ */
#walkthrough{background:var(--cream);padding:clamp(80px,12vh,150px) 0 0}
.wt-head{padding:0 clamp(20px,4.5vw,64px);max-width:1240px;margin:0 auto 40px}
.wt-stage{position:relative;height:min(86svh,900px);min-height:480px;background:var(--ink);overflow:hidden;outline:none}
.wt-stage:fullscreen{height:100vh}
.wt-layer{position:absolute;inset:0;opacity:0}
.wt-layer.active{opacity:1}
.wt-layer img{width:100%;height:100%;object-fit:cover;will-change:transform,filter}
.wt-hotspots{position:absolute;inset:0;z-index:5;pointer-events:none}
.hotspot{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--white)}
.hotspot .hs-ring{width:52px;height:52px;min-width:48px;min-height:48px;border-radius:50%;border:1px solid rgba(253,252,248,.85);display:grid;place-items:center;background:rgba(10,33,56,.32);backdrop-filter:blur(3px);transition:background .3s,transform .3s var(--ease)}
.hotspot svg{width:18px;height:18px;stroke:var(--white);fill:none;stroke-width:1.6}
.hotspot .hs-label{font-size:.7rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;background:rgba(10,33,56,.58);padding:5px 12px;opacity:0;transform:translateY(-4px);transition:opacity .3s,transform .3s;white-space:nowrap}
.hotspot:hover .hs-ring,.hotspot:focus-visible .hs-ring{background:rgba(180,137,78,.55);transform:scale(1.08)}
.hotspot:hover .hs-label,.hotspot:focus-visible .hs-label{opacity:1;transform:none}
@media(hover:none){.hotspot .hs-label{opacity:1;transform:none}}
.hotspot.hs-plan .hs-ring{border-style:dashed}
.plan-zone{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;background:rgba(10,33,56,.62);color:var(--ivory);font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:11px 18px;min-height:44px;border:1px solid rgba(244,240,231,.4);transition:background .3s,border-color .3s}
.plan-zone:hover,.plan-zone:focus-visible{background:rgba(18,63,112,.9);border-color:var(--aram)}
.feat{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;width:22px;height:22px;border-radius:50%;background:var(--aram);border:2px solid var(--white);box-shadow:0 0 0 4px rgba(180,137,78,.25)}
.feat .feat-tip{position:absolute;left:50%;bottom:150%;transform:translateX(-50%);background:rgba(10,33,56,.9);color:var(--ivory);font-size:.72rem;letter-spacing:.03em;padding:6px 12px;white-space:nowrap;opacity:0;transition:opacity .25s;pointer-events:none}
.feat:hover .feat-tip,.feat:focus-visible .feat-tip{opacity:1}
.wt-hud{position:absolute;top:0;left:0;right:0;z-index:8;display:flex;justify-content:space-between;align-items:flex-start;padding:20px clamp(16px,2.4vw,32px);background:linear-gradient(180deg,rgba(10,33,56,.58),transparent)}
.hud-left{display:flex;flex-direction:column;gap:4px;color:var(--ivory)}
.hud-room{font-family:var(--display);font-size:clamp(1.1rem,1.8vw,1.55rem)}
.hud-progress{font-size:.72rem;letter-spacing:.28em;color:var(--aram-soft)}
.hud-right{display:flex;gap:10px;align-items:center}
.hud-area{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(244,240,231,.7);margin-right:4px}
.hud-btn{color:var(--ivory);font-size:.7rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;border:1px solid rgba(244,240,231,.4);padding:11px 15px;min-height:44px;background:rgba(10,33,56,.35);transition:background .3s,border-color .3s}
.hud-btn:hover,.hud-btn[aria-pressed="true"]{background:rgba(18,63,112,.75);border-color:var(--aram)}
.wt-hint{position:absolute;left:50%;bottom:66px;transform:translateX(-50%);z-index:8;color:var(--ivory);font-size:.78rem;letter-spacing:.08em;background:rgba(10,33,56,.6);padding:9px 18px;text-align:center}
.wt-overlay{position:absolute;inset:0;z-index:10;display:grid;place-items:center;background:rgba(10,33,56,.58);backdrop-filter:blur(7px)}
.wt-overlay-card{text-align:center;color:var(--ivory);padding:24px;max-width:640px}
.wt-overlay-card .eyebrow{justify-content:center;color:var(--aram-soft)}
.wt-overlay-card h3,.wt-overlay-card .serif-xl{color:var(--ivory);margin-bottom:28px}
.wt-end-ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.wt-overlay .btn-solid{background:var(--ivory);color:var(--ink);border-color:var(--ivory)}
.wt-overlay .btn-line{color:var(--ivory)}
.wt-tray{display:flex;gap:8px;overflow-x:auto;padding:14px clamp(16px,4vw,64px);background:var(--ink);scrollbar-width:none}
.wt-tray::-webkit-scrollbar{display:none}
.wt-tray button{flex:0 0 auto;color:var(--ivory);font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;border:1px solid rgba(244,240,231,.3);padding:12px 18px;min-height:44px;transition:background .3s,border-color .3s}
.wt-tray button[aria-current="true"]{background:var(--heritage);border-color:var(--aram)}
.wt-noscript{display:grid;gap:4px;padding:20px clamp(16px,4vw,64px)}
@media(max-width:720px){
  .wt-stage{height:74svh}
  .hud-area{display:none}
  .hud-btn{padding:11px 12px}
  .hud-room{font-size:1.05rem}
  .wt-hint{bottom:auto;top:80px}
}

/* ════════ PRICING ════════ */
#pricing{background:var(--paper);padding:clamp(80px,12vh,150px) clamp(20px,4.5vw,64px)}
.pr-head{max-width:1240px;margin:0 auto clamp(40px,6vh,64px)}
.pr-context{font-family:var(--display);font-size:clamp(1.15rem,1.8vw,1.5rem);color:var(--heritage);max-width:40ch;line-height:1.35;font-weight:400}
.pr-compare{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,2.6vw,36px)}
.pr-plan{border:1px solid var(--line);background:var(--cream);padding:clamp(26px,3vw,42px);display:flex;flex-direction:column}
.pr-plan-head{margin-bottom:26px}
.pr-plan-head h3{margin-bottom:8px}
.pr-plan-sub{font-size:.84rem;letter-spacing:.04em;color:var(--muted);text-transform:uppercase;font-weight:600}
.pr-rows{display:flex;flex-direction:column}
.pr-row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:15px 0;border-bottom:1px solid var(--line)}
.pr-k{font-size:.98rem;color:var(--text)}
.pr-v{font-family:var(--display);font-size:1.4rem;color:var(--ink)}
.pr-total{border-bottom:none;margin-top:6px;padding-top:20px;border-top:2px solid var(--ink)}
.pr-total .pr-k{font-weight:600;letter-spacing:.02em}
.pr-total .pr-v{font-size:clamp(1.8rem,2.6vw,2.3rem);color:var(--heritage)}
.pr-couple{margin-top:18px;font-size:.94rem;color:var(--muted)}
.pr-couple .num{font-family:var(--display);font-size:1.2rem;color:var(--ink)}
.pr-muted{color:var(--muted);font-style:italic}
.pr-details{margin-top:22px;border-top:1px solid var(--line);padding-top:18px}
.pr-details summary{font-size:.82rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--heritage);cursor:pointer;list-style:none;display:flex;align-items:center;gap:10px}
.pr-details summary::-webkit-details-marker{display:none}
.pr-details summary::before{content:"+";font-size:1.1rem;color:var(--aram)}
.pr-details[open] summary::before{content:"–"}
.pr-details ul{list-style:none;margin-top:16px;display:flex;flex-direction:column;gap:10px}
.pr-details li{position:relative;padding-left:20px;font-size:.92rem;color:var(--muted);line-height:1.5}
.pr-details li::before{content:"";position:absolute;left:0;top:.65em;width:8px;height:1px;background:var(--aram)}
.pr-planned{display:inline-block;font-size:.66rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--aram);border:1px solid var(--aram-soft);padding:1px 7px;margin-left:6px;vertical-align:middle}
.pr-notes{max-width:1240px;margin:clamp(30px,4vh,44px) auto 0;border-top:1px solid var(--line);padding-top:20px}
.pr-notes summary{font-size:.82rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);cursor:pointer}
.pr-notes ul{list-style:none;margin-top:16px;display:flex;flex-direction:column;gap:8px;max-width:74ch}
.pr-notes li{position:relative;padding-left:20px;font-size:.86rem;color:var(--muted)}
.pr-notes li::before{content:"";position:absolute;left:0;top:.7em;width:8px;height:1px;background:var(--line)}
.pr-unconfirmed{color:var(--aram)!important;font-family:var(--sans)!important;font-size:.94rem!important;font-style:italic;letter-spacing:0}
@media(max-width:820px){.pr-compare{grid-template-columns:1fr}}

/* ════════ SUPPORT ════════ */
#support{background:var(--ivory)}
.sup-pin{min-height:100svh;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,80px);align-items:center;padding:calc(var(--nav-h) + 4vh) clamp(20px,4.5vw,64px) 8vh}
.sup-visual{position:relative;background:var(--paper);border:1px solid var(--line);overflow:hidden}
.sup-visual img{width:100%;height:auto;object-fit:contain;opacity:.96}
.sup-markers{position:absolute;inset:0;pointer-events:none}
.sup-marker{position:absolute;transform:translate(-50%,-50%);width:20px;height:20px}
.sup-marker::before{content:"";position:absolute;inset:0;border-radius:50%;background:var(--aram);opacity:0;transform:scale(.4);transition:opacity .5s,transform .5s var(--ease)}
.sup-marker::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px solid var(--aram);opacity:0;transition:opacity .5s}
.sup-marker.on::before{opacity:1;transform:scale(1)}
.sup-marker.on::after{opacity:.5}
.sup-copy .sup-list{list-style:none;counter-reset:sup;margin:32px 0 26px;position:relative}
.sup-list li{position:relative;padding:16px 0 16px 46px;border-bottom:1px solid var(--line);counter-increment:sup;transition:opacity .4s,transform .4s var(--ease)}
.sup-list li:last-child{border-bottom:none}
.sup-list li::before{content:counter(sup,decimal-leading-zero);position:absolute;left:0;top:18px;font-family:var(--sans);font-size:.72rem;font-weight:600;letter-spacing:.1em;color:var(--aram);font-variant-numeric:tabular-nums}
html.js.motion .sup-list li{opacity:.32}
html.js.motion .sup-list li.on{opacity:1}
.su-i{display:block;font-family:var(--display);font-size:clamp(1.2rem,2vw,1.65rem);color:var(--ink)}
.su-d{display:block;font-size:.92rem;color:var(--muted);margin-top:3px}
.sup-note{font-size:.84rem;color:var(--muted);border-left:1px solid var(--aram-soft);padding-left:18px;max-width:52ch;line-height:1.55}
@media(max-width:900px){
  .sup-pin{grid-template-columns:1fr;align-items:start;padding-top:12vh}
  .sup-visual{order:2;margin-top:24px}
  .sup-copy{order:1}
  html.js.motion .sup-list li{opacity:1}
}

/* ════════ FAMILY WINDOW ════════ */
#familywindow{background:var(--ink);color:var(--ivory);padding:clamp(90px,14vh,170px) clamp(20px,4.5vw,64px);position:relative;overflow:hidden}
#familywindow::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--river),transparent)}
.fw-grid{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(40px,6vw,100px);align-items:center}
#familywindow h2{color:var(--ivory);font-weight:360}
#familywindow .body-l{color:rgba(244,240,231,.82)}
.fw-planned{list-style:none;margin:34px 0;columns:2;column-gap:36px}
.fw-planned li{padding:11px 0;border-bottom:1px solid rgba(111,157,187,.2);font-size:.92rem;letter-spacing:.02em;break-inside:avoid;color:rgba(244,240,231,.9)}
.fw-privacy{font-size:.88rem;color:var(--river);border-left:1px solid var(--river);padding-left:20px;max-width:46ch}
.fw-device-wrap{display:grid;place-items:center}
.fw-device{width:min(360px,100%);background:linear-gradient(165deg,#0f3050,var(--ink));border:1px solid rgba(180,137,78,.3);padding:26px 24px 20px;position:relative;box-shadow:0 40px 80px rgba(0,0,0,.4)}
.fwd-head{display:flex;justify-content:space-between;align-items:center;font-size:.78rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--aram-soft);padding-bottom:16px;border-bottom:1px solid rgba(111,157,187,.25)}
.fwd-status{display:flex;align-items:center;gap:8px;color:var(--ivory);letter-spacing:.05em;text-transform:none;font-weight:500}
.fwd-status i{width:8px;height:8px;border-radius:50%;background:#7FB08B;box-shadow:0 0 10px rgba(127,176,139,.8)}
.fwd-feed{padding:8px 0}
.fwd-item{display:flex;gap:18px;align-items:baseline;padding:15px 0;border-bottom:1px solid rgba(111,157,187,.14)}
html.js.motion .fwd-item{opacity:0;transform:translateY(12px)}
.fi-t{font-size:.8rem;color:var(--river);min-width:3.2em}
.fi-x{font-size:.96rem;color:var(--ivory)}
.fwd-tag{margin-top:16px;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(111,157,187,.75);text-align:center}
@media(max-width:900px){.fw-grid{grid-template-columns:1fr}.fw-planned{columns:1}}

/* ════════ TRUST ════════ */
#trust{background:var(--cream);padding:clamp(80px,12vh,150px) clamp(20px,4.5vw,64px)}
.tr-grid{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(36px,5vw,80px);align-items:center}
.tr-portrait-frame{aspect-ratio:4/5;background:linear-gradient(160deg,var(--stone),#c8bda8);border:1px solid var(--line);display:grid;place-items:center;position:relative}
.tr-portrait-frame::after{content:"";position:absolute;inset:12px;border:1px solid rgba(180,137,78,.4)}
.tr-portrait-note{font-size:.74rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.tr-copy h2{font-weight:360}
.tr-letter{margin:28px 0;padding:22px 26px;background:var(--paper);border-left:2px solid var(--aram)}
.tr-letter p{font-family:var(--display);font-size:clamp(1.1rem,1.6vw,1.4rem);color:var(--text);line-height:1.4;font-style:italic}
.tr-parent{font-size:.86rem;letter-spacing:.03em;color:var(--muted)}
.tr-parent .wm-serif{font-family:var(--display);color:var(--ink);font-size:1.05rem}
@media(max-width:820px){.tr-grid{grid-template-columns:1fr}.tr-portrait-frame{aspect-ratio:3/2;max-height:340px}}

/* ════════ RESERVE ════════ */
#reserve{background:var(--paper);padding:clamp(90px,14vh,170px) clamp(20px,4.5vw,64px)}
.rv-inner{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,100px)}
.rv-trust{list-style:none;margin:30px 0;display:flex;flex-wrap:wrap;gap:0 28px}
.rv-trust li{position:relative;padding:8px 0 8px 20px;font-size:.9rem;letter-spacing:.02em;color:var(--muted)}
.rv-trust li::before{content:"";position:absolute;left:0;top:50%;width:8px;height:1px;background:var(--aram)}
.rv-note{font-family:var(--display);font-size:1.25rem;color:var(--heritage)}
.rv-form{display:grid;grid-template-columns:1fr 1fr;gap:20px 22px}
.pf-field{display:flex;flex-direction:column;gap:8px}
.pf-wide{grid-column:1/-1}
.pf-field label{font-size:.7rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.pf-field input,.pf-field select{border:none;border-bottom:1px solid var(--stone);background:transparent;padding:10px 2px;font:inherit;color:var(--text);border-radius:0;min-height:44px}
.pf-field input:focus,.pf-field select:focus{outline:none;border-bottom-color:var(--heritage)}
.pf-consent{grid-column:1/-1;display:flex;gap:12px;align-items:flex-start;font-size:.84rem;color:var(--muted);line-height:1.55}
.pf-consent input{width:20px;height:20px;min-width:20px;margin-top:2px;accent-color:var(--heritage)}
.pf-actions{grid-column:1/-1;display:flex;gap:14px;flex-wrap:wrap;margin-top:6px}
.pf-err{grid-column:1/-1;color:#9A3B2C;font-size:.9rem;font-weight:500}
.rv-confirm h3{margin-bottom:14px}
.rv-confirm p{max-width:44ch;color:var(--muted)}
@media(max-width:900px){.rv-inner{grid-template-columns:1fr}.rv-form{grid-template-columns:1fr}}

/* ════════ FOOTER ════════ */
footer{background:var(--ink);color:rgba(244,240,231,.75);padding:clamp(60px,9vh,100px) clamp(20px,4.5vw,64px) 40px}
.ft-inner{max-width:1240px;margin:0 auto}
.ft-logo{height:52px;width:auto;margin-bottom:6px}
.ft-brand .wm-serif{font-family:var(--display);font-size:1.5rem;color:var(--ivory)}
.ft-parent{display:block;font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;color:var(--river);margin-top:10px}
.ft-property{font-family:var(--display);font-size:1.15rem;color:var(--aram-soft);margin-top:12px}
.ft-links{display:flex;gap:26px;flex-wrap:wrap;margin:30px 0 26px}
.ft-links a,.ft-links button{color:var(--ivory);font-size:.8rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid rgba(244,240,231,.25);padding:6px 0;transition:border-color .3s}
.ft-links a:hover,.ft-links button:hover{border-color:var(--aram)}
.ft-status{font-family:var(--display);font-size:1.15rem;color:var(--ivory);margin-bottom:18px}
.ft-legal{font-size:.8rem;line-height:1.7;max-width:78ch;color:rgba(244,240,231,.55)}
.ft-copy{margin-top:26px;font-size:.74rem;color:rgba(244,240,231,.45)}

/* ════════ LOGO SAFE ZONE ════════ */
.aram-logo-safe-zone{height:48px;display:flex;align-items:center;justify-content:center}
.cfg-media .aram-logo-safe-zone,.spec-pin .aram-logo-safe-zone{height:44px}
.aram-logo-safe-zone .safe-logo{height:26px;width:auto;opacity:.85}
@media(max-width:640px){.aram-logo-safe-zone{height:38px}}

/* ════════ MODALS ════════ */
.modal{position:fixed;inset:0;z-index:500;display:grid;place-items:center;background:rgba(10,33,56,.72);backdrop-filter:blur(6px);padding:20px}
.modal[hidden]{display:none}
.modal-card{background:var(--cream);max-width:540px;width:100%;max-height:90vh;overflow:auto;padding:clamp(28px,5vw,48px);position:relative;display:flex;flex-direction:column;gap:16px}
.modal-wide .modal-card{max-width:680px}
.modal-card h3{font-size:1.9rem}
.modal-close{position:absolute;top:14px;right:14px;padding:12px;font-size:1rem;color:var(--ink);z-index:3}
#lmBody{font-size:.92rem;color:var(--muted);line-height:1.7}
#lmBody p{margin-bottom:12px}
.rm-demo-note{font-size:.9rem;color:var(--muted)}

/* ════════ QUESTIONNAIRE ════════ */
.q-card{gap:0}
.q-top{margin-bottom:22px}
.q-progress{height:2px;background:var(--line);margin:14px 0 8px;position:relative;overflow:hidden}
.q-progress span{position:absolute;left:0;top:0;height:100%;width:25%;background:var(--aram);transition:width .4s var(--ease)}
.q-step-label{font-size:.74rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.q-step{border:none;padding:0;margin:0}
.q-step legend{font-family:var(--display);font-size:clamp(1.4rem,2.4vw,1.9rem);color:var(--ink);margin-bottom:20px;padding:0}
.q-field{margin-bottom:20px}
.q-field label,.q-legend{display:block;font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.q-legend em{font-style:normal;text-transform:none;letter-spacing:0;color:var(--aram);font-weight:500}
.q-field input{width:100%;border:none;border-bottom:1px solid var(--stone);background:transparent;padding:10px 2px;font:inherit;color:var(--text);min-height:44px}
.q-field input:focus{outline:none;border-bottom-color:var(--heritage)}
.q-chips{display:flex;flex-wrap:wrap;gap:9px}
.q-chips button{border:1px solid var(--line);background:var(--paper);color:var(--text);font-size:.86rem;letter-spacing:.01em;padding:10px 16px;min-height:44px;transition:background .25s,border-color .25s,color .25s}
.q-chips button:hover{border-color:var(--aram-soft)}
.q-chips button[aria-pressed="true"]{background:var(--heritage);border-color:var(--heritage);color:var(--ivory)}
.q-actions{display:flex;gap:14px;justify-content:space-between;margin-top:26px;padding-top:22px;border-top:1px solid var(--line)}
.q-actions .btn-solid{margin-left:auto}
.q-confirm{text-align:left}
.q-confirm .eyebrow{color:var(--aram)}
.q-confirm h3{margin-bottom:14px}
.q-summary{margin:24px 0;display:grid;grid-template-columns:auto 1fr;gap:10px 20px}
.q-summary dt{font-size:.74rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.q-summary dd{font-size:.96rem;color:var(--ink)}
.q-confirm-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:20px}

/* reduced-motion niceties */
html.no-motion .spec-list li,html.no-motion .spec-stack span,html.no-motion .spec-stack-label,
html.no-motion .fwd-item{opacity:1!important;transform:none!important}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .scroll-cue span,.cfg-media img{animation:none;transition:none}
}
