/* CTA — closing band before footer */

.cta {
    background: var(--color-ink);
    color: var(--color-snow);
    position: relative;
    overflow: hidden;
}

.cta::before {
    content: "";
    position: absolute;
    bottom: -30%;
    left: 50%;
    transform: translateX(-50%);
    width: 80vmax;
    height: 80vmax;
    background: radial-gradient(circle, rgba(200, 16, 46, 0.18) 0%, transparent 55%);
    filter: blur(80px);
    pointer-events: none;
}

.cta__inner {
    text-align: center;
    max-width: 820px;
    margin: 0 auto;
    position: relative;
}

.cta__mark {
    width: 80px;
    height: 80px;
    margin: 0 auto var(--space-5);
    color: var(--color-accent);
}

/* Radar "sonar" pulse — rings ripple outward from the centre, dot beats */
.cta__mark svg circle {
    transform-box: fill-box;
    transform-origin: center;
}

/* Rings (r38 = child 1 outer … r18 = child 3 inner). Stagger so the
   pulse travels from the inside out. */
.cta__mark svg circle:nth-child(1),
.cta__mark svg circle:nth-child(2),
.cta__mark svg circle:nth-child(3) {
    animation: ctaSonar 2.4s ease-in-out infinite;
}
.cta__mark svg circle:nth-child(3) { animation-delay: 0s; }
.cta__mark svg circle:nth-child(2) { animation-delay: 0.3s; }
.cta__mark svg circle:nth-child(1) { animation-delay: 0.6s; }

/* Centre dot heartbeat */
.cta__mark svg circle:nth-child(4) {
    animation: ctaDot 2.4s ease-in-out infinite;
}

@keyframes ctaSonar {
    0%, 100% { opacity: 0.25; transform: scale(0.96); }
    50%      { opacity: 1;    transform: scale(1.04); }
}

@keyframes ctaDot {
    0%, 100% { opacity: 0.6; transform: scale(0.85); }
    50%      { opacity: 1;   transform: scale(1.3); }
}

.cta__title {
    margin: var(--space-4) auto;
    font-size: clamp(2.4rem, 1.2rem + 4vw, 4.6rem);
    font-weight: 800;
    color: var(--color-snow);
    line-height: 1.02;
    letter-spacing: -0.04em;
    max-width: 22ch;
}

.cta__title em {
    color: var(--color-accent);
}

.cta__lead {
    margin: 0 auto var(--space-6);
    color: var(--color-mist);
    font-size: var(--fs-lead);
    line-height: 1.65;
    max-width: 720px;
    text-wrap: balance;
}

.cta__actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-5);
    flex-wrap: wrap;
}

.cta__phone {
    font-family: var(--font-mono);
    color: rgba(255,255,255,0.8);
    font-size: var(--fs-small);
    letter-spacing: 0.03em;
    border-bottom: 1px solid rgba(255,255,255,0.25);
    padding-bottom: 2px;
    transition: color 0.3s var(--ease-out), border-color 0.3s var(--ease-out);
}

.cta__phone:hover {
    color: var(--color-snow);
    border-color: var(--color-accent);
}
