/* Hallmark · genre: editorial · macrostructure: Stat-Led · H4 knobs: number=tabular display, qualifier=below, secondary stats=row of four
 * theme: custom (PhoneReady brand, see tokens.css) · axes: light / roman-serif / chromatic-amber
 * enrichment: none · nav: N1a wordmark + 2 links (split, text, not sticky; the site has two destinations)
 * footer: Ft1 mast-headed (wordmark=display 2xl, tagline=roman, links inline) · CTA: C4 (reveal=after fold, bottom, hairline)
 * motion: number tick + CTA hover lift + call-bar slide · every number is real: 20-min call, 1 page, 24 h, 10+ yrs, $0 commissions
 * Hallmark · pre-emit critique: P5 H5 E4 S5 R4 V5
 */

body { padding-bottom: 5.5rem; }
@media (min-width: 60rem) { body { padding-bottom: 0; } }

/* N1a: wordmark left, two links right */
.nav-min { display: flex; align-items: center; justify-content: space-between; padding-block: var(--space-md); }
.nav-min ul { display: flex; gap: var(--space-lg); list-style: none; margin: 0; padding: 0; }
.nav-min a:not(.wordmark) {
  display: inline-flex; align-items: center; min-height: 2.75rem; white-space: nowrap;
  font-weight: 700; color: var(--color-ink); text-decoration: none;
  border-bottom: 2px solid transparent; transition: border-color var(--dur-short) var(--ease-out);
}
@media (hover: hover) { .nav-min a:not(.wordmark):hover { border-color: var(--color-accent); } }

/* H4: the figure is the biggest thing, the words finish the sentence */
.stat-hero { display: grid; gap: var(--space-md); padding-block: var(--space-lg) var(--space-2xl); }
.stat-hero__head { display: grid; gap: var(--space-xs); font-weight: 700; }
.stat-hero__figure { display: flex; align-items: baseline; gap: var(--space-sm); line-height: 0.82; }
.stat-hero__figure [data-count] {
  font-size: var(--text-figure); letter-spacing: -0.06em; color: var(--color-brand);
  font-variant-numeric: tabular-nums;
}
.stat-hero__unit { font-size: var(--text-xl); letter-spacing: -0.02em; color: var(--color-ink); }
.stat-hero__words { font-size: var(--text-display-s); line-height: 1.1; letter-spacing: -0.025em; max-width: 16ch; }
.stat-hero__qualifier { font-size: var(--text-md); line-height: 1.5; color: var(--color-ink-2); max-width: 32rem; }
.stat-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-md) var(--space-lg); margin-top: var(--space-xs); }

/* T4: four real numbers, hairlines between */
.strip { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 2px solid var(--color-ink); }
.strip > div { display: grid; gap: var(--space-2xs); padding: var(--space-md) var(--space-md) var(--space-lg) 0; border-bottom: var(--rule-hair) solid var(--color-rule-2); }
.strip > div:nth-child(odd) { padding-right: var(--space-md); border-right: var(--rule-hair) solid var(--color-rule-2); }
.strip > div:nth-child(even) { padding-left: var(--space-md); }
.strip b { font-family: var(--font-display); font-size: var(--text-xl); line-height: 1; color: var(--color-brand); }
.strip span { font-size: var(--text-sm); color: var(--color-ink-2); line-height: 1.4; }
@media (min-width: 60rem) {
  .strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .strip > div { border-right: var(--rule-hair) solid var(--color-rule-2); padding-inline: var(--space-md); }
  .strip > div:last-child { border-right: 0; }
}

/* The first bill, anchored by its total */
.bill-block { margin-top: var(--space-3xl); background: var(--color-paper-2); color: var(--color-ink); border-block: var(--rule-hair) solid var(--color-rule); }
.bill-block__inner { display: grid; gap: var(--space-xl); padding-block: var(--space-2xl); }
.bill-block__lead { display: grid; gap: var(--space-sm); }
.bill-block__figure { font-family: var(--font-display); font-weight: 700; font-size: var(--text-numeral); line-height: 0.9; letter-spacing: -0.04em; color: var(--color-ink); }
.bill-block h2 { font-size: var(--text-lg); max-width: 20ch; }
.bill-block .sheet-card { justify-self: start; }
.bill-block__table { max-width: 30rem; }
@media (min-width: 60rem) {
  .bill-block__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 26rem); align-items: start; }
  .bill-block__table { grid-column: 1; }
  .bill-block .sheet-card { grid-column: 2; grid-row: 1 / span 2; }
}

/* Prices as stat blocks, not cards */
.prices { display: grid; gap: var(--space-lg); padding-block: var(--space-3xl) var(--space-2xl); }
.prices h2 { font-size: var(--text-xl); }
.prices__row { display: grid; border-top: 2px solid var(--color-ink); }
.prices__stat { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); gap: var(--space-md); align-items: baseline; padding-block: var(--space-md); border-bottom: var(--rule-hair) solid var(--color-rule-2); }
.prices__stat b { font-family: var(--font-display); font-size: var(--text-xl); line-height: 1; color: var(--color-brand); }
.prices__stat span { color: var(--color-ink-2); line-height: 1.4; }
.prices__stat strong { display: block; color: var(--color-ink); }
.prices__stat--feature { background: var(--color-highlight); color: var(--color-highlight-ink); padding-inline: var(--highlight-inset, var(--space-sm)); margin-inline: calc(var(--highlight-inset, var(--space-sm)) * -1); }
.prices__stat--feature b { color: var(--color-highlight-figure); }
.prices__stat--feature span { color: var(--color-highlight-ink-2); }
.prices__stat--feature strong { color: var(--color-highlight-ink); }
.prices__more { display: grid; gap: var(--space-sm); max-width: 36rem; }
@media (min-width: 60rem) {
  .prices__row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .prices__stat { grid-template-columns: minmax(0, 1fr); border-right: var(--rule-hair) solid var(--color-rule-2); padding-inline: var(--space-md); margin: 0; }
  .prices__stat b { font-size: 3.5rem; }
}

/* Who: anchored by 10+ */
.who { background: var(--color-band); color: var(--color-band-ink); }
.who__inner { display: grid; gap: var(--space-md); padding-block: var(--space-2xl); }
.who__figure { font-family: var(--font-display); font-weight: 700; font-size: clamp(5rem, 24vw, 9rem); line-height: 0.85; letter-spacing: -0.05em; color: var(--color-band-accent); }
.who__text { display: grid; gap: var(--space-lg); max-width: 34rem; }
.who h2 { font-size: var(--text-lg); color: var(--color-band-ink); }
.who__me { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-md); align-items: center; }
@media (min-width: 60rem) { .who__inner { grid-template-columns: auto minmax(0, 1fr); gap: var(--space-2xl); align-items: end; } }

.promises { display: grid; gap: var(--space-xl); padding-block: var(--space-2xl); }
.promises > div { display: grid; gap: var(--space-sm); max-width: 34rem; }
.promises h2 { font-size: var(--text-md); }
@media (min-width: 60rem) { .promises { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.start { display: grid; gap: var(--space-md); padding-block: var(--space-xl) var(--space-3xl); max-width: 36rem; margin-inline: 0; border-top: 2px solid var(--color-ink); }
@media (min-width: 60rem) { .start { margin-inline: auto; } }
.start h2 { font-size: var(--text-xl); }

/* Ft1: the wordmark anchors one band */
.foot-mast { border-top: var(--rule-hair) solid var(--color-rule-2); }
.foot-mast__inner { display: grid; gap: var(--space-xs); padding-block: var(--space-xl) var(--space-2xl); }
.foot-mast__word { font-family: var(--font-display); font-weight: 700; font-size: var(--text-xl); letter-spacing: -0.02em; }
.foot-mast__tag { font-size: var(--text-md); color: var(--color-ink-2); }
.foot-mast__links a { display: inline-flex; align-items: center; min-height: 2.75rem; font-weight: 700; color: var(--color-brand); white-space: nowrap; }
.foot-mast__meta { font-size: var(--text-xs); color: var(--color-ink-2); }
