/* type.css — the type scale. Loaded after styles.css so it wins; styles.css is
   the designed sheet and is not edited. One ramp, real display sizes, optical
   sizing on the variable display face, measure caps, and per-family metrics
   the factory injects for member fonts (--display-weight / --display-tracking /
   --display-opsz) so a Montserrat page does not inherit Fraunces proportions.

   Hierarchy comes from contrast in size, weight and measure — never from
   decoration (no pills, no dots, no partial underlines). */

:root {
  --display-weight: 500;         /* Fraunces reads best at 500 for display */
  --display-tracking: -0.022em;
  --display-opsz: 144;           /* Fraunces optical size axis; ignored by static faces */
  --t-h1: clamp(2.75rem, 6.2vw, 4.75rem);
  --t-h2: clamp(2rem, 4.3vw, 3.25rem);
  --t-h3: 1.375rem;
  --t-lede: 1.125rem;
  --t-body: 1rem;
  --t-label: 0.72rem;
  --measure-h1: 20ch;
  --measure-h2: 26ch;
  --measure-lede: 58ch;
}

h1, h2, h3, .h1, .h2, .h3, .use-verdict, .range-figure, .fin-line, .viewer-size, .plan-card-size, .step-n {
  font-family: var(--font-display);
  font-weight: var(--display-weight);
  letter-spacing: var(--display-tracking);
  font-variation-settings: "opsz" var(--display-opsz);
  font-feature-settings: "kern", "liga", "ss01";
  text-wrap: balance;
}

.h1 { font-size: var(--t-h1); line-height: 0.98; max-width: var(--measure-h1); margin-inline: auto; }
.h2 { font-size: var(--t-h2); line-height: 1.04; max-width: var(--measure-h2); }
.center .h2, .center > .h2 { margin-inline: auto; }
.h3 { font-size: var(--t-h3); line-height: 1.22; letter-spacing: -0.012em; font-variation-settings: "opsz" 48; }
h3.h3 + p, .card h3 + p { margin-top: 0.5rem; }

/* Rhythm: label → heading → lede. Tighter than the defaults, consistent everywhere. */
.label { font-size: var(--t-label); font-weight: 600; letter-spacing: 0.16em; }
.label + .h1, .label + .h2 { margin-top: 0.9rem !important; }
.hero-eyebrow { margin-bottom: 0.9rem; }
.lede { font-size: var(--t-lede); line-height: 1.55; max-width: var(--measure-lede); }
.center .lede, .center > .lede { margin-inline: auto; }
.h1 + .lede { margin-top: 1.25rem; }
.h2 + .lede { margin-top: 1rem; }

/* Emphasis inside headings: italic accent keeps the same size and weight. */
.italic-wood, .italic-accent { font-weight: inherit; letter-spacing: inherit; }

/* Body copy: a touch larger, steady leading. */
p, li, dd, dt { font-size: var(--t-body); }
.card p, .pointlist p, .faq p { font-size: 0.9375rem; line-height: 1.6; }

/* Numbers that carry meaning read as display, tabular. */
.viewer-size { font-size: 1.85rem; }
.plan-card-size { font-size: 1.6rem; }
.step-n { font-size: 2rem; }
.range-figure { font-size: clamp(2rem, 4.5vw, 2.75rem); font-variant-numeric: tabular-nums; }
.use-verdict { font-size: 1.3rem; font-weight: 600; font-variation-settings: "opsz" 48; letter-spacing: -0.005em; }
.fin-line { font-size: clamp(1.4rem, 3vw, 1.85rem); }

/* Form / small UI text stays sans and quiet. */
.form-card-head h2 { font-family: var(--font-display); font-size: 1.5rem; }

@media (max-width: 48rem) {
  :root { --measure-h1: 14ch; --measure-h2: 20ch; }
  .h1 { line-height: 1.02; }
}
