@import url('https://fonts.googleapis.com/css2?family=Archivo+Narrow:ital,wght@0,600;0,700;1,600&family=IBM+Plex+Mono:wght@400;600&family=IBM+Plex+Sans:wght@400;600;700&display=swap');

:root { --paper:#f4f0e7; --ink:#111; --yellow:#ffd400; --red:#d93a2f; --green:#39834a; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"IBM Plex Sans",Arial,sans-serif; }
a { color:inherit; }
.site-header { min-height:90px; padding:20px clamp(20px,5vw,80px); border-bottom:1px solid var(--ink); display:flex; align-items:center; gap:36px; position:relative; z-index:10; }
.wordmark { font:700 clamp(25px,3vw,34px)/.9 "Archivo Narrow",sans-serif; text-decoration:none; white-space:nowrap; }
.site-header nav { display:flex; align-items:center; gap:clamp(14px,2vw,30px); margin-left:auto; }
.site-header nav a { font:600 12px/1 "IBM Plex Mono",monospace; text-transform:uppercase; text-decoration:none; }
.site-header nav a:hover,.site-header nav a:focus-visible { background:var(--yellow); outline:0; }
.menu-button { display:none; margin-left:auto; border:1px solid var(--ink); border-radius:0; background:transparent; padding:12px; font:600 11px "IBM Plex Mono",monospace; }
.hero { min-height:calc(100vh - 90px); padding:clamp(48px,7vw,96px) clamp(20px,5vw,80px); display:grid; grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr); gap:clamp(40px,6vw,96px); align-items:center; border-bottom:1px solid var(--ink); }
.eyebrow { display:inline-block; margin:0 0 26px; padding:7px 10px; background:var(--ink); color:var(--paper); font:600 11px "IBM Plex Mono",monospace; }
h1 { max-width:920px; margin:0; font:700 clamp(58px,7.4vw,116px)/.82 "Archivo Narrow",sans-serif; letter-spacing:-.035em; }
h1 span { position:relative; display:inline; z-index:0; }
h1 span::before { content:""; position:absolute; inset:47% -1% 3%; background:var(--yellow); z-index:-1; transform:rotate(-.4deg); }
.hero-lead { margin:38px 0 30px; max-width:650px; font-size:clamp(18px,1.8vw,25px); line-height:1.45; }
.button { display:inline-flex; align-items:center; gap:34px; padding:17px 22px; border:1px solid var(--ink); font:700 18px "Archivo Narrow",sans-serif; text-decoration:none; }
.button-dark { background:var(--ink); color:var(--paper); }
.button-dark:hover,.button-dark:focus-visible { background:var(--yellow); color:var(--ink); outline:3px solid var(--yellow); outline-offset:3px; }
.hero-art { margin:0; position:relative; transform:rotate(1deg); }
.hero-art img { display:block; width:100%; border:2px solid var(--ink); filter:contrast(1.03); }
.hero-art figcaption { position:absolute; left:-22px; bottom:-36px; font:italic 600 clamp(20px,2.3vw,34px) "Archivo Narrow",sans-serif; transform:rotate(-6deg); }
.section { padding:clamp(72px,9vw,132px) clamp(20px,5vw,80px); border-bottom:1px solid var(--ink); }
.section-kicker,.meta,.year { margin:0 0 18px; font:600 11px "IBM Plex Mono",monospace; letter-spacing:.04em; }
h2 { margin:0; font:700 clamp(54px,7vw,96px)/.86 "Archivo Narrow",sans-serif; letter-spacing:-.025em; }
h3 { font-family:"Archivo Narrow",sans-serif; }
.path-grid { display:grid; grid-template-columns:repeat(4,1fr); margin-top:64px; border-top:1px solid var(--ink); border-left:1px solid var(--ink); }
.path-card { min-height:310px; padding:24px; border-right:1px solid var(--ink); border-bottom:1px solid var(--ink); display:flex; flex-direction:column; text-decoration:none; position:relative; }
.path-card>span { font:11px "IBM Plex Mono",monospace; }.path-card h3 { margin:45px 0 20px; font-size:clamp(25px,2.4vw,38px); line-height:.95; }.path-card p { margin:auto 0 0; }.path-card b { position:absolute; right:22px; bottom:19px; font-size:25px; }.path-card:hover,.path-card:focus-visible { background:var(--yellow); outline:0; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; padding-bottom:26px; border-bottom:2px solid var(--ink); }.section-heading>a,.feature-card a { font:700 15px "Archivo Narrow",sans-serif; }
.latest-grid { display:grid; grid-template-columns:1.25fr .75fr; gap:48px; margin-top:42px; }.feature-card { display:grid; grid-template-columns:1fr 1fr; gap:34px; }.feature-card img { width:100%; height:100%; max-height:480px; object-fit:cover; border:1px solid var(--ink); }.feature-card h3 { margin:12px 0 18px; font-size:clamp(34px,4vw,62px); line-height:.9; }.feature-card p:not(.meta) { font-size:18px; line-height:1.5; }
.story-list { border-top:1px solid var(--ink); }.story-list article { position:relative; min-height:120px; padding:22px 55px 20px 0; border-bottom:1px solid var(--ink); }.story-list h3 { margin:0; font-size:clamp(24px,2.3vw,35px); line-height:.95; }.story-list article>a { position:absolute; right:8px; bottom:18px; font-size:26px; text-decoration:none; }
.manifesto-break { padding:clamp(64px,8vw,110px) clamp(20px,5vw,80px); background:var(--yellow); display:grid; grid-template-columns:1.6fr .4fr; gap:70px; border-bottom:1px solid var(--ink); }.manifesto-break h2 { font-size:clamp(64px,9vw,130px); }.manifesto-break>div { align-self:end; font-size:18px; line-height:1.5; }.manifesto-break span,.hand-note,.rabbit-note { display:block; margin-top:35px; font:italic 600 26px "Archivo Narrow",sans-serif; transform:rotate(-4deg); }
.explainer-grid { display:grid; grid-template-columns:repeat(4,1fr); margin:62px 0 38px; border-left:1px solid var(--ink); border-top:1px solid var(--ink); }.explainer-grid a { min-height:190px; padding:24px; border-right:1px solid var(--ink); border-bottom:1px solid var(--ink); display:flex; flex-direction:column; gap:32px; text-decoration:none; }.explainer-grid b { font:700 31px "Archivo Narrow",sans-serif; }.explainer-grid span { line-height:1.45; }.explainer-grid a:hover,.explainer-grid a:focus-visible { background:var(--yellow); outline:0; }
.history { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:clamp(45px,8vw,120px); }.history-art { position:relative; }.history-art img { display:block; width:100%; border:2px solid var(--ink); }.history-art span { position:absolute; bottom:8%; left:-2%; padding:8px 20px; background:var(--yellow); font:700 clamp(24px,4vw,58px) "Archivo Narrow",sans-serif; transform:rotate(-2deg); }.year { font-size:16px; }.history-copy h2 { font-size:clamp(50px,6.5vw,92px); }.history-copy>p:not(.year):not(.hand-note) { font-size:21px; line-height:1.5; }
.rabbit { background:var(--ink); color:var(--paper); position:relative; }.rabbit-label { display:inline-block; padding:7px 10px; background:var(--yellow); color:var(--ink); font:600 11px "IBM Plex Mono",monospace; }.rabbit-intro { max-width:590px; margin:28px 0 50px; font-size:19px; line-height:1.5; }.rabbit-list { border-top:1px solid var(--paper); }.rabbit-list a,.rabbit-list>span { padding:22px 0; border-bottom:1px solid rgba(244,240,231,.45); display:flex; justify-content:space-between; align-items:center; gap:30px; font:700 clamp(26px,3vw,44px) "Archivo Narrow",sans-serif; text-decoration:none; }.rabbit-list>span { color:#a8a49d; }.rabbit-list small { padding:6px 8px; border:1px solid currentColor; font:600 9px "IBM Plex Mono",monospace; white-space:nowrap; }.rabbit-list a:hover,.rabbit-list a:focus-visible { color:var(--yellow); outline:0; }.rabbit-note { color:var(--yellow); text-align:right; }
.territory-grid { display:grid; grid-template-columns:repeat(4,1fr); margin-top:62px; }.territory-grid a { min-height:280px; padding:24px; border:1px solid var(--ink); border-left:0; text-decoration:none; }.territory-grid a:first-child { border-left:1px solid var(--ink); }.territory-grid span { font:11px "IBM Plex Mono",monospace; }.territory-grid h3 { margin:55px 0 20px; font-size:46px; }.territory-grid p { line-height:1.5; }.territory-grid a:hover,.territory-grid a:focus-visible { background:var(--yellow); outline:0; }
.start-here { background:var(--yellow); display:grid; grid-template-columns:1.3fr .7fr; gap:70px; }.start-copy { align-self:end; }.start-copy strong { font:700 clamp(55px,8vw,105px) "Archivo Narrow",sans-serif; }.start-copy p { font-size:20px; line-height:1.5; }
.site-footer { padding:60px clamp(20px,5vw,80px) 36px; background:var(--ink); color:var(--paper); display:grid; grid-template-columns:1fr 1fr; gap:24px; }.site-footer p { margin:3px 0; text-align:right; }.site-footer>div { grid-column:1/-1; display:flex; gap:24px; padding:30px 0; border-block:1px solid rgba(244,240,231,.35); }.site-footer>div a { font:600 11px "IBM Plex Mono",monospace; text-transform:uppercase; }.site-footer small { grid-column:1/-1; color:#aaa; }
.mobile-menu { position:fixed; inset:90px 0 auto; padding:24px; border-bottom:1px solid var(--ink); background:var(--yellow); z-index:9; }
.mobile-menu a { display:block; padding:12px 0; border-bottom:1px solid var(--ink); font:700 30px "Archivo Narrow",sans-serif; text-transform:uppercase; text-decoration:none; }
@media (max-width:900px) { .site-header nav { display:none; } .menu-button { display:block; } .hero { grid-template-columns:1fr; align-content:start; } .hero-art { width:min(90%,620px); margin-left:auto; } .path-grid,.explainer-grid,.territory-grid { grid-template-columns:repeat(2,1fr); }.latest-grid,.history,.start-here,.manifesto-break { grid-template-columns:1fr; }.manifesto-break>div { max-width:530px; }.feature-card { grid-template-columns:1fr; }.history-art { max-width:680px; }.site-footer { grid-template-columns:1fr; }.site-footer p { text-align:left; } }
@media (max-width:540px) { .site-header { min-height:72px; padding-block:14px; } .hero { min-height:auto; padding-top:42px; gap:54px; } h1 { font-size:clamp(49px,15vw,68px); } .hero-lead { margin-top:28px; } .hero-art { width:100%; } .hero-art figcaption { left:12px; }.path-grid,.explainer-grid,.territory-grid { grid-template-columns:1fr; }.path-card { min-height:230px; }.section-heading { align-items:start; flex-direction:column; }.manifesto-break h2 { font-size:56px; }.site-footer>div { flex-direction:column; }.history-art span { left:0; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }