/* One type family across the public landing page. Existing element weights stay intact. */
@font-face {
  font-family: "Friday Golos Text";
  src: url("/static/fonts/GolosText-Variable.ttf?v=20260912-golos01") format("truetype");
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
}

html body.landing-rebuild:not(#ff-global-golos-a):not(#ff-global-golos-b):not(#ff-global-golos-c):not(#ff-global-golos-d):not(#ff-global-golos-e):not(#ff-global-golos-f) {
  --ff-global-golos: "Friday Golos Text", "Golos Text", "Noto Sans Devanagari", "Nirmala UI", Arial, sans-serif;
  --font-body: var(--ff-global-golos);
  --font-display: var(--ff-global-golos);
  --font-cyrillic-display: var(--ff-global-golos);
  --font-numeric: var(--ff-global-golos);
  --ff-nonbrand-heading: var(--ff-global-golos);
  --ff-configurator-font: var(--ff-global-golos);
  --ff-how-golos-heading: var(--ff-global-golos);
  --ff-hero-sf-expanded: "SF Pro", -apple-system, BlinkMacSystemFont, "SF Pro Display", var(--ff-global-golos);
  --ff-hero-expanded-black: var(--ff-hero-sf-expanded);
  font-family: var(--ff-global-golos) !important;
}

html body.landing-rebuild *:not(#ff-global-golos-a):not(#ff-global-golos-b):not(#ff-global-golos-c):not(#ff-global-golos-d):not(#ff-global-golos-e):not(#ff-global-golos-f) {
  font-family: var(--ff-global-golos) !important;
}

html body.landing-rebuild main.site-main
  .hero-shell:not(#ff-hero-sf-a):not(#ff-hero-sf-b):not(#ff-hero-sf-c):not(#ff-hero-sf-d):not(#ff-hero-sf-e):not(#ff-hero-sf-f):not(#ff-hero-sf-g),
html body.landing-rebuild main.site-main
  .hero-shell
  *:not(#ff-hero-sf-a):not(#ff-hero-sf-b):not(#ff-hero-sf-c):not(#ff-hero-sf-d):not(#ff-hero-sf-e):not(#ff-hero-sf-f):not(#ff-hero-sf-g) {
  font-family: var(--ff-hero-sf-expanded) !important;
  font-stretch: 132% !important;
  font-variation-settings: "wdth" 132 !important;
  font-optical-sizing: auto !important;
}

html body.landing-rebuild main.site-main .hero-premium-title
  .hero-premium-title-main:not(#ff-hero-sf-a):not(#ff-hero-sf-b):not(#ff-hero-sf-c):not(#ff-hero-sf-d):not(#ff-hero-sf-e):not(#ff-hero-sf-f):not(#ff-hero-sf-g),
html body.landing-rebuild main.site-main .hero-premium-title
  .hero-premium-title-accent:not(#ff-hero-sf-a):not(#ff-hero-sf-b):not(#ff-hero-sf-c):not(#ff-hero-sf-d):not(#ff-hero-sf-e):not(#ff-hero-sf-f):not(#ff-hero-sf-g),
html body.landing-rebuild main.site-main .hero-premium-metrics
  dd:not(#ff-hero-sf-a):not(#ff-hero-sf-b):not(#ff-hero-sf-c):not(#ff-hero-sf-d):not(#ff-hero-sf-e):not(#ff-hero-sf-f):not(#ff-hero-sf-g) {
  font-family: var(--ff-hero-expanded-black) !important;
  font-weight: 1000 !important;
  font-stretch: 132% !important;
  font-variation-settings: "wdth" 132, "wght" 1000 !important;
  font-optical-sizing: auto !important;
}

/* The hero statement and its numbers use Apple's expanded black display cut when available. */
html body.landing-rebuild main.site-main .hero-premium-title:not(#ff-hero-golos-a):not(#ff-hero-golos-b):not(#ff-hero-golos-c):not(#ff-hero-golos-d) {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  gap: 5px !important;
}

html body.landing-rebuild main.site-main .hero-premium-title
  .hero-premium-title-main:not(#ff-hero-golos-a):not(#ff-hero-golos-b):not(#ff-hero-golos-c):not(#ff-hero-golos-d),
html body.landing-rebuild main.site-main .hero-premium-title
  .hero-premium-title-accent:not(#ff-hero-golos-a):not(#ff-hero-golos-b):not(#ff-hero-golos-c):not(#ff-hero-golos-d) {
  min-width: 0 !important;
  max-width: 100% !important;
  font-family: var(--ff-hero-expanded-black) !important;
  font-style: normal !important;
  font-weight: 1000 !important;
  font-stretch: 132% !important;
  font-variation-settings: "wdth" 132, "wght" 1000 !important;
  font-optical-sizing: auto !important;
  letter-spacing: -0.045em !important;
  text-wrap: balance !important;
}

html body.landing-rebuild main.site-main .hero-premium-title
  .hero-premium-title-main:not(#ff-hero-golos-a):not(#ff-hero-golos-b):not(#ff-hero-golos-c):not(#ff-hero-golos-d) {
  font-size: clamp(2.2rem, 2.9vw, 2.85rem) !important;
  font-weight: 1000 !important;
  line-height: 0.92 !important;
  letter-spacing: -0.035em !important;
  color: rgba(255, 255, 255, 0.9) !important;
}

html body.landing-rebuild main.site-main .hero-premium-title
  .hero-premium-title-accent:not(#ff-hero-golos-a):not(#ff-hero-golos-b):not(#ff-hero-golos-c):not(#ff-hero-golos-d) {
  font-size: clamp(3.25rem, 5vw, 4.75rem) !important;
  line-height: 0.86 !important;
  white-space: normal !important;
}

/* Match the two primary section headings to the account-upgrades heading. */
html body.landing-rebuild main.site-main section#how-it-works.clarity-section
  .clarity-head
  h2:not(#ff-section-heading-a):not(#ff-section-heading-b):not(#ff-section-heading-c):not(#ff-section-heading-d):not(#ff-section-heading-e):not(#ff-section-heading-f),
html body.landing-rebuild main.site-main section#programs.programs-section
  .configurator-intro
  .configurator-intro-title
  h2:not(#ff-section-heading-a):not(#ff-section-heading-b):not(#ff-section-heading-c):not(#ff-section-heading-d):not(#ff-section-heading-e):not(#ff-section-heading-f) {
  width: auto !important;
  max-width: 10ch !important;
  margin: 0 auto !important;
  padding: 0 !important;
  font-family: var(--ff-global-golos) !important;
  color: #f7f5f2 !important;
  font-size: clamp(3.2rem, 5vw, 4.6rem) !important;
  font-style: normal !important;
  font-weight: 900 !important;
  font-stretch: 100% !important;
  font-variation-settings: normal !important;
  line-height: 0.92 !important;
  letter-spacing: -0.03em !important;
  text-align: center !important;
  text-transform: uppercase !important;
  text-wrap: balance !important;
  font-synthesis: none !important;
}

html body.landing-rebuild main.site-main section#programs.programs-section
  .configurator-intro
  .configurator-intro-title:not(#ff-section-wrap-a):not(#ff-section-wrap-b):not(#ff-section-wrap-c),
html body.landing-rebuild main.site-main section#programs.programs-section
  .configurator-intro
  > div:not(#ff-section-wrap-a):not(#ff-section-wrap-b):not(#ff-section-wrap-c) {
  width: 100% !important;
  max-width: none !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  justify-items: center !important;
  text-align: center !important;
}

html body.landing-rebuild main.site-main section#programs.programs-section
  .configurator-intro
  .configurator-intro-title
  h2
  .configurator-heading-accent:not(#ff-section-accent-a):not(#ff-section-accent-b):not(#ff-section-accent-c) {
  font-size: inherit !important;
  font-style: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  text-transform: inherit !important;
}

/* Keep the hero terms as one calm, legible information rail. */
html body.landing-rebuild main.site-main
  .hero-premium-metrics:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c) {
  margin-top: 24px !important;
  padding-top: 16px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html body.landing-rebuild main.site-main .hero-premium-metrics
  > div:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c) {
  gap: 4px !important;
}

html body.landing-rebuild main.site-main .hero-premium-metrics
  > div
  + div:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c) {
  border-left-color: rgba(255, 255, 255, 0.12) !important;
}

html body.landing-rebuild main.site-main .hero-premium-metrics
  dt:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c):not(#ff-hero-metrics-d) {
  color: rgba(255, 255, 255, 0.64) !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html body.landing-rebuild main.site-main .hero-premium-metrics
  dd:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c):not(#ff-hero-metrics-d) {
  max-width: 100% !important;
  color: rgba(255, 255, 255, 0.96) !important;
  font-family: var(--ff-hero-expanded-black) !important;
  font-size: clamp(2.1rem, 3vw, 2.75rem) !important;
  font-style: normal !important;
  font-weight: 1000 !important;
  font-stretch: 132% !important;
  font-variation-settings: "wdth" 132, "wght" 1000 !important;
  font-optical-sizing: auto !important;
  line-height: 1 !important;
  letter-spacing: -0.02em !important;
  font-variant-numeric: lining-nums tabular-nums !important;
  white-space: nowrap !important;
}

@media (max-width: 700px) {
  html body.landing-rebuild main.site-main section#how-it-works.clarity-section
    .clarity-head
    h2:not(#ff-section-heading-a):not(#ff-section-heading-b):not(#ff-section-heading-c):not(#ff-section-heading-d):not(#ff-section-heading-e):not(#ff-section-heading-f),
  html body.landing-rebuild main.site-main section#programs.programs-section
    .configurator-intro
    .configurator-intro-title
    h2:not(#ff-section-heading-a):not(#ff-section-heading-b):not(#ff-section-heading-c):not(#ff-section-heading-d):not(#ff-section-heading-e):not(#ff-section-heading-f) {
    width: 100vw !important;
    max-width: none !important;
    margin-right: calc(50% - 50vw) !important;
    margin-left: calc(50% - 50vw) !important;
    padding-right: 8px !important;
    padding-left: 8px !important;
    box-sizing: border-box !important;
    font-size: clamp(2.7rem, 13vw, 3.2rem) !important;
    line-height: 0.94 !important;
    letter-spacing: -0.035em !important;
    text-wrap: wrap !important;
  }
}

@media (max-width: 720px) {
  html body.landing-rebuild main.site-main .hero-premium-title
    .hero-premium-title-main:not(#ff-hero-golos-a):not(#ff-hero-golos-b):not(#ff-hero-golos-c):not(#ff-hero-golos-d) {
    width: 100% !important;
    font-size: clamp(1.3rem, 6.5vw, 2.5rem) !important;
  }

  html body.landing-rebuild main.site-main .hero-premium-title
    .hero-premium-title-accent:not(#ff-hero-golos-a):not(#ff-hero-golos-b):not(#ff-hero-golos-c):not(#ff-hero-golos-d) {
    font-size: clamp(2rem, 10vw, 3.75rem) !important;
    line-height: 0.88 !important;
  }

  html body.landing-rebuild main.site-main .hero-premium-metrics:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c) {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    width: 100% !important;
  }

  html body.landing-rebuild main.site-main .hero-premium-metrics
    > div:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c) {
    min-width: 0 !important;
    padding-inline: 7px !important;
  }

  html body.landing-rebuild main.site-main .hero-premium-metrics
    > div:first-child:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c) {
    padding-left: 0 !important;
  }

  html body.landing-rebuild main.site-main .hero-premium-metrics
    > div:last-child:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c) {
    padding-right: 0 !important;
  }

  html body.landing-rebuild main.site-main .hero-premium-metrics
    dt:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c):not(#ff-hero-metrics-d) {
    font-size: clamp(0.68rem, 3vw, 0.75rem) !important;
  }

  html body.landing-rebuild main.site-main .hero-premium-metrics
    dd:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c):not(#ff-hero-metrics-d) {
    max-width: 100% !important;
    font-size: clamp(1.35rem, 6vw, 1.875rem) !important;
    font-weight: 1000 !important;
    line-height: 1 !important;
    letter-spacing: -0.02em !important;
  }
}

@media (max-width: 480px) {
  html body.landing-rebuild main.site-main .hero-premium-metrics
    dt:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c):not(#ff-hero-metrics-d) {
    display: flex !important;
    inline-size: min-content !important;
    max-width: 100% !important;
    min-height: 2.5em !important;
    align-items: flex-start !important;
  }

  html[lang^="hi"] body.landing-rebuild main.site-main .hero-premium-metrics
    dt:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c):not(#ff-hero-metrics-d) {
    inline-size: max-content !important;
  }
}

@media (max-width: 420px) {
  html body.landing-rebuild main.site-main .hero-premium-actions
    :is(.hero-premium-primary, .hero-premium-secondary):not(#ff-hero-action-a):not(#ff-hero-action-b):not(#ff-hero-action-c) {
    padding-inline: 10px !important;
    font-size: 0.75rem !important;
  }

  html body.landing-rebuild main.site-main .hero-premium-actions
    .hero-premium-primary:not(#ff-hero-action-a):not(#ff-hero-action-b):not(#ff-hero-action-c) {
    gap: 7px !important;
  }
}

@media (max-width: 360px) {
  html body.landing-rebuild main.site-main .hero-premium-metrics
    > div:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c) {
    padding-inline: 2px !important;
    text-align: center !important;
  }

  html body.landing-rebuild main.site-main .hero-premium-metrics
    dd:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c):not(#ff-hero-metrics-d) {
    font-size: clamp(1.1rem, 5.9vw, 1.3rem) !important;
  }

  html body.landing-rebuild main.site-main .hero-premium-metrics
    dt:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c):not(#ff-hero-metrics-d) {
    font-size: 0.625rem !important;
    justify-self: center !important;
    justify-content: center !important;
  }

  html body.landing-rebuild main.site-main .hero-premium-metrics
    > div:first-child:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c) {
    padding-left: 0 !important;
  }

  html body.landing-rebuild main.site-main .hero-premium-metrics
    > div:last-child:not(#ff-hero-metrics-a):not(#ff-hero-metrics-b):not(#ff-hero-metrics-c) {
    padding-right: 0 !important;
  }

  html body.landing-rebuild .mobile-cta-bar
    .mobile-cta-bar-inner:not(#ff-mobile-cta-a):not(#ff-mobile-cta-b):not(#ff-mobile-cta-c) {
    grid-template-columns: minmax(0, 1.18fr) minmax(0, 0.9fr) !important;
    gap: 6px !important;
    padding: 7px !important;
  }

  html body.landing-rebuild .mobile-cta-bar
    .site-button:not(#ff-mobile-cta-a):not(#ff-mobile-cta-b):not(#ff-mobile-cta-c) {
    min-width: 0 !important;
    gap: 5px !important;
    padding-inline: 7px !important;
    font-size: clamp(0.66rem, 3.35vw, 0.72rem) !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
  }

  html body.landing-rebuild .mobile-cta-bar
    .site-button-telegram:not(#ff-mobile-cta-a):not(#ff-mobile-cta-b):not(#ff-mobile-cta-c)::before {
    flex-basis: 15px !important;
    width: 15px !important;
    height: 15px !important;
  }

  html body.landing-rebuild main.site-main .hero-premium-actions
    :is(.hero-premium-primary, .hero-premium-secondary):not(#ff-hero-action-a):not(#ff-hero-action-b):not(#ff-hero-action-c) {
    padding-inline: 8px !important;
    font-size: 0.75rem !important;
  }

  html body.landing-rebuild main.site-main .hero-premium-actions
    .hero-premium-primary:not(#ff-hero-action-a):not(#ff-hero-action-b):not(#ff-hero-action-c) {
    gap: 7px !important;
  }

  html body.landing-rebuild main.site-main .hero-premium-actions
    .hero-premium-plus:not(#ff-hero-action-a):not(#ff-hero-action-b):not(#ff-hero-action-c) {
    flex-basis: 20px !important;
    width: 20px !important;
    height: 20px !important;
    font-size: 0.9rem !important;
  }
}

@media (max-width: 330px) {
  html body.landing-rebuild main.site-main .hero-premium-actions:not(#ff-hero-action-a):not(#ff-hero-action-b):not(#ff-hero-action-c) {
    grid-template-columns: 1fr !important;
  }
}
