/* ==========================================================================
   PINTURERÍA — tu zona · styles.css
   Sistema visual único para las 5 páginas. Todo color, tipografía, radio,
   sombra y espaciado vive acá adentro como variable. Nada suelto.
   ========================================================================== */

@media (min-width:0px){
  /* preconnect ya está en el <head>; esto solo documenta la carga de fuentes */
}

:root{
  /* ---- Color: sale de las fotos reales del local, no del aire ----
     Rojo:      de las latas "ONE LUX" (convertidor de óxido) en la góndola.
     Negro:     del logotipo/rotulado de los envases en los envases.
     Crema:     neutro cálido, corrido hacia el rojo (no gris puro).
     Verde agua:de la pared interior del local (muestrario de colores).
     Dorado:    reservado únicamente para las estrellas de las reseñas.
  */
  --rojo-onelux:      #C5391F;
  --rojo-onelux-dark: #9E2C17;
  --negro-max:        #211D1A;
  --crema:            #F6EFE3;
  --crema-alta:       #EEE2CC;
  --verde-pared:      #6F9C90;
  --verde-pared-dark: #4F766C;
  --dorado-estrella:  #E3A63C;
  --blanco:           #FFFCF7;

  /* texto */
  --texto-oscuro: var(--negro-max);
  --texto-claro:  var(--crema);
  --texto-muted:  #5B5650;

  /* acento único: SOLO para lo que el visitante tiene que tocar */
  --acento: var(--rojo-onelux);
  --acento-hover: var(--rojo-onelux-dark);

  /* tipografía */
  --font-titulo: 'Anton', 'Arial Narrow', Impact, sans-serif;
  --font-texto:  'Karla', 'Trebuchet MS', 'Segoe UI', sans-serif;

  --fs-xs:   0.8rem;
  --fs-sm:   0.9rem;
  --fs-base: 1rem;
  --fs-md:   1.15rem;
  --fs-lg:   1.4rem;
  --fs-xl:   1.75rem;
  --fs-2xl:  2.25rem;
  --fs-3xl:  3rem;

  /* espaciado — única escala */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;
  --sp-9: 96px;
  --sp-10: 128px;

  --contenedor-max: 1160px;
  --gutter: 20px;
  --ritmo-seccion: var(--sp-9);

  --radio-card: 14px;
  --radio-btn: 999px;
  --sombra-1: 0 2px 8px rgba(33,29,26,.10);
  --sombra-2: 0 16px 40px rgba(33,29,26,.22);

  --dur: 700ms;
  --ease: cubic-bezier(.16,1,.3,1);
}

/* Reactivar reduce real: reemplazar la constante FORZAR_ANIMACIONES en main.js
   por matchMedia('(prefers-reduced-motion: reduce)').matches, y descomentar:
@media (prefers-reduced-motion: reduce){
  .rv,.marquee-track,.hero-parallax,.contador{ transition:none !important; animation:none !important; }
}
*/

*,*::before,*::after{ box-sizing:border-box; }
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  overflow-x:clip; /* además de body: así tampoco desborda por elementos position:fixed (menú mobile, botón flotante) */
  width:100%;
}
body{
  margin:0;
  background:var(--crema);
  color:var(--texto-oscuro);
  font-family:var(--font-texto);
  font-size:var(--fs-base);
  line-height:1.6;
  overflow-x:clip;
  width:100%;
}
img{ max-width:100%; display:block; }
a{ color:inherit; }
h1,h2,h3,h4{
  font-family:var(--font-titulo);
  font-weight:400;
  line-height:1.05;
  text-transform:uppercase;
  letter-spacing:.01em;
  text-wrap:balance;
  margin:0 0 var(--sp-4);
}
h1{ font-size:clamp(2.1rem, 6vw + 1rem, var(--fs-3xl)); }
h2{ font-size:clamp(1.6rem, 4vw + 1rem, var(--fs-2xl)); }
h3{ font-size:var(--fs-xl); }
p{ margin:0 0 var(--sp-4); }
.lectura{ max-width:65ch; }
.container{
  max-width:var(--contenedor-max);
  margin:0 auto;
  padding-left:var(--gutter);
  padding-right:var(--gutter);
}
.visually-hidden{
  position:absolute; width:1px; height:1px; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap; border:0; padding:0; margin:-1px;
}
:focus-visible{
  outline:3px solid var(--acento);
  outline-offset:2px;
  border-radius:4px;
}

/* ---------- sin JS: todo visible. con JS: .rv arranca oculto ---------- */
.js .rv{ opacity:0; }
.rv{
  opacity:1;
  transform:translateY(40px);
  transition:opacity var(--dur) var(--ease), transform var(--dur) var(--ease);
}
.js .rv{ transform:translateY(40px); }
.rv.visible{ opacity:1; transform:translateY(0); }

/* ================= SECCIONES: ritmo y alternancia ================= */
.seccion{
  padding-top:var(--ritmo-seccion);
  padding-bottom:var(--ritmo-seccion);
  position:relative;
  overflow:clip;
}
.seccion--crema{ background:var(--crema); color:var(--texto-oscuro); }
.seccion--oscura{ background:var(--negro-max); color:var(--texto-claro); }
.seccion--oscura .eyebrow{ color:var(--verde-pared); }
.seccion--verde{ background:var(--verde-pared); color:var(--negro-max); }
.eyebrow{
  display:inline-block;
  font-family:var(--font-titulo);
  font-size:var(--fs-sm);
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--rojo-onelux);
  margin-bottom:var(--sp-3);
}
.section-head{ margin-bottom:var(--sp-7); }
.section-head p{ color:var(--texto-muted); }
.seccion--oscura .section-head p{ color:#D7CFC1; }

/* ================= HEADER ================= */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(246,239,227,.92);
  border-bottom:1px solid rgba(33,29,26,.08);
  transition:background var(--dur) var(--ease), box-shadow var(--dur) var(--ease), padding var(--dur) var(--ease);
  padding-top:var(--sp-3); padding-bottom:var(--sp-3);
}
.site-header.compacto{
  background:rgba(246,239,227,.96);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:var(--sombra-1);
  padding-top:var(--sp-2); padding-bottom:var(--sp-2);
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4);
}
.logo{
  font-family:var(--font-titulo);
  font-size:var(--fs-lg);
  text-transform:uppercase;
  text-decoration:none;
  color:var(--negro-max);
  display:flex; align-items:center; gap:var(--sp-2);
  white-space:nowrap;
}
.logo .franja{
  display:inline-flex; height:18px; width:34px; border-radius:4px; overflow:hidden; flex:none;
}
.logo .franja span{ flex:1; }
.logo .franja span:nth-child(1){ background:#3F7FB0; }
.logo .franja span:nth-child(2){ background:var(--verde-pared-dark); }
.logo .franja span:nth-child(3){ background:var(--dorado-estrella); }
.logo .franja span:nth-child(4){ background:var(--rojo-onelux); }

.nav-desktop{ display:none; }
.nav-desktop ul{ list-style:none; display:flex; gap:var(--sp-6); margin:0; padding:0; }
.nav-desktop a{
  text-decoration:none; font-weight:700; font-size:var(--fs-sm);
  letter-spacing:.03em; text-transform:uppercase;
  padding-bottom:6px; border-bottom:2px solid transparent;
}
.nav-desktop a:hover{ border-color:var(--acento); }
.nav-desktop a[aria-current="page"]{ border-color:var(--acento); color:var(--rojo-onelux); }

.header-actions{ display:flex; align-items:center; gap:var(--sp-3); }
.btn{
  display:inline-flex; align-items:center; gap:var(--sp-2);
  font-family:var(--font-texto); font-weight:700; font-size:var(--fs-sm);
  text-decoration:none; border-radius:var(--radio-btn);
  padding:var(--sp-3) var(--sp-5);
  border:2px solid transparent; cursor:pointer;
  transition:transform 200ms var(--ease), box-shadow 200ms var(--ease), background 200ms var(--ease);
}
.btn svg{ width:18px; height:18px; flex:none; }
.btn-wa{ background:var(--acento); color:var(--blanco); }
.btn-wa:hover{ background:var(--acento-hover); transform:translateY(-2px); box-shadow:var(--sombra-1); }
/* mismo color de acento, para links que NO son de WhatsApp (ej. "ver todos los productos") */
.btn-acento{ background:var(--acento); color:var(--blanco); }
.btn-acento:hover{ background:var(--acento-hover); transform:translateY(-2px); box-shadow:var(--sombra-1); }
.btn-tel{ background:transparent; border-color:var(--negro-max); color:var(--negro-max); }
.btn-tel:hover{ background:var(--negro-max); color:var(--crema); transform:translateY(-2px); }
.btn-outline-claro{ background:transparent; border-color:var(--crema); color:var(--crema); }
.btn-outline-claro:hover{ background:var(--crema); color:var(--negro-max); }
.btn-block{ width:100%; justify-content:center; }
.btn-sm{ padding:var(--sp-2) var(--sp-4); font-size:var(--fs-xs); }

.btn-burger{
  display:inline-flex; align-items:center; justify-content:center;
  width:44px; height:44px; border-radius:8px; border:2px solid var(--negro-max);
  background:transparent; cursor:pointer; flex:none;
}
.btn-burger svg{ width:22px; height:22px; }

/* menú mobile */
.nav-mobile{
  position:fixed; inset:0; z-index:60;
  background:var(--negro-max);
  color:var(--crema);
  display:flex; flex-direction:column;
  padding:var(--sp-5) var(--gutter) var(--sp-7);
  transform:translateX(100%);
  transition:transform 320ms var(--ease);
}
.nav-mobile.abierto{ transform:translateX(0); }
.nav-mobile-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:var(--sp-7); }
.nav-mobile-top .logo{ color:var(--crema); }
.nav-mobile-top .btn-burger{ border-color:var(--crema); color:var(--crema); }
.nav-mobile ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:var(--sp-5); }
.nav-mobile a{
  text-decoration:none; color:var(--crema); font-family:var(--font-titulo);
  font-size:var(--fs-2xl); text-transform:uppercase;
}
.nav-mobile a[aria-current="page"]{ color:var(--rojo-onelux); }
.nav-mobile .header-actions{ margin-top:var(--sp-7); flex-direction:column; align-items:stretch; }
body.menu-abierto{ overflow:hidden; }

@media (min-width:900px){
  .nav-desktop{ display:block; }
  .btn-burger{ display:none; }
}

/* header angosto: los tres controles (WA, tel, burger) no entran con texto junto al logo */
@media (max-width:560px){
  .logo{ font-size:var(--fs-md); }
  .header-actions{ gap:var(--sp-2); }
  .header-actions .btn-wa span,
  .header-actions .btn-tel span{ display:none; }
  .header-actions .btn{ padding:var(--sp-2) var(--sp-3); }
  .header-actions .btn svg{ margin:0; }
}

/* barra de progreso de lectura */
.progreso{
  position:fixed; top:0; left:0; height:3px; width:0%;
  background:var(--acento); z-index:80; transition:width 80ms linear;
}

/* ================= HERO ================= */
.hero{
  position:relative;
  min-height:min(88vh, 720px);
  display:flex; align-items:flex-end;
  color:var(--blanco);
  overflow:clip;
}
.hero-media{
  position:absolute; inset:0; z-index:0;
}
.hero-media img{
  width:100%; height:100%; object-fit:cover;
  transform:translateY(0) scale(1.08);
  will-change:transform;
}
.hero-velo{
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(33,29,26,.35) 0%, rgba(33,29,26,.55) 55%, rgba(33,29,26,.92) 100%);
}
.hero-content{
  position:relative; z-index:2;
  padding-top:var(--sp-9); padding-bottom:var(--sp-8);
  width:100%;
}
.hero-content .eyebrow{ color:var(--dorado-estrella); }
.hero h1{ max-width:16ch; margin-bottom:var(--sp-3); }
.hero .bajada{ max-width:46ch; font-size:var(--fs-md); color:#F0E9DC; margin-bottom:var(--sp-6); }
.hero-ctas{ display:flex; flex-wrap:wrap; gap:var(--sp-3); }
.hero-chips{
  position:absolute; z-index:1; inset:auto 0 0 0; height:14px;
  display:flex;
}
.hero-chips span{ flex:1; }

/* franja de chips de color — EL GOLPE del sitio */
.franja-chips{
  display:flex; width:100%; height:56px;
  overflow:clip;
}
.franja-chips span{ flex:1 1 auto; }
.franja-chips--fina{ height:10px; }

/* ================= TRUST STRIP ================= */
.trust{
  display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-5);
}
@media (min-width:700px){ .trust{ grid-template-columns:repeat(4,1fr); } }
.trust-item{ text-align:center; padding:var(--sp-4); }
.trust-num{
  font-family:var(--font-titulo); font-size:var(--fs-2xl); color:var(--rojo-onelux);
  display:block;
}
.trust-label{ font-size:var(--fs-sm); color:var(--texto-muted); }
.seccion--oscura .trust-label{ color:#D7CFC1; }

/* ================= GRID / CARDS ================= */
.grid-2{ display:grid; gap:var(--sp-6); grid-template-columns:1fr; }
.grid-3{ display:grid; gap:var(--sp-6); grid-template-columns:1fr; }
.grid-4{ display:grid; gap:var(--sp-5); grid-template-columns:1fr; }
/* los ítems de grid por defecto no bajan de su min-content: con títulos condensados
   (Anton) eso puede empujar la columna afuera del viewport. Se corrige así: */
.grid-2>*, .grid-3>*, .grid-4>*{ min-width:0; }
.card h3, .card p{ overflow-wrap:break-word; }
@media (min-width:480px){
  .grid-4{ grid-template-columns:repeat(2,1fr); }
}
@media (min-width:700px){
  .grid-2{ grid-template-columns:1fr 1fr; }
  .grid-3{ grid-template-columns:repeat(3,1fr); }
}
@media (min-width:900px){
  .grid-4{ grid-template-columns:repeat(4,1fr); }
}

.card{
  background:var(--blanco);
  border-radius:var(--radio-card);
  padding:var(--sp-6);
  box-shadow:var(--sombra-1);
  border:1px solid rgba(33,29,26,.06);
  transition:transform 200ms var(--ease), box-shadow 200ms var(--ease), border-color 200ms var(--ease);
}
.card:hover{
  transform:translateY(-4px);
  border-color:var(--acento);
  box-shadow:var(--sombra-2);
}
.card .icono{ width:40px; height:40px; color:var(--rojo-onelux); margin-bottom:var(--sp-4); }
.card h3{ font-size:var(--fs-lg); margin-bottom:var(--sp-2); }
.card p{ color:var(--texto-muted); margin-bottom:0; }
.card .precio-tag{
  display:inline-block; margin-top:var(--sp-3);
  font-family:var(--font-titulo); font-size:var(--fs-sm);
  background:var(--crema-alta); padding:var(--sp-1) var(--sp-3); border-radius:6px;
}

/* categoría de producto: sin card, respira solo, con foto real */
.categoria{
  display:grid; gap:var(--sp-6); grid-template-columns:1fr; align-items:center;
  padding:var(--sp-7) 0; border-bottom:1px solid rgba(33,29,26,.1);
}
.categoria:last-child{ border-bottom:none; }
@media (min-width:800px){
  .categoria{ grid-template-columns:1fr 1fr; }
  .categoria.invertida .categoria-media{ order:2; }
}
.categoria-media img{
  border-radius:var(--radio-card);
  width:100%; height:280px; object-fit:cover;
  box-shadow:var(--sombra-1);
}
.categoria-marca{
  font-family:var(--font-titulo); font-size:var(--fs-sm); letter-spacing:.08em;
  color:var(--rojo-onelux); text-transform:uppercase; display:block; margin-bottom:var(--sp-2);
}
.categoria ul{ padding-left:var(--sp-5); color:var(--texto-muted); }
.categoria li{ margin-bottom:var(--sp-1); }

/* imagen de fondo con velo (Nosotros) */
.foto-fondo{
  position:relative; border-radius:var(--radio-card); overflow:clip; color:var(--blanco);
  min-height:420px; display:flex; align-items:flex-end;
}
.foto-fondo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.foto-fondo::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(33,29,26,0) 20%, rgba(33,29,26,.86) 100%);
}
.foto-fondo-contenido{ position:relative; z-index:1; padding:var(--sp-6); }

/* marcas */
.marca-tag{
  display:flex; flex-direction:column; gap:var(--sp-2);
  padding:var(--sp-6); border-radius:var(--radio-card);
  background:var(--blanco); border:1px solid rgba(33,29,26,.08);
}
.marca-tag .marca-nombre{
  font-family:var(--font-titulo); font-size:var(--fs-xl); text-transform:none;
}
.marca-tag .marca-usa{ font-size:var(--fs-sm); color:var(--texto-muted); }
.marca-swatch{ display:flex; gap:6px; margin-top:var(--sp-2); }
.marca-swatch span{ width:22px; height:22px; border-radius:6px; display:block; }

/* ================= MARQUEE (colores en promo) ================= */
.marquee{
  width:100%; overflow:clip;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.marquee-track{
  display:flex; gap:var(--sp-5); width:max-content;
  animation:marquee-scroll 26s linear infinite;
}
.marquee:hover .marquee-track, .marquee.pausado .marquee-track{ animation-play-state:paused; }
@keyframes marquee-scroll{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}
.chip-color{
  flex:none; width:150px; height:100px; border-radius:10px;
  display:flex; align-items:flex-end; padding:var(--sp-3);
  font-family:var(--font-titulo); font-size:var(--fs-xs); text-transform:uppercase;
  box-shadow:var(--sombra-1);
}

/* ================= RESEÑAS ================= */
.reviews-cabecera{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:var(--sp-5); margin-bottom:var(--sp-6);
}
.reviews-score{ font-family:var(--font-titulo); font-size:var(--fs-3xl); color:var(--dorado-estrella); }
.reviews-total{ color:var(--texto-muted); }
.seccion--oscura .reviews-total{ color:#D7CFC1; }
.estrellas{ display:inline-flex; gap:2px; }
.estrellas svg{ width:16px; height:16px; }
.estrellas .llena{ fill:var(--dorado-estrella); }
.estrellas .vacia{ fill:none; stroke:var(--dorado-estrella); stroke-width:1.5; }

.review-carrusel{
  overflow-x:auto; overflow-y:hidden; cursor:grab;
  scrollbar-width:none; -ms-overflow-style:none;
}
.review-carrusel::-webkit-scrollbar{ display:none; }
.review-carrusel.arrastrando{ cursor:grabbing; }
.review-track{
  display:flex; gap:var(--sp-5); width:max-content;
  animation:marquee-scroll 48s linear infinite;
}
.review-carrusel:hover .review-track,
.review-carrusel.pausado .review-track,
.review-carrusel.arrastrando .review-track{ animation-play-state:paused; }

.review-card{
  flex:none; width:300px;
  background:var(--blanco); border-radius:var(--radio-card);
  padding:var(--sp-5); box-shadow:var(--sombra-1);
  border:1px solid rgba(33,29,26,.06);
  display:flex; flex-direction:column; gap:var(--sp-3);
}
.review-nombre{ font-weight:700; }
.review-fecha{ font-size:var(--fs-xs); color:var(--texto-muted); }
.review-texto{ color:var(--texto-oscuro); font-size:var(--fs-sm); }
.review-vermas{
  background:none; border:none; padding:0; color:var(--rojo-onelux);
  font-weight:700; cursor:pointer; font-size:var(--fs-sm); text-align:left;
}
.review-respuesta{
  background:var(--crema-alta); border-radius:10px; padding:var(--sp-3) var(--sp-4);
  font-size:var(--fs-xs); margin-left:var(--sp-4);
}
.review-respuesta strong{ display:block; margin-bottom:2px; }
.link-google{
  display:inline-flex; align-items:center; gap:var(--sp-2); margin-top:var(--sp-6);
  text-decoration:none; font-weight:700; color:var(--rojo-onelux);
}
.link-google svg{ width:18px; height:18px; }

/* ================= FAQ ================= */
.faq-item{ border-bottom:1px solid rgba(33,29,26,.12); }
.faq-pregunta{
  width:100%; text-align:left; background:none; border:none; cursor:pointer;
  display:flex; justify-content:space-between; align-items:center; gap:var(--sp-3);
  padding:var(--sp-5) 0; font-family:var(--font-titulo); font-size:var(--fs-md); text-transform:none;
}
.faq-pregunta svg{ width:22px; height:22px; flex:none; transition:transform 200ms var(--ease); }
.faq-pregunta[aria-expanded="true"] svg{ transform:rotate(45deg); }
.faq-respuesta{
  max-height:0; overflow:hidden; transition:max-height 320ms var(--ease);
  color:var(--texto-muted);
}
.faq-respuesta-inner{ padding-bottom:var(--sp-5); }
.placeholder-dato{
  border:1px dashed var(--rojo-onelux); border-radius:8px; padding:var(--sp-2) var(--sp-3);
  font-size:var(--fs-xs); color:var(--rojo-onelux); display:inline-block;
}

/* ================= FORMULARIO ================= */
.form-wa{ display:grid; gap:var(--sp-5); }
.campo{ display:flex; flex-direction:column; gap:var(--sp-2); }
.campo label{ font-weight:700; font-size:var(--fs-sm); }
.campo input, .campo select, .campo textarea{
  font-family:var(--font-texto); font-size:var(--fs-base);
  padding:var(--sp-3) var(--sp-4); border-radius:8px;
  border:2px solid rgba(33,29,26,.18); background:var(--blanco); color:var(--texto-oscuro);
}
.campo input:focus, .campo select:focus, .campo textarea:focus{
  border-color:var(--acento); outline:none;
}
.campo textarea{ resize:vertical; min-height:110px; }
.campo-error{
  color:#A21F1F; font-size:var(--fs-xs); font-weight:700; min-height:1em;
}
.campo.invalido input, .campo.invalido select, .campo.invalido textarea{ border-color:#A21F1F; }
.form-nota{ font-size:var(--fs-xs); color:var(--texto-muted); }
.form-ok{
  background:var(--verde-pared); color:var(--negro-max); padding:var(--sp-4); border-radius:10px;
  font-weight:700; display:none;
}
.form-ok.visible{ display:block; }

/* ================= PLACEHOLDER FOTO ================= */
.ph-foto{
  border:2px dashed var(--texto-muted); border-radius:var(--radio-card);
  display:flex; align-items:center; justify-content:center; text-align:center;
  color:var(--texto-muted); font-size:var(--fs-sm); padding:var(--sp-5);
  background:repeating-linear-gradient(45deg, rgba(33,29,26,.03) 0 10px, transparent 10px 20px);
  width:100%; height:100%; min-height:220px;
}

/* ================= MAPA ================= */
.mapa-wrap{
  border-radius:var(--radio-card); overflow:clip; box-shadow:var(--sombra-1);
  border:1px solid rgba(33,29,26,.1);
}
.mapa-wrap iframe{ width:100%; height:340px; border:0; display:block; }

/* ================= FOOTER ================= */
.site-footer{
  background:var(--negro-max); color:var(--crema); padding:var(--sp-8) 0 var(--sp-6);
}
.footer-grid{
  display:grid; gap:var(--sp-6); grid-template-columns:1fr;
}
@media (min-width:800px){ .footer-grid{ grid-template-columns:1.3fr 1fr 1fr 1fr; } }
.site-footer h3{ font-size:var(--fs-md); color:var(--verde-pared); margin-bottom:var(--sp-3); }
.site-footer .logo{ color:var(--crema); margin-bottom:var(--sp-3); }
.site-footer ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:var(--sp-2); }
.site-footer a{ text-decoration:none; color:#D7CFC1; }
.site-footer a:hover{ color:var(--blanco); }
.site-footer address{ font-style:normal; color:#D7CFC1; }
.footer-bottom{
  border-top:1px solid rgba(246,239,227,.15); margin-top:var(--sp-7); padding-top:var(--sp-5);
  display:flex; flex-wrap:wrap; gap:var(--sp-3); justify-content:space-between;
  font-size:var(--fs-xs); color:#B7AE9E;
}
.footer-redes{ display:flex; gap:var(--sp-3); }
.footer-redes a{
  width:38px; height:38px; border-radius:50%; border:1px solid #4b453e;
  display:flex; align-items:center; justify-content:center;
}
.footer-redes svg{ width:18px; height:18px; }

/* ================= BOTÓN FLOTANTE WHATSAPP ================= */
.wa-flotante{
  position:fixed; right:var(--sp-4); bottom:var(--sp-4); z-index:70;
  width:58px; height:58px; border-radius:50%; background:var(--acento); color:var(--blanco);
  display:flex; align-items:center; justify-content:center; text-decoration:none;
  box-shadow:var(--sombra-2);
  transform:translateY(120px) scale(.6); opacity:0;
  transition:transform 320ms var(--ease), opacity 320ms var(--ease);
}
.wa-flotante.visible{ transform:translateY(0) scale(1); opacity:1; animation:pulso 2.6s ease-in-out infinite; }
.wa-flotante svg{ width:28px; height:28px; }
@keyframes pulso{
  0%,100%{ box-shadow:0 0 0 0 rgba(197,57,31,.45), var(--sombra-2); }
  50%{ box-shadow:0 0 0 12px rgba(197,57,31,0), var(--sombra-2); }
}
@media (min-width:900px){ .wa-flotante{ display:none; } }

/* ================= UTILIDADES ================= */
.text-center{ text-align:center; }
.mt-0{ margin-top:0; }
.mb-0{ margin-bottom:0; }
.stack{ display:flex; flex-direction:column; gap:var(--sp-4); }
.chips-fila{ display:flex; flex-wrap:wrap; gap:var(--sp-2); }
.chip-info{
  display:inline-flex; align-items:center; gap:6px;
  background:var(--crema-alta); border-radius:999px; padding:6px 14px; font-size:var(--fs-xs); font-weight:700;
}
.chip-info svg{ width:14px; height:14px; }
.badge-verde{ background:var(--verde-pared); color:var(--negro-max); }

hr.divisor{ border:none; border-top:1px solid rgba(33,29,26,.12); margin:var(--sp-7) 0; }