:root{
  --ink:#211710; --ink2:#4b3b2c; --paper:#F6F0E4; --paper2:#EFE5D2; --card:#FCF8EF;
  --amber:#B4692B; --ochre:#CE9B3F; --terra:#8A4526; --olive:#6C7155; --line:#E3D6BE;
  --shadow:0 18px 48px -22px rgba(33,23,16,.45);
  --serif:"Fraunces","Spectral",Georgia,serif;
  --body:"Newsreader",Georgia,"Times New Roman",serif;
  --sans:"Public Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);
  font-size:18px;line-height:1.72;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--terra);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1120px;margin:0 auto;padding:0 26px}
.narrow{max-width:720px;margin:0 auto;padding:0 26px}
.kick{font-family:var(--sans);font-size:11.5px;letter-spacing:3.5px;text-transform:uppercase;color:var(--amber)}

.preview{background:var(--ink);color:#EBDFC7;font-family:var(--sans);font-size:11.5px;
  letter-spacing:.5px;text-align:center;padding:8px 14px}
.preview b{color:var(--ochre)}
.preview a{color:#EBDFC7;text-decoration:underline}

header.site{position:sticky;top:0;z-index:40;background:rgba(246,240,228,.86);
  backdrop-filter:saturate(1.2) blur(10px);border-bottom:1px solid var(--line)}
header.site .bar{display:flex;align-items:center;justify-content:space-between;height:66px}
.brand{font-family:var(--serif);font-weight:600;font-size:23px;letter-spacing:.3px;font-style:italic}
.brand a{color:var(--ink)}.brand a:hover{text-decoration:none}
nav.main{display:flex;gap:26px;font-family:var(--sans);font-size:12.5px;letter-spacing:1.6px;text-transform:uppercase}
nav.main a{color:var(--ink2)}
nav.main a:hover,nav.main a.on{color:var(--amber);text-decoration:none}
@media(max-width:720px){nav.main{gap:15px;font-size:11px;letter-spacing:1px}.brand{font-size:19px}}

.hero{position:relative;padding:74px 0 34px}
.hero .plate{position:absolute;border-radius:16px;box-shadow:var(--shadow);opacity:1;transform:none;
  transition:opacity 1s ease,transform 1.1s cubic-bezier(.2,.7,.2,1)}
.js-anim .hero .plate{opacity:0;transform:translateY(26px) scale(.98)}
.js-anim .hero.in .plate{opacity:1;transform:none}
.hero .p1{width:290px;height:370px;right:2%;top:56px;background:
  linear-gradient(150deg,#E7B569,#B4692B 62%,#6d3a1c);transition-delay:.05s}
.hero .p2{width:200px;height:250px;right:20%;top:300px;background:
  linear-gradient(150deg,#F0DBB0,#C99A44 60%,#7c5326);transition-delay:.18s}
.hero .plate span{position:absolute;left:14px;bottom:12px;font-family:var(--sans);font-size:11px;
  letter-spacing:1px;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.4)}
.hero h1{font-family:var(--serif);font-weight:600;font-size:clamp(44px,8vw,104px);line-height:.96;
  margin:14px 0 0;max-width:9ch;letter-spacing:-.5px}
.hero h1 em{font-style:italic;color:var(--terra)}
.hero .lede{max-width:30ch;margin:22px 0 0;font-size:20px;color:var(--ink2)}
.hero .tagline{font-family:var(--sans);letter-spacing:2px;text-transform:uppercase;font-size:12px;
  color:var(--olive);margin-top:26px}
@media(max-width:820px){.hero .plate{display:none}.hero h1{max-width:none}}

.marquee{border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  overflow:hidden;white-space:nowrap;padding:12px 0;margin-top:20px;background:var(--paper2)}
.marquee .row{display:inline-block;animation:slide 26s linear infinite}
.marquee .row span{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--ink2);margin:0 26px}
.marquee .row span::after{content:"\00b7";color:var(--ochre);margin-left:26px}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.reveal{opacity:1;transform:none}
.js-anim .reveal{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.js-anim .reveal.in{opacity:1;transform:none}

.shead{display:flex;align-items:baseline;justify-content:space-between;margin:56px 0 8px;
  border-bottom:2px solid var(--ink);padding-bottom:8px}
.shead h2{font-family:var(--serif);font-weight:600;font-size:26px;margin:0}
.shead a{font-family:var(--sans);font-size:11.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--amber)}

.feature{display:grid;grid-template-columns:1.15fr .85fr;gap:34px;align-items:stretch;margin:26px 0 10px}
.feature .art{border-radius:16px;min-height:360px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.feature .art span{position:absolute;left:16px;bottom:14px;font-family:var(--sans);font-size:11px;
  letter-spacing:1px;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.45)}
.feature .txt{align-self:center}
.feature .txt h3{font-family:var(--serif);font-weight:600;font-size:40px;line-height:1.05;margin:10px 0 12px}
.feature .txt h3 a{color:var(--ink)}
.feature .txt .deck{font-size:19px;color:var(--ink2);margin:0 0 16px}
@media(max-width:820px){.feature{grid-template-columns:1fr}.feature .art{min-height:230px}.feature .txt h3{font-size:30px}}

.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin:30px 0 10px}
@media(max-width:820px){.grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.grid{grid-template-columns:1fr}}
.post{display:flex;flex-direction:column}
.post .art{border-radius:13px;height:210px;box-shadow:var(--shadow);position:relative;overflow:hidden;
  transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.post:hover .art{transform:translateY(-4px) scale(1.012)}
.post .art b{position:absolute;left:13px;top:12px;font-family:var(--sans);font-size:10.5px;
  letter-spacing:1.4px;text-transform:uppercase;color:#fff;background:rgba(33,23,16,.35);
  padding:3px 9px;border-radius:20px;backdrop-filter:blur(3px);font-weight:400}
.post h3{font-family:var(--serif);font-weight:600;font-size:22px;line-height:1.18;margin:14px 0 6px}
.post h3 a{color:var(--ink)}
.post .deck{font-size:15.5px;color:var(--ink2);margin:0 0 8px}
.post .meta{font-family:var(--sans);font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:#a08b6c}
.post .st{font-family:var(--sans);font-size:11px;color:#b09b7d;font-style:normal;margin-top:6px}

.t1{background:linear-gradient(155deg,#E7B569,#B4692B 62%,#6d3a1c)}
.t2{background:linear-gradient(155deg,#F0DBB0,#C99A44 58%,#7c5326)}
.t3{background:linear-gradient(155deg,#CE9B3F,#8A4526 64%,#3c2415)}
.t4{background:linear-gradient(155deg,#B7B487,#6C7155 60%,#3f452f)}

article{margin:38px 0 20px}
article .crumb{font-family:var(--sans);font-size:11.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--amber)}
article h1{font-family:var(--serif);font-weight:600;font-size:clamp(32px,5vw,52px);line-height:1.04;margin:12px 0 10px}
article .deck{font-size:21px;color:var(--ink2);font-style:italic;margin:0 0 8px}
article .meta{font-family:var(--sans);font-size:11.5px;letter-spacing:1.4px;text-transform:uppercase;color:#a08b6c;margin-bottom:22px}
.cover{border-radius:16px;height:340px;box-shadow:var(--shadow);margin:0 0 34px;position:relative;overflow:hidden}
.cover span{position:absolute;left:16px;bottom:14px;font-family:var(--sans);font-size:11px;letter-spacing:1px;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.45)}
article p{margin:0 0 22px}
article .lead{font-size:22px;line-height:1.5;color:var(--ink)}
article .lead::first-letter{font-family:var(--serif);font-size:64px;float:left;line-height:.72;
  padding:6px 12px 0 0;color:var(--terra);font-weight:600}
article h2{font-family:var(--serif);font-weight:600;font-size:27px;margin:36px 0 10px;color:var(--ink)}
.pull{font-family:var(--serif);font-style:italic;font-size:27px;line-height:1.35;color:var(--terra);
  border-left:3px solid var(--ochre);padding:6px 0 6px 22px;margin:30px 0}
.lacuna{background:#F2E1C4;border:1px dashed var(--amber);border-radius:6px;padding:1px 8px;
  font-size:15px;color:var(--terra)}
.ed-note{background:#EEE4CF;border-left:4px solid var(--ochre);border-radius:9px;padding:13px 18px;
  font-family:var(--sans);font-size:12.5px;line-height:1.6;color:var(--ink2);margin-top:40px}
.draft-flag{background:var(--paper2);border:1px solid var(--line);border-radius:10px;padding:10px 16px;
  font-family:var(--sans);font-size:12px;color:var(--ink2);margin:0 0 26px}

.gate{background:var(--ink);color:#EBDFC7;border-radius:18px;padding:30px 32px;margin:54px 0}
.gate h3{font-family:var(--serif);font-weight:600;font-size:24px;color:var(--ochre);margin:0 0 10px}
.gate p{font-size:16px;line-height:1.7;margin:0 0 8px}
.gate .lacuna{background:#3a2c1c;border-color:var(--ochre);color:var(--ochre)}
.gate .kick{color:var(--ochre)}

.about{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center;margin:60px 0 10px}
.about .art{border-radius:16px;height:300px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.about .art span{position:absolute;left:16px;bottom:14px;font-family:var(--sans);font-size:11px;letter-spacing:1px;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.4)}
.about h2{font-family:var(--serif);font-weight:600;font-size:32px;margin:0 0 12px}
@media(max-width:760px){.about{grid-template-columns:1fr}.about .art{height:200px}}

footer{border-top:1px solid var(--line);margin-top:70px;padding:40px 0 60px}
footer .cols{display:flex;justify-content:space-between;flex-wrap:wrap;gap:24px}
footer .brand{font-size:26px}
footer .fnav{font-family:var(--sans);font-size:12.5px;letter-spacing:1.4px;text-transform:uppercase;
  display:flex;flex-direction:column;gap:8px}
footer .fine{font-family:var(--sans);font-size:11.5px;color:#a08b6c;margin-top:26px;line-height:1.7}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}
  .reveal,.hero .plate{opacity:1!important;transform:none!important}}