/* ══════════════════════════════════════════════════════════════════════════
   FERRETERIA Y HERRAMIENTAS MILLAN S.A.S.

   Identidad propia: base clara de papel, bandas oscuras de acero, naranja del
   logo como único acento, esquinas rectas y filetes de 1 px. Tipografía
   condensada para los títulos —aire de cartel de ferretería— y neutra para
   leer. El catálogo se recorre con un riel de categorías a la izquierda.
   ══════════════════════════════════════════════════════════════════════════ */

:root{
  color-scheme:light;

  /* Papel y tinta */
  --papel:#f5f4f0;
  --papel-2:#faf9f6;
  --blanco:#ffffff;
  --tinta:#15181c;
  --tinta-2:#1e232a;
  --tinta-3:#2b323a;
  --gris:#5b626b;
  --gris-2:#676e77;
  --borde:#e3e0d9;
  --borde-fuerte:#cbc7bd;
  --borde-oscuro:rgba(255,255,255,.14);

  /* Acento: el naranja del logo */
  --naranja:#e8720c;
  --naranja-osc:#c25c02;
  --naranja-claro:#ff9330;
  --naranja-papel:#fdf1e4;

  --verde:#127a41;
  --verde-osc:#0d6134;
  --rojo:#c0392b;

  --radio:4px;
  --radio-g:8px;
  --ancho:1240px;
  --servicio:34px;
  --barra:64px;
  --tira:46px;

  --titulo:"Barlow Condensed","Arial Narrow",Impact,sans-serif;
  --texto:Inter,"Segoe UI",system-ui,-apple-system,sans-serif;

  --estrella:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3.6l2.6 5.3 5.8.85-4.2 4.1 1 5.75L12 16.9l-5.2 2.7 1-5.75-4.2-4.1 5.8-.85z'/%3E%3C/svg%3E");
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--barra) + var(--tira) + 8px);
  -webkit-text-size-adjust:100%;scrollbar-gutter:stable}
body{
  margin:0;background:var(--papel);color:var(--tinta);
  font:400 16px/1.6 var(--texto);
  overflow-x:hidden;
}
body.sin-scroll{overflow:hidden}
img{max-width:100%;display:block}
a{color:inherit}
button,input,textarea,select{font:inherit;color:inherit}
h1,h2,h3,h4{margin:0;font-family:var(--titulo);font-weight:700;line-height:1.02;letter-spacing:-.005em}
p{margin:0}
ul,ol,dl,dd{margin:0;padding:0}
li{list-style:none}
[hidden]{display:none !important}
:focus-visible{outline:2px solid var(--naranja);outline-offset:2px}
::selection{background:rgba(232,114,12,.3)}

.contenedor{width:100%;max-width:var(--ancho);margin-inline:auto;padding-inline:clamp(1rem,3.5vw,2rem)}
.oculto{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.saltar{position:absolute;left:-999px;top:0;z-index:200;background:var(--naranja);color:var(--tinta);padding:.7rem 1.1rem;font-weight:700}
.saltar:focus{left:.6rem;top:.6rem}

/* ── Piezas de tipografía ────────────────────────────────────────────────── */
.titulo-seccion{font-size:clamp(1.9rem,4.2vw,3.1rem);text-transform:uppercase;letter-spacing:-.01em;text-wrap:balance}
.bajada{color:var(--gris);font-size:1.02rem;line-height:1.65;max-width:62ch}
.titulo-seccion + .bajada{margin-top:.8rem}
.icono{width:1.05em;height:1.05em;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.wa{display:inline-flex;width:1.15em;height:1.15em;flex:none}
.wa svg{width:100%;height:100%;fill:currentColor}
.wa-icono{width:1.05em;height:1.05em;flex:none;fill:currentColor}

/* Un dato del negocio que todavía falta cargar. */
.falta{
  display:inline-block;padding:.1em .45em;border:1px dashed var(--naranja);
  background:var(--naranja-papel);color:var(--naranja-osc);
  font-size:.9em;font-weight:600;
}
.falta-nota{display:block;margin-top:.6rem;font-size:.85rem;color:var(--gris-2);max-width:40ch}
.oscuro .falta{background:rgba(232,114,12,.16);color:var(--naranja-claro)}

/* ── Botones ─────────────────────────────────────────────────────────────── */
.boton{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.78rem 1.35rem;border:1px solid transparent;border-radius:var(--radio);
  font-family:var(--texto);font-size:.86rem;font-weight:700;letter-spacing:.03em;
  text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:background .15s,border-color .15s,color .15s;
}
.boton-chico{padding:.5rem .9rem;font-size:.78rem}
.boton-naranja{background:var(--naranja);color:var(--tinta)}
.boton-naranja:hover{background:var(--naranja-claro)}
.boton-oscuro{background:var(--tinta);color:#fff}
.boton-oscuro:hover{background:var(--tinta-3)}
.boton-wa{background:var(--verde);color:#fff}
.boton-wa:hover{background:var(--verde-osc)}
.boton-linea{background:transparent;border-color:var(--borde-fuerte);color:var(--tinta)}
.boton-linea:hover{border-color:var(--tinta);background:var(--blanco)}
.oscuro .boton-linea,.cierre .boton-linea,.ficha .boton-linea,.demo .boton-linea{border-color:var(--borde-oscuro);color:#fff}
.oscuro .boton-linea:hover,.cierre .boton-linea:hover,.ficha .boton-linea:hover,.demo .boton-linea:hover{border-color:#fff;background:rgba(255,255,255,.08)}

/* ── Aviso de la vista de ejemplo (?demo=1) ─────────────────────────────── */
.demo{background:#3a2a10;color:#ffe0bd;border-bottom:2px solid var(--naranja)}
.demo-in{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1rem;padding-block:.6rem;font-size:.84rem}
.demo b{color:var(--naranja-claro);text-transform:uppercase;letter-spacing:.08em;font-size:.76rem}
.demo .boton{margin-left:auto}

/* ══════ CABECERA ═════════════════════════════════════════════════════════ */
/* La fila de servicio sube con la página; queda fija la barra con el logo,
   el buscador y el menú. */
.cabecera{position:sticky;top:calc(-1 * var(--servicio));z-index:100}

/* Fila de servicio */
.servicio-barra{background:var(--tinta);color:#c9cdd3;font-size:.76rem}
.servicio-in{display:flex;align-items:center;gap:1.4rem;height:var(--servicio)}
.estado{display:inline-flex;align-items:center;gap:.45rem;font-weight:600;white-space:nowrap}
.estado .punto{width:7px;height:7px;border-radius:50%;background:var(--gris-2);flex:none}
.estado.abierto{color:#5fdc93}
.estado.abierto .punto{background:#3ccb78;box-shadow:0 0 0 3px rgba(60,203,120,.2)}
.estado.cerrado{color:#f0a89f}
.estado.cerrado .punto{background:var(--rojo)}
.servicio-barra .empuje{flex:1}
.servicio-barra a{color:#c9cdd3;text-decoration:none}
.servicio-barra a:hover{color:#fff}
.servicio-redes{display:inline-flex;gap:.9rem;align-items:center}
.servicio-redes .icono{width:16px;height:16px}
/* Fijo y correo en la fila de servicio (computadora); los dos celulares van
   acá sólo en tablet y celular, donde la barra del logo no tiene lugar. */
.servicio-fijo a,.servicio-correo a,.servicio-tel{display:inline-flex;align-items:center;gap:.4rem;white-space:nowrap}
.servicio-fijo .icono,.servicio-correo .icono,.servicio-tel .icono{width:14px;height:14px;color:var(--naranja-claro)}
.servicio-fijo b,.servicio-tel b{color:#fff;font-weight:600;font-variant-numeric:tabular-nums}
.servicio-tels{display:none;align-items:center;gap:1.1rem}
.servicio-tel span{color:#aeb4bc}

/* Fila principal */
.barra{background:var(--blanco);border-bottom:1px solid var(--borde)}
.barra-in{display:flex;align-items:center;gap:clamp(.8rem,2.5vw,2rem);min-height:var(--barra)}
.logo{display:flex;align-items:center;gap:.7rem;text-decoration:none;flex:none}
.logo img{width:46px;height:46px;flex:none;background:#000;border-radius:var(--radio)}
.logo-txt{display:block;line-height:1.1}
.logo-txt b{display:block;font-family:var(--titulo);font-size:1.35rem;font-weight:700;letter-spacing:.02em;text-transform:uppercase}
.logo-txt span{display:block;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gris-2);margin-top:1px}

.buscador{position:relative;display:flex;align-items:center;flex:1;max-width:520px}
.buscador .icono{position:absolute;left:.85rem;width:18px;height:18px;color:var(--gris-2)}
.buscador input{
  width:100%;padding:.7rem 2.4rem;border:1px solid var(--borde-fuerte);border-radius:var(--radio);
  background:var(--papel-2);font-size:.9rem;
}
.buscador input::placeholder{color:var(--gris-2)}
.buscador input:focus{outline:none;border-color:var(--naranja);background:var(--blanco)}
.buscador .limpiar{position:absolute;right:.45rem;width:26px;height:26px;border:0;border-radius:var(--radio);
  background:var(--borde);cursor:pointer;font-size:1rem;line-height:1;color:var(--gris)}
.barra-acciones{display:flex;align-items:center;gap:.5rem;margin-left:auto}
/* Los dos celulares, uno debajo del otro: nombre y número, cada renglón llama. */
.barra-tels{display:flex;flex-direction:column;gap:.1rem;padding-right:.5rem}
.barra-tels a{display:grid;grid-template-columns:4.4rem auto;align-items:baseline;column-gap:.4rem;line-height:1.15;text-decoration:none}
.barra-tels span{font-size:.66rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--gris-2)}
.barra-tels b{font-family:var(--titulo);font-size:1.12rem;letter-spacing:.01em;font-variant-numeric:tabular-nums}
.barra-tels a:hover b{color:var(--naranja)}
/* El botón del menú de secciones vive en la tira y sólo aparece en pantallas chicas. */
.abrir-menu{display:none;align-items:center;gap:.45rem;flex:none;padding:0 1rem;
  border:0;border-left:1px solid var(--borde-oscuro);background:transparent;color:#fff;cursor:pointer;
  font-family:var(--texto);font-size:.8rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.abrir-menu:hover,.abrir-menu[aria-expanded="true"]{background:rgba(255,255,255,.07)}
.abrir-menu .chev{transition:transform .2s}
.abrir-menu[aria-expanded="true"] .chev{transform:rotate(180deg)}

/* Tira de navegación */
.tira{background:var(--tinta-2);border-bottom:3px solid var(--naranja)}
.tira-in{display:flex;align-items:stretch;gap:.2rem;min-height:var(--tira)}
.tira-catalogo{
  display:inline-flex;align-items:center;gap:.6rem;padding:0 1.15rem;margin-right:.6rem;
  border:0;background:var(--naranja);color:var(--tinta);cursor:pointer;
  font-family:var(--texto);font-size:.8rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
}
.tira-catalogo:hover{background:var(--naranja-claro)}
.tira-catalogo .barritas{display:flex;flex-direction:column;gap:3px}
.tira-catalogo .barritas i{display:block;width:15px;height:2px;background:currentColor}
.tira-catalogo .chev{transition:transform .2s}
.tira-catalogo[aria-expanded="true"] .chev{transform:rotate(180deg)}
.tira-links{display:flex;align-items:stretch;gap:.1rem;flex-wrap:wrap}
.tira-links a{
  display:inline-flex;align-items:center;padding:0 .85rem;text-decoration:none;
  font-size:.82rem;font-weight:600;letter-spacing:.04em;color:#cfd4da;
  border-bottom:3px solid transparent;margin-bottom:-3px;transition:color .15s,border-color .15s;
}
.tira-links a:hover{color:#fff}
.tira-links a.activo{color:#fff;border-bottom-color:var(--naranja-claro)}

/* Menú desplegado del catálogo */
.megamenu{
  position:absolute;left:0;right:0;top:100%;z-index:110;
  background:var(--blanco);border-bottom:1px solid var(--borde);
  box-shadow:0 18px 40px rgba(20,24,28,.16);
}
.megamenu-in{padding-block:1.6rem 1.4rem}
.megamenu-grid{display:grid;gap:1.4rem 1.8rem;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr))}
.mm-cab-quieta{cursor:default}
.mm-col{min-width:0}
.mm-cab{display:flex;align-items:center;gap:.6rem;width:100%;padding:0 0 .55rem;margin-bottom:.55rem;
  border:0;border-bottom:1px solid var(--borde);background:none;cursor:pointer;text-align:left}
.mm-cab:hover b{color:var(--naranja)}
.mm-ico{display:grid;place-items:center;width:30px;height:30px;flex:none;background:var(--naranja-papel);color:var(--naranja)}
.mm-ico svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.mm-cab b{font-family:var(--titulo);font-size:1.05rem;font-weight:700;text-transform:uppercase;letter-spacing:.01em;line-height:1.15}
.mm-subs{display:flex;flex-direction:column;gap:.1rem}
.mm-subs button{border:0;background:none;padding:.2rem 0;text-align:left;cursor:pointer;
  font-size:.83rem;color:var(--gris);line-height:1.45}
.mm-subs button:hover{color:var(--naranja);text-decoration:underline}
.megamenu-pie{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1.4rem;
  margin-top:1.4rem;padding-top:1rem;border-top:1px solid var(--borde)}
.megamenu-pie p{font-size:.85rem;color:var(--gris)}
.megamenu-tapa{position:fixed;inset:0;z-index:99;background:rgba(20,24,28,.35)}

/* ══════ PORTADA ══════════════════════════════════════════════════════════ */
/* Detrás va la foto del frente del local; el texto siempre viaja por delante.
   Sin foto la banda queda oscura igual, así que los colores no cambian. */
.portada{
  --foto:none;
  position:relative;overflow:hidden;color:#e8eaed;
  background-color:var(--tinta);background-image:var(--foto);
  background-size:cover;background-position:center 45%;
}
/* Velo base: cuando no hay foto la banda es casi lisa. */
.portada::before{content:"";position:absolute;inset:0;
  background:linear-gradient(160deg,rgba(13,15,19,.94),rgba(13,15,19,.99))}
/* Con la foto puesta el velo se abre, más cargado del lado del texto. */
.portada.con-foto::before{background:
  linear-gradient(100deg,rgba(11,13,16,.92) 0%,rgba(11,13,16,.8) 40%,rgba(11,13,16,.4) 74%,rgba(11,13,16,.28) 100%),
  linear-gradient(180deg,rgba(11,13,16,.42),rgba(11,13,16,.06) 46%,rgba(11,13,16,.7))}
.portada-in{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:clamp(1.5rem,4vw,3.4rem);align-items:center;padding-block:clamp(3rem,7vw,5.4rem)}
.portada h1{font-size:clamp(2.4rem,6.2vw,4.6rem);text-transform:uppercase;line-height:.94;
  letter-spacing:-.015em;color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.5)}
.portada h1 .naranja{color:var(--naranja-claro);display:block}
.portada .bajada{margin-top:1.2rem;font-size:clamp(1rem,1.6vw,1.1rem);color:#c5cbd3}
.portada .boton-linea{border-color:var(--borde-oscuro);color:#fff}
.portada .boton-linea:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.portada-botones{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.8rem}
.portada-datos{display:flex;flex-wrap:wrap;gap:1.1rem 2.6rem;margin-top:2.2rem;padding-top:1.4rem;
  border-top:1px solid var(--borde-oscuro)}
.portada-datos li{display:flex;flex-direction:column;gap:.2rem}
.portada-datos b{font-family:var(--titulo);font-size:1.4rem;font-weight:600;line-height:1.05;letter-spacing:.01em;color:#fff}
.portada-datos span{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:#a3aab3}

/* Ficha de atención, a la derecha */
.ficha{
  position:relative;color:#e8eaed;border-radius:var(--radio-g);overflow:hidden;
  border:1px solid var(--borde-oscuro);box-shadow:0 18px 50px rgba(0,0,0,.45);
}
/* Panel de vidrio: deja entrever la foto del frente sin comerse el texto. */
.ficha::before{content:"";position:absolute;inset:0;
  background:linear-gradient(160deg,rgba(16,19,23,.86),rgba(16,19,23,.94));
  backdrop-filter:blur(14px) saturate(1.1);-webkit-backdrop-filter:blur(14px) saturate(1.1)}
.ficha-in{position:relative;padding:clamp(1.4rem,3vw,2rem)}
.ficha-logo{display:flex;align-items:center;gap:.9rem;padding-bottom:1.1rem;border-bottom:1px solid var(--borde-oscuro)}
.ficha-logo img{width:64px;height:64px;background:#000;border-radius:var(--radio);flex:none}
.ficha-logo b{display:block;font-family:var(--titulo);font-size:1.25rem;text-transform:uppercase;letter-spacing:.02em;line-height:1.1}
.ficha-logo span{display:block;font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;color:#a3aab3;margin-top:.2rem}
.ficha-hoy{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .9rem;padding-block:1rem;border-bottom:1px solid var(--borde-oscuro)}
.ficha-hoy .estado{font-size:.82rem}
.ficha-hoy .horario-hoy{font-size:.82rem;color:#aeb4bc;margin-left:auto;font-variant-numeric:tabular-nums}
.ficha-nums{display:flex;flex-direction:column;gap:.7rem;padding-top:1.1rem}
.ficha-num{display:flex;align-items:center;gap:.8rem}
.ficha-num-txt{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.ficha-num-txt span{font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;color:#a3aab3}
.ficha-num-txt b{font-family:var(--titulo);font-size:1.3rem;letter-spacing:.01em}
.ficha-num-acciones{display:flex;gap:.4rem;margin-left:auto;flex:none}
.boton-cuadrado{padding-inline:.62rem}
.boton-cuadrado .icono{width:1.1em;height:1.1em}
/* El fijo y el correo, aparte de los celulares. */
.ficha-otros{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:.35rem;padding-top:.9rem;border-top:1px solid var(--borde-oscuro)}
.ficha-otros a{display:flex;align-items:center;gap:.6rem;min-width:0;padding:.55rem .65rem;border:1px solid var(--borde-oscuro);
  border-radius:var(--radio);text-decoration:none;transition:border-color .15s,background .15s}
.ficha-otros a:hover{border-color:#fff;background:rgba(255,255,255,.06)}
.ficha-otros .icono{width:1.15rem;height:1.15rem;color:var(--naranja-claro)}
.ficha-otros a>span{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.ficha-otros a>span span{font-size:.64rem;letter-spacing:.11em;text-transform:uppercase;color:#a3aab3;white-space:nowrap}
.ficha-otros b{font-family:var(--titulo);font-size:1.08rem;letter-spacing:.01em;color:#fff}

/* ══════ FOTOS DEL LOCAL ═══════════════════════════════════════════════════ */
/* Fotos reales del salón repartidas por la página, con un rótulo corto abajo. */
.foto-local{position:relative;margin:0;overflow:hidden;border-radius:var(--radio-g);background:var(--tinta-3);
  border:1px solid var(--borde)}
.foto-local img{width:100%;height:100%;object-fit:cover}
.foto-local figcaption{position:absolute;left:0;right:0;bottom:0;padding:1.6rem .85rem .6rem;
  font-size:.7rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:#fff;
  background:linear-gradient(180deg,rgba(15,18,22,0),rgba(15,18,22,.82))}
.foto-oscura{border-color:var(--borde-oscuro)}

/* ══════ LOS TRES SERVICIOS ═══════════════════════════════════════════════ */
.servicios{background:var(--blanco);border-bottom:1px solid var(--borde)}
.servicios-lista{display:flex;flex-direction:column}
.servicio-fila{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;
  gap:clamp(1rem,3vw,2.2rem);padding-block:clamp(1.5rem,3vw,2.1rem);
  border-bottom:1px solid var(--borde);text-decoration:none;
}
.servicio-fila:last-child{border-bottom:0}
.servicio-fila:hover h3{color:var(--naranja-osc)}
.servicio-ico{display:grid;place-items:center;width:54px;height:54px;flex:none;
  background:var(--naranja-papel);color:var(--naranja);border-radius:var(--radio)}
.servicio-ico svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.servicio-txt h3{font-size:1.5rem;text-transform:uppercase;margin-bottom:.3rem;transition:color .15s}
.servicio-txt p{color:var(--gris);font-size:.94rem;line-height:1.6;max-width:64ch}
.servicio-flecha{display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;font-weight:700;
  letter-spacing:.09em;text-transform:uppercase;color:var(--naranja);white-space:nowrap}
.servicio-fila:hover .servicio-flecha .icono{transform:translateX(3px)}
.servicio-flecha .icono{transition:transform .18s}

/* ══════ CATÁLOGO ════════════════════════════════════════════════════════ */
.catalogo{padding-block:clamp(2.6rem,6vw,4.4rem)}
.catalogo-cab{display:grid;grid-template-columns:minmax(0,1fr) clamp(260px,30vw,380px);align-items:end;gap:1.2rem clamp(1.4rem,4vw,3rem);margin-bottom:1.8rem}
.foto-cab img{aspect-ratio:16/10}
.rubros-cab{display:grid;grid-template-columns:minmax(0,1fr) clamp(260px,30vw,380px);align-items:end;gap:1.2rem clamp(1.4rem,4vw,3rem)}
.foto-cab.foto-alta img{object-position:center 62%}
.catalogo-caja{display:grid;grid-template-columns:274px minmax(0,1fr);
  background:var(--blanco);border:1px solid var(--borde)}

/* Riel de categorías */
.riel{border-right:1px solid var(--borde);background:var(--papel-2)}
.riel-titulo{padding:.9rem 1.1rem;border-bottom:1px solid var(--borde);
  font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gris-2)}
.riel-item{
  display:flex;align-items:center;gap:.7rem;width:100%;padding:.8rem 1.1rem;
  border:0;border-bottom:1px solid var(--borde);background:none;text-align:left;cursor:pointer;
  transition:background .14s,color .14s;
}
.riel-item:last-child{border-bottom:0}
.riel-item:hover{background:var(--blanco)}
.riel-item .riel-ico{display:grid;place-items:center;width:28px;height:28px;flex:none;color:var(--gris)}
.riel-item .riel-ico svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.riel-item b{flex:1;min-width:0;font-family:var(--texto);font-size:.88rem;font-weight:600;line-height:1.3}
.riel-item .cuenta{font-size:.74rem;color:var(--gris-2);font-variant-numeric:tabular-nums}
.riel-item .icono{width:14px;height:14px;color:var(--gris-2)}
.riel-item.activa{background:var(--blanco);color:var(--naranja);box-shadow:inset 3px 0 0 var(--naranja)}
.riel-item.activa .riel-ico,.riel-item.activa .icono{color:var(--naranja)}

/* Panel de la derecha */
.panel{min-width:0;padding:clamp(1.1rem,2.4vw,1.7rem)}

/* Índice: lo que se ve antes de elegir categoría */
.indice-intro{padding-bottom:1.2rem;margin-bottom:1.4rem;border-bottom:1px solid var(--borde)}
.indice-intro h3{font-size:1.45rem;text-transform:uppercase;margin-bottom:.4rem}
.indice-intro p{color:var(--gris);font-size:.92rem;max-width:70ch}
.indice{display:grid;gap:1.1rem;grid-template-columns:repeat(3,minmax(0,1fr))}

/* Cada categoría se presenta con su cartel entero —trae el nombre impreso,
   así que no se recorta ni se tapa— y debajo el nombre y las subcategorías. */
.indice-bloque{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--borde);
  border-radius:var(--radio-g);background:var(--blanco);transition:box-shadow .18s,border-color .18s}
.indice-bloque:hover{border-color:var(--borde-fuerte);box-shadow:0 10px 26px rgba(21,24,28,.09)}

.indice-foto{display:block;width:100%;padding:0;border:0;line-height:0;background:var(--tinta);overflow:hidden;cursor:pointer}
.indice-foto img{width:100%;height:auto;display:block;aspect-ratio:1000/914;object-fit:cover;object-position:top;
  transition:transform .5s ease}
.indice-bloque:hover .indice-foto img{transform:scale(1.03)}
.indice-nombre{display:flex;align-items:center;gap:.5rem;margin:0 1rem;padding:.85rem 0 .5rem;
  border-bottom:2px solid var(--naranja);font-size:clamp(1.1rem,1.5vw,1.3rem);text-transform:uppercase;line-height:1.1}
.indice-nombre .indice-ico{display:grid;place-items:center;width:22px;height:22px;color:var(--naranja);flex:none}
.indice-nombre .indice-ico svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* Sin foto la ficha no se rompe: queda el nombre sobre la línea naranja. */
.indice-bloque.sin-foto .indice-foto{display:none}

.indice-lista{display:flex;flex-direction:column;gap:.05rem;padding:.6rem 1rem 1rem}
.indice-lista button{border:0;background:none;padding:.24rem 0;text-align:left;cursor:pointer;
  font-size:.86rem;color:var(--gris);line-height:1.45}
.indice-lista button:hover{color:var(--naranja);text-decoration:underline}

/* Barra de la categoría abierta */
.panel-cab{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem 1rem;
  padding-bottom:1rem;margin-bottom:1.1rem;border-bottom:1px solid var(--borde)}
.volver{display:inline-flex;align-items:center;gap:.4rem;border:1px solid var(--borde-fuerte);
  border-radius:var(--radio);background:none;padding:.42rem .8rem;cursor:pointer;
  font-size:.78rem;font-weight:600;color:var(--gris)}
.volver:hover{border-color:var(--tinta);color:var(--tinta)}
.ruta{font-size:.8rem;color:var(--gris-2)}
.ruta b{color:var(--tinta)}
.panel-titulo{font-size:1.7rem;text-transform:uppercase;width:100%;margin-top:.2rem}
.panel-texto{color:var(--gris);font-size:.9rem;max-width:72ch;margin-top:.35rem}

.filtros{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1.1rem}
.filtro-etiqueta{width:100%;font-size:.7rem;font-weight:700;letter-spacing:.15em;
  text-transform:uppercase;color:var(--gris-2);margin-bottom:.15rem}
.chip{
  display:inline-flex;align-items:center;gap:.4rem;padding:.38rem .75rem;
  border:1px solid var(--borde-fuerte);border-radius:var(--radio);background:var(--blanco);
  font-size:.8rem;font-weight:500;color:var(--gris);cursor:pointer;transition:.14s;
}
.chip:hover{border-color:var(--tinta);color:var(--tinta)}
.chip .n{font-size:.72rem;color:var(--gris-2)}
.chip.activa{background:var(--tinta);border-color:var(--tinta);color:#fff;font-weight:600}
.chip.activa .n{color:rgba(255,255,255,.6)}
.cuenta-resultados{margin-top:1.2rem;font-size:.84rem;color:var(--gris-2)}
.cuenta-resultados b{color:var(--tinta)}

/* Grilla de productos */
.productos{display:grid;gap:1px;grid-template-columns:repeat(auto-fill,minmax(min(200px,100%),1fr));
  margin-top:1rem;background:var(--borde);border:1px solid var(--borde)}
.producto{display:flex;flex-direction:column;background:var(--blanco);transition:box-shadow .15s}
.producto:hover{box-shadow:0 0 0 2px var(--naranja) inset}
.producto-foto{position:relative;display:block;width:100%;padding:0;border:0;background:var(--papel-2);cursor:pointer}
.producto-foto img{width:100%;aspect-ratio:1/.88;object-fit:contain;padding:.9rem}
.producto-foto.sin-foto{aspect-ratio:1/.88;display:grid;place-items:center}
.producto-foto.sin-foto svg{width:42px;height:42px;color:var(--borde-fuerte);fill:none;stroke:currentColor;
  stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.producto-codigo{position:absolute;left:0;top:0;padding:.16rem .45rem;background:var(--tinta);color:#fff;
  font-size:.7rem;font-weight:600;letter-spacing:.05em}
.producto-demo{position:absolute;right:0;top:0;padding:.16rem .45rem;background:var(--naranja);color:#fff;
  font-size:.7rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.producto-cuerpo{display:flex;flex-direction:column;gap:.25rem;padding:.8rem .85rem .9rem;flex:1;
  border-top:1px solid var(--borde)}
.producto-sub{font-size:.7rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--naranja)}
.producto-nombre{font-family:var(--texto);font-size:.88rem;font-weight:600;line-height:1.35}
.producto-nombre button{border:0;background:none;padding:0;text-align:left;cursor:pointer;font:inherit}
.producto-nombre button:hover{color:var(--naranja)}
.producto-marca{font-size:.76rem;color:var(--gris-2)}
.producto-acciones{display:flex;gap:.35rem;margin-top:auto;padding-top:.7rem}
.producto-acciones .boton{flex:1;padding:.44rem .5rem;font-size:.74rem;gap:.3rem}
.producto-acciones .boton-linea{flex:0 0 auto}

.mas-caja{display:flex;justify-content:center;margin-top:1.2rem}
.vacio{padding:2.4rem 1.2rem;text-align:center;border:1px solid var(--borde);background:var(--papel-2);margin-top:1rem}
.vacio h4{font-family:var(--texto);font-size:1rem;font-weight:700;line-height:1.35;margin-bottom:.4rem}
.vacio p{color:var(--gris);font-size:.9rem;max-width:54ch;margin-inline:auto}
.vacio .boton{margin-top:1.1rem}
.aclaracion{margin-top:1.4rem;font-size:.83rem;color:var(--gris-2);max-width:80ch}
.aclaracion b{color:var(--tinta)}

/* ══════ OTROS RUBROS ═════════════════════════════════════════════════════ */
.rubros{background:var(--papel);padding-block:clamp(2.6rem,6vw,4.4rem);border-bottom:1px solid var(--borde)}
/* Con cinco rubros, el renglón que queda incompleto va centrado, sin hueco al costado. */
.rubros-grid{--col:3;--sep:1.1rem;display:flex;flex-wrap:wrap;justify-content:center;gap:var(--sep);margin-top:2.2rem}
.rubros-grid>.rubro{flex:0 1 calc((100% - (var(--col) - 1) * var(--sep)) / var(--col))}

/* Cada rubro es una tarjeta de dos pisos: arriba la foto entera del rubro,
   abajo el texto y el botón. La foto no se recorta: el cartel del rubro que
   trae impreso se tiene que leer completo. */
.rubro{
  position:relative;display:flex;flex-direction:column;overflow:hidden;color:#fff;
  border-radius:var(--radio-g);background:linear-gradient(180deg,#232a32,#12161b);
  border:1px solid var(--borde-oscuro);
}

.rubro-foto{position:relative;display:block;background:#12161b;line-height:0;
  border-bottom:1px solid var(--borde-oscuro)}
.rubro-foto img{width:100%;height:auto;display:block;aspect-ratio:1312/1199;object-fit:cover}
/* Un degradado muy suave abajo empalma la foto con el cuerpo de la tarjeta. */
.rubro-foto::after{content:"";position:absolute;left:0;right:0;bottom:0;height:38%;pointer-events:none;
  background:linear-gradient(180deg,rgba(18,21,26,0),rgba(18,21,26,.55))}

.rubro-cuerpo{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;
  gap:.5rem;padding:1.25rem 1.35rem 1.4rem;flex:1}
.rubro-cuerpo h3{font-size:clamp(1.35rem,2.2vw,1.65rem);text-transform:uppercase;color:#fff;text-wrap:balance}
.rubro-cuerpo p{font-size:.89rem;line-height:1.55;color:#ccd2d9;max-width:44ch}
/* El botón se pega abajo para que quede a la misma altura en todas. */
.rubro-cuerpo .boton{margin-top:auto}
.rubro-cuerpo p{margin-bottom:.55rem}
.rubro .boton-linea{border-color:rgba(255,255,255,.26);color:#fff}
.rubro .boton-linea .wa-icono{color:#4cd28a}
.rubro .boton-linea:hover{background:var(--verde);border-color:var(--verde)}
.rubro .boton-linea:hover .wa-icono{color:#fff}

/* Si la foto del rubro no está, la tarjeta vuelve al ícono como marca de agua
   y el título pasa a ser el protagonista. */
.rubro.sin-foto{min-height:270px;justify-content:flex-end;
  background-image:
    radial-gradient(120% 95% at 82% 0%,rgba(232,114,12,.32),transparent 62%),
    repeating-linear-gradient(135deg,rgba(255,255,255,.035) 0 2px,transparent 2px 11px),
    linear-gradient(180deg,#242b33,#11151a)}
.rubro.sin-foto .rubro-foto{display:none}
.rubro.sin-foto .rubro-cuerpo h3{font-size:clamp(1.6rem,2.6vw,2rem)}
.rubro-ico{position:absolute;right:-.5rem;top:-.8rem;width:128px;height:128px;color:rgba(255,255,255,.11)}
.rubro-ico svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1;stroke-linecap:round;stroke-linejoin:round}
.rubro:not(.sin-foto) .rubro-ico{display:none}

/* ══════ ALQUILER (banda oscura) ═════════════════════════════════════════ */
.oscuro{--foto:none;position:relative;background-color:var(--tinta);color:#e8eaed;
  background-image:var(--foto);background-size:cover;background-position:center}
.oscuro::before{content:"";position:absolute;inset:0;background:rgba(21,24,28,.9)}
.oscuro.con-foto::before{background:linear-gradient(180deg,rgba(21,24,28,.9),rgba(21,24,28,.76))}
.oscuro>.contenedor{position:relative;z-index:1}
.oscuro .bajada{color:#b3b9c0}
.oscuro .titulo-seccion{color:#fff}

.alquiler-in{padding-block:clamp(2.8rem,6vw,4.6rem)}
.alquiler-cab{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(1.2rem,4vw,3rem);
  align-items:start;padding-bottom:1.8rem;margin-bottom:1.8rem;border-bottom:1px solid var(--borde-oscuro)}
.alquiler-cab .boton{margin-top:1.2rem}
.alquiler-cab .foto-local{margin-top:1.4rem;max-width:520px}
.alquiler-cab .foto-local img{aspect-ratio:16/9;object-position:center 40%}
.equipos-grupo+.equipos-grupo{margin-top:2.4rem}
.equipos-grupo-cab{display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem 1rem;margin-bottom:1rem;
  padding-left:.8rem;border-left:3px solid var(--naranja)}
.equipos-grupo-cab h3{font-size:clamp(1.4rem,2.6vw,1.8rem);text-transform:uppercase;color:#fff}
.equipos-grupo-cab p{flex:1 1 30ch;font-size:.86rem;color:#a9b0b8;line-height:1.5}
.equipos-cuenta{font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--naranja-claro)}
.solo-toque{display:none}
/* Con "Todos los equipos", cada categoría es una fila que se desliza de costado. */
.equipos-grilla.fila{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc((100% - 4px) / 5);
  overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:var(--tinta-3) transparent}
.equipos-grilla.fila>.equipo{scroll-snap-align:start}
.equipos-flechas{display:inline-flex;gap:.4rem;margin-left:.2rem}
.equipos-flecha{display:grid;place-items:center;width:38px;height:38px;padding:0;border:1px solid var(--borde-oscuro);
  border-radius:50%;background:transparent;color:#fff;cursor:pointer;transition:background .15s,border-color .15s,opacity .15s}
.equipos-flecha:hover:not(:disabled){background:var(--naranja);border-color:var(--naranja);color:var(--tinta)}
.equipos-flecha:disabled{opacity:.3;cursor:default}
.equipos-flecha svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.sin-desplazar .equipos-flechas{display:none}
.equipos-grilla{display:grid;gap:1px;grid-template-columns:repeat(auto-fill,minmax(min(236px,100%),1fr));
  background:var(--borde-oscuro);border:1px solid var(--borde-oscuro)}
.equipo-carac{display:flex;flex-direction:column;gap:.2rem;margin:.25rem 0 .15rem}
.equipo-carac li{position:relative;padding-left:.95rem;font-size:.8rem;line-height:1.45;color:#d4d8dd}
.equipo-carac li::before{content:"";position:absolute;left:0;top:.55em;width:.42rem;height:2px;background:var(--naranja)}

.equipo{display:flex;flex-direction:column;background:var(--tinta-2)}
.equipo-foto{background:#fff;aspect-ratio:4/3;display:grid;place-items:center;overflow:hidden}
.equipo-foto img{width:100%;height:100%;object-fit:contain}
.equipo-foto svg{width:44px;height:44px;color:rgba(255,255,255,.24);fill:none;stroke:currentColor;stroke-width:1.3}
.equipo-cuerpo{display:flex;flex-direction:column;gap:.3rem;padding:.9rem .95rem 1rem;flex:1}
.equipo h4{font-family:var(--texto);font-size:.95rem;font-weight:700;line-height:1.3}
.equipo p{font-size:.82rem;color:#a9b0b8;line-height:1.5}
.equipo .para{color:#d4d8dd}
.equipo .para b{color:#fff;font-weight:600}
.equipo .para{margin-bottom:.55rem}
.equipo .boton{margin-top:auto;align-self:flex-start;padding-top:.5rem;padding-bottom:.5rem}
.grupos{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.4rem}
.grupo-chip{padding:.45rem .9rem;border:1px solid var(--borde-oscuro);border-radius:var(--radio);
  background:transparent;color:#cfd4da;font-size:.8rem;font-weight:600;cursor:pointer;transition:.14s}
.grupo-chip:hover{border-color:#fff;color:#fff}
.grupo-chip.activa{background:var(--naranja);border-color:var(--naranja);color:var(--tinta)}
.alquiler-vacio{padding:2.4rem 1.2rem;text-align:center;border:1px solid var(--borde-oscuro);
  border-radius:var(--radio);background:rgba(13,15,19,.62)}
.alquiler-vacio h3{font-family:var(--texto);font-size:1.05rem;font-weight:700;line-height:1.35;margin-bottom:.4rem;color:#fff}
.alquiler-vacio p{color:#a9b0b8;font-size:.9rem;max-width:54ch;margin-inline:auto}
.alquiler-vacio .boton{margin-top:1.1rem}
.oscuro .aclaracion{color:#8e959d}
.oscuro .aclaracion b{color:#fff}

/* ══════ REPARACIÓN ══════════════════════════════════════════════════════ */
.reparacion{background:var(--blanco);padding-block:clamp(2.8rem,6vw,4.6rem);border-bottom:1px solid var(--borde)}
.reparacion-cab{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:clamp(1.2rem,4vw,3rem);align-items:start}
.reparacion-cab .boton{margin-top:1.3rem}
.pasos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.4rem;margin-top:2.6rem;
  padding-top:2.2rem;border-top:1px solid var(--borde);position:relative}
.paso{position:relative}
.paso-n{display:grid;place-items:center;width:38px;height:38px;margin-bottom:.8rem;
  background:var(--tinta);color:#fff;border-radius:50%;
  font-family:var(--titulo);font-size:1.15rem;line-height:1}
.paso::after{content:"";position:absolute;left:38px;top:19px;right:-1.4rem;height:1px;background:var(--borde-fuerte)}
.paso:last-child::after{display:none}
.paso h3{font-size:1.15rem;text-transform:uppercase;margin-bottom:.35rem}
.paso p{font-size:.88rem;color:var(--gris);line-height:1.55}
.reparacion-extra{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:1px;
  margin-top:2.4rem;background:var(--borde);border:1px solid var(--borde)}
.extra{background:var(--papel-2);padding:1.5rem}
.extra-foto{width:calc(100% + 3rem);height:auto;max-width:none;margin:-1.5rem -1.5rem 1.2rem;aspect-ratio:16/8;object-fit:cover}
.extra h3{font-size:1.2rem;text-transform:uppercase;margin-bottom:.5rem}
.extra p{font-size:.9rem;color:var(--gris);line-height:1.6;margin-bottom:1.1rem}

/* ══════ CONFIANZA ═══════════════════════════════════════════════════════ */
.confianza{background:var(--papel);padding-block:clamp(2.6rem,6vw,4.2rem);border-bottom:1px solid var(--borde)}
.valores{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:1px;
  margin-top:2rem;background:var(--borde);border:1px solid var(--borde)}
.valor{background:var(--blanco);padding:1.5rem 1.4rem}
.mosaico{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);grid-template-rows:auto auto;gap:.8rem;margin-top:2rem}
.mosaico-alta{grid-row:1 / span 2}
.mosaico .foto-local:not(.mosaico-alta):not(.mosaico-ancha) img{aspect-ratio:16/8}
.mosaico-ancha img{aspect-ratio:1600/370}
.mosaico-alta img{object-position:center 60%}
.valor-ico{display:block;width:26px;height:26px;margin-bottom:.85rem;color:var(--naranja-osc)}
.valor-ico svg{display:block;width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.valor h3{font-family:var(--texto);font-size:1rem;font-weight:700;margin-bottom:.4rem}
.valor p{font-size:.88rem;color:var(--gris);line-height:1.6}

/* ══════ OPINIONES DE GOOGLE ════════════════════════════════════════════ */
.opiniones{background:var(--blanco);padding-block:clamp(2.6rem,6vw,4.2rem);border-bottom:1px solid var(--borde)}
.resenas-cab{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.4rem 2.4rem;align-items:center}

.resenas-resumen{display:flex;align-items:center;gap:1rem;padding:1rem 1.3rem;
  border:1px solid var(--borde);background:var(--papel-2);white-space:nowrap}
.resenas-nota{font-family:var(--titulo);font-size:3rem;line-height:.9;color:var(--tinta)}
.resenas-detalle{display:flex;flex-direction:column;gap:.25rem}
.resenas-detalle span{font-size:.8rem;color:var(--gris)}

.estrellas{display:inline-flex;gap:.1rem}
.estrella{width:18px;height:18px;fill:var(--borde-fuerte);stroke:none;flex:none}
.estrella.llena{fill:#f5a623}
.estrellas.chicas .estrella{width:14px;height:14px}

.g-ico{width:1.05em;height:1.05em;flex:none}

.resenas-estado{display:flex;align-items:flex-start;gap:.85rem;margin-top:1.8rem;padding:1.1rem 1.3rem;
  border:1px solid var(--borde);border-radius:var(--radio);background:var(--papel-2);
  font-size:.92rem;line-height:1.55;color:var(--gris);max-width:66ch}
.resenas-estado .g-ico{width:22px;height:22px;margin-top:.05rem}
.resenas-estado b{color:var(--tinta)}
/* Sin reseñas a la vista, los botones van pegados al aviso, sin el filete. */
.resenas-estado:not([hidden]) ~ .resenas-acciones{margin-top:1rem;padding-top:0;border-top:0}

.resenas{display:grid;gap:1px;grid-template-columns:repeat(auto-fill,minmax(min(268px,100%),1fr));
  margin-top:2rem;background:var(--borde);border:1px solid var(--borde)}
.resena{display:flex;flex-direction:column;gap:.55rem;padding:1.2rem 1.25rem;background:var(--blanco)}
.resena-top{display:flex;align-items:center;gap:.7rem}
.resena-cara{position:relative;display:grid;place-items:center;width:38px;height:38px;flex:none;
  border-radius:50%;background:var(--tinta);color:#fff;overflow:hidden;
  font-family:var(--titulo);font-size:1.15rem;line-height:1}
.resena-cara img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.resena-quien{display:flex;flex-direction:column;gap:.1rem;min-width:0;flex:1}
.resena-quien b{font-size:.9rem;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.resena-quien span{font-size:.76rem;color:var(--gris-2)}
.resena-texto{font-size:.89rem;line-height:1.6;color:var(--gris)}
.resena-enlace{margin-top:auto;padding-top:.5rem;font-size:.78rem;font-weight:700;
  color:var(--naranja);text-decoration:none}
.resena-enlace:hover{text-decoration:underline}

.resenas-acciones{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:2rem;
  padding-top:1.6rem;border-top:1px solid var(--borde)}

/* ══════ VISITANOS: ubicación + contacto ═════════════════════════════════ */
.visitanos{background:var(--papel);padding-block:clamp(2.6rem,6vw,4.2rem)}
.visitanos-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.4rem,3.5vw,2.6rem);margin-top:2rem;align-items:stretch}
.datos-caja{background:var(--blanco);border:1px solid var(--borde)}
.datos-fila{padding:1.2rem 1.4rem;border-bottom:1px solid var(--borde)}
.datos-fila:last-child{border-bottom:0}
.datos-fila dt,.datos-tit{font-size:.7rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;
  color:var(--gris-2);margin-bottom:.5rem}
.datos-fila dd{line-height:1.65}
.horarios{display:flex;flex-direction:column;gap:.35rem}
.horarios li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.1rem 1rem;font-size:.9rem;
  padding-bottom:.35rem;border-bottom:1px dashed var(--borde)}
.horarios li:last-child{border-bottom:0;padding-bottom:0}
.horarios span{color:var(--gris)}
.horarios b{font-variant-numeric:tabular-nums;white-space:nowrap;margin-left:auto}
.contactos{display:flex;flex-direction:column;gap:.75rem}
.contacto-fila{display:flex;align-items:center;gap:.85rem;padding:.75rem .85rem;border:1px solid var(--borde);background:var(--papel-2)}
.contacto-fila>.icono,.contacto-fila>.wa{width:1.5rem;height:1.5rem;color:var(--naranja);flex:none}
.contacto-fila.es-wa>.wa{color:var(--verde)}
.contacto-txt{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.contacto-txt span{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gris-2)}
.contacto-txt b{font-family:var(--titulo);font-size:1.25rem;letter-spacing:.01em;overflow-wrap:anywhere}
.contacto-fila.es-wa{display:grid;grid-template-columns:auto minmax(0,1fr) auto}
.contacto-acciones{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.4rem;margin-left:auto}
a.contacto-fila{text-decoration:none;transition:border-color .15s,background .15s}
a.contacto-fila:hover{border-color:var(--naranja);background:var(--naranja-papel)}
a.contacto-fila .flecha{margin-left:auto;color:var(--gris-2)}
a.contacto-fila:hover .flecha{color:var(--naranja)}
.ubi-acciones{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.2rem}
.visitanos-der{display:flex;flex-direction:column;gap:.9rem;min-width:0}
.foto-frente img{aspect-ratio:16/9;object-position:center 55%}
.visitanos-der .mapa{flex:1}
.contacto-accion{margin-left:auto;padding:.42rem .75rem;border:1px solid var(--borde-fuerte);border-radius:var(--radio);
  font-size:.74rem;font-weight:700;letter-spacing:.03em;white-space:nowrap;color:var(--tinta)}
a.contacto-fila:hover .contacto-accion{border-color:var(--naranja);color:var(--naranja-osc)}
.contacto-txt b.contacto-correo{font-family:var(--texto);font-size:.95rem;font-weight:600;letter-spacing:0}
.direccion-calle{font-family:var(--titulo);font-size:1.35rem;letter-spacing:.01em}
.mapa{position:relative;border:1px solid var(--borde);background:var(--papel-2);min-height:clamp(300px,40vh,420px);overflow:hidden}
.mapa iframe{position:absolute;inset:0;display:block;width:100%;height:100%;border:0}
/* La imagen del mapa: se ve siempre, y el marco de Google la tapa si carga. */
.mapa-imagen{position:absolute;inset:0;display:block;text-decoration:none;background:var(--papel-2)}
/* Si la imagen del mapa no está, la tarjeta de dirección ocupa todo el cuadro. */
.mapa-imagen.sin-mapa{display:grid;place-items:center;background:var(--tinta)}
.mapa-imagen.sin-mapa .mapa-pie{position:static;text-align:center;background:none;padding:1.5rem}
.mapa-imagen img{width:100%;height:100%;object-fit:cover}
.mapa-pie{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:.1rem;
  padding:1.4rem 1.1rem .9rem;color:#fff;
  background:linear-gradient(180deg,rgba(18,21,26,0),rgba(18,21,26,.9))}
.mapa-calle{font-family:var(--titulo);font-size:1.3rem;letter-spacing:.01em}
.mapa-pie span:last-child{font-size:.82rem;color:#ccd2d9}

/* ══════ LLAMADA FINAL ═══════════════════════════════════════════════════ */
.cierre{--foto:none;position:relative;background-color:var(--tinta-2);color:#fff;
  border-top:3px solid var(--naranja);background-image:var(--foto);background-size:cover;background-position:center}
.cierre::before{content:"";position:absolute;inset:0;background:rgba(21,24,28,.86)}
.cierre.con-foto::before{background:linear-gradient(180deg,rgba(21,24,28,.86),rgba(21,24,28,.74))}
.cierre-in{position:relative;z-index:1;display:flex;flex-wrap:wrap;align-items:center;gap:1.4rem 2.4rem;padding-block:clamp(2rem,4vw,3rem)}
.cierre h2{font-size:clamp(1.6rem,3.4vw,2.4rem);text-transform:uppercase;max-width:22ch}
.cierre p{color:#b3b9c0;font-size:.95rem;margin-top:.5rem;max-width:56ch}
.cierre-botones{display:flex;flex-wrap:wrap;gap:.6rem;margin-left:auto}

/* ══════ PIE ═════════════════════════════════════════════════════════════ */
.pie{background:var(--tinta);color:#a9b0b8;padding-block:2.8rem 1.4rem;font-size:.88rem}
.pie-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:1.8rem 2rem}
.pie-marca img{width:56px;height:56px;background:#000;border-radius:var(--radio);margin-bottom:.9rem}
.pie-marca strong{display:block;font-family:var(--titulo);font-size:1.15rem;text-transform:uppercase;
  color:#fff;letter-spacing:.02em;line-height:1.15;max-width:18ch}
.pie-marca p{margin-top:.6rem;line-height:1.6;max-width:34ch}
.pie h3{font-family:var(--texto);font-size:.7rem;font-weight:700;letter-spacing:.15em;
  text-transform:uppercase;color:#fff;margin-bottom:.8rem}
.pie ul{display:flex;flex-direction:column;gap:.4rem}
.pie a{color:#a9b0b8;text-decoration:none}
.pie a:hover{color:var(--naranja-claro)}
.pie button{border:0;background:none;padding:0;text-align:left;cursor:pointer;font:inherit;color:#a9b0b8}
.pie button:hover{color:var(--naranja-claro)}
.pie-abajo{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;align-items:center;
  margin-top:2.2rem;padding-top:1.2rem;border-top:1px solid var(--borde-oscuro);font-size:.8rem;color:#7f868f}
.pie-abajo .legal{max-width:70ch}
.pie-correo{overflow-wrap:anywhere}

/* ══════ BOTÓN FLOTANTE ══════════════════════════════════════════════════ */
.flotante{
  position:fixed;right:clamp(.8rem,2.5vw,1.4rem);bottom:clamp(.8rem,2.5vw,1.4rem);z-index:90;
  display:inline-flex;align-items:center;gap:.55rem;padding:.8rem 1.1rem;border:0;border-radius:var(--radio);
  background:var(--verde);color:#fff;cursor:pointer;font-size:.85rem;font-weight:700;letter-spacing:.03em;
  box-shadow:0 10px 26px rgba(20,24,28,.3);transition:background .15s;
}
.flotante:hover{background:var(--verde-osc)}
.flotante .wa{width:1.35rem;height:1.35rem}

/* ══════ CARTELES (ficha de producto y elegir número) ════════════════════ */
.cartel{position:fixed;inset:0;z-index:150;display:flex;align-items:center;justify-content:center;padding:clamp(.7rem,3vw,2rem)}
.cartel-fondo{position:absolute;inset:0;background:rgba(20,24,28,.6)}
.cartel-hoja{position:relative;width:min(900px,100%);max-height:92vh;max-height:92dvh;overflow:auto;
  background:var(--blanco);border-radius:var(--radio-g);box-shadow:0 24px 70px rgba(20,24,28,.4)}
.cartel-x{position:absolute;right:.7rem;top:.7rem;width:34px;height:34px;border:1px solid var(--borde);
  border-radius:var(--radio);background:var(--blanco);font-size:1.3rem;line-height:1;cursor:pointer;z-index:2}
.cartel-x:hover{background:var(--papel)}
.cartel-chico{width:min(480px,100%);padding:clamp(1.3rem,3vw,1.9rem)}
.cartel-chico h3{font-size:1.5rem;text-transform:uppercase;margin-bottom:.4rem;padding-right:2rem}
.cartel-chico .detalle{color:var(--gris);font-size:.92rem}
.cartel-chico .pista{margin-top:.9rem;font-size:.8rem;color:var(--gris-2);text-align:center}

.numeros{display:flex;flex-direction:column;gap:.6rem;margin-top:1.1rem}
.numero{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem .8rem;padding:.8rem .9rem;
  border:1px solid var(--borde);background:var(--papel-2)}
.numero-txt{display:flex;flex-direction:column;line-height:1.2}
.numero-txt span{font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;color:var(--gris-2)}
.numero-txt b{font-family:var(--titulo);font-size:1.25rem;letter-spacing:.01em}
.numero-acciones{display:flex;flex-wrap:wrap;gap:.4rem;margin-left:auto}
.otros-medios{display:grid;grid-template-columns:1fr;gap:.45rem;margin-top:.2rem}
.otro-medio{display:flex;align-items:center;gap:.75rem;padding:.6rem .9rem;border:1px solid var(--borde);
  text-decoration:none;transition:border-color .15s,background .15s}
.otro-medio:hover{border-color:var(--naranja);background:var(--naranja-papel)}
.otro-medio>.icono{width:1.25rem;height:1.25rem;color:var(--naranja)}
.otro-medio>span{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.otro-medio>span span{font-size:.66rem;letter-spacing:.13em;text-transform:uppercase;color:var(--gris-2)}
.otro-medio b{font-size:.92rem;font-weight:600;overflow-wrap:anywhere}
.otro-medio em{margin-left:auto;font-style:normal;font-size:.74rem;font-weight:700;color:var(--naranja-osc);white-space:nowrap}

.ficha-prod{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
.ficha-prod-foto{background:var(--papel-2);display:grid;place-items:center;padding:1.5rem;border-right:1px solid var(--borde)}
.ficha-prod-foto img{max-height:330px;object-fit:contain}
.ficha-prod-foto svg{width:90px;height:90px;color:var(--borde-fuerte);fill:none;stroke:currentColor;stroke-width:1.1}
.ficha-prod-info{padding:clamp(1.3rem,3vw,2rem)}
.ficha-prod-sub{font-size:.7rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--naranja);margin-bottom:.5rem}
.ficha-prod-info h3{font-size:clamp(1.3rem,2.6vw,1.8rem);text-transform:uppercase;margin-bottom:1rem;padding-right:2.2rem}
.tabla-datos{border:1px solid var(--borde)}
.tabla-datos div{display:flex;gap:1rem;padding:.6rem .85rem;border-bottom:1px solid var(--borde);font-size:.88rem}
.tabla-datos div:last-child{border-bottom:0}
.tabla-datos dt{width:6.5rem;flex:none;color:var(--gris-2);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;padding-top:.1rem}
.tabla-datos dd{font-weight:600;overflow-wrap:anywhere}
.ficha-prod-t{margin-top:1.3rem;font-size:.7rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--gris-2)}
.ficha-prod-specs{margin-top:.4rem;font-size:.92rem;line-height:1.7;color:var(--gris)}
.ficha-medidas{margin-top:.45rem;max-height:13.5rem;overflow:auto;border:1px solid var(--borde);font-size:.86rem}
.ficha-medidas li{display:flex;justify-content:space-between;gap:1rem;padding:.42rem .85rem;border-bottom:1px solid var(--borde)}
.ficha-medidas li:last-child{border-bottom:0}
.ficha-medidas li:nth-child(even){background:var(--papel-2)}
.ficha-medidas b{font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.ficha-prod-cta{margin-top:1.4rem;padding-top:1.2rem;border-top:1px solid var(--borde)}
.relacionados{padding:0 clamp(1.3rem,3vw,2rem) clamp(1.3rem,3vw,2rem)}
.relacionados h4{font-family:var(--texto);font-size:.7rem;font-weight:700;letter-spacing:.15em;
  text-transform:uppercase;color:var(--gris-2);margin-bottom:.8rem}
.relacionados-grid{display:grid;gap:1px;grid-template-columns:repeat(auto-fill,minmax(124px,1fr));
  background:var(--borde);border:1px solid var(--borde)}
.relacionado{display:flex;flex-direction:column;gap:.4rem;padding:0 0 .55rem;border:0;background:var(--blanco);
  cursor:pointer;text-align:left}
.relacionado:hover{background:var(--papel-2)}
.relacionado img{width:100%;aspect-ratio:1/.8;object-fit:contain;background:var(--papel-2);padding:.4rem}
.relacionado .sin{display:grid;place-items:center;width:100%;aspect-ratio:1/.8;background:var(--papel-2)}
.relacionado .sin svg{width:26px;height:26px;color:var(--borde-fuerte);fill:none;stroke:currentColor;stroke-width:1.2}
.relacionado span:last-child{padding-inline:.55rem;font-size:.76rem;line-height:1.35;color:var(--gris)}

/* ══════ PANTALLAS CHICAS ════════════════════════════════════════════════ */
@media (max-width:1180px){
  [data-ubicacion-corta]{display:none}
  .tira-catalogo{white-space:nowrap;padding:0 .9rem}
  .tira-links a{padding:0 .6rem;font-size:.8rem}
}
@media (max-width:1120px){
  .equipos-grilla.fila{grid-auto-columns:calc((100% - 3px) / 3.6)}
  .megamenu-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pie-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pasos{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.6rem}
  .paso:nth-child(2n)::after{display:none}
}
@media (max-width:980px){
  .resenas-cab{grid-template-columns:1fr;justify-items:start}
  .portada-in{grid-template-columns:1fr}
  .portada{background-position:center 38%}
  .portada.con-foto::before{background:
    linear-gradient(180deg,rgba(11,13,16,.72),rgba(11,13,16,.86) 55%,rgba(11,13,16,.93))}
  .alquiler-cab,.reparacion-cab{grid-template-columns:1fr;align-items:start}
  .rubros-grid{--col:2}
  .visitanos-grid{grid-template-columns:1fr}
  /* De a tres quedaba la cuarta tarjeta sola, con un hueco al lado. */
  .valores{grid-template-columns:repeat(2,minmax(0,1fr))}
  .catalogo-caja{grid-template-columns:1fr}
  /* El riel pasa a ser una tira que se desliza. */
  .riel{border-right:0;border-bottom:1px solid var(--borde);display:flex;overflow-x:auto;scrollbar-width:thin}
  .riel-titulo{display:none}
  .riel-item{flex:none;width:auto;border-bottom:0;border-right:1px solid var(--borde);padding:.7rem .9rem}
  .riel-item .cuenta,.riel-item .icono{display:none}
  .riel-item.activa{box-shadow:inset 0 -3px 0 var(--naranja)}
  .ficha-prod{grid-template-columns:1fr}
  .ficha-prod-foto{border-right:0;border-bottom:1px solid var(--borde)}
}
@media (max-width:880px){
  .abrir-menu{display:inline-flex}
  .barra-in{flex-wrap:wrap;padding-block:.6rem;gap:.7rem}
  .buscador{order:3;max-width:none;flex-basis:100%}
  /* Con menos de 16 px el iPhone agranda la página al tocar el buscador. */
  .buscador input{font-size:16px}
  .servicio-redes{gap:0}
  .servicio-redes a{display:grid;place-items:center;width:34px;height:var(--servicio)}
  /* En pantallas táctiles, cada enlace con altura cómoda para el dedo. */
  [data-ubicacion-corta]{display:none}
  .indice-lista button,.mm-subs button{padding-block:.45rem}
  .barra-tels{display:none}
  .servicio-fijo,.servicio-correo{display:none}
  .servicio-tels{display:inline-flex}
  .servicio-tel{height:var(--servicio)}
  .tira{position:relative}
  .tira-in{gap:0}
  .tira-links{
    position:absolute;left:0;right:0;top:100%;z-index:120;display:none;flex-direction:column;
    background:var(--tinta-2);border-bottom:3px solid var(--naranja);padding:.4rem 0 .8rem;
  }
  .tira-links.abierto{display:flex}
  .tira-links a{padding:.7rem clamp(1rem,3.5vw,2rem);border-bottom:0;margin-bottom:0}
  .tira-links a.activo{background:rgba(255,255,255,.06)}
  .tira-catalogo{flex:1;justify-content:center;margin-right:0}
  .megamenu-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  html{scroll-padding-top:calc(var(--barra) + 56px + var(--tira) + 12px)}
  .megamenu{max-height:calc(100dvh - 190px);overflow:auto}
  .servicio-fila{grid-template-columns:auto minmax(0,1fr);row-gap:.7rem;align-items:start}
  .servicio-ico{grid-row:1 / span 2;width:46px;height:46px}
  .servicio-ico svg{width:23px;height:23px}
  .servicio-txt,.servicio-flecha{grid-column:2}
}
/* Las tres categorías de a una: el cartel como franja, con el nombre impreso
   entero a la vista, y las subcategorías en columnas. */
@media (max-width:760px){
  .catalogo-cab,.rubros-cab{grid-template-columns:1fr}
  .equipos-grilla.fila{grid-auto-columns:calc((100% - 2px) / 2.3)}
  .foto-cab img{aspect-ratio:16/7}
  .indice{grid-template-columns:1fr}
  .indice-foto img{aspect-ratio:16/10}
  .indice-lista{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 .9rem}
}
/* ══════ CELULAR ═════════════════════════════════════════════════════════
   No es la página achicada: cada sección se reordena para que entre en menos
   pantallas, con los botones a medida del dedo y sin repetir lo que ya se ve. */
@media (max-width:640px){
  :root{--barra:58px;--tira:44px}
  .solo-ancho{display:none}

  /* Cabecera: una fila con el logo y el buscador, y la tira con el catálogo
     y el menú. Lo que queda fijo arriba baja de 174 a 106 px. En el celular
     la dirección está en el menú y el WhatsApp en el botón flotante. */
  html{scroll-padding-top:calc(var(--barra) + var(--tira) + 14px)}
  .servicio-in{font-size:.72rem;justify-content:space-between}
  [data-ubicacion-corta],.servicio-barra .empuje,.barra-acciones{display:none}
  /* Arriba de todo, los dos celulares a lo ancho: Magali y Marcelo. */
  .servicio-barra .estado,.servicio-redes{display:none}
  .servicio-in{justify-content:center}
  .servicio-tels{width:100%;justify-content:space-around;gap:.6rem}
  .servicio-tel{font-size:.74rem}
  .barra-in{flex-wrap:nowrap;padding-block:.45rem;gap:.6rem}
  .logo img{width:40px;height:40px}
  .logo-txt{display:none}
  .buscador{order:0;flex:1;min-width:0}
  .buscador .icono{left:.7rem}
  .buscador input{padding:.55rem .7rem .55rem 2.2rem}
  .buscador input:not(:placeholder-shown){padding-right:2.2rem}
  .tira-catalogo{font-size:.76rem;letter-spacing:.08em;gap:.5rem}
  .tira-links{display:none;grid-template-columns:1fr 1fr;padding:.3rem 0 .6rem}
  .tira-links.abierto{display:grid}
  .tira-links a{padding:.75rem clamp(1rem,3.5vw,2rem)}
  .megamenu{max-height:calc(100dvh - 120px)}
  .megamenu-in{padding-block:1.1rem 1rem}
  .megamenu-grid{grid-template-columns:1fr;gap:1.1rem}
  .mm-subs{display:grid;grid-template-columns:1fr 1fr;column-gap:.8rem}
  .mm-subs button{padding:.45rem 0}
  .megamenu-pie{margin-top:1rem}

  /* Secciones: menos aire arriba y abajo, títulos y bajadas algo más chicos. */
  .catalogo,.rubros,.reparacion,.confianza,.opiniones,.visitanos{padding-block:2.2rem}
  .alquiler-in{padding-block:2.2rem}
  .titulo-seccion{font-size:1.75rem}
  .bajada{font-size:.94rem;line-height:1.55}
  .titulo-seccion + .bajada{margin-top:.55rem}
  .aclaracion{margin-top:1rem;font-size:.8rem}

  /* Portada */
  .portada-in{padding-block:1.9rem 2rem;gap:1.4rem}
  .portada h1{font-size:clamp(2.1rem,9vw,3rem)}
  .portada .bajada{margin-top:.9rem;font-size:.95rem}
  .portada-botones{margin-top:1.3rem;gap:.5rem}
  .portada-botones .boton{flex:1 1 auto;padding:.8rem .75rem;font-size:.8rem}
  .portada-datos{display:grid;grid-template-columns:1fr 1fr;gap:.9rem 1rem;margin-top:1.4rem;padding-top:1.1rem}
  .portada-datos b{font-size:1.15rem}
  .portada-datos span{font-size:.64rem}
  /* La ficha repetía el logo de la cabecera: queda el horario y los números. */
  .ficha-logo{display:none}
  .ficha-in{padding:.95rem 1.05rem 1.05rem}
  .ficha-hoy{padding-block:0 .8rem}
  .ficha-nums{padding-top:.8rem;gap:.55rem}
  .ficha-num-txt b{font-size:1.2rem}
  .ficha-num-txt span{letter-spacing:.04em}
  .ficha-otros{gap:.4rem}
  .ficha-otros a{padding:.5rem .55rem;gap:.45rem}
  .ficha-otros a>span span{font-size:.6rem;letter-spacing:.06em}

  /* Los tres servicios: ícono, título y flecha en un renglón, y el texto
     debajo a todo el ancho. La fila entera ya es el enlace: la flecha alcanza. */
  .servicio-fila{grid-template-columns:auto minmax(0,1fr) auto;gap:.55rem .75rem;padding-block:1.05rem;align-items:center}
  .servicio-txt{display:contents}
  .servicio-ico{grid-row:1;width:36px;height:36px}
  .servicio-ico svg{width:20px;height:20px}
  .servicio-txt h3{grid-column:2;grid-row:1;font-size:1.25rem;margin:0}
  .servicio-flecha{grid-column:3;grid-row:1;font-size:0;gap:0}
  .servicio-flecha .icono{width:20px;height:20px}
  .servicio-txt p{grid-column:1 / -1;grid-row:2;font-size:.9rem;line-height:1.5}

  /* Catálogo */
  .catalogo-cab{margin-bottom:1.2rem}
  .riel-item{flex:1 1 0;justify-content:center;text-align:center;padding:.75rem .5rem}
  .riel-item:last-child{border-right:0}
  .riel-item .riel-ico{display:none}
  .riel-item b{flex:1 1 auto;min-width:0;font-size:.78rem;line-height:1.2}
  .panel{padding:.9rem}
  .indice-intro{padding-bottom:.9rem;margin-bottom:1rem}
  .indice-intro h3{font-size:1.2rem;margin-bottom:.3rem}
  .indice-intro p{font-size:.86rem;line-height:1.5}
  .indice{gap:1rem}
  .indice-foto img{aspect-ratio:2/1}
  .indice-lista{display:grid;grid-template-columns:1fr 1fr;gap:0 .9rem;padding:.35rem .9rem .5rem}
  .indice-lista li:nth-child(n+3){border-top:1px solid var(--borde)}
  .indice-lista button{width:100%;padding:.6rem 0;font-size:.84rem;line-height:1.3}
  .indice-nombre{margin:0 .9rem;padding-top:.75rem}
  .productos{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  /* De a dos por fila, "Consultar" y "Ficha" no entran lado a lado. */
  .producto-cuerpo{padding:.7rem .7rem .75rem}
  .producto-acciones{flex-direction:column;gap:.3rem}
  .producto-acciones .boton,.producto-acciones .boton-linea{flex:none;padding:.5rem .4rem}

  /* Otros rubros: de a dos, con la foto entera y el botón a lo ancho. */
  .rubros-grid{--col:2;--sep:.6rem;margin-top:1.3rem}
  .rubro-cuerpo{padding:.7rem .7rem .75rem;gap:.3rem}
  .rubro-cuerpo h3{font-size:1.08rem}
  .rubro-cuerpo p{font-size:.78rem;line-height:1.45;margin-bottom:.35rem}
  .rubro-cuerpo .boton{align-self:stretch;padding:.6rem .4rem;font-size:.76rem}
  .rubro.sin-foto{min-height:200px}
  .rubro-ico{width:84px;height:84px}

  /* Alquiler: mientras no hay equipos cargados, el botón de WhatsApp queda
     una sola vez, dentro del aviso. */
  .alquiler-cab{padding-bottom:1.2rem;margin-bottom:1.2rem}
  .alquiler-cab .boton{margin-top:1rem}
  .alquiler-in:has(> .alquiler-vacio:not([hidden])) .alquiler-cab .boton{display:none}
  .alquiler-in:has(> .alquiler-vacio:not([hidden])) .alquiler-cab{padding-bottom:0;border-bottom:0}
  .alquiler-vacio{padding:1.3rem 1rem}
  .alquiler-vacio h3{font-size:1rem}
  .equipos-grilla{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  /* En el celular la fila asoma la tarjeta siguiente: se entiende que se desliza. */
  .equipos-grilla.fila{grid-auto-columns:62%;margin-right:calc(-1 * clamp(1rem,3.5vw,2rem));border-right:0}
  .equipos-flechas{display:none}
  .solo-toque{display:inline}
  .equipos-grupo+.equipos-grupo{margin-top:1.8rem}
  .equipos-grupo-cab{margin-bottom:.75rem}
  .equipos-grupo-cab p{font-size:.8rem}
  .equipo h4{font-size:.88rem;line-height:1.3}
  .equipo p{font-size:.78rem}
  .equipo-carac li{font-size:.75rem}
  .alquiler-cab .foto-local{margin-top:1rem}
  .grupos{flex-wrap:nowrap;overflow-x:auto;margin-inline:calc(-1 * clamp(1rem,3.5vw,2rem));padding-inline:clamp(1rem,3.5vw,2rem);scrollbar-width:none}
  .grupo-chip{flex:none}
  .equipo-cuerpo{padding:.75rem .7rem .8rem}
  .equipo .boton{align-self:stretch}

  /* Reparación: los cuatro pasos como una lista con el número al costado. */
  .reparacion-cab .boton{margin-top:1rem}
  .pasos{grid-template-columns:1fr;gap:1rem;margin-top:1.5rem;padding-top:1.4rem}
  .paso{display:grid;grid-template-columns:32px minmax(0,1fr);column-gap:.8rem}
  .paso::after{display:none}
  .paso-n{grid-row:1 / span 2;width:32px;height:32px;margin:0;font-size:1rem}
  .paso h3{font-size:1.05rem;margin-bottom:.15rem;align-self:center}
  .paso p{font-size:.86rem;line-height:1.5}
  .reparacion-extra{margin-top:1.5rem}
  .extra{padding:1.05rem 1rem 1.1rem}
  .extra h3{font-size:1.1rem;margin-bottom:.35rem}
  .extra p{font-size:.86rem;line-height:1.55;margin-bottom:.8rem}
  .extra-foto{width:calc(100% + 2rem);margin:-1.05rem -1rem .9rem}

  /* Nosotros: el ícono al costado del título. */
  .mosaico{grid-template-columns:1fr 1fr;gap:.5rem;margin-top:1.3rem}
  .mosaico-alta{grid-row:auto}
  .mosaico .foto-local:not(.mosaico-ancha) img{aspect-ratio:4/5}
  .mosaico .mosaico-ancha{grid-column:1 / -1}
  .foto-local figcaption{padding:1.2rem .6rem .45rem;font-size:.6rem;letter-spacing:.07em}
  .valores{grid-template-columns:1fr;margin-top:1.3rem}
  .valor{display:grid;grid-template-columns:22px minmax(0,1fr);column-gap:.75rem;padding:1rem 1rem 1.05rem}
  .valor-ico,.valor-ico svg{width:22px;height:22px}
  .valor-ico{grid-row:1 / span 2;margin:0}
  .valor h3{font-size:.95rem;margin-bottom:.2rem}
  .valor p{font-size:.85rem;line-height:1.5}

  /* Opiniones */
  .resenas-estado{margin-top:1.2rem;padding:.9rem 1rem;font-size:.86rem}
  .resenas-acciones{margin-top:1.2rem;gap:.5rem}
  .resenas-estado:not([hidden]) ~ .resenas-acciones{margin-top:.8rem}
  .resenas-acciones .boton{flex:1 1 100%}
  .resenas{margin-top:1.2rem}

  /* Dónde estamos: los números con sus dos botones en la misma fila. */
  .visitanos-grid{margin-top:1.3rem;gap:1rem}
  .datos-fila{padding:.95rem .9rem}
  .direccion-calle{font-size:1.25rem}
  .horarios li{font-size:.84rem;column-gap:.5rem}
  .contactos{gap:.5rem}
  .contacto-fila{gap:.7rem;padding:.6rem}
  .contacto-fila>.icono,.contacto-fila>.wa{width:1.3rem;height:1.3rem}
  .contacto-txt span{letter-spacing:.07em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .contacto-txt b{font-size:1.15rem}
  .contacto-fila.es-wa{grid-template-columns:minmax(0,1fr) auto;align-items:center;padding-left:.75rem}
  .contacto-fila.es-wa>.wa{display:none}
  .contacto-acciones{flex-wrap:nowrap;gap:.35rem;margin-left:0}
  .contacto-acciones .boton{padding:.55rem .65rem}
  .ubi-acciones{margin-top:.9rem;gap:.5rem}
  .ubi-acciones .boton{flex:1 1 100%}
  .mapa{min-height:260px}
  .contacto-accion{padding:.4rem .55rem;font-size:.7rem}
  .contacto-txt b.contacto-correo{font-size:.84rem}
  /* El correo es largo: el botón baja a su renglón y la dirección entra entera. */
  .contacto-fila:has(.contacto-correo){flex-wrap:wrap;row-gap:.45rem}
  .contacto-fila:has(.contacto-correo) .contacto-accion{margin-left:calc(1.3rem + .7rem)}
  .contacto-txt b.contacto-correo{white-space:nowrap}
  .otro-medio{padding:.55rem .7rem}
  .otro-medio b{font-size:.84rem}
  .otro-medio{flex-wrap:wrap;row-gap:.3rem}
  .otro-medio b{overflow-wrap:normal;white-space:nowrap}
  .ficha-num-txt span{font-size:.6rem}

  /* Llamada final y pie */
  .cierre-in{padding-block:1.8rem;gap:1rem}
  .cierre h2{font-size:1.5rem}
  .cierre p{font-size:.9rem}
  .cierre-botones{margin-left:0;width:100%;gap:.5rem}
  .cierre-botones .boton{flex:1}
  /* Abajo queda lugar para que el botón flotante no tape el último renglón. */
  .pie{padding-block:2rem 5rem}
  .pie-grid{grid-template-columns:1fr 1fr;gap:1.5rem 1rem}
  .pie-marca,.pie-grid>div:last-child{grid-column:1 / -1}
  .pie-marca{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:.8rem;align-items:center}
  .pie-marca img{width:44px;height:44px;margin:0}
  .pie-marca strong{max-width:none;font-size:1.05rem}
  .pie-marca p{grid-column:1 / -1;margin-top:.7rem}
  .pie h3{margin-bottom:.4rem}
  .pie ul{gap:0}
  .pie li a,.pie li button{display:block;padding:.32rem 0}
  .pie-abajo{margin-top:1.4rem}

  /* Ventanas */
  .numero{flex-direction:column;align-items:stretch}
  .numero-acciones{margin-left:0}
  .numero-acciones .boton{flex:1}
  .flotante span{display:none}
  .flotante{padding:.85rem;border-radius:50%}
}
/* En los celulares más angostos los botones de cada número bajan a su renglón. */
@media (max-width:359px){
  .contacto-fila.es-wa{grid-template-columns:minmax(0,1fr)}
  .contacto-acciones .boton{flex:1}
  .contacto-acciones .solo-ancho{display:inline}
  .tira-catalogo{padding:0 .8rem;letter-spacing:.05em}
  .tira-catalogo .barritas{display:none}
  .abrir-menu{padding:0 .8rem;letter-spacing:.05em}
  .portada-datos{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important}
}