/* ============ TOKENS ============ */
:root{
  scroll-padding-top:calc(var(--alto-nav,64px) + var(--alto-cinta,52px) + 12px);
  --verde:#3FA832;          /* verde marca (de la lona) */
  --verde-vivo:#47BA3A;
  --verde-hondo:#1C5E17;
  --verde-tinta:#0E2E0B;
  --amarillo:#F5EE1E;       /* amarillo pizarra */
  --cobre:#B5702E;          /* el material estrella */
  --cobre-claro:#D98E45;

  --fondo:#F5F8F2;
  --papel:#FFFFFF;
  --papel-2:#EDF2E8;
  --tinta:#16200F;
  --tinta-2:#4C5A43;
  --tinta-3:#7C8A73;
  --linea:#DAE3D2;

  --oscuro:#101A0C;         /* suelo de la sección empresas */
  --oscuro-2:#18250F;
  --oscuro-linea:#2C3D22;
  --oscuro-tinta:#E7EFE1;
  --oscuro-tinta-2:#9EB093;

  --ok:#2E9E4F;
  --alerta:#D9821F;
  --stop:#C4402F;

  --r-s:6px; --r-m:12px; --r-l:20px;
  --sombra:0 1px 2px rgba(20,40,12,.06),0 8px 24px -12px rgba(20,40,12,.18);
  --sombra-alta:0 2px 4px rgba(20,40,12,.08),0 20px 50px -20px rgba(20,40,12,.35);

  --display:"Archivo","Arial Narrow",Helvetica,sans-serif;
  --texto:"Barlow","Helvetica Neue",Arial,sans-serif;
  --ancho:1180px;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --fondo:#0C120A; --papel:#141D10; --papel-2:#1B2616; --tinta:#E8F0E3;
    --tinta-2:#A9B9A1; --tinta-3:#7D8E76; --linea:#2A3823;
    --oscuro:#070C05; --oscuro-2:#101A0C; --oscuro-linea:#28371F;
    --verde:#55C946; --verde-vivo:#63D653; --verde-hondo:#2C8423;
    --cobre:#D08B46; --cobre-claro:#E5A863;
    --sombra:0 1px 2px rgba(0,0,0,.4),0 8px 24px -12px rgba(0,0,0,.7);
    --sombra-alta:0 2px 4px rgba(0,0,0,.5),0 20px 50px -20px rgba(0,0,0,.9);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --fondo:#0C120A; --papel:#141D10; --papel-2:#1B2616; --tinta:#E8F0E3;
  --tinta-2:#A9B9A1; --tinta-3:#7D8E76; --linea:#2A3823;
  --oscuro:#070C05; --oscuro-2:#101A0C; --oscuro-linea:#28371F;
  --verde:#55C946; --verde-vivo:#63D653; --verde-hondo:#2C8423;
  --cobre:#D08B46; --cobre-claro:#E5A863;
  --sombra:0 1px 2px rgba(0,0,0,.4),0 8px 24px -12px rgba(0,0,0,.7);
  --sombra-alta:0 2px 4px rgba(0,0,0,.5),0 20px 50px -20px rgba(0,0,0,.9);
  color-scheme:dark;
}

/* ============ BASE ============ */
*{box-sizing:border-box}
body{margin:0;background:var(--fondo);color:var(--tinta);font-family:var(--texto);
  font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--display);margin:0;text-wrap:balance;letter-spacing:-.01em}
h1{font-variation-settings:"wdth" 80,"wght" 900;font-size:clamp(2.05rem,4.7vw,3.7rem);
  line-height:.96;text-transform:uppercase}
h2{font-variation-settings:"wdth" 84,"wght" 850;font-size:clamp(1.8rem,4.2vw,3rem);line-height:1;text-transform:uppercase}
h3{font-variation-settings:"wdth" 88,"wght" 750;font-size:clamp(1.15rem,2.2vw,1.45rem);line-height:1.15}
h4{font-variation-settings:"wdth" 92,"wght" 700;font-size:1rem}
p{margin:0}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--cobre);outline-offset:2px;border-radius:4px}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

.env{width:100%;max-width:var(--ancho);margin-inline:auto;padding-inline:20px}
.seccion{padding-block:clamp(52px,7vw,92px)}
.eyebrow{font-family:var(--display);font-variation-settings:"wdth" 92,"wght" 700;
  text-transform:uppercase;letter-spacing:.14em;font-size:.76rem;color:var(--verde-hondo)}
.plomo{color:var(--tinta-2);max-width:62ch}
.num{font-variant-numeric:tabular-nums}

/* ============ NAV ============ */
.nav{position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--fondo) 88%,transparent);
  backdrop-filter:blur(14px);border-bottom:1px solid var(--linea)}
.nav-in{display:flex;align-items:center;gap:18px;min-height:64px}
.nav img{height:34px;width:auto}
.nav-links{display:flex;gap:4px;margin-left:auto;flex-wrap:wrap}
.nav-links a{font-size:.9rem;font-weight:600;text-decoration:none;padding:7px 11px;border-radius:var(--r-s);color:var(--tinta-2)}
.nav-links a:hover{background:var(--papel-2);color:var(--tinta)}
@media (max-width:900px){.nav-links{display:none}}
/* El botón de WhatsApp: nunca se encoge (por eso se cortaba el número) y
   es la acción más grande de la barra, porque es la que queremos que toquen. */
.wa{flex:none;display:inline-flex;align-items:center;gap:11px;
  background:linear-gradient(180deg,#25D366 0%,#12A150 100%);color:#fff;
  text-decoration:none;padding:11px 22px 12px 18px;border-radius:999px;
  box-shadow:0 3px 0 #0B7038,0 10px 22px -10px rgba(18,161,80,.8);
  white-space:nowrap;position:relative;transition:transform .14s ease,box-shadow .14s ease}
.wa::after{content:"";position:absolute;inset:-4px;border-radius:999px;
  border:2px solid #25D366;opacity:.55;animation:llamar 2.6s ease-out infinite;pointer-events:none}
@keyframes llamar{0%{transform:scale(1);opacity:.5}70%{transform:scale(1.13);opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.wa::after{animation:none;opacity:.35}}
.wa:hover{transform:translateY(-1px);box-shadow:0 4px 0 #0B7038,0 14px 26px -10px rgba(18,161,80,.9)}
.wa:active{transform:translateY(2px);box-shadow:0 1px 0 #0B7038}
.wa svg{width:26px;height:26px;fill:currentColor;flex:none}
.wa-txt{display:block}
.wa b{display:block;font-family:var(--display);font-variation-settings:"wdth" 88,"wght" 850;
  font-size:1.12rem;line-height:1.05;letter-spacing:.01em;font-variant-numeric:tabular-nums}
.wa span{display:block;font-size:.68rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.14em;opacity:.92;line-height:1.1}

/* ============ HERO ============ */
.hero{position:relative;background:var(--verde);color:#fff;overflow:hidden;isolation:isolate}
.hero{background:linear-gradient(148deg,#5AC94A 0%,var(--verde) 38%,#2F8C26 100%)}
/* la trama, grande y muy tenue: textura, no ruido */
.hero::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.06;
  background-image:var(--patron);background-size:230px 230px}
/* profundidad: luz arriba a la izquierda, sombra abajo, y un halo cobre
   detrás del tablero para que se sienta iluminado */
.hero::after{content:"";position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(70% 55% at 12% 0%,rgba(255,255,255,.22),transparent 62%),
    radial-gradient(48% 46% at 76% 42%,rgba(214,132,52,.3),transparent 70%),
    linear-gradient(180deg,transparent 48%,rgba(8,44,5,.42))}
.hero-in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,4vw,56px);
  align-items:center;padding-block:clamp(40px,6vw,76px)}
@media (max-width:860px){.hero-in{grid-template-columns:1fr;padding-block:36px}}
.hero-logo{background:#fff;border-radius:16px;padding:14px 20px;width:fit-content;
  box-shadow:0 10px 30px -10px rgba(0,0,0,.4)}
.hero-logo img{height:clamp(52px,7vw,74px);width:auto}
.hero h1{margin-top:22px;text-shadow:0 3px 0 rgba(12,60,8,.28)}
.hero h1 em{font-style:normal;color:var(--amarillo)}
.hero-sub{margin-top:16px;font-size:clamp(1.02rem,1.8vw,1.22rem);max-width:46ch;color:#EAFBE6;font-weight:500}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.btn-amarillo{display:inline-flex;align-items:center;gap:9px;background:var(--amarillo);color:#17300F;
  text-decoration:none;font-family:var(--display);font-variation-settings:"wdth" 92,"wght" 800;
  text-transform:uppercase;letter-spacing:.03em;padding:14px 22px;border-radius:999px;
  box-shadow:0 3px 0 #B9B300;font-size:1rem;border:0;cursor:pointer}
.btn-amarillo:hover{filter:brightness(1.06)}
.btn-linea{display:inline-flex;align-items:center;gap:9px;background:rgba(255,255,255,.12);
  color:#fff;text-decoration:none;font-weight:700;padding:14px 22px;border-radius:999px;
  border:2px solid rgba(255,255,255,.55);font-size:.98rem;cursor:pointer}
.btn-linea:hover{background:rgba(255,255,255,.22)}
.hero-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}
.chip{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.3);padding:6px 12px;border-radius:999px;font-size:.84rem;font-weight:600}
.chip .punto{width:8px;height:8px;border-radius:50%;background:var(--amarillo);flex:none}
.chip.vivo .punto{background:#7DFF6B;box-shadow:0 0 0 0 rgba(125,255,107,.7);animation:latido 2.2s infinite}
@keyframes latido{70%{box-shadow:0 0 0 9px rgba(125,255,107,0)}100%{box-shadow:0 0 0 0 rgba(125,255,107,0)}}

/* ============ PIZARRA DE PRECIOS ============ */
.pizarra{background:var(--verde-tinta);border-radius:var(--r-l);padding:clamp(18px,2.6vw,26px);
  box-shadow:var(--sombra-alta);border:1px solid rgba(255,255,255,.1)}
.pizarra-top{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding-bottom:14px;border-bottom:2px dashed rgba(245,238,30,.35)}
.pizarra-top h3{color:var(--amarillo);font-variation-settings:"wdth" 78,"wght" 900;
  font-size:clamp(1.5rem,3.4vw,2.1rem);text-transform:uppercase;letter-spacing:.01em}
.pizarra-sello{font-size:.76rem;color:#A9D79F;font-weight:600;text-align:right}
.pizarra-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.pizarra-lista li{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;
  padding:11px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.pizarra-lista li:last-child{border-bottom:0}
.pz-nombre{color:#fff;font-weight:600;font-size:.98rem;line-height:1.25}
.pz-nota{display:block;color:#8FBE85;font-size:.76rem;font-weight:500}
.pz-precio{font-family:var(--display);font-variation-settings:"wdth" 80,"wght" 900;
  color:var(--amarillo);font-size:clamp(1.25rem,3vw,1.7rem);white-space:nowrap;
  font-variant-numeric:tabular-nums;line-height:1}
.pz-precio small{font-size:.5em;font-variation-settings:"wdth" 92,"wght" 700;color:#B7DCAE;margin-left:2px}
.pizarra-pie{margin-top:16px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;
  font-size:.8rem;color:#A9D79F}
.pizarra-pie a{color:var(--amarillo);font-weight:700}

/* ============ TABLA COMPLETA ============ */
.filtros{display:flex;gap:8px;flex-wrap:wrap;margin-block:22px 20px}
.filtro{border:1.5px solid var(--linea);background:var(--papel);color:var(--tinta-2);
  padding:8px 15px;border-radius:999px;font-weight:600;font-size:.88rem;cursor:pointer;transition:.15s}
.filtro:hover{border-color:var(--verde)}
.filtro[aria-pressed="true"]{background:var(--verde);border-color:var(--verde);color:#fff}
.precios-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}
.mat{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r-m);
  padding:15px 17px;display:flex;justify-content:space-between;gap:12px;align-items:center;
  border-left:4px solid var(--c,var(--verde))}
.mat h4{font-size:1rem;line-height:1.2}
.mat .sub{color:var(--tinta-3);font-size:.78rem;margin-top:3px}
.mat .val{font-family:var(--display);font-variation-settings:"wdth" 84,"wght" 850;
  font-size:1.35rem;color:var(--tinta);white-space:nowrap;font-variant-numeric:tabular-nums;text-align:right;line-height:1.05}
.mat .val small{display:block;font-size:.5em;color:var(--tinta-3);font-variation-settings:"wdth" 95,"wght" 600}
.tend{font-size:.72rem;font-weight:700;padding:2px 7px;border-radius:999px;display:inline-block;margin-top:4px}
.tend.sube{background:color-mix(in srgb,var(--ok) 16%,transparent);color:var(--ok)}
.tend.baja{background:color-mix(in srgb,var(--stop) 16%,transparent);color:var(--stop)}
.tend.igual{background:var(--papel-2);color:var(--tinta-3)}

/* ============ CALCULADORA ============ */
.calc{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r-l);
  padding:clamp(18px,3vw,30px);box-shadow:var(--sombra)}
.calc-fila{display:grid;grid-template-columns:minmax(0,1fr) 116px 108px 40px;gap:10px;align-items:center;margin-bottom:10px}
@media (max-width:640px){
  .calc-fila{grid-template-columns:minmax(0,1fr) auto 42px;
    grid-template-areas:"m m m" "k s r";row-gap:8px;margin-bottom:16px}
  .calc-fila select{grid-area:m}
  .calc-fila input{grid-area:k}
  .calc-fila .sub-t{grid-area:s;padding-inline:4px}
  .calc-fila button{grid-area:r}}
.calc select,.calc input{width:100%;padding:11px 12px;border:1.5px solid var(--linea);
  border-radius:var(--r-s);background:var(--fondo);font-size:.95rem}
.calc input{font-variant-numeric:tabular-nums;text-align:right;font-weight:600}
.calc select:focus,.calc input:focus{border-color:var(--verde)}
.sub-t{font-family:var(--display);font-variation-settings:"wdth" 88,"wght" 800;text-align:right;
  font-variant-numeric:tabular-nums;font-size:1.05rem;color:var(--cobre)}
.quitar{background:none;border:1.5px solid var(--linea);border-radius:var(--r-s);color:var(--tinta-3);
  width:40px;height:42px;cursor:pointer;font-size:1.2rem;line-height:1}
.quitar:hover{border-color:var(--stop);color:var(--stop)}
.calc-total{margin-top:18px;padding-top:18px;border-top:2px solid var(--linea);
  display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap}
.calc-total .rot{font-family:var(--display);font-variation-settings:"wdth" 88,"wght" 700;
  text-transform:uppercase;letter-spacing:.1em;font-size:.82rem;color:var(--tinta-3)}
.calc-total .monto{font-family:var(--display);font-variation-settings:"wdth" 78,"wght" 900;
  font-size:clamp(2.2rem,7vw,3.6rem);line-height:.9;color:var(--verde-hondo);font-variant-numeric:tabular-nums}
.calc-acc{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.btn-verde{display:inline-flex;align-items:center;gap:9px;background:var(--verde);color:#fff;border:0;
  text-decoration:none;font-weight:700;padding:13px 20px;border-radius:999px;cursor:pointer;
  box-shadow:0 2px 0 var(--verde-hondo);font-size:.96rem}
.btn-verde:hover{background:var(--verde-vivo)}
.btn-fantasma{display:inline-flex;align-items:center;gap:9px;background:transparent;color:var(--tinta-2);
  border:1.5px solid var(--linea);text-decoration:none;font-weight:600;padding:13px 20px;
  border-radius:999px;cursor:pointer;font-size:.96rem}
.btn-fantasma:hover{border-color:var(--verde);color:var(--tinta)}

/* ============ TARJETAS GENERICAS ============ */
.rejilla{display:grid;gap:14px}
.r3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.r2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.r4{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.tarjeta{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r-m);padding:22px}
.tarjeta h3{margin-bottom:8px}
.tarjeta p{color:var(--tinta-2);font-size:.95rem}
.ico{width:44px;height:44px;border-radius:11px;display:grid;place-items:center;margin-bottom:14px;
  background:color-mix(in srgb,var(--verde) 14%,transparent);color:var(--verde-hondo)}
.ico svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* pasos numerados: el orden importa de verdad */
.pasos{counter-reset:p;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(215px,1fr))}
.paso{position:relative;background:var(--papel);border:1px solid var(--linea);border-radius:var(--r-m);padding:22px 20px 20px}
.paso::before{counter-increment:p;content:counter(p);position:absolute;top:-14px;left:20px;
  width:30px;height:30px;border-radius:50%;background:var(--verde-tinta);color:var(--amarillo);
  display:grid;place-items:center;font-family:var(--display);font-variation-settings:"wdth" 88,"wght" 800;font-size:.9rem}
.paso h4{margin-bottom:6px;font-size:1.02rem}
.paso p{color:var(--tinta-2);font-size:.9rem}

/* listas si/no */
.listas{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:14px}
.lista-caja{border-radius:var(--r-m);padding:22px;border:1px solid var(--linea);background:var(--papel)}
.lista-caja.si{border-top:5px solid var(--verde)}
.lista-caja.no{border-top:5px solid var(--stop)}
.lista-caja ul{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:7px}
.lista-caja li{display:flex;gap:9px;font-size:.93rem;color:var(--tinta-2);align-items:flex-start}
.lista-caja li b{color:var(--tinta);font-weight:600}
.marca{flex:none;width:19px;height:19px;border-radius:50%;display:grid;place-items:center;
  font-size:.7rem;font-weight:800;margin-top:2px;color:#fff}
.si .marca{background:var(--verde)}
.no .marca{background:var(--stop)}
/* ============ EMPRESAS (suelo oscuro) ============ */
.empresas{background:var(--oscuro);color:var(--oscuro-tinta);position:relative;overflow:hidden}
.empresas::before{content:"";position:absolute;inset:0;opacity:.05;
  background-image:var(--patron);background-size:150px 150px;pointer-events:none}
.empresas .env{position:relative}
.empresas .eyebrow{color:var(--verde-vivo)}
.empresas h2{color:#fff}
.empresas .plomo{color:var(--oscuro-tinta-2)}
.empresas .tarjeta{background:var(--oscuro-2);border-color:var(--oscuro-linea)}
.empresas .tarjeta h3{color:#fff}
.empresas .tarjeta p{color:var(--oscuro-tinta-2)}
.empresas .ico{background:rgba(71,186,58,.16);color:var(--verde-vivo)}
.acred{display:grid;grid-template-columns:auto minmax(0,1fr);gap:22px;align-items:center;
  background:linear-gradient(120deg,rgba(71,186,58,.16),rgba(71,186,58,.04));
  border:1px solid rgba(71,186,58,.4);border-radius:var(--r-l);padding:clamp(20px,3vw,30px);margin-bottom:26px}
@media (max-width:700px){.acred{grid-template-columns:1fr;gap:16px}}
.sello{width:92px;height:92px;border-radius:50%;border:3px solid var(--verde-vivo);
  display:grid;place-items:center;background:rgba(71,186,58,.12);flex:none}
.sello svg{width:46px;height:46px;stroke:var(--verde-vivo);fill:none;stroke-width:1.8}
.acred h3{color:#fff;font-size:clamp(1.2rem,2.5vw,1.6rem)}
.acred p{color:var(--oscuro-tinta-2);font-size:.95rem;margin-top:7px}
.codigo{display:inline-flex;align-items:center;gap:9px;margin-top:13px;background:var(--oscuro);
  border:1px dashed rgba(71,186,58,.5);border-radius:var(--r-s);padding:8px 13px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.83rem;color:var(--verde-vivo);
  word-break:break-all}
.leyes{display:flex;gap:9px;flex-wrap:wrap;margin-top:15px}
.ley{font-size:.8rem;background:rgba(255,255,255,.06);border:1px solid var(--oscuro-linea);
  border-radius:var(--r-s);padding:6px 11px;color:var(--oscuro-tinta-2)}
.ley b{color:var(--oscuro-tinta);font-weight:700}
.emp-cta{margin-top:28px;display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.emp-cta .correo{color:var(--verde-vivo);font-weight:700;text-decoration:none;font-size:.96rem}

/* ============ IMPACTO ============ */

/* ============ CROQUIS / COMO LLEGAR ============ */
/* --- mapa incrustado y botones grandes para llegar --- */
.mapa-caja{position:relative;border-radius:var(--r-l);overflow:hidden;border:1px solid var(--linea);
  background:var(--papel-2);box-shadow:var(--sombra);aspect-ratio:16/7;max-height:440px;min-height:300px}
.mapa-caja iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;filter:saturate(.92)}
.mapa-falla{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;
  gap:10px;text-align:center;padding:26px;color:var(--tinta-2);background:var(--papel-2)}
.mapa-falla[hidden]{display:none}
.mapa-falla svg{width:42px;height:42px;color:var(--verde)}
.mapa-falla p{font-size:1rem;line-height:1.45;max-width:34ch}
.mapa-falla b{color:var(--tinta);font-family:var(--display);
  font-variation-settings:"wdth" 88,"wght" 800;font-size:1.15rem}
.mapa-falla-nota{font-size:.84rem;color:var(--tinta-3)}
@media (max-width:640px){.mapa-caja{aspect-ratio:4/3;min-height:0;max-height:none}}

.mapas-grandes{display:grid;gap:12px;margin-top:16px;
  grid-template-columns:repeat(auto-fit,minmax(248px,1fr))}
.mapa-gr{display:flex;align-items:center;gap:14px;text-decoration:none;
  background:var(--papel);border:2px solid var(--linea);border-radius:var(--r-m);
  padding:18px 20px;color:var(--tinta);transition:transform .16s,border-color .16s,box-shadow .16s;
  box-shadow:var(--sombra);min-height:86px}
.mapa-gr:hover{transform:translateY(-2px);box-shadow:var(--sombra-alta)}
.mapa-gr svg{width:33px;height:33px;flex:none}
.mapa-gr .mg-txt{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.mapa-gr .mg-txt b{font-family:var(--display);font-variation-settings:"wdth" 88,"wght" 800;
  font-size:1.12rem;line-height:1.1}
.mapa-gr .mg-txt small{font-size:.82rem;color:var(--tinta-3);line-height:1.25}
.mg-flecha{font-size:1.3rem;color:var(--tinta-3);flex:none;transition:transform .16s}
.mapa-gr:hover .mg-flecha{transform:translateX(4px)}
.mg-google{border-color:color-mix(in srgb,#1A73E8 45%,var(--linea))}
.mg-google svg{color:#1A73E8} .mg-google:hover{border-color:#1A73E8}
.mg-waze{border-color:color-mix(in srgb,#05C8F7 45%,var(--linea))}
.mg-waze svg{color:#05A8D6} .mg-waze:hover{border-color:#05C8F7}
.mg-apple{border-color:color-mix(in srgb,var(--tinta-3) 45%,var(--linea))}
.mg-apple svg{color:var(--tinta-2)} .mg-apple:hover{border-color:var(--tinta-2)}
.mg-wa{border-color:color-mix(in srgb,#25D366 45%,var(--linea))}
.mg-wa svg{color:#12A150} .mg-wa:hover{border-color:#25D366}

.llegar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(16px,2.4vw,26px);align-items:start}
@media (max-width:880px){.llegar{grid-template-columns:1fr}}
.horario{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r-m);padding:20px;margin-top:16px}
.horario table{width:100%;border-collapse:collapse;font-size:.93rem}
.horario td{padding:7px 0;border-bottom:1px solid var(--linea)}
.horario tr:last-child td{border-bottom:0}
.horario td:last-child{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.horario tr.hoy td{color:var(--verde-hondo);font-weight:700}
.estado{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:.9rem;margin-bottom:12px}
.estado .punto{width:9px;height:9px;border-radius:50%;flex:none}
.estado.abierto{color:var(--ok)}.estado.abierto .punto{background:var(--ok)}
.estado.cerrado{color:var(--stop)}.estado.cerrado .punto{background:var(--stop)}

/* ============ RESENAS ============ */
.resenas-caja{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r-l);
  padding:clamp(22px,3.5vw,38px);text-align:center;box-shadow:var(--sombra)}
.estrellas{display:flex;gap:4px;justify-content:center;margin-bottom:14px}
.estrellas svg{width:26px;height:26px;fill:var(--amarillo);stroke:#C9C200;stroke-width:1}
#lista-resenas{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin-bottom:22px;text-align:left}
.resena{background:var(--papel-2);border:1px solid var(--linea);border-radius:var(--r-m);padding:18px}
.resena .txt{font-size:.94rem;color:var(--tinta-2)}
.resena .quien{margin-top:10px;font-weight:700;font-size:.86rem}
.vacio{border:2px dashed var(--linea);border-radius:var(--r-m);padding:26px;color:var(--tinta-3);
  font-size:.93rem;max-width:56ch;margin-inline:auto}

/* ============ REELS ============ */
/* con pocos reels, tarjetas de tamaño sano en vez de estiradas */
.reels{display:flex;flex-wrap:wrap;gap:13px}
.reels:not(:empty){margin-bottom:26px}
.reel{flex:1 1 185px;max-width:235px}
.reel-red{position:absolute;top:11px;right:11px;z-index:2;width:30px;height:30px;
  border-radius:9px;background:rgba(9,32,6,.72);display:grid;place-items:center;
  border:1px solid rgba(255,255,255,.22)}
.reel-red svg{width:16px;height:16px;fill:#fff}
.reel{position:relative;aspect-ratio:9/16;border-radius:var(--r-m);overflow:hidden;text-decoration:none;
  background:linear-gradient(160deg,var(--verde-hondo),var(--verde-tinta));
  border:1px solid var(--linea);display:flex;flex-direction:column;justify-content:flex-end;
  padding:14px;color:#fff;transition:transform .18s}
.reel::before{content:"";position:absolute;inset:0;opacity:.16;background-image:var(--patron);background-size:90px 90px}
.reel:hover{transform:translateY(-4px)}
.reel .play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;
  border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center}
.reel .play svg{width:20px;height:20px;fill:var(--verde-tinta);margin-left:3px}
.reel .tit{position:relative;font-weight:700;font-size:.9rem;line-height:1.25;text-shadow:0 1px 4px rgba(0,0,0,.5)}
.reel .red{position:relative;font-size:.74rem;opacity:.85;margin-top:4px;text-transform:uppercase;letter-spacing:.08em;font-weight:600}

/* ============ JUEGO ============ */
.juego-caja{background:linear-gradient(180deg,#16240F 0%,#0C1608 100%);border-radius:var(--r-l);
  padding:clamp(14px,2.4vw,20px);box-shadow:var(--sombra-alta);position:relative}

.rpg-hud{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap;margin-bottom:14px}
.quest{flex:1 1 260px;min-width:0}
.quest-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:6px}
.quest-rot{color:#9FCF95;font-size:.76rem;text-transform:uppercase;letter-spacing:.14em;font-weight:700}
.quest-rot b{color:#fff;font-size:.9rem;margin-left:4px}
.quest-cifras{font-size:.82rem;color:#9FCF95;white-space:nowrap}
.quest-cifras b{font-family:var(--display);font-variation-settings:"wdth" 85,"wght" 800;
  color:var(--amarillo);font-size:1.18rem;font-variant-numeric:tabular-nums}
.quest-cifras i{font-style:normal;opacity:.7;margin:0 3px}
.quest-barra{height:12px;border-radius:999px;background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.16);overflow:hidden}
.quest-barra span{display:block;height:100%;width:0;border-radius:999px;
  background:linear-gradient(90deg,var(--verde-vivo),var(--amarillo));
  transition:width .35s cubic-bezier(.22,1,.36,1)}
.quest-marcadores{display:flex;gap:9px;flex-wrap:wrap}
.hud-item{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:var(--r-s);
  padding:7px 13px;font-size:.78rem;font-weight:600;color:#fff;white-space:nowrap}
.hud-item b{font-family:var(--display);font-variation-settings:"wdth" 85,"wght" 800;
  color:var(--amarillo);font-size:1.02rem;font-variant-numeric:tabular-nums;margin-left:5px}

.hud-son{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);
  border-radius:var(--r-s);padding:6px 11px;font-size:1.05rem;line-height:1.1;cursor:pointer;
  color:#fff;flex:none}
.hud-son:hover{background:rgba(255,255,255,.2)}
.hud-son[aria-pressed="true"]{opacity:.55}

.juego-tablero{position:relative;max-width:576px;margin:0 auto}
#lienzo{width:100%;height:auto;display:block;border-radius:var(--r-m);background:#14200F;
  touch-action:none;image-rendering:pixelated;cursor:pointer;
  box-shadow:0 10px 30px -14px rgba(0,0,0,.9)}

.juego-overlay{position:absolute;inset:0;display:grid;place-items:center;background:rgba(9,22,6,.9);
  backdrop-filter:blur(3px);border-radius:var(--r-m);text-align:center;padding:22px;z-index:5}
.juego-overlay[hidden]{display:none!important}
.juego-overlay h3{color:var(--amarillo);font-size:clamp(1.3rem,4vw,2rem);text-transform:uppercase;
  font-variation-settings:"wdth" 80,"wght" 900;line-height:1.05}
.juego-overlay p{color:#C6E5BE;margin-top:10px;font-size:.92rem;max-width:40ch;line-height:1.5}
.juego-overlay p b{color:#fff}
#j-extra:empty{display:none}

.juego-leyenda{display:flex;gap:7px 15px;flex-wrap:wrap;align-items:center;justify-content:center;
  margin-top:14px;font-size:.76rem;color:#9FCF95}
.jl{display:inline-flex;align-items:center;gap:6px}
.jl-p{width:11px;height:11px;border-radius:3px;display:block;box-shadow:inset 0 -2px 0 rgba(0,0,0,.35)}
.jl-cobre{background:#B5702E} .jl-bronce{background:#C9A227} .jl-aluminio{background:#AEB8C2}
.jl-tarjeta{background:#1E7A3C} .jl-bateria{background:#2B4470} .jl-cable{background:#C4402F}
.jl-ayuda{opacity:.75;font-style:italic;flex-basis:100%;justify-content:center;text-align:center}
@media (min-width:620px){.jl-ayuda{flex-basis:auto;margin-left:6px;border-left:1px solid rgba(255,255,255,.2);padding-left:15px}}
@media (max-width:520px){
  .rpg-hud{gap:10px}
  .quest-marcadores{width:100%;justify-content:space-between;gap:6px}
  .hud-item{flex:1 1 0;min-width:0;text-align:center;padding:6px 8px;font-size:.7rem}
  .hud-son{padding:6px 10px;font-size:1rem}
  .hud-item b{display:block;margin:2px 0 0;font-size:.98rem}
  .juego-leyenda{gap:6px 11px;font-size:.72rem}
}

/* ============ FAQ ============ */
details.faq{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r-m);
  padding:0;margin-bottom:9px;overflow:hidden}
details.faq summary{padding:17px 20px;cursor:pointer;font-weight:600;font-size:1rem;list-style:none;
  display:flex;justify-content:space-between;gap:14px;align-items:center}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::after{content:"+";font-family:var(--display);font-size:1.4rem;color:var(--verde);flex:none;line-height:1}
details.faq[open] summary::after{content:"\2212"}
details.faq p{padding:0 20px 18px;color:var(--tinta-2);font-size:.95rem;max-width:70ch}

/* ============ PIE ============ */
.pie{background:var(--oscuro);color:var(--oscuro-tinta-2);padding-block:52px 28px;font-size:.92rem}
.pie-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:30px}
.pie h4{color:#fff;margin-bottom:12px;font-size:.84rem;text-transform:uppercase;letter-spacing:.13em;
  font-variation-settings:"wdth" 92,"wght" 700}
.pie a{color:var(--oscuro-tinta-2);text-decoration:none;display:block;padding:4px 0}
.pie a:hover{color:var(--verde-vivo)}
.pie-logo{background:#fff;border-radius:12px;padding:10px 14px;width:fit-content;margin-bottom:14px}
.pie-logo img{height:38px;width:auto}
.redes{display:flex;gap:9px;margin-top:14px;flex-wrap:wrap}
.redes a{width:38px;height:38px;border-radius:10px;background:rgba(255,255,255,.07);
  border:1px solid var(--oscuro-linea);display:grid;place-items:center;padding:0}
.redes a:hover{background:var(--verde);border-color:var(--verde)}
.redes svg{width:18px;height:18px;fill:currentColor}
.pie-abajo{border-top:1px solid var(--oscuro-linea);margin-top:34px;padding-top:20px;
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:.82rem}

/* boton flotante whatsapp */
.wa-flota{position:fixed;right:16px;bottom:16px;z-index:70;width:56px;height:56px;border-radius:50%;
  background:#25D366;display:grid;place-items:center;box-shadow:0 8px 24px -6px rgba(0,0,0,.45);text-decoration:none}
.wa-flota svg{width:29px;height:29px;fill:#fff}
.wa-flota:hover{transform:scale(1.06)}
:root{--patron:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='128' height='128' viewBox='0 0 128 128'><g transform='translate%2864,58%29' fill='%23ffffff'><g transform='rotate%280%29'><path d='M-30 20 L14 20 L14 10 L38 26 L14 42 L14 32 L-30 32 Z'/></g><g transform='rotate%28120%29'><path d='M-30 20 L14 20 L14 10 L38 26 L14 42 L14 32 L-30 32 Z'/></g><g transform='rotate%28240%29'><path d='M-30 20 L14 20 L14 10 L38 26 L14 42 L14 32 L-30 32 Z'/></g></g></svg>")}
/* ==========================================================================
   MESA DE PRECIOS — tablero tipo terminal de mercado
   ========================================================================== */
:root{
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --terminal:#0A1207;
  --terminal-2:#0F1B0B;
  --terminal-linea:#24361C;
  --terminal-tinta:#D6E7CE;
  --terminal-tenue:#7C9670;
  --sube:#4ADE6A;
  --baja:#FF6B5B;
}

/* --- cinta corredora --- */
/* La cinta queda pegada bajo el menú mientras se baja por la página, para que
   el precio esté siempre a la vista. En el juego se retrae: ahí estorba. */
.cinta{background:var(--terminal);border-block:1px solid var(--terminal-linea);
  overflow:hidden;position:sticky;top:var(--alto-nav,64px);z-index:55;padding-block:14px;
  transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .25s}
.cinta-oculta{transform:translateY(-102%);opacity:0;pointer-events:none}
@media (prefers-reduced-motion:reduce){.cinta{transition:none}}
.cinta::before,.cinta::after{content:"";position:absolute;top:0;bottom:0;width:70px;z-index:2;pointer-events:none}
.cinta::before{left:0;background:linear-gradient(90deg,var(--terminal),transparent)}
.cinta::after{right:0;background:linear-gradient(270deg,var(--terminal),transparent)}
.cinta-pista{display:flex;width:max-content;animation:correr 66s linear infinite}
.cinta:hover .cinta-pista{animation-play-state:paused}
@keyframes correr{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.cinta-item{display:inline-flex;align-items:baseline;gap:12px;padding-inline:26px;
  font-family:var(--mono);font-size:1.02rem;white-space:nowrap;
  border-right:1px solid var(--terminal-linea)}
.cinta-sim{color:var(--terminal-tinta);font-weight:600;letter-spacing:.06em}
.cinta-val{color:#fff;font-weight:600;font-size:1.1rem;font-variant-numeric:tabular-nums}
.cinta-d{font-weight:600;font-variant-numeric:tabular-nums}
.cinta-d.sube{color:var(--sube)}.cinta-d.baja{color:var(--baja)}.cinta-d.igual{color:var(--terminal-tenue)}
@media (prefers-reduced-motion:reduce){
  .cinta-pista{animation:none;width:100%;flex-wrap:wrap;justify-content:center}
  .cinta-item:nth-child(n+13){display:none}
}

/* --- tablero --- */
.mesa{background:var(--terminal);border:1px solid var(--terminal-linea);border-radius:var(--r-l);
  overflow:hidden;box-shadow:0 2px 4px rgba(0,0,0,.18),0 30px 60px -24px rgba(4,26,2,.7)}
.hero .mesa{box-shadow:0 2px 4px rgba(0,0,0,.2),0 40px 70px -26px rgba(4,26,2,.78),
  0 0 0 1px rgba(245,238,30,.14)}
.mesa-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:14px 18px;border-bottom:1px solid var(--terminal-linea);background:var(--terminal-2)}
.mesa-top h3{color:#fff;font-variation-settings:"wdth" 84,"wght" 850;font-size:1.05rem;
  text-transform:uppercase;letter-spacing:.06em;margin-right:auto}
.mercado{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.74rem;
  font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:5px 11px;border-radius:999px;
  border:1px solid currentColor}
.mercado.abierto{color:var(--sube);background:rgba(74,222,106,.1)}
.mercado.cerrado{color:var(--terminal-tenue);background:rgba(124,150,112,.1)}
.mercado .led{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.mercado.abierto .led{animation:pulso 1.9s ease-in-out infinite}
@keyframes pulso{0%,100%{opacity:1}50%{opacity:.25}}
.mesa-reloj{font-family:var(--mono);font-size:.72rem;color:var(--terminal-tenue);letter-spacing:.04em;
  font-variant-numeric:tabular-nums}
.muestra{font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;color:#0A1207;background:var(--amarillo);
  padding:3px 8px;border-radius:3px;font-weight:700}

.mesa-scroll{overflow-x:auto}
table.tablero{width:100%;border-collapse:collapse;font-family:var(--mono);min-width:560px}
table.tablero th{font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--terminal-tenue);
  font-weight:600;text-align:right;padding:10px 14px;border-bottom:1px solid var(--terminal-linea);white-space:nowrap}
table.tablero th:first-child,table.tablero th:nth-child(2){text-align:left}
table.tablero td{padding:11px 14px;border-bottom:1px solid rgba(36,54,28,.6);text-align:right;
  font-variant-numeric:tabular-nums;font-size:.9rem;white-space:nowrap}
table.tablero tr:last-child td{border-bottom:0}
table.tablero tbody tr:hover{background:rgba(74,222,106,.05)}
.t-sim{text-align:left!important;color:var(--sube);font-weight:600;letter-spacing:.05em;font-size:.8rem}
.t-nom{text-align:left!important;color:var(--terminal-tinta);font-family:var(--texto);font-size:.92rem;
  font-weight:500;white-space:normal;min-width:180px}
.t-nom small{display:block;color:var(--terminal-tenue);font-size:.76rem}
.t-ult{color:#fff;font-weight:600;font-size:1.02rem}
.t-cam.sube,.t-pct.sube{color:var(--sube)}
.t-cam.baja,.t-pct.baja{color:var(--baja)}
.t-cam.igual,.t-pct.igual{color:var(--terminal-tenue)}
.t-campana{background:none;border:1px solid var(--terminal-linea);border-radius:6px;color:var(--terminal-tenue);
  width:30px;height:30px;cursor:pointer;display:grid;place-items:center;padding:0}
.t-campana:hover{border-color:var(--sube);color:var(--sube)}
.t-campana[data-activa="1"]{border-color:var(--amarillo);color:var(--amarillo)}
.t-campana svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.9}
@keyframes destello-sube{0%{background:rgba(74,222,106,.32)}100%{background:transparent}}
@keyframes destello-baja{0%{background:rgba(255,107,91,.32)}100%{background:transparent}}
.destella-sube{animation:destello-sube 1.1s ease-out}
.destella-baja{animation:destello-baja 1.1s ease-out}
.mesa-pie{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:space-between;
  padding:13px 18px;border-top:1px solid var(--terminal-linea);background:var(--terminal-2);
  font-size:.8rem;color:var(--terminal-tenue)}
.mesa-pie a{color:var(--sube);font-weight:600;text-decoration:none}
.mesa-pie a:hover{text-decoration:underline}

/* --- aviso de alerta disparada --- */
.aviso-alerta{display:flex;gap:12px;align-items:center;flex-wrap:wrap;
  background:linear-gradient(100deg,rgba(245,238,30,.16),rgba(245,238,30,.04));
  border:1px solid rgba(245,238,30,.45);border-radius:var(--r-m);padding:14px 18px;margin-bottom:16px}
.aviso-alerta b{color:var(--amarillo)}
.aviso-alerta .txt{color:var(--terminal-tinta);font-size:.93rem;flex:1;min-width:220px}
.empresas .aviso-alerta .txt{color:var(--oscuro-tinta)}

/* --- panel de alerta --- */
.modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:18px;
  background:rgba(8,20,6,.62);backdrop-filter:blur(4px)}
.modal[hidden]{display:none!important}
.modal-caja{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r-l);
  padding:clamp(20px,3vw,30px);max-width:460px;width:100%;box-shadow:var(--sombra-alta)}
.modal-caja h3{margin-bottom:6px}
.modal-caja .plomo{font-size:.93rem}
.campo{display:block;margin-top:16px}
.campo span{display:block;font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;
  color:var(--tinta-3);margin-bottom:6px}
.campo input,.campo select,.campo textarea{width:100%;padding:11px 13px;border:1.5px solid var(--linea);
  border-radius:var(--r-s);background:var(--fondo);font-size:.96rem}
.campo input:focus,.campo select:focus,.campo textarea:focus{border-color:var(--verde)}
.campo input[type="number"]{font-variant-numeric:tabular-nums;font-weight:600}
.modal-acc{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.cerrar-modal{position:absolute;top:0;right:0}

/* --- mis alertas --- */
.alertas-lista{display:flex;flex-direction:column;gap:9px;margin-top:16px}
.alerta-fila{display:flex;align-items:center;gap:12px;background:var(--papel);border:1px solid var(--linea);
  border-left:4px solid var(--amarillo);border-radius:var(--r-s);padding:12px 15px;font-size:.92rem}
.alerta-fila .m{font-weight:600;flex:1;min-width:0}
.alerta-fila .u{font-family:var(--mono);font-weight:600;color:var(--cobre);font-variant-numeric:tabular-nums}
.alerta-fila button{background:none;border:0;color:var(--tinta-3);cursor:pointer;font-size:1.15rem;padding:0 4px;line-height:1}
.alerta-fila button:hover{color:var(--stop)}

/* ==========================================================================
   GUÍA VISUAL DE MATERIALES
   ========================================================================== */
.guia-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-block:24px 22px}
.guia-tab{border:1.5px solid var(--linea);background:var(--papel);color:var(--tinta-2);
  padding:9px 17px;border-radius:999px;font-weight:600;font-size:.9rem;cursor:pointer}
.guia-tab:hover{border-color:var(--verde)}
.guia-tab[aria-selected="true"]{background:var(--verde-tinta);border-color:var(--verde-tinta);color:#fff}
.guia-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(255px,1fr))}
.gm{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r-m);overflow:hidden;
  display:flex;flex-direction:column}
.gm-img{aspect-ratio:4/3;background:var(--papel-2);position:relative;border-bottom:1px solid var(--linea)}
.gm-img svg,.gm-img img{width:100%;height:100%;display:block;object-fit:cover}
.gm-rango{position:absolute;left:12px;bottom:12px;font-family:var(--mono);font-size:.72rem;font-weight:600;
  background:rgba(10,18,7,.86);color:var(--amarillo);padding:4px 9px;border-radius:4px;letter-spacing:.03em}
.gm-cuerpo{padding:17px 18px 20px;display:flex;flex-direction:column;gap:11px;flex:1}
.gm-cuerpo h4{font-size:1.05rem}
.gm-precio{font-family:var(--display);font-variation-settings:"wdth" 84,"wght" 850;font-size:1.5rem;
  color:var(--cobre);font-variant-numeric:tabular-nums;line-height:1}
.gm-precio small{font-size:.46em;color:var(--tinta-3);font-variation-settings:"wdth" 95,"wght" 600;margin-left:3px}
.gm-sec{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--tinta-3)}
.gm ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:5px}
.gm li{font-size:.88rem;color:var(--tinta-2);display:flex;gap:7px;align-items:flex-start;line-height:1.4}
.gm li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--verde);flex:none;margin-top:7px}
.gm .baja li::before{background:var(--alerta)}
.gm-nota{margin-top:auto;padding-top:11px;border-top:1px dashed var(--linea);font-size:.82rem;color:var(--tinta-3)}

/* ==========================================================================
   AGENDAR RECOLECCIÓN
   ========================================================================== */
.agenda{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(18px,3vw,28px);
  align-items:start;margin-top:26px}
@media (max-width:900px){.agenda{grid-template-columns:1fr}}
.agenda-form{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r-l);
  padding:clamp(18px,3vw,28px);box-shadow:var(--sombra)}
.agenda-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:560px){.agenda-cols{grid-template-columns:1fr}}
.opciones{display:flex;gap:8px;flex-wrap:wrap}
.opcion{position:relative}
.opcion input{position:absolute;opacity:0;width:0;height:0}
.opcion span{display:inline-block;border:1.5px solid var(--linea);background:var(--fondo);
  padding:9px 15px;border-radius:999px;font-size:.89rem;font-weight:600;cursor:pointer;color:var(--tinta-2)}
.opcion input:checked + span{background:var(--verde);border-color:var(--verde);color:#fff}
.opcion input:focus-visible + span{outline:3px solid var(--cobre);outline-offset:2px}
.resumen{background:var(--verde-tinta);border-radius:var(--r-l);padding:clamp(20px,3vw,26px);
  color:#fff;position:sticky;top:84px}
.resumen h3{color:var(--amarillo);text-transform:uppercase;font-variation-settings:"wdth" 84,"wght" 850;font-size:1.1rem}
.resumen dl{margin:18px 0 0;display:flex;flex-direction:column;gap:11px}
.resumen .par{display:flex;justify-content:space-between;gap:12px;font-size:.9rem;
  border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:9px}
.resumen dt{color:#A9D79F}
.resumen dd{margin:0;font-weight:600;text-align:right}
.resumen .grande{border-bottom:0;align-items:flex-end;margin-top:6px}
.resumen .grande dd{font-family:var(--display);font-variation-settings:"wdth" 80,"wght" 900;
  font-size:clamp(1.7rem,5vw,2.3rem);color:var(--amarillo);line-height:.95;font-variant-numeric:tabular-nums}
.resumen .aviso{margin-top:16px;font-size:.8rem;color:#A9D79F;line-height:1.45}

/* ==========================================================================
   ESTADO ABIERTO / CERRADO — bien visible
   ========================================================================== */
.letrero{display:inline-flex;align-items:center;gap:12px;border-radius:999px;padding:9px 20px 9px 12px;
  font-family:var(--display);font-variation-settings:"wdth" 88,"wght" 800;text-transform:uppercase;
  letter-spacing:.04em;font-size:clamp(.92rem,2vw,1.08rem);border:2px solid transparent}
.letrero .bombillo{width:15px;height:15px;border-radius:50%;flex:none;position:relative}
.letrero .bombillo::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid currentColor;opacity:.4}
.letrero .sub{display:block;font-family:var(--texto);font-weight:600;text-transform:none;
  letter-spacing:0;font-size:.8rem;opacity:.82;margin-top:1px}
.letrero.abierto{background:#0D2A0A;color:#7DFF6B;border-color:#7DFF6B}
.letrero.abierto .bombillo{background:#7DFF6B;box-shadow:0 0 14px #7DFF6B;animation:pulso 2s ease-in-out infinite}
.letrero.cerrado{background:#2A0D0A;color:#FF9C8E;border-color:#FF9C8E}
.letrero.cerrado .bombillo{background:#FF6B5B}
.hero .letrero{box-shadow:0 6px 20px -8px rgba(0,0,0,.6)}

/* el bloque de horario, con el día de hoy marcado */
.horario table td{padding:8px 0}
.horario tr.hoy td{color:var(--verde-hondo);font-weight:700;background:color-mix(in srgb,var(--verde) 9%,transparent)}
.horario tr.hoy td:first-child{border-radius:6px 0 0 6px;padding-left:9px}
.horario tr.hoy td:last-child{border-radius:0 6px 6px 0;padding-right:9px}
.horario td:last-child{font-family:var(--mono);font-size:.86rem}

.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* --- hero compacto de las páginas de material --- */
.hero-corto .hero-in{grid-template-columns:1fr;padding-block:clamp(30px,4vw,52px);gap:18px}
.hero-corto h1{margin-top:0;font-size:clamp(2rem,5.4vw,3.4rem)}
.hero-corto .hero-sub{max-width:62ch}
.migas{display:flex;gap:7px;flex-wrap:wrap;font-size:.84rem;color:#D3F0CC;margin-bottom:6px}
.migas a{color:#fff;text-decoration:none;font-weight:600}
.migas a:hover{text-decoration:underline}
.migas span{opacity:.7}
.prosa h2{margin-top:44px;font-size:clamp(1.4rem,3vw,2rem)}
.prosa h2:first-child{margin-top:0}
.prosa p{margin-top:14px;color:var(--tinta-2);max-width:68ch}
.prosa ul{margin:16px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px;max-width:68ch}
.prosa li{position:relative;padding-left:18px;color:var(--tinta-2);font-size:.97rem;line-height:1.62}
.prosa li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--verde)}
.prosa b{color:var(--tinta)}
.relacionadas{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin-top:22px}
.rel-card{background:var(--papel);border:1px solid var(--linea);border-left:4px solid var(--cobre);
  border-radius:var(--r-m);padding:18px 20px;text-decoration:none;display:block}
.rel-card:hover{border-color:var(--verde);border-left-color:var(--verde)}
.rel-card strong{display:block;font-family:var(--display);font-variation-settings:"wdth" 90,"wght" 750;
  font-size:1.02rem;color:var(--tinta)}
.rel-card span{font-size:.86rem;color:var(--tinta-3)}
.cta-franja{background:var(--verde);color:#fff;border-radius:var(--r-l);padding:clamp(24px,4vw,38px);
  display:flex;gap:20px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:44px}
.cta-franja h3{color:#fff;font-size:clamp(1.3rem,3vw,1.9rem);text-transform:uppercase;
  font-variation-settings:"wdth" 84,"wght" 850}
.cta-franja p{color:#E6FBE1;margin-top:8px;max-width:48ch}

/* el tablero del hero es angosto: sin scroll horizontal */
.mesa-compacta table.tablero{min-width:0}
.mesa-compacta table.tablero th,
.mesa-compacta table.tablero td{padding:10px 8px}
.mesa-compacta table.tablero th:first-child,
.mesa-compacta table.tablero td:first-child{padding-left:16px}
.mesa-compacta table.tablero th:last-child,
.mesa-compacta table.tablero td:last-child{padding-right:16px}
.mesa-compacta .t-nom{min-width:0;font-size:.88rem}
.mesa-compacta .t-nom small{font-size:.72rem}
.mesa-compacta .t-ult{font-size:.96rem}
.mesa-compacta .t-sim{font-size:.72rem}
.mesa-top{row-gap:8px}

/* ==========================================================================
   MÓVIL — el menú no se puede perder, y nada se sale de la pantalla
   ========================================================================== */
@media (max-width:900px){
  .nav-in{flex-wrap:wrap;padding-block:10px;gap:10px}
  .nav-links{display:flex;order:3;width:100%;margin-left:0;flex-wrap:nowrap;
    overflow-x:auto;gap:6px;padding-bottom:4px;scrollbar-width:none;
    -webkit-overflow-scrolling:touch;mask-image:linear-gradient(90deg,#000 88%,transparent)}
  .nav-links::-webkit-scrollbar{display:none}
  .nav-links a{white-space:nowrap;background:var(--papel-2);font-size:.86rem}
  .nav img{height:30px}
  .wa{margin-left:auto;padding:9px 17px 10px 14px;gap:9px}
  .wa svg{width:22px;height:22px}
  .wa b{font-size:1rem}
  .wa span{font-size:.62rem;letter-spacing:.1em}
}
@media (max-width:400px){
  .wa span{display:none}
  .wa{padding:10px 16px}
}
@media (max-width:860px){
  .hero-in{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
  h1{font-size:clamp(1.8rem,7.4vw,2.6rem)}
  .hero-logo{padding:11px 15px}
  .hero-logo img{height:44px}
  .letrero{padding:8px 16px 8px 11px}
  .resumen{position:static}
  .cta-franja{flex-direction:column;align-items:flex-start}
}
/* ninguna caja puede empujar la página a lo ancho */
.env,.hero-in,.mesa,.tarjeta,.gm,.agenda-form,.resumen{min-width:0}

/* Los hijos de flex y grid traen min-width:auto y se niegan a encogerse por
   debajo de su contenido. Eso es lo que empuja la página a lo ancho. */
.nav-in > .nav-links,.nav-links,.mesa-scroll,.hero-in > *,.agenda > *,.llegar > *,
.rejilla > *,.listas > *,.guia-grid > *,.precios-grid > *,.relacionadas > *,
.cta-franja > *,.mesa-top > *,.calc-fila > *{min-width:0}
.nav-links{flex:1 1 100%}

/* ==========================================================================
   MESA GRANDE — los precios que la gente viene a ver, en grande
   ========================================================================== */
.mesa-grande .mesa-top h3{font-size:clamp(1.15rem,2.6vw,1.45rem)}
.precios-top{list-style:none;margin:0;padding:0}
.precios-top li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 16px;
  align-items:center;padding:clamp(13px,2vw,17px) clamp(16px,2.4vw,22px);
  border-bottom:1px solid rgba(36,54,28,.75)}
.precios-top li:last-child{border-bottom:0}
.precios-top li:hover{background:rgba(74,222,106,.05)}
.pt-nom{color:#fff;font-weight:600;font-size:clamp(.95rem,1.9vw,1.06rem);line-height:1.2}
.pt-nom small{display:block;color:var(--terminal-tenue);font-size:.78rem;font-weight:500;margin-top:2px}
.pt-der{display:flex;align-items:baseline;gap:10px;justify-content:flex-end}
.pt-val{font-family:var(--display);font-variation-settings:"wdth" 78,"wght" 900;
  color:var(--amarillo);font-size:clamp(1.9rem,5.2vw,2.9rem);line-height:.9;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.pt-val small{font-size:.34em;font-variation-settings:"wdth" 92,"wght" 700;
  color:var(--terminal-tenue);margin-left:3px}
.pt-var{font-family:var(--mono);font-size:.78rem;font-weight:600;font-variant-numeric:tabular-nums;
  white-space:nowrap}
.pt-var.sube{color:var(--sube)}.pt-var.baja{color:var(--baja)}.pt-var.igual{color:var(--terminal-tenue)}
@media (max-width:430px){
  .precios-top li{grid-template-columns:1fr}
  .pt-der{justify-content:flex-start}
}

/* los otros materiales, solo mencionados */
.tambien{padding:16px clamp(16px,2.4vw,22px) 18px;border-top:1px dashed rgba(245,238,30,.3);
  background:rgba(255,255,255,.02)}
.tambien-rot{display:block;font-family:var(--display);font-variation-settings:"wdth" 92,"wght" 700;
  text-transform:uppercase;letter-spacing:.12em;font-size:.7rem;color:var(--amarillo);margin-bottom:10px}
.tambien-chips{display:flex;flex-wrap:wrap;gap:7px}
.tambien-chips span{font-size:.82rem;color:var(--terminal-tinta);background:rgba(255,255,255,.07);
  border:1px solid var(--terminal-linea);border-radius:999px;padding:5px 12px}
.tambien-nota{margin-top:10px;font-size:.79rem;color:var(--terminal-tenue)}
.tambien-nota a{color:var(--sube);font-weight:600;text-decoration:none}
.tambien-nota a:hover{text-decoration:underline}

/* con precios grandes, el hero reparte parejo */
@media (min-width:861px){ .hero-in{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} }

/* ==========================================================================
   FRANJA DE CONFIANZA — tres cifras, sin adornos
   ========================================================================== */
.pago{background:linear-gradient(155deg,var(--verde) 0%,var(--verde-hondo) 100%);
  color:#fff;position:relative;overflow:hidden;isolation:isolate;
  padding-block:clamp(44px,6vw,72px)}
.pago::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.07;
  background-image:var(--patron);background-size:190px 190px}
.pago h2{color:#fff;text-shadow:0 3px 0 rgba(12,60,8,.26)}
.pago h2 em{font-style:normal;color:var(--amarillo)}
.pago .eyebrow{color:var(--amarillo)}
.pago-cabeza{max-width:56ch}
.pago-plomo{margin-top:14px;color:#E7FBE2;font-size:clamp(1rem,1.7vw,1.12rem)}
.pago-tres{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:clamp(16px,3vw,34px);margin-top:clamp(28px,4vw,44px)}
.pt{border-top:3px solid var(--amarillo);padding-top:16px}
.pt-cifra{display:block;font-family:var(--display);font-variation-settings:"wdth" 80,"wght" 900;
  font-size:clamp(2.6rem,6vw,3.8rem);line-height:.88;color:var(--amarillo);
  font-variant-numeric:tabular-nums}
.pt h3{color:#fff;margin-top:8px;font-size:1.08rem}
.pt p{color:#D6F3CF;font-size:.93rem;margin-top:7px;max-width:34ch}
.pago-cta{display:flex;gap:11px;flex-wrap:wrap;margin-top:clamp(28px,4vw,40px)}

/* ==========================================================================
   CATALIZADORES — cotización por foto
   ========================================================================== */
.cata{background:var(--oscuro);color:var(--oscuro-tinta);position:relative;overflow:hidden}
.cata::before{content:"";position:absolute;inset:0;opacity:.05;pointer-events:none;
  background-image:var(--patron);background-size:190px 190px}
.cata .env{position:relative}
.cata .eyebrow{color:var(--cobre-claro)}
.cata h2{color:#fff}
.cata h2 em{font-style:normal;color:var(--cobre-claro)}
.cata-plomo{color:var(--oscuro-tinta-2);margin-top:12px;max-width:62ch}
.cata-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
  gap:clamp(22px,4vw,46px);align-items:center;margin-top:clamp(26px,4vw,40px)}
@media (max-width:880px){.cata-in{grid-template-columns:minmax(0,1fr)}}
.cata-dibujo{background:linear-gradient(150deg,#1B2616,#101A0C);
  border:1px solid var(--oscuro-linea);border-radius:var(--r-l);padding:clamp(14px,2.4vw,22px)}
.cata-dibujo svg{width:100%;height:auto;display:block}
.cata-pasos{counter-reset:cp;display:flex;flex-direction:column;gap:16px}
.cp{display:grid;grid-template-columns:auto minmax(0,1fr);gap:15px;align-items:start}
.cp::before{counter-increment:cp;content:counter(cp);width:38px;height:38px;border-radius:50%;
  background:var(--cobre);color:#fff;display:grid;place-items:center;
  font-family:var(--display);font-variation-settings:"wdth" 86,"wght" 850;font-size:1.05rem}
.cp h3{color:#fff;font-size:1.06rem}
.cp p{color:var(--oscuro-tinta-2);font-size:.94rem;margin-top:5px}
.cp b{color:var(--cobre-claro);font-weight:700}
.cata-aviso{margin-top:24px;display:flex;gap:12px;align-items:flex-start;
  background:rgba(217,130,31,.1);border:1px solid rgba(217,130,31,.38);
  border-radius:var(--r-m);padding:15px 18px}
.cata-aviso svg{width:20px;height:20px;stroke:var(--alerta);fill:none;stroke-width:2;flex:none;margin-top:2px}
.cata-aviso p{color:var(--oscuro-tinta);font-size:.9rem}
.cata-cta{display:flex;gap:11px;flex-wrap:wrap;margin-top:26px}

/* ==========================================================================
   DATOS EN EL HERO — dónde estamos y a qué hora, sin bajar la página
   ========================================================================== */
.hero-datos{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:10px;margin-top:20px}
.hd{display:flex;gap:12px;align-items:flex-start;text-decoration:none;color:#fff;
  background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.28);
  border-radius:var(--r-m);padding:13px 15px;backdrop-filter:blur(4px)}
a.hd:hover{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.5)}
.hd svg{width:22px;height:22px;stroke:var(--amarillo);fill:none;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;flex:none;margin-top:1px}
.hd .txt{min-width:0}
.hd b{display:block;font-size:.97rem;font-weight:700;line-height:1.25}
.hd small{display:block;font-size:.82rem;color:#D9F4D3;line-height:1.35;margin-top:3px}
.hd .mas{color:var(--amarillo);font-weight:700;white-space:nowrap}

/* ==========================================================================
   SELLOS — el respaldo del negocio, en grande y sobre blanco
   (el centro del sello PYME es transparente en el arte original, así que
    tiene que ir siempre sobre fondo blanco o se ve roto)
   ========================================================================== */
.sellos{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(16px,2.6vw,28px);
  align-items:center;background:#fff;border-radius:var(--r-l);
  padding:clamp(16px,2.4vw,24px);margin-top:22px;
  box-shadow:0 3px 8px rgba(8,40,6,.14),0 22px 44px -20px rgba(6,34,4,.6)}
@media (max-width:620px){.sellos{grid-template-columns:1fr;text-align:center;justify-items:center}}
.sello-pyme{display:flex;flex-direction:column;align-items:center;gap:9px}
.sello-pyme img{height:clamp(116px,17vw,178px);width:auto;display:block}
.sello-pyme span{font-size:.72rem;color:var(--tinta-3);text-align:center;line-height:1.35;
  max-width:19ch}
.sello-pyme b{display:block;color:var(--tinta);font-family:var(--mono);font-size:.78rem;
  font-weight:600;margin-top:2px}
.sello-gestor{display:flex;gap:14px;align-items:flex-start;padding-left:clamp(0px,2.4vw,24px);
  border-left:1px solid var(--linea)}
@media (max-width:620px){
  .sello-gestor{border-left:0;border-top:1px solid var(--linea);padding-left:0;
    padding-top:18px;text-align:left}
}
.sello-gestor > svg{width:46px;height:46px;stroke:var(--verde);fill:none;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round;flex:none}
.sello-gestor b{display:block;font-family:var(--display);
  font-variation-settings:"wdth" 90,"wght" 800;font-size:clamp(1.02rem,2vw,1.2rem);
  color:var(--tinta);line-height:1.2}
.sello-gestor small{display:block;color:var(--tinta-2);font-size:.88rem;margin-top:4px}
.sello-gestor code{display:inline-block;margin-top:9px;font-family:var(--mono);font-size:.7rem;
  color:var(--verde-hondo);background:var(--papel-2);border:1px solid var(--linea);
  border-radius:5px;padding:5px 9px;word-break:break-all}

/* ==========================================================================
   FECHA DEL DÍA — junto a todo lo que habla de precios
   ========================================================================== */
.mesa-titulo{display:flex;flex-direction:column;gap:5px;margin-right:auto;min-width:0}
.mesa-titulo h3{margin-right:0}
.fecha-hoy{display:inline-flex;align-items:center;gap:7px;font-size:.78rem;font-weight:600;
  line-height:1.3;color:var(--verde-hondo);background:color-mix(in srgb,var(--verde) 13%,transparent);
  border:1px solid color-mix(in srgb,var(--verde) 34%,transparent);
  border-radius:999px;padding:5px 12px;width:fit-content;max-width:100%}
.fecha-hoy::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--verde);flex:none}
.fecha-hoy b{font-weight:800}
/* dentro de los tableros oscuros */
.mesa .fecha-hoy{color:var(--sube);background:rgba(74,222,106,.1);border-color:rgba(74,222,106,.32)}
.mesa .fecha-hoy::before{background:var(--sube)}
/* junto a un título de sección */
.titulo-con-fecha{display:flex;gap:14px;align-items:baseline;flex-wrap:wrap}

/* ==========================================================================
   ORDEN DEL HERO
   En computadora: marca, texto y credenciales a la izquierda; precios a la
   derecha. En celular los precios suben al segundo lugar, porque es lo que
   la gente vino a ver y no debería tener que deslizar para encontrarlo.
   ========================================================================== */
.hero-in{grid-template-areas:"marca mesa" "texto mesa" "abajo mesa";align-items:start}
.hero-marca{grid-area:marca}
.hero-texto{grid-area:texto}
.hero-abajo{grid-area:abajo}
.hero-in > .mesa{grid-area:mesa;align-self:center}
.hero-texto h1{margin-top:18px}
.hero-abajo{margin-top:26px}
@media (max-width:860px){
  .hero-in{grid-template-areas:"marca" "mesa" "texto" "abajo";gap:20px}
  .hero-texto h1{margin-top:0}
  .hero-abajo{margin-top:0}
}

/* miniatura del reel cuando hay captura; si no, el fondo por plataforma */
.reel-mini{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.reel:has(.reel-mini)::before{opacity:.06}
.reel:has(.reel-mini) .tit,.reel:has(.reel-mini) .red{position:relative;z-index:2}
.reel:has(.reel-mini)::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(6,24,4,.1) 35%,rgba(6,24,4,.82))}
.reel-tiktok{background:linear-gradient(165deg,#25301F,#0A1207)}
.reel-instagram{background:linear-gradient(165deg,#8A4A1E,#3B2410)}
.reel-facebook{background:linear-gradient(165deg,#1C4470,#0C1D30)}
.reel-youtube{background:linear-gradient(165deg,#6B2020,#2A0C0C)}

@media (max-width:640px){
  .cinta{padding-block:11px}
  .cinta-item{font-size:.92rem;padding-inline:19px;gap:9px}
  .cinta-val{font-size:1rem}
}

/* el recuadro de catalizadores dejó de ser advertencia */
.cata-aviso.cata-ok{background:rgba(74,222,106,.09);border-color:rgba(74,222,106,.38)}
.cata-aviso.cata-ok svg{stroke:var(--sube)}