:root {
  --ink: #151616;
  --paper: #ddd7ca;
  --paper-deep: #c8c0b1;
  --red: #a52a2d;
  --red-dark: #741c20;
  --blue: #214d5a;
  --gold: #c59a45;
  --muted: #665f55;
  --rule: rgba(21, 22, 22, .18);
  --display: "Bebas Neue", Impact, sans-serif;
  --serif: "Literata", Georgia, serif;
  --typewriter: "Special Elite", "Courier New", monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background:
    linear-gradient(rgba(4,8,9,.64), rgba(4,8,9,.76)),
    url("../images/medic-unit-0300-background.webp") center/cover fixed;
  font-family: var(--serif);
  line-height: 1.65;
}
a { color: inherit; }
img { max-width: 100%; }
.shell { width: min(1160px, calc(100% - 40px)); margin-inline: auto; }
.skip-link { position: fixed; top: -100px; left: 20px; z-index: 20; padding: 10px 16px; background: white; }
.skip-link:focus { top: 10px; }

.utility-bar { display:none; }
.utility-inner { min-height: 35px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.utility-inner a { color: #fff; text-decoration-color: var(--gold); text-underline-offset: 4px; }
.site-header { position:relative; z-index:10; padding-top:clamp(100px,12.5vw,250px); color:#f0eadf; background-color:#0b0e0f; background-image:url("../images/lessons-masthead-wide.webp"); background-position:center; background-size:100% 100%; background-repeat:no-repeat; border-bottom:2px solid rgba(197,154,69,.65); box-shadow:0 8px 28px rgba(0,0,0,.55); }
.header-inner { width:100%; min-height:64px; margin-top:-64px; padding-inline:max(20px,calc((100% - 1160px)/2)); display:flex; align-items:center; justify-content:space-between; gap:40px; background:rgba(8,11,12,.20); border-top:1px solid rgba(255,255,255,.16); backdrop-filter:blur(2px); }
.brand { display:flex; align-items:center; gap:14px; text-decoration: none; line-height: 1; }
.brand-coin { width:58px; height:58px; flex:0 0 auto; border-radius:50%; filter:drop-shadow(2px 3px 3px rgba(0,0,0,.55)); }
.brand > span { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.brand-kicker { display:block; margin-bottom:7px; color:#d7b460; font:400 .72rem/1 var(--typewriter); letter-spacing:.09em; text-transform:uppercase; }
.brand-title { font:400 clamp(1.9rem,3vw,2.7rem)/.88 var(--display); letter-spacing:.035em; text-transform:uppercase; text-shadow:3px 3px 0 rgba(125,25,29,.7); }
.brand-title em { color: var(--blue); font-style: italic; }
.site-header .brand-title em { color:#77a4b1; }
.site-nav { display:flex; align-items:center; justify-content:flex-end; gap:26px; margin-left:auto; font:700 .95rem/1 var(--display); letter-spacing:.07em; text-transform:uppercase; text-shadow:0 2px 5px #000, 0 0 2px #000; }
.site-nav a { padding-block: 12px; text-decoration: none; border-bottom: 3px solid transparent; }
.site-nav a:hover, .site-nav a.active { color:#e5bd68; border-color:#a52a2d; }
.menu-button { display: none; }

.hero { padding: 58px 0 66px; color:#eee7db; border-bottom: 1px solid rgba(255,255,255,.13); background:linear-gradient(90deg,rgba(8,13,14,.28),rgba(8,13,14,.72)); }
.hero-grid { display:grid; grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr); align-items:stretch; gap:clamp(32px,5vw,72px); }
.hero-art { min-height: 500px; position: relative; overflow: hidden; display: flex; align-items: end; padding: clamp(24px, 5vw, 54px); color: white; background:
  linear-gradient(12deg, rgba(8, 16, 18, .92) 8%, rgba(12, 37, 43, .28) 55%, rgba(151, 37, 41, .28)),
  url("../images/medic-unit-0300-background.webp") center/cover;
  border:1px solid rgba(230,220,200,.3); box-shadow: 14px 14px 0 rgba(125,31,35,.85);
}
.hero-art::before { content: ""; position: absolute; inset: 0; opacity: .32; background: repeating-linear-gradient(0deg, transparent 0 5px, rgba(255,255,255,.06) 6px, transparent 7px); mix-blend-mode: overlay; }
.hero-art::after { content: "10–8"; position: absolute; right: -20px; top: 18px; color: rgba(255,255,255,.07); font: 800 14rem/1 var(--display); transform: rotate(-6deg); }
.hero-art-copy { position: relative; z-index: 1; }
.hero-art-copy strong, .hero-art-copy small { display: block; text-shadow: 0 4px 20px #000; }
.hero-art-copy strong { margin-top: 22px; font: 800 clamp(3.8rem, 8vw, 7.6rem)/.76 var(--display); letter-spacing: -.045em; }
.hero-art-copy small { margin-top: 18px; color: #f0d79e; font: italic 700 clamp(1.25rem, 2.4vw, 2rem)/1 var(--display); text-transform: uppercase; letter-spacing: .06em; }
.tape-label { display:inline-block; padding:9px 13px 6px; color:var(--ink); background:var(--gold); font:400 .72rem/1 var(--typewriter); letter-spacing:.08em; text-transform:uppercase; transform:rotate(-2deg); }
.hero-story { align-self: center; padding:34px; color:#171818; background:rgba(221,215,202,.94); border:1px solid rgba(255,255,255,.22); box-shadow:8px 8px 0 rgba(16,27,30,.88); transform:rotate(.25deg); }
.site-intro { margin:0 0 23px; padding:0 0 18px; border-bottom:1px solid rgba(21,22,22,.22); color:#4d4942; font-size:.94rem; line-height:1.5; }
.site-intro strong { display:block; margin-bottom:5px; color:var(--red-dark); font:400 1.2rem/1 var(--display); letter-spacing:.075em; text-transform:uppercase; }
.site-intro span { display:block; }
.welcome-copy p { margin-block:14px; }
.welcome-copy .site-intro { margin-top:0; margin-bottom:23px; }
.welcome-copy .dek { margin-top:20px; }
.welcome-promise { padding:15px 18px 13px; background:rgba(117,27,31,.1); border-left:5px solid var(--red); font-weight:600; }
.eyebrow { color:var(--red); font:400 .78rem/1.35 var(--typewriter); letter-spacing:.08em; text-transform:uppercase; }
h1, h2, h3 { margin: 0; font-family: var(--display); text-transform: uppercase; line-height: .98; }
h1 { margin-block:18px 24px; font-size:clamp(3.5rem,7vw,6.7rem); font-weight:400; letter-spacing:.025em; line-height:.88; }
h2 { font-size:clamp(2.8rem,5vw,4.8rem); font-weight:400; letter-spacing:.035em; line-height:.9; }
h3 { font-size:2.25rem; font-weight:400; letter-spacing:.025em; line-height:.93; }
.hero-story h1, .page-hero h1, .article-header h1 { text-shadow:3px 3px 0 rgba(118,26,30,.82),6px 6px 15px rgba(0,0,0,.28); }
.hero-story h1 { max-width:100%; font-size:clamp(3rem,4vw,4.4rem); line-height:.92; letter-spacing:.018em; overflow-wrap:break-word; text-shadow:2px 2px 0 rgba(165,42,45,.33); }
.section-heading h2::after, .shift-notes-copy h2::after, .prose h2::after { content:""; display:block; width:78px; height:3px; margin-top:12px; background:linear-gradient(90deg,var(--red),var(--gold)); transform:skewX(-28deg); }
.dek { font-size: 1.15rem; font-weight: 600; line-height: 1.55; }
.button { display: inline-flex; align-items: center; gap: 12px; margin-top: 18px; padding: 14px 19px 12px; color: white; background: var(--red); border: 2px solid var(--red); text-decoration: none; font: 800 .92rem/1 var(--display); letter-spacing: .08em; text-transform: uppercase; transition: .18s ease; }
.button:hover { background: var(--red-dark); transform: translateY(-2px); box-shadow: 5px 5px 0 var(--gold); }

.manifesto { padding: 38px 0; color: white; background: linear-gradient(105deg,rgba(22,58,67,.97),rgba(10,28,33,.97)), repeating-linear-gradient(0deg,transparent 0 5px,rgba(255,255,255,.08) 6px); border-block:1px solid rgba(255,255,255,.18); border-bottom: 7px solid var(--gold); box-shadow:0 18px 40px rgba(0,0,0,.35); }
.manifesto-inner { display: grid; grid-template-columns: .55fr 1.45fr; gap: 50px; align-items: center; }
.manifesto p { margin: 0; color: #e7cb8c; font: italic 700 1.25rem/1.15 var(--display); text-transform: uppercase; }
.manifesto h2 { font-size: clamp(2rem, 4vw, 3.7rem); }
.latest-feature { display:grid; grid-template-columns:1fr auto; gap:55px; align-items:center; margin-block:55px; padding:42px 48px; color:#eee7da; background:linear-gradient(105deg,rgba(7,18,21,.96),rgba(42,18,19,.94)); border:1px solid rgba(215,185,112,.4); border-left:8px solid var(--red); box-shadow:0 18px 50px rgba(0,0,0,.48); }
.latest-feature h2 { margin:11px 0 18px; max-width:880px; font-size:clamp(2.7rem,4.7vw,4.5rem); }
.latest-feature p { max-width:760px; margin:0; color:#d4ccbd; }
.latest-feature .button { white-space:nowrap; }
.shift-notes { display:grid; grid-template-columns: 1.42fr .58fr; gap:clamp(32px,5vw,70px); align-items:center; margin-block:55px; padding:34px; background:rgba(205,198,184,.91); border:1px solid rgba(255,255,255,.24); box-shadow:0 18px 50px rgba(0,0,0,.42); }
.shift-notes-image { position:relative; padding:12px; background:#dad3c5; border:1px solid rgba(0,0,0,.2); box-shadow:12px 14px 0 #1b292d; transform:rotate(-.55deg); }
.shift-notes-image::before { content:"SHIFT NOTES · 0300"; position:absolute; z-index:2; top:-14px; left:32px; padding:9px 15px 6px; color:#171717; background:#d9b75e; font:400 .72rem/1 var(--typewriter); letter-spacing:.08em; transform:rotate(-2deg); }
.shift-notes-image img { display:block; width:100%; }
.shift-notes-copy h2 { margin:12px 0 22px; }
.shift-notes-copy p { color:var(--muted); font-size:1.08rem; }
.section { margin-block:55px; padding:54px; background:rgba(218,212,199,.94); border-top:5px solid #1c353c; box-shadow:0 18px 55px rgba(0,0,0,.48); }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 32px; }
.section-heading h2 { margin-top: 10px; }
.text-link { color: var(--red); font: 800 .9rem/1 var(--display); letter-spacing: .08em; text-transform: uppercase; text-underline-offset: 5px; }
.story-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.story-card { background: rgba(231,225,211,.88); border: 1px solid rgba(21,22,22,.38); box-shadow: 7px 8px 0 rgba(39,43,42,.34); transform:rotate(-.18deg); }
.story-card:nth-child(2) { transform:rotate(.25deg); }
.story-card:nth-child(3) { transform:rotate(-.35deg); }
.card-art { height: 180px; position: relative; display: grid; place-items: center; overflow: hidden; color: rgba(255,255,255,.92); }
.card-art::after { content:""; position:absolute; inset:0; background: repeating-linear-gradient(-20deg, transparent 0 12px, rgba(255,255,255,.045) 13px 14px); }
.card-art span { font: 800 4.8rem/1 var(--display); text-transform: uppercase; transform: rotate(-5deg); opacity: .82; }
.card-art-red { background: linear-gradient(135deg, #511518, var(--red)); }
.card-art-blue { background: linear-gradient(135deg, #102c33, var(--blue)); }
.card-art-gold { background: linear-gradient(135deg, #604514, var(--gold)); }
.card-body { padding: 26px; }
.card-body h3 { margin-block: 12px; }
.card-body p { color: var(--muted); }
.card-body a { color: var(--red); font: 800 .88rem/1 var(--display); letter-spacing: .06em; text-transform: uppercase; }
.dispatch { padding: 60px 0; color: white; background: var(--red-dark); }
.dispatch-grid { display: grid; grid-template-columns: 1fr auto; gap: 60px; align-items: center; }
.dispatch h2 { margin: 10px 0 18px; max-width: 850px; }
.dispatch p { max-width: 760px; margin-bottom: 0; color: #f2dfe0; }
.dispatch .eyebrow { color: #edca7d; }
.button-light { color: var(--ink); background: var(--paper); border-color: var(--paper); white-space: nowrap; }

.page-hero { padding: 68px 0 56px; color:#f0e9dc; border-bottom:1px solid rgba(255,255,255,.2); background:linear-gradient(90deg,rgba(5,10,11,.86),rgba(21,48,54,.72),rgba(82,18,20,.5)); text-shadow:0 3px 10px #000; }
.page-hero p { max-width: 760px; font-size: 1.15rem; }
.filter-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 26px 0 34px; }
.filter-button { padding: 9px 13px 7px; border: 1px solid var(--ink); background: transparent; cursor: pointer; font: 800 .78rem/1 var(--display); letter-spacing: .07em; text-transform: uppercase; }
.filter-button.active, .filter-button:hover { color: white; background: var(--ink); }
.archive-section { padding:clamp(28px,4vw,54px); }
.archive-welcome { padding:clamp(24px,4vw,40px); color:#eee7da; background:linear-gradient(120deg,rgba(11,27,31,.98),rgba(59,22,24,.96)); border-left:7px solid var(--gold); box-shadow:7px 8px 0 rgba(22,33,36,.24); }
.archive-welcome h2 { margin:10px 0 18px; font-size:clamp(2.5rem,5vw,4.5rem); }
.archive-welcome p { max-width:900px; margin:0; color:#d8d0c2; font-size:1.04rem; }
.archive-welcome .eyebrow { color:#e7c16c; }
.archive-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px 24px; }
.archive-card { display:flex; min-width:0; flex-direction:column; overflow:hidden; background:#e9e3d7; border:1px solid rgba(21,22,22,.35); box-shadow:7px 8px 0 rgba(39,43,42,.3); }
.archive-card:nth-child(3n+2) { transform:rotate(.18deg); }
.archive-card:nth-child(3n) { transform:rotate(-.16deg); }
.archive-card[hidden] { display:none; }
.archive-card-art { display:block; position:relative; aspect-ratio:16/9; overflow:hidden; background:#10191b; border-bottom:5px solid var(--red-dark); }
.archive-card-art::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,transparent 62%,rgba(4,8,9,.34)),repeating-linear-gradient(-20deg,transparent 0 13px,rgba(255,255,255,.025) 14px 15px); }
.archive-card-art img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .25s ease,filter .25s ease; }
a.archive-card-art:hover img { transform:scale(1.025); filter:contrast(1.05); }
.archive-card-body { display:flex; flex:1; flex-direction:column; padding:23px 24px 25px; }
.archive-card-meta { display:flex; min-height:34px; justify-content:space-between; align-items:flex-start; gap:12px; }
.archive-card-meta time { flex:0 0 auto; color:var(--muted); font:700 .7rem/1.3 var(--display); letter-spacing:.05em; text-align:right; text-transform:uppercase; }
.archive-card h2 { margin:13px 0 12px; font-size:clamp(1.75rem,2.5vw,2.35rem); line-height:.95; }
.archive-card h2 a { text-decoration:none; }
.archive-card h2 a:hover { color:var(--red); }
.archive-card p { margin:0 0 22px; color:var(--muted); font-size:.94rem; line-height:1.55; }
.archive-read { margin-top:auto; color:var(--red); font:800 .82rem/1.2 var(--display); letter-spacing:.06em; text-transform:uppercase; }
.archive-soon { color:#71695d; }
.archive-pagination { display:flex; justify-content:center; align-items:center; gap:18px; margin-top:40px; padding-top:25px; border-top:4px double var(--gold); }
.archive-pagination button { padding:10px 15px 8px; color:#fff; background:var(--ink); border:1px solid var(--ink); cursor:pointer; font:800 .8rem/1 var(--display); letter-spacing:.06em; text-transform:uppercase; }
.archive-pagination button:hover:not(:disabled) { color:var(--ink); background:var(--gold); }
.archive-pagination button:disabled { opacity:.35; cursor:not-allowed; }
.archive-pagination span { min-width:90px; font:800 .8rem/1 var(--display); letter-spacing:.06em; text-align:center; text-transform:uppercase; }

.article-header { padding: 70px 0 46px; color:#f2ebdf; background:rgba(4,10,11,.62); text-shadow:0 3px 12px #000; }
.article-header-inner, .article-body { width: min(790px, calc(100% - 40px)); margin-inline: auto; }
.article-header h1 { margin-bottom: 22px; }
.article-subtitle { max-width:700px; margin:-8px 0 20px; color:#f1c96e; font:400 1rem/1.5 var(--typewriter); letter-spacing:.025em; }
.article-meta { color: var(--muted); font: 700 .86rem/1.3 var(--display); letter-spacing: .07em; text-transform: uppercase; }
.article-origin { margin:18px 0 0; padding:13px 16px 11px; color:#e7dfd1; background:rgba(165,42,45,.28); border-left:4px solid var(--gold); font:400 .83rem/1.55 var(--typewriter); text-shadow:0 2px 8px #000; }
.article-origin a { color:#f1c96e; text-underline-offset:4px; }
.article-feature { width: min(1100px, calc(100% - 40px)); min-height: 440px; margin: 0 auto 55px; }
.article-feature-image { min-height:0; background:#0b1112; box-shadow:12px 14px 0 rgba(116,28,32,.82),0 25px 65px rgba(0,0,0,.56); }
.article-feature-image img { display:block; width:100%; height:auto; }
.article-body { margin-bottom:60px; padding:54px 62px 70px; font-size:1.08rem; background:rgba(226,220,207,.96); border-top:7px solid var(--red-dark); box-shadow:0 20px 60px rgba(0,0,0,.55); }
.article-body > p:first-child::first-letter { float: left; margin: .07em .1em 0 0; color: var(--red); font: 800 5.2rem/.7 var(--display); }
.article-body h2 { margin: 52px 0 18px; font-size: 2.6rem; }
.article-body h3 { margin:38px 0 12px; color:var(--red-dark); font:400 1.65rem/1.05 var(--display); letter-spacing:.035em; text-transform:uppercase; }
.article-body li { margin-block:.35rem; }
.reference-list { margin-top:18px; padding-left:1.35rem; color:#514b42; font-size:.82rem; line-height:1.55; }
.reference-list a { color:var(--red-dark); text-underline-offset:3px; }
.pullquote { margin:45px -65px; padding:28px 38px; color:var(--blue); border-block:4px double var(--gold); font:400 2.55rem/.98 var(--display); letter-spacing:.04em; text-transform:uppercase; text-shadow:2px 2px 0 rgba(165,42,45,.16); }
.article-note { margin-top: 55px; padding: 24px; background: var(--paper-deep); border-left: 6px solid var(--red); }
.article-note > strong { display:block; margin-bottom:10px; font:400 1.9rem/1 var(--display); letter-spacing:.04em; text-transform:uppercase; }
.article-note p:last-child { margin-bottom:0; }
.article-source-link { margin-top:32px; text-align:center; }
.article-source-link a { color:var(--red); font:800 .9rem/1.2 var(--display); letter-spacing:.07em; text-transform:uppercase; text-underline-offset:5px; }

.content-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(40px, 8vw, 100px); padding-block: 75px 95px; }
.about-collage { margin-top:55px; padding:12px; background:#ded7ca; border:1px solid var(--rule); box-shadow:12px 12px 0 var(--blue),0 25px 55px rgba(0,0,0,.5); transform:rotate(-.3deg); }
.about-collage img { display:block; width:100%; }
.about-story { grid-template-columns:.52fr 1.48fr; margin-block:55px; padding:58px; background:rgba(220,214,201,.95); box-shadow:0 20px 60px rgba(0,0,0,.48); }
.about-identity { display:flex; flex-direction:column; align-items:center; gap:28px; align-self:start; }
.coin-feature { width:min(100%,380px); align-self:start; border-radius:50%; filter:drop-shadow(10px 13px 8px rgba(0,0,0,.28)); }
.cv-button { width:100%; max-width:280px; text-align:center; }
.prose h2 { margin: 42px 0 14px; font-size: 2.5rem; }
.publications-section { margin-bottom:55px; padding:clamp(30px,5vw,60px); background:rgba(220,214,201,.96); box-shadow:0 20px 60px rgba(0,0,0,.48); }
.publications-heading { display:grid; grid-template-columns:.8fr 1.2fr; align-items:end; gap:40px; margin-bottom:34px; padding-bottom:25px; border-bottom:4px double var(--gold); }
.publications-heading h2 { margin-top:8px; font-size:clamp(3rem,6vw,5.25rem); }
.publications-heading p { margin:0; font-weight:600; }
.publication-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.publication-card { padding:26px; background:var(--paper-deep); border-top:5px solid var(--red-dark); box-shadow:4px 5px 0 rgba(22,34,37,.14); }
.publication-card-wide { grid-column:1/-1; }
.publication-card time { color:var(--red); font:400 .78rem/1 var(--typewriter); letter-spacing:.06em; text-transform:uppercase; }
.publication-card h3 { margin:11px 0 12px; font:400 clamp(1.75rem,3vw,2.35rem)/1 var(--display); letter-spacing:.025em; text-transform:uppercase; }
.publication-card h3 a { text-decoration:none; }
.publication-card h3 a:hover { color:var(--red); }
.publication-card p { margin:0; color:var(--muted); font-size:.95rem; }
.featured-media { display:grid; grid-template-columns:1fr 1.25fr auto; align-items:center; gap:30px; margin-top:24px; padding:30px; color:#f3ecdf; background:linear-gradient(125deg,var(--blue),#11191b); border-left:7px solid var(--gold); }
.featured-media h3 { margin-top:8px; font:400 clamp(2rem,4vw,3rem)/.96 var(--display); text-transform:uppercase; }
.featured-media p { margin:0; color:#ddd4c6; }
.featured-media .button { white-space:nowrap; }
.book-list { padding-inline:clamp(25px,5vw,64px); background:rgba(220,214,201,.96); box-shadow:0 20px 60px rgba(0,0,0,.48); }
.book { display:grid; grid-template-columns:230px 1fr; align-items:start; gap:clamp(30px,5vw,58px); padding:48px 0; border-bottom:1px solid var(--rule); }
.book:last-child { border-bottom:0; }
.book-cover { display:block; width:230px; aspect-ratio:2/3; overflow:hidden; background:#0c1011; box-shadow:9px 10px 0 var(--gold), 0 18px 35px rgba(0,0,0,.3); transform:rotate(-.45deg); transition:transform .18s ease, box-shadow .18s ease; }
.book-cover:hover { transform:rotate(0) translateY(-4px); box-shadow:9px 12px 0 var(--red-dark), 0 22px 40px rgba(0,0,0,.34); }
.book-cover img { display:block; width:100%; height:100%; object-fit:cover; }
.book h2 { margin:10px 0 16px; font-size:clamp(2rem,4vw,3.25rem); }
.book p { max-width:720px; margin-bottom:24px; }

.site-footer { padding: 48px 0 24px; color: #cfc8bb; background: var(--ink); }
.footer-grid { display: grid; grid-template-columns: .65fr 1.35fr; gap: 60px; }
.footer-grid strong { color: white; font: 800 1.65rem/1 var(--display); text-transform: uppercase; }
.footer-grid p { margin: 10px 0; }
.disclaimer { font-size: .8rem; }
.footer-bottom { margin-top: 35px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.15); font: 700 .72rem/1 var(--display); letter-spacing: .08em; text-transform: uppercase; }

@media (max-width: 850px) {
  .site-header { padding-top:100px; background-position:center top; background-size:auto 100px; }
  .brand > span { position:static; width:auto; height:auto; padding:0; margin:0; overflow:visible; clip:auto; white-space:normal; display:block; }
  .header-inner { min-height:60px; margin-top:0; background:rgba(8,11,12,.92); backdrop-filter:none; }
  .menu-button { display: block; padding: 10px 13px; color: white; background: var(--ink); border: 0; font: 800 .8rem/1 var(--display); text-transform: uppercase; }
  .site-nav { display: none; position: absolute; left: 0; right: 0; top: 100%; padding: 15px 20px 22px; color:#f0eadf; background:#11191b; border-bottom: 1px solid var(--gold); flex-direction: column; align-items: stretch; }
  .site-nav.open { display: flex; }
  .site-nav a { padding: 10px; }
  .hero-grid, .manifesto-inner, .content-grid { grid-template-columns: 1fr; }
  .publications-heading, .featured-media { grid-template-columns:1fr; align-items:start; }
  .publication-grid { grid-template-columns:1fr; }
  .publication-card-wide { grid-column:auto; }
  .latest-feature { grid-template-columns:1fr; gap:18px; }
  .shift-notes { grid-template-columns:1fr; }
  .hero-art { min-height: 390px; }
  .hero-story h1 { font-size:clamp(3.1rem,10vw,4.6rem); }
  .story-grid { grid-template-columns: 1fr; }
  .dispatch-grid { grid-template-columns: 1fr; gap: 20px; }
  .archive-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .archive-card:nth-child(n) { transform:none; }
  .pullquote { margin-inline: 0; }
  .footer-grid { grid-template-columns: 1fr; gap: 20px; }
}
@media (max-width: 560px) {
  .shell { width: min(100% - 26px, 1160px); }
  .utility-inner span { display: none; }
  .utility-inner { justify-content: center; }
  .site-header { padding-top:100px; background-size:auto 100px; }
  .header-inner { min-height:60px; margin-top:0; }
  .brand-title { font-size: 1.55rem; }
  .brand-coin { width:52px; height:52px; }
  .brand-kicker { font-size: .57rem; }
  .hero { padding-top: 25px; }
  .hero-art { min-height: 300px; box-shadow: 7px 7px 0 var(--paper-deep); }
  .hero-art-copy strong { font-size: 3.7rem; }
  h1 { font-size: 3rem; }
  .hero-story h1 { font-size:3.15rem; }
  .section { padding-block: 55px; }
  .section, .shift-notes, .about-story, .latest-feature { padding:25px; }
  .article-body { padding:34px 25px 50px; }
  .section-heading { align-items: start; flex-direction: column; }
  .archive-grid { grid-template-columns:1fr; }
  .archive-card-meta { min-height:0; }
  .archive-pagination { gap:10px; }
  .archive-pagination button { padding-inline:11px; }
  .book { grid-template-columns: 1fr; }
  .book-cover { width: 190px; }
}