/* @group Text Block — Figma component set 23171:9579 */

/*
 * Geometry note (traceability lives in CSS comments by project convention —
 * figma-canon.json carries no `geometry` section):
 * Figma desktop lays the two half-width cards at x=0 / x=604, 574px each,
 * i.e. a 30px gutter inside a 1178px content band. The project row is 120rem
 * with 1.5rem column gutters, so two `.col-12-6` produce 570px cards with the
 * exact same 30px visual gutter — a deliberate 4px-per-card delta against the
 * canvas, taken so the component stays on the project grid instead of
 * hardcoding 574px (GUIDELINES.md > Translate design geometry into the
 * project grid).
 */

.text-block .blocks-row {
    row-gap: 3rem;
}

.text-block--with-background {
    padding-block: 3rem;
}

.text-block .row+.blocks-row {
    margin-top: 5rem;
}

.text-block .block {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
    height: 100%;
    padding: 3rem;
    border: 1px solid var(--light-gray-2);
    border-radius: 2rem;
    background: var(--white);
    overflow-wrap: break-word;
}

.text-block .block.featured {
    background: var(--light-blue);
}

/* --- WYSIWYG raw-tag fallbacks -------------------------------------------
 * The content field is a free editor, so the markup carries no design-token
 * classes. Same fallback-by-raw-tag technique the `section-title` module uses,
 * scoped under this component's own root so it never leaks into another
 * component's h2/p.
 */

.text-block .block> :first-child {
    margin-top: 0;
}

.text-block .block> :last-child {
    margin-bottom: 0;
}

/* Body copy — matches the `sitio-paragraph1` token (SF Pro Text 16/26/0). */
.text-block .block p {
    margin: 0;
    font-family: var(--sf-pro-text);
    font-size: 1.6rem;
    line-height: 2.6rem;
    letter-spacing: 0;
    color: var(--paragraph);
}

.text-block .block p strong,
.text-block .block p b {
    font-weight: 600;
}

.text-block .block :is(h2, h3, h4) {
    margin: 0;
    font-family: var(--sf-pro-text);
    color: var(--header-2);
}

/*
 * Featured opening statement. Measured on 23171:9586: SF Pro Text Light,
 * 40px, line-height 1.2, letter-spacing -1px, #242954 (= --header-2).
 * Deliberately NOT bound to `sitio-header2` (40px / 50px / -2px): by this
 * project's own matching rule letter-spacing and line-height decide a token
 * match, and both differ here — a real near-miss, not measurement noise, so
 * it stays a local rule rather than a silent rebind. Mobile size follows
 * sitio-header2's own mobile step (2.4rem) since the mobile canvas has no
 * canonicalized instance of this component yet.
 */
.text-block .block.featured h2 {
    font-size: 2.4rem;
    line-height: 1.2;
    letter-spacing: -1px;
    font-weight: 300;
}

.text-block .block.featured h2 strong,
.text-block .block.featured h2 b {
    font-weight: 600;
}

@media only screen and (min-width : 768px) {
    .text-block--with-background {
        padding-block: 6rem;
    }

    .text-block .block.wide {
        padding: 8rem 5rem;
    }

    .text-block .block.featured h2 {
        font-size: 4rem;
    }
}

/* @end */


/* @group VARIANTS
------------------------------------ */

@media only screen and (min-width : 768px) {
    .text-block+.benefits-banner {
        padding-top: 0;
        margin-top: -1rem;
    }
}


/* @end */