/* =====================================================================
   Cover hero — shared "light" page hero block style (.is-style-mm-team-hero).

   A core/cover block style used across interior pages (/meet-our-team/,
   /about/, …) for the standard light hero: the page's Featured Image under a
   light teal→lavender→teal gradient overlay (Cover's native customGradient,
   set on the block) with dark ink/teal text centered on top — matching the
   /group-benefits/ hero.

   This lives in its OWN stylesheet (not meet-our-team.css) and rides
   core/cover via wp_enqueue_block_style() in inc/blocks.php, so it loads on
   EVERY page that has a Cover hero — not just the team page. Token-only.

   (The block style is still named "mm-team-hero" for back-compat with the
   markup already on /meet-our-team/; it is a general light hero, not team-only.)
===================================================================== */

.wp-block-cover.is-style-mm-team-hero {
    min-height: clamp(360px, 48vw, 560px);
    color: var(--wp--preset--color--ink-2);
    padding-block: clamp(72px, 9vw, 140px);
    padding-inline: var(--mm-s-5);
    text-align: center;
}

/* Keep the background image + scrim full-bleed. The parent theme caps
   alignfull-flow children to wide-width (.alignfull:not(.is-layout-constrained)>*);
   this higher-specificity rule releases the cap so the photo bleeds edge to edge. */
.wp-block-cover.is-style-mm-team-hero.alignfull > * {
    max-width: none;
}

/* Featured-image framing. */
.wp-block-cover.is-style-mm-team-hero .wp-block-cover__image-background {
    object-position: center 35%;
}

/* The light teal→lavender→teal gradient overlay is Cover's NATIVE customGradient
   (set on the block, not here) so it layers over the featured image identically in
   the editor and on the front end — matching the /group-benefits/ hero. No
   __background override — overriding its background wipes out the image the editor
   paints there. Text sits dark over the light wash (see ink/teal colors below). */

/* Centered text column. */
.wp-block-cover.is-style-mm-team-hero .wp-block-cover__inner-container {
    max-width: 820px;
    margin-inline: auto;
}

/* Eyebrow paragraph with a grape dot via ::before (no wp:html). */
.wp-block-cover.is-style-mm-team-hero .mm-team-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 var(--mm-s-4) 0;
    font-family: var(--mm-font-display);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--wp--preset--color--teal-700);
}

.wp-block-cover.is-style-mm-team-hero .mm-team-hero__eyebrow::before {
    content: "";
    flex: 0 0 auto;
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: var(--wp--preset--color--grape, var(--mm-grape));
    box-shadow: 0 0 0 3px rgba(95, 44, 117, 0.14);
}

/* Headline (core h1). */
.wp-block-cover.is-style-mm-team-hero h1 {
    margin: 0 0 var(--mm-s-5) 0;
    font-family: var(--mm-font-display);
    font-weight: 800;
    font-size: clamp(34px, 4.4vw, 60px);
    line-height: 1.06;
    letter-spacing: -0.02em;
    color: var(--wp--preset--color--ink);
    text-wrap: balance;
}

/* Sub / lede (the non-eyebrow paragraph). */
.wp-block-cover.is-style-mm-team-hero .wp-block-cover__inner-container > p:not(.mm-team-hero__eyebrow) {
    margin: 0 auto;
    max-width: 680px;
    font-family: var(--mm-font-body);
    font-size: clamp(16px, 1.1vw + 14px, 19px);
    line-height: 1.6;
    color: var(--wp--preset--color--ink-2);
}
