/* Syne ink hangs below the CSS line box. Clear every line, not just the last. */
:root {
  --descender-room: 0.28em;
  --descender-tight: 0.2em;
  --descender-rhythm: 0;
  --lh-display: 1.42;
  --lh-heading: 1.32;
}

h1,
h2,
h3,
.hero-copy h1,
.scene h2,
.section-heading h2,
.start h2,
.product-reveal strong,
.site-header .brand strong,
.pricing-card h3,
.plan-card h3,
.managed-plans h3,
.final-cta h1,
.product-film h2,
.demo-beat,
.outcome-strip h3,
.outcome-lead blockquote,
.word-stamp,
.display-line {
  overflow: visible;
  overflow-wrap: break-word;
}

/* One line box per painted line — padding clears g/y/p on every wrap */
.display-line {
  display: inline-block;
  max-width: 100%;
  padding-block: 0.12em 0.22em;
  line-height: inherit;
  vertical-align: baseline;
}

h1,
.hero-copy h1,
.final-cta h1 {
  line-height: var(--lh-display);
  padding-block-end: var(--descender-room);
  margin-block-end: var(--descender-rhythm);
}

h2,
h3,
.scene h2,
.product-film h2,
.start h2,
.section-heading h2,
.pricing-card h3,
.plan-card h3,
.managed-plans h3,
.outcome-strip h3 {
  line-height: var(--lh-heading);
  padding-block-end: var(--descender-tight);
  margin-block-end: var(--descender-rhythm);
}

.demo-beat {
  line-height: 1.35;
  padding-block-end: var(--descender-tight);
}

.word-stamp {
  line-height: 1.2;
  padding: .12em .18em .2em;
  transform: none;
}

.hero,
.hero-copy,
.hero-stage,
.read-surface,
.scene,
.journey,
.start,
.product-film,
.site-header {
  overflow: visible;
}

.hero-stage {
  padding-block-end: calc(1.2rem + var(--descender-room));
}