/* Estilos del club de beneficios (egresados-beneficios.blade.php) */

/* Card de aliados: estado hover (fondo lila, resplandor, foto oscurecida con "+") */
.egr-aliado-card {
    transition: background-color 0.25s ease, box-shadow 0.25s ease;
}

.egr-aliado-card:hover {
    background-color: rgba(173, 81, 255, 0.2);
    box-shadow: 0 0 76px 0 rgba(173, 81, 255, 0.36);
}

.egr-aliado-toggle {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 16px;
}

/* Capa negra al 20% sobre la foto */
.egr-aliado-toggle::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.2);
    opacity: 0;
    transition: opacity 0.25s ease;
    pointer-events: none;
}

/* Círculo translúcido con el símbolo "+" centrado */
.egr-aliado-toggle::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 44px;
    height: 44px;
    transform: translate(-50%, -50%);
    border-radius: 9999px;
    background:
        linear-gradient(#fff, #fff) center / 20px 2px no-repeat,
        linear-gradient(#fff, #fff) center / 2px 20px no-repeat,
        rgba(255, 255, 255, 0.2);
    opacity: 0;
    transition: opacity 0.25s ease;
    pointer-events: none;
}

/* En hover la foto se oculta y queda solo el contenedor blanco (gris con la capa) y el "+" */
.egr-aliado-toggle {
    background-color: transparent;
    transition: background-color 0.25s ease;
}

.egr-aliado-toggle img {
    transition: opacity 0.25s ease;
}

.egr-aliado-card:hover .egr-aliado-toggle {
    background-color: #fff;
}

.egr-aliado-card:hover .egr-aliado-toggle img {
    opacity: 0;
}

.egr-aliado-card:hover .egr-aliado-toggle::before,
.egr-aliado-card:hover .egr-aliado-toggle::after {
    opacity: 1;
}

/* Si la card está abierta, el "+" pasa a "−" */
.egr-aliado-toggle[aria-expanded="true"]::after {
    background:
        linear-gradient(#fff, #fff) center / 20px 2px no-repeat,
        rgba(255, 255, 255, 0.2);
}

/* Velo morado sobre la foto del hero */
.egr-hero-velo {
    background: rgba(28, 0, 54, 0.55);
}

/* Sección "Suma tu empresa al Club de Beneficios" */
.beneficios-empresas-bg {
    background: linear-gradient(-53deg, #fcd58c 4.66%, #f44f08 40.76%, #eb2c49 65.24%);
}
