/* op-heading-levels-ua */
:where(h2.rt-h4){display:block;font-size:1em;margin-block-start:1.33em;margin-block-end:1.33em;font-weight:bold}
:where(h3.rt-h4){display:block;font-size:1em;margin-block-start:1.33em;margin-block-end:1.33em;font-weight:bold}
/* op-heading-levels-ua:end */
/* ==========================================================================
   AZ Reporter — The Arizona Almanac
   Palette: Desert Nightfall — midnight ink, bone, Arizona turquoise,
   sunset red, brass. Type: Bricolage Grotesque / Newsreader / Space Mono.
   ========================================================================== */



:root{
  --ink:#0F1A24;
  --ink-2:#16242F;
  --ink-3:#1F313C;
  --bone:#F6F1E7;
  --bone-2:#ECE3D2;
  --bone-3:#E0D4BE;
  --turq:#12A69B;
  --turq-deep:#0A6F69;
  --turq-dk:#083F3C;
  --sunset:#E1512A;
  --sunset-dk:#B93D1C;
  --brass:#C4922F;
  --brass-lt:#E3B85A;
  --paper-text:#2B2018;
  --ink-text:#F6F1E7;
  --muted:#7C8A8E;
  --muted-dk:#5E504097;
  --line-ink:rgba(246,241,231,.16);
  --line-paper:rgba(15,26,36,.14);
  --disp:'Bricolage Grotesque',sans-serif;
  --serif:'Newsreader',Georgia,serif;
  --mono:'Space Mono',ui-monospace,monospace;
  --wrap:1240px;
  --read:44rem;
  --shadow:0 18px 50px -22px rgba(15,26,36,.55);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--serif);
  font-size:1.375rem;      /* 22px base reading */
  line-height:1.75;
  color:var(--paper-text);
  background:var(--bone);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:var(--turq-deep);text-decoration:none}
a:hover{color:var(--sunset)}
h1,h2,h3,h4,h5{font-family:var(--disp);font-weight:700;line-height:1.05;margin:0;color:var(--ink);letter-spacing:-.015em}
p{margin:0 0 1.15em}
ul,ol{margin:0 0 1.15em}
hr{border:0;height:1px;background:var(--line-paper);margin:2.5rem 0}
::selection{background:var(--sunset);color:var(--bone)}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 clamp(1.1rem,4vw,2.4rem)}
.kicker{font-family:var(--mono);font-size:.82rem;letter-spacing:.26em;text-transform:uppercase;font-weight:700;color:var(--sunset);margin:0 0 .5rem}
.kicker--turq{color:var(--turq-deep)}
.kicker--bone{color:var(--brass-lt)}

/* ---------- masthead / header ---------- */
.top{background:var(--ink);color:var(--ink-text);position:relative;z-index:40}
.top__bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--brass-lt);border-bottom:1px solid var(--line-ink);padding:.5rem 0}
.top__bar span{opacity:.85}
.top__bar .dot{color:var(--turq)}
.masthead{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;padding:1.5rem 0 1.3rem}
.brand{display:flex;flex-direction:column;line-height:1;text-decoration:none}
.brand__name{font-family:var(--disp);font-weight:800;color:var(--bone);font-size:clamp(1.8rem,5vw,2.9rem);letter-spacing:-.03em}
.brand__name b{color:var(--sunset)}
.brand__tag{font-family:var(--mono);font-size:.66rem;letter-spacing:.32em;text-transform:uppercase;color:var(--turq);margin-top:.5rem}
.brand:hover .brand__name{color:var(--bone)}

/* nav */
.nav{display:flex;align-items:center;gap:.3rem}
.nav a{font-family:var(--disp);font-weight:600;font-size:1rem;color:var(--bone);padding:.5rem .8rem;border-radius:2px;letter-spacing:.01em;transition:color .15s,background .15s}
.nav a:hover,.nav a[aria-current]{color:var(--ink);background:var(--brass-lt)}
.nav a.nav__cta{background:var(--sunset);color:var(--bone)}
.nav a.nav__cta:hover{background:var(--brass-lt);color:var(--ink)}

.navtoggle,.navtoggle-label{display:none}
@media(max-width:860px){
  .masthead{padding:1.1rem 0}
  .navtoggle-label{display:inline-flex;align-items:center;gap:.5rem;cursor:pointer;font-family:var(--mono);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--bone);border:1px solid var(--line-ink);padding:.6rem .8rem;border-radius:3px}
  .navtoggle-label .bars{width:18px;height:12px;position:relative;display:inline-block}
  .navtoggle-label .bars::before,.navtoggle-label .bars::after,.navtoggle-label .bars span{content:"";position:absolute;left:0;right:0;height:2px;background:var(--brass-lt)}
  .navtoggle-label .bars::before{top:0}
  .navtoggle-label .bars span{top:5px}
  .navtoggle-label .bars::after{top:10px}
  .nav{position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:var(--ink-2);border-top:1px solid var(--line-ink);max-height:0;overflow:hidden;transition:max-height .3s ease}
  .nav a{padding:1rem 1.4rem;border-bottom:1px solid var(--line-ink);border-radius:0;font-size:1.15rem}
  .nav a.nav__cta{text-align:center}
  .navtoggle:checked ~ .nav{max-height:70vh}
}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.55rem;font-family:var(--disp);font-weight:700;font-size:1rem;letter-spacing:.01em;padding:.85rem 1.5rem;border-radius:2px;border:2px solid transparent;cursor:pointer;transition:transform .12s,background .15s,color .15s}
.btn:hover{transform:translateY(-2px)}
.btn--sun{background:var(--sunset);color:var(--bone)}
.btn--sun:hover{background:var(--sunset-dk);color:var(--bone)}
.btn--turq{background:var(--turq-deep);color:var(--bone)}
.btn--turq:hover{background:var(--turq-dk);color:var(--bone)}
.btn--ghost{border-color:currentColor;color:var(--ink)}
.btn--ghost-bone{border-color:var(--brass-lt);color:var(--bone)}
.btn--ghost-bone:hover{background:var(--brass-lt);color:var(--ink)}
.arrowlink{font-family:var(--disp);font-weight:700;color:var(--sunset);display:inline-flex;align-items:center;gap:.4rem}
.arrowlink:hover{color:var(--turq-deep)}
.arrowlink::after{content:"→";transition:transform .15s}
.arrowlink:hover::after{transform:translateX(4px)}

/* ---------- HERO / front page ---------- */
.hero{background:var(--ink);color:var(--ink-text);padding:clamp(2.2rem,5vw,4rem) 0 clamp(2.6rem,6vw,4.5rem);position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:
   radial-gradient(120% 90% at 85% -10%,rgba(18,166,155,.22),transparent 55%),
   radial-gradient(90% 80% at 0% 110%,rgba(225,81,42,.20),transparent 60%);pointer-events:none}
.hero__grid{position:relative;display:grid;grid-template-columns:1.55fr .95fr;gap:clamp(1.4rem,3vw,2.6rem);align-items:stretch}
.lead{position:relative;border-radius:6px;overflow:hidden;min-height:clamp(360px,52vw,560px);display:flex;flex-direction:column;justify-content:flex-end;color:var(--bone);isolation:isolate}
.lead img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.lead::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,26,36,.15) 0%,rgba(15,26,36,.35) 45%,rgba(15,26,36,.92) 100%);z-index:-1}
.lead__body{padding:clamp(1.4rem,3vw,2.6rem)}
.lead h2{color:var(--bone);font-size:clamp(2rem,4.5vw,3.4rem);letter-spacing:-.02em;margin:.4rem 0 .7rem}
.lead h2 a{color:var(--bone)}
.lead h2 a:hover{color:var(--brass-lt)}
.lead p{font-size:1.15rem;color:rgba(246,241,231,.85);max-width:38ch;margin-bottom:1.1rem}
.tag{display:inline-block;font-family:var(--mono);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;padding:.35rem .7rem;border-radius:2px;background:var(--sunset);color:var(--bone)}
.tag--turq{background:var(--turq)}
.tag--brass{background:var(--brass-lt);color:var(--ink)}
.tag--ink{background:rgba(246,241,231,.14);color:var(--bone)}

.sidelead{display:flex;flex-direction:column;gap:1rem}
.sidecard{background:var(--ink-2);border:1px solid var(--line-ink);border-radius:5px;padding:1.3rem;display:flex;flex-direction:column;gap:.5rem;flex:1;transition:border-color .15s,transform .12s}
.sidecard:hover{border-color:var(--turq);transform:translateY(-2px)}
.sidecard h3{color:var(--bone);font-size:1.3rem;line-height:1.12}
.sidecard h3 a{color:var(--bone)}
.sidecard h3 a:hover{color:var(--brass-lt)}
.sidecard .meta{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--turq)}
.sidecard p{font-size:.98rem;color:rgba(246,241,231,.72);margin:0}

/* ---------- section frames ---------- */
.section{padding:clamp(3rem,7vw,5.5rem) 0}
.section--bone2{background:var(--bone-2)}
.section--ink{background:var(--ink);color:var(--ink-text)}
.section--turq{background:var(--turq-dk);color:var(--ink-text)}
.section__head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:2.2rem;flex-wrap:wrap}
.section__head h2{font-size:clamp(1.9rem,4.2vw,3rem)}
.section--ink .section__head h2,.section--turq .section__head h2{color:var(--bone)}
.section__title-lg{font-size:clamp(2.2rem,5vw,3.6rem)}
.rule-motif{display:flex;align-items:center;gap:.8rem;color:var(--brass);margin:0 0 2rem}
.rule-motif::before,.rule-motif::after{content:"";height:2px;background:currentColor;flex:1;opacity:.4}
.rule-motif .glyph{font-size:1.2rem;letter-spacing:.4em}

/* ---------- The Ledger (index of stories) ---------- */
.ledger{display:grid;grid-template-columns:repeat(2,1fr);gap:0 clamp(2rem,5vw,4rem)}
.beat{border-top:3px solid var(--ink);padding:1.2rem 0}
.beat__label{display:flex;align-items:baseline;justify-content:space-between;font-family:var(--mono);font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;font-weight:700;color:var(--sunset);margin-bottom:.9rem}
.beat__label .n{color:var(--muted)}
.entry{display:grid;grid-template-columns:auto 1fr;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line-paper);align-items:baseline}
.entry:last-child{border-bottom:0}
.entry__idx{font-family:var(--mono);font-size:.85rem;color:var(--brass);font-weight:700}
.entry h3{font-size:1.4rem;line-height:1.15;margin-bottom:.25rem}
.entry h3 a{color:var(--ink)}
.entry h3 a:hover{color:var(--sunset)}
.entry p{font-size:1rem;color:#54463b;margin:0}

/* ---------- Arizona by the numbers ---------- */
.numbers{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-paper);border-top:3px solid var(--ink);border-bottom:3px solid var(--ink)}
.num{background:var(--bone);padding:clamp(1.4rem,3vw,2.2rem) clamp(1.1rem,2.5vw,1.8rem);display:flex;flex-direction:column;gap:.45rem;transition:background .15s}
.num:hover{background:var(--bone-2)}
.num__val{font-family:var(--disp);font-weight:800;font-size:clamp(2.4rem,5.5vw,4rem);line-height:1;color:var(--ink);letter-spacing:-.03em}
.num:nth-child(3n+1) .num__val{color:var(--sunset)}
.num:nth-child(3n+2) .num__val{color:var(--turq-deep)}
.num:nth-child(3n) .num__val{color:var(--brass)}
.num__val small{font-size:.45em;font-weight:700;letter-spacing:0}
.num__lbl{font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--ink)}
.num__src{font-size:.98rem;color:#54463b;margin:0;line-height:1.45}
.num__src a{color:var(--turq-deep);border-bottom:1px solid rgba(18,166,155,.35)}
.num__src a:hover{color:var(--sunset)}
@media(max-width:760px){.numbers{grid-template-columns:1fr 1fr}}

/* ---------- feature cards grid ---------- */
.cardgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:clamp(1.4rem,3vw,2.2rem)}
.cardgrid--3{grid-template-columns:repeat(3,1fr)}
@media(max-width:960px){.cardgrid--3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.cardgrid--3{grid-template-columns:1fr}}
.card{background:var(--bone);border:1px solid var(--line-paper);border-radius:5px;overflow:hidden;display:flex;flex-direction:column;transition:transform .14s,box-shadow .14s}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.card__media{aspect-ratio:16/10;overflow:hidden;background:var(--ink-3)}
.card__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.card:hover .card__media img{transform:scale(1.05)}
.card__body{padding:1.3rem 1.4rem 1.5rem;display:flex;flex-direction:column;gap:.6rem;flex:1}
.card h3{font-size:1.45rem;line-height:1.14}
.card h3 a{color:var(--ink)}
.card h3 a:hover{color:var(--sunset)}
.card p{font-size:1rem;color:#54463b;margin:0}
.card .meta{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--turq-deep);font-weight:700}
.card__foot{margin-top:auto;padding-top:.4rem}

/* ---------- Oddities Trail ---------- */
.trail{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3rem);align-items:center}
.trail__list{display:flex;flex-direction:column;gap:.2rem}
.stop{display:grid;grid-template-columns:auto 1fr;gap:1.2rem;padding:1.3rem 0;border-bottom:1px solid var(--line-ink)}
.stop:last-child{border-bottom:0}
.stop__no{font-family:var(--disp);font-weight:800;font-size:2rem;color:var(--brass-lt);line-height:1}
.stop h3{color:var(--bone);font-size:1.5rem;margin-bottom:.25rem}
.stop .place{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--turq);margin-bottom:.4rem}
.stop p{font-size:1rem;color:rgba(246,241,231,.78);margin:0}
.trail__map{border-radius:6px;overflow:hidden;border:1px solid var(--line-ink);min-height:340px;box-shadow:var(--shadow)}
.trail__map iframe{display:block;width:100%;height:100%;min-height:440px;border:0;filter:grayscale(.2) contrast(1.05)}

/* ---------- gallery ---------- */
.gallery{columns:4 220px;column-gap:14px}
.gallery figure{margin:0 0 14px;break-inside:avoid;border-radius:4px;overflow:hidden;position:relative;background:var(--ink-3)}
.gallery img{width:100%;display:block;transition:transform .5s,filter .3s}
.gallery figure:hover img{transform:scale(1.06)}
.gallery figcaption{position:absolute;left:0;right:0;bottom:0;padding:1.4rem .8rem .6rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--bone);background:linear-gradient(transparent,rgba(15,26,36,.85));opacity:0;transition:opacity .25s}
.gallery figure:hover figcaption{opacity:1}
@media(hover:none){.gallery figcaption{opacity:1;background:linear-gradient(transparent,rgba(15,26,36,.92) 40%)}}

/* ---------- newsletter dispatch ---------- */
.dispatch{background:var(--sunset);color:var(--bone);border-radius:8px;padding:clamp(2rem,5vw,3.6rem);display:grid;grid-template-columns:1.2fr 1fr;gap:2rem;align-items:center;position:relative;overflow:hidden}
.dispatch::before{content:"★";position:absolute;right:-1rem;top:-2rem;font-size:12rem;opacity:.12;font-family:var(--disp)}
.dispatch h2{color:var(--bone);font-size:clamp(1.8rem,4vw,2.8rem)}
.dispatch p{color:rgba(246,241,231,.9);font-size:1.1rem;margin:.7rem 0 0}
.dispatch__form{display:flex;gap:.6rem;flex-wrap:wrap}
.dispatch input{flex:1;min-width:200px;font-family:var(--serif);font-size:1.05rem;padding:.9rem 1.1rem;border:2px solid rgba(246,241,231,.5);background:rgba(246,241,231,.12);color:var(--bone);border-radius:3px}
.dispatch input::placeholder{color:rgba(246,241,231,.65)}
.dispatch input:focus{outline:none;border-color:var(--bone);background:rgba(246,241,231,.2)}
.dispatch .btn--turq{background:var(--ink);color:var(--bone)}
.dispatch .btn--turq:hover{background:var(--turq-dk)}

/* ---------- sponsors / partners ---------- */
.sponsors{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:clamp(1.1rem,2.4vw,1.6rem)}
.p-card{background:var(--bone);border:1px solid var(--line-paper);border-radius:5px;padding:1.5rem 1.5rem 1.6rem;display:flex;flex-direction:column;gap:.9rem}
.section--ink .p-card,.section--turq .p-card{background:var(--ink-2);border-color:var(--line-ink)}
.p-card__logo{width:100%;height:64px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:4px;border:1px solid var(--line-paper);overflow:hidden}
.p-card__logo img{max-width:80%;max-height:44px;object-fit:contain}
.p-card__name{font-family:var(--disp);font-weight:700;font-size:1.35rem}
.p-card__name a{color:var(--ink)}
.section--ink .p-card__name a,.section--turq .p-card__name a{color:var(--bone)}
.p-card__name a:hover{color:var(--sunset)}
.p-card__desc{font-size:1rem;color:#54463b;margin:0}
.section--ink .p-card__desc,.section--turq .p-card__desc{color:rgba(246,241,231,.75)}
.p-card__foot{margin-top:auto}
/* read-more toggle (CSS only) */
.p-more{display:none}
.p-card__desc.clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.p-more-lbl{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--turq-deep);cursor:pointer;font-weight:700;display:inline-block;margin-top:-.3rem}
.section--ink .p-more-lbl,.section--turq .p-more-lbl{color:var(--brass-lt)}
.p-more-lbl::after{content:"Read more ▾"}
.p-more:checked ~ .p-card__desc.clamp{-webkit-line-clamp:unset;display:block}
.p-more:checked ~ .p-more-lbl::after{content:"Show less ▴"}

/* ---------- footer (ornamental) ---------- */
.foot{background:var(--ink);color:var(--ink-text);padding:clamp(2.6rem,6vw,4rem) 0 2rem;text-align:center}
.foot__motif{display:flex;align-items:center;justify-content:center;gap:1rem;color:var(--brass);margin-bottom:1.8rem}
.foot__motif::before,.foot__motif::after{content:"";height:1px;width:min(90px,20vw);background:currentColor;opacity:.5}
.foot__motif .sun{font-size:1.4rem}
.foot__brand{font-family:var(--disp);font-weight:800;font-size:clamp(1.6rem,4vw,2.4rem);color:var(--bone);letter-spacing:-.02em}
.foot__brand b{color:var(--sunset)}
.foot__tag{font-family:var(--mono);font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--turq);margin:.6rem 0 1.8rem}
.foot__links{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem 1.6rem;margin-bottom:1.6rem;font-family:var(--disp);font-weight:600}
.foot__links a{color:var(--bone);font-size:1.02rem}
.foot__links a:hover{color:var(--brass-lt)}
.foot__legal{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;color:var(--muted);border-top:1px solid var(--line-ink);padding-top:1.4rem}
.foot__legal a{color:var(--muted)}
.foot__legal a:hover{color:var(--brass-lt)}

/* ==========================================================================
   ARTICLE / POST layout
   ========================================================================== */
.pagehero{background:var(--ink);color:var(--ink-text);padding:clamp(2.2rem,5vw,3.5rem) 0 clamp(2rem,4vw,3rem);position:relative;overflow:hidden}
.pagehero::before{content:"";position:absolute;inset:0;background:radial-gradient(80% 120% at 100% 0%,rgba(18,166,155,.18),transparent 55%);pointer-events:none}
.crumbs{position:relative;font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--turq);margin-bottom:1.2rem;display:flex;gap:.6rem;flex-wrap:wrap}
.crumbs a{color:var(--turq)}
.crumbs a:hover{color:var(--brass-lt)}
.crumbs span{color:var(--muted)}
.pagehero h1{position:relative;color:var(--bone);font-size:clamp(2.1rem,5.5vw,4rem);max-width:20ch;letter-spacing:-.02em}
.pagehero .lede{position:relative;font-size:1.25rem;color:rgba(246,241,231,.82);max-width:52ch;margin-top:1.2rem}

.article{padding:clamp(2.4rem,5vw,4rem) 0 clamp(3rem,6vw,5rem)}
.article__wrap{max-width:var(--wrap);margin:0 auto;padding:0 clamp(1.1rem,4vw,2.4rem)}
.article__hero{border-radius:6px;overflow:hidden;margin-bottom:clamp(1.8rem,4vw,3rem);box-shadow:var(--shadow);aspect-ratio:16/8;background:var(--ink-3)}
.article__hero img{width:100%;height:100%;object-fit:cover}
.prose{max-width:var(--read);margin:0 auto}
.prose>p:first-of-type::first-letter,.prose .dropcap::first-letter{font-family:var(--disp);font-weight:800;float:left;font-size:4.6rem;line-height:.82;padding:.35rem .55rem .1rem 0;color:var(--sunset)}
.prose p{font-size:1.44rem;line-height:1.76}
.prose h2{clear:both;font-size:clamp(1.7rem,3.5vw,2.4rem);margin:2.6rem 0 1rem;padding-top:1.4rem;border-top:2px solid var(--line-paper);position:relative}
.prose h2::before{content:"";position:absolute;top:-2px;left:0;width:70px;height:2px;background:var(--sunset)}
.prose h3{clear:both;font-size:1.5rem;margin:2rem 0 .8rem}
.prose ul,.prose ol{padding-left:0;list-style:none}
.prose ul li,.prose ol li{position:relative;padding-left:2.2rem;margin-bottom:1rem;font-size:1.32rem;line-height:1.65}
.prose ul li::before{content:"✦";position:absolute;left:0;top:.05em;color:var(--turq);font-size:1.1rem}
.prose ol{counter-reset:li}
.prose ol li::before{counter-increment:li;content:counter(li);position:absolute;left:0;top:.15em;font-family:var(--mono);font-weight:700;font-size:.9rem;color:var(--bone);background:var(--sunset);width:1.6rem;height:1.6rem;border-radius:50%;display:flex;align-items:center;justify-content:center}
.prose a{border-bottom:2px solid rgba(18,166,155,.35)}
.prose a:hover{border-color:var(--sunset)}

/* article figures placed through text */
.figure{margin:2.4rem 0}
.figure img{width:100%;border-radius:5px;background:var(--ink-3)}
.figure figcaption{font-family:var(--mono);font-size:.8rem;letter-spacing:.06em;color:var(--muted);margin-top:.7rem;padding-left:1rem;border-left:3px solid var(--brass)}
.figure--wide{max-width:var(--wrap);margin-left:50%;transform:translateX(-50%);width:min(100vw - 2.2rem,var(--wrap))}
.figure--right{float:right;width:min(48%,340px);margin:.4rem 0 1.6rem 2rem}
.figure--left{float:left;width:min(48%,340px);margin:.4rem 2rem 1.6rem 0}

/* pull quote */
.pullquote{font-family:var(--disp);font-weight:600;font-size:clamp(1.6rem,3.5vw,2.3rem);line-height:1.25;color:var(--ink);border-top:3px solid var(--sunset);border-bottom:3px solid var(--sunset);padding:1.6rem 0;margin:2.6rem 0;letter-spacing:-.01em}
.pullquote--turq{border-color:var(--turq)}
.blockquote{border-left:5px solid var(--turq);background:var(--bone-2);padding:1.4rem 1.6rem;margin:2rem 0;font-size:1.3rem;font-style:italic;border-radius:0 5px 5px 0}

/* callout / takeaways box */
.callout{background:var(--ink);color:var(--ink-text);border-radius:7px;padding:clamp(1.6rem,3vw,2.2rem);margin:2.6rem 0;box-shadow:var(--shadow)}
.callout h4{color:var(--brass-lt);font-family:var(--mono);font-weight:700;font-size:.82rem;letter-spacing:.22em;text-transform:uppercase;margin-bottom:1rem}
.callout ul{list-style:none;padding:0;margin:0}
.callout li{position:relative;padding-left:1.8rem;margin-bottom:.85rem;font-size:1.18rem;line-height:1.5;color:rgba(246,241,231,.9)}
.callout li:last-child{margin-bottom:0}
.callout li::before{content:"→";position:absolute;left:0;color:var(--turq)}
.callout--turq{background:var(--turq-dk)}
.callout--sun{background:var(--sunset)}
.callout--sun h4{color:var(--ink)}
.callout--sun li{color:var(--bone)}
.callout--sun li::before{color:var(--ink)}

/* quick facts / info card for real places */
.factcard{background:var(--bone-2);border:1px solid var(--line-paper);border-left:5px solid var(--brass);border-radius:0 6px 6px 0;padding:1.5rem 1.6rem;margin:2.2rem 0}
.factcard h4{font-size:1.35rem;margin-bottom:.9rem;display:flex;align-items:center;gap:.6rem}
.factcard h4 .pin{color:var(--sunset)}
.factrow{display:grid;grid-template-columns:auto 1fr;gap:.4rem 1.2rem;font-size:1.05rem}
.factrow dt{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--turq-deep);font-weight:700;align-self:center}
.factrow dd{margin:0}
.factcard .mapmini{margin-top:1.1rem;border-radius:5px;overflow:hidden;border:1px solid var(--line-paper)}
.factcard .mapmini iframe{display:block;width:100%;height:220px;border:0;filter:grayscale(.15)}

/* at-a-glance summary strip */
.glance{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--line-paper);border:1px solid var(--line-paper);border-radius:6px;overflow:hidden;margin:2.4rem 0}
.glance div{background:var(--bone);padding:1.2rem 1.3rem}
.glance dt{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sunset);font-weight:700;margin-bottom:.3rem}
.glance dd{margin:0;font-family:var(--disp);font-weight:700;font-size:1.5rem;color:var(--ink);line-height:1.1}
.glance dd small{display:block;font-family:var(--serif);font-weight:400;font-size:.95rem;color:#54463b;margin-top:.2rem}

/* tags row */
.tagrow{display:flex;flex-wrap:wrap;gap:.5rem;margin:2.5rem 0 0}
.tagrow a{font-family:var(--mono);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;padding:.4rem .8rem;border:1px solid var(--line-paper);border-radius:2px;color:var(--turq-deep)}
.tagrow a:hover{background:var(--ink);color:var(--bone);border-color:var(--ink)}

/* prev / next post nav */
.postnav{max-width:var(--read);margin:3rem auto 0;display:grid;grid-template-columns:1fr 1fr;gap:1rem;border-top:2px solid var(--line-paper);padding-top:1.6rem}
.postnav a{display:flex;flex-direction:column;gap:.3rem;padding:1rem 1.2rem;border:1px solid var(--line-paper);border-radius:5px;transition:border-color .15s,background .15s}
.postnav a:hover{border-color:var(--sunset);background:var(--bone-2)}
.postnav .dir{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sunset)}
.postnav .ttl{font-family:var(--disp);font-weight:700;color:var(--ink);font-size:1.05rem;line-height:1.2}
.postnav a.next{text-align:right}

/* related strip */
.related{max-width:var(--read);margin:3rem auto 0}

/* ---------- generic page (about, legal, contact) ---------- */
.page{padding:clamp(2.4rem,5vw,4rem) 0 clamp(3rem,6vw,5rem)}
.page .prose{max-width:var(--read)}
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(1.8rem,4vw,3.5rem);align-items:start}
.split .media{border-radius:6px;overflow:hidden;position:sticky;top:1.5rem;box-shadow:var(--shadow);background:var(--ink-3)}

/* accordion (about values) via details */
.acc{border-top:1px solid var(--line-paper)}
.acc details{border-bottom:1px solid var(--line-paper)}
.acc summary{cursor:pointer;list-style:none;padding:1.3rem 0;font-family:var(--disp);font-weight:700;font-size:1.45rem;color:var(--ink);display:flex;align-items:center;justify-content:space-between;gap:1rem}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";font-size:1.8rem;color:var(--sunset);font-family:var(--disp);transition:transform .2s}
.acc details[open] summary::after{content:"–"}
.acc details[open] summary{color:var(--sunset)}
.acc .acc__body{padding:0 0 1.4rem}
.acc .acc__body p{font-size:1.25rem}

/* team / value tiles */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.4rem;margin:2rem 0}
.tile{background:var(--bone-2);border-radius:6px;padding:1.6rem;border-top:3px solid var(--turq)}
.tile:nth-child(2){border-color:var(--sunset)}
.tile:nth-child(3){border-color:var(--brass)}
.tile h3{font-size:1.5rem;margin-bottom:.6rem}
.tile p{font-size:1.08rem;margin:0}

/* contact — bespoke */
.contact{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.6rem,4vw,3rem);align-items:stretch}
.contact__panel{background:var(--ink);color:var(--ink-text);border-radius:8px;padding:clamp(1.8rem,4vw,2.8rem);display:flex;flex-direction:column;gap:1.4rem}
.contact__panel h2{color:var(--bone)}
.contact__row{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:start;padding:1.1rem 0;border-bottom:1px solid var(--line-ink)}
.contact__row:last-child{border-bottom:0}
.contact__row .ic{font-size:1.4rem;color:var(--turq)}
.contact__row .lbl{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-lt);margin-bottom:.2rem}
.contact__row .val{font-size:1.2rem;color:var(--bone)}
.contact__row .val a{color:var(--bone);border-bottom:2px solid var(--turq)}
.contact__row .val a:hover{color:var(--brass-lt)}
.contact__map{border-radius:8px;overflow:hidden;min-height:320px;box-shadow:var(--shadow);border:1px solid var(--line-paper)}
.contact__map iframe{display:block;width:100%;height:100%;min-height:420px;border:0;filter:grayscale(.1)}
.formcard{background:var(--bone-2);border-radius:8px;padding:clamp(1.6rem,3.5vw,2.4rem);margin-top:2rem}
.formcard label{display:block;font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--turq-deep);font-weight:700;margin:0 0 .4rem}
.formcard .field{margin-bottom:1.2rem}
.formcard input,.formcard textarea,.formcard select{width:100%;font-family:var(--serif);font-size:1.1rem;padding:.85rem 1rem;border:1px solid var(--line-paper);background:var(--bone);border-radius:4px;color:var(--paper-text)}
.formcard input:focus,.formcard textarea:focus{outline:none;border-color:var(--turq);box-shadow:0 0 0 3px rgba(18,166,155,.18)}
.formcard .grid2{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}

/* featured news editorial spread */
.spread{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(1.2rem,2.5vw,1.8rem)}
.spread .big{grid-column:span 7}
.spread .side{grid-column:span 5;display:flex;flex-direction:column;gap:1.2rem}

/* ---------- responsive ---------- */
@media(max-width:960px){
  .hero__grid{grid-template-columns:1fr}
  .sidelead{flex-direction:row;flex-wrap:wrap}
  .sidecard{min-width:220px}
  .trail{grid-template-columns:1fr}
  .dispatch{grid-template-columns:1fr}
  .contact{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
  .split .media{position:static}
  .spread .big,.spread .side{grid-column:1/-1}
}
@media(max-width:760px){
  body{font-size:1.3rem}
  .ledger{grid-template-columns:1fr}
  .prose p{font-size:1.32rem}
  .prose ul li,.prose ol li{font-size:1.24rem}
  .figure--right,.figure--left{float:none;width:100%;margin:2rem 0}
  .figure--wide{margin-left:0;transform:none;width:100%}
  .gallery{columns:2 140px}
  .formcard .grid2{grid-template-columns:1fr}
  .sidelead{flex-direction:column}
  .postnav{grid-template-columns:1fr}
  .postnav a.next{text-align:left}
}
@media(max-width:440px){
  .prose>p:first-of-type::first-letter,.prose .dropcap::first-letter{font-size:3.6rem}
  .glance{grid-template-columns:1fr 1fr}
}

/* sp-roll-normalize: a logo roll keeps object-fit and loses its geometry.
   It used to set width:auto, height:46px, max-width:172px and min-width:30px, which let
   every plate in the roll shrink-wrap its own artwork — evbb measured 62px next to 204px
   in the SAME ROW. The operator's rule is that the dark ground is unified whatever the
   logo's size, so the plate cannot be sized by the logo. Geometry belongs to Design. */
[class~="roll"] .sponsor img,[class*="roll-"] .sponsor img,[class*="-roll"] .sponsor img{object-fit:contain}

/* sp-contain-guard: sponsor logos are wordmarks — never object-fit:cover (crops).
   object-fit ONLY. This block used to also set width:auto, padding:4px 10px,
   max-width:calc(100% - 20px) and min/max-height, which overrode Design's own frame and
   let every plate shrink-wrap its logo — the recurring "inconsistent sizing" and
   "lacks padding". Geometry belongs to Design. */
.sponsor img,.sponsor-box img,.sp-logo img{object-fit:contain!important;display:block;margin-left:auto;margin-right:auto;align-self:center}

/* sp-mark-align: marks sit CENTRED in their box. Placement only — Design's size,
   padding, panel and object-fit are untouched. */
.sponsor img,.sponsor-box img,.sp-logo img{object-position:center!important;margin-left:auto!important;margin-right:auto!important;display:block}
.sponsor .sp-logo,.sponsor-box{display:flex;align-items:center;justify-content:center}

/* sp-tile-uniform: a slot never grows to fill its row — every tile the same width in
   every row, whatever the count. Only flex-grow is touched. */
.sponsor{flex-grow:0!important}
.sponsor.lead-line,.sponsor.feat.lead-line{flex-grow:1!important}
.sponsor:not(.lead-line){flex-basis:var(--sp-tile,232px)!important}
.sponsor:not(.lead-line){grid-column:span 1!important;grid-row:span 1!important}

/* sp-blurb-stack: a slot holding BOTH a mark and our copy stacks them —
   a fixed-height row clips the mark once the copy is un-hidden. */
.sponsor:has(> img):has(> .sponsor-blurb:not(:empty)){flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;height:auto!important;min-height:0!important;overflow:visible!important;gap:8px}
.sponsor:has(> img):has(> .sponsor-blurb:not(:empty)) > img{align-self:flex-start}

/* sp-blurb-unhide: every supporter slot shows its text — no half-texted grids */
.sponsor-blurb:not(:empty){display:block!important;line-height:1.5}

/* sp-blurb-size: the design never sized .sponsor-blurb, so it inherited body copy.
   Relative, so it still follows the design's scale. */
.sponsor .sponsor-blurb{font-size:.8em;line-height:1.45}
.sponsor .sp-brand{font-weight:700}

/* sp-tile-fit: a slot fills its track, keeps a symmetric inset, and cannot be inflated
   by one long line of our copy. */
.sponsor.sponsor{width:100%!important;box-sizing:border-box!important;align-self:stretch!important;align-items:center!important;height:auto!important;min-height:0!important;overflow:hidden}
.sponsor.sponsor{justify-content:center!important}
:has(> .sponsor.sponsor){align-items:stretch!important}
.sponsor.sponsor .sponsor-name{min-width:0!important;overflow-wrap:anywhere}
.sponsor.sponsor > img{flex:0 0 auto!important;align-self:center!important}
.sponsor.sponsor > .sponsor-txt,.sponsor.sponsor > span:not(.sponsor-name):not(.sponsor-box):not(.sp-logo):not(.sponsor__logo){flex:1 1 auto!important;min-width:0!important}
.sponsor.sponsor .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;margin:0!important}
/* the mobile un-clamp is retired: the operator asked for "2-3 rows max" on phones, which is
   what the desktop rule above already does — so mobile simply keeps it. */
@media (max-width:640px){.sponsor.sponsor .sponsor-blurb{-webkit-line-clamp:3!important;display:-webkit-box!important;-webkit-box-orient:vertical!important;overflow:hidden!important}}

/* sp-blurb-link: money-link anchors in blurbs must inherit the blurb colour (readable on dark OR light tiles) */
.sponsor-blurb a{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* sp-mark-frame: a uniform plate for the money mark, in the tiers where Design sized the plate
   to the artwork instead. Operator's rule: the dark ground is unified whatever the logo's
   size. width:100% (or one fixed width where copy shares the row) + one height for the tier
   + object-fit:contain, so the plate is the same box everywhere and the artwork fits inside
   it. A ground and an inset are added ONLY where none exists — adding a second ground gives
   co-cure's rectangle-inside-a-rectangle. Design's framed tiers are not touched at all. */
.sponsors .p-card .p-card__logo.p-card__logo{background:#121013!important;padding:8px 12px!important;box-sizing:border-box!important;height:44px!important;width:100%!important;display:flex!important;align-items:center!important;justify-content:center!important}
.sponsors .p-card .p-card__logo.p-card__logo img{width:100%!important;height:100%!important;object-fit:contain!important;object-position:center center!important;margin:0!important;padding:0!important;background:transparent!important;display:block!important;max-width:none!important;max-height:none!important}
.sponsors .p-card .p-card__logo.p-card__logo{display:block!important;width:100%!important}


/* op-money-columns: the supporters block ran one tile per row — 12 tiles,
   3490px at 390, 28% of the whole page. Two columns bring it to
   1810px (48% shorter). Checked before writing: no new overflow, smallest mark still
   91px wide, longest blurb 2 lines, tile heights 277-306px.
   A block that fails any of those is left in one column — two narrow columns can make a block
   TALLER once the copy rewraps, which is the case the operator warned about.
   Only the tier(s) that were one-per-row are touched (.sponsors), never the section
   that holds several tiers: forcing a grid on that would put a featured row and a regulars run
   side by side. Phone widths only. */
@media (max-width:640px){
  .sponsors{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:26px!important}
    .sponsors > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sponsors > * *{min-width:0!important;max-width:100%}
    .sponsors img,.sponsors svg{max-width:100%;height:auto}
}

/* op-page-overflow: the page scrolled sideways at 320 — div.num reached
   323px in a 320px screen (+3px), inside
   div.numbers. Remedy: let the box shrink. Structural only, no spacing value of mine;
   tried in order and this is the first that held, with the page's visible copy unchanged.
   Phone widths only — desktop is re-measured after writing and must not move. */
@media (max-width:360px){
  div.num{min-width:0!important;max-width:100%!important;box-sizing:border-box!important}
}
/* op-heading-levels */
h3.rt-h4{font-family: var(--disp); font-weight: 700; line-height: 1.05; margin: 0px; color: var(--ink); letter-spacing: -0.015em;}
h3:where(.rt-h4){font-family: var(--disp); font-weight: 700; line-height: 1.05; margin: 0px; color: var(--ink); letter-spacing: -0.015em;}
h2:where(.rt-h3){font-family: var(--disp); font-weight: 700; line-height: 1.05; margin: 0px; color: var(--ink); letter-spacing: -0.015em;}
.sidecard h2:where(.rt-h3){color: var(--bone); font-size: 1.3rem; line-height: 1.12;}
.sidecard h2:where(.rt-h3) a{color: var(--bone);}
.sidecard h2:where(.rt-h3) a:hover{color: var(--brass-lt);}
.entry h2:where(.rt-h3){font-size: 1.4rem; line-height: 1.15; margin-bottom: 0.25rem;}
.entry h2:where(.rt-h3) a{color: var(--ink);}
.entry h2:where(.rt-h3) a:hover{color: var(--sunset);}
.card h2:where(.rt-h3){font-size: 1.45rem; line-height: 1.14;}
.card h2:where(.rt-h3) a{color: var(--ink);}
.card h2:where(.rt-h3) a:hover{color: var(--sunset);}
.stop h2:where(.rt-h3){color: var(--bone); font-size: 1.5rem; margin-bottom: 0.25rem;}
.callout h3:where(.rt-h4){color: var(--brass-lt); font-family: var(--mono); font-weight: 700; font-size: 0.82rem; letter-spacing: 0.22em; text-transform: uppercase; margin-bottom: 1rem;}
.callout--sun h3:where(.rt-h4){color: var(--ink);}
.factcard h3.rt-h4{font-size: 1.35rem; margin-bottom: 0.9rem; display: flex; align-items: center; gap: 0.6rem;}
.factcard h3:where(.rt-h4){font-size: 1.35rem; margin-bottom: 0.9rem; display: flex; align-items: center; gap: 0.6rem;}
.factcard h3.rt-h4 .pin{color: var(--sunset);}
.factcard h3:where(.rt-h4) .pin{color: var(--sunset);}
h1:where(.rt-h2){font-family: var(--disp); font-weight: 700; line-height: 1.05; margin: 0px; color: var(--ink); letter-spacing: -0.015em;}
.lead h1:where(.rt-h2){color: var(--bone); font-size: clamp(2rem, 4.5vw, 3.4rem); letter-spacing: -0.02em; margin: 0.4rem 0px 0.7rem;}
.lead h1:where(.rt-h2) a{color: var(--bone);}
.lead h1:where(.rt-h2) a:hover{color: var(--brass-lt);}
h2.rt-h4.rt-h4{position:static;height:13.7812px;margin-top:0px;padding-top:0px;border-top-width:0px;border-top-style:none;border-top-color:rgb(15, 26, 36);font-family:"Space Mono", ui-monospace, monospace;font-size:13.12px;line-height:13.776px;letter-spacing:2.8864px;text-transform:uppercase}
/* op-heading-levels:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(article.big > div.card__media > img,
  article.card > a.card__media > img,
  div.article__wrap > div.article__hero > img,
  div.gallery > figure > img,
  div.hero__grid.wrap > article.lead > img,
  div.prose > figure.figure.figure--left > img,
  div.prose > figure.figure.figure--right > img,
  div.prose > figure.figure.figure--wide > img,
  div.split > div.media > img,
  div.wrap > figure.figure.figure--wide > img){height:auto}
/* op-img-dims:end */
