/* ==========================================================================
   STATUS Real Estate — responsive build

   The Figma file is drawn on a 1512px frame. Every size here is that
   frame's size at 1512px, expressed so it flows:

     type     clamp(min, design-px / 15.12 vw, cap)
              — the design size at 1512, never below a readable floor on a
                phone, and never past a ceiling on a 2560 screen.
     space    the same, for gutters and section rhythm.
     images   full-bleed photographs span the viewport; framed ones keep
              the design's proportion as an aspect-ratio and fill their
              column, so they resize with the screen instead of scaling as
              a picture.

   Layout breakpoints: ≥1100 desktop (the design) · 700–1099 tablet ·
   <700 phone.
   ========================================================================== */

/* ---------------------------------------------------------------- tokens */
:root{
  --green:#1D332B;
  --green-2:#17291F;
  --green-3:#243b32;
  --gold:#D1C08C;
  --cream:#E0DCDA;
  --white:#FFFFFF;
  --line:rgba(255,255,255,.9);
  --line-soft:rgba(255,255,255,.22);
  --muted:rgba(255,255,255,.62);

  --display:'Cormorant Upright', 'Cormorant Garamond', Georgia, serif;
  --sans:'DM Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  /* design px at 1512 → vw, with a floor and a ceiling */
  --t-giant: clamp(2.9rem, 8.2vw, 7.4rem);     /* 135 in the file */
  --t-hero:  clamp(2.35rem, 6.1vw, 5.55rem);   /* 95 */
  --t-h2:    clamp(1.9rem, 3.4vw, 3.2rem);     /* 50–58 */
  --t-h3:    clamp(1.35rem, 2.55vw, 2.35rem);  /* 40, DM Sans caps */
  --t-label: clamp(1.02rem, 1.9vw, 1.75rem);   /* 30, DM Sans caps */
  --t-lead:  clamp(1.06rem, 1.6vw, 1.45rem);   /* 25 */
  --t-body:  clamp(1rem, 1.28vw, 1.22rem);     /* 20 */
  --t-small: clamp(.8rem, .98vw, .94rem);      /* 15 */
  --t-tiny:  clamp(.7rem, .76vw, .74rem);      /* 11.3 */

  --gutter: clamp(20px, 3.3vw, 56px);          /* 49–76 in the file */
  --gap: clamp(14px, 1.6vw, 26px);
  --section: clamp(72px, 9.5vw, 156px);
  --maxw: 1512px;

  --ease: cubic-bezier(.16,1,.3,1);
  --ease-io: cubic-bezier(.77,0,.18,1);
}

/* ---------------------------------------------------------------- reset */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{
  margin:0;background:var(--green);color:var(--white);
  font-family:var(--sans);font-size:var(--t-body);font-weight:300;line-height:1.5;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
img,video,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,h4,p,figure,blockquote{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
::selection{background:var(--gold);color:var(--green)}
:focus-visible{outline:1px solid var(--gold);outline-offset:4px}
.skip{position:fixed;left:12px;top:-60px;z-index:300;background:var(--gold);color:var(--green);
  padding:10px 16px;transition:top .3s var(--ease)}
.skip:focus{top:12px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ----------------------------------------------------------- typography */
.display{font-family:var(--display);font-weight:300;text-transform:uppercase;letter-spacing:0;line-height:.95}
.t-giant{font-size:var(--t-giant);line-height:.92}
.t-hero{font-size:var(--t-hero)}
.t-h2{font-size:var(--t-h2);line-height:1}
.h3{font-family:var(--sans);font-weight:500;text-transform:uppercase;font-size:var(--t-h3);line-height:1.08;letter-spacing:0}
.label{font-family:var(--sans);font-weight:500;text-transform:uppercase;font-size:var(--t-label);line-height:1.12}
.lead{font-size:var(--t-lead);line-height:1.38;font-weight:300}
.body{font-size:var(--t-body);line-height:1.5;font-weight:300}
.eyebrow{font-size:var(--t-small);font-weight:500;text-transform:uppercase;letter-spacing:.04em;opacity:.62}
.small{font-size:var(--t-small)}
.measure{max-width:44em}
.measure-s{max-width:34em}
.center{text-align:center}
.center .measure,.center .measure-s{margin-inline:auto}
.gold{color:var(--gold)}
.ink{color:var(--green)}
.muted{opacity:.62}

/* --------------------------------------------------------------- layout */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:var(--section)}
.section--tight{padding-block:calc(var(--section) * .55)}
.stack>*+*{margin-top:clamp(14px,1.6vw,26px)}
.stack-l>*+*{margin-top:clamp(22px,2.6vw,42px)}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gutter)}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.rule{height:1px;background:var(--line);border:0;margin:0}
.rule--soft{background:var(--line-soft)}

/* photographs: full-bleed bands and framed pictures */
.band{position:relative;width:100%;overflow:hidden;aspect-ratio:var(--ar, 1512/517);background:var(--green-2)}
.frame{position:relative;overflow:hidden;aspect-ratio:var(--ar, 4/3);background:var(--green-2)}
.band>img,.frame>img,.band>video,.frame>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.band figcaption,.frame-cap{font-size:var(--t-small);font-weight:500;text-transform:uppercase;opacity:.6;
  padding:clamp(12px,1.4vw,22px) var(--gutter) 0}
[data-parallax]>img{height:118%;top:-9%}

/* ------------------------------------------------------ calls to action */
/* The design's CTA: text sitting in a shallow bracket — a rule underneath
   with short uprights at both ends. */
.bracket{position:relative;display:inline-flex;align-items:flex-end;justify-content:center;
  padding:0 1.4em .15em;font-size:var(--t-body);font-weight:300;text-transform:lowercase;line-height:1.1;
  transition:color .35s ease}
.bracket::after{content:"";position:absolute;left:0;right:0;bottom:-.72em;height:.72em;
  border:1px solid currentColor;border-top:0;transition:border-color .35s ease,transform .5s var(--ease)}
.bracket span{position:relative;transition:transform .5s var(--ease)}
.bracket:hover{color:var(--gold)}
.bracket:hover span{transform:translateY(-3px)}
.bracket--wide{min-width:min(100%,26em)}
.bracket--caps{text-transform:uppercase}
.bracket-row{display:flex;justify-content:center;padding-bottom:.8em}

.sweep{position:relative;display:inline-block}
.sweep::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:right;transition:transform .55s var(--ease)}
.sweep:hover::after{transform:scaleX(1);transform-origin:left}
.arrow-link{display:inline-flex;align-items:center;gap:.6em;font-size:var(--t-small);font-weight:500;
  text-transform:uppercase;letter-spacing:.04em;color:var(--gold)}
.arrow-link svg{width:1.4em;height:1.4em;fill:none;stroke:currentColor;stroke-width:1.2;transition:transform .5s var(--ease)}
.arrow-link:hover svg{transform:translateX(5px)}

/* ------------------------------------------------------------- wordmark */
.wordmark{width:100%;height:auto;fill:currentColor}

/* ------------------------------------------------------------- loader */
.loader{position:fixed;inset:0;z-index:400;background:var(--green);display:grid;place-items:center}
.loader__mark{width:min(56vw,640px);color:var(--white);opacity:.92}
.loader__bar{position:absolute;left:50%;bottom:22vh;width:min(46vw,460px);height:1px;
  transform:translateX(-50%);background:var(--line-soft);overflow:hidden}
.loader__bar i{display:block;height:100%;width:0;background:var(--gold)}
.loader__num{position:absolute;right:var(--gutter);bottom:5vh;font-size:.8rem;letter-spacing:.2em;opacity:.55;
  font-variant-numeric:tabular-nums}
html.is-loading,html.is-loading body{overflow:hidden}

/* ---------------------------------------------------------------- topbar
   Transparent over the hero, a compact bar with the small wordmark once the
   page has scrolled; it steps out of the way while you read downwards and
   comes back as soon as you scroll up. */
.topbar{position:fixed;top:0;left:0;right:0;z-index:120;display:flex;align-items:center;justify-content:space-between;
  gap:var(--gap);padding:clamp(14px,1.9vw,30px) var(--gutter);
  transition:transform .6s var(--ease),background-color .5s ease,padding .5s var(--ease),backdrop-filter .5s ease}
.topbar__logo{width:clamp(96px,9vw,150px);opacity:0;transform:translateY(-8px);pointer-events:none;
  transition:opacity .45s ease,transform .6s var(--ease)}
.topbar__right{display:flex;align-items:center;gap:clamp(18px,3vw,48px);margin-left:auto}
.topbar__cta{font-size:var(--t-body)}
.topbar.is-scrolled{background:rgba(23,41,31,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  padding-block:clamp(10px,1vw,16px)}
.topbar.is-scrolled .topbar__logo{opacity:1;transform:none;pointer-events:auto}
.topbar.is-hidden{transform:translateY(-110%)}
.page-light .topbar:not(.is-scrolled){color:var(--green)}

.burger{display:inline-flex;align-items:center;gap:12px}
.burger__lines{position:relative;display:block;width:clamp(44px,5.3vw,80px);height:21px}
.burger__lines i{position:absolute;left:0;right:0;height:1px;background:currentColor;transition:transform .55s var(--ease),right .55s var(--ease)}
.burger__lines i:first-child{top:0}
.burger__lines i:last-child{bottom:0;right:28%}
.burger:hover .burger__lines i:first-child{transform:translateY(4px)}
.burger:hover .burger__lines i:last-child{right:0;transform:translateY(-4px)}
.burger__label{font-size:var(--t-small);text-transform:uppercase;letter-spacing:.14em;font-weight:400}

/* ------------------------------------------------------------------ menu
   A dark panel that opens from the top in two parts: a photograph on the
   left that follows the link under the pointer, and the index on the right,
   numbered, set in the display face, arriving line by line. */
.menu{position:fixed;inset:0;z-index:200;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  background:transparent;color:var(--white)}
.menu[hidden]{display:none}
.menu__media{position:relative;overflow:hidden;background:var(--green-2);clip-path:inset(0 0 100% 0)}
.menu__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.12);
  transition:opacity .9s ease,transform 6s linear}
.menu__media img.is-on{opacity:1;transform:scale(1.02)}
.menu__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(23,41,31,.15),rgba(23,41,31,.72))}
.menu__caption{position:absolute;left:var(--gutter);bottom:clamp(24px,4vw,56px);z-index:2;display:grid;gap:8px;max-width:70%}
.menu__caption-k{font-size:var(--t-small);letter-spacing:.24em;opacity:.7}
.menu__caption [data-menu-caption]{font-family:var(--display);font-size:var(--t-h2);text-transform:uppercase;line-height:1}
.menu__panel{position:relative;display:flex;flex-direction:column;background:var(--green);
  padding:clamp(18px,2.2vw,34px) var(--gutter) clamp(22px,3vw,44px);clip-path:inset(0 0 100% 0);overflow:auto}
.menu__top{display:flex;align-items:center;gap:var(--gap)}
.menu__logo{width:clamp(96px,8vw,136px);flex:none}
.menu__search{position:relative;flex:1;display:flex;align-items:center;gap:10px;max-width:420px;margin-inline:auto;
  border-bottom:1px solid var(--line-soft);padding:6px 0;transition:border-color .35s ease}
.menu__search:focus-within{border-color:var(--gold)}
.menu__search svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.3;opacity:.7;flex:none}
.menu__search input{flex:1;min-width:0;background:none;border:0;outline:none;color:inherit;font:inherit;
  font-size:var(--t-body)}
.menu__search input::placeholder{color:rgba(255,255,255,.5)}
.menu__results{position:absolute;left:0;right:0;top:calc(100% + 8px);display:grid;background:var(--green-2);
  border:1px solid var(--line-soft);z-index:3}
.menu__results:empty{display:none}
.menu__results a{padding:10px 14px;font-size:var(--t-body);transition:background-color .25s ease}
.menu__results a:hover,.menu__results a:focus{background:var(--green-3);outline:none}
.menu__close{position:relative;width:48px;height:48px;border:1px solid var(--line-soft);border-radius:50%;flex:none;
  transition:border-color .35s ease,transform .6s var(--ease)}
.menu__close i{position:absolute;left:14px;right:14px;top:50%;height:1px;background:currentColor}
.menu__close i:first-child{transform:rotate(45deg)}
.menu__close i:last-child{transform:rotate(-45deg)}
.menu__close:hover{border-color:var(--gold);transform:rotate(90deg)}
.menu__nav{display:flex;flex-direction:column;justify-content:center;flex:1;gap:clamp(2px,.6vh,10px);
  padding-block:clamp(26px,5vh,70px)}
.menu__link{position:relative;display:flex;align-items:baseline;gap:clamp(12px,1.6vw,26px);overflow:hidden;
  font-family:var(--display);font-weight:300;text-transform:uppercase;line-height:1.02;
  font-size:clamp(2.2rem,5.2vw,5.4rem);padding-block:.04em}
.menu__link em{font-style:normal;font-family:var(--sans);font-size:var(--t-small);letter-spacing:.1em;opacity:.5;
  transform:translateY(-1.6em);transition:color .4s ease,opacity .4s ease}
.menu__link span{display:inline-block;transition:transform .7s var(--ease),color .4s ease}
.menu__link::after{content:"";position:absolute;left:clamp(34px,3.4vw,52px);right:0;bottom:.08em;height:1px;background:var(--gold);
  transform:scaleX(0);transform-origin:left;transition:transform .8s var(--ease)}
.menu__link:hover span,.menu__link:focus-visible span{transform:translateX(.18em);color:var(--gold)}
.menu__link:hover em{opacity:1;color:var(--gold)}
.menu__link:hover::after{transform:scaleX(1)}
.menu__link.is-current span{color:var(--gold)}
.menu__group{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:clamp(18px,2.4vw,40px)}
.menu__sub{display:flex;flex-wrap:wrap;gap:6px 22px;padding-left:clamp(34px,3.4vw,52px)}
.menu__sub a{font-size:var(--t-small);text-transform:uppercase;letter-spacing:.08em;font-weight:400;opacity:.7;
  transition:opacity .3s ease,color .3s ease}
.menu__sub a:hover{opacity:1;color:var(--gold)}
.menu__foot{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:18px;
  border-top:1px solid var(--line-soft);padding-top:clamp(16px,2vw,26px)}
.menu__info{display:grid;grid-template-columns:auto 1fr;gap:4px 18px;font-size:var(--t-small)}
.menu__k{opacity:.5;text-transform:uppercase;letter-spacing:.08em}
.menu__lang{display:flex;align-items:center;gap:14px;font-size:var(--t-small);letter-spacing:.1em}
.menu__lang button{opacity:.5;padding:4px 0;border-bottom:1px solid transparent;transition:opacity .3s ease,border-color .3s ease}
.menu__lang button.is-on{opacity:1;border-color:var(--gold)}
.menu__lang-note{flex-basis:100%;max-width:260px;font-size:var(--t-tiny);opacity:.65;letter-spacing:0}
.menu__lang-note:empty{display:none}
body.menu-open{overflow:hidden}

/* -------------------------------------------------------------- the hero */
.hero{position:relative;min-height:max(100svh,620px);display:flex;flex-direction:column;overflow:hidden;isolation:isolate}
.hero__media{position:absolute;inset:0;z-index:-2;background:var(--green-2)}
.hero__media img,.hero__media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero__media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(23,41,31,.46) 0%,rgba(23,41,31,.1) 38%,rgba(23,41,31,.62) 100%)}
.hero__wordmark{padding:clamp(18px,1.6vw,26px) calc(var(--gutter) * .7) 0;color:var(--white)}
.hero__bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:clamp(10px,1.4vw,24px) var(--gutter) 0}
.hero__cta{min-width:min(100%,clamp(220px,33.6vw,508px))}
/* on a page that opens with the hero, the fixed bar waits until it has scrolled */
.has-hero .topbar:not(.is-scrolled){opacity:0;pointer-events:none}
.topbar{transition:transform .6s var(--ease),background-color .5s ease,padding .5s var(--ease),opacity .4s ease}
.hero__body{margin-top:auto;padding:0 var(--gutter) clamp(60px,9vh,120px);max-width:min(100%,760px)}
.hero__body .display{margin-bottom:clamp(14px,1.8vw,28px)}
.hero__body .body{max-width:24em;margin-bottom:clamp(26px,3vw,44px)}
.hero__cue{position:absolute;right:var(--gutter);bottom:clamp(24px,4vh,48px);display:grid;justify-items:center;gap:10px;
  font-size:var(--t-tiny);letter-spacing:.24em;text-transform:uppercase;opacity:.75}
.hero__cue i{width:1px;height:56px;background:currentColor;transform-origin:top;animation:cue 2.4s var(--ease) infinite}
@keyframes cue{0%{transform:scaleY(0)}45%{transform:scaleY(1);transform-origin:top}46%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* inner-page hero: a photograph with the page title set large over it */
.phero{position:relative;min-height:clamp(420px,60vh,700px);display:flex;align-items:flex-end;overflow:hidden;isolation:isolate}
.phero__media{position:absolute;inset:0;z-index:-1}
.phero__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.phero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(23,41,31,.35),rgba(23,41,31,.2) 40%,rgba(23,41,31,.85))}
.phero__body{padding:clamp(110px,14vh,170px) var(--gutter) clamp(34px,5vw,70px);width:100%;max-width:var(--maxw);margin-inline:auto}

/* ------------------------------------------------ strip (pinned sideways) */
.hscroll{position:relative}
.hscroll__sticky{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.hscroll__track{display:flex;gap:9px;will-change:transform;padding-inline:var(--gutter)}
.tile{position:relative;flex:none;width:clamp(280px,42vw,900px);color:var(--green)}
.tile__img{position:relative;aspect-ratio:510/515;max-height:62svh;width:100%;overflow:hidden;background:var(--green-2)}
.tile__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.tile:hover .tile__img img{transform:scale(1.06)}
.tile__cap{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--cream);
  padding:clamp(10px,1vw,15px) clamp(14px,1.4vw,22px);font-size:var(--t-small);font-weight:500;text-transform:uppercase}
.tile__cap svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.3;transition:transform .5s var(--ease)}
.tile:hover .tile__cap svg{transform:translate(3px,-3px)}
.hscroll__bar{margin:clamp(22px,3vw,40px) var(--gutter) 0;height:1px;background:var(--line-soft);position:relative}
.hscroll__ctl{display:flex;justify-content:center;gap:clamp(24px,2vw,34px);margin-top:clamp(18px,2.2vw,34px)}
.hscroll__btn{width:clamp(64px,6.2vw,96px);padding:10px 0;transition:opacity .3s ease,transform .45s var(--ease)}
.hscroll__btn svg{width:100%;height:auto;fill:#fff}
.hscroll__btn:hover{transform:translateX(-4px)}
.hscroll__btn[data-hscroll-next]:hover{transform:translateX(4px)}
.hscroll__btn:disabled{opacity:.35;cursor:default;transform:none}
.hscroll__bar i{position:absolute;left:0;top:-1px;height:3px;width:100%;background:var(--white);transform-origin:left;transform:scaleX(0)}

/* ------------------------------------------------------------- split */
.split{display:grid;grid-template-columns:minmax(0,620fr) minmax(0,892fr);min-height:clamp(520px,60vw,912px)}
.split__panel{background:var(--gold);color:var(--green);padding:clamp(40px,6.6vw,100px) var(--gutter) clamp(34px,4vw,60px);
  display:flex;flex-direction:column;justify-content:space-between;gap:40px}
.split__media{position:relative;overflow:hidden;min-height:320px;min-width:0}
.split__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* ------------------------------------------------------------- stats */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);text-align:center}
.stats__n{display:block;font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:var(--t-hero);line-height:1;
  font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}
.stats__l{display:block;margin-top:.5em;font-size:var(--t-label);font-weight:500;text-transform:uppercase;line-height:1.1}

/* ---------------------------------------------------------- process */
.steps{position:relative;margin-top:clamp(40px,5vw,80px)}
.steps__rail{position:relative;height:46px;margin-inline:calc(var(--gutter) * -1)}
.steps__line{position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line)}
.steps__fill{position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--gold);box-shadow:0 0 12px rgba(209,192,140,.6);transition:width .9s var(--ease)}
.steps__dot{position:absolute;bottom:0;left:0;width:46px;height:46px;margin-bottom:-23px;border-radius:50%;background:var(--white);
  box-shadow:0 0 0 8px rgba(209,192,140,.16),0 0 26px rgba(209,192,140,.45);transform:translateX(-50%);transition:left .9s var(--ease)}
.steps__labels{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin-top:34px;gap:10px}
.steps__labels button{text-align:left;font-size:var(--t-label);font-weight:500;text-transform:uppercase;color:var(--gold);
  line-height:1.1;transition:color .45s ease;overflow-wrap:anywhere}
.steps__labels button.is-on{color:var(--white)}
.steps__note{margin-top:clamp(18px,2vw,30px);min-height:3em;opacity:.8}

/* ------------------------------------------------------- core values */
.cvalues{position:relative;max-width:780px;margin:clamp(30px,4vw,60px) auto 0;height:calc(var(--row) * 3);
  --row:clamp(88px,7.2vw,109px);overflow:hidden;text-align:center}
.cvalues__box{position:absolute;left:0;right:0;top:var(--row);height:calc(var(--row) - 14px);margin-top:6px;
  border:1px solid var(--line);border-radius:10px;pointer-events:none}
.cvalues__list{transition:transform .9s var(--ease)}
.cvalues__item{height:var(--row);display:flex;flex-direction:column;justify-content:center;gap:4px;cursor:pointer;
  opacity:.45;transition:opacity .5s ease}
.cvalues__item.is-on{opacity:1}
.cvalues__item .label{line-height:1}
.cvalues__item p{font-size:var(--t-body)}

/* ---------------------------------------------------------- service nav */
.svcnav{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 28px;padding-bottom:clamp(14px,1.4vw,20px);
  border-bottom:1px solid var(--line)}
.svcnav a{font-size:var(--t-label);font-weight:500;text-transform:uppercase;color:var(--gold);transition:color .35s ease}
.svcnav a:hover,.svcnav a.is-on{color:var(--white)}

/* --------------------------------------------------------------- quote */
.quote{border:1px solid var(--line);border-radius:10px;padding:clamp(22px,2.4vw,34px) clamp(22px,2.6vw,40px);
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px 40px;align-items:end}
.quote p{font-size:var(--t-body);max-width:34em}
.quote cite{font-style:normal;font-size:var(--t-small);font-weight:500;text-transform:uppercase}

/* -------------------------------------------------------- testimonials */
.tgrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(18px,2.4vw,40px)}
.tcard{border:1px solid var(--line);border-radius:10px;padding:clamp(22px,2.2vw,32px) clamp(22px,3vw,48px);text-align:center;
  display:flex;flex-direction:column;justify-content:center;gap:14px;transition:background-color .5s ease,transform .8s var(--ease)}
.tcard:hover{background:rgba(255,255,255,.04)}
.tcard p{font-size:var(--t-lead);line-height:1.3}
.tcard cite{font-style:normal;font-size:var(--t-small)}
.tcard{min-width:0}
.tcard--head{grid-column:4 / span 6;background:rgba(217,217,217,.06);border:0;border-radius:6px}
.tcard--a{grid-column:1 / span 4}
.tcard--b{grid-column:6 / span 7;margin-top:18px}
.tcard--c{grid-column:2 / span 6}
.tcard--d{grid-column:8 / span 5;margin-top:-24px}

/* ------------------------------------------------------------ why/timeline */
.why{display:grid;grid-template-columns:minmax(0,458fr) minmax(0,1054fr);gap:var(--gutter);margin-top:clamp(40px,5vw,80px)}
.why__photo{position:sticky;top:clamp(90px,14vh,160px);align-self:start;aspect-ratio:458/357;overflow:hidden}
.why__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.why__list{position:relative;padding-left:clamp(28px,3vw,48px)}
.why__line,.why__fill{position:absolute;left:11px;top:14px;bottom:14px;width:1px;background:var(--line)}
.why__fill{background:var(--gold);box-shadow:0 0 12px rgba(209,192,140,.55);transform-origin:top;transform:scaleY(0);bottom:14px}
.why__item{position:relative;padding-block:clamp(22px,3.4vw,52px);opacity:.36;transition:opacity .6s ease}
.why__item.is-on{opacity:1}
.why__item::before{content:"";position:absolute;left:calc(clamp(28px,3vw,48px) * -1 + 0px);top:calc(clamp(22px,3.4vw,52px) + .2em);
  width:24px;height:24px;border-radius:50%;background:#d9d9d9;transition:background-color .5s ease,box-shadow .5s ease,transform .6s var(--ease)}
.why__item.is-lit::before{background:var(--gold)}
.why__item.is-on::before{transform:scale(1.3);box-shadow:0 0 0 7px rgba(209,192,140,.18),0 0 22px rgba(209,192,140,.6)}
.why__item .label{max-width:18em}
.why__item p{margin-top:.6em;font-size:var(--t-lead);max-width:26em}

/* ------------------------------------------------------------ marquee */
.marquee{overflow:hidden;padding-block:clamp(24px,3vw,44px);white-space:nowrap;pointer-events:none}
.marquee__row{display:inline-flex;gap:clamp(24px,3.6vw,56px);padding-right:clamp(24px,3.6vw,56px);will-change:transform}
.marquee span{font-family:var(--sans);font-weight:500;text-transform:uppercase;font-size:clamp(2.4rem,5.2vw,5rem);opacity:.13}
.marquee em{font-style:normal;color:var(--gold);opacity:.5}

/* ------------------------------------------------------------- showreel */
.reel{position:relative;min-height:clamp(420px,48vw,760px);overflow:hidden;display:flex;align-items:flex-end;isolation:isolate;cursor:pointer}
.reel__media{position:absolute;inset:0;z-index:-1;background:#122019}
.reel__media img,.reel__media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.reel__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(16,30,25,.15),rgba(16,30,25,.78))}
.reel__body{width:100%;max-width:var(--maxw);margin-inline:auto;padding:0 var(--gutter) clamp(34px,5vw,70px);
  display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.play{flex:none;width:clamp(76px,6.4vw,100px);aspect-ratio:1;border-radius:50%;border:1px solid rgba(255,255,255,.55);
  display:grid;place-items:center;align-content:center;gap:4px;background:rgba(16,30,25,.3);backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);transition:background-color .4s ease,transform .6s var(--ease)}
.play:hover{background:rgba(209,192,140,.28);transform:scale(1.06)}
.play svg{width:26px;height:26px;fill:currentColor}
.play span{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase}
.play .play__pause{display:none;width:14px;height:17px;border-left:3px solid currentColor;border-right:3px solid currentColor}
.play.is-playing svg{display:none}
.play.is-playing .play__pause{display:block}

/* ----------------------------------------------------------- districts */
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{border:1px solid var(--line-soft);padding:.62em 1.3em;font-size:var(--t-small);text-transform:uppercase;letter-spacing:.08em;
  transition:background-color .35s ease,color .35s ease,border-color .35s ease}
.chip:hover{border-color:var(--gold)}
.chip.is-on{background:var(--cream);border-color:var(--cream);color:var(--green)}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(40px,4vw,64px) var(--gap)}
.card{transition:opacity .5s ease,filter .5s ease}
.card.is-out{opacity:.14;filter:grayscale(1);pointer-events:none}
.card .frame{aspect-ratio:436/480}
.card .frame img{transition:transform 1.2s var(--ease)}
.card:hover .frame img{transform:scale(1.05)}
.card h3{margin-top:clamp(14px,1.4vw,22px);font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(1.4rem,2vw,1.9rem);line-height:1}
.card p{margin-top:.5em;font-size:clamp(.95rem,1.12vw,1.06rem);opacity:.7}

/* ----------------------------------------------------------- inner pages */
.subnav{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 30px;padding:clamp(94px,11vh,130px) var(--gutter) clamp(12px,1.2vw,18px);
  max-width:var(--maxw);margin-inline:auto;border-bottom:1px solid var(--line)}
.subnav a{font-size:var(--t-label);font-weight:500;text-transform:uppercase;color:var(--gold);transition:color .35s ease}
.subnav a:hover,.subnav a.is-on{color:var(--white)}
.duo{display:grid;grid-template-columns:repeat(2,minmax(0,480px));justify-content:center;gap:clamp(28px,2vw,40px) clamp(40px,2.4vw,60px)}
.duo p{margin-top:.7em;font-size:var(--t-lead)}
.gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.gallery .frame{aspect-ratio:328/400}
.cta-band{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 40px;align-items:end;border-top:1px solid var(--line-soft);
  padding-top:clamp(28px,3.4vw,50px)}

/* --------------------------------------------------------- accordions */
.acc{border-bottom:1px solid var(--line)}
.acc__head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:24px;text-align:left;
  padding:clamp(12px,1.2vw,18px) clamp(8px,.7vw,12px);transition:color .35s ease}
.acc__head:hover{color:var(--gold)}
.acc__arrow{flex:none;width:32px;height:16px;fill:currentColor;transition:transform .55s var(--ease)}
.acc.is-open .acc__arrow{transform:rotate(90deg)}
.acc__body{height:0;overflow:hidden}
.acc__body>div{padding:0 clamp(8px,.7vw,12px) clamp(16px,1.6vw,26px);max-width:52em}
.acc__body p+p,.acc__body ul{margin-top:.8em}
.acc__body ul li::before{content:"– "}

.qa{border-bottom:2px solid var(--line)}
.qa .acc__head{font-size:var(--t-label);font-weight:400;text-transform:uppercase;padding-inline:clamp(10px,1vw,15px)}

/* ------------------------------------------------------------- about */
.cards3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.pcard{border:1px solid var(--line);margin-left:-1px;padding:clamp(28px,2.6vw,40px) clamp(24px,3.6vw,60px) clamp(34px,4vw,60px);
  display:flex;flex-direction:column;gap:clamp(40px,11vw,190px);min-height:clamp(420px,46vw,694px);
  transition:background-color .6s ease,color .6s ease}
.pcard.is-on{background:var(--white);color:var(--green)}
.pcard .display{font-size:var(--t-h2)}
.pcard .label{margin-top:auto}
.pcard p{margin-top:clamp(18px,3vw,50px)}

.approach{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:20px;row-gap:0;align-items:start}
.approach__tab{grid-row:1}
.approach__tab{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line);
  padding:clamp(22px,2.2vw,34px) clamp(18px,2.6vw,40px);text-align:left;transition:color .35s ease}
.approach__tab:hover{color:var(--gold)}
.approach__tab svg{flex:none;width:30px;height:15px;fill:currentColor;transition:transform .55s var(--ease)}
.approach__tab.is-open svg{transform:rotate(90deg)}
.approach__panel{grid-row:2;grid-column:var(--col,1);min-height:15em;border:1px solid rgba(29,51,43,.8);background:rgba(29,51,43,.2);
  padding:clamp(18px,1.6vw,26px) clamp(22px,2.9vw,44px);min-height:13em;transition:opacity .4s ease}

.vision{position:relative}
.vision__sticky{position:sticky;top:0;height:100svh;display:flex;align-items:center;overflow:hidden}
.vision__track{display:flex;align-items:stretch;height:min(916px,80svh);will-change:transform}
.vision__gold{flex:none;width:max(300px,36vw);background:var(--gold);color:var(--green);
  padding:clamp(40px,6vw,92px) clamp(24px,2.3vw,35px) clamp(28px,4vw,60px);display:flex;flex-direction:column}
.vision__gold .h3{margin-bottom:.3em}
.vision__gold .body{margin-top:auto}
.vision__photo{flex:none;width:max(420px,62vw);position:relative;overflow:hidden}
.vision__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vision__text{flex:none;width:max(300px,34vw);max-width:620px;padding:clamp(28px,3vw,43px) clamp(24px,3.7vw,56px);align-self:flex-start}

.team{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,1.2vw,16px) clamp(24px,1.2vw,16px)}
.team .frame{aspect-ratio:670/459}
.team h3{margin-top:clamp(18px,2vw,30px);font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:var(--t-h2);line-height:1}
.team .role{margin-top:.5em;font-size:var(--t-small);font-weight:500;text-transform:uppercase}
.team p{margin-top:1em}

.film{display:grid;grid-template-columns:minmax(0,881fr) minmax(0,631fr);align-items:stretch}
.film__media{position:relative;min-height:clamp(380px,60vw,911px);overflow:hidden;cursor:pointer;background:#122019}
.film__media img,.film__media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.film__media .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
.film__media .play:hover{transform:translate(-50%,-50%) scale(1.06)}
.film__text{padding:clamp(30px,6vw,90px) var(--gutter);display:flex;flex-direction:column;justify-content:center;gap:24px}

/* ------------------------------------------------------------ services */
.tabs{display:grid;grid-template-columns:minmax(0,955fr) minmax(0,470fr);gap:clamp(30px,4vw,80px)}
.tabs__panel{min-height:34em}
.tabs__offers{display:grid;gap:clamp(18px,2.2vw,34px);margin-top:clamp(18px,2vw,30px);padding-left:clamp(20px,8vw,124px)}
.tabs__offer{position:relative}
.tabs__offer::before{content:"";position:absolute;left:calc(clamp(20px,8vw,124px) * -1);top:.55em;width:clamp(16px,6.4vw,96px);height:1px;background:var(--line)}
.tabs__offer p{margin-top:.3em}
.tabs__names{display:flex;flex-direction:column;justify-content:flex-start;gap:clamp(22px,4.2vw,64px);padding-top:clamp(40px,5vw,76px)}
.tabs__names button{text-align:left;font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:var(--t-h2);line-height:1;
  opacity:.5;transition:opacity .45s ease,color .45s ease,transform .7s var(--ease)}
.tabs__names button:hover{opacity:.85}
.tabs__names button.is-on{opacity:1;transform:translateX(-10px)}

.reach{display:grid;grid-template-columns:repeat(2,minmax(0,1fr)) 1.2fr 1.1fr;gap:24px var(--gap)}
.reach dt{font-weight:700;text-transform:uppercase;font-size:var(--t-body)}
.reach dd{margin:.35em 0 0;font-weight:400}
.reach dd a{opacity:.67;margin-right:18px}

/* ------------------------------------------------------------- career */
.photos5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(8px,4.6vw,70px)}
.photos5 .frame{aspect-ratio:300/247}
.expect{display:grid;grid-template-columns:minmax(0,320px) repeat(2,minmax(0,1fr));gap:clamp(20px,2.3vw,34px);align-items:start}
.expect__card{border:1px solid var(--line);padding:clamp(18px,1.9vw,28px) clamp(20px,1.8vw,27px);min-height:14em;
  transition:background-color .5s ease}
.expect__card:hover{background:rgba(255,255,255,.04)}
.expect__card p{margin-top:1em;font-weight:400}
.depts{display:flex;flex-wrap:wrap;align-items:center;gap:10px clamp(24px,4vw,60px)}
.depts button{font-size:var(--t-label);font-weight:500;text-transform:uppercase;color:var(--cream);opacity:.8;transition:color .35s ease,opacity .35s ease}
.depts button.is-on{color:var(--white);opacity:1;text-decoration:underline;text-underline-offset:8px;text-decoration-thickness:1px}
.depts__all{margin-left:auto}
.jobs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2vw,31px) var(--gap)}
.job{position:relative;border:1px solid rgba(255,255,255,.9);background:rgba(255,255,255,.06);
  padding:clamp(22px,2.2vw,34px) clamp(22px,2.8vw,42px) clamp(24px,2.4vw,36px);display:flex;flex-direction:column;gap:clamp(18px,3vw,44px);
  transition:opacity .5s ease,filter .5s ease,background-color .4s ease,transform .7s var(--ease)}
.job:hover{background:rgba(255,255,255,.1)}
.job.is-out{opacity:.14;filter:grayscale(1);pointer-events:none}
.job h3{font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(1.6rem,2.55vw,2.45rem);line-height:1}
.job dl{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;margin:0;align-items:baseline}
.job dt{font-size:var(--t-small);font-weight:500;text-transform:uppercase}
.job dd{margin:0}
.job__links{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:auto}
.join{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);border-top:1px solid var(--line);position:relative}
.join::before{content:"";position:absolute;left:0;top:-3px;width:22%;height:5px;background:var(--white)}
.join__step{display:grid;grid-template-columns:auto 1fr;gap:8px 18px;padding-top:26px}
.join__n{font-family:var(--display);font-weight:300;font-size:clamp(3.4rem,8.2vw,7.4rem);line-height:.8;grid-row:span 2}
.job-hero{padding:clamp(130px,17vh,200px) var(--gutter) clamp(40px,5vw,70px);text-align:center;max-width:var(--maxw);margin-inline:auto}
.resp{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(34px,4vw,70px) var(--gutter)}
.resp__item{display:grid;grid-template-columns:auto 1fr;gap:clamp(16px,2vw,30px);align-items:start}
.resp__item .display{font-size:clamp(3.4rem,8.2vw,7.4rem);line-height:.8}
.resp__item p{font-weight:400}

/* --------------------------------------------------------------- forms */
.form{display:grid;gap:clamp(22px,2.4vw,34px)}
.form__row{display:grid;gap:clamp(18px,2vw,30px) clamp(20px,1.4vw,22px)}
.form__row--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.form__row--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.form__row--phone{grid-template-columns:minmax(80px,.22fr) minmax(0,1fr)}
.form__group{display:grid;gap:clamp(14px,1.6vw,24px)}
.form__legend{font-size:var(--t-label);font-weight:200;text-transform:uppercase;display:flex;align-items:center;gap:20px}
.form__legend::after{content:"";flex:1;height:1px;background:var(--line)}
.field{position:relative;border-bottom:1px solid var(--line);transition:border-color .35s ease}
.field:focus-within{border-color:var(--gold)}
.field input,.field select,.field textarea{display:block;width:100%;background:none;border:0;outline:none;color:inherit;font:inherit;
  font-size:var(--t-body);font-weight:400;padding:1.5em .75em .4em;appearance:none;-webkit-appearance:none;border-radius:0}
.field textarea{resize:vertical;min-height:7.5em}
.field select{cursor:pointer}
.field select option{color:var(--green);background:var(--cream)}
.field input[type=date]{color-scheme:dark}
.field label{position:absolute;left:.75em;top:1.05em;font-size:var(--t-body);font-weight:400;pointer-events:none;transform-origin:left top;
  transition:transform .45s var(--ease),opacity .35s ease}
.field.is-filled label,.field:focus-within label{transform:translateY(-.9em) scale(.62);opacity:.7}
/* a date field always shows its own format, so its label rests raised */
.field input[type=date]{padding-top:1.7em}
.field__opt{position:absolute;right:.75em;top:1.15em;font-size:var(--t-small);color:var(--gold)}
.field__caret{position:absolute;right:.9em;top:50%;width:8px;height:13px;fill:none;stroke:currentColor;stroke-width:1.4;transform:translateY(-50%) rotate(90deg);pointer-events:none}
.field__err{position:absolute;left:.75em;top:calc(100% + 4px);font-size:var(--t-tiny);color:#E3A18F;opacity:0;transition:opacity .3s ease}
.field.is-bad{border-color:#E3A18F}
.field.is-bad .field__err{opacity:1}
.field--file{cursor:pointer}
.field--file input{position:absolute;inset:0;opacity:0;cursor:pointer}
.field--file .field__name{display:block;padding:1.5em .75em .4em;font-weight:400;color:var(--gold);min-height:2.6em}
.field--file svg{position:absolute;right:.8em;top:50%;width:14px;height:22px;fill:none;stroke:currentColor;stroke-width:1.3;transform:translateY(-50%)}
.choice{position:relative;display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px clamp(24px,3vw,50px);padding-bottom:12px}
.choice__k{position:absolute;right:0;bottom:-2px;font-size:var(--t-tiny);opacity:.8}
.choice button{font-size:var(--t-label);font-weight:200;text-transform:uppercase;line-height:1.1;transition:font-weight .3s ease,color .3s ease}
.choice button.is-on{font-weight:500}
.choice__rule{position:absolute;left:0;bottom:0;height:2px;background:var(--white);transition:left .55s var(--ease),width .55s var(--ease)}
.checks{display:flex;gap:14px;align-items:center}
.checks button{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--line);padding:.35em .9em;font-size:var(--t-small);transition:background-color .3s ease,color .3s ease}
.checks button::after{content:"";width:11px;height:11px;border:1px solid currentColor;border-radius:50%;transition:background-color .3s ease}
.checks button.is-on{background:var(--white);color:var(--green)}
.checks button.is-on::after{background:currentColor}
.form__submit{justify-self:center;margin-top:clamp(8px,1.6vw,24px)}
.form__sent{text-align:center;color:var(--gold);font-size:var(--t-lead);opacity:0;transition:opacity .6s ease}
.form__sent.is-on{opacity:1}
.form__note{text-align:center;font-size:var(--t-small);opacity:.55}
.form.is-sent .field,.form.is-sent .choice,.form.is-sent .checks,.form.is-sent .form__legend{opacity:.3;pointer-events:none;transition:opacity .6s ease}

/* ------------------------------------------------------------ contact */
.contact-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,404px);gap:clamp(30px,6vw,120px);align-items:start}
.feed{position:relative;overflow:hidden;cursor:grab;touch-action:pan-y;user-select:none}
.feed.is-drag{cursor:grabbing}
.feed__track{display:flex;gap:10px;padding-inline:var(--gutter);will-change:transform}
.feed .frame{flex:none;width:clamp(200px,18.5vw,280px);aspect-ratio:280/276}
.feed .frame img{pointer-events:none;transition:transform 1.1s var(--ease)}
.feed .frame:hover img{transform:scale(1.06)}
.feed__bar{position:relative;height:1px;background:var(--white);margin:clamp(20px,1.8vw,28px) var(--gutter) 0}
.feed__bar i{position:absolute;left:0;top:-4px;height:5px;width:17%;background:var(--white)}
.socials{display:flex;flex-wrap:wrap;gap:12px clamp(30px,6vw,110px);font-size:var(--t-body);font-weight:200}
.socials a{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.socials a:first-child{border:1px solid var(--line);border-radius:50%;padding:.9em 1.4em;text-decoration:none;margin-left:-1.4em}

/* ------------------------------------------------------------- legal */
.legal{display:grid;gap:clamp(34px,4vw,60px);max-width:1104px}
.legal h2{font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(1.6rem,2.3vw,2.2rem);line-height:1}
.legal p{margin-top:.8em;opacity:.78;font-size:clamp(1rem,1.2vw,1.12rem)}

/* ------------------------------------------------------------- footer */
.footer{padding-top:clamp(50px,6vw,100px);overflow:hidden}
.footer__grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(10px,1.4vw,18px) 40px;align-items:baseline;
  font-size:var(--t-lead);font-weight:300}
.footer__muted{opacity:.45}
.footer__contact{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px clamp(16px,2vw,30px)}
.footer__contact a{font-size:var(--t-body);font-weight:200;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.footer__nav,.footer__legal{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px clamp(18px,2.2vw,34px)}
.footer__nav a,.footer__legal a{opacity:.45;transition:opacity .3s ease}
.footer__nav a:hover,.footer__legal a:hover{opacity:1}
.footer__mark{padding:clamp(14px,1.6vw,26px) clamp(8px,.6vw,10px) 0;margin-bottom:-.9%;color:var(--white)}

/* ---------------------------------------------------------- the cursor */
.cursor,.cursor-dot{position:fixed;left:0;top:0;z-index:300;pointer-events:none;border-radius:50%;mix-blend-mode:difference}
.cursor{width:44px;height:44px;margin:-22px 0 0 -22px;border:1px solid rgba(255,255,255,.8);
  display:grid;place-items:center;transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),background-color .35s ease}
.cursor span{font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;opacity:0;transition:opacity .25s ease}
.cursor.is-link{width:70px;height:70px;margin:-35px 0 0 -35px;background:rgba(255,255,255,.12)}
.cursor.is-label{width:88px;height:88px;margin:-44px 0 0 -44px;background:rgba(255,255,255,.14)}
.cursor.is-label span{opacity:1}
.cursor-dot{width:5px;height:5px;margin:-2.5px 0 0 -2.5px;background:#fff}
@media (hover:none),(pointer:coarse){.cursor,.cursor-dot{display:none}}

/* ----------------------------------------------------- lightbox, chrome */
.lightbox{position:fixed;inset:0;z-index:250;display:grid;place-items:center;background:rgba(12,22,18,.94);opacity:0;pointer-events:none;
  transition:opacity .45s var(--ease)}
.lightbox.is-open{opacity:1;pointer-events:auto}
.lightbox figure{max-width:min(90vw,1240px);display:grid;gap:14px;justify-items:center}
.lightbox img{max-height:80svh;width:auto;transform:scale(.96);transition:transform .6s var(--ease)}
.lightbox.is-open img{transform:none}
.lightbox figcaption{font-size:var(--t-small);letter-spacing:.14em;text-transform:uppercase;opacity:.7}
.lightbox__btn{position:absolute;padding:14px;font-size:1.6rem;opacity:.8;transition:opacity .3s ease}
.lightbox__btn:hover{opacity:1}
.lightbox__x{top:14px;right:18px;font-size:.8rem;letter-spacing:.2em;text-transform:uppercase}
.lightbox__prev{left:8px;top:50%;transform:translateY(-50%)}
.lightbox__next{right:8px;top:50%;transform:translateY(-50%)}
.progress{position:fixed;left:0;top:0;height:2px;width:100%;z-index:130;background:linear-gradient(90deg,var(--gold),#f0e6c8);
  transform-origin:left;transform:scaleX(0)}
.to-top{position:fixed;right:clamp(14px,2vw,26px);bottom:clamp(14px,2vw,26px);z-index:120;width:52px;height:52px;border-radius:50%;
  border:1px solid rgba(255,255,255,.35);background:rgba(23,41,31,.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  display:grid;place-items:center;opacity:0;transform:translateY(14px);pointer-events:none;
  transition:opacity .4s ease,transform .5s var(--ease),background-color .3s ease}
.to-top.is-on{opacity:1;transform:none;pointer-events:auto}
.to-top:hover{background:rgba(209,192,140,.3)}
.to-top svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.4}
.curtain{position:fixed;inset:0;z-index:350;background:var(--green);transform:translateY(100%);pointer-events:none}

/* ------------------------------------------------------------ reveals
   Armed by live.js only when motion is on, so the static page is complete. */
.fx [data-reveal]{opacity:0}
.fx [data-reveal="fade"]{transform:none}
.fx [data-clip]{clip-path:inset(0 0 100% 0)}
.split-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.split-c{display:inline-block;will-change:transform}

/* =============================================================== tablet */
@media (max-width:1099px){
  .split{grid-template-columns:minmax(0,1fr);min-height:0}
  .split__media{aspect-ratio:892/700;min-height:0}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:clamp(30px,5vw,50px)}
  .steps__labels{grid-template-columns:repeat(5,minmax(0,1fr))}
  .tgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tcard--a,.tcard--b,.tcard--c,.tcard--d{grid-column:auto;margin-top:0}
  .tcard--head{grid-column:1 / -1}
  .why{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cards3{grid-template-columns:minmax(0,1fr)}
  .pcard{margin-left:0;margin-top:-1px;min-height:0;gap:24px}
  .pcard .label{margin-top:10px}
  .approach{grid-template-columns:minmax(0,1fr)}
  .approach__tab{grid-row:auto;order:var(--order,0)}
  .approach__panel{grid-row:auto;grid-column:1 !important;order:var(--porder,1);min-height:0}
  .film{grid-template-columns:minmax(0,1fr)}
  .tabs{grid-template-columns:minmax(0,1fr)}
  .tabs__names{flex-direction:row;flex-wrap:wrap;gap:12px 28px;padding-top:0;order:-1}
  .tabs__names button{font-size:clamp(1.4rem,3.4vw,2rem)}
  .tabs__names button.is-on{transform:none}
  .tabs__panel{min-height:0}
  .reach{grid-template-columns:repeat(2,minmax(0,1fr))}
  .expect{grid-template-columns:repeat(2,minmax(0,1fr))}
  .expect>:first-child{grid-column:1 / -1}
  .jobs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .join{grid-template-columns:repeat(2,minmax(0,1fr))}
  .resp{grid-template-columns:repeat(2,minmax(0,1fr))}
  .photos5{grid-template-columns:repeat(3,minmax(0,1fr))}
  .photos5 .frame:nth-child(n+4){display:none}
  .contact-top{grid-template-columns:minmax(0,1fr)}
  .form__row--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .menu{grid-template-columns:minmax(0,1fr)}
  .menu__media{display:none}
}

/* =============================================================== phone */
@media (max-width:699px){
  .tile{width:78vw}
  .topbar__cta{display:none}
  .hero__body{padding-bottom:84px}
  .hero__cue{display:none}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stats__n{font-size:clamp(2.3rem,11vw,3rem)}
  /* one column on a phone: the line would not match two rows of labels, so
     the active step carries its own gold point instead */
  .steps__rail{display:none}
  .steps__labels{grid-template-columns:minmax(0,1fr);row-gap:12px;margin-top:0}
  .steps__labels button{position:relative;padding-left:26px}
  .steps__labels button::before{content:"";position:absolute;left:0;top:50%;width:12px;height:12px;margin-top:-6px;border-radius:50%;
    border:1px solid currentColor;transition:background-color .4s ease,box-shadow .4s ease}
  .steps__labels button.is-on::before{background:var(--gold);border-color:var(--gold);box-shadow:0 0 0 5px rgba(209,192,140,.18)}
  .quote{grid-template-columns:minmax(0,1fr)}
  .tgrid{grid-template-columns:minmax(0,1fr)}
  .why{grid-template-columns:minmax(0,1fr)}
  .why__photo{position:relative;top:0}
  .cards{grid-template-columns:minmax(0,1fr)}
  .duo{grid-template-columns:minmax(0,1fr)}
  .gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cta-band{grid-template-columns:minmax(0,1fr)}
  .reach{grid-template-columns:minmax(0,1fr)}
  .expect{grid-template-columns:minmax(0,1fr)}
  .jobs{grid-template-columns:minmax(0,1fr)}
  .join{grid-template-columns:minmax(0,1fr)}
  .resp{grid-template-columns:minmax(0,1fr)}
  .photos5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .photos5 .frame:nth-child(n+3){display:none}
  .form__row--2,.form__row--3{grid-template-columns:minmax(0,1fr)}
  .team{grid-template-columns:minmax(0,1fr)}
  .footer__grid{grid-template-columns:minmax(0,1fr)}
  .footer__nav,.footer__legal{justify-content:flex-start}
  .depts__all{margin-left:0}
  .socials a:first-child{margin-left:0}
  .vision__track{height:auto;flex-direction:column}
  .vision__sticky{position:relative;height:auto}
  .vision__gold,.vision__photo,.vision__text{width:100%;max-width:none}
  .vision__gold{gap:18px}
  .vision__photo{aspect-ratio:4/3}
  .menu__link{font-size:clamp(2.3rem,12vw,3.4rem)}
  .menu__search{order:3;flex-basis:100%;max-width:none}
  .menu__top{flex-wrap:wrap}
  .menu__close{margin-left:auto}
}

@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important}
  .hero__cue i{animation:none}
}

/* file rows: the prompt steps aside once a file is chosen */
.file-label{transition:opacity .3s ease;font-weight:400}
.field--file.is-filled .file-label{opacity:0}