/* HomePowerRebate shared styles. Generated from _partials/nav-footer.html and _partials/templates/ by scripts/apply_canonical_nav_footer.py; edit those, not this file. */
.nav { position: sticky; top: 0; z-index: 50; background: rgba(250, 247, 242, 0.92); backdrop-filter: blur(10px); border-bottom: 1px solid var(--rule); }
.nav-inner { max-width: 1180px; margin: 0 auto; padding: 18px 28px; display: flex; justify-content: space-between; align-items: center; }
.logo { font-family: 'Fraunces', 'Fraunces Fallback', serif; font-weight: 600; font-size: 22px; letter-spacing: -0.02em; color: var(--teal-deep); text-decoration: none; display: flex; align-items: center; gap: 10px; }
.logo-mark { width: 30px; height: 30px; background: var(--amber); border-radius: 50%; position: relative; box-shadow: 0 2px 8px rgba(212, 117, 28, 0.3); }
.logo-mark::after { content: ''; position: absolute; inset: 8px; background: var(--paper); border-radius: 50%; }
.logo-power { color: var(--amber); font-weight: 700; }
.nav-pick { display: flex; align-items: center; gap: 8px; background: var(--teal-deep); color: var(--paper); padding: 11px 20px; border-radius: 999px; text-decoration: none; font-weight: 600; font-size: 15px; transition: all 0.2s; }
.nav-pick:hover { background: #a4540a; transform: translateY(-1px); }
.nav-desktop-only { display: flex !important; }
.nav-mobile-only { display: none !important; }
@media (max-width: 768px) {
  .nav-desktop-only { display: none !important; }
  .nav-mobile-only { display: flex !important; flex-wrap: wrap; }
  .nav-inner { padding: 14px 20px; flex-wrap: wrap; row-gap: 8px; gap: 8px; }
  .logo { font-size: 16px !important; }
  .logo-mark { width: 22px !important; height: 22px !important; }
  .nav-mobile-only a { font-size: 13px !important; }
  .nav-pick { font-size: 12px !important; padding: 7px 10px !important; white-space: nowrap; }
}
@media (max-width: 560px) {
  .nav-inner { justify-content: center !important; }
  .logo { flex: 1 0 100%; justify-content: center; }
  .nav-mobile-only { flex: 1 1 auto; justify-content: center; }
}
.footer { background: var(--ink); color: rgba(250, 247, 242, 0.65); padding: 56px 28px 32px; }
.footer-inner { max-width: 1180px; margin: 0 auto; }
.footer-top { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 36px; padding-bottom: 32px; border-bottom: 1px solid rgba(250, 247, 242, 0.1); }
.footer-brand { font-family: 'Fraunces', 'Fraunces Fallback', serif; font-weight: 500; font-size: 22px; color: var(--paper); letter-spacing: -0.02em; margin-bottom: 12px; }
.footer-tagline { font-size: 13px; color: rgba(250, 247, 242, 0.4); max-width: 320px; }
.footer-col-title { font-family: 'Inter Tight', 'Inter Tight Fallback', sans-serif; font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(250, 247, 242, 0.7); margin-bottom: 14px; }
.footer-col-links { list-style: none; display: grid; gap: 8px; font-size: 14px; margin: 0; padding: 0; }
.footer-col-links a { color: rgba(250, 247, 242, 0.45); text-decoration: none; }
.footer-col-links a:hover { color: var(--amber); }
.footer-bottom { padding-top: 24px; font-size: 12px; color: rgba(250, 247, 242, 0.35); display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
@media (max-width: 880px) { .footer-top { grid-template-columns: 1fr 1fr; gap: 28px; } }
@media (max-width: 520px) { .footer-top { grid-template-columns: 1fr; } }
.sticky-cta { display: none; }
@media (min-width: 769px) {
  .sticky-cta { position: fixed; right: 24px; bottom: 24px; z-index: 60; background: var(--amber); color: #fff; font-weight: 700; font-size: 15px; padding: 14px 22px; border-radius: 999px; text-decoration: none; box-shadow: 0 6px 20px rgba(10, 42, 46, 0.3); transform: translateY(140%); transition: transform .25s ease; }
  .sticky-cta.show { display: block; transform: none; }
  .sticky-cta.on { display: block; }
}
@media (max-width: 768px) {
  .sticky-cta { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 60; background: var(--amber); color: #fff; text-align: center; font-weight: 700; font-size: 15px; padding: 14px 16px; border-radius: 999px; text-decoration: none; box-shadow: 0 6px 20px rgba(10, 42, 46, 0.3); transform: translateY(140%); transition: transform .25s ease; }
  .sticky-cta.show { display: block; transform: none; }
  .sticky-cta.on { display: block; }
  body.has-sticky-cta { padding-bottom: 76px; }
}

/* city page opening: numbers right after the lead on phones, detail notes after them */
@media (max-width: 700px) {
  .hero:has(.hero-stat-strip) .wrap { display: flex; flex-direction: column; }
  .hero:has(.hero-stat-strip) .wrap > * { order: 3; }
  .hero:has(.hero-stat-strip) .wrap > h1 { order: 0; }
  .hero:has(.hero-stat-strip) .wrap > .lead { order: 1; }
  .hero:has(.hero-stat-strip) .wrap > .hero-stat-strip { order: 2; display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 8px !important; margin: 16px 0 18px !important; }
  .hero-stat-strip > div { min-width: 0 !important; padding: 12px 8px !important; text-align: center; }
  .hero-stat-strip > div > div:first-child { font-size: 18px !important; }
}
/* design pass 2026-09-29 */
.hero strong, .hero b, header.hero strong { color: inherit; }
.footer-col-links a { display: inline-block; padding: 5px 0; }
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; } }
@media (max-width: 600px) {
  .tw { overflow: visible !important; }
  .tw table { min-width: 0 !important; display: block; width: 100%; }
  .tw tbody { display: block; }
  .tw tr { display: block; background: #fff; border: 1px solid #d9d0c1; border-radius: 12px; margin: 0 0 12px; padding: 10px 14px; }
  .tw tr:has(th) { display: none; }
  .tw td { display: block; border: 0 !important; padding: 6px 0 !important; }
  .tw td::before { content: attr(data-label); display: block; font-size: 11px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: #6b8e7f; margin-bottom: 2px; }
  .tw td:first-child { font-size: 17px; padding-top: 2px !important; }
  .tw td:first-child::before { display: none; }
  /* rebate tables on phones: amount directly under the name in green, no label rows for Amount/Rules */
  .tw td[data-label="Amount"] { font-size: 19px; font-weight: 700; color: #2d6a4f; padding-top: 0 !important; }
  .tw td[data-label="Amount"]::before, .tw td[data-label="Rules"]::before { display: none; }
  .tw td[data-label="Rules"] { font-size: 15px; color: #1a3d42; padding-top: 2px !important; }
}
.hpr-toc { background: #fff; border: 1px solid #d9d0c1; border-radius: 12px; padding: 4px 16px; margin: 18px 0 26px; max-width: 720px; }
.hpr-toc summary { cursor: pointer; font-weight: 700; font-size: 15px; padding: 12px 0; color: var(--teal-deep); list-style: none; display: flex; justify-content: space-between; align-items: center; }
.hpr-toc summary::-webkit-details-marker { display: none; }
.hpr-toc summary::after { content: "+"; font-size: 20px; color: var(--amber); }
.hpr-toc[open] summary::after { content: "\2212"; }
.hpr-toc ol { margin: 0 0 12px 20px !important; padding: 0; }
.hpr-toc li { margin: 0 !important; font-size: 15px !important; }
.hpr-toc a { display: inline-block; padding: 6px 0; text-decoration: none !important; font-weight: 500 !important; color: var(--ink) !important; }
.hpr-toc a:hover { color: #a4540a !important; }
h2[id] { scroll-margin-top: 84px; }
/* hub showcase */
.hs-wrap { max-width: 1180px; margin: 0 auto; padding: 0 20px; }
header.hub-hero { background: var(--teal-deep, #08363f); color: var(--paper, #faf7f2); padding: 48px 0 40px; text-align: left; }
header.hub-hero .wrap { max-width: 1100px; margin: 0 auto; padding: 0 24px; }
header.hub-hero .eyebrow { font-size: 14px; color: var(--amber-bright, #e88a2e); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; margin: 0 0 18px; }
header.hub-hero h1 { font-size: clamp(34px, 6vw, 54px); color: #fff; margin: 0 0 20px; text-align: left; }
header.hub-hero .sub { font-size: clamp(17px, 2.4vw, 21px); color: rgba(250,247,242,.82); max-width: 640px; margin: 0 0 32px; }
header.hub-hero .cta-row { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }
header.hub-hero .btn { display: inline-block; background: var(--amber, #d4751c); color: #fff; padding: 14px 28px; border-radius: 999px; text-decoration: none; font-weight: 600; font-size: 16px; border: 1.5px solid transparent; }
header.hub-hero .btn.btn-secondary { background: #fff; color: var(--ink, #0a2a2e); border-color: #d9d0c1; }
.hub-fold { margin-top: 18px; }
.hub-fold > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 22px; border-radius: 999px; background: var(--teal-deep); color: #fff; font-weight: 600; font-size: 15px; }
.hub-fold > summary::-webkit-details-marker { display: none; }
.hub-fold > summary::after { content: "+"; font-size: 20px; line-height: 1; }
.hub-fold[open] > summary::after { content: "\2212"; }
.hub-fold[open] > summary { margin-bottom: 20px; }
.hs-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin: 20px 0 26px; position: relative; z-index: 2; }
@media (min-width: 900px) { .hs-stats { margin-top: -34px; } }
.hs-stat { background: #fff; border: 1px solid #d9d0c1; border-radius: 14px; padding: 14px 10px; text-align: center; box-shadow: 0 8px 20px rgba(10,42,46,.09); }
.hs-stat b { display: block; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 25px; line-height: 1.1; color: var(--teal-deep); }
.hs-stat b small { display: block; font-family: 'Inter Tight', 'Inter Tight Fallback', sans-serif; font-size: 12px; font-weight: 600; color: var(--amber); margin-top: 2px; }
.hs-stat span { display: block; font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em; font-weight: 600; color: var(--ink-soft); margin-top: 4px; }
.hs-sec { padding-top: 6px; padding-bottom: 20px; }
.hs-h { font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(24px, 4vw, 32px); color: var(--teal-deep); margin: 8px 0 6px; }
.hs-sub { color: var(--ink-soft); margin: 0 0 16px; max-width: 680px; }
.hs-ctl { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.hs-ctl input { flex: 1; min-width: 200px; padding: 12px 14px; border: 1px solid #d9d0c1; border-radius: 10px; font: inherit; font-size: 16px; background: #fff; }
.hs-sort, .hs-more { font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #d9d0c1; background: #fff; color: var(--ink); border-radius: 999px; padding: 8px 16px; min-height: 44px; cursor: pointer; }
.hs-sort.on { background: var(--teal-deep); border-color: var(--teal-deep); color: #fff; }
.hs-more { display: block; margin: 16px auto 0; background: var(--teal-deep); border-color: var(--teal-deep); color: #fff; padding: 0 24px; }
.hs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px; }
.hs-city { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid #d9d0c1; border-radius: 14px; padding: 12px 14px; text-decoration: none; color: var(--ink); transition: transform .15s, box-shadow .15s, border-color .15s; }
.hs-city:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(10,42,46,.1); border-color: var(--amber); }
.hs-city.hide { display: none; }
.hs-ring { --d: 0deg; flex: none; position: relative; width: 48px; height: 48px; border-radius: 50%; background: conic-gradient(var(--amber) var(--d), #eee 0); display: grid; place-items: center; }
.hs-ring::before { content: ''; position: absolute; inset: 5px; background: #fff; border-radius: 50%; }
.hs-ring b { position: relative; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 15px; color: var(--teal-deep); }
.hs-cn b { display: block; font-size: 16px; }
.hs-cn small { display: block; font-size: 12.5px; color: var(--ink-soft); line-height: 1.3; }
.hs-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px; }
.hs-tile { display: flex; gap: 12px; align-items: flex-start; background: var(--paper-warm); border: 1px solid #d9d0c1; border-radius: 14px; padding: 14px; text-decoration: none; color: var(--ink); transition: border-color .15s, transform .15s; }
.hs-tile:hover { border-color: var(--amber); transform: translateY(-2px); }
.hs-ti { font-size: 24px; line-height: 1; }
.hs-tt em { display: block; font-style: normal; font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-soft); }
.hs-tt b { font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 22px; color: var(--green-money); }
.hs-tt small { display: block; font-size: 12.5px; color: var(--ink-soft); }
.hs-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.hs-chip { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; background: #fff; border: 1px solid #d9d0c1; border-radius: 999px; font-size: 14px; font-weight: 600; color: var(--teal-deep); text-decoration: none; }
.hs-chip:hover { border-color: var(--amber); color: #a4540a; }
.hs-note { margin: 14px 0 0; padding: 10px 14px; background: #fdf2f0; border: 1px solid #efc9c4; border-radius: 10px; font-size: 14px; color: #8a2a1c; }
@media (max-width: 700px) { .hs-stats { grid-template-columns: repeat(2, 1fr); } .hs-stats .hs-stat:last-child:nth-child(odd) { grid-column: 1 / -1; } .hs-grid, .hs-tiles { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .hs-city, .hs-tile { transition: none; } .hs-city:hover, .hs-tile:hover { transform: none; } }

/* logo word "Power" keeps the brand amber; at 19px bold it counts as large text for contrast (3:1) */
@media (max-width: 768px) { .nav .logo, .logo { font-size: 19px !important; } }
/* metric-matched fallbacks (measured in Chrome): text keeps its size and line height while the web fonts load, so nothing jumps */
@font-face { font-family: 'Fraunces Fallback'; font-weight: 400; src: local('Georgia'); size-adjust: 102.1%; ascent-override: 95.9%; descent-override: 25.5%; line-gap-override: 0%; }
@font-face { font-family: 'Fraunces Fallback'; font-weight: 500; src: local('Georgia'); size-adjust: 102.1%; ascent-override: 95.9%; descent-override: 25.5%; line-gap-override: 0%; }
@font-face { font-family: 'Fraunces Fallback'; font-weight: 600; src: local('Georgia Bold'), local('Georgia-Bold'); size-adjust: 89.3%; ascent-override: 109.7%; descent-override: 29.1%; line-gap-override: 0%; }
@font-face { font-family: 'Fraunces Fallback'; font-weight: 700; src: local('Georgia Bold'), local('Georgia-Bold'); size-adjust: 92.3%; ascent-override: 106.2%; descent-override: 28.2%; line-gap-override: 0%; }
@font-face { font-family: 'Inter Tight Fallback'; font-weight: 400; src: local('Arial'); size-adjust: 96.3%; ascent-override: 100.8%; descent-override: 24.9%; line-gap-override: 0%; }
@font-face { font-family: 'Inter Tight Fallback'; font-weight: 500; src: local('Arial'); size-adjust: 98.5%; ascent-override: 98.5%; descent-override: 24.4%; line-gap-override: 0%; }
@font-face { font-family: 'Inter Tight Fallback'; font-weight: 600; src: local('Arial Bold'), local('Arial-BoldMT'); size-adjust: 94.1%; ascent-override: 103.0%; descent-override: 25.5%; line-gap-override: 0%; }
@font-face { font-family: 'Inter Tight Fallback'; font-weight: 700; src: local('Arial Bold'), local('Arial-BoldMT'); size-adjust: 96.2%; ascent-override: 100.8%; descent-override: 24.9%; line-gap-override: 0%; }
/* ===== fluid layout system =====
   One container width that grows with the screen instead of a fixed 1180px: header, footer, breadcrumbs, hubs, rankings and the homepage all share it. */
/* design tokens (2026-10-14): the brand colours every page used to get only from its own older CSS copy, plus shared
   values the template CSS repeats. Same values as before; DESIGN.md documents them. Use these in new CSS instead of hex. */
:root { --ink: #0a2a2e; --ink-soft: #1a3d42; --paper: #faf7f2; --paper-warm: #f5efe5; --teal: #0d4f5c; --teal-deep: #08363f;
  --amber: #d4751c; --amber-bright: #e88a2e; --amber-text: #a4540a; --amber-text-deep: #8a4607; --sage: #6b8e7f; --green-money: #2d6a4f; --rule: #d9d0c1;
  --card-rule: #e3dacb; --muted: #4a5f62; --radius-card: 18px; --radius-box: 14px; --radius-pill: 999px;
  --shadow-card: 0 1px 2px rgba(10, 42, 46, .04), 0 8px 24px -12px rgba(10, 42, 46, .14); }
:root { --container: clamp(1180px, 90vw, 1440px); --gutter: clamp(16px, 3.2vw, 56px); --article: clamp(800px, 56vw, 900px); --rail: clamp(300px, 21vw, 340px); }
html .nav-inner, html .footer-inner, html .hpr-breadcrumb, html .footer-grid, html .footer-bottom { max-width: var(--container); }
html .hs-wrap, html .rebate-grid, html .wrap-wide, html .container, html header.hub-hero .wrap, main.layout-wide .wrap { max-width: var(--container); }
main.layout-home > .section, main.layout-home > section.hero, main.layout-home > .section-warm-inner, main.layout-home > .section-dark-inner { max-width: var(--container); }
@media (min-width: 769px) {
  main.layout-wide .what-grid, main.layout-wide .future-grid, main.layout-wide .philosophy-pillars, main.layout-wide .trust-cards { grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
  main.layout-wide .what-grid.what-grid-4 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
}
/* balanced card grids on wide screens: cap the columns so rows divide evenly (15 cards as 5 x 3, 8 as 4 x 2, 6 as 3 x 2) */
@media (min-width: 769px) {
  main.layout-wide .ps-grid, main.layout-wide .hf-tops { grid-template-columns: repeat(auto-fit, minmax(max(190px, calc((100% - 4 * 18px) / 5)), 1fr)) !important; }
  main.layout-wide .region-grid { grid-template-columns: repeat(auto-fit, minmax(max(190px, calc((100% - 4 * 20px) / 5)), 1fr)) !important; }
  main.layout-wide .what-grid.what-grid-4 { grid-template-columns: repeat(auto-fit, minmax(max(200px, calc((100% - 3 * 18px) / 4)), 1fr)) !important; }
  main.layout-wide .typical-grid { grid-template-columns: repeat(auto-fit, minmax(max(200px, calc((100% - 2 * 18px) / 3)), 1fr)) !important; }
  main.layout-wide .region-grid { align-items: start !important; }
}
/* wide templates: a longer reading measure, and list rows that use the row instead of a 72-character strip */
main.layout-wide p { max-width: min(54em, 100%); }
main.layout-wide .hf-i, main.layout-wide .hf-i p { max-width: none; }
@media (min-width: 900px) {
  main.layout-wide section:has(.hf-i) { max-width: min(var(--container), 1240px) !important; }
  main.layout-wide section:has(.hf-i) ul { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); column-gap: clamp(32px, 4vw, 64px); }
}
/* homepage hero on wide screens: headline and intro on the left, the search card on the right */
@media (min-width: 1100px) {
  main.layout-wide > section.hero:has(#hero-find) { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(380px, .9fr); column-gap: clamp(40px, 5vw, 96px); align-items: center; text-align: left; padding: clamp(40px, 5vw, 88px) clamp(24px, 4vw, 64px); }
  main.layout-wide > section.hero:has(#hero-find) > .hero-eyebrow { grid-column: 1; grid-row: 1; justify-self: start; margin: 0 0 18px; }
  main.layout-wide > section.hero:has(#hero-find) > .hero-h1 { grid-column: 1; grid-row: 2; max-width: none; margin: 0 0 20px; text-align: left; font-size: clamp(48px, 4.4vw, 80px); }
  main.layout-wide > section.hero:has(#hero-find) > .hero-sub { grid-column: 1; grid-row: 3; margin: 0 !important; max-width: 34em; text-align: left; }
  main.layout-wide > section.hero:has(#hero-find) > #hero-find { grid-column: 2; grid-row: 1 / span 3; margin: 0; max-width: none; width: 100%; }
  main.layout-wide > section.hero:has(#hero-find) > .quick-answer { grid-column: 1 / -1; grid-row: 4; max-width: none; margin: 40px 0 0; }
  main.layout-wide > section.hero:has(#hero-find) > .hero-trust-line { grid-column: 1 / -1; grid-row: 5; justify-content: flex-start; margin-left: 0; }
}
/* desktop layout: long-form pages use the width. A sticky side panel (page sections + rebate-plan call to action) sits beside the reading column from 1180px; below that it is hidden and nothing changes. */
.page-rail { display: none; }
@media (min-width: 1180px) {
  main.has-rail { display: grid; grid-template-columns: minmax(24px, 1fr) minmax(0, var(--article)) var(--rail) minmax(24px, 1fr); column-gap: clamp(32px, 3.4vw, 64px); }
  main.has-rail > * { grid-column: 2; }
  main.has-rail > .hero, main.has-rail > section.hero, main.has-rail > header.hero, main.has-rail > div.hero { grid-column: 1 / -1; }
  main.has-rail > .page-rail { display: block; grid-column: 3; align-self: start; position: sticky; top: 96px; margin-top: 32px; }
  .page-rail .rail-toc { border-left: 2px solid var(--rule); padding-left: 18px; }
  .page-rail .rail-h { font: 700 12px/1.2 'Inter Tight', 'Inter Tight Fallback', sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-soft); margin: 0 0 12px; }
  .page-rail ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; max-height: calc(100vh - 340px); overflow: auto; }
  .page-rail ol a { display: block; padding: 6px 0; font-size: 14px; line-height: 1.35; color: var(--ink-soft); text-decoration: none; }
  .page-rail ol a:hover { color: var(--teal-deep); text-decoration: underline; }
  .page-rail ol a[aria-current="true"] { color: #a4540a; font-weight: 700; }
  .page-rail .rail-cta { margin-top: 24px; padding: 20px; border-radius: 14px; background: var(--teal-deep); color: #fff; }
  .page-rail .rail-cta p { max-width: none; margin: 0 0 8px; font-size: 14px; line-height: 1.45; color: rgba(255,255,255,.88); }
  .page-rail .rail-cta .rail-cta-h { font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 18px; font-weight: 600; color: #fff; }
  .page-rail .rail-btn { display: block; margin-top: 12px; padding: 12px 16px; border-radius: 999px; background: #a4540a; color: #fff; text-align: center; font-weight: 700; text-decoration: none; }
  .page-rail .rail-btn:hover { background: #8a4607; }
  /* the side panel already carries the call to action: the floating button would cover its contents */
  body:has(main.has-rail > .page-rail) .sticky-cta { display: none !important; }
}
/* phones and tablets (2026-10-13): the side panel's 'On this page' list, folded under the hero (static, from the restamp) */
/* the box is drawn on the summary and the list: the article column puts its gutter in the details' own padding */
.toc-mobile { margin-top: 20px; margin-bottom: 8px; }
.toc-mobile summary { display: flex; align-items: center; min-height: 48px; padding: 0 16px; border: 1px solid var(--rule); border-radius: 12px; background: #fff; font-weight: 700; color: var(--teal-deep); cursor: pointer; list-style: none; }
.toc-mobile[open] summary { border-radius: 12px 12px 0 0; }
.toc-mobile summary::-webkit-details-marker { display: none; }
.toc-mobile summary::after { content: "+"; margin-left: auto; font-size: 22px; font-weight: 500; line-height: 1; color: var(--teal); }
.toc-mobile[open] summary::after { content: "\2212"; }
.toc-mobile ol { margin: 0; padding: 4px 16px 10px 36px; border: 1px solid var(--rule); border-top: 0; border-radius: 0 0 12px 12px; background: #fff; }
main .toc-mobile ol li { margin: 0; max-width: none; font-size: 16px; line-height: 1.35; }
.toc-mobile a { display: flex; align-items: center; min-height: 44px; color: var(--teal-deep); font-weight: 600; text-decoration: none; }
@media (min-width: 1180px) { .toc-mobile { display: none; } }
/* the desktop menu always shows "See my rebates", so the floating button only covered tables and links there (2026-10-13) */
@media (min-width: 769px) { .sticky-cta, .sticky-cta.on, .sticky-cta.show { display: none !important; } }
/* hover colours on light backgrounds use the darker amber (4.5:1 on white and paper) */
.rank .btn-call:hover { background: #a4540a; }
/* phones: the menu slides away while reading down and comes back on any scroll up (script below) */
@media (max-width: 768px) {
  .nav { transition: transform .2s ease; }
  .nav.nav-away { transform: translateY(-100%); }
  .hpr-breadcrumb { padding-top: 0; padding-bottom: 0; }
  .hpr-breadcrumb a { display: inline-flex; align-items: center; min-height: 44px; }
}
@media (min-width: 1180px) {
  main.has-wide > div.wrap, main.has-wide > section.wrap, main.has-wide > section.section > .wrap, main.has-wide > nav.toc { max-width: var(--container); }
}
/* installer profile pages: contrast (page greys and amber), and a heading size that cannot sit on the edge of the narrower column */
.ip-breadcrumb, .ip-breadcrumb a, .ip-rating-count, .ip-maps-link, .ip-vet-note { color: #5f5849 !important; }
.ip-footer-note { color: #6b6355 !important; }
.ip-nearby-rating { color: #a4540a !important; }
.ip-btn-primary, #ip-quote-btn, .ip-quote-form button { background: #a4540a !important; color: #fff !important; }
@media (min-width: 1100px) { .ip-hero h1 { font-size: 32px; } }
/* installer profile pages: reading column plus a sticky quote panel */
@media (min-width: 1100px) {
  .ip-wrap { max-width: var(--container); display: grid; grid-template-columns: minmax(0, 1fr) clamp(340px, 26vw, 440px); column-gap: clamp(40px, 4vw, 72px); }
  .ip-wrap > * { grid-column: 1; }
  .ip-wrap > .ip-breadcrumb { grid-column: 1 / -1; }
  .ip-wrap > .ip-quote { grid-column: 2; grid-row: 2 / span 12; position: sticky; top: 96px; align-self: start; margin-top: 0; display: block; padding: 26px 22px; }
  .ip-wrap > .ip-quote > form { grid-column: auto; grid-row: auto; }
}
/* guard: some older pages style every <nav> (display:flex, max-width:1000px, padding). The site header, breadcrumb and side-panel contents are navs too, so reset what those rules set. */
nav.nav { display: block; max-width: none; margin: 0; padding: 0; }
nav.hpr-breadcrumb, nav.rail-toc { display: block; }
nav.rail-toc { max-width: none; margin: 0; padding-top: 0; padding-bottom: 0; padding-right: 0; }
/* pages that still carry an older breadcrumb next to the shared one: show the shared one only */
body:has(nav.hpr-breadcrumb) div.breadcrumb, nav.hpr-breadcrumb + div[style]:has(> div[style] > a[href="/"]:first-child) { display: none; }
/* program status pills, one design for rebate cards and hub tables (2026-10-14). Labels and tones: scripts/status_pills.py.
   The label is always a word, never colour alone. Tones: open green, soon amber, closed red, info grey (all 4.5:1 or more). */
.rb-status, .program-status { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 99px; font-size: 13px; font-weight: 700; line-height: 1.3; letter-spacing: 0; text-transform: none; white-space: nowrap; background: #e8e8e8; color: #444; }
.rb-status::before, .program-status::before { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.rb-status { margin-left: 6px; }
.rb-active, .program-status.status-open { background: #e3f1e8; color: #1f5a3d; }
.rb-upcoming, .rb-waitlist, .rb-paused, .rb-check, .program-status.status-limited { background: #fdeccf; color: #8a4a06; }
.rb-closed, .program-status.status-closed { background: #f3dcdc; color: #8a2b2b; }
.rb-info { background: #e8e8e8; color: #444; }
/* breadcrumb base (some pages never had the breadcrumb CSS block) */
.hpr-breadcrumb { margin: 0 auto; padding: 14px 28px; font-size: 13px; color: var(--ink-soft); }
.hpr-breadcrumb ol { list-style: none; display: flex; flex-wrap: wrap; gap: 0; margin: 0; padding: 0; }
.hpr-breadcrumb li { display: flex; align-items: center; margin: 0; }
.hpr-breadcrumb li:not(:last-child)::after { content: '/'; margin: 0 8px; color: var(--rule); }
.hpr-breadcrumb a { color: var(--ink-soft); text-decoration: none; }
.hpr-breadcrumb a:hover { color: var(--teal-deep); text-decoration: underline; }
.hpr-breadcrumb li[aria-current="page"] { color: var(--ink); font-weight: 600; }
@media (max-width: 600px) { .hpr-breadcrumb { padding: 10px 20px; } }
/* skip link: first tab stop, visible on focus */
.skip-link { position: absolute; left: 12px; top: -64px; z-index: 100; background: var(--teal-deep, #08363f); color: #fff; padding: 12px 18px; border-radius: 0 0 10px 10px; font-weight: 700; text-decoration: none; transition: top .15s; }
.skip-link:focus { top: 0; }
main:focus { outline: none; }
/* design pass 2026-10-09: touch targets, contrast, focus, motion, tables */
/* contrast (WCAG AA): amber and sage text on light backgrounds, white-on-amber buttons, footer links */
.btn:not(.btn-secondary), .btn-primary, a.cta, .cta, .gq-cta, .sticky-cta, .qf-btn, .filter-btn.active, #hero-find button, .nl button, #newsletter-form button,
a[style*="background:var(--amber)"], a[style*="background: var(--amber)"], button[style*="background:var(--amber)"], button[style*="background: var(--amber)"], button[style*="background: #d4751c"], a[style*="background: #d4751c"], a[style*="background:#d4751c"] { background: #a4540a !important; color: #fff !important; }
.btn:not(.btn-secondary):hover, .btn-primary:hover, a.cta:hover, .cta:hover, .gq-cta:hover, .sticky-cta:hover, .qf-btn:hover, #hero-find button:hover, .nl button:hover, #newsletter-form button:hover { background: #8a4607 !important; }
.section-eyebrow, .finder-cat, .rr-eyebrow, .fact-label, .eyebrow-dark, .quick-answer-label, .popular-label, .program-amount, .tag:not([class*="tag-"]), .stat-num, .go, .hero-eyebrow,
[style*="color:var(--amber)"], [style*="color: var(--amber)"], [style*="color:#d4751c"], [style*="color: #d4751c"] { color: #a4540a !important; }
.hs-stat b small { color: #a4540a !important; }
.finder-source, .region-tag, .rank-cell, .adr, td small, p.small, span.small:not(.overall-badge), [style*="color:var(--sage)"], [style*="color: var(--sage)"], [style*="color:#6b8e7f"], [style*="color: #6b8e7f"] { color: #4f6f61 !important; }
.src, p.src, p.src a { color: #6b6355 !important; }
section:not([class*="hero"]) .eyebrow, .step-head .eyebrow, .status-pill-limited, .rebate-card .amount, .tag-fed, .installer-note .mini-list .stars, small[style*="color:var(--amber)"] { color: #a4540a !important; }
.finder-cat a, .city-card > a { color: #a4540a; }
.footer .footer-col-links a { color: rgba(250, 247, 242, 0.8) !important; }
.footer .footer-bottom, .footer .footer-bottom a, .footer .footer-tagline { color: rgba(250, 247, 242, 0.7) !important; }
/* readable line length: running text stops at 72 characters */
main p, article p, .wrap p, section p, .wrap li, article li, main li { max-width: 43.2em; }
.footer p, .footer li, nav p, nav li, table p, table li { max-width: none; }
/* hero text is short and already centred or aligned by the page: never cap it (a cap would need a script to re-centre it after first paint) */
.hero p, header.hero p, .hero .lead, .hero-sub, .hero li { max-width: none; }
/* readable text floor: nothing below 13px */
[style*="font-size:9px"],
[style*="font-size: 9px"],
[style*="font-size:9.5px"],
[style*="font-size: 9.5px"],
[style*="font-size:10px"],
[style*="font-size: 10px"],
[style*="font-size:10.5px"],
[style*="font-size: 10.5px"],
[style*="font-size:11px"],
[style*="font-size: 11px"],
[style*="font-size:11.5px"],
[style*="font-size: 11.5px"],
[style*="font-size:12px"],
[style*="font-size: 12px"],
[style*="font-size:12.5px"],
[style*="font-size: 12.5px"],
small,
.small,
.finder-cat,
.finder-source,
.program-status,
.rr-eyebrow,
.tag,
.region-tag,
.status-pill,
.badge,
.bf,
.lbl,
.src,
.ps-lab,
.ps-tag,
.hf-pill,
.section-eyebrow,
.quick-answer-label,
.popular-label,
.rb-status,
.region-count,
.stat span,
.hs-stat span,
.installer-note,
.rg { font-size: 13px !important; }
ol[class*="crumb"] li, ol[class*="crumb"] a, nav[aria-label*="readcrumb"] li, nav[aria-label*="readcrumb"] a, .breadcrumb, .breadcrumb a, .breadcrumbs, .breadcrumbs a, .crumbs, .crumbs a { font-size: 13px !important; }
.powerscore-table small, table small { font-size: 12px !important; }
/* tap targets on phones */
@media (max-width: 768px) {
  nav.toc a, .fact-value a, .city-card > a, .hf-close a, h3 > a, h4 > a, ol[class*="crumb"] a, .breadcrumb a, .breadcrumbs a, .crumbs a, .installer-note a, p > a[href]:only-child { display: inline-flex; align-items: center; min-height: 44px; }
  div > a[style*="border:1px solid var(--rule)"] { display: inline-flex !important; align-items: center; min-height: 40px; padding-top: 6px !important; padding-bottom: 6px !important; }
  details > summary { padding: 12px 0; min-height: 44px; box-sizing: border-box; }
}
/* sibling-page links (builders emit them as inline spans) become tappable chips */
div[style*="line-height:2.2"] { display: flex !important; flex-wrap: wrap; gap: 8px; line-height: 1.3 !important; }
div[style*="line-height:2.2"] > span { margin: 0 !important; }
div[style*="line-height:2.2"] > span > a { display: inline-flex; align-items: center; min-height: 44px; padding: 6px 14px; border: 1px solid var(--rule); border-radius: 999px; background: #fff; text-decoration: none; font-weight: 600; color: var(--teal-deep); }
div[style*="line-height:2.2"] > span > a:hover { border-color: var(--amber); color: #a4540a; }
html { scroll-padding-top: 84px; -webkit-text-size-adjust: 100%; }
h1, h2 { text-wrap: balance; }
/* focus ring (2026-10-13): teal with a white halo reaches 3:1 on paper and white; amber only on the dark surfaces */
:focus-visible { outline: 3px solid var(--teal-deep, #08363f); outline-offset: 3px; border-radius: 4px; box-shadow: 0 0 0 3px #fff; }
:is(.tpl-article .hero, .tpl-ranking .hero, .hub-hero, .footer, .hpr-newsletter) :focus-visible { outline-color: var(--amber-bright, #e88a2e); box-shadow: none; }
.nav-desktop-only a, .nav-mobile-only a { display: inline-flex; align-items: center; min-height: 44px; }
.logo { min-height: 44px; }
.nav-pick { min-height: 44px; }
@media (max-width: 768px) {
  .nav-inner { padding: 8px 16px; row-gap: 0; }
  .nav-mobile-only { gap: 4px; }
  .nav-mobile-only a { padding: 0 10px; }
  .nav-pick { font-size: 13px !important; padding: 0 14px !important; }
}
/* search box in the menu, on every page */
#city-dropdown-modal { position: absolute; top: 56px; right: 20px; z-index: 49; width: min(360px, calc(100vw - 32px)); max-height: 75vh; overflow-y: auto; background: #fff; border: 1px solid var(--rule, #e3dccf); border-radius: 12px; box-shadow: 0 8px 24px rgba(10, 42, 46, 0.12); text-align: left; }
.nav-region-tabs { margin-bottom: 14px; }
.nav-region-group + .nav-region-group { margin-top: 12px; }
.nav-region-group-label { display: block; margin: 0 0 6px; font: 700 11px/1 'Inter Tight', sans-serif; letter-spacing: .09em; text-transform: uppercase; color: var(--muted, #4a5f62); }
.nav-region-group-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.nav-region-tab { flex: 0 0 auto; padding: 7px 11px; border: 1px solid var(--rule, #e3dccf); border-radius: 999px; background: #fff; color: var(--ink); font: 600 13px/1.2 'Inter Tight', sans-serif; white-space: nowrap; cursor: pointer; }
.nav-region-tab:hover { border-color: var(--teal); }
.nav-region-tab.is-on { background: var(--teal-deep); border-color: var(--teal-deep); color: #fff; }
.nav-region-cities { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; border-top: 1px solid var(--rule, #e3dccf); padding-top: 12px; }
.nav-region-cities[hidden] { display: none; }
.nav-region-cities a { display: block; padding: 8px 10px; border-radius: 8px; background: var(--paper, #faf7f2); color: var(--ink); font: 600 14px/1.25 'Inter Tight', sans-serif; text-decoration: none; }
.nav-region-cities a:hover, .nav-region-cities a:focus-visible { background: var(--paper-warm, #f5efe5); color: var(--teal-deep); }
@media (max-width: 600px) { #city-dropdown-modal { right: 16px; } }
.nav-search { position: relative; display: flex; align-items: center; flex: 0 1 230px; min-width: 150px; margin: 0 14px; }
.nav-search-glass { position: absolute; left: 13px; color: var(--teal); pointer-events: none; }
.nav-search-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.nav-search input { width: 100%; min-height: 44px; padding: 0 14px 0 40px; border: 1.5px solid var(--rule, #e3dccf); border-radius: 999px; background: #fff; color: var(--ink); font: 500 15px 'Inter Tight', sans-serif; -webkit-appearance: none; appearance: none; }
.nav-search input::placeholder { color: #5b6a6c; }
.nav-search input:focus { outline: none; border-color: var(--amber); box-shadow: 0 0 0 3px rgba(212, 117, 28, 0.18); }
.nav-search-go { display: none; }
body:has(#hpr-search) .nav-search { display: none; }
@media (min-width: 769px) and (max-width: 1023px) {
  .nav-inner { flex-wrap: wrap; row-gap: 6px; }
  .nav-desktop-only a, .nav-pick { white-space: nowrap; }
  .nav-search { order: 10; flex: 1 0 100%; margin: 0 0 4px; }
}
@media (max-width: 768px) {
  .nav-search { order: 10; flex: 1 0 100%; margin: 2px 0 6px; min-width: 0; }
  .nav-search input { font-size: 16px; }
  .nav-search-go { display: inline-flex; align-items: center; position: absolute; right: 4px; min-height: 36px; padding: 0 14px; border: none; border-radius: 999px; background: var(--teal-deep); color: var(--paper); font: 700 14px 'Inter Tight', sans-serif; cursor: pointer; }
  .nav-search input { padding-right: 64px; }
}
.footer-tagline { color: rgba(250, 247, 242, 0.7); font-size: 14px; }
.footer-col-title { font-size: 13px; color: rgba(250, 247, 242, 0.82); }
.footer-col-links { gap: 2px; font-size: 15px; }
.footer-col-links a { color: rgba(250, 247, 242, 0.78); display: inline-block; padding: 7px 0; min-height: 24px; }
.footer-col-links a:hover { color: var(--amber-bright, #e88a2e); text-decoration: underline; }
.footer-bottom { font-size: 13px; color: rgba(250, 247, 242, 0.68); }
.footer-bottom a { color: inherit; text-decoration: underline; }
@media (max-width: 700px) {
  :not(.tw) > table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
/* Heat pump links box on the homepage (scripts/add_heat_pump_links.py); other pages carry the same rules inline */
.hp-links { max-width: 880px; margin: 18px auto; padding: 14px 20px; background: #f5efe5; border-left: 4px solid #d4751c; border-radius: 8px; font-size: 15px; line-height: 1.6; }
@media (max-width: 912px) { .hp-links { margin: 18px 16px; } }
/* Federal heat pump rebate alert box (scripts/add_federal_alert.py), 2026-10-17 v3: one module on every page. A warm light card (headline naming the heat pump rebate with those words in amber, lead line, the two amounts as a ledger) holds a rounded dark teal sign-up panel (what you get, form), and "how it will work" runs along the bottom. Layout is plain flex-wrap, no container queries or subgrid (those rendered stacked and squeezed in Safari): the panel sits beside the copy when the card is wide and drops under it when narrow. Child rules carry the .fed-alert prefix to beat .tpl-article main p/a. */
.fed-alert { position: relative; margin: 28px 0 32px; color: var(--ink); background: radial-gradient(70% 90% at 0% 0%, rgba(232, 138, 46, .10), rgba(232, 138, 46, 0) 60%), #f6f0e6; border: 1px solid var(--card-rule); border-radius: var(--radius-card); box-shadow: 0 1px 0 rgba(255, 255, 255, .7) inset, 0 16px 40px rgba(10, 42, 46, .10); overflow: hidden; overflow: clip; }
.fed-alert[hidden] { display: none; }
.fed-alert p { max-width: none; }
.fed-alert-in { display: flex; flex-wrap: wrap; align-items: stretch; gap: 26px 34px; padding: 12px; }
.fed-alert-left { flex: 2 1 330px; min-width: 0; display: flex; flex-direction: column; gap: 26px; padding: 22px 0 6px 22px; }
.fed-alert-main { min-width: 0; }
.fed-alert .fed-alert-stack-h { margin: 0 0 10px; font-size: 15px; font-weight: 700; color: var(--ink); }
.fed-alert .fed-alert-stack-list { margin: 0; padding: 0; list-style: none; }
.fed-alert .fed-alert-stack-list li { margin: 0; padding: 0; list-style: none; border: 0 !important; background: none; }
.fed-alert .fed-alert-stack-list a, .tpl-article main .fed-alert .fed-alert-stack-list a { display: flex; align-items: baseline; justify-content: space-between; gap: 6px 16px; padding: 8px 12px; margin: 0 -12px; color: var(--ink) !important; text-decoration: none !important; border-radius: 10px; transition: background-color .2s; }
.fed-alert .fed-alert-stack-list li + li a { box-shadow: 0 -1px 0 var(--card-rule); }
.fed-alert .fed-alert-stack-list a:hover { background: rgba(13, 79, 92, .06); }
.fed-alert .fed-alert-stack-list li.is-on a, .fed-alert .fed-alert-stack-list li:only-child a { background: #fff; box-shadow: 0 0 0 1px var(--card-rule), 0 4px 12px rgba(10, 42, 46, .06); }
.fed-alert .fs-prov { font-size: 16px; font-weight: 700; line-height: 1.3; }
.fed-alert .fs-amt { flex: 0 0 auto; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 20px; font-weight: 600; line-height: 1.1; color: var(--green-money); font-variant-numeric: lining-nums tabular-nums; white-space: nowrap; }
.fed-alert .fs-amt.fs-none { font-family: 'Inter Tight', 'Inter Tight Fallback', sans-serif; font-size: 14px; font-weight: 700; color: var(--ink-soft); }
.fed-alert .fed-alert-stack-note { margin: 10px 0 0; font-size: 15px; line-height: 1.5; color: var(--ink-soft); }
.fed-alert details.fed-alert-stack > summary { display: flex; justify-content: space-between; gap: 12px; margin: 0; cursor: pointer; list-style: none; }
.fed-alert details.fed-alert-stack > summary::-webkit-details-marker { display: none; }
.fed-alert details.fed-alert-stack > summary span { font-weight: 700; color: var(--amber-text); text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.fed-alert details.fed-alert-stack[open] > summary span { display: none; }
.fed-alert details.fed-alert-stack[open] > summary { margin-bottom: 10px; }
.fed-alert .fed-alert-off { margin-left: 14px; font-size: 14px; font-weight: 500; color: var(--ink-soft); }
.fed-alert-stub { flex: 1 1 300px; align-self: flex-start; position: sticky; top: 88px; max-width: 100%; box-sizing: border-box; display: flex; flex-direction: column; gap: 14px; padding: 24px 24px 22px; color: var(--paper); background: radial-gradient(80% 60% at 100% 0%, rgba(232, 138, 46, .18), rgba(232, 138, 46, 0) 65%), linear-gradient(165deg, #0f5361 0%, #08363f 55%, #062c33 100%); border-radius: 14px; box-shadow: 0 12px 28px rgba(8, 54, 63, .22); }
.fed-alert-stub ::selection { color: var(--ink); background: var(--amber-bright); }
.fed-alert-how { margin: 4px 22px 22px; padding-top: 22px; border-top: 1px solid var(--card-rule); }
.fed-alert .fed-alert-head { display: flex; align-items: flex-start; gap: 16px; margin: 0 0 12px; }
.fed-alert .fed-alert-unit { flex: 0 0 auto; width: 52px; height: 46px; margin-top: 3px; color: var(--teal); }
.fed-alert .fed-alert-fan { transform-box: view-box; transform-origin: 26px 26px; animation: fed-fan 7s linear infinite; }
@keyframes fed-fan { to { transform: rotate(360deg); } }
.fed-alert .fed-alert-title { margin: 0; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(25px, 2.5vw, 34px); line-height: 1.12; font-weight: 600; letter-spacing: -.018em; color: var(--ink); text-wrap: balance; }
.fed-alert .fed-alert-title em { font-style: normal; color: var(--amber-text); }
.fed-alert .fed-alert-body { margin: 0 0 20px; max-width: 34.8em; font-size: 18px; line-height: 1.6; font-weight: 500; color: var(--ink); }
.fed-alert .fed-alert-amounts { margin: 0; padding: 0; }
.fed-alert .fed-alert-amounts div { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 18px; padding: 12px 0; border-top: 1px solid var(--card-rule); }
.fed-alert .fed-alert-amounts div:last-child { border-bottom: 1px solid var(--card-rule); }
.fed-alert .fed-alert-amounts dt { flex: 0 0 auto; min-width: 210px; margin: 0; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(26px, 2.5vw, 32px); line-height: 1.08; font-weight: 600; letter-spacing: -.015em; font-variant-numeric: lining-nums tabular-nums; color: var(--ink); white-space: nowrap; }
.fed-alert .fed-alert-amounts div:first-child dt { color: var(--amber-text); }
.fed-alert .fed-alert-amounts dd { flex: 1 1 180px; margin: 0; font-size: 17px; line-height: 1.45; color: var(--ink-soft); }
.fed-alert .fed-alert-steps-h { margin: 0 0 22px; font-size: 15px; font-weight: 700; color: var(--ink); }
.fed-alert .fed-alert-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 0 0 20px; padding: 0; list-style: none; counter-reset: fed; }
.fed-alert .fed-alert-steps li { counter-increment: fed; position: relative; margin: 0; padding: 24px 22px 0 0; list-style: none; font-size: 16px; line-height: 1.45; color: var(--ink-soft); background: none; border: 0 !important; border-top: 2px solid var(--card-rule) !important; }
.fed-alert .fed-alert-steps li::before { content: counter(fed); position: absolute; left: 0; top: -14px; display: grid; place-items: center; width: 26px; height: 26px; font-size: 13px; font-weight: 700; color: var(--paper); background: var(--teal-deep); border-radius: 50%; box-shadow: 0 0 0 4px #f6f0e6; }
.fed-alert .fed-alert-steps b { display: block; color: var(--ink); }
.fed-alert .fed-alert-more { margin: 0; font-size: 16px; font-weight: 700; }
.fed-alert .fed-alert-more a, .tpl-article main .fed-alert .fed-alert-more a { color: var(--amber-text) !important; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.fed-alert .fed-alert-more a:hover, .tpl-article main .fed-alert .fed-alert-more a:hover { color: var(--amber-text-deep, #8a4607) !important; }
.fed-alert .fed-alert-badge { display: inline-flex; align-self: flex-start; align-items: center; gap: 8px; margin: 0; padding: 4px 12px; font-size: 13px; font-weight: 700; color: #f7b56f; background: rgba(232, 138, 46, .14); border: 1px solid rgba(232, 138, 46, .42); border-radius: 999px; }
.fed-alert .fed-alert-badge span { width: 7px; height: 7px; border-radius: 50%; background: var(--amber-bright); }
.fed-alert .fed-alert-ask { margin: 0; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 24px; line-height: 1.15; font-weight: 600; letter-spacing: -.012em; color: var(--paper); }
.fed-alert .fed-alert-gets { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }
.fed-alert .fed-alert-gets li { position: relative; margin: 0; padding: 0 0 0 30px; font-size: 16px; line-height: 1.4; color: rgba(250, 247, 242, .92); list-style: none; border: 0 !important; background: none; }
.fed-alert .fed-alert-gets li::before { content: ""; position: absolute; left: 0; top: 1px; width: 20px; height: 20px; border-radius: 50%; background: var(--amber-bright); }
.fed-alert .fed-alert-gets li::after { content: ""; position: absolute; left: 7px; top: 5px; width: 5px; height: 9px; border: solid var(--ink); border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.fed-alert .fed-alert-count { display: inline-flex; align-self: flex-start; margin: 0; padding: 5px 12px; font-size: 14px; font-weight: 700; color: var(--ink); background: var(--paper); border-radius: 999px; }
.fed-alert .fed-alert-count[hidden] { display: none; }
.fed-alert-form { display: flex; flex-direction: column; gap: 10px; margin: 2px 0 0; }
.fed-alert-form[hidden] { display: none; }
.fed-alert-form label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.fed-alert-form input[type="email"], .fed-alert-form select { -webkit-appearance: none; appearance: none; display: block; width: 100%; height: 52px; margin: 0; padding: 0 14px; box-sizing: border-box; font: inherit; font-size: 16px; line-height: normal; color: var(--ink); background-color: #fff; border: 1px solid transparent; border-radius: 10px; caret-color: var(--amber-text); }
.fed-alert-form select { padding-right: 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1.5l6 6 6-6' fill='none' stroke='%230a2a2e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 15px center; cursor: pointer; }
.fed-alert-form input::placeholder { color: #5b6d70; opacity: 1; }
.fed-alert-form input:focus-visible, .fed-alert-form select:focus-visible, .fed-alert-form button:focus-visible, .fed-alert a:focus-visible, .fed-alert-share button:focus-visible { outline: 3px solid var(--amber-bright); outline-offset: 2px; }
.fed-alert-form button { -webkit-appearance: none; appearance: none; height: 54px; padding: 0 22px; font: inherit; font-size: 17px; font-weight: 700; color: var(--ink); background: var(--amber-bright); border: 0; border-radius: 10px; cursor: pointer; box-shadow: 0 8px 20px rgba(0, 0, 0, .25); transition: transform .2s cubic-bezier(.16, 1, .3, 1), box-shadow .2s cubic-bezier(.16, 1, .3, 1), background-color .2s; }
.fed-alert-form button:hover { background: #f09a44; transform: translateY(-1px); box-shadow: 0 12px 26px rgba(0, 0, 0, .3); }
.fed-alert-form button:disabled { opacity: .7; cursor: wait; transform: none; }
.fed-alert-form .fed-alert-hp { position: absolute; left: -9999px; }
.fed-alert .fed-alert-note { margin: 0; font-size: 15px; line-height: 1.5; color: rgba(250, 247, 242, .9); }
.fed-alert .fed-alert-note a:not([class]), .tpl-article main .fed-alert .fed-alert-note a { color: var(--paper) !important; text-decoration: underline; text-underline-offset: 3px; }
.fed-alert .fed-alert-done { margin: 0; padding: 12px 14px; font-size: 16px; font-weight: 600; color: var(--paper); background: rgba(250, 247, 242, .12); border-radius: 10px; }
.fed-alert .fed-alert-done[hidden] { display: none; }
.fed-alert .fed-alert-share { margin: 0; }
.fed-alert .fed-alert-share[hidden] { display: none; }
.fed-alert .fed-alert-share p { margin: 0 0 8px; font-size: 16px; font-weight: 700; color: var(--paper); }
.fed-alert .fed-alert-share div { display: flex; flex-wrap: wrap; gap: 8px; }
.fed-alert .fed-alert-share a, .fed-alert .fed-alert-share button, .tpl-article main .fed-alert .fed-alert-share a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; font: inherit; font-size: 15px; font-weight: 700; color: var(--paper) !important; text-decoration: none; background: rgba(250, 247, 242, .12); border: 1px solid rgba(250, 247, 242, .3); border-radius: 999px; cursor: pointer; }
.fed-alert .fed-alert-share a:hover, .fed-alert .fed-alert-share button:hover { background: rgba(250, 247, 242, .22); }
@media (max-width: 720px) {
  .fed-alert-in { gap: 20px; padding: 10px; }
  .fed-alert-left { display: contents; }
  .fed-alert .fed-alert-unit { display: none; }
  .fed-alert .fed-alert-title { font-size: 24px; }
  .fed-alert-main { order: 1; padding: 14px 8px 0; }
  .fed-alert-stub { order: 2; position: static; }
  .fed-alert-stack { order: 3; padding: 4px 8px 0; }
  .fed-alert-how { margin: 0 18px 18px; }
  .fed-alert .fed-alert-stack-list a, .tpl-article main .fed-alert .fed-alert-stack-list a { margin: 0 -8px; padding: 8px; }
  .fed-alert .fed-alert-amounts dt { min-width: 0; }
  .fed-alert .fed-alert-steps { grid-template-columns: minmax(0, 1fr); margin-left: 13px; }
  .fed-alert .fed-alert-steps li { padding: 0 0 18px 26px; border-top: 0 !important; border-left: 2px solid var(--card-rule) !important; }
  .fed-alert .fed-alert-steps li:last-child { padding-bottom: 2px; }
  .fed-alert .fed-alert-steps li::before { left: -14px; top: -2px; }
}
@media (max-width: 520px) {
  .fed-alert-stub { padding: 20px 16px 18px; }
  .fed-alert .fed-alert-head { gap: 12px; }
  .fed-alert .fed-alert-unit { width: 40px; height: 35px; }
  .fed-alert .fed-alert-body { font-size: 16px; }
}
.hp-fed-wrap { max-width: 1100px; margin: 8px auto 0; padding: 0 24px; }
@media (max-width: 520px) { .hp-fed-wrap { padding: 0 16px; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
/* Slim federal alert bar (2026-10-22): a one-line strip at the foot of Canadian pages, built by the script below. It stays out of the way: shown after a little scrolling, hidden while a full alert box is on screen, gone for 14 days once closed and for good after a signup. */
.fed-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 16px; padding: 10px 52px 10px 16px; color: var(--paper); background: linear-gradient(165deg, #0f5361 0%, #08363f 70%); box-shadow: 0 -6px 24px rgba(8, 54, 63, .28); transform: translateY(110%); transition: transform .25s ease; }
.fed-bar.on { transform: none; }
.fed-bar[hidden] { display: none; }
.fed-bar p { margin: 0; max-width: none; font-size: 15px; line-height: 1.35; color: var(--paper); }
.fed-bar p b { color: var(--amber-bright); }
.fed-bar form { display: flex; flex: 0 1 auto; gap: 8px; margin: 0; }
.fed-bar input[type="email"] { width: 230px; min-width: 0; min-height: 44px; padding: 0 12px; font: inherit; font-size: 16px; color: var(--ink); background: #fff; border: 0; border-radius: 8px; }
.fed-bar button[type="submit"] { min-height: 44px; padding: 0 16px; font: inherit; font-size: 15px; font-weight: 700; color: #fff; background: #a4540a; border: 0; border-radius: 8px; cursor: pointer; white-space: nowrap; }
.fed-bar button[type="submit"]:hover { background: #8a4607; }
.fed-bar .fed-bar-x { position: absolute; top: 50%; right: 6px; width: 44px; height: 44px; margin-top: -22px; font-size: 26px; line-height: 1; color: var(--paper); background: none; border: 0; cursor: pointer; }
.fed-bar .fed-bar-hp { position: absolute; left: -9999px; }
.fed-bar-msg { font-weight: 700; }
.fed-bar .fb-s { display: none; }
@media (max-width: 560px) { .fed-bar { padding: 10px 12px 12px; justify-content: flex-start; } .fed-bar p { padding-right: 36px; } .fed-bar .fed-bar-x { top: 2px; right: 0; margin-top: 0; width: 40px; height: 40px; } .fed-bar .fb-l { display: none; } .fed-bar .fb-s { display: inline; } .fed-bar form { flex: 1 1 100%; } .fed-bar input[type="email"] { flex: 1 1 auto; width: auto; } body.has-fed-bar .sticky-cta { display: none !important; } }
@media print { .fed-bar { display: none !important; } }
/* Program alert box (scripts/add_program_alerts.py, 2026-10-23): a quiet one-line sign-up at the top of each program status page. */
.prog-alert { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin: 0 0 24px; padding: 16px 20px; background: #f6f0e6; border: 1px solid var(--card-rule); border-left: 5px solid var(--amber); border-radius: var(--radius-card); }
.prog-alert-text { flex: 1 1 260px; min-width: 0; }
.prog-alert p { margin: 0; max-width: none; }
.prog-alert .prog-alert-h { font-weight: 700; font-size: 17px; color: var(--ink); }
.prog-alert-text p:last-child { font-size: 15px; line-height: 1.5; color: var(--muted); margin-top: 2px; }
.prog-alert-form { display: flex; flex: 1 1 320px; gap: 8px; margin: 0; }
.prog-alert-form label { position: absolute; left: -9999px; }
.prog-alert-form input[type="email"] { flex: 1 1 auto; min-width: 0; min-height: 46px; padding: 0 12px; font: inherit; font-size: 16px; color: var(--ink); background: #fff; border: 1px solid #b9ae9c; border-radius: 8px; }
.prog-alert-form button { min-height: 46px; padding: 0 18px; font: inherit; font-weight: 700; color: #fff; background: #a4540a; border: 0; border-radius: 8px; cursor: pointer; white-space: nowrap; }
.prog-alert-form button:hover { background: #8a4607; }
.prog-alert-hp { position: absolute; left: -9999px; }
.prog-alert .prog-alert-done { flex: 1 1 100%; font-weight: 700; color: var(--green-money); }
.prog-alert .prog-alert-note { flex: 1 1 100%; font-size: 13px; color: var(--muted); }
@media (max-width: 560px) { .prog-alert-form { flex: 1 1 100%; } }
@media print { .prog-alert { display: none !important; } }
/* YouTube embed (scripts/add_youtube_embeds.py, 2026-10-23): the short video beside the page it explains, with watch and subscribe links. */
.yt-embed { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin: 24px 0; padding: 18px 20px; background: #f6f0e6; border: 1px solid var(--card-rule); border-radius: var(--radius-card); }
.yt-frame { flex: 0 0 auto; width: 220px; max-width: 100%; aspect-ratio: 9 / 16; border-radius: 12px; overflow: hidden; background: #0a2a2e; }
.yt-frame iframe { display: block; width: 100%; height: 100%; border: 0; }
.yt-text { flex: 1 1 240px; min-width: 0; }
.yt-text p { margin: 0 0 8px; max-width: none; }
.yt-text .yt-h { font-weight: 700; font-size: 19px; line-height: 1.3; color: var(--ink); }
.yt-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.yt-links a { display: inline-block; min-height: 44px; line-height: 44px; padding: 0 18px; font-weight: 700; color: #fff; background: #a4540a; border-radius: 8px; text-decoration: none; }
.yt-links a + a { background: transparent; color: #a4540a; border: 2px solid #a4540a; line-height: 40px; }
@media (max-width: 560px) { .yt-frame { width: 100%; max-width: 260px; margin: 0 auto; } }
@media print { .yt-embed { display: none !important; } }
</style>
/* ---- LEARN components (2026-10-23): editorial cards, how-to-choose tips, listicle, quiz. Markup from scripts/learn_kit.py ---- */
.learn-row{margin:48px 0 8px}
.learn-row>h2{margin:0 0 6px}
.learn-row>p.learn-sub{margin:0 0 18px;color:var(--muted)}
.learn-grid{display:grid;gap:18px;grid-template-columns:1fr}
@media(min-width:760px){.learn-grid{grid-template-columns:repeat(3,1fr)}}
.learn-card{display:flex;flex-direction:column;gap:12px;padding:16px;border:1px solid var(--card-rule);border-radius:24px;background:#f4efe6;color:var(--ink);text-decoration:none;transition:transform .15s,box-shadow .15s}
.learn-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-card)}
.learn-tile{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:168px;padding:18px;border-radius:16px;overflow:hidden;color:#fff;background:var(--teal-deep)}
.learn-tile::before{content:"";position:absolute;inset:0;background:radial-gradient(90% 120% at 100% 0%,rgba(255,255,255,.22),rgba(255,255,255,0) 60%)}
.learn-tile.t-amber{background:linear-gradient(135deg,#d4751c,#8a4607)}
.learn-tile.t-teal{background:linear-gradient(135deg,#0d4f5c,#08363f)}
.learn-tile.t-sage{background:linear-gradient(135deg,#6b8e7f,#2d6a4f)}
.learn-tile.t-ink{background:linear-gradient(135deg,#1a3d42,#0a2a2e)}
.learn-big{position:relative;font-family:Fraunces,Georgia,serif;font-weight:700;font-size:clamp(34px,4vw,48px);line-height:.98;letter-spacing:-.03em;text-transform:uppercase;transform:rotate(-2deg);transform-origin:left bottom}
.learn-kick{position:relative;align-self:flex-start;margin-bottom:10px;padding:3px 10px;border-radius:999px;background:rgba(255,255,255,.2);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.learn-card h3{margin:0;font-family:Fraunces,Georgia,serif;font-size:21px;line-height:1.2;letter-spacing:-.01em;font-weight:600}
.learn-meta{font-size:14px;color:var(--muted)}
.learn-chips{display:flex;flex-wrap:wrap;gap:6px}
.learn-chips span{padding:3px 9px;border-radius:8px;background:#e7e1d5;font-size:13px;font-weight:600}
.learn-more{margin-top:auto;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.learn-tips{margin:32px 0;padding:22px 24px;border:1px solid var(--card-rule);border-radius:20px;background:#fff}
.learn-tips h2{margin:0 0 14px!important}
.learn-tips ol{display:grid;gap:14px;margin:0;padding:0;list-style:none;counter-reset:lt}
@media(min-width:760px){.learn-tips ol{grid-template-columns:repeat(2,1fr)}}
.learn-tips li{position:relative;padding-left:48px;counter-increment:lt}
.learn-tips li::before{content:counter(lt);position:absolute;left:0;top:0;width:34px;height:34px;border-radius:50%;background:var(--amber);color:#fff;font-weight:700;display:grid;place-items:center}
.learn-tips li b{display:block;font-size:17px}
.learn-key{margin:0 0 28px;padding:18px 22px;border-radius:18px;background:#f1f7f3;border:1px solid #d5e4da}
.learn-key h2{margin:0 0 8px!important;font-size:18px!important;text-transform:uppercase;letter-spacing:.08em;color:var(--green-money)}
.learn-key ul{margin:0;padding-left:20px}
.learn-list{margin:0 0 24px;padding:0;list-style:none}
.learn-list>li{margin:0 0 28px;padding:0}
.learn-list h3{display:flex;gap:14px;align-items:flex-start;margin:0 0 8px;font-family:Fraunces,Georgia,serif;font-size:clamp(22px,2.2vw,28px);line-height:1.15;letter-spacing:-.015em}
.learn-num{flex:none;min-width:44px;height:44px;padding:0 10px;border-radius:14px;background:var(--amber);color:#fff;display:grid;place-items:center;font-size:22px;transform:rotate(-4deg)}
.learn-quote{margin:24px 0;padding:6px 0 6px 20px;border-left:5px solid var(--amber);font-family:Fraunces,Georgia,serif;font-size:clamp(20px,2.4vw,26px);line-height:1.3}
.hpr-quiz{position:relative;margin:36px 0;padding:clamp(22px,3.4vw,40px);border-radius:28px;background:radial-gradient(120% 140% at 100% 0%,rgba(232,138,46,.28),rgba(232,138,46,0) 50%),var(--teal-deep);color:#fff;overflow:hidden;box-shadow:0 24px 60px -28px rgba(8,54,63,.7)}
.qz-kick{display:inline-block;margin:0 0 12px;padding:5px 14px;border-radius:999px;background:var(--amber);color:#fff;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;transform:rotate(-2deg)}
.hpr-quiz h2{margin:0 0 8px!important;color:#fff!important;font-family:Fraunces,Georgia,serif;font-size:clamp(28px,3.6vw,44px)!important;line-height:1.05!important;letter-spacing:-.02em;max-width:18em;padding:0!important}
.hpr-quiz h2::before{display:none!important}
.hpr-quiz>p.qz-intro{margin:0 0 22px;font-size:clamp(17px,1.5vw,20px);color:rgba(255,255,255,.88);max-width:36em}
.qz-q{margin:0 0 26px;padding:0;border:0;min-width:0}
.qz-q legend{padding:0;margin:0 0 16px;font-family:Fraunces,Georgia,serif;font-weight:700;font-size:clamp(22px,2.4vw,30px);line-height:1.2;letter-spacing:-.01em}
.qz-opts{display:grid;gap:12px}
.qz-opt{display:flex;align-items:center;gap:14px;width:100%;min-height:60px;padding:14px 18px;border:2px solid rgba(255,255,255,.22);border-radius:18px;background:rgba(255,255,255,.08);color:#fff;font:inherit;font-size:clamp(17px,1.5vw,20px);font-weight:600;text-align:left;cursor:pointer;transition:transform .15s,border-color .15s,background .15s}
.qz-opt:hover{border-color:var(--amber-bright);transform:translateY(-2px);background:rgba(255,255,255,.14)}
.qz-opt:focus-visible{outline:3px solid var(--amber-bright);outline-offset:2px}
.qz-opt .qz-key{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:12px;background:rgba(255,255,255,.16);font-size:16px;font-weight:800}
.qz-opt.right{border-color:#6fd39b;background:rgba(111,211,155,.24);animation:qz-pop .35s}
.qz-opt.right .qz-key{background:#6fd39b;color:#0a2a2e}
.qz-opt.wrong{border-color:#f08a8a;background:rgba(240,138,138,.22);animation:qz-shake .35s}
.qz-opt.wrong .qz-key{background:#f08a8a;color:#4a1010}
.qz-q.done .qz-opt{cursor:default;transform:none}
.qz-q.done .qz-opt:not(.right):not(.wrong){opacity:.45}
.qz-why{margin:16px 0 0;padding:16px 18px;border-radius:16px;background:rgba(255,255,255,.12);font-size:clamp(17px,1.4vw,19px);line-height:1.5}
.qz-why::before{content:attr(data-verdict);display:block;margin-bottom:4px;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--amber-bright)}
.qz-why a{color:#fff;text-decoration:underline}
.hpr-quiz.qz-ready .qz-q{display:none}
.hpr-quiz.qz-ready .qz-q.active{display:block;animation:qz-in .3s}
.hpr-quiz.qz-ready .qz-why{display:none}
.hpr-quiz.qz-ready .qz-q.done .qz-why{display:block}
.qz-bar{display:none;align-items:center;gap:12px;margin:0 0 22px}
.hpr-quiz.qz-ready .qz-bar{display:flex}
.qz-track{flex:1;height:10px;border-radius:99px;background:rgba(255,255,255,.18);overflow:hidden}
.qz-fill{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--amber),var(--amber-bright));transition:width .4s}
.qz-count{font-size:15px;font-weight:700;color:rgba(255,255,255,.85);white-space:nowrap}
.qz-next{display:none;margin:18px 0 0;padding:14px 28px;border:0;border-radius:999px;background:var(--amber);color:#fff;font:inherit;font-size:18px;font-weight:800;cursor:pointer}
.qz-next:hover{background:var(--amber-text)}
.qz-q.done .qz-next{display:inline-block}
.qz-result{display:none;margin-top:6px;padding:clamp(20px,3vw,32px);border-radius:24px;background:#fff;color:var(--ink);text-align:center;animation:qz-in .4s}
.qz-result.on{display:block}
.qz-ring{--p:0;position:relative;display:grid;place-items:center;width:150px;height:150px;margin:0 auto 14px;border-radius:50%;background:conic-gradient(var(--amber) calc(var(--p)*1%),#e9e2d4 0)}
.qz-ring::before{content:"";position:absolute;inset:14px;border-radius:50%;background:#fff}
.qz-score{position:relative;font-family:Fraunces,Georgia,serif;font-size:44px;font-weight:700;line-height:1;color:var(--teal-deep)}
.qz-msg{display:block;margin:0 0 16px;font-family:Fraunces,Georgia,serif;font-size:clamp(22px,2.4vw,30px);font-weight:700;line-height:1.2}
.qz-acts{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.qz-acts a,.qz-acts button{padding:13px 24px;border-radius:999px;border:2px solid var(--teal-deep);background:#fff;color:var(--teal-deep);font:inherit;font-size:17px;font-weight:800;text-decoration:none;cursor:pointer}
.qz-acts a.qz-cta{background:var(--amber);border-color:var(--amber);color:#fff}
.qz-conf{position:absolute;top:-8px;width:10px;height:14px;border-radius:2px;opacity:0;animation:qz-fall 1.6s ease-out forwards}
@keyframes qz-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes qz-pop{50%{transform:scale(1.03)}}
@keyframes qz-shake{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
@keyframes qz-fall{0%{opacity:1;transform:translateY(0) rotate(0)}100%{opacity:0;transform:translateY(420px) rotate(540deg)}}
@media (prefers-reduced-motion:reduce){.hpr-quiz *{animation:none!important;transition:none!important}}
.tpl-article main article ol.learn-list>li::before,.tpl-article main article ol.learn-tips-list>li::before{display:none}
.tpl-article main article ol.learn-list>li{padding:22px 26px;min-height:0}
.learn-card.is-num .learn-tile{background:var(--ink);min-height:150px}
.learn-card.is-num .learn-big{font-size:clamp(72px,8vw,96px);color:var(--amber-bright);transform:none;line-height:.85}
.learn-card.is-num .learn-kick{background:rgba(250,247,242,.14);color:#cfe0dc}
.learn-strip{margin:8px 0 24px;padding:0;list-style:none;border:1px solid var(--rule);border-radius:14px;background:var(--paper);counter-reset:ls}
.learn-strip li{display:flex;gap:14px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--rule);counter-increment:ls}
.learn-strip li:last-child{border-bottom:0}
.learn-strip li::before{content:counter(ls);min-width:30px;font-family:Fraunces,Georgia,serif;font-size:28px;font-weight:700;color:var(--amber)}
.learn-strip a{font-family:Fraunces,Georgia,serif;font-size:18px;line-height:1.25;color:var(--ink);text-decoration:none}
.learn-strip a:hover{text-decoration:underline}
.learn-strip small{display:block;font:600 12px Inter,sans-serif;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.learn-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.learn-card.has-img .learn-tile{min-height:190px}
.learn-card.has-img .learn-tile::before{background:linear-gradient(180deg,rgba(10,42,46,0) 35%,rgba(10,42,46,.78) 100%)}
.learn-card.has-img .learn-big{text-shadow:0 2px 12px rgba(10,42,46,.5)}
.learn-card.is-num.has-img .learn-big{font-size:clamp(56px,6vw,72px)}
.learn-photo{margin:0 0 24px}
.learn-photo img{display:block;width:100%;height:auto;aspect-ratio:21/9;object-fit:cover;border-radius:20px}
@media(max-width:760px){.learn-photo img{aspect-ratio:16/9}}
.learn-photo figcaption{margin-top:6px;font-size:13px;color:var(--muted)}
.learn-card,.learn-card:hover,.learn-card *{text-decoration:none!important;border-bottom:0!important;box-shadow:none}
.learn-card:hover{box-shadow:var(--shadow-card)!important}
.learn-card .learn-more{text-decoration:underline!important;text-underline-offset:3px}
.learn-card .learn-kick{background:rgba(10,42,46,.7);color:#fff}
.learn-card.is-num .learn-kick{background:rgba(10,42,46,.7);color:#fff}
.learn-card h3,.learn-card .learn-meta{color:var(--ink)}
.learn-card .learn-meta{color:var(--muted)}
.learn-card .learn-chips span{color:var(--ink)}
.learn-wrap{max-width:1180px;margin:0 auto;padding:8px clamp(20px,3vw,40px) 24px}
.learn-wrap .learn-row{margin-top:32px}
.hub-search{display:grid;grid-template-columns:1.5fr 1fr auto;max-width:820px;margin:26px 0 8px;padding:8px;border-radius:999px;background:#fff;box-shadow:0 18px 50px -18px rgba(0,0,0,.5)}
.hub-search.is-city{margin:0;box-shadow:none;border:1px solid var(--card-rule);background:#fff}
.hub-search-wrap{max-width:1100px;margin:22px auto 0;padding:0 clamp(20px,4vw,40px)}
.hub-search-f{display:flex;align-items:center;min-width:0;border-right:1px solid var(--rule)}
.hub-search select{width:100%;min-height:54px;padding:0 20px;border:0;background:transparent;color:var(--ink);font:inherit;font-size:18px}
.hub-search-city{padding:0 22px;font-size:18px;font-weight:700;color:var(--ink)}
.hub-search button{min-height:54px;padding:0 28px;border:0;border-radius:999px;background:var(--amber);color:#fff;font:inherit;font-size:18px;font-weight:700;cursor:pointer}
.hub-search button:hover{background:var(--amber-text)}
.hub-search:focus-within{box-shadow:0 0 0 4px rgba(232,138,46,.5)}
@media(max-width:760px){.hub-search{grid-template-columns:1fr;border-radius:24px;gap:6px}.hub-search-f{border-right:0;border-bottom:1px solid var(--rule)}.hub-search button{width:100%}}
body :is(section,header).hero.hero-photo{background:linear-gradient(180deg,rgba(8,54,63,.84),rgba(8,54,63,.95)),url(/assets/learn/modern-home-1200.webp) center/cover no-repeat!important}
body :is(section,header).hero.hero-img-heat-pump-house{background-image:linear-gradient(180deg,rgba(8,54,63,.84),rgba(8,54,63,.95)),url(/assets/learn/heat-pump-house-1200.webp)!important}
body :is(section,header).hero.hero-img-solar-roof{background-image:linear-gradient(180deg,rgba(8,54,63,.84),rgba(8,54,63,.95)),url(/assets/learn/solar-roof-1200.webp)!important}
body :is(section,header).hero.hero-img-rebate-plans{background-image:linear-gradient(180deg,rgba(8,54,63,.84),rgba(8,54,63,.95)),url(/assets/learn/rebate-plans-1200.webp)!important}
body :is(section,header).hero.hero-img-duplex-home{background-image:linear-gradient(180deg,rgba(8,54,63,.84),rgba(8,54,63,.95)),url(/assets/learn/duplex-home-1200.webp)!important}
.post-card{padding:0!important;overflow:hidden;border-radius:24px!important}
.post-card .pc-photo{display:block;width:100%;height:200px;object-fit:cover}
.post-card .pc-body{padding:20px 24px 26px}
.post-card .tag{font-size:13px!important}
.post-card h3{font-family:Fraunces,Georgia,serif;font-size:clamp(20px,1.8vw,24px)!important;line-height:1.2!important;letter-spacing:-.01em}
.post-card p{font-size:17px!important;line-height:1.5!important}
.bx-hero{padding:clamp(40px,6vw,88px) 0 clamp(36px,5vw,64px)!important;text-align:left!important;color:#fff}
.bx-hero .wrap-wide{max-width:1180px;margin:0 auto;padding:0 clamp(20px,4vw,40px)}
.bx-hero h1{max-width:12em;margin:0 0 16px!important;font-family:Fraunces,Georgia,serif;font-size:clamp(40px,5.6vw,76px)!important;font-weight:700;line-height:1.02;letter-spacing:-.03em;color:#fff!important}
.bx-hero .sub{max-width:36em;margin:0 0 24px!important;font-size:clamp(19px,1.8vw,24px)!important;line-height:1.45;color:rgba(250,247,242,.92)!important}
.bx-tools{display:grid;grid-template-columns:1fr auto;gap:10px;max-width:820px;margin:0 0 20px}
.bx-search input,.bx-place select{width:100%;min-height:58px;padding:0 22px;border:0;border-radius:999px;background:#fff;color:var(--ink);font:inherit;font-size:19px}
.bx-place select{padding-right:34px}
.bx-chips{display:flex;flex-wrap:wrap;justify-content:flex-start!important;gap:10px;padding:0!important;margin:0!important;max-width:none!important;background:none!important;border:0!important;position:static!important}
.sr-only{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.bx-hero .eyebrow{margin:0 0 14px;font-size:14px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#f5b566}
.bx-chip{display:inline-block;padding:10px 18px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.4);color:#fff;font-size:17px;font-weight:700;text-decoration:none}
.bx-chip:hover{background:var(--amber);border-color:var(--amber)}
.bx-chip-quiz{background:var(--amber);border-color:var(--amber)}
#bx{max-width:1180px;margin:0 auto;padding:0 clamp(20px,4vw,40px)}
.bx-h{font-family:Fraunces,Georgia,serif;font-size:clamp(28px,3vw,40px);margin:36px 0 0}
.bx-row{margin:44px 0 0}
.bx-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin:0 0 18px}
.bx-head h2{margin:0 0 6px;font-family:Fraunces,Georgia,serif;font-size:clamp(28px,3vw,40px);letter-spacing:-.02em;line-height:1.08}
.bx-head p{margin:0;max-width:40em;font-size:18px;color:var(--muted)}
.bx-ctl{display:flex;gap:8px;flex:none}
.bx-arrow,.bx-all{min-height:46px;border-radius:999px;border:2px solid var(--teal-deep);background:#fff;color:var(--teal-deep);font:inherit;font-size:17px;font-weight:800;cursor:pointer}
.bx-arrow{width:46px}.bx-all{padding:0 18px}
.bx-arrow:hover,.bx-all:hover{background:var(--teal-deep);color:#fff}
.bx-car{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 18px;scrollbar-width:thin}
.bx-car .post-card{flex:0 0 clamp(260px,28vw,340px);scroll-snap-align:start}
.bx-row.is-grid .bx-car{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));overflow:visible}
.bx-row.is-grid .bx-arrow{display:none}
.bx-five{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))!important}
.bx-none{margin:40px 0;font-size:20px;text-align:center}
.bx-places{margin:48px 0 0;padding:32px 0;background:#f4efe6}
.bx-places .wrap-wide{max-width:1180px;margin:0 auto;padding:0 clamp(20px,4vw,40px)}
.bx-places h2{font-family:Fraunces,Georgia,serif;font-size:28px;margin:0 0 14px}
.bx-places nav{display:flex;flex-wrap:wrap;gap:10px}
.bx-places .bx-chip{background:#fff;border-color:var(--rule);color:var(--teal-deep)}
[hidden]{display:none!important}
@media(max-width:760px){.bx-tools{grid-template-columns:1fr}.bx-head{flex-direction:column;align-items:flex-start}.bx-car .post-card{flex-basis:84vw}}
.if-front{padding:8px 0 24px}
.if-in{max-width:1180px;margin:0 auto;padding:0 clamp(20px,4vw,40px)}
.if-bar{display:grid;grid-template-columns:1.5fr 1fr auto;max-width:900px;margin:-34px 0 12px;padding:8px;border-radius:999px;background:#fff;box-shadow:0 18px 50px -18px rgba(0,0,0,.5);position:relative;z-index:2}
.if-bar input,.if-bar select{width:100%;min-height:58px;padding:0 22px;border:0;background:transparent;color:var(--ink);font:inherit;font-size:19px}
.if-bar input:focus,.if-bar select:focus{outline:none}
.if-bar button{min-height:58px;padding:0 30px;border:0;border-radius:999px;background:var(--amber);color:#fff;font:inherit;font-size:19px;font-weight:800;cursor:pointer}
.if-bar button:hover{background:var(--amber-text)}
.if-bar:focus-within{box-shadow:0 0 0 4px rgba(232,138,46,.5),0 18px 50px -18px rgba(0,0,0,.5)}
.if-msg{max-width:900px;margin:0 0 10px;padding:12px 18px;border-radius:14px;background:#fdeccf;color:#6b3a05;font-size:18px}
.if-trust{display:flex;flex-wrap:wrap;gap:8px 26px;margin:6px 0 8px;font-size:17px;font-weight:700;color:var(--teal-deep)}
.if-trust span::before{content:"\2713\00a0";color:var(--amber)}
.if-h2{margin:44px 0 16px;font-family:Fraunces,Georgia,serif;font-size:clamp(28px,3vw,40px);letter-spacing:-.02em;line-height:1.1}
.if-h3{margin:18px 0 10px;font-size:20px;font-weight:800;color:var(--muted);letter-spacing:.04em;text-transform:uppercase}
.if-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:900px){.if-tiles{grid-template-columns:repeat(2,1fr)}}
.if-tile{position:relative;display:block;padding:0;border:0;border-radius:22px;overflow:hidden;cursor:pointer;aspect-ratio:4/3;background:var(--teal-deep)}
.if-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .3s}
.if-tile:hover img{transform:scale(1.05)}
.if-tile-t{position:absolute;left:0;right:0;bottom:0;padding:34px 18px 16px;background:linear-gradient(180deg,rgba(8,54,63,0),rgba(8,54,63,.88));color:#fff;font-family:Fraunces,Georgia,serif;font-size:26px;font-weight:700;text-align:left}
.if-regions{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;align-items:start}
.if-region{border:1px solid var(--card-rule);border-radius:16px;background:#fff}
.if-region summary{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 18px;font-size:18px;cursor:pointer;list-style:none}
.if-region summary::-webkit-details-marker{display:none}
.if-region summary span{font-size:15px;color:var(--muted)}
.if-region ul{display:grid;gap:2px;margin:0;padding:0 18px 14px;list-style:none}
.if-region li a{display:block;padding:6px 0;font-size:17px;font-weight:600}
.if-old{margin:30px auto;max-width:1180px;padding:0 clamp(20px,4vw,40px)}
.if-old>summary{padding:16px 20px;border:1px solid var(--card-rule);border-radius:16px;background:#fff;font-size:18px;font-weight:700;cursor:pointer}
@media(max-width:760px){.if-bar{grid-template-columns:1fr;border-radius:24px;gap:6px;margin-top:-20px}.if-bar .hub-search-f{border-right:0;border-bottom:1px solid var(--rule)}.if-bar button{width:100%}}
body .ps .ps-hero{background-image:linear-gradient(180deg,rgba(8,54,63,.84),rgba(8,54,63,.95)),url(/assets/learn/modern-home-1200.webp)!important;background-size:cover!important;background-position:center!important}
body .faq-item{margin:0 0 12px!important;padding:0!important;border:1px solid var(--card-rule)!important;border-radius:18px!important;background:#fff;overflow:hidden;box-shadow:none}
body .faq-item>h3{position:relative;margin:0!important;padding:18px 62px 18px 22px!important;font-family:Fraunces,Georgia,serif;font-size:clamp(19px,1.8vw,23px)!important;line-height:1.25!important;letter-spacing:-.01em;color:var(--ink)}
body .faq-item>p{margin:0!important;padding:0 22px 20px!important;font-size:clamp(17px,1.5vw,19px)!important;line-height:1.55!important;max-width:none!important}
body .faq-item.faq-a>h3{cursor:pointer}
body .faq-item.faq-a>h3::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--amber);color:#fff;font:700 22px/1 Inter,sans-serif;transition:transform .2s}
body .faq-item.faq-a.open>h3::after{content:"\2212";background:var(--teal-deep)}
body .faq-item.faq-a:not(.open)>p{display:none}
body .faq-item.faq-a>h3:focus-visible{outline:3px solid var(--amber-bright);outline-offset:-3px}
.faq-d{margin:0 0 12px;border:1px solid var(--card-rule);border-radius:18px;background:#fff;overflow:hidden}
.faq-d>summary{position:relative;padding:18px 62px 18px 22px;font-family:Fraunces,Georgia,serif;font-size:clamp(19px,1.8vw,23px);line-height:1.25;cursor:pointer;list-style:none}
.faq-d>summary::-webkit-details-marker{display:none}
.faq-d>summary::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--amber);color:#fff;font:700 22px/1 Inter,sans-serif}
.faq-d[open]>summary::after{content:"\2212";background:var(--teal-deep)}
.faq-d>div{padding:0 22px 20px;font-size:clamp(17px,1.5vw,19px);line-height:1.55}
.faq-d>div p{margin:0 0 8px}
.faq-d .src{font-size:14px;color:var(--muted)}
.faq-cats{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 20px}
.faq-cats button{padding:10px 18px;border-radius:999px;border:2px solid var(--teal-deep);background:#fff;color:var(--teal-deep);font:inherit;font-size:17px;font-weight:700;cursor:pointer}
.faq-cats button[aria-pressed="true"]{background:var(--teal-deep);color:#fff}
/* ---- /LEARN ---- */
/* ===== template design: article (article.css) ===== */
/* Article template design (category, city hub and program pages: body.tpl-article).
   One reading column with one left edge, a full-bleed hero aligned to that column, large readable type,
   money-first rebate cards, numbered claim steps and FAQ cards. Loaded after the shared CSS, so these rules win. */
body.tpl-article { --gut: clamp(20px, 4vw, 40px); --read: 19px; background: var(--paper); }

/* ---------- one column, one left edge ---------- */
/* no side panel: one centred reading column; text fills it, so every edge lines up and no blank strip is left on the right */
body.tpl-article:has(main:not(.has-rail)) { --article: clamp(720px, 56vw, 800px); }
.tpl-article main:not(.has-rail) :is(p, li) { max-width: none; }
.tpl-article main > *:not(.hero):not(.post-header):not(.page-rail) { width: 100%; max-width: calc(var(--article) + 2 * var(--gut)) !important; margin-left: auto !important; margin-right: auto !important; padding-left: var(--gut) !important; padding-right: var(--gut) !important; box-sizing: border-box; }
.tpl-article main > * > .wrap, .tpl-article main > article > .wrap { max-width: none; padding: 0; margin: 0; }
.tpl-article main > article { padding-top: 36px; padding-bottom: 40px; }
.tpl-article main > section[style] > p[style], .tpl-article main > section[style] > div[style] { max-width: none !important; }
@media (min-width: 1180px) {
  .tpl-article main.has-rail > *:not(.hero):not(.page-rail) { max-width: none !important; padding-left: 0 !important; padding-right: 0 !important; margin-left: 0 !important; margin-right: 0 !important; }
  .tpl-article main.has-rail > .hpr-breadcrumb { grid-column: 2 / 4; }
  .tpl-article main.has-rail > .page-rail { margin-top: 48px; }
}

/* ---------- breadcrumb ---------- */
.tpl-article .hpr-breadcrumb { padding-top: 16px; padding-bottom: 16px; font-size: 15px; }

/* ---------- hero ---------- */
.tpl-article :is(section.hero, header.post-header) { max-width: none; margin: 0; border-radius: 0; position: relative; overflow: hidden; padding: clamp(40px, 6vw, 88px) 0 clamp(40px, 5.4vw, 80px); color: #fff;
  background: radial-gradient(120% 140% at 100% 0%, rgba(232, 138, 46, .22) 0%, rgba(232, 138, 46, 0) 46%), radial-gradient(90% 120% at 0% 100%, rgba(107, 142, 127, .28) 0%, rgba(107, 142, 127, 0) 55%), var(--teal-deep); }
.tpl-article :is(section.hero, header.post-header)::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px); background-size: 48px 48px;
  -webkit-mask-image: linear-gradient(90deg, transparent 35%, #000 100%); mask-image: linear-gradient(90deg, transparent 35%, #000 100%); }
.tpl-article :is(section.hero, header.post-header) > .wrap { position: relative; z-index: 1; max-width: calc(var(--article) + 2 * var(--gut)); margin: 0 auto; padding: 0 var(--gut); }
@media (min-width: 1180px) {
  .tpl-article main.has-rail > :is(.hero, .post-header) { grid-column: 1 / -1; display: grid; grid-template-columns: subgrid; }
  .tpl-article main.has-rail > :is(.hero, .post-header) > .wrap { grid-column: 2 / 4; max-width: none; margin: 0; padding: 0; }
}
/* the amount leads (2026-10-13): what this page can pay you is the headline, the page title sits under it */
.tpl-article .hero .amount-badge { display: block; max-width: 10.8em; margin: 0 0 16px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none;
  font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(34px, 4.6vw, 64px); font-weight: 600; line-height: 1.04; letter-spacing: -.025em; color: #f5b566; text-wrap: balance; }
.tpl-article .hero .amount-badge::before { content: none; }
.tpl-article :is(.hero, .post-header) h1 { margin: 0 0 18px; max-width: 12em; font-size: clamp(38px, 5.4vw, 76px); font-weight: 700; line-height: 1.02; letter-spacing: -.025em; color: #fff; text-wrap: balance; }
.tpl-article .hero .amount-badge + h1 { max-width: 16.8em; font-size: clamp(22px, 2.3vw, 32px); line-height: 1.18; letter-spacing: -.012em; color: #fff; }
.tpl-article :is(.hero, .post-header) p { max-width: 37.2em; margin: 0; font-size: clamp(19px, 1.7vw, 23px); line-height: 1.5; color: rgba(250, 247, 242, .92); text-wrap: pretty; }
.tpl-article :is(.hero, .post-header) p a { color: #fff; }
/* blog post header: eyebrow and byline */
.tpl-article header.post-header .post-eyebrow { margin: 0 0 16px; font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #f5b566; }
.tpl-article header.post-header .post-meta { margin-top: 16px; font-size: 15px; color: rgba(250, 247, 242, .74); }
.tpl-article header.post-header .post-meta a { color: #fff !important; }
/* a second hero line is the byline or date: smaller */
.tpl-article :is(section.hero, header.post-header) p + p { margin-top: 14px; font-size: 15px; color: rgba(250, 247, 242, .74); }

/* older variants centre the hero: keep it on the column's left edge like the text below it */
.tpl-article :is(section.hero, header.post-header), .tpl-article :is(section.hero, header.post-header) > .wrap { text-align: left; }
.tpl-article :is(section.hero, header.post-header) h1, .tpl-article :is(section.hero, header.post-header) p, .tpl-article :is(section.hero, header.post-header) .amount-badge { margin-left: 0; margin-right: 0; }

/* ---------- reading type ---------- */
.tpl-article main p, .tpl-article main li { font-size: var(--read); line-height: 1.65; color: var(--ink-soft); }
.tpl-article main p { max-width: 40.8em; margin-bottom: 18px; }
.tpl-article main li { max-width: 39.6em; }
.tpl-article main a:not([class]) { color: var(--teal); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.tpl-article main a:not([class]):hover { color: var(--teal-deep); text-decoration-thickness: 2px; }
.tpl-article main h2 { position: relative; max-width: 14.4em; margin: 64px 0 18px; padding-top: 22px; font-size: clamp(29px, 2.7vw, 40px); font-weight: 700; line-height: 1.1; letter-spacing: -.018em; color: var(--teal-deep); text-wrap: balance; scroll-margin-top: 96px; }
.tpl-article main h2::before { content: ""; position: absolute; top: 0; left: 0; width: 44px; height: 4px; border-radius: 4px; background: #e88a2e; }
.tpl-article main article > .wrap > h2:first-child { margin-top: 4px; }
.tpl-article main h3 { margin: 32px 0 10px; font-size: clamp(21px, 1.7vw, 25px); line-height: 1.25; letter-spacing: -.01em; }
.tpl-article main strong, .tpl-article main b { color: var(--ink); }

/* ---------- related-page chips under the hero ---------- */
.tpl-article main div[style*="line-height:2.2"] { display: flex; flex-wrap: wrap; gap: 8px; line-height: 1.3 !important; padding-top: 8px; }
.tpl-article main div[style*="line-height:2.2"] > span { margin: 0 !important; }
.tpl-article main div[style*="line-height:2.2"] > span > a { min-height: 44px; padding: 8px 16px; font-size: 14px; font-weight: 600; background: #fff; border-color: var(--rule); color: var(--teal-deep); transition: border-color .15s, background .15s; }
.tpl-article main div[style*="line-height:2.2"] > span > a:hover { border-color: var(--teal); background: #f1f6f5; text-decoration: none; }
.tpl-article main div[style*="line-height:2.2"] > span:first-child > a { background: var(--teal-deep); border-color: var(--teal-deep); color: #fff; }

/* ---------- callouts (federal notice, "Want your exact number?", highlights) ---------- */
.tpl-article main > p[style*="border-left"] { margin-top: 28px !important; margin-bottom: 8px !important; border-radius: 14px !important; }
/* cross-links injected after the article ("Choosing a brand?", "Statewide answer"): one tidy stack of cards */
.tpl-article main > section[style]:has(> p[style*="background"]) { margin-top: 0 !important; margin-bottom: 12px !important; }
.tpl-article main > section[style] > p[style*="background"] { margin: 0 !important; padding: 18px 22px !important; border: 1px solid #ecdcc6; border-radius: 14px !important; }
.tpl-article main > p[style*="border-left"] { padding-left: calc(var(--gut) + 6px) !important; }
@media (min-width: 1180px) { .tpl-article main.has-rail > p[style*="border-left"] { padding: 18px 22px !important; } }
.tpl-article main .callout, .tpl-article main .highlight-box { margin: 32px 0; padding: 22px 26px; border: 1px solid #ecdcc6; border-left: 5px solid #e88a2e; border-radius: 16px; background: linear-gradient(180deg, #fbf3e6 0%, #f8efe2 100%); }
.tpl-article main .callout p, .tpl-article main .highlight-box p { margin: 0; max-width: none; }

/* ---------- rebate cards: the money first ---------- */
.tpl-article main .rebate-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 236px), 1fr)); gap: 16px; margin: 26px 0 30px; max-width: none; }
.tpl-article main .rebate-card { position: relative; display: flex; flex-direction: column; padding: 22px 22px 20px; border: 1px solid #e3dacb; border-radius: 18px; background: #fff;
  box-shadow: 0 1px 2px rgba(10, 42, 46, .04), 0 8px 24px -12px rgba(10, 42, 46, .14); transition: transform .18s ease, box-shadow .18s ease, border-color .18s; }
.tpl-article main .rebate-card:hover { transform: translateY(-2px); border-color: #cfc2ad; box-shadow: 0 2px 4px rgba(10, 42, 46, .05), 0 18px 36px -16px rgba(10, 42, 46, .24); }
.tpl-article main .rebate-card .program-status { align-self: flex-start; margin: 0 0 14px; text-transform: none; letter-spacing: 0; }
.tpl-article main .rebate-card :is(h3, h4) { order: 2; margin: 0 0 8px; font-family: 'Inter Tight', 'Inter Tight Fallback', sans-serif; font-size: 16px; line-height: 1.35; font-weight: 700; letter-spacing: 0; color: var(--ink); }
.tpl-article main .rebate-card :is(h3, h4) a { color: inherit; text-decoration: none; }
.tpl-article main .rebate-card :is(h3, h4) a::after { content: ""; position: absolute; inset: 0; border-radius: 18px; }
.tpl-article main .rebate-card .amount { order: 1; margin: 0 0 10px; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(26px, 2.2vw, 32px); font-weight: 600; line-height: 1.08; letter-spacing: -.02em; color: var(--green-money) !important; text-wrap: balance; }
.tpl-article main .rebate-card p { order: 3; margin: 0 !important; max-width: none; font-size: 16px !important; line-height: 1.55; color: #3c5357; }
.tpl-article main .rebate-card .program-status { order: 0; }
/* the first open card is the one most homes start with: full width, bigger number; the rest read as add-ons */
.tpl-article main .rebate-grid > .rebate-card:first-child:not(:only-child):not(:has(.status-closed, .status-limited)) { grid-column: 1 / -1; padding: 26px 28px 24px; border-color: #cfe0d6; background: linear-gradient(180deg, #fff 0%, #f6faf7 100%); }
.tpl-article main .rebate-grid > .rebate-card:first-child:not(:only-child):not(:has(.status-closed, .status-limited)) .amount { font-size: clamp(34px, 3.4vw, 44px); }
.tpl-article main .rebate-grid > .rebate-card:first-child:not(:only-child):not(:has(.status-closed, .status-limited)) :is(h3, h4) { font-size: 18px; }
.tpl-article main .rebate-grid > .rebate-card:first-child:not(:only-child):not(:has(.status-closed, .status-limited)) p { max-width: 42em; }
.tpl-article main .fed-callout { margin: 0 0 32px; }
.tpl-article main .rebate-card:has(.status-limited) .amount, .tpl-article main .rebate-card:has(.status-closed) .amount { color: #5f5849 !important; }

/* ---------- numbered claim steps ---------- */
.tpl-article main article ol { counter-reset: step; list-style: none; margin: 22px 0 28px; padding: 0; display: grid; gap: 14px; }
.tpl-article main article ol > li { counter-increment: step; position: relative; margin: 0; padding: 16px 20px 16px 68px; min-height: 56px; border: 1px solid #e3dacb; border-radius: 16px; background: #fff; max-width: none; }
.tpl-article main article ol > li::before { content: counter(step); position: absolute; left: 16px; top: 14px; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--teal-deep); color: #fff; font: 700 16px/1 'Inter Tight', 'Inter Tight Fallback', sans-serif; }
.tpl-article main article ul { margin: 0 0 22px 0; padding-left: 22px; }
.tpl-article main article ul > li { margin-bottom: 10px; padding-left: 4px; }
.tpl-article main article ul > li::marker { color: #e88a2e; }

/* ---------- installers ---------- */
.tpl-article main .installer-card { margin-bottom: 12px; padding: 18px 22px; border: 1px solid #e3dacb; border-radius: 16px; background: #fff; transition: border-color .15s, box-shadow .15s; }
.tpl-article main .installer-card:hover { border-color: var(--teal); box-shadow: 0 10px 24px -14px rgba(10, 42, 46, .3); }
.tpl-article main .installer-card .name { font-size: 19px; }
.tpl-article main .installer-card .stars { margin-top: 2px; font-size: 14px; font-weight: 600; color: #8a4708 !important; }
.tpl-article main .installer-card a.site-link { display: inline-flex; align-items: center; min-height: 40px; padding: 8px 16px; border: 1px solid var(--rule); border-radius: 999px; font-size: 14px; font-weight: 600; text-decoration: none; }
.tpl-article main .installer-card a.site-link:hover { border-color: var(--teal); background: #f1f6f5; }

/* ---------- FAQ ---------- */
.tpl-article main .faq-item { margin: 0 0 12px; padding: 20px 24px; border: 1px solid #e3dacb; border-radius: 16px; background: #fff; }
.tpl-article main .faq-item h3 { margin: 0 0 8px; font-size: 21px; }
.tpl-article main .faq-item p { margin: 0; }
.tpl-article main .faq-item p + p { margin-top: 12px; }

/* ---------- tables ---------- */
.tpl-article main article table { width: 100%; margin: 20px 0 28px; border-collapse: separate; border-spacing: 0; border: 1px solid #e3dacb; border-radius: 14px; overflow: hidden; background: #fff; font-size: 15px; }
.tpl-article main article th { background: #f3ede2; text-align: left; font-weight: 700; color: var(--teal-deep); }
.tpl-article main article th, .tpl-article main article td { padding: 12px 16px; border-bottom: 1px solid #eee5d6; vertical-align: top; }
.tpl-article main article tr:last-child td { border-bottom: 0; }

/* ---------- phones ---------- */
@media (max-width: 600px) {
  body.tpl-article { --read: 18px; }
  .tpl-article :is(section.hero, header.post-header) { padding: 36px 0 40px; }
  .tpl-article .hero .amount-badge { margin-bottom: 12px; font-size: clamp(32px, 9vw, 40px); max-width: none; }
  .tpl-article :is(.hero, .post-header) h1 { font-size: clamp(34px, 9.4vw, 42px); max-width: none; }
  .tpl-article .hero .amount-badge + h1 { font-size: 22px; }
  .tpl-article main h2 { margin-top: 52px; font-size: 27px; }
  .tpl-article main .rebate-grid { gap: 12px; }
  .tpl-article main .rebate-card { padding: 18px; }
  .tpl-article main article ol > li { padding: 14px 16px 14px 60px; }
  .tpl-article main article ol > li::before { left: 12px; width: 34px; height: 34px; }
  .tpl-article main .faq-item { padding: 18px; }
  .tpl-article main .installer-card { padding: 16px 18px; }
  /* related pages: one swipeable row instead of a tall stack */
  .tpl-article main div[style*="line-height:2.2"] { flex-wrap: nowrap; overflow-x: auto; scroll-snap-type: x proximity; margin-right: calc(-1 * var(--gut)); padding-right: var(--gut); padding-bottom: 6px; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
  .tpl-article main div[style*="line-height:2.2"]::-webkit-scrollbar { display: none; }
  .tpl-article main div[style*="line-height:2.2"] > span { flex: none; scroll-snap-align: start; }
  .tpl-article main div[style*="line-height:2.2"] > span > a { white-space: nowrap; }
}
@media (prefers-reduced-motion: reduce) { .tpl-article main .rebate-card, .tpl-article main .installer-card { transition: none; } .tpl-article main .rebate-card:hover { transform: none; } }
.tpl-article main > section#top-rated-installers { margin-top: 24px !important; margin-bottom: 72px !important; }
/* pages whose breadcrumb sits outside <main>: line it up with the column */
body.tpl-article > .hpr-breadcrumb { max-width: calc(var(--article) + 2 * var(--gut)); padding-left: var(--gut); padding-right: var(--gut); }

/* ---- About page: photo hero, numbers strip, promise cards (2026-10-23) ---- */
body.tpl-article section.hero.about-hero { background: linear-gradient(180deg, rgba(8, 54, 63, .8), rgba(8, 54, 63, .92)), url(/assets/learn/heat-pump-house-1600.webp) center / cover no-repeat; }
.about-stats { margin: -34px 0 8px; position: relative; z-index: 2; }
.about-stats .wrap { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.about-stat { padding: 20px 22px; border-radius: 20px; background: #fff; box-shadow: 0 1px 2px rgba(10, 42, 46, .06), 0 18px 40px -18px rgba(10, 42, 46, .35); }
.about-stat b { display: block; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(34px, 3.6vw, 52px); font-weight: 700; line-height: 1; letter-spacing: -.02em; color: var(--teal-deep); }
.about-stat span { display: block; margin-top: 8px; font-size: 16px; line-height: 1.35; color: var(--muted); }
.about-promises { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin: 28px 0 8px; }
.about-promise { display: flex; flex-direction: column; overflow: hidden; border-radius: 22px; border: 1px solid var(--card-rule); background: #f4efe6; color: var(--ink); text-decoration: none; }
.about-promise:hover { box-shadow: var(--shadow-card); }
.about-promise img { display: block; width: 100%; height: 190px; object-fit: cover; }
.about-promise span { padding: 16px 20px 22px; font-size: 17px; line-height: 1.45; color: var(--muted); }
.about-promise b { display: block; margin-bottom: 4px; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 22px; line-height: 1.2; color: var(--ink); }
.about-credit { font-size: 14px !important; color: var(--muted); }
@media (max-width: 860px) { .about-stats .wrap { grid-template-columns: repeat(2, 1fr); } .about-promises { grid-template-columns: 1fr; } }

/* ---- Rebate card chips and program "at a glance" row (2026-10-23) ---- */
.tpl-article .rebate-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; order: 4; }
.tpl-article .rebate-chips span { padding: 3px 10px; border-radius: 8px; background: #ece5d8; font-size: 13px; font-weight: 600; color: var(--ink); }
.tpl-article .glance { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 0 0 8px; }
.tpl-article .glance-cell { padding: 20px 22px; border-radius: 20px; background: #fff; border: 1px solid var(--card-rule); box-shadow: var(--shadow-card); }
.tpl-article .glance-cell b { display: block; margin-bottom: 8px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--amber-text); }
.tpl-article .glance-cell span { font-size: 18px; line-height: 1.45; color: var(--ink); }
@media (max-width: 860px) { .tpl-article .glance { grid-template-columns: 1fr; } }

/* ---- Wide tables scroll inside their box on phones instead of being cut off (learn hubs, 2026-10-23) ---- */
.tpl-article .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.tpl-article .table-wrap table { min-width: 520px; }

/* ===== template design: ranking (ranking.css) ===== */
/* Installer ranking template design (body.tpl-ranking): /installers/<region>/<city>/<service>/.
   A bold hero, a stat strip that reads at a glance, roomy ranking cards with the rating up front, and readable prose. */
body.tpl-ranking { --gut: clamp(20px, 3.2vw, 56px); }
.tpl-ranking main .wrap { padding-left: var(--gut); padding-right: var(--gut); }

/* ---------- hero ---------- */
.tpl-ranking header.hero { padding: clamp(40px, 5.6vw, 84px) 0 clamp(84px, 8vw, 120px);
  background: radial-gradient(120% 140% at 100% 0%, rgba(232, 138, 46, .24) 0%, rgba(232, 138, 46, 0) 46%), radial-gradient(90% 120% at 0% 100%, rgba(107, 142, 127, .3) 0%, rgba(107, 142, 127, 0) 55%), var(--teal-deep); }
.tpl-ranking header.hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px); background-size: 48px 48px;
  -webkit-mask-image: linear-gradient(90deg, transparent 35%, #000 100%); mask-image: linear-gradient(90deg, transparent 35%, #000 100%); }
.tpl-ranking header.hero > .wrap { position: relative; z-index: 1; }
.tpl-ranking .hero-top { align-items: flex-start; gap: clamp(14px, 1.6vw, 22px); margin-bottom: 18px; }
.tpl-ranking .hero-ico { width: clamp(48px, 4.6vw, 68px); height: clamp(48px, 4.6vw, 68px); border-radius: 18px; margin-top: 6px; background: rgba(255, 255, 255, .1); }
.tpl-ranking .hero h1 { max-width: 13.2em; font-size: clamp(34px, 4.6vw, 64px); font-weight: 600; line-height: 1.04; letter-spacing: -.025em; text-wrap: balance; }
.tpl-ranking .hero .wrap > p { max-width: 36em; font-size: clamp(17px, 1.45vw, 21px); line-height: 1.5; color: rgba(250, 247, 242, .88); }
.tpl-ranking .hero .wrap > p.meta { margin-top: 12px; font-size: 14px; color: rgba(250, 247, 242, .72); }

/* ---------- stat strip ---------- */
.tpl-ranking .stats { max-width: none !important; margin: calc(-1 * clamp(56px, 5vw, 72px)) 0 14px; gap: clamp(10px, 1.2vw, 16px); }
.tpl-ranking .stat { padding: clamp(14px, 1.6vw, 22px) 12px; border: 0; border-radius: 18px; text-align: left; padding-left: clamp(16px, 1.8vw, 26px); box-shadow: 0 1px 2px rgba(10, 42, 46, .06), 0 18px 40px -18px rgba(10, 42, 46, .35); }
.tpl-ranking .stat b { font-size: clamp(26px, 2.6vw, 40px); font-weight: 600; letter-spacing: -.02em; color: var(--teal-deep); }
.tpl-ranking .stat span { display: block; margin-top: 4px; font-size: 13px; letter-spacing: .07em; color: #4a5f62; }
.tpl-ranking .trust { justify-content: flex-start; gap: 6px 22px; margin: 18px 0 26px; font-size: 15px; font-weight: 600; }

/* ---------- prose ---------- */
.tpl-ranking section.body p, .tpl-ranking section.body li { font-size: 19px; line-height: 1.65; }
.tpl-ranking section.body p.small, .tpl-ranking section.body .small { font-size: 14px; }
.tpl-ranking section.body h2 { position: relative; margin: 64px 0 18px; padding-top: 22px; font-size: clamp(29px, 2.7vw, 40px); font-weight: 700; line-height: 1.1; letter-spacing: -.02em; color: var(--teal-deep); text-wrap: balance; }
.tpl-ranking section.body h2::before { content: ""; position: absolute; top: 0; left: 0; width: 44px; height: 4px; border-radius: 4px; background: #e88a2e; }
.tpl-ranking section.body h2.sec-h { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.tpl-ranking .callout { max-width: 1000px; padding: 20px 24px; border: 1px solid #d5e4da; border-left: 5px solid var(--green-money); border-radius: 16px; background: #f1f7f3; }
.tpl-ranking .callout p { max-width: none; margin: 0 !important; }
.tpl-ranking .hero .wrap > p { text-wrap: pretty; }
.tpl-ranking .hpr-toc { max-width: 1000px !important; padding: 6px 24px; border-radius: 16px; }
@media (min-width: 900px) { .tpl-ranking .hpr-toc ol { columns: 2; column-gap: 40px; } .tpl-ranking .hpr-toc li { break-inside: avoid; } }

/* ---------- ranking cards ---------- */
.tpl-ranking .sortbar { margin-bottom: 18px; font-size: 15px; }
.tpl-ranking .sortbar button { min-height: 44px; padding: 8px 18px; font-size: 15px; }
@media (min-width: 900px) { .tpl-ranking .rank-list { gap: 18px; } }
@media (min-width: 1500px) { .tpl-ranking .rank-list { grid-template-columns: repeat(3, 1fr); } }
.tpl-ranking .rank { padding: 22px 22px 18px; gap: 8px 16px; grid-template-columns: 44px 1fr; border: 1px solid #e3dacb; border-radius: 20px;
  box-shadow: 0 1px 2px rgba(10, 42, 46, .04), 0 8px 24px -12px rgba(10, 42, 46, .14); }
.tpl-ranking .rank.has-prof .nm > a::after { border-radius: 20px; }
.tpl-ranking .rank:hover { border-color: #cfc2ad; box-shadow: 0 2px 4px rgba(10, 42, 46, .05), 0 20px 40px -18px rgba(10, 42, 46, .26); }
.tpl-ranking .rank.top { border-left: 1px solid #b9d3c2; background: linear-gradient(180deg, #f3f9f5 0%, #fff 55%); border-color: #b9d3c2; }
.tpl-ranking .rank .n { width: 44px; height: 44px; font-size: 19px; }
.tpl-ranking .rank .n a { color: inherit; text-decoration: none; }
.tpl-ranking .rank .nm { font-size: 21px; font-weight: 700; line-height: 1.3; }
.tpl-ranking .rank .nm > a { color: var(--ink); text-decoration: none; margin-right: 6px; }
.tpl-ranking .rank .nm > a:hover { color: var(--teal); text-decoration: underline; }
.tpl-ranking .rank .st { margin-top: 2px; }
.tpl-ranking .rank .stars { font-size: 19px; }
.tpl-ranking .rank .rt b { font-size: 19px; }
.tpl-ranking .rank .rv { font-size: 16px; }
.tpl-ranking .rank .adr { font-size: 15px; }
.tpl-ranking .rank .act { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: 10px; padding-top: 14px; border-top: 1px solid #eee5d6; }
.tpl-ranking .rank .act .lnk { font-size: 16px; }

/* ---------- cost box, FAQ, quote form ---------- */
.tpl-ranking .cb { max-width: 1000px; border-radius: 18px !important; }
.tpl-ranking .cb-row b { font-size: clamp(20px, 1.8vw, 26px) !important; }
.tpl-ranking .faq-item { margin: 0 0 12px; padding: 20px 24px; border: 1px solid #e3dacb; border-radius: 16px; background: #fff; max-width: 1000px; }
.tpl-ranking .faq-item h3 { font-size: 19px; font-weight: 600; }
.tpl-ranking .qf { max-width: 1000px; padding: clamp(22px, 2.6vw, 36px); border-width: 1px; border-color: #cfdcd9; border-radius: 22px; box-shadow: 0 1px 2px rgba(10, 42, 46, .05), 0 24px 48px -24px rgba(10, 42, 46, .3); }
.tpl-ranking .qf h2 { margin-top: 0 !important; padding-top: 0 !important; }
.tpl-ranking .qf h2::before { display: none; }
@media (min-width: 900px) { .tpl-ranking .qf fieldset:first-of-type { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; } .tpl-ranking .qf fieldset:first-of-type legend { grid-column: 1 / -1; } }
.tpl-ranking .qf-btn { border-radius: 999px; padding: 15px 30px; font-size: 17px; }

/* ---------- phones ---------- */
@media (max-width: 560px) {
  .tpl-ranking header.hero { padding: 32px 0 84px; }
  .tpl-ranking .hero h1 { font-size: clamp(30px, 8.6vw, 38px); }
  .tpl-ranking .stats { margin-top: -60px; }
  .tpl-ranking .stat { padding: 14px 14px; }
  .tpl-ranking .stat b { font-size: 26px; }
  .tpl-ranking .rank { padding: 18px 16px 14px; grid-template-columns: 38px 1fr; gap: 6px 12px; }
  .tpl-ranking .rank .n { width: 38px; height: 38px; font-size: 17px; }
  .tpl-ranking .rank .nm { font-size: 18px; }
  .tpl-ranking .rank .act { grid-column: 1 / -1; gap: 8px 16px; }
  .tpl-ranking .rank .act .btn-call, .tpl-ranking .rank .act .btn-prof { flex: 1 1 100%; justify-content: center; }
  .tpl-ranking .callout { padding: 16px 18px; }
  .tpl-ranking section.body h2 { margin-top: 52px; font-size: 27px; }
  .tpl-ranking .trust { font-size: 14px; }
}
/* cards are always visible: no scroll-in reveal that hides listings until a script runs */
.tpl-ranking .rank { opacity: 1; transform: none; }
.tpl-ranking .rank:hover { transform: translateY(-2px); }
@media (prefers-reduced-motion: reduce) { .tpl-ranking .rank:hover { transform: none; } }
/* program-registered contractors not on the ranking (2026-10-22) */
.regonly{margin:8px 0 16px}.regonly summary{cursor:pointer;font-weight:700;padding:6px 0}.regonly ul{margin:8px 0;padding-left:20px;font-size:14.5px;line-height:1.5}
/* registered contractors made easier to see (2026-10-22) */
.rank .nm .reg{font-size:13px;padding:2px 10px;color:#1b4332;background:#d8f3dc;border-color:#2d6a4f}
.callout .reg{font-size:13px;padding:0 7px;color:#1b4332;background:#d8f3dc;border:1px solid #2d6a4f;border-radius:999px;cursor:auto}
.sortbar button[data-f]{border-color:#2d6a4f;color:#1b4332}.sortbar button[data-f].on{background:#2d6a4f;color:#fff}
.rank-list li[hidden]{display:none}

/* ===== template design: hub (hub.css) ===== */
/* Region hub design (body.tpl-hub): /ca/bc/, /ca/on/, /us/ma/ and the other province and state hubs.
   The hubs keep their own legacy CSS for the older sections further down; this file sets the top of the page
   (hero, stats, short answer and table, what changed, federal note, program links) on one container edge. */
body.tpl-hub { --gut: clamp(20px, 3.2vw, 56px); --hub-w: min(var(--container), 100% - 2 * var(--gut)); }

/* ---------- hero ---------- */
.tpl-hub header.hub-hero { position: relative; overflow: hidden; padding: clamp(44px, 6vw, 96px) 0 clamp(88px, 8vw, 128px) !important; text-align: left !important; color: #fff;
  background: radial-gradient(120% 140% at 100% 0%, rgba(232, 138, 46, .24) 0%, rgba(232, 138, 46, 0) 46%), radial-gradient(90% 120% at 0% 100%, rgba(107, 142, 127, .3) 0%, rgba(107, 142, 127, 0) 55%), var(--teal-deep) !important; }
.tpl-hub header.hub-hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px); background-size: 48px 48px;
  -webkit-mask-image: linear-gradient(90deg, transparent 35%, #000 100%); mask-image: linear-gradient(90deg, transparent 35%, #000 100%); }
.tpl-hub header.hub-hero > .wrap { position: relative; z-index: 1; width: var(--hub-w); max-width: none !important; margin: 0 auto !important; padding: 0 !important; text-align: left !important; }
.tpl-hub header.hub-hero .eyebrow { margin: 0 0 18px !important; font-size: 13px !important; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #f5b566 !important; }
.tpl-hub header.hub-hero h1 { max-width: 10.8em; margin: 0 0 20px !important; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(38px, 5.4vw, 76px) !important; font-weight: 600 !important; line-height: 1.02 !important; letter-spacing: -.025em; color: #fff !important; text-wrap: balance; }
.tpl-hub header.hub-hero .sub { max-width: 34.8em !important; margin: 0 0 28px !important; font-size: clamp(17px, 1.5vw, 21px) !important; line-height: 1.5 !important; color: rgba(250, 247, 242, .88) !important; text-wrap: pretty; }
.tpl-hub header.hub-hero .cta-row { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-start !important; }
.tpl-hub header.hub-hero .cta-row .btn { display: inline-flex; align-items: center; min-height: 52px; padding: 0 26px; border-radius: 999px; font-size: 17px; font-weight: 700; }
.tpl-hub header.hub-hero .cta-row .btn-secondary { background: rgba(255, 255, 255, .1) !important; color: #fff !important; border: 1px solid rgba(255, 255, 255, .45) !important; }
.tpl-hub header.hub-hero .cta-row .btn-secondary:hover { background: rgba(255, 255, 255, .2) !important; }

/* ---------- stats strip ---------- */
.tpl-hub .hs-wrap:has(> .hs-stats) { width: var(--hub-w); max-width: none; margin: calc(-1 * clamp(60px, 5.4vw, 80px)) auto 0; padding: 0; position: relative; z-index: 2; }
.tpl-hub .hs-stats { gap: clamp(10px, 1.2vw, 16px); }
.tpl-hub .hs-stat { padding: clamp(16px, 1.8vw, 24px) clamp(16px, 1.8vw, 26px) !important; border: 0 !important; border-radius: 18px !important; text-align: left !important; background: #fff; box-shadow: 0 1px 2px rgba(10, 42, 46, .06), 0 18px 40px -18px rgba(10, 42, 46, .35) !important; }
.tpl-hub .hs-stat b { display: block; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(26px, 2.6vw, 40px) !important; font-weight: 600 !important; line-height: 1.05; letter-spacing: -.02em; color: var(--teal-deep) !important; }
.tpl-hub .hs-stat b small { display: block; margin-top: 4px; font-family: 'Inter Tight', 'Inter Tight Fallback', sans-serif; font-size: 14px !important; font-weight: 600; letter-spacing: 0; }
.tpl-hub .hs-stat span { display: block; margin-top: 6px; font-size: 13px !important; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: #4a5f62 !important; }

/* ---------- top blocks on one edge ---------- */
.tpl-hub main > :is(.hub-block, section[style], p[style]) { width: var(--hub-w); max-width: none !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; box-sizing: border-box; }
.tpl-hub .hub-top { margin-top: clamp(32px, 4vw, 56px); }
.tpl-hub .hub-answer { padding: clamp(20px, 2.2vw, 30px) clamp(20px, 2.4vw, 34px); border: 1px solid #d5e4da; border-left: 5px solid var(--green-money); border-radius: 18px; background: #f1f7f3; }
.tpl-hub .hub-answer p { max-width: 48em; margin: 0; font-size: clamp(17px, 1.3vw, 19px); line-height: 1.6; color: var(--ink); }
.tpl-hub .hub-answer p.hub-verified { margin-top: 12px; font-size: 14px; line-height: 1.5; color: #4a5f62; }
.tpl-hub .hub-block h2 { position: relative; margin: 56px 0 20px; padding-top: 22px; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(27px, 2.5vw, 36px); font-weight: 600; line-height: 1.12; letter-spacing: -.018em; color: var(--teal-deep); }
.tpl-hub .hub-block h2::before { content: ""; position: absolute; top: 0; left: 0; width: 44px; height: 4px; border-radius: 4px; background: #e88a2e; }
.tpl-hub .hub-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid #e3dacb; border-radius: 18px; background: #fff; box-shadow: 0 1px 2px rgba(10, 42, 46, .04), 0 8px 24px -14px rgba(10, 42, 46, .16); }
.tpl-hub .hub-table { width: 100%; min-width: 680px; border-collapse: collapse; font-size: 16px; line-height: 1.5; }
.tpl-hub .hub-table th { padding: 14px 18px; background: #f3ede2; text-align: left; font-size: 13px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--teal-deep); }
.tpl-hub .hub-table td { padding: 16px 18px; border-top: 1px solid #eee5d6; vertical-align: top; color: var(--ink-soft); }
.tpl-hub .hub-table td:first-child { color: var(--ink); }
.tpl-hub .hub-table td:nth-child(3) { font-weight: 700; color: var(--green-money); }
.tpl-hub .hub-table tbody tr:hover td { background: #fbf8f2; }
.tpl-hub .hub-table .rb-status { margin: 4px 0 0; }
.tpl-hub .hub-table td:nth-child(3) .rb-status { display: flex; width: fit-content; margin-top: 6px; }
.tpl-hub .hub-changes { margin-top: 40px; }
.tpl-hub .hub-card { padding: clamp(20px, 2.2vw, 30px) clamp(20px, 2.4vw, 34px); border: 1px solid #e3dacb; border-radius: 18px; background: #fff; }
.tpl-hub .hub-card h2 { margin: 0 0 6px; padding-top: 0; font-size: clamp(22px, 2vw, 28px); }
.tpl-hub .hub-card h2::before { display: none; }
.tpl-hub .hub-card .hub-checked { margin: 0 0 14px; font-size: 14px; color: #4a5f62; }
.tpl-hub .hub-card ul { display: grid; gap: 12px; margin: 0; padding-left: 20px; font-size: 16px; line-height: 1.6; color: var(--ink-soft); }
@media (min-width: 1000px) { .tpl-hub .hub-card ul { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 48px; } }
.tpl-hub .hub-card li::marker { color: #e88a2e; }
.tpl-hub main > section[style*="border-left:4px solid #d4751c"] { margin-top: 24px !important; padding: 20px 26px !important; border-radius: 18px !important; font-size: 16px !important; }
.tpl-hub main > p[style] { margin-top: 20px !important; font-size: 16px; }

@media (max-width: 600px) {
  .tpl-hub header.hub-hero { padding: 36px 0 80px !important; }
  .tpl-hub header.hub-hero h1 { font-size: clamp(34px, 9.4vw, 44px) !important; }
  .tpl-hub header.hub-hero .cta-row .btn { flex: 1 1 auto; justify-content: center; }
  .tpl-hub .hs-wrap:has(> .hs-stats) { margin-top: -60px; }
}
/* phones: each program is a card (the table always has the same four columns) */
@media (max-width: 640px) {
  .tpl-hub .hub-table-wrap { overflow: visible; border: 0; background: none; box-shadow: none; }
  .tpl-hub .hub-table, .tpl-hub .hub-table tbody, .tpl-hub .hub-table tr, .tpl-hub .hub-table td { display: block; width: auto; min-width: 0; }
  .tpl-hub .hub-table thead { display: none; }
  .tpl-hub .hub-table tr { margin: 0 0 12px; padding: 16px 18px; border: 1px solid #e3dacb; border-radius: 16px; background: #fff; }
  .tpl-hub .hub-table td { padding: 0; border: 0; font-size: 16px; }
  .tpl-hub .hub-table td:first-child { margin-bottom: 4px; font-size: 18px; }
  .tpl-hub .hub-table td:nth-child(2) { margin-bottom: 10px; font-size: 14px; color: #4a5f62; }
  .tpl-hub .hub-table td:nth-child(3) { margin-bottom: 10px; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 22px; font-weight: 600; line-height: 1.2; }
  .tpl-hub .hub-table td:nth-child(3) .rb-status { font-family: 'Inter Tight', 'Inter Tight Fallback', sans-serif; }
  .tpl-hub .hub-table td:nth-child(4) { font-size: 15px; }
  .tpl-hub .hub-table tbody tr:hover td { background: none; }
}
.tpl-hub .hub-table .rb-status { padding: 3px 10px; font-size: 13px; line-height: 1.3; border-radius: 99px; }
.tpl-hub .hub-block a, .tpl-hub .hub-answer a { color: var(--teal); text-underline-offset: 3px; }

/* ---------- "On this page" contents (some hubs' legacy CSS never styled it) ---------- */
.tpl-hub main > nav.toc { width: var(--hub-w); max-width: none; margin: 24px auto 0; padding: 14px 0; display: flex; flex-wrap: wrap; gap: 8px 10px; align-items: center; border-bottom: 1px solid var(--rule); font-size: 13px; box-sizing: border-box; }
.tpl-hub nav.toc .toc-lbl { font-weight: 700; color: var(--ink); margin-right: 2px; }
.tpl-hub nav.toc a { color: var(--teal); text-decoration: none; padding: 4px 11px; border: 1px solid var(--rule); border-radius: 999px; white-space: nowrap; }
.tpl-hub nav.toc a:hover { background: var(--paper-warm); border-color: var(--amber); color: #a4540a; }

/* ---- Photo hero on region hubs (2026-10-23): same free-licence house photo as the finder, under a teal wash ---- */
.tpl-hub header.hero.hub-hero { background: linear-gradient(180deg, rgba(8, 54, 63, .8), rgba(8, 54, 63, .94)), url(/assets/learn/modern-home-1200.webp) center / cover no-repeat !important; }

/* ===== template design: profile (profile.css) ===== */
/* Installer profile pages (body.tpl-profile): photo block from scripts/add_profile_photos.py.
   An initials tile is always there; a Google photo, when one loads at view time, covers it. */
.tpl-profile .ipf { position: relative; margin: 18px 0 0; }
.tpl-profile .ipf-tile { display: flex; align-items: center; gap: clamp(14px, 3vw, 24px); padding: clamp(18px, 4vw, 28px);
  border-radius: 14px; background: radial-gradient(520px 220px at 100% 0%, rgba(212, 117, 28, .28), transparent 62%), linear-gradient(135deg, #0d4f5c 0%, #08363f 75%);
  color: #faf7f2; min-height: 120px; }
.tpl-profile .ipf-init { flex: none; display: grid; place-items: center; width: clamp(64px, 14vw, 88px); height: clamp(64px, 14vw, 88px); border-radius: 50%;
  background: #d4751c; color: #fff; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-weight: 700; font-size: clamp(24px, 5.4vw, 34px); letter-spacing: .02em;
  box-shadow: 0 0 0 4px rgba(250, 247, 242, .18); }
.tpl-profile .ipf-svc { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; color: rgba(250, 247, 242, .92); }
.tpl-profile .ipf-svc svg { width: 26px; height: 26px; color: #f5b566; }
.tpl-profile .ipf.has-photo .ipf-tile { display: none; }
.tpl-profile .ipf-img { display: block; width: 100%; height: auto; max-height: 380px; aspect-ratio: 16 / 7; object-fit: cover; border-radius: 14px; background: #f5efe5; }
.tpl-profile .ipf-cap { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; margin: 8px 2px 0; font-size: 13px; color: #5e5e5e; }
.tpl-profile .ipf-cap a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
/* Google attribution logo: 16 to 19px tall, clear space 10px left, right and top, 5px bottom (Places policies) */
.tpl-profile .ipf-g { height: 18px; width: auto; margin: 10px 10px 5px; }
.tpl-profile .ipf-gt { font-family: Roboto, Arial, sans-serif; font-weight: 400; font-size: 13px; color: #5e5e5e; margin-left: 4px; }
/* Profile FAQ (every profile, built by enrich_installer_profiles.py) and the "Also installs" line */
.tpl-profile .ip-also-installs { font-size: 13px; color: #5a5348; margin: 0 0 10px; font-style: italic; }
.tpl-profile .ip-faq { margin-top: 44px; }
.tpl-profile .ip-faq h3 { font-size: 17px; margin: 0 0 14px; }
.tpl-profile .ip-faq-item { padding: 14px 0; border-top: 1px solid var(--rule); }
.tpl-profile .ip-faq-item:first-of-type { border-top: none; }
.tpl-profile .ip-faq-q { font-weight: 700; font-size: 14.5px; margin: 0 0 6px; color: var(--teal-deep); }
.tpl-profile .ip-faq-a { font-size: 14px; color: #5a5348; margin: 0; }
/* Advisor and auditor profiles: a check that does not apply, and an optional video */
.tpl-profile .ip-vet-no .ip-vet-icon { background: var(--rule); color: #5a5348; }
.tpl-profile .ip-video { margin-top: 44px; }
.tpl-profile .ip-video-embed { position: relative; padding-top: 56.25%; border-radius: 14px; overflow: hidden; background: #000; }
.tpl-profile .ip-video-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
/* Links inside the dark "Is this your company?" box were teal on teal and invisible */
.tpl-profile .ip-quote a { color: var(--amber-bright, #e88a2e); text-decoration: underline; text-underline-offset: 2px; font-weight: 600; }
.tpl-profile .ip-quote li { color: #c9d8d5; font-size: 14.5px; margin-bottom: 8px; }

/* ===== template design: advisor (advisor.css) ===== */
/* Energy advisor and home energy auditor profiles (body.tpl-advisor), built by scripts/build_advisor_directory.py.
   One design for every profile: dark hero with a drawn house, a facts strip, a main column of ledger rows and a sticky
   contact card. Tokens come from the shared :root; the few that are not there are set on .tpl-advisor. */
.tpl-advisor { margin: 0; font: 17px/1.7 'Inter Tight', 'Inter Tight Fallback', system-ui, sans-serif; color: #0a2a2e; background: #faf7f2; caret-color: #a4540a; font-variant-numeric: tabular-nums; scrollbar-color: #0d4f5c #f5efe5; }
.tpl-advisor .ad-page a { color: #0d4f5c; text-underline-offset: 3px; }
.tpl-advisor .ad-page a:hover { color: #a4540a; }
.tpl-advisor .ad-page a.ad-btn { text-decoration: none; }
.tpl-advisor .ad-page a.ad-btn-amber, .tpl-advisor .ad-page a.ad-btn-dark, .tpl-advisor .ad-page a.ad-btn-line { color: #fff; }
.tpl-advisor .ad-page a.ad-btn-dark { color: #faf7f2; }
.tpl-advisor .ad-page a.ad-btn-amber:hover, .tpl-advisor .ad-page a.ad-btn-line:hover { color: #fff; }
.tpl-advisor .ad-page :focus-visible { outline: 3px solid #0d4f5c; outline-offset: 3px; border-radius: 6px; }
.tpl-advisor .ad-hero :focus-visible, .tpl-advisor .ad-final :focus-visible { outline-color: #e88a2e; }
.tpl-advisor .ad-page .ad-chip { text-decoration: none; }
.tpl-advisor { --ad-open-bg: #e3f1e8; --ad-open-text: #1f5a3d; --ad-soon-bg: #fdeccf; --ad-soon-text: #8a4a06; --ad-ease: cubic-bezier(.16, 1, .3, 1); }
.tpl-advisor ::selection { background: #e88a2e; color: #08363f; }
.tpl-advisor .ad-wrap { max-width: 1180px; margin: 0 auto; padding: 0 clamp(16px, 3.2vw, 40px); }
.tpl-advisor .ad-page h2 { font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-weight: 600; font-size: clamp(27px, 2.5vw, 36px); line-height: 1.12; letter-spacing: -.01em; margin: 0 0 14px; text-wrap: balance; }
.tpl-advisor .ad-page h2::before { content: ""; display: block; width: 44px; height: 4px; border-radius: 2px; background: #d4751c; margin-bottom: 16px; }
.tpl-advisor .ad-page h3 { font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-weight: 600; font-size: 19px; line-height: 1.25; margin: 0 0 4px; }
.tpl-advisor .ad-page p { max-width: 40.8em; }
.tpl-advisor .ad-btn { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 24px; border-radius: 999px; font: 700 16px 'Inter Tight', system-ui, sans-serif; text-decoration: none; border: 0; cursor: pointer; transition: background .2s, transform .2s var(--ad-ease); }
.tpl-advisor .ad-btn:hover { transform: translateY(-1px); }
.tpl-advisor .ad-btn-amber { background: #a4540a; color: #fff; }
.tpl-advisor .ad-btn-amber:hover { background: #8a4607; }
.tpl-advisor .ad-btn-dark { background: #08363f; color: #faf7f2; }
.tpl-advisor .ad-btn-line { color: #fff; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; padding: 0 6px; }
.tpl-advisor .ad-btn-wide { width: 100%; }
.tpl-advisor svg.ad-i { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.tpl-advisor .ad-pill { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 700; padding: 3px 11px; border-radius: 999px; font-family: 'Inter Tight', 'Inter Tight Fallback', system-ui, sans-serif; }
.tpl-advisor .ad-pill::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.tpl-advisor .ad-pill.open { background: var(--ad-open-bg); color: var(--ad-open-text); }
.tpl-advisor .ad-pill.soon { background: var(--ad-soon-bg); color: var(--ad-soon-text); }
.tpl-advisor .ad-pill.info { background: #e8ecec; color: #3a4d50; }

/* hero */
.tpl-advisor .ad-hero { color: #fff; background: radial-gradient(900px 420px at 88% 20%, rgba(232, 138, 46, .22), transparent 62%), radial-gradient(700px 500px at 0% 100%, rgba(107, 142, 127, .28), transparent 60%), #08363f; overflow: hidden; }
.tpl-advisor .ad-hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(24px, 4vw, 64px); align-items: center; padding: 40px 0 56px; }
.tpl-advisor .ad-hero h1 { font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-weight: 600; font-size: clamp(36px, 5vw, 64px); line-height: 1.04; letter-spacing: -.025em; margin: 0 0 18px; text-wrap: balance; color: #fff; }
.tpl-advisor .ad-hero .ad-sub { font-size: clamp(18px, 1.6vw, 21px); color: #d6e6e4; line-height: 1.55; max-width: 34em; margin: 0; }
.tpl-advisor .ad-kind { font-size: 15px; color: #bcd6d3; margin: 0 0 10px; }
.tpl-advisor .ad-cta-row { display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: center; margin-top: 30px; }
.tpl-advisor .ad-fig svg { width: 100%; height: auto; display: block; }
.tpl-advisor .ad-cap { font-size: 13px; color: #9fc0bd; margin: 8px 0 0; }
.tpl-advisor .ad-heat { stroke: #e88a2e; stroke-width: 3; stroke-linecap: round; fill: none; stroke-dasharray: 3 9; animation: ad-drift 2.4s linear infinite; }
@keyframes ad-drift { to { stroke-dashoffset: -48; } }
@media (prefers-reduced-motion: reduce) { .tpl-advisor .ad-heat { animation: none; } }

/* facts strip */
.tpl-advisor .ad-strip { background: #f5efe5; border-bottom: 1px solid #d9d0c1; }
.tpl-advisor .ad-strip .ad-wrap { display: grid; grid-template-columns: repeat(4, 1fr); }
.tpl-advisor .ad-fact { padding: 18px 22px 18px 0; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tpl-advisor .ad-fact + .ad-fact { padding-left: 22px; border-left: 1px solid #d9d0c1; }
.tpl-advisor .ad-fact b { font: 600 clamp(20px, 2vw, 26px)/1.15 'Fraunces', 'Fraunces Fallback', Georgia, serif; overflow-wrap: anywhere; }
.tpl-advisor .ad-fact span { font-size: 14px; color: #4a5f62; }

/* layout */
.tpl-advisor .ad-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: clamp(32px, 5vw, 72px); align-items: start; padding-top: 24px; padding-bottom: 48px; }
.tpl-advisor .ad-main section { padding: 52px 0; border-bottom: 1px solid #e3dacb; }
.tpl-advisor .ad-main section:last-child { border-bottom: 0; }
.tpl-advisor .ad-lede { font-size: 19px; color: #1a3d42; }
.tpl-advisor .ad-fine { font-size: 13px; color: #4a5f62; line-height: 1.5; margin: 12px 0 0; }

/* contact card */
.tpl-advisor .ad-rail { position: sticky; top: 84px; margin-top: 40px; }
.tpl-advisor .ad-contact { background: #fff; border: 1px solid #e3dacb; border-radius: 18px; padding: 24px; box-shadow: var(--shadow-card, 0 1px 2px rgba(10, 42, 46, .04), 0 8px 24px -12px rgba(10, 42, 46, .14)); }
.tpl-advisor .ad-contact h2 { font-size: 22px; margin: 0 0 4px; }
.tpl-advisor .ad-contact h2::before { display: none; }
.tpl-advisor .ad-rate { display: flex; align-items: baseline; gap: 10px; margin: 10px 0 0; }
.tpl-advisor .ad-rate b { font: 600 34px 'Fraunces', 'Fraunces Fallback', Georgia, serif; }
.tpl-advisor .ad-stars { color: #d4751c; letter-spacing: 2px; font-size: 18px; }
.tpl-advisor .ad-tel { display: flex; align-items: center; gap: 10px; margin: 16px 0 0; font: 600 22px 'Fraunces', 'Fraunces Fallback', Georgia, serif; color: #08363f; text-decoration: none; }
.tpl-advisor .ad-tel:hover { color: #a4540a; }
.tpl-advisor .ad-actions { display: grid; gap: 10px; margin-top: 16px; }
.tpl-advisor .ad-maps { display: inline-block; margin-top: 14px; font-size: 14px; }

/* "call first" window */
.tpl-advisor .ad-window { margin-top: 28px; background: #fff; border: 1px solid #e3dacb; border-radius: 18px; box-shadow: var(--shadow-card, 0 8px 24px -12px rgba(10, 42, 46, .14)); overflow: hidden; }
.tpl-advisor .ad-zones { display: grid; grid-template-columns: 1.35fr 1fr; }
.tpl-advisor .ad-zone { padding: 26px 24px 24px; }
.tpl-advisor .ad-zone.before { background: linear-gradient(180deg, #e3f1e8, #fff 85%); }
.tpl-advisor .ad-zone.after { border-left: 2px dashed #d4751c; }
.tpl-advisor .ad-zone h3 { display: flex; flex-wrap: wrap; gap: 8px 10px; align-items: center; margin-bottom: 16px; font-size: 17px; }
.tpl-advisor .ad-zone ol { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }
.tpl-advisor .ad-zone li { display: grid; grid-template-columns: 34px 1fr; gap: 12px; align-items: start; font-size: 16px; line-height: 1.45; }
.tpl-advisor .ad-zone li i { font: 700 15px 'Inter Tight', system-ui, sans-serif; font-style: normal; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: #08363f; color: #fff; }
.tpl-advisor .ad-zone li.go i { background: #a4540a; }
.tpl-advisor .ad-zone li b { display: block; font-weight: 700; }
.tpl-advisor .ad-zone li span { color: #1a3d42; font-size: 15px; }
.tpl-advisor .ad-marker { background: #08363f; color: #fff; font-size: 15px; font-weight: 600; padding: 12px 24px; display: flex; gap: 10px; align-items: center; }
.tpl-advisor .ad-marker svg { color: #e88a2e; }

/* ledger rows */
.tpl-advisor .ad-rows { margin-top: 26px; border-top: 2px solid #0a2a2e; }
.tpl-advisor .ad-row { display: grid; grid-template-columns: 60px 1fr; gap: 6px 20px; padding: 24px 0; border-bottom: 1px solid #d9d0c1; }
.tpl-advisor .ad-ic { width: 52px; height: 52px; border-radius: 14px; background: #f5efe5; color: #0d4f5c; display: grid; place-items: center; }
.tpl-advisor .ad-ic svg { width: 30px; height: 30px; }
.tpl-advisor .ad-row p { font-size: 16px; color: #1a3d42; margin: 0; }
.tpl-advisor .ad-get { margin-top: 10px !important; font-size: 14px !important; color: #4a5f62 !important; }
.tpl-advisor .ad-get b { color: #0a2a2e; }

/* sizing figure and on-site verbs */
.tpl-advisor .ad-figure { margin: 26px 0 8px; background: #08363f; border-radius: 18px; padding: clamp(18px, 3vw, 32px); color: #fff; }
.tpl-advisor .ad-figure svg { width: 100%; height: auto; display: block; }
.tpl-advisor .ad-onsite { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 30px; border-top: 2px solid #0a2a2e; }
.tpl-advisor .ad-onsite div { padding: 20px 20px 0 0; }
.tpl-advisor .ad-onsite div + div { padding-left: 20px; border-left: 1px solid #d9d0c1; }
.tpl-advisor .ad-onsite svg { color: #0d4f5c; margin-bottom: 8px; }
.tpl-advisor .ad-onsite b { font: 600 18px 'Fraunces', 'Fraunces Fallback', Georgia, serif; display: block; margin-bottom: 2px; }
.tpl-advisor .ad-onsite span { font-size: 15px; color: #1a3d42; line-height: 1.5; display: block; }

/* rebate ledger */
.tpl-advisor .ad-led { margin-top: 24px; border-top: 2px solid #0a2a2e; }
.tpl-advisor .ad-led .r { display: grid; grid-template-columns: 200px 1fr; gap: 6px 24px; padding: 22px 0; border-bottom: 1px solid #d9d0c1; }
.tpl-advisor .ad-amt { font: 600 clamp(24px, 2.2vw, 30px)/1.1 'Fraunces', 'Fraunces Fallback', Georgia, serif; color: #2d6a4f; letter-spacing: -.01em; overflow-wrap: anywhere; }
.tpl-advisor .ad-led .l { margin-bottom: 6px; }
.tpl-advisor .ad-led p { font-size: 16px; color: #1a3d42; margin: 0; }
.tpl-advisor .ad-src { font-size: 14px !important; color: #4a5f62 !important; margin-top: 8px !important; }

/* ranks, area, services, checks */
.tpl-advisor .ad-rank { display: flex; justify-content: space-between; gap: 14px; align-items: center; padding: 16px 0; border-bottom: 1px solid #d9d0c1; text-decoration: none; color: inherit; min-height: 56px; }
.tpl-advisor .ad-rank:hover b { color: #a4540a; }
.tpl-advisor .ad-rank b { font: 600 20px 'Fraunces', 'Fraunces Fallback', Georgia, serif; }
.tpl-advisor .ad-rank span { font-size: 15px; color: #4a5f62; }
.tpl-advisor .ad-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.tpl-advisor .ad-chip { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border-radius: 999px; background: #fff; border: 1px solid #e3dacb; color: #08363f; font-weight: 600; font-size: 15px; text-decoration: none; }
a.ad-chip:hover { border-color: #0d4f5c; }
.tpl-advisor .ad-checks { margin-top: 22px; border-top: 2px solid #0a2a2e; }
.tpl-advisor .ad-checks div { display: grid; grid-template-columns: 150px 1fr; gap: 4px 20px; padding: 16px 0; border-bottom: 1px solid #d9d0c1; }
.tpl-advisor .ad-checks b { font-size: 15px; color: #2d6a4f; }
.tpl-advisor .ad-checks p { font-size: 16px; margin: 0; }

/* faq and closing */
.tpl-advisor .ad-main details { background: #fff; border: 1px solid #e3dacb; border-radius: 14px; padding: 0 20px; margin-bottom: 10px; box-shadow: var(--shadow-card, 0 1px 2px rgba(10, 42, 46, .04)); }
.tpl-advisor .ad-main summary { font-weight: 700; cursor: pointer; min-height: 56px; display: flex; align-items: center; justify-content: space-between; gap: 14px; list-style: none; }
.tpl-advisor .ad-main summary::-webkit-details-marker { display: none; }
.tpl-advisor .ad-main summary::after { content: "+"; font: 600 26px 'Fraunces', 'Fraunces Fallback', Georgia, serif; color: #a4540a; transition: transform .25s var(--ad-ease); }
.tpl-advisor .ad-main details[open] summary::after { transform: rotate(45deg); }
.tpl-advisor .ad-main details p { padding-bottom: 18px; color: #1a3d42; margin: 0; }
.tpl-advisor .ad-final { background: radial-gradient(700px 300px at 50% 120%, rgba(232, 138, 46, .25), transparent 70%), #08363f; color: #fff; text-align: center; padding: 64px 0; }
.tpl-advisor .ad-final h2 { color: #fff; margin: 0 auto 14px; max-width: 18em; }
.tpl-advisor .ad-final h2::before { margin: 0 auto 16px; }
.tpl-advisor .ad-final p { color: #cfe3e1; margin: 0 auto 26px; }
.tpl-advisor .ad-final .ad-cta-row { justify-content: center; margin-top: 0; }
.tpl-advisor .ad-claim { margin-top: 32px; padding: 20px 22px; background: #f5efe5; border-radius: 14px; font-size: 15px; }
.tpl-advisor .ad-claim p { margin: 0 0 8px; }
.tpl-advisor .ad-bar { display: none; }

@media (max-width: 1000px) {
  .tpl-advisor .ad-layout { grid-template-columns: 1fr; }
  .tpl-advisor .ad-rail { position: static; margin-top: 0; }
}
@media (max-width: 760px) {
  .tpl-advisor { padding-bottom: 78px; }
  .tpl-advisor .ad-hero-grid { grid-template-columns: 1fr; padding-bottom: 36px; }
  .tpl-advisor .ad-fig { max-width: 420px; margin: 8px auto 0; }
  .tpl-advisor .ad-strip .ad-wrap { grid-template-columns: 1fr 1fr; }
  .tpl-advisor .ad-fact { padding: 14px 12px 14px 0; }
  .tpl-advisor .ad-fact:nth-child(odd) { padding-left: 0; border-left: 0; }
  .tpl-advisor .ad-fact:nth-child(n+3) { border-top: 1px solid #d9d0c1; }
  .tpl-advisor .ad-zones { grid-template-columns: 1fr; }
  .tpl-advisor .ad-zone.after { border-left: 0; border-top: 2px dashed #d4751c; }
  .tpl-advisor .ad-row { grid-template-columns: 1fr; }
  .tpl-advisor .ad-onsite { grid-template-columns: 1fr; }
  .tpl-advisor .ad-onsite div, .tpl-advisor .ad-onsite div + div { padding: 18px 0; border-left: 0; border-bottom: 1px solid #d9d0c1; }
  .tpl-advisor .ad-led .r { grid-template-columns: 1fr; }
  .tpl-advisor .ad-checks div { grid-template-columns: 1fr; }
  .tpl-advisor .ad-bar { display: grid; grid-template-columns: 1fr 1.4fr; gap: 10px; position: fixed; left: 0; right: 0; bottom: 0; background: rgba(250, 247, 242, .96); backdrop-filter: blur(8px); padding: 10px 16px; border-top: 1px solid #d9d0c1; z-index: 40; }
  .tpl-advisor .ad-bar.one { grid-template-columns: 1fr; }
}

/* the page carries its own call and website bar: the site's floating rebate button would sit on top of it */
.tpl-advisor .sticky-cta, .tpl-advisor #sticky-cta { display: none !important; }
.tpl-advisor .ad-rank { flex-wrap: wrap; }

/* ===== template design: stacking (stacking.css) ===== */
/* tpl-stacking: stacking calculator city pages. Defaults only (zero specificity); the page's variant CSS wins where it speaks. */
body.tpl-stacking { --page-gut: clamp(20px, 4vw, 40px); }
body.tpl-stacking main :is(p, li, dd, blockquote):not(.hero *, header *, .cta *, .center, .centered, [class*="hero"] *, [style*="center"]) { max-width: 48em; }

/* ===== template design: powerscore (powerscore.css) ===== */
/* PowerScore design (body.tpl-powerscore): /powerscore/ and the city comparison pages.
   Bold left-aligned hero with stat cards, a prominent city picker, readable podium rings and region cards. */
body.tpl-powerscore { --gut: clamp(20px, 3.2vw, 56px); }
.tpl-powerscore main .wrap { max-width: var(--container); padding-left: var(--gut); padding-right: var(--gut); }

/* ---------- hero ---------- */
.tpl-powerscore header.hero { position: relative; overflow: hidden; padding: clamp(44px, 6vw, 96px) 0 clamp(40px, 4.4vw, 64px); text-align: left;
  background: radial-gradient(120% 140% at 100% 0%, rgba(232, 138, 46, .24) 0%, rgba(232, 138, 46, 0) 46%), radial-gradient(90% 120% at 0% 100%, rgba(107, 142, 127, .3) 0%, rgba(107, 142, 127, 0) 55%), var(--teal-deep); }
.tpl-powerscore header.hero::after { content: ""; position: absolute; right: -120px; top: 40px; width: 460px; height: 460px; border-radius: 50%; border: 76px solid rgba(232, 138, 46, .12); pointer-events: none; }
.tpl-powerscore header.hero > .wrap { position: relative; z-index: 1; }
.tpl-powerscore .hero .eyebrow { margin: 0 0 18px; font-size: 13px; letter-spacing: .1em; color: #f5b566; }
.tpl-powerscore .hero h1 { max-width: 9.6em; margin: 0 0 20px; font-size: clamp(38px, 5.6vw, 80px); font-weight: 600; line-height: 1.02; letter-spacing: -.025em; text-wrap: balance; }
.tpl-powerscore .hero p.lead, .tpl-powerscore .hero > .wrap > p { max-width: 34.8em; margin: 0; font-size: clamp(17px, 1.5vw, 21px); line-height: 1.5; color: rgba(250, 247, 242, .88); text-wrap: pretty; }
.tpl-powerscore .hero-stats { display: grid; margin-top: clamp(28px, 3.4vw, 48px) !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(10px, 1.2vw, 16px); margin: 0; }
.tpl-powerscore .hero-stat { padding: clamp(16px, 1.8vw, 24px) clamp(16px, 1.8vw, 26px); border-radius: 18px; background: #fff; text-align: left; box-shadow: 0 1px 2px rgba(10, 42, 46, .06), 0 18px 40px -18px rgba(10, 42, 46, .35); }
.tpl-powerscore .hero-stat .num { font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(26px, 2.6vw, 40px); font-weight: 600; line-height: 1.05; letter-spacing: -.02em; color: var(--teal-deep); }
.tpl-powerscore .hero-stat .lbl { margin-top: 6px; font-size: 13px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: #4a5f62; }

/* ---------- picker ---------- */
.tpl-powerscore .picker-section { padding-top: 8px; }
.tpl-powerscore .picker-card { padding: clamp(22px, 2.6vw, 36px); border: 1px solid #cfdcd9; border-radius: 22px; background: #fff; box-shadow: 0 1px 2px rgba(10, 42, 46, .05), 0 24px 48px -24px rgba(10, 42, 46, .3); }
.tpl-powerscore .picker-card h2 { font-size: clamp(24px, 2.2vw, 32px); font-weight: 600; margin-bottom: 16px; }
.tpl-powerscore .picker-row select { min-height: 56px; font-size: 17px; border-radius: 14px; }
.tpl-powerscore .picker-row button { min-height: 56px; padding: 0 28px; border-radius: 999px; font-size: 17px; font-weight: 700; }

/* ---------- headings and type ---------- */
.tpl-powerscore main h2.section-title { position: relative; padding-top: 22px; font-size: clamp(28px, 2.6vw, 38px); font-weight: 600; line-height: 1.1; letter-spacing: -.018em; color: var(--teal-deep); }
.tpl-powerscore main h2.section-title::before { content: ""; position: absolute; top: 0; left: 0; width: 44px; height: 4px; border-radius: 4px; background: #e88a2e; }
.tpl-powerscore main h2.section-title[style*="inline"] { display: inline-block !important; }
.tpl-powerscore main .section-sub, .tpl-powerscore main section p { font-size: 17px; line-height: 1.65; }
.tpl-powerscore main li { font-size: 16px; line-height: 1.6; }

/* ---------- podium rings and region cards ---------- */
.tpl-powerscore .ring { width: 136px; height: 136px; }
.tpl-powerscore .ring b { font-size: 40px; }
.tpl-powerscore .ring small { margin-top: 4px; font-size: 13px !important; text-transform: none; letter-spacing: 0; color: #4a5f62 !important; }
.tpl-powerscore .rg-card { border-radius: 16px; transition: border-color .15s, box-shadow .15s, transform .15s; }
.tpl-powerscore .rg-card:hover { transform: translateY(-2px); box-shadow: 0 16px 32px -18px rgba(10, 42, 46, .3); }

@media (max-width: 760px) {
  .tpl-powerscore .hero-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tpl-powerscore .hero h1 { font-size: clamp(34px, 9.4vw, 44px); }
  .tpl-powerscore .picker-section { padding-top: 28px; }
}
.tpl-powerscore .picker-section { padding-left: 0 !important; padding-right: 0 !important; }
.tpl-powerscore .picker-card { margin-left: 0; margin-right: 0; max-width: none; }
/* ring label: "/ 100" fits inside the ring at every size (the word stays for screen readers) */
.tpl-powerscore .ring small { font-size: 0 !important; line-height: 0; }
.tpl-powerscore .ring small::after { content: "/ 100"; font-size: 14px; line-height: 1.4; font-weight: 600; color: #4a5f62; }

/* ===== template design: calculator (calculator.css) ===== */
/* tpl-calculator: regional rebate calculators. Defaults only (zero specificity); the calculator's variant CSS wins where it speaks. */
body.tpl-calculator { --page-gut: clamp(20px, 4vw, 40px); }
body.tpl-calculator main :is(p, li, dd, blockquote):not(.hero *, header *, .cta *, .center, .centered, [class*="hero"] *, [style*="center"]) { max-width: 48em; }

/* ===== template design: home (home.css) ===== */
/* Homepage design (body.tpl-home), built by scripts/build_home.py. "The Honest Ledger": a teal hero whose paper
   rebate sheet shows the chosen region's open programs, then hairline ledger rows instead of card grids. */
body.tpl-home { --hm-w: min(1200px, 100% - 2 * var(--gutter)); background: var(--paper); color: var(--ink); font-family: 'Inter Tight', 'Inter Tight Fallback', system-ui, sans-serif; font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
.tpl-home button, .tpl-home select, .tpl-home input { font-family: inherit; }
.tpl-home main { display: block; padding: 0; }
.tpl-home .hm-wrap { width: var(--hm-w); margin: 0 auto; }
.tpl-home .hm-narrow { width: min(820px, 100% - 2 * var(--gutter)); }
.tpl-home ::selection { background: rgba(232, 138, 46, .32); color: var(--ink); }
.tpl-home .hm-ic { width: 22px; height: 22px; flex: none; color: var(--teal); }
.tpl-home .hm-ar { width: 18px; height: 18px; flex: none; transition: transform .25s cubic-bezier(.2, .8, .2, 1); }
.tpl-home a:hover > .hm-ar, .tpl-home button:hover > .hm-ar { transform: translateX(3px); }
.tpl-home .hm-amt { font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-weight: 600; letter-spacing: -.015em; font-variant-numeric: lining-nums tabular-nums; color: var(--green-money); }
.tpl-home .hm-iq { display: inline-block; margin-left: 8px; padding: 1px 8px; border: 1px solid var(--card-rule); border-radius: 999px; font-size: 13px; font-weight: 600; color: var(--muted); white-space: nowrap; vertical-align: 1px; }

/* ---------- section rhythm ---------- */
.tpl-home .hm-sec { padding: clamp(56px, 7vw, 104px) 0; }
.tpl-home .hm-sec + .hm-sec { border-top: 1px solid var(--rule); }
.tpl-home .hm-sec h2 { max-width: 13.2em; margin: 0 0 14px; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(30px, 3.4vw, 46px); font-weight: 600; line-height: 1.08; letter-spacing: -.02em; color: var(--ink); text-wrap: balance; }
.tpl-home .hm-sec h3 { margin: 0 0 12px; font-size: 17px; font-weight: 700; color: var(--ink); }
.tpl-home .hm-intro { max-width: 37.2em; margin: 0 0 clamp(28px, 3vw, 40px); font-size: 18px; line-height: 1.6; color: var(--ink-soft); text-wrap: pretty; }
.tpl-home .hm-btn-line { display: inline-flex; align-items: center; min-height: 48px; padding: 0 22px; border: 1.5px solid var(--teal-deep); border-radius: 999px; font-weight: 700; color: var(--teal-deep); text-decoration: none; transition: background .2s, color .2s; }
.tpl-home .hm-btn-line:hover { background: var(--teal-deep); color: var(--paper); }

/* ---------- hero ---------- */
.tpl-home .hm-hero { position: relative; overflow: hidden; padding: clamp(40px, 6vw, 96px) 0 clamp(56px, 7vw, 112px); color: var(--paper);
  background: radial-gradient(110% 120% at 100% 0%, rgba(232, 138, 46, .26) 0%, rgba(232, 138, 46, 0) 48%), radial-gradient(80% 110% at 0% 100%, rgba(107, 142, 127, .32) 0%, rgba(107, 142, 127, 0) 56%), var(--teal-deep); }
.tpl-home .hm-hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px); background-size: 48px 48px;
  -webkit-mask-image: linear-gradient(90deg, transparent 30%, #000 100%); mask-image: linear-gradient(90deg, transparent 30%, #000 100%); }
.tpl-home .hm-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.tpl-home .hm-news { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 0 0 26px; padding: 8px 16px 8px 8px; border: 1px solid rgba(232, 138, 46, .55); border-radius: 999px; background: rgba(232, 138, 46, .14); color: var(--paper); font-size: 15px; line-height: 1.4; text-decoration: none; transition: background .2s; }
.tpl-home .hm-news:hover { background: rgba(232, 138, 46, .26); }
.tpl-home .hm-news b { padding: 3px 10px; border-radius: 999px; background: var(--amber-bright); color: var(--ink); font-size: 13px; }
.tpl-home .hm-news span { font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.tpl-home .hm-hero h1 { max-width: 9em; margin: 0 0 20px; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(40px, 5.4vw, 76px); font-weight: 600; line-height: 1.02; letter-spacing: -.028em; color: #fff; text-wrap: balance; }
.tpl-home .hm-lede { max-width: 31.2em; margin: 0 0 30px; font-size: clamp(17px, 1.45vw, 20px); line-height: 1.55; color: rgba(250, 247, 242, .86); text-wrap: pretty; }
.tpl-home .hm-find { max-width: 560px; margin: 0; padding: 0; background: none; box-shadow: none; }
.tpl-home .hm-find-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tpl-home .hm-find label { display: block; margin: 0 0 6px; font-size: 14px; font-weight: 600; color: rgba(250, 247, 242, .82); }
.tpl-home .hm-find select { width: 100%; min-height: 52px; padding: 10px 40px 10px 14px; border: 1px solid rgba(255, 255, 255, .25); border-radius: 12px; font: 500 16px 'Inter Tight', sans-serif; color: var(--ink); cursor: pointer;
  -webkit-appearance: none; appearance: none; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2308363f' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 15px center; }
.tpl-home .hm-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 54px; padding: 0 30px; border: 0; border-radius: 999px; background: var(--amber-text); color: #fff; font: 700 17px 'Inter Tight', sans-serif; text-decoration: none; cursor: pointer; transition: background .2s, transform .2s; }
.tpl-home .hm-btn:hover { background: var(--amber-text-deep, #8a4607); }
.tpl-home .hm-btn:active { transform: translateY(1px); }
.tpl-home .hm-find .hm-btn { width: 100%; margin-top: 14px; }
.tpl-home .hm-find-note { margin: 10px 0 0; font-size: 14px; color: rgba(250, 247, 242, .72); }
.tpl-home .hm-proof { display: grid; gap: 8px; margin: 28px 0 0; padding: 0; list-style: none; font-size: 15px; color: rgba(250, 247, 242, .86); }
.tpl-home .hm-proof li { display: flex; gap: 10px; align-items: flex-start; }
.tpl-home .hm-proof a { color: #fff; text-underline-offset: 3px; }
.tpl-home .hm-ck { width: 18px; height: 18px; flex: none; margin-top: 2px; color: var(--amber-bright); }

/* the rebate sheet: the page's signature object */
.tpl-home .hm-sheet { position: relative; padding: clamp(20px, 2.2vw, 30px); border-radius: 20px; background: var(--paper); color: var(--ink);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .12), 0 30px 60px -24px rgba(0, 0, 0, .55); }
.tpl-home .hm-sheet::before { content: ""; position: absolute; left: 24px; right: 24px; top: 0; height: 4px; border-radius: 0 0 4px 4px; background: var(--amber); }
.tpl-home .hm-sheet-head { padding-bottom: 14px; border-bottom: 1px solid var(--rule); }
.tpl-home .hm-sheet-title { margin: 0 0 6px; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(23px, 2vw, 28px); font-weight: 600; line-height: 1.15; letter-spacing: -.015em; color: var(--ink); }
.tpl-home .hm-sheet-sub { margin: 0; font-size: 14px; line-height: 1.5; color: var(--muted); }
.tpl-home .hm-rows { margin: 0; padding: 0; list-style: none; }
.tpl-home .hm-row { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 13px 0; border-bottom: 1px solid var(--card-rule); }
.tpl-home .hm-row-t { min-width: 0; }
.tpl-home .hm-row-t b { display: block; font-size: 15px; line-height: 1.3; color: var(--ink); }
.tpl-home .hm-row-p { display: block; margin-top: 2px; font-size: 13px; line-height: 1.45; color: var(--muted); }
.tpl-home .hm-row-p a { color: var(--muted); text-decoration: underline; text-decoration-color: var(--card-rule); text-underline-offset: 3px; }
.tpl-home .hm-row-p a:hover { color: var(--teal-deep); text-decoration-color: currentColor; }
.tpl-home .hm-row-m, .tpl-home .hm-reg-m { display: block; margin-top: 3px; font-size: 13px; font-weight: 600; color: var(--green-money); }
.tpl-home .hm-row-a { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; text-align: right; }
.tpl-home .hm-row-a .hm-amt { font-size: 19px; line-height: 1.15; }
.tpl-home .hm-row-a .rb-status { margin: 0; }
.tpl-home .hm-row:has(.rb-upcoming) .hm-amt { color: var(--amber-text); }
.tpl-home .hm-sheet-foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 16px; padding-top: 14px; font-size: 13px; color: var(--muted); }
.tpl-home .hm-sheet-foot a { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-size: 15px; font-weight: 700; color: var(--teal-deep); text-decoration: none; }
.tpl-home .hm-sheet.hm-in .hm-row { animation: hm-print .5s cubic-bezier(.16, 1, .3, 1) both; }
.tpl-home .hm-sheet.hm-in .hm-row:nth-child(2) { animation-delay: .04s; } .tpl-home .hm-sheet.hm-in .hm-row:nth-child(3) { animation-delay: .08s; }
.tpl-home .hm-sheet.hm-in .hm-row:nth-child(4) { animation-delay: .12s; } .tpl-home .hm-sheet.hm-in .hm-row:nth-child(5) { animation-delay: .16s; }
.tpl-home .hm-sheet.hm-in .hm-row:nth-child(6) { animation-delay: .2s; } .tpl-home .hm-sheet.hm-in .hm-row:nth-child(n+7) { animation-delay: .24s; }
@keyframes hm-print { from { opacity: 0; transform: translateY(6px); clip-path: inset(0 0 100% 0); } to { opacity: 1; transform: none; clip-path: inset(0 0 0 0); } }

/* ---------- federal ---------- */
.tpl-home .hp-fed-wrap { width: var(--hm-w); max-width: none; margin: clamp(32px, 4vw, 56px) auto 0; padding: 0; box-sizing: border-box; }
.tpl-home .hp-fed-wrap .fed-alert { margin: 0; }
.tpl-home .hm-usfed { padding: clamp(28px, 3vw, 40px) 0 clamp(8px, 1vw, 16px); }
.tpl-home .hm-usfed-in { box-sizing: border-box; padding: 22px 26px; border: 1px solid var(--card-rule); border-radius: var(--radius-card, 18px); background: #fff; }
.tpl-home .hm-usfed h2 { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 8px; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 23px; font-weight: 600; line-height: 1.25; color: var(--ink); }
.tpl-home .hm-usfed h2 .rb-status { margin: 0; font-family: 'Inter Tight', 'Inter Tight Fallback', sans-serif; }
.tpl-home .hm-usfed p { max-width: 46.8em; margin: 0; font-size: 16px; line-height: 1.6; color: var(--ink-soft); }

/* ---------- how it works ---------- */
.tpl-home .hm-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 48px); margin: 8px 0 0; padding: 0; list-style: none; counter-reset: hm; }
.tpl-home .hm-steps li { position: relative; padding-top: 58px; font-size: 16px; line-height: 1.6; color: var(--ink-soft); counter-increment: hm; }
.tpl-home .hm-steps li::before { content: counter(hm); position: absolute; top: 0; left: 0; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 44px; font-weight: 600; line-height: 1; color: var(--amber-text); }
.tpl-home .hm-steps li::after { content: ""; position: absolute; top: 22px; left: 44px; right: 0; height: 1px; background: var(--rule); }
.tpl-home .hm-steps li:last-child::after { display: none; }
.tpl-home .hm-steps b { display: block; margin-bottom: 4px; font-size: 18px; color: var(--ink); }

/* ---------- region ledger ---------- */
.tpl-home .hm-ledger { background: var(--paper-warm); }
.tpl-home .hm-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 28px; padding: 2px 0 6px; overflow-x: auto; scrollbar-width: thin; scrollbar-color: var(--card-rule) transparent; }
.tpl-home .hm-tab { display: inline-flex; flex: none; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border: 1px solid var(--card-rule); border-radius: 999px; background: #fff; font: 600 15px 'Inter Tight', sans-serif; color: var(--teal-deep); cursor: pointer; transition: border-color .2s, background .2s, color .2s; }
.tpl-home .hm-tab .hm-ic { width: 18px; height: 18px; color: inherit; }
.tpl-home .hm-tab:hover { border-color: var(--teal); }
.tpl-home .hm-tab[aria-pressed="true"] { border-color: var(--teal-deep); background: var(--teal-deep); color: var(--paper); }
.tpl-home .hm-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(28px, 4vw, 64px); align-items: start; }
.tpl-home .hm-col h3 { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 0; padding-bottom: 12px; border-bottom: 2px solid var(--ink); font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 24px; font-weight: 600; }
.tpl-home .hm-col h3 span { font-family: 'Inter Tight', 'Inter Tight Fallback', sans-serif; font-size: 14px; font-weight: 600; color: var(--muted); }
.tpl-home .hm-regs { margin: 0; padding: 0; list-style: none; }
.tpl-home .hm-reg { display: grid; grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); gap: 4px 20px; padding: 16px 0; border-bottom: 1px solid var(--card-rule); }
.tpl-home .hm-reg-main { display: flex; flex-direction: column; }
.tpl-home .hm-reg-name { font-size: 18px; font-weight: 700; color: var(--ink); text-decoration: none; }
.tpl-home .hm-reg-name:hover { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }
.tpl-home .hm-reg-count { font-size: 13px; color: var(--muted); }
.tpl-home .hm-reg-top .hm-amt { font-size: 21px; line-height: 1.2; }
.tpl-home .hm-cur { font-size: 13px; font-weight: 600; color: var(--muted); }
.tpl-home .hm-reg-p { display: block; font-size: 14px; line-height: 1.45; color: var(--ink-soft); }
.tpl-home .hm-reg.hm-none .hm-reg-p { color: var(--muted); font-style: italic; }
.tpl-home .hm-reg-cities { grid-column: 2; display: flex; flex-wrap: wrap; gap: 2px 14px; font-size: 14px; }
.tpl-home .hm-reg-cities a { color: var(--teal); text-decoration: none; }
.tpl-home .hm-reg-cities a:hover { text-decoration: underline; text-underline-offset: 3px; }
.tpl-home .hm-reg-cities .hm-more { font-weight: 700; color: var(--teal-deep); }

/* ---------- PowerScore ---------- */
.tpl-home .hm-ps-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(28px, 4vw, 64px); margin-bottom: 32px; }
.tpl-home .hm-ps { margin: 0; padding: 0; list-style: none; counter-reset: ps; }
.tpl-home .hm-ps li { counter-increment: ps; border-bottom: 1px solid var(--card-rule); }
.tpl-home .hm-ps a { display: grid; grid-template-columns: 26px minmax(0, 1fr) minmax(60px, 34%) 34px; gap: 12px; align-items: center; min-height: 52px; color: var(--ink); text-decoration: none; }
.tpl-home .hm-ps a::before { content: counter(ps); font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 18px; color: var(--muted); }
.tpl-home .hm-ps a:hover .hm-ps-city { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }
.tpl-home .hm-ps-city { font-size: 16px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tpl-home .hm-ps-bar { height: 8px; border-radius: 99px; background: linear-gradient(90deg, var(--teal) calc(var(--s) * 1%), var(--card-rule) 0); }
.tpl-home .hm-ps b { font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 20px; font-variant-numeric: tabular-nums; text-align: right; }

/* ---------- what changed ---------- */
.tpl-home .hm-chg-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 360px); gap: clamp(32px, 5vw, 72px); align-items: start; }
.tpl-home .hm-feed { margin: 0 0 28px; padding: 0; list-style: none; }
.tpl-home .hm-feed li { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 16px; padding: 18px 0; border-top: 1px solid var(--card-rule); }
.tpl-home .hm-feed b { font-size: 16px; color: var(--ink); }
.tpl-home .hm-feed p { margin: 4px 0 0; font-size: 15px; line-height: 1.55; color: var(--ink-soft); }
.tpl-home .hm-meta { display: block; margin-top: 2px; font-size: 13px; color: var(--muted); }
.tpl-home .hm-meta a { color: var(--teal); }
.tpl-home .hm-chg { justify-self: start; align-self: start; padding: 3px 10px; border-radius: 6px; font-size: 13px; font-weight: 700; line-height: 1.3; white-space: nowrap; }
.tpl-home .hm-chg-open { background: #e3f1e8; color: #1f5a3d; } .tpl-home .hm-chg-soon { background: #fdeccf; color: #8a4a06; }
.tpl-home .hm-chg-closed { background: #f3dcdc; color: #8a2b2b; } .tpl-home .hm-chg-info { background: #e8e8e8; color: #444; }
.tpl-home .hm-deadlines { position: sticky; top: 96px; padding: 24px; border-radius: var(--radius-card, 18px); background: var(--teal-deep); color: var(--paper); }
.tpl-home .hm-deadlines h3 { margin: 0 0 8px; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 22px; font-weight: 600; color: #fff; }
.tpl-home .hm-deadlines ul { margin: 0 0 12px; padding: 0; list-style: none; }
.tpl-home .hm-deadlines li { padding: 12px 0; border-bottom: 1px solid rgba(255, 255, 255, .14); background: none; border-left: 0; border-radius: 0; margin: 0; font-size: 15px; color: var(--paper); }
.tpl-home .hm-deadlines .hf-when { display: block; font-size: 13px; color: var(--amber-bright); }
.tpl-home .hm-deadlines a { color: #fff; font-weight: 600; text-underline-offset: 3px; }
.tpl-home .hm-deadlines .hm-meta { color: rgba(250, 247, 242, .7); }
.tpl-home .hm-deadlines p { margin: 0; } .tpl-home .hm-deadlines p a { display: inline-flex; align-items: center; min-height: 44px; }

/* ---------- trust ---------- */
.tpl-home .hm-trust-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3vw, 48px); margin: 8px 0 32px; }
.tpl-home .hm-trust-grid p { margin: 0; padding-top: 18px; border-top: 2px solid var(--ink); font-size: 16px; line-height: 1.6; color: var(--ink-soft); }
.tpl-home .hm-trust-grid b { display: block; margin-bottom: 8px; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(34px, 3.4vw, 48px); font-weight: 600; line-height: 1; letter-spacing: -.02em; color: var(--ink); }
.tpl-home .hm-founder { max-width: 42em; margin: 0; font-size: 16px; line-height: 1.6; color: var(--ink-soft); }
.tpl-home .hm-trust a, .tpl-home .hm-founder a { color: var(--teal); text-underline-offset: 3px; }

/* ---------- guides ---------- */
.tpl-home .hm-guides { background: var(--paper-warm); }
.tpl-home .hm-posts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 2.4vw, 32px); margin: 8px 0 44px; padding: 0; list-style: none; }
.tpl-home .hm-posts a { display: flex; flex-direction: column; gap: 8px; height: 100%; padding: 24px; border: 1px solid var(--card-rule); border-radius: var(--radius-card, 18px); background: #fff; color: var(--ink); text-decoration: none; box-shadow: var(--shadow-card); transition: transform .25s cubic-bezier(.2, .8, .2, 1), box-shadow .25s; box-sizing: border-box; }
.tpl-home .hm-posts a:hover { transform: translateY(-2px); box-shadow: 0 2px 4px rgba(10, 42, 46, .05), 0 18px 36px -16px rgba(10, 42, 46, .24); }
.tpl-home .hm-posts b { font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 21px; font-weight: 600; line-height: 1.25; }
.tpl-home .hm-posts span:last-child { font-size: 15px; line-height: 1.55; color: var(--ink-soft); }
.tpl-home .hm-tag { align-self: flex-start; font-size: 13px; font-weight: 700; color: var(--amber-text); }
.tpl-home .hm-links { columns: 3 220px; column-gap: 32px; margin: 0 0 32px; padding: 0; list-style: none; }
.tpl-home .hm-links li { break-inside: avoid; border-bottom: 1px solid var(--card-rule); }
.tpl-home .hm-links a { display: flex; align-items: center; min-height: 46px; font-size: 16px; font-weight: 600; color: var(--teal-deep); text-decoration: none; }
.tpl-home .hm-links a:hover { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }

/* ---------- FAQ ---------- */
.tpl-home .hm-faq details { border-bottom: 1px solid var(--card-rule); }
.tpl-home .hm-faq summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 60px; padding: 14px 0; font-size: 18px; font-weight: 700; color: var(--ink); cursor: pointer; list-style: none; }
.tpl-home .hm-faq summary::-webkit-details-marker { display: none; }
.tpl-home .hm-faq summary::after { content: "+"; flex: none; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 28px; font-weight: 400; line-height: 1; color: var(--amber-text); transition: transform .25s; }
.tpl-home .hm-faq details[open] summary::after { transform: rotate(45deg); }
.tpl-home .hm-faq details p { max-width: 40.8em; margin: 0 0 20px; font-size: 17px; line-height: 1.65; color: var(--ink-soft); }

/* ---------- close ---------- */
.tpl-home .hm-close { padding: clamp(56px, 7vw, 96px) 0; text-align: center; border-top: 1px solid var(--rule); background: var(--paper); }
.tpl-home .hm-close h2 { margin: 0 auto 12px; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(32px, 4vw, 52px); font-weight: 600; line-height: 1.08; letter-spacing: -.02em; color: var(--ink); text-wrap: balance; }
.tpl-home .hm-close p { max-width: 31.2em; margin: 0 auto 26px; font-size: 18px; line-height: 1.55; color: var(--ink-soft); }
.tpl-home .hm-hp { margin: -12px 0 32px; font-size: 16px; color: var(--ink-soft); }
.tpl-home .hm-hp a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; color: var(--teal-deep); text-underline-offset: 3px; }

/* ---------- focus ---------- */
.tpl-home .hm-hero :focus-visible, .tpl-home .hm-deadlines :focus-visible { outline: 3px solid var(--amber-bright); outline-offset: 3px; }

/* ---------- tablet and phone ---------- */
@media (max-width: 1000px) {
  .tpl-home .hm-hero-grid, .tpl-home .hm-cols, .tpl-home .hm-chg-grid { grid-template-columns: minmax(0, 1fr); }
  .tpl-home .hm-hero h1 { max-width: 10.8em; }
  .tpl-home .hm-deadlines { position: static; }
}
@media (max-width: 760px) {
  .tpl-home .hm-tabs { flex-wrap: nowrap; margin-right: calc(-1 * var(--gutter)); padding-right: var(--gutter); }
  .tpl-home .hm-steps, .tpl-home .hm-trust-grid, .tpl-home .hm-posts, .tpl-home .hm-ps-cols { grid-template-columns: minmax(0, 1fr); }
  .tpl-home .hm-steps li { padding: 0 0 0 52px; } .tpl-home .hm-steps li::before { font-size: 34px; } .tpl-home .hm-steps li::after { display: none; }
  .tpl-home .hm-reg { grid-template-columns: minmax(0, 1fr); }
  .tpl-home .hm-reg-cities { grid-column: 1; }
  .tpl-home .hm-reg-cities a { display: inline-flex; align-items: center; min-height: 40px; }
  .tpl-home .hm-feed li { grid-template-columns: minmax(0, 1fr); gap: 8px; }
}
@media (max-width: 600px) {
  .tpl-home .hm-find-row { grid-template-columns: minmax(0, 1fr); }
  .tpl-home .hm-news { border-radius: 14px; font-size: 14px; }
  .tpl-home .hm-row { grid-template-columns: 20px minmax(0, 1fr); }
  .tpl-home .hm-row-a { grid-column: 2; flex-direction: row; align-items: center; justify-content: flex-start; gap: 10px; text-align: left; }
  .tpl-home .hm-ps a { grid-template-columns: 22px minmax(0, 1fr) 64px 30px; gap: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .tpl-home .hm-sheet.hm-in .hm-row { animation: none; }
  .tpl-home .hm-posts a, .tpl-home .hm-ar { transition: none; }
}

/* Visitor's country first (2026-10-17). <html data-country> comes from the edge function (IP) or the time zone fallback in
   build_home.country_script(). Both countries' content is always on the page; only the order changes. No attribute: source order. */
.tpl-home .hm-for-us { display: none; }
html[data-country="US"] .tpl-home .hm-for-us { display: inline-flex; }
html[data-country="US"] .tpl-home .hm-for-ca { display: none; }
html[data-country="US"] .tpl-home main.layout-home, html[data-country="CA"] .tpl-home main.layout-home { display: flex; flex-direction: column; }
html[data-country="US"] .tpl-home main.layout-home > *, html[data-country="CA"] .tpl-home main.layout-home > * { order: 10; }
html[data-country] .tpl-home main.layout-home > .hm-hero { order: 0; }
html[data-country="US"] .tpl-home main.layout-home > .hm-usfed { order: 1; }
html[data-country="CA"] .tpl-home main.layout-home > .hp-fed-wrap { order: 1; }
html[data-country] .tpl-home main.layout-home > .hm-how { order: 2; }
html[data-country] .tpl-home main.layout-home > .hm-ledger { order: 3; }
html[data-country="US"] .tpl-home main.layout-home > .hp-fed-wrap { order: 4; margin-bottom: clamp(32px, 4vw, 56px); }
html[data-country="CA"] .tpl-home main.layout-home > .hm-usfed { order: 4; padding-bottom: clamp(28px, 3vw, 40px); }
html[data-country="US"] .tpl-home .hm-col-us, html[data-country="US"] .tpl-home .hm-ps-us { order: -1; }

/* ---- Photo hero, larger type, photo steps, learn row (2026-10-24) ---- */
.tpl-home .hm-hero { background: linear-gradient(180deg, rgba(8, 54, 63, .84), rgba(8, 54, 63, .95)), url(/assets/learn/modern-home-1600.webp) center / cover no-repeat, var(--teal-deep); }
.tpl-home .hm-lede { font-size: clamp(19px, 1.7vw, 23px); line-height: 1.5; color: rgba(250, 247, 242, .92); }
.tpl-home .hm-find label { font-size: 16px; }
.tpl-home .hm-find-note { font-size: 15px; }
.tpl-home .hm-proof { font-size: 17px; }
.tpl-home .hm-sheet-sub, .tpl-home .hm-row-p, .tpl-home .hm-row-m, .tpl-home .hm-reg-m, .tpl-home .hm-sheet-foot, .tpl-home .hm-reg-count, .tpl-home .hm-cur, .tpl-home .hm-meta { font-size: 14px; }
.tpl-home .hm-row-t b { font-size: 16px; }
.tpl-home .hm-reg-p, .tpl-home .hm-reg-cities { font-size: 15px; }
.tpl-home .hm-feed p, .tpl-home .hm-posts span:last-child { font-size: 17px; }
.tpl-home .hm-steps-photos li { padding-top: 0; font-size: 18px; }
.tpl-home .hm-steps-photos li::before { top: 14px; left: 14px; z-index: 1; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: var(--amber); color: #fff; font-size: 24px; }
.tpl-home .hm-steps-photos li::after { display: none; }
.tpl-home .hm-steps-photos img { display: block; width: 100%; height: 200px; margin: 0 0 14px; border-radius: 20px; object-fit: cover; }
.tpl-home .hm-steps-photos b { font-size: 21px; }
.tpl-home .hm-credit { margin: 18px 0 0; font-size: 13px; color: var(--muted); }
.tpl-home .hm-learn .learn-row { margin: 0; }
@media (max-width: 760px) { .tpl-home .hm-steps-photos li { padding: 0; } }

/* ---- Homepage rebuild (2026-10-25): one-line search, slim federal banner, planning tiles, quiz, installers strip, compact places ---- */
.tpl-home .hm-bar { display: grid; grid-template-columns: 1.5fr 1fr auto; padding: 8px; border-radius: 999px; background: #fff; box-shadow: 0 18px 50px -18px rgba(0, 0, 0, .55); }
.tpl-home .hm-bar input, .tpl-home .hm-bar select { width: 100%; min-height: 56px; padding: 0 22px; border: 0; border-right: 1px solid var(--rule); background: transparent; color: var(--ink); font: inherit; font-size: 19px; }
.tpl-home .hm-bar select { border-right: 0; }
.tpl-home .hm-bar input:focus, .tpl-home .hm-bar select:focus { outline: none; }
.tpl-home .hm-bar:focus-within { box-shadow: 0 0 0 4px rgba(232, 138, 46, .55), 0 18px 50px -18px rgba(0, 0, 0, .55); }
.tpl-home .hm-bar .hm-btn { min-height: 56px; margin: 0; padding: 0 28px; border-radius: 999px; font-size: 19px; white-space: nowrap; }
.tpl-home .hm-find-msg { margin: 12px 0 0; padding: 10px 16px; border-radius: 12px; background: #fdeccf; color: #6b3a05; font-size: 17px; }
.tpl-home .hm-bar-sm { max-width: 760px; border: 1px solid var(--card-rule); box-shadow: none; }
.tpl-home .hm-bar-sm input, .tpl-home .hm-bar-sm select { min-height: 52px; font-size: 18px; }
.tpl-home .hm-bar-sm .hm-btn { min-height: 52px; font-size: 18px; }
.tpl-home .hm-tiles { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.tpl-home .hm-tile { position: relative; display: block; border-radius: 22px; overflow: hidden; aspect-ratio: 4 / 5; background: var(--teal-deep); text-decoration: none; color: #fff; }
.tpl-home .hm-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.tpl-home .hm-tile:hover img { transform: scale(1.05); }
.tpl-home .hm-tile-b { position: absolute; left: 0; right: 0; bottom: 0; padding: 40px 16px 16px; background: linear-gradient(180deg, rgba(8, 54, 63, 0), rgba(8, 54, 63, .92)); }
.tpl-home .hm-tile-b b { display: block; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(21px, 2vw, 26px); line-height: 1.1; }
.tpl-home .hm-tile-b em { display: block; margin-top: 6px; font-style: normal; font-size: 16px; font-weight: 700; color: var(--amber-bright); }
.tpl-home .hm-quiz .hpr-quiz { margin: 0; }
.tpl-home .hm-inst-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: clamp(20px, 4vw, 56px); align-items: center; }
.tpl-home .hm-inst-grid img { width: 100%; height: auto; aspect-ratio: 3 / 2; border-radius: 24px; object-fit: cover; }
.tpl-home .hm-det > summary { display: inline-flex; align-items: center; min-height: 52px; padding: 0 24px; border: 2px solid var(--teal-deep); border-radius: 999px; background: #fff; color: var(--teal-deep); font-size: 18px; font-weight: 800; cursor: pointer; list-style: none; }
.tpl-home .hm-det > summary::-webkit-details-marker { display: none; }
.tpl-home .hm-det[open] > summary { margin-bottom: 18px; }
.tpl-home .hm-trustbox { margin: 36px 0 0; }
.tpl-home .hm-faq details { margin: 0 0 12px; border: 1px solid var(--card-rule); border-radius: 18px; background: #fff; overflow: hidden; }
.tpl-home .hm-faq summary { position: relative; padding: 18px 62px 18px 22px; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(19px, 1.8vw, 23px); line-height: 1.25; cursor: pointer; list-style: none; }
.tpl-home .hm-faq summary::-webkit-details-marker { display: none; }
.tpl-home .hm-faq summary::after { content: "+"; position: absolute; right: 18px; top: 50%; transform: translateY(-50%); display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--amber); color: #fff; font: 700 22px/1 'Inter Tight', sans-serif; }
.tpl-home .hm-faq details[open] summary::after { content: "\2212"; background: var(--teal-deep); }
.tpl-home .hm-faq details > p { margin: 0; padding: 0 22px 20px; font-size: clamp(17px, 1.5vw, 19px); line-height: 1.55; }
/* slim federal banner: headline and sign-up only */
.hp-fed-wrap .fed-alert.fed-slim { margin-top: 0; }
.fed-alert.fed-slim .fed-alert-amounts, .fed-alert.fed-slim .fed-alert-how, .fed-alert.fed-slim .fed-alert-body, .fed-alert.fed-slim .fed-alert-gets, .fed-alert.fed-slim .fed-alert-badge { display: none; }
@media (max-width: 900px) { .tpl-home .hm-tiles { grid-template-columns: repeat(2, 1fr); } .tpl-home .hm-inst-grid { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .tpl-home .hm-bar { grid-template-columns: 1fr; border-radius: 24px; gap: 4px; } .tpl-home .hm-bar input, .tpl-home .hm-bar select { border-right: 0; border-bottom: 1px solid var(--rule); } .tpl-home .hm-bar .hm-btn { width: 100%; } }
.tpl-home .hm-find .hm-bar { grid-template-columns: 1fr 1fr; border-radius: 30px; }
.tpl-home .hm-find .hm-bar .hm-btn { grid-column: 1 / -1; margin-top: 6px; justify-content: center; }
.tpl-home .hm-find .hm-bar select { border-right: 0; }
.tpl-home .hm-bar input, .tpl-home .hm-bar select { min-width: 0; }
.tpl-home .hm-find .hm-bar { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
@media (max-width: 760px) { .tpl-home .hm-find .hm-bar { grid-template-columns: minmax(0, 1fr); } }
/* hero is just the way to a city page (2026-10-25) */
.tpl-home .hm-hero-grid { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; }
.tpl-home .hm-hero h1 { max-width: 12em; margin-left: auto; margin-right: auto; }
.tpl-home .hm-lede { max-width: 34em; margin-left: auto; margin-right: auto; }
.tpl-home .hm-news { margin-left: auto; margin-right: auto; text-align: left; }
.tpl-home .hm-find { width: 100%; max-width: 780px; margin: 0 auto; }
.tpl-home .hm-find .hm-bar { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; border-radius: 999px; }
.tpl-home .hm-find .hm-bar .hm-btn { grid-column: auto; margin-top: 0; }
.tpl-home .hm-find .hm-bar select { border-right: 1px solid var(--rule); }
.tpl-home .hm-pop { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; margin: 14px 0 0; font-size: 17px; color: rgba(250, 247, 242, .86); }
.tpl-home .hm-pop span { font-weight: 700; }
.tpl-home .hm-pop a { color: #fff; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.tpl-home .hm-proof { justify-items: center; }
@media (max-width: 760px) { .tpl-home .hm-find .hm-bar { grid-template-columns: minmax(0, 1fr); border-radius: 24px; } .tpl-home .hm-find .hm-bar select { border-right: 0; } }
@media (max-width: 760px) { .tpl-home .hm-bar.hm-bar-sm { grid-template-columns: minmax(0, 1fr); border-radius: 24px; } .tpl-home .hm-bar.hm-bar-sm select { border-right: 0; border-top: 1px solid var(--rule); } .tpl-home .hm-bar.hm-bar-sm .hm-btn { width: 100%; margin-top: 6px; } }
/* places as a comparison table, installers banner, guides carousel (2026-10-25) */
.tpl-home .hm-mx-wrap { overflow-x: auto; border: 1px solid var(--card-rule); border-radius: 20px; background: #fff; }
.tpl-home .hm-mx { width: 100%; min-width: 980px; border-collapse: separate; border-spacing: 0; font-size: 17px; }
.tpl-home .hm-mx th, .tpl-home .hm-mx td { padding: 12px 14px; border-bottom: 1px solid #efe8da; text-align: left; vertical-align: middle; }
.tpl-home .hm-mx thead th { position: sticky; top: 0; background: #f4efe6; font-size: 14px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--teal-deep); white-space: nowrap; }
.tpl-home .hm-mx thead th svg { width: 18px; height: 18px; margin-right: 6px; vertical-align: -3px; }
.tpl-home .hm-mx tbody th[scope="row"] { position: sticky; left: 0; background: #fff; min-width: 190px; font-size: 18px; z-index: 1; }
.tpl-home .hm-mx tbody th[scope="row"] a { color: var(--ink); font-weight: 800; text-decoration: none; }
.tpl-home .hm-mx tbody th[scope="row"] a:hover { text-decoration: underline; }
.tpl-home .hm-mx tbody th[scope="row"] span { display: block; font-size: 14px; font-weight: 500; color: var(--muted); }
.tpl-home .hm-mx td a { color: var(--ink-soft); font-weight: 700; text-decoration: none; white-space: nowrap; }
.tpl-home .hm-mx td a:hover { text-decoration: underline; }
.tpl-home .hm-mx .hm-mx-hot { background: #eaf3ee; }
.tpl-home .hm-mx .hm-mx-hot a { color: var(--green-money); }
.tpl-home .hm-mx .hm-mx-none { color: #b9b0a0; }
.tpl-home .hm-mx .hm-mx-grp th { position: static; background: #f9f6ef; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 22px; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--ink); }
.tpl-home .hm-mx .hm-mx-grp th span { margin-left: 8px; font: 500 15px 'Inter Tight', sans-serif; color: var(--muted); }
.tpl-home .hm-banner { padding: 0 0 8px; }
.tpl-home .hm-banner-in { display: flex; align-items: center; justify-content: space-between; gap: 20px 32px; padding: 26px clamp(22px, 3vw, 40px); border-radius: 26px; background: linear-gradient(135deg, var(--teal-deep), #0d4f5c); color: #fff; }
.tpl-home .hm-banner-in h2 { margin: 0 0 6px; color: #fff; font-size: clamp(24px, 2.6vw, 34px); }
.tpl-home .hm-banner-in p { margin: 0; max-width: 34em; font-size: 18px; color: rgba(255, 255, 255, .88); }
.tpl-home .hm-banner-in .hm-btn { flex: none; margin: 0; }
.tpl-home .hm-g-row { margin: 0 0 28px; }
.tpl-home .hm-tiles { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
@media (max-width: 760px) { .tpl-home .hm-banner-in { flex-direction: column; align-items: flex-start; } }
.tpl-home .hm-mx th, .tpl-home .hm-mx td { padding: 9px 14px; }
.tpl-home .hm-mx tbody th[scope="row"] { min-width: 250px; white-space: nowrap; }
.tpl-home .hm-mx tbody th[scope="row"] span { display: inline; margin-left: 8px; }
.tpl-home .hm-banner-in { box-sizing: border-box; }
@media (max-width: 760px) { .tpl-home .hm-banner-in { width: calc(100% - 40px); margin-left: auto; margin-right: auto; padding: 22px; } }
.tpl-home .hm-more { margin: 8px 0 22px; }
.tpl-home .hm-more .hm-links { margin-top: 6px; }
/* phones: rows that swipe instead of long stacks */
@media (max-width: 760px) {
  .tpl-home .hm-tiles, .tpl-home .hm-steps-photos { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 2px 2px 14px; margin-right: -20px; }
  .tpl-home .hm-tile { flex: 0 0 62vw; max-width: 260px; scroll-snap-align: start; }
  .tpl-home .hm-steps-photos li { flex: 0 0 76vw; max-width: 320px; scroll-snap-align: start; }
  .tpl-home .hm-steps-photos img { height: 150px; }
  .tpl-home .hm-ps-cols { gap: 10px; }
}
@media (min-width: 761px) { .tpl-home .hm-tiles { grid-template-columns: repeat(5, 1fr); } .tpl-home .hm-tile { aspect-ratio: 5 / 4; } }
@media (min-width: 761px) and (max-width: 1000px) { .tpl-home .hm-tiles { grid-template-columns: repeat(3, 1fr); } }

/* ===== template design: page (page.css) ===== */
/* tpl-page: older stand-alone pages (guides, tools, utility city pages, trackers). Each page still keeps its own variant CSS; these are
   only defaults that apply where the variant says nothing (zero specificity via :where), so a page's own rules always win. The one exception is the 48em text cap, which has to beat older p{max-width:none} rules; it skips hero, header and centred text. */
body.tpl-page { --page-gut: clamp(20px, 4vw, 40px); --page-col: 900px; }

/* text never runs the full width of a wide screen: about 70 characters a line */
body.tpl-page main :is(p, li, dd, blockquote):not(.hero *, header *, .cta *, .center, .centered, [class*="hero"] *, [style*="center"]) { max-width: 48em; }

/* a band whose headings, text and lists sit straight inside the section (no wrapper) gets one centred column and a side gutter,
   so nothing touches the screen edge on desktop and every block shares one left edge */
:where(body.tpl-page main > section:not(.hero)) > :where(:not(.wrap, .container, .inner, script, style)) { width: min(var(--page-col), 100% - 2 * var(--page-gut)); max-width: none; margin-left: auto; margin-right: auto; box-sizing: border-box; }

/* ===== template design: alertpage (alertpage.css) ===== */
/* alertpage: the federal heat pump alert landing page (/heat-pump-rebate-alert/, scripts/build_alert_page.py). Everything is scoped under .ap,
   so no other page is touched. Tokens come from the shared :root. Touch targets are 44px or more; text on dark has 7:1 or better; every link
   and button shows a 3px focus ring; motion stops for people who ask (the shared reduced-motion rule). Desktop first up to 1800px, one column on phones. */
/* this page carries no older inline CSS, so it sets the base type itself */
body:has(.ap) { margin: 0; font-family: 'Inter Tight', 'Inter Tight Fallback', system-ui, sans-serif; line-height: 1.5; color: var(--ink); background: var(--paper); -webkit-font-smoothing: antialiased; }
.ap { --ap-gut: clamp(20px, 4vw, 48px); --ap-max: 1240px; color: var(--ink); background: var(--paper); }
/* the article family narrows every direct child of <main> to a reading column; this page runs edge to edge */
body.tpl-article main > .ap:not(.hero):not(.post-header):not(.page-rail), body main > .ap { width: 100%; max-width: none !important; margin: 0 !important; padding: 0 !important; }
.ap > article { display: block; max-width: none; margin: 0; padding: 0; }
.ap *, .ap *::before, .ap *::after { box-sizing: border-box; }
.ap h1, .ap h2, .ap h3 { font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-weight: 600; letter-spacing: -.018em; text-wrap: balance; margin: 0; }
.ap :where(p, ul, ol, li) { margin: 0; padding: 0; }
.ap :where(ul, ol, li) { list-style: none; }
/* the page family caps text at 48em; this page sets its own measures */
.ap :where(p, li, dd) { max-width: none !important; }
.ap img { display: block; max-width: 100%; }
.ap-wrap { width: 100%; max-width: var(--ap-max); margin: 0 auto; padding-left: var(--ap-gut); padding-right: var(--ap-gut); }
.ap a:focus-visible, .ap button:focus-visible, .ap input:focus-visible, .ap select:focus-visible { outline: 3px solid var(--amber-bright); outline-offset: 3px; }

/* ---------- hero: photo, message on the left, sign-up panel on the right ---------- */
.ap-hero { position: relative; isolation: isolate; color: var(--paper); background: var(--teal-deep); overflow: hidden; }
.ap-hero-bg, .ap-hero-bg img { position: absolute; inset: 0; width: 100%; height: 100%; }
.ap-hero-bg, .ap-save-bg { z-index: -2; }
.ap-hero-bg img { object-fit: cover; object-position: 62% 60%; }
.ap-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(6, 44, 51, .97) 0%, rgba(8, 54, 63, .94) 38%, rgba(8, 54, 63, .62) 70%, rgba(8, 54, 63, .35) 100%); }
.ap-hero-in { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(340px, 440px); gap: clamp(28px, 5vw, 72px); align-items: center; padding-top: clamp(40px, 6vw, 80px); padding-bottom: clamp(40px, 6vw, 80px); }
.ap-hero-copy { display: flex; flex-direction: column; align-items: flex-start; gap: 22px; min-width: 0; }
.ap-badge { display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px 8px 12px; font-size: 15px; font-weight: 700; letter-spacing: .01em; color: #ffd9ad; background: rgba(232, 138, 46, .18); border: 1px solid rgba(247, 181, 111, .55); border-radius: 999px; }
.ap-badge-ico { width: 22px; height: 22px; flex: 0 0 auto; }
.ap h1 { font-size: clamp(36px, 4.6vw, 64px); line-height: 1.04; color: #fff; }
.ap h1 span { color: var(--amber-bright); }
.ap-lead { max-width: 34em !important; font-size: clamp(18px, 1.5vw, 21px); line-height: 1.55; color: rgba(250, 247, 242, .95); }
.ap-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; width: 100%; max-width: 640px; }
.ap-stat { color: var(--paper); display: flex; align-items: center; gap: 16px; padding: 18px 20px; background: rgba(250, 247, 242, .10); border: 1px solid rgba(250, 247, 242, .28); border-radius: 16px; backdrop-filter: blur(6px); }
.ap-stat.is-lead { background: rgba(250, 247, 242, .96); border-color: transparent; color: var(--ink); box-shadow: 0 14px 34px rgba(0, 0, 0, .25); }
.ap-stat-ico { width: 46px; height: 46px; flex: 0 0 auto; padding: 9px; color: var(--amber-bright); background: rgba(232, 138, 46, .16); border-radius: 12px; }
.ap-stat.is-lead .ap-stat-ico { color: #fff; background: var(--amber-text, #a4540a); }
.ap-stat-n { display: block; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(30px, 2.8vw, 40px); font-weight: 600; line-height: 1.02; letter-spacing: -.02em; font-variant-numeric: lining-nums tabular-nums; }
.ap-stat.is-lead .ap-stat-n { color: var(--amber-text, #a4540a); }
.ap-stat-n small { display: block; margin-bottom: 4px; font-family: 'Inter Tight', 'Inter Tight Fallback', system-ui, sans-serif; font-size: 14px; font-weight: 700; letter-spacing: .02em; opacity: .9; }
.ap-stat-l { display: block; margin-top: 4px; font-size: 15px; line-height: 1.35; opacity: .95; }
.ap-trust { display: flex; flex-wrap: wrap; gap: 10px 22px; }
.ap-trust li { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; color: rgba(250, 247, 242, .95); }
.ap-trust svg { width: 22px; height: 22px; flex: 0 0 auto; color: var(--amber-bright); }

/* the shared sign-up panel, sitting on the photo */
.ap .ap-panel { margin: 0; background: none; border: 0; box-shadow: none; overflow: visible; border-radius: 0; }
.ap .ap-panel .fed-alert-stub { position: static; padding: 28px 28px 24px; border: 1px solid rgba(250, 247, 242, .22); border-radius: 20px; box-shadow: 0 28px 60px rgba(0, 0, 0, .38); }
.ap .ap-panel .fed-alert-ask { font-size: 28px; }
.ap .ap-panel .fed-alert-form button { height: 58px; font-size: 18px; }
.ap .ap-panel .fed-alert-form button:focus-visible { outline-color: #fff; }

/* ---------- bands ---------- */
.ap-band { padding: clamp(48px, 7vw, 96px) 0; }
.ap-band-warm { background: var(--paper-warm); border-top: 1px solid var(--card-rule); border-bottom: 1px solid var(--card-rule); }
.ap-head { max-width: 46em; margin: 0 0 clamp(28px, 4vw, 44px); }
.ap-eyebrow { margin: 0 0 10px; font-size: 14px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--amber-text, #a4540a); }
.ap h2 { font-size: clamp(28px, 3.2vw, 44px); line-height: 1.1; color: var(--ink); }
.ap-head p:not(.ap-eyebrow), .ap-split-copy > p:not(.ap-eyebrow) { margin-top: 14px; font-size: 18px; line-height: 1.6; color: var(--ink-soft); }
.ap .ap-head p:not(.ap-eyebrow) { max-width: 40em !important; }

/* steps */
.ap-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2vw, 28px); counter-reset: ap; }
.ap-step { position: relative; display: flex; flex-direction: column; gap: 12px; padding: 30px 28px 28px; background: #fff; border: 1px solid var(--card-rule); border-radius: 20px; box-shadow: 0 10px 28px rgba(10, 42, 46, .07); }
.ap-step-n { position: absolute; top: 22px; right: 24px; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 56px; font-weight: 600; line-height: 1; color: rgba(13, 79, 92, .12); }
.ap-step-ico { width: 60px; height: 60px; padding: 14px; color: #fff; background: var(--teal); border-radius: 16px; }
.ap-step h3 { font-size: 24px; line-height: 1.15; }
.ap-step p { font-size: 17px; line-height: 1.5; color: var(--ink-soft); }
.ap-source { margin-top: 24px; font-size: 16px; color: var(--ink-soft); }
.ap .ap-link, .tpl-page main .ap .ap-link { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--amber-text, #a4540a); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.ap .ap-link:hover { color: #7a3d06; }
.ap-ext { width: 16px; height: 16px; flex: 0 0 auto; }

/* emails + video */
.ap-split { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.ap-cards { display: grid; gap: 14px; margin-top: 26px; }
.ap-card { display: grid; grid-template-columns: 52px 1fr; column-gap: 16px; align-items: start; padding: 18px 20px; background: #fff; border: 1px solid var(--card-rule); border-radius: 16px; }
.ap-card-ico { grid-row: 1 / span 2; width: 52px; height: 52px; padding: 12px; color: var(--teal); background: rgba(13, 79, 92, .09); border-radius: 14px; }
.ap-card h3 { font-family: 'Inter Tight', 'Inter Tight Fallback', system-ui, sans-serif; font-size: 18px; font-weight: 700; letter-spacing: 0; line-height: 1.3; }
.ap-card p { margin-top: 2px; font-size: 16px; line-height: 1.45; color: var(--ink-soft); }
.ap-split-media { display: flex; justify-content: center; }
.ap .yt-embed { display: flex; flex-direction: column; align-items: center; gap: 18px; width: 100%; max-width: 320px; margin: 0; padding: 18px; background: var(--ink); border: 0; border-radius: 24px; box-shadow: 0 24px 50px rgba(10, 42, 46, .28); }
.ap .yt-frame { width: 100%; max-width: 100%; border-radius: 16px; }
.ap .yt-text { width: 100%; color: var(--paper); }
.ap .yt-text p { color: rgba(250, 247, 242, .92); font-size: 15px; line-height: 1.5; }
.ap .yt-text .yt-h { font-size: 19px; color: #fff; }
.ap .yt-links { gap: 10px; }
.ap .yt-links a, .tpl-page main .ap .yt-links a { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 20px; font-size: 16px; font-weight: 700; line-height: 1; text-decoration: none; border-radius: 10px; }
.ap .yt-links a:first-child, .tpl-page main .ap .yt-links a:first-child { color: var(--ink); background: var(--amber-bright); }
.ap .yt-links a:first-child:hover { background: #f09a44; }
.ap .yt-links a:last-child, .tpl-page main .ap .yt-links a:last-child { color: #fff; background: transparent; box-shadow: inset 0 0 0 2px rgba(250, 247, 242, .7); }
.ap .yt-links a:last-child:hover { background: rgba(250, 247, 242, .14); }

/* savings: photo band with one card */
.ap-save { position: relative; isolation: isolate; color: var(--paper); background: var(--teal-deep); overflow: hidden; }
.ap-save-bg, .ap-save-bg img { position: absolute; inset: 0; width: 100%; height: 100%; }
.ap-save-bg img { object-fit: cover; }
.ap-save::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(6, 44, 51, .95) 0%, rgba(8, 54, 63, .86) 50%, rgba(8, 54, 63, .5) 100%); }
.ap-save-in { padding-top: clamp(56px, 8vw, 110px); padding-bottom: clamp(56px, 8vw, 110px); }
.ap-save-card { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; max-width: 640px; }
.ap-save-ico { width: 64px; height: 64px; padding: 14px; color: var(--amber-bright); background: rgba(232, 138, 46, .18); border-radius: 18px; }
.ap-save-n { font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: clamp(64px, 8vw, 112px); font-weight: 600; line-height: .95; letter-spacing: -.03em; color: var(--amber-bright); font-variant-numeric: lining-nums; }
.ap-save-n span { font-size: .34em; letter-spacing: 0; color: var(--paper); }
.ap .ap-save h2 { color: #fff; }
.ap-save p:not(.ap-save-n) { font-size: 19px; line-height: 1.6; color: rgba(250, 247, 242, .95); }
.ap .ap-btn, .tpl-page main .ap .ap-btn { display: inline-flex; align-items: center; gap: 10px; min-height: 56px; padding: 0 26px; font-size: 18px; font-weight: 700; text-decoration: none; border-radius: 12px; transition: background-color .2s, transform .2s; }
.ap .ap-btn-solid, .tpl-page main .ap .ap-btn-solid { color: var(--ink); background: var(--amber-bright); box-shadow: 0 10px 24px rgba(0, 0, 0, .3); }
.ap .ap-btn-solid:hover { background: #f09a44; transform: translateY(-1px); }
.ap-btn-ico { width: 22px; height: 22px; }

/* provinces */
.ap-provs { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.ap-prov, .tpl-page main .ap a.ap-prov { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px 12px; min-height: 84px; padding: 16px 20px; color: var(--ink); text-decoration: none; background: #fff; border: 1px solid var(--card-rule); border-radius: 16px; transition: border-color .2s, box-shadow .2s, transform .2s; }
.ap-prov:hover { border-color: var(--teal); box-shadow: 0 12px 26px rgba(10, 42, 46, .12); transform: translateY(-2px); }
.ap-prov-name { grid-column: 1; font-size: 17px; font-weight: 700; line-height: 1.25; }
.ap-prov-amt { grid-column: 1; font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif; font-size: 26px; font-weight: 600; line-height: 1.1; color: var(--green-money); font-variant-numeric: lining-nums tabular-nums; }
.ap-prov-go { grid-column: 2; grid-row: 1 / span 2; width: 24px; height: 24px; color: var(--teal); transition: transform .2s; }
.ap-prov:hover .ap-prov-go { transform: translateX(3px); }

/* who we are + next steps */
.ap-about { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.ap-about-copy p:not(.ap-eyebrow) { margin-top: 14px; font-size: 18px; line-height: 1.6; color: var(--ink-soft); max-width: 36em !important; }
.ap-next { display: grid; gap: 14px; }
.ap-next-card, .tpl-page main .ap a.ap-next-card { display: grid; grid-template-columns: 52px 1fr; column-gap: 16px; align-items: center; min-height: 92px; padding: 18px 22px; color: var(--ink); text-decoration: none; background: #fff; border: 1px solid var(--card-rule); border-radius: 16px; box-shadow: 0 8px 22px rgba(10, 42, 46, .06); transition: border-color .2s, box-shadow .2s, transform .2s; }
.ap-next-card:hover { border-color: var(--teal); box-shadow: 0 14px 30px rgba(10, 42, 46, .13); transform: translateY(-2px); }
.ap-next-card b { grid-column: 2; font-size: 18px; line-height: 1.3; }
.ap-next-card span { grid-column: 2; display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 15px; color: var(--ink-soft); }
.ap-next-card .ap-card-ico { grid-row: 1 / span 2; }
.ap-next-card .ap-prov-go { grid-row: auto; }

/* ---------- narrower screens ---------- */
@media (max-width: 1020px) {
  .ap-hero-in { grid-template-columns: minmax(0, 1fr); }
  .ap-hero::before { background: linear-gradient(180deg, rgba(6, 44, 51, .96) 0%, rgba(8, 54, 63, .9) 60%, rgba(8, 54, 63, .8) 100%); }
  .ap .ap-panel .fed-alert-stub { max-width: 560px; }
  .ap-split, .ap-about { grid-template-columns: minmax(0, 1fr); }
  .ap-split-media { justify-content: flex-start; }
}
@media (max-width: 760px) {
  .ap-steps { grid-template-columns: minmax(0, 1fr); }
  .ap-stats { grid-template-columns: minmax(0, 1fr); }
  .ap-step { padding: 24px 22px; }
  .ap .ap-panel .fed-alert-stub { padding: 22px 18px 20px; }
  .ap-provs { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 1800px) {
  .ap { --ap-max: 1480px; }
}

