
/* Colores y tipografias tomados del sitio actual. */
:root{
  --tinta:#131313; --tinta2:#4B4F58; --suave:#69727D;
  --fondo:#FFFFFF; --panel:#F4F5F7; --linea:#E1E4E9;
  --rojo:#BF0B17; --rojo-osc:#9A0812;
  --azul:#0170B9;
  --verde:#1C6248;
  --titulos:"Montserrat","Gotham","Segoe UI",sans-serif;
  --texto:"Roboto","Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--tinta2);
  font:16px/1.65 var(--texto)}
h1,h2,h3,h4,.marca-sitio{font-family:var(--titulos);color:var(--tinta);
  letter-spacing:-.01em}
img{max-width:100%;display:block}
a{color:var(--rojo);text-decoration:none}
a:hover{text-decoration:underline}
.contenedor{max-width:1120px;margin:0 auto;padding-inline:20px}

header.top{background:var(--tinta);color:#fff;position:sticky;top:0;z-index:30}
.top .contenedor{display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;
  padding-block:14px}
.marca-sitio{display:block;line-height:0}
.marca-sitio img{width:auto;height:40px;max-width:210px;object-fit:contain}
nav.menu{display:flex;flex-wrap:wrap;gap:6px 20px;margin-left:auto;font-size:14.5px}
nav.menu a{color:#DDE1E6}
nav.menu a:hover{color:#fff}

.portada{background:var(--panel);border-bottom:1px solid var(--linea);
  padding-block:46px 42px}
.portada h1{margin:0 0 10px;font-size:32px;line-height:1.18;letter-spacing:-.02em;
  text-wrap:balance}
.portada p{margin:0;max-width:62ch;color:var(--tinta2);font-size:17px}
.portada.con-foto{position:relative;background-size:cover;background-position:center;
  border-bottom:0;padding-block:96px 88px;color:#fff}
.portada.con-foto::before{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(19,19,19,.55),rgba(19,19,19,.72))}
.portada.con-foto .contenedor{position:relative}
.portada.con-foto h1,.portada.con-foto p{color:#fff}
.portada.con-foto h1{font-size:38px;max-width:20ch}
@media (max-width:640px){.portada.con-foto{padding-block:64px 58px}
  .portada.con-foto h1{font-size:28px}}

.sin-foto{width:100%;height:100%;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:6px;text-align:center;
  background:linear-gradient(160deg,#1E232B,#131313);color:#fff;padding:14px}
.sin-foto .tipo{font-family:var(--titulos);font-weight:700;font-size:15px;
  letter-spacing:.02em}
.sin-foto .pie{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:#9AA3AF}
.sin-foto.grande{aspect-ratio:4/3;border-radius:8px}

.logo-marca{height:34px;width:auto;max-width:170px;object-fit:contain;
  margin:0 0 10px;display:block}

main{padding-block:36px 56px}
h2{font-size:22px;margin:0 0 4px;letter-spacing:-.01em}
.sub{color:var(--suave);font-size:14.5px;margin:0 0 22px}

.rejilla{display:grid;gap:18px;
  grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.tarjeta{border:1px solid var(--linea);border-radius:8px;overflow:hidden;
  background:var(--fondo);display:flex;flex-direction:column}
.tarjeta .foto{aspect-ratio:4/3;max-width:100%;background:var(--panel);
  display:flex;align-items:center;justify-content:center;overflow:hidden}
.tarjeta .foto img{width:100%;height:100%;object-fit:cover}
.tarjeta .foto .vacia{color:var(--suave);font-size:12px;letter-spacing:.1em;
  text-transform:uppercase}
.tarjeta .cuerpo{padding:13px 15px 15px;display:flex;flex-direction:column;gap:6px;flex:1}
.tarjeta h3{margin:0;font-size:15.5px;line-height:1.35}
.tarjeta h3 a{color:var(--tinta)}
.tarjeta .rubro{font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--suave)}

.migas{font-size:13.5px;color:var(--suave);margin:0 0 16px}
.migas a{color:var(--suave)}

.ficha{display:grid;gap:32px;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
  align-items:start}
@media (max-width:820px){.ficha{grid-template-columns:1fr}}
.ficha .galeria img{width:100%;border:1px solid var(--linea);border-radius:8px}
.ficha .galeria img + img{margin-top:12px}
.ficha h1{margin:0 0 6px;font-size:27px;line-height:1.22;letter-spacing:-.02em;
  text-wrap:balance}
.ficha .rubro{font-size:11.5px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--suave);margin:0 0 16px}
.especificaciones{background:var(--panel);border:1px solid var(--linea);
  border-radius:8px;padding:16px 18px;margin:0 0 18px}
.especificaciones p{margin:0}
.especificaciones p + p{margin-top:6px}
.cuerpo-texto p{margin:0 0 12px;color:var(--tinta2)}

.precio{font-weight:700;font-size:15px;color:var(--verde)}
.precio.consultar-txt{color:var(--suave);font-weight:600;font-size:13.5px}
.precio-grande{font-size:26px;font-weight:700;color:var(--verde);margin:0 0 14px;
  letter-spacing:-.01em}
.consultar{display:inline-block;background:var(--rojo);color:#fff;font-weight:600;
  padding:13px 24px;border-radius:7px;font-size:16px;margin-top:6px}
.consultar:hover{background:var(--rojo-osc);text-decoration:none}
.aviso-tel{font-size:13px;color:var(--suave);margin:10px 0 0}
.ficha-pdf{display:inline-block;margin:10px 0 0 10px;padding:13px 20px;
  border:1px solid var(--linea);border-radius:7px;color:var(--tinta2);
  font-weight:500;font-size:15px}
.ficha-pdf:hover{border-color:var(--rojo);color:var(--rojo);text-decoration:none}
@media (max-width:520px){.ficha-pdf{margin-left:0;display:block;text-align:center}}

.familias{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px;padding:0;list-style:none}
.familias a{display:inline-block;border:1px solid var(--linea);border-radius:99px;
  padding:6px 14px;font-size:13.5px;color:var(--tinta2);background:var(--fondo)}
.familias a:hover{border-color:var(--rojo);color:var(--rojo);text-decoration:none}

.bloque + .bloque{margin-top:38px}

/* --- notas --- */
.otras-marcas .familias a{border-style:dashed}

.rejilla-notas{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.nota-tarjeta{border:1px solid var(--linea);border-radius:9px;padding:20px 22px;
  background:var(--fondo)}
.nota-tarjeta h2{font-size:18px;margin:0 0 8px;line-height:1.3}
.nota-tarjeta h2 a{color:var(--tinta)}
.nota-tarjeta p{margin:0;font-size:14.5px;color:var(--tinta2)}

.nota{max-width:680px}
.nota h1{font-size:31px;line-height:1.2;letter-spacing:-.02em;margin:0 0 14px;
  text-wrap:balance}
.nota .entrada{font-size:19px;line-height:1.5;color:var(--tinta2);margin:0 0 30px}
.nota h2{font-size:21px;margin:34px 0 10px;line-height:1.3;text-wrap:balance}
.nota p{margin:0 0 15px;font-size:17px;line-height:1.65;color:var(--tinta2)}
.nota strong{color:var(--tinta);font-weight:700}

.preguntas{margin-top:42px;border-top:2px solid var(--tinta);padding-top:12px}
.preguntas h2{margin-top:18px}
.qa{border-bottom:1px solid var(--linea);padding:16px 0}
.qa:last-child{border-bottom:0}
.qa h3{font-size:17px;margin:0 0 6px;line-height:1.35;color:var(--tinta)}
.qa p{margin:0;font-size:16px}

.firma{margin-top:38px;padding-top:16px;border-top:1px solid var(--linea);
  font-size:14px;color:var(--suave)}

footer.pie{background:var(--tinta);color:#C3C9D2;margin-top:10px;padding-block:32px}
footer.pie .contenedor{display:grid;gap:22px;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
footer.pie h4{margin:0 0 8px;color:#fff;font-size:13px;letter-spacing:.12em;
  text-transform:uppercase;font-weight:600}
footer.pie p,footer.pie li{margin:0 0 5px;font-size:14px}
footer.pie ul{list-style:none;margin:0;padding:0}
footer.pie a{color:#C3C9D2}
.legal{border-top:1px solid #2A2E35;margin-top:26px;padding-top:16px;
  font-size:12.5px;color:#868E9A}
