/* BankPricer illustration-led presentation. No calculation or visibility state rules.
   Retain licensed production DM Sans / Source Serif 4 stack and system fallbacks.
   Illustrations are original BankPricer preview SVGs, never loan offers. */
body[data-bp-family] {
  --ink: #0f2240;
  --ink-2: #465561;
  --ink-3: #596770;
  --ink-4: #596770;
  --rule: #d9dfdb;
  --paper-sunk: #eef2ef;
  --navy-tint: #edf2ef;
  --r-md: 8px;
  --r-lg: 14px;
  --bp-sage: #335e50;
  --bp-art: url('/assets/illustrations/home.svg');
  color-scheme: only light;
  font-optical-sizing: auto;
}
body[data-bp-family="review"], body[data-bp-family="article"], body[data-bp-family="journal"], body[data-bp-family="guide"] {
  --bp-art: url('/assets/illustrations/review.svg');
}
body[data-bp-family="calculator"] { --bp-art: url('/assets/illustrations/budget.svg'); }
/* Keep the existing warning and cost-increase meanings at small text sizes.
   style.color serializes the UI's #dc2626 as rgb(), so the legacy hex-only
   attribute selector could not darken this result after recalculation. */
body[data-bp-family="calculator"] { --flag: #715410; --warning: var(--flag); }
body[data-bp-family="calculator"] #co-monthly-change[style*="220, 38, 38"] { color: #9b3a22 !important; }
body[data-bp-family] h1 { color: var(--navy); font-weight: 400; letter-spacing: -.035em; line-height: 1.08; }
body[data-bp-family] h2 { color: var(--navy); font-weight: 400; letter-spacing: -.025em; line-height: 1.18; }
body[data-bp-family] .eyebrow { color: var(--bp-sage); letter-spacing: .12em; }
body[data-bp-family] :is(a,button,input,select,textarea,summary):focus-visible { outline: 3px solid #975f2b; outline-offset: 4px; }
body[data-bp-family] :is(.btn,.choice,summary,.sidebar-link) { min-height: 44px; }
body[data-bp-family] .btn { border-radius: 7px; }
body[data-bp-family] .btn-primary { color: #fff; }
body[data-bp-family] .hero-quick-nav { display: flex; flex-wrap: wrap; gap: .5rem 1rem; margin-block: 1.25rem; }
body[data-bp-family] .hero-quick-nav a { display: inline-flex; align-items: center; min-height: 44px; }
body[data-bp-family] .btn:active { transform: translateY(1px); }
body[data-bp-family] :is(.card,.callout,.featured-post) { border-radius: var(--r-lg); }
body[data-bp-family] .footer { margin-top: 3rem; background: #eef2ef; }
/* A consistent illustration header, scoped away from legacy protected body layouts. */
body:is([data-bp-family="program"],[data-bp-family="location"],[data-bp-family="guide"],[data-bp-family="journal"]) #main .article-header:first-of-type {
  position: relative;
  min-height: 19rem;
  padding-block: 3.5rem 2.5rem;
  padding-right: min(33%, 23rem);
  background: var(--bp-art) right center / min(31%, 21rem) auto no-repeat;
}
body:is([data-bp-family="program"],[data-bp-family="location"],[data-bp-family="guide"]) #main .article-header.wrap-narrow {
  width: min(1180px, calc(100% - 3rem));
  max-width: none;
}
body:is([data-bp-family="program"],[data-bp-family="location"],[data-bp-family="guide"]) #main :is(.hero > .wrap,.page-hero > .container) {
  padding-right: min(36%,24rem);
  background: var(--bp-art) right center / min(32%,21rem) auto no-repeat;
}
body[data-bp-family="program"] #main .product-page > .article-header h1 { max-width: 17ch; font-size: clamp(2.4rem, 4.2vw, 4rem); }
body[data-bp-family="home"] .hero { padding-block: 2rem 4rem; }
body[data-bp-family="home"] .hero > .wrap {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  align-items: center;
  gap: 3rem;
}
body[data-bp-family="home"] .hero .photo-copy { padding: 0; max-width: none; }
body[data-bp-family="home"] .hero h1 { font-size: clamp(2.7rem,3.8vw,3.6rem); max-width: 18ch; }
body[data-bp-family="home"] .hero .lead { max-width: 42ch; font-size: 1.1rem; }
body[data-bp-family="home"] .photo-scene {
  display: flex; align-items: center; justify-content: center;
  min-height: 29rem; height: auto; padding: 1.5rem; background: #eef2ef;
  border: 1px solid var(--rule); border-radius: 16px; box-shadow: none;
}
body[data-bp-family="home"] .photo-scene .added-photo { position: static; width: 100%; height: auto; max-height: 30rem; object-fit: contain; border-radius: 0; }
body[data-bp-family="home"] .photo-scene::after { display: none; }
body[data-bp-family="home"] .choice-grid { gap: 1rem; }
body[data-bp-family="home"] .choice {
  border: 1px solid var(--rule); border-radius: 12px;
  background: #fff; padding: 1.5rem; text-align: left;
}
body[data-bp-family="home"] .choice::before {
  content: ''; display: block; height: 8rem; margin-bottom: 1.25rem;
  border-radius: 8px; background: #eef2ef url('/assets/illustrations/home.svg') center / contain no-repeat;
}
body[data-bp-family="home"] .choice:has(.added-photo)::before { display: none; }
body[data-bp-family="home"] .choice .added-photo { display: block; width: 100%; height: 9rem; object-fit: contain; background: #eef2ef; border-radius: 8px; margin-bottom: 1.25rem; }
body[data-bp-family="home"] .tool-split .added-photo { display: block; width: 100%; height: 14rem; object-fit: contain; background: #eef2ef; border-radius: 10px; margin-bottom: 1.5rem; }
body[data-bp-family="home"] .choice:nth-child(2)::before { background-image: url('/assets/illustrations/refinance.svg'); }
body[data-bp-family="home"] .choice:nth-child(3)::before { background-image: url('/assets/illustrations/budget.svg'); }
body[data-bp-family="home"] .choice:nth-child(4)::before { background-image: url('/assets/illustrations/review.svg'); }
body[data-bp-family="home"] .choice strong { font-size: 1.05rem; }
body[data-bp-family="home"] .section { padding-block: 4.5rem; }
.bp-process { display: grid; grid-template-columns: .8fr 1.2fr; gap: 4rem; align-items: start; }
.bp-process h2 { font-size: clamp(2rem,3.4vw,3rem); }
.bp-process ol { list-style: none; counter-reset: process; margin: 0; padding: 0; }
.bp-process li { counter-increment: process; padding: 1.5rem 0 1.5rem 3.5rem; border-top: 1px solid var(--rule); position: relative; }
.bp-process li::before { content: '0' counter(process); position: absolute; left: 0; top: 1.4rem; font-size: .85rem; color: var(--bp-sage); }
.bp-process li h3 { font-size: 1.15rem; margin: 0 0 .5rem; }
.bp-process li p { margin: 0; }
/* Functional workspaces keep generous width and all original controls. */
body[data-bp-family="calculator"] .calc-wrapper { margin-block: 2.5rem 4rem; }
body[data-bp-family="calculator"] .calc-card { border: 1px solid var(--rule); border-radius: 16px; box-shadow: 0 12px 36px #0f224008; overflow: clip; }
body[data-bp-family="calculator"] .calc-card > .hero { padding-right: 12rem; background: #eef2ef var(--bp-art) right 1rem center / 10rem auto no-repeat; }
body[data-bp-family="calculator"] .calc-card > .hero h1 { font-size: clamp(2rem,3.2vw,3rem); }
body[data-bp-family="calculator"] .calc-results { background: #f1f5f2; }
body[data-bp-family="calculator"] .tabs { background: #f6f7f3; }
body[data-bp-family="calculator"] #calc-dscr { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
body[data-bp-family="calculator"] #calc-dscr :is(.tool-controls,.tool-result,.fld,.fld-pair) { min-width: 0; }
body[data-bp-family="calculator"] #calc-dscr .fld-pair { grid-template-columns: repeat(2,minmax(0,1fr)); }
body[data-bp-family="calculator"] #calc-dscr input { min-width: 0; max-width: 100%; }
body[data-bp-family="calculator"] #main > .article-header { padding-right: 12rem; background: var(--bp-art) right center / 10rem auto no-repeat; }
body[data-bp-family="review"] .leah-hero-inner { width: min(960px,calc(100% - 3rem)); }
body[data-bp-family="review"] .leah-hero-inner > h1 { max-width: 16ch; padding-right: 0; font-size: clamp(2.6rem,4.5vw,4rem); }
body[data-bp-family="review"] .leah-hero-inner { background: var(--bp-art) right top / 16rem auto no-repeat; }
body[data-bp-family="review"] .leah-hero-sub { max-width: 55ch; padding-right: 7rem; }
body[data-bp-family="review"] :is(.leah-prompt-box,.leah-card) { border-radius: 14px; }
body[data-bp-family="review"] :is(.leah-doc-card,.leah-insight-card) { min-width: 0; overflow-wrap: anywhere; }
body[data-bp-family="review"] .lpb-typewriter { color: #596770; }
/* Existing real blog inventory and filter behavior stay in place. */
body[data-bp-family="journal"] .featured-post { padding: 2.5rem; background: #eef2ef; border: 1px solid var(--rule); }
body[data-bp-family="journal"] .featured-post h2 { max-width: 35ch; }
body[data-bp-family="journal"] .posts-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.5rem; }
body[data-bp-family="journal"] .post-card, body[data-bp-family="journal"] .post-card:first-child {
  padding: 0; border: 1px solid var(--rule); border-radius: 12px; background: #fff;
  display: flex; flex-direction: column; min-width: 0; overflow: hidden;
}
body[data-bp-family="journal"] .post-card[hidden] { display: none; }
body[data-bp-family="journal"] .post-card::before {
  content: ''; display: block; height: 10rem; flex: none;
  background: #eef2ef url('/assets/illustrations/review.svg') center / auto 90% no-repeat;
}
body[data-bp-family="journal"] .post-card:nth-child(3n+2)::before { background-image: url('/assets/illustrations/home.svg'); }
body[data-bp-family="journal"] .post-card:nth-child(3n)::before { background-image: url('/assets/illustrations/budget.svg'); }
body[data-bp-family="journal"] .post-card-body { padding: 1.5rem; }
body[data-bp-family="journal"] .post-card h3 { font-size: 1.3rem; }
body[data-bp-family="article"] .article-header { border-bottom: 1px solid var(--rule); padding-bottom: 2rem; }
body[data-bp-family="article"] .article-header::before {
  content: ''; display: block; height: 13rem; margin-bottom: 2rem; border-radius: 14px;
  background: #eef2ef var(--bp-art) center / auto 95% no-repeat;
}
body[data-bp-family="article"] :is(.article.post,.post-content) { line-height: 1.8; }
body[data-bp-family="legal"] #main { line-height: 1.8; }
@media(max-width:1000px) {
  body[data-bp-family="home"] .hero > .wrap { gap: 2rem; }
  body[data-bp-family="home"] .photo-scene { min-height: 23rem; }
  body[data-bp-family="journal"] .posts-grid { grid-template-columns: 1fr; }
  body[data-bp-family="review"] .leah-hero-inner { background-size: 11rem; }
}
@media(max-width:700px) {
  body:is([data-bp-family="program"],[data-bp-family="location"],[data-bp-family="guide"]) #main :is(.hero > .wrap,.page-hero > .container) {
    padding-right: 0; padding-top: 12rem;
    background-position: center top 1rem; background-size: auto 10rem;
  }
  body[data-bp-family="calculator"] #calc-dscr { grid-template-columns: minmax(0,1fr); padding: 1.25rem; }
  body[data-bp-family="calculator"] #calc-dscr .fld-pair { grid-template-columns: minmax(0,1fr); }
  body[data-bp-family="calculator"] #calc-dscr .fld label { flex-wrap: wrap; gap: .5rem; }
  body[data-bp-family="home"] .hero > .wrap { display: grid; grid-template-columns: 1fr; gap: 2rem; }
  body[data-bp-family="home"] .hero h1 { max-width: 16ch; font-size: clamp(2.4rem,8.4vw,3.6rem); }
  body[data-bp-family="home"] .photo-scene { min-height: 0; padding: 1rem; }
  body[data-bp-family="home"] .photo-scene .added-photo { max-height: 21rem; }
  body[data-bp-family="home"] .choice::before { height: 6rem; }
  body[data-bp-family="home"] .section { padding-block: 3rem; }
  .bp-process { grid-template-columns: 1fr; gap: 1.5rem; }
  body:is([data-bp-family="program"],[data-bp-family="location"],[data-bp-family="guide"],[data-bp-family="journal"]) #main .article-header:first-of-type {
    padding-right: 0; padding-top: 12rem; min-height: 0;
    background-position: center top 1rem; background-size: auto 10rem;
  }
  body[data-bp-family="calculator"] .calc-card > .hero { padding-right: 1.5rem; background-image: none; }
  body[data-bp-family="calculator"] #main > .article-header { padding-right: 0; background-image: none; }
  body[data-bp-family="review"] .leah-hero-inner { background-position: center top; padding-top: 11rem; background-size: auto 10rem; }
  body[data-bp-family="review"] .leah-hero-sub { padding-right: 0; }
  body[data-bp-family="journal"] .featured-post { padding: 1.5rem; }
}
@media(prefers-reduced-motion:reduce) { body[data-bp-family] { scroll-behavior: auto; } body[data-bp-family] :is(.btn,.choice) { transition: none; transform: none; } }
@media print { body[data-bp-family] .article-header, body[data-bp-family] .leah-hero-inner { background: none !important; padding-top: 0 !important; padding-right: 0 !important; } body[data-bp-family] .article-header::before, body[data-bp-family] .post-card::before { display: none; } }
