/* Landing-page rhythm, shared with the standalone persona document.
   Section padding, heading-to-copy spacing and content gaps have one source. */
:root {
  --site-font-sans: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --site-heading-serif: "Iowan Old Style", "Baskerville", "Palatino Linotype", Georgia, serif;
  --site-title-scale: .8;
  --site-hero-heading-base: clamp(64px, 6.1vw, 105px);
  --site-hero-heading-size: calc(var(--site-hero-heading-base) * var(--site-title-scale));
  --site-heading-size: calc(var(--site-hero-heading-size) * .7);
  --site-heading-leading: 1.08;
  --site-heading-tracking: -.045em;
  --site-subheading-size: 16px;
  --site-subheading-leading: 1.5;
  --site-subheading-tracking: -.012em;
  --site-content-width: 1280px;
  --site-page-gutter: clamp(64px, 5vw, 80px);
  --site-section-space: clamp(48px, 5vw, 80px);
  /* Outer phone spacing only; pinned stages keep their authored rhythm. */
  --site-mobile-section-space: 32px;
  --site-content-gap: clamp(24px, 3vw, 40px);
  --site-copy-gap: 16px;
  --site-control-gap: 24px;
  --site-device-heading-gap: clamp(32px, 4svh, 48px);
}
h1 em, h2 em { font-family: var(--site-heading-serif); font-weight: 400; font-style: italic; }
@media (max-width: 1100px) and (min-width: 760px) {
  :root { --site-hero-heading-base: 7.4vw; }
}
@media (max-width: 759px) {
  :root {
    --site-hero-heading-base: clamp(58px, 12vw, 76px);
    --site-page-gutter: 20px;
    --site-section-space: 48px;
    --site-content-gap: 24px;
  }
}
@media (max-width: 359px) {
  :root { --site-page-gutter: 16px; }
}
@media (max-height: 730px) and (min-width: 760px) {
  :root { --site-hero-heading-base: clamp(60px, 6vw, 86px); }
}
/* A compact rhythm leaves room for previews on short pinned stages. */
@media (max-height: 540px) {
  :root { --site-section-space: 24px; --site-mobile-section-space: 24px; --site-content-gap: 16px; --site-copy-gap: 12px; --site-control-gap: 16px; }
}
