/* ─── 1. Variables CSS globales ─────────────────────────────────── */
:root {
    --bs-primary: #182d47; /* Nuevo azul aplicado */
    --bs-primary-text-emphasis: #0b1a2b;
    --bs-primary-bg-subtle: #d6e4f5;
    --bs-primary-border-subtle: #a3c3e8;
    --bs-link-color: #ee7e3c;
    --bs-link-hover-color: #c9601f;
    --bs-paragraph: #333333;
    --ayv-blue: #182d47; /* Color principal actualizado */
    --ayv-orange: #ee7e3c;
    --ayv-navy: #0C2340;
}

/* ─── 2. Botón principal ─────────────────────────── */
.default-btn {
    background-color: var(--ayv-orange);
    color: #ffffff;
}

    .default-btn:hover {
        background-color: var(--ayv-navy);
        color: #ffffff;
    }

    .default-btn.two {
        background-color: var(--ayv-navy);
        color: #ffffff;
    }

        .default-btn.two:hover {
            background-color: var(--ayv-orange);
            color: #ffffff;
        }

    .default-btn.three {
        background-color: #ffffff;
        color: var(--ayv-navy);
    }

        .default-btn.three:hover {
            background-color: var(--ayv-navy);
            color: #ffffff;
        }

/* ─── 3. Navegación ───────────────── */
.navbar .navbar-nav .nav-item .nav-link {
    color: var(--ayv-navy) !important;
    font-weight: 600;
}

    .navbar .navbar-nav .nav-item .nav-link.active,
    .navbar .navbar-nav .nav-item .nav-link:hover {
        color: var(--ayv-orange) !important;
    }

/* ─── 4. Dropdown ─────────────── */
.navbar .navbar-nav .nav-item .dropdown-menu {
    border-left-color: var(--ayv-orange);
}

/* ─── 5. Read more links ────────────────────────────────────────── */
.read-more {
    color: var(--ayv-orange);
}

    .read-more:hover {
        color: var(--ayv-navy);
    }

/* ─── 6. Bootstrap btn-primary ─────────────────────────────────── */
.btn-primary {
    background-color: var(--ayv-navy);
    border-color: var(--ayv-navy);
    color: #ffffff;
}

/* ─── 7. Go-top button ──────────────────────────────────────────── */
.go-top {
    background-color: var(--ayv-orange);
}

    .go-top:hover {
        background-color: var(--ayv-navy);
    }

/* ─── 8. Preloader ──────────────────────── */
.wavy span {
    color: var(--ayv-navy);
}

/* ─── 9. Top header bar ─────────────────────────────── */
.top-header-area {
    background-color: var(--ayv-navy) !important;
}

    .top-header-area .left-side li a i {
        color: var(--ayv-orange);
    }

/* ─── 10. Footer ────────────────────────────────────────────────── */
.footer-area,
.copyright-area {
    background-color: var(--ayv-blue); /* Usa el nuevo azul #182d47 */
}

    .footer-area .service-link li a:hover,
    .footer-area .get-touch li a:hover {
        color: var(--ayv-orange);
    }

    .footer-area .social li a:hover {
        background-color: var(--ayv-orange);
    }

/* ─── 11. Fondos oscuros ─────────────────── */
.how-it-works-area {
    background-color: var(--ayv-navy) !important;
}

.single-works-card {
    background-color: var(--ayv-blue) !important;
}
/* #182d47 */
.features-area {
    background-color: var(--ayv-navy) !important;
}

.features-content ul li {
    background-color: var(--ayv-blue) !important;
}

/* ─── 12. Avatares ─────────── */
.ayv-avatar.orange {
    background-color: var(--ayv-orange);
}

.ayv-avatar.navy {
    background-color: var(--ayv-blue);
}

/* ─── 13. Redes Sociales ──────────────────────── */
.ayv-social-fb {
    color: var(--ayv-navy);
}

    .ayv-social-fb:hover {
        color: var(--ayv-blue);
    }

.ayv-social-ig {
    color: var(--ayv-orange);
}

    .ayv-social-ig:hover {
        color: #c9601f;
    }

/* ─── 14. Navbar — siempre visible, fondo sólido desde scroll=0 ── */
/*
 * Finto posiciona .top-header-info como `position: absolute` y el
 * .navbar interior como `background-color: transparent` — en scroll=0
 * el menú queda invisible sobre el hero. Lo corregimos aquí:
 */
.top-header-info {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000;
}
.top-header-info .navbar {
    background-color: #ffffff !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.10);
}

/* ─── 15. Override lima #9edd05 → naranja brand en todos los elementos Finto ── */

/* Clase utilitaria de fondo (usada en pills de subtítulo, etc.) */
.bg-color-9edd05 {
    background-color: var(--ayv-orange) !important;
}

/* choose-card icons (Beneficios, Requisitos, Sucursales) */
.choose-card i {
    background-color: var(--ayv-orange) !important;
    color: #ffffff !important;
}
.choose-card:hover i {
    background-color: var(--ayv-navy) !important;
    color: var(--ayv-orange) !important;
}

/* Play button sobre imagen de choose-area */
.choose-image .paly-content .popup-btn:hover {
    background-color: var(--ayv-orange) !important;
}

/* Features section — subtítulo e íconos */
.features-content .section-heading .sub-title {
    color: var(--ayv-orange) !important;
}
.features-content ul li i {
    background-color: var(--ayv-orange) !important;
    color: #ffffff !important;
}
.features-content ul li:hover i {
    color: var(--ayv-orange) !important;
    background-color: var(--ayv-navy) !important;
}

/* Banner y mission-card */
.main-banner-area .info .user li:last-child {
    background-color: var(--ayv-orange) !important;
}
.banner-area .mission-card ul {
    background-color: var(--ayv-orange) !important;
}

/* Tags de depósito y play button de revenue */
.feature-provide .deposit li a:hover {
    background-color: var(--ayv-orange) !important;
}
.revenue-image .paly-content .popup-btn:hover {
    background-color: var(--ayv-orange) !important;
}

/* Partner area */
.partner-area .title p {
    color: var(--ayv-orange) !important;
}

/* Modal de búsqueda */
.search-modal .modal-body .popup-form .popup-btn:hover {
    color: var(--ayv-orange) !important;
}

/* Hero subtitle accent */
.hero-content .title .sub-t {
    color: var(--ayv-orange) !important;
}