/* ============================================================
   RESPONSIVE. De escritorio a movil.
   ============================================================ */
@media (max-width: 1180px) {
    .tipos { grid-template-columns: repeat(2, 1fr); }
    .marcas-banda { grid-template-columns: repeat(3, 1fr); }
    .sonidos { grid-template-columns: repeat(2, 1fr); }
    .menu a { padding: 10px 10px; }
}
@media (max-width: 980px) {
    .cabecera__coche span { display: none; }
    .cabecera__acciones .idioma { display: none; }   /* en movil el cambio de idioma va dentro del menu */
    .cabecera__coche { padding: 0; width: 44px; justify-content: center; }
    .menu-btn { display: grid; order: -1; }
    .cabecera__in { gap: var(--e-3); }
    #menu-principal { position: fixed; inset: var(--cabecera) 0 auto 0; background: var(--grafito); border-bottom: 1px solid var(--linea);
        transform: translateY(-8px); opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s var(--curva); }
    .menu-abierto #menu-principal { transform: none; opacity: 1; pointer-events: auto; }
    .menu { flex-direction: column; padding: var(--e-3) var(--e-4) var(--e-5); }
    .menu a { padding: 14px 12px; font-size: var(--t-m); border-bottom: 1px solid var(--linea-suave); border-radius: 0; }
    .texto-largo { overflow-wrap: anywhere; }
    .texto-largo table { display: block; overflow-x: auto; }
    .texto-largo p, .texto-largo div { padding-left: 0 !important; margin-left: 0 !important; }
    .ficha, .dos-col { grid-template-columns: 1fr; gap: var(--e-6); }
    .galeria { position: static; }
    .selector__campos { grid-template-columns: 1fr 1fr; }
    .selector__campos .btn { grid-column: 1 / -1; }
    .pie__in { grid-template-columns: 1fr 1fr; }
    .hero__barra .contenedor { grid-template-columns: repeat(2, 1fr); }
    .hero__dato:nth-child(3) { border-left: 0; padding-left: 0; }
}
@media (max-width: 640px) {
    :root { --cabecera: 64px; }
    .seccion { padding-block: var(--e-7); }
    .tipos, .sonidos { grid-template-columns: 1fr; }
    .tipo { min-height: 260px; }
    .marcas-banda { grid-template-columns: repeat(2, 1fr); }
    .selector__campos { grid-template-columns: 1fr; }
    .telemetria { grid-template-columns: 1fr; }
    .cabecera-seccion { flex-direction: column; align-items: start; }
    .cabecera-seccion h2, .listado-cab h1 { font-size: var(--t-2xl); }
    .pie__in { grid-template-columns: 1fr; }
    .pie__base { flex-direction: column; }
    .hero { min-height: auto; }
    .comparativa { display: block; overflow-x: auto; }
    .confianza { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

/* buscador en pantallas estrechas: el precio pasa debajo del nombre */
@media (max-width: 640px) {
    .buscador { padding: var(--e-3) var(--e-2); }
    .buscador__caja { max-height: calc(100vh - 2*var(--e-3)); }
    .buscador__form input[type=search] { font-size: var(--t-m); height: 58px; }
    .buscador__item { display: grid; grid-template-columns: auto 1fr; column-gap: var(--e-3); }
    .buscador__item img, .buscador__item .ico { grid-row: span 2; }
    .buscador__item .precio-mini { margin-left: 0; grid-column: 2; font-size: var(--t-xs); color: var(--texto); }
}
@media (max-width: 900px) {
    .pagina-info { grid-template-columns: 1fr; gap: var(--e-6); }
    .pagina-info__menu { position: static; order: 2; }
    .contacto-rejilla { grid-template-columns: 1fr; }
}
