/* CityCites platform pages (home, government, intelligence, scores,
   methodology, city profiles). Builds on site.css tokens; keeps the live
   site's look: blue-tinted navy hero, Inter, logo orange for Government,
   logo blue for Intelligence. */

:root{
  --gov:#d63a17;
  --ember:#f85838;
  --ember-soft:#ff9a7a;
  --gov-600:#b02f12;
  --gov-50:#fff2ed;
  --intel:#006de4;
  --intel-600:#0057b8;
  --intel-50:#eaf3fe;
  --navy:#071a3d;
  --navy-2:#0c2550;
  --research:#7c3aed;
  --research-50:#f5f3ff;
}

html,body{min-height:100%}
body{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  background:var(--bg);
  color:var(--ink);
  margin:0;
}
.muted{color:var(--muted)}
.small-caps{font-size:.75rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase}

/* ---------- nav (matches live site) ---------- */
.navbar{background:var(--navy);box-shadow:0 6px 18px rgba(2,6,23,.2)}
.navbar .navbar-brand,.navbar .nav-link{color:#e5e7eb!important}
.navbar .nav-link:hover{color:#93c5fd!important}
.navbar-brand img{height:36px;width:auto}
.navbar .nav-link.active{color:#fff!important;font-weight:600}
.navbar .nav-login{font-size:.9rem;color:#cbd5e1!important}
.brand-sub{display:block;font-size:.62rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:#94a3b8;line-height:1;margin-top:2px}

.btn-cta{background:var(--brand);color:#fff;border:none}
.btn-cta:hover{background:var(--brand-600);color:#fff}
.btn-trust{background:var(--trust);color:#fff;border:none}
.btn-trust:hover{background:var(--trust-600);color:#fff}
.btn-outline{border:1px solid var(--line);background:var(--panel);color:var(--ink)}
.btn-outline:hover{border-color:var(--brand);color:var(--brand);background:#eaf3fe}
.btn-ghost-light{border:1px solid rgba(255,255,255,.28);color:#e5e7eb;background:transparent}
.btn-ghost-light:hover{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.5)}

/* ---------- hero ---------- */
.pc-hero{
  position:relative;
  padding:clamp(48px,8vw,104px) 0 clamp(56px,7vw,88px);
  background:
    radial-gradient(1200px 600px at 85% -20%, rgba(0,109,228,.24), transparent 60%),
    radial-gradient(1000px 600px at -10% 10%, rgba(248,88,56,.22), transparent 55%),
    var(--navy);
  color:#e5e7eb;
}
.pc-hero.gov{background:radial-gradient(1200px 600px at 80% -20%, rgba(248,88,56,.28), transparent 60%),radial-gradient(1000px 600px at -10% 10%, rgba(0,109,228,.14), transparent 55%),var(--navy)}
.pc-hero.intel{background:radial-gradient(1200px 600px at 80% -20%, rgba(0,109,228,.30), transparent 60%),radial-gradient(900px 500px at -10% 20%, rgba(248,88,56,.14), transparent 55%),var(--navy)}
.pc-hero h1{font-weight:700;letter-spacing:-.02em;color:#fff}
.pc-hero .lead{color:#e2e8f0;max-width:680px}
.pc-hero .eyebrow{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.3rem .7rem;border-radius:999px;
  border:1px solid rgba(148,163,184,.45);background:rgba(15,23,42,.7);
  font-size:.78rem;font-weight:600;letter-spacing:.04em;color:#e5e7eb;margin-bottom:1rem;
}
.pc-hero .eyebrow i{color:var(--ember-soft)}
.pc-hero.intel .eyebrow i{color:#93c5fd}
.hero-panel{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:16px;backdrop-filter:blur(6px);padding:1.25rem;
}

.section{padding:56px 0}
.section-tight{padding:36px 0}
.section-white{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-head{max-width:760px;margin:0 auto 2rem;text-align:center}
.section-head h2{font-weight:700;letter-spacing:-.01em}
.kicker{font-size:.75rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--brand);margin-bottom:.4rem}
.kicker.gov{color:var(--gov)}
.kicker.research{color:var(--research)}

/* ---------- two paths (home) ---------- */
.paths{margin-top:-56px;position:relative;z-index:2}
.path-card{
  position:relative;height:100%;
  background:var(--panel);border:1px solid var(--line);border-radius:18px;
  box-shadow:0 18px 44px rgba(2,6,23,.10);padding:1.75rem 1.6rem 1.6rem;
  display:flex;flex-direction:column;overflow:hidden;
  transition:transform .2s ease, box-shadow .2s ease;
}
.path-card:hover{transform:translateY(-3px);box-shadow:0 24px 54px rgba(2,6,23,.14)}
.path-card::before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:var(--gov)}
.path-card.intel::before{background:var(--intel)}
.path-card .who{font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gov)}
.path-card.intel .who{color:var(--intel)}
.path-card h2{font-weight:700;font-size:1.55rem;margin:.35rem 0 .5rem}
.path-card .brandline{font-weight:600;color:var(--muted);font-size:.9rem}
.path-card ul{list-style:none;padding:0;margin:1rem 0 1.25rem;display:grid;grid-template-columns:1fr 1fr;gap:.45rem .9rem}
.path-card li{display:flex;gap:.45rem;align-items:flex-start;font-size:.93rem}
.path-card li i{color:var(--gov);margin-top:.1rem}
.path-card.intel li i{color:var(--intel)}
.path-card .audience{font-size:.82rem;color:var(--muted);border-top:1px dashed var(--line);padding-top:.85rem;margin-top:auto;margin-bottom:1rem}
.path-card .btn{align-self:flex-start}
@media (max-width:575.98px){.path-card ul{grid-template-columns:1fr}}

.engine{
  background:linear-gradient(135deg,#071a3d,#0c2f66);color:#e5e7eb;border-radius:18px;
  padding:1.75rem;box-shadow:var(--card-shadow);
}
.engine .flow{display:grid;grid-template-columns:repeat(5,1fr);gap:.6rem;margin-top:1.25rem}
.engine .step{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:.8rem .7rem;font-size:.85rem}
.engine .step strong{display:block;color:#fff;font-size:.92rem;margin-bottom:.2rem}
.engine .step span{color:#cbd5e1}
@media (max-width:991.98px){.engine .flow{grid-template-columns:1fr 1fr}}
@media (max-width:575.98px){.engine .flow{grid-template-columns:1fr}}

/* ---------- generic cards ---------- */
.card-x{background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:var(--card-shadow);padding:1.4rem}
/* Equal heights only for a card that is alone in a grid column; stacked cards size to content. */
.row>[class*="col"]>.card-x:only-child,.row>[class*="col"]>.module:only-child,.row>[class*="col"]>.count-block:only-child{height:100%}
.card-x h3,.card-x h4{font-weight:700}
.card-x h3{font-size:1.15rem}
.card-x .ico{width:2.5rem;height:2.5rem;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--intel-50);color:var(--intel);font-size:1.15rem;margin-bottom:.9rem}
.card-x.gov .ico{background:var(--gov-50);color:var(--gov)}
.card-x p{color:var(--muted);line-height:1.6;margin-bottom:0}
.card-x a.more{display:inline-block;margin-top:.8rem;font-weight:600;text-decoration:none}

/* ---------- score cards ---------- */
.score-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.85rem}
@media (max-width:1199.98px){.score-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:767.98px){.score-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:420px){.score-grid{grid-template-columns:1fr}}
.score-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:1rem 1rem .9rem;box-shadow:var(--card-shadow);display:flex;flex-direction:column}
.score-card .name{font-size:.82rem;font-weight:600;color:var(--muted);min-height:2.2em;line-height:1.25}
.score-card .val{font-size:2.3rem;font-weight:700;letter-spacing:-.02em;line-height:1.05;margin:.3rem 0 .15rem;font-variant-numeric:tabular-nums}
.score-card .val small{font-size:.9rem;color:var(--muted);font-weight:600}
.score-card .meter{height:6px;border-radius:999px;background:#eef1f5;overflow:hidden;margin:.35rem 0 .55rem}
.score-card .meter span{display:block;height:100%;border-radius:999px;background:var(--intel)}
.score-card .sub{font-size:.78rem;color:var(--muted)}
.score-card .sub strong{color:var(--ink)}
.score-card a{font-size:.8rem;font-weight:600;text-decoration:none;margin-top:.55rem}
.score-card.research{border-style:dashed;border-color:#c4b5fd;background:#fcfbff}
.score-card.research .meter span{background:#a78bfa}
.score-card.dark{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);box-shadow:none}
.score-card.dark .name,.score-card.dark .sub{color:#cbd5e1}
.score-card.dark .val{color:#fff}
.score-card.dark .sub strong{color:#fff}
.score-card.dark .meter{background:rgba(255,255,255,.12)}
.score-card.dark.research{background:rgba(124,58,237,.10);border-color:rgba(196,181,253,.45)}
.score-card.dark a{color:#93c5fd}

.pill{white-space:nowrap;display:inline-flex;align-items:center;gap:.3rem;padding:.12rem .5rem;border-radius:999px;font-size:.72rem;font-weight:600;border:1px solid var(--line);background:#fff;color:var(--ink)}
.pill.research{background:var(--research-50);border-color:#ddd6fe;color:var(--research)}
.pill.high{background:#ecfdf5;border-color:#a7f3d0;color:#047857}
.pill.medium{background:#fffbeb;border-color:#fde68a;color:#b45309}
.pill.low{background:#fef2f2;border-color:#fecaca;color:#b91c1c}
.pill.preview{background:#eef4ff;border-color:#bfdbfe;color:#1d4ed8}

/* ---------- profile (hero card) ---------- */
.profile{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:1.3rem}
.profile .head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem}
.profile .head h2{font-size:1.75rem;color:#fff;margin:0;font-weight:700}
.profile .head .meta{color:#94a3b8;font-size:.85rem}
.profile table{width:100%;color:#e5e7eb;font-size:.95rem}
.profile td{padding:.55rem 0;border-top:1px solid rgba(255,255,255,.08)}
.profile td.v{text-align:right;font-weight:700;font-variant-numeric:tabular-nums;color:#fff}
.profile td .bar{display:block;height:4px;border-radius:99px;background:rgba(255,255,255,.12);margin-top:.35rem;overflow:hidden}
.profile td .bar span{display:block;height:100%;background:#60a5fa}
.profile .foot{font-size:.78rem;color:#94a3b8;margin-top:.8rem}

/* ---------- code ---------- */
.code{background:#071a3d;color:#e2e8f0;border-radius:14px;padding:1.1rem 1.2rem;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.82rem;line-height:1.55;overflow:auto;max-height:520px;border:1px solid #1e293b;margin:0}
.code .k{color:#93c5fd}.code .s{color:#86efac}.code .n{color:#fcd34d}.code .c{color:#64748b}
.code-tabs{display:flex;gap:.35rem;margin-bottom:.5rem;flex-wrap:wrap}
.code-tabs .tab{font-size:.78rem;font-weight:600;padding:.3rem .7rem;border-radius:8px;background:#e2e8f0;color:#0f172a}
.code-tabs .tab.on{background:#071a3d;color:#fff}

/* ---------- comparison band ---------- */
.layers{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}
.layer{border-radius:14px;padding:1.2rem;border:1px solid var(--line);background:#fff}
.layer .t{font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.layer h3{font-size:1.05rem;font-weight:700;margin:.3rem 0 .4rem}
.layer p{font-size:.9rem;color:var(--muted);margin:0}
.layer.us{background:linear-gradient(180deg,#eef4ff,#fff);border-color:#93c5fd;box-shadow:0 12px 30px rgba(0,109,228,.12)}
.layer.us .t{color:var(--intel)}
@media (max-width:767.98px){.layers{grid-template-columns:1fr}}

/* ---------- listing mock ---------- */
.mock-browser{border-radius:14px;border:1px solid var(--line);background:#fff;box-shadow:0 22px 50px rgba(2,6,23,.12);overflow:hidden}
.mock-browser .chrome{display:flex;align-items:center;gap:.4rem;padding:.55rem .8rem;background:#f1f5f9;border-bottom:1px solid var(--line)}
.mock-browser .chrome i{width:10px;height:10px;border-radius:50%;background:#cbd5e1;display:inline-block}
.mock-browser .chrome .url{margin-left:.6rem;font-size:.75rem;color:#64748b;background:#fff;border:1px solid var(--line);border-radius:6px;padding:.15rem .6rem;flex:1}
.mock-listing{display:grid;grid-template-columns:1.1fr 1fr;gap:0}
.mock-listing .photo{min-height:260px;background:linear-gradient(160deg,#cbd5e1,#94a3b8);position:relative}
.mock-listing .photo svg{position:absolute;inset:0;margin:auto;opacity:.55}
.mock-listing .info{padding:1.1rem 1.2rem}
.mock-listing .price{font-size:1.5rem;font-weight:700}
.mock-listing .facts{font-size:.85rem;color:var(--muted)}
.mock-module{border:1px solid #bfdbfe;border-radius:12px;padding:.85rem;margin-top:.9rem;background:#f8fbff}
.mock-module .hd{display:flex;justify-content:space-between;align-items:center;font-size:.8rem;font-weight:700;margin-bottom:.5rem}
.mock-module .row-s{display:flex;justify-content:space-between;font-size:.85rem;padding:.25rem 0;border-top:1px solid #e0ecff}
.mock-module .row-s:first-of-type{border-top:0}
.mock-module .row-s b{font-variant-numeric:tabular-nums}
.mock-module .pw{font-size:.68rem;color:#64748b;margin-top:.45rem}
@media (max-width:767.98px){.mock-listing{grid-template-columns:1fr}.mock-listing .photo{min-height:160px}}

/* ---------- tables ---------- */
.table-x{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;font-size:.92rem}
.table-x th{background:#f8fafc;font-size:.75rem;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);font-weight:700;padding:.7rem .9rem;border-bottom:1px solid var(--line);text-align:left}
.table-x td{padding:.75rem .9rem;border-bottom:1px solid var(--line);vertical-align:top}
.table-x tr:last-child td{border-bottom:0}
.table-x code{font-size:.8rem;color:#0057b8;background:#eef4ff;padding:.05rem .3rem;border-radius:4px}
.table-wrap{overflow-x:auto}

/* ---------- formula ---------- */
.formula{background:#fff;border:1px solid var(--line);border-left:4px solid var(--intel);border-radius:12px;padding:1rem 1.2rem;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9rem;line-height:1.7;overflow-x:auto}
.formula.research{border-left-color:var(--research)}
.weights{display:flex;height:34px;border-radius:10px;overflow:hidden;border:1px solid var(--line);margin:.75rem 0 .4rem}
.weights span{display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;padding:0 .3rem}
.weights span.off{background:repeating-linear-gradient(45deg,#e2e8f0,#e2e8f0 6px,#f1f5f9 6px,#f1f5f9 12px)!important;color:#64748b}

/* ---------- method page layout ---------- */
.method-nav{position:sticky;top:84px}
.method-nav a{display:block;padding:.35rem .6rem;border-left:2px solid var(--line);color:var(--muted);text-decoration:none;font-size:.9rem}
.method-nav a:hover{color:var(--intel);border-left-color:var(--intel)}
.method h2{font-size:1.3rem;font-weight:700;margin:2.2rem 0 .8rem;scroll-margin-top:90px}
.method h2:first-child{margin-top:0}
.method p,.method li{line-height:1.7}
.factbox{display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem}
.factbox div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:.8rem .9rem}
.factbox span{display:block;font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.factbox strong{font-size:.95rem}
@media (max-width:767.98px){.factbox{grid-template-columns:1fr 1fr}}

.notice{border-radius:14px;padding:1rem 1.2rem;border:1px solid #ddd6fe;background:var(--research-50);color:#3b0764}
.notice.info{border-color:#bfdbfe;background:#eff6ff;color:#0a4aa0}
.notice.warn{border-color:#fde68a;background:#fffbeb;color:#78350f}
.notice h2,.notice h3{font-size:1rem;font-weight:700;margin-bottom:.35rem}
.notice p:last-child,.notice ul:last-child{margin-bottom:0}

/* ---------- histogram ---------- */
.hist{display:flex;align-items:flex-end;gap:3px;height:120px;padding:0 2px;border-bottom:1px solid #cbd5e1}
.hist div{flex:1;background:#bfdbfe;border-radius:3px 3px 0 0;position:relative;min-height:2px}
.hist div.me{background:var(--intel)}
.hist-axis{display:flex;justify-content:space-between;font-size:.72rem;color:var(--muted);margin-top:.3rem}

/* ---------- component bars (city page) ---------- */
.comp{display:grid;grid-template-columns:minmax(120px,1.2fr) 2fr 3.2rem;gap:.7rem;align-items:center;padding:.45rem 0;border-top:1px solid #f1f5f9;font-size:.88rem}
.comp:first-child{border-top:0}
.comp .w{color:var(--muted);font-size:.75rem}
.comp .track{height:8px;background:#eef1f5;border-radius:99px;overflow:hidden}
.comp .track span{display:block;height:100%;background:var(--intel);border-radius:99px}
.comp .num{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.comp.na{color:var(--muted)}
.comp.na .track{background:repeating-linear-gradient(45deg,#eef1f5,#eef1f5 5px,#f8fafc 5px,#f8fafc 10px)}

.shares div{display:grid;grid-template-columns:minmax(150px,2fr) 3fr 3rem;gap:.6rem;align-items:center;font-size:.85rem;padding:.3rem 0}
.shares .track{display:block;padding:0;height:8px;background:#f1f0fb;border-radius:99px;overflow:hidden}
.shares .track span{display:block;height:100%;background:#a78bfa}
.shares .track.haz span{background:#60a5fa}
.shares b{text-align:right;font-variant-numeric:tabular-nums}

/* ---------- city search ---------- */
.city-search{position:relative;max-width:520px}
.city-search input{border-radius:12px;padding:.8rem 1rem .8rem 2.6rem;border:1px solid var(--line);width:100%;font-size:1rem}
.city-search i{position:absolute;left:.95rem;top:50%;transform:translateY(-50%);color:var(--muted)}
.city-list{columns:4 200px;column-gap:1.5rem}
.city-list a{display:block;padding:.28rem 0;text-decoration:none;color:var(--ink);break-inside:avoid;font-size:.93rem}
.city-list a:hover{color:var(--intel)}
.city-list a span{color:var(--muted);font-size:.8rem}

/* ---------- module grid (government) ---------- */
.module{position:relative;background:#fff;border:1px solid var(--line);border-radius:16px;padding:1.4rem;box-shadow:var(--card-shadow)}
.module .num{position:absolute;top:1.1rem;right:1.2rem;font-size:.75rem;font-weight:700;color:#94a3b8}
.module .ico{width:2.6rem;height:2.6rem;border-radius:12px;background:var(--gov-50);color:var(--gov);display:flex;align-items:center;justify-content:center;font-size:1.2rem;margin-bottom:.9rem}
.module h3{font-size:1.12rem;font-weight:700;margin-bottom:.25rem}
.module .tag{font-size:.82rem;font-weight:600;color:var(--gov);margin-bottom:.5rem}
.module p{color:var(--muted);margin:0;line-height:1.6;font-size:.94rem}
.module.new{border-color:#99f6e4}
.module.new::after{content:"New";position:absolute;top:1rem;right:1rem;font-size:.68rem;font-weight:700;color:var(--gov-600);background:var(--gov-50);border:1px solid #99f6e4;padding:.05rem .45rem;border-radius:999px}
.module.new .num{display:none}

/* ---------- count blocks (server-rendered values) ---------- */
.count-block{background:#fff;border:1px solid var(--line);border-radius:14px;padding:1.1rem;text-align:center}
.count-block .count-value{display:block;font-size:2rem;font-weight:700;color:var(--ink)}
.count-block .count-label{display:block;font-size:.85rem;color:var(--muted);margin-top:.25rem}

/* ---------- preview ribbon ---------- */
.preview-ribbon{background:#fef3c7;color:#78350f;border-bottom:1px solid #fde68a;font-size:.82rem;text-align:center;padding:.4rem 1rem}
.preview-ribbon a{color:#78350f;font-weight:600}

footer{background:var(--navy);color:#e5e7eb;padding:28px 0;border-top:1px solid rgba(255,255,255,.08)}
footer .cols .fh{color:#fff;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;font-weight:700;margin-bottom:.6rem}
footer .cols a{display:block;color:#cbd5e1;text-decoration:none;font-size:.9rem;padding:.15rem 0}
footer .cols a:hover{color:#fff}
footer .legal{border-top:1px solid rgba(255,255,255,.08);margin-top:1.5rem;padding-top:1rem;font-size:.82rem;color:#94a3b8}

/* ---------- interactive: listing demo, compare, meter fills, histogram tips, access bar */
.city-pick{border-radius:10px;border-color:var(--line)}
.mock-module{position:relative}
.mock-module::after{content:"";position:absolute;inset:0;border-radius:inherit;background:#bfdbfe;opacity:0;pointer-events:none}
.mock-module.flash::after{animation:cc-flash .7s ease-out}
@keyframes cc-flash{from{opacity:.6}to{opacity:0}}

.compare-picks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85rem;max-width:860px}
@media (max-width:767.98px){.compare-picks{grid-template-columns:1fr}}
.compare-table td,.compare-table th{vertical-align:middle}
.compare-table th a{color:var(--ink);text-decoration:none;font-size:.85rem;text-transform:none;letter-spacing:0}
.compare-table th a:hover{color:var(--intel)}
.compare-table td.lbl a{color:var(--ink);font-weight:600;text-decoration:none}
.compare-table td.lbl a:hover{color:var(--intel)}
.compare-table td.val{min-width:120px}
.compare-table td.val strong{font-size:1.15rem;font-variant-numeric:tabular-nums}
.cmp-bar{display:block;height:5px;border-radius:99px;background:#eef1f5;overflow:hidden;margin-top:.3rem;max-width:160px}
.cmp-bar span{display:block;height:100%;background:var(--intel);border-radius:99px;transition:width .35s ease}

.fill-ready .score-card .meter span,.fill-ready .comp .track span,.fill-ready .profile .bar span{transform:scaleX(0);transform-origin:left center;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.fill-ready .score-card .meter span.filled,.fill-ready .comp .track span.filled,.fill-ready .profile .bar span.filled{transform:none}

.hist div{cursor:default;outline:none}
.hist div:hover,.hist div:focus-visible{filter:brightness(.88)}
.hist div:focus-visible{box-shadow:0 0 0 2px var(--intel)}
.hist div::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);white-space:nowrap;background:#0f172a;color:#fff;font-size:.72rem;font-weight:600;padding:.25rem .5rem;border-radius:6px;display:none;pointer-events:none;z-index:2}
.hist div:hover::after,.hist div:focus-visible::after{display:block}
.hist div:first-child::after{left:0;transform:none}
.hist div:last-child::after{left:auto;right:0;transform:none}

.access-bar{position:fixed;left:0;right:0;bottom:0;z-index:1030;background:#0f172a;color:#e5e7eb;padding:.7rem 0 calc(.7rem + env(safe-area-inset-bottom));box-shadow:0 -8px 24px rgba(2,6,23,.18)}
.access-bar[hidden]{display:none}
@media (max-width:575.98px){.access-bar p{font-size:.8rem}}

@media (prefers-reduced-motion:reduce){.cmp-bar span{transition:none}}

/* City profile sidebar follows the reader instead of leaving the right column empty. */
@media (min-width:992px){.side-sticky{position:sticky;top:1.5rem}}

/* Climate hazard factors: bar length = exposure vs. the U.S., color = level. */
.shares.factors>div{grid-template-columns:minmax(140px,2fr) 3fr 5.2rem}
.shares.factors .fx{display:block;padding:0;font-size:.74rem;color:var(--muted);font-weight:400;line-height:1.3;margin-top:.1rem}
.shares.factors b{font-size:.78rem;font-weight:600;white-space:nowrap}
.track.haz.lv-very-low span{background:#94a3b8}
.track.haz.lv-low span{background:#60a5fa}
.track.haz.lv-moderate span{background:#f59e0b}
.track.haz.lv-high span{background:#ea580c}
.track.haz.lv-very-high span{background:#b91c1c}

/* ---------- accessibility and touch (web interface guidelines audit) */
.skip-link{position:absolute;left:1rem;top:-3rem;z-index:2000;background:#fff;color:var(--ink);padding:.55rem .9rem;border-radius:8px;font-weight:600;box-shadow:var(--card-shadow);text-decoration:none}
.skip-link:focus{top:.75rem}
main:focus{outline:none}
h1,h2,h3,.h1,.h2,.h3{text-wrap:balance}
a,button,select,input,label,[role="listitem"]{touch-action:manipulation}
/* Keep focused elements clear of the fixed access bar. */
html.has-access-bar{scroll-padding-bottom:5rem}

/* ---------- photography and graphics (2026-10 refresh) ---------- */
/* Photo heroes: the photo sits under a navy wash that is darkest behind the text. */
.pc-hero.photo{
  background:
    linear-gradient(100deg, rgba(7,26,61,.93) 0%, rgba(7,26,61,.72) 42%, rgba(7,26,61,.2) 100%),
    var(--hero-img) center/cover no-repeat,
    var(--navy);
}
.pc-hero.gov.photo{
  background:
    linear-gradient(100deg, rgba(7,26,61,.93) 0%, rgba(7,26,61,.72) 45%, rgba(122,40,18,.25) 100%),
    var(--hero-img) center/cover no-repeat, var(--navy);
}
.pc-hero.intel.photo{
  background:
    linear-gradient(100deg, rgba(7,26,61,.93) 0%, rgba(7,26,61,.72) 45%, rgba(0,72,160,.25) 100%),
    var(--hero-img) center/cover no-repeat, var(--navy);
}
@media (max-width:991.98px){
  .pc-hero.photo,.pc-hero.gov.photo,.pc-hero.intel.photo{
    background:linear-gradient(rgba(7,26,61,.8), rgba(7,26,61,.88)), var(--hero-img) center/cover no-repeat, var(--navy);
  }
}

/* Photo across the top of the two product cards. */
.path-card::before{z-index:1}
.path-img{
  display:block;width:calc(100% + 3.2rem);max-width:none;margin:-1.75rem -1.6rem 1.25rem;
  height:auto;aspect-ratio:16/7;object-fit:cover;
}

/* Nav dropdowns */
.navbar .dropdown-menu{background:var(--navy-2);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:.4rem;box-shadow:0 18px 40px rgba(2,6,23,.45);min-width:15rem}
.navbar .dropdown-item{color:#e5e7eb;border-radius:8px;padding:.5rem .75rem;font-size:.92rem}
.navbar .dropdown-item:hover,.navbar .dropdown-item:focus{background:rgba(147,197,253,.12);color:#fff}
.navbar .dropdown-divider{border-color:rgba(255,255,255,.1)}
.dd-sub{display:block;font-size:.76rem;color:#94a3b8;margin-top:1px}
@media (max-width:991.98px){.navbar .dropdown-menu{box-shadow:none;border:0;background:transparent;padding-left:.75rem}}

/* Score dials on the home page */
.rings{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem}
.ring-item{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.45rem;text-decoration:none;color:var(--ink);padding:.75rem .25rem;border-radius:14px}
.ring-item:hover{background:#f1f5f9;color:var(--ink)}
.ring-item:focus-visible{outline:2px solid var(--intel);outline-offset:2px}
.ring-item span{font-weight:600;font-size:.9rem;line-height:1.25}
.ring-item em{font-style:normal;font-size:.72rem;color:var(--research);font-weight:600}
.ring{width:100%;max-width:104px;height:auto}
.ring-bg{fill:none;stroke:#e2e8f0;stroke-width:8}
.ring-fg{fill:none;stroke-width:8;stroke-linecap:round;transform:rotate(-90deg);transform-origin:42px 42px}
.ring text{font:700 20px Inter,system-ui,sans-serif;fill:var(--ink)}
@media (max-width:767.98px){.rings{grid-template-columns:repeat(3,1fr)}}
@media (max-width:420px){.rings{grid-template-columns:repeat(2,1fr)}}

/* Customers page */
.seg-group+.seg-group{margin-top:3.5rem}
.seg-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.5rem 1.5rem;margin-bottom:1.25rem}
.seg-head h2{font-weight:700;font-size:1.5rem;margin:0}
.seg{height:100%;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:1.4rem;border-top:4px solid var(--gov)}
.seg.intel{border-top-color:var(--intel)}
.seg-ico{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:1.25rem;background:var(--gov-50);color:var(--gov-600);margin-bottom:.9rem}
.seg.intel .seg-ico{background:var(--intel-50);color:var(--intel-600)}
.seg h3{font-size:1.1rem;font-weight:700;margin-bottom:.2rem}
.seg .who{font-size:.85rem;color:var(--muted);margin-bottom:.75rem}
.seg .ask{font-size:1rem;margin-bottom:.75rem}
.seg .uses{font-size:.85rem;color:var(--muted);margin-bottom:1rem}
.seg .uses strong{display:block;color:var(--ink);font-size:.8rem}
.seg a{margin-top:auto;font-weight:600;font-size:.9rem}
.cta-band{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 2rem;
  background:linear-gradient(135deg,#071a3d,#0c2f66 55%,#0a4aa0);color:#cbd5e1;border-radius:18px;padding:1.75rem 2rem}
.cta-band h2{color:#fff}

/* API docs */
.method .steps{padding-left:1.2rem}
.method .steps li{margin-bottom:.5rem}
.verb{display:inline-block;font-size:.7rem;font-weight:700;color:#fff;background:var(--gov);border-radius:6px;padding:.1rem .4rem;margin-right:.5rem;vertical-align:1px}
.code.wrap{white-space:pre-wrap;overflow-wrap:anywhere}

/* ---------- coverage tile map ---------- */
.tilemap{display:grid;grid-template-columns:repeat(12,1fr);gap:4px;max-width:640px;margin:0 auto}
.tilemap .tile{aspect-ratio:1;display:grid;place-items:center;border-radius:6px;font-size:.72rem;font-weight:700;
  text-decoration:none;position:relative;outline:none}
.tilemap a.tile:hover,.tilemap a.tile:focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--intel);z-index:3}
.tilemap a.tile::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);
  white-space:nowrap;background:#0f172a;color:#fff;font-size:.72rem;font-weight:600;padding:.25rem .5rem;border-radius:6px;
  display:none;pointer-events:none;z-index:4}
.tilemap a.tile:hover::after,.tilemap a.tile:focus-visible::after{display:block}
.map-legend{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.35rem .9rem;font-size:.78rem;color:var(--muted);margin-top:.75rem}
.map-legend b{color:var(--ink);font-weight:600;margin-right:.25rem}
.map-legend span{display:inline-flex;align-items:center;gap:.3rem}
.map-legend i{width:12px;height:12px;border-radius:3px;display:inline-block}
.tilemap.mini{max-width:220px;gap:2px;margin:0 0 .9rem}
.tilemap.mini .tile{background:#e2e8f0;border-radius:3px;font-size:.55rem;color:#fff}
.tilemap.mini .tile.on{background:var(--intel)}
.state-chip{display:flex;align-items:center;gap:.6rem;margin:1rem 0;font-size:.9rem}
@media (max-width:575.98px){.tilemap{gap:2px}.tilemap .tile{font-size:.55rem;border-radius:3px}}

/* ---------- methodology flow ---------- */
.flowchart{display:grid;grid-template-columns:1fr auto 1.15fr auto 1fr;gap:.75rem;align-items:center;margin:.5rem 0 0}
.fc-col{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:1rem}
.fc-h{font-size:.8rem;font-weight:700;color:var(--muted);margin-bottom:.6rem}
.fc-col ul,.fc-col ol{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.fc-col li{display:flex;align-items:center;gap:.5rem;font-size:.88rem;font-weight:600}
.fc-col li i{color:var(--intel);font-size:1rem}
.fc-steps{background:linear-gradient(160deg,#071a3d,#0a4aa0);border-color:transparent;color:#fff}
.fc-steps .fc-h{color:#93c5fd}
.fc-steps li i{color:var(--ember-soft)}
.fc-steps li span{width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-items:center;font-size:.72rem}
.fc-arrow{color:var(--muted);font-size:1.4rem}
@media (max-width:767.98px){.flowchart{grid-template-columns:1fr}.fc-arrow{transform:rotate(90deg);justify-self:center}}

/* ---------- API request flow ---------- */
.apiflow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:.6rem;align-items:center;margin:1.25rem 0 1.5rem}
.af-node{border:1px solid var(--line);background:var(--panel);border-radius:14px;padding:.9rem;text-align:center;display:flex;flex-direction:column;gap:.15rem}
.af-node i{font-size:1.4rem;color:var(--intel)}
.af-node b{font-size:.92rem}
.af-node span{font-size:.78rem;color:var(--muted)}
.af-node.core{background:linear-gradient(160deg,#071a3d,#0a4aa0);border-color:transparent;color:#fff}
.af-node.core i{color:#93c5fd}
.af-node.core span{color:#cbd5e1}
.af-edge{display:flex;flex-direction:column;align-items:center;font-size:.72rem;color:var(--muted);text-align:center;max-width:110px}
.af-edge i{font-size:1.2rem}
.af-back{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:.5rem;font-size:.85rem;font-weight:600;
  border:1px dashed #93c5fd;border-radius:10px;padding:.5rem;color:var(--intel-600);background:var(--intel-50)}
@media (max-width:767.98px){.apiflow{grid-template-columns:1fr}.af-edge{flex-direction:row;gap:.4rem;max-width:none;justify-self:center}.af-edge i{transform:rotate(90deg)}}

/* ---------- illustrative dashboard (Government hero) ---------- */
.dash-mock{background:#fff;border-radius:12px;overflow:hidden;color:var(--ink);box-shadow:0 20px 50px rgba(2,6,23,.35)}
.dm-top{display:flex;align-items:center;gap:5px;background:#f1f5f9;padding:.45rem .7rem;border-bottom:1px solid var(--line)}
.dm-dot{width:8px;height:8px;border-radius:50%;background:#cbd5e1}
.dm-url{margin-left:.5rem;font-size:.72rem;color:var(--muted);background:#fff;border-radius:6px;padding:.1rem .5rem;flex:1}
.dm-body{padding:1rem 1.1rem .9rem}
.dm-title{display:flex;justify-content:space-between;align-items:flex-start;gap:.5rem;margin-bottom:.6rem}
.dm-title small{display:block;font-size:.72rem;color:var(--muted)}
.dm-title b{font-size:1rem}
.dm-badge{font-size:.68rem;font-weight:700;color:var(--gov-600);background:var(--gov-50);border-radius:999px;padding:.2rem .5rem;white-space:nowrap}
.dm-badge i{margin-right:.2rem}
.dm-row{display:grid;grid-template-columns:120px 1fr;gap:1rem;align-items:center}
.dm-donut{width:120px;height:120px}
.dm-big{font:700 13px Inter,system-ui,sans-serif;fill:var(--ink)}
.dm-small{font:500 7px Inter,system-ui,sans-serif;fill:#64748b}
.dm-legend{list-style:none;margin:0;padding:0;display:grid;gap:.3rem}
.dm-legend li{display:grid;grid-template-columns:10px 1fr auto;gap:.45rem;align-items:center;font-size:.8rem}
.dm-legend i{width:10px;height:10px;border-radius:3px}
.dm-legend b{font-weight:700}
.dm-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:.9rem}
.dm-kpis div{background:#f8fafc;border:1px solid var(--line);border-radius:10px;padding:.5rem;text-align:center}
.dm-kpis b{display:block;font-size:1rem}
.dm-kpis span{font-size:.7rem;color:var(--muted)}
.dm-cap{font-size:.7rem;color:var(--muted);text-align:center;padding:0 0 .6rem}
@media (max-width:420px){.dm-row{grid-template-columns:1fr;justify-items:center}}

/* ---------- score page header dial ---------- */
.hero-dial{display:flex;align-items:center;gap:1rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:1rem 1.2rem}
.hd-ring{width:96px;flex-shrink:0}
.hd-ring .ring-bg{stroke:rgba(255,255,255,.15)}
.hd-ring .ring text{fill:#fff}
.hero-dial b{display:block;color:#fff}
.hero-dial span{display:block;font-size:.82rem;color:#cbd5e1}
.hero-dial a{font-size:.85rem;color:#93c5fd}

/* ---------- photo banners ---------- */
.seg-banner{display:block;width:100%;height:auto;aspect-ratio:16/5;object-fit:cover;border-radius:16px;margin-bottom:1.25rem}
.about-photo{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:18px;box-shadow:0 20px 50px rgba(2,6,23,.25)}

/* ---------- political lean meter (2027.2) ---------- */
.lean-wrap{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:1.25rem;align-items:center}
.lean-meter{width:100%;height:auto;display:block;overflow:visible}
.lean-label{font-size:1.6rem;font-weight:800;line-height:1.1;margin-bottom:.35rem;padding-left:.6rem;border-left:6px solid var(--lean)}
@media (max-width:575px){.lean-wrap{grid-template-columns:1fr}.lean-meter{max-width:380px;margin:0 auto}}
.lean-sw{display:inline-block;width:.9rem;height:.9rem;border-radius:3px;margin-right:.5rem;vertical-align:-2px}

/* ---------- city directory: state dropdown + search ---------- */
.dir-controls{display:flex;flex-wrap:wrap;gap:1rem;align-items:flex-end;margin-top:1.25rem;scroll-margin-top:96px}
.dir-state{flex:0 1 280px;display:flex;flex-direction:column}
.dir-state .form-select{border-radius:12px;padding:.8rem 2.2rem .8rem 1rem;border:1px solid var(--line);font-size:1rem}
.dir-search{flex:1 1 320px;display:flex;flex-direction:column}
.dir-search .city-search{max-width:none}

/* ---------- home and nav, 2026-10-30: find-my-city first ---------- */
.navbar .nav-link.nav-find{border:1px solid rgba(248,88,56,.55);border-radius:99px;padding:.35rem .9rem!important;color:var(--ember-soft)!important;font-weight:600}
.navbar .nav-link.nav-find:hover,.navbar .nav-link.nav-find.active{background:rgba(248,88,56,.12);color:#fff!important}
@media (max-width:991.98px){.navbar .nav-link.nav-find{display:inline-block;margin:.4rem 0}}

.home-hero{position:relative;overflow:hidden;text-align:center;color:#fff;padding:96px 0 230px;min-height:82vh;
  background:linear-gradient(180deg,rgba(7,26,61,.82) 0%,rgba(7,26,61,.55) 55%,rgba(7,26,61,.25) 100%),var(--hero-img) center 70%/cover no-repeat,var(--navy)}
.home-hero .container{position:relative;z-index:2}
.home-hero h1{font-size:clamp(2.2rem,5.6vw,4.2rem);font-weight:800;letter-spacing:-.03em;line-height:1.05;margin:0 0 .6rem;color:#fff}
.home-sub{font-size:1.15rem;color:#cbd5e1;margin:0 auto 1.8rem;max-width:36rem}
.hero-search{position:relative;display:flex;align-items:center;gap:.5rem;max-width:640px;margin:0 auto;background:#fff;border-radius:99px;padding:.4rem .4rem .4rem 1.1rem;box-shadow:0 20px 50px rgba(0,0,0,.35)}
.hero-search>i{color:var(--gov);font-size:1.2rem}
.hero-search input{flex:1;min-width:0;border:0;outline:0;font-size:1.05rem;color:#0f172a;background:transparent;padding:.55rem 0}
.hero-search .btn{background:var(--gov);color:#fff;border-radius:99px;padding:.7rem 1.3rem;font-weight:600;white-space:nowrap}
.hero-search .btn:hover{background:var(--gov-600);color:#fff}
.hero-search:focus-within{box-shadow:0 0 0 3px rgba(248,88,56,.6),0 20px 50px rgba(0,0,0,.35)}
.ac-list{position:absolute;left:0;right:0;top:calc(100% + .5rem);list-style:none;margin:0;padding:.35rem;background:#fff;border-radius:16px;box-shadow:0 18px 40px rgba(0,0,0,.25);text-align:left;z-index:5}
.ac-list a{display:block;padding:.55rem .9rem;border-radius:10px;color:#0f172a;text-decoration:none}
.ac-list li.on a,.ac-list a:hover{background:#fff2ed}
.hero-browse{display:inline-block;margin-top:1.2rem;color:#93c5fd;text-decoration:none;font-size:.95rem}
.hero-browse:hover{color:#fff}
.skyline{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:220px;object-fit:cover;object-position:bottom;z-index:1;pointer-events:none}
@media (max-width:575.98px){
  .home-hero{padding:64px 0 170px;min-height:0}
  .hero-search{flex-wrap:wrap;border-radius:20px;padding:.6rem}
  .hero-search .btn{width:100%}
  .skyline{height:140px}
}
.home-h{text-align:center;font-weight:800;letter-spacing:-.02em;font-size:clamp(1.5rem,3vw,2.1rem);margin-bottom:1.6rem}
.prod-tile{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:260px;border-radius:20px;overflow:hidden;padding:1.5rem;color:#fff;text-decoration:none;isolation:isolate}
.prod-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .5s ease}
.prod-tile::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,26,61,.05),rgba(7,26,61,.88))}
.prod-tile.gov::after{background:linear-gradient(180deg,rgba(7,26,61,.05),rgba(122,40,18,.92))}
.prod-tile.intel::after{background:linear-gradient(180deg,rgba(7,26,61,.05),rgba(0,72,160,.92))}
.prod-tile:hover img{transform:scale(1.04)}
.prod-tile .who{font-size:.8rem;color:#99f6e4;font-weight:600}
.prod-tile strong{font-size:1.45rem;line-height:1.2}
.prod-tile span:last-child{color:#e2e8f0}
.cta-skyline{position:relative;overflow:hidden;text-align:center;padding:72px 0 210px;background:linear-gradient(180deg,#071a3d,#0c2f66)}
.cta-skyline .container{position:relative;z-index:2}
.cta-skyline h2{color:#fff;font-weight:800;letter-spacing:-.02em;font-size:clamp(1.8rem,4vw,2.8rem);margin-bottom:1.2rem}
@media (prefers-reduced-motion:reduce){.prod-tile img{transition:none}}
.home-hero.scores-hero{min-height:0;padding:84px 0 210px}
@media (max-width:575.98px){.home-hero.scores-hero{padding:56px 0 160px}}
