/* =========================================================
   EXCLUSIVIDAD / TALAMPAYA PREMIUM 3D FINAL
   ========================================================= */

#exclusividad {
    position: relative;
    width: 100vw;
    left: 50%;
    margin-left: -50vw;
    padding: 72px 0 78px;
    background: linear-gradient(135deg, #F9F7F4 0%, #F5F2EE 50%, #F0EDE8 100%) !important;
    overflow: hidden;
}

    #exclusividad > .container {
        position: relative;
        z-index: 2;
        width: min(1200px, 80%);
        margin: 0 auto;
    }

    /* =========================
   TITULO
   ========================= */
    #exclusividad h2 {
        margin: 0 0 14px;
        max-width: 640px;
        color: #C8742A;
        font-size: clamp(1.6rem, 2.2vw, 2.4rem);
        line-height: 1.1;
        letter-spacing: -0.025em;
        font-weight: 900;
    }

    /* =========================
   CARD BASE
   ========================= */
    #exclusividad .cd-card {
        border-radius: 24px;
        overflow: hidden;
        border: 1px solid rgba(205,160,126,0.2);
        transition: all .4s ease;
    }

    /* =========================
   CARDS FEATURE
   ========================= */
    #exclusividad .cd-card--feature {
        padding: 26px 22px;
        background: linear-gradient(180deg, #F0E2D2 0%, #E4D1BE 60%, #D8BEA4 100%);
        box-shadow: 0 12px 28px rgba(93,65,44,0.08), inset 0 1px 0 rgba(255,255,255,0.25);
    }

        #exclusividad .cd-card--feature:hover {
            transform: translateY(-8px);
            box-shadow: 0 22px 40px rgba(139,35,35,0.12);
        }

    /* =========================
   HEADER ICON + BADGE
   ========================= */
    #exclusividad .cd-card-header {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 14px;
    }

    /* 🔥 CORREGIDO: sin romper animación */
    #exclusividad .feature-icon-circle {
        width: 42px;
        height: 42px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(180deg, #E7A55F 0%, #D98C3C 100%);
        color: #fff;
        font-size: 1.1rem;
        box-shadow: 0 10px 20px rgba(210,140,90,0.20), inset 0 1px 0 rgba(255,255,255,0.28);
        position: relative;
        transition: transform .3s ease, box-shadow .3s ease;
    }

    /* badge */
    #exclusividad .tag-pill {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        height: 32px;
        padding: 0 14px;
        border-radius: 999px;
        background: rgba(255,255,255,0.6);
        border: 1px solid rgba(205,160,126,0.3);
        font-size: 0.72rem;
        font-weight: 800;
        letter-spacing: .08em;
    }

    /* =========================
   TEXTOS
   ========================= */
    #exclusividad .cd-card h3 {
        margin: 14px 0 10px;
        font-size: 1.3rem;
        font-weight: 900;
        color: #3F342E;
    }

    #exclusividad .cd-meta {
        color: #7A6A5E;
        font-size: 0.95rem;
        line-height: 1.6;
    }

/* =========================
   ANIMACION PREMIUM ICONO
   ========================= */
@keyframes iconPremiumPulse {
    0% {
        transform: scale(1) rotate(0deg);
    }

    25% {
        transform: scale(1.15) rotate(-8deg);
    }

    50% {
        transform: scale(1.22) rotate(8deg);
    }

    75% {
        transform: scale(1.08) rotate(-4deg);
    }

    100% {
        transform: scale(1) rotate(0deg);
    }
}

#exclusividad .feature-icon-circle::after {
    content: "";
    position: absolute;
    inset: -8px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(231,165,95,0.3), transparent 65%);
    opacity: 0;
    transform: scale(0.9);
    transition: .3s ease;
    z-index: -1;
}

#exclusividad .feature-icon-circle.icon-animate-advanced {
    animation: iconPremiumPulse 1.1s cubic-bezier(0.22,1,0.36,1);
}

    #exclusividad .feature-icon-circle.icon-animate-advanced::after {
        opacity: 1;
        transform: scale(1.2);
    }

/* =========================
   RESPONSIVE
   ========================= */
@media (max-width: 768px) {
    #exclusividad h2 {
        font-size: 1.8rem;
    }

    #exclusividad .cd-card {
        padding: 20px;
    }
}