:root { --ink:#080a0d; --paper:#f2f0ea; --white:#fff; --gold:#e3b43f; --line:rgba(255,255,255,.16); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--ink); }
body { margin:0; color:var(--white); background:var(--ink); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:inherit; } img { display:block; max-width:100%; } button,select { font:inherit; }
.skip-link { position:fixed; left:16px; top:-60px; z-index:200; padding:12px 16px; background:var(--gold); color:var(--ink); font-weight:800; transition:top .2s; }
.skip-link:focus { top:12px; }
.site-header { position:fixed; inset:0 0 auto; z-index:100; min-height:86px; display:grid; grid-template-columns:180px 1fr auto; align-items:center; gap:28px; padding:0 clamp(22px,4vw,72px); border-bottom:1px solid rgba(255,255,255,.12); background:rgba(7,9,11,.92); transition:min-height .3s ease,background .3s ease; }
.site-header.is-compact { min-height:70px; background:rgba(7,9,11,.98); }
.brand img { width:132px; height:48px; object-fit:contain; filter:brightness(0) invert(1); }
.desktop-nav { display:flex; justify-content:center; align-items:center; gap:clamp(15px,2vw,34px); }
.desktop-nav a,.maven-link { position:relative; color:rgba(255,255,255,.68); text-decoration:none; font-size:13px; font-weight:700; letter-spacing:.02em; }
.desktop-nav a:hover,.desktop-nav a:focus-visible,.desktop-nav a[aria-current="page"] { color:#fff; }
.desktop-nav a[aria-current="page"]::after { content:""; position:absolute; left:0; right:0; bottom:-11px; height:2px; background:var(--gold); }
.header-actions { display:flex; align-items:center; gap:10px; }
.maven-link { padding:11px 16px; border:1px solid rgba(255,255,255,.2); border-radius:999px; }
.start-link { padding:12px 20px; border-radius:4px; background:var(--gold); color:#0b0c0e; text-decoration:none; font-size:13px; font-weight:900; }
.menu-toggle { display:none; border:1px solid var(--line); background:transparent; color:#fff; padding:10px 13px; }
.mobile-menu { position:absolute; top:100%; left:0; right:0; padding:18px 24px 28px; background:#080a0d; border-top:1px solid var(--line); }
.mobile-menu a { display:block; padding:12px 0; border-bottom:1px solid var(--line); text-decoration:none; }
.work-hero { position:relative; min-height:min(900px,100svh); overflow:hidden; display:flex; align-items:flex-end; padding:150px clamp(24px,4.2vw,78px) clamp(118px,13vh,148px); isolation:isolate; }
.hero-media,.hero-frame,.hero-shade { position:absolute; inset:0; }
.hero-media { z-index:-1; background:#111; }
.hero-frame { margin:0; opacity:0; transform:scale(1.035); transition:opacity 1.4s ease,transform 8s linear; }
.hero-frame.is-active { opacity:1; transform:scale(1); }
.hero-frame img { width:100%; height:100%; object-fit:cover; filter:saturate(.72) contrast(1.04) brightness(.74); }
.hero-frame:nth-child(3) img { object-position:top center; }
.hero-shade { background:linear-gradient(90deg,rgba(4,5,7,.82) 0%,rgba(4,5,7,.48) 42%,rgba(4,5,7,.1) 74%),linear-gradient(0deg,rgba(4,5,7,.88),transparent 48%); }
.hero-copy { width:min(920px,85vw); }
.eyebrow { margin:0 0 22px; color:#f0c858; font-size:12px; line-height:1.3; font-weight:800; letter-spacing:.22em; text-transform:uppercase; }
.eyebrow.dark { color:#8c6408; }
.hero-copy h1 { margin:0; font-size:clamp(88px,15vw,230px); font-weight:400; line-height:.76; letter-spacing:-.075em; }
.hero-statement { max-width:760px; margin:46px 0 0; font-size:clamp(20px,2.4vw,38px); line-height:1.24; font-weight:430; letter-spacing:-.025em; text-wrap:balance; }
.hero-status { position:absolute; right:clamp(24px,4.2vw,78px); bottom:42px; display:flex; align-items:center; gap:12px; font-size:12px; letter-spacing:.15em; color:rgba(255,255,255,.72); }
.hero-status i { width:58px; height:1px; background:rgba(255,255,255,.45); }
.hero-scroll { position:absolute; left:clamp(24px,4.2vw,78px); bottom:38px; display:flex; gap:14px; align-items:center; color:#fff; text-decoration:none; text-transform:uppercase; font-size:11px; font-weight:800; letter-spacing:.18em; }
.filter-dock { position:sticky; top:70px; z-index:70; display:grid; grid-template-columns:minmax(190px,.7fr) minmax(0,2fr); align-items:stretch; background:#090b0e; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.filter-heading { display:flex; flex-direction:column; justify-content:center; gap:6px; padding:18px clamp(24px,4.2vw,78px); border-right:1px solid var(--line); }
.filter-heading span { font-size:10px; color:#9e9e9e; text-transform:uppercase; letter-spacing:.18em; }
.filter-heading strong { font-size:14px; font-weight:650; }
.filter-controls { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) auto; }
.filter-controls label { position:relative; display:grid; gap:5px; padding:16px 42px 16px 20px; border-right:1px solid var(--line); }
.filter-controls label::after { content:"+"; position:absolute; right:18px; top:50%; transform:translateY(-15%); color:#aaa; }
.filter-controls label span { font-size:9px; color:#888; text-transform:uppercase; letter-spacing:.16em; }
.filter-controls select { width:100%; color:#fff; background:transparent; border:0; outline:0; appearance:none; font-size:12px; cursor:pointer; }
.filter-controls button { border:0; padding:0 24px; color:#c7c7c7; background:transparent; cursor:pointer; font-size:11px; font-weight:700; }
.filter-controls button:hover { color:var(--gold); }
.directory-shell { background:var(--paper); color:#111317; padding:clamp(74px,9vw,140px) clamp(18px,3.2vw,60px) 120px; }
.section-intro { display:grid; grid-template-columns:1.2fr .7fr; gap:60px; align-items:end; max-width:1420px; margin:0 auto 70px; }
.section-intro .eyebrow { grid-column:1/-1; margin-bottom:-28px; }
.section-intro h2 { margin:0; max-width:880px; font-size:clamp(48px,6.8vw,108px); line-height:.96; font-weight:520; letter-spacing:-.065em; }
.section-intro>p:last-child { margin:0 0 8px; color:#5e6064; font-size:clamp(16px,1.4vw,21px); line-height:1.58; }
.project-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); max-width:1420px; margin:0 auto; border-top:1px solid #bdbab2; border-left:1px solid #bdbab2; }
.project-card { min-width:0; border-right:1px solid #bdbab2; border-bottom:1px solid #bdbab2; background:var(--paper); }
.project-card-wide { grid-row:span 2; }
.project-card[hidden] { display:none; }
.project-card a { display:flex; flex-direction:column; min-height:100%; color:inherit; text-decoration:none; }
.project-media { overflow:hidden; aspect-ratio:16/9; background:#d8d4cb; }
.project-card-wide .project-media { aspect-ratio:4/3; flex:1; }
.project-media img,.project-media video { width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .45s ease; }
.project-card a:hover .project-media img,.project-card a:hover .project-media video { transform:scale(1.025); filter:saturate(1.08); }
.project-copy { position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(190px,.72fr) 28px; gap:26px; align-items:start; min-height:190px; padding:28px 30px 34px; }
.project-state { display:block; margin-bottom:18px; color:#777970; font-size:10px; font-weight:750; text-transform:uppercase; letter-spacing:.16em; }
.project-copy h3 { margin:0; font-size:clamp(27px,2.3vw,40px); line-height:1.04; font-weight:560; letter-spacing:-.04em; }
.project-copy p { margin:31px 0 0; color:#5d6063; font-size:14px; line-height:1.56; }
.project-arrow { margin-top:30px; font-size:22px; text-align:right; transition:transform .25s; }
.project-card a:hover .project-arrow { transform:translate(4px,-4px); }
.project-media-screen { background:#0c1015; }
.project-media-screen img { object-fit:cover; object-position:top center; }

.evolution-section { padding:clamp(80px,10vw,150px) clamp(18px,3.2vw,60px); background:#0a0c10; color:#f5f3ed; }
.evolution-heading { display:grid; grid-template-columns:1.15fr .7fr; gap:60px; align-items:end; max-width:1420px; margin:0 auto 70px; }
.evolution-heading .eyebrow { grid-column:1/-1; margin-bottom:-28px; }
.evolution-heading h2 { margin:0; max-width:940px; font-size:clamp(48px,6.2vw,96px); line-height:.98; font-weight:440; letter-spacing:-.06em; }
.evolution-heading>p:last-child { margin:0 0 8px; color:#9c9da0; font-size:clamp(16px,1.35vw,20px); line-height:1.6; }
.evolution-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); max-width:1420px; margin:0 auto; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.evolution-card { min-height:330px; display:flex; flex-direction:column; padding:28px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:linear-gradient(145deg,rgba(255,255,255,.018),rgba(255,255,255,0)); }
.evolution-card>span { color:#b58f39; font-size:10px; font-weight:750; text-transform:uppercase; letter-spacing:.17em; }
.evolution-card h3 { margin:30px 0 0; font-size:clamp(25px,2.2vw,37px); line-height:1.05; font-weight:480; letter-spacing:-.04em; }
.evolution-card p { margin:22px 0 0; color:#96989c; font-size:14px; line-height:1.58; }
.evolution-card>a { margin-top:auto; padding-top:30px; border-top:1px solid var(--line); text-decoration:none; font-size:12px; font-weight:750; }
.evolution-card>a b { float:right; font-size:17px; }
.evolution-card nav { display:flex; flex-wrap:wrap; gap:8px; margin-top:auto; padding-top:30px; }
.evolution-card nav a { min-width:42px; padding:10px 12px; border:1px solid rgba(255,255,255,.2); text-align:center; text-decoration:none; font-size:11px; transition:background .2s,color .2s; }
.evolution-card nav a:hover { background:var(--gold); color:#090a0c; border-color:var(--gold); }

.capability-feature { min-height:760px; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(420px,.85fr); background:#ebe8df; color:#111317; }
.capability-visual { position:relative; min-height:620px; overflow:hidden; background:#14161a; }
.capability-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent 55%,rgba(0,0,0,.36)),linear-gradient(0deg,rgba(0,0,0,.48),transparent 50%); }
.capability-visual>img { width:100%; height:100%; object-fit:cover; filter:saturate(.78) contrast(1.08); }
.level-orbit { position:absolute; inset:auto 7% 8%; z-index:2; display:flex; justify-content:space-between; align-items:center; color:#fff; }
.level-orbit::before { content:""; position:absolute; left:0; right:0; top:50%; height:1px; background:rgba(255,255,255,.45); }
.level-orbit span { position:relative; display:grid; place-items:center; width:56px; aspect-ratio:1; border:1px solid rgba(255,255,255,.7); border-radius:50%; background:rgba(6,8,11,.78); font-size:10px; letter-spacing:.1em; }
.capability-copy { display:flex; flex-direction:column; justify-content:center; padding:clamp(50px,7vw,120px); }
.capability-copy h2 { margin:0; font-size:clamp(50px,5vw,86px); line-height:.96; letter-spacing:-.065em; font-weight:520; }
.capability-copy>p:not(.eyebrow) { margin:38px 0 0; color:#5d6063; font-size:clamp(16px,1.3vw,20px); line-height:1.65; }
.feature-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:48px; }
.feature-actions a { padding:15px 18px; border:1px solid #15171a; color:#15171a; text-decoration:none; font-size:12px; font-weight:800; }
.feature-actions a:first-child { background:#15171a; color:#fff; }

.motion-section { padding:clamp(80px,10vw,150px) clamp(18px,3.2vw,60px); background:#07090b; }
.motion-heading { max-width:1420px; margin:0 auto 68px; display:grid; grid-template-columns:1.15fr .7fr; gap:60px; align-items:end; }
.motion-heading .eyebrow { grid-column:1/-1; margin-bottom:-28px; }
.motion-heading h2 { margin:0; max-width:880px; font-size:clamp(50px,6vw,94px); line-height:.96; letter-spacing:-.065em; font-weight:440; }
.motion-heading>p:last-child { margin:0 0 8px; color:#9c9da0; font-size:clamp(16px,1.35vw,20px); line-height:1.6; }
.motion-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); max-width:1420px; margin:0 auto; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.motion-card { min-width:0; position:relative; min-height:520px; overflow:hidden; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:#101216; color:#fff; text-decoration:none; }
.motion-card img { width:100%; height:100%; object-fit:cover; filter:saturate(.72) brightness(.72); transition:transform .8s cubic-bezier(.2,.7,.2,1),filter .4s; }
.motion-card:hover img { transform:scale(1.035); filter:saturate(1) brightness(.84); }
.motion-card::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(4,5,7,.92),transparent 62%); }
.motion-card div { position:absolute; z-index:2; left:0; right:0; bottom:0; padding:32px; }
.motion-card span { color:#d6b65a; font-size:10px; font-weight:750; text-transform:uppercase; letter-spacing:.17em; }
.motion-card h3 { max-width:82%; margin:16px 0 0; font-size:clamp(34px,3.2vw,57px); line-height:.98; font-weight:450; letter-spacing:-.05em; }
.motion-card b { position:absolute; right:32px; bottom:34px; font-size:25px; font-weight:400; transition:transform .2s; }
.motion-card:hover b { transform:translate(5px,-5px); }
.motion-index-link { display:flex; justify-content:space-between; max-width:1420px; margin:34px auto 0; padding:22px 0; border-bottom:1px solid var(--line); color:#fff; text-decoration:none; font-size:13px; font-weight:750; }

.work-cta { padding:clamp(90px,12vw,180px) clamp(24px,7vw,120px); background:var(--gold); color:#0a0c0f; }
.work-cta .eyebrow { color:#664b09; }
.work-cta h2 { margin:0; max-width:1150px; font-size:clamp(64px,9vw,150px); line-height:.87; letter-spacing:-.075em; font-weight:540; }
.work-cta>p:not(.eyebrow) { max-width:690px; margin:46px 0 0; font-size:clamp(18px,1.6vw,24px); line-height:1.5; }
.work-cta>a { display:inline-flex; gap:60px; margin-top:48px; padding:18px 0; border-bottom:2px solid #0a0c0f; color:#0a0c0f; text-decoration:none; font-size:13px; font-weight:850; }
.site-footer { display:grid; grid-template-columns:1.1fr 1fr; gap:70px; padding:70px clamp(24px,5vw,90px) 34px; background:#080a0d; border-top:1px solid var(--line); }
.site-footer img { width:142px; filter:brightness(0) invert(1); }
.site-footer>div p { max-width:480px; margin:25px 0 0; color:#929498; font-size:14px; line-height:1.6; }
.site-footer nav { display:grid; grid-template-columns:repeat(2,1fr); gap:15px 36px; align-content:start; }
.site-footer nav a { padding-bottom:12px; border-bottom:1px solid var(--line); color:#d4d4d4; text-decoration:none; font-size:13px; }
.footer-base { grid-column:1/-1; margin:40px 0 0; padding-top:24px; border-top:1px solid var(--line); color:#777a7e; font-size:11px; }
@media (max-width:1120px) { .site-header{grid-template-columns:145px 1fr auto;gap:18px}.desktop-nav{gap:15px}.desktop-nav a{font-size:12px}.maven-link{display:none}.filter-dock{grid-template-columns:1fr}.filter-heading{display:none}.filter-controls{grid-template-columns:repeat(3,1fr) auto}.project-copy{grid-template-columns:1fr 30px}.project-copy p{grid-column:1/-1;margin-top:0}.project-arrow{grid-column:2;grid-row:1}.evolution-grid{grid-template-columns:repeat(2,1fr)}.capability-feature{grid-template-columns:1fr}.capability-visual{min-height:560px}.motion-card{min-height:440px} }
@media (max-width:820px) { .site-header{min-height:68px;grid-template-columns:1fr auto;padding-inline:18px}.brand img{width:108px;height:38px}.desktop-nav{display:none}.menu-toggle{display:inline-block}.start-link{padding:10px 14px}.work-hero{min-height:88svh;padding:116px 22px 110px}.hero-copy h1{font-size:clamp(84px,28vw,150px)}.hero-statement{margin-top:34px;max-width:88%}.hero-status{right:22px}.filter-dock{top:68px;overflow-x:auto}.filter-controls{width:max-content;min-width:100%;grid-template-columns:repeat(3,230px) 110px}.section-intro,.evolution-heading,.motion-heading{grid-template-columns:1fr;gap:28px;margin-bottom:48px}.section-intro .eyebrow,.evolution-heading .eyebrow,.motion-heading .eyebrow{margin-bottom:-6px}.project-grid{grid-template-columns:1fr}.project-card-wide{grid-row:auto}.project-card-wide .project-media{aspect-ratio:16/10}.motion-grid{grid-template-columns:1fr}.site-footer{grid-template-columns:1fr;gap:46px}.footer-base{grid-column:1} }
@media (max-width:520px) { .hero-copy .eyebrow{max-width:260px}.hero-copy h1{font-size:27vw}.hero-statement{font-size:21px}.hero-scroll{bottom:34px}.hero-status{display:none}.directory-shell,.evolution-section,.motion-section{padding-inline:12px}.project-copy{padding:23px 20px 28px;min-height:0}.project-copy h3{font-size:29px}.evolution-grid{grid-template-columns:1fr}.evolution-card{min-height:280px}.capability-visual{min-height:400px}.level-orbit span:nth-child(even){display:none}.capability-copy{padding:70px 22px}.motion-card{min-height:370px}.site-footer{padding-inline:22px}.site-footer nav{grid-template-columns:1fr} }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.hero-frame:not(.is-active){display:none} }