/* Reuse styles.css and closer-look.css for the complete interior-page system. */
.finance-prose { max-width:760px; margin-inline:auto; }
/* Reserve the shared banner's subtitle height for this single-line title. */
.finances-page .closer-opening { padding-top:54px; padding-bottom:55px; }
.finance-chart figcaption { text-align:center; font-size:14px; margin-top:12px; }
@media(max-width:760px) { .finances-page .closer-opening { padding-top:47px; padding-bottom:48px; } }
.finance-intro { text-align:center; }
.finance-intro p:first-child { font-family:var(--serif); font-size:27px; line-height:1.5; color:var(--teal); }
.finance-list { padding-left:24px; font-size:17px; margin:0 0 27px; }
.finance-list li { padding-left:7px; margin-bottom:7px; }
.finance-list li::marker { color:#976c28; }
.finance-chart-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.08fr); gap:24px; align-items:center; max-width:1060px; margin-inline:auto; }
/* Multiply drops the white matte into the shared paper without changing the
   approved pixels, typography, glossy edges, or original soft shadow. */
.finance-chart { mix-blend-mode:multiply; }
.finance-chart img { display:block; width:100%; height:auto; }
@media(min-width:1001px) {
  .finance-chart {
    position:sticky;
    top:calc(var(--header) + 38px);
    align-self:start;
    justify-self:center;
    width:100%;
    /* Keep chart + full-size link visible on short desktop viewports. */
    max-width:calc((100svh - var(--header) - 120px) * 4 / 3);
  }
}
.chart-note { margin-top:36px; }
.support-calculator { max-width:760px; margin:30px auto 0; padding:clamp(22px,3vw,30px); border:1px solid #9aafaa; border-radius:12px; background:var(--paper-texture),linear-gradient(135deg,#e1e9e3,#f7f4ec 60%,#e9ddc5); box-shadow:0 18px 40px #214e5612,inset 0 1px #fff; }
.attendance-bar { display:flex; justify-content:flex-start; gap:18px; align-items:center; }
.calculator-prompt { font:clamp(24px,2.6vw,30px)/1.3 var(--serif); color:var(--teal); margin-bottom:18px; }
.attendance-bar label { font-weight:600; font-size:16px; }
#attendance { width:160px; max-width:100%; min-height:64px; padding:9px 16px; border:2px solid var(--teal); border-radius:8px; background:#fffdf7; color:var(--teal); font:34px/1.2 var(--serif); text-align:center; box-shadow:0 4px 0 #214e5620; }
#attendance:focus-visible { outline:3px solid #a64f2d; outline-offset:5px; }
#attendance[aria-invalid=true] { border-color:#ae292d; }
.calculator-note { font-size:14px; margin:14px 0 20px; }
.calculator-error { color:#96242a; font-size:15px; font-weight:600; }
.participation-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.participation-card { border:1px solid #b4c4b9; border-top:4px solid var(--glass); border-radius:7px; padding:22px 16px; background:#faf8f0; box-shadow:0 5px 15px #214e560a; }
.participation-card:nth-child(2) { border-top-color:var(--wheat); background:#fbf5e6; }
.participation-card h3 { font-size:14px; font-weight:500; margin:0 0 22px; }
.participation-card h3 span { display:block; font:44px/1.2 var(--serif); margin-bottom:4px; }
.support-calculator dl,.giving-card dl { margin:0; }
.participation-card dl>div { padding-top:14px; margin-top:14px; border-top:1px solid #7fa8a64d; }
.participation-card dt,.giving-card dt { font-size:13px; line-height:1.5; }
.participation-card dd { font:30px/1.4 var(--serif); margin:4px 0 0; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.participation-card .monthly-result dd { font-size:34px; }
.calculator-basis { margin-bottom:0; text-align:center; }
.giving-context { max-width:760px; text-align:center; font-size:16px; line-height:1.7; margin:26px auto; }
.giving-range-explanation { display:block; margin-top:10px; }
.giving-context>a { display:inline-block; margin-top:10px; font-size:14px; }
.calculator-segue { max-width:760px; margin:38px auto 0; text-align:center; font:italic 27px/1.4 var(--serif); color:var(--teal); }
.giving-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; max-width:760px; margin:auto; }
.giving-card { border-block:2px solid #c0ab7d; background:linear-gradient(120deg,#e7dcc650,#f6f3ec20); padding:28px; }
.giving-card h3 { font-size:16px; font-weight:500; line-height:1.5; margin:0 0 22px; }
.giving-card h3 span { font:38px var(--serif); color:var(--teal); margin-right:7px; }
.giving-card dl>div+div { margin-top:18px; }
.giving-card dd { font:clamp(24px,2.3vw,30px)/1.4 var(--serif); color:var(--teal); margin:6px 0 0; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.giving-notes { margin-top:30px; }
.finance-scripture { margin:38px 0 0; text-align:center; }
.story-copy .planting-line { margin:12px 0 0; padding:0 0 27px; border-top:0; border-bottom:1px solid var(--sand); text-align:center; font:italic 25px/1.4 var(--serif); color:var(--teal); }
.finance-scripture p { font:italic 28px/1.5 var(--serif); color:var(--teal); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
@media(max-width:1000px) { .finance-chart-grid { grid-template-columns:1fr; } .finance-chart { max-width:760px; margin:auto; } .finance-chart-grid .story-copy { max-width:760px; margin:auto; } }
@media(max-width:760px) { .finance-list { font-size:16px; } .attendance-bar { flex-direction:column; align-items:stretch; gap:16px; } #attendance { width:100%; } .participation-grid,.giving-grid { grid-template-columns:1fr; } .participation-card { padding:22px; } .participation-card dl { display:grid; grid-template-columns:1fr 1fr; gap:12px; } .participation-card dl>div:first-child { grid-column:1/-1; } .participation-card h3 span { display:inline; font-size:36px; margin-right:8px; } .participation-card dd,.participation-card .monthly-result dd { font-size:30px; } .finance-chart-grid { gap:24px; } }


/* Annual support is the shared visual payoff in both sets of illustrations. */
.participation-card dl>.annual-result,.giving-card dl>.annual-result {
  margin:20px -7px -7px;
  padding:19px 14px 21px;
  border:1px solid #214e56;
  border-radius:10px;
  background:linear-gradient(135deg,#35676b,#214e56);
  color:var(--ivory);
  box-shadow:0 5px 12px #214e5620,inset 0 1px 0 #ffffff25;
}
.annual-result dt { font-weight:700; font-size:15px; }
.participation-card .annual-result dd,.giving-card .annual-result dd {
  color:#f0cc87;
  font-size:40px;
  font-weight:700;
  line-height:1.25;
  margin-top:10px;
}
.giving-card .annual-result dd { font-size:34px; letter-spacing:-.035em; }
@media(max-width:760px) {
  .participation-card dl>.annual-result { grid-column:1/-1; margin-top:6px; }
  .giving-card .annual-result dd { font-size:clamp(28px,8vw,36px); }
}

/* Keep the longer household label visually attached to its input. */
.attendance-bar label { max-width:390px; line-height:1.5; }
#attendance { flex-shrink:0; }
.giving-callout {
  max-width:760px;
  margin:36px auto 30px;
  padding-top:27px;
  border-top:1px solid var(--sand);
  color:#a64f2d;
  text-align:center;
  text-wrap:pretty;
  font:italic 400 21px/1.6 var(--serif);
}
@media(max-width:760px) { .giving-callout { font-size:20px; } }


