:root { --ink:#f6f3ed; --paper:#080808; --red:#cf1d20; --blue:#111111; --line:#3a3a3a; --mono:'DM Mono', monospace; --sans:'DM Sans', sans-serif; --display:'Archivo Black', sans-serif; --serif:'Playfair Display', serif; }
.brand { display:flex; align-items:center; gap:11px; }
.logo-frame { width:51px; height:51px; overflow:hidden; display:grid; place-items:center; }
.brand img { width:51px; height:51px; object-fit:contain; transform:scale(1.65); }
.brand b { color:var(--ink); }
.footer-brand { display:flex; align-items:center; gap:12px; }
.footer-logo-link { display:block; line-height:0; }
.footer-brand img { width:50px; height:50px; object-fit:contain; }
.article-header { max-width:1160px; }
.back-link { font-size:13px; font-weight:700; border-bottom:1px solid var(--ink); padding-bottom:4px; }
.article-index,.article-page { max-width:960px; margin:auto; padding:100px 24px 125px; }
.article-index h1,.article-page h1 { margin:12px 0 50px; font:clamp(48px,7vw,85px)/.95 var(--display); letter-spacing:-4px; }
.article-index h1 em { font-family:var(--serif); }
.public-articles { border-top:2px solid var(--ink); }
.public-article { padding:31px 0 34px; border-bottom:1px solid var(--line); }
.public-article h2 { max-width:760px; margin:13px 0 11px; font:800 clamp(26px,4vw,43px)/1.02 var(--sans); letter-spacing:-2px; }
.public-article>p:not(.article-meta) { max-width:590px; margin:0; color:#625e59; font-size:16px; line-height:1.5; }
.article-page article { max-width:720px; }
.article-page h1 { margin:15px 0 23px; }
.article-excerpt { max-width:660px; margin:0 0 42px; font:24px/1.35 var(--serif); }
.article-body { font-size:18px; line-height:1.7; }
.article-body p { margin:0 0 24px; }
.hero { background:#121212 !important; }
.hero-art { background:radial-gradient(ellipse at 75% 43%, rgba(207,29,32,.72), transparent 24%), radial-gradient(ellipse at 55% 0%, #3a1012, transparent 45%), linear-gradient(125deg,#080808 0%,#26090b 48%,#101010 100%) !important; }
.img-cobalt { background:linear-gradient(135deg,#050505,#471012 55%,#d0b6a5) !important; }
.hero { background:#fff !important; color:#111 !important; }
.hero-art { background:#fff !important; }
.hero-art > div { display:none; }
.hero-logo { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; transform:scale(1.5); }
.hero h1 { color:#111; }
.hero h1 em { color:var(--red); }
.hero .dek { color:#111; }
.hero .read-link { color:#111; }
.photo-note { color:#111 !important; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); } a { color:inherit; text-decoration:none; } .top-ticker { background:var(--ink); color:#fff; height:32px; display:flex; align-items:center; justify-content:center; gap:13px; font:10px var(--mono); letter-spacing:.11em; } .ticker-dot { width:6px; height:6px; border-radius:50%; background:var(--red); }
.site-header { height:88px; max-width:1400px; margin:auto; display:flex; align-items:center; justify-content:space-between; padding:0 48px; border-bottom:1px solid var(--line); position:relative; } .brand,.footer-brand { font:18px/.82 var(--display); letter-spacing:-1.2px; position:relative; } .brand span,.footer-brand span { color:var(--red); } .brand i { display:inline-block; width:6px; height:6px; margin:0 0 13px 2px; background:var(--blue); border-radius:50%; } nav { display:flex; gap:31px; position:absolute; left:50%; transform:translateX(-50%); } nav a { padding:35px 0 31px; font-size:13px; font-weight:600; } nav a.active { border-bottom:3px solid var(--red); } .subscribe-btn { border:0; background:var(--red); color:#fff; padding:12px 17px; font:600 12px var(--sans); cursor:pointer; } .subscribe-btn span { font-size:16px; margin-left:10px; } .menu-btn { display:none; }
.hero { height:670px; max-width:1400px; margin:auto; position:relative; overflow:hidden; background:#151324; color:#fff; } .hero-art { position:absolute; inset:0; overflow:hidden; background:radial-gradient(ellipse at 75% 43%, rgba(244,49,60,.65), transparent 24%), radial-gradient(ellipse at 55% 0%, #5d256b, transparent 45%), linear-gradient(125deg,#14122e 0%,#25112c 48%,#120f21 100%); } .lights { position:absolute; width:60%; height:55%; filter:blur(28px); opacity:.8; transform:rotate(-25deg); } .light-one { left:28%; top:-31%; background:linear-gradient(transparent 30%, rgba(245,65,37,.7)); } .light-two { left:51%; top:5%; background:linear-gradient(transparent 30%, rgba(94,70,255,.55)); } .light-three { right:-20%; top:10%; background:linear-gradient(transparent 35%, rgba(231,52,52,.55)); transform:rotate(30deg); } .crowd { position:absolute; bottom:0; height:38%; width:100%; background:radial-gradient(ellipse at 15% 85%,#241624 0 2%,transparent 3%),radial-gradient(ellipse at 25% 76%,#301e31 0 2%,transparent 3%),radial-gradient(ellipse at 46% 87%,#332437 0 2%,transparent 3%),radial-gradient(ellipse at 80% 77%,#2d1f32 0 2%,transparent 3%),linear-gradient(0deg,#08080e,#17101b); background-size:55px 42px,70px 54px,58px 41px,64px 51px,auto; opacity:.95; } .ring-rope { position:absolute; left:-4%; width:110%; height:7px; background:linear-gradient(0deg,#dfd4d0,#fff 42%,#8a777d); transform:rotate(-2.5deg); box-shadow:0 2px 3px #0008; z-index:2; } .rope-one { top:42%; } .rope-two { top:58%; } .rope-three { top:75%; } .wrestler { position:absolute; right:24%; bottom:9%; width:200px; height:420px; z-index:1; filter:drop-shadow(17px 11px 11px #000a); } .head { position:absolute; width:75px; height:94px; border-radius:43% 43% 38% 40%; left:59px; top:0; background:linear-gradient(90deg,#241627,#e58877 70%,#5e2633); } .body { position:absolute; width:145px; height:260px; left:25px; top:77px; border-radius:47% 53% 15% 17%; background:linear-gradient(90deg,#17131c,#593047 45%,#c76c63 80%,#301c2b); transform:skew(-6deg); } .arm { position:absolute; background:linear-gradient(90deg,#291827,#d17970,#512337); width:47px; height:250px; border-radius:30px; top:105px; } .arm-left { left:10px; transform:rotate(25deg); }.arm-right { right:0; transform:rotate(-33deg); } .hero-stamp { position:absolute; right:35px; top:35px; width:66px; height:66px; border:1px solid #fff8; border-radius:50%; display:grid; place-content:center; text-align:center; font:14px var(--display); line-height:.8; transform:rotate(12deg); }.hero-stamp small { font:7px var(--mono); }
.hero-copy { position:relative; z-index:4; width:55%; padding:99px 0 0 9%; }.eyebrow { text-transform:uppercase; font:10px var(--mono); letter-spacing:.13em; font-weight:500; }.eyebrow span { display:inline-block; height:1px; width:25px; margin:0 8px 3px; background:currentColor; }.hero h1 { font:clamp(50px,6.4vw,94px)/.95 var(--display); letter-spacing:-4px; margin:21px 0 25px; }.hero h1 em,.section-head h2 em,.manifesto h2 em { font-family:var(--serif); letter-spacing:-4px; }.dek { max-width:405px; font-size:15px; line-height:1.55; color:#ede9e5; }.read-link { display:inline-flex; gap:23px; margin-top:20px; padding-bottom:7px; border-bottom:1px solid currentColor; font-size:13px; font-weight:600; }.read-link b { color:var(--red); font-size:17px; line-height:11px; }.photo-note { position:absolute; z-index:3; right:38px; bottom:30px; text-align:right; color:#fff9; font:9px/1.5 var(--mono); }
.signal-strip { max-width:1400px; margin:auto; padding:21px 9%; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); }.signal-strip p { margin:0; font-size:13px; }.signal-strip p b { font:10px var(--mono); color:var(--red); letter-spacing:.1em; margin-right:19px; }.signal-strip a,.section-head>a { font:600 12px var(--sans); }.signal-strip span,.section-head>a span { color:var(--red); font-size:17px; margin-left:10px; }
.section-head { max-width:1400px; margin:0 auto; padding:115px 9% 48px; position:relative; }.section-head p { font:10px var(--mono); color:var(--red); letter-spacing:.1em; }.section-head h2 { margin:15px 0 0; font:clamp(38px,4.7vw,65px)/.98 var(--display); letter-spacing:-3px; }.section-head>a { position:absolute; right:9%; bottom:58px; border-bottom:1px solid var(--ink); padding-bottom:5px; }
.story-grid { max-width:1160px; margin:auto; display:grid; grid-template-columns:1.18fr .96fr; gap:30px; padding-bottom:130px; }.story-card h3 { font:800 26px/1.07 var(--sans); letter-spacing:-1.2px; margin:13px 0 9px; }.story-card p { font-size:14px; color:#625e59; margin:0 0 12px; }.story-card>a { font-size:12px; font-weight:700; border-bottom:1px solid; padding-bottom:4px; }.story-card>a b { color:var(--red); font-size:16px; margin-left:8px; }.card-image { height:309px; overflow:hidden; position:relative; }.img-cobalt { background:linear-gradient(135deg,#0e1872,#2738cc 55%,#f2c5a1); }.image-label { position:absolute; z-index:2; left:27px; top:25px; color:#fff; font:16px/.9 var(--display); letter-spacing:-1px; }.abstract-face { position:absolute; width:245px; height:330px; right:14%; bottom:-47px; background:radial-gradient(ellipse at 54% 18%,#f9e5d1 0 11%,transparent 11.5%), radial-gradient(ellipse at 53% 43%,#e89166 0 28%,transparent 28.5%), linear-gradient(55deg,transparent 45%,#15133d 45% 58%,transparent 58%); border-radius:45% 45% 35% 35%; transform:rotate(-10deg); }.review-image img,.reaction-image img { width:100%; height:100%; display:block; object-fit:cover; object-position:center; }.feature-card { padding-top:55px; }.feature-card .card-image { height:232px; }.img-red { background:var(--red); }.poster-text { position:absolute; left:29px; top:34px; color:#fff; font:44px/.8 var(--display); letter-spacing:-3px; }.poster-text i { font:43px var(--serif); letter-spacing:-3px; }.stripe { width:180px; height:290px; background:var(--blue); transform:rotate(36deg); position:absolute; right:59px; top:-20px; box-shadow:38px 0 #efc12d; }.article-meta { display:flex; gap:14px; margin-top:18px; text-transform:uppercase; color:#6f6b64; font:9px var(--mono); letter-spacing:.08em; }.article-meta span:first-child { color:var(--red); }.list-card { display:flex; gap:24px; grid-column:2; border-top:1px solid var(--ink); padding-top:21px; align-self:start; }.list-card .number { color:var(--red); font:38px var(--display); letter-spacing:-2px; }.list-card h3 { font-size:21px; margin-top:12px; }
.manifesto { background:var(--blue); color:#fff; min-height:570px; padding:112px max(9%,calc((100% - 1140px)/2)); position:relative; overflow:hidden; }.manifesto:after { content:'R'; font:600px var(--serif); color:#fff1; position:absolute; right:3%; top:-130px; }.manifesto>* { position:relative; z-index:1; }.manifesto-mark { position:absolute; left:8%; top:35px; font:150px var(--serif); color:var(--red); }.manifesto h2 { font:clamp(46px,5.5vw,79px)/.95 var(--display); letter-spacing:-4px; margin:19px 0 25px; }.manifesto>p:not(.eyebrow) { max-width:425px; font-size:16px; line-height:1.55; color:#e4e6ff; }.manifesto .read-link b { color:#ffbd3d; }.recent-head { padding-top:112px; }.recent-list { max-width:1160px; margin:auto; padding-bottom:125px; }.recent-list article { display:grid; grid-template-columns:100px 1fr 80px 28px; align-items:center; border-top:1px solid var(--ink); min-height:92px; }.recent-list article:last-child { border-bottom:1px solid var(--ink); }.tag,.date { font:10px var(--mono); letter-spacing:.07em; }.tag { color:var(--red); }.recent-list h3 { font-size:19px; letter-spacing:-.6px; margin:0; }.recent-list>a { font-size:22px; } footer { background:#050505; color:#fff; min-height:215px; padding:48px max(9%,calc((100% - 1140px)/2)); display:flex; align-items:flex-start; justify-content:space-between; } footer p { margin:4px 0 0 -170px; color:#aaa6a0; font-size:12px; line-height:1.6; } footer>div:last-child { display:flex; flex-direction:column; gap:10px; font-size:12px; text-align:right; }
@media (max-width:800px) { .site-header { height:70px; padding:0 22px; position:relative; z-index:10; }.top-ticker { font-size:8px; }.subscribe-btn,nav { display:none; } nav.open { display:flex; position:absolute; z-index:20; top:69px; left:0; right:0; margin:0; padding:15px 24px 20px; flex-direction:column; gap:0; background:var(--paper); border-bottom:1px solid var(--line); transform:none; } nav.open a { padding:12px 0; } nav.open a.active { border-bottom:0; color:var(--red); }.menu-btn { display:block; border:0; background:transparent; width:34px; }.menu-btn span { display:block; width:22px; height:2px; background:var(--ink); margin:5px; }.hero { height:620px; }.hero-copy { padding:65px 25px; width:100%; }.hero h1 { font-size:57px; }.hero-art { opacity:.78; }.wrestler { right:-11%; transform:scale(.85); transform-origin:bottom; }.photo-note,.hero-stamp { display:none; }.signal-strip { padding:19px 24px; }.signal-strip p { max-width:210px; line-height:1.4; }.signal-strip p b { display:block; margin-bottom:7px; }.section-head { padding:75px 24px 32px; }.section-head>a { right:24px; bottom:38px; }.story-grid { display:block; padding:0 24px 80px; }.story-card { margin-bottom:49px; }.feature-card { padding-top:0; }.list-card { display:flex; }.card-image { height:270px; }.manifesto { padding:82px 24px; min-height:520px; }.manifesto-mark { left:22px; }.recent-head { padding-top:75px; }.recent-list { padding:0 24px 80px; }.recent-list article { grid-template-columns:66px 1fr 25px; gap:8px; padding:18px 0; }.recent-list .date { display:none; }.recent-list h3 { font-size:17px; } footer { padding:40px 24px; display:block; } footer p { margin:20px 0; } footer>div:last-child { text-align:left; } }