:root {
 color-scheme:dark;
 --bg:#151617; --ink:#f3eee6; --muted:#ccc6bc; --amber:#ffb648; --line:#494745;
 font: 16px/1.5 system-ui,sans-serif;
}
* {box-sizing:border-box}
body {margin:0;background:var(--bg);color:var(--ink)}
a {color:inherit;text-decoration:none}
a:hover, a[aria-current] {color:var(--amber)}
a:focus-visible {outline:2px solid var(--amber);outline-offset:4px}
img {display:block;max-width:100%;height:auto}
header,footer {border-block-end:1px solid var(--line)}
.mast,main,.foot {width:min(100% - 48px,1440px);margin-inline:auto}
.mast,.foot {display:flex;align-items:center;justify-content:space-between;gap:20px}
.mast {min-height:110px}
.brand {display:flex;align-items:center;font:bold clamp(19px,2.5vw,36px)/1 Georgia,serif;white-space:nowrap}
.brand img {width:clamp(46px,6vw,84px);margin-right:12px}
.brand span,.meta b,.rail-head a,.story a,.listing p a {color:var(--amber)}
nav {display:flex;flex-wrap:wrap;gap:12px clamp(12px,1.65vw,28px)}
header nav {font: 18px Georgia,serif}
header nav a {padding:10px 0;border-bottom:2px solid transparent}
header nav a[aria-current] {border-color:var(--amber)}
main {padding-block:40px 64px;min-height:70vh}
.layout {display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:28px}
.hero {display:block;position:relative}
.hero img {width:100%;aspect-ratio:1.52;object-fit:contain;background:#211d19}
.hero span,.button {background:var(--amber);color:#18130d;font-weight:750}
.hero span {position:absolute;bottom:18px;left:20px;padding:5px 12px;text-transform:uppercase;letter-spacing:.13em;font-size:.75rem}
.button {display:inline-block;border-radius:6px;padding:10px 18px}
.button:hover {background:#ffd28a;color:#18130d}
h1,h3 {font-family:Georgia,serif;line-height:1.08}
h1 {font-size:clamp(34px,4vw,58px);margin:.2em 0}
h2,h3,p {margin:0 0 .65em}
h3 {font-size:clamp(19px,1.7vw,25px)}
.deck {font-size:1.14rem;color:var(--muted);max-width:64ch}
.meta,.rail-head {text-transform:uppercase;letter-spacing:.12em;font-size:.73rem}
.meta {margin:16px 0 8px;color:var(--muted)}
aside {padding-left:clamp(20px,2.6vw,40px);border-left:1px solid var(--line)}
.rail-head {display:flex;align-items:baseline;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line);font-weight:700}
.rail-head h2 {letter-spacing:.15em}
.row {display:grid;grid-template-columns:34% minmax(0,1fr);align-items:start;gap:18px;border-bottom:1px solid var(--line);padding:19px 0}
.row img {width:100%;aspect-ratio:1.5;object-fit:contain;background:#211d19;border-radius:4px}
.row .meta {margin:0 0 7px}
.row p:last-child {font-size:.88rem;color:var(--muted);margin:0}
.listing {max-width:830px}
.story {max-width:790px;margin:auto}
.story h2 {margin-top:1.4em}
.story figure {margin:24px 0}
.story figure img {width:100%;max-height:560px;object-fit:contain;background:#211d19}
.story figcaption {color:var(--muted);font-size:.84rem}
.gallery {display:flex;gap:12px}
.gallery img {width:calc(50% - 6px);object-fit:contain}
footer {border-block-start:1px solid var(--line);border-block-end:0}
.foot {padding-block:24px;color:var(--muted)}
.skip {position:absolute;top:-100px}
.skip:focus {top:8px;left:8px;background:var(--bg);z-index:2}
@media(max-width:1100px) {.mast {align-items:flex-start;flex-direction:column;gap:0;padding-bottom:8px}}
@media(max-width:760px) {
 .mast,main,.foot {width:calc(100% - 32px)}
 .layout {grid-template-columns:1fr;gap:36px}
 aside {padding-left:0;border-left:0}
 main {padding-top:22px}
 header nav {font-size:1rem}
 .foot {align-items:flex-start;flex-direction:column}
}
@media(min-width:1101px) {
 header nav {font-size:clamp(15px,1.25vw,18px);gap:clamp(12px,1.3vw,22px)}
 .brand {font-size:clamp(24px,2.25vw,36px)}
}
