/* Mobile composition generated from the selected desktop FV.
 * The headline/photo remain imagery; the H1, figures and actions are live HTML. */
@media (min-width: 1280px) {
    body.portal-image-led .portal-sp-art,
    body.portal-image-led .portal-sp-description,
    body.portal-image-led .portal-sp-metrics { display: none; }
}

@media (max-width: 1279px) {
    body.portal-site.portal-page-overview .portal-hero {
        padding: 68px 0 24px;
        border: 0;
        background: #fcfcfa;
    }
    body.portal-image-led .portal-hero-grid {
        display: block;
        width: 100%;
        max-width: 560px;
        padding: 0;
        margin: 0 auto;
        container-type: inline-size;
    }
    body.portal-image-led .portal-hero-copy {
        position: relative;
        width: 100%;
        container-type: normal;
    }
    body.portal-image-led .portal-sp-art {
        position: relative;
        width: 100%;
        aspect-ratio: 1024 / 972;
        overflow: hidden;
    }
    body.portal-image-led .portal-sp-art picture,
    body.portal-image-led .portal-sp-art img {
        display: block;
        width: 100%;
        max-width: none;
        height: auto;
    }
    /* The image has a clean text area; no paint-over mask is necessary. */
    body.portal-page-overview .portal-fv-title {
        position: absolute;
        z-index: 1;
        top: 41.2cqw;
        left: 4.7cqw;
        width: 61cqw;
        max-width: none;
        margin: 0;
        font-size: clamp(15px, 4.5cqw, 26px);
        font-weight: 900;
        letter-spacing: -0.045em;
        line-height: 1.38;
    }
    body.portal-image-led .portal-sp-metrics {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 1cqw;
        margin: 0 4.3cqw 3.2cqw;
    }
    body.portal-image-led .portal-sp-metric {
        position: relative;
        display: flex;
        min-width: 0;
        min-height: max(56px, 15.6cqw);
        flex-direction: column;
        align-items: center;
        justify-content: center;
        color: #0c0d0a;
        line-height: 1.15;
        white-space: nowrap;
    }
    body.portal-image-led .portal-sp-metric::before,
    body.portal-image-led .portal-sp-metric::after {
        position: absolute;
        top: 0;
        width: 5.3cqw;
        height: 15.6cqw;
        background: url('/eigyo/service/assets/fv-mobile-imagegen-clean-20260913.webp') -3.9cqw -95.6cqw / 100cqw 150cqw no-repeat;
        content: '';
    }
    body.portal-image-led .portal-sp-metric::before { left: -0.5cqw; }
    body.portal-image-led .portal-sp-metric::after { right: -0.5cqw; transform: scaleX(-1); }
    body.portal-image-led .portal-sp-metric > span,
    body.portal-image-led .portal-sp-metric > b { font-size: clamp(11px, 2.7cqw, 15px); font-weight: 800; }
    body.portal-image-led .portal-sp-metric > strong { margin: 0.7cqw 0 0.3cqw; font-size: 7cqw; font-weight: 900; letter-spacing: -0.055em; }
    body.portal-image-led .portal-sp-metric.is-delivery > strong { font-size: 5.6cqw; }
    body.portal-image-led .portal-sp-metric small { font-size: 3.1cqw; font-weight: 800; letter-spacing: -0.05em; }
    body.portal-image-led .portal-hero .portal-sp-actions {
        display: grid;
        width: auto;
        max-width: none;
        gap: 2.2cqw;
        margin: 0 4.3cqw;
    }
    body.portal-image-led .portal-sp-actions > a {
        position: relative;
        display: flex;
        min-height: 52px;
        align-items: center;
        justify-content: center;
        gap: 4cqw;
        border-radius: 999px;
        color: #090a07;
        font-size: clamp(14px, 4.7cqw, 24px);
        font-weight: 850;
        letter-spacing: -0.035em;
        line-height: 1.4;
        text-decoration: none;
        white-space: nowrap;
        transition: background-color 150ms ease;
    }
    body.portal-image-led .portal-sp-consult {
        height: 14.5cqw;
        padding: 0 8cqw 0 15cqw;
        background: #ffdb25;
        box-shadow: 0 2px 4px #1617110d;
    }
    body.portal-image-led .portal-sp-badge {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        display: flex;
        aspect-ratio: 1;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: #13140f;
        color: #ffdb25;
        font-size: 4cqw;
        font-weight: 900;
        line-height: 1.15;
    }
    body.portal-image-led .portal-sp-signup {
        height: 13cqw;
        padding: 0 5cqw;
        border: 1px solid #171813;
        background: #fff;
        box-shadow: 0 2px 4px #1617110d;
    }
    body.portal-image-led .portal-sp-actions svg { width: 5.2cqw; height: 4cqw; flex: 0 0 auto; }
    body.portal-image-led .portal-sp-consult:hover { background: #ffd219; }
    body.portal-image-led .portal-sp-signup:hover { background: #fff8df; }
    body.portal-image-led .portal-sp-actions > a:focus-visible { outline: 3px solid #171813; outline-offset: 3px; }
}
