/* ===== BOTÓN DE CORREO (ROJO) ===== */
.btn-submit.btn-correo {
    background: linear-gradient(135deg, #c0392b 0%, #e74c3c 100%) !important;
    border: 2px solid #ff7675 !important;
    color: white !important;
}

.btn-submit.btn-correo:hover {
    background: linear-gradient(135deg, #e74c3c 0%, #ff7675 100%) !important;
    color: white !important;
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(192, 57, 43, 0.4);
}


/* ============================================ */
/* MODAL DE CONFIRMACIÓN DE CORREO ENVIADO      */
/* (estilos exclusivos para #modalCorreoEnviado) */
/* ============================================ */

/* El overlay reutiliza .modal-overlay de navbar.css */

/* Contenedor del modal — ancho específico */
#modalCorreoEnviado .modal-content {
    max-width: 480px;
    width: 90%;
    border: 3px solid var(--verde-claro, #d0da89);
    border-radius: 25px;
    overflow: hidden;
    box-shadow: 0 25px 60px -12px rgba(9, 83, 116, 0.4);
    animation: modalSlideIn 0.35s ease;
}

/* Cuerpo centrado y con padding */
#modalCorreoEnviado .modal-content > div {
    padding: 2.5rem 2rem 2rem !important;
    text-align: center;
    background: white;
}

/* Ícono circular animado */
#modalCorreoEnviado .modal-content > div > div:first-child {
    width: 100px;
    height: 100px;
    margin: 0 auto 1.5rem;
    background: linear-gradient(135deg, var(--verde, #b0bf3e) 0%, var(--verde-claro, #d0da89) 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 3rem !important;
    box-shadow: 0 10px 25px rgba(176, 191, 62, 0.4);
    animation: pulseExito 1.5s ease infinite;
}

/* Animación de pulso */
@keyframes pulseExito {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 10px 25px rgba(176, 191, 62, 0.4);
    }
    50% {
        transform: scale(1.06);
        box-shadow: 0 15px 35px rgba(176, 191, 62, 0.6);
    }
}

    .modal-exito-12 {
        max-width: 460px !important;
        background: linear-gradient(145deg, #ffffff 0%, #e7ecea 100%) !important;
        border-radius: 30px !important;
        border: none !important;
        overflow: hidden;
        position: relative;
        box-shadow: 0 30px 60px -15px rgba(9, 83, 116, 0.5),
                    0 0 0 3px rgba(176, 191, 62, 0.15) !important;
    }
    .modal-exito-12-contenido {
        padding: 3rem 2rem 2.5rem;
        text-align: center;
        position: relative;
    }
    .escena-3d {
        width: 160px;
        height: 130px;
        margin: 0 auto 1.5rem;
        position: relative;
        perspective: 600px;
    }
    .escena-3d-sombra {
        position: absolute;
        bottom: 10px;
        left: 50%;
        transform: translateX(-50%);
        width: 100px;
        height: 15px;
        background: radial-gradient(ellipse, rgba(9, 83, 116, 0.3) 0%, transparent 70%);
        border-radius: 50%;
        animation: sombraVibrar 3s ease-in-out infinite;
    }
    @keyframes sombraVibrar {
        0%, 100% { transform: translateX(-50%) scale(1); opacity: 0.5; }
        50% { transform: translateX(-50%) scale(0.85); opacity: 0.3; }
    }
    .escena-3d-correo {
        position: absolute;
        top: 20px;
        left: 50%;
        transform: translateX(-50%);
        animation: flotar12 3s ease-in-out infinite;
        z-index: 2;
    }
    @keyframes flotar12 {
        0%, 100% { transform: translateX(-50%) translateY(0) rotate(-3deg); }
        50% { transform: translateX(-50%) translateY(-15px) rotate(3deg); }
    }
    .escena-3d-correo svg {
        width: 110px;
        height: 80px;
        filter: drop-shadow(0 8px 10px rgba(9, 83, 116, 0.35));
    }
    .modal-exito-12 h3 {
        color: #095374 !important;
        font-size: 1.5rem !important;
        font-weight: 700 !important;
        margin-bottom: 0.8rem !important;
        font-family: 'Montserrat', sans-serif;
    }
    .modal-exito-12 p {
        color: #434444 !important;
        font-size: 1rem !important;
        line-height: 1.6;
        margin-bottom: 2rem !important;
        opacity: 0.85;
    }
    .btn-modal-exito-12 {
        background: linear-gradient(145deg, #095374 0%, #063c56 100%) !important;
        color: white !important;
        border: none !important;
        padding: 1rem 3rem !important;
        border-radius: 50px !important;
        font-size: 1rem !important;
        font-weight: 600 !important;
        cursor: pointer;
        transition: all 0.3s ease;
        display: inline-flex !important;
        align-items: center;
        gap: 8px;
        font-family: 'Montserrat', sans-serif;
        box-shadow: 0 10px 20px rgba(9, 83, 116, 0.35),
                    inset 0 2px 4px rgba(255, 255, 255, 0.15),
                    0 2px 0 #042a3d;
    }
    .btn-modal-exito-12:hover {
        background: linear-gradient(145deg, #b0bf3e 0%, #8ba32a 100%) !important;
        color: #095374 !important;
        transform: translateY(-3px);
        box-shadow: 0 15px 30px rgba(176, 191, 62, 0.5),
                    0 2px 0 #6d8322;
    }