/* =============================================================
   SITE.CSS - ColProfTur Web
   ============================================================= */

/* -- Scroll suave -------------------------------------------- */
html { scroll-behavior: smooth; }

/* -- Animaciones -------------------------------------------- */
@keyframes fadeUp {
    from { opacity: 0; transform: translateY(24px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.animate-fadeUp  { animation: fadeUp  .6s ease both; }
.animate-fadeIn  { animation: fadeIn  .8s ease both; }
.delay-100 { animation-delay: .1s; }
.delay-200 { animation-delay: .2s; }
.delay-300 { animation-delay: .3s; }
.delay-400 { animation-delay: .4s; }

/* -- Hero ---------------------------------------------------- */
.hero-gradient {
    background: linear-gradient(135deg, #0f3d28 0%, #1a5f3f 40%, #2d7a55 70%, #0f3d28 100%) !important;
}
.hero-pattern {
    background-image:
        radial-gradient(circle at 20% 50%, rgba(200,151,42,0.15) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(255,255,255,0.05) 0%, transparent 40%);
}

/* -- Navbar -------------------------------------------------- */
.navbar-transparent { background: transparent; }
.navbar-solid       { background: #0f3d28; box-shadow: 0 4px 20px rgba(0,0,0,0.3); }

/* -- Seccion verde stats ------------------------------------ */
.bg-verde-section { background-color: #1a5f3f !important; }

/* -- Cards --------------------------------------------------- */
.card-hover {
    transition: transform .25s ease, box-shadow .25s ease;
}
.card-hover:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.12);
}

/* -- Section tag -------------------------------------------- */
.section-tag {
    display: inline-flex;
    align-items: center;
    background: #e8f5e9;
    color: #1a5f3f;
    padding: 4px 14px;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    margin-bottom: 12px;
}

/* -- Botones ------------------------------------------------- */
.btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 28px;
    background: #1a5f3f;
    color: white !important;
    border-radius: 999px;
    font-weight: 600;
    font-size: .9375rem;
    transition: all .2s ease;
    border: none;
    cursor: pointer;
    text-decoration: none;
}
.btn-primary:hover {
    background: #0f3d28;
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(26,95,63,0.4);
}
.btn-outline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 28px;
    background: transparent;
    color: white !important;
    border: 2px solid rgba(255,255,255,0.6);
    border-radius: 999px;
    font-weight: 600;
    font-size: .9375rem;
    transition: all .2s ease;
    cursor: pointer;
    text-decoration: none;
}
.btn-outline:hover {
    background: rgba(255,255,255,0.15);
    border-color: white;
}

/* -- Verde line --------------------------------------------- */
.verde-line {
    width: 48px;
    height: 4px;
    background: linear-gradient(90deg, #1a5f3f, #c8972a);
    border-radius: 4px;
    margin: 12px 0 20px;
}

/* -- Navbar fix --------------------------------------------- */
header {
    background: rgba(15, 61, 40, 0.95) !important;
    backdrop-filter: blur(10px);
}

/* -- Footer -------------------------------------------------- */
footer {
    background: #0a0f1a !important;
}

/* -- Tabla --------------------------------------------------- */
.table-row-hover:hover td { background: #f0fdf4 !important; }
.badge-activo     { background: #d1fae5; color: #065f46; padding: 3px 10px; border-radius: 999px; font-size: .75rem; font-weight: 600; }
.badge-inactivo   { background: #fee2e2; color: #991b1b; padding: 3px 10px; border-radius: 999px; font-size: .75rem; font-weight: 600; }
.badge-suspendido { background: #fef3c7; color: #92400e; padding: 3px 10px; border-radius: 999px; font-size: .75rem; font-weight: 600; }

/* =============================================================
   SEO - Completar con schema.org cuando este el dominio listo
   ============================================================= */