/* ===========================
   BENEFICIOS
=========================== */
.benefits-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:30px;
}

.benefit-card{
    background:var(--surface-1);
    border:1px solid var(--border-subtle);
    border-radius:var(--radius-lg);
    padding:35px 28px;
    text-align:center;
    transition:var(--transition-fast);
}

.benefit-card:hover{
    transform:translateY(-8px);
    border-color:var(--border-accent);
    box-shadow:0 20px 40px var(--glow-soft);
}

.benefit-icon{
    width:64px;
    height:64px;
    margin:0 auto 22px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
    box-shadow:0 0 25px var(--glow-primary);
    font-size:26px;
    color:var(--text-primary);
}

.benefit-card h3{
    font-size:20px;
    font-weight:700;
    color:var(--text-primary);
    margin-bottom:12px;
}

.benefit-card p{
    color:var(--text-muted);
    font-size:15px;
    line-height:1.6;
}

/* ===========================
   CURSOS DESTACADOS
=========================== */
.courses-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:30px;
}

.course-card{
    background:var(--surface-2);
    border:1px solid var(--border-subtle);
    border-radius:var(--radius-lg);
    overflow:hidden;
    transition:var(--transition-fast);
    display:flex;
    flex-direction:column;
}

.course-card:hover{
    transform:translateY(-8px);
    border-color:var(--border-accent);
    box-shadow:0 20px 45px var(--glow-soft);
}

.course-thumb{
    height:170px;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:42px;
    color:rgba(255,255,255,.85);
    background:linear-gradient(135deg, #10254d, #081325);
}

.course-thumb::after{
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(circle at 30% 20%, rgba(45,169,255,.35), transparent 60%);
}

.course-category{
    position:absolute;
    top:14px;
    left:14px;
    background:rgba(5,8,22,.75);
    color:var(--accent-tertiary);
    font-size:12px;
    font-weight:700;
    letter-spacing:.5px;
    text-transform:uppercase;
    padding:6px 12px;
    border-radius:50px;
    z-index:2;
}

.course-body{
    padding:24px;
    display:flex;
    flex-direction:column;
    gap:14px;
    flex:1;
}

.course-body h3{
    font-size:19px;
    font-weight:700;
    color:var(--text-primary);
}

.course-rating{
    color:#ffb020;
    font-size:14px;
}

.course-rating span{
    color:var(--text-muted);
    margin-left:6px;
}

.course-rating-nuevo{
    color:var(--text-muted);
    font-size:13px;
    font-style:italic;
}

/* ---------- Curso destacado (panel admin -> destacado:true) ---------- */
.course-card-destacado{
    border-color:rgba(230,200,119,.5);
    box-shadow:0 0 0 1px rgba(230,200,119,.25), 0 20px 45px rgba(230,180,80,.12);
}

.course-card-destacado:hover{
    border-color:rgba(230,200,119,.8);
    box-shadow:0 0 0 1px rgba(230,200,119,.4), 0 24px 50px rgba(230,180,80,.22);
}

.course-destacado-badge{
    position:absolute;
    top:14px;
    right:14px;
    z-index:2;
    display:inline-flex;
    align-items:center;
    gap:6px;
    background:linear-gradient(135deg, #e6c877, #c99a3d);
    color:#1d1200;
    font-size:11px;
    font-weight:800;
    letter-spacing:.3px;
    text-transform:uppercase;
    padding:6px 12px;
    border-radius:50px;
    box-shadow:0 4px 14px rgba(201,154,61,.4);
}

.courses-empty{
    grid-column:1 / -1;
    text-align:center;
    color:var(--text-muted);
    font-size:15px;
    padding:60px 20px;
}

.course-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-top:auto;
    padding-top:10px;
}

.course-price-block{
    display:flex;
    flex-direction:column;
}

.course-price-original{
    font-size:12px;
    color:var(--text-muted);
    text-decoration:line-through;
}

.course-price{
    font-size:20px;
    font-weight:800;
    color:var(--accent-secondary);
}

.course-launch-tag{
    display:inline-block;
    background:linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
    color:var(--text-primary);
    font-size:10px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.3px;
    padding:5px 10px;
    border-radius:50px;
    white-space:nowrap;
}

/* ===========================
   TESTIMONIOS
=========================== */
.testimonial-card{
    background:var(--surface-1);
    border:1px solid var(--border-subtle);
    border-radius:var(--radius-lg);
    padding:45px;
    max-width:760px;
    margin:0 auto;
    text-align:center;
}

.testimonial-quote{
    font-size:20px;
    line-height:1.7;
    color:var(--text-primary);
    margin-bottom:30px;
}

.testimonial-quote::before{
    content:"“";
    color:var(--accent-secondary);
}

.testimonial-quote::after{
    content:"”";
    color:var(--accent-secondary);
}

.testimonial-avatar{
    width:60px;
    height:60px;
    margin:0 auto 16px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:800;
    font-size:18px;
    color:var(--text-primary);
    background:linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
    box-shadow:0 0 20px var(--glow-primary);
}

.testimonial-name{
    font-weight:700;
    color:var(--text-primary);
}

.testimonial-role{
    font-size:14px;
    color:var(--text-muted);
}

#testimonialCarousel .carousel-control-prev,
#testimonialCarousel .carousel-control-next{
    width:44px;
    height:44px;
    top:50%;
    transform:translateY(-50%);
    border-radius:50%;
    background:var(--surface-3);
    border:1px solid var(--border-accent);
    opacity:.9;
}

#testimonialCarousel .carousel-control-prev{ left:-10px; }
#testimonialCarousel .carousel-control-next{ right:-10px; }

/* ===========================
   FAQ (Bootstrap accordion)
=========================== */
.faq-accordion .accordion-item{
    background:var(--surface-1);
    border:1px solid var(--border-subtle);
    border-radius:var(--radius-md) !important;
    margin-bottom:16px;
    overflow:hidden;
}

.faq-accordion .accordion-button{
    background:var(--surface-1);
    color:var(--text-primary);
    font-weight:700;
    font-size:17px;
    padding:22px 26px;
    box-shadow:none;
}

.faq-accordion .accordion-button:not(.collapsed){
    background:var(--surface-3);
    color:var(--accent-secondary);
}

.faq-accordion .accordion-button:focus{
    box-shadow:0 0 0 3px var(--glow-soft);
}

.faq-accordion .accordion-button::after{
    filter:invert(1) sepia(1) saturate(5) hue-rotate(180deg);
}

.faq-accordion .accordion-body{
    background:var(--surface-1);
    color:var(--text-muted);
    font-size:15px;
    line-height:1.7;
    padding:0 26px 24px;
}
