/**
 * Flamingo Marine — Centered Intro section (V4 strip-1, lower half).
 *
 * Layout: full-bleed dark-navy band below the hero video. Large bold
 * centered headline (IBM Plex, heavy, tight tracking — matches the hero
 * wordline), a muted two-line subhead, and a thin down chevron affordance.
 * Tier-1 static: typography + spacing only, no JS.
 */

.flm-intro {
    background-color: var(--wp--preset--color--surface-deep);
    color: var(--wp--preset--color--text-primary);
    text-align: center;
}

/* Headline — large, heavy, tight. Two lines centered. */
.flm-intro .flm-intro__headline {
    max-width: 22ch;
    margin-inline: auto;
    color: var(--wp--preset--color--text-primary);
    font-weight: 700;
    line-height: 1.06;
    letter-spacing: -0.01em;
    text-wrap: balance;
}

/* Subhead — lighter sans, muted blue-grey, generous line-height. */
.flm-intro .flm-intro__subhead {
    max-width: 46ch;
    margin-inline: auto;
    margin-top: var(--wp--preset--spacing--lg);
    color: var(--wp--preset--color--text-secondary);
    font-weight: 400;
    line-height: 1.45;
    text-wrap: balance;
}

/* Chevron — thin stroke, breathing room above. Pink: it invites the scroll
   action, and pink marks action sitewide (BugHerd #199). */
.flm-intro .flm-intro__chevron {
    margin-top: var(--wp--preset--spacing--xxl);
    color: var(--wp--preset--color--accent-pink);
    line-height: 0;
}

.flm-intro .flm-intro__chevron svg {
    display: inline-block;
}

/* --- Responsive --------------------------------------------------------- */

@media (max-width: 767px) {
    .flm-intro .flm-intro__headline {
        font-size: var(--wp--preset--font-size--heading-two-mobile);
        max-width: 16ch;
    }

    .flm-intro .flm-intro__subhead {
        font-size: var(--wp--preset--font-size--body);
    }

    .flm-intro .flm-intro__chevron {
        margin-top: var(--wp--preset--spacing--xl);
    }
}