:root{
  --pine:#070F0C;
  --pine-2:#0A1410;
  --mist:#EFF1EC;
  --fog:#8A988F;
  --slate:#394D45;
  --brass:#BE9350;

  --ff-d:'Kalnia','Cormorant Garamond',Georgia,serif;
  --ff-b:'Inter Tight','Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --out:cubic-bezier(.19,1,.22,1);
  --soft:cubic-bezier(.33,0,.15,1);
  --g:clamp(18px,4.2vw,72px);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:clip;-webkit-text-size-adjust:100%}
body{background:#07203f;color:var(--mist);font-family:var(--ff-b);font-weight:300;line-height:1.6;overflow-x:clip;-webkit-font-smoothing:antialiased}
img,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
::selection{background:var(--brass);color:var(--pine)}

.eyebrow{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--fog);display:block}
/* screen-reader / SEO-only H1 — present for crawlers & accessibility, visually
   hidden via the clip technique (NOT display:none, which search engines discount) */
.vl-seo-h1{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.line{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.line>span{display:block;will-change:transform}

/* ---------- loader ---------- */
#loader{position:fixed;inset:0;z-index:999;background:var(--pine);display:flex;flex-direction:column;align-items:center;justify-content:center}
.ld-logo-wrap{position:relative;width:clamp(210px,44vw,470px)}
.ld-logo{display:block;width:100%;height:auto}
.ld-shine{position:absolute;inset:0;overflow:hidden;pointer-events:none;-webkit-mask:url(../images/logo/logo.svg) center/contain no-repeat;mask:url(../images/logo/logo.svg) center/contain no-repeat}
.ld-shine__bar{position:absolute;top:-20%;bottom:-20%;left:0;width:38%;background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.65),rgba(255,255,255,0));transform:skewX(-12deg);will-change:transform}
#loader .lb{position:absolute;left:var(--g);right:var(--g);bottom:calc(var(--g) - 6px);height:1px;background:rgba(239,241,236,.12)}
#loader .lb i{display:block;height:100%;width:100%;transform:scaleX(0);transform-origin:left;background:var(--brass)}

/* ---------- nav ---------- */
.nav{position:fixed;top:0;left:0;width:100%;z-index:500;display:flex;align-items:center;justify-content:space-between;padding:26px var(--g);color:var(--mist)}
.nav::before{content:"";position:absolute;inset:0;height:120px;background:linear-gradient(rgba(7,15,12,.5),rgba(7,15,12,0));pointer-events:none;z-index:-1}
.nav__mark{font-family:var(--ff-d);font-size:16px;letter-spacing:.42em;text-transform:uppercase;display:flex;align-items:center}
.nav__mark img{display:block;height:clamp(34px,3.6vw,46px);width:auto}
.nav__links{display:flex;gap:34px;font-size:10px;letter-spacing:.22em;text-transform:uppercase}
.nav__links a{position:relative;padding-bottom:5px}
.nav__links a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .7s var(--out)}
.nav__links a:hover::after{transform:scaleX(1);transform-origin:left}
@media(max-width:820px){.nav__links a:not(.cta){display:none}}

/* ---------- hero ---------- */
.hero{position:relative;height:170svh}
.hero__stick{position:sticky;top:0;height:100svh;overflow:hidden;background:#000}
.hero__frame{position:absolute;inset:0;will-change:clip-path}
.hero__frame video,.hero__frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;will-change:transform}
.hero__scrim{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(7,15,12,.4),rgba(7,15,12,0) 30%,rgba(7,15,12,0) 64%,rgba(7,15,12,.72));pointer-events:none}
.hero__cue{position:absolute;left:50%;bottom:34px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:13px;font-size:9px;letter-spacing:.34em;text-transform:uppercase;color:rgba(239,241,236,.55);z-index:3}
.hero__cue i{width:1px;height:54px;background:linear-gradient(rgba(190,147,80,.9),rgba(190,147,80,0));animation:fall 3.2s var(--soft) infinite}
@keyframes fall{0%{transform:scaleY(0);transform-origin:top}42%{transform:scaleY(1);transform-origin:top}58%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
/* mobile: a plain one-screen video hero, no pin / no scrubbed recede — the
   pinned 170svh version made scrolling feel long and janky on phones */
@media(max-width:760px){
  .hero{height:100svh}
  .hero__stick{position:relative;height:100svh}
  .hero__frame{clip-path:none!important}
}

/* ---------- intro ---------- */
.intro{padding:20vh var(--g) 16vh;max-width:1560px;margin:0 auto;background:#07203f}
.intro p{font-family:var(--ff-d);font-size:clamp(23px,3.2vw,48px);line-height:1.32;max-width:23ch}
.intro .w{color:rgba(239,241,236,.14)}
.intro .w.on{color:var(--mist)}
.intro .w.hi.on{color:var(--brass)}
.intro__facts{margin-top:14vh;display:grid;grid-template-columns:repeat(4,1fr);gap:28px;border-top:1px solid rgba(239,241,236,.11);padding-top:26px}
.intro__facts .k{display:block;font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--fog);margin-bottom:11px}
.intro__facts .v{display:block;font-family:var(--ff-d);font-size:clamp(15px,1.6vw,22px)}
@media(max-width:760px){.intro{padding:9vh var(--g) 7vh}.intro__facts{grid-template-columns:1fr 1fr;gap:22px;margin-top:8vh}}

/* ---------- lift ---------- */
/* Height is just the pin buffer now — floors advance via discrete stepping
   (vilasa-motion.js), not scroll distance, so this stays small for a clean exit. */
/* Tall enough to give the scrubbed floor reveals scroll distance (~70svh per
   floor). Floors glide with scroll and snap to settle (see vilasa-motion.js). */
.lift{position:relative;height:600svh;background:#000}
@media(max-width:760px){.lift{height:480svh}}
/* isolation:isolate creates a dedicated stacking context for the lift so
   clip-path compositing is contained and doesn't trigger full-page repaints */
.lift__stage{position:sticky;top:0;height:100svh;overflow:hidden;isolation:isolate}
.panel{position:absolute;inset:0;clip-path:inset(100% 0 0 0);will-change:clip-path}
.panel:first-child{clip-path:inset(0% 0 0 0)}
.panel__img{position:absolute;inset:-7% 0;will-change:transform}
.panel__img img{width:100%;height:100%;object-fit:cover}
.panel__slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;backface-visibility:hidden}
.panel__slide:first-child{opacity:1}
.panel__scrim{position:absolute;inset:0;background:linear-gradient(to top,rgba(7,15,12,.95) 0%,rgba(7,15,12,.82) 22%,rgba(7,15,12,.46) 40%,rgba(7,15,12,.06) 66%,rgba(7,15,12,.5) 100%),linear-gradient(to right,rgba(7,15,12,.5),rgba(7,15,12,0) 58%)}
.panel__cap{position:absolute;left:var(--g);right:var(--g);bottom:clamp(72px,10vh,128px);z-index:2;display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(20px,5vw,80px);align-items:end}
.panel__cat{margin-bottom:18px;color:rgba(239,241,236,.66)}
.panel__t{font-family:var(--ff-d);font-weight:400;font-size:clamp(31px,5.6vw,86px);line-height:1.02;letter-spacing:-.012em}
.panel__t .two{color:var(--brass)}
.panel__l{font-size:clamp(13px,1.3vw,16px);color:rgba(239,241,236,.76);max-width:32ch;padding-bottom:.15em}
@media(max-width:860px){.panel__cap{grid-template-columns:1fr;gap:14px;bottom:60px}}

.odo{position:absolute;left:var(--g);top:clamp(96px,14vh,150px);z-index:4;display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.odo__lbl{font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:var(--brass)}
.odo__w{height:1em;overflow:hidden;font-family:var(--ff-d);font-size:clamp(38px,6.4vw,96px);line-height:1}
.odo__s{will-change:transform}
.odo__s b{display:block;font-weight:400;height:1em;line-height:1}
.odo__tot{margin-top:2px;font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:rgba(239,241,236,.5)}
.prog{position:absolute;right:var(--g);top:50%;transform:translateY(-50%);z-index:4;display:flex;flex-direction:column;gap:13px;align-items:flex-end}
.prog i{display:block;width:14px;height:1px;background:rgba(239,241,236,.6);box-shadow:0 0 12px rgba(7,15,12,.6);transition:.75s var(--out)}
.prog i.on{width:46px;height:2px;background:var(--brass)}
/* Mobile keeps the pinned/scrubbed lift, just a shorter scroll span so floors
   advance with less scrolling (smoothness comes from Lenis syncTouch). */
@media(max-width:760px){.prog{display:none}.odo{top:80px}}

/* per-floor slider controls */
.panel__slider{position:absolute;right:var(--g);bottom:clamp(28px,4.5vh,54px);z-index:6;display:flex;align-items:center;gap:13px}
.panel__arrow{width:clamp(44px,3.4vw,54px);height:clamp(44px,3.4vw,54px);border-radius:50%;border:1px solid rgba(239,241,236,.4);color:var(--mist);display:grid;place-items:center;background:rgba(7,15,12,.3);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:background .45s var(--out),border-color .45s var(--out),color .45s var(--out),transform .5s var(--out)}
.panel__arrow:hover{background:var(--brass);border-color:var(--brass);color:var(--pine)}
.panel__arrow:active{transform:scale(.9)}
.panel__arrow svg{width:17px;height:17px;transition:transform .5s var(--out)}
.panel__arrow--prev:hover svg{transform:translateX(-3px)}
.panel__arrow--next:hover svg{transform:translateX(3px)}
.panel__count{font-family:var(--ff-d);font-size:15px;letter-spacing:.12em;color:rgba(239,241,236,.65);min-width:58px;text-align:center}
.panel__count b{font-weight:400;color:var(--mist)}
@media(max-width:760px){.panel__slider{bottom:18px;gap:10px}.panel__arrow{width:42px;height:42px}}

/* ---------- gallery ---------- */
.gal{position:relative;background:#07203f}
.gal__stick{position:sticky;top:0;height:100svh;overflow:hidden;display:flex;align-items:center}
.gal__track{display:flex;align-items:center;gap:clamp(16px,2.6vw,46px);padding:0 var(--g);will-change:transform}
.gal__intro{flex:none;width:clamp(240px,26vw,380px);padding-right:clamp(8px,2vw,34px)}
.gal__intro h2{font-family:var(--ff-d);font-weight:400;font-size:clamp(30px,4vw,56px);line-height:1.06;margin:20px 0 18px}
.gal__intro h2 b{font-weight:400;color:var(--brass)}
.gal__intro p{font-size:13.5px;color:var(--fog);max-width:26ch}
.gal__item{flex:none}
.gal__item .box{overflow:hidden;height:min(62vh,620px)}
.gal__item.wide .box{aspect-ratio:3/2}
.gal__item.tall .box{aspect-ratio:4/5}
.gal__item img{width:100%;height:100%;object-fit:cover;transform:scale(1.02);transition:transform 1.6s var(--out)}
.gal__item:hover img{transform:scale(1.07)}
.gal__item .cap{display:flex;gap:16px;padding-top:15px;font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--fog)}
.gal__item .cap b{font-weight:400;color:var(--brass)}
@media(max-width:760px){
  .gal{height:auto!important}
  .gal__stick{position:static;height:auto;padding:12vh 0;display:block}
  .gal__track{flex-direction:column;align-items:stretch;gap:34px;transform:none!important}
  .gal__intro{width:auto;padding-right:0}
  .gal__item .box{height:auto;aspect-ratio:3/2!important}
}

/* ---------- features & benefits (image-led mosaic) ---------- */
/* on desktop .feat lifts UP over the pinned gallery's held last frame,
   the same pinned-section overlap the gallery uses (brass edge + top shadow). */
.feat{position:relative;z-index:2;background:#07203f;padding:clamp(78px,13vh,150px) var(--g)}
.feat::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(190,147,80,.55),transparent);z-index:4}
@media(min-width:761px){
  .feat{margin-top:-100svh;min-height:100svh;box-shadow:0 -34px 70px -22px rgba(0,0,0,.7)}
}
.feat__head{max-width:1560px;margin:0 auto clamp(34px,5vh,58px);display:flex;justify-content:space-between;align-items:flex-end;gap:34px 60px;flex-wrap:wrap}
.feat__title{font-family:var(--ff-d);font-weight:400;font-size:clamp(30px,4.6vw,60px);line-height:1.04;letter-spacing:-.015em;margin:12px 0 0;max-width:18ch}
.feat__title b{font-weight:400;color:var(--brass)}
.feat__lede{font-size:clamp(13.5px,1.4vw,16px);color:var(--fog);line-height:1.75;max-width:40ch;flex:0 1 40ch}

.feat__grid{max-width:1560px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(176px,25vh,290px);gap:12px}
.feat__card{position:relative;overflow:hidden;border-radius:3px;isolation:isolate;background:var(--pine-2);display:block}
.feat__card:nth-child(1){grid-column:span 2;grid-row:span 2}
.feat__card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.02);transition:transform 1.1s var(--out);filter:saturate(.94)}
.feat__card:hover img{transform:scale(1.08)}
.feat__card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(7, 32, 63, 0) 34%, rgb(4 17 34 / 63%) 68%, rgba(4, 17, 34, .9) 100%);z-index:1}
.feat__cap{position:absolute;left:0;bottom:0;z-index:2;padding:clamp(16px,2vw,26px);width:100%}
.feat__no{font-family:var(--ff-d);font-size:12px;letter-spacing:.14em;color:var(--brass);display:block;margin-bottom:9px}
.feat__card h3{font-family:var(--ff-d);font-weight:400;font-size:clamp(17px,1.5vw,21px);line-height:1.14;letter-spacing:-.01em;color:var(--mist);margin:0}
.feat__card:nth-child(1) h3{font-size:clamp(24px,2.7vw,38px)}
.feat__card p{font-size:13.5px;color:rgba(239,241,236,.72);line-height:1.6;margin:9px 0 0;max-width:34ch;opacity:1;transform:translateY(6px);transition:opacity .5s var(--out),transform .5s var(--out)}
.feat__card:nth-child(1) p{opacity:1;transform:none;font-size:13.5px;max-width:40ch}
.feat__card:hover p{opacity:1;transform:none}
.feat__card::before{content:"";position:absolute;inset:0;z-index:3;box-shadow:inset 0 0 0 1px rgba(239,241,236,.07);border-radius:3px;pointer-events:none}

@media(max-width:900px){
  .feat__grid{grid-template-columns:1fr 1fr;grid-auto-rows:clamp(150px,30vw,220px)}
  .feat__card:nth-child(1){grid-column:span 2;grid-row:span 1;aspect-ratio:16/10}
  .feat__card p{opacity:1;transform:none}
}
@media(max-width:560px){
  .feat__grid{grid-template-columns:1fr;grid-auto-rows:auto}
  .feat__card{aspect-ratio:3/2}
  .feat__card:nth-child(1){aspect-ratio:3/2}
}

/* ---------- investor opportunity (coded banner over investor-bg.webp) ---------- */
.case{background:#05131f}
.case__pin{display:block;position:relative;isolation:isolate;min-height:92svh;overflow:hidden;color:var(--mist)}
.case__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.03)}
@media (max-width:768px) {
  .case__bg{
    object-position:left;
  }
}
.case__scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(4,11,20,.9) 0%,rgba(4,11,20,.62) 40%,rgba(4,11,20,.12) 68%,transparent 82%),linear-gradient(to top,rgba(4,11,20,.55),transparent 38%)}
.case__inner{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:center;padding:clamp(80px,12vh,150px) var(--g);max-width:760px}
.case__eyebrow{color:var(--brass);margin-bottom:18px}
.case__title{font-family:var(--ff-d);font-weight:400;font-size:clamp(34px,5.4vw,74px);line-height:1.02;letter-spacing:-.015em}
.case__title b{font-weight:400;color:var(--brass)}
.case__sub{margin-top:18px;font-size:clamp(14px,1.5vw,18px);color:rgba(239,241,236,.82);max-width:42ch}
.case__cta{align-self:flex-start;margin-top:clamp(24px,3.6vh,38px)}
.case__benes{display:flex;list-style:none;margin:clamp(28px,4.4vh,48px) 0 0;padding:0}
.case__bene{display:flex;flex-direction:column;gap:12px;padding:0 clamp(16px,1.7vw,28px)}
.case__bene:first-child{padding-left:0}
.case__bene+.case__bene{border-left:1px solid rgba(239,241,236,.2)}
.case__ico{color:var(--brass)}
.case__ico svg{width:clamp(26px,2.4vw,32px);height:clamp(26px,2.4vw,32px);display:block}
.case__bene-t{font-size:11px;letter-spacing:.13em;text-transform:uppercase;line-height:1.5;color:rgba(239,241,236,.92)}
.case__foot{margin-top:clamp(26px,4.4vh,48px);font-family:var(--ff-d);font-size:clamp(13px,1.3vw,17px);letter-spacing:.02em;line-height:1.35;color:var(--brass)}

/* desktop: pin the banner full-screen so the enquire panel rises up over it,
   restoring the walkthrough-style close */
@media(min-width:761px){
  .case{position:sticky;top:0;height:100svh;z-index:1;overflow:hidden}
  .case__pin{height:100%;min-height:0}
}
@media(max-width:560px){
  .case__scrim{background:linear-gradient(to top,rgba(4,11,20,.92) 8%,rgba(4,11,20,.55) 48%,rgba(4,11,20,.3))}
  .case__inner{justify-content:flex-start;padding-top:clamp(96px,16vh,150px);max-width:none}
  .case__benes{flex-wrap:wrap;gap:22px 0}
  .case__bene{flex:0 0 50%;padding:0 8px}
  .case__bene:first-child{padding-left:8px}
  .case__bene+.case__bene{border-left:none}
}

/* enquire + colophon ride up over the pinned banner. Opaque navy ground so it
   cleanly covers it; a brass hairline + soft shadow read the lifting edge. */
.rise{position:relative;z-index:2;background:#07203f;box-shadow:0 -34px 70px -22px rgba(0,0,0,.7)}
.rise::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(190,147,80,.55),transparent);z-index:3}

/* ---------- enquire ---------- */
.enq{padding:16vh var(--g) 9vh}
.enq__grid{max-width:1560px;margin:0 auto;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(38px,7vw,110px);align-items:start}
.enq h2{font-family:var(--ff-d);font-weight:400;font-size:clamp(38px,6.4vw,104px);line-height:1.02;margin:22px 0 34px}
.enq h2 b{font-weight:400;color:var(--brass)}
.enq__info{font-size:13.5px;color:var(--fog);line-height:2.2;border-top:1px solid rgba(239,241,236,.11);padding-top:24px}
.enq__info a{transition:color .45s var(--soft)}
.enq__info a:hover{color:var(--brass)}
.field{margin-bottom:30px}
.field label{display:block;font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--fog)}
.field input,.field select{width:100%;background:rgba(239,241,236,.05);border:1px solid rgba(239,241,236,.26);border-radius:8px;padding:13px 15px;color:var(--mist);font-family:var(--ff-b);font-size:15px;font-weight:400;outline:none;transition:border-color .4s var(--soft),background .4s}
.field select option{background:var(--pine-2)}
.field input:focus,.field select:focus{border-color:var(--brass);background:rgba(239,241,236,.08)}
.btn{position:relative;display:inline-flex;align-items:center;gap:16px;border:1px solid rgba(239,241,236,.24);padding:18px 32px;border-radius:100px;font-size:10px;letter-spacing:.24em;text-transform:uppercase;overflow:hidden}
.btn span{position:relative;z-index:2;transition:color .6s var(--out)}
.btn::before{content:"";position:absolute;inset:0;background:var(--brass);transform:translateY(101%);transition:transform .7s var(--out)}
.btn:hover::before{transform:translateY(0)}
.btn:hover span{color:var(--pine)}
@media(max-width:860px){.enq__grid{grid-template-columns:1fr}}

/* ---------- footer ---------- */
.foot{padding:0 var(--g) 34px}
/* lead: a brand statement + a real CTA, so the footer opens with a purpose
   instead of a generic link grid */
.foot__lead{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;padding:clamp(44px,8vh,96px) 0 clamp(34px,5.5vh,60px);border-top:1px solid rgba(239,241,236,.1)}
.foot__stmt{font-family:var(--ff-d);font-weight:400;font-size:clamp(26px,3.6vw,50px);line-height:1.04;letter-spacing:-.012em;color:var(--mist)}
.foot__cta{flex:none}
.foot__top{display:grid;grid-template-columns:1.5fr .9fr 1.1fr 1.1fr;gap:clamp(24px,4vw,64px);padding:clamp(40px,6vh,64px) 0 clamp(36px,5vh,56px);border-top:1px solid rgba(239,241,236,.1);border-bottom:1px solid rgba(239,241,236,.1);margin-bottom:clamp(30px,5vh,56px)}
.foot__logo{height:clamp(56px,6.4vw,84px);width:auto;display:block;margin-bottom:20px}
.foot__brand p{font-size:13.5px;color:var(--fog);line-height:1.85;max-width:42ch}
.foot__col{display:flex;flex-direction:column;align-items:flex-start;gap:12px;font-size:13.5px}
.foot__h{font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--brass);margin-bottom:8px}
.foot__col a{color:var(--mist);opacity:.82;transition:color .4s var(--soft),opacity .4s}
.foot__col a:hover{color:var(--brass);opacity:1}
.foot__addr{color:var(--fog);line-height:1.7}
.foot__addr b{display:block;font-weight:400;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:rgba(239,241,236,.45);margin-bottom:3px}
@media(max-width:960px){.foot__top{grid-template-columns:1fr 1fr;gap:34px}}
@media(max-width:560px){.foot__top{grid-template-columns:1fr}}
/* masthead: an intentional wordmark (NOT stretched edge-to-edge, the template
   tell) paired with the brand line */
.foot__mark{display:flex;align-items:flex-end;justify-content:space-between;gap:18px 40px;flex-wrap:wrap;border-bottom:1px solid rgba(239,241,236,.12);padding-bottom:16px;margin-bottom:24px}
.foot__big{font-family:var(--ff-d);font-size:clamp(46px,12.5vw,186px);line-height:1;letter-spacing:.02em;white-space:nowrap;overflow:hidden;display:flex}
.foot__big b{font-weight:400;display:inline-block}
.foot__tag{font-family:var(--ff-d);font-style:italic;font-size:clamp(15px,1.9vw,27px);color:var(--brass);white-space:nowrap;padding-bottom:.5em;opacity:.92}
.foot__row{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--fog)}
.foot__row a:hover{color:var(--brass)}
.foot__cr{display:inline-flex;align-items:baseline;gap:8px}
.foot__cr b{font-family:var(--ff-d);font-weight:400;font-size:16px;letter-spacing:.06em;text-transform:none;color:var(--brass)}
.foot__soc{display:inline-flex;align-items:center;gap:16px}
.foot__soc a{color:var(--fog);display:inline-flex;transition:color .4s var(--soft),transform .4s var(--out)}
.foot__soc a:hover{color:var(--brass);transform:translateY(-2px)}
.foot__soc svg{width:18px;height:18px;display:block}
.foot__dis{margin-top:28px;font-size:10px;line-height:1.9;color:rgba(138,152,143,.42);max-width:82ch}

/* ---- premium refinements ---- */
.foot{position:relative;isolation:isolate}
/* a warm dusk glow rising behind the wordmark — turns the flat black into atmosphere */
.foot::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(74% 52% at 50% 97%,rgba(190,147,80,.09),transparent 60%)}
/* hairlines that fade out at the edges instead of hard full-width rules */
.foot__lead,.foot__top,.foot__mark{border-color:transparent;
  border-image:linear-gradient(90deg,transparent,rgba(239,241,236,.18),transparent) 1}
/* solid, confident wordmark — a soft warm off-white (the metallic gradient read
   as AI). --mist toned down slightly so it isn't a stark, glaring white. */
.foot__big b{color:rgba(239,241,236,.88)}
/* an animated brass underline draws in under the column links on hover */
.foot__col>a{position:relative}
.foot__col>a::after{content:"";position:absolute;left:0;bottom:-3px;width:100%;height:1px;
  background:var(--brass);transform:scaleX(0);transform-origin:right;transition:transform .55s var(--out)}
.foot__col>a:hover::after{transform:scaleX(1);transform-origin:left}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition-duration:.01ms!important}
  .panel{clip-path:none!important;position:relative;height:100svh}
  .lift{height:auto}.lift__stage{position:static;height:auto}
  .hero{height:100svh}.hero__stick{position:static}
}

/* ===== WordPress theme integration ===== */
/* header.php wraps output in <main id="main">; the front page ships its own
   .nav + .foot, so main is a passthrough with no box of its own. */
#main{max-width:none;margin:0;padding:0}

/* ===== ConnecTribe enquiry form, reskinned to the varition-two dark look =====
   The embed injects its own markup with INLINE styles (white card, boxed
   inputs), so every rule here needs !important to win. Scoped to the embed's
   container id so nothing else is touched; the form + submission stay intact. */
#sp-form-enquire-form-hzsqiw{color:var(--mist)}
#sp-form-enquire-form-hzsqiw .sp-form-wrap{
  background:transparent!important;max-width:none!important;margin:0!important;
  padding:0!important;border-radius:0!important;font-family:var(--ff-b)!important}
/* ConnecTribe repeats a title + intro; the section already has its own H2, so hide them */
#sp-form-enquire-form-hzsqiw .sp-form-wrap>h2,
#sp-form-enquire-form-hzsqiw .sp-form-wrap>p:first-of-type{display:none!important}
/* two fields per row; the last two (Interest, Message) span the full width */
#sp-form-enquire-form-hzsqiw form{display:grid!important;grid-template-columns:1fr 1fr!important;gap:20px 20px!important}
#sp-form-enquire-form-hzsqiw form>div{margin:0!important}
#sp-form-enquire-form-hzsqiw form>div:nth-child(5),
#sp-form-enquire-form-hzsqiw form>div:nth-child(6){grid-column:1 / -1!important}
#sp-form-enquire-form-hzsqiw form>div{display:flex!important;flex-direction:column!important;gap:8px!important}
@media(max-width:560px){#sp-form-enquire-form-hzsqiw form{grid-template-columns:1fr!important}}
/* labels, small uppercase */
#sp-form-enquire-form-hzsqiw label{
  font-family:var(--ff-b)!important;font-size:9.5px!important;letter-spacing:.24em!important;
  text-transform:uppercase!important;color:var(--fog)!important;font-weight:400!important;
  margin-bottom:2px!important}
#sp-form-enquire-form-hzsqiw label span{color:var(--brass)!important}
/* inputs, underline only */
#sp-form-enquire-form-hzsqiw input,
#sp-form-enquire-form-hzsqiw select,
#sp-form-enquire-form-hzsqiw textarea{
  background:rgba(239,241,236,.05)!important;border:1px solid rgba(239,241,236,.26)!important;
  border-radius:8px!important;
  padding:13px 15px!important;color:var(--mist)!important;font-family:var(--ff-b)!important;
  font-size:15px!important;font-weight:400!important;transition:border-color .4s var(--soft),background .4s!important}
#sp-form-enquire-form-hzsqiw textarea{resize:vertical!important;min-height:120px!important}
#sp-form-enquire-form-hzsqiw input:focus,
#sp-form-enquire-form-hzsqiw select:focus,
#sp-form-enquire-form-hzsqiw textarea:focus{border-color:var(--brass)!important;background:rgba(239,241,236,.08)!important}
#sp-form-enquire-form-hzsqiw ::placeholder{color:rgba(239,241,236,.5)!important;opacity:1!important}
/* select, custom caret so it reads on dark */
#sp-form-enquire-form-hzsqiw select{
  appearance:none!important;-webkit-appearance:none!important;padding-right:40px!important;
  background-color:rgba(239,241,236,.05)!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23BE9350' stroke-width='1.5' d='M1 1l5 5 5-5'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;background-position:right 15px center!important}
#sp-form-enquire-form-hzsqiw select option{background:var(--pine-2)!important;color:var(--mist)!important}
/* submit, the pill button */
#sp-submit-enquire-form-hzsqiw{
  width:auto!important;display:inline-flex!important;align-items:center!important;
  background:transparent!important;color:var(--mist)!important;
  border:1px solid rgba(239,241,236,.24)!important;border-radius:100px!important;
  padding:18px 32px!important;margin-top:20px!important;font-family:var(--ff-b)!important;
  font-size:10px!important;letter-spacing:.24em!important;text-transform:uppercase!important;
  font-weight:400!important;transition:background .5s var(--out),color .5s var(--out)!important}
#sp-submit-enquire-form-hzsqiw::after{content:"\2192";margin-left:14px;font-size:13px}
#sp-submit-enquire-form-hzsqiw:hover{background:var(--brass)!important;color:var(--pine)!important;opacity:1!important}
/* error message, tuned to the palette */
#sp-error-enquire-form-hzsqiw{
  background:rgba(190,147,80,.08)!important;border:1px solid rgba(190,147,80,.4)!important;
  color:var(--brass)!important;border-radius:0!important}
/* keep the ConnecTribe attribution but make it subtle + left aligned */
#sp-form-enquire-form-hzsqiw .sp-form-wrap>p:last-of-type{
  text-align:left!important;color:rgba(138,152,143,.5)!important;margin-top:22px!important}
#sp-form-enquire-form-hzsqiw .sp-form-wrap>p:last-of-type a{color:var(--brass)!important}

/* ===== scroll-triggered enquiry popup =====
   Reuses the single Connectribe embed: the live form node is moved into
   #enqPopSlot on open and returned to the enquire section on close, so there
   is never a duplicate embed id. GSAP drives the reveal; base state below keeps
   it inert (no pointer capture, no flash) until opened. */
.enqpop{position:fixed;inset:0;z-index:900;display:flex;align-items:center;justify-content:center;padding:24px;pointer-events:none;visibility:hidden}
.enqpop.is-open{pointer-events:auto;visibility:visible}
.enqpop__scrim{position:absolute;inset:0;background:rgba(3,7,5,.74);backdrop-filter:blur(10px) saturate(120%);-webkit-backdrop-filter:blur(10px) saturate(120%);opacity:0;cursor:pointer}
.enqpop__panel{position:relative;width:min(960px,100%);max-height:88svh;display:grid;grid-template-columns:.82fr 1fr;
  background:linear-gradient(180deg,#0C1712,#0A1410);border:1px solid rgba(190,147,80,.28);border-radius:16px;
  box-shadow:0 44px 130px -34px rgba(0,0,0,.82),0 0 0 1px rgba(239,241,236,.03) inset;
  opacity:0;overflow:hidden;will-change:transform,opacity}
/* left: dusk render */
.enqpop__media{position:relative;overflow:hidden;min-height:100%}
.enqpop__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.04)}
.enqpop__media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(7,15,12,.05),rgba(7,15,12,.5) 78%,rgba(10,20,16,.92)),
             linear-gradient(90deg,transparent 60%,rgba(10,20,16,.72))}
.enqpop__media-cap{position:absolute;left:22px;bottom:20px;z-index:2;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgba(239,241,236,.86)}
.enqpop__media-cap b{color:var(--brass);font-weight:400}
/* right: heading + form */
.enqpop__body{position:relative;padding:clamp(28px,3vw,44px);overflow-y:auto;overflow-x:hidden;max-height:88svh;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.enqpop__body::before{content:"";position:absolute;top:0;left:0;height:2px;width:64px;background:var(--brass)}
.enqpop__body::-webkit-scrollbar{width:8px}
.enqpop__body::-webkit-scrollbar-thumb{background:rgba(239,241,236,.16);border-radius:8px}
.enqpop__x{position:absolute;top:15px;right:15px;width:42px;height:42px;border-radius:50%;
  border:1px solid rgba(239,241,236,.2);color:var(--mist);display:grid;place-items:center;
  background:rgba(7,15,12,.35);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);z-index:3;
  transition:background .45s var(--out),border-color .45s var(--out),color .45s var(--out),transform .55s var(--out)}
.enqpop__x:hover{background:var(--brass);border-color:var(--brass);color:var(--pine);transform:rotate(90deg)}
.enqpop__x svg{width:18px;height:18px}
.enqpop .eyebrow{margin-bottom:14px}
.enqpop__t{font-family:var(--ff-d);font-weight:400;line-height:1.03;letter-spacing:-.01em;font-size:clamp(28px,3.3vw,40px);margin-bottom:14px}
.enqpop__t b{font-weight:400;color:var(--brass)}
.enqpop__sub{font-size:13px;color:var(--fog);line-height:1.7;max-width:48ch;margin-bottom:26px}
.enqpop__form{min-height:40px}
@media(max-width:760px){
  .enqpop__panel{grid-template-columns:1fr}
  .enqpop__media{min-height:0;height:150px}
  .enqpop__media img{transform:none}
  .enqpop__media::after{background:linear-gradient(180deg,rgba(7,15,12,.15),rgba(10,20,16,.92))}
  .enqpop__body{max-height:calc(88svh - 150px)}
}
@media(max-width:560px){.enqpop{padding:14px}.enqpop__panel{border-radius:14px}}
@media (prefers-reduced-motion:reduce){.enqpop__scrim,.enqpop__panel{opacity:1}}