/* Hallmark · theme: editorial · genre: editorial · hero: stage · nav: masthead · footer: colophon · posture: restrained · imagery: none · signature: oversized twilight masthead */
/* critique: quiet editorial hierarchy and generous whitespace serve a short field guide. */
:root { --paper:#f5f3eb; --ink:#18201d; --muted:#626c63; --accent:#b8dba3; --rule:#aab2a7; --display: Impact, "Arial Narrow", sans-serif; --body: Georgia, serif; --gutter:clamp(24px,5vw,72px); }
html,body { margin:0; overflow-x:clip; background:var(--paper); color:var(--ink); font-family:var(--body); scroll-behavior:smooth; }
* { box-sizing:border-box; }
a { color:inherit; text-underline-offset:5px; }
a:focus-visible { outline:3px solid var(--ink); outline-offset:5px; } a:active { opacity:.7; }
.page { max-width:1440px; margin:auto; padding:0 var(--gutter); }
.masthead,footer { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:24px 0; border-bottom:2px solid var(--ink); font:700 15px/1.2 var(--body); }
.brand { text-decoration:none; font-size:19px; }.masthead nav { display:flex; gap:28px; }
.hero { min-height:630px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:32px; align-items:center; border-bottom:2px solid var(--ink); }
.issue,.section-name { font:400 15px/1.3 var(--body); color:var(--muted); }
h1,h2,h3 { font-family:var(--display); font-weight:400; overflow-wrap:break-word; min-width:0; margin:0; text-wrap:balance; }
h1 { font-size:clamp(62px,9vw,132px); line-height:.9; letter-spacing:-.025em; }.lead { max-width:27rem; font-size:21px; line-height:1.5; margin:28px 0; }
.action { display:inline-flex; min-height:50px; align-items:center; padding:0 24px; background:var(--ink); color:var(--paper); text-decoration:none; }.action:hover { background:var(--muted); }
.typography { padding:32px 0; border-top:1px solid var(--ink); border-bottom:1px solid var(--ink); overflow:hidden; }.typography span { display:block; font:400 clamp(58px,8vw,118px)/.94 var(--display); text-transform:uppercase; letter-spacing:-.03em; }.typography span:nth-child(2) { color:var(--muted); }.typography small { display:block; margin-top:32px; font-size:14px; }
.intro,.closing { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:32px; padding:96px 0; border-bottom:1px solid var(--rule); }.intro h2,.closing h2 { font-size:clamp(44px,6vw,82px); line-height:1; max-width:11ch; }.intro div>p,.closing>p:not(.section-name) { max-width:36rem; font-size:20px; line-height:1.65; }
.entries { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; padding:64px 0 112px; border-bottom:2px solid var(--ink); }.entries article { border-top:1px solid var(--ink); padding-top:20px; }.entries span { display:inline-block; background:var(--accent); padding:4px 8px; font-size:14px; }.entries h3 { font-size:35px; margin-top:24px; }.entries p { max-width:28ch; font-size:17px; line-height:1.6; }
.closing h2 { grid-column:2; }.closing>p:not(.section-name),.closing>a { grid-column:2; }.closing>p { margin:0; }footer { border:0; color:var(--muted); }
@media(max-width:720px) { .masthead nav { gap:16px; }.hero { min-height:auto; padding:72px 0; grid-template-columns:1fr; }.typography { margin-top:36px; }.intro,.closing { grid-template-columns:1fr; padding:64px 0; }.closing h2,.closing>p:not(.section-name),.closing>a { grid-column:1; }.entries { grid-template-columns:1fr; padding-bottom:72px; }.entries h3 { margin-top:12px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }