/* v4 city page: owner's design (prototype v_full03), ported to the live app. Tokens, base, components, hero, dispatch, city rules. */
/* КОМПОНЕНТЫ ДЛЯ СТРОИТЕЛЕЙ (foundation 2026-11-04). Shared by every v4 page (templates/v4_base.html loads this file,
   then css/v4-<key>.css). Reuse these classes; put page-only rules in v4-<key>.css, never edit the ones below.
   Interaction (SW-01/02/03): hover and focus for every link type live in ONE block at the end of v4-components.css; do not add
   page-level :hover colour rules that fight it. The keyboard ring is the --ring token (navy; white on dark bands), never orange.
   Tokens: --navy --navy-2 --orange --orange-2 --orange-soft --orange-dark --ink --muted --paper --pale --sand --line
           --night --cream --cream-2 --head (Fraunces) --body (Source Sans 3) --radius
   Layout:  .wrap (1240 px column)  .section (88 px vertical padding)  .section-head (+ .light on navy)  .lede  .micro
            .v4 (page wrapper, set by the shell)  .area-top  .area-grid (3 columns)  .faq-grid + .faq-list (details/summary)
            .rules-section (navy band) + .rules-grid + .rule (+ .rule-more .rule-fed .rule-none, <cite>)
            .season-section .season-grid .season-strip  .storm-grid .storm-side .storm-list .storm-rule (+ .storm-extra)
            .dispatch-section .dispatch-grid .dispatch-form .dispatch-field  .hx8-win .hx8-bar .hx8-log .hx8-foot (chat window)
   Hero:    .hero (+ .dark: the only dark block allowed)  .hx-grid (+ .solo)  .hero-copy  .sub  .zip-form .field-action
            .hint .error  .promise  .note (+ .i)   #hero / #start-form / #location are wired by v4-shell.js
   Buttons: .button  .button.orange (ONE per page)  .button.dark  .button.outline  .text-link  .icon-button  .segmented (+ button.active)
   Cards:   .area-card (+ .hail-card, .big, small)  .card-head  .profile-card .profile-head .profile-links  .cy-card
            .rr .rr-grid .rr-card (+ .rr-photo .rr-number .rr-steps .rr-plain) .rr-body .rr-kind .rr-fact .rr-big .rr-ol
   Icons:   .ic-tile (+ .sm, .dark) around {{ ic.icon(name) }} from _icons.html; .ico
   Data:    .bars (12 columns, div height %, .peak, <i> value, <span> label)  .cy-meter (+ .site; <i style="--w:42%">)
            .cy-tablewrap + .cy-towns (table: thead/tbody/tfoot)  .cy-badge (+ .no)  .cy-photo (figure + figcaption)
            .cy-crumb (breadcrumb ol)  .cy-vh (visually hidden)  .cancel-calc .date-field
   Shell (do not restyle): .header .v4-header .header-row .brand .main-nav .mobile-nav .menu-toggle .phone .v4-adminbar
            .footer .footer-top .footer-menu .footer-bottom  .sticky-cta  .helper .helper-btn .helper-panel .helper-q .helper-a
            dialog#request-dialog .dialog-* .consent-label .confirmation-icon  #toast (+ .visible)
   Laws: light page, navy #102D50 / orange #F26A21; dark only in the hero; one orange button; no ALL CAPS labels, no
   "01 /" numbering, no arrows, no fade-up or hover jumps. An element with its own display (flex/grid) that uses [hidden]
   needs `.x[hidden]{display:none}`. */
/* Fonts are ours (SW-10): latin subset woff2, preloaded in v4_base.html. The fallback faces take the metrics of Times New Roman and
   Arial (size-adjust / ascent-override computed from the font files), so the swap does not move the text. */
@font-face{font-family:Fraunces;font-style:normal;font-weight:300 800;font-display:swap;src:url(/static/fonts/fraunces-latin.woff2?v=1) format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:300 800;font-display:swap;src:url(/static/fonts/source-sans-3-latin.woff2?v=1) format("woff2")}
@font-face{font-family:"Fraunces Fallback";src:local("Times New Roman"),local("Liberation Serif"),local(Times);size-adjust:104%;ascent-override:94%;descent-override:24.5%;line-gap-override:0%}
@font-face{font-family:"Source Sans 3 Fallback";src:local(Arial),local("Liberation Sans"),local(Helvetica);size-adjust:94.7%;ascent-override:108%;descent-override:42%;line-gap-override:0%}
:root{
  --ring:var(--navy);
  --navy:#102D50;--navy-2:#1B3F6B;--orange:#F26A21;--orange-2:#D95A14;
  --ink:#16243A;--muted:#4C5B6E;--paper:#FFFFFF;--pale:#F4F6F9;--sand:#F7F3EC;--line:#D9E0E8;
  --night:#070B16;--night-2:#0F1730;--cream:#F6EFE3;--cream-2:rgba(246,239,227,.78);
  --head:Fraunces,'Fraunces Fallback',Georgia,serif;--body:'Source Sans 3','Source Sans 3 Fallback',Arial,sans-serif;--radius:14px;
}
h1,h2,h3{font-variation-settings:"opsz" 72}
.hero.dark,.rules-section{--ring:#fff}
/* light cards that sit inside a dark band keep the navy ring: a white ring on a white card is invisible */
.hx4-record,.hub-card,.vf-record,.cancel-calc,.cl-calc,.cp-ch,.hero.light{--ring:var(--navy)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:16px;scroll-padding-bottom:16px;-webkit-text-size-adjust:100%}
body{margin:0;color:var(--ink);background:var(--paper);font:17px/1.55 var(--body);-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit}
button,a,summary,label,input,select,textarea,[role=button]{touch-action:manipulation}
button,a{-webkit-tap-highlight-color:transparent}
button{cursor:pointer;color:inherit}
a{color:var(--navy-2);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-family:var(--head);line-height:1.08;letter-spacing:-.01em;color:var(--navy)}
h2{font-size:clamp(30px,3.2vw,42px);font-weight:620}
h3{font-size:22px;font-weight:600;line-height:1.2}
p{color:var(--muted)}
:is(a,button,summary,input,select,textarea,[tabindex]):focus-visible{outline:3px solid var(--ring);outline-offset:3px}
.skip{position:absolute;left:-999px;top:8px;background:var(--navy);color:#fff;padding:0 16px;display:inline-flex;align-items:center;min-height:44px;z-index:50}
.skip:focus{left:8px}
.wrap{max-width:1240px;margin:auto;padding-left:32px;padding-right:32px}
.section{padding-top:88px;padding-bottom:88px}
.section-head{max-width:720px;margin-bottom:40px}
.section-head p{font-size:19px;margin-top:12px}
.section-head.light h2{color:#fff}.section-head.light p{color:var(--cream-2)}
.micro{font-size:14px;line-height:1.5;color:var(--muted)}
.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:16px;top:16px;z-index:1000;background:#fff;color:var(--navy);display:inline-flex;align-items:center;min-height:44px;min-width:44px;padding:0 16px;font-weight:700;border-radius:8px}
.v4-adminbar{background:var(--navy);color:#fff;font-size:13px;line-height:1.4;padding:6px 16px;text-align:center}.v4-adminbar a{color:#fff}
/* buttons */
.button{min-height:52px;display:inline-flex;align-items:center;justify-content:center;padding:12px 24px;border-radius:10px;font-weight:700;font-size:18px;border:1px solid transparent;text-decoration:none;text-align:center;transition:background .15s,border-color .15s}
.button.orange{background:var(--orange);color:var(--navy)}
.button.orange:hover{background:var(--orange-dark);color:#fff}
.button.dark{background:var(--navy);color:#fff}
.button.dark:hover{background:var(--navy-2)}
.button.outline{background:transparent;color:var(--navy);border-color:var(--navy)}
.button.outline:hover{background:var(--navy);color:#fff}
.text-link{display:inline-flex;align-items:center;min-height:44px;font-weight:650;font-size:16px;background:none;border:0;padding:0;color:var(--navy-2);text-decoration:underline;text-underline-offset:3px}
.error{color:#B42318;font-size:15px;min-height:1.3em;margin:6px 0 0}
.error:empty{display:none}
.header{background:var(--paper);border-bottom:1px solid var(--line);position:relative;z-index:5}
.header-row{display:flex;align-items:center;gap:28px;min-height:72px}
.brand{display:inline-flex;align-items:center;min-height:44px;gap:10px;font:700 22px/1 var(--head);color:var(--navy);text-decoration:none;letter-spacing:-.02em}
.brand svg{width:28px;height:28px;fill:none;stroke:var(--orange);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.main-nav{display:flex;gap:22px;margin-left:12px}
.main-nav a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;text-decoration:none;color:var(--ink);font-weight:500;white-space:nowrap}
.phone{margin-left:auto;text-align:right;line-height:1.2}
.phone a{display:inline-flex;align-items:center;min-height:44px;font:700 18px/1.2 var(--head);color:var(--navy);text-decoration:none}
.phone small{display:block;font-size:14px;color:var(--muted)}
.menu-toggle{display:none;min-height:44px;padding:8px 14px;border:1px solid var(--line);border-radius:8px;background:#fff}
.mobile-nav{display:none;flex-direction:column;border-top:1px solid var(--line);background:#fff}
.mobile-nav a{padding:14px 24px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.mobile-nav:not([hidden]){display:flex}
.lede{font-size:18px;margin-top:16px}
.stat-line{margin-top:22px;font-size:17px;color:var(--ink)}
.stat-line b{color:var(--navy);font-size:20px}
.profile-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.profile-head{display:flex;gap:14px;align-items:center;margin-bottom:14px}
.profile-head b{font:600 20px/1.2 var(--head);color:var(--navy);display:block}
.profile-head small{color:var(--muted);font-size:14px}
.seal{width:40px;height:40px;border-radius:50%;background:var(--navy);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;flex:0 0 40px}
.profile-card dl{margin:0;display:grid;gap:0}
.profile-card dl div{display:grid;grid-template-columns:1fr 1.2fr;gap:12px;padding:10px 0;border-top:1px solid var(--line);font-size:15.5px}
.profile-card dt{color:var(--muted)}.profile-card dd{margin:0;color:var(--ink);font-weight:600}
.profile-links{display:flex;gap:18px;flex-wrap:wrap;margin-top:16px;font-size:15px}
.segmented{display:flex;gap:8px;flex-wrap:wrap}
.segmented button{min-height:44px;padding:8px 18px;border:1px solid var(--line);background:#fff;border-radius:999px;font-weight:600;font-size:16px;color:var(--ink)}
.segmented button.active{background:var(--navy);color:#fff;border-color:var(--navy)}
.area-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:24px}
.area-card{background:var(--pale);border-radius:var(--radius);padding:24px;display:flex;flex-direction:column;gap:10px}
.area-card.hail-card{grid-column:span 3;background:var(--paper);border:1px solid var(--line)}
.area-card .big{font:600 26px/1.2 var(--head);color:var(--navy)}
.area-card small{font-size:14px;color:var(--muted);margin-top:auto}
.bars{display:grid;grid-template-columns:repeat(12,1fr);gap:6px;align-items:end;height:150px;padding-top:8px}
.bars div{position:relative;background:var(--navy-2);border-radius:4px 4px 0 0;min-height:2px}
.bars div.peak{background:var(--orange)}
.bars div span{position:absolute;left:0;right:0;bottom:-22px;text-align:center;font-size:14px;color:var(--muted)}
.bars div i{position:absolute;left:0;right:0;top:-20px;text-align:center;font-size:14px;font-style:normal;color:var(--ink)}
.hail-card p{margin-top:28px}
.snapshot-note{font-size:14px;color:var(--muted);margin-top:18px}
.faq-grid{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:48px}
.faq-list details{border-top:1px solid var(--line);padding:4px 0}
.faq-list details:last-child{border-bottom:1px solid var(--line)}
.faq-list summary{cursor:pointer;list-style:none;padding:16px 36px 16px 0;position:relative;font:600 18px/1.3 var(--head);color:var(--navy)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"+";position:absolute;right:4px;top:12px;font-size:24px;color:var(--muted)}
.faq-list details[open] summary::after{content:"–"}
.faq-list p{padding:0 0 18px}
.footer{background:var(--pale);border-top:1px solid var(--line);padding:40px 0;font-size:15px}
.footer-top{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;margin-bottom:20px}
.footer-bottom{display:flex;gap:24px;flex-wrap:wrap;color:var(--muted)}
.footer-menu{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;padding:28px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:20px}
.ft-h{font:600 17px/1.2 var(--head);font-variation-settings:"opsz" 72;letter-spacing:-.01em;color:var(--navy);margin:0 0 10px}
.footer-menu a{display:block;color:var(--ink);text-decoration:none;padding:5px 0;font-size:15px}
.footer-menu small{display:block;color:var(--muted);font-size:13px}
@media (max-width:900px){.footer-menu{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.footer-menu{grid-template-columns:1fr}}
dialog{border:0;border-radius:16px;padding:0;width:min(560px,calc(100% - 32px));max-height:calc(100vh - 32px);overflow:auto;color:var(--ink);box-shadow:0 30px 80px rgba(0,0,0,.4)}
dialog::backdrop{background:rgba(7,11,22,.6)}
.dialog-head{display:flex;justify-content:space-between;align-items:center;padding:18px 24px 0}
.dialog-kicker{font-weight:600;color:var(--muted);font-size:14px}
.icon-button{width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:#fff;font-size:22px}
.dialog-progress{display:flex;gap:16px;padding:12px 24px;font-size:14px;color:var(--muted);border-bottom:1px solid var(--line)}
.dialog-progress .active{color:var(--navy);font-weight:700}
#dialog-content{padding:24px}
#dialog-content h2{font-size:26px;margin-bottom:8px}
#dialog-content label{display:block;font-weight:600;margin:16px 0 6px;color:var(--ink)}
.dialog-field{width:100%;min-height:48px;border:1px solid var(--line);border-radius:8px;padding:0 12px;font-size:17px}
.dialog-info{background:var(--pale);border-radius:10px;padding:12px 14px;margin-top:14px;font-size:15px;color:var(--ink)}
.dialog-info b{display:block;color:var(--navy);margin-bottom:2px}
.dialog-actions{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:20px}
.consent-label{display:flex;gap:10px;align-items:flex-start;margin-top:14px;font-size:15px;color:var(--ink)}
.consent-label input{width:20px;height:20px;margin-top:2px;accent-color:var(--navy)}
.confirmation-icon{width:56px;height:56px;border-radius:50%;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-size:26px;margin-bottom:12px}
#toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);background:var(--navy);color:#fff;padding:12px 18px;border-radius:10px;opacity:0;transition:opacity .2s,transform .2s;z-index:60;max-width:calc(100% - 32px)}
#toast.visible{opacity:1;transform:translate(-50%,0)}
.rules-section{background:var(--navy);color:#fff}
.rules-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.rule{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:var(--radius);padding:24px}
.rule h3{color:#fff;margin-bottom:10px}
.rule p{color:var(--cream-2);font-size:16px}
.rule cite,.rule-fed cite,.rule-more cite,.storm-rule cite,.hx5-rule cite{display:block;font-style:normal;font-size:13.5px;color:#FFD2B8;margin-top:6px}
.rule .rule-more,.rule .rule-fed{margin-top:14px;padding-top:12px;border-top:1px dashed rgba(255,255,255,.2);font-size:15px}
.rule-none{color:var(--cream-2)}
.cancel-calc{margin-top:28px;display:grid;grid-template-columns:auto auto 1fr;gap:14px 18px;align-items:center;background:#fff;color:var(--ink);border-radius:var(--radius);padding:18px 22px}
.cancel-calc label{font-weight:600}
.cancel-calc input{min-height:44px;border:1px solid var(--line);border-radius:8px;padding:0 12px;font-size:16px;background:#fff;color:var(--ink)}
.cancel-calc p{color:var(--ink);font-size:15.5px}
.cancel-calc b{color:var(--navy)}
.rules-foot{margin-top:18px;font-size:14px;color:var(--cream-2)}
.rules-foot a{color:#fff}
.storm-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:48px;align-items:start}
.storm-list{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:14px;counter-reset:st}
.storm-list li{counter-increment:st;display:grid;grid-template-columns:36px 1fr;gap:14px;color:var(--ink);font-size:16px;line-height:1.5}
.storm-list li::before{content:counter(st);width:36px;height:36px;border-radius:50%;border:2px solid var(--navy);color:var(--navy);font:700 15px/32px var(--head);text-align:center}
.storm-list b{color:var(--navy)}
.storm-rule{background:var(--sand);border-radius:var(--radius);padding:26px 28px;display:flex;flex-direction:column;gap:12px}
.storm-rule h3{color:var(--navy)}
.storm-rule p{color:var(--ink);font-size:15.5px}
.storm-rule cite{color:var(--muted)}
.storm-rule .storm-extra{border-left:3px solid var(--orange);padding-left:12px}
.storm-rule .storm-hail{margin-top:6px;padding-top:12px;border-top:1px solid var(--line)}
.storm-rule small{font-size:13px;color:var(--muted)}
.season-section{background:var(--navy);color:#fff}
.season-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px;align-items:center}
.season-grid h2{color:#fff}.season-grid .lede{color:var(--cream-2);font-size:17.5px;margin-top:14px}
.season-grid small{display:block;margin-top:14px;color:rgba(246,239,227,.6);font-size:13px}
.season-strip{display:grid;grid-template-columns:repeat(12,1fr);gap:6px;align-items:end;height:220px}
.season-strip div{display:flex;flex-direction:column;justify-content:flex-end;height:100%;gap:6px;text-align:center;font-size:12.5px;color:var(--cream-2)}
.season-strip i{display:block;background:rgba(246,239,227,.25);border-radius:4px 4px 0 0;min-height:4px}
.season-strip div.quiet i{background:var(--orange)}
.season-strip div.quiet{color:#fff;font-weight:600}
.season-strip b{font-weight:600;font-size:12px}
.dispatch-section{background:var(--pale)}
.dispatch-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px;align-items:start}
.dispatch-grid .lede{font-size:17.5px;margin-top:14px}
.dispatch-form{margin-top:22px}
.dispatch-form label{display:block;font-weight:600;color:var(--ink);margin-bottom:8px}
.dispatch-field{display:flex;gap:10px}
.dispatch-field input{flex:1;min-width:0;min-height:52px;border:1px solid var(--line);border-radius:10px;padding:0 16px;font-size:18px;background:#fff;color:var(--ink)}
.dispatch-grid .micro{margin-top:14px}
.date-field{display:flex;gap:12px;align-items:center}
.date-field input{min-height:48px;border:1px solid var(--line);border-radius:8px;padding:0 12px;font-size:17px;width:160px;max-width:100%;background:#fff;color:var(--ink)}
.helper{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:max(16px,env(safe-area-inset-bottom,0px));z-index:40}
.helper-btn{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:10px 16px;border-radius:999px;border:2px solid #fff;background:var(--navy);color:#fff;font-weight:600;box-shadow:0 0 0 1px rgba(16,45,80,.28),0 14px 30px -12px rgba(16,45,80,.6)}
.helper-btn svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linejoin:round}
.helper-panel{position:absolute;right:0;bottom:60px;width:min(380px,calc(100vw - 32px));background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 30px 60px -24px rgba(16,45,80,.5);display:flex;flex-direction:column;max-height:min(70vh,560px)}
.helper-head{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:14px 16px;border-bottom:1px solid var(--line)}
.helper-head b{font:600 17px var(--head);color:var(--navy)}
.helper-head small{grid-column:1;font-size:14px;color:var(--muted)}
.helper-head b{grid-column:1}
.helper-head .icon-button{grid-column:2;grid-row:1/3;align-self:center}
.helper-panel[hidden],.sticky-cta[hidden]{display:none}
.helper-body{padding:14px 16px;overflow:auto;display:flex;flex-direction:column;gap:10px}
.helper-q{text-align:left;border:1px solid var(--line);background:var(--pale);border-radius:10px;padding:10px 12px;font-size:15px;min-height:44px}
.helper-q:hover{border-color:var(--navy)}
.helper-a{background:var(--sand);border-radius:10px;padding:12px 14px;font-size:15px;color:var(--ink);line-height:1.5}
.helper-a b{color:var(--navy)}
.helper-a:focus{outline:none}.helper-a:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.helper-panel.is-answer .helper-foot{display:none}
.helper-a input{width:100%;min-height:44px;border:1px solid var(--line);border-radius:8px;padding:0 12px;font-size:16px;margin-top:8px}
.helper-a cite{font-style:normal;color:var(--muted);font-size:14px;display:block;margin-top:6px}
.helper-foot{padding:10px 16px;border-top:1px solid var(--line);font-size:14px;color:var(--muted)}
.helper-foot a{display:inline-flex;align-items:center;min-height:44px}
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:35;display:flex;align-items:center;justify-content:space-between;gap:12px;background:rgba(255,255,255,.96);border-top:1px solid var(--line);padding:10px max(16px,env(safe-area-inset-left,0px)) max(10px,env(safe-area-inset-bottom,0px))}
.sticky-cta span{font:600 16px var(--head);color:var(--navy)}
.sticky-cta .button{min-height:44px;font-size:16px;padding:8px 16px}
@media (min-width:901px){.sticky-cta{display:none}}
@media (max-width:900px){html{scroll-padding-bottom:calc(var(--sticky-h,76px) + 24px)}}  /* a field the keyboard reaches is not left under the sticky bar */
@media (max-width:900px){.helper{bottom:max(74px,calc(env(safe-area-inset-bottom,0px) + 70px))}}
input[type=range]{width:100%;accent-color:var(--orange);min-height:28px}
@media (max-width:1260px){.main-nav{gap:14px;margin-left:0}.main-nav a{font-size:15.5px}.header-row{gap:20px}}
@media (max-width:1100px){.main-nav{display:none}.menu-toggle{display:inline-flex;margin-left:auto}.area-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.area-card.hail-card{grid-column:span 2}.rules-grid{grid-template-columns:1fr 1fr}}
@media (max-width:900px){.faq-grid,.storm-grid,.season-grid,.dispatch-grid,.rules-grid{grid-template-columns:1fr}.dispatch-grid,.season-grid{gap:28px}.cancel-calc{grid-template-columns:1fr}.phone{display:none}.menu-toggle{margin-left:auto}.section{padding-top:64px;padding-bottom:64px}.season-strip{height:180px}.footer-menu{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.wrap{padding-left:16px;padding-right:16px}.area-grid{grid-template-columns:1fr}.area-card.hail-card{grid-column:auto}.bars{height:120px}.bars div i{display:none}.season-strip{gap:3px}.season-strip div{font-size:10.5px}.dispatch-field{flex-direction:column}.dispatch-field .button{width:100%}.footer-menu{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.progress-track span,#toast{transition:none}html{scroll-behavior:auto}}
/* ---------- first screens (five), shared form ---------- */
.hero{position:relative;overflow:hidden;isolation:isolate}
.hx-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);gap:56px;align-items:center;padding-top:64px;padding-bottom:72px;min-height:min(88svh,820px)}
.hero-copy{max-width:600px}
h1{font-size:clamp(38px,4.6vw,62px);font-weight:640;color:var(--navy);text-wrap:balance;max-width:12ch}
.sub{font-size:clamp(19px,1.7vw,23px);color:var(--muted);margin:16px 0 28px}
.zip-form label{display:block;font-weight:600;color:var(--ink);margin-bottom:8px;font-size:17px}
.field-action{display:flex;gap:10px;background:var(--pale);border:1px solid var(--line);border-radius:12px;padding:6px}
.field-action input{flex:1;min-width:0;min-height:52px;border:1px solid var(--line);border-radius:8px;padding:0 16px;font-size:18px;background:#fff;color:var(--ink)}
.field-action input::placeholder{color:#5F6B7C}
.hint{font-size:15px;color:var(--muted);margin-top:10px}
.promise{margin-top:22px;font-weight:600;color:var(--navy);font-size:17px}
.note{display:flex;gap:12px;align-items:flex-start;margin-top:14px;font-size:16px;color:var(--muted);max-width:560px}
.note .i{flex:0 0 24px;width:24px;height:24px;border-radius:50%;border:1.5px solid var(--navy);display:inline-flex;align-items:center;justify-content:center;font:700 13px/1 var(--head);color:var(--navy);margin-top:2px}
.hero.dark h1,.hero.dark .zip-form label,.hero.dark .promise{color:#fff}
.hero.dark .sub,.hero.dark .hint,.hero.dark .note{color:var(--cream-2)}
.hero.dark .note .i{border-color:var(--cream-2);color:#fff}
.cy-headline{margin-top:22px;max-width:560px;padding:2px 0 2px 14px;border-left:3px solid var(--navy);font-size:16px;line-height:1.5;color:var(--ink)}
.cy-headline__src{display:block;margin-top:4px;font-size:13.5px;color:var(--muted)}
.cy-headline__src a{color:inherit}
.hero.dark .cy-headline{border-left-color:var(--cream-2);color:#fff}
.hero.dark .cy-headline__src{color:var(--cream-2)}
.hero.dark .field-action{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22)}
.hero.dark .field-action input{border-color:transparent}

/* switch between the five (design preview) */

/* ===== 4. checked record ===== */
.hx4{background:var(--navy);color:var(--cream)}
.hx4 .hx-grid{align-items:start}
.hx4-desk{display:flex;flex-direction:column;gap:16px;max-width:480px;justify-self:end;width:100%}
.hx4-intro{color:var(--cream-2);font-size:16px}
.hx4-record{position:relative;background:#FFFDF8;color:var(--ink);border-radius:6px;padding:0 0 18px;box-shadow:0 30px 60px -24px rgba(0,0,0,.6);overflow:hidden}
.hx4-record header{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--pale);border-bottom:1px solid var(--line);padding:10px 20px;font-size:13px;color:var(--muted)}
.hx4-record h3{padding:16px 20px 6px;font-size:24px}
.hx4-record dl{margin:0;padding:0 20px;display:grid;gap:8px}
.hx4-record dl div{display:grid;grid-template-columns:150px 1fr;gap:12px;font-size:15px;border-bottom:1px dashed var(--line);padding-bottom:6px}
.hx4-record dt{color:var(--muted)}.hx4-record dd{margin:0;font-weight:600;color:var(--ink)}
.hx4-record footer{display:flex;gap:18px;flex-wrap:wrap;padding:14px 20px 0;font-size:14.5px}
.hx4-stamp{position:absolute;right:18px;top:64px;width:112px;height:112px;border:3px solid var(--orange);border-radius:50%;color:var(--orange);display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(-12deg) scale(1.8);opacity:0;mix-blend-mode:multiply}
.hx4-stamp span{font:800 20px/1 var(--head);letter-spacing:0}
.hx4-stamp small{font:600 11px/1.3 var(--body);margin-top:4px;text-align:center}
.hx4-stamp.land{opacity:.92;transform:rotate(-12deg) scale(1);transition:transform .22s cubic-bezier(.2,1.4,.4,1),opacity .15s}
.hx4-count{color:var(--cream-2);font-size:15.5px}
.hx4-count b{color:#fff;font-size:17px}
.hx4-count a{color:#fff}

/* ===== 4. slideshow of records (owner's pick) ===== */
.hx4-show{position:relative}
.hx4-track{position:relative}
.hx4-track .hx4-record{display:none}
.hx4-track .hx4-record.on{display:block}
.hx4-nav{display:flex;flex-wrap:wrap;align-items:center;gap:0 10px;margin-top:12px}
.hx4-nav button{flex:0 0 auto}
.hx4-nav #hx4-pause{width:44px;height:44px}
.hx4-nav button{width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.06);color:#fff;display:inline-grid;place-items:center;padding:0}
.hx4-nav button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hx4-nav button:hover{background:#fff;color:var(--navy)}
.hx4-dots{display:flex;gap:0}
.hx4-dots button,.hx4-nav .hx4-dots button:hover{position:relative;width:44px;height:44px;border:0;border-radius:0;background:none;padding:0;min-height:0}
.hx4-dots button::before{content:'';position:absolute;left:50%;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:rgba(255,255,255,.35)}
.hx4-dots button[aria-pressed="true"]::before{background:var(--orange)}
.hx4-pos{margin-left:auto;font-size:14px;color:var(--cream-2)}
@media (max-width:620px){.hx4-pos{order:9;margin:0 0 0 auto;width:100%;text-align:right}}
.hx4-count small{display:block;margin-top:6px;font-size:13px;color:rgba(246,239,227,.65)}
@media (max-width:620px){.hx4-record dl div{padding-right:96px}.hx4-record footer{padding-right:0}}
.hx4-addr{padding:0 20px 8px;font-size:14px;color:var(--muted);margin:-2px 0 4px}
.hx4-bar{height:3px;background:rgba(255,255,255,.18);border-radius:2px;margin-top:8px;overflow:hidden}
.hx4-bar i{display:block;height:100%;width:0;background:var(--orange)}
.hx4-site{font-size:14px;color:var(--cream-2)}.hx4-site b{color:#fff}.hx4-site a{color:#fff}
#hx4-pause[aria-pressed="true"]{background:#fff;color:var(--navy)}

@media (max-width:900px){.hx-grid{grid-template-columns:1fr;gap:36px;padding-top:48px;padding-bottom:56px;min-height:0}.hx4-desk{justify-self:stretch;max-width:none}}
@media (max-width:620px){.field-action{flex-direction:column}.field-action .button{width:100%}.hx4-record dl div{grid-template-columns:1fr;gap:2px}.hx4-stamp{width:92px;height:92px;top:auto;bottom:60px;right:12px}.hx4-stamp span{font-size:16px}}
@media (prefers-reduced-motion:reduce){.hx4-stamp.land{transition:none}}
.hx-grid.solo{grid-template-columns:minmax(0,720px);min-height:0}
/* ===== 8. the dispatch ===== */
.hx8{background:#EEF3F8}
.hx8-win{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 24px 50px -30px rgba(16,45,80,.35);display:flex;flex-direction:column;max-height:560px}
.hx8-bar{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line);background:var(--pale)}
.hx8-dot{width:10px;height:10px;border-radius:50%;background:#2E9E5B}
.hx8-bar b{font:600 15px var(--head);color:var(--navy)}
.hx8-bar small{font-size:12.5px;color:var(--muted);margin-left:auto}
.hx8-log{list-style:none;margin:0;padding:18px;display:flex;flex-direction:column;gap:10px;overflow:auto;min-height:320px;flex:1}
.hx8-log li{display:flex}
.hx8-log li span{max-width:84%;padding:10px 14px;border-radius:16px;font-size:15px;line-height:1.45}
.hx8-log li.them span{background:var(--pale);color:var(--ink);border-bottom-left-radius:4px}
.hx8-log li.you{justify-content:flex-end}
.hx8-log li.you span{background:var(--navy);color:#fff;border-bottom-right-radius:4px;font-weight:600}
.hx8-log li.typing span{display:inline-flex;gap:4px;padding:12px 14px}
.hx8-log li.typing i{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:hx8dot 1s infinite}
.hx8-log li.typing i:nth-child(2){animation-delay:.15s}.hx8-log li.typing i:nth-child(3){animation-delay:.3s}
.hx8-foot{padding:12px 18px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
@keyframes hx8dot{0%,100%{opacity:.3}50%{opacity:1}}

@media (max-width:900px){.hx8-win{max-height:none}.hx8-log{min-height:260px}}
@media (prefers-reduced-motion:reduce){.hx8-log li.typing i{animation:none}}
/* city page rules, classes prefixed cy- */
.cy-vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* breadcrumb */
.cy-crumb{background:#fff;border-bottom:1px solid var(--line)}
.cy-crumb ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:0 10px;font-size:15px;color:var(--muted)}
.cy-crumb li{display:flex;align-items:center;gap:10px;min-height:44px}
.cy-crumb li+li::before{content:"\203A" / "";color:var(--muted)}
.cy-crumb a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;color:var(--navy-2);text-decoration:underline;text-underline-offset:3px}
.cy-crumb [aria-current]{color:var(--ink);font-weight:600}



/* who is listed */
.cy-list{background:var(--sand)}
.cy-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.cy-card h3{margin-bottom:6px}
.cy-card small{display:block;margin-top:14px;font-size:14px;color:var(--muted)}
.cy-reading{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:20px;margin-bottom:36px;align-items:stretch}
.cy-mrow{margin-top:18px}
.cy-mrow p{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:4px 16px;font-size:17px;color:var(--muted)}
.cy-big{font:600 clamp(22px,2.4vw,28px)/1.1 var(--head);color:var(--navy)}
.cy-meter{height:12px;margin-top:8px;background:var(--pale);border-radius:6px;overflow:hidden}
.cy-meter i{display:block;height:100%;width:var(--w);background:var(--navy);border-radius:6px}
.cy-meter.site i{background:color-mix(in srgb,var(--navy) 42%,#fff)}
.cy-read{margin-top:20px;max-width:62ch}
.cy-tablewrap{overflow-x:auto}
.cy-towns{width:100%;border-collapse:collapse;font-size:16px}
.cy-towns th,.cy-towns td{padding:7px 6px;border-bottom:1px solid var(--line);text-align:right;font-weight:400}
.cy-towns thead th{font-weight:650;color:var(--navy);border-bottom:2px solid var(--navy)}
.cy-towns th:first-child{text-align:left}
.cy-towns tbody th{font-weight:400;color:var(--ink)}
.cy-towns tfoot th,.cy-towns tfoot td{font-weight:700;color:var(--navy);border-bottom:0}

.cy-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:10px 20px;margin-bottom:16px}
.cy-count{font-size:16px;color:var(--ink)}
.cy-rows{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.cy-row{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1.35fr) auto;gap:8px 28px;align-items:center;background:#fff;border:1px solid var(--line);border-left:4px solid var(--line);border-radius:var(--radius);padding:14px 20px}
.cy-row[hidden]{display:none}
.cy-row.is-checked{border-left-color:var(--navy)}
.cy-row h3{font-size:20px;line-height:1.25}
.cy-addr{font-size:15.5px;color:var(--muted);margin-top:2px}
.cy-check{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.cy-meta{font-size:15.5px;color:var(--ink);line-height:1.4}
.cy-meta b{color:var(--navy)}
.cy-soft{color:var(--muted)}
.cy-badge{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:2px 12px 2px 9px;border-radius:999px;font-weight:650;font-size:14.5px;background:var(--navy);color:#fff}
.cy-badge svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.cy-badge.no{padding-left:12px;background:#fff;color:var(--muted);border:1px dashed var(--muted)}
.cy-foot{margin-top:22px;max-width:76ch;font-size:14.5px;color:var(--muted)}
.cy-foot a{color:var(--navy-2);text-decoration:underline;text-underline-offset:3px}

/* stacked sections that are both navy */
.v4 #dates{border-top:1px solid rgba(255,255,255,.14)}

@media (max-width:900px){
  .cy-reading{grid-template-columns:minmax(0,1fr)}
  .cy-row{grid-template-columns:minmax(0,1fr) auto;gap:8px 16px}
  .cy-row .cy-who{grid-column:1 / -1}
  .cy-row .cy-check{grid-column:1 / 2}
  .cy-row .text-link{grid-column:2 / 3;align-self:end}
}
@media (max-width:520px){
  .cy-card{padding:18px}
  .cy-row{grid-template-columns:minmax(0,1fr);padding:14px 16px}
  .cy-row .cy-who,.cy-row .cy-check,.cy-row .text-link{grid-column:1 / -1}
  .cy-row .text-link{align-self:start}
}

[hidden]{display:none}
/* request dialog additions */
.dialog-lede{padding:10px 24px 0;font-size:15px;color:var(--muted)}
textarea.dialog-field{min-height:88px;padding:10px 12px;resize:vertical}
select.dialog-field{background:#fff}
.dialog-field:focus-visible{outline:3px solid var(--ring)}
#dialog-content .opt{font-weight:400;color:var(--muted)}
#dialog-content .consent-label{font-weight:400}
#dialog-content .consent-label span{flex:1}
.dialog-steps{margin:10px 0 0;padding-left:20px;color:var(--ink);font-size:15.5px}
.dialog-steps li{margin:6px 0}
.dialog-actions .button{min-width:160px}
.dialog-actions .button[disabled]{opacity:.6;cursor:default}

/* 2026-11-03, owner: the middle of the page was all navy; add our orange, photos and icons. */
:root{--orange-soft:#FFF1E8;--orange-line:#F8C7A8;--orange-dark:#C94E0E}
.ico{width:24px;height:24px;display:inline-block;vertical-align:middle;flex-shrink:0}
.ic-tile{width:48px;height:48px;border-radius:14px;background:var(--orange-soft);color:var(--orange-dark);display:inline-grid;place-items:center;margin-bottom:14px}
.ic-tile .ico{width:28px;height:28px}
.ic-tile.sm{width:40px;height:40px;border-radius:12px;margin:0;flex:0 0 40px}
.ic-tile.sm .ico{width:24px;height:24px}
.ic-tile.dark{background:rgba(242,106,33,.2);color:#FFB98A}
.card-head{display:flex;align-items:center;gap:12px}
.card-head h3{margin:0}
/* who is listed: the city's share in orange, the site's in navy */
.cy-meter i{background:var(--orange)}
.cy-meter.site i{background:var(--navy)}
.cy-row.is-checked{border-left-color:var(--orange)}
.cy-badge{background:var(--orange-soft);color:var(--orange-dark);border:1px solid var(--orange-line)}
/* your area: the city's own photo next to the heading, warm cards */
.area-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:end;margin-bottom:28px}
.area-top .section-head{margin-bottom:0}
.cy-photo{margin:0}
.cy-photo img{width:100%;height:260px;object-fit:cover;border-radius:var(--radius);background:var(--pale)}
.cy-photo figcaption{font-size:14px;color:var(--muted);margin-top:8px}
.area-card{background:var(--sand)}
.area-card .big{color:var(--orange-dark)}
.profile-head .ic-tile{margin:0}
/* quiet months: warm band instead of a second navy block */
.season-section{background:var(--orange-soft);color:var(--ink)}
.season-section .ic-tile{background:#fff}
.season-grid h2{color:var(--navy)}
.season-grid .lede{color:var(--ink)}
.season-grid small{color:var(--muted)}
.season-strip div{color:var(--muted)}
.season-strip i{background:color-mix(in srgb,var(--navy) 38%,#fff)}
.season-strip div.quiet i{background:var(--orange)}
.season-strip div.quiet{color:var(--orange-dark)}
/* rights and clocks: orange citations, orange edge on the calculator */
.rule .ic-tile{margin-bottom:12px}
.rule cite,.rule-fed cite,.rule-more cite{color:#FFB98A}
.cancel-calc{border-left:6px solid var(--orange)}
.cancel-calc b{color:var(--orange-dark)}
/* the dispatch: your messages in orange */
.hx8-log li.you span{background:var(--orange);color:var(--navy)}
.hx8-dot{background:var(--orange)}
/* after the storm: icons instead of numbers, a real hail photo */
.storm-list li{grid-template-columns:40px 1fr;align-items:start}
.storm-list li::before{content:none}
.storm-side{display:grid;gap:20px;align-content:start}
.hh-ph{margin:0}
.hh-ph img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--radius);background:var(--pale)}
.hh-ph figcaption{font-size:14px;color:var(--muted);margin-top:8px;line-height:1.4}
.hh-ph figcaption a{color:var(--muted)}
/* related reading: three cards of different kinds */
.rr{padding-top:0}
.rr-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.rr-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;text-decoration:none;color:var(--ink);min-width:0}
.rr-card:hover,.rr-card:has(a:hover){border-color:var(--navy);box-shadow:inset 0 0 0 1px var(--navy)}
/* related partial (related_a / related_b, every v4 page): the card is an <article> with one link on its title; the whole card is clickable
   through a stretched ::after; phones keep the text left of the chat button */
[data-ui^="related:"] .rr-card{position:relative}
[data-ui^="related:"] .rr-card b a{color:inherit;text-decoration:inherit}
[data-ui^="related:"] .rr-card a::after{content:"";position:absolute;inset:0}
[data-ui^="related:"] .rr-card:has(a:focus-visible){outline:3px solid var(--ring);outline-offset:2px}
@media (max-width:620px){[data-ui^="related:"] .rr-body{padding-right:56px}}
.rr-card img{width:100%;object-fit:cover;background:var(--pale)}
.rr-photo img{aspect-ratio:3/2}
.rr-number img{aspect-ratio:3/1}
.rr-steps img{aspect-ratio:3/2}
.rr-body{display:flex;flex-direction:column;gap:8px;padding:18px 20px 20px;flex:1}
.rr-kind{color:var(--navy-2);font-weight:650;font-size:14px}
.rr-card b{font:600 20px/1.25 var(--head);color:var(--navy);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.rr-card:hover b,.rr-card:has(a:hover) b{color:var(--navy);text-decoration-thickness:2px;text-underline-offset:4px}
.rr-fact{font-size:15.5px;color:var(--muted)}
.rr-card small{font-size:14px;color:var(--muted);margin-top:auto;padding-top:6px}
.rr-big{font:600 28px/1.1 var(--head);color:var(--navy)}
.rr-steps{background:var(--sand)}
.rr-ol{margin:2px 0 0;padding-left:20px;font-size:15.5px;color:var(--ink);line-height:1.45}
.rr-ol li{margin:4px 0}
.rr-ol li::marker{color:var(--navy-2);font-weight:700}
.rr-plain{flex-direction:row;align-items:center;gap:14px;padding:18px 20px}
.rr-plain .rr-body{padding:0}
@media (max-width:1100px){.rr-grid{grid-template-columns:1fr 1fr}}
@media (max-width:900px){.area-top{grid-template-columns:1fr;align-items:start}.cy-photo img{height:200px}}
@media (max-width:700px){.rr-grid{grid-template-columns:1fr}}

/* Questions? helper (04.11 / 05.11, SH-3): the full pill is used only where it sits in the free right margin (>= 1500 px).
   From 1280 to 1499 px it is the icon-only 44 px button parked in the margin next to the 1240 px column (3 px from the edge),
   so it covers no page text. Below 1280 px there is no free margin: icon-only, and it steps away while the person reads
   (v4-shell.js adds .is-away), like on phones. */
@media (max-width:1499px){
  .helper-btn{width:48px;height:48px;min-height:48px;padding:0;justify-content:center;gap:0}
  .helper-btn span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
@media (min-width:1280px) and (max-width:1499px){
  .helper{right:max(3px,env(safe-area-inset-right,0px))}
  .helper-btn{width:44px;height:44px;min-height:44px}
  .helper-panel{bottom:56px}
}
@media (max-width:1279px){
  .helper{transition:transform .2s,opacity .2s}
  .helper.is-away{transform:translateY(calc(100% + var(--sticky-h,0px) + 32px));opacity:0;pointer-events:none}
}
@media (max-width:900px){
  body:has(.sticky-cta:not([hidden])) .helper{bottom:calc(var(--sticky-h,76px) + 8px)}
}
@media (max-width:1279px) and (prefers-reduced-motion:reduce){.helper{transition:none}}

/* Light hero variant for the owner's A/B look (04.11): add ?hero=light to any v4 page (v4-shell.js swaps .dark for .light). The default stays dark. */
.hero.light{background:linear-gradient(180deg,#EAF0F7 0%,#F7F9FC 100%);color:var(--ink)}
.hero.light h1,.hero.light .zip-form label,.hero.light .promise,.hero.light .hx4-count b,.hero.light .hx4-count a,.hero.light .hx4-site b,.hero.light .hx4-site a{color:var(--navy)}
.hero.light .sub,.hero.light .hint,.hero.light .note,.hero.light .hx4-intro,.hero.light .hx4-count,.hero.light .hx4-site,.hero.light .hx4-pos,.hero.light .hx4-count small{color:var(--muted)}
.hero.light .note .i{border-color:var(--muted);color:var(--navy)}
.hero.light .field-action{background:#fff;border-color:var(--line)}
.hero.light .hx4-record{box-shadow:0 24px 50px -28px rgba(16,45,80,.45);border:1px solid var(--line)}
.hero.light .hx4-nav button{border-color:var(--line);background:#fff;color:var(--navy)}
.hero.light .hx4-dots button{background:none;border:0}
.hero.light .hx4-dots button::before{background:rgba(16,45,80,.22)}
.hero.light .hx4-dots button[aria-pressed="true"]::before{background:var(--orange)}
.hero.light .hx4-bar{background:rgba(16,45,80,.12)}

/* Print (SW-15): the sticky bar, header, footer and chat button stay off the paper; outside links print their address. */
@media print{
  .header,.v4-adminbar,.footer,.sticky-cta,.helper,.helper-btn,#toast,dialog{display:none!important}
  a[href^=http]::after{content:" (" attr(href) ")";font-size:12px}
}

/* R4 city verdict: "so what" paragraph and three questions as a plain definition list (no FAQPage markup) */
.cv__in{max-width:760px}
.cv h2{margin-bottom:14px}
.cv .cv__sowhat{font-size:19px;line-height:1.55;margin:0 0 22px}
.cv .cv__qa{margin:0;border-top:1px solid var(--line)}
.cv .cv__qa dt{font-weight:700;margin:0;padding:18px 0 4px;line-height:1.35}
.cv .cv__qa dd{margin:0;padding:0 0 18px;border-bottom:1px solid var(--line)}
.cv .cv__more{margin:16px 0 0}