/* blocks_cta_band — scoped styles for the full-bleed closing CTA.
   Dark variant uses the same #130041 ground and 100vw breakout as
   blocks_increase_conversion so the two read as one system.

   Plain CSS, not Tailwind utilities — WindPress only JIT-compiles from the
   admin UI, so new utility classes wouldn't be in the cache. */

.blocks-cta-band {
    position: relative;
    box-sizing: border-box;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow: hidden;
}

.blocks-cta-band--dark {
    background: #130041;
}
.blocks-cta-band--light {
    background: #f4f6f8;
}

/* Soft radial lift behind the copy so the band doesn't read as a flat slab. */
.blocks-cta-band--dark::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(120% 90% at 50% 0%, rgba(220, 187, 245, 0.16), transparent 62%),
        radial-gradient(80% 70% at 88% 108%, rgba(255, 228, 118, 0.1), transparent 60%);
    pointer-events: none;
}

.bctab__inner {
    position: relative;
    box-sizing: border-box;
    max-width: 900px;
    margin: 0 auto;
    padding: 72px 24px 78px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 18px;
}
@media (min-width: 768px) {
    .bctab__inner {
        padding: 104px 32px 112px;
        gap: 22px;
    }
}

.bctab__eyebrow {
    margin: 0;
    font-weight: 700;
    font-size: 13.75px;
    line-height: 17px;
    letter-spacing: 0.275px;
    text-transform: uppercase;
    color: #dcbbf5;
}
.blocks-cta-band--light .bctab__eyebrow {
    color: #5e4c92;
}

.bctab__h2 {
    margin: 0;
    color: #ffffff;
    font-weight: 900;
    font-size: 34px;
    line-height: 1.05;
    letter-spacing: -0.015em;
    text-wrap: balance;
}
@media (min-width: 1024px) {
    .bctab__h2 {
        font-size: 52px;
    }
}
.bctab__h2 i,
.bctab__h2 em {
    font-style: italic;
}
.blocks-cta-band--light .bctab__h2 {
    color: #130041;
}

.bctab__sub {
    margin: 0;
    max-width: 620px;
    color: #cfc6e8;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.6;
}
@media (min-width: 768px) {
    .bctab__sub {
        font-size: 17px;
    }
}
.blocks-cta-band--light .bctab__sub {
    color: #3d464d;
}

.bctab__actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding-top: 8px;
}
@media (min-width: 640px) {
    .bctab__actions {
        flex-direction: row;
        gap: 24px;
    }
}

.bctab__button {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    background: #ffffff;
    color: #130041;
    border: 2px solid #ffffff;
    border-radius: 9999px;
    padding: 15px 28px 16px;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.01em;
    text-decoration: none;
    box-shadow:
        0 20px 25px -5px rgba(19, 0, 65, 0.35),
        0 8px 10px -6px rgba(19, 0, 65, 0.35);
    transition: transform 0.15s ease;
}
@media (min-width: 768px) {
    .bctab__button {
        padding: 17px 34px 18px;
        font-size: 17px;
    }
}
.bctab__button svg {
    display: block;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    transition: transform 0.15s ease;
}
.bctab__button:hover svg {
    transform: translateX(8px);
}
.blocks-cta-band--light .bctab__button {
    background: #130041;
    border-color: #130041;
    color: #ffffff;
    box-shadow:
        0 20px 25px -5px rgba(19, 0, 65, 0.2),
        0 8px 10px -6px rgba(19, 0, 65, 0.2);
}

.bctab__secondary {
    color: #dcbbf5;
    font-size: 15px;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.blocks-cta-band--light .bctab__secondary {
    color: #5e4c92;
}

.bctab__note {
    margin: 0;
    max-width: 560px;
    color: rgba(207, 198, 232, 0.75);
    font-size: 13px;
    line-height: 1.6;
}
.bctab__note a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.blocks-cta-band--light .bctab__note {
    color: #75797c;
}

@media (prefers-reduced-motion: reduce) {
    .bctab__button,
    .bctab__button svg {
        transition: none;
    }
    .bctab__button:hover svg {
        transform: none;
    }
}