/* ==========================================================================
   KeyDesignArt — Kapanış çağrısı
   Sayfanın son bölümü: çerçeveli tek panel, üst kenarında hep açık vurgu
   çubuğu, arkasında bir köşeden sızan sarı huzme ve dekoratif geometri
   (daireler, halkalar, artı işaretleri). İçerik ortalanmış: göz üstü etiketi,
   başlık, tek cümlelik davet ve altında iki buton. Sayfadaki tek kapanış
   eylemi olduğu için buton dolu; başka hiçbir şeyle yarışmıyor.
   ========================================================================== */

@layer sections {

    /* Sayfanın son bölümü: alt boşluğu kabuk zaten veriyor, bölüm kendi
       alt dolgusunu eklemez — yoksa alt bilgiyle arada çift boşluk oluşuyor.
       ---------------------------------------------------------------------- */
    .kda-cta {
        padding-block-end: 0;
    }

    .kda-cta__panel {
        position: relative;
        isolation: isolate;
        display: grid;
        justify-items: center;
        gap: var(--kda-space-5);
        overflow: hidden;
        padding: var(--kda-space-7) var(--kda-space-5);
        border: 1px solid var(--kda-line);
        border-radius: var(--kda-radius-button);
        background: var(--kda-surface);
        text-align: center;
        transition: border-color var(--kda-dur-base) var(--kda-ease);
    }

    .kda-cta__panel:hover {
        border-color: var(--kda-line-strong);
    }

    .kda-cta__panel:has(a:focus-visible) {
        border-color: var(--kda-accent);
    }

    /* Vurgu çubuğu — sayfanın kart jestinin aynısı, ama kapanışta hep açık
       ---------------------------------------------------------------------- */
    .kda-cta__panel::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        z-index: 2;
        width: 100%;
        height: 2px;
        background: var(--kda-accent);
        box-shadow: 0 0 18px var(--kda-accent-glow);
        pointer-events: none;
    }

    /* Huzme + dekoratif geometri
       ---------------------------------------------------------------------- */
    .kda-cta__beam {
        position: absolute;
        z-index: 0;
        inset: 0;
        background:
            var(--kda-shapes) center / cover no-repeat,
            radial-gradient(46% 88% at 100% 0%,
                var(--kda-accent-ghost) 0%, transparent 64%);
        opacity: 0.9;
        pointer-events: none;
        transition: opacity var(--kda-dur-slow) var(--kda-ease);
    }

    .kda-cta__panel:hover .kda-cta__beam,
    .kda-cta__panel:has(a:focus-visible) .kda-cta__beam {
        opacity: 1;
    }

    /* Metin
       ---------------------------------------------------------------------- */
    .kda-cta__body {
        position: relative;
        z-index: 1;
        display: grid;
        justify-items: center;
        gap: var(--kda-space-4);
    }

    .kda-cta__body .kda-eyebrow {
        margin-bottom: 0;
    }

    .kda-cta__title {
        max-width: none;
        margin: 0;
        color: var(--kda-ink);
        font-family: var(--kda-font-display);
        font-size: var(--kda-text-2xl);
        font-weight: var(--kda-weight-bold);
        line-height: var(--kda-leading-snug);
        letter-spacing: var(--kda-tracking-display);
        text-transform: uppercase;
        text-wrap: pretty;
    }

    .kda-cta__lead {
        max-width: var(--kda-measure);
        margin: 0 auto;
        color: var(--kda-ink-soft);
        font-size: var(--kda-text-md);
        font-weight: var(--kda-weight-light);
        line-height: var(--kda-leading-normal);
    }

    /* Eylemler
       ---------------------------------------------------------------------- */
    /* Eylemler — metnin altında, ortalanmış
       ---------------------------------------------------------------------- */
    .kda-cta__actions {
        position: relative;
        z-index: 1;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: var(--kda-space-3) var(--kda-space-4);
    }

    .kda-cta__mail {
        max-width: 100%;
        overflow-wrap: anywhere;
    }

    /* Duyarlı yerleşim
       ---------------------------------------------------------------------- */
    @media (min-width: 64rem) {
        .kda-cta__panel {
            gap: var(--kda-space-6);
            padding: var(--kda-space-8) var(--kda-space-7);
        }

        .kda-cta__title {
            font-size: var(--kda-text-3xl);
        }

        .kda-cta__lead {
            font-size: var(--kda-text-base);
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .kda-cta__beam {
            transition: none;
        }
    }

    @media (forced-colors: active) {
        .kda-cta__beam {
            display: none;
        }
    }

}