.elementor-304 .elementor-element.elementor-element-1ac690b{--display:flex;}body.elementor-page-304:not(.elementor-motion-effects-element-type-background), body.elementor-page-304 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}/* Start custom CSS for html, class: .elementor-element-8f6f4a5 */#wpadminbar {
    display: none !important;
}

html {
    margin-top: 0 !important;
}

/* ======================================================
   PALETA Y FUENTES
====================================================== */
:root {
    --gl-primary: #0B6FA4;
    --gl-text: #0F172A;
    --gl-soft: #64748B;
    --gl-whatsapp: #25D366;
}

body {
    margin: 0;
    padding: 0;
    font-family: "Inter", sans-serif;
    background: #F5F7FA;
}

/* ======================================================
   TOPBAR — ARREGLADO
====================================================== */
.topbar {
    position: sticky;
    top: 0;
    z-index: 100;
    height: 70px;                   /* <<< ALTURA FIJA */
    background: #ffffffcc;
    backdrop-filter: blur(10px);
    display: flex;
    justify-content: space-between;
    align-items: center;            /* <<< CENTRA TODO */
    padding: 0 40px;
    box-shadow: 0 4px 18px rgba(0,0,0,0.05);
}

/* LOGO — REPARADO */
.gl-logo {
    height: 70px !important;        /* <<< TAMAÑO PERFECTO */
    width: auto;
    object-fit: contain;
    margin: 0;
    display: block;
}

/* ======================================================
   NAV LINKS
====================================================== */
.nav-links {
    display: flex;
    gap: 28px;
    align-items: center;
}

.nav-links {
    display: flex;
    gap: 35px;
    align-items: center;

    /* 💙 LLEVAR TODO EL MENÚ A LA DERECHA */
    margin-left: auto;
    margin-right: 25px;  /* ajustable */
}


.nav-links a:hover {
    opacity: .7;
}

/* ======================================================
   BOTÓN WHATSAPP — ESTILO PREMIUM
====================================================== */
.whatsapp-btn {
    padding: 9px 22px;
    border-radius: 999px;
    border: 2px solid var(--gl-whatsapp);
    background: white;
    color: var(--gl-whatsapp);
    font-weight: 600;
    text-decoration: none;
    transition: .25s;
}

.whatsapp-btn:hover {
    background: var(--gl-whatsapp);
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 6px 14px rgba(37,211,102,.3);
}

/* ======================================================
   HERO — CENTRADO Y ARREGLADO
====================================================== */
.hero {
    text-align: center;
    padding: 40px 20px;
    animation: fadeUp .8s ease forwards;
}

.hero h1 {
    font-size: 32px;
    color: var(--gl-primary);
    margin-top: 20px;              /* <<< ESPACIO CORREGIDO */
    margin-bottom: 50px;
    font-weight: 700;
}

/* ======================================================
   OPCIONES (ESTUDIANTE / PROFESOR)
====================================================== */
.options-container {
    display: flex;
    justify-content: center;
    gap: 80px;
    flex-wrap: wrap;
    margin-top: 20px;
}

.option-box {
    text-align: center;
    transition: .3s;
    cursor: pointer;
    animation: fadeUp 1s ease forwards;
}

.option-box img {
    width: 230px;
    max-width: 90%;
    transition: transform .35s;
}

.option-box:hover img {
    transform: scale(1.06);
}

.option-box p {
    margin-top: 18px;
    font-size: 20px;
    color: var(--gl-primary);
    font-weight: 600;
}

/* ======================================================
   ANIMACIONES
====================================================== */
@keyframes fadeUp {
    from { opacity: 0; transform: translateY(25px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ======================================================
   RESPONSIVE (MÓVIL)
====================================================== */
@media (max-width: 900px) {

    .topbar {
        padding: 0 20px;
        height: 65px;
    }

    .gl-logo {
        height: 36px !important;
    }

    .nav-links {
        display: none; /* Limpio y profesional */
    }

    .whatsapp-btn {
        padding: 8px 15px;
        font-size: 14px;
    }

    .hero h1 {
        font-size: 26px;
        margin-bottom: 30px;
    }

    .options-container {
        gap: 50px;
    }

    .option-box img {
        width: 170px;
    }

    .option-box p {
        font-size: 18px;
    }
}

/* =====================================================
   1. MOVER HOME + LOGIN MÁS A LA DERECHA
===================================================== */
.nav-links {
    margin-left: 120px; /* AJUSTAR SI QUIERES MÁS A LA DERECHA */
    display: flex;
    gap: 35px;
    align-items: center;
}

.nav-links a {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* SVG estilo uniforme */
.nav-links svg {
    stroke: var(--gl-primary);
    transition: .3s;
}

.nav-links a:hover svg {
    stroke: #084b7c;
}

/* =====================================================
   2. ALINEAR PERFECTAMENTE IMÁGENES DE ESTUDIANTE/PROFESOR
===================================================== */

.options-container {
    display: flex;
    justify-content: center;
    gap: 80px;
    flex-wrap: wrap;
    margin-top: 30px;
}

/* CONTENEDOR FIJO */
.option-box {
    width: 250px;
    height: 320px; /* MISMO TAMAÑO PARA AMBOS */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start; /* TÍTULO SIEMPRE ABAJO */
    text-align: center;
}

.option-box img {
    width: 200px;
    height: 200px; /* MISMA ALTURA */
    object-fit: contain; /* SIN DISTORSIÓN */
    margin-bottom: 10px;
}

/* Para hacer más elegante el hover */
.option-box:hover {
    transform: translateY(-5px);
    transition: .25s ease;
}

.option-box:hover img {
    transform: scale(1.05);
}

.menu-right {
    display: flex;
    align-items: center;
    gap: 30px; /* espacio entre nav y botón soporte */
    margin-left: auto; /* empuja todo a la derecha */
}

.grecaptcha-badge { 
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Scrollbar elegante estilo Glottary */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #e9eef3;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: #0B6FA4; /* tu primary */
    border-radius: 10px;
    border: 2px solid #e9eef3;
}

::-webkit-scrollbar-thumb:hover {
    background: #084F75;
}/* End custom CSS */