/* City of Bruceville-Eddy — demo redesign. Royal Empire Multimedia, Sept 2026.
   Palette: civic navy + cream + gold, inspired by a Texas municipal seal/ledger,
   NOT the Landforce palette. System fonts only (host CSP: font-src 'self').
   No external images/CDNs; SVG icons inline. Grid: 12 col, 1180px max. */

:root{
  --bg:#f6f4ee;
  --bg-panel:#efece2;
  --paper:#ffffff;
  --ink:#1c2733;
  --body:#485363;
  /* Measured 4.28:1 on this palette's lightest background — just under the
     4.5:1 minimum, and this token is used 15 times site-wide for body-weight
     secondary text. Darkened once at the source. */
  --muted:#626a79;
  --line:rgba(20,32,48,.12);
  --line-strong:rgba(20,32,48,.22);
  --navy:#173456;
  --navy-700:#0e253e;
  --navy-tint:rgba(23,52,86,.08);
  --gold:#b9852f;
  /* Measured 4.4:1 on this palette's lightest background (#f6f4ee) — just
     under the 4.5:1 small-text minimum, and this token drives eyebrows, role
     labels and tags across the site, all small text. Darkened once here
     rather than patched per-use; 5.2:1+ on every background it's used on. */
  --gold-700:#875e1b;
  --gold-tint:rgba(185,133,47,.14);
  --red:#a3312a;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --shadow:0 1px 2px rgba(20,32,48,.06),0 10px 26px rgba(20,32,48,.08);
  --shadow-hover:0 4px 10px rgba(20,32,48,.08),0 18px 40px rgba(20,32,48,.12);
  --radius:6px;
  --radius-sm:4px;
  --max:1180px;
  --gutter:28px;
  --gap:22px;
  --pad:24px;
  --section:88px;
  --btn-h:46px;
  /* Glass — frosted-panel system used across Royal Empire's other builds:
     translucent white over imagery, a soft blur, a thin light edge. */
  --glass:rgba(255,255,255,.7);
  --glass-strong:rgba(255,255,255,.86);
  --blur:blur(18px) saturate(150%);
}
@media (max-width:900px){:root{--section:56px;--gutter:20px}}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:var(--font);font-size:17px;line-height:1.6;color:var(--body);-webkit-font-smoothing:antialiased;background:var(--bg)}
img{max-width:100%;height:auto;display:block}
a{color:var(--navy);text-underline-offset:3px}
a:hover{color:var(--gold-700)}
h1,h2,h3,h4{margin:0 0 .5em;color:var(--ink);font-weight:700;line-height:1.11;letter-spacing:-.035em;text-wrap:balance}
h1{font-size:36px}
h2{font-size:32px;max-width:24ch;line-height:1.06}
h3{font-size:24px;line-height:1.17}
h4{font-size:16px;line-height:1.3}
@media (max-width:1024px){h1{font-size:32px}h2{font-size:28px}}
@media (max-width:640px){h1{font-size:28px}h2{font-size:24px}h3{font-size:20px}}
p{margin:0 0 1em;max-width:66ch}
p:last-child{margin-bottom:0}
ul,ol{padding-left:1.2em;margin:0 0 1em;max-width:66ch}
ul:last-child,ol:last-child{margin-bottom:0}
li{margin-bottom:.4em}
strong{font-weight:700;color:var(--ink)}
small,.small{font-size:14px}
hr{border:0;border-top:1px solid var(--line);margin:36px 0}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:4px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:absolute;left:12px;top:-60px;background:var(--navy);color:#fff;padding:12px 16px;border-radius:8px;z-index:1000;font-weight:700;text-decoration:none}
.skip-link:focus{top:12px}

.container{width:min(var(--max),100% - 2*var(--gutter));margin-inline:auto}
.narrow{max-width:740px}
.section{padding:var(--section) 0}
.section-tight{padding:calc(var(--section)/2) 0}
.section-alt{background:var(--bg-panel)}
.center{text-align:center}
.center h2,.center .lead,.center p{margin-inline:auto}
.eyebrow{display:block;font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-700);margin-bottom:14px}
.eyebrow .dot{display:inline-block;vertical-align:middle;width:7px;height:7px;border-radius:50%;background:var(--gold);margin-right:8px;position:relative;top:-1px}
.center .eyebrow{justify-content:center}
.h2-highlight{display:inline;background:var(--gold);color:#000;padding:4px 10px;line-height:1.45;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.lead{font-size:19px;line-height:1.55;color:var(--body);max-width:60ch;margin:14px 0 0}
.section-head{margin-bottom:36px}
.section-head h2{margin-bottom:0}
.section-head .lead{margin-top:14px}
.section-head-row{display:flex;justify-content:flex-start;align-items:flex-end;gap:30px;flex-wrap:wrap}
.section-head-row h2{margin:0}
.h2-rule{padding-bottom:16px;border-bottom:4px solid var(--gold);margin-bottom:28px;display:block;max-width:none}
.text-link{font-weight:700;color:var(--navy);text-decoration:none;display:inline-flex;align-items:center;gap:6px;font-size:16px;border-bottom:2px solid transparent;transition:color .15s,border-color .15s}
.text-link:hover{color:var(--gold-700);border-bottom-color:var(--gold)}
.arrow{display:inline-block;transition:transform .15s}
a:hover .arrow{transform:translateX(3px)}
.muted{color:var(--muted)}
.note{font-size:14.5px;color:var(--muted);line-height:1.55}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--btn-h);padding:0 22px;border-radius:2px;font-weight:700;text-decoration:none;border:1px solid transparent;cursor:pointer;font-size:16px;line-height:1.2;font-family:inherit;white-space:nowrap;transition:transform .15s ease,background .15s ease,color .15s ease,border-color .15s ease,box-shadow .15s ease}
.btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.12)}
.btn-primary{background:var(--gold);color:#211505;border-color:var(--gold)}
.btn-primary:hover{background:var(--gold-700);border-color:var(--gold-700);color:#fff}
.btn-navy{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn-navy:hover{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
.btn-outline{background:#fff;color:var(--ink);border-color:var(--line-strong)}
.btn-outline:hover{background:var(--bg-panel);color:var(--ink);border-color:var(--ink)}
.btn-ghost-light{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.5)}
.btn-ghost-light:hover{background:rgba(255,255,255,.22);color:#fff;border-color:#fff}
.btn-lg{padding:0 26px;min-height:52px;font-size:16.5px}
.btn-sm{min-height:38px;padding:0 16px;font-size:14px}
.btn-block{width:100%}
.btn-row{display:flex;flex-wrap:wrap;gap:12px 14px;align-items:center;margin-top:28px}
.section-head .btn-row{margin-top:20px}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}
.topbar{background:var(--navy-700);color:#dbe3ee;font-size:13.5px}
.topbar .container{display:flex;justify-content:space-between;align-items:center;min-height:36px;gap:12px;flex-wrap:wrap;padding-top:6px;padding-bottom:6px}
.topbar a{color:#eef2f7;text-decoration:none}
.topbar a:hover{color:#fff;text-decoration:underline}
.topbar-links{display:flex;gap:18px;flex-wrap:wrap}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:78px}
.brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.brand img{width:44px;height:44px;flex:none}
.brand .word{line-height:1.15}
.brand .word b{display:block;font-weight:800;font-size:16.5px;letter-spacing:-.01em;color:var(--ink)}
.brand .word span{display:block;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600}
.nav-primary{display:flex;align-items:center;gap:4px}
.nav-list{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:2px}
.nav-primary a{color:var(--ink);text-decoration:none;font-weight:600;padding:10px 13px;border-radius:4px;font-size:15px;white-space:nowrap;border-bottom:3px solid transparent;transition:background .15s,color .15s,border-color .15s}
.nav-primary a:hover{background:var(--navy-tint);color:var(--navy);border-bottom-color:var(--gold)}
.nav-primary a[aria-current="page"]{color:var(--navy);background:var(--navy-tint);border-bottom-color:var(--gold)}
.nav-primary .btn{margin-left:10px;color:#fff}
.nav-primary .btn:hover{color:#fff}
.nav-toggle{display:none;background:#fff;border:1px solid var(--line-strong);border-radius:2px;min-height:42px;padding:0 14px;font:inherit;font-size:15px;font-weight:700;color:var(--ink);cursor:pointer;align-items:center;gap:9px}
.nav-toggle .bars{display:inline-block;width:17px;height:2px;background:currentColor;position:relative}
.nav-toggle .bars::before,.nav-toggle .bars::after{content:"";position:absolute;left:0;width:17px;height:2px;background:currentColor}
.nav-toggle .bars::before{top:-6px}.nav-toggle .bars::after{top:6px}
@media (max-width:980px){.nav-primary{display:none}.nav-toggle{display:inline-flex}.topbar-links{gap:12px}}

.nav-drawer{position:fixed;inset:0;z-index:100;display:none}
.nav-drawer.is-open{display:block}
.nav-drawer .scrim{position:absolute;inset:0;background:rgba(14,25,40,.45)}
.nav-drawer .panel{position:absolute;top:0;right:0;height:100%;width:min(340px,86vw);background:#fff;padding:18px 22px 28px;overflow:auto;box-shadow:var(--shadow-hover);display:flex;flex-direction:column;gap:2px}
.drawer-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.drawer-head b{font-weight:800;color:var(--ink)}
.drawer-close{background:var(--bg-panel);border:0;border-radius:2px;min-height:40px;padding:0 14px;font:inherit;font-weight:700;cursor:pointer;color:var(--ink)}
.nav-drawer a{display:block;padding:13px 6px;border-radius:4px;text-decoration:none;color:var(--ink);font-weight:700;font-size:17px;border-bottom:1px solid var(--line)}
.nav-drawer a[aria-current="page"]{color:var(--navy);background:var(--navy-tint)}
.nav-drawer .btn{margin-top:14px;text-align:center}
.drawer-meta{margin-top:auto;padding-top:20px;font-size:14px;color:var(--muted)}

/* ---------- Alert banner (Alert Center demo module) ---------- */
.alert-banner{background:#7a2420;color:#fff;font-size:15px}
.alert-banner .container{display:flex;align-items:center;gap:12px;padding:11px 0;flex-wrap:wrap}
.alert-banner strong{color:#fff}
.alert-banner .ico{flex:none;width:20px;height:20px}
.alert-banner a{color:#ffe8c2;font-weight:700}
.alert-banner[hidden]{display:none}
/* Lives INSIDE the topbar (real flex child, not fixed/floating), so the
   collapsed launcher scrolls and sticks exactly with the header and can never
   drift over page content. Only the opened dropdown (explicit user action)
   overlays anything, like any ordinary header menu. */
.topbar-right{display:flex;align-items:center;gap:14px;flex:none}
.demo-controls{position:relative;flex:none;font-size:13.5px}
.demo-controls summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;white-space:nowrap;width:26px;height:26px;padding:0;border-radius:50%;background:rgba(255,255,255,.14);color:#e9c988}
.demo-controls summary::-webkit-details-marker{display:none}
.demo-controls summary .sw{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;flex:none}
.demo-controls summary .sw svg{width:14px;height:14px}
.demo-controls summary .label{display:none}
.demo-controls .body{position:absolute;top:calc(100% + 10px);right:0;margin-top:0;width:min(280px,calc(100vw - 32px));background:#fff;color:var(--muted);line-height:1.5;border:1px solid var(--line-strong);border-radius:6px;box-shadow:var(--shadow-hover);padding:14px;font-size:13.5px;z-index:90}
.demo-controls:not([open]) .body{display:none}
.demo-controls .row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px}
.demo-controls button{font:inherit;font-size:13px;font-weight:700;border:1px solid var(--line-strong);background:var(--bg-panel);color:var(--ink);border-radius:2px;padding:6px 12px;cursor:pointer}
.demo-controls button:hover{background:#fff;border-color:var(--ink)}
@media (max-width:640px){
  .topbar-links{display:none}
  .topbar .container{flex-wrap:nowrap;gap:10px}
  .topbar .container>span:first-child{font-size:12.5px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

/* ---------- Demo disclosure ribbon ---------- */
.demo-ribbon{background:var(--gold-tint);border-bottom:1px solid var(--line)}
.demo-ribbon .container{padding:9px 0;font-size:13.5px;color:var(--navy-700);display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.demo-ribbon strong{color:var(--navy-700)}

/* ---------- Hero (light theme — navy stays a small accent only) ---------- */
.hero{position:relative;height:600px;color:#fff;overflow:hidden}
.hero-media{position:absolute;inset:0;z-index:0}
.hero-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.03);animation:kenburns 14s ease-out both}
.hero-slider img{position:absolute;inset:0;opacity:0;transition:opacity 1.1s ease;animation:none}
.hero-slider img.is-active{opacity:1;animation:kenburns 9s ease-out both}
.hero-ctl{position:absolute;right:clamp(16px,3vw,40px);top:22px;z-index:4;display:flex;align-items:center;gap:10px}
.hero-arrow{width:40px;height:40px;border:1px solid rgba(255,255,255,.55);background:rgba(0,0,0,.35);color:#fff;font:700 26px/1 inherit;border-radius:2px;cursor:pointer;display:grid;place-items:center;transition:background .15s,color .15s,border-color .15s}
.hero-arrow:hover,.hero-arrow:focus-visible{background:var(--gold);color:#000;border-color:var(--gold)}
.hero-dots{display:flex;gap:8px}
.hero-dots button{width:26px;height:6px;border:0;border-radius:2px;background:rgba(255,255,255,.5);cursor:pointer;padding:0;transition:background .15s,transform .15s}
.hero-dots button:hover{background:#fff}
.hero-dots button.is-active{background:var(--gold);transform:scaleY(1.4)}
@media (max-width:640px){.hero-ctl{right:12px;top:12px}.hero-arrow{width:34px;height:34px;font-size:22px}.hero-dots button{width:18px}}
@keyframes kenburns{from{transform:scale(1.12)}to{transform:scale(1.03)}}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(14,37,62,.72) 0%,rgba(14,37,62,.32) 46%,rgba(14,37,62,.06) 68%)}
.hero-inner{position:relative;z-index:1;height:100%;padding:0}
.hero-grid{display:block;height:100%}
.hero-copy{position:absolute;left:0;bottom:100px;max-width:520px;padding:32px 36px;border-radius:6px;background:var(--glass);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border:1px solid rgba(255,255,255,.55);box-shadow:0 26px 56px -20px rgba(9,20,34,.5)}
.hero-copy .eyebrow{color:#1a1a1a;font-size:14px;letter-spacing:.08em}
.hero-copy .eyebrow .dot{background:var(--gold)}
.hero-copy h1{color:var(--navy-700);font-size:36px;line-height:1.11;letter-spacing:-.035em}
.hero-copy .lead{color:#2c3845;max-width:48ch}
.hero-photo{display:none}
.hero-seal{position:absolute;right:44px;bottom:44px;z-index:2;display:flex}
.hero-seal img{width:76px;height:76px;border-radius:50%;box-shadow:0 8px 22px rgba(0,0,0,.35);background:#fff;padding:6px;border:1px solid rgba(255,255,255,.6)}
@media (prefers-reduced-motion:no-preference){
  .hero-media img{animation:be-hero-settle 1.4s cubic-bezier(.2,.7,.2,1) forwards}
  .hero-copy>*{opacity:0;transform:translateY(14px);animation:be-hero-rise .7s cubic-bezier(.2,.7,.2,1) forwards}
  .hero-copy .eyebrow{animation-delay:.1s}
  .hero-copy h1{animation-delay:.2s}
  .hero-copy .lead{animation-delay:.32s}
  .hero-copy .btn-row{animation-delay:.44s}
}
@keyframes be-hero-settle{from{transform:scale(1.03)}to{transform:scale(1)}}
@keyframes be-hero-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@media (max-width:900px){
  .hero{height:auto;min-height:560px}
  .hero-copy{position:static;max-width:none;margin:0 var(--gutter);bottom:auto;background:var(--glass-strong);padding:28px 24px}
  .hero-seal{display:none}
}
@media (max-width:900px){
  .hero-inner{padding:40px 0 84px}
  .hero-grid{grid-template-columns:1fr;gap:24px;text-align:center}
  .hero-copy,.hero-photo{grid-column:auto;max-width:none}
  .hero-copy .lead{margin-inline:auto}
  .hero-copy h1{font-size:30px}
  .hero-photo{order:0;margin-top:4px}
  .hero .btn-row{flex-direction:column;align-items:stretch;gap:10px}
  .hero .btn-row .btn{width:100%;min-height:50px}
  .hero-photo>img{aspect-ratio:4/3;min-height:0}
  .hero-seal{display:none}
  .btn-row{justify-content:center}
}

/* Quick-link strip overlapping hero */
.quick-strip{position:relative;z-index:3;margin-top:-64px}
.quick-cards{list-style:none;margin:0;padding:0;display:flex;background:var(--glass-strong);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border:1px solid rgba(255,255,255,.6);border-radius:var(--radius);box-shadow:0 20px 44px -18px rgba(9,20,34,.3);overflow:hidden;max-width:none}
.quick-card{margin:0;flex:1 1 0;position:relative}
.quick-card:not(:last-child)::after{content:"";position:absolute;top:16px;bottom:16px;right:0;width:1px;background:var(--line)}
.quick-card a{display:flex;align-items:center;gap:16px;padding:22px 18px;text-decoration:none;color:var(--ink);height:100%;transition:background .15s,border-color .15s,transform .15s,box-shadow .15s;border-bottom:4px solid transparent}
.quick-card a:hover,.quick-card a:focus-visible{background:var(--gold);color:#000;border-bottom-color:#000;transform:translateY(-3px);box-shadow:0 12px 24px -10px rgba(0,0,0,.35)}
.quick-card a:hover h3,.quick-card a:focus-visible h3{color:#000}
.quick-card a:hover p,.quick-card a:focus-visible p{color:rgba(0,0,0,.72)}
.quick-card a:hover .quick-thumb-well,.quick-card a:focus-visible .quick-thumb-well{background:#fff;box-shadow:0 4px 12px rgba(0,0,0,.18)}
.quick-card .chip{width:42px;height:42px;border-radius:50%;background:var(--navy-tint);color:var(--navy);display:grid;place-items:center;flex:none}
.quick-card .chip svg{width:20px;height:20px}
.quick-thumb-well{flex:none;width:68px;height:68px;border-radius:16px;background:#eef1f4;display:grid;place-items:center;overflow:hidden}
.quick-thumb{width:60px;height:60px;object-fit:cover;border-radius:12px;box-shadow:none}
.quick-card h3{font-size:15px;margin:0}
.quick-card p{font-size:12.5px;color:var(--muted);margin:0;line-height:1.3}
@media (max-width:900px){
  .quick-cards{flex-direction:column;border-radius:6px}
  .quick-card:not(:last-child)::after{top:auto;bottom:0;left:18px;right:18px;height:1px;width:auto}
  .quick-card a{padding:16px;min-height:76px;gap:16px}
  .quick-thumb-well{width:56px;height:56px}
  .quick-thumb{width:48px;height:48px}
}

/* ---------- Cards / grid ---------- */
.grid{display:grid;gap:var(--gap)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.grid>*{min-width:0}
@media (max-width:980px){.grid-4,.grid-3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}

.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--pad);display:flex;flex-direction:column;gap:10px;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);border-color:var(--gold)}
.card>*{margin:0}
.card p,.card ul{color:var(--body);font-size:15.5px;max-width:none}
.card .icon{width:44px;height:44px;border-radius:50%;background:var(--navy-tint);color:var(--navy);display:grid;place-items:center;flex:none}
.card .icon svg{width:21px;height:21px}
.card .btn,.card .text-link{margin-top:auto;align-self:flex-start}
.card h3{font-size:20px}
.card .tag{display:inline-block;font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-700);background:var(--gold-tint);padding:4px 10px;border-radius:2px;align-self:flex-start}

/* 12-column split */
.feature{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gutter);align-items:start}
.feature>.feature-copy{grid-column:span 6;min-width:0}
.feature>.feature-aside{grid-column:span 6;min-width:0}
.feature.reverse>.feature-aside{order:-1}
@media (max-width:900px){.feature{grid-template-columns:1fr;gap:28px}.feature>.feature-copy,.feature>.feature-aside{grid-column:auto}.feature.reverse>.feature-aside{order:0}}

/* ---------- Page hero (inner pages, light theme — navy stays a small accent only) ---------- */
.page-hero{background:var(--bg);border-bottom:1px solid var(--line);color:var(--ink);padding:52px 0 56px;position:relative;overflow:hidden}
.page-hero .container{position:relative}
.breadcrumb{display:block;font-size:13.5px;margin-bottom:16px;color:var(--muted)}
.breadcrumb a{color:var(--muted);text-decoration:none}
.breadcrumb a:hover{color:var(--navy);text-decoration:underline}
.breadcrumb [aria-current]{color:var(--ink);font-weight:700}
.page-hero h1{color:var(--ink);font-size:36px;max-width:22ch;letter-spacing:-.035em}
.page-hero .lead{color:var(--body);max-width:62ch}
.page-hero .eyebrow{color:var(--gold-700)}
.page-hero .eyebrow .dot{background:var(--gold)}
@media (max-width:640px){.page-hero{padding:36px 0 52px}.page-hero h1{font-size:28px}}

/* ---------- Facts / info blocks ---------- */
.fact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.fact{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
.fact .label{display:block;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.fact .value{font-size:17px;font-weight:700;color:var(--ink);line-height:1.4}
.fact .value a{color:var(--navy)}
@media (max-width:900px){.fact-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.fact-grid{grid-template-columns:1fr}}

/* ---------- Directory / staff table ---------- */
.people-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--gap)}
.person{background:#fff;border:1px solid var(--line);border-top:3px solid transparent;border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);display:flex;gap:14px;align-items:flex-start;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.person:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);border-top-color:var(--gold)}
.person .mono{flex:none;width:46px;height:46px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-weight:800;font-size:15px}
.person h3{font-size:16px;margin-bottom:2px}
.person .role{font-size:13.5px;color:var(--gold-700);font-weight:700;margin-bottom:6px}
.person .meta{font-size:14px;color:var(--muted)}
.person .meta a{color:var(--body)}
@media (max-width:700px){.people-grid{grid-template-columns:1fr}}

table.data-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
table.data-table th,table.data-table td{padding:13px 16px;text-align:left;font-size:15px;border-bottom:1px solid var(--line)}
table.data-table th{background:var(--bg-panel);font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:800}
table.data-table tr:last-child td{border-bottom:0}
.table-wrap{overflow-x:auto;border-radius:var(--radius);box-shadow:var(--shadow)}
.table-wrap table.data-table{box-shadow:none;border-radius:0}

/* ---------- Agenda / bid list items ---------- */
.record-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px;max-width:none}
.record{background:#fff;border:1px solid var(--line);border-left:3px solid transparent;border-radius:var(--radius);box-shadow:var(--shadow);padding:18px 22px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.record:hover{transform:translateX(6px);box-shadow:var(--shadow-hover);border-left-color:var(--gold)}
.record:hover .rdate{background:var(--gold);color:#000}
.record .rdate{flex:none;width:74px;text-align:center;background:var(--navy-tint);color:var(--navy);border-radius:4px;padding:8px 4px;font-weight:800;font-size:13px;line-height:1.3}
.record .rdate b{display:block;font-size:19px}
.record .rbody{flex:1;min-width:220px}
.record .rbody h3{font-size:16.5px;margin-bottom:4px}
.record .rmeta{font-size:13.5px;color:var(--muted)}
.record .ractions{display:flex;gap:8px;flex-wrap:wrap}
.record.is-open{border-color:rgba(185,133,47,.55);box-shadow:0 0 0 1px rgba(185,133,47,.25),var(--shadow)}
.status-pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:4px 10px;border-radius:2px}
.status-open{background:var(--gold-tint);color:var(--gold-700)}
.status-closed{background:var(--navy-tint);color:var(--navy)}
.filter-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}
.filter-row button{font:inherit;font-size:14px;font-weight:700;border:1px solid var(--line-strong);background:#fff;color:var(--ink);border-radius:2px;padding:8px 16px;cursor:pointer;transition:background .15s,color .15s,border-color .15s,transform .15s}
.filter-row button:hover{background:var(--gold);border-color:var(--gold);color:#000;transform:translateY(-2px)}
.filter-row button.is-active{background:var(--navy);border-color:var(--navy);color:#fff}
.sample-tag{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#7a5a12;background:#fbeecb;border:1px solid #eddaa6;padding:3px 9px;border-radius:6px}

/* ---------- CTA band ---------- */
.cta-band{background:var(--navy);color:#fff;border-radius:var(--radius);padding:44px;display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap}
.cta-band h2{color:#fff;margin:0}
.cta-band p{color:#cfd9e6;margin:8px 0 0}
@media (max-width:700px){.cta-band{padding:30px;flex-direction:column;text-align:center}}

/* ---------- Notice / callout ---------- */
.callout{border:1px solid var(--line);border-left:4px solid var(--navy);background:#fff;border-radius:var(--radius-sm);padding:18px 20px;box-shadow:var(--shadow)}
.callout.gold{border-left-color:var(--gold)}
.callout h4{margin-bottom:6px}
.callout p:last-child{margin-bottom:0}

/* ---------- Forms (visual only in this demo) ---------- */
.form{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--pad)}
.field{margin-bottom:16px}
.field label{display:block;font-size:13.5px;font-weight:700;color:var(--ink);margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;font:inherit;font-size:15px;padding:10px 12px;border:1px solid var(--line-strong);border-radius:4px;background:#fff;color:var(--ink)}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--gold)}

/* ---------- Footer ---------- */
.site-footer{background:var(--navy-700);color:#c9d3e0;padding:52px 0 28px}
.footer-top{display:flex;justify-content:space-between;align-items:flex-start;gap:28px;flex-wrap:wrap;padding-bottom:32px;border-bottom:1px solid rgba(255,255,255,.12)}
.footer-brand{display:flex;gap:12px;align-items:center;text-decoration:none}.footer-brand *{text-decoration:none}
.footer-brand img{width:44px;height:44px}
.footer-brand b{display:block;color:#fff;font-size:16px}
.footer-brand span{display:block;font-size:12.5px;color:#9fadc2}
.footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap);padding:32px 0}
.footer-grid h4,.footer-grid .footer-h{color:#fff;font-size:13px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px}
.footer-grid ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.footer-grid a{color:#c9d3e0;text-decoration:none;font-size:14.5px;display:inline-block;padding:3px 8px;margin-left:-8px;border-radius:2px;transition:background .15s,color .15s}
.footer-grid a:hover,.footer-grid a:focus-visible{color:#000;background:var(--gold);text-decoration:none}
.footer-bottom{padding-top:20px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;color:#94a2b8}
.footer-demo{max-width:64ch}
.footer-admin-demo{max-width:64ch;color:#c9d3e0}
.footer-admin-demo strong{color:#fff}
.footer-admin-demo a{color:#fff;text-decoration:underline}
/* Both fall through to the page-wide `a{color:var(--navy)}` otherwise — dark
   navy text on this footer's dark navy-700 background measured 1.22:1,
   effectively invisible. Pre-existing, found while testing the new widget. */
.footer-bottom a,.footer-demo a{color:#c9d3e0}
.footer-bottom a:hover,.footer-demo a:hover{color:#000;background:var(--gold);text-decoration:none}
.footer-top-right{display:flex;align-items:center;gap:20px}
.footer-social{display:flex;gap:14px;align-items:center}
.footer-social a{color:#94a2b8;display:grid;place-items:center;width:36px;height:36px;border-radius:4px;transition:color .15s,background .15s}
.footer-social a:hover,.footer-social a:focus-visible{color:#000;background:var(--gold)}
@media (max-width:900px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.footer-grid{grid-template-columns:1fr}}

/* ---------- Utility reveal (kept static: content is never scroll-gated) ---------- */
.reveal{opacity:1}

/* print */
@media print{.site-header,.site-footer,.demo-controls,.alert-banner,.demo-ribbon{display:none!important}}
/* Round-1/2 critique fixes: real photos on cards + a wide banner */
.card-photo{padding-top:0;overflow:hidden}
.card-photo{overflow:hidden}
.card-photo img{width:calc(100% + 2*var(--pad));max-width:none;margin:0 calc(-1*var(--pad)) 4px;display:block;height:164px;aspect-ratio:auto;object-fit:cover;transition:transform .6s ease}
.card-photo:hover img,.card-gold-panel:hover img,.feature-split:hover img{transform:scale(1.06)}
.card-gold-panel img,.feature-split img{transition:transform .6s ease}
@media (max-width:640px){.card-photo img{height:150px}}
.wide-photo{margin:0;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.wide-photo img{width:100%;display:block;aspect-ratio:2.5/1;object-fit:cover}
.wide-photo figcaption{padding:12px 4px 0;font-size:14px;color:var(--muted)}
.quick-thumb{width:56px;height:56px;object-fit:cover;border-radius:14px;box-shadow:0 4px 14px rgba(13,42,74,.12)}

/* Contact map — self-hosted static map (host CSP blocks embedded map iframes) */
.map-figure{margin:0;max-width:none}
.map-figure img{width:100%;aspect-ratio:2400/1050;object-fit:cover;display:block;border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--line)}
.map-figure figcaption{margin-top:12px;font-size:13.5px;color:var(--muted);line-height:1.5}
@media (max-width:640px){.map-figure img{aspect-ratio:4/3;object-position:center}}

/* Leadership cards — initials monogram, never a generated likeness of a real official */
.leader-card{display:flex;flex-direction:column;align-items:flex-start}
.leader-mono{width:52px;height:52px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;
  font-weight:800;font-size:17px;letter-spacing:.02em;margin-bottom:14px;flex:none}
.leader-card h3{margin-bottom:2px}
.leader-role{font-size:13.5px;color:var(--gold-700);font-weight:700;margin:0 0 10px}

/* ---------- Mobile usability pass: touch targets + legible minimums ----------
   Audited at 390px: footer/nav links were rendering 16-26px tall (below the 44px
   touch guidance) and several meta strings sat at 9.5-10px. */
@media (max-width:640px){
  .footer-grid a,.footer-nav a,.footer-bottom a,.footer-social a,.footer-top a{
    display:inline-flex;align-items:center;min-height:40px}
  .footer-grid li,.footer-nav li{margin-bottom:0}
  .text-link,.card-link,.out{display:inline-flex;align-items:center;min-height:40px}
  .btn-sm{min-height:44px}
  .announce-close,.demo-controls summary{min-width:40px;min-height:40px}
  .note,.small,small,figcaption{font-size:12.5px}
  .footer-bottom,.footer-demo,.footer-tag,.footer-legal{font-size:12.5px;line-height:1.55}
  .wordmark-sub,.brand .word span,.brand-word small{font-size:10.5px}
  .breadcrumb a,.breadcrumb [aria-current]{display:inline-flex;align-items:center;min-height:36px}
}

/* Card thumbnails — photographed objects, matching the top service dock */
.card-thumb-well{display:grid;place-items:center;width:64px;height:64px;border-radius:16px;background:#eef1f4;overflow:hidden;margin-bottom:14px}
.card-thumb{width:56px;height:56px;object-fit:cover;border-radius:12px;display:block}
@media (max-width:640px){.card-thumb-well{width:56px;height:56px;border-radius:14px}.card-thumb{width:48px;height:48px}}

/* ---- Ask Bruceville-Eddy — visitor chat widget ---- */
.chat-bubble{position:fixed;right:clamp(12px,2vw,26px);bottom:clamp(12px,2vw,26px);z-index:180;
  font-family:var(--sans,inherit)}
.chat-open{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 18px;border:0;
  border-radius:4px;cursor:pointer;font:700 13.5px/1 inherit;color:#fff;
  background:linear-gradient(180deg,var(--navy),var(--navy-700));
  box-shadow:0 10px 28px rgba(23,52,86,.3),0 0 20px -6px rgba(23,52,86,.4)}
.chat-open:hover{transform:translateY(-2px)}
.chat-open.has-new::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--gold);
  box-shadow:0 0 0 4px rgba(185,133,47,.3)}
.chat-panel{position:absolute;right:0;bottom:64px;width:min(330px,calc(100vw - 24px));
  background:#fff;border:1px solid var(--line);border-radius:6px;overflow:hidden;
  box-shadow:0 26px 64px rgba(20,32,48,.28);display:flex;flex-direction:column}
.chat-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;
  background:var(--navy-700);color:#fff;font-size:15px}
.chat-head strong{color:#fff}
.chat-close{appearance:none;border:0;background:rgba(255,255,255,.16);color:#fff;cursor:pointer;
  width:30px;height:30px;border-radius:50%;font:700 18px/1 inherit}
.chat-log{list-style:none;margin:0;padding:12px;max-height:280px;overflow:auto;display:grid;gap:8px}
.chat-log li{padding:9px 12px;border-radius:4px;font-size:14.5px;line-height:1.35;max-width:88%}
.chat-log .them{background:var(--bg-panel,#f6f4ee);color:var(--ink);justify-self:start}
.chat-log .me{background:var(--navy-700);color:#fff;justify-self:end}
.chat-form{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line)}
.chat-form input{flex:1;font:inherit;font-size:16px;padding:9px 12px;border:1px solid var(--line);
  border-radius:4px;min-height:44px;background:#fff;color:#000}
.chat-form button{min-height:44px;padding:0 16px;font-size:13px;border:0;border-radius:2px;
  cursor:pointer;font-weight:700;color:#fff;background:var(--navy-700)}
@media (max-width:480px){.chat-open-label{display:none}.chat-open{padding:0 16px}}
@media print{.chat-bubble{display:none}}

/* ---- Install app button, in the topbar ---- */
.install-app{display:inline-flex;align-items:center;gap:6px;background:none;border:0;
  padding:0;font:inherit;color:#eef2f7;cursor:pointer}
.install-app:hover{text-decoration:underline}

/* ================= Schaumburg: three brands on one system =================
   Light theme; the brand colour is a small accent only (eyebrows, dots, one
   CTA, thin borders). Variable names are kept from the shared system. */
.brand-village{--navy:#1a1a1a;--navy-700:#111111;--navy-tint:rgba(0,0,0,.06);--gold:#FFC627;--gold-700:#8a6b00;--gold-tint:rgba(255,198,39,.16);--bg:#ffffff;--bg-panel:#f7f7f5}
.brand-larson{--navy:#7a2436;--navy-700:#561826;--navy-tint:rgba(122,36,54,.09);--gold:#FFC627;--gold-700:#8a6b00;--gold-tint:rgba(255,198,39,.16);--bg:#ffffff;--bg-panel:#f8f5f4}
.brand-90n{--navy:#0f3d5c;--navy-700:#0a2a40;--navy-tint:rgba(15,61,92,.09);--gold:#FFC627;--gold-700:#8a6b00;--gold-tint:rgba(255,198,39,.16);--bg:#ffffff;--bg-panel:#f4f7f9}

/* Family bar — the one strip shared by all three sites */
.family-bar{background:#111111;color:#c9ccc9;font-size:12.5px;border-bottom:1px solid rgba(255,255,255,.12)}
.brand-larson .family-bar{background:#1e0d12}.brand-90n .family-bar{background:#08161f}
.family-bar .container{display:flex;align-items:center;gap:18px;min-height:32px;flex-wrap:wrap}
.family-label{font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:11px;color:#9a9a9a}
.family-bar nav{display:flex;gap:4px;flex-wrap:wrap}
.family-bar nav a{color:#d9d9d9;text-decoration:none;padding:5px 10px;border-radius:2px}
.family-bar nav a:hover{background:rgba(255,255,255,.1);color:#fff}
.family-bar nav a[aria-current]{background:rgba(255,255,255,.16);color:#fff;font-weight:700;border-bottom:2px solid var(--gold)}
@media (max-width:640px){.family-label{display:none}.family-bar nav a{padding:6px 8px;font-size:12px}}

/* Brand marks */
.brand img{width:44px;height:48px}
.mark-larson,.mark-90n{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-weight:900;letter-spacing:-.02em;color:#fff;background:var(--navy);flex:none;font-size:15px}
.mark-90n{font-size:14px}.mark-90n i{font-style:normal;font-size:10px;margin-left:1px;opacity:.85}
.footer-brand img{width:40px;height:44px;filter:brightness(1.15)}
.hero-seal img{width:82px;height:90px;border-radius:22px;padding:10px}
.demo-controls summary .sw{font-weight:900;font-size:13px}

/* Service finder */
.finder{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}
.finder input[type=search]{width:100%;font:inherit;font-size:17px;padding:12px 16px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--bg);color:var(--ink);-webkit-appearance:none}
.finder input[type=search]::placeholder{color:#6b7685}
.finder input[type=search]:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--gold)}
.finder-cats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0 20px}
.finder-cats button{font:inherit;font-size:13px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;border:none;background:var(--gold);color:#000;border-radius:2px;padding:18px 16px;cursor:pointer;transition:background .15s,transform .15s,box-shadow .15s}
.finder-cats button:hover{background:var(--gold-700);color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.12)}
.finder-cats button.is-active{background:#1a1a1a;color:var(--gold);font-weight:800}
@media (max-width:640px){.finder-cats{grid-template-columns:repeat(2,1fr);overflow-x:visible;flex-wrap:wrap;padding-bottom:0}}
.finder-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:4px 20px;max-width:none}
.finder-list li{display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid var(--line);border-left:3px solid transparent;padding:10px 4px 10px 8px;transition:border-color .15s,background .15s}
.finder-list li:hover{border-left-color:#000;background:var(--gold)}
.finder-list li:hover a,.finder-list li:hover .finder-cat{color:#000}
.finder-list a{text-decoration:none;color:var(--ink);font-weight:600;font-size:15px;display:inline-flex;gap:6px;align-items:center;min-height:32px;transition:color .15s}
.finder-list a:hover{color:#000}
.finder-cat{font-size:11.5px;color:#5a6373;white-space:nowrap;letter-spacing:.04em;text-transform:uppercase;font-weight:700}
@media (max-width:980px){.finder-list{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.finder-list{grid-template-columns:1fr}.finder-cat{display:none}}

/* Quick-links panel — ASU-style clean link list with arrow accents */
.qlinks-split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.qlinks-split .qlinks-photo{border-radius:var(--radius);overflow:hidden}
.qlinks-split .qlinks-photo img{width:100%;height:auto;display:block;object-fit:cover}
.qlinks-head{font-size:36px;font-weight:900;letter-spacing:-.03em;text-transform:uppercase;color:var(--ink);margin-bottom:12px;line-height:1.05}
.qlinks-rule{width:100%;height:4px;background:var(--gold);border:none;margin:0 0 28px}
.qlinks-list{list-style:none;margin:0;padding:0}
.qlinks-list li{border-bottom:1px solid var(--line)}
.qlinks-list a{display:flex;align-items:center;justify-content:space-between;padding:16px 0;text-decoration:none;color:var(--ink);font-size:17px;font-weight:600;font-style:italic;transition:color .15s,padding-left .15s}
.qlinks-list a::after{content:"\2215";color:var(--gold);font-style:normal;font-size:20px;font-weight:700;transition:transform .15s}
.qlinks-list a:hover{color:#000;background:var(--gold);padding-left:10px;padding-right:10px}
.qlinks-list a:hover::after{transform:translateX(3px)}
@media (max-width:768px){.qlinks-split{grid-template-columns:1fr;gap:28px}.qlinks-head{font-size:28px}}

/* Category grid — ASU-style 3×N grid of bold buttons */
.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.cat-grid-wrap{display:grid;grid-template-columns:1fr 1.4fr;gap:48px;align-items:start}
.cat-grid-intro{font-size:17px;color:var(--body);line-height:1.6;max-width:42ch}
.cat-grid a{display:flex;align-items:center;justify-content:center;text-align:center;background:var(--gold);color:#000;font-size:14px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;padding:28px 16px;border-radius:2px;transition:background .15s,transform .15s,box-shadow .15s}
.cat-grid a:hover{background:var(--gold-700);color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.12)}
@media (max-width:768px){.cat-grid-wrap{grid-template-columns:1fr}.cat-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:480px){.cat-grid{grid-template-columns:1fr}}

/* Decorative zigzag accent — gold version of USF's green zigzag */
.zigzag{display:block;width:72px;height:8px;margin-bottom:14px;background:repeating-linear-gradient(90deg,var(--gold) 0 8px,transparent 8px 12px);mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M0 8 6 0 12 8' fill='%23000'/%3E%3C/svg%3E");mask-size:12px 8px;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M0 8 6 0 12 8' fill='%23000'/%3E%3C/svg%3E");-webkit-mask-size:12px 8px}

/* Photo card with gold bottom panel — USF Visit/Apply style */
.card-gold-panel{background:var(--gold);border:none;text-decoration:none;display:block;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:transform .2s ease,box-shadow .2s ease}
.card-gold-panel:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover)}
.card-gold-panel img{width:100%;height:200px;object-fit:cover;display:block}
.card-gold-panel .card-gold-body{padding:22px 24px;color:#000}
.card-gold-panel .card-gold-body h3{color:#000;font-size:18px;margin:0 0 4px;border-bottom:2px solid rgba(0,0,0,.15);padding-bottom:10px}
.card-gold-panel .card-gold-body p{color:rgba(0,0,0,.75);font-size:15px;margin:10px 0 0}
@media (max-width:640px){.card-gold-panel img{height:160px}}

/* Events-on-photo overlay — USF events-over-stadium style */
.events-photo{position:relative;border-radius:var(--radius);overflow:hidden;min-height:440px;display:flex;align-items:stretch}
.events-photo>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity .5s ease,transform 6s ease}
.events-photo>img.is-active{opacity:1;transform:scale(1)}
.events-photo .events-overlay{position:relative;z-index:1;background:rgba(26,26,26,.88);color:#fff;padding:40px 36px;max-width:440px;display:flex;flex-direction:column;gap:18px}
.events-photo .events-overlay h2{color:#fff;font-size:28px;margin:0}
.events-photo .events-overlay .zigzag{background:repeating-linear-gradient(90deg,var(--gold) 0 8px,transparent 8px 12px)}
.events-item{display:block;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.15);padding:10px 12px 14px;margin:0 -12px;border-left:3px solid transparent;transition:background .15s,border-color .15s,transform .15s}
.events-item:hover,.events-item:focus-visible{background:var(--gold);border-left-color:#000;transform:translateX(4px)}
.events-item:hover h3,.events-item:hover p,.events-item:hover .events-date,.events-item:focus-visible h3,.events-item:focus-visible p{color:#000}
.events-item:hover .events-date,.events-item:focus-visible .events-date{background:#000;color:var(--gold)}
.events-item:last-child{border-bottom:none;padding-bottom:0}
.events-item .events-date{display:inline-block;background:var(--gold);color:#000;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:3px 10px;border-radius:2px;margin-bottom:6px}
.events-item h3{color:#fff;font-size:16px;margin:0 0 2px}
.events-item p{color:rgba(255,255,255,.7);font-size:14px;margin:0}
.events-photo .events-links{display:flex;flex-direction:column;gap:8px;margin-top:auto}
.events-photo .events-links a{color:#fff;text-decoration:none;font-weight:700;font-size:15px;display:flex;align-items:center;gap:6px;transition:color .15s}
.events-photo .events-links a::before{content:"\203A";color:var(--gold);font-size:18px;font-weight:900}
.events-photo .events-links a{padding:4px 8px;margin-left:-8px;border-radius:2px}
.events-photo .events-links a:hover,.events-photo .events-links a:focus-visible{background:var(--gold);color:#000}
.events-photo .events-links a:hover::before{color:#000}
@media (max-width:768px){.events-photo{min-height:auto;flex-direction:column}.events-photo>img{position:relative;height:220px}.events-photo .events-overlay{max-width:none}}

/* Connect/social section — USF "Your Moment Starts Now" style */
.connect-split{display:grid;grid-template-columns:1fr 1fr;gap:0;min-height:480px;overflow:hidden;border-radius:var(--radius)}
.connect-mosaic{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:3px}
.connect-mosaic img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.9);transition:filter .3s}
.connect-mosaic img:hover{filter:saturate(1.2)}
.connect-body{background:var(--navy);color:#fff;padding:48px 40px;display:flex;flex-direction:column;justify-content:center}
.connect-body h2{color:#fff;font-size:32px;font-weight:900;letter-spacing:-.03em;margin-bottom:8px;max-width:none}
.connect-body p{color:rgba(255,255,255,.7);margin:0 0 28px;max-width:36ch}
.connect-links{list-style:none;margin:0;padding:0}
.connect-links li{border-bottom:1px solid rgba(255,255,255,.15)}
.connect-links a{display:flex;align-items:center;justify-content:space-between;padding:14px 0;text-decoration:none;color:#fff;font-size:17px;font-weight:700;transition:color .15s,padding-left .15s}
.connect-links a::after{content:"\00BB";color:var(--gold);font-size:22px;font-weight:900;transition:transform .15s}
.connect-links a:hover{color:var(--gold);padding-left:6px}
.connect-links a:hover::after{transform:translateX(4px)}
@media (max-width:768px){.connect-split{grid-template-columns:1fr}.connect-mosaic{grid-template-columns:repeat(3,1fr);grid-template-rows:1fr;height:200px}.connect-body{padding:32px 28px}}

/* Stats band */
.stats{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--gap)}
.stat{background:#fff;border:1px solid var(--line);border-top:3px solid transparent;border-radius:var(--radius);padding:22px 18px;text-align:center;box-shadow:var(--shadow);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.stat:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);border-top-color:var(--gold)}
.stat b{display:block;font-size:34px;line-height:1;color:var(--navy);letter-spacing:-.02em;margin-bottom:8px;transition:color .15s}
.stat:hover b{color:var(--gold-700)}
.stat span{font-size:13.5px;color:var(--muted);line-height:1.35;display:block}
@media (max-width:980px){.stats{grid-template-columns:repeat(3,1fr)}}
@media (max-width:520px){.stats{grid-template-columns:1fr 1fr}.stat b{font-size:28px}}

/* Yellow achievement panel — ASU-style bold gold slide */
.gold-panel{background:var(--gold);color:#000;border-radius:var(--radius);padding:48px 40px;display:flex;flex-direction:column;justify-content:center}
.gold-panel h2{color:#000;font-size:48px;font-weight:900;letter-spacing:-.03em;line-height:1.05;margin-bottom:24px;max-width:none}
.gold-panel .gold-fact{margin-bottom:18px}
.gold-panel .gold-fact b{font-size:20px;font-weight:900;letter-spacing:-.01em;display:block;margin-bottom:2px}
.gold-panel .gold-fact-label{display:inline;background:#000;color:var(--gold);font-size:13px;font-weight:800;padding:3px 8px;letter-spacing:.04em;text-transform:uppercase}
.gold-panel .gold-fact span{display:block;font-size:13px;color:rgba(0,0,0,.7);margin-top:4px}
.gold-panel .gold-fact span.gold-fact-label{display:inline-block;color:var(--gold);margin:0 0 4px}
.gold-panel-wrap::after{content:"#1";font-size:120px;font-weight:900;line-height:.85;letter-spacing:-.04em;position:absolute;right:40px;top:50%;transform:translateY(-50%);opacity:.18;pointer-events:none}
.gold-panel-wrap{position:relative;overflow:hidden}
.finder-grid{display:grid;grid-template-columns:1fr 340px;gap:var(--gap);align-items:start}
@media (max-width:900px){.finder-grid{grid-template-columns:1fr}.gold-panel{padding:32px 28px}.gold-panel h2{font-size:36px}.gold-panel-wrap::after{font-size:80px;right:20px}}

/* Officials — the Village's own published portraits, shown as published */
.official{flex-direction:row;gap:18px;align-items:flex-start}
.official-photo{width:104px;height:139px;object-fit:cover;border-radius:12px;flex:none;box-shadow:var(--shadow)}
.official h3{margin-bottom:2px}
.official-meta{font-size:14px;color:var(--muted);line-height:1.5}
.official-meta a{color:var(--body);text-decoration:none}
.official-meta a:hover{color:var(--navy);text-decoration:underline}
@media (max-width:640px){.official{flex-direction:column}.official-photo{width:100%;height:auto;aspect-ratio:3/4;max-height:340px;object-position:top}}

/* Shows / tenants grids reuse the record filter (data-status) */
.show-grid,.record-list.grid{display:grid}
.show .show-when{font-weight:700;color:var(--navy);font-size:14.5px}
.show-plate{width:calc(100% + 2*var(--pad));margin:0 calc(-1*var(--pad)) 4px;height:120px;background:linear-gradient(120deg,var(--navy-700),var(--navy));position:relative}
.show-plate::after{content:"";position:absolute;inset:auto 18px 14px auto;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.14)}
.card[hidden]{display:none}
.family-grid .card-photo img{height:140px}

/* Hero variants */
.hero-larson .hero-media::after{background:linear-gradient(100deg,rgba(40,10,18,.7) 0%,rgba(40,10,18,.3) 46%,rgba(40,10,18,.05) 68%)}
.hero-90n .hero-media::after{background:linear-gradient(100deg,rgba(6,28,44,.72) 0%,rgba(6,28,44,.3) 46%,rgba(6,28,44,.05) 68%)}
.alert-banner{background:var(--navy-700)}
.alert-banner a{color:#ffe38a}
.field label input[type=checkbox]{width:auto;margin-right:8px}

.finder-more{margin:16px 0 0;text-align:center}

/* ---- Section arrangements, 2026-09-25: feature split (news), photo tiles, bracket buttons, season list ---- */
.feature-split{display:grid;grid-template-columns:1.15fr 1fr;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);min-height:380px;text-decoration:none;background:var(--navy)}
.feature-split img{width:100%;height:100%;object-fit:cover;display:block}
.feature-split .feature-panel{background:var(--navy);color:#fff;padding:48px 44px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.feature-split .feature-panel .tag{display:inline-block;font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;background:var(--gold);color:#000;padding:4px 10px;border-radius:2px;margin:0}
.feature-split .feature-panel h3,.feature-split .feature-panel .feature-title{color:#fff;font-size:28px;line-height:1.15;margin:16px 0 12px;max-width:none}
.feature-split .feature-panel p{color:rgba(255,255,255,.82);font-size:16px;margin:0 0 20px}
.feature-split .feature-panel .text-link{color:var(--gold)}
.feature-split .feature-panel .text-link:hover{color:#fff}
@media (max-width:900px){.feature-split{grid-template-columns:1fr;min-height:0}.feature-split img{height:240px}.feature-split .feature-panel{padding:28px 24px}.feature-split .feature-panel h3,.feature-split .feature-panel .feature-title{font-size:22px}}
.photo-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.photo-tiles a{position:relative;display:block;aspect-ratio:4/5;border-radius:var(--radius);overflow:hidden;text-decoration:none;box-shadow:var(--shadow);background:#111}
.photo-tiles img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(1);transition:filter .25s ease,transform .4s ease}
.photo-tiles a:hover img,.photo-tiles a:focus-visible img{filter:none;transform:scale(1.04)}
.photo-tiles a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.74) 100%)}
.photo-tiles .tile-label{position:absolute;left:18px;right:18px;bottom:18px;z-index:1;color:#fff;font-size:20px;font-weight:900;letter-spacing:-.02em;text-transform:uppercase;line-height:1.05}
.photo-tiles .tile-arrow{position:absolute;top:0;right:0;z-index:1;width:40px;height:40px;background:var(--gold);color:#000;display:grid;place-items:center;font-size:20px;font-weight:900}
@media (max-width:900px){.photo-tiles{grid-template-columns:repeat(2,1fr)}.photo-tiles .tile-label{font-size:16px}}
.bracket-row{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:36px}
.btn-bracket{position:relative;display:flex;align-items:center;justify-content:center;min-height:76px;padding:18px 24px;font-weight:700;font-size:17px;color:var(--ink);text-decoration:none;border-left:2px solid var(--ink);border-right:2px solid var(--ink);transition:background .15s}
.btn-bracket::before,.btn-bracket::after{content:"";position:absolute;height:2px;background:var(--ink);width:86%}
.btn-bracket::before{top:0;right:0}
.btn-bracket::after{bottom:0;left:0}
.btn-bracket:hover{background:var(--gold);color:#000}
@media (max-width:760px){.bracket-row{grid-template-columns:1fr;gap:18px}}
.record .rthumb{width:96px;height:64px;object-fit:cover;border-radius:2px;flex:none}
.season-list .rdate{min-width:92px}
.season-list .rdate b{font-size:12px;letter-spacing:.06em}
.season-list .rmeta b{color:var(--navy);font-weight:700}

/* ---- Scroll reveal (all pages) ---- */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s ease}
.reveal.is-in{opacity:1;transform:none}
.official-photo,.leader-mono{transition:transform .3s ease}
.official:hover .official-photo,.person:hover .leader-mono{transform:scale(1.04)}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.hero-media img,.hero-slider img.is-active{animation:none}.card-photo img,.record,.person,.stat,.card,.btn{transition:none}}

/* ---- Mobile pass 2026-09-25 ---- */
@media (max-width:640px){
  .season-list .record{align-items:flex-start;padding:14px 16px}
  .season-list .rdate{min-width:64px;width:64px;font-size:11px;padding:6px 2px}
  .season-list .rthumb{display:none}
  .season-list .rbody{flex:1 1 60%}
  .season-list .ractions{width:100%;margin-top:8px}
  .season-list .ractions .btn{width:100%}
  .h2-highlight{padding:2px 6px;line-height:1.35}
  .record .rdate b{font-size:16px}
  .cta-band .btn-row .btn{width:100%}
  .feature-split .feature-panel .text-link{margin-top:4px}
  .events-photo{min-height:0}
  .events-photo .events-overlay{max-width:none;padding:28px 20px}
  .connect-body{padding:28px 20px}
  .qlinks-head{font-size:28px}
  .bracket-row{gap:14px}
  .btn-bracket{min-height:60px;font-size:16px}
  .hero-inner{padding-top:56px}
}
@media (max-width:900px){
  .season-list .rbody h3{font-size:18px}
}

/* ---- Mobile overflow fixes ---- */
.hero{overflow:hidden}
@media (max-width:640px){
  .footer-top{flex-direction:column;align-items:stretch}
  .footer-top-right{flex-wrap:wrap;justify-content:space-between;width:100%;gap:12px}
  .footer-top-right .btn{width:100%;order:2}
  .footer-social{order:1}
}

/* ---- Tap targets ---- */
.official-meta a{display:inline-block;padding:6px 0;min-height:40px;line-height:1.6}
.family-bar a,.site-family a{display:inline-flex;align-items:center;min-height:40px}
@media (max-width:640px){
  .official-meta a{display:block;padding:8px 0}
  .topbar-links a{display:inline-flex;align-items:center;min-height:40px}
}

/* ---- WebPay portal ---- */
.pay-steps{list-style:none;margin:0 0 28px;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;counter-reset:none}
.pay-steps li{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:4px solid var(--line);font-weight:700;color:var(--muted);font-size:14px}
.pay-steps li b{width:28px;height:28px;border-radius:2px;background:var(--bg-panel);color:var(--ink);display:grid;place-items:center;font-size:13px}
.pay-steps li.is-active{color:var(--ink);border-bottom-color:var(--gold)}
.pay-steps li.is-active b{background:var(--gold);color:#000}
.pay-steps li.is-done{color:var(--ink);border-bottom-color:#000}
.pay-steps li.is-done b{background:#000;color:var(--gold)}
.pay-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:32px;align-items:start}
.pay-types button{font:inherit;font-size:14px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;border:none;background:var(--gold);color:#000;border-radius:2px;padding:26px 16px;cursor:pointer;transition:background .15s,color .15s,transform .15s,box-shadow .15s}
.pay-types button:hover,.pay-types button:focus-visible{background:#000;color:var(--gold);transform:translateY(-3px);box-shadow:0 10px 24px -12px rgba(0,0,0,.5)}
.pay-types button.is-selected{background:#000;color:var(--gold)}
.pay-review{margin:0 0 18px;display:grid;grid-template-columns:max-content 1fr;gap:10px 22px;font-size:16px}
.pay-review dt{font-weight:700;color:var(--ink)}
.pay-review dd{margin:0}
.pay-summary .pay-amount{font-size:40px;font-weight:900;letter-spacing:-.03em;color:var(--ink);margin:10px 0 0}
.pay-side .fact-grid{margin-top:18px}
@media (max-width:900px){.pay-grid{grid-template-columns:1fr}.pay-steps{grid-template-columns:repeat(2,1fr)}.pay-steps li{font-size:13px}}
@media (max-width:640px){.pay-types{grid-template-columns:1fr 1fr}.pay-types button{padding:18px 10px;font-size:12.5px}.pay-review{grid-template-columns:1fr;gap:4px}.pay-review dd{margin-bottom:8px}}

/* ---- Long tokens (emails, URLs) must wrap inside cards and fact grids ---- */
.fact-grid,.fact-grid *,.card p,.card a,.pay-review dd,.official-meta a{overflow-wrap:anywhere;word-break:normal;min-width:0}
@media (max-width:640px){.fact-grid{grid-template-columns:1fr!important}}

/* ---- Staff-managed alerts and preview ---- */
.alert-banner.is-warning{background:var(--gold);color:#000}
.alert-banner.is-warning a,.alert-banner.is-warning strong{color:#000}
.alert-banner.is-emergency{background:#b3261e;color:#fff}
.alert-banner.is-emergency a,.alert-banner.is-emergency strong{color:#fff}
.cms-preview{position:fixed;left:0;right:0;bottom:0;z-index:999;background:#1a1a1a;color:var(--gold);font-weight:700;font-size:14px;text-align:center;padding:10px 16px}

/* ---- Site search ---- */
.nav-search{display:flex;align-items:stretch;border:1px solid var(--line-strong);border-radius:2px;overflow:hidden;margin-left:10px;background:#fff}
.nav-search input{font:inherit;font-size:14px;border:0;padding:0 12px;width:150px;min-height:38px;background:transparent;color:var(--ink)}
.nav-search input:focus{outline:none;width:210px}
.nav-search:focus-within{border-color:var(--gold);box-shadow:0 0 0 2px var(--gold-tint)}
.nav-search button{border:0;background:var(--gold);color:#000;width:40px;display:grid;place-items:center;cursor:pointer;transition:background .15s,color .15s}
.nav-search button:hover{background:#000;color:var(--gold)}
@media (max-width:1024px){.nav-primary .nav-search{display:none}}
.nav-drawer .nav-search{margin:0 0 14px;width:100%}
.nav-drawer .nav-search input{width:100%;min-height:44px}
.search-form{margin-bottom:18px}
.search-form .field input{font-size:18px;min-height:52px}
.search-filters{margin-bottom:10px}
#search-results mark{background:var(--gold);color:#000;padding:0 3px;border-radius:2px}
#search-results .rdate{min-width:86px;width:auto;font-size:11px;letter-spacing:.06em;text-transform:uppercase}

@media (max-width:1320px){.nav-search input{width:118px}.nav-search input:focus{width:170px}.brand .word span{white-space:nowrap}}
@media (max-width:1140px){.nav-search input{width:96px}.nav-list a{padding-left:9px;padding-right:9px}}

/* ---- Records center + FOIA status ---- */
.records-filters{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.records-filters .field{margin:0}
.records-filters select,.records-filters input{width:100%;font:inherit;font-size:15px;padding:10px 12px;border:1px solid var(--line-strong);border-radius:2px;background:#fff}
@media (max-width:900px){.records-filters{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.records-filters{grid-template-columns:1fr}}
.doc-links{display:flex;gap:8px;flex-wrap:wrap}
.doc-links .btn-sm{min-height:34px;padding:0 12px;font-size:13px}
.doc-links .pending{font-size:13px;color:var(--muted);align-self:center}
.foia-card{background:#fff;border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:var(--radius);padding:22px 24px;margin-top:20px;box-shadow:var(--shadow)}
.foia-card h3{margin-bottom:6px}
.foia-status{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:4px 10px;border-radius:2px;background:var(--gold);color:#000;margin-bottom:12px}
.foia-status.completed{background:#000;color:var(--gold)}
.foia-status.denied{background:#b3261e;color:#fff}
.foia-timeline{list-style:none;margin:14px 0 0;padding:0;border-left:2px solid var(--line-strong)}
.foia-timeline li{padding:6px 0 6px 16px;position:relative;font-size:15px}
.foia-timeline li::before{content:"";position:absolute;left:-6px;top:13px;width:10px;height:10px;border-radius:50%;background:var(--gold)}
.foia-timeline time{display:block;font-size:12.5px;color:var(--muted)}

.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

/* ---- a11y + utility pages + WebPay tiles ---- */
.quick-card .qt{display:block;font-size:15px;font-weight:700;color:var(--ink);margin:0;line-height:1.2}
.callout .callout-title{font-size:16px;margin:0 0 6px}
.hero-pause{font-size:13px;letter-spacing:-2px}
.hero-pause[aria-pressed="true"]{background:var(--gold);color:#000}
.pay-types button{display:flex;flex-direction:column;align-items:center;gap:10px;padding:18px 12px 16px;text-transform:none;letter-spacing:0;font-size:14.5px;line-height:1.25}
.pay-types button img{width:64px;height:64px;border-radius:14px;object-fit:cover;box-shadow:0 4px 12px rgba(0,0,0,.18);background:#fff;transition:transform .2s}
.pay-types button:hover img,.pay-types button.is-selected img{transform:scale(1.06)}
.pay-illus{display:flex;align-items:center;gap:14px;margin:-8px 0 18px}
.pay-illus img{width:72px;height:72px;border-radius:16px;object-fit:cover;box-shadow:0 4px 12px rgba(0,0,0,.18)}
.pay-illus p{margin:0;color:var(--body);font-size:15px}
.sitemap-list{list-style:none;margin:0;padding:0}
.sitemap-list li{margin:0}
.sitemap-list a{display:block;padding:8px 10px;margin-left:-10px;border-radius:2px;color:var(--ink);text-decoration:none;font-weight:600}
.sitemap-list a:hover{background:var(--gold);color:#000}
.footer-legal{font-size:13px;color:#94a2b8}
.footer-legal a{color:#c9d3e0;text-decoration:none;padding:2px 4px;border-radius:2px}
.footer-legal a:hover{background:var(--gold);color:#000}
@media (max-width:640px){.pay-types button{padding:14px 8px;font-size:13px}.pay-types button img{width:52px;height:52px}}

/* ---- Community engagement ---- */
.engage-list{display:grid;gap:22px}
.engage{background:#fff;border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:var(--radius);padding:26px 28px;box-shadow:var(--shadow)}
.engage.closed{border-left-color:#000}
.engage h3{margin-bottom:6px}
.engage .meta{font-size:13.5px;color:var(--muted);margin-bottom:14px}
.engage .q{font-weight:700;color:var(--ink);margin:14px 0 8px}
.engage .opts{display:grid;gap:8px;margin:0 0 12px;padding:0;list-style:none}
.engage .opts label{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line-strong);border-radius:2px;cursor:pointer;transition:background .15s,border-color .15s}
.engage .opts label:hover{background:var(--gold-tint);border-color:var(--gold)}
.engage .opts input{accent-color:#000}
.engage .res{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:8px}
.engage .res li{position:relative;padding:8px 12px;border-radius:2px;background:var(--bg-panel);overflow:hidden;font-size:15px}
.engage .res .bar{position:absolute;left:0;top:0;bottom:0;background:var(--gold);opacity:.55;z-index:0}
.engage .res span{position:relative;z-index:1}
.engage .res b{position:relative;z-index:1;float:right}
.engage .row{display:grid;grid-template-columns:1fr 1fr 120px;gap:10px;margin-top:10px}
.engage .row input,.engage textarea{width:100%;font:inherit;font-size:15px;padding:10px 12px;border:1px solid var(--line-strong);border-radius:2px;box-sizing:border-box}
.engage textarea{margin-top:10px}
@media (max-width:640px){.engage .row{grid-template-columns:1fr}}

.engage .tag{display:inline-block;font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-700);background:var(--gold-tint);padding:4px 10px;border-radius:2px;margin-bottom:8px}

.translate{display:inline-flex;align-items:center;gap:6px}
.translate-sel{font:inherit;font-size:13px;background:#fff;color:#000;border:1px solid var(--gold);border-radius:2px;padding:3px 6px}

/* ---- Notice bar: one slim line, never a wall ---- */
.alert-banner{font-size:14px;border-bottom:1px solid rgba(255,255,255,.12)}
.alert-banner .container{display:flex;align-items:center;gap:12px;padding:8px 0;flex-wrap:nowrap;min-height:40px}
.alert-banner .alert-ico{flex:none;width:22px;height:22px;border-radius:50%;background:var(--gold);color:#000;font-weight:900;font-size:13px;display:grid;place-items:center}
.alert-banner strong{flex:none;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.alert-banner #alert-text{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#e6e6e6}
.alert-banner a{flex:none;color:#000;background:var(--gold);text-decoration:none;font-weight:800;font-size:12.5px;padding:5px 10px;border-radius:2px}
.alert-banner a:hover{background:#fff}
.alert-banner .alert-close{flex:none;background:transparent;border:1px solid rgba(255,255,255,.3);color:#fff;width:36px;height:36px;border-radius:2px;font-size:18px;line-height:1;cursor:pointer}
.alert-banner .alert-close:hover{background:var(--gold);color:#000;border-color:var(--gold)}
.alert-banner.is-warning .alert-ico,.alert-banner.is-warning a{background:#000;color:var(--gold)}
.alert-banner.is-warning strong,.alert-banner.is-warning #alert-text{color:#000}
.alert-banner.is-emergency .alert-ico{background:#fff;color:#b3261e}
@media (max-width:640px){.alert-banner strong{display:none}.alert-banner #alert-text{white-space:normal;font-size:13px;line-height:1.35}.alert-banner .container{align-items:flex-start;padding:10px 0}}
.demo-controls{display:none!important}

/* ---- Full-screen mobile menu (Against Da Grain pattern) ---- */
.mm{position:fixed;inset:0;z-index:120;background:#fff;color:var(--ink);display:none;flex-direction:column;overflow-y:auto;-webkit-overflow-scrolling:touch}
.mm.is-open{display:flex}
.mm-top{display:grid;grid-template-columns:52px 1fr auto;align-items:center;min-height:64px;padding:0 14px 0 4px;border-bottom:1px solid var(--line);gap:8px}
.mm-close{border:0;background:none;font:inherit;font-size:34px;line-height:1;cursor:pointer;color:var(--ink);height:48px;width:48px}
.mm-close:hover{color:var(--gold-700)}
.mm-brand{font-weight:800;letter-spacing:.18em;text-transform:uppercase;font-size:14px;text-align:center}
.mm-cta{background:var(--gold);color:#000;text-decoration:none;font-weight:800;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;padding:9px 12px;border-radius:2px;white-space:nowrap}
.mm-cta:hover{background:var(--gold-700);color:#fff}
.mm-search{display:flex;align-items:center;gap:12px;padding:0 18px;height:56px;border-bottom:1px solid var(--line)}
.mm-search svg{width:22px;height:22px;flex:none}
.mm-search input{flex:1;border:0;background:none;font:inherit;font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);outline:none;height:100%;min-width:0}
.mm-search input::placeholder{color:#8a8884}
.mm-row{border-bottom:1px solid var(--ink)}
.mm-item{display:flex;align-items:center;justify-content:space-between;width:100%;padding:0 18px;min-height:72px;border:0;background:none;font:inherit;font-weight:800;font-size:17px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);cursor:pointer;text-align:left;text-decoration:none;transition:background .15s}
@media (hover:hover){.mm-item:hover{background:var(--gold);color:#000}}
.mm-item[aria-current="page"]{box-shadow:inset 5px 0 0 var(--gold)}
.mm-item svg{width:22px;height:22px;flex:none;transition:transform .25s ease}
.mm-item[aria-expanded="true"]{background:var(--gold)}
.mm-item[aria-expanded="true"] svg{transform:rotate(90deg)}
.mm-panel{display:none;padding:4px 18px 14px;background:var(--bg-panel)}
.mm-row.is-open .mm-panel{display:block}
.mm-sub{display:block;padding:13px 0;font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);text-decoration:none;border-top:1px solid var(--line)}
.mm-sub:first-child{border-top:0}
.mm-sub:hover{color:var(--gold-700)}
.mm-sec{padding:14px 18px 44px;display:grid;gap:2px}
.mm-sec a{display:block;padding:12px 0;font-size:13.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);text-decoration:none}
.mm-sec a[aria-current="true"]{color:var(--gold-700)}
.mm-sec a:hover{color:var(--gold-700)}
body.mm-lock{overflow:hidden}
@media (min-width:981px){.mm{display:none !important}}
@media (prefers-reduced-motion:reduce){.mm-item svg{transition:none}}

/* mobile: family bar one scrollable row, notice clamps to two lines */
@media (max-width:640px){
  .family-bar .container{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .family-bar .container::-webkit-scrollbar{display:none}
  .family-bar nav{flex-wrap:nowrap}
  .family-bar nav a{white-space:nowrap;min-height:36px;font-size:12.5px}
  .alert-banner .container{align-items:center;gap:10px;padding:8px 0}
  .alert-banner #alert-text{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13px;line-height:1.3}
  .alert-banner a{font-size:12px;padding:6px 9px}
  .alert-banner .alert-ico{width:20px;height:20px;font-size:12px}
}

body.mm-lock .chat-open,body.mm-lock .chat-panel{display:none !important}
/* Notice = solid Village gold, black type (Prince 2026-09-25); emergency stays red */
.alert-banner,.alert-banner.is-warning{background:var(--gold);color:#000;border-bottom:1px solid rgba(0,0,0,.15)}
.alert-banner .alert-ico,.alert-banner.is-warning .alert-ico{background:#000;color:var(--gold)}
.alert-banner strong,.alert-banner.is-warning strong{color:var(--gold);background:#000;padding:3px 7px;border-radius:2px;letter-spacing:.14em}
.alert-banner #alert-text,.alert-banner.is-warning #alert-text{color:#111}
.alert-banner a,.alert-banner.is-warning a{background:#000;color:var(--gold)}
.alert-banner a:hover,.alert-banner.is-warning a:hover{background:#333;color:#fff}
.alert-banner .alert-close{border-color:rgba(0,0,0,.5);color:#000;background:#fff}
.alert-banner .alert-close:hover{background:#000;color:var(--gold);border-color:#000}
.alert-banner.is-emergency{background:#b3261e;color:#fff}
.alert-banner.is-emergency .alert-ico{background:#fff;color:#b3261e}
.alert-banner.is-emergency strong{background:#fff;color:#b3261e}
.alert-banner.is-emergency #alert-text{color:#fff}
.alert-banner.is-emergency a{background:#fff;color:#b3261e}
.alert-banner.is-emergency .alert-close{border-color:rgba(255,255,255,.6);color:#fff;background:transparent}

/* ---- Site lock: content and images not copyable or downloadable (Prince 2026-09-25) ---- */
img,picture,video,svg{-webkit-user-drag:none;user-drag:none;-webkit-user-select:none;user-select:none}
main,article,.section,.container,.card,.record,.hero,.feature,.gold-panel,.photo-tiles,.events-panel{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
input,textarea,select,[contenteditable],.admin,.admin *{-webkit-user-select:text;user-select:text}
@media print{body *{display:none!important}body::after{content:"© Village of Schaumburg. Printing and copying are disabled on this preview.";display:block!important;padding:48px;font-size:18px;font-family:inherit}}