@font-face { font-family:'Alata'; src:url('./fonts/alata-latin-v12.woff2') format('woff2'); font-style:normal; font-weight:400; font-display:swap; }

*,*::before,*::after { box-sizing:border-box; }
:root { --feature-ink:#f3f2ee; --feature-dim:#aaaab3; --feature-bg:#101114; --feature-panel:#17191d; --feature-red:#e26e68; --feature-green:#6fb394; }
html { scroll-behavior:smooth; scroll-padding-top:72px; }
body.milnern-feature-page { margin:0; overflow-x:clip; color:var(--feature-ink); background:var(--feature-bg); font-family:'Alata',Arial,sans-serif; }
.milnern-feature-page a { color:inherit; text-decoration:none; }
.feature-progress { position:fixed; inset:0 0 auto; z-index:20; height:3px; background:rgba(255,255,255,.12); }
.feature-progress span { display:block; width:0; height:100%; background:linear-gradient(90deg,#67b38d,#e3776e); transform-origin:left center; }
.feature-header { position:sticky; top:0; z-index:15; height:57px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(18px,4vw,64px); background:rgba(16,17,20,.9); border-bottom:1px solid rgba(255,255,255,.1); backdrop-filter:blur(15px); }
.feature-brand { display:flex; align-items:center; gap:10px; font-size:12px; font-weight:900; letter-spacing:.06em; }
.feature-brand b { display:grid; place-items:center; width:34px; height:27px; color:#fff; background:#303bdd; transform:skew(-7deg); font-size:12px; }
.feature-brand small { display:block; color:#aeb2ff; font-size:8px; letter-spacing:.22em; }
.feature-edition { color:#d3d2d0; font-size:9px; font-weight:900; letter-spacing:.18em; }
.feature-edition i { margin:0 7px; color:var(--feature-red); font-style:normal; }
.feature-back { color:#cbcbd0; font-size:11px; font-weight:700; }
.feature-back:hover,.feature-inline-link:hover,.feature-home-link:hover { color:#fff; }
.feature-hero { position:relative; min-height:min(850px,calc(100svh - 57px)); height:min(850px,calc(100svh - 57px)); overflow:hidden; background:#181a20; }
.feature-hero-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 35%; }
.feature-hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(9,10,13,.88),rgba(9,10,13,.48) 43%,rgba(9,10,13,.02) 82%),linear-gradient(0deg,rgba(9,10,13,.8),transparent 34%); pointer-events:none; }
.feature-hero-copy { position:absolute; left:max(7vw,calc((100vw - 1220px)/2)); bottom:clamp(52px,9vh,110px); z-index:2; width:min(720px,82vw); }
.feature-eyebrow { display:flex; align-items:center; gap:10px; margin:0 0 22px; color:#e4e1db; font-size:10px; font-weight:900; letter-spacing:.14em; }
.feature-eyebrow span { color:#a8ddb9; }
.feature-eyebrow i { width:4px; height:4px; border-radius:50%; background:var(--feature-red); }
.feature-hero h1 { max-width:760px; margin:0; color:#fff; font-size:clamp(48px,8.5vw,118px); line-height:.91; letter-spacing:-.075em; text-wrap:balance; }
.feature-hero h1 em { color:#d2e6d8; font-style:normal; }
.feature-deck { max-width:615px; margin:24px 0 23px; color:#e1dfe0; font-size:clamp(16px,1.65vw,20px); line-height:1.55; }
.feature-start { display:inline-flex; align-items:center; gap:16px; padding:11px 15px; border:1px solid rgba(255,255,255,.45); font-size:11px; font-weight:900; letter-spacing:.07em; text-transform:uppercase; transition:background .2s,border-color .2s; }
.feature-start:hover { background:rgba(255,255,255,.15); border-color:#fff; }
.feature-start span { font-size:17px; }
.hero-caption { position:absolute; z-index:2; right:clamp(18px,4vw,64px); bottom:20px; color:rgba(255,255,255,.72); font-size:10px; text-align:right; }
.feature-intro { display:grid; grid-template-columns:minmax(240px,1fr) minmax(220px,.74fr); gap:clamp(30px,8vw,112px); align-items:start; width:min(960px,calc(100% - 48px)); margin:0 auto; padding:126px 0 64px; }
.feature-intro p { margin:0; color:#d3d2d0; font-size:17px; line-height:1.8; }
.feature-intro .dropcap { color:#f5f3ee; font-size:clamp(22px,2.45vw,31px); line-height:1.52; letter-spacing:-.025em; }
.feature-intro .dropcap::first-letter { float:left; margin:.09em .16em 0 0; color:#9dcaaa; font-size:3.1em; line-height:.76; }
.intro-rule { grid-column:1/-1; display:grid; grid-template-columns:38px 1fr 30px; align-items:center; gap:14px; margin-top:42px; padding-top:17px; border-top:1px solid #37383d; color:#a9aab2; font-size:9px; font-weight:900; letter-spacing:.2em; }
.intro-rule span:first-child { color:#a7d8b8; }
.intro-rule span:last-child { justify-self:end; font-size:18px; }
.feature-chapter { display:grid; grid-template-columns:minmax(0,1fr) minmax(190px,290px); align-items:center; gap:clamp(40px,10vw,160px); width:min(1120px,calc(100% - 48px)); min-height:min(720px,80svh); margin:25px auto; padding:70px clamp(16px,5vw,72px); border-top:1px solid #292a2e; border-bottom:1px solid #292a2e; }
.feature-chapter.chapter-right { grid-template-columns:minmax(190px,290px) minmax(0,1fr); }
.chapter-copy { max-width:620px; }
.chapter-right .chapter-copy { grid-column:2; }
.chapter-right .chapter-aside { grid-column:1; grid-row:1; }
.chapter-index { display:block; margin-bottom:22px; color:#9dd3b1; font-size:10px; font-weight:900; letter-spacing:.19em; }
.chapter-index i { margin:0 6px; color:var(--feature-red); font-style:normal; }
.chapter-copy h2,.feature-ending h2 { max-width:610px; margin:0 0 25px; color:#f6f4ef; font-size:clamp(37px,5.8vw,76px); line-height:.98; letter-spacing:-.065em; text-wrap:balance; }
.chapter-copy p,.feature-ending > p:not(.chapter-index) { margin:0 0 17px; color:#c6c5c7; font-size:16px; line-height:1.82; }
.chapter-copy blockquote,.feature-ending blockquote { margin:29px 0 8px; padding:17px 0 0 19px; border-left:2px solid var(--feature-red); color:#f1eee9; font-size:clamp(18px,2.3vw,25px); font-weight:700; line-height:1.45; letter-spacing:-.02em; }
.chapter-copy cite,.feature-ending cite { display:block; margin-top:11px; color:#9da0a8; font-size:10px; font-style:normal; font-weight:600; letter-spacing:.04em; }
.chapter-aside { display:flex; flex-direction:column; gap:9px; align-items:flex-start; align-self:center; color:#888a92; font-size:9px; font-weight:900; line-height:1.55; letter-spacing:.12em; }
.pull-number { color:#97caa8; font-size:clamp(96px,15vw,180px); line-height:.8; letter-spacing:-.09em; }
.pull-number-outline { color:transparent; -webkit-text-stroke:1px #b4b4bb; }
.pull-quote { max-width:250px; color:#eeede9; font-size:clamp(22px,2.8vw,32px); font-weight:700; line-height:1.32; letter-spacing:-.04em; }
.chapter-side-note { max-width:240px; padding-top:13px; border-top:2px solid #ae605c; color:#bebdc2; font-size:13px; line-height:1.65; }
.aside-stamp { display:block; padding:14px 16px; color:#18221d; background:#a4d2af; font-size:10px; line-height:1.5; letter-spacing:.18em; transform:rotate(-4deg); }
.aside-stamp b { font-size:23px; line-height:1.05; letter-spacing:-.03em; }
.aside-stamp-light { color:#161719; background:#eee8dc; }
.feature-photo { position:relative; width:min(1320px,calc(100% - 48px)); margin:28px auto 90px; }
.feature-photo img { display:block; width:100%; max-height:78svh; aspect-ratio:16/9; object-fit:cover; background:#1a1b20; }
.feature-photo-small { width:min(990px,calc(100% - 48px)); }
.feature-photo-small img { aspect-ratio:16/8.6; object-position:center 39%; }
.feature-photo figcaption { margin:10px 2px 0; color:#898a91; font-size:10px; line-height:1.55; }
.feature-timeline { display:flex; align-items:center; width:min(760px,calc(100% - 48px)); margin:50px auto 75px; color:#aeb0b5; font-size:10px; font-weight:900; letter-spacing:.12em; }
.feature-timeline i { flex:1; height:1px; margin:0 12px; background:#44454a; }
.feature-timeline span:first-child,.feature-timeline span:last-child { color:#a3d5b5; }
.feature-interlude { display:grid; place-content:center; min-height:440px; padding:48px 24px; text-align:center; background:radial-gradient(ellipse at 50% 52%,#202722,#131517 69%); }
.feature-interlude span { max-width:840px; color:#e8e8e0; font-size:clamp(28px,5.4vw,67px); line-height:1.05; letter-spacing:-.06em; }
.feature-interlude small { margin-top:23px; color:#9acbab; font-size:9px; font-weight:900; letter-spacing:.21em; }
.feature-voices,.feature-experts,.feature-social { width:min(1120px,calc(100% - 48px)); margin:112px auto; }
.voices-heading,.experts-heading { max-width:760px; margin:0 0 37px; }
.voices-heading h2,.experts-heading h2,.social-heading h2 { margin:0 0 12px; color:#f6f4ef; font-size:clamp(36px,5vw,64px); line-height:1; letter-spacing:-.06em; }
.voices-heading > p { margin:0; color:#aeadb2; font-size:15px; line-height:1.7; }
.voice-featured { position:relative; margin:0 0 12px; padding:32px 38px 28px; border-left:3px solid #9ed1ae; background:linear-gradient(100deg,#202722,#17191c 78%); }
.voice-featured p { max-width:830px; margin:0; color:#f1efe9; font-size:clamp(23px,3.2vw,39px); line-height:1.35; letter-spacing:-.025em; }
.voice-featured cite { display:block; margin-top:22px; color:#9ed1ae; font-size:10px; font-style:normal; font-weight:900; letter-spacing:.16em; text-transform:uppercase; }
.voices-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.voices-grid blockquote { display:flex; flex-direction:column; justify-content:space-between; min-height:166px; margin:0; padding:20px; border:1px solid #34363b; background:#17191c; }
.voices-grid blockquote p { margin:0; color:#e2e0dc; font-size:14px; line-height:1.65; }
.voices-grid cite { display:block; margin-top:19px; color:#9ed1ae; font-size:9px; font-style:normal; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }
.feature-experts { padding:64px clamp(20px,5vw,70px); border:1px solid #35383a; background:radial-gradient(ellipse at 90% 0%,#26332b 0,transparent 50%),#151719; }
.experts-list { border-top:1px solid #444743; }
.experts-list blockquote { display:grid; grid-template-columns:minmax(165px,.5fr) 1.5fr; align-items:start; gap:30px; margin:0; padding:20px 0; border-bottom:1px solid #444743; }
.experts-list cite { color:#d69a8f; font-size:9px; font-style:normal; font-weight:900; letter-spacing:.1em; line-height:1.6; }
.experts-list cite span { color:#a9aaa6; font-weight:600; }
.experts-list p { margin:0; color:#e2e0dc; font-size:15px; line-height:1.65; }
.feature-social { margin-top:130px; padding-top:34px; border-top:1px solid #34363b; }
.social-heading { display:flex; align-items:end; justify-content:space-between; gap:28px; margin-bottom:24px; }
.social-heading h2 { max-width:650px; font-size:clamp(32px,4.7vw,55px); }
.social-controls { display:flex; gap:8px; flex:none; }
.social-controls button { display:grid; width:42px; height:42px; place-items:center; border:1px solid #4a4c51; color:#f1eee9; background:#1a1c20; font:inherit; font-size:20px; cursor:pointer; transition:background .18s,border-color .18s; }
.social-controls button:hover { border-color:#a0d0ae; background:#242b27; }
.social-track { display:grid; grid-auto-columns:minmax(285px,390px); grid-auto-flow:column; gap:13px; overflow-x:auto; padding:0 0 16px; scroll-snap-type:x mandatory; scrollbar-color:#555a57 #1a1b1e; scrollbar-width:thin; }
.social-card { min-height:235px; padding:20px; border:1px solid #383a3f; border-radius:9px; background:#191a1e; scroll-snap-align:start; }
.social-account { display:flex; align-items:center; gap:10px; }
.social-avatar { display:grid; width:36px; height:36px; place-items:center; border-radius:50%; color:#fff; background:#313bdd; font-size:10px; font-weight:900; }
.social-avatar-warm { background:#a65f43; }.social-avatar-green { background:#456c56; }.social-avatar-blue { background:#40637c; }
.social-account b,.social-account small { display:block; }
.social-account b { color:#f1efeb; font-size:11px; }
.social-account small { margin-top:3px; color:#909199; font-size:9px; }
.social-mark { margin-left:auto; color:#afb0b7; font-size:20px; }
.social-card > p { min-height:94px; margin:20px 0 17px; color:#e0dfe1; font-size:14px; line-height:1.65; }
.social-stats { display:flex; justify-content:space-between; padding-top:12px; border-top:1px solid #303136; color:#92949b; font-size:9px; }
.feature-inline-link { display:inline-flex; align-items:center; gap:8px; margin-top:10px; padding-bottom:3px; border-bottom:1px solid #656769; color:#a8d9b7!important; font-size:12px; font-weight:900; }
.feature-ending { width:min(790px,calc(100% - 48px)); margin:110px auto 115px; }
.feature-ending .chapter-index { margin-bottom:21px; }
.feature-ending h2 { max-width:740px; margin-bottom:27px; font-size:clamp(48px,8vw,92px); }
.feature-ending > p:not(.chapter-index) { font-size:17px; }
.feature-related { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:57px; }
.feature-related a { display:flex; flex-direction:column; gap:11px; min-height:139px; padding:15px; border:1px solid #3c3d42; background:#17191d; transition:transform .2s,border-color .2s,background .2s; }
.feature-related a:hover { transform:translateY(-3px); border-color:#9acbab; background:#1c2020; }
.feature-related small { color:#9fd5b1; font-size:9px; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }
.feature-related strong { flex:1; color:#efeee9; font-size:15px; line-height:1.18; }
.feature-related a span { color:#aaaab1; font-size:10px; font-weight:800; }
.feature-home-link { display:inline-block; margin-top:34px; color:#c4c3c6; font-size:11px; font-weight:800; }
.feature-footer { display:flex; justify-content:space-between; padding:24px clamp(18px,4vw,64px); border-top:1px solid #303136; color:#81828a; font-size:9px; font-weight:900; letter-spacing:.14em; }
.milnern-feature-page .image-viewer { z-index:50; }
.milnern-feature-page .image-viewer-frame { background:#18191d; }
.milnern-feature-page .image-viewer-caption { color:#d7d5d1; }
.milnern-feature-page .image-viewer-open-story { display:none; }
.enter { opacity:1; transform:none; }
.motion-ready .enter { opacity:0; transform:translateY(22px); transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1); }
.motion-ready .enter.is-visible { opacity:1; transform:translateY(0); }
@media(max-width:760px) {
  .feature-header { height:52px; padding:0 14px; }
  .feature-edition { font-size:7px; letter-spacing:.1em; }
  .feature-edition i { margin:0 3px; }
  .feature-brand { gap:7px; font-size:9px; }
  .feature-brand b { width:29px; height:23px; font-size:10px; }
  .feature-back { font-size:9px; }
  .feature-hero { height:calc(92svh - 52px); min-height:640px; }
  .feature-hero-image { object-position:58% center; }
  .feature-hero-shade { background:linear-gradient(0deg,rgba(9,10,13,.93),rgba(9,10,13,.56) 46%,rgba(9,10,13,.05)); }
  .feature-hero-copy { left:22px; bottom:56px; width:calc(100% - 44px); }
  .feature-eyebrow { flex-wrap:wrap; gap:7px; font-size:8px; }
  .feature-hero h1 { font-size:clamp(43px,13vw,68px); }
  .feature-deck { margin:18px 0; font-size:15px; }
  .hero-caption { right:14px; bottom:12px; left:14px; font-size:8px; text-align:left; }
  .feature-intro { display:block; width:calc(100% - 40px); padding:79px 0 38px; }
  .feature-intro p { font-size:15px; }
  .feature-intro .dropcap { margin-bottom:22px; font-size:23px; }
  .intro-rule { margin-top:31px; }
  .feature-chapter,.feature-chapter.chapter-right { grid-template-columns:1fr; gap:25px; width:100%; min-height:0; margin:11px 0; padding:77px 22px; }
  .chapter-copy,.chapter-right .chapter-copy { grid-column:1; grid-row:1; }
  .chapter-aside,.chapter-right .chapter-aside { grid-column:1; grid-row:2; }
  .chapter-copy h2 { font-size:clamp(40px,11vw,60px); }
  .chapter-copy p { font-size:15px; }
  .chapter-aside { flex-direction:row; align-items:center; gap:17px; }
  .pull-number { font-size:90px; }
  .pull-quote { max-width:310px; font-size:23px; }
  .chapter-side-note { max-width:290px; }
  .aside-stamp { padding:11px 14px; }
  .feature-photo,.feature-photo-small { width:100%; margin:20px 0 47px; }
  .feature-photo img,.feature-photo-small img { width:100%; max-height:none; aspect-ratio:4/3; }
  .feature-photo-small img { aspect-ratio:4/3; }
  .feature-photo figcaption { padding:0 15px; font-size:9px; }
  .feature-timeline { width:calc(100% - 32px); margin:42px auto; font-size:8px; }
  .feature-timeline i { margin:0 5px; }
  .feature-interlude { min-height:320px; }
  .feature-interlude span { font-size:39px; }
  .feature-voices,.feature-experts,.feature-social { width:calc(100% - 36px); margin:76px auto; }
  .voices-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .voices-grid blockquote { min-height:0; padding:16px; }
  .voices-grid blockquote p { font-size:15px; }
  .voice-featured { padding:24px 22px 21px; }
  .voice-featured p { font-size:25px; }
  .feature-experts { padding:34px 20px; }
  .experts-list blockquote { grid-template-columns:1fr; gap:7px; padding:17px 0; }
  .experts-list p { font-size:14px; }
  .social-heading { align-items:start; }
  .social-heading h2 { font-size:36px; }
  .social-controls { padding-top:20px; }
  .social-controls button { width:36px; height:36px; }
  .social-track { grid-auto-columns:minmax(270px,86vw); }
  .feature-ending { width:calc(100% - 42px); margin:76px auto 77px; }
  .feature-ending h2 { font-size:clamp(48px,13vw,70px); }
  .feature-ending > p:not(.chapter-index) { font-size:15px; }
  .feature-related { grid-template-columns:1fr; gap:8px; margin-top:38px; }
  .feature-related a { min-height:100px; }
  .feature-footer { padding:19px 14px; font-size:8px; }
}
@media(max-width:520px) {
  .voices-grid { grid-template-columns:1fr; }
  .voices-grid blockquote { min-height:0; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
  .motion-ready .enter { opacity:1; transform:none; }
}