/* Display face verified against the reference website; long copy uses its reading face. */
@font-face {
  font-family: 'PODIUM Sharp';
  src: url('assets/fonts/podium-sharp.woff2') format('woff2'),
       url('assets/fonts/podium-sharp.ttf') format('truetype');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root { --font-display: 'PODIUM Sharp', sans-serif; }

h1, h2, h3, .person-name, .button, .stair-number, .founder-outline {
  font-family: var(--font-display);
  font-weight: 400;
  font-synthesis: none;
  text-transform: uppercase;
}

h1, h2, h3 { letter-spacing: .03em; }
.hero h1 {
  font-size: clamp(58px, 6.5vw, 96px);
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: .03em;
  max-width: 1200px;
  padding-inline: 25px;
}
.hero h1 .blue { font-weight: inherit; }
.serif-word:after { bottom: -3px; }
.section-heading h2 { font-size: 58px; line-height: 1.2; letter-spacing: .03em; }
.gap-section .section-heading h2 { font-size: 56px; }
.letter h2 { font-size: 60px; line-height: 1.2; }
.closing h2 { font-size: 78px; font-weight: 400; line-height: 1.2; letter-spacing: .03em; }

.button { font-size: 20px; line-height: 1.15; letter-spacing: .02em; padding: 15px 25px; }
.button-small { font-size: 17px; padding: 12px 19px; }
.person-name { font-size: 26px; line-height: 1.2; letter-spacing: .01em; }
.hero-person figcaption > span + span { margin-top: 7px; }
.pain-row h3 { font-size: 26px; line-height: 1.2; }
.stair h3 { font-size: 25px; line-height: 1.2; }
.stair-number { font-size: 51px; letter-spacing: .03em; margin-bottom: 16px; }
.stair-1 .stair-body { height: 225px; }
.stair-2 .stair-body { height: 265px; }
.stair-3 .stair-body { height: 305px; }
.stair-4 .stair-body { height: 345px; }
.founder-label h3 { font-size: 33px; line-height: 1.15; }
.founder-outline { font-size: 62px; letter-spacing: .03em; }
.roadmap-panel h3 { font-size: 45px; line-height: 1.2; letter-spacing: .03em; }
.principles h3, .truths h3 { font-size: 24px; line-height: 1.18; }
.truths > div > span { top: 6px; }
.fit-grid h3 { font-size: 40px; line-height: 1.2; letter-spacing: .03em; }
.workshop-guide h3 { font-size: 37px; line-height: 1.13; letter-spacing: .03em; }
.copy-button { font-size: 18px; min-height: 50px; }

.hero h1, .hero h1 .blue, .section-heading h2, .letter h2, .closing h2,
.pain-row h3, .stair h3, .founder-label h3, .roadmap-panel h3,
.principles h3, .truths h3, .fit-grid h3, .workshop-guide h3 {
  font-weight: 400;
}

@media (max-width: 1150px) {
  .section-heading h2, .gap-section .section-heading h2 { font-size: 49px; }
  .letter h2 { font-size: 53px; }
  .closing h2 { font-size: 67px; }
  .nav-cta { font-size: 16px; padding: 11px 16px; }
  .pain-row h3 { font-size: 23px; }
  .stair h3 { font-size: 22px; }
  .person-name { font-size: 24px; }
  .roadmap-panel h3 { font-size: 39px; }
  .principles h3, .truths h3 { font-size: 22px; }
  .fit-grid h3 { font-size: 35px; }
  .workshop-guide h3 { font-size: 33px; }
}

@media (min-width: 701px) and (max-width: 900px) {
  .desktop-nav { gap: 13px; }
  .nav-cta { font-size: 15px; padding-inline: 13px; }
  .section-heading h2, .gap-section .section-heading h2 { font-size: 43px; }
  .hero .button { font-size: 18px; padding-inline: 20px; }
  .stair h3 { font-size: 21px; }
  .stair-number { font-size: 44px; }
  .founder-outline { font-size: 49px; }
  .founder-label h3 { font-size: 29px; }
}

@media (max-width: 700px) {
  .hero h1 { font-size: clamp(43px, 11.5vw, 65px); line-height: 1.2; letter-spacing: .03em; padding-inline: 20px; }
  .section-heading h2, .gap-section .section-heading h2 { font-size: 43px; line-height: 1.2; }
  .letter h2 { font-size: 45px; }
  .closing h2 { font-size: 53px; line-height: 1.2; letter-spacing: .03em; }
  .hero-actions .button-primary { font-size: 18px; padding: 14px 22px; }
  .hero-actions .button-glass { font-size: 16px; padding: 11px 17px; }
  .nav-cta { font-size: 13px; padding: 11px; gap: 6px; white-space: nowrap; flex-shrink: 0; }
  .person-name { font-size: 21px; }
  .hero-person figcaption > span + span { margin-top: 5px; }
  .pain-row h3 { font-size: 23px; }
  .stair h3 { font-size: 24px; }
  .stair-number { font-size: 46px; }
  .stair { display: flex; flex-direction: column; }
  .stair-1 .stair-body, .stair-2 .stair-body,
  .stair-3 .stair-body, .stair-4 .stair-body { height: auto; min-height: 285px; flex: 1; }
  .founder-label h3 { font-size: 26px; }
  .founder-outline { font-size: 38px; }
  .roadmap-panel h3 { font-size: 37px; }
  .principles h3, .truths h3 { font-size: 23px; }
  .fit-grid h3 { font-size: 36px; }
  .workshop-guide h3 { font-size: 34px; }
  .copy-button { font-size: 18px; }
  .closing .button { font-size: 18px; }
}

@media (max-width: 370px) {
  .hero h1 { font-size: 41px; }
  .section-heading h2, .gap-section .section-heading h2 { font-size: 39px; }
  .closing h2 { font-size: 47px; }
  .person-name { font-size: 19px; }
  .nav-cta { font-size: 12px; padding-inline: 10px; }
}

/* Supplied brand artwork and optical centering for PODIUM's cap-height. */
.brand { flex-shrink: 0; }
.brand-logo { width: 76px; height: auto; object-fit: contain; }
.footer-main .brand-logo { width: 100px; }
.nav-cta .button-label { display: block; transform: translateY(.1em); }

@media (max-width: 700px) {
  .header .brand-logo { width: 64px; }
  .footer-main .brand-logo { width: 88px; }
}