/* Loan programs, DSCR guide and rental calculator */
.program-hero, .guide-hero {
  background-color: #18231d;
  color: #fff8ed;
}
.program-hero {
  background-image: linear-gradient(100deg, #171713 20%, #171713ed 47%, #17171395), url("/public/coutu-sunset-home.jpg");
  background-position: center, right 70%;
  background-size: cover;
}
.program-hero-inner, .guide-hero-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(2rem, 7vw, 6rem);
  padding-block: clamp(2.75rem, 6vw, 5.75rem);
}
.program-hero .eyebrow, .guide-hero .eyebrow { color: #f4d8a5; }
.program-hero h1, .guide-hero h1, .tool-intro h1 {
  margin: .8rem 0 .9rem;
  font: 400 clamp(2.55rem, 5.6vw, 5rem)/.99 var(--serif);
  letter-spacing: -.055em;
  text-wrap: balance;
}
.program-hero h1 em, .guide-hero h1 em { color: #ffdda0; }
.hero-lede { max-width: 39rem; color: #eee5d6; font-size: clamp(1rem, 1.45vw, 1.17rem); text-wrap: pretty; }
.program-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1.35rem; }
.program-hero :focus-visible, .guide-hero :focus-visible { outline-color: var(--gold); }
.hero-disclosure { margin-top: 1.2rem; color: #e6d5ba; font-size: .82rem; }
.hero-disclosure a { text-underline-offset: 3px; }
.program-shortcuts { padding: 1.25rem 1.4rem; border: 1px solid #d7b7875c; border-radius: 7px; background: #211b15e8; }
.program-shortcuts .eyebrow { margin-bottom: .55rem; }
.program-shortcuts a {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: .75rem;
  align-items: center;
  padding-block: .78rem;
  text-decoration: none;
}
.program-shortcuts a + a { border-top: 1px solid #b593635c; }
.program-shortcuts a:hover strong { text-decoration: underline; text-underline-offset: 4px; }
.program-shortcuts strong { display: block; font: 400 1.23rem/1.2 var(--serif); }
.program-shortcuts small { display: block; margin-top: .18rem; color: #e3d5c0; font-size: .78rem; }
.program-shortcuts .path-number, .program-shortcuts .path-arrow { color: var(--gold); }
.program-section { padding-block: clamp(2.5rem, 5.5vw, 4.65rem); border-bottom: 1px solid var(--rule); }
.program-section--sand { background: var(--sand); }
.program-section h2, .tool-intro h1 {
  font-size: clamp(2.05rem, 4.1vw, 3.5rem);
  line-height: 1.02;
  letter-spacing: -.045em;
}
.program-section h2 { margin-top: .55rem; text-wrap: balance; }
.program-section h2 em { color: var(--ochre); }
.program-section .intro { margin-top: .8rem; max-width: 64ch; color: var(--body); text-wrap: pretty; }
.program-section .text-link, .guide-related .text-link { font-size: .92rem; }
.breadcrumbs { margin-bottom: .9rem; color: var(--body); font-size: .8rem; }
.story-hero:not(.story-hero--faq) .breadcrumbs, .guide-hero .breadcrumbs { color: #e6d5bb; }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.breadcrumbs li + li::before { content: "›"; padding-right: .5rem; color: currentColor; }
.breadcrumbs a { text-underline-offset: 3px; }
.program-split { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: start; gap: clamp(1.35rem, 5vw, 4.2rem); }
.program-split .intro + .intro { margin-top: .65rem; }
.program-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin-top: 1.5rem; }
.program-card {
  padding: clamp(1rem, 2.6vw, 1.5rem);
  border: 1px solid var(--rule);
  border-radius: 5px;
  background: #fffaf3;
  color: var(--ink);
}
.program-card--green { background: #e7ebde; border-color: #c2c9b6; }
.program-card h3 { font-size: clamp(1.35rem, 2.3vw, 1.65rem); line-height: 1.1; }
.program-card p, .program-card li { color: var(--body); font-size: .93rem; }
.program-card h3 + p, .program-card p + p { margin-top: .6rem; }
.program-card p + .text-link { display: inline-block; margin-top: .65rem; }
.program-card ul { margin: .75rem 0 0; padding-left: 1.15rem; }
.program-card li + li { margin-top: .36rem; }
.program-card .eyebrow { color: var(--ochre); margin-bottom: .55rem; }
.program-card .stat { margin: .5rem 0; color: #25372b; font: 400 clamp(2.5rem, 6vw, 4.4rem)/1 var(--serif); letter-spacing: -.04em; }
.program-card .stat-note { font-size: .83rem; }
.program-table { width: 100%; margin-top: 1.4rem; border-collapse: collapse; text-align: left; }
.program-table th, .program-table td { padding: .75rem .65rem; border-bottom: 1px solid var(--rule); vertical-align: top; }
.program-table thead th { color: var(--ochre); background: var(--sand); font-size: .8rem; }
.program-table tbody th { font-weight: 730; }
.program-table td { color: var(--body); font-size: .9rem; }
.program-questions { display: grid; gap: .55rem; margin-top: 1.45rem; }
.program-questions details { border: 1px solid var(--rule); border-radius: 4px; background: #fffaf3; }
.program-questions summary { padding: .85rem 1rem; cursor: pointer; font-weight: 690; }
.program-questions details p { max-width: 76ch; padding: 0 1rem .95rem; color: var(--body); }
.program-questions details p a, .program-section .source-note a { text-underline-offset: 3px; }
.source-note { margin-top: 1rem; color: var(--body); font-size: .83rem; }
.program-list { margin: .9rem 0 0; padding-left: 1.22rem; color: var(--body); }
.program-list li + li { margin-top: .6rem; }
.program-contact .contact-inner { padding-block: clamp(2.55rem, 5vw, 4.3rem); }
.program-contact h2 { margin-top: .45rem; text-wrap: balance; }
.tool-intro { padding-block: clamp(1.75rem, 3.8vw, 3.1rem); background: var(--sand); border-block: 1px solid var(--rule); }
.tool-intro .hero-lede { color: var(--body); max-width: 60ch; }
.tool-intro h1 { font-family: var(--serif); }
.tool-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: start; gap: clamp(1rem, 3vw, 2rem); }
.tool-form, .tool-results { padding: clamp(1rem, 2.5vw, 1.6rem); border: 1px solid var(--rule); border-radius: 6px; background: #fffaf3; }
.tool-form fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.tool-form fieldset + fieldset { margin-top: 1.35rem; padding-top: .75rem; border-top: 1px solid var(--rule); }
.tool-advanced {
  margin-top: 1.35rem;
  padding: .8rem .85rem;
  border: 1px solid var(--rule);
  border-radius: 4px;
  background: #fbf5e9;
}
.tool-advanced summary { cursor: pointer; font-size: .9rem; font-weight: 700; }
.tool-advanced summary span { margin-left: .35rem; color: var(--body); font-size: .75rem; font-weight: 500; }
.tool-advanced p { margin-top: .55rem; }
.tool-form .tool-advanced fieldset { margin-top: 0; }
.tool-form legend { padding: 0 .4rem 0 0; font: 400 1.45rem/1.1 var(--serif); }
.tool-form fieldset:first-of-type { margin-top: 1.15rem; }
.tool-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem .75rem; margin-top: .7rem; }
.tool-field { display: grid; align-content: start; gap: .22rem; min-width: 0; }
.tool-field label { font-size: .88rem; font-weight: 690; }
.tool-field input, .tool-field select {
  min-width: 0;
  width: 100%;
  min-height: 45px;
  padding: .45rem .55rem;
  border: 1px solid #a8967e;
  border-radius: 4px;
  background: #fffdf9;
  color: var(--ink);
  font: inherit;
}
.tool-field small, .tool-note { color: var(--body); font-size: .82rem; }
.tool-actions { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1rem; }
.tool-actions .button { min-height: 44px; cursor: pointer; }
.button-quiet { background: #fffaf3; border-color: #a8967e; color: var(--ink); }
.button-quiet:hover { background: var(--sand); }
.tool-results { background: #eef0e5; border-color: #c4cab8; }
.tool-results h2 { margin: .25rem 0 .55rem; font-size: clamp(1.7rem, 3vw, 2.45rem); }
.tool-results p + p { margin-top: .6rem; }
.result-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; margin: .85rem 0 0; }
.result-grid > div { padding: .65rem .75rem; border: 1px solid #c4cab8; border-radius: 4px; background: #fcfbf2; }
.result-grid dt { color: var(--body); font-size: .77rem; font-weight: 690; }
.result-grid dd { margin: .16rem 0 0; font: 400 clamp(1.32rem, 2.8vw, 2.1rem)/1.1 var(--serif); overflow-wrap: anywhere; }
.result-grid dd[data-negative="true"] { color: #8a3326; }
.tool-result-note { margin-top: .8rem; }
.tool-assumptions { margin-top: .8rem; }
.tool-assumptions h3 { font-size: 1.3rem; }
.tool-assumptions p { margin-top: .4rem; }
.tool-comparison { margin-top: 1.15rem; }
.tool-comparison h3 { font-size: 1.38rem; }
.tool-comparison table { width: 100%; margin-top: .35rem; border-collapse: collapse; text-align: left; font-size: .81rem; }
.tool-comparison th, .tool-comparison td { padding: .4rem .28rem; border-bottom: 1px solid #c4cab8; overflow-wrap: anywhere; }
.tool-status { min-height: 1.2em; margin-top: .55rem; }
[hidden] { display: none !important; }

@media (max-width: 900px) {
  .program-hero-inner, .guide-hero-inner { gap: 1.6rem; }
  .program-split { gap: 1.5rem; }
}
@media (max-width: 760px) {
  .program-hero-inner, .guide-hero-inner, .program-split, .tool-layout, .program-card-grid { grid-template-columns: 1fr; }
  .program-hero-inner, .guide-hero-inner { padding-block: 2.05rem; }
  .program-shortcuts { padding: .85rem 1rem; }
  .program-shortcuts a { padding-block: .6rem; }
  .program-actions .button { min-height: 44px; padding: .55rem .82rem; }
  .program-card-grid { margin-top: 1rem; }
  .program-table th, .program-table td { padding: .55rem .33rem; font-size: .79rem; overflow-wrap: anywhere; }
  .program-table { table-layout: fixed; }
  .program-contact .contact-actions { width: 100%; }
}
@media (max-width: 370px) {
  .tool-fields { gap: .6rem .45rem; }
  .tool-field label { font-size: .82rem; }
}
@media print {
  .calculator-page .site-header, .calculator-page .breadcrumbs, .calculator-page .site-footer,
  .calculator-page .no-print, .calculator-page .tool-form { display: none !important; }
  .calculator-page .frame { width: 100%; }
  .calculator-page .tool-layout { display: block; }
  .calculator-page .tool-intro, .calculator-page .program-section { padding: .6rem 0; }
  .calculator-page .tool-intro, .calculator-page .tool-results, .calculator-page .result-grid > div { background: white; }
  .calculator-page .tool-results { break-inside: avoid; }
  .calculator-page .tool-intro h1 { font-size: 27pt; }
}