/* Shared frame for the section rework: one sub-block pattern, one label tier, one spacing rhythm.
   Loaded after styles.css and before the per-section files. */

:root {
  --disabled-ink: #5f5c58;
  --block-gap-above: clamp(2.5rem, 1.5rem + 3vw, 4rem);
  --block-gap-below: clamp(2rem, 1.25rem + 2vw, 3rem);
}

/* Every ruled sub-block shares the same, tighter gap. */
.same,
.care-block,
.costs-block,
.later-block,
.split-rule {
  margin-top: var(--block-gap-above);
  padding-top: var(--block-gap-below);
}

/* Sub-block: label and one-line answer on the left, detail on the right. Stacked on a phone. */
.blk {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--stack-3) clamp(2rem, 5vw, 5rem);
  margin-top: var(--block-gap-above);
  padding-top: var(--block-gap-below);
  border-top: 1px solid var(--rule-on-light);
}
.blk-label {
  font-size: 1.0625rem;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--ink);
}
.blk-statement {
  margin-top: var(--stack-1);
  max-width: 18ch;
  font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.125rem);
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -0.025em;
  text-wrap: balance;
}
.blk-note {
  margin-top: var(--stack-2);
  max-width: 30rem;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--deep-soft);
}
.blk-body {
  min-width: 0;
}
@media (min-width: 900px) {
  .blk {
    grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
  }
}

/* Terms: a short label and one or two lines under it. */
.terms {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--stack-3) clamp(1.5rem, 3vw, 3rem);
}
.terms dt {
  font-size: 1.0625rem;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--ink);
}
.terms dd {
  margin-top: 0.375rem;
  max-width: 30rem;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--deep-soft);
}
.terms-4 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
/* Ledger variant: one term per row, a hairline between rows. */
.terms-rows {
  gap: 0;
}
.terms-rows > div {
  padding-block: 1.125rem;
  border-top: 1px solid var(--rule-on-light);
}
.terms-rows > div:first-child {
  padding-top: 0;
  border-top: 0;
}
@media (min-width: 900px) {
  .terms-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .terms-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .terms-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* An A4 page is narrower than 900px: keep the terms in columns in the PDF. */
@media print {
  .terms-2,
  .terms-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .terms-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* The letter's title scale, shared by the hero and the closing. */
.title-letter {
  max-width: 26ch;
  font-size: clamp(1.875rem, 1.25rem + 2.4vw, 3rem);
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -0.025em;
  text-wrap: balance;
}