/* The Vermilion Times — old-world gothic, laid out like a big-city daily.
   Ground: flat newsprint. Nameplate: UnifrakturMaguntia. Heads: Grenze Gotisch.
   Text: EB Garamond. Labels: IM Fell English SC. Ink: near-black with oxblood. */
:root{
  --linen:#f6f2e6; --linen-2:#ece6d4; --panel:#faf7ee; --ink:#14100b; --ink-2:#3a3129;
  --muted:#6b5d4c; --oxblood:#7c1f1a; --gold:#94763a; --rule:#1b1712; --hair:rgba(27,23,18,.28);
  --wrap:1220px; --gutter:clamp(16px,3.4vw,40px);
  --f-plate:"UnifrakturMaguntia","Old English Text MT",serif;
  --f-head:"Grenze Gotisch","UnifrakturMaguntia",Georgia,serif;
  --f-text:"EB Garamond",Garamond,"Times New Roman",Georgia,serif;
  --f-label:"IM Fell English SC","EB Garamond",Georgia,serif;
  color-scheme:light}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}

/* newsprint: one flat, pale grey-cream, like the paper itself */
body{margin:0;color:var(--ink);font:1.12rem/1.6 var(--f-text);background:var(--linen)}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:.16em;text-decoration-thickness:1px}
p a,li a,.link{color:var(--oxblood);text-decoration:underline;text-underline-offset:.16em;text-decoration-thickness:1px}
:focus-visible{outline:2px solid var(--oxblood);outline-offset:3px}
.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;background:var(--panel);padding:.5rem .8rem;z-index:9}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:var(--gutter)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* utility bar */
.topbar{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-block:.55rem;
  font:400 .8rem/1.3 var(--f-label);letter-spacing:.05em;color:var(--ink-2)}
.topbar .editions{display:flex;flex-wrap:wrap;gap:.35rem 1rem}
.topbar .editions b{color:var(--ink);font-weight:400}
.btn{display:inline-block;font:400 .78rem/1 var(--f-label);letter-spacing:.08em;padding:.55rem .85rem;border-radius:2px;
  background:var(--oxblood);color:#f6efe0;white-space:nowrap}
.btn:hover{background:var(--ink);text-decoration:none}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--ink)}

/* masthead */
.masthead{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:1rem;padding-block:.3rem .6rem}
.mh-side{font:400 .84rem/1.45 var(--f-text);color:var(--ink-2)}
.mh-side b{display:block;font-weight:600;color:var(--ink)}
.mh-side .small{font-family:var(--f-label);letter-spacing:.05em;font-size:.76rem}
.mh-right{text-align:right}
.nameplate{margin:0;font:400 clamp(2rem,7.6vw,5.6rem)/1 var(--f-plate);text-align:center;white-space:nowrap;color:var(--ink);
  text-shadow:0 1px 0 rgba(255,255,255,.45)}
.nameplate a:hover{text-decoration:none}
.motto{margin:.15rem 0 .5rem;text-align:center;font:italic .95rem/1.3 var(--f-text);color:var(--ink-2)}

/* section nav: hairline above, heavy double rule below, like the big dailies */
.secnav{border-top:1px solid var(--rule);border-bottom:4px double var(--rule)}
.secnav ul{list-style:none;margin:0;padding:.5rem 0;display:flex;justify-content:center;flex-wrap:wrap;gap:.2rem 1.35rem}
.secnav a{font:400 .9rem/1.6 var(--f-label);letter-spacing:.04em;color:var(--ink)}
.secnav a[aria-current]{color:var(--oxblood)}

/* bulletin ribbon under the nav */
.ribbon{display:flex;align-items:baseline;gap:.8rem;flex-wrap:wrap;padding:.65rem 0;border-bottom:1px solid var(--hair);font-size:1rem}
.ribbon .tag{font:400 .78rem/1 var(--f-label);letter-spacing:.08em;color:var(--oxblood)}
.ribbon .tag::before{content:"";display:inline-block;width:.5rem;height:.5rem;border-radius:50%;background:var(--oxblood);margin-right:.4rem;vertical-align:.05em}

/* type */
.kicker{margin:0 0 .3rem;font:400 .78rem/1.2 var(--f-label);letter-spacing:.09em;color:var(--oxblood)}
.h-lead{margin:0 0 .5rem;font:700 clamp(1.9rem,3.6vw,2.7rem)/1.06 var(--f-head);letter-spacing:.005em}
.h-1{margin:0 0 .4rem;font:700 clamp(1.4rem,2.2vw,1.65rem)/1.12 var(--f-head)}
.h-2{margin:0 0 .3rem;font:700 1.2rem/1.15 var(--f-head)}
.h-op{margin:0 0 .3rem;font:600 1.12rem/1.25 var(--f-text)}
.summary{margin:0 0 .6rem;color:var(--ink-2);font-size:1.02rem;line-height:1.5}
.bullets{margin:.2rem 0 .6rem;padding-left:1.05rem;color:var(--ink-2);font-size:1rem;line-height:1.45}
.bullets li{margin:.25rem 0}
.bullets li::marker{color:var(--oxblood)}
.meta{font:400 .74rem/1.2 var(--f-label);letter-spacing:.08em;color:var(--muted);text-transform:uppercase}
.byline{font:400 .82rem/1.3 var(--f-label);letter-spacing:.05em;color:var(--muted);margin:0 0 .5rem}
.dropcap::first-letter{float:left;font:400 4.1em/.78 var(--f-plate);color:var(--oxblood);padding:.08em .1em 0 0}

/* front page grid: news well and opinion rail */
.front{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(0,1fr);gap:0;padding-top:1.1rem}
.well{padding-right:clamp(1rem,2vw,1.6rem);border-right:1px solid var(--hair)}
.rail{padding-left:clamp(1rem,2vw,1.6rem)}
.story{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.45fr);gap:clamp(1rem,2vw,1.5rem);
  padding-bottom:1.1rem;margin-bottom:1.1rem;border-bottom:1px solid var(--hair)}
.story.split{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.story.split > article + article{border-left:1px solid var(--hair);padding-left:clamp(1rem,2vw,1.5rem)}
.story:last-child{border-bottom:0;margin-bottom:0}
figure{margin:0}
.cut{border:1px solid var(--ink);background:var(--panel);padding:6px}
.cut img{width:100%;height:auto}
figcaption{margin-top:.35rem;font:italic .78rem/1.35 var(--f-text);color:var(--muted);text-align:right}
.rail-head{margin:0 0 .7rem;padding-bottom:.25rem;border-bottom:2px solid var(--rule);font:400 .86rem/1 var(--f-label);letter-spacing:.1em}
.op{padding-bottom:.8rem;margin-bottom:.8rem;border-bottom:1px solid var(--hair)}
.op .who{display:block;font:400 .74rem/1.2 var(--f-label);letter-spacing:.07em;color:var(--muted);margin-bottom:.15rem}
.op p{margin:0;font-size:.98rem;color:var(--ink-2);line-height:1.45}
.box{border:3px double var(--rule);padding:.9rem 1rem;margin:1rem 0;background:rgba(244,238,225,.6)}
.box .h-2{margin-bottom:.35rem}
.box p{margin:.2rem 0 .7rem;font-size:.98rem;line-height:1.45}
.ornament{text-align:center;color:var(--gold);letter-spacing:.9em;margin:1.4rem 0 1rem;font-size:1rem}
.ornament::before{content:"\2766 \269C \2767"}

/* section blocks, NYT-style labelled band */
.band{margin-top:1.2rem;border-top:2px solid var(--rule)}
.band-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:.4rem 0 .8rem}
.band-head h2{margin:0;font:700 1.35rem/1 var(--f-head)}
.band-head span{font:400 .76rem/1 var(--f-label);letter-spacing:.08em;color:var(--muted)}
.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.grid4 > article{padding:0 1.1rem 1.1rem;border-left:1px solid var(--hair)}
.grid4 > article:nth-child(4n+1){border-left:0;padding-left:0}
.grid4 > article:nth-child(4n){padding-right:0}
.grid4 > article:nth-child(n+5){padding-top:1.1rem;border-top:1px solid var(--hair)}
.grid4 p{margin:.2rem 0 .5rem;font-size:.98rem;line-height:1.45;color:var(--ink-2)}
.status{display:inline-block;font:400 .7rem/1 var(--f-label);letter-spacing:.08em;color:var(--oxblood);border:1px solid currentColor;padding:.3rem .45rem}
.disclose{font-style:italic;font-size:.9rem !important}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.grid3 > article{padding:0 1.3rem 1rem;border-left:1px solid var(--hair)}
.grid3 > article:first-child{border-left:0;padding-left:0}.grid3 > article:last-child{padding-right:0}
.grid3 ul{margin:.3rem 0 .6rem;padding-left:1.05rem;font-size:.98rem;line-height:1.45;color:var(--ink-2)}
.grid3 p{font-size:.98rem;line-height:1.5;color:var(--ink-2)}
.towns{text-align:center;font:400 .92rem/1.9 var(--f-label);letter-spacing:.07em;border-block:1px solid var(--rule);padding:.5rem 0;margin:1.6rem 0 0}
.towns .fleur{color:var(--oxblood);margin:0 .4rem}

/* inner pages */
.page{max-width:44rem;margin:0 auto;padding:1.6rem 0 1rem}
.page h1{margin:0 0 .5rem;font:700 clamp(2rem,4.4vw,3rem)/1.06 var(--f-head)}
.page .deck{font-size:1.25rem;line-height:1.45;color:var(--ink-2);margin:0 0 1rem;font-style:italic}
.page h2{margin:1.8rem 0 .4rem;font:700 1.45rem/1.15 var(--f-head);padding-top:.5rem;border-top:1px solid var(--hair)}
.page ul{padding-left:1.2rem}.page li{margin:.35rem 0}

/* site index footer */
.siteindex{margin-top:2.4rem;padding-block:0 2.2rem}
.si-top{border-top:4px double var(--rule);padding-top:1.2rem}
.si-plate a,.si-cols a,.si-legal a,.secnav a{color:var(--ink);text-decoration:none}
.si-cols a:hover,.si-legal a:hover{text-decoration:underline}
.si-top{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;padding-bottom:.9rem;border-bottom:1px solid var(--hair)}
.si-plate{font:400 2rem/1 var(--f-plate);margin:0}
.si-label{font:400 .8rem/1 var(--f-label);letter-spacing:.1em;color:var(--muted);margin:1rem 0 .7rem}
.si-cols{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1.2rem}
.si-cols h3{margin:0 0 .45rem;font:400 .82rem/1.2 var(--f-label);letter-spacing:.09em;color:var(--oxblood)}
.si-cols ul{list-style:none;margin:0;padding:0}
.si-cols li{margin:.18rem 0;font-size:.95rem;line-height:1.35}
.si-legal{margin-top:1.4rem;padding-top:.8rem;border-top:1px solid var(--hair);display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;
  font:400 .78rem/1.4 var(--f-label);letter-spacing:.04em;color:var(--muted)}

/* responsive */
@media (max-width:1000px){
  .grid4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid4 > article{border-left:0;padding:1rem 0 1rem 0 !important;border-top:1px solid var(--hair)}
  .grid4 > article:nth-child(2n){padding-left:1.1rem !important;border-left:1px solid var(--hair)}
  .grid4 > article:nth-child(2n+1){padding-right:1.1rem !important}
  .grid4 > article:nth-child(-n+2){border-top:0;padding-top:0 !important}
  .si-cols{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:1060px){.masthead{grid-template-columns:1fr}.mh-side{display:none}}
@media (max-width:820px){
  .nameplate{font-size:clamp(2rem,10vw,5rem)}
  .front{grid-template-columns:1fr}
  .well{padding-right:0;border-right:0}
  .rail{padding-left:0;border-top:4px double var(--rule);padding-top:1rem;margin-top:.4rem}
  .grid3{grid-template-columns:1fr}
  .grid3 > article{border-left:0;padding:1rem 0;border-top:1px solid var(--hair)}
  .grid3 > article:first-child{border-top:0;padding-top:0}
}
@media (max-width:640px){
  body{font-size:1.06rem}
  .topbar .editions span:not(:first-child){display:none}
  .story,.story.split{grid-template-columns:1fr}
  .story.split > article + article{border-left:0;padding-left:0;border-top:1px solid var(--hair);padding-top:1rem}
  .story.lead figure{order:-1}
  .secnav ul{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;gap:1.1rem}
  .secnav ul::-webkit-scrollbar{display:none}
  .secnav li{flex:none}
  .grid4{grid-template-columns:1fr}
  .grid4 > article{padding:1rem 0 !important;border-left:0 !important;border-top:1px solid var(--hair) !important}
  .grid4 > article:first-child{border-top:0 !important;padding-top:0 !important}
  .si-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media print{body{background:#fff}.topbar,.secnav,.ribbon,.btn{display:none}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---------- news on the front page ---------- */
.news-lead{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
.news-lead.solo{grid-template-columns:1fr}
.news-lead .excerpt{margin:0 0 .6rem;font-size:1.02rem;line-height:1.55}
.side-col{border-left:1px solid var(--hair);padding-left:clamp(1rem,2vw,1.5rem)}
.side-story{padding-bottom:.8rem;margin-bottom:.8rem;border-bottom:1px solid var(--hair)}
.side-story:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.side-story .summary{font-size:.96rem;margin-bottom:.3rem}
.latest{margin:.3rem 0 0}
.latest .meta{display:block;margin-bottom:.2rem;color:var(--oxblood)}
.latest a{font:600 1rem/1.3 var(--f-text)}
.h-lead a,.h-1 a,.h-2 a,.h-op a{color:inherit;text-decoration:none}
.h-lead a:hover,.h-1 a:hover,.h-2 a:hover,.h-op a:hover{text-decoration:underline}

/* ---------- article pages ---------- */
.article .kicker a{color:inherit;text-decoration:none}
.article-body p{margin:0 0 1rem}
.article-body h2{font-size:1.3rem}
.article-body blockquote{margin:1.2rem 0;padding:.2rem 0 .2rem 1rem;border-left:3px solid var(--oxblood);font-style:italic;color:var(--ink-2)}
.article .disclose{border-top:1px solid var(--hair);padding-top:.8rem;color:var(--ink-2)}
.sources{margin-top:1.6rem;border:3px double var(--rule);padding:.9rem 1.1rem;background:rgba(244,238,225,.55)}
.sources h2{margin:0 0 .3rem !important;border:0 !important;padding:0 !important;font-size:1.1rem !important}
.sources p{margin:0 0 .4rem;font-size:.92rem;color:var(--muted)}
.sources ul{margin:0;padding-left:1.1rem;font-size:.95rem;line-height:1.45}
.sources li{overflow-wrap:anywhere}
.corrections{font-size:.92rem;color:var(--muted)}
.more{margin-top:1.8rem}
.more ul{list-style:none;padding:0}
.more li{padding:.45rem 0;border-top:1px solid var(--hair)}
.more li a{font:600 1.02rem/1.3 var(--f-text);color:var(--ink);text-decoration:none}
.more li .meta{display:block}

/* ---------- news index ---------- */
.news-list{list-style:none;padding:0;margin:1.2rem 0 0}
.news-list li{padding:1rem 0;border-top:1px solid var(--hair)}
.news-list .summary{margin:.2rem 0}
@media (max-width:640px){
  .news-lead{grid-template-columns:1fr}
  .side-col{border-left:0;padding-left:0;border-top:1px solid var(--hair);padding-top:1rem}
}
.nameplate a{color:inherit;text-decoration:none}

/* ---------- story images ---------- */
.art-link{display:block}
.story-art,.lead-art,.side-art,.thumb-art{margin:0}
.story-art img,.lead-art img,.side-art img,.thumb-art img{display:block;width:100%;height:auto;border:1px solid var(--ink);background:var(--panel)}
.story-art{margin:1rem 0 1.4rem}
.story-art figcaption{margin-top:.4rem;font:italic .86rem/1.4 var(--f-text);color:var(--muted);text-align:left}
.story-art .credit{font:400 .72rem/1.3 var(--f-label);letter-spacing:.06em;font-style:normal;color:var(--muted);white-space:nowrap}
.story-art .credit a{color:inherit}
.lead-art{margin-bottom:.8rem}
.side-art{margin:0 0 .5rem}
.side-story::after{content:"";display:block;clear:both}
.news-list li::after{content:"";display:block;clear:both}
.thumb-art{float:right;width:min(200px,36%);margin:0 0 .5rem 1rem}
.with-photo{display:flex;align-items:center;gap:.6rem}
.pub-photo{flex:none;width:40px;height:40px;border-radius:50%;object-fit:cover;border:1px solid var(--ink)}
.page .with-photo{align-items:flex-start}
.page .with-photo .pub-photo{width:56px;height:56px;margin-top:.25rem}
