/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 9/04/2026, 10:26:49 AM
    Author     : kpesantez
*/
/* ====== TITULOS ====== */
.titulo-seccion {
    font-size: 1.6rem;
    font-weight: 700;       
    border-radius: 6px;
    transition: all 0.3s ease;
    padding: 6px 10px;
}

.titulo-seccion:hover {
    transform: translateX(5px);
}

/* ====== BLOQUE AZUL IZQUIERDA ====== */
.section-titulo-bloque {
    height: 40px;
    background: linear-gradient(#68A883, #68A883);
    border-radius: 0px;
}

/* ====== TEXTO BASE ====== */
.texto-justificado {
    line-height: 1.8;
    font-size: 0.95rem;
}

/* SOLO TEXTO NEGRO EN SECCIONES DE CALIDAD */
.seccion-calidad .texto-justificado {
    color: #444;
}

/* TEXTO BLANCO EN FOOTER */
#page-footer .texto-justificado,
#page-footer p,
#page-footer li {
    color: #fff !important;
}

/* ====== SECCIONES ====== */
section {
    transition: all 0.4s ease;
}

/* FONDOS CORRECTOS (LO QUE PEDISTE) */
.seccion-calidad {
    background: #ffffff; /* BLANCO */
}

.slanted-div {
    background: linear-gradient(135deg, #f5f7fa, #e4ecf7); /* GRIS */
}

/* ====== TARJETAS DE CERTIFICADOS ====== */
.img-thumbnail {
    border-radius: 12px !important;
    border: 2px solid transparent !important; 
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
    transition: all 0.35s ease;
}

.img-thumbnail:hover {
    transform: translateY(-8px) scale(1.06);

    border: 2px solid #68A883 !important;

    box-shadow: 
        0 0 0 5px rgba(104,168,131,0.5),
        0 0 20px rgba(104,168,131,0.8),
        0 0 40px rgba(104,168,131,0.6),
        0 20px 40px rgba(0,0,0,0.25);
}

/* ====== CLICK ====== */
.img-open-certificado {
    cursor: pointer;
}

/* ====== GRID ====== */
#page-certificados .row,
#page-controles-internos .row {
    justify-content: center;
}

/* ====== ANIMACIONES ====== */
.fade-in {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s ease;
}

.fade-in.visible {
    opacity: 1;
    transform: translateY(0);
}

/* ====== RESPONSIVE ====== */
@media (max-width: 768px) {
    .titulo-seccion {
        font-size: 1.3rem;
    }

    .texto-justificado {
        font-size: 0.9rem;
    }
}