:root {
  color-scheme: dark;
  --bg: #050608;
  --panel: #0b0d10;
  --ink: #f5f3ef;
  --muted: #9b9ea5;
  --line: rgba(255,255,255,.12);
  --amber: #f28a3b;
  --blue: #6f8dff;
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body { margin:0; color:var(--ink); background:var(--bg); font-family:var(--font); overflow-x:hidden; }
a { color:inherit; }
.noise { position:fixed; inset:0; z-index:90; opacity:.045; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E"); }
.cursor-light { position:fixed; z-index:2; width:28rem; height:28rem; border-radius:50%; pointer-events:none; opacity:.22; transform:translate(-50%,-50%); background:radial-gradient(circle,rgba(242,138,59,.18),transparent 68%); filter:blur(10px); }
.site-header { position:fixed; z-index:80; top:18px; left:24px; right:24px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:9px 10px 9px 12px; border:1px solid rgba(255,255,255,.10); border-radius:999px; background:rgba(6,7,9,.62); backdrop-filter:blur(18px); box-shadow:0 18px 60px rgba(0,0,0,.26); }
.identity { display:flex; align-items:center; gap:10px; text-decoration:none; font-weight:760; letter-spacing:-.02em; }
.identity img { width:36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,.18); }
.site-header nav { display:flex; align-items:center; gap:6px; }
.site-header nav a { padding:9px 14px; border-radius:999px; color:#c9cbd0; text-decoration:none; font-size:.84rem; font-weight:650; }
.site-header nav a:hover { color:#fff; background:rgba(255,255,255,.07); }
.site-header .nav-cta { color:#101113; background:#f2f0eb; }
.site-header .nav-cta:hover { color:#101113; background:#fff; }
.cinematic { position:relative; padding-bottom:100dvh; background:#050608; }
.visual-stage { --scrim-left:1; --scrim-right:0; --rail-progress:0; position:sticky; top:0; height:100dvh; overflow:hidden; background:#050608; }
.visual { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; transform:scale(1.012); will-change:transform; }
.visual-scrim { position:absolute; z-index:2; inset:0; pointer-events:none; }
.visual-scrim::before,.visual-scrim::after { position:absolute; inset:0; content:""; will-change:opacity; }
.visual-scrim::before { opacity:var(--scrim-left); background:linear-gradient(90deg,rgba(5,6,8,.96) 0%,rgba(5,6,8,.78) 34%,rgba(5,6,8,.14) 62%,rgba(5,6,8,.24) 100%); }
.visual-scrim::after { opacity:var(--scrim-right); background:linear-gradient(270deg,rgba(5,6,8,.96) 0%,rgba(5,6,8,.76) 35%,rgba(5,6,8,.12) 64%,rgba(5,6,8,.22) 100%); }
.chapter-copy-layer { position:absolute; z-index:5; inset:0; pointer-events:none; }
.copy-slot { position:absolute; inset-inline:clamp(28px,7vw,110px); top:50%; display:flex; transform:translateY(-50%); pointer-events:none; }
.copy-slot-right { justify-content:flex-end; }
.copy-slot .chapter-copy { width:min(43vw,620px); opacity:0; visibility:hidden; will-change:transform,opacity; }
.copy-slot[data-copy="hero"] .chapter-copy { opacity:1; visibility:visible; }
.chapter-rail { position:absolute; z-index:6; right:28px; top:50%; display:grid; gap:14px; transform:translateY(-50%); }
.chapter-rail::before,.chapter-rail::after { position:absolute; z-index:-1; top:15px; left:15px; width:1px; height:calc(100% - 30px); content:""; background:rgba(255,255,255,.12); }
.chapter-rail::after { transform:scaleY(var(--rail-progress)); transform-origin:top; background:var(--amber); box-shadow:0 0 16px rgba(242,138,59,.55); }
.chapter-rail span { display:grid; place-items:center; width:31px; height:31px; color:#6d7077; font-size:.68rem; font-weight:800; border:1px solid rgba(255,255,255,.12); border-radius:50%; background:rgba(5,6,8,.72); transition:color .25s,border-color .25s,background .25s,box-shadow .25s; }
.chapter-rail span.active { color:#fff; border-color:var(--amber); background:rgba(39,24,14,.92); box-shadow:0 0 28px rgba(242,138,59,.22); }
.chapter-stack { position:relative; z-index:1; margin-top:-100dvh; pointer-events:none; }
.story-band { min-height:130dvh; }
.transition-band { min-height:70dvh; }
.kicker,.section-index,.section-heading p,.approach-label { margin:0 0 20px; color:var(--amber); font-size:.72rem; line-height:1; letter-spacing:.18em; font-weight:800; }
h1,h2,h3,p { text-wrap:balance; }
h1 { max-width:12ch; margin:0; font-size:clamp(3.8rem,7.5vw,7.4rem); line-height:.9; letter-spacing:-.065em; font-weight:780; }
.hero-title-short { display:none; }
.copy-slot h2 { max-width:11ch; margin:0; font-size:clamp(3rem,6vw,6.2rem); line-height:.92; letter-spacing:-.06em; }
.lede,.chapter-copy>p:not(.kicker):not(.section-index) { max-width:44ch; margin:28px 0 0; color:#b8bac0; font-size:clamp(1.05rem,1.5vw,1.3rem); line-height:1.55; }
.hero-actions,.contact-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 20px; border-radius:999px; text-decoration:none; font-size:.88rem; font-weight:760; transition:transform .2s,background .2s,border .2s; }
.button:hover { transform:translateY(-2px); }
.button.primary { color:#111214; background:#f4f1eb; }
.button.ghost { color:#f0ede7; border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.04); }
.public-meta { margin-top:28px!important; color:#70737a!important; font-size:.8rem!important; letter-spacing:.04em; }
.capability-list { display:flex; flex-wrap:wrap; gap:8px; margin:30px 0 0; padding:0; list-style:none; }
.capability-list li,.signal-row span { padding:9px 13px; color:#c7c9ce; font-size:.78rem; font-weight:700; border:1px solid rgba(255,255,255,.14); border-radius:999px; background:rgba(255,255,255,.04); }
.signal-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:30px; }
.work-section { position:relative; z-index:10; margin-top:-100dvh; padding:clamp(100px,12vw,180px) clamp(22px,6vw,90px); background:#f0eee8; color:#101114; }
.section-heading { display:grid; gap:14px; max-width:1100px; margin:0 auto 58px; }
.section-heading p { color:#9a551f; margin:0; }
.section-heading h2 { max-width:13ch; margin:0; font-size:clamp(3rem,6vw,6rem); line-height:.94; letter-spacing:-.06em; }
.project-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:14px; max-width:1320px; margin:0 auto; }
.project { position:relative; grid-column:span 4; min-height:320px; overflow:hidden; padding:28px; border-radius:20px; color:#e9e9e8; background:#111318; border:1px solid rgba(0,0,0,.08); box-shadow:0 18px 50px rgba(22,20,18,.10); }
.project::before { position:absolute; inset:0; content:""; background:radial-gradient(circle at 90% 10%,color-mix(in srgb,var(--project-accent) 28%,transparent),transparent 38%); }
.project>* { position:relative; z-index:1; }
.project-feature { grid-column:span 7; min-height:430px; }
.project-wide { grid-column:span 8; }
.project span { color:color-mix(in srgb,var(--project-accent) 78%,white); font-size:.68rem; font-weight:800; letter-spacing:.14em; }
.project h3 { margin:24px 0 0; font-size:clamp(2rem,3.5vw,3.8rem); line-height:.95; letter-spacing:-.05em; }
.project p { max-width:38ch; margin:20px 0 0; color:#9fa2aa; line-height:1.55; }
.project-orbit { position:absolute; right:40px; bottom:35px; width:180px; height:180px; border:1px solid rgba(255,255,255,.12); border-radius:50%; }
.project-orbit i { position:absolute; width:48px; height:48px; border-radius:14px; background:var(--project-accent); box-shadow:0 0 35px color-mix(in srgb,var(--project-accent) 35%,transparent); }
.project-orbit i:nth-child(1){left:65px;top:-18px}.project-orbit i:nth-child(2){right:-18px;bottom:40px}.project-orbit i:nth-child(3){left:-14px;bottom:22px}
.mini-bars { position:absolute; right:30px; bottom:30px; display:flex; align-items:flex-end; gap:8px; height:110px; }
.mini-bars b { width:16px; height:var(--h,60%); border-radius:8px 8px 2px 2px; background:var(--project-accent); opacity:.78; }
.mini-bars b:nth-child(1){--h:35%}.mini-bars b:nth-child(2){--h:62%}.mini-bars b:nth-child(3){--h:50%}.mini-bars b:nth-child(4){--h:86%}.mini-bars b:nth-child(5){--h:72%}
.approach-section { display:grid; grid-template-columns:minmax(320px,.85fr) minmax(0,1.15fr); gap:clamp(40px,8vw,120px); padding:clamp(100px,12vw,180px) clamp(22px,7vw,110px); background:#080a0d; }
.approach-sticky { position:sticky; top:140px; align-self:start; }
.approach-sticky h2 { margin:0; font-size:clamp(3.2rem,6.5vw,6.8rem); line-height:.9; letter-spacing:-.065em; }
.principles { display:grid; gap:0; }
.principle { padding:36px 0 46px; border-top:1px solid var(--line); }
.principle span { color:var(--amber); font-size:.74rem; font-weight:800; }
.principle h3 { margin:18px 0 0; font-size:clamp(1.8rem,3vw,3rem); letter-spacing:-.04em; }
.principle p { max-width:48ch; margin:14px 0 0; color:#91949c; line-height:1.55; }
.contact-section { display:flex; flex-direction:column; min-height:100dvh; padding:clamp(110px,15vw,220px) clamp(22px,7vw,110px) 34px; color:#141416; background:var(--amber); }
.contact-section>p { margin:0; font-size:.8rem; font-weight:800; letter-spacing:.12em; }
.contact-section h2 { max-width:10ch; margin:24px 0 0; font-size:clamp(4rem,10vw,10rem); line-height:.84; letter-spacing:-.075em; }
.button.light { background:#111214; color:#fff; }
.button.outline { border:1px solid rgba(17,18,20,.36); color:#111214; }
.contact-section footer { display:flex; justify-content:space-between; margin-top:auto; padding-top:20px; border-top:1px solid rgba(17,18,20,.28); font-size:.8rem; font-weight:750; }
.reveal { opacity:0; transform:translateY(40px); will-change:transform,opacity; }
@media(max-width:900px){
  .site-header{top:8px;left:8px;right:8px}.site-header nav a:not(.nav-cta){display:none}
  .cursor-light{display:none}.story-band{min-height:125dvh}.story-band:first-child{min-height:112dvh}.transition-band{min-height:62dvh}
  .copy-slot{inset-inline:18px;top:auto;bottom:max(26px,env(safe-area-inset-bottom));transform:none;align-items:flex-end}
  .copy-slot .chapter-copy{width:min(100%,35rem)}.copy-slot-right{justify-content:flex-end}.copy-slot-right .chapter-copy{margin-left:auto;text-align:right}
  .copy-slot[data-copy="systems"] .chapter-copy{width:calc(100% - 26px)}
  .copy-slot[data-copy="systems"] .capability-list{justify-content:flex-end}
  .visual{object-position:center}.visual-scrim::before{background:linear-gradient(0deg,rgba(5,6,8,.98) 0%,rgba(5,6,8,.74) 42%,rgba(5,6,8,.08) 72%,rgba(5,6,8,.12) 100%),linear-gradient(90deg,rgba(5,6,8,.58),transparent 74%)}.visual-scrim::after{background:linear-gradient(0deg,rgba(5,6,8,.98) 0%,rgba(5,6,8,.74) 42%,rgba(5,6,8,.08) 72%,rgba(5,6,8,.12) 100%),linear-gradient(270deg,rgba(5,6,8,.58),transparent 74%)}
  .hero-title-long{display:none}.hero-title-short{display:inline}h1{font-size:clamp(3rem,13vw,3.8rem);max-width:7ch}.copy-slot h2{font-size:clamp(2.6rem,12vw,4rem);max-width:10ch}.lede,.chapter-copy>p:not(.kicker):not(.section-index){font-size:1rem;max-width:34ch}
  .chapter-rail{display:none}.project-grid{grid-template-columns:1fr}.project,.project-feature,.project-wide{grid-column:auto;min-height:300px}.project-orbit{opacity:.45}
  .approach-section{grid-template-columns:1fr}.approach-sticky{position:relative;top:auto}.contact-section h2{font-size:clamp(4.2rem,20vw,7rem)}
}
@media(max-width:900px) and (orientation:portrait){
  .visual{object-position:center center;transform:scale(1.002)}
}
@media(max-width:900px) and (orientation:landscape){
  .copy-slot{inset-inline:18px;top:76px;bottom:auto;transform:none;align-items:flex-start}
  .copy-slot .chapter-copy{width:min(48vw,390px)}
  .copy-slot[data-copy="hero"] .lede,.copy-slot[data-copy="hero"] .public-meta{display:none}
  .hero-actions{margin-top:18px}.button{min-height:42px;padding:0 16px}
  h1{font-size:clamp(2.5rem,7vw,3.7rem);max-width:7ch}
  .copy-slot h2{font-size:clamp(2.1rem,5.8vw,3.2rem);max-width:10ch}
  .lede,.chapter-copy>p:not(.kicker):not(.section-index){margin-top:16px;font-size:.88rem;line-height:1.42}
  .capability-list,.signal-row{margin-top:16px}
  .capability-list li,.signal-row span{padding:6px 9px;font-size:.66rem}
  .visual-scrim::before{background:linear-gradient(90deg,rgba(5,6,8,.96) 0%,rgba(5,6,8,.76) 38%,rgba(5,6,8,.1) 70%,rgba(5,6,8,.2) 100%)}
  .visual-scrim::after{background:linear-gradient(270deg,rgba(5,6,8,.96) 0%,rgba(5,6,8,.76) 38%,rgba(5,6,8,.1) 70%,rgba(5,6,8,.2) 100%)}
}
@media(max-width:520px){
  .copy-slot[data-copy="hero"] .lede,.copy-slot[data-copy="hero"] .public-meta{display:none}
  .hero-actions{margin-top:22px}.button{min-height:44px;padding:0 16px}
  .capability-list,.signal-row{margin-top:20px}.capability-list li,.signal-row span{padding:7px 10px;font-size:.7rem}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none}.cursor-light{display:none}}