/* Vet Ready — "The Visit". Warm oat ground, sage ink, coral reserved for escalation only. */
:root{
  --paper:#F0EADE;
  --card:#FBF7F0;
  --oat-deep:#E7DFD0;
  --mist:#DCE5DA;
  --sage:#4B7A5A;
  --deep:#2F5741;
  --ink:#33452F;
  --body:#3E4F42;
  --muted:#5A6D5F;
  --line:rgba(47,87,65,.18);
  --coral:#E08A6E;
  --coral-ink:#B5533A;
  --display:'Newsreader',Georgia,'Times New Roman',serif;
  --ui:'Karla',system-ui,-apple-system,sans-serif;
  --measure:72ch;
  --gut:clamp(18px,4vw,56px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--body);
  font:400 20px/1.65 var(--ui);
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
a{color:var(--sage);text-decoration:none}
a:hover{color:var(--deep)}
h1,h2,h3,h4{font-family:var(--display);color:var(--deep);font-weight:400;letter-spacing:-.02em;margin:0}
p{margin:0}
ul,ol{margin:0}
.wrap{max-width:1320px;margin:0 auto;padding-inline:var(--gut)}
.wrap-narrow{max-width:1080px;margin:0 auto;padding-inline:var(--gut)}
.kicker{font:600 13px/1 var(--ui);letter-spacing:.2em;text-transform:uppercase;color:var(--sage)}
.kicker-coral{color:var(--coral-ink)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;background:var(--card);padding:10px 16px;border-radius:6px;z-index:99}

/* ---------- header + dropdown nav ---------- */
.site-head{background:var(--deep);color:var(--paper);position:sticky;top:0;z-index:40}
.head-in{max-width:1320px;margin:0 auto;padding:14px var(--gut);display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:flex;flex-direction:column;gap:3px;color:var(--paper)}
.brand b{font:500 30px/1 var(--display);letter-spacing:-.015em;color:#F5F0E6}
.brand span{font:500 11.5px/1 var(--ui);letter-spacing:.17em;text-transform:uppercase;color:rgba(245,240,230,.7)}
.nav-toggle,.sub-toggle{position:absolute;opacity:0;pointer-events:none}
.burger{display:none}
.nav{display:flex;align-items:center;gap:4px;list-style:none;padding:0;margin:0}
.nav > li{position:relative}
.nav > li > a,.nav > li > .nav-lab{display:flex;align-items:center;gap:6px;padding:12px 13px;font:500 16px/1 var(--ui);color:rgba(245,240,230,.9);border-radius:6px;white-space:nowrap}
.nav > li > a:hover,.nav > li:hover > a,.nav > li:focus-within > a{color:#fff;background:rgba(245,240,230,.1)}
.nav > li > a[aria-current]{color:#fff;box-shadow:inset 0 -2px 0 var(--coral)}
.chev{width:9px;height:9px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(45deg) translateY(-2px);opacity:.75}
.nav-sub{
  position:absolute;top:100%;left:0;min-width:340px;list-style:none;margin:0;padding:10px;
  background:var(--card);border:1px solid var(--line);border-radius:10px;
  box-shadow:0 18px 40px rgba(35,58,43,.22);
  opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .14s ease,transform .14s ease;
}
.nav > li:hover > .nav-sub,.nav > li:focus-within > .nav-sub{opacity:1;visibility:visible;transform:translateY(0)}
.nav > li.has-sub:nth-child(n+3) > .nav-sub{left:auto;right:0}
.nav > li.has-sub::after{content:"";position:absolute;left:0;right:0;top:100%;height:10px}
.nav-sub li + li{border-top:1px solid rgba(47,87,65,.1)}
.nav-sub a{display:block;padding:11px 13px;border-radius:6px;font:400 17px/1.35 var(--ui);color:var(--deep)}
.nav-sub a:hover{background:var(--mist)}
.nav-sub .sub-head{display:block;padding:8px 13px 10px;font:600 11px/1 var(--ui);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}

/* ---------- generic bands ---------- */
.band{padding:clamp(44px,6vw,86px) 0}
.band-tight{padding:clamp(32px,4vw,56px) 0}
.band-mist{background:var(--mist)}
.band-oat{background:var(--oat-deep)}
.band-deep{background:var(--deep);color:rgba(245,240,230,.86)}
.band-deep h2,.band-deep h3{color:#F5F0E6}
.band-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:20px 40px;margin-bottom:34px}
.band-head h2{font-size:clamp(30px,3.6vw,44px);line-height:1.08}
.band-head p{max-width:46ch;font-size:18px;color:var(--muted)}
.band-note{font-size:17px;color:var(--muted)}

/* ---------- homepage hero ---------- */
.hero{position:relative;background:var(--deep)}
.hero-img{position:relative;width:100%;height:clamp(320px,52vw,620px);overflow:hidden}
.hero-img img{width:100%;height:100%;object-fit:cover}
.hero-plate{max-width:1320px;margin:0 auto;padding:0 var(--gut)}
.hero-card{
  background:rgba(240,234,222,.96);border-radius:12px;padding:clamp(24px,3vw,42px);
  max-width:680px;display:flex;flex-direction:column;gap:16px;
}
@media(min-width:900px){
  .hero-img{position:absolute;inset:0;height:100%}
  .hero{display:flex;align-items:flex-end;min-height:min(74vh,640px);padding:56px 0}
  .hero-plate{position:relative;width:100%}
}
.hero-card h1{font-size:clamp(38px,4.6vw,66px);line-height:1.02;letter-spacing:-.03em}
.hero-card .dek{font-size:clamp(18px,1.35vw,21px);line-height:1.6;color:#43563F;text-wrap:pretty}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}
.btn{display:inline-flex;align-items:center;gap:9px;padding:14px 22px;border-radius:8px;font:600 16px/1 var(--ui)}
.btn-primary{background:var(--deep);color:#F5F0E6}
.btn-primary:hover{background:#24452F;color:#fff}
.btn-ghost{border:1.5px solid var(--sage);color:var(--deep)}
.btn-ghost:hover{background:var(--mist)}
.btn-coral{background:var(--coral-ink);color:#FFF6F1}
.btn-coral:hover{background:#98432E;color:#fff}

/* ---------- seven stages ---------- */
.stages{display:grid;gap:20px;grid-template-columns:repeat(4,1fr)}
.stage{
  display:flex;flex-direction:column;gap:11px;padding:24px 24px 26px;background:var(--card);
  border:1px solid var(--line);border-top:3px solid var(--sage);border-radius:10px;
}
.stage-n{font:400 34px/1 var(--display);color:rgba(75,122,90,.55)}
.stage h3{font-size:23px;line-height:1.18}
.stage p{font-size:16.5px;line-height:1.55;color:var(--muted);text-wrap:pretty}
.stage .more{margin-top:auto;padding-top:14px;font:600 15px/1 var(--ui);color:var(--sage)}
.stage-link:hover{border-top-color:var(--coral);background:#fff}
.stages-tail{display:grid;gap:20px;grid-template-columns:repeat(3,1fr);margin-top:20px}
.stages-tail .stage{background:var(--mist);border:none;border-top:3px solid var(--deep)}
@media(max-width:1080px){.stages{grid-template-columns:repeat(2,1fr)}.stages-tail{grid-template-columns:repeat(2,1fr)}.stages-tail .stage:last-child{grid-column:1/-1}}
@media(max-width:620px){.stages,.stages-tail{grid-template-columns:1fr}}

/* ---------- urgency callout (coral = escalation only) ---------- */
.callout-urgent{
  background:var(--card);border:1.5px solid var(--coral);border-radius:12px;overflow:hidden;
  display:grid;grid-template-columns:1.15fr .85fr;
}
.callout-urgent > div{padding:clamp(24px,3vw,38px)}
.callout-urgent h2{color:var(--coral-ink);font-size:clamp(26px,2.6vw,34px);line-height:1.12}
.urgent-signs{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.urgent-signs li{position:relative;padding-left:24px;font-size:17.5px;line-height:1.5;color:var(--body)}
.urgent-signs li::before{content:"";position:absolute;left:0;top:.55em;width:10px;height:10px;border-radius:50%;background:var(--coral)}
.ring-panel{background:rgba(224,138,110,.12);border-left:1px solid rgba(224,138,110,.4);display:flex;flex-direction:column;justify-content:center;gap:10px}
.ring-panel .big{font:400 clamp(26px,2.6vw,34px)/1.15 var(--display);color:var(--coral-ink)}
@media(max-width:900px){.callout-urgent{grid-template-columns:1fr}.ring-panel{border-left:none;border-top:1px solid rgba(224,138,110,.4)}}

/* ---------- three-tier urgency guide ---------- */
.tiers{display:grid;gap:22px;grid-template-columns:repeat(3,1fr);align-items:stretch}
.tier{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.tier-head{padding:17px 24px;display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 16px;background:var(--mist)}
.tier-head b{font:700 15px/1 var(--ui);letter-spacing:.14em;text-transform:uppercase;color:var(--deep)}
.tier-head span{font:500 14px/1 var(--ui);color:var(--muted)}
.tier ul{list-style:none;padding:22px 24px 8px;margin:0;display:grid;gap:13px}
.tier li{font-size:17.5px;line-height:1.5;color:var(--body)}
.tier .tier-note{margin-top:auto;padding:18px 24px 22px;border-top:1px solid var(--line);font:500 16px/1.55 var(--ui);color:var(--muted)}
.tier-coral{border:1.5px solid var(--coral)}
.tier-coral .tier-head{background:var(--coral-ink)}
.tier-coral .tier-head b{color:#FFF6F1}
.tier-coral .tier-head span{color:rgba(255,246,241,.92)}
.tier-coral .tier-note{color:var(--coral-ink);border-top-color:rgba(224,138,110,.4)}
@media(max-width:980px){.tiers{grid-template-columns:1fr}}

/* ---------- carrier checklist (steppable) ---------- */
.checklist{list-style:none;padding:0;margin:0;display:grid;gap:12px;counter-reset:step}
.check-row{background:var(--card);border:1px solid var(--line);border-radius:10px}
.check-row label{display:grid;grid-template-columns:auto 54px 1fr;gap:18px;align-items:start;padding:20px 24px;cursor:pointer}
.check-row input{position:absolute;opacity:0;width:0;height:0}
.box{width:26px;height:26px;border:2px solid var(--sage);border-radius:6px;display:grid;place-items:center;margin-top:3px;background:#fff}
.box svg{width:16px;height:16px;opacity:0;stroke:var(--deep)}
.check-row input:checked ~ .box{background:var(--mist)}
.check-row input:checked ~ .box svg{opacity:1}
.check-row input:focus-visible ~ .box{outline:2px solid var(--coral-ink);outline-offset:2px}
.check-n{font:400 26px/1 var(--display);color:rgba(75,122,90,.55);margin-top:4px}
.check-txt b{display:block;font:500 20px/1.35 var(--ui);color:var(--deep);margin-bottom:5px}
.check-txt span{font-size:17px;line-height:1.55;color:var(--muted)}
.check-row input:checked ~ .check-txt b{color:var(--muted);text-decoration:line-through;text-decoration-color:rgba(75,122,90,.5)}
@media(max-width:560px){.check-row label{grid-template-columns:auto 1fr;gap:14px}.check-n{display:none}}

/* ---------- what drives the bill ---------- */
.bill{display:grid;gap:0;border-top:1px solid var(--line)}
.bill-row{display:grid;grid-template-columns:300px 1fr;gap:32px;padding:22px 0;border-bottom:1px solid var(--line);align-items:baseline}
.bill-row h3{font-size:24px;line-height:1.2}
.bill-row p{font-size:18px;line-height:1.6;color:var(--muted);max-width:62ch;text-wrap:pretty}
@media(max-width:760px){.bill-row{grid-template-columns:1fr;gap:8px}}

/* ---------- cards / feed ---------- */
.card-grid{display:grid;gap:22px;grid-template-columns:repeat(3,1fr);align-items:stretch}
.card-grid.two{grid-template-columns:repeat(2,1fr)}
.gcard{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.gcard:hover{background:#fff;border-color:var(--sage)}
.gcard .thumb{aspect-ratio:16/9;overflow:hidden;background:var(--mist)}
.gcard .thumb img{width:100%;height:100%;object-fit:cover}
.gcard .gbody{padding:22px 24px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.gcard h3{font-size:24px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.4em}
.gcard p{font-size:17px;line-height:1.55;color:var(--muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.meta{display:flex;flex-wrap:wrap;gap:8px 14px;font:600 13.5px/1 var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--sage)}
.meta .dot{color:rgba(75,122,90,.5)}
.gcard .meta{margin-top:auto;padding-top:12px}
@media(max-width:1000px){.card-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.card-grid,.card-grid.two{grid-template-columns:1fr}}

/* CSS-only "more" */
.more-toggle{position:absolute;opacity:0;pointer-events:none}
.more-wrap{display:none;margin-top:22px}
.more-toggle:checked ~ .more-wrap{display:block}
.more-lab{display:inline-flex;align-items:center;gap:10px;margin-top:26px;padding:13px 22px;border:1.5px solid var(--sage);border-radius:8px;font:600 16px/1 var(--ui);color:var(--deep);cursor:pointer}
.more-lab:hover{background:var(--mist)}
.more-toggle:checked ~ .more-lab{display:none}

/* ---------- sponsors ---------- */
.sponsor-block{display:grid;gap:18px}
.sponsor-grid{display:grid;gap:18px;grid-template-columns:repeat(5,1fr)}
.sponsor-grid.roll{grid-template-columns:repeat(6,1fr)}
.sponsor{display:flex;flex-direction:column;gap:10px;padding:16px;background:#233A2C;border:1px solid rgba(245,240,230,.14);border-radius:10px;min-height:104px}
.sponsor:hover{border-color:var(--coral)}
.sponsor img{width:100%;height:46px;object-fit:contain;opacity:.95}
.sponsor-blurb{font:400 14.5px/1.45 var(--ui);color:rgba(245,240,230,.72)}
.sponsor-blurb:empty{display:none}
.sponsor-note{font-size:16px;color:var(--muted)}
.band-deep .sponsor-note{color:rgba(245,240,230,.7)}
@media(max-width:1000px){.sponsor-grid{grid-template-columns:repeat(3,1fr)}.sponsor-grid.roll{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.sponsor-grid,.sponsor-grid.roll{grid-template-columns:repeat(2,1fr)}}

/* ---------- footer ---------- */
.site-foot{background:var(--deep);color:rgba(245,240,230,.8);padding:clamp(36px,4vw,60px) 0 44px}
.foot-grid{display:grid;grid-template-columns:1.2fr 2fr;gap:40px}
.foot-grid h4{color:#F5F0E6;font-size:24px;margin-bottom:10px}
.foot-disclaim{font-size:17.5px;line-height:1.65;max-width:62ch}
.foot-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.foot-cols b{display:block;font:600 12px/1 var(--ui);letter-spacing:.16em;text-transform:uppercase;color:rgba(245,240,230,.55);margin-bottom:12px}
.foot-cols a{display:block;padding:5px 0;font-size:17px;color:rgba(245,240,230,.85)}
.foot-cols a:hover{color:#fff}
.foot-rule{height:1px;background:rgba(245,240,230,.18);margin:34px 0 22px}
@media(max-width:860px){.foot-grid{grid-template-columns:1fr}.foot-cols{grid-template-columns:repeat(2,1fr)}}

/* ---------- section / category pages ---------- */
.sec-hero{background:var(--oat-deep);padding:clamp(38px,5vw,72px) 0}
.sec-hero-in{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
.sec-hero h1{font-size:clamp(36px,4.6vw,60px);line-height:1.03}
.sec-hero .dek{font-size:clamp(18px,1.4vw,21px);line-height:1.6;color:var(--muted);max-width:34ch;margin-top:14px}
.sec-hero figure{margin:0;border-radius:12px;overflow:hidden;aspect-ratio:4/3}
.sec-hero figure img{width:100%;height:100%;object-fit:cover}
@media(max-width:900px){.sec-hero-in{grid-template-columns:1fr}}
.cat-list{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.cat-list li{border-bottom:1px solid var(--line)}
.cat-list > li > a{display:grid;grid-template-columns:88px 1fr 210px;gap:30px;padding:26px 0;align-items:start}
.cat-list .n{font:400 40px/1 var(--display);color:rgba(75,122,90,.45)}
.cat-list h3{font-size:clamp(24px,2.3vw,31px);line-height:1.15;margin-bottom:8px}
.cat-list p{font-size:18px;line-height:1.55;color:var(--muted);max-width:60ch}
.cat-list .thumb{aspect-ratio:4/3;border-radius:8px;overflow:hidden;background:var(--mist)}
.cat-list .thumb img{width:100%;height:100%;object-fit:cover}
.cat-list > li > a:hover h3{color:var(--sage)}
@media(max-width:860px){.cat-list > li > a{grid-template-columns:1fr;gap:12px}.cat-list .n{font-size:28px}.cat-list .thumb{display:none}}
.crumbs{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font:500 15px/1 var(--ui);color:var(--muted);padding-block:20px}
.crumbs a{color:var(--sage)}

/* ---------- article ---------- */
.art-hero{position:relative;background:var(--deep)}
.art-hero .shot{width:100%;height:clamp(260px,42vw,520px);overflow:hidden}
.art-hero .shot img{width:100%;height:100%;object-fit:cover}
.art-hero figcaption{max-width:1320px;margin:0 auto;padding:12px var(--gut) 0;font:400 15.5px/1.5 var(--ui);color:rgba(245,240,230,.7)}
.art-title{max-width:1320px;margin:0 auto;padding:clamp(28px,3.4vw,52px) var(--gut) clamp(30px,3.6vw,54px)}
.art-title h1{font-size:clamp(34px,4.4vw,62px);line-height:1.03;letter-spacing:-.03em;max-width:24ch;color:#F5F0E6}
.art-title .dek{margin-top:18px;font-size:clamp(19px,1.5vw,23px);line-height:1.55;color:rgba(245,240,230,.85);max-width:52ch;text-wrap:pretty}
.art-title .meta{margin-top:22px;color:rgba(245,240,230,.7)}
.art-title .meta .dot{color:rgba(245,240,230,.45)}

.art-body{max-width:1320px;margin:0 auto;padding:clamp(34px,4vw,64px) var(--gut) 0}
.art-sec{display:grid;grid-template-columns:92px minmax(0,var(--measure));gap:0 34px;margin-bottom:clamp(30px,3.4vw,50px)}
.art-sec.has-aside{grid-template-columns:92px minmax(0,1fr) minmax(250px,320px)}
.art-sec-n{font:400 34px/1 var(--display);color:rgba(75,122,90,.45);padding-top:12px;text-align:right}
.art-col{grid-column:2;display:flex;flex-direction:column;gap:22px;min-width:0}
.art-col > *{min-width:0;max-width:100%}
.art-col h2{font-size:clamp(26px,2.7vw,38px);line-height:1.12;margin-bottom:2px}
.art-col p{font-size:20.5px;line-height:1.72;text-wrap:pretty}
.art-col p strong{color:var(--deep)}
.art-aside{grid-column:3;padding-left:34px;border-left:1px solid var(--line);display:flex;flex-direction:column;gap:18px}
.art-aside > *{min-width:0}
@media(max-width:1080px){
  .art-sec,.art-sec.has-aside{grid-template-columns:64px minmax(0,1fr);gap:0 22px}
  .art-sec-n{font-size:26px;padding-top:8px}
  .art-col{grid-column:2}
  .art-aside{grid-column:2;padding-left:0;border-left:none;margin-top:6px}
}
@media(max-width:620px){
  .art-sec{grid-template-columns:1fr}
  .art-sec-n{text-align:left;padding-top:0;margin-bottom:-8px}
  .art-col,.art-aside{grid-column:1}
}
.lead{font:400 clamp(21px,1.9vw,27px)/1.5 var(--display);color:var(--deep);max-width:44ch}
.opener::first-letter{
  float:left;font-family:var(--display);font-size:4.1em;line-height:.82;
  padding:.06em .1em 0 0;color:var(--sage);font-weight:400;
}
.art-lead-block{max-width:1320px;margin:0 auto;padding:0 var(--gut)}

/* palette components */
.pullquote{margin:8px 0;padding:6px 0 6px 26px;border-left:4px solid var(--coral);max-width:34ch}
.pullquote p{font:400 clamp(24px,2.4vw,33px)/1.24 var(--display);color:var(--deep);letter-spacing:-.02em}
.blockquote{margin:8px 0;padding:24px 28px;background:var(--mist);border-radius:10px}
.blockquote p{font:400 22px/1.5 var(--display);color:var(--deep)}
.blockquote cite{display:block;margin-top:12px;font:500 16px/1.4 var(--ui);font-style:normal;color:var(--muted)}
.callout{margin:8px 0;padding:22px 26px;background:var(--card);border-left:4px solid var(--coral);border-radius:8px}
.callout p{font:500 18.5px/1.6 var(--ui);color:var(--coral-ink);margin:0}
.note{padding:18px 22px;background:var(--mist);border-radius:8px;font:500 17.5px/1.6 var(--ui);color:var(--deep)}
.statrow{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.statblock{padding:22px 24px;background:var(--card);border:1px solid var(--line);border-radius:10px;display:flex;flex-direction:column;gap:8px}
.stat-num{font:400 clamp(34px,3.4vw,46px)/1 var(--display);color:var(--deep);letter-spacing:-.02em}
.stat-label{font:500 16px/1.4 var(--ui);color:var(--muted)}
.by-numbers{background:var(--mist);padding:clamp(28px,3.4vw,48px) 0;margin:clamp(28px,3.4vw,48px) 0}
.by-numbers .kicker{margin-bottom:20px;display:block}
.versus{width:100%;border-collapse:collapse;font-size:18px}
.versus th,.versus td{padding:16px 18px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.versus thead th{font:600 13px/1.3 var(--ui);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);background:var(--mist)}
.versus tbody th{font:500 18px/1.5 var(--ui);color:var(--deep);width:26%}
.versus td{color:var(--body);line-height:1.55}
.datatable{width:100%;border-collapse:collapse;font-size:18px}
.datatable caption{text-align:left;font:600 13px/1.3 var(--ui);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding-bottom:12px}
.datatable th,.datatable td{padding:15px 18px;text-align:left;border-bottom:1px solid var(--line);line-height:1.55}
.datatable thead th{background:var(--deep);color:#F5F0E6;font:600 14px/1.3 var(--ui);letter-spacing:.06em}
.datatable tbody th{font:500 18px/1.45 var(--ui);color:var(--deep);width:32%}
.datatable tbody tr:nth-child(even){background:var(--card)}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.table-scroll .datatable,.table-scroll .versus{min-width:540px}
.timeline{list-style:none;padding:0;margin:0;display:grid;gap:2px}
.timeline li{display:grid;grid-template-columns:230px 1fr;gap:24px;padding:16px 0 16px 22px;border-left:2px solid var(--line);position:relative}
.timeline li::before{content:"";position:absolute;left:-7px;top:23px;width:12px;height:12px;border-radius:50%;background:var(--sage);border:3px solid var(--paper)}
.t-when{font:600 16px/1.4 var(--ui);color:var(--deep);text-wrap:balance}
.t-what{font-size:18px;line-height:1.55;color:var(--muted)}
@media(max-width:700px){.timeline li{grid-template-columns:1fr;gap:4px}}
.chart{margin:0;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:22px 24px;overflow-x:auto}
.chart svg{min-width:500px}
.chart.donut svg{min-width:0}
.chart svg{width:100%;height:auto;display:block;overflow:visible}
.chart figcaption{margin-top:14px;font:400 16px/1.5 var(--ui);color:var(--muted)}
.chart .bar-lab{font:500 14px/1 var(--ui);fill:var(--body)}
.chart .bar-val{font:600 14px/1 var(--ui);fill:var(--deep)}
.article-figure{margin:0}
.article-figure img{border-radius:10px;width:100%}
.article-figure figcaption{margin-top:12px;font:400 16px/1.5 var(--ui);color:var(--muted);max-width:52ch}
.gallery{display:grid;gap:16px;grid-template-columns:repeat(3,1fr)}
.gallery figure{margin:0}
.gallery img{border-radius:8px;aspect-ratio:4/3;object-fit:cover;width:100%}
.gallery figcaption{margin-top:8px;font:400 15.5px/1.45 var(--ui);color:var(--muted)}
@media(max-width:700px){.gallery{grid-template-columns:1fr 1fr}}
.map-figure{margin:0}
.map-slot{aspect-ratio:16/10;border:1px dashed rgba(47,87,65,.4);border-radius:10px;background:var(--card)}
.map-figure figcaption{margin-top:12px;font:400 16px/1.5 var(--ui);color:var(--muted)}
.profile-grid{display:grid;gap:18px;grid-template-columns:repeat(2,1fr)}
.profile-card{padding:24px;background:var(--card);border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;gap:10px}
.profile-card .p-photo{width:88px;height:88px;border-radius:50%;object-fit:cover}
.profile-card h3{font-size:25px}
.profile-card .p-role{font:600 13px/1 var(--ui);letter-spacing:.12em;text-transform:uppercase;color:var(--sage)}
.profile-card p{font-size:17.5px;line-height:1.6;color:var(--muted)}
.profile-card .p-links a{font-weight:600}
.profile-card .p-attr{font-size:15px;color:rgba(90,109,95,.8)}
@media(max-width:760px){.profile-grid{grid-template-columns:1fr}}
.org-grid{display:grid;gap:14px;grid-template-columns:repeat(3,1fr)}
.org-card{display:flex;flex-direction:column;gap:6px;padding:18px 20px;background:var(--card);border:1px solid var(--line);border-radius:10px}
.org-card .org-logo{height:34px;width:auto;object-fit:contain}
.org-name{font:500 19px/1.3 var(--display);color:var(--deep)}
.org-host{font:400 15px/1 var(--ui);color:var(--muted)}
@media(max-width:760px){.org-grid{grid-template-columns:1fr}}
.entity-ref{font-weight:600;border-bottom:1px solid rgba(75,122,90,.4)}
.further-grid{display:grid;gap:16px;grid-template-columns:repeat(3,1fr)}
.further-grid a{padding:20px 22px;background:var(--card);border:1px solid var(--line);border-radius:10px;font:400 21px/1.25 var(--display);color:var(--deep)}
.further-grid a:hover{border-color:var(--sage);background:#fff}
@media(max-width:760px){.further-grid{grid-template-columns:1fr}}
.related{background:var(--oat-deep);margin-top:clamp(36px,4vw,64px);padding:clamp(32px,4vw,56px) 0}
.related-links{list-style:none;padding:0;margin:0;display:grid;gap:14px;grid-template-columns:repeat(3,1fr)}
.related-links li{background:var(--card);border:1px solid var(--line);border-radius:10px}
.related-links a{display:flex;flex-direction:column;gap:8px;padding:22px 24px}
.related-links .r-sec{font:600 12px/1 var(--ui);letter-spacing:.14em;text-transform:uppercase;color:var(--sage)}
.related-links .r-t{font:400 23px/1.22 var(--display);color:var(--deep)}
@media(max-width:820px){.related-links{grid-template-columns:1fr}}

/* ---------- simple pages ---------- */
.page-body{max-width:1320px;margin:0 auto;padding:clamp(32px,4vw,60px) var(--gut) clamp(40px,5vw,80px);display:grid;grid-template-columns:minmax(0,var(--measure)) 1fr;gap:48px}
.page-body .prose{display:flex;flex-direction:column;gap:22px}
.page-body .prose p{font-size:20.5px;line-height:1.72}
.page-body .prose h2{font-size:clamp(25px,2.5vw,34px);margin-top:14px}
.page-body aside{display:flex;flex-direction:column;gap:16px}
@media(max-width:1000px){.page-body{grid-template-columns:1fr}}
.big404{font:400 clamp(64px,12vw,150px)/.9 var(--display);color:var(--sage);letter-spacing:-.04em}

/* ---------- styleguide ---------- */
.sg-sec{padding:clamp(30px,3.6vw,52px) 0;border-bottom:1px solid var(--line)}
.sg-sec > h2{font-size:clamp(26px,2.8vw,38px);margin-bottom:6px}
.sg-sec > .band-note{margin-bottom:26px}
.sg-demo{display:flex;flex-direction:column;gap:22px;max-width:var(--measure)}
.sg-demo.wide{max-width:none}
.sg-lab{font:600 11.5px/1 var(--ui);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}

/* ---------- mobile nav ---------- */
@media(max-width:1120px){
  .burger{display:flex;align-items:center;gap:10px;padding:11px 14px;border:1.5px solid rgba(245,240,230,.4);border-radius:8px;font:600 15px/1 var(--ui);color:#F5F0E6;cursor:pointer}
  .burger svg{width:18px;height:18px;stroke:currentColor}
  .nav{
    position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;
    background:var(--deep);border-top:1px solid rgba(245,240,230,.18);
    padding:0 var(--gut);max-height:0;overflow:hidden;
  }
  .nav-toggle:checked ~ nav > .nav{max-height:78vh;overflow:auto;padding:8px var(--gut) 22px}
  .nav > li{border-bottom:1px solid rgba(245,240,230,.12)}
  .nav > li > a{padding:15px 2px;font-size:18px}
  .nav > li.has-sub{display:grid;grid-template-columns:1fr auto}
  .nav > li.has-sub > .sub-lab{display:grid;place-items:center;width:52px;cursor:pointer;color:rgba(245,240,230,.85)}
  .nav > li.has-sub::after{display:none}
  .nav-sub{
    position:static;grid-column:1/-1;min-width:0;opacity:1;visibility:visible;transform:none;
    background:transparent;border:none;box-shadow:none;padding:0 0 10px;max-height:0;overflow:hidden;transition:none;
  }
  .sub-toggle:checked ~ .nav-sub{max-height:none}
  .nav-sub .sub-head{display:none}
  .nav-sub li + li{border-top:1px solid rgba(245,240,230,.1)}
  .nav-sub a{color:rgba(245,240,230,.82);font-size:16.5px;padding:11px 12px}
  .nav-sub a:hover{background:rgba(245,240,230,.1);color:#fff}
  .head-in{position:relative;flex-wrap:wrap}
}
@media(min-width:1121px){.sub-lab{display:none}}
@media print{.site-head,.related,.sponsor-block{display:none}}

/* five section cards, one row */
.sec-row{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;align-items:stretch}
.sec-row .gcard{border-radius:10px}
.sec-row .gbody{padding:18px 18px 20px;gap:8px}
.sec-row .meta{font-size:12px;letter-spacing:.1em}
.sec-row h3{font-size:21px;line-height:1.15;min-height:0;-webkit-line-clamp:3}
.sec-row p{font-size:15.5px;line-height:1.5;-webkit-line-clamp:4}
.sec-strip-hint{display:none;margin-top:12px;font:500 15px/1.4 var(--ui);color:var(--muted)}
@media(max-width:1080px){.sec-row{gap:12px}.sec-row .gbody{padding:16px 15px 18px}.sec-row h3{font-size:19px}.sec-row p{font-size:15px;-webkit-line-clamp:5}}
@media(max-width:700px){
  .sec-row{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(150px,1fr);overflow-x:auto;padding-bottom:10px;scroll-snap-type:x proximity;
    -webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 28px),transparent 100%);mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 28px),transparent 100%)}
  .sec-row .gcard{scroll-snap-align:start}
  .sec-strip-hint{display:block}
}
@media(max-width:430px){.sec-row{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:1fr;overflow-x:visible;-webkit-mask-image:none;mask-image:none}.sec-strip-hint{display:none}}


/* 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-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}

/* op-centre-bold-4up: operator: the blurbs have visibly more margin on the left, bold the brand
   names, limit the bottom items to four per row. ⚠️ THE LEFT MARGIN IS OURS: sp-blurb-unhide adds
   margin-left:20px to a blurb that follows another child, which on a centred tile reads as the
   copy pushed right. Zeroed, the tile's text centred with it, the names given a weight, and the
   roll capped at four columns. */
.sponsor-grid .sponsor{text-align:center}
.sponsor-grid .sponsor > *:not(.sponsor-blurb) + .sponsor-blurb{margin-left:0}
.sponsor-grid .sponsor .sponsor-blurb .sp-brand{font-weight:700;color:rgba(245,240,230,.95)}
@media (min-width:900px){
  .sponsor-grid.roll{grid-template-columns:repeat(4,1fr)}
}

/* op-wrap-gutter: these elements carry the build's own gutter class but their own
   rule sets a padding SHORTHAND, which resets left/right to 0 — every line of type
   then sits against the screen edge at phone width. Design's own token is restated
   for the inline axis, on the exact element that lost it. Measured, not guessed:
   each selector below had TEXT within 2px of a viewport edge at 390. */
@media (max-width:900px){
  .wrap.band{padding-inline:var(--gut)}
}

/* op-blurb-rows: money blurbs ran to 6 rows at 390, 1395px of tier across
   11 tiles. Operator: blurbs should show "2-3 rows max" on mobile —
   a blurb that long eats the screen and, in a two-column grid, rewraps into more height than
   the columns save. Held to three rows at phone width; the copy stays in the markup and
   desktop is untouched. Only the tier(s) measured past three rows are clamped. */
@media (max-width:640px){
  .sponsor-grid .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;max-height:66px!important;min-height:0!important;overflow:hidden!important}
  .sponsor-grid.roll .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;max-height:66px!important;min-height:0!important;overflow:hidden!important}
}

/* op-odd-tier-lead: .sponsor-grid (5 tiles) lay out two per row with an ODD tile count, so the
   block ended on a lone tile beside an empty cell. The lead tile takes the whole row instead —
   operator: "the 1st item in such rows to be 100% width, then split" — so the grid reads as
   complete. These tiers were already two-per-row, which is why the column pass never wrote the
   rule for them. Checked before writing: no new horizontal overflow, block not more than 15%
   taller. Phone widths only; desktop keeps Design's layout. */
@media (max-width:640px){
  .sponsor-grid:has(> *:nth-child(odd):last-child) > *:first-child{grid-column:1 / -1!important}
}

/* op-blurb-two-rows: money blurbs ran FIVE rows or more (desk: .sponsor-grid 5 rows at 1024, .sponsor-grid.roll 5 rows at 900). Operator: "we should probably limit that to display only 2" — held to two rows in that width band only; the copy stays in the markup. */
@media (min-width:641px){
  .sponsor-grid .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;max-height:2lh!important;min-height:0!important;overflow:hidden!important}
  .sponsor-grid.roll .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;max-height:2lh!important;min-height:0!important;overflow:hidden!important}
}
/* op-blurb-two-rows:end */
/* op-heading-levels */
h2:where(.rt-h3){font-family: var(--display); color: var(--deep); font-weight: 400; letter-spacing: -0.02em; margin: 0px;}
div:where(.rt-h1){font-family: var(--display); color: var(--deep); font-weight: 400; letter-spacing: -0.02em; margin: 0px;}
.sec-hero div:where(.rt-h1){font-size: clamp(36px, 4.6vw, 60px); line-height: 1.03;}
.cat-list h2:where(.rt-h3){font-size: clamp(24px, 2.3vw, 31px); line-height: 1.15; margin-bottom: 8px;}
.cat-list > li > a:hover h2:where(.rt-h3){color: var(--sage);}
/* op-heading-levels:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(a > span.thumb > img,
  a.gcard > span.thumb > img,
  aside > figure.article-figure > img,
  div.art-aside > figure.article-figure > img,
  div.sec-hero-in > figure > img,
  section.art-hero > figure.shot > img,
  section.hero > div.hero-img > img){height:auto}
/* op-img-dims:end */