/* Loxworth Capital — design system.
   Typeface: Jost (the geometric face of the Loxworth wordmark), every weight in one variable file.
   Flow: each section declares a tone (light/dark); the whole page morphs between tones as you
   scroll, so chapters blend into each other instead of stacking as blocks. */

@font-face{font-family:Jost;src:url(../fonts/jost-var.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}

@property --bg{syntax:"<color>";inherits:true;initial-value:#F7F5F0}
@property --fg{syntax:"<color>";inherits:true;initial-value:#111311}
@property --fg-2{syntax:"<color>";inherits:true;initial-value:#4A4944}
@property --line{syntax:"<color>";inherits:true;initial-value:rgba(17,19,17,.12)}
@property --acc{syntax:"<color>";inherits:true;initial-value:#A8873A}
@property --card{syntax:"<color>";inherits:true;initial-value:#FFFFFF}

:root{
  --ivory:#F7F5F0; --night:#0D100C; --gold:#D3B266; --gold-2:#A8873A; --sand:#ECE7DC;
  --font:Jost,"Futura","Century Gothic",system-ui,sans-serif;
  --ease:cubic-bezier(.22,.8,.1,1); --ease-io:cubic-bezier(.7,0,.25,1);
  --gutter:clamp(20px,4vw,64px); --maxw:1440px; --hdr:84px; --r:18px;
  --section:clamp(80px,9vw,140px);
}
body{--bg:#F7F5F0;--fg:#111311;--fg-2:#4A4944;--line:rgba(17,19,17,.12);--acc:#A8873A;--card:#FFFFFF;
  transition:--bg .9s var(--ease),--fg .9s var(--ease),--fg-2 .9s var(--ease),--line .9s var(--ease),--acc .9s var(--ease),--card .9s var(--ease)}
body[data-tone=dark]{--bg:#0D100C;--fg:#F2EFE8;--fg-2:rgba(242,239,232,.66);--line:rgba(242,239,232,.15);--acc:#D3B266;--card:#161A15}

/* ------------------------------------------------------------------ base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--hdr) + 16px);background:var(--night)}
body{margin:0;background:var(--bg);color:var(--fg);font:400 17px/1.65 var(--font);letter-spacing:.005em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip}
img,video,svg{display:block;max-width:100%}
img{height:auto}
picture{display:contents}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;letter-spacing:inherit}
h1,h2,h3,h4,p,ul,ol,figure,blockquote{margin:0}
ol,ul[role=list]{list-style:none;padding:0}
::selection{background:var(--gold);color:#111}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px;border-radius:4px}
.skip{position:absolute;left:-9999px;top:12px;z-index:300;background:#111;color:#fff;padding:10px 16px;border-radius:999px}
.skip:focus{left:12px}
main{display:block}

.container{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter)}
.container--narrow{max-width:calc(740px + 2 * var(--gutter))}
.container--mid{max-width:calc(1060px + 2 * var(--gutter))}
.section{padding:var(--section) 0}
.head{display:grid;gap:20px;margin-bottom:clamp(40px,4.5vw,72px);max-width:880px}
.head--row{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;max-width:none}
.head--row>div:first-child{display:grid;gap:20px}
.head__count{font:200 clamp(44px,4.4vw,72px)/1 var(--font);color:var(--acc)}
.head__actions{display:flex;align-items:center;gap:12px}
.head__actions .link-line{margin-right:14px}

/* ------------------------------------------------------------------ type */
.h-xxl,.h-xl,.h-l,.h-m{font-weight:300;letter-spacing:-.02em;text-wrap:balance}
.h-xxl{font-size:clamp(50px,8vw,140px);line-height:.96}
.h-xl{font-size:clamp(42px,5.6vw,92px);line-height:1}
.h-l{font-size:clamp(32px,3.8vw,60px);line-height:1.06}
.h-m{font-size:clamp(25px,2.4vw,36px);line-height:1.15;letter-spacing:-.01em}
.h-xxl em,.h-xl em,.h-l em,.h-m em{font-style:normal;color:var(--acc)}
.label{display:flex;align-items:center;gap:14px;font:500 11.5px/1.3 var(--font);letter-spacing:.3em;text-transform:uppercase;color:var(--fg-2)}
.label::before{content:"";width:28px;height:1px;background:var(--gold)}
.label__num{color:var(--acc)}
.lead{font-size:clamp(18px,1.4vw,21px);line-height:1.6;font-weight:300;color:var(--fg-2);max-width:46ch;text-wrap:pretty}
.body{color:var(--fg-2);max-width:56ch}
.muted{color:var(--fg-2)}
.prose{color:var(--fg-2);line-height:1.8}
.prose p+p{margin-top:1.1em}
.prose h1,.prose h2,.prose h3{color:var(--fg);font-weight:400;letter-spacing:-.01em;line-height:1.2;margin:1.8em 0 .6em}
.prose h1{font-size:clamp(36px,4.4vw,60px);font-weight:300;letter-spacing:-.02em}
.prose h2{font-size:clamp(26px,2.6vw,34px);font-weight:300}
.prose h3{font-size:21px}
.prose ul,.prose ol{margin:1em 0;padding:0}
.prose li{position:relative;padding-left:24px;margin:.45em 0;list-style:none}
.prose li::before{content:"";position:absolute;left:0;top:.85em;width:12px;height:1px;background:var(--gold)}
.prose a{color:var(--fg);text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px}
.prose strong{font-weight:500;color:var(--fg)}
.prose img{border-radius:var(--r);margin:1.6em auto}

/* ------------------------------------------------------------------ buttons & links */
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px 30px}
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;height:54px;padding:0 30px;border-radius:999px;background:var(--fg);color:var(--bg);font:500 12.5px/1 var(--font);letter-spacing:.2em;text-transform:uppercase;overflow:hidden;isolation:isolate;border:0;cursor:pointer;transition:color .35s var(--ease)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--gold);transform:translateY(101%);transition:transform .45s var(--ease)}
.btn:hover::before,.btn:focus-visible::before{transform:none}
.btn:hover{color:#111}
.btn--gold{background:var(--gold);color:#111}
.btn--gold::before{background:#fff}
.btn--light{background:#F7F5F0;color:#111}
.btn--sm{height:42px;padding:0 20px;font-size:11.5px}
.btn--block{width:100%}
.btn[disabled]{opacity:.6;cursor:progress}
.link-line{display:inline-flex;align-items:center;gap:12px;font:500 12px/1 var(--font);letter-spacing:.22em;text-transform:uppercase;padding:6px 0;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;transition:background-size .45s var(--ease),color .3s}
.link-line::after{content:"→";letter-spacing:0;transition:transform .35s var(--ease)}
.link-line:hover{background-size:0 1px;background-position:100% 100%;color:var(--acc)}
.link-line:hover::after{transform:translateX(4px)}
.link-line--light{color:#F2EFE8}
.link-back{display:inline-flex;gap:10px;font:500 11.5px/1 var(--font);letter-spacing:.22em;text-transform:uppercase;color:var(--fg-2);transition:color .3s}
.link-back:hover{color:var(--fg)}
.arrow{width:50px;height:50px;border-radius:50%;border:1px solid rgba(255,255,255,.35);display:grid;place-items:center;font-size:18px;transition:background .3s,color .3s,border-color .3s}
.arrow:hover{background:var(--gold);border-color:var(--gold);color:#111}
.arrow--dark{border-color:var(--line)}

/* ------------------------------------------------------------------ emblem (decorative) */
.emblem{fill:var(--gold);fill-rule:evenodd;overflow:visible}
@keyframes draw{to{stroke-dashoffset:0}}

/* ------------------------------------------------------------------ header */
.hdr{position:fixed;inset:0 0 auto;z-index:50;height:var(--hdr);color:var(--fg);transition:transform .45s var(--ease)}
.hdr::before{content:"";position:absolute;inset:0;background:color-mix(in srgb,var(--bg) 84%,transparent);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);border-bottom:1px solid var(--line);opacity:0;transition:opacity .3s ease}
.hdr.is-scrolled::before{opacity:1}
.hdr.is-hidden{transform:translateY(-100%)}
.hdr.on-film{color:#fff}
.hdr.on-film::before{opacity:0}
.hdr__inner{position:relative;height:100%;max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter);display:flex;align-items:center;gap:36px}
.brand{display:inline-flex;align-items:center;flex:none}
.brand__logo{height:40px;width:auto;aspect-ratio:4.116;overflow:visible}
.hdr__nav{display:flex;gap:34px;margin-left:auto}
.hdr__link{position:relative;font:500 11.5px/1 var(--font);letter-spacing:.24em;text-transform:uppercase;padding:8px 0}
.hdr__link::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:right;transition:transform .4s var(--ease)}
.hdr__link:hover::after{transform:scaleX(1);transform-origin:left}
.hdr__actions{display:flex;align-items:center;gap:12px}
.hdr.on-film .hdr__cta{background:#F7F5F0;color:#111}
.burger{width:46px;height:46px;border-radius:50%;display:grid;place-content:center;gap:6px;border:1px solid var(--line);transition:border-color .3s}
.hdr.on-film .burger{border-color:rgba(255,255,255,.35)}
.burger span{display:block;width:18px;height:1.5px;background:currentColor;transition:transform .35s var(--ease)}
.burger:hover span:first-child{transform:translateX(3px)}
.burger:hover span:last-child{transform:translateX(-3px)}

/* ------------------------------------------------------------------ menu */
.menu{position:fixed;inset:0;z-index:100;background:var(--night);color:#F2EFE8;clip-path:circle(0 at var(--cx,95%) var(--cy,5%));transition:clip-path .75s var(--ease-io);overflow:hidden auto;overscroll-behavior:contain;scrollbar-width:none}
.menu::-webkit-scrollbar{display:none}
.menu[hidden]{display:block;visibility:hidden}
.menu.is-open{clip-path:circle(150% at var(--cx,95%) var(--cy,5%));visibility:visible}
.menu__inner{position:relative;min-height:100%;max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter) 40px;display:grid;grid-template-columns:1.4fr 1fr;grid-template-rows:var(--hdr) 1fr;column-gap:48px}
.menu__top{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;color:#F2EFE8}
.menu__close{width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.3);position:relative}
.menu__close span{position:absolute;left:13px;top:22px;width:18px;height:1.5px;background:currentColor;transform:rotate(45deg)}
.menu__close span+span{transform:rotate(-45deg)}
.menu__nav{display:flex;flex-direction:column;justify-content:center;padding:28px 0}
.menu__link{display:flex;align-items:baseline;gap:22px;padding:3px 0;opacity:0;transform:translateY(20px);transition:opacity .5s var(--ease),transform .6s var(--ease)}
.menu.is-open .menu__link{opacity:1;transform:none;transition-delay:calc(.2s + var(--i) * .04s)}
.menu__num{font-size:12px;letter-spacing:.14em;color:var(--gold);width:24px}
.menu__label{font:300 clamp(34px,4.4vw,62px)/1.12 var(--font);letter-spacing:-.02em;transition:color .25s,transform .4s var(--ease)}
.menu__link:hover .menu__label{color:var(--gold);transform:translateX(10px)}
.menu__aside{align-self:end;display:grid;gap:24px;padding-bottom:8px;opacity:0;transition:opacity .6s ease .35s;position:relative;z-index:1}
.menu.is-open .menu__aside{opacity:1}
.menu__aside .label{color:rgba(242,239,232,.6)}
.menu__addr{margin-top:8px;color:rgba(242,239,232,.8);font-size:15px}
.menu__watermark{position:fixed;right:-8vw;bottom:-14vw;width:46vw;opacity:.05;pointer-events:none}
html.menu-open{overflow:hidden}
.clock{color:var(--gold);letter-spacing:.08em;font-variant-numeric:tabular-nums}

/* ------------------------------------------------------------------ reveal */
.js [data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .9s var(--ease)}
.js [data-reveal].is-in{opacity:1;transform:none}
.js [data-split] .sw{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.js [data-split] .sw>span{display:inline-block;transform:translateY(106%);transition:transform 1s var(--ease);transition-delay:calc(var(--w) * 40ms)}
.js [data-split].is-in .sw>span{transform:none}

/* ------------------------------------------------------------------ hero carousel (shrinks into the page as you leave it) */
.hero{position:relative;height:100vh;height:100svh;min-height:600px;overflow:hidden;background:#000;color:#fff;--dur:6.5s;--x:0;
  clip-path:inset(calc(var(--x) * 7vh) calc(var(--x) * 5vw) calc(var(--x) * 3vh) round calc(var(--x) * 36px))}
.hero__media{position:absolute;inset:0;scale:calc(1 + var(--x) * .08)}
.hero__film{position:absolute;inset:0;opacity:0;transition:opacity 1.3s ease}
.hero__film.is-active{opacity:1}
.hero__film video{width:100%;height:100%;object-fit:cover}
.hero__film.is-active video{animation:push 9s ease-out both}
@keyframes push{from{scale:1.08}to{scale:1}}
.hero__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.42) 0%,rgba(0,0,0,0) 26%,rgba(0,0,0,.1) 55%,rgba(0,0,0,.72) 100%),linear-gradient(90deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,0) 60%)}
.hero__content{position:absolute;left:0;right:0;bottom:clamp(150px,22vh,220px);display:grid;opacity:calc(1 - var(--x) * 1.6);translate:0 calc(var(--x) * -60px)}
.hero__slide{grid-area:1/1;display:grid;gap:22px;align-content:end}
.hero__label{opacity:0;transform:translateY(12px);transition:opacity .7s ease,transform .8s var(--ease)}
.hero__slide .label{color:rgba(255,255,255,.75)}
.hero__title{font:300 clamp(40px,5.4vw,88px)/1.02 var(--font);letter-spacing:-.02em;max-width:17ch;text-wrap:balance;opacity:0;transform:translateY(30px);clip-path:inset(0 0 100% 0);transition:opacity .9s var(--ease),transform 1.1s var(--ease),clip-path 1.1s var(--ease)}
.hero__slide.is-active .hero__label{opacity:1;transform:none;transition-delay:.25s}
.hero__slide.is-active .hero__title{opacity:1;transform:none;clip-path:inset(0 0 -10% 0);transition-delay:.35s}
.hero__bar{position:absolute;left:0;right:0;bottom:clamp(28px,5vh,52px);display:flex;align-items:flex-end;gap:32px;opacity:calc(1 - var(--x) * 2)}
.hero__tabs{flex:1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}
.hero__tab{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 12px;width:100%;text-align:left;padding-top:10px;color:rgba(255,255,255,.6);transition:color .3s}
.hero__tab:hover,.hero__tab.is-active{color:#fff}
.hero__tab-num{font-size:12px;letter-spacing:.14em;color:var(--gold)}
.hero__tab-name{font:500 11px/1.4 var(--font);letter-spacing:.22em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hero__tab-line{grid-column:1/-1;height:2px;background:rgba(255,255,255,.22);position:relative;overflow:hidden;order:-1}
.hero__tab-line i{position:absolute;inset:0;background:var(--gold);transform:scaleX(0);transform-origin:0 50%}
.hero__tab.is-done .hero__tab-line i{transform:scaleX(1)}
.hero__tab.is-active .hero__tab-line i{animation:fillbar var(--dur) linear forwards}
.hero.is-paused .hero__tab.is-active .hero__tab-line i{animation-play-state:paused}
@keyframes fillbar{to{transform:scaleX(1)}}
.hero__arrows{display:flex;gap:10px}

/* ------------------------------------------------------------------ statement */
.statement{position:relative;padding:var(--section) 0;overflow:clip}
.statement__grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,64px);align-items:center}
.statement__body{display:grid;gap:36px;justify-items:start}
.statement__text{font:300 clamp(28px,3.1vw,50px)/1.24 var(--font);letter-spacing:-.015em;max-width:24ch}
.statement__text .w{color:color-mix(in srgb,var(--fg) 16%,transparent);transition:color .35s ease}
.statement__text .w.is-lit{color:var(--fg)}
.statement__art{position:relative;aspect-ratio:1;align-self:stretch;min-height:320px}
.statement__branch{position:absolute;left:0;top:50%;width:calc(112% + var(--gutter));max-width:none;translate:0 -50%;transform-origin:100% 50%;animation:sway 9s ease-in-out infinite alternate}
@keyframes sway{from{rotate:-2deg}to{rotate:2deg}}
.butterfly{position:absolute;inset:0 0 auto 0;aspect-ratio:16/9;pointer-events:none}
.butterfly__sprite{position:absolute;left:0;top:0;width:10%;aspect-ratio:4/3;background-repeat:no-repeat;mix-blend-mode:multiply;visibility:hidden;will-change:transform}
.statement--center .statement__grid{grid-template-columns:minmax(0,3fr) minmax(0,9fr);align-items:start}
.statement--center .statement__body{gap:44px}
.quote{padding-left:24px;border-left:1px solid var(--gold);max-width:60ch}
.quote p{font:300 clamp(19px,1.6vw,24px)/1.5 var(--font);color:var(--fg-2)}
.quote cite{display:block;margin-top:12px;font:500 11.5px/1 var(--font);font-style:normal;letter-spacing:.3em;text-transform:uppercase;color:var(--acc)}

/* ------------------------------------------------------------------ emblem, decoded */
.emblem-sec{padding:var(--section) 0;overflow:clip}
.emblem-sec__head{display:grid;gap:20px;justify-items:center;text-align:center;max-width:760px;margin:0 auto clamp(48px,6vw,96px)}
.emblem-sec__head .lead{text-align:center}
.emblem-sec__map{position:relative;display:grid;grid-template-columns:minmax(0,1fr) min(36vw,500px) minmax(0,1fr);gap:clamp(24px,4vw,72px);align-items:center}
.emblem-sec__col{display:grid;gap:clamp(28px,4vw,52px);position:relative;z-index:2}
.emblem-sec__col--left{justify-items:end}
.emblem-sec__stage{position:relative;aspect-ratio:1;scale:.86;opacity:.4;transition:scale 1.4s var(--ease),opacity 1s ease}
.is-drawn .emblem-sec__stage{scale:1;opacity:1}
.parts{width:100%;height:100%;overflow:visible}
.part{fill:var(--gold);fill-opacity:0;fill-rule:evenodd;stroke:rgba(211,178,102,.6);stroke-width:.22;stroke-dasharray:1;stroke-dashoffset:1;transition:fill-opacity .7s var(--ease),stroke .5s}
.is-drawn .part{animation:draw 2.2s var(--ease-io) forwards}
.is-drawn .part:nth-child(2){animation-delay:.15s}
.is-drawn .part:nth-child(3){animation-delay:.3s}
.is-drawn .part:nth-child(4){animation-delay:.45s}
.is-drawn .part:nth-child(5){animation-delay:.6s}
.part.is-active{fill-opacity:1;stroke:var(--gold)}
.parts.is-all .part{fill-opacity:1}
.emblem-sec__leaders{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:1}
.emblem-sec__leaders path{fill:none;stroke:rgba(211,178,102,.25);stroke-width:1;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke .4s}
.is-drawn .emblem-sec__leaders path{animation:draw 1.2s var(--ease-io) calc(1.3s + var(--k,0) * .1s) forwards}
.emblem-sec__leaders path.is-active{stroke:var(--gold)}
.emblem-sec__leaders circle{fill:var(--night);stroke:var(--gold);stroke-width:1.2;opacity:0;transition:opacity .4s,fill .4s}
.is-drawn .emblem-sec__leaders circle{opacity:.6}
.emblem-sec__leaders circle.is-active{opacity:1;fill:var(--gold)}
.callout{display:grid;gap:8px;max-width:290px;opacity:.45;transition:opacity .4s ease}
.callout.is-active,.callout:hover,.callout:focus-visible{opacity:1}
.emblem-sec__col--left .callout{justify-items:end;text-align:right}
.emblem-sec__col--right .callout{justify-items:start;text-align:left}
.callout__trait{font:500 11px/1 var(--font);letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.callout__name{font:300 clamp(28px,2.6vw,42px)/1 var(--font);letter-spacing:-.02em}
.callout__text{font-size:15px;line-height:1.55;color:var(--fg-2);max-height:0;overflow:hidden;opacity:0;transition:max-height .6s var(--ease),opacity .5s ease}
.callout.is-active .callout__text{max-height:7em;opacity:1}

/* ------------------------------------------------------------------ principles */
.principles{border-top:1px solid var(--line)}
.principle{position:relative;display:grid;grid-template-columns:90px minmax(0,1fr) minmax(0,1.15fr);gap:24px;align-items:baseline;padding:clamp(28px,3.4vw,46px) 0;border-bottom:1px solid var(--line)}
.principle::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:0 50%;transition:transform 1.2s var(--ease)}
.principle.is-in::after{transform:scaleX(1);transition-delay:.25s}
.principle__num{font-size:13px;letter-spacing:.16em;color:var(--acc)}
.principle__title{font:300 clamp(30px,3.2vw,50px)/1.05 var(--font);letter-spacing:-.02em;transition:transform .5s var(--ease),color .3s}
.principle:hover .principle__title{transform:translateX(10px);color:var(--acc)}
.principle__text{color:var(--fg-2);max-width:50ch}

/* ------------------------------------------------------------------ portfolio list */
.companies{border-top:1px solid var(--line)}
.company__row{position:relative;display:grid;grid-template-columns:70px minmax(0,1fr) auto 56px;gap:24px;align-items:center;padding:clamp(24px,2.6vw,36px) 0;border-bottom:1px solid var(--line)}
.company__num{font-size:13px;letter-spacing:.16em;color:var(--acc)}
.company__name{font:300 clamp(36px,4.8vw,78px)/1.05 var(--font);letter-spacing:-.025em;transition:transform .5s var(--ease),color .3s;overflow-wrap:anywhere}
.company__meta{display:grid;gap:6px;justify-items:end;text-align:right;font:500 11px/1.3 var(--font);letter-spacing:.22em;text-transform:uppercase;color:var(--fg-2)}
.company__arrow{width:56px;height:56px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;font-size:18px;transition:background .3s,color .3s,rotate .4s var(--ease),border-color .3s}
.company__row:hover .company__name{transform:translateX(14px);color:var(--acc)}
.company__row:hover .company__arrow{background:var(--fg);color:var(--bg);border-color:var(--fg);rotate:45deg}
.company__media{position:fixed;left:0;top:0;z-index:30;width:clamp(300px,24vw,400px);aspect-ratio:4/3;border-radius:16px;overflow:hidden;pointer-events:none;background:var(--night);opacity:0;scale:.85;transform:translate3d(calc(var(--mx,0px) + 28px),calc(var(--my,0px) - 50%),0);transition:opacity .35s ease,scale .45s var(--ease)}
.company__media video,.company__media img{width:100%;height:100%;object-fit:cover}
.company__logo{position:absolute;left:14px;top:14px;height:44px;padding:8px 14px;border-radius:10px;background:rgba(255,255,255,.95);display:flex;align-items:center}
.company__logo img{max-height:28px;max-width:110px;width:auto;object-fit:contain}
.company__text{display:none}
@media (hover:hover) and (min-width:901px){.company__row:hover .company__media{opacity:1;scale:1}}

/* ------------------------------------------------------------------ impact (film grows from a card to full height) */
.impact{display:grid;grid-template-columns:1fr 1fr;align-items:start}
.impact__film{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;--g:1;clip-path:inset(calc((1 - var(--g)) * 14%) calc((1 - var(--g)) * 12%) round calc((1 - var(--g)) * 40px))}
.impact__film video{width:100%;height:100%;object-fit:cover;scale:calc(1.2 - var(--g) * .2)}
.impact__copy{display:grid;gap:28px;justify-items:start;padding:var(--section) var(--gutter) var(--section) clamp(40px,6vw,110px);max-width:760px}
.esg-list{display:grid;width:100%;margin:8px 0 16px;border-top:1px solid var(--line)}
.esg-list__item{display:grid;grid-template-columns:80px minmax(0,1fr);gap:16px;align-items:start;padding:26px 0;border-bottom:1px solid var(--line)}
.esg-list__letter{font:200 clamp(54px,5vw,76px)/.85 var(--font);color:var(--gold)}
.esg-list__title{font:400 22px/1.2 var(--font);margin-bottom:8px}
.esg-list__text{color:var(--fg-2);font-size:15.5px;line-height:1.65}

/* ------------------------------------------------------------------ news */
ul.rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2vw,32px);max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter)}
.rail__item:nth-child(n+4){display:none}
.news .head__actions .arrow{display:none}
.post__link{display:grid;gap:20px}
.post__media{overflow:hidden;border-radius:var(--r);background:var(--sand);aspect-ratio:4/3}
.post__media img{width:100%;height:100%;object-fit:cover;transition:scale 1.1s var(--ease)}
.post__media--logo{display:grid;place-items:center;background:var(--card);border:1px solid var(--line)}
.post__media--logo img{width:46%;height:auto;object-fit:contain}
.post__link:hover .post__media img{scale:1.045}
.post__body{display:grid;gap:10px}
.post__meta{color:var(--acc)}
.post__meta::before{display:none}
.post__title{font:400 clamp(19px,1.5vw,22px)/1.35 var(--font);letter-spacing:-.005em;transition:color .25s}
.post__link:hover .post__title{color:var(--acc)}
.post__excerpt{color:var(--fg-2);font-size:15.5px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(36px,4vw,56px) clamp(18px,2vw,32px)}
.post-grid>li[hidden]{display:none}

/* ------------------------------------------------------------------ page hero */
.page-hero{position:relative;padding:calc(var(--hdr) + clamp(64px,9vw,140px)) 0 clamp(40px,5vw,80px);overflow:hidden}
.page-hero__inner{display:grid;gap:24px;position:relative;z-index:1;justify-items:start}
.page-hero__inner .h-xl{max-width:13ch}
.page-hero__watermark{position:absolute;right:-8vw;top:6%;width:min(52vw,720px);opacity:.07;pointer-events:none}
.page-hero--center .container{display:grid;justify-items:center;text-align:center;gap:24px}
.page-hero__mark{width:84px}

/* ------------------------------------------------------------------ team */
.team-group{padding:clamp(28px,3.5vw,56px) 0}
.team-group:last-of-type{padding-bottom:var(--section)}
.team-group__head{display:flex;align-items:baseline;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:clamp(28px,3vw,44px)}
.team-group__head .label::before{display:none}
.team-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(36px,3vw,52px) clamp(18px,2vw,32px)}
.person__btn{display:grid;gap:4px;justify-items:start;text-align:left;width:100%}
.person__photo{display:block;aspect-ratio:1;border-radius:50%;overflow:hidden;width:min(100%,180px);background:var(--sand);margin-bottom:18px}
.person__photo img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:filter .6s ease,scale .8s var(--ease)}
.person__btn:hover .person__photo img,.person__btn:focus-visible .person__photo img{filter:none;scale:1.04}
.person__name{font:400 21px/1.25 var(--font)}
.person__role{font-size:14px;color:var(--fg-2);line-height:1.45}
.person__more{margin-top:10px;font:500 11px/1 var(--font);letter-spacing:.22em;text-transform:uppercase;color:var(--acc);opacity:0;transition:opacity .3s}
.person__btn:hover .person__more,.person__btn:focus-visible .person__more{opacity:1}
.bio{position:fixed;inset:0 0 0 auto;margin:0;width:min(600px,100vw);max-width:100vw;height:100%;max-height:100%;border:0;padding:0;background:#F7F5F0;color:#111311;box-shadow:-30px 0 80px -30px rgba(0,0,0,.35);transform:translateX(100%);transition:transform .55s var(--ease),display .55s allow-discrete,overlay .55s allow-discrete;--fg:#111311;--fg-2:#4A4944;--line:rgba(17,19,17,.12);--acc:#A8873A}
.bio[open]{transform:none}
@starting-style{.bio[open]{transform:translateX(100%)}}
.bio::backdrop{background:rgba(13,16,12,.5)}
.bio__content{padding:clamp(80px,10vh,110px) clamp(28px,5vw,56px) 56px;display:grid;gap:16px}
.bio__photo{width:132px;aspect-ratio:1;border-radius:50%;overflow:hidden;margin-bottom:8px}
.bio__photo img{width:100%;height:100%;object-fit:cover}
.bio__close{position:absolute;right:22px;top:22px;width:46px;height:46px;border-radius:50%;border:1px solid var(--line)}
.bio__close span{position:absolute;left:13px;top:22px;width:18px;height:1.5px;background:currentColor;transform:rotate(45deg)}
.bio__close span+span{transform:rotate(-45deg)}

/* ------------------------------------------------------------------ careers / jobs */
.jobs{padding:0 0 var(--section)}
.jobs__grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:clamp(32px,5vw,80px);align-items:start}
.jobs__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:18px;margin-bottom:24px}
.job-list{border-top:1px solid var(--line)}
.job[hidden]{display:none}
.job__link{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px 0;border-bottom:1px solid var(--line)}
.job__main{display:grid;gap:6px;min-width:0}
.job__title{font:300 clamp(22px,2vw,30px)/1.2 var(--font);letter-spacing:-.01em;transition:color .25s}
.job__meta{font-size:14px;color:var(--fg-2)}
.job__arrow{flex:none;width:50px;height:50px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;transition:background .3s,color .3s,translate .4s var(--ease)}
.job__link:hover .job__title{color:var(--acc)}
.job__link:hover .job__arrow{background:var(--fg);color:var(--bg);translate:4px 0}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{height:38px;padding:0 18px;border-radius:999px;border:1px solid var(--line);font:500 11px/1 var(--font);letter-spacing:.18em;text-transform:uppercase;transition:background .25s,color .25s,border-color .25s}
.chip:hover{border-color:var(--fg)}
.chip.is-active{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.news-index{padding-bottom:var(--section)}
.news-index .chips{margin-bottom:clamp(28px,4vw,48px)}
.empty{display:grid;justify-items:start;gap:12px;padding:44px 0;border-top:1px solid var(--line)}
.empty__mark{width:56px}
.card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:clamp(24px,2.4vw,34px);display:grid;gap:14px}
.card--sticky{position:sticky;top:calc(var(--hdr) + 24px)}
.card__logo img{max-height:40px;width:auto}
.card h2,.card h3{font:300 clamp(24px,2vw,30px)/1.2 var(--font);letter-spacing:-.01em}

/* ------------------------------------------------------------------ forms */
.form{display:grid;gap:14px;margin-top:4px}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field{display:grid;gap:8px;font:500 11px/1.3 var(--font);letter-spacing:.2em;text-transform:uppercase;color:var(--fg-2)}
.field small{letter-spacing:.05em;text-transform:none}
.field input,.field select,.field textarea{width:100%;font:400 16px/1.4 var(--font);letter-spacing:0;text-transform:none;color:var(--fg);background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:14px 16px;transition:border-color .25s;appearance:none}
.field select{background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 20px) 52%,calc(100% - 15px) 52%;background-size:5px 5px;background-repeat:no-repeat}
.field textarea{resize:vertical;min-height:120px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gold)}
.field--file input{padding:11px 12px;font-size:14px}
.check{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:var(--fg-2);line-height:1.5}
.check input{margin-top:3px;accent-color:var(--gold-2);width:18px;height:18px;flex:none}
.hp-field{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}
.form-msg{display:none;padding:16px 18px;border-radius:12px;background:rgba(211,178,102,.18);font-size:15px}
.form-msg--error{background:rgba(179,38,30,.1);color:#b3261e}
.form-msg.is-shown{display:block}

/* ------------------------------------------------------------------ contact */
.contact{padding:calc(var(--hdr) + clamp(56px,8vw,120px)) 0 var(--section)}
.contact__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,110px);align-items:start}
.contact__intro{display:grid;gap:26px;align-content:start;justify-items:start}
.contact__email{font:300 clamp(24px,2.4vw,36px)/1.2 var(--font);letter-spacing:-.01em;background:linear-gradient(var(--gold),var(--gold)) 0 100%/100% 1px no-repeat;padding-bottom:4px}
.contact__offices{display:grid;grid-template-columns:1fr 1fr;gap:28px;width:100%;margin-top:12px;padding-top:26px;border-top:1px solid var(--line)}
.office{display:grid;gap:8px}
.office .label::before{display:none}
.office__addr{color:var(--fg-2);font-size:15.5px}

/* ------------------------------------------------------------------ article / job page / legal */
.article__head{padding-top:calc(var(--hdr) + clamp(48px,7vw,110px));display:grid;gap:22px;justify-items:start;padding-bottom:clamp(32px,4vw,56px)}
.article__head .h-l{max-width:24ch}
.article__head .lead{max-width:58ch}
.article__hero{margin-bottom:clamp(40px,5vw,72px)}
.article__hero img{width:100%;border-radius:20px;aspect-ratio:16/9;object-fit:cover}
.article__body{font-size:18px}
.company-note{display:grid;grid-template-columns:112px 1fr auto;gap:22px;align-items:center;margin:56px 0 var(--section);padding:22px;border:1px solid var(--line);border-radius:20px;background:var(--card);transition:border-color .3s}
.company-note:hover{border-color:var(--gold)}
.company-note .label::before{display:none}
.company-note__logo img{max-height:44px;width:auto}
.company-note__text{display:block;margin-top:6px;color:var(--fg-2);font-size:15px}
.company-note__arrow{font-size:20px;color:var(--acc)}
.job-page__head{padding-top:calc(var(--hdr) + clamp(48px,7vw,110px));display:grid;gap:18px;justify-items:start;padding-bottom:clamp(32px,4vw,56px);border-bottom:1px solid var(--line);margin-bottom:clamp(32px,4vw,56px)}
.job-page__head .h-l{max-width:20ch}
.job-page__grid{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:clamp(40px,6vw,100px);align-items:start;padding-bottom:var(--section)}
.legal{padding:calc(var(--hdr) + clamp(48px,7vw,110px)) 0 var(--section)}
.prose--legal h1{margin-top:0}
.prose--legal h1 strong{font-weight:300}

/* ------------------------------------------------------------------ footer */
.ftr{position:relative;padding:clamp(80px,9vw,130px) 0 0;overflow:hidden}
.ftr__top{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:clamp(24px,4vw,56px);padding-bottom:clamp(44px,5vw,80px);border-bottom:1px solid var(--line)}
.ftr__mark{width:clamp(56px,6vw,84px);height:auto;aspect-ratio:1}
.ftr__grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:40px;padding:clamp(40px,5vw,64px) 0}
.ftr .label{margin-bottom:16px}
.ftr .label::before{display:none}
.ftr__list{list-style:none;padding:0;display:grid;gap:10px}
.ftr__list a,.ftr__legal a{color:var(--fg-2);transition:color .25s}
.ftr__list a:hover,.ftr__legal a:hover,.ftr__top-link:hover{color:var(--gold)}
.ftr__addr{color:var(--fg-2)}
.ftr__bottom{display:flex;flex-wrap:wrap;gap:14px 32px;align-items:center;justify-content:space-between;padding:24px 0;border-top:1px solid var(--line);font-size:13px;color:var(--fg-2)}
.ftr__legal{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px}
.ftr__word{display:block;width:calc(100% - 2 * var(--gutter));max-width:var(--maxw);height:auto;aspect-ratio:5.48;margin:10px auto -1.2vw;color:color-mix(in srgb,var(--fg) 6%,transparent)}

/* ------------------------------------------------------------------ ESG page */
.esg-hero{position:relative;height:100vh;height:100svh;min-height:620px;overflow:hidden;background:#000;color:#fff;display:flex;align-items:flex-end;--x:0;
  clip-path:inset(calc(var(--x) * 7vh) calc(var(--x) * 5vw) calc(var(--x) * 3vh) round calc(var(--x) * 36px))}
.esg-hero__film{position:absolute;inset:0;scale:calc(1 + var(--x) * .08)}
.esg-hero__film video{width:100%;height:100%;object-fit:cover;animation:push 14s ease-out both}
.esg-hero__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,.05) 35%,rgba(0,0,0,.75) 100%)}
.esg-hero__content{position:relative;display:grid;gap:24px;justify-items:start;padding-bottom:clamp(64px,12vh,130px);opacity:calc(1 - var(--x) * 1.6)}
.esg-hero__content .label{color:rgba(255,255,255,.75)}
.esg-hero__content .lead{color:rgba(255,255,255,.8)}
.esg-hero__content .h-xxl{max-width:11ch}
.esg-hero__letters{position:absolute;right:var(--gutter);top:calc(var(--hdr) + 3vh);display:grid;font:200 clamp(60px,9vw,150px)/.9 var(--font);color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.22);text-align:right;pointer-events:none}
.pillars-sec{overflow:clip}
.tabs{display:flex;gap:6px;padding:6px;border:1px solid var(--line);border-radius:999px}
.tab{display:flex;align-items:center;gap:10px;height:52px;padding:0 22px;border-radius:999px;color:var(--fg-2);transition:background .3s,color .3s}
.tab:hover{color:var(--fg)}
.tab.is-active{background:var(--gold);color:#111}
.tab__letter{font:300 24px/1 var(--font)}
.tab__name{font:500 11.5px/1 var(--font);letter-spacing:.22em;text-transform:uppercase}
.panels{display:grid}
.panel{grid-area:1/1;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(32px,5vw,90px);align-items:center}
.panel[hidden]{display:none}
.panel.is-active{animation:panel-in .8s var(--ease) both}
@keyframes panel-in{from{opacity:0;transform:translateY(18px)}}
.panel__film{aspect-ratio:4/3;border-radius:var(--r);overflow:hidden;background:var(--card)}
.panel__film video{width:100%;height:100%;object-fit:cover}
.panel__copy{display:grid;gap:28px}
.panel__items{border-top:1px solid var(--line)}
.panel__items li{padding:22px 0;border-bottom:1px solid var(--line)}
.panel__items h4{font:400 20px/1.3 var(--font);margin-bottom:8px}
.panel__items p{color:var(--fg-2);font-size:15.5px;line-height:1.65}
.split{overflow:clip}
.split__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,72px);align-items:center}
.split__media{position:relative;aspect-ratio:1;margin-left:calc(var(--gutter) * -1 - 4%)}
.split__media video{width:100%;height:100%;object-fit:cover;mix-blend-mode:multiply;-webkit-mask:radial-gradient(closest-side,#000 70%,transparent);mask:radial-gradient(closest-side,#000 70%,transparent)}
.split__copy{display:grid;gap:24px;justify-items:start}
.duty{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;color:#F2EFE8}
.duty__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.duty__shade{position:absolute;inset:0;background:linear-gradient(180deg,var(--bg) 0%,rgba(13,16,12,.45) 30%,rgba(13,16,12,.9) 100%)}
.duty__content{position:relative;display:grid;gap:28px;justify-items:start;padding-top:var(--section);padding-bottom:var(--section)}
.duty__content .h-xl{max-width:12ch}
.duty__text{display:grid;gap:14px;max-width:58ch;color:rgba(242,239,232,.75);font-size:clamp(17px,1.3vw,19px);line-height:1.75}

/* ------------------------------------------------------------------ page transitions */
@view-transition{navigation:auto}
.hdr{view-transition-name:hdr}
::view-transition-group(hdr){animation-duration:0s}
::view-transition-old(root){animation:none}
::view-transition-new(root){animation:vt-reveal .7s var(--ease-io) both}
@keyframes vt-reveal{from{clip-path:circle(0 at var(--vx,50%) var(--vy,50%))}to{clip-path:circle(150% at var(--vx,50%) var(--vy,50%))}}

/* ------------------------------------------------------------------ responsive */
@media (max-width:1100px){
  .hdr__nav{display:none}
  .team-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .jobs__grid,.job-page__grid{grid-template-columns:1fr}
  .card--sticky{position:static}
  .ftr__grid{grid-template-columns:1fr 1fr}
  .hero__tab-name{display:none}
}
@media (max-width:900px){
  :root{--hdr:68px}
  .brand__logo{height:32px}
  .hdr__cta{display:none}
  .menu__inner{grid-template-columns:1fr;grid-template-rows:var(--hdr) auto auto}
  .menu__nav{padding:18px 0 32px}
  .menu__watermark{width:90vw;right:-30vw;bottom:-24vw}
  .hero__content{bottom:120px}
  .hero__tabs{gap:8px}
  .hero__tab-num{display:none}
  .hero__arrows .arrow{width:44px;height:44px}
  .statement__grid,.statement--center .statement__grid{grid-template-columns:1fr;gap:12px}
  .statement__art{aspect-ratio:1.5;min-height:0;margin:0 calc(var(--gutter) * -1)}
  .statement__branch{left:8%;width:108%}
  .emblem-sec__map{grid-template-columns:1fr;gap:0}
  .emblem-sec__stage{order:-1;position:sticky;top:calc(var(--hdr) + 12px);z-index:3;width:min(52vw,260px);margin:0 auto;background:var(--bg);box-shadow:0 0 0 100vmax var(--bg);clip-path:inset(-12px -100vmax -20px -100vmax)}
  .emblem-sec__col,.emblem-sec__col--left{justify-items:stretch;gap:0}
  .emblem-sec__col--left .callout,.emblem-sec__col--right .callout{justify-items:start;text-align:left;max-width:none;padding:22px 0;border-bottom:1px solid var(--line)}
  .emblem-sec__col--left{margin-top:36px;border-top:1px solid var(--line)}
  .emblem-sec__leaders{display:none}
  .principle{grid-template-columns:1fr;gap:10px}
  .company__row{grid-template-columns:minmax(0,1fr) auto;gap:14px 16px}
  .company__num{display:none}
  .company__media{position:relative;opacity:1;scale:1;transform:none;grid-column:1/-1;order:-1;width:100%;aspect-ratio:16/10;border-radius:14px}
  .company__meta{justify-items:start;text-align:left;grid-column:1}
  .company__arrow{grid-row:2/4;grid-column:2;align-self:center;width:48px;height:48px}
  .company__text{display:block;grid-column:1/-1;color:var(--fg-2);font-size:15.5px}
  .impact{grid-template-columns:1fr}
  .impact__film{position:relative;height:64vh}
  .impact__copy{padding:64px var(--gutter)}
  ul.rail{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);scrollbar-width:none;padding-bottom:6px}
  .rail::-webkit-scrollbar{display:none}
  .rail__item,.rail__item:nth-child(n+4){display:block;flex:0 0 78vw;scroll-snap-align:start}
  .news .head__actions .arrow{display:grid}
  .post-grid{grid-template-columns:1fr 1fr}
  .team-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ftr__top{grid-template-columns:1fr}
  .ftr__top .btn{justify-self:start}
  .contact__grid,.split__grid{grid-template-columns:1fr}
  .contact__offices{grid-template-columns:1fr}
  .company-note{grid-template-columns:84px 1fr}
  .company-note__arrow{display:none}
  .panel{grid-template-columns:1fr}
  .head--row{flex-direction:column;align-items:flex-start}
  .tabs{width:100%;justify-content:space-between}
  .tab{padding:0 14px;flex:1;justify-content:center}
  .split__media{margin:0 calc(var(--gutter) * -1);aspect-ratio:1.2}
  .esg-hero__letters{display:none}
}
@media (max-width:640px){
  body{font-size:16px}
  .post-grid{grid-template-columns:1fr}
  .form__row{grid-template-columns:1fr}
  .ftr__grid{grid-template-columns:1fr}
  .job__arrow{width:44px;height:44px}
  .tab__name{display:none}
  .tab__letter{font-size:22px}
  .rail__item,.rail__item:nth-child(n+4){flex-basis:82vw}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .part,.emblem-sec__leaders path{stroke-dashoffset:0}
  .hero,.esg-hero{clip-path:none}
  .butterfly{display:none}
  ::view-transition-new(root){animation:none}
}