.decision-guide-page .hero h1,
.decision-guide-page .side h2 {
  overflow-wrap: anywhere;
  text-wrap: balance;
}

.decision-guide-page .hero h1 {
  font-size: clamp(44px, 8.5cqi, 104px);
}

.decision-guide-page .hero-base .guide-takeaway {
  font-size: clamp(24px, 3.6cqi, 40px);
  line-height: 1.2;
  letter-spacing: -.035em;
}

.decision-guide-page > main > .reading {
  margin-bottom: clamp(44px, 5cqi, 64px);
  padding-top: clamp(44px, 5cqi, 64px);
  scroll-margin-top: 24px;
}

.decision-guide-page > main > .introduction {
  padding-top: 0;
  border-top: 0;
}

.decision-guide-page .introduction > .prose {
  grid-column: 2;
}

.decision-guide-page .prose table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.decision-guide-page .prose :is(th, td) {
  padding: 15px 12px;
  border-bottom: 1px solid #bfbfbc;
  text-align: start;
  vertical-align: top;
}

.decision-guide-page .fc-footer a {
  color: inherit;
  text-decoration: none;
}

.decision-guide-page .fc-footer a:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}

@container (max-width: 600px) {
  .decision-guide-page .hero h1 {
    font-size: clamp(38px, 11cqi, 58px);
  }

  .decision-guide-page .hero-base .guide-takeaway {
    margin-top: 26px;
    font-size: 29px;
  }

  .decision-guide-page > main > .reading {
    margin-bottom: 40px;
    padding-top: 36px;
  }

  .decision-guide-page > main > .introduction {
    padding-top: 0;
  }

  .decision-guide-page .reading > .side {
    margin-bottom: 16px;
  }
}

@container (max-width: 360px) {
  .decision-guide-page .hero-base .guide-takeaway {
    font-size: 27px;
  }
}

@media (pointer: coarse) {
  .decision-guide-page .fc-links a {
    display: flex;
    align-items: center;
    min-height: 44px;
  }
}