@font-face { font-family: "Cronic Sans"; src: local("Helvetica Neue"), local("Arial"); font-display: swap; }
:root { --black:#050505; --paper:#ebe8e0; --white:#f4f3ef; --muted:rgba(244,243,239,.56); --blue:#72dcff; --pad:clamp(1.2rem,3vw,3.2rem); color-scheme:dark; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--black); }
body { margin:0; overflow-x:clip; background:var(--black); color:var(--white); font-family:"Cronic Sans","Helvetica Neue",Arial,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
.article-header { position:fixed; z-index:20; top:0; left:0; display:grid; width:100%; height:6rem; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 var(--pad); color:#fff; mix-blend-mode:difference; }
.article-header__brand { width:clamp(6.5rem,8vw,8.5rem); }
.article-header img { display:block; width:100%; }
.article-header p,.article-header__back { margin:0; font-size:.58rem; letter-spacing:.18em; }
.article-header p span { color:var(--blue); }
.article-header__back { justify-self:end; }
.reading-progress { position:fixed; z-index:22; top:0; left:0; width:100%; height:2px; background:rgba(255,255,255,.1); }
.reading-progress span { display:block; width:100%; height:100%; transform:scaleX(0); transform-origin:left; background:var(--blue); box-shadow:0 0 1rem rgba(114,220,255,.8); }
.article-hero { position:relative; height:185svh; background:#000; }
.article-hero__media,.article-hero__veil { position:absolute; inset:0; }
.article-hero__media { position:sticky; top:0; height:100svh; overflow:hidden; }
.article-hero__media video { width:100%; height:100%; object-fit:cover; opacity:.6; transform:scale(1.08); filter:saturate(.7) contrast(1.15); }
.article-hero__veil { position:sticky; top:0; height:100svh; margin-top:-100svh; background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.16) 42%,#050505 100%); }
.article-hero__content { position:absolute; z-index:2; top:0; left:0; display:flex; width:100%; height:100svh; flex-direction:column; justify-content:flex-end; padding:8rem var(--pad) clamp(3rem,6vw,6rem); }
.article-meta { display:flex; gap:clamp(1rem,4vw,4rem); border-top:1px solid rgba(255,255,255,.24); padding-top:.8rem; }
.article-meta p,.article-hero__scroll,.liquid-scene__eyebrow,.liquid-scene__note,.article-closing__label,.next-insight>p,.article-share p,.article-share a { font-size:.58rem; letter-spacing:.18em; }
.article-meta p { margin:0; }
.article-hero h1 { max-width:94rem; margin:clamp(1.5rem,3vw,3rem) 0 1.6rem; font-size:clamp(4.6rem,12.8vw,13.5rem); font-weight:400; letter-spacing:-.075em; line-height:.72; }
.article-hero h1 span { display:block; }
.article-hero h1 span:nth-child(2) { padding-left:14vw; }
.article-hero h1 em { color:transparent; font-style:normal; -webkit-text-stroke:1px rgba(255,255,255,.72); }
.article-hero__dek { width:min(38rem,82vw); margin:0 0 0 auto; font-size:clamp(1rem,1.5vw,1.4rem); line-height:1.4; }
.article-hero__scroll { position:absolute; bottom:3rem; left:var(--pad); margin:0; }
.article-hero__scroll i { color:var(--blue); font-style:normal; }
.article-opening { display:grid; min-height:130svh; grid-template-columns:minmax(8rem,1fr) minmax(0,4fr); gap:4vw; padding:14vw var(--pad); background:var(--paper); color:#0a0a0a; }
.article-opening__index,.article-body__rail { position:relative; }
.article-opening__index span,.article-body__rail span { display:block; margin-bottom:1rem; color:#187ea3; font-size:.68rem; }
.article-opening__index p,.article-body__rail p { margin:0; font-size:.58rem; letter-spacing:.18em; }
.article-opening__lead { grid-column:2; }
.article-opening__lead p { max-width:70rem; margin:0; font-size:clamp(2.5rem,6.4vw,7rem); letter-spacing:-.055em; line-height:.96; }
.article-copy { grid-column:2; width:min(44rem,100%); margin:8vw 0 0 auto; font-family:Georgia,"Times New Roman",serif; font-size:clamp(1.15rem,1.55vw,1.5rem); line-height:1.72; }
.article-copy p { margin:0 0 1.6em; }
.liquid-scene { position:relative; min-height:115svh; display:flex; overflow:hidden; flex-direction:column; justify-content:center; padding:10vw var(--pad); background:#050505; isolation:isolate; }
.liquid-scene__orb { position:absolute; z-index:-1; top:50%; left:50%; width:min(78vw,68rem); aspect-ratio:1; border:1px solid rgba(114,220,255,.18); border-radius:48% 52% 62% 38% / 39% 41% 59% 61%; background:radial-gradient(circle at 38% 32%,rgba(114,220,255,.28),rgba(15,54,75,.08) 36%,transparent 66%); filter:blur(1px); transform:translate(-50%,-50%) rotate(var(--orb-rotation,0deg)); box-shadow:inset 0 0 8rem rgba(114,220,255,.06),0 0 7rem rgba(31,139,184,.08); }
.liquid-scene__eyebrow { margin:0 0 5vw; color:var(--blue); }
.liquid-scene blockquote { margin:0; font-size:clamp(4.5rem,12vw,13rem); font-weight:400; letter-spacing:-.075em; line-height:.77; }
.liquid-scene blockquote span,.liquid-scene blockquote em { display:block; }
.liquid-scene blockquote em { padding-left:14vw; color:transparent; font-style:normal; -webkit-text-stroke:1px rgba(255,255,255,.62); }
.liquid-scene blockquote span:last-child { padding-left:43vw; color:var(--blue); }
.liquid-scene__note { width:min(24rem,80vw); margin:5vw 0 0 auto; line-height:1.7; color:var(--muted); }
.article-body { display:grid; grid-template-columns:minmax(8rem,1fr) minmax(0,4fr); gap:4vw; padding:14vw var(--pad); background:#080808; }
.article-body__rail { color:var(--muted); }
.article-copy--long { margin:0; }
.article-copy__first::first-letter { float:left; margin:.06em .13em 0 0; color:var(--blue); font-family:"Cronic Sans",Arial,sans-serif; font-size:5.7em; line-height:.72; }
.article-pullquote { margin:7vw -12vw 7vw 0; padding:5vw 0; border-top:1px solid rgba(114,220,255,.36); border-bottom:1px solid rgba(114,220,255,.18); font-family:"Cronic Sans",Arial,sans-serif; }
.article-pullquote blockquote { margin:0; font-size:clamp(2.8rem,6vw,6.8rem); letter-spacing:-.055em; line-height:.95; }
.article-pullquote figcaption { margin-top:1.4rem; color:var(--blue); font-size:.55rem; letter-spacing:.18em; }
.article-image-break { position:relative; min-height:120svh; display:flex; overflow:hidden; align-items:flex-end; padding:8vw var(--pad); isolation:isolate; }
.article-image-break::after { position:absolute; z-index:-1; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.8)); content:""; }
.article-image-break__media { position:absolute; z-index:-2; inset:0; }
.article-image-break__media video { width:100%; height:100%; object-fit:cover; filter:saturate(.7) contrast(1.15); }
.article-image-break__copy p { font-size:.58rem; letter-spacing:.18em; }
.article-image-break__copy h2 { max-width:75rem; margin:1rem 0 0; font-size:clamp(3.5rem,9vw,10rem); font-weight:400; letter-spacing:-.07em; line-height:.88; }
.article-image-break__copy em { color:var(--blue); font-style:normal; }
.article-closing { display:grid; min-height:100svh; grid-template-columns:minmax(8rem,1fr) minmax(0,4fr); gap:4vw; align-content:center; padding:12vw var(--pad); background:var(--paper); color:#090909; }
.article-closing__label { margin:0; }
.article-copy--closing { grid-column:2; width:min(62rem,100%); margin:0; font-family:"Cronic Sans",Arial,sans-serif; font-size:clamp(2rem,4.5vw,5rem); letter-spacing:-.045em; line-height:1.02; }
.article-share { grid-column:2; display:flex; gap:2rem; align-items:center; margin-top:7vw; border-top:1px solid rgba(0,0,0,.25); padding-top:1rem; }
.article-share p { margin-right:auto; }
.next-insight { min-height:92svh; display:flex; flex-direction:column; justify-content:center; padding:10vw var(--pad); background:#050505; }
.next-insight>p { color:var(--blue); }
.next-insight a { display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; border-top:1px solid rgba(255,255,255,.22); padding-top:2rem; }
.next-insight a span { max-width:76rem; font-size:clamp(3.5rem,8.5vw,9rem); letter-spacing:-.065em; line-height:.9; }
.next-insight a i { color:var(--blue); font-size:clamp(3rem,6vw,6rem); font-style:normal; transition:transform .35s; }
.next-insight a:hover i { transform:translate(1rem,-1rem); }
.article-footer { display:grid; grid-template-columns:1fr auto 1fr; align-items:end; padding:4rem var(--pad) 2rem; border-top:1px solid rgba(255,255,255,.12); }
.article-footer img { width:8rem; }
.article-footer p,.article-footer a { margin:0; font-size:.52rem; letter-spacing:.16em; }
.article-footer a { justify-self:end; }
.archive-article__hero { position:relative; min-height:145vh; min-height:145svh; overflow:hidden; background:#050505; }
.archive-article__hero-media { position:sticky; top:0; height:100vh; height:100svh; overflow:hidden; will-change:transform; }
.archive-article__hero-media img { width:100%; height:100%; object-fit:cover; filter:saturate(.78) contrast(1.08); }
.archive-article__hero-veil { position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.15),rgba(0,0,0,.25) 40%,#050505 100%); }
.archive-article__hero-content { position:absolute; z-index:2; right:0; bottom:0; left:0; display:flex; min-height:100vh; min-height:100svh; flex-direction:column; justify-content:flex-end; padding:8rem var(--pad) clamp(3rem,6vw,6rem); }
.archive-article__hero h1 { max-width:88rem; margin:clamp(1.4rem,3vw,3rem) 0 1.6rem; font-size:clamp(3.5rem,9.6vw,10.5rem); font-weight:400; letter-spacing:-.07em; line-height:.84; text-wrap:balance; }
.archive-article__content { display:grid; grid-template-columns:minmax(9rem,1fr) minmax(0,4fr); gap:5vw; padding:12vw var(--pad); background:var(--paper); color:#0a0a0a; }
.archive-article__rail { align-self:start; position:sticky; top:8rem; display:flex; flex-direction:column; gap:.9rem; border-top:1px solid rgba(0,0,0,.25); padding-top:1rem; }
.archive-article__rail span { color:#187ea3; font-size:.68rem; }
.archive-article__rail p,.archive-article__rail a { margin:0; font-size:.55rem; letter-spacing:.16em; line-height:1.6; }
.archive-article__rail a { margin-top:1rem; color:#166b8a; }
.archive-article__body { grid-column:2; width:min(56rem,100%); font-family:Georgia,"Times New Roman",serif; font-size:clamp(1.08rem,1.4vw,1.34rem); line-height:1.72; }
.archive-article__body>p:first-of-type::first-letter { float:left; margin:.07em .13em 0 0; color:#187ea3; font-family:"Cronic Sans",Arial,sans-serif; font-size:5.2em; line-height:.7; }
.archive-article__body p { margin:0 0 1.55em; }
.archive-article__body h2,.archive-article__body h3,.archive-article__body h4 { margin:2.2em 0 .65em; font-family:"Cronic Sans",Arial,sans-serif; font-weight:500; letter-spacing:-.035em; line-height:1.08; }
.archive-article__body h2 { font-size:clamp(2.2rem,4.4vw,4.8rem); }
.archive-article__body h3 { font-size:clamp(1.55rem,2.7vw,2.8rem); }
.archive-article__body h4 { font-size:clamp(1.25rem,2vw,2rem); }
.archive-article__body ul,.archive-article__body ol { margin:0 0 2em; padding-left:1.35em; }
.archive-article__body li { margin:.55em 0; padding-left:.25em; }
.archive-article__body a { color:#11698a; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:.18em; }
.archive-article__body strong { font-weight:700; }
.archive-article__body blockquote { margin:3.5rem 0; border-block:1px solid rgba(17,105,138,.35); padding:2.5rem 0; font-family:"Cronic Sans",Arial,sans-serif; font-size:clamp(1.8rem,3.6vw,3.8rem); letter-spacing:-.04em; line-height:1.08; }
.archive-article__body img { display:block; width:auto; max-width:100%; height:auto; margin:3rem auto; border-radius:.15rem; }
.archive-article__body figure { max-width:100%; margin:3rem 0; }
.archive-article__body figcaption { margin-top:.75rem; color:rgba(0,0,0,.62); font-family:"Cronic Sans",Arial,sans-serif; font-size:.72rem; line-height:1.5; }
.archive-article__body table { display:block; width:100%; max-width:100%; overflow-x:auto; border-collapse:collapse; font-family:"Cronic Sans",Arial,sans-serif; font-size:.86rem; }
.archive-article__body th,.archive-article__body td { min-width:9rem; padding:.8rem; border:1px solid rgba(0,0,0,.2); text-align:left; }
.archive-article__body .insight-embed { margin:3rem 0; font-family:"Cronic Sans",Arial,sans-serif; font-size:.72rem; letter-spacing:.12em; }
.archive-article__body .insight-embed a { display:inline-flex; border:1px solid rgba(17,105,138,.35); padding:1rem 1.2rem; text-decoration:none; }
.archive-article__share { display:flex; gap:2rem; align-items:center; padding:2rem var(--pad) 8rem; background:var(--paper); color:#090909; }
.archive-article__share::before { position:absolute; right:var(--pad); left:var(--pad); height:1px; margin-top:-9rem; background:rgba(0,0,0,.2); content:""; }
.archive-article__share p,.archive-article__share a { font-size:.58rem; letter-spacing:.18em; }
.archive-article__share p { margin-right:auto; }
.reveal { opacity:0; transform:translateY(2rem); transition:opacity .85s cubic-bezier(.16,1,.3,1),transform 1s cubic-bezier(.16,1,.3,1); }
.reveal.is-visible { opacity:1; transform:none; }
@media(max-width:820px){.article-header{grid-template-columns:1fr auto;height:5rem}.article-header>p{display:none}.article-header__back{font-size:.48rem}.article-hero{height:160svh}.article-hero__content{padding-bottom:5rem}.article-meta{gap:1rem;flex-wrap:wrap}.article-meta p{font-size:.48rem}.article-hero h1{font-size:clamp(4rem,20vw,7.5rem);line-height:.78}.article-hero h1 span:nth-child(2){padding-left:8vw}.article-hero__dek{margin-left:0}.article-opening,.article-body,.article-closing{grid-template-columns:1fr;padding-block:7rem}.article-opening__lead,.article-copy,.article-copy--closing,.article-share{grid-column:1}.article-opening__lead{margin-top:4rem}.article-copy{margin-top:4rem}.article-body__rail{margin-bottom:3rem}.article-pullquote{margin:5rem 0}.liquid-scene blockquote{font-size:clamp(4rem,20vw,7rem)}.liquid-scene blockquote span:last-child{padding-left:16vw}.article-image-break{min-height:100svh}.archive-article__hero{min-height:125svh}.archive-article__hero h1{font-size:clamp(3.2rem,15vw,6rem);line-height:.88}.archive-article__hero-content{padding-bottom:5rem}.archive-article__content{grid-template-columns:1fr;padding-block:6rem}.archive-article__rail{position:static;margin-bottom:2.5rem}.archive-article__body{grid-column:1}.archive-article__body h2{font-size:clamp(2.1rem,10vw,3.8rem)}.archive-article__share{flex-wrap:wrap;padding-bottom:6rem}.archive-article__share p{width:100%;margin:0}.article-footer{grid-template-columns:1fr auto}.article-footer p{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}}