:root {

            --color-primario: #7d2447;
            --color-primario1: #671c33;
            --color-primario2: #6f1728;
            --color-primario3: #861943;
            --color-secundario: #828386;
            --color-oscuro: #4a5350;
            --color-resalte: #bfb591;
        }

        body {
            background-color: #fff;
            font-family: "Inter", sans-serif;
        }

        /* ================= NAVBAR ================= */
      /* ================= NAVBAR ================= */

.navbar-bg {
    background-image: url('../img/navbar.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}


.navbar-overlay {
    width: 100%;
    display: flex;
    align-items: center;
    min-height: 80px; /* IMPORTANTE para que se vea la imagen */
}


   /* ================= BANNER ================= */

.banner {
    min-height: 100vh;
    background-image: url('../img/bg-puebla.png');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;

    display: flex;
    align-items: center;
    justify-content: center;

    position: relative;
    margin-top: 90px; /* altura navbar */
}

/* Overlay oscuro para legibilidad */
.banner::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
}

.banner-content {
    position: relative;
    z-index: 1;
    color: #fff;
    text-align: center;
    max-width: 800px;
    padding: 40px;
}

        
       /* ================= FOOTER ================= */

footer.footer-bg {
    background-image: url('../img/navbar.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;

    color: #fff;
    position: relative;
}

/* Overlay para legibilidad */
footer.footer-bg::before {
    content: "";
    position: absolute;
    inset: 0;
}

/* Asegura que el contenido esté sobre el overlay */
footer.footer-bg .footer-content {
    position: relative;
    z-index: 1;
    padding: 60px 0;
}

 .faq-item {
            border: 2px solid var(--color-primario);
            border-radius: 12px;
            padding: 18px;
            background: white;
        }

        /* ===== FLOATING SEARCH ===== */
/* CONTENEDOR */
#floatingSearch {
    position: absolute;
    top: 190px;
    right: 16px;
    z-index: 2000;
}

/* FORM OCULTO */
.search-form {
    display: none;
    margin-top: 10px;
    background: #fff;
    padding: 12px;
    width: 320px;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0,0,0,.3);
}

/* FORM VISIBLE */
.search-form.active {
    display: block;
}

/* Botón flotante */
.search-fab {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #7d2447; /* vino institucional */
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 16px rgba(0,0,0,.25);
    cursor: pointer;
}


.search-fab img {
    width: 22px;
    height: 22px;
    filter: invert(17%) sepia(37%) saturate(2665%) hue-rotate(327deg);
}

/* Formulario */
.search-form {
    background: #fff;
    padding: 12px;
    width: 320px;
    border-radius: 12px;
    box-shadow: 0 6px 20px rgba(0,0,0,.25);
}

/* ===== MOBILE ===== */
@media (max-width: 992px) {

    .search-form {
        display: none;
        width: 90vw;
    }

    .search-form.active {
        display: block;
    }

    .search-fab {
        display: flex;
    }
}


/* SOLO MOBILE */
@media (max-width: 992px) {
    .map-search-mobile {
        display: flex;
    }
}

/* ===== MODO BÚSQUEDA MOBILE ===== */
@media (max-width: 992px) {

    /* Oculta todo el panel */
    .map-ui > .card {
        display: none;
    }

    /* Muestra SOLO el buscador */
    .map-ui.search-mode .search-only {
        display: block;
    }

    #map {
        height: 100vh;
        overflow: auto;
    }

    .map-ui {
        max-height: 90vh;
        overflow-y: auto;
    }
    
}