/* Призыв к действию (views/constructor/cta.php). Виды: center (всё по центру), split (текст слева, кнопки справа).
   Декор — мягкое свечение и тонкие кольца псевдоэлементами секции поверх её фона (isolation); цвет — от тона секции. */
.cb--cta {isolation: isolate; overflow: hidden}
.cb--cta.cb-tone--dark {--cb-cta-glow: rgba(255, 255, 255, .13); --cb-cta-ring: rgba(255, 255, 255, .16)}
.cb--cta.cb-tone--light {--cb-cta-glow: var(--cb-primary-soft); --cb-cta-ring: var(--cb-rule)}
.cb--cta.cb-bg--primary.cb-tone--light {--cb-cta-glow: rgba(255, 255, 255, .3); --cb-cta-ring: rgba(22, 35, 45, .12)}
.cb--cta::before, .cb--cta::after {content: ""; position: absolute; z-index: -1; aspect-ratio: 1; border-radius: 50%; pointer-events: none}
.cb--cta::before {width: clamp(320px, 44vw, 640px); top: 0; right: 0; transform: translate(34%, -46%); background: radial-gradient(circle, var(--cb-cta-glow) 0%, transparent 68%)}
.cb--cta::after {width: clamp(180px, 22vw, 320px); bottom: 0; left: 0; transform: translate(-36%, 46%); border: 1px solid var(--cb-cta-ring); outline: 1px solid var(--cb-cta-ring); outline-offset: clamp(22px, 2.4vw, 36px)}

.cb-cta .cb-cta__head {margin-bottom: 0}
.cb-cta .cb-cta__actions {margin-top: 0}

/* По центру */
.cb-cta--center {max-width: 820px; margin-inline: auto; text-align: center}
.cb-cta--center .cb-cta__head + .cb-cta__actions {margin-top: 36px}
.cb-cta--center .cb-title__h {font-size: clamp(30px, 3.6vw, 50px)}

/* Текст слева, кнопки справа */
.cb-cta--split {display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px clamp(32px, 5vw, 80px); align-items: center}
.cb-cta--split.cb-cta--no-actions {grid-template-columns: minmax(0, 1fr)}
.cb-cta--split .cb-cta__head {max-width: 760px}
.cb-cta--split .cb-title__h {font-size: clamp(26px, 2.6vw, 36px)}
.cb-cta--split .cb-title__sub {margin-top: 12px}
.cb-cta--split .cb-cta__actions {flex-wrap: nowrap; justify-content: flex-end}
.cb--cta.cb-view--split::before {width: clamp(260px, 30vw, 440px); transform: translate(30%, -52%)}
.cb--cta.cb-view--split::after {display: none}

@media (max-width: 991px) {
    .cb-cta--split {grid-template-columns: minmax(0, 1fr)}
    .cb-cta--split .cb-cta__actions {flex-wrap: wrap; justify-content: flex-start}
}
@media (max-width: 575px) {
    .cb--cta::before {width: 300px; transform: translate(45%, -50%)}
    .cb--cta::after {width: 160px; transform: translate(-50%, 55%)}
    .cb-cta--center .cb-cta__head + .cb-cta__actions {margin-top: 28px}
    .cb-cta .cb-cta__actions {flex-direction: column; align-items: stretch}
}
@media print {
    .cb--cta::before, .cb--cta::after {display: none}
}
