/* Path page layout (buy). Shared look for all path pages; page-specific classes use the buy- prefix. */
main > section[id]{scroll-margin-top:calc(var(--hdr) - 1px)}
.buy-sec{padding:clamp(44px,5.5vw,76px) 0}
.buy-row{display:grid;grid-template-columns:minmax(230px,290px) minmax(0,1fr);gap:clamp(24px,4vw,60px);align-items:start}
.buy-row.mid{align-items:center}
.buy-hd .h2{font-size:clamp(32px,3.3vw,44px)}
.buy-hd .rule{margin:16px 0 14px}
.buy-hd p{margin:0 0 10px;max-width:34ch}
.buy-hd .fine{max-width:36ch}
.buy-hd-p{color:var(--on-navy-2);font-size:15px;line-height:1.55}
.buy-hd.sticky{position:sticky;top:calc(var(--hdr) + 28px)}
.band-paper{background:var(--paper);color:var(--ink)}
.buy-card{background:var(--paper);border:1px solid var(--ivory-3);border-radius:var(--r-lg);padding:clamp(18px,2.2vw,28px);box-shadow:var(--sh-1);color:var(--ink);min-width:0}
.band-ivory .buy-card{background:#fff}
.buy-card-h{font:600 24px/1.15 var(--serif);margin:0 0 14px}
.buy-card .eyebrow{margin:0 0 14px}

/* hero */
.buy-hero{padding:clamp(40px,6vw,88px) 0 clamp(36px,4.5vw,56px)}
.buy-hero .bg{left:auto;width:62%;opacity:.95;background-position:center 40%}
.buy-hero::before{background:linear-gradient(90deg,var(--navy-3) 36%,rgba(11,23,38,.82) 52%,rgba(11,23,38,.35) 78%,rgba(11,23,38,.2))}
.buy-hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:40px;align-items:end}
.buy-hero .h-display{font-size:clamp(40px,4.6vw,64px);max-width:16ch;margin:0}
.buy-hero .lead{max-width:50ch;color:var(--on-navy-2);margin:20px 0 0}
.buy-eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 18px;font:600 15px/1 var(--sans);color:var(--on-navy)}
.buy-eyebrow::after{content:"";width:56px;height:1px;background:var(--gold)}
.buy-num{width:34px;height:34px;border-radius:50%;border:1px solid var(--gold);display:grid;place-items:center;font:600 14px/1 var(--serif);color:var(--gold)}
.buy-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.buy-hero .btn-outline{background:rgba(11,23,38,.5)}
.buy-hsteps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:rgba(11,23,38,.78);border:1px solid var(--navy-line);border-radius:var(--r);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);align-self:end}
.buy-hsteps li + li{border-left:1px solid var(--navy-line)}
.buy-hsteps a{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;gap:6px 10px;padding:16px 16px 18px;height:100%;border-radius:var(--r);transition:background .2s}
.buy-hsteps a:hover{background:rgba(201,169,110,.08)}
.buy-hsteps .n{width:26px;height:26px;border-radius:50%;border:1px solid var(--gold);display:grid;place-items:center;font:600 12px/1 var(--serif);color:var(--gold)}
.buy-hsteps .ic svg{width:26px;height:26px;color:var(--gold)}
.buy-hsteps .tx{grid-column:1/-1}
.buy-hsteps b{display:block;font-size:14px;color:var(--on-navy)}
.buy-hsteps small{display:block;font-size:12.5px;line-height:1.4;color:var(--on-navy-3);margin-top:3px}

/* start here: guide cards */
.buy-guides{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.buy-guide{display:grid;grid-template-columns:92px minmax(0,1fr) 16px;gap:14px;align-items:center;padding:10px 14px 10px 10px;background:#fff;border:1px solid var(--ivory-3);border-radius:var(--r);text-align:left;box-shadow:var(--sh-1);transition:transform .2s,border-color .2s}
.buy-guide:hover{transform:translateY(-2px);border-color:var(--gold)}
.buy-guide .th{width:92px;height:96px;border-radius:6px;background-size:cover;background-position:center;background-color:var(--navy-3)}
.buy-guide .tx{display:flex;flex-direction:column;gap:5px;min-width:0}
.buy-guide .tag{align-self:flex-start}
.buy-guide b{font:600 19px/1.15 var(--serif);color:var(--ink)}
.buy-guide small{font-size:12.5px;line-height:1.4;color:var(--ink-3)}
.buy-guide .go svg{width:16px;height:16px;color:var(--gold-3)}

/* inline tool band */
.buy-tool .inline-tool{box-shadow:var(--sh-2);min-width:0}
.buy-tool .fine{color:var(--on-navy-3)}

/* down payment band */
.buy-dpa-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,56px);align-items:center;padding-top:clamp(40px,5vw,64px);padding-bottom:clamp(40px,5vw,64px)}
.buy-dpa .dpa-note{font-size:13.5px;line-height:1.55;color:var(--on-navy-2)}
.buy-dpa .dpa-note .src{color:var(--on-navy-3)}
.buy-dpa .dpa-note a{color:var(--gold)}
.buy-dpa .link{margin-top:12px}
.buy-dpa-card{background:var(--paper)}
.buy-dpa.has-result .buy-dpa-grid{grid-template-columns:1fr;align-items:start}
.buy-dpa.has-result .dpa-num{font-size:clamp(40px,5vw,64px)}

/* quiz card */
.buy-quizcard{min-height:260px}

/* timeline (tablist) */
.buy-tl{display:grid;grid-template-columns:repeat(var(--n,6),minmax(0,1fr));position:relative;margin-bottom:18px}
.buy-tl::before{content:"";position:absolute;left:calc(100% / var(--n,6) / 2);right:calc(100% / var(--n,6) / 2);top:22px;height:1px;background:var(--gold);opacity:.6}
.buy-tl-step{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;padding:0 4px 10px;text-align:center;border-radius:var(--r);color:var(--ink-2)}
.buy-tl-step .n{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--gold);background:var(--paper);display:grid;place-items:center;font:600 16px/1 var(--serif);color:var(--gold-3);transition:all .2s}
.band-navy .buy-tl-step .n{background:var(--navy)}
.buy-tl-step .ic svg{width:24px;height:24px;color:var(--navy)}
.band-navy .buy-tl-step .ic svg{color:var(--gold)}
.buy-tl-step b{font-size:13.5px;line-height:1.25;font-weight:600}
.buy-tl-step small{font-size:11.5px;color:var(--ink-3);margin-top:-6px}
.band-navy .buy-tl-step{color:var(--on-navy-2)} .band-navy .buy-tl-step small{color:var(--on-navy-3)}
.buy-tl-step.is-done .n{background:var(--gold-soft)}
.buy-tl-step[aria-selected="true"] .n{background:var(--gold);color:var(--navy-3);border-color:var(--gold);box-shadow:0 0 0 5px var(--gold-soft)}
.buy-tl-step[aria-selected="true"] b{color:var(--ink)}
.band-navy .buy-tl-step[aria-selected="true"] b{color:var(--on-navy)}
.buy-tl-step:hover .n{border-color:var(--navy)}
.buy-tl-panel{background:#fff;border:1px solid var(--ivory-3);border-left:3px solid var(--gold);border-radius:var(--r);padding:18px 22px;color:var(--ink)}
.band-navy .buy-tl-panel{background:var(--navy-2);border-color:var(--navy-line);border-left-color:var(--gold);color:var(--on-navy)}
.buy-tl-panel h3{font:600 26px/1.15 var(--serif);margin:8px 0 6px}
.buy-tl-panel p{margin:0 0 14px;max-width:78ch;color:var(--ink-2);font-size:15px;line-height:1.6}
.band-navy .buy-tl-panel p{color:var(--on-navy-2)}
.buy-tl-panel .chip svg{color:var(--gold-3)}

/* what changed: expandable cards on navy */
.buy-changes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:start}
.buy-chg{border:1px solid var(--navy-line);border-radius:var(--r);background:rgba(255,255,255,.02)}
.buy-chg .hd{width:100%;display:grid;grid-template-columns:48px minmax(0,1fr) 18px;gap:14px;align-items:center;padding:16px;text-align:left;color:var(--on-navy)}
.buy-chg .ic{width:48px;height:48px;border-radius:50%;border:1px solid var(--gold);display:grid;place-items:center}
.buy-chg .ic svg{width:22px;height:22px;color:var(--gold)}
.buy-chg b{display:block;font-size:15px;line-height:1.3}
.buy-chg small{display:block;font-size:13px;color:var(--on-navy-3);margin-top:3px}
.buy-chg .pm svg{width:16px;height:16px;color:var(--gold)}
.buy-chg .hd:hover{background:rgba(201,169,110,.06)}
.buy-chg .more{padding:0 16px 16px 78px;font-size:14px;line-height:1.55;color:var(--on-navy-2)}
.buy-chg .more p{margin:0 0 8px}
.buy-chg .more a{color:var(--gold)}

/* loan limits */
.buy-limits{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
.buy-limits .tbl td,.buy-limits .tbl th{padding:11px 14px}
.buy-limits .tbl tbody th{font:600 14px/1.2 var(--sans);letter-spacing:0;text-transform:none;color:var(--ink)}
.buy-limits .tbl td.num{font:700 15.5px/1.2 var(--sans);font-variant-numeric:tabular-nums lining-nums;color:var(--navy)}
.buy-limsrc{margin:0}
.buy-limcheck{grid-row:span 2}
.buy-allcard{border-style:dashed!important}
.buy-limcheck{display:flex;flex-direction:column;gap:12px}
.buy-limcheck .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.buy-limcheck .lbl{display:block;font:600 12.5px/1.2 var(--sans);color:var(--ink-2);margin-bottom:6px}
.buy-limcheck .seg{flex-wrap:wrap}
.buy-limcheck .card-h,.buy-limcheck h3{margin:0}
.buy-verdict{display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:start;padding:12px 14px;border-radius:var(--r);background:rgba(94,140,106,.12)}
.buy-verdict.over{background:rgba(192,138,62,.14)}
.buy-verdict .ic{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--ok);color:#fff}
.buy-verdict.over .ic{background:var(--warn)}
.buy-verdict .ic svg{width:16px;height:16px}
.buy-verdict b{display:block;font:600 20px/1.2 var(--serif)}
.buy-verdict span{display:block;font-size:13.5px;color:var(--ink-2);line-height:1.5}

/* more tools */
.buy-toolgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.buy-toolgrid .tool-card{grid-template-columns:1fr 16px;grid-template-rows:auto 1fr;align-items:start;gap:12px 8px;padding:16px;min-height:150px}
.buy-toolgrid .tool-card .tc-ic{grid-column:1;width:40px;height:40px}
.buy-toolgrid .tool-card .tc-go{grid-column:2;grid-row:1;align-self:center}
.buy-toolgrid .tool-card > span:nth-child(2){grid-column:1/-1}
.buy-toolgrid .tool-card small{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* proof on ivory */
.buy-proof{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:stretch}
.buy-proof-more{margin-top:12px}
.buy-proof .review{background:#fff;border-color:var(--ivory-3);box-shadow:var(--sh-1);min-height:0}
.buy-proof .review q{color:var(--ink);font-size:15px}
.buy-proof .review .nm{color:var(--ink)}
.buy-proof .review .meta{color:var(--ink-3)}
.buy-proof .review .ini{color:var(--navy-3)}
.buy-proof .review .link{color:var(--gold-3)}
.buy-proof .sold-card{box-shadow:var(--sh-1)}
.buy-proof-ft{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-top:14px}
.buy-proof-ft .fine{margin:0;max-width:70ch}
.buy-rating{margin:6px 0 0}
.buy-rating .link{color:var(--gold-3)}

/* workshop */
.buy-ws-p{max-width:62ch;color:var(--on-navy-2);margin:0 0 14px;font-size:15px;line-height:1.55}
.buy-ws-also p{margin:0 0 6px;font-size:13.5px;color:var(--on-navy-2)}
.buy-ws-also b{color:var(--on-navy)}
.buy-ws-also .link{color:var(--gold)}
.buy-ws .ws-actions .btn-outline{background:rgba(11,23,38,.78)}

/* FAQ in two columns */
.buy-faq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 32px;align-items:start}
.buy-faq .faq-q{font-size:19px}
.buy-faq .faq-a{font-size:14.5px;line-height:1.6}
.buy-faq .faq-a .link{color:var(--gold-3);display:inline;font-weight:600}

/* contact */
#contact .title-line .h2{font-size:clamp(30px,3.2vw,42px)}
#contact .title-line::after{display:none}


/* light islands inside dark bands (inline tools and cards behave as they do in a modal) */
:is(.band-navy,.dpa,.workshop) :is(.inline-tool,.buy-card) :is(.fine,.muted,.srcs){color:var(--ink-3)}
:is(.band-navy,.dpa,.workshop) :is(.inline-tool,.buy-card) :is(.link,.eyebrow,.tag){color:var(--gold-3)}
:is(.band-navy,.dpa,.workshop) :is(.inline-tool,.buy-card) .chip{background:#fff;border-color:var(--ivory-3);color:var(--ink-2)}
:is(.band-navy,.dpa,.workshop) :is(.inline-tool,.buy-card) :is(.chip.is-on,.chip[aria-pressed="true"]){background:var(--navy);border-color:var(--navy);color:var(--ivory)}
:is(.band-navy,.dpa,.workshop) :is(.inline-tool,.buy-card) .btn-outline{color:var(--navy);border-color:var(--navy)}
:is(.band-navy,.dpa,.workshop) :is(.inline-tool,.buy-card) :is(.res-hd,.kpi:not(.light):not(.gold)) :is(.fine,.muted){color:var(--on-navy-3)}
:is(.band-navy,.dpa,.workshop) :is(.inline-tool,.buy-card) .res-hd .eyebrow{color:var(--gold)}
@media (min-width:901px){.buy-tool .tw-in{top:calc(var(--hdr) + 16px)} .buy-tool .tw-in.ta-in{max-height:calc(100vh - var(--hdr) - 32px)}}
/* numerals: lining sans in small circles and tables */
.buy-num,.buy-hsteps .n,.buy-tl-step .n{font-family:var(--sans);font-weight:700}
.buy-num{font-size:12.5px}.buy-hsteps .n{font-size:11.5px}.buy-tl-step .n{font-size:15px}
@media (min-width:901px){#start .buy-row{grid-template-columns:minmax(170px,210px) minmax(0,1fr)}}
@media (min-width:1181px){.buy-guide{grid-template-columns:1fr;padding:0;overflow:hidden;align-items:stretch;align-self:stretch}.buy-guide .th{width:100%;height:118px;border-radius:0}.buy-guide .tx{padding:14px 18px 18px}.buy-guide .go{display:none}.buy-guide b{font-size:21px}}
.buy-proof[hidden]{display:none}

/* responsive */
@media (max-width:1180px){.buy-guides{grid-template-columns:1fr}.buy-changes{grid-template-columns:1fr}.buy-proof{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:1060px){.buy-hero-grid{grid-template-columns:1fr}.buy-hsteps{max-width:640px}.buy-limits{grid-template-columns:1fr}}
@media (max-width:900px){
  .buy-row{grid-template-columns:1fr;gap:22px}
  .buy-hd.sticky{position:static}
  .buy-hd p,.buy-hd .fine{max-width:62ch}
  .buy-dpa-grid{grid-template-columns:1fr}
  .buy-faq{grid-template-columns:1fr}
}
@media (max-width:760px){
  .buy-hero .bg{width:100%;opacity:.4}
  .buy-hero::before{background:linear-gradient(180deg,rgba(11,23,38,.75),rgba(11,23,38,.92))}
  .buy-hsteps{grid-template-columns:1fr}
  .buy-hsteps li + li{border-left:0;border-top:1px solid var(--navy-line)}
  .buy-hsteps a{grid-template-columns:auto auto 1fr;align-items:center;padding:12px 14px}
  .buy-hsteps .tx{grid-column:auto}
  .buy-hsteps .ic svg{width:22px;height:22px}
  .buy-ctas .btn{flex:1 1 100%}
  .buy-tl{grid-template-columns:1fr;gap:4px}
  .buy-tl::before{left:22px;right:auto;top:22px;bottom:22px;width:1px;height:auto}
  .buy-tl-step{flex-direction:row;text-align:left;gap:12px;padding:4px 0}
  .buy-tl-step .ic{display:none}
  .buy-tl-step small{margin:0}
  .buy-tl-panel{padding:16px}
  .buy-chg .more{padding-left:16px}
  .buy-proof{grid-template-columns:1fr}
  .buy-limcheck .row{grid-template-columns:1fr}
  .buy-guide{grid-template-columns:76px minmax(0,1fr) 16px}
  .buy-guide .th{width:76px;height:84px}
  .buy-faq .faq-q{font-size:18px}
  .buy-toolgrid{grid-template-columns:1fr}
  .buy-toolgrid .tool-card{grid-template-columns:44px minmax(0,1fr) 16px;grid-template-rows:auto;align-items:center;min-height:0;padding:14px}
  .buy-toolgrid .tool-card .tc-ic{grid-column:1;grid-row:1}
  .buy-toolgrid .tool-card > span:nth-child(2){grid-column:2;grid-row:1}
  .buy-toolgrid .tool-card .tc-go{grid-column:3;grid-row:1}
  .buy-proof .sold-card{flex-direction:row;align-items:stretch}
  .buy-proof .sold-card .art{width:44%;aspect-ratio:auto;flex:none}
  .buy-proof .sold-card .tx{display:flex;flex-direction:column;justify-content:center;padding:12px 14px}
}

/* QA: below 1181px the side copy column squeezed the two-pane mortgage tool (results column fell to 63px at 901px); stack the band so the tool keeps its full width */
@media (max-width:1180px){.buy-tool .buy-row{grid-template-columns:1fr;gap:22px}}
/* QA: the loan balance chart renders at about half its 640 viewBox width in the side-by-side layout; enlarge its labels so they stay legible */
@media (min-width:1181px){.buy-tool .ta-chart .chart text{font-size:19px}}
