/* The band is the section heading. It always precedes the section's content. */
main > .chapter-section {
  padding-top: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.chapter-bar {
  --band: #123d66;
  --type: #fff;
  position: relative;
  z-index: 1;
  color: var(--type);
  background: var(--band);
  text-align: left;
}
.chapter-bar--ice { --band: #b5dfef; --type: #122f47; }
.chapter-bar--teal { --band: #0c6069; }
.chapter-bar--ocean { --band: #235e86; }
.chapter-bar .chapter-title {
  display: flex;
  align-items: center;
  gap: clamp(9px, 1.2vw, 17px);
  margin: 0;
  padding-block: clamp(15px, 1.8vw, 25px);
  color: var(--type);
  font-size: clamp(21px, 2.1vw, 30px);
  font-weight: 700;
  line-height: 1.32;
  letter-spacing: .02em;
}
.chapter-number, .chapter-slash {
  flex: none;
  font-family: Arial, sans-serif;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.chapter-number { font-size: 1.28em; font-weight: 700; letter-spacing: -.035em; }
.chapter-slash { font-size: 1.09em; font-weight: 400; opacity: .68; }
.chapter-bar + .wrap { padding-top: clamp(20px, 2.6vw, 40px); }
#subsidy .chapter-bar + .wrap { padding-top: 0; }
.chapter-section .chapter-lead {
  margin: 0;
  color: var(--navy);
  font-size: clamp(24px, 2.45vw, 34px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .01em;
}
#strengths .chapter-lead, #contact .chapter-lead { color: #fff; }
#support .chapter-lead, #documents .chapter-lead, #contact .chapter-lead { margin-bottom: 15px; }
#faq .faq-layout { display: block; }
#faq .faq-layout > div { max-width: 900px; }
#company .company-panel { margin-top: 0; padding-top: 0; border-top: 0; }
/* Decorative artwork stays behind the body, clear of the chapter title. */
#trust::before { content: none; }
#simulation::before { top: 78px; }
@media (max-width: 760px) {
  .chapter-bar .chapter-title { font-size: clamp(18px, 5.2vw, 22px); }
  .chapter-section .chapter-lead { font-size: clamp(21px, 5.7vw, 26px); }
  #simulation::before { top: 62px; }
}

.grant-check-summary {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 4px 12px;
  margin: 0;
  padding: 11px 0;
  border-block: 1px solid #bbd0db;
  font-size: 14px;
  line-height: 1.6;
  color: #193c54;
}
.grant-check-summary strong { color: #0c6069; font-weight: 700; }

/* Link the four pictograms along the reading direction. */
#flow .flow-grid {
  --flow-accent: #147982;
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 28px;
}
#flow .flow-grid::before { content: none; }
#flow .flow-step {
  display: flex; flex-direction: column; align-items: flex-start;
  position: relative; gap: 12px; margin: 0; padding: 0; border: 0;
}
#flow .flow-step:not(:last-child)::after {
  content: "";
  position: absolute; top: 35px; left: 82px; right: -14px;
  border-top: 2px dotted #a9c7ce;
}
#flow .flow-pictogram { display: block; flex: none; width: 72px; height: 72px; color: #163d5a; }
#flow .flow-copy { min-width: 0; }
#flow .flow-step-number {
  display: block; padding: 0;
  font: 700 11px/1.3 Arial,sans-serif; letter-spacing: .09em; color: #126773;
}
#flow .flow-copy h3 { margin: 4px 0 6px; font-size: 19px; line-height: 1.4; }
#flow .flow-copy p { margin: 0; line-height: 1.75; }
@media (max-width:760px) {
  #flow .flow-grid { grid-template-columns: 1fr; gap: 16px; }
  #flow .flow-step {
    display: grid; grid-template-columns: 64px minmax(0,1fr);
    align-items: start; gap: 14px; padding-bottom: 10px;
  }
  #flow .flow-step:not(:last-child)::after {
    top: 69px; left: 32px; right: auto; bottom: -12px;
    border-top: 0; border-left: 2px dotted #a9c7ce;
  }
  #flow .flow-pictogram { width: 64px; height: 64px; }
  #flow .flow-copy h3 { font-size: 17px; }
}

/* A compact reference area follows the four steps. */
.chapter-legacy-target {
  position: absolute;
  top: 0;
  width: 0;
  height: 0;
}
.chapter-legacy-target, .flow-faq, .flow-guide { scroll-margin-top: 90px; }
.flow-resources { margin-top: clamp(28px, 4vw, 52px); }
.flow-resources-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px 20px;
  flex-wrap: wrap;
  margin-bottom: 7px;
}
.flow-resources-head h3 {
  margin: 0;
  color: var(--navy);
  font-size: clamp(18px, 2vw, 23px);
}
.flow-guide button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 4px 0;
  border: 0;
  background: transparent;
  color: #115a74;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}
.flow-guide button:hover { text-decoration: underline; }
.flow-faq details { border-top: 1px solid #c7d7db; }
.flow-faq details:last-child { border-bottom: 1px solid #c7d7db; }
.flow-faq summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 14px 0;
  list-style: none;
  cursor: pointer;
  font-size: 15px;
  font-weight: 700;
}
.flow-faq summary::-webkit-details-marker { display: none; }
.flow-faq summary::after { content: "＋"; color: #15606b; }
.flow-faq details[open] summary::after { content: "−"; }
.flow-faq details p { max-width: 65ch; margin: 0; padding: 0 0 16px; line-height: 1.7; }

#strengths .strength-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 20px clamp(24px, 6vw, 84px);
}
.strength-intro-copy p { margin: 12px 0 0; }
.strength-review {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  grid-template-areas: "score source" "score stars" "score count";
  align-content: center;
  align-items: center;
  gap: 5px clamp(12px, 1.4vw, 20px);
  padding-inline-start: clamp(20px, 3.2vw, 48px);
  border-inline-start: 1px solid #ffffff40;
  color: #fff;
  scroll-margin-top: 100px;
}
.strength-review-source {
  grid-area: source;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 700;
}
.strength-review-source img { display: block; width: 67px; height: auto; }
.strength-review-score {
  grid-area: score;
  font: 750 clamp(54px, 5.3vw, 78px)/1 var(--font-number, sans-serif);
  font-variant-numeric: lining-nums tabular-nums;
  letter-spacing: -.055em;
}
.strength-review-stars {
  grid-area: stars;
  display: block;
  width: clamp(108px, 9vw, 128px);
  max-width: 100%;
  height: auto;
  fill: #ffc94d;
}
.strength-review-count {
  grid-area: count;
  color: #eff5fb;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.45;
}
.strength-review-count small { display: block; font-size: 10px; font-weight: 400; color: #bacbdd; }
@media (min-width: 761px) {
  .strength-review { row-gap: 7px; }
  .strength-review-score { font-size: clamp(88px, 10vw, 132px); }
  .strength-review-source { font-size: clamp(17px, 1.5vw, 21px); }
  .strength-review-source img { width: clamp(104px, 9.5vw, 140px); }
  .strength-review-stars { width: clamp(152px, 15.5vw, 216px); }
  .strength-review-count { font-size: clamp(16px, 1.45vw, 20px); }
  .strength-review-count small { font-size: 12px; }
}
@media (max-width: 760px) {
  #strengths .strength-intro { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .strength-review {
    justify-self: start;
    padding-inline-start: 0;
    border: 0;
    column-gap: 17px;
  }
}

#strengths .strength-facts { grid-template-columns: 1fr 1.25fr 1.25fr; }
.scope-comparison {
  margin-block: clamp(22px, 3.4vw, 45px) clamp(24px, 3.4vw, 45px);
  scroll-margin-top: 90px;
}
.scope-comparison h3 {
  margin: 0 0 16px;
  font-size: clamp(21px, 2.1vw, 30px);
  font-weight: 700;
  line-height: 1.45;
  color: #fff;
}
.scope-comparison h3 span { display: inline-block; }
.scope-key {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  margin: 0 0 12px;
  padding: 0;
  color: #d8e8f3;
  list-style: none;
  font-size: 12px;
}
.scope-key li { display: flex; align-items: center; gap: 4px; }
.scope-symbol-defs { position: absolute; }
.scope-key-icon, .scope-symbol {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.1;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.scope-key-icon { width: 15px; height: 15px; color: #b5dfef; }
.scope-comparison table {
  width: 100%; min-width: 0; table-layout: fixed; border-collapse: collapse; color: #eef6fb;
}
.scope-axis { width: 23%; }
.scope-own { width: 31%; }
.scope-comparison th, .scope-comparison td {
  width: auto;
  padding: 9px 10px;
  text-align: center;
  vertical-align: middle;
  border: 0;
  border-bottom: 1px solid #88abc34d;
  line-height: 1.4;
  font-size: 14px;
  overflow-wrap: anywhere;
}
.scope-comparison thead th {
  padding-block: 12px;
  background: #21435f;
  font-weight: 650;
  color: #eff7fb;
}
.scope-comparison thead th:first-child, .scope-comparison tbody th { text-align: left; }
.scope-comparison thead th:nth-child(2) { background: #8fd3e6; color: #12364d; font-size: 17px; }
.scope-comparison tbody th { color: #e8f3fa; font-weight: 650; }
.scope-comparison tbody td:nth-child(2) {
  color: #133b55;
  background: #dcf0f7;
  border-bottom-color: #b2d2df;
  font-weight: 700;
}
.scope-symbol {
  display: block;
  width: clamp(24px, 2.4vw, 30px);
  height: auto;
  margin-inline: auto;
}
.scope-comparison td:nth-child(2) .scope-symbol { color: #07617a; stroke-width: 2.5; }
.scope-range {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  font-size: 12px;
}
.scope-range .scope-symbol {
  width: clamp(16px, 1.7vw, 24px);
  margin: 0;
}
.scope-caption { display: block; margin-top: 3px; font-size: 13px; }
.scope-comparison > p { margin: 10px 0 0; color: #cbdee9; font-size: 12px; }
.scope-sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}
@media (max-width: 760px) {
  #strengths .strength-facts { grid-template-columns: minmax(90px, .8fr) minmax(0, 1.2fr); }
  #strengths .strength-record { grid-row: 1 / 3; }
  .scope-axis { width: 23%; }
  .scope-own { width: 33%; }
  .scope-comparison th, .scope-comparison td { padding: 8px 4px; font-size: 12px; }
  .scope-comparison thead th:nth-child(2) { font-size: 14px; }
  .scope-caption { font-size: 12px; }
}
