/* Closing CTA band (webinar-landing/closing.php) and the sticky mobile signup bar (mobile-cta.php). */

.rd-wl .rd-wl-closing {
    padding-block: var(--rd-spacing-huge);
    background: var(--rd-wl-dark);
    color: var(--rd-font-light);
    text-align: center;
}

.rd-wl .rd-wl-closing h2 {
    font-size: var(--rd-fontsize-12);
    margin: 0;
    text-align: center;
}

.rd-wl-closing p {
    margin: var(--rd-spacing-x-big) 0 var(--rd-spacing-xxx-big);
}

/* Site-wide free-trial band (src/Template/pageend.php) as the pre-footer of a landing page, per Figma:
   408px tall, brand 900 background, headline on one line, 30px above the button. */
.rd-wl .rd-homepage-freeTrialBlueBox {
    display: flex;
    align-items: center;
    min-height: 408px;
    box-sizing: border-box;
    padding-block: var(--rd-spacing-xxx-lg);
    background: var(--rd-wl-dark);
}

.rd-wl .rd-homepage-freeTrialBlueBox p {
    margin-bottom: calc(var(--rd-spacing-xxx-big) - var(--rd-spacing-xxx-sm));
}

.rd-wl-mobile-cta {
    display: none;
}

@media (min-width: 761px) {
    .rd-wl .freeTrial_headline br {
        display: none;
    }
}

@media (max-width: 760px) {
    .rd-wl .rd-wl-closing h2 {
        font-size: var(--rd-fontsize-11);
    }

    /* Keep the footer reachable above the fixed bar. */
    body:has(.rd-wl-mobile-cta) {
        padding-bottom: calc(var(--rd-spacing-huge) + env(safe-area-inset-bottom, 0px));
    }

    .rd-wl-mobile-cta {
        position: fixed;
        inset: auto 0 0;
        z-index: 100;
        display: block;
        padding: var(--rd-spacing-md);
        padding-bottom: calc(var(--rd-spacing-md) + env(safe-area-inset-bottom, 0px));
        background: var(--rd-font-light);
        border-top: 1px solid var(--rd-input-default);
        text-align: center;
        box-shadow: var(--rd-shadow-level-2);
    }

    .rd-wl-mobile-cta p {
        margin: 0 0 var(--rd-spacing-x-sm);
        font-size: var(--rd-fontsize-3);
        color: var(--rd-gray-500);
    }

    .rd-wl-mobile-cta .rd-primary-btn {
        width: 100%;
        min-height: 44px;
        white-space: normal;
        font-size: var(--rd-fontsize-4);
    }
}
