/* Shared hero typography. Keep all viewport sizes and vertical rhythm here.
 * The important layer beats Kadence's generated and legacy !important styles
 * without escalating selector specificity. Colours and hero layouts stay local.
 */
@font-face {
  font-family: "Source Serif 4";
  src: url("fonts/source-serif-4-regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@layer gek-typography {
  :is(.gek-design-concept, .gek-editable-block-page, .gek-app-demo) {
    --gek-display-font: "Source Serif 4", Georgia, serif !important;
    --gek-type-h1: 4rem !important;
    --gek-type-h2: 2.75rem !important;
    --gek-hero-lead-size: 1.125rem !important;
    --gek-hero-kicker-gap: 1rem !important;
    --gek-hero-lead-gap: 1.5rem !important;
    --gek-hero-action-gap: 1.75rem !important;
  }

  :is(.gek-editable-block-page, .gek-app-demo) h1 {
    font-family: var(--gek-display-font) !important;
    font-size: var(--gek-type-h1) !important;
    font-weight: 400 !important;
    font-style: normal !important;
    font-synthesis: none !important;
    font-kerning: normal !important;
    font-feature-settings: normal !important;
    letter-spacing: -.015em !important;
    line-height: 1.16 !important;
    text-transform: none !important;
    text-wrap: balance !important;
    white-space: normal !important;
    hyphens: manual !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 38.75rem !important;
    height: auto !important;
    max-height: none !important;
    margin-block: 0 !important;
    padding-block: 0 !important;
  }

  :is(.gek-editable-block-page, .gek-app-demo) h1 :is(span, b, strong, em) {
    font: inherit !important;
    letter-spacing: inherit !important;
    line-height: inherit !important;
  }

  /* Match both native markup and Gutenberg's inner-container wrappers. */
  :is(.gek-editable-block-page, .gek-app-demo) :has(> h1),
  .gek-editable-block-page :has(> .wp-block-group__inner-container > h1) {
    row-gap: 0 !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: none !important;
  }

  :is(.gek-editable-block-page, .gek-app-demo) p:has(+ h1) {
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: .75rem !important;
    font-weight: 700 !important;
    letter-spacing: .12em !important;
    line-height: 1.5 !important;
    text-transform: uppercase !important;
    margin-block: 0 var(--gek-hero-kicker-gap) !important;
    padding-block: 0 !important;
  }

  :is(.gek-editable-block-page, .gek-app-demo) h1 + :is(p, span),
  .gek-editable-block-page .gek-members-hero__copy p:first-child,
  .gek-editable-block-page .gek-members-hero__copy > .wp-block-group__inner-container > p:first-child {
    display: block;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: var(--gek-hero-lead-size) !important;
    font-weight: 400 !important;
    letter-spacing: normal !important;
    line-height: 1.65 !important;
    max-width: 52ch !important;
    margin-block: var(--gek-hero-lead-gap) 0 !important;
    padding-block: 0 !important;
  }

  :is(.gek-editable-block-page, .gek-app-demo) h1 + :is(p, span) + :is(div, p, a) {
    margin-top: var(--gek-hero-action-gap) !important;
  }

  /* Preserve the centred layout of the Part / passer hero. */
  .gek-editable-block-page .gek-part-hero h1,
  .gek-editable-block-page .gek-part-hero h1 + p {
    margin-inline: auto !important;
    text-align: center !important;
  }

  /* Members hero: introduction and contact on the left, an overview card on the right. */
  .gek-editable-block-page .gek-members-hero--card .gek-members-hero__grid > .wp-block-group__inner-container {
    align-items: start !important;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr) !important;
    gap: clamp(2rem, 6vw, 6rem) !important;
  }

  .gek-editable-block-page .gek-members-hero--card .gek-members-hero__title {
    margin: 0 !important;
    min-width: 0 !important;
  }

  .gek-editable-block-page .gek-members-hero--card h1 + p {
    color: #d1ddd7 !important;
  }

  .gek-editable-block-page .gek-members-hero__actions {
    padding: 0 !important;
    margin-top: var(--gek-hero-action-gap) !important;
  }

  .gek-editable-block-page .gek-members-hero__actions a {
    margin-block: 0 !important;
  }

  /* Share the translucent card surface used by the statutes hero. */
  .gek-editable-block-page :is(.gek-statutes-hero__document, .gek-members-hero-card) {
    background: rgb(255 255 255 / 8%) !important;
    border: 1px solid rgb(255 255 255 / 17%) !important;
    border-radius: 20px !important;
    box-shadow: none !important;
    color: #fff !important;
    padding: clamp(1.5rem, 4vw, 2.5rem) !important;
  }

  .gek-editable-block-page .gek-members-hero-card {
    box-sizing: border-box !important;
    justify-self: end !important;
    margin: 0 !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  .gek-editable-block-page .gek-members-hero-card > .wp-block-group__inner-container {
    display: block !important;
  }

  .gek-editable-block-page .gek-members-hero-card .gek-members-hero-card__kicker {
    color: #e5a47e !important;
    font: 800 .66rem/1.6 Arial, Helvetica, sans-serif !important;
    letter-spacing: .12em !important;
    margin: 0 !important;
    text-transform: uppercase !important;
  }

  .gek-editable-block-page .gek-members-hero-card h2 {
    color: #fff !important;
    font-size: clamp(2rem, 3.5vw, 3.2rem) !important;
    margin: 1rem 0 !important;
  }

  .gek-editable-block-page .gek-members-hero-card .gek-members-hero-card__lead {
    color: #fff !important;
    font: 400 1.0625rem/1.6 Arial, Helvetica, sans-serif !important;
    margin: 0 0 2rem !important;
  }

  .gek-editable-block-page .gek-members-hero-card .gek-members-hero-card__link {
    border-top: 1px solid rgb(255 255 255 / 18%) !important;
    margin: 0 !important;
  }

  .gek-editable-block-page .gek-members-hero-card a {
    background: transparent !important;
    border-radius: 0 !important;
    color: #fff !important;
    display: flex !important;
    font: 800 .8rem/1.6 Arial, Helvetica, sans-serif !important;
    gap: .35rem !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    padding: 1.15rem 0 !important;
    text-decoration: none !important;
  }

  .gek-editable-block-page .gek-members-hero-card .gek-members-hero-card__link:last-child a {
    padding-bottom: 0 !important;
  }

  .gek-editable-block-page .gek-members-hero-card a:hover {
    color: #e5a47e !important;
  }

  .gek-editable-block-page .gek-members-hero-card a:focus-visible {
    outline: 2px solid #e5a47e !important;
    outline-offset: 4px !important;
  }

  @media (max-width: 900px) {
    .gek-editable-block-page .gek-members-hero--card .gek-members-hero__grid > .wp-block-group__inner-container {
      grid-template-columns: minmax(0, 1fr) !important;
    }

    .gek-editable-block-page .gek-members-hero-card {
      justify-self: stretch !important;
      max-width: none !important;
    }
  }

  /* Keep the section headings below the hero in the visual hierarchy. */
  .gek-editable-block-page h2 {
    font-family: var(--gek-display-font) !important;
    font-weight: 400 !important;
    line-height: 1.16 !important;
    letter-spacing: -.015em !important;
  }

  /* Older blocks name these headings by class instead of their H2 tag. */
  .gek-editable-block-page h2:is(
    .gek-horses-section-title,
    .gek-teachers-card__title,
    .gek-adaptive-card-value,
    .gek-holiday-hero__card-title,
    .gek-private-level-title,
    .gek-arena-card-title,
    .gek-champs-hero__aside-title,
    .gek-hours-hero__stafftitle,
    .gek-club-hero__card-title
  ) {
    font-size: var(--gek-type-h2) !important;
  }

  @media (max-width: 1199px) {
    :is(.gek-design-concept, .gek-editable-block-page, .gek-app-demo) {
      --gek-type-h1: 3rem !important;
      --gek-type-h2: 2.25rem !important;
    }
  }

  @media (max-width: 760px) {
    :is(.gek-design-concept, .gek-editable-block-page, .gek-app-demo) {
      --gek-type-h1: 2.5rem !important;
      --gek-type-h2: 2rem !important;
      --gek-hero-lead-size: 1.0625rem !important;
      --gek-hero-kicker-gap: .75rem !important;
      --gek-hero-lead-gap: 1.25rem !important;
      --gek-hero-action-gap: 1.5rem !important;
    }
  }

  @media (max-width: 359px) {
    :is(.gek-design-concept, .gek-editable-block-page, .gek-app-demo) {
      --gek-type-h1: 2.25rem !important;
      --gek-type-h2: 1.875rem !important;
    }
  }
}