/* ----------------------------------------------------------------
   Brisas Lens Óptica — sitio público (portada y catálogo)
   Marca: naranja #f38120 y negro del logo. El naranja va de FONDO con
   texto negro (6,9:1); como texto sobre blanco se usa --bl-naranja-texto.
---------------------------------------------------------------- */

@font-face {
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 300 800;
    font-display: swap;
    src: url('../fonts/outfit-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    --bl-naranja: #f38120;
    --bl-naranja-hover: #e57412;
    --bl-naranja-texto: #a85300;
    --bl-naranja-suave: #fff3e8;
    --bl-tinta: #161616;
    --bl-texto: #3b3b3b;
    --bl-suave: #5c5c5c;
    --bl-linea: #e4e4e4;
    --bl-gris: #f4f4f4;
    --bl-blanco: #ffffff;
    --bl-radio: 16px;
    --bl-radio-control: 10px;
    --bl-sombra: 0 1px 2px rgba(22, 22, 22, .06), 0 8px 24px rgba(22, 22, 22, .06);
    --bl-fuente: 'Outfit', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --bl-cabecera: 72px;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
    margin: 0;
    font-family: var(--bl-fuente);
    font-size: 1.0625rem;
    line-height: 1.6;
    color: var(--bl-texto);
    background: var(--bl-blanco);
    -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
h1, h2, h3, h4 { color: var(--bl-tinta); font-weight: 700; line-height: 1.12; margin: 0; letter-spacing: -0.015em; }
p { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--bl-tinta); outline-offset: 3px; border-radius: 4px; }
[id] { scroll-margin-top: calc(var(--bl-cabecera) + 16px); }
.bl-oculto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.ico { width: 1em; height: 1em; fill: currentColor; flex: none; vertical-align: -0.125em; }

.bl-contenedor { width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 16px; }
@media (min-width: 768px) { .bl-contenedor { padding: 0 24px; } }

.bl-seccion { padding: 64px 0; }
.bl-seccion--gris { background: var(--bl-gris); }
.bl-pagina + .bl-seccion { padding-top: 32px; }
@media (min-width: 992px) { .bl-seccion { padding: 96px 0; } }

.bl-titulo { font-size: clamp(1.75rem, 1.2rem + 2.2vw, 2.5rem); }
.bl-bajada { margin-top: 12px; max-width: 60ch; color: var(--bl-suave); }
.bl-cabeza { margin-bottom: 32px; }
@media (min-width: 992px) { .bl-cabeza { margin-bottom: 44px; } }
.bl-cabeza--fila { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 24px; }

.bl-enlace {
    display: inline-flex; align-items: center; gap: 6px;
    color: var(--bl-naranja-texto); font-weight: 600; text-decoration: none;
}
.bl-enlace:hover { text-decoration: underline; text-underline-offset: 4px; }
.bl-enlace .ico { transition: transform .2s ease; }
.bl-enlace:hover .ico { transform: translateX(3px); }

/* ---------- Botones ---------- */
.bl-boton {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 48px; padding: 12px 22px;
    border: 2px solid transparent; border-radius: var(--bl-radio-control);
    font-weight: 600; font-size: 1rem; line-height: 1.2; white-space: nowrap;
    text-decoration: none; cursor: pointer;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .1s ease;
}
.bl-boton:active { transform: translateY(1px); }
.bl-boton--primario { background: var(--bl-naranja); color: var(--bl-tinta); }
.bl-boton--primario:hover { background: var(--bl-naranja-hover); }
.bl-boton--oscuro { background: var(--bl-tinta); color: var(--bl-blanco); }
.bl-boton--oscuro:hover { background: #333; }
.bl-boton--linea { border-color: var(--bl-tinta); color: var(--bl-tinta); background: transparent; }
.bl-boton--linea:hover { background: var(--bl-tinta); color: var(--bl-blanco); }
.bl-boton--chico { min-height: 40px; padding: 8px 14px; font-size: .9375rem; }
.bl-botones { display: flex; flex-wrap: wrap; gap: 12px; }

/* ---------- Barra superior (solo escritorio) ---------- */
.bl-topbar { display: none; background: var(--bl-gris); border-bottom: 1px solid var(--bl-linea); font-size: .875rem; color: var(--bl-texto); }
.bl-topbar__fila { display: flex; justify-content: space-between; align-items: center; min-height: 38px; }
.bl-topbar__datos { display: flex; gap: 24px; }
.bl-topbar__datos li, .bl-topbar__datos a { display: inline-flex; align-items: center; gap: 7px; text-decoration: none; }
.bl-topbar__datos a:hover { color: var(--bl-tinta); text-decoration: underline; text-underline-offset: 3px; }
.bl-topbar .ico { color: var(--bl-naranja-texto); }
@media (min-width: 992px) { .bl-topbar { display: block; } }

/* ---------- Cabecera ---------- */
.bl-cabecera {
    position: sticky; top: 0; z-index: 50;
    background: rgba(255, 255, 255, .97);
    border-bottom: 1px solid var(--bl-linea);
    transition: box-shadow .2s ease;
}
.bl-cabecera.con-sombra { box-shadow: 0 6px 20px rgba(22, 22, 22, .08); }
.bl-cabecera__fila { display: flex; align-items: center; gap: 16px; min-height: var(--bl-cabecera); }
.bl-logo { display: block; margin-right: auto; }
.bl-logo img { width: 153px; height: 40px; }
@media (min-width: 992px) { .bl-logo img { width: 184px; height: 48px; } }

.bl-cabecera__cta { display: none; }
@media (min-width: 992px) { .bl-cabecera__cta { display: inline-flex; } }

.bl-hamburguesa {
    display: inline-flex; align-items: center; justify-content: center;
    width: 48px; height: 48px; margin-right: -8px;
    border: 0; background: transparent; color: var(--bl-tinta); font-size: 1.6rem; cursor: pointer; border-radius: var(--bl-radio-control);
}
.bl-hamburguesa .cerrar { display: none; }
.bl-hamburguesa[aria-expanded="true"] .abrir { display: none; }
.bl-hamburguesa[aria-expanded="true"] .cerrar { display: inline; }
@media (min-width: 992px) { .bl-hamburguesa { display: none; } }

/* Menú: panel desplegable en móvil, fila en escritorio */
.bl-menu {
    display: none;
    position: absolute; left: 0; right: 0; top: 100%;
    max-height: calc(100vh - var(--bl-cabecera)); overflow-y: auto;
    background: var(--bl-blanco); border-bottom: 1px solid var(--bl-linea);
    box-shadow: 0 16px 24px rgba(22, 22, 22, .08);
    padding: 8px 16px 20px;
}
.bl-menu.abierto { display: block; }
.bl-menu__lista > li { border-bottom: 1px solid var(--bl-linea); }
.bl-menu__lista > li > a:not(.bl-boton) { display: block; padding: 14px 4px; font-weight: 600; font-size: 1.0625rem; color: var(--bl-tinta); text-decoration: none; }
.bl-menu__grupo { position: relative; }
.bl-menu__abrir {
    position: absolute; right: 0; top: 4px; width: 48px; height: 44px;
    border: 0; background: transparent; color: var(--bl-tinta); cursor: pointer; font-size: 1rem;
}
.bl-menu__abrir .ico { transition: transform .2s ease; }
.bl-menu__abrir[aria-expanded="true"] .ico { transform: rotate(180deg); }
.bl-submenu { display: none; padding: 0 0 12px; }
.bl-submenu.abierto { display: block; }
.bl-submenu a { display: flex; align-items: center; gap: 14px; padding: 10px 4px; text-decoration: none; color: var(--bl-tinta); border-radius: var(--bl-radio-control); }
.bl-submenu .ico { font-size: 1.5rem; color: var(--bl-naranja-texto); }
.bl-submenu span { display: flex; flex-direction: column; line-height: 1.3; }
.bl-submenu strong { font-weight: 600; }
.bl-submenu small { font-size: .875rem; color: var(--bl-suave); }
.bl-menu__cta { border-bottom: 0 !important; padding-top: 16px; }
.bl-menu__cta .bl-boton { width: 100%; }

@media (min-width: 992px) {
    .bl-menu {
        display: block; position: static; max-height: none; overflow: visible;
        background: transparent; border: 0; box-shadow: none; padding: 0;
    }
    .bl-menu__lista { display: flex; align-items: center; gap: 4px; }
    .bl-menu__lista > li { border: 0; }
    .bl-menu__lista > li > a:not(.bl-boton) { position: relative; padding: 24px 12px; font-size: 1rem; font-weight: 500; }
    .bl-menu__lista > li > a:not(.bl-boton)::after {
        content: ''; position: absolute; left: 12px; right: 12px; bottom: 16px; height: 2px;
        background: var(--bl-naranja); transform: scaleX(0); transform-origin: left; transition: transform .2s ease;
    }
    .bl-menu__lista > li > a:hover::after,
    .bl-menu__lista > li > a[aria-current="page"]::after { transform: scaleX(1); }
    .bl-menu__grupo { display: flex; align-items: center; }
    .bl-menu__grupo > a { padding-right: 4px !important; }
    .bl-menu__grupo > a::after { right: 4px !important; }
    .bl-menu__abrir { position: static; width: 28px; height: 28px; margin-right: 6px; font-size: .8rem; border-radius: 6px; }
    .bl-submenu {
        display: block; position: absolute; top: calc(100% - 6px); left: -12px; width: 340px;
        padding: 10px; background: var(--bl-blanco); border: 1px solid var(--bl-linea);
        border-radius: var(--bl-radio); box-shadow: var(--bl-sombra);
        opacity: 0; visibility: hidden; transform: translateY(6px);
        transition: opacity .18s ease, transform .18s ease, visibility .18s;
    }
    .bl-menu__grupo:hover .bl-submenu,
    .bl-menu__grupo:focus-within .bl-submenu,
    .bl-submenu.abierto { opacity: 1; visibility: visible; transform: none; }
    .bl-submenu a { padding: 10px 12px; }
    .bl-submenu a:hover { background: var(--bl-gris); }
    .bl-menu__cta { display: none; }
}

/* ---------- Portada ---------- */
.bl-hero { padding: 40px 0 56px; overflow: hidden; }
.bl-hero__fila { display: grid; gap: 40px; align-items: center; }
.bl-hero__antetitulo { font-size: .9375rem; font-weight: 600; color: var(--bl-naranja-texto); margin-bottom: 16px; }
.bl-hero h1 { font-size: clamp(2.4rem, 1rem + 3vw, 4rem); letter-spacing: -0.03em; line-height: 1.04; }
.bl-hero h1 span { display: block; color: var(--bl-naranja-texto); }
.bl-hero__bajada { margin-top: 20px; font-size: 1.1875rem; max-width: 34ch; color: var(--bl-texto); }
.bl-hero .bl-botones { margin-top: 32px; }
.bl-hero__media { position: relative; max-width: 520px; width: 100%; margin: 0 auto; }
.bl-hero__media::before {
    /* la media luna naranja del logo, detrás de la foto */
    content: ''; position: absolute; z-index: 0;
    width: 86%; aspect-ratio: 1; right: -14%; top: -7%;
    border-radius: 50%; border: clamp(18px, 3.4vw, 34px) solid var(--bl-naranja);
    border-left-color: transparent; border-bottom-color: transparent; transform: rotate(-10deg);
}
.bl-hero__media img {
    position: relative; z-index: 1; width: 100%; aspect-ratio: 4 / 5; object-fit: cover;
    border-radius: var(--bl-radio);
}
@media (max-width: 767.98px) {
    .bl-hero__media img { aspect-ratio: 4 / 3.4; object-position: 50% 30%; }
}
@media (max-width: 575.98px) {
    .bl-hero .bl-boton, .bl-servicios .bl-boton { flex: 1 1 100%; }
}
@media (min-width: 992px) {
    .bl-hero { padding: 40px 0 64px; }
    .bl-hero__fila { grid-template-columns: 1.08fr 0.92fr; gap: 64px; }
    .bl-hero__media { margin: 0 0 0 auto; max-width: 440px; }
    .bl-hero__media img { aspect-ratio: 5 / 6; }
}

/* Beneficios */
.bl-beneficios { border-top: 1px solid var(--bl-linea); border-bottom: 1px solid var(--bl-linea); }
.bl-beneficios__lista { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.bl-beneficio { display: flex; align-items: flex-start; gap: 12px; padding: 20px 8px; }
.bl-beneficio:nth-child(odd) { padding-left: 0; }
.bl-beneficio .ico {
    width: 44px; height: 44px; padding: 11px; border-radius: 12px;
    background: var(--bl-naranja-suave); color: var(--bl-naranja-texto);
}
.bl-beneficio strong { display: block; color: var(--bl-tinta); font-weight: 600; line-height: 1.3; }
.bl-beneficio span { display: block; font-size: .9375rem; color: var(--bl-suave); line-height: 1.4; margin-top: 2px; }
@media (min-width: 992px) {
    .bl-beneficios__lista { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .bl-beneficio { padding: 26px 20px; border-left: 1px solid var(--bl-linea); }
    .bl-beneficio:first-child { border-left: 0; padding-left: 0; }
    .bl-beneficio:nth-child(odd) { padding-left: 20px; }
    .bl-beneficio:first-child { padding-left: 0; }
}

/* Categorías */
.bl-categorias__grilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
@media (min-width: 992px) { .bl-categorias__grilla { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; } }
.bl-categoria { display: block; text-decoration: none; color: var(--bl-tinta); }
.bl-categoria__foto { overflow: hidden; border-radius: var(--bl-radio); background: var(--bl-gris); }
.bl-categoria__foto img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; transition: transform .5s ease; }
.bl-categoria:hover .bl-categoria__foto img { transform: scale(1.04); }
.bl-categoria__texto { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 8px; margin-top: 14px; }
.bl-categoria h3 { font-size: 1.1875rem; font-weight: 600; }
.bl-categoria__precio { font-size: .9375rem; color: var(--bl-suave); white-space: nowrap; }
.bl-categoria:hover h3 { text-decoration: underline; text-decoration-color: var(--bl-naranja); text-decoration-thickness: 2px; text-underline-offset: 5px; }

/* Pestañas (vitrina de la portada y catálogo) */
.bl-pestanas { display: flex; gap: 4px; border-bottom: 1px solid var(--bl-linea); overflow-x: auto; scrollbar-width: none; }
.bl-pestanas::-webkit-scrollbar { display: none; }
.bl-pestana {
    position: relative; padding: 12px 16px; border: 0; background: transparent; cursor: pointer;
    font-weight: 600; color: var(--bl-suave); white-space: nowrap;
}
.bl-pestana[aria-selected="true"] { color: var(--bl-tinta); }
.bl-pestana[aria-selected="true"]::after { content: ''; position: absolute; left: 12px; right: 12px; bottom: -1px; height: 3px; border-radius: 3px 3px 0 0; background: var(--bl-naranja); }
.bl-pestana:hover { color: var(--bl-tinta); }
.bl-pestana small { font-weight: 500; color: var(--bl-suave); margin-left: 4px; }

/* Tarjeta de producto */
.bl-productos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 12px; margin-top: 24px; }
@media (min-width: 768px) { .bl-productos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 20px; } }
@media (min-width: 1200px) { .bl-productos { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.bl-producto { display: flex; flex-direction: column; }
.bl-producto[hidden] { display: none; }
.bl-producto__foto { position: relative; border-radius: var(--bl-radio); background: var(--bl-gris); overflow: hidden; }
.bl-producto__foto img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; mix-blend-mode: multiply; transition: transform .45s ease; }
.bl-producto:hover .bl-producto__foto img { transform: scale(1.05); }
.bl-producto__info { display: flex; flex-direction: column; flex: 1; padding: 14px 2px 0; }
.bl-producto__marca { font-size: .8125rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--bl-suave); }
.bl-producto__nombre { margin-top: 2px; font-size: 1.0625rem; font-weight: 600; }
.bl-producto__ventaja { margin-top: 4px; font-size: .9375rem; color: var(--bl-texto); line-height: 1.4; }
.bl-producto__detalle { display: flex; align-items: center; gap: 8px; margin-top: 8px; font-size: .9375rem; color: var(--bl-suave); line-height: 1.4; }
.bl-producto__color { flex: none; width: 14px; height: 14px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .2); }
.bl-producto__pie { margin-top: auto; padding-top: 14px; }
.bl-producto__cta { width: 100%; }
.bl-producto__cta .ico { font-size: 1.05rem; }
/* en 320 px «Consultar precio» no cabe en una línea: el aria-label conserva el texto completo */
@media (max-width: 359.98px) { .bl-producto__cta-extra { display: none; } }
.bl-vitrina__mas { margin-top: 36px; text-align: center; }
.bl-panel[hidden] { display: none; }

/* Pasos */
.bl-pasos__lista { display: grid; gap: 28px; counter-reset: paso; margin: 0; padding: 0; list-style: none; }
@media (min-width: 768px) { .bl-pasos__lista { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; } }
.bl-paso { position: relative; padding-top: 64px; }
.bl-paso::before {
    counter-increment: paso; content: counter(paso);
    position: absolute; top: 0; left: 0; width: 44px; height: 44px; border-radius: 50%;
    display: grid; place-items: center; font-weight: 700; font-size: 1.125rem;
    background: var(--bl-naranja); color: var(--bl-tinta);
}
@media (min-width: 768px) {
    .bl-paso::after {
        content: ''; position: absolute; top: 22px; left: 60px; right: -16px; height: 2px;
        background: repeating-linear-gradient(90deg, var(--bl-linea) 0 8px, transparent 8px 14px);
    }
    .bl-paso:last-child::after { display: none; }
}
.bl-paso h3 { font-size: 1.25rem; font-weight: 600; }
.bl-paso p { margin-top: 8px; color: var(--bl-suave); max-width: 32ch; }

/* Servicios: foto + lista */
.bl-servicios__fila { display: grid; gap: 40px; align-items: center; }
@media (min-width: 992px) { .bl-servicios__fila { grid-template-columns: 1fr 1fr; gap: 72px; } }
.bl-servicios__foto img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--bl-radio); }
.bl-lista-precios { margin-top: 28px; border-top: 1px solid var(--bl-linea); }
.bl-lista-precios li { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--bl-linea); }
.bl-lista-precios strong { display: block; color: var(--bl-tinta); font-weight: 600; }
.bl-lista-precios span { display: block; font-size: .9375rem; color: var(--bl-suave); line-height: 1.4; }
.bl-lista-precios em { font-style: normal; font-weight: 600; color: var(--bl-tinta); white-space: nowrap; }
.bl-servicios .bl-botones { margin-top: 28px; }

/* Nosotros */
.bl-nosotros__fila { display: grid; gap: 40px; }
@media (min-width: 992px) { .bl-nosotros__fila { grid-template-columns: 1.1fr 0.9fr; gap: 72px; align-items: center; } }
.bl-nosotros__texto p + p { margin-top: 16px; }
.bl-nosotros__texto p { max-width: 58ch; }
.bl-cifras { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.bl-cifra { padding: 22px 14px; border-radius: var(--bl-radio); background: var(--bl-blanco); text-align: center; }
.bl-cifra strong { display: block; white-space: nowrap; font-size: clamp(1.6rem, 1.1rem + 1.6vw, 2.3rem); color: var(--bl-tinta); line-height: 1; letter-spacing: -0.02em; }
.bl-cifra span { display: block; margin-top: 8px; font-size: .9375rem; color: var(--bl-suave); line-height: 1.35; }

/* Preguntas frecuentes */
.bl-faq { max-width: 860px; }
.bl-faq details { border-bottom: 1px solid var(--bl-linea); }
.bl-faq details:first-child { border-top: 1px solid var(--bl-linea); }
.bl-faq summary {
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    padding: 20px 0; cursor: pointer; list-style: none; font-weight: 600; color: var(--bl-tinta); font-size: 1.0625rem;
}
.bl-faq summary::-webkit-details-marker { display: none; }
.bl-faq summary .ico { transition: transform .2s ease; color: var(--bl-naranja-texto); }
.bl-faq details[open] summary .ico { transform: rotate(180deg); }
.bl-faq details p { padding: 0 0 20px; max-width: 70ch; color: var(--bl-texto); }

/* Contacto */
.bl-contacto__fila { display: grid; gap: 40px; }
@media (min-width: 992px) { .bl-contacto__fila { grid-template-columns: 0.9fr 1.1fr; gap: 64px; align-items: start; } }
.bl-canales { margin-top: 28px; display: grid; gap: 18px; }
.bl-canal { display: flex; gap: 14px; align-items: flex-start; }
.bl-canal .ico { width: 44px; height: 44px; padding: 11px; border-radius: 12px; background: var(--bl-naranja-suave); color: var(--bl-naranja-texto); }
.bl-canal strong { display: block; font-weight: 600; color: var(--bl-tinta); }
.bl-canal a, .bl-canal span { color: var(--bl-texto); text-decoration: none; }
.bl-canal a:hover { text-decoration: underline; text-underline-offset: 3px; }
.bl-form { padding: 28px 20px; border: 1px solid var(--bl-linea); border-radius: var(--bl-radio); background: var(--bl-blanco); box-shadow: var(--bl-sombra); }
@media (min-width: 768px) { .bl-form { padding: 36px; } }
.bl-form h3 { font-size: 1.375rem; }
.bl-form > p { margin-top: 6px; color: var(--bl-suave); font-size: .9375rem; }
.bl-form__campos { display: grid; gap: 18px; margin-top: 24px; }
@media (min-width: 768px) { .bl-form__doble { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; } }
.bl-campo label { display: block; margin-bottom: 6px; font-weight: 600; font-size: .9375rem; color: var(--bl-tinta); }
.bl-campo label small { font-weight: 400; color: var(--bl-suave); }
.bl-control {
    width: 100%; min-height: 48px; padding: 11px 14px;
    border: 1.5px solid #c9c9c9; border-radius: var(--bl-radio-control); background: var(--bl-blanco); color: var(--bl-tinta);
}
.bl-control::placeholder { color: #767676; }
.bl-control:focus { outline: none; border-color: var(--bl-tinta); box-shadow: 0 0 0 3px rgba(243, 129, 32, .35); }
textarea.bl-control { min-height: 120px; resize: vertical; }
select.bl-control { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--bl-tinta) 50%), linear-gradient(135deg, var(--bl-tinta) 50%, transparent 50%); background-position: calc(100% - 20px) 21px, calc(100% - 15px) 21px; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 40px; }
.bl-form .bl-boton { width: 100%; margin-top: 4px; }
.bl-form__nota { margin-top: 12px; font-size: .875rem; color: var(--bl-suave); text-align: center; }

.bl-mapa { display: block; width: 100%; height: 360px; border: 0; background: var(--bl-gris); }

/* ---------- Catálogo ---------- */
.bl-pagina { padding: 28px 0 48px; border-bottom: 1px solid var(--bl-linea); }
.bl-pagina__fila { display: grid; gap: 32px; align-items: center; }
@media (min-width: 992px) { .bl-pagina { padding: 36px 0 56px; } .bl-pagina__fila { grid-template-columns: 1.15fr .85fr; gap: 56px; } }
.bl-migas ol { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 18px; padding: 0; list-style: none; font-size: .9375rem; color: var(--bl-suave); }
.bl-migas li + li::before { content: '/'; margin-right: 6px; color: #9a9a9a; }
.bl-migas a { text-decoration: none; }
.bl-migas a:hover { color: var(--bl-tinta); text-decoration: underline; }
.bl-pagina h1 { font-size: clamp(2.2rem, 1.6rem + 2.6vw, 3.4rem); letter-spacing: -0.025em; }
.bl-pagina__bajada { margin-top: 14px; max-width: 48ch; font-size: 1.125rem; }
.bl-saltos { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.bl-saltos a {
    display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 16px;
    border: 1.5px solid var(--bl-linea); border-radius: var(--bl-radio-control); text-decoration: none; font-weight: 600; color: var(--bl-tinta);
    transition: border-color .2s ease, background-color .2s ease;
}
.bl-saltos a:hover { border-color: var(--bl-tinta); }
.bl-saltos .ico { color: var(--bl-naranja-texto); font-size: 1.15rem; }
.bl-pagina__foto { display: none; }
.bl-pagina__foto img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--bl-radio); }
@media (min-width: 992px) { .bl-pagina__foto { display: block; } }

.bl-filtros { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 24px; }
@media (min-width: 992px) { .bl-filtros { grid-template-columns: repeat(2, minmax(0, 220px)); } }
.bl-filtros label { display: block; margin-bottom: 4px; font-size: .875rem; font-weight: 600; color: var(--bl-tinta); }
.bl-filtros__resumen { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: 20px; font-size: .9375rem; color: var(--bl-suave); }
.bl-filtros__resumen strong { color: var(--bl-tinta); }
.bl-boton-texto { border: 0; background: none; padding: 6px 0; color: var(--bl-naranja-texto); font-weight: 600; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.bl-vacio { margin-top: 24px; padding: 40px 20px; border: 1.5px dashed var(--bl-linea); border-radius: var(--bl-radio); text-align: center; }
.bl-vacio[hidden] { display: none; }
.bl-vacio p { color: var(--bl-suave); margin-bottom: 14px; }
.bl-aviso { margin-top: 28px; font-size: .9375rem; color: var(--bl-suave); }

.bl-lunas__grilla { display: grid; gap: 20px; }
@media (min-width: 992px) { .bl-lunas__grilla { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; } }
.bl-luna { padding: 26px 22px; border-radius: var(--bl-radio); background: var(--bl-blanco); }
.bl-luna h3 { font-size: 1.375rem; }
.bl-luna > p { margin-top: 6px; color: var(--bl-suave); font-size: .9375rem; }
.bl-luna ul { margin-top: 18px; }
.bl-luna li { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 10px 0; border-top: 1px solid var(--bl-linea); font-size: .9375rem; }
.bl-luna li em { font-style: normal; font-weight: 600; color: var(--bl-tinta); white-space: nowrap; }
.bl-luna li em small { font-weight: 400; color: var(--bl-suave); }

.bl-extras__fila { display: grid; gap: 40px; }
@media (min-width: 992px) { .bl-extras__fila { grid-template-columns: 1fr 1fr; gap: 64px; } }
.bl-extras h3 { font-size: 1.375rem; }

.bl-cierre { background: var(--bl-naranja); color: var(--bl-tinta); }
.bl-cierre__fila { display: grid; gap: 24px; align-items: center; padding-block: 48px; }
@media (min-width: 992px) { .bl-cierre__fila { grid-template-columns: 1fr auto; padding-block: 56px; } }
.bl-cierre h2 { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.2rem); }
.bl-cierre p { margin-top: 8px; color: var(--bl-tinta); max-width: 52ch; }

/* ---------- Pie ---------- */
.bl-pie { background: var(--bl-gris); border-top: 1px solid var(--bl-linea); font-size: .9375rem; }
.bl-pie__fila { display: grid; gap: 36px; padding-block: 56px 40px; }
@media (min-width: 768px) { .bl-pie__fila { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1200px) { .bl-pie__fila { grid-template-columns: 1.3fr 1fr 1fr 1.2fr; gap: 48px; } }
.bl-pie__marca img { width: 184px; height: 48px; }
.bl-pie__marca p { margin-top: 14px; max-width: 30ch; color: var(--bl-suave); }
.bl-pie h2 { font-size: 1rem; font-weight: 700; margin-bottom: 14px; }
.bl-pie li + li { margin-top: 10px; }
.bl-pie a { text-decoration: none; color: var(--bl-texto); }
.bl-pie a:hover { color: var(--bl-tinta); text-decoration: underline; text-underline-offset: 3px; }
.bl-pie__dato { display: flex; gap: 10px; align-items: flex-start; }
.bl-pie__dato .ico { margin-top: 4px; color: var(--bl-naranja-texto); }
.bl-pie__base { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; padding: 20px 0 28px; border-top: 1px solid var(--bl-linea); color: var(--bl-suave); font-size: .875rem; }

/* ---------- WhatsApp flotante ---------- */
.bl-wa { position: fixed; right: 16px; bottom: 16px; z-index: 60; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.bl-wa__boton {
    display: grid; place-items: center; width: 60px; height: 60px; border: 0; border-radius: 50%;
    background: #25d366; color: #fff; font-size: 30px; cursor: pointer;
    box-shadow: 0 8px 22px rgba(22, 22, 22, .22); transition: transform .2s ease;
}
.bl-wa__boton:hover { transform: scale(1.06); }
.bl-wa__boton .cerrar { display: none; font-size: 22px; }
.bl-wa__boton[aria-expanded="true"] .abrir { display: none; }
.bl-wa__boton[aria-expanded="true"] .cerrar { display: inline; }
.bl-wa__menu { display: none; flex-direction: column; gap: 8px; }
.bl-wa__menu.abierto { display: flex; }
.bl-wa__menu a {
    padding: 11px 18px; border-radius: var(--bl-radio-control); background: var(--bl-blanco); color: var(--bl-tinta);
    font-weight: 600; text-decoration: none; box-shadow: 0 6px 20px rgba(22, 22, 22, .16); border: 1px solid var(--bl-linea);
}
.bl-wa__menu a:hover { border-color: var(--bl-tinta); }
@media (max-width: 575.98px) { .bl-wa__boton { width: 54px; height: 54px; font-size: 27px; } }

/* ---------- 404 ---------- */
.bl-error { padding: 72px 0 96px; }
.bl-error h1 { font-size: clamp(2.2rem, 1.6rem + 2.6vw, 3.4rem); }
.bl-error p { margin-top: 14px; max-width: 48ch; }

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}