/*
 * Világfa text + alignment system
 * Based on Apple HIG principles: readable line lengths, consistent alignment,
 * leading-edge scanning for longer text, centered display copy only where intentional,
 * and responsive layout that preserves hierarchy across viewport sizes.
 */

:root {
  --vf-reading-narrow: 34ch;
  --vf-reading: 48ch;
  --vf-reading-wide: 62ch;
  --vf-display: 20ch;
  --vf-section-head: 46ch;
  --vf-gutter: clamp(20px, 5.5vw, 80px);
  --vf-copy-leading: 1.72;
  --vf-display-leading: 1.02;
}

body { text-align: start; }

body p,
body li,
body blockquote,
body .contact-row .value,
body .contact-row small,
body .info-block .note,
body .program-note {
  overflow-wrap: normal;
  word-break: normal;
  hyphens: auto;
  text-wrap: pretty;
}

body p,
body li { line-height: var(--vf-copy-leading); }

body h1,
body h2,
body h3,
body .theme,
body .date,
body .price,
body .format-card .value { text-wrap: balance; }

body .copy,
body .copy p,
body .layers,
body .layer,
body .learn-list,
body .learn-row,
body .month,
body .month ul,
body .contact-card,
body .contact-row,
body .info-grid,
body .info-block,
body .price-card,
body .program-note { text-align: start; }

body .copy p,
body .layer p,
body .info-block .note,
body .program-note { max-width: var(--vf-reading); }

body .month ul,
body .contact-row .value,
body .contact-row small,
body .price-list,
body .learn-row p { max-width: var(--vf-reading-wide); }

body .hero,
body .quote,
body .section-head,
body .footer { text-align: center; }

body .hero-inner,
body .section-head,
body .footer .wrap { margin-inline: auto; }

body .hero h1 {
  max-width: 12ch;
  line-height: .94;
  text-wrap: balance;
}

body .hero-sub {
  max-width: 44ch;
  text-wrap: balance;
  line-height: 1.55;
}

body .section-head { max-width: 760px; }

body .section-head h2 {
  max-width: 18ch;
  margin-inline: auto;
  line-height: var(--vf-display-leading);
}

body .section-head p {
  max-width: var(--vf-section-head);
  margin-inline: auto;
  line-height: 1.62;
  text-wrap: pretty;
}

body .quote blockquote {
  max-width: 28ch;
  text-wrap: balance;
}

body .footer h2 {
  max-width: 18ch;
  text-wrap: balance;
}

body .footer > div > p,
body .footer-note {
  max-width: 54ch;
  margin-inline: auto;
}

body .learn-row h3,
body .learn-row p,
body .month .date,
body .month .theme,
body .month li,
body .contact-card h3,
body .contact-row .label,
body .contact-row .value,
body .info-block h3,
body .format-card,
body .price-card,
body .price-list { text-align: start; }

body .learn-row {
  grid-template-columns: 58px minmax(180px, .8fr) minmax(0, 1.7fr);
}

body .contact-row .value,
body .contact-row small { overflow-wrap: break-word; }

body .btn,
body .hero-pill,
body .nav-menu .nav-cta,
body .tag,
body .eyebrow { text-align: center; }

body .feature-grid .copy {
  justify-self: start;
  width: min(100%, 620px);
}

body .feature-grid.reverse .copy { justify-self: start; }
body .copy h2 { max-width: 16ch; }
body .month .theme { max-width: 24ch; }
body .contact-card h3,
body .info-block h3 { max-width: 24ch; }

/* Registration page contract */
body .form-hero { text-align: center; }
body .form-hero h1 {
  max-width: 16ch;
  margin-inline: auto;
  text-wrap: balance;
}
body .form-hero p {
  max-width: 46ch;
  margin-inline: auto;
  text-align: center;
  line-height: 1.62;
  text-wrap: pretty;
}
body .form-wrap,
body .card,
body .program-summary,
body fieldset,
body .field,
body .highlight-box,
body .gdpr-box { text-align: start; }
body .program-summary h2,
body legend,
body .field label,
body .legend-note,
body .hint,
body .opt,
body .gdpr-box { text-wrap: pretty; }
body .program-summary h2,
body legend { max-width: 28ch; }
body .program-summary li,
body .legend-note,
body .gdpr-box { max-width: 58ch; }
body .field label { max-width: 52ch; }
body .opt { line-height: 1.5; }
body .btn-submit { text-align: center; }

/* Long-form legal/privacy page contract */
body > main:not(.form-wrap) { text-align: start; }
body > main:not(.form-wrap) p,
body > main:not(.form-wrap) li {
  max-width: 68ch;
  text-align: start;
}
body > main:not(.form-wrap) h2 {
  max-width: 30ch;
  text-align: start;
  line-height: 1.12;
  text-wrap: balance;
}
body > main:not(.form-wrap) ul { max-width: 68ch; }
body > footer:not(.footer) { text-align: center; }

@media (min-width: 1200px) {
  body .wrap { width: min(1180px, calc(100vw - 2 * var(--vf-gutter))); }
  body .hero h1 { max-width: 11.5ch; }
  body .section-head p { max-width: 52ch; }
}

@media (max-width: 1024px) {
  body .hero h1 { max-width: 11ch; }
  body .feature-grid { gap: clamp(36px, 5vw, 58px); }
  body .copy p { max-width: 50ch; }
}

@media (max-width: 900px) {
  body .feature-grid .copy,
  body .feature-grid.reverse .copy {
    max-width: 680px;
    width: 100%;
    justify-self: stretch;
  }
  body .copy p { max-width: 54ch; }
  body .learn-row {
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: start;
  }
  body .learn-row p { grid-column: 2; }
  body .section-head h2 { max-width: 16ch; }
}

@media (max-width: 768px) {
  body .hero h1 { max-width: 10.8ch; }
  body .hero-sub { max-width: 38ch; }
  body .section-head { max-width: 620px; }
  body .section-head p { max-width: 42ch; }
  body .copy h2 { max-width: 18ch; }
  body .form-hero h1 { max-width: 13ch; }
  body .form-hero p { max-width: 40ch; }
}

@media (max-width: 640px) {
  :root {
    --vf-reading: 100%;
    --vf-reading-wide: 100%;
  }

  body .hero .eyebrow {
    max-width: none;
    white-space: nowrap;
    font-size: .64rem;
    letter-spacing: .075em;
    line-height: 1.25;
    margin-inline: auto;
    margin-bottom: 18px;
  }

  body .hero h1 {
    max-width: 11.6ch;
    line-height: .94;
    font-size: clamp(2.85rem, 13vw, 4.35rem);
  }

  body .hero-sub {
    max-width: 33ch;
    line-height: 1.55;
  }

  body .section-head { margin-bottom: 42px; }
  body .section-head h2 { max-width: 12.5ch; }
  body .section-head p { max-width: 32ch; }
  body .quote blockquote { max-width: 18ch; }
  body .copy h2,
  body .copy p,
  body .layers,
  body .month,
  body .contact-card,
  body .info-block,
  body .price-card,
  body .program-note { text-align: start; }
  body .copy h2 { max-width: 16ch; }
  body .learn-row { gap: 10px 14px; }
  body .month ul { padding-left: 1.15rem; }
  body .month .theme,
  body .contact-card h3,
  body .info-block h3 { max-width: none; }
  body .form-hero p {
    max-width: 32ch;
    text-align: center;
  }
  body .program-summary h2,
  body legend { max-width: 22ch; }
  body > main:not(.form-wrap) p,
  body > main:not(.form-wrap) li,
  body > main:not(.form-wrap) ul { max-width: none; }

  /* Footer metadata is reading content, not display content. */
  body .footer .footer-note {
    width: 100%;
    max-width: 34rem !important;
    padding: 24px 0 0 !important;
    text-align: start;
    font-size: .82rem !important;
    line-height: 1.65 !important;
    text-wrap: pretty;
  }

  body .footer .footer-note br { display: block; }
}

@media (max-width: 390px) {
  body .wrap { width: calc(100% - 36px); }

  body .hero .eyebrow {
    font-size: .61rem;
    letter-spacing: .055em;
  }

  body .hero h1 {
    max-width: 11.7ch;
    font-size: clamp(2.8rem, 12.9vw, 3.45rem);
  }
  body .hero-sub { max-width: 30.5ch; }
  body .section-head h2 { max-width: 11.5ch; }
  body .section-head p { max-width: 30ch; }
  body .quote blockquote { max-width: 16.5ch; }
  body .contact-card,
  body .info-block,
  body .price-card,
  body .month { text-align: start; }
  body .form-hero h1 { max-width: 11ch; }
  body .form-hero p { max-width: 29ch; }
  body .program-summary,
  body .highlight-box,
  body .gdpr-box { padding-inline: 1.1rem; }
  body .back-link { max-width: 15ch; line-height: 1.35; }

  body .footer .footer-note {
    max-width: 100% !important;
    padding-inline: 2px !important;
  }
}

@media (max-width: 340px) {
  body .hero .eyebrow {
    font-size: .565rem;
    letter-spacing: .025em;
  }

  body .hero h1 {
    max-width: 11.6ch;
    font-size: clamp(2.5rem, 12.5vw, 3rem);
  }

  body .hero-cta,
  body .footer-cta {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  body .hero-cta .btn,
  body .footer-cta .btn {
    width: 100%;
  }
}

@media (max-width: 320px) {
  body .wrap { width: calc(100% - 28px); }
  body .hero h1 { max-width: 11.5ch; }
  body .hero-sub { max-width: 28ch; }
  body .section-head h2 { max-width: 10.5ch; }
  body .section-head p { max-width: 28ch; }
  body .btn { max-width: 100%; }
  body .form-hero h1 { max-width: 10ch; }
  body .form-hero p { max-width: 27ch; }
  body .program-summary li,
  body .legend-note,
  body .field label,
  body .opt,
  body .gdpr-box { overflow-wrap: break-word; }
}

/* 2026-08-29 — refined display type scale */
body .hero h1 { font-size: clamp(2.65rem, 5.2vw, 4.9rem); line-height: .98; }
body .copy h2 { font-size: clamp(1.95rem, 3vw, 2.95rem); line-height: 1.06; }
body .section-head h2 { font-size: clamp(2rem, 3.15vw, 3.05rem); line-height: 1.06; }
body .footer h2 { font-size: clamp(2rem, 3.35vw, 3.2rem); line-height: 1.05; }
body .form-hero h1 { font-size: clamp(2.35rem, 4.5vw, 4.25rem); line-height: 1; }
body > main:not(.form-wrap) h1 { font-size: clamp(2.35rem, 4.5vw, 4.1rem); line-height: 1.02; }
body > main:not(.form-wrap) h2 { font-size: clamp(1.7rem, 2.7vw, 2.5rem); line-height: 1.1; }
@media (max-width: 640px) {
  body .hero h1 { font-size: clamp(2.35rem, 10vw, 3.15rem); line-height: .99; }
  body .copy h2, body .section-head h2 { font-size: clamp(1.85rem, 8vw, 2.45rem); }
  body .footer h2 { font-size: clamp(1.95rem, 8.5vw, 2.6rem); }
  body .form-hero h1, body > main:not(.form-wrap) h1 { font-size: clamp(2.1rem, 9vw, 2.9rem); }
}
body .hero h1{font-size:clamp(2.65rem,5.2vw,4.9rem)!important;line-height:.98!important}body .copy h2{font-size:clamp(1.95rem,3vw,2.95rem)!important;line-height:1.06!important}body .section-head h2{font-size:clamp(2rem,3.15vw,3.05rem)!important;line-height:1.06!important}body .footer h2{font-size:clamp(2rem,3.35vw,3.2rem)!important;line-height:1.05!important}body .form-hero h1{font-size:clamp(2.35rem,4.5vw,4.25rem)!important;line-height:1!important}@media(max-width:640px){body .hero h1{font-size:clamp(2.35rem,10vw,3.15rem)!important}body .copy h2,body .section-head h2{font-size:clamp(1.85rem,8vw,2.45rem)!important}body .footer h2{font-size:clamp(1.95rem,8.5vw,2.6rem)!important}body .form-hero h1{font-size:clamp(2.1rem,9vw,2.9rem)!important}}