/* Shared styles for the secondary calculator pages (MWFRS/Roofs/Specialized/Solar).
   White cards on the dark Aurora canvas — matches the live W/D look. */
.mw{max-width:1180px; margin:0 auto; padding-top:22px; font-family:'Inter','Segoe UI',Arial,sans-serif}
.banner{background:#fffbeb; border:1px solid #f59e0b; color:#92400e; border-radius:14px; padding:13px 18px;
  font-size:13px; font-weight:600; margin:0 0 16px; display:flex; gap:10px; align-items:flex-start}
.banner b{color:#7c2d12}
.wcard{background:#fff; border-radius:18px; padding:22px 24px; margin:0 0 16px; box-shadow:0 22px 50px rgba(2,4,18,.42)}
.wc-h{font-size:16px; font-weight:800; color:#0d1233; margin:0 0 3px}
.wc-sub{font-size:13px; color:#64748b; margin:0 0 14px}
/* 2-column form grid — matches W/D's .frow so every calc sheet lays out identically.
   Full-width fields use inline grid-column:1/-1; a 3-across variant uses .grid.three. */
.grid{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.grid.three{grid-template-columns:1fr 1fr 1fr}
@media(max-width:560px){.grid,.grid.three{grid-template-columns:1fr}}
.fld label{display:block; font-size:11px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:#8a93b0; margin:0 0 6px}

/* ============================================================================
   Selectable CARDS + Velocity Finder — COPIED VERBATIM from the W/D calculator
   (index.html) so every calc page renders identical Wind-Parameters sheets.
   ============================================================================ */
:root{
  --blue:#0018FF; --ink:#0f172a; --muted:#475569; --muted2:#64748b; --line:#e2e8f0;
  --em2:#10B981; --em3:#059669;
  --emerald:linear-gradient(145deg,#34D399,#10B981 40%,#059669);
  --hoverblue:linear-gradient(135deg,#0018FF,#3b56ff);
  --ease:cubic-bezier(.22,.61,.36,1);
}
.sec-title{font-size:11.5px; font-weight:800; color:var(--blue); letter-spacing:.06em; text-transform:uppercase; margin:18px 0 12px}
.cardgroup{display:flex; gap:10px; flex-wrap:wrap}
.ccard{flex:1; min-width:104px; border:1.5px solid var(--line); border-radius:12px; padding:14px 12px; text-align:center;
  cursor:pointer; background:#fff; color:var(--ink); transition:transform .14s var(--ease), box-shadow .14s, background .14s, border-color .14s}
.ccard:hover{background:var(--hoverblue); border-color:var(--blue); color:#fff; transform:translateY(-2px); box-shadow:0 10px 24px rgba(0,24,255,.28)}
.ccard:hover .cc-s{color:rgba(255,255,255,.85)}
.ccard:hover .cc-ic{color:#fff} .ccard:hover .cc-v{color:#fff}
.ccard.sel{background:var(--emerald); border-color:var(--em2); color:#fff; box-shadow:0 10px 24px rgba(16,185,129,.32)}
.ccard.sel .cc-s{color:rgba(255,255,255,.9)} .ccard.sel .cc-ic{color:#fff} .ccard.sel .cc-v{color:#fff}
.cc-ic{color:var(--blue); display:flex; justify-content:center; margin-bottom:8px; transition:color .14s}
.cc-ic svg{width:26px; height:26px; display:block}
.cc-t{font-size:16px; font-weight:800}
.cc-s{font-size:11px; font-weight:600; color:var(--muted2); margin-top:3px; line-height:1.3}
.cc-v{font-size:13px; font-weight:800; color:var(--blue); margin-top:8px; padding-top:7px; border-top:1px dashed rgba(0,24,255,.18); transition:color .14s}
.ccard:hover .cc-v{border-top-color:rgba(255,255,255,.4)} .ccard.sel .cc-v{border-top-color:rgba(255,255,255,.4)}
@media(max-width:560px){.ccard{flex:1 1 calc(50% - 6px); min-width:0; padding:12px 8px} .cc-t{font-size:15px} .cc-s{font-size:10px}}
.fld input{width:100%; padding:11px 12px; border:1.6px solid #e2e8f0; border-radius:11px; font-size:15px; font-weight:600; color:#0d1233; outline:none}
.fld input:focus{border-color:#0018FF; box-shadow:0 0 0 3px rgba(0,24,255,.12)}
.fld .hint{font-size:11px; color:#94a3b8; margin-top:5px}
.wc-l{font-size:11px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:#8a93b0; margin:16px 0 8px}
.opts{display:flex; gap:9px; flex-wrap:wrap}
.opt{padding:10px 16px; border-radius:11px; font-weight:700; font-size:14px; color:#0d1233; background:#fff; border:1.6px solid #e2e8f0; cursor:pointer; transition:.14s}
.opt:hover{background:#0018FF; color:#fff; border-color:#0018FF}
.opt.sel{background:#10b981; color:#fff; border-color:#10b981}
.btnP{display:inline-flex; align-items:center; gap:8px; background:linear-gradient(135deg,#0018FF,#181E57); color:#fff; border:none; font-weight:800; font-size:15px; padding:15px 30px; border-radius:13px; cursor:pointer; box-shadow:0 12px 30px rgba(0,24,255,.4)}
.btnP:disabled{opacity:.6; cursor:default}
.err{background:#fef2f2; border:1px solid #fecaca; color:#b91c1c; border-radius:11px; padding:12px 14px; font-size:13px; margin-top:14px}
.rgrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:12px; margin:4px 0 6px}
.stat{background:#f8fafc; border:1px solid #e2e8f0; border-radius:12px; padding:12px 14px}
.stat .k{font-size:11px; font-weight:700; color:#8a93b0; text-transform:uppercase; letter-spacing:.03em}
.stat .v{font-size:17px; font-weight:800; color:#0d1233; margin-top:2px; word-break:break-word}
table.r{width:100%; border-collapse:collapse; margin-top:8px; font-size:13.5px}
table.r th{text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:#8a93b0; border-bottom:1.5px solid #e2e8f0; padding:8px 10px}
table.r td{padding:9px 10px; border-bottom:1px solid #eef2f7; color:#0d1233; font-weight:600}
table.r tr:last-child td{border-bottom:none}
.pos{color:#047857} .neg{color:#b91c1c}
.badge-admin{display:inline-block; font-size:10px; font-weight:900; color:#7a2e00; background:#ffce5a; border-radius:6px; padding:2px 7px; margin-left:8px; vertical-align:middle}

/* jurisdiction requirements box (reused from W/D via calc-velocity.js) */
.vf-loc label{display:block; font-size:10.5px; font-weight:700; color:#8a93b0; letter-spacing:.06em; text-transform:uppercase; margin:0 0 6px}
.vf-loc input{width:100%; padding:11px 13px; border:1.6px solid #e2e8f0; border-radius:11px; font-size:15px; font-weight:600; color:#0d1233; outline:none}
.vf-loc input:focus{border-color:#0018FF; box-shadow:0 0 0 3px rgba(0,24,255,.12)}
.ji-title{font-size:11.5px; font-weight:800; color:#9a3412; text-transform:uppercase; letter-spacing:.05em; margin-bottom:9px}
.ji-req{font-size:12.5px; color:#0f172a; margin:4px 0; display:flex; gap:7px; align-items:flex-start}
.ji-req .ck{color:#059669; font-weight:800}
.ji-links{display:flex; gap:8px; flex-wrap:wrap; margin-top:11px}
.ji-links a{font-size:12px; font-weight:700; color:#0018FF; background:#eef2ff; border:1px solid #dbe1ff; border-radius:8px; padding:7px 12px; text-decoration:none}
.ji-links a:hover{background:#e0e7ff}

/* core Velocity Finder shell (copied VERBATIM from W/D index.html so MWFRS/roof + every
   calc-workflow page render the finder identically). .vf-loc child styles are above. */
.vfinder{background:linear-gradient(135deg,#eef2ff,#fff); border:1px solid #dbe1ff; border-radius:14px; padding:18px; margin-bottom:18px}
.vf-top{display:flex; gap:12px; align-items:flex-end; flex-wrap:wrap}
.vf-loc{flex:1; min-width:200px}
.vf-btn{background:linear-gradient(135deg,#0018FF,#181E57); color:#fff; border:none; border-radius:10px;
  padding:12px 20px; font-size:13.5px; font-weight:800; cursor:pointer; white-space:nowrap; box-shadow:0 10px 24px rgba(0,24,255,.28)}
.vf-btn:hover{transform:translateY(-1px)}
.vf-result{display:none; margin-top:14px; align-items:center; gap:16px; flex-wrap:wrap; padding-top:14px; border-top:1px dashed #dbe1ff}
.vf-result.show{display:flex}
.vf-speed{font-size:34px; font-weight:900; color:var(--blue); line-height:1}
.vf-speed span{font-size:14px; font-weight:700; color:var(--muted2)}
.vf-meta{flex:1; min-width:180px}
.vf-juris{display:inline-block; background:#fff7ed; border:1px solid #fed7aa; color:#9a3412; font-size:12px; font-weight:700; padding:6px 12px; border-radius:999px}
.vf-loc-txt{font-size:12.5px; color:var(--muted); font-weight:600; margin-top:6px}
.vf-used{font-size:11px; font-weight:700; color:var(--em3); margin-top:6px}
.vf-note{font-size:12px; color:var(--muted); margin-top:12px; line-height:1.55}
.vf-note a{color:var(--blue); font-weight:700; cursor:pointer; text-decoration:underline}
.juris-info{display:none; margin-top:14px; background:#fff; border:1px solid #fed7aa; border-radius:12px; padding:14px 16px}
.juris-info.show{display:block}
@media (max-width:640px){ .vf-top{flex-direction:column; align-items:stretch} .vf-btn{width:100%} }

/* Topographic wind-flow animation (same as W/D) — shown on every calc's Topographic sheet */
.topo-anim{position:relative; margin:14px 0 4px; border:1px solid #e2e8f0; border-radius:13px; overflow:hidden; background:#0d1233}
.topo-anim iframe{width:100%; height:460px; border:none; display:block; background:#0d1233}
.anim-fs{position:absolute; top:10px; right:10px; z-index:2; background:rgba(13,18,51,.75); color:#fff; border:1px solid rgba(255,255,255,.25); border-radius:8px; padding:6px 11px; font-size:12px; font-weight:700; cursor:pointer}
.anim-fs:hover{background:rgba(13,18,51,.95)}
.topo-anim:fullscreen{border:none; border-radius:0; display:flex; align-items:center; justify-content:center}
.topo-anim:fullscreen iframe{height:100vh; width:100vw}
@media (max-width:640px){ .topo-anim iframe{height:60vh} }

/* live address-recognition feedback under the Project Address field (parity with W/D) */
.addr-status{font-size:12.5px; font-weight:600; margin-top:8px; min-height:18px; line-height:1.5; display:flex; align-items:center; gap:7px}
.addr-status .ic{flex:0 0 auto; width:18px; height:18px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:12px; font-weight:800; color:#fff}
.addr-status.ok{color:#065f46} .addr-status.ok .ic{background:#10b981} .addr-status.ok b{color:#065f46}
.addr-status.warn{color:#9a3412} .addr-status.warn .ic{background:#f59e0b} .addr-status.warn b{color:#9a3412}
.addr-status.checking{color:#64748b} .addr-status.checking .ic{background:#94a3b8}
