/* September launch pass: existing grid and modal language, edited content. */
@media (max-width: 809.98px) {
    .l8-project-modal {
        padding: 0;
    }
    .l8-project-modal__panel.is-case:not(.is-video-only) {
        width: 100vw;
        height: 100dvh;
        max-width: none;
        max-height: none;
        border: 0;
        border-radius: 0;
        background: #fff;
    }
    .l8-project-modal__panel.is-case:not(.is-video-only) .l8-case-modal {
        height: 100%;
    }
    .l8-project-modal__panel.is-case:not(.is-video-only) > .l8-project-modal__close {
        top: max(8px, env(safe-area-inset-top, 0px));
        right: max(0px, env(safe-area-inset-right, 0px));
        width: 44px;
        height: 44px;
        font-size: 24px;
        color: #303030;
        background: #fff;
    }
    .l8-project-modal__panel.is-case:not(.is-video-only) > .l8-project-modal__close::before {
        inset: 0;
    }
    .l8-project-modal__panel.is-case:not(.is-video-only) .l8-case-modal__left {
        gap: 48px;
        padding: max(64px, calc(env(safe-area-inset-top, 0px) + 48px)) 24px 0;
    }
    .l8-project-modal__panel.is-case:not(.is-video-only) .l8-case-modal__right {
        display: block;
        padding: 36px 24px max(48px, calc(env(safe-area-inset-bottom, 0px) + 24px));
    }
    .l8-project-modal__panel.is-case:not(.is-video-only) .l8-case-modal__right > .l8-case-sizzle {
        display: block;
        margin: 36px 0 40px;
    }
    .l8-project-modal__panel.is-case:not(.is-video-only) .l8-case-modal__right > .l8-case-opportunity {
        margin-top: 40px;
    }
}
body [data-framer-name="Work Grids"] .l8-home-withheld {
    display: none !important;
}
/* Held for the two-group review. Keep the client ticker available for restoration. */
[data-l8-home-impact] {
    display: none !important;
}
.l8-additional-cases {
    margin: 0;
    width: 100%;
    padding: clamp(48px, 7.5vw, 96px) 24px 0;
    box-sizing: border-box;
    color: #858585;
    font-family: var(--l8-body-font, "NC Inter", Inter, sans-serif);
    font-size: 11px;
    font-weight: 300;
    line-height: 1.65;
    text-align: center;
}
[data-l8-project-reel] > [hidden] { display: none !important; }
[data-l8-project-reel] > * { transition: none; }
.l8-case-expanded__stage, .l8-case-expanded__stage > * {
    position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
}
.l8-case-expanded__stage { pointer-events: none; }
/* Shared detailed template: both reel stages fill the same modal area. */
.l8-project-modal__panel.is-detail-case:not(.is-video-only) .l8-case-sizzle {
    aspect-ratio: 4 / 3;
}
.l8-project-modal__panel.is-detail-case:not(.is-video-only) .l8-case-sizzle__stage > video {
    object-fit: cover;
    object-position: center;
    transform: none;
}
.l8-project-modal__panel.is-detail-case:not(.is-video-only) .l8-case-expanded__stage > video {
    object-fit: cover;
    object-position: center;
    transform: none;
}
/* Preserve the delivered Dream Beauty film's complete 16:9 composition. */
.l8-project-modal__panel.is-dream-beauty.is-detail-case:not(.is-video-only) .l8-case-sizzle {
    aspect-ratio: 16 / 9;
}
.l8-project-modal__panel.is-dream-beauty.is-detail-case:not(.is-video-only) :is(.l8-case-sizzle__stage, .l8-case-expanded__stage) > video {
    object-fit: contain;
    object-position: center;
    transform: none;
}
.l8-project-modal__panel.is-dream-beauty:not(.has-opportunity):not(.has-outcomes) .l8-case-opportunity {
    display: none;
}
.l8-project-modal__panel.is-detail-case:not(.is-video-only) :is([data-l8-case-field-note], [data-l8-case-valuation], [data-l8-case-revenue]) {
    align-items: center;
}
.l8-project-modal__panel.is-detail-case:not(.is-video-only) :is([data-l8-case-field-note-link], [data-l8-case-valuation-link], [data-l8-case-revenue-link]) {
    justify-self: start;
    justify-content: flex-start;
    box-sizing: border-box;
    width: 94.3px;
    min-height: 26px;
    font-size: 10px;
    text-align: left;
    margin-left: -10px;
    gap: 0;
    padding: 5px 10px;
    border-radius: 999px;
    background: #ededed;
    color: #303030;
    transition: background-color 240ms ease, color 240ms ease;
}
.l8-project-modal__panel.is-detail-case:not(.is-video-only) [data-l8-case-valuation-link] {
    width: max-content;
    min-width: 94.3px;
}
.l8-project-modal__panel.is-aereo.is-detail-case:not(.is-video-only) [data-l8-case-valuation-link],
.l8-project-modal__panel.is-simple-energy.is-detail-case:not(.is-video-only) [data-l8-case-valuation-link],
.l8-project-modal__panel.is-dream-beauty.is-detail-case:not(.is-video-only) [data-l8-case-valuation-link],
.l8-project-modal__panel.is-little-joys.is-detail-case:not(.is-video-only) [data-l8-case-valuation-link],
.l8-project-modal__panel.is-blue-tokai.is-detail-case:not(.is-video-only) [data-l8-case-valuation-link],
.l8-project-modal__panel.is-sabyasachi.is-detail-case:not(.is-video-only) [data-l8-case-revenue-link] {
    width: max-content;
    min-width: 0;
    padding-inline: 11.5px;
    margin-left: -11.5px;
}
.l8-project-modal__panel.is-monvue.is-detail-case:not(.is-video-only) [data-l8-case-field-note-link] {
    width: max-content;
    padding-inline: 11.5px;
    margin-left: -11.5px;
}
.l8-project-modal__panel.is-blue-tokai.is-detail-case:not(.is-video-only) [data-l8-case-copy] p,
.l8-project-modal__panel.is-sabyasachi.is-detail-case:not(.is-video-only) [data-l8-case-copy] p {
    text-wrap: pretty;
}
.l8-project-modal__panel.is-detail-case:not(.is-video-only) :is([data-l8-case-field-note-link], [data-l8-case-valuation-link], [data-l8-case-revenue-link]) .l8-case-field-note__dot,
.l8-project-modal__panel.is-detail-case:not(.is-video-only) :is([data-l8-case-field-note-label], [data-l8-case-valuation-label], [data-l8-case-revenue-label])::after {
    display: none;
}
.l8-project-modal__panel.is-detail-case:not(.is-video-only) :is([data-l8-case-field-note-link], [data-l8-case-valuation-link], [data-l8-case-revenue-link]):is(:hover, :focus-visible) {
    background: #303030;
    color: #fff;
}
.l8-project-modal__panel.is-detail-case:not(.is-video-only) :is([data-l8-case-field-note-link], [data-l8-case-valuation-link], [data-l8-case-revenue-link]):focus-visible {
    outline: 1px solid #303030;
    outline-offset: 3px;
}
.l8-project-modal__panel.is-detail-case:not(.is-video-only).is-sizzle-expanded .l8-case-modal {
    position: absolute;
    inset: 0;
    visibility: hidden;
}
@media (min-width: 810px) {
    .l8-project-modal__panel.is-home-case.is-detail-case .l8-case-modal__right {
        row-gap: var(--l8-detail-section-gap, 60px);
    }
    .l8-project-modal__panel.is-detail-case:not(.is-video-only) .l8-case-modal__left {
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .l8-project-modal__panel.is-detail-case:not(.is-video-only) .l8-case-modal__right {
        padding-top: 50px;
    }
    .l8-project-modal__panel.is-monvue.is-detail-case:not(.is-video-only) .l8-case-modal__left {
        padding: 55px 40px 40px;
    }
}
@media (max-width: 809.98px) {
    .l8-project-modal__panel.is-detail-case:not(.is-video-only) .l8-case-expanded__close {
        width: 44px;
        height: 44px;
        top: 8px;
        right: 8px;
    }
}
@media (prefers-reduced-motion: reduce) {
    .l8-project-modal__panel.is-detail-case:not(.is-video-only) :is([data-l8-case-field-note-link], [data-l8-case-valuation-link], [data-l8-case-revenue-link]) {
        transition: none;
    }
}
.l8-project-modal__panel.is-detail-case .l8-case-chart__line {
    stroke: var(--l8-modal-grey);
    stroke-width: 0.85;
}
.l8-project-modal__panel.is-detail-case .l8-case-chart__point > circle {
    r: 2.1px;
}
@media (max-width: 809.98px) {
    .l8-project-modal__panel.is-home-case.is-detail-case .l8-case-sizzle {
        margin-top: 0;
    }
    .l8-project-modal__panel.is-home-case.is-detail-case .l8-case-modal__right {
        display: block;
    }
    .l8-project-modal__panel.is-home-case.is-detail-case .l8-case-opportunity {
        margin-top: 73px;
    }
}
/* Keep finished landscape reels complete instead of cropping to the case-study pane. */
.l8-project-modal__panel.is-video-only .l8-case-expanded__stage { overflow: hidden; }
.l8-project-modal__panel.is-case.is-video-only:is(.is-monvue, .is-blue-tokai, .is-little-joys, .is-aereo, .is-sabyasachi, .is-varalife, .is-simple-energy) {
    width: min(1200px, calc(100vw - 96px), calc((100dvh - 96px) * 16 / 9));
    height: auto;
    aspect-ratio: 16 / 9;
    min-height: 0;
    background: transparent;
}
.l8-project-modal__panel.is-video-only:is(.is-monvue, .is-blue-tokai, .is-little-joys, .is-aereo, .is-sabyasachi, .is-varalife, .is-simple-energy) .l8-case-expanded {
    background: transparent;
}
.l8-project-modal__panel.is-video-only:is(.is-monvue, .is-blue-tokai, .is-little-joys, .is-aereo, .is-sabyasachi, .is-varalife, .is-simple-energy) .l8-case-expanded__stage > video {
    object-fit: contain;
    object-position: center;
    transform: none;
}
@media (max-width: 809.98px) {
    .l8-project-modal__panel.is-case.is-video-only:is(.is-monvue, .is-blue-tokai, .is-little-joys, .is-aereo, .is-sabyasachi, .is-varalife, .is-simple-energy) {
        width: min(calc(100vw - 32px), calc((100dvh - 96px) * 16 / 9));
    }
}
.l8-agent-overlay__panel {
    width: min(760px, calc(100vw - 64px));
    min-height: min(580px, calc(100dvh - 64px));
    box-sizing: border-box;
    padding: 48px 40px 32px;
}
.l8-agent-overlay__header h2 { font-size: 12px; }
.l8-agent-overlay__intro {
    max-width: 560px;
    margin: 40px 0 40px;
    font-size: 11px;
    line-height: 1.6;
    letter-spacing: 0;
}
.l8-agent-overlay__intro p + p { margin-top: 20px; }
.l8-agent-overlay__intro .l8-agent-overlay__lead {
    color: var(--l8-text-primary);
    font-size: 11px;
    line-height: 1.4;
}
.l8-agent-overlay__links a {
    padding: 10px 0;
    font-size: 10px;
    min-height: 44px;
    grid-template-columns: auto 16px;
    gap: 8px;
}
.l8-agent-overlay__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; border-top: 1px solid var(--l8-divider); }
.l8-agent-overlay__links a { border-bottom: 0; }
.l8-agent-overlay__index, .l8-agent-overlay__note { display: none; }
.l8-agent-overlay__launch { width: 16px; height: 16px; }
.l8-agent-overlay__updated { padding-top: 24px; font-size: 8px; margin-top: auto; }
.l8-agent-overlay__close { width: 24px; height: 24px; color: #858585; }
.l8-agent-overlay__close:hover,
.l8-agent-overlay__close:focus-visible { outline: 1px solid rgba(48, 48, 48, .12); outline-offset: 2px; }
/* All case studies inherit the approved first-three modal typography and geometry. */
.l8-project-modal__panel.is-home-case .l8-case-opportunity__stat { grid-template-columns: minmax(0, max-content) max-content; justify-content: start; }
.l8-skin-spectrum-card__label-line { color: #fff; }
.l8-report-index { opacity: .5; }
:is([data-l8-skin-spectrum-card], [data-l8-time-space-card]) .l8-report-index { opacity: 1; color: #fff; }
:is([data-l8-skin-spectrum-card], [data-l8-time-space-card]) .l8-skin-spectrum-card__cta {
    height: 44px;
    box-sizing: border-box;
    top: 50%;
    bottom: auto;
    transform: translate(-50%, -50%);
    min-width: 0;
    gap: 0;
    padding-inline: 18px;
}
.l8-project-modal__panel.is-launch-case .l8-case-opportunity__label { white-space: normal; }
.l8-project-modal__panel.is-home-case.is-431-88 .l8-case-chart,
.l8-project-modal__panel.is-home-case.is-launch-case:not(.is-detail-case) .l8-case-chart {
    margin-top: 24px;
    margin-bottom: 0;
    translate: 0 0;
    flex-shrink: 0;
}
.l8-project-modal__panel.is-launch-case .l8-case-opportunity [hidden] { display: none !important; }
.l8-project-modal__panel.is-launch-case:not(.has-opportunity):not(.has-outcomes) .l8-case-opportunity { display: none; }

@media (min-width: 810px) {
    .l8-project-modal__panel.is-case.is-launch-case:not(.is-detail-case) { height: min(800px, calc(100dvh - 48px)); }
    .l8-project-modal__panel.is-home-case.is-launch-case:not(.is-detail-case) .l8-case-modal__right { row-gap: 40px; }
}

@media (max-width: 809.98px) {
    .l8-agent-overlay__panel { width: calc(100vw - 28px); min-height: 0; padding: 40px 24px 24px; }
    .l8-agent-overlay__intro { margin: 32px 0; font-size: 11px; }
    .l8-agent-overlay__intro .l8-agent-overlay__lead { font-size: 11px; }
    .l8-agent-overlay__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
    .l8-agent-overlay__links a { grid-template-columns: 1fr 16px; font-size: 10px; }
}


@media (max-width: 809.98px) {
    .l8-project-modal__panel.is-case:not(.is-video-only) .l8-case-modal__left-content {
        gap: 48px;
    }

    .l8-project-modal.is-open .l8-case-opportunity:not(.is-mobile-opportunity-visible),
    .l8-project-modal.is-open .l8-case-chart:not(.is-mobile-chart-visible) {
        opacity: 0 !important;
        animation: none !important;
    }

    .l8-project-modal.is-open .l8-case-opportunity.is-mobile-opportunity-visible,
    .l8-project-modal.is-open .l8-case-chart.is-mobile-chart-visible {
        animation: l8-modal-enter-rise 400ms ease both !important;
    }

    .l8-project-modal.is-open .l8-case-chart:not(.is-mobile-chart-visible) :is(.l8-case-chart__line, .l8-case-chart__bar-reveal, .l8-case-chart__point) {
        animation-play-state: paused !important;
    }

    .l8-project-modal.is-open .l8-case-chart.is-mobile-chart-visible :is(.l8-case-chart__line, .l8-case-chart__bar-reveal, .l8-case-chart__point) {
        animation-play-state: running !important;
        animation-delay: 0ms !important;
    }
}

@media (max-width: 809.98px) and (prefers-reduced-motion: reduce) {
    .l8-project-modal.is-open .l8-case-opportunity.is-mobile-opportunity-visible,
    .l8-project-modal.is-open .l8-case-chart.is-mobile-chart-visible {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}