/* Shared CTA banner layout. */
.cta-banner {
    border-radius: var(--iphtech-radius-lg);
    padding: 3.5rem 2.5rem;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.cta-banner--orange {
    background: linear-gradient(135deg, var(--iphtech-orange) 0%, var(--iphtech-orange-dark) 100%);
    box-shadow: 0 20px 60px rgba(255, 89, 0, .28);
}

.cta-banner--blue {
    background: linear-gradient(135deg, var(--iphtech-blue) 0%, var(--iphtech-orange) 100%);
    box-shadow: 0 20px 60px rgba(217, 119, 6, .28);
}

.cta-banner--mix {
    background: linear-gradient(135deg, #f0f6ff 0%, #fff7f0 100%);
    border: 1px solid var(--iphtech-orange-border);
    border-radius: 22px;
    box-shadow: var(--shadow-md);
}

.cta-banner--orange::before,
.cta-banner--blue::before {
    content: '';
    position: absolute;
    top: -60px;
    right: -60px;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .07);
    pointer-events: none;
}

.cta-banner--mix::before {
    content: '';
    position: absolute;
    top: -80px;
    left: 50%;
    transform: translateX(-50%);
    width: 600px;
    height: 360px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 89, 0, .08) 0%, transparent 65%);
    pointer-events: none;
}

.cta-banner h2 {
    font-family: var(--iphtech-font-heading);
    font-size: 2.1rem;
    font-weight: 900;
    letter-spacing: -.02em;
    margin-bottom: .75rem;
    position: relative;
}

.cta-banner--orange h2,
.cta-banner--blue h2 {
    color: #fff;
}

.cta-banner--mix h2 {
    font-family: 'Lato', sans-serif;
    font-size: 2rem;
    color: var(--iphtech-ink);
}

.cta-banner p {
    font-size: 1rem;
    margin-bottom: 2rem;
    position: relative;
}

.cta-banner--orange p {
    color: rgba(255, 255, 255, .8);
}

.cta-banner--blue p {
    color: var(--iphtech-surface-2);
}

.cta-banner--mix p {
    color: var(--iphtech-ink-2);
    font-size: .95rem;
    margin-bottom: 1.85rem;
    position: relative;
    z-index: 1;
}