/* agou.ca – one stylesheet, mobile first. Calm, plain, accessible (WCAG AA contrast).
   Colours: navy #123a6d, blue #1a4c8b, yellow #ffd23f (accent only, never text on white). */
:root { --navy:#123a6d; --blue:#1a4c8b; --sky:#edf3fa; --yellow:#ffd23f; --ink:#1b1f24; --muted:#4a5561; --bg:#f5f7fa; --line:#d9e0ea; --radius:12px; }
*, *::before, *::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; text-size-adjust:100%; }
body { margin:0; font:18px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; color:var(--ink); background:var(--bg); overflow-wrap:break-word; }
@media (min-width:800px) { body { font-size:18px; } }
img, svg { max-width:100%; height:auto; }
a { color:var(--blue); text-underline-offset:3px; text-decoration-thickness:1px; }
a:hover { color:var(--navy); text-decoration-thickness:2px; }
:focus-visible { outline:3px solid var(--navy); outline-offset:3px; border-radius:4px; }
.page-head :focus-visible, .hero :focus-visible, .site-footer :focus-visible { outline-color:var(--yellow); }
main:focus { outline:none; }
.wrap { max-width:1120px; margin:0 auto; padding:0 18px; }
.skip { position:absolute; left:-9999px; top:0; background:var(--yellow); color:#000; padding:12px 16px; z-index:100; font-weight:700; }
.skip:focus { left:8px; top:8px; }
.staging { background:#fff4c2; color:#4d3a00; text-align:center; font-size:.85rem; padding:6px 12px; border-bottom:1px solid #eadb9a; }
[hidden] { display:none !important; }
.vh { position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* ---------- buttons (min 48px) ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:48px; padding:10px 20px; border-radius:10px; font:inherit; font-weight:700; line-height:1.2; text-decoration:none; border:2px solid transparent; cursor:pointer; text-align:center; }
.btn.primary { background:var(--blue); color:#fff; border-color:var(--blue); }
.btn.primary:hover { background:var(--navy); border-color:var(--navy); color:#fff; }
.btn.donate { background:var(--yellow); color:#2b2200; border-color:var(--yellow); }
.btn.sec { background:#fff; color:var(--blue); border-color:var(--blue); }
.btn.sec:hover { background:var(--sky); }
.btn.block { display:flex; width:100%; margin-top:22px; font-size:18px; }
.btn strong { font-weight:inherit; }
/* Action hierarchy (see README "Actions"): .btn.primary = the one main action of a section; .btn.sec = other actions;
   text links for reading/navigation: .pagelink / .readlink (one trailing → for pages, ↗ for other sites). No leading arrows. */
.pagelink a, .readlink a { display:inline-flex; align-items:center; gap:6px; min-height:48px; font-weight:700; }
.btn:disabled { opacity:.6; cursor:default; }

/* ---------- header ----------
   Phones/tablets (<1024px): a shallow 56px bar that stays at the top (solid white, no blur or transparency),
   name + riding on the left (never wrapped or shrunk), language switch + "Menu" button on the right.
   Volunteer sits in the bar from 480px, and is the first item of the menu below that. Desktop: not sticky. */
.site-header { background:#fff; border-bottom:1px solid var(--line); }
.bar { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:56px; padding-top:4px; padding-bottom:4px; }
.brand { display:flex; flex-direction:column; justify-content:center; min-height:48px; min-width:0; text-decoration:none; color:var(--navy); line-height:1.15; }
.brand-name { font-weight:800; font-size:1.15rem; letter-spacing:-.01em; white-space:nowrap; }
.brand-sub { font-size:.8rem; color:var(--muted); white-space:nowrap; }
@media (max-width:1023.98px) {
  .site-header { position:sticky; top:0; z-index:40; padding-top:env(safe-area-inset-top, 0px); }
  .site-header .bar { padding-left:max(18px, env(safe-area-inset-left, 0px)); padding-right:max(18px, env(safe-area-inset-right, 0px)); }
  html { scroll-padding-top:72px; }   /* anchors and focused fields land below the 56px bar */
  .js .menu-open .site-nav { max-height:calc(100vh - 57px); max-height:calc(100dvh - 57px); overflow-y:auto; overscroll-behavior:contain; }
}
@media (max-width:359.98px) { .site-header .bar { padding-left:max(12px, env(safe-area-inset-left, 0px)); padding-right:max(12px, env(safe-area-inset-right, 0px)); } .tools { gap:4px; } }
.tools { display:flex; align-items:center; gap:6px; }
.lang { display:inline-flex; align-items:center; justify-content:center; min-width:48px; min-height:48px; padding:0 10px; border:1.5px solid #9fb0c6; border-radius:10px; font-weight:700; text-decoration:none; color:var(--navy); font-size:.95rem; }
.lang:hover { border-color:var(--navy); background:var(--sky); }
.lang-long { display:none; }
.hdr-cta { display:none; padding:8px 12px; font-size:.95rem; }
@media (min-width:480px) { .hdr-cta { display:inline-flex; } }
.menu-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:48px; min-width:48px; padding:0 12px; border:1.5px solid var(--line); border-radius:10px; background:var(--sky); color:var(--navy); font:inherit; font-size:.95rem; font-weight:700; cursor:pointer; }
.burger, .burger::before, .burger::after { display:block; width:20px; height:2px; background:currentColor; border-radius:2px; position:relative; transition:transform .2s; }
.burger::before, .burger::after { content:""; position:absolute; left:0; }
.burger::before { top:-6px; } .burger::after { top:6px; }
.menu-open .burger { background:transparent; }
.menu-open .burger::before { transform:translateY(6px) rotate(45deg); }
.menu-open .burger::after { transform:translateY(-6px) rotate(-45deg); }
@media (min-width:560px) { .lang-long { display:inline; } .lang-short { display:none; } .hdr-cta { padding:8px 16px; } .brand-name { font-size:1.25rem; } }

.site-nav ul { list-style:none; margin:0 auto; padding-top:6px; padding-bottom:12px; }
.site-nav li { margin:0; }
.site-nav a { display:flex; align-items:center; min-height:48px; padding:0 12px; text-decoration:none; color:var(--ink); font-weight:600; border-radius:8px; }
.site-nav a:hover { background:var(--sky); }
.site-nav a[aria-current="page"], .site-nav a.active { color:var(--navy); background:var(--sky); box-shadow:inset 4px 0 0 var(--navy); }
.site-nav .subnav { padding:0 0 4px 16px; }
.site-nav .subnav a { font-weight:500; }
.site-nav .nav-cta { padding:4px 0 10px; }
.site-nav .nav-cta a.btn { display:flex; justify-content:center; color:#fff; background:var(--blue); box-shadow:none; }
.site-nav .nav-cta a.btn:hover { background:var(--navy); }
@media (min-width:480px) { .site-nav .nav-cta { display:none; } }
.js .site-nav { display:none; border-top:1px solid var(--line); }
.js .menu-open .site-nav { display:block; }
@media (min-width:1024px) {
  .menu-btn { display:none; }
  .js .site-nav, .site-nav { display:block; border-top:1px solid var(--line); }
  .site-nav > ul { display:flex; gap:4px; padding-top:4px; padding-bottom:4px; }
  .site-nav > ul > li { position:relative; }
  .site-nav a { padding:0 14px; }
  .site-nav a[aria-current="page"], .site-nav a.active { box-shadow:inset 0 -3px 0 var(--navy); background:transparent; }
  .site-nav .subnav { display:none; position:absolute; left:0; top:100%; min-width:240px; background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:0 8px 24px rgba(18,58,109,.14); padding:6px; z-index:20; }
  .site-nav .has-sub:hover .subnav, .site-nav .has-sub:focus-within .subnav { display:block; }
  .site-nav .subnav a[aria-current="page"] { background:var(--sky); box-shadow:inset 4px 0 0 var(--navy); }
}

/* ---------- hero (home): text always on a solid background ---------- */
.hero { background:var(--navy); color:#fff; padding:28px 0 32px; }
.hero-grid { display:grid; gap:24px; align-items:center; }
.hero h1 { font-size:2.4rem; line-height:1.08; margin:0 0 12px; letter-spacing:-.02em; }
.hero-sub { font-size:1.05rem; margin:0 0 14px; color:#e3ecf7; max-width:36em; }
.tagline { font-size:1.3rem; line-height:1.35; margin:0 0 20px; color:var(--yellow); }
.hero .callout { background:#fff; color:var(--ink); border-left:6px solid var(--yellow); }
.hero .callout a { font-weight:700; }
.hero-intro { font-size:1rem; line-height:1.5; margin:0 0 16px; color:#fff; max-width:40em; }
.hero .callout p:first-child strong { font-size:1.12rem; color:var(--navy); }
.hero-src { font-size:.8rem; line-height:1.5; color:#c9d8ea; margin:18px 0 0; }
.hero-src a { color:#fff; }
.hero-photo.no-photo { display:none; }
.hero-photo svg { color:#b9cde6; width:100%; }
.hero-photo.has-photo img { border-radius:var(--radius); display:block; }
.hero-photo figure { margin:0; } .hero-photo figcaption { display:none; }
@media (min-width:800px) {
  .hero { padding:52px 0 56px; }
  .hero-grid { grid-template-columns:1.4fr 1fr; gap:56px; }
  .hero h1 { font-size:3.2rem; }
  .tagline { font-size:1.6rem; }
  .hero-photo.no-photo { display:block; }
}

/* ---------- page head + content (short line length) ---------- */
.page-head { background:var(--navy); color:#fff; padding:24px 0 26px; }
.page-head h1 { margin:0; font-size:2rem; line-height:1.15; letter-spacing:-.01em; }
@media (min-width:800px) { .page-head { padding:38px 0 40px; } .page-head h1 { font-size:2.5rem; } }
/* Section treatments (README "Section treatments"):
   open  = .block: no box, sits on the page background, spacing does the separating (ordinary reading);
   card  = .card-sec / .hub-card / .ev / .formblock / .map-card: white, pale border, 12px radius (grouped actions, forms);
   band  = .band-sky: full-width pale-blue strip for a major transition (home: ways to help). Used sparingly. */
.content { padding-top:32px; padding-bottom:40px; max-width:800px; }
.hero .wrap { max-width:1120px; }
.page-head .wrap { max-width:800px; }   /* same container as the reading column: title and text share one left edge */
.block { margin:0 0 44px; }
.block > :first-child { margin-top:0; } .block > :last-child { margin-bottom:0; }
.block h2 { color:var(--navy); font-size:1.5rem; line-height:1.25; margin:0 0 14px; scroll-margin-top:16px; }
@media (min-width:800px) { .block { margin-bottom:56px; } .block h2 { font-size:1.65rem; } }
.card-sec, .formblock { background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:22px 18px; }
@media (min-width:800px) { .card-sec, .formblock { padding:30px 34px; } }
.band-sky { background:var(--sky); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:36px 0; margin:0 0 44px; }
.band-sky .block { margin:0; }
.block h3 { color:var(--navy); font-size:1.15rem; margin:24px 0 8px; }
p { margin:0 0 14px; max-width:62ch; }
main li, main blockquote { max-width:62ch; }
ul, ol { padding-left:1.3em; margin:0 0 16px; }
li { margin:8px 0; }
li .sub { display:block; color:var(--muted); font-size:.95rem; margin-top:2px; }
hr { border:0; border-top:1px solid var(--line); margin:20px 0; }
.callout { background:var(--sky); border-left:6px solid var(--blue); border-radius:10px; padding:16px 18px; margin:0 0 16px; }
.callout p { margin:0 0 6px; } .callout p:last-child { margin:0; }
.callout a { display:inline-flex; align-items:center; min-height:48px; }
.cta-line { margin:12px 0; }
@media (max-width:560px) { .cta-line .btn { display:flex; width:100%; } }
.toc { background:var(--sky); border-radius:10px; padding:10px 18px; margin:0 0 4px; }
.toc ul { margin:0; padding:0; list-style:none; } .toc li { margin:0; padding:0; } .toc a { display:inline-flex; min-height:48px; align-items:center; }
.fig { margin:14px 0 16px; }
.fig img { display:block; width:100%; height:auto; border-radius:10px; border:1px solid var(--line); }
.fig figcaption { font-size:.88rem; color:var(--muted); margin-top:6px; }
.figlink { display:block; }
details.more-details { background:#fff; border:1px solid var(--line); border-radius:10px; margin:10px 0; }
details.more-details summary { cursor:pointer; min-height:56px; display:flex; align-items:center; gap:12px; padding:10px 16px; font-weight:700; color:var(--navy); list-style:none; border-radius:10px; }
details.more-details summary:hover { background:var(--sky); }
details.more-details summary:focus-visible { outline:3px solid var(--navy); outline-offset:2px; }
details.more-details summary::-webkit-details-marker { display:none; }
details.more-details summary::before { content:"+"; flex:none; display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border:2px solid var(--navy); border-radius:50%; font-size:1.2rem; line-height:1; }
details[open].more-details summary::before { content:"−"; }
.details-body { padding:0 16px 12px; }
.placeholder, .draft { border:2px dashed #b58900; background:#fff9e0; color:#3d3000; border-radius:10px; padding:14px 16px; margin:0 0 16px; }
.draft { font-weight:700; }
.updated { color:var(--muted); font-size:.92rem; margin:6px 0 0; }
.keydates .src, .vote-src { color:var(--muted); font-size:.95rem; }
.content a[href^="tel:"] { white-space:nowrap; }
.facts li, .links li { margin:10px 0; }
.facts a, .links a { display:inline; }
.privacy-note { margin:14px 0 0; font-size:.95rem; }
.privacy-note a { display:inline-flex; align-items:center; min-height:48px; }

/* hub (Get involved) */
.hub { list-style:none; padding:0; margin:0; display:grid; gap:16px; }
@media (min-width:700px) { .hub { grid-template-columns:1fr 1fr; } }
.hub-card { margin:0; background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:22px 20px; display:flex; flex-direction:column; }
.hub-card h2 { font-size:1.3rem; margin:0 0 8px; } .hub-card h2 a { color:var(--navy); text-decoration:none; }
.hub-card p { flex:1; }
.hub-card .btn { align-self:flex-start; }
.hub + .block { margin-top:44px; }  /* Get involved: "Questions?" after the card grid (1 Oct 2026) */
@media (min-width:800px) { .hub + .block { margin-top:56px; } }
@media (max-width:560px) { .hub-card .btn { align-self:stretch; } }

/* social */
.social { list-style:none; padding:0; margin:8px 0 14px; display:flex; flex-wrap:wrap; gap:10px; }
.social li { margin:0; }
.social a { display:inline-flex; align-items:center; gap:8px; min-height:48px; padding:0 16px 0 12px; border-radius:10px; text-decoration:none; font-weight:700; }
.social svg { width:22px; height:22px; flex:none; }
.follow .social a { background:var(--sky); color:var(--navy); border:1.5px solid #bcd0e8; }
.follow .social a:hover { background:#dde9f6; }

/* ---------- forms ---------- */
.formblock .sub { color:var(--muted); font-size:.95rem; }
.intro { background:var(--sky); border-left:4px solid var(--blue); padding:12px 14px; border-radius:8px; margin:0 0 16px; }
.intro p { margin:0 0 8px; } .intro p:last-child { margin:0; }
.form label.f { display:block; font-weight:700; margin:18px 0 6px; }
.opt { font-weight:400; color:var(--muted); }
.form input[type=text], .form input[type=tel], .form input[type=email], .form select, .form textarea { width:100%; min-height:50px; padding:11px 12px; font:inherit; font-size:18px; color:var(--ink); background:#fff; border:1.5px solid #8a97a8; border-radius:10px; }
.form textarea { min-height:96px; resize:vertical; }
.form input:focus, .form select:focus, .form textarea:focus { outline:3px solid var(--navy); outline-offset:1px; border-color:var(--navy); }
.form fieldset { border:0; padding:0; margin:20px 0 0; min-width:0; }
.form legend { font-weight:700; padding:0; margin-bottom:4px; }
.hint { font-size:.95rem; color:var(--muted); margin:2px 0 4px; }
.cb { display:flex; gap:12px; align-items:flex-start; padding:10px 0; min-height:48px; }
.cb input { width:26px; height:26px; margin:1px 0 0; flex:none; accent-color:var(--blue); }
.cb label { flex:1; cursor:pointer; }
.cb.req { background:var(--sky); border-radius:8px; padding:12px; margin-top:14px; }
.row > div { min-width:0; }
@media (min-width:641px) { .row { display:flex; gap:12px; } .row > div { flex:1; } .row > div.sm { flex:0 0 38%; } }
/* one form surface: the section is the card; the form inside has no second box. Phones: edge-to-edge white surface, fields 16px from the screen edge */
.formblock .card.form { background:none; border:0; border-radius:0; padding:0; margin:18px 0 0; }
@media (max-width:640px) {
  .formblock { margin-left:-18px; margin-right:-18px; border-radius:0; border-left:0; border-right:0; padding:24px 16px; }
  #rsvp.card.form { margin-left:-18px; margin-right:-18px; border-radius:0; border-left:0; border-right:0; padding:20px 16px; }
}
.ferr { display:flex; gap:8px; align-items:flex-start; margin:6px 0 0; color:#8a1c1c; font-weight:600; font-size:.95rem; max-width:none; }
.ferr-ic { flex:none; display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; margin-top:1px; border-radius:50%; background:#8a1c1c; color:#fff; font-size:.85rem; font-weight:800; }
.form input[aria-invalid="true"], .form textarea[aria-invalid="true"], .form select[aria-invalid="true"] { border:2px solid #8a1c1c; }
.cb input[aria-invalid="true"] { outline:2px solid #8a1c1c; outline-offset:2px; }
.msg.err .msg-t { margin:0 0 4px; font-weight:700; }
.msg.err ul { margin:0; padding-left:1.2em; }
.msg.err li { margin:0; }
.msg.err a { display:inline-flex; align-items:center; min-height:48px; color:#8a1c1c; font-weight:700; }
.msg { margin-top:14px; padding:12px 14px; border-radius:10px; display:none; }
.msg.err { background:#fdecea; color:#8a1c1c; display:block; }
.msg.ok { background:#e8f5e9; color:#1b5e20; display:block; font-weight:600; }
.hp { position:absolute; left:-5000px; width:1px; height:1px; overflow:hidden; }

/* ---------- events ---------- */
.ev { background:#fff; border:1px solid var(--line); border-radius:10px; padding:14px 16px; margin:0 0 12px; }
.ev h3 { font-size:1.12rem; margin:0 0 6px; line-height:1.3; }
.ev h3 a { display:inline-block; padding:10px 0; min-height:48px; }
.ex { margin:0 0 10px; color:#333; display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.badge { display:inline-block; background:var(--sky); color:var(--navy); border:1px solid #bcd0e8; font-weight:700; font-size:.95rem; padding:5px 10px; border-radius:6px; }
.note { background:var(--sky); border-left:4px solid var(--blue); padding:12px 14px; border-radius:8px; }
.back { display:inline-flex; align-items:center; min-height:48px; font-weight:700; text-decoration:none; }
.evtitle { color:var(--navy); font-size:1.4rem; line-height:1.25; margin:6px 0 10px; }
.card { background:#fff; border:1px solid var(--line); border-radius:10px; padding:16px; margin:14px 0; }
.card.form h2 { color:var(--navy); margin:0 0 4px; }
.desc p { margin:0 0 .8em; } .desc :last-child { margin-bottom:0; }
.when b, .where b { display:block; font-size:.85rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.when p, .where p { margin:0 0 .3em; }
.more { display:inline-flex; align-items:center; min-height:48px; font-weight:700; }
.actions { display:flex; flex-wrap:wrap; gap:10px; margin:16px 0 0; }
.actions .btn.primary { flex:1 1 200px; }
.actions .btn.sec { flex:1 1 160px; }
.cal { position:relative; flex:1 1 200px; display:flex; } .cal > .btn { flex:1; }
.calmenu { position:absolute; top:calc(100% + 6px); left:0; right:0; background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:0 6px 20px rgba(0,0,0,.14); padding:6px; z-index:5; }
.calmenu a, .calmenu button { display:flex; align-items:center; width:100%; min-height:48px; padding:8px 12px; font:inherit; font-size:17px; font-weight:700; color:var(--blue); background:none; border:0; border-radius:6px; text-align:left; cursor:pointer; text-decoration:none; }
.calmenu a:hover, .calmenu button:hover { background:var(--sky); }

/* events redesign (30 Sep 2026, staging): date tile, practical facts first, exact-pin map (README "Events") */
.evlist { list-style:none; padding:0; margin:0; }
.evlist li.evc { max-width:none; }
.evc { display:flex; gap:14px; align-items:flex-start; background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:14px 16px; margin:0 0 12px; }
.evc.past { opacity:.7; }
.evc-body { flex:1; min-width:0; }
.evc h3 { font-size:1.15rem; line-height:1.3; margin:0; text-wrap:balance; }
.evc h3 a { display:inline-flex; align-items:center; min-height:48px; }
.evc p { margin:0; }
.evc-when { font-weight:700; color:var(--navy); }
.evc-nb { color:var(--muted); }
.evc-dir { margin-top:2px !important; }
.dtile { flex:none; display:flex; flex-direction:column; align-items:center; justify-content:center; width:62px; padding:7px 0 8px; margin-top:4px; border-radius:10px; background:var(--sky); border:1px solid #bcd0e8; color:var(--navy); line-height:1.05; text-align:center; }
.dt-wd, .dt-m { font-size:.75rem; font-weight:800; letter-spacing:.07em; }
.dt-d { font-size:1.55rem; font-weight:800; margin:2px 0 1px; }
.dtile.big { width:74px; margin-top:2px; } .dtile.big .dt-d { font-size:1.95rem; }
.evhead { display:flex; gap:16px; align-items:flex-start; margin:4px 0 18px; }
.evhead .evtitle { margin:0 0 6px; font-size:1.45rem; line-height:1.2; text-wrap:balance; }
@media (min-width:800px) { .evhead .evtitle { font-size:1.7rem; } }
.evwhen { margin:0; font-weight:700; }
.evnb { color:var(--muted); }
.evspot { margin:0 0 16px; max-width:62ch; }
.evspot strong { color:var(--navy); }
.evacts { margin:0; max-width:640px; }
.evapple { margin:4px 0 8px; }
.evmap { margin:8px 0 22px; max-width:640px; }
.evmap > a { display:block; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:#f6f4ef; }
.evmap img { display:block; width:100%; height:auto; }
.evmap figcaption { text-align:right; font-size:.8rem; color:var(--muted); }
.evmap figcaption a { display:inline-flex; align-items:center; min-height:44px; color:var(--muted); }
.evfacts { display:grid; grid-template-columns:max-content 1fr; gap:8px 16px; background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:14px 16px; margin:0 0 24px; max-width:62ch; }
.evfacts dt { font-size:.85rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); padding-top:3px; }
.evfacts dd { margin:0; }
.detail .desc { max-width:62ch; }
.detail .desc p { margin:0 0 1em; }
.evrsvp { border-top:1px solid var(--line); margin:26px 0 0; padding-top:12px; color:var(--muted); max-width:62ch; }
.evrsvp p { margin:0; }
.linkbtn { display:inline-flex; align-items:center; min-height:48px; padding:0; background:none; border:0; font:inherit; font-weight:700; color:var(--blue); text-decoration:underline; text-underline-offset:2px; cursor:pointer; }
.linkbtn:hover { color:var(--navy); }
@media (max-width:560px) { .evacts .btn, .evacts .cal { flex:1 1 100%; } }

/* ---------- footer ---------- */
.site-footer { background:#0e2c53; color:#e1e9f4; padding:34px 0 28px; font-size:1rem; }
.site-footer a { color:#fff; }
.site-footer h2 { color:#fff; font-size:1.15rem; margin:0 0 10px; }
.site-footer p { margin:0 0 8px; }
.site-footer p a { display:inline-block; padding:10px 0; }
.fgrid { display:grid; gap:26px; }
@media (min-width:800px) { .fgrid { grid-template-columns:1.2fr 1.2fr .8fr; gap:40px; } }
.soc-label { font-weight:700; color:#fff; margin-top:12px !important; }
.site-footer .social a { color:#fff; border:1.5px solid rgba(255,255,255,.45); }
.site-footer .social a:hover { background:rgba(255,255,255,.1); }
.fa-box { border:1.5px solid rgba(255,255,255,.4); border-radius:10px; padding:14px 16px; }
.fa-title { color:#fff; }
.fnav { list-style:none; padding:0; margin:0; }
.fnav li { margin:0; }
.fnav a { display:flex; align-items:center; min-height:48px; }
.auth { font-size:.92rem; color:#d3deec; border-top:1px solid rgba(255,255,255,.2); padding-top:14px; margin:24px 0 0 !important; max-width:none; }
.auth + .auth { border-top:0; padding-top:0; margin-top:4px !important; }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition:none !important; animation:none !important; scroll-behavior:auto !important; } }
@media print { .site-header, .staging { display:none; } }
.srclink { white-space:nowrap; font-size:.92rem; }
mark.todo { background:#fff1b8; color:#3d2e00; padding:2px 6px; border-radius:4px; border:1px dashed #8a6d00; font-size:.95em; }
/* ---------- riding map card (tools/make_map.py; self-hosted images, no scripts) ---------- */
.map-card { margin:0; background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; color:var(--ink); }
.map-card img { display:block; width:100%; height:auto; background:#cfe2f1; }
.map-card figcaption { padding:12px 16px 14px; border-top:1px solid var(--line); }
.map-card figcaption p { margin:0; max-width:none; }
.map-card .map-q { font-weight:700; color:var(--navy); font-size:1.05rem; }
.map-card .map-link a { display:inline-block; padding:12px 0; line-height:1.4; font-weight:700; color:var(--blue); }
.map-card .map-attr { font-size:.8rem; color:var(--muted); }
.hero .map-card a { color:var(--blue); }
.hero-map { width:100%; }
@media (min-width:800px) { .hero-grid:has(.hero-map) { grid-template-columns:1fr 1.05fr; gap:44px; } }
.hero-photo .map-card figcaption { display:block; }
/* media kit download (media pages) */
.mediakit .cta-line { margin:4px 0 6px; }
.mk-other { margin:0 0 12px; font-size:.95rem; }
.mk-other a { display:inline-flex; align-items:center; min-height:48px; }
/* ---------- home: shortcuts, read more, layout ---------- */
.hero-cta { margin-top:4px; }
@media (max-width:560px) { .hero .callout .hero-cta { display:flex; width:100%; } }
.shortcuts { background:#fff; border-bottom:1px solid var(--line); }
.shortcuts ul { list-style:none; margin:0; padding:12px 0; display:flex; flex-wrap:wrap; gap:8px; }
.shortcuts li { margin:0; }
.shortcuts a, .faq-index a { display:inline-flex; align-items:center; min-height:48px; padding:0 16px; border:1.5px solid #9fb0c6; border-radius:10px; background:#fff; color:var(--navy); font-weight:700; text-decoration:none; }
.shortcuts a:hover, .faq-index a:hover { background:var(--sky); border-color:var(--navy); }
.home { padding-top:36px; }
.home-foot { padding-bottom:40px; }
.grid-help { display:grid; gap:16px; align-items:start; }
@media (min-width:700px) { .grid-help { grid-template-columns:1fr 1fr; } }
@media (min-width:1024px) { .grid-help { grid-template-columns:repeat(3, 1fr); gap:20px; } .band-sky { padding:48px 0; } }
@media (min-width:900px) { .grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:start; } }
.rm { margin:0 0 6px; }
.rm-toggle { display:inline-flex; align-items:center; gap:6px; min-height:48px; padding:0; border:0; background:none; font:inherit; font-weight:700; color:var(--blue); text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.rm-toggle::after { content:"▾"; text-decoration:none; display:inline-block; }
.rm-toggle[aria-expanded="true"]::after { content:"▴"; }
.rm-toggle:hover { color:var(--navy); }
/* ---------- FAQ: topic index (chips on phones, sticky side list on wide screens) ---------- */
.faq-index { margin:0 0 32px; }
.faq-index-t { margin:0 0 8px; font-size:.85rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); }
.faq-index ul { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.faq-index li { margin:0; }
@media (min-width:1100px) {
  .page-faq .page-head .wrap, .page-faq .content { max-width:1052px; }
  .faq-layout { display:grid; grid-template-columns:minmax(0, 1fr) 220px; gap:32px; align-items:start; }
  .faq-main { grid-column:1; grid-row:1; }
  .faq-index { grid-column:2; grid-row:1; position:sticky; top:24px; margin:0; }
  .faq-index ul { flex-direction:column; gap:2px; }
  .faq-index a { display:flex; min-height:48px; border:0; border-left:3px solid var(--line); border-radius:0; padding:0 12px; font-weight:600; }
  .faq-index a:hover { border-left-color:var(--navy); }
}
/* Priorities <-> scorecard links (scorecard.py) */
.sc-prio-lead { margin:0 0 28px; font-size:1.05rem; }
.sc-prio-lead a, .sc-rel a { display:inline-flex; align-items:center; min-height:48px; font-weight:700; }
.sc-rel { margin:10px 0 0; font-size:.95rem; }
.sc-rel-t { display:block; color:var(--muted); font-weight:600; }
/* "Who controls what? See what the Province actually controls →" (Priorities; the page itself uses province.css) */
.pv-link { margin:0 0 28px; font-size:1.05rem; }
.pv-link a { display:inline-flex; align-items:center; min-height:48px; font-weight:700; }
.sc-how .pv-link { margin:6px 0 0; }
.sc-prio-lead + .pv-link { margin-top:-20px; }

/* two-line lockup (home hero, Priorities and Scorecard heads, Priorities report block) */
.lockup { font-weight:700; font-size:1.02rem; line-height:1.4; margin:0 0 16px; color:#fff; }
.hero .lockup { margin:-10px 0 16px; }
.page-head .lockup { margin:8px 0 0; color:#e3ecf7; }
.content .lockup-block { color:var(--navy); margin:0 0 10px; }
@media (max-width:560px) {
  .hero { padding:20px 0 28px; }
  .hero h1 { font-size:2.1rem; margin:0 0 8px; }
  .hero-sub { font-size:.95rem; margin:0 0 10px; }
  .tagline { font-size:1.2rem; margin:0 0 14px; }
  .hero .lockup { font-size:.95rem; margin:-6px 0 12px; }
  .hero-intro { font-size:.95rem; line-height:1.45; margin:0 0 12px; }
  .hero .callout { padding:12px 14px; }
}

/* ---------- headshot (photo slots + Media; build.py headshot()) ---------- */
.headshot { margin:0; }
.headshot img { display:block; width:100%; height:auto; aspect-ratio:1/1; }
.hero-photo.has-photo .headshot { max-width:260px; margin:0 auto; } /* phones: centred under the Volunteer button */
.hero-photo.has-photo .headshot img { border-radius:var(--radius); border:0; }
@media (min-width:800px) { .hero-photo.has-photo .headshot { max-width:400px; margin-left:auto; } }
.about-photo .headshot { width:200px; margin:0 0 24px; }
.about-photo .headshot img { border-radius:var(--radius); border:1px solid var(--line); }
@media (min-width:800px) { .about-photo { float:right; margin:4px 0 20px 32px; } .about-photo .headshot { width:280px; margin:0; } }
.content .fig.headshot { max-width:400px; margin:14px 0 16px; }

.site-footer .credit { font-size:.8rem; opacity:.8; margin-top:6px; }
.site-footer .credit a { color:inherit; }
.content .headshot-pair { display:grid; grid-template-columns:1fr; gap:16px; max-width:816px; margin:14px 0 16px; }
.content .headshot-pair .fig.headshot { margin:0; max-width:400px; }
@media (min-width:600px) { .content .headshot-pair { grid-template-columns:1fr 1fr; } }

/* ---------- "New" badges (events_cal.py, forms.js) ---------- */
.newb { display:inline-block; vertical-align:middle; background:#b3261e; color:#fff; font-size:.72rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; line-height:1; padding:4px 6px 3px; border-radius:999px; }
.site-nav .nav-new { margin-left:6px; }
.newev { background:#fff4f2; border-bottom:1px solid #f1c9c4; }
.newev p { margin:0; padding:10px 0; font-weight:600; }
.newev .newb { margin-right:6px; }
.newev a { color:var(--navy); }
/* upcoming-event banner (events_cal.home_banner, site.js): "Next event" pill, then the title, New badge, date · place, +N more */
.nextev .nextb { display:inline-block; vertical-align:middle; background:var(--navy); color:#fff; font-size:.72rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; line-height:1; padding:4px 6px 3px; border-radius:999px; margin-right:6px; }
.nextev .newb { margin:0 0 0 2px; }
.nextev .nextev-when { font-weight:500; }
.nextev .newev-more { font-weight:500; white-space:nowrap; }
.evc h3 .newb { margin-left:2px; }

/* ---------- Events: List | Calendar toggle and month view ---------- */
.viewtoggle { display:inline-flex; border:1px solid var(--blue); border-radius:999px; overflow:hidden; margin:0 0 16px; }
.viewtoggle button { font:inherit; font-weight:700; min-height:44px; padding:0 18px; border:0; background:#fff; color:var(--blue); cursor:pointer; }
.viewtoggle button[aria-pressed="true"] { background:var(--blue); color:#fff; }
.viewtoggle button + button { border-left:1px solid var(--blue); }
.calview h2 { margin-top:0; }
.cal-legend { list-style:none; padding:0; margin:0 0 12px; display:flex; flex-wrap:wrap; gap:6px 18px; font-size:.92rem; color:var(--muted); }
.cal-legend li { margin:0; }
.mk { color:var(--navy); }
.it.kd .mk, .mk.kd { color:#8a5a00; }
.it.cev .mk, .mk.cev { color:var(--blue); }
.cal-wrap { overflow-x:auto; }
.mcal { width:100%; border-collapse:collapse; table-layout:fixed; background:#fff; }
.mcal th { font-size:.85rem; font-weight:700; color:var(--muted); padding:6px 4px; text-align:left; border-bottom:2px solid var(--line); }
.mcal th abbr { text-decoration:none; }
.mcal td { vertical-align:top; border:1px solid var(--line); padding:4px 5px 6px; height:104px; }
.mcal td.out { background:var(--bg); }
.mcal td.day.we:not(.has-kd) { background:#fafbfd; } .mcal th.we { color:var(--navy); }  /* Sat/Sun (class set from the date in events_cal.py) */
.mcal td.has-kd { background:#fff8e1; }
.mcal td.today { box-shadow:inset 0 0 0 3px var(--navy); }
.mcal .dn { display:block; font-weight:700; color:var(--navy); text-decoration:none; }
.mcal .dn-link { display:none; }
.mcal .items { list-style:none; margin:2px 0 0; padding:0; }
.mcal .it { margin:0 0 3px; font-size:.78rem; line-height:1.25; max-width:none; }
.mcal .it.kd { font-weight:700; color:#5c3d00; }
.mcal .it.cev a { color:var(--blue); text-decoration:none; display:inline; }
.mcal .it.cev a:hover .tt { text-decoration:underline; }
.mcal .it.cev .tm { font-weight:700; }
.mcal .it.past { opacity:.6; }
.mcal .it .newb { font-size:.6rem; padding:2px 4px 1px; }
.agenda-box { display:none; }
.agenda { list-style:none; padding:0; margin:0; }
.ag-day { margin:0 0 10px; padding:8px 12px; background:#fff; border:1px solid var(--line); border-radius:10px; max-width:none; scroll-margin-top:90px; }
.ag-day:target { box-shadow:0 0 0 3px var(--navy); }
.ag-d { margin:0 0 4px; font-weight:700; color:var(--navy); }
.ag-day ul { list-style:none; padding:0; margin:0; }
.ag-day li { margin:0 0 4px; }
.ag-day .it.past { opacity:.6; }
.keydates-cal { margin-top:20px; }
.kd-list { list-style:none; padding:0; margin:0; }
.kd-list li { margin:0 0 12px; padding:0 0 12px; border-bottom:1px solid var(--line); max-width:none; }
.kd-list p { margin:0; }
.kd-when { font-weight:700; color:var(--navy); }
.kd-src { font-size:.9rem; color:var(--muted); }
@media (max-width:699px) {
  /* phones: compact month overview (day number + markers), the day's items listed below (tap a marked day to jump there) */
  .mcal td { height:auto; min-height:52px; padding:3px 2px 5px; text-align:center; }
  .mcal th { text-align:center; font-size:.75rem; padding:4px 0; }
  .mcal td.has-kd .dn-txt, .mcal td.has-ev .dn-txt { display:none; }
  .mcal .dn-link { display:flex; align-items:center; justify-content:center; min-height:30px; text-decoration:underline; text-underline-offset:3px; }
  .mcal .items { display:flex; flex-wrap:wrap; justify-content:center; gap:1px 3px; }
  .mcal .it { font-size:.7rem; margin:0; }
  .mcal .it .tx, .mcal .it a, .mcal .it.cev a { display:none; }
  .mcal .it .mk { font-size:.8rem; }
  .agenda-box { display:block; margin-top:16px; }
}
/* warmer /volunteer/ (site.json volunteer_warm_live; staging until approved): welcome note with a small headshot, reassurance,
   next door-knocking outing (forms.js, hidden if none), "we'll call you" line by the button, lawn sign link below the form */
.vwelcome { margin-bottom:8px; }
.vw-in { display:flex; gap:18px; align-items:center; }
.vwelcome .headshot { flex:0 0 112px; margin:0; }
.vwelcome .headshot img { width:112px; height:112px; border-radius:50%; object-fit:cover; object-position:50% 18%; display:block; }
.vw-note { margin:0; padding:0; border:0; font-size:1.2rem; line-height:1.45; font-weight:600; }
.vw-note p { margin:0 0 6px; }
.vw-note footer { font-weight:400; color:var(--muted); font-size:1rem; }
@media (max-width:560px) { .vw-in { flex-direction:column; text-align:center; gap:12px; } .vw-note { font-size:1.1rem; } }
.draft-tag { display:inline-block; margin:0 0 12px; padding:3px 10px; border:2px dashed #b25a00; border-radius:6px; color:#8a4500; font-size:.85rem; font-weight:700; }
@media (max-width:560px) { .vwelcome { text-align:center; } }
.vreassure { font-weight:700; }
.vnext a { font-weight:700; }
.form .vchecks .cb { margin:6px 0; }
.vcall { margin:20px 0 10px; font-weight:700; }
.vlawn h2 { font-size:1.2rem; margin-bottom:4px; }

/* ---------- Victoria photos (site.json victoria_photos; staging only until victoria_photos_live) ---------- */
/* width/height on every <img> + aspect-ratio here: the space is reserved before the image loads (no layout shift) */
.vstrip { margin:0 0 16px; }
.vstrip img { display:block; width:100%; height:auto; aspect-ratio:3 / 1; object-fit:cover; border-radius:10px; background:var(--sky); }
.vstrip-vol { margin:0 0 28px; }
.vband { background:#fff; border-bottom:1px solid var(--line); padding:16px 0 4px; }
.vband ul { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; max-width:760px; }
.vband li { margin:0; min-width:0; }
.vband li a { display:block; color:var(--navy); font-weight:700; text-decoration:none; }
.vband img { display:block; width:100%; height:auto; aspect-ratio:4 / 3; object-fit:cover; border-radius:10px; background:var(--sky); }
.vband-l { display:flex; align-items:center; min-height:40px; font-size:.95rem; line-height:1.2; }
.vband li a:hover .vband-l { text-decoration:underline; }
.vband-map { margin:0; }
.vband li.vband-d { display:none; }  /* desktop-only tiles (victoria_photos.home_desktop); their <picture> loads a data: GIF below 768px */
@media (min-width:768px) { .vband ul.six { grid-template-columns:repeat(6, 1fr); max-width:none; } .vband li.vband-d { display:block; } }
.vband-map a { display:inline-block; padding:12px 0; line-height:1.4; font-weight:700; color:var(--blue); }
.evc-ph { flex:0 0 80px; }
.evc-ph img { display:block; width:80px; height:80px; object-fit:cover; border-radius:8px; background:var(--sky); }
.evc.past .evc-ph { display:none; }

/* social links grouped: Campaign / Personal (2 Oct 2026) */
.vh { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.soc-row { display:flex; flex-wrap:wrap; align-items:center; column-gap:12px; }
.soc-row .social { margin:4px 0 8px; }
.soc-glabel { font-weight:700; min-width:5.5em; }
.site-footer .soc-glabel { color:#fff; }

/* Volunteer shifts (migration 48; staging until site.json volunteer_shifts_live). Own colour (green) AND own shape (■)
   and a text tag, so colour is never the only cue. #1d6b3a on white: 6.6:1. */
:root { --shift:#1d6b3a; --shift-bg:#e9f4ed; }
.evfilter { display:inline-flex; flex-wrap:wrap; align-items:center; gap:0; border:1px solid var(--shift); border-radius:999px; overflow:hidden; margin:0 0 16px 12px; vertical-align:top; }
.evfilter-l { padding:0 10px 0 14px; font-weight:700; color:var(--shift); font-size:.92rem; }
.evfilter button { font:inherit; font-weight:700; min-height:44px; padding:0 14px; border:0; border-left:1px solid var(--shift); background:#fff; color:var(--shift); cursor:pointer; }
.evfilter button[aria-pressed="true"] { background:var(--shift); color:#fff; }
.evfilter button[aria-pressed="true"] .mk { color:#fff; }
.mk.sev, .it.sev .mk { color:var(--shift); }
.evc.shift { border-left:4px solid var(--shift); background:var(--shift-bg); }
.evc.shift .dtile, .shifthead .dtile { background:var(--shift); border-color:var(--shift); color:#fff; }
.evc.shift .dtile *, .shifthead .dtile * { color:#fff; }
.shtag { margin:0 0 2px; font-size:.8rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--shift); }
.shtag .mk { color:var(--shift); }
.mcal .it.cev.sev a { color:var(--shift); }
.mcal td.has-sev { box-shadow:inset 0 -3px 0 var(--shift); }
.agenda .it.sev a { color:var(--shift); }
.shiftlead { font-weight:600; }
.shiftform { border-top:4px solid var(--shift); }
.shiftform .hint { margin:4px 0 4px; font-size:.9rem; color:var(--muted); }
@media (max-width: 699px) {
  .evfilter { margin:0 0 16px; display:flex; border-radius:12px; }
  .evfilter-l { flex-basis:100%; padding:8px 14px 4px; }
  .evfilter button { flex:1 1 0; border-top:1px solid var(--shift); padding:0 8px; }
  .evfilter button:first-of-type { border-left:0; }
}

/* Past events (4 Oct 2026, migration 49): kept on the Events page, greyed and struck through so they read as done.
   Key dates (.it.kd) never get .past. The Past label (.pastb) is never struck through. */
.pastb { display:inline-block; font-size:.75rem; font-weight:700; letter-spacing:.03em; text-transform:uppercase; color:#4a4f57; background:#e6e8eb; border-radius:4px; padding:.05em .45em; text-decoration:none; vertical-align:.1em; }
.evc.past h3 a, .evc.past .evc-when .tr { text-decoration:line-through; color:#5f6670; }
.evc.past .shtag { color:#5f6670; }
.evc.past .shtag .mk { color:#5f6670; }
.mcal .it.cev.past a, .ag-day .it.cev.past a { color:#5f6670; }
.mcal .it.cev.past .tm, .mcal .it.cev.past .tt, .ag-day .it.cev.past .tt { text-decoration:line-through; }
.mcal .it.cev.past .mk, .ag-day .it.cev.past .mk { color:#8a9099; }
.evpast { margin-top:1.75rem; border-top:1px solid #d9dde2; padding-top:1rem; }
.evpast > summary { cursor:pointer; font-weight:700; color:#3b4250; padding:.35rem 0; }
.evpast > summary:focus-visible { outline:3px solid #f2b705; outline-offset:2px; }
.evpast .evlist { margin-top:.75rem; }
.evc.past, .mcal .it.past, .ag-day .it.past { opacity:1; }  /* grey text (#5f6670, 5.9:1) instead of fading: stays readable */
.evc.past .dtile, .evc.shift.past .dtile { background:#f1f2f4; border-color:#d9dde2; color:#5f6670; }

/* ---------- Updates / Nouvelles (updates.py; only rendered when data/updates.json has entries) ----------
   Home: cards for the latest 3-4 entries (first photo, or a navy text card for text-only posts); phones swipe (scroll-snap),
   from 800px one row. /updates/ and permalinks: a 720px reading column; photo layouts .upd-photos.n1-n4 (README "Updates"). */
.updates ul, .updates li { max-width:none; }
.upd-strip { overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; margin:0 -18px; padding:2px 18px 8px; scroll-padding:0 18px; -webkit-overflow-scrolling:touch; }
.upd-strip:focus-visible { outline-offset:-3px; }
.upd-list { list-style:none; margin:0; padding:0; display:grid; grid-auto-flow:column; grid-auto-columns:72%; gap:14px; align-items:stretch; }
.upd-list.n1 { grid-auto-columns:80%; }
.upd-card { position:relative; /* keeps the visually-hidden .vh spans inside the scroll strip (no sideways page scroll on phones) */ margin:0; min-width:0; scroll-snap-align:start; display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.upd-media { position:relative; }
.upd-media img, .upd-photos img { display:block; width:100%; height:auto; aspect-ratio:4 / 3; object-fit:cover; background:var(--sky); }
.upd-more { position:absolute; right:8px; bottom:8px; padding:2px 9px; border-radius:999px; background:rgba(18,58,109,.88); color:#fff; font-size:.85rem; font-weight:700; }
.upd-cb { display:flex; flex-direction:column; flex:1; padding:12px 14px 2px; }
.upd-m { margin:0 0 4px; color:var(--muted); font-size:.88rem; font-weight:600; }
.upd-card .upd-t { margin:0 0 6px; color:var(--navy); font-size:1.08rem; line-height:1.3; }
.upd-ex { margin:0 0 4px; font-size:.95rem; line-height:1.5; color:var(--ink); }
.upd-card .readlink { margin:auto 0 0; }
.upd-textcard.upd-card { background:var(--navy); border-color:var(--navy); border-top:5px solid var(--yellow); }
.upd-textcard.upd-card .upd-cb { padding:18px 18px 4px; }
.upd-textcard .upd-m { color:#c9d7ea; }
.upd-textcard.upd-card .upd-t { color:#fff; font-size:1.25rem; }
.upd-textcard .upd-ex { color:#fff; font-size:1rem; }
.upd-textcard a { color:#fff; }
.upd-textcard a:hover { color:var(--yellow); }
.upd-textcard :focus-visible { outline-color:var(--yellow); }
@media (min-width:800px) {
  .upd-strip { overflow:visible; margin:0; padding:0; }
  .upd-list { grid-auto-flow:row; grid-auto-columns:auto; gap:16px; }
  .upd-list.n1 { grid-template-columns:minmax(0, 1fr); max-width:360px; } .upd-list.n2 { grid-template-columns:repeat(2, minmax(0, 1fr)); max-width:600px; }
  .upd-list.n3 { grid-template-columns:repeat(3, minmax(0, 1fr)); max-width:840px; } .upd-list.n4 { grid-template-columns:repeat(4, minmax(0, 1fr)); }
}
.updates .pagelink { margin:10px 0 0; }
.upd-follow { margin-top:14px; padding-top:16px; border-top:1px solid var(--line); }
.upd-follow h3 { margin:0 0 4px; font-size:1.05rem; }
.upd-follow .social { margin:6px 0 0; }
.upd-follow .social a { background:var(--sky); color:var(--navy); border:1.5px solid #bcd0e8; }
.upd-follow .social a:hover { background:#dde9f6; }
/* reading column: /updates/ feed and permalink pages */
.updates-all, .updates-one { max-width:720px; }
.upd-intro { color:var(--muted); font-size:1.05rem; margin:0 0 8px; }
.upd-entry { margin:0; padding:28px 0 30px; border-bottom:1px solid var(--line); }
.upd-entry h2 { margin:0 0 10px; font-size:1.55rem; line-height:1.25; letter-spacing:-.01em; }
.upd-entry h2 a { color:var(--navy); text-decoration:none; }
.upd-entry h2 a:hover { text-decoration:underline; text-decoration-thickness:2px; }
.upd-body { font-size:1.12rem; line-height:1.65; margin:0 0 16px; max-width:none; }
.upd-entry .upd-m { font-size:.92rem; margin-bottom:6px; }
.upd-entry.upd-textcard { background:var(--navy); color:#fff; border:0; border-left:6px solid var(--yellow); border-radius:12px; padding:22px 22px 8px; margin:24px 0; }
.upd-entry.upd-textcard h2 a { color:#fff; }
.upd-entry.upd-textcard .upd-body { color:#fff; }
.upd-entry.upd-textcard .btn.sec { background:transparent; color:#fff; border-color:#fff; }
.upd-entry.upd-textcard .btn.sec:hover { background:rgba(255,255,255,.12); }
.upd-single { padding-top:4px; border-bottom:0; }
.upd-single.upd-textcard { margin-top:4px; }
.upd-single .upd-body { font-size:1.18rem; }
.upd-photos { list-style:none; margin:0 0 16px; padding:0; display:grid; gap:8px; }
.upd-photos li { margin:0; min-width:0; }
.upd-photos img { border-radius:8px; }
.upd-photos.n2, .upd-photos.n4 { grid-template-columns:1fr 1fr; }
.upd-photos.n3 { grid-template-columns:1fr 1fr; }
.upd-photos.n3 li:first-child { grid-column:1 / -1; }
@media (min-width:600px) {
  .upd-photos.n3 { grid-template-columns:2fr 1fr; grid-template-rows:auto auto; }
  .upd-photos.n3 li:first-child { grid-column:1; grid-row:1 / span 2; }
  .upd-photos.n3 li:first-child picture { display:block; height:100%; }
  .upd-photos.n3 li:first-child img { height:100%; aspect-ratio:auto; }
}
.upd-links { list-style:none; margin:0 0 6px; padding:0; display:flex; flex-wrap:wrap; gap:10px; }
.upd-links li { margin:0; }
.upd-back { margin:0 0 4px; }
.upd-back a { display:inline-flex; align-items:center; min-height:48px; font-weight:700; }
.upd-kicker { margin:0 0 6px; font-size:.9rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.upd-kicker a { color:#fff; text-decoration:none; display:inline-flex; align-items:center; min-height:44px; }
.upd-kicker a:hover { color:var(--yellow); text-decoration:underline; }
.upd-allbottom { margin-top:18px !important; }
.upd-rss { margin:16px 0 0; font-size:.92rem; }