/* Paleta y tipografia Poppins (300-800) de Novoweb.
   Los tokens no declarados heredan los defaults de style.css. */

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins-300.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins-400.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins-500.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins-600.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins-700.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins-800.woff2') format('woff2');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

:root {
    --color-acento:        #2B6CB0;
    --color-acento-hover:  #215387;
    --color-acento-claro:  #E6F0FA;
    --color-link:          #2B6CB0;
    --color-link-hover:    #215387;
    --color-nav-texto-hover: #2B6CB0;
    --fuente-principal:    'Poppins', sans-serif;

    /* Overlay del hero full-bleed: gradiente azul sobre el video */
    --hero-overlay: linear-gradient(135deg, rgba(26,32,44,0.85) 0%, rgba(33,83,135,0.7) 100%);
}

/* Hero: el resaltado del titulo en azul claro sobre overlay oscuro */
.hero-centered .hero-title span {
    color: #63B3ED;
}

/* Botones del diseno original: fondo blanco, texto gris oscuro, borde
   azulado 2px y radius medio. Hover invierte. */
.btn {
    border-radius: 8px;
    padding: 14px 32px;
    font-weight: 600;
    font-size: 0.95rem;
    border: 2px solid var(--color-acento);
    background: #ffffff;
    color: #2D3748;
}
.btn:hover {
    background: var(--color-acento);
    color: #ffffff;
}
.btn-primary {
    background: #ffffff;
    color: #2D3748;
    box-shadow: 0 4px 15px rgba(43, 108, 176, 0.4);
}
.btn-primary:hover {
    background: var(--color-acento);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(43, 108, 176, 0.5);
}
.btn-outline {
    background: #ffffff;
    color: #2D3748;
}
.btn-outline:hover {
    background: var(--color-acento);
    color: #ffffff;
    transform: translateY(-2px);
}

/* Iconos de features: los *-white llevan el color en el propio SVG */
.features-gradient .feature-icon-img {
    width: 28px;
    height: 28px;
}