@font-face{font-family:'Archivo'; src:url('fonts/Archivo-latin.woff2') format('woff2'); font-weight:100 900; font-stretch:62% 125%; font-display:swap;}
:root{
  --bg:#050505; --bg-2:#0c0c0d; --fg:#f2f1ee; --dim:rgba(242,241,238,.66); --dimmer:rgba(242,241,238,.36);
  --line:rgba(242,241,238,.14); --accent:#f2f1ee;
  --max:1440px; --pad:clamp(20px,3.2vw,48px);
  --font:'Archivo', system-ui, sans-serif;
  --ease:cubic-bezier(.19,1,.22,1);
}
*{box-sizing:border-box;}
html.lenis, html.lenis body{height:auto;}
.lenis.lenis-smooth{scroll-behavior:auto !important;}
.lenis.lenis-stopped{overflow:hidden;}
body{margin:0; background:var(--bg); color:var(--fg); font-family:var(--font); font-weight:400; font-size:1rem; line-height:1.5; -webkit-font-smoothing:antialiased; overflow-x:hidden; cursor:none;}
@media (hover:none){body{cursor:auto;}}
a{color:inherit; text-decoration:none;}
ul{margin:0; padding:0; list-style:none;}
p,h1,h2,h3,h4{margin:0;}
img,video{display:block; width:100%; height:100%; object-fit:cover;}
button{font:inherit; color:inherit; background:none; border:0; padding:0; cursor:inherit;}
:focus-visible{outline:1px solid var(--fg); outline-offset:4px;}
.wrap{max-width:var(--max); margin:0 auto; padding:0 var(--pad);}

/* Type */
.d{font-weight:800; font-variation-settings:'wdth' 108; text-transform:uppercase; line-height:.88; letter-spacing:-.025em;}
.d-1{font-size:clamp(3rem, 8.6vw, 9.4rem);}
.d-2{font-size:clamp(2.6rem, 7.2vw, 7.4rem);}
.d-3{font-size:clamp(1.9rem, 4.2vw, 4.2rem);}
.d-4{font-size:clamp(1.3rem, 2.4vw, 2.2rem); line-height:.95;}
.label{font-size:clamp(.92rem,1.05vw,1.02rem); font-weight:500; letter-spacing:.005em; color:var(--dim);}
.copy{font-size:clamp(1rem, 1.15vw, 1.15rem); line-height:1.55; color:rgba(242,241,238,.8); max-width:44ch; font-weight:400;}
.lines .w{display:inline-block; overflow:hidden; vertical-align:top; margin-right:.22em; padding-bottom:.05em;}
.lines .w > span{display:inline-block; transform:translateY(112%); will-change:transform;}
.lines.in .w > span{transform:none;}
.fade{opacity:0; transform:translateY(24px); transition:opacity 1.1s var(--ease), transform 1.1s var(--ease);}
.fade.in{opacity:1; transform:none;}

/* Cursor */
.cur{position:fixed; top:0; left:0; z-index:200; pointer-events:none; mix-blend-mode:difference;}
.cur-dot{position:absolute; width:8px; height:8px; margin:-4px 0 0 -4px; border-radius:50%; background:#fff; transition:transform .3s var(--ease), opacity .3s;}
.cur-ring{position:absolute; width:72px; height:72px; margin:-36px 0 0 -36px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; font-size:.72rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:#000; transform:scale(0); transition:transform .45s var(--ease);}
.cur.link .cur-dot{transform:scale(3.5);}
.cur.view .cur-dot{opacity:0;}
.cur.view .cur-ring{transform:scale(1);}
@media (hover:none){.cur{display:none;}}

/* Preloader */
.pre{position:fixed; inset:0; z-index:150; background:var(--bg); display:flex; align-items:flex-end; justify-content:space-between; padding:var(--pad); overflow:hidden;}
.pre .n{font-size:clamp(4rem,14vw,14rem); font-weight:800; font-variation-settings:'wdth' 108; line-height:.8; letter-spacing:-.04em; font-variant-numeric:tabular-nums;}
.pre .t{font-size:.85rem; color:var(--dim); max-width:22ch; line-height:1.4;}
.pre-bar{position:absolute; left:0; bottom:0; height:2px; width:0; background:var(--fg);}

/* Nav */
.nav{position:fixed; inset:0 0 auto 0; z-index:100; mix-blend-mode:difference; color:#fff;}
.nav-in{display:flex; align-items:center; justify-content:space-between; height:76px;}
.logo{font-weight:800; font-variation-settings:'wdth' 118; letter-spacing:-.03em; font-size:1.35rem; text-transform:uppercase;}
.links{display:flex; gap:32px;}
.links a{font-size:.85rem; font-weight:500; text-transform:uppercase; letter-spacing:.02em; position:relative; padding:4px 0;}
.links a::after{content:''; position:absolute; left:0; bottom:0; height:1px; width:100%; background:currentColor; transform:scaleX(0); transform-origin:right; transition:transform .5s var(--ease);}
.links a:hover::after{transform:scaleX(1); transform-origin:left;}
.menu-btn{display:none; font-size:.85rem; font-weight:500; text-transform:uppercase; letter-spacing:.02em;}
@media (max-width:900px){.links{display:none;} .menu-btn{display:block;}}
.menu{position:fixed; inset:0; z-index:90; background:var(--fg); color:var(--bg); padding:100px var(--pad) var(--pad); display:flex; flex-direction:column; justify-content:space-between; clip-path:inset(0 0 100% 0); transition:clip-path .8s var(--ease); visibility:hidden;}
.menu.open{clip-path:inset(0 0 0 0); visibility:visible;}
.menu a{display:block; font-size:clamp(2.6rem,12vw,5rem); font-weight:800; text-transform:uppercase; line-height:.95; letter-spacing:-.03em;}
.menu .small{font-size:.9rem; color:rgba(5,5,5,.6); display:flex; gap:20px; flex-wrap:wrap;}

/* Hero */
.hero{position:relative; height:100svh; min-height:640px; overflow:hidden;}
.hero-img{position:absolute; inset:0; transform:scale(1.25); will-change:transform;}
.hero-img::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(5,5,5,.35) 0%, rgba(5,5,5,.05) 40%, rgba(5,5,5,.85) 100%);}
.hero-in{position:relative; z-index:2; height:100%; display:flex; flex-direction:column; justify-content:flex-end; padding-bottom:clamp(28px,4vh,48px);}
.hero h1{max-width:12ch;}
.hero-foot{display:grid; grid-template-columns:1.35fr 1fr .8fr; gap:24px; align-items:end; margin-top:clamp(24px,4vh,48px); padding-top:20px; border-top:1px solid var(--line);}
.hero-foot .copy{max-width:40ch; font-size:clamp(1.08rem,1.25vw,1.28rem); line-height:1.5;}
.hero-foot .scroll{justify-self:end; font-size:.9rem; color:var(--dim); text-transform:uppercase; letter-spacing:.04em; display:flex; align-items:center; gap:10px;}
.hero-foot .scroll i{display:block; width:1px; height:36px; background:var(--dim); position:relative; overflow:hidden;}
.hero-foot .scroll i::after{content:''; position:absolute; inset:0; background:var(--fg); animation:drop 1.8s var(--ease) infinite;}
@keyframes drop{0%{transform:translateY(-100%);} 60%,100%{transform:translateY(100%);}}
@media (max-width:900px){.hero-foot{grid-template-columns:1fr; gap:16px;} .hero-foot .scroll{display:none;}}

/* Statement */
.state{padding:clamp(90px,12vw,170px) 0;}
.state h2{max-width:14ch;}
.state-row{display:grid; grid-template-columns:1fr 1fr; gap:40px; margin-top:clamp(28px,4vw,56px);}
.state-row .copy{justify-self:end;}
@media (max-width:900px){.state-row{grid-template-columns:1fr;} .state-row .copy{justify-self:start;}}

/* Marquee strip */
.strip{overflow:hidden; padding:0 0 clamp(80px,10vw,150px);}
.row{display:flex; gap:14px; width:max-content; will-change:transform;}
.row + .row{margin-top:14px;}
.row .im{flex:none; width:clamp(200px,22vw,340px); aspect-ratio:4/3; overflow:hidden; background:var(--bg-2);}
.row .im img{transform:scale(1.08); transition:transform 1.2s var(--ease);}
.row .im:hover img{transform:scale(1);}
.row .im.tall{aspect-ratio:3/4; width:clamp(160px,17vw,260px);}

/* Team */
.team{padding:0 0 clamp(80px,10vw,150px);}
.team-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:clamp(36px,5vw,72px);}
.role{background:var(--bg); position:relative; aspect-ratio:4/5; overflow:hidden;}
.role img{filter:grayscale(1) contrast(1.05); opacity:.55; transform:scale(1.06); transition:opacity .8s var(--ease), transform 1.2s var(--ease), filter .8s var(--ease);}
.role:hover img{opacity:1; transform:scale(1); filter:grayscale(0);}
.role span{position:absolute; left:16px; bottom:14px; right:16px; font-weight:700; text-transform:uppercase; letter-spacing:-.01em; font-size:clamp(.9rem,1.3vw,1.2rem); line-height:1;}
.role em{position:absolute; top:14px; left:16px; font-style:normal; font-size:.88rem; color:var(--dim);}
@media (max-width:900px){.team-grid{grid-template-columns:repeat(2,1fr);}}

/* Features */
.feat{display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,6vw,120px); align-items:center; padding:clamp(40px,6vw,90px) 0; border-top:1px solid var(--line);}
.feat:nth-child(even) .feat-img{order:2;}
.feat-img{aspect-ratio:4/3; overflow:hidden;}
.feat-img img{transform:scale(1.2); will-change:transform;}
.feat-copy .copy{margin-top:24px;}
.feat-copy .label{display:block; margin-bottom:22px;}
@media (max-width:900px){.feat{grid-template-columns:1fr; gap:24px;} .feat:nth-child(even) .feat-img{order:0;}}

/* Projects */
.proj{padding:clamp(90px,12vw,170px) 0 0;}
.proj-head{display:flex; justify-content:space-between; align-items:flex-end; gap:20px;}
.proj-list{margin-top:clamp(36px,5vw,72px); border-top:1px solid var(--line); position:relative;}
.pl{display:grid; cursor:inherit; grid-template-columns:auto 1fr auto; gap:24px; align-items:baseline; padding:clamp(18px,2.4vw,34px) 0; border-bottom:1px solid var(--line); transition:padding-left .6s var(--ease), color .4s;}
.pl .k{font-size:.9rem; color:var(--dim); font-variant-numeric:tabular-nums; min-width:2.5em;}
.pl .s{font-size:1rem; color:var(--dim); text-align:right;}
.proj-list:hover .pl{color:var(--dimmer);}
.proj-list .pl:hover{color:var(--fg); padding-left:14px;}
.float{position:fixed; top:0; left:0; z-index:40; width:clamp(240px,26vw,400px); aspect-ratio:4/3; pointer-events:none; overflow:hidden; opacity:0; transform:scale(.85); transition:opacity .4s var(--ease), transform .5s var(--ease); margin:-14% 0 0 -14%;}
.float.on{opacity:1; transform:scale(1);}
.float img{position:absolute; inset:0; opacity:0; transition:opacity .4s;}
.float img.cur{opacity:1;}
@media (max-width:900px){.pl{grid-template-columns:auto 1fr;} .pl .s{display:none;} .float{display:none;}}

.gallery{display:grid; grid-template-columns:repeat(12,1fr); gap:14px; margin-top:clamp(40px,5vw,80px); padding-bottom:clamp(90px,12vw,170px);}
.g{position:relative; overflow:hidden; grid-column:span 4; aspect-ratio:4/5; background:var(--bg-2);}
.g.w{grid-column:span 8; aspect-ratio:16/10;}
.g img{transform:scale(1.001); transition:transform 1.3s var(--ease);}
.g:hover img{transform:scale(1.06);}
.g .cap{position:absolute; left:18px; bottom:16px; right:18px; display:flex; justify-content:space-between; font-size:.82rem; opacity:0; transform:translateY(8px); transition:opacity .5s var(--ease), transform .5s var(--ease);}
.g:hover .cap{opacity:1; transform:none;}
.g::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, transparent 60%, rgba(0,0,0,.5)); opacity:0; transition:opacity .5s;}
.g:hover::after{opacity:1;}
@media (max-width:900px){.g, .g.w{grid-column:span 12;}}

/* Values accordion */
.vals{padding:0 0 clamp(90px,12vw,170px);}
.acc{border-top:1px solid var(--line); margin-top:clamp(36px,5vw,72px);}
.ai{border-bottom:1px solid var(--line);}
.aq{width:100%; display:flex; justify-content:space-between; align-items:center; padding:clamp(22px,3vw,40px) 0; text-align:left;}
.aq .x{width:14px; height:14px; position:relative; flex:none; transition:transform .5s var(--ease);}
.aq .x::before, .aq .x::after{content:''; position:absolute; background:currentColor; top:50%; left:50%; transform:translate(-50%,-50%);}
.aq .x::before{width:14px; height:1px;} .aq .x::after{width:1px; height:14px;}
.ai.open .aq .x{transform:rotate(45deg);}
.aa{height:0; overflow:hidden; transition:height .7s var(--ease);}
.aa-in{display:grid; grid-template-columns:1fr 1fr; gap:40px; padding-bottom:clamp(26px,3vw,48px);}
.aa-in .copy{max-width:52ch;}
.aa-in .im{aspect-ratio:16/9; overflow:hidden;}
@media (max-width:900px){.aa-in{grid-template-columns:1fr;}}

/* Clients */
.clients{padding:0 0 clamp(90px,12vw,170px);}
.cl-head{display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:end;}
.cl-grid{margin-top:clamp(36px,5vw,72px); display:grid; grid-template-columns:repeat(4,1fr); gap:40px; border-top:1px solid var(--line); padding-top:32px;}
.cl-grid h3{font-family:var(--font); font-size:.95rem; font-weight:500; color:var(--dim); margin-bottom:18px; text-transform:uppercase; letter-spacing:.03em;}
.cl-grid li{font-size:clamp(1rem,1.3vw,1.25rem); padding:6px 0; font-weight:500; letter-spacing:-.01em;}
@media (max-width:900px){.cl-head{grid-template-columns:1fr;} .cl-grid{grid-template-columns:1fr 1fr; gap:28px;}}

/* Partners */
.partners{border-top:1px solid var(--line); border-bottom:1px solid var(--line); overflow:hidden; padding:28px 0;}
.pt{display:flex; gap:80px; width:max-content; animation:pt 30s linear infinite;}
.pt span{font-size:1.4rem; font-weight:800; text-transform:uppercase; letter-spacing:-.02em; color:var(--dimmer); white-space:nowrap; font-variation-settings:'wdth' 118;}
@keyframes pt{to{transform:translateX(-50%);}}

/* CTA + footer */
.cta{padding:clamp(100px,14vw,200px) 0; text-align:left;}
.cta a.big{display:inline-block; position:relative;}
.cta a.big::after{content:''; position:absolute; left:0; right:0; bottom:-.05em; height:.06em; background:var(--fg); transform:scaleX(0); transform-origin:right; transition:transform .7s var(--ease);}
.cta a.big:hover::after{transform:scaleX(1); transform-origin:left;}
footer{border-top:1px solid var(--line); padding:48px 0 24px;}
.ft{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:clamp(30px,5vw,80px);}
.ft h4{margin:0 0 14px; font-size:.95rem; font-weight:500; color:var(--dim); text-transform:uppercase; letter-spacing:.03em;}
.ft li{padding:4px 0; font-size:.95rem;}
.ft a:hover{text-decoration:underline;}
.news{display:flex; border-bottom:1px solid var(--line); max-width:340px;}
.news input{flex:1; background:none; border:0; color:var(--fg); padding:10px 0; font:inherit; font-size:.95rem;}
.news input::placeholder{color:var(--dimmer);}
.news input:focus{outline:none;}
.news button{font-size:.8rem; text-transform:uppercase; letter-spacing:.03em; font-weight:600;}
.fb{display:flex; justify-content:space-between; margin-top:56px; padding-top:20px; border-top:1px solid var(--line); font-size:.88rem; color:var(--dim); flex-wrap:wrap; gap:10px;}
.ft-logo{font-size:clamp(3rem,10.5vw,11rem); white-space:nowrap; font-weight:800; font-variation-settings:'wdth' 118; text-transform:uppercase; line-height:.8; letter-spacing:-.04em; margin-top:56px; color:var(--fg);}
@media (max-width:900px){.ft{grid-template-columns:1fr 1fr; gap:28px;}}

@media (prefers-reduced-motion:reduce){
  *{animation:none !important; transition:none !important;}
  .lines .w > span, .fade{transform:none; opacity:1;}
  .hero-img{transform:none;}
  .pre{display:none;}
}

/* 404 */
.nf{min-height:100svh; display:flex; align-items:flex-end; padding:0 var(--pad) var(--pad);}
.nf a{border-bottom:1px solid var(--line);}