/* =====================================================================
   ctaBand — closing CTA band on the homepage (fable_recommends.md §4.4,
   successor of the lone offerRequestCta pill). Navy full-bleed gradient
   (KuZu/hero ambience = visual bracket back to the page top), white
   headline, gold primary button, ghost secondary link, optional contact
   person with photo (.has-contact).
   ===================================================================== */

.cta-band {
    --cb-navy: #253D66;
    --cb-navy2: #172a4a;
    --cb-gold: #FCBA00;

    width: 100vw;                        /* full-bleed */
    margin-left: calc(50% - 50vw);
    background: linear-gradient(135deg, var(--cb-navy) 0%, var(--cb-navy2) 100%);
    padding: 56px 0 75px;                /* top 56 = half of the uniform 112px caesura from whenFit; bottom 75 (cta->footer special, 60->75) — user 2026-07-08; +25% pass 2026-07-16 (was 45/60) */
    margin-bottom: 0;
}

.cta-band__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(28px, 5vw, 72px);
    text-align: center;
}
.cta-band__inner.has-contact { text-align: left; justify-content: space-between; }

.cta-band__headline {
    margin: 0 0 10px;
    color: #fff;
    font-size: clamp(26px, 3vw, 38px);
    font-weight: 800;
    letter-spacing: -.01em;
}

.cta-band__subline {
    margin: 0 0 24px;
    color: #c6d2e6;
    font-size: 15.5px;
    line-height: 1.55;
}

.cta-band__actions {
    display: flex;
    gap: 18px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}
.cta-band__inner.has-contact .cta-band__actions { justify-content: flex-start; }

.cta-band__btn {
    display: inline-block;
    background: var(--cb-gold);
    color: #20304c;
    font-size: 15px;
    font-weight: 800;
    padding: 13px 30px;
    border-radius: 0;                    /* eckig, wie Nav-CTA/Hero-CTA */
    text-decoration: none;
    transition: filter .2s ease, transform .2s ease;
}
.cta-band__btn:hover,
.cta-band__btn:focus-visible {
    color: #20304c;
    text-decoration: none;
    filter: brightness(1.06);
    transform: translateY(-2px);
}

.cta-band__ghost {
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .03em;
    text-decoration: none;
}
.cta-band__ghost:hover { color: #fff; text-decoration: underline; }
.cta-band__ghost span { color: var(--cb-gold); transition: transform .2s ease; display: inline-block; }
.cta-band__ghost:hover span { transform: translateX(4px); }

/* --- optional contact person ------------------------------------------- */
.cta-band__contact {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}
.cta-band__photo {
    width: 132px; height: 132px;
    object-fit: cover;
    border-radius: 50%;
    border: 3px solid rgba(252, 186, 0, .85);
    margin-bottom: 10px;
}
.cta-band__name { color: #fff; font-weight: 800; font-size: 15px; }
.cta-band__role { color: #c6d2e6; font-size: 13px; }

/* --- responsive ---------------------------------------------------------- */
@media (max-width: 767px) {
    .cta-band { padding: 38px 0 50px; }   /* top 38 = mobile half-caesura; bottom 50 = cta->footer special (40->50) — +25% pass 2026-07-16 */
    .cta-band__inner { flex-direction: column; text-align: center; }
    .cta-band__inner.has-contact { text-align: center; }
    .cta-band__inner.has-contact .cta-band__actions { justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
    .cta-band__btn,
    .cta-band__ghost span { transition: none; }
    .cta-band__btn:hover { transform: none; }
    .cta-band__ghost:hover span { transform: none; }
}