/* Program pages (zero-down, FHA). Loaded after site.css, program-hub.css and r4/programs.css.
   Palette: navy, white, slate, gold, tint. Square corners, Archivo + Source Serif. */

/* hero: answer first, figures card beside it */
.pp-hero .g75{align-items:start}
.pp-answer{font-size:19px;line-height:1.6;color:var(--body);max-width:640px;margin-top:22px}
.pp-fig{background:var(--navy);color:#fff;padding:24px 26px 20px;border-top:3px solid var(--gold)}
.pp-fig .lab{color:var(--gold);margin-bottom:6px}
.pp-fig dl{margin:0}
.pp-fig dl>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:baseline;padding:13px 0;border-top:1px solid rgba(255,255,255,.16)}
.pp-fig dl>div:first-child{border-top:0}
.pp-fig dt{font-size:14.5px;color:#DEE0E4;line-height:1.4}
.pp-fig dt b{display:block;color:#fff;font-size:16px;font-weight:600;margin-bottom:2px}
.pp-fig dd{margin:0;font:400 26px/1 'Source Serif 4',Georgia,serif;color:#fff;white-space:nowrap;text-align:right}
.pp-fig .fine{color:var(--mist);margin-top:12px;font-size:13px;line-height:1.5}


/* pinned chapter bar: same as the city guides (city.js + pinned-jump.js drive it) */
/* ---------- Pinned chapter bar (same pattern as the VA proposal) ---------- */
.lv-tabs{position:sticky;top:0;z-index:30;background:var(--navy);border-bottom:2px solid var(--gold);transition:top .28s cubic-bezier(.2,.8,.2,1)}
.lv-tabs .w{display:flex;align-items:stretch;gap:12px}
.lv-tabs-in{flex:1;min-width:0;display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.lv-tabs-in::-webkit-scrollbar{display:none}
.lv-tabs-in a{flex:none;display:flex;align-items:center;min-height:48px;padding:0 14px;font:600 14px Archivo,sans-serif;color:#C7CAD0;text-decoration:none;white-space:nowrap;border-bottom:3px solid transparent;margin-bottom:-2px;transition:color .2s,border-color .2s}
.lv-tabs-in a:first-child{padding-left:0}
.lv-tabs-in a:hover{color:#fff}
.lv-tabs-in a[aria-current=true]{color:#fff;border-bottom-color:var(--gold)}
.lv-tabs a:focus-visible{outline:2px solid var(--gold);outline-offset:-4px}
.lv-tabs-map{flex:none;align-self:center;display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 12px;margin-left:auto;background:var(--gold);color:var(--navy);font:600 13px Archivo,sans-serif;text-decoration:none;border-radius:2px;box-shadow:-14px 0 14px var(--navy)}
.lv-tabs-map svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* body sections */
.pp-sec{padding:72px 0}
.pp-sec h2{margin:14px 0 0;font-size:clamp(28px,3vw,40px);line-height:1.18}
.pp-sec .cols{margin-top:30px;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:start}
.pp-sec .specs{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.pp-sec .specs{margin-top:30px}
.pp-sec .stack .p+.p{margin-top:16px}
.pp-sec .acts{margin-top:26px;display:flex;flex-wrap:wrap;gap:12px}
.pp-list{margin:18px 0 0;padding:0;list-style:none;border-top:1px solid var(--rule)}
.pp-list li{padding:14px 0 14px 26px;border-bottom:1px solid var(--rule);position:relative;line-height:1.55;color:var(--body)}
.pp-list li::before{content:"";position:absolute;left:2px;top:23px;width:12px;height:2px;background:var(--gold)}
.pp-list b{color:var(--navy)}
.sec.tint .know,.pp-sec.tint .know{background:#fff}

/* installations */
.pp-bases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:32px}
.pp-base{background:#fff;border:1px solid var(--rule);border-top:2px solid var(--navy);padding:20px 22px;display:flex;flex-direction:column;gap:8px}
.pp-base h3{margin:0;font:600 18px/1.3 Archivo,sans-serif;color:var(--navy)}
.pp-base .br{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--slate)}
.pp-base p{margin:0;font-size:15px;line-height:1.55;color:var(--body)}
.pp-base .co{margin-top:auto;padding-top:10px;border-top:1px solid var(--rule);font-size:13.5px;color:var(--slate)}
.pp-limits{margin-top:28px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;background:var(--navy);color:#fff}
.pp-limits>div{padding:20px 22px;border-left:1px solid rgba(255,255,255,.16)}
.pp-limits>div:first-child{border-left:0}
.pp-limits .lab{color:var(--gold);margin-bottom:8px}
.pp-limits .v{font:400 28px/1.1 'Source Serif 4',Georgia,serif}
.pp-limits p{margin:8px 0 0;font-size:14px;line-height:1.5;color:#DEE0E4}

/* county limit table (FHA) */
.pp-table{width:100%;min-width:0;border-collapse:collapse;margin-top:28px;background:#fff;font-size:15px}
.pp-table th,.pp-table td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--rule);vertical-align:top}
.pp-table thead th{background:var(--navy);color:#fff;font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:600}
.pp-table td:last-child,.pp-table th:last-child{text-align:right;white-space:nowrap;font-weight:700}
.pp-table td:first-child{font-weight:600;color:var(--navy);white-space:normal}

/* worked example */
.pp-calc{margin-top:32px;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:0;border:1px solid rgba(255,255,255,.18)}
.pp-in{padding:24px;border-right:1px solid rgba(255,255,255,.18);display:flex;flex-direction:column;gap:18px}
.pp-in label{display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--mist)}
.pp-in input,.pp-in select{font:600 18px Archivo,sans-serif;color:var(--navy);background:#fff;border:0;border-radius:0;padding:12px 14px;width:100%;min-height:48px}
.pp-in input:focus-visible,.pp-in select:focus-visible{outline:3px solid var(--gold);outline-offset:0}
.pp-in .fine{font-size:13px;line-height:1.5;color:var(--mist);letter-spacing:0;text-transform:none;font-weight:400}
.pp-out{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.pp-col{padding:24px;border-left:1px solid rgba(255,255,255,.18)}
.pp-col:first-child{border-left:0}
.pp-col h3{margin:0 0 4px;font:400 26px/1.15 'Source Serif 4',Georgia,serif;color:#fff}
.pp-col .sub{font-size:13.5px;color:var(--mist);margin:0 0 12px}
.pp-col dl{margin:0}
.pp-col dl>div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid rgba(255,255,255,.14);font-size:14.5px;color:#DEE0E4}
.pp-col dd{margin:0;font-weight:700;color:#fff;white-space:nowrap;text-align:right}
.pp-col .tot{border-top:2px solid var(--gold)!important;padding-top:12px!important;margin-top:4px}
.pp-col .tot dt{color:#fff;font-weight:600}
.pp-col .tot dd{font:400 26px/1 'Source Serif 4',Georgia,serif}
.pp-col .pp-note{margin:12px 0 0;font-size:13.5px;line-height:1.5;color:var(--mist)}
.pp-col .pp-note b{color:#fff}
.pp-calc-note{margin-top:16px;font-size:13.5px;line-height:1.55;color:var(--mist);max-width:860px}
.pp-flag{display:block;margin-top:10px;padding:10px 12px;background:rgba(212,175,55,.14);border-left:3px solid var(--gold);color:#fff;font-size:13.5px;line-height:1.45}
.pp-flag[hidden]{display:none}

/* next step strip */
.pp-next{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:28px}
.pp-next a{display:flex;flex-direction:column;gap:6px;padding:20px 22px;background:#fff;border:1px solid var(--rule);text-decoration:none;color:var(--navy);transition:border-color .2s,transform .2s}
.pp-next a:hover{border-color:var(--navy);transform:translateY(-2px)}
.pp-next b{font-size:17px}
.pp-next span{font-size:14.5px;line-height:1.5;color:var(--body)}

@media (max-width:1000px){
  .pp-sec .cols{grid-template-columns:1fr;gap:28px}
  .pp-bases{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pp-calc{grid-template-columns:1fr}
  .pp-in{border-right:0;border-bottom:1px solid rgba(255,255,255,.18);display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
  .pp-in .fine{grid-column:1/-1}
}
@media (max-width:700px){
  .pp-sec{padding:48px 0}
  .pp-answer{font-size:17px}
  .pp-fig{margin-top:8px}
  .pp-bases,.pp-limits,.pp-next{grid-template-columns:1fr}
  .pp-limits>div{border-left:0;border-top:1px solid rgba(255,255,255,.16)}
  .pp-limits>div:first-child{border-top:0}
  .pp-out{grid-template-columns:1fr}
  .pp-col{border-left:0;border-top:1px solid rgba(255,255,255,.18)}
  .pp-col:first-child{border-top:0}
  .pp-in{grid-template-columns:1fr}
  .pp-table{font-size:14px}
  .pp-table th,.pp-table td{padding:12px 10px}
}
@media (prefers-reduced-motion:reduce){.pp-next a{transition:none}.pp-next a:hover{transform:none}}
@media (max-width:700px){
  .pp-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .pp-table,.pp-table tbody{display:block;width:100%}
  .pp-table td{display:block;min-width:0;white-space:normal}
  .pp-table tr{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;padding:12px 14px;border-bottom:1px solid var(--rule)}
  .pp-table td{border:0;padding:0}
  .pp-table td:first-child{grid-column:1;grid-row:1}
  .pp-table td:last-child{grid-column:2;grid-row:1 / span 2;align-self:center}
  .pp-table td:nth-child(2){grid-column:1;grid-row:2;font-size:13.5px;color:var(--slate);margin-top:2px}
}
.cols .pp-next{grid-template-columns:1fr;margin-top:0}
