
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { background:#e6dfd0; color:#242019; font-family:'Century Gothic', 'Apple Gothic', 'Segoe UI', sans-serif; font-size:17px;
  line-height:1.62; -webkit-font-smoothing:antialiased; }
img { display:block; max-width:100%; }
a { color:#8a5a2b; text-decoration:none; }
a:hover { text-decoration:underline; }

.paper { max-width:1040px; margin:0 auto; padding:clamp(18px,4vw,44px)
  clamp(16px,4vw,44px) 60px; }

/* masthead */
.masthead { border-bottom:3px double #242019; padding-bottom:14px; }
.mtop { display:flex; justify-content:space-between; font-family:'Courier New', Courier, monospace;
  font-size:12px; letter-spacing:0.12em; text-transform:uppercase; color:#857d6d;
  border-bottom:1px solid rgba(36,32,25,0.15); padding-bottom:8px; }
.nameplate { font-family:Rockwell, 'Rockwell Nova', 'Roboto Slab', Georgia, serif; font-weight:800; text-align:center;
  font-size:clamp(2.6rem,10vw,6.2rem); line-height:0.95; letter-spacing:-0.02em;
  margin:14px 0 12px; }
.dateline { display:flex; justify-content:center; gap:16px; align-items:center;
  font-family:'Courier New', Courier, monospace; font-size:12px; letter-spacing:0.16em; color:#857d6d;
  text-transform:uppercase; }
.dateline .mid { color:#8a5a2b; }

/* deck */
.deck { text-align:center; padding:26px 0 20px; border-bottom:1px solid rgba(36,32,25,0.15); }
.deck h2 { font-family:Rockwell, 'Rockwell Nova', 'Roboto Slab', Georgia, serif; font-weight:400; font-style:italic;
  font-size:clamp(1.3rem,3.2vw,2rem); line-height:1.3; max-width:40ch; margin:0 auto; }
.readmore { display:inline-block; margin-top:16px; font-family:'Courier New', Courier, monospace; font-size:13px;
  letter-spacing:0.1em; text-transform:uppercase; }

/* lead art full width */
.lead-art { margin:24px 0; }
.lead-art img { width:100%; height:clamp(240px,40vw,520px); object-fit:cover;
  filter:grayscale(0.15); }
.lead-art figcaption, .inline-art figcaption { font-family:'Courier New', Courier, monospace; font-size:12px;
  color:#857d6d; margin-top:8px; letter-spacing:0.04em; }

/* the flowing story */
.story { column-count:3; column-gap:36px; column-rule:1px solid rgba(36,32,25,0.28);
  text-align:justify; hyphens:auto; padding-top:12px; }
.story p { margin-bottom:1rem; }
.story p strong { font-family:Rockwell, 'Rockwell Nova', 'Roboto Slab', Georgia, serif; }
.lede { }
.dropcap { float:left; font-family:Rockwell, 'Rockwell Nova', 'Roboto Slab', Georgia, serif; font-weight:800; font-size:4.6rem;
  line-height:0.78; padding:4px 10px 0 0; color:#8a5a2b; }
.pullquote { break-inside:avoid; font-family:Rockwell, 'Rockwell Nova', 'Roboto Slab', Georgia, serif; font-weight:700;
  font-size:1.35rem; line-height:1.25; text-align:left; color:#242019;
  border-top:3px solid #242019; border-bottom:3px solid #242019; padding:16px 0;
  margin:8px 0 16px; }
.pullquote span { display:block; font-family:'Courier New', Courier, monospace; font-weight:400; font-size:12px;
  color:#857d6d; margin-top:10px; letter-spacing:0.1em; text-transform:uppercase; }
.inline-art { break-inside:avoid; margin:8px 0 14px; }
.inline-art img { width:100%; height:180px; object-fit:cover; }

/* classifieds */
.classifieds { margin-top:44px; border-top:3px double #242019; padding-top:20px; }
.secline { font-family:Rockwell, 'Rockwell Nova', 'Roboto Slab', Georgia, serif; font-weight:800; text-transform:uppercase;
  letter-spacing:0.06em; font-size:1.1rem; text-align:center; margin-bottom:20px; }
.cols { display:grid; grid-template-columns:repeat(3,1fr); gap:0; }
.ad { padding:16px 20px; border-left:1px solid rgba(36,32,25,0.28); }
.ad:first-child { border-left:0; }
.ad b { font-family:Rockwell, 'Rockwell Nova', 'Roboto Slab', Georgia, serif; display:block; margin-bottom:8px; letter-spacing:0.02em; }
.ad p { color:#857d6d; font-size:0.95rem; }

.colophon { text-align:center; font-family:'Courier New', Courier, monospace; font-size:12px; color:#857d6d;
  letter-spacing:0.08em; margin-top:34px; padding-top:16px; border-top:1px solid rgba(36,32,25,0.15); }

@media (max-width:900px){ .story{ column-count:2; } }
@media (max-width:600px){
  .story{ column-count:1; }
  .cols{ grid-template-columns:1fr; }
  .ad{ border-left:0; border-top:1px solid rgba(36,32,25,0.28); }
  .ad:first-child{ border-top:0; }
}


.xq{box-sizing:border-box;font-family:'Century Gothic', 'Apple Gothic', 'Segoe UI', sans-serif;color:#242019;padding:56px 24px;width:100%}
.xq *{box-sizing:border-box;margin:0}
.xq .xq-wrap{max-width:1060px;margin:0 auto}
.xq h2{font-family:Rockwell, 'Rockwell Nova', 'Roboto Slab', Georgia, serif;font-size:1.7rem;line-height:1.2;margin-bottom:8px}
.xq .xq-kick{display:block;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:#8a5a2b;margin-bottom:10px;font-weight:700}

.xq-quoterail{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.xq-quote{border:1px solid rgba(36,32,25,0.14);border-radius:3px;padding:22px;background:#efe8d9;position:relative}
.xq-quote::before{content:"\201C";position:absolute;top:-4px;left:14px;font-family:Rockwell, 'Rockwell Nova', 'Roboto Slab', Georgia, serif;font-size:3rem;color:#8a5a2b;opacity:.5}
.xq-quote p{font-style:italic;margin:10px 0 12px;line-height:1.55}
.xq-quote cite{font-style:normal;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:#857d6d}


.xq-tl-list{list-style:none;padding:0;margin-top:24px;position:relative;border-left:2px solid rgba(36,32,25,0.14)}
.xq-tl-item{position:relative;padding:0 0 26px 26px}
.xq-tl-item::before{content:"";position:absolute;left:-7px;top:4px;width:12px;height:12px;border-radius:50%;background:#8a5a2b;box-shadow:0 0 0 4px rgba(36,32,25,0.05)}
.xq-tl-item time{font-family:Rockwell, 'Rockwell Nova', 'Roboto Slab', Georgia, serif;font-weight:800;color:#8a5a2b;display:block;margin-bottom:4px}
.xq-tl-item p{color:#857d6d;max-width:58ch}


/* =====================================================
   DESIGN DNA: midnight-glass
   Whole-page visual system applied over the layout
   archetype. Appended last so it wins the cascade.
   ===================================================== */
html::before{content:'';position:fixed;inset:0;z-index:99980;pointer-events:none;background:radial-gradient(120% 90% at 50% 0%,transparent 55%,rgba(0,0,0,.5));opacity:.14;}
h1,h2,h3{letter-spacing:-0.02em !important;font-weight:700 !important}
img{border-radius:16px !important;box-shadow:0 30px 70px rgba(0,0,0,.4),0 0 0 1px rgba(36,32,25,.18) !important}
a[class*="btn"],button,span[class*="btn"]{border-radius:999px !important;box-shadow:0 10px 30px rgba(138,90,43,.45),inset 0 1px 0 rgba(255,255,255,.25) !important}
div[class*="card"]:not([class*="cards"]),article[class*="card"],a[class*="card"],figure[class*="card"],li[class*="card"]{border-radius:20px !important;border:1px solid rgba(36,32,25,.16) !important;box-shadow:0 24px 60px rgba(0,0,0,.35) !important}
