:root{
  --rojo:#c8161d; --rojo-osc:#9e1016; --amarillo:#f6c21c;
  --negro:#1c242b; --gris:#f4f1ec; --texto:#2a2a2a; --verde:#1fa855;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{font-family:'Archivo',system-ui,sans-serif;color:var(--texto);background:#fff;line-height:1.6}
img{max-width:100%;display:block}
a{color:inherit}
.contenedor{width:min(1120px,100% - 32px);margin-inline:auto}
.centro{text-align:center}

/* Botones */
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--rojo);color:#fff;text-decoration:none;
  font-weight:800;padding:14px 28px;border-radius:999px;transition:transform .15s,background .15s}
.btn:hover{background:var(--rojo-osc);transform:translateY(-2px)}
.btn--chico{padding:9px 18px;font-size:.95rem}
.btn--amarillo{background:var(--amarillo);color:var(--negro)}
.btn--amarillo:hover{background:#ffd54a}
.btn--wa{background:var(--verde)}
.btn--wa:hover{background:#178a45}

/* Títulos */
.titulo{font-family:'Alfa Slab One',serif;font-weight:400;color:var(--rojo);font-size:clamp(1.8rem,4vw,2.6rem);line-height:1.15;margin-bottom:12px}
.titulo--centro{text-align:center}
.titulo--chico{font-size:clamp(1.3rem,3vw,1.7rem)}
.subtitulo{font-weight:800;text-transform:uppercase;letter-spacing:.04em;margin-bottom:18px}

/* Barra */
.barra{position:sticky;top:0;z-index:10;background:var(--negro);color:#fff;box-shadow:0 2px 12px rgba(0,0,0,.2)}
.barra__in{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0}
.barra__logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:'Alfa Slab One',serif;color:var(--amarillo);font-size:1.2rem}
.barra__logo img{width:52px;height:52px;object-fit:contain}
.barra__nav{display:flex;align-items:center;gap:20px}
.barra__nav>a:not(.btn){text-decoration:none;font-weight:600}
.barra__nav>a:not(.btn):hover{color:var(--amarillo)}
@media (max-width:640px){
  .barra__logo span{display:none}
  .barra__nav{gap:12px;font-size:.92rem}
}

/* Hero */
.hero{background:linear-gradient(rgba(20,20,20,.62),rgba(20,20,20,.72)),url('fotos/portada-1.jpg') center/cover;color:#fff;
  min-height:72vh;display:flex;align-items:center;text-align:center}
.hero__in{padding:80px 0}
.hero__sello{display:inline-block;background:var(--amarillo);color:var(--negro);font-weight:800;padding:6px 16px;border-radius:999px;margin-bottom:18px}
.hero__titulo{font-family:'Alfa Slab One',serif;font-weight:400;font-size:clamp(2.2rem,7vw,4.4rem);line-height:1.05;margin-bottom:28px;text-shadow:0 3px 18px rgba(0,0,0,.5)}

/* Nosotros */
.nosotros{padding:80px 0;background:var(--gris)}
.nosotros__in{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.nosotros p+p{margin-top:12px}
.nosotros__foto{border-radius:18px;box-shadow:0 14px 40px rgba(0,0,0,.18);width:100%}
@media (max-width:800px){.nosotros__in{grid-template-columns:1fr}}

/* Sucursales */
.sucursales{padding:80px 0}
.grilla{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;margin-top:32px}
.tarjeta{background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 8px 28px rgba(0,0,0,.1);display:flex;flex-direction:column}
.tarjeta img{aspect-ratio:16/10;object-fit:cover;width:100%}
.tarjeta__cuerpo{padding:20px;display:flex;flex-direction:column;gap:12px;flex:1}
.tarjeta h3{font-family:'Alfa Slab One',serif;font-weight:400;color:var(--rojo);font-size:1.4rem}
.tarjeta p a{text-decoration:none}
.tarjeta p a:hover{text-decoration:underline}
.tarjeta .btn{align-self:flex-start;margin-top:auto}

/* Marcas */
.marcas{padding:56px 0;background:var(--gris)}
.marcas__fila{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:20px;margin-top:20px}
.marcas__fila img{height:90px;width:auto;max-width:180px;object-fit:contain;background:#fff;border-radius:12px;padding:10px 16px;mix-blend-mode:multiply}

/* Cierre */
.cierre{background:var(--rojo);color:#fff;text-align:center;padding:64px 0}
.cierre__a{font-family:'Alfa Slab One',serif;font-size:clamp(1.5rem,4vw,2.2rem)}
.cierre__b{font-size:1.15rem;margin:8px 0 24px}

/* Contacto */
.contacto{padding:80px 0}
.contacto__in{display:grid;grid-template-columns:1.3fr 1fr;gap:48px}
.datos{list-style:none;display:grid;gap:10px}
.datos a{text-decoration:none;font-weight:600}
.datos a:hover{color:var(--rojo)}
@media (max-width:800px){.contacto__in{grid-template-columns:1fr}}

/* Pie */
.pie{background:var(--negro);color:#bbb;text-align:center;padding:22px 0;font-size:.9rem}