/* ============================================================
   Campesino · capa de identidad sobre el motor (app.css)
   verde cinta #25974D (UI #1D7A3E, texto blanco 5.4:1) · amarillo #F6E313 · rojo #C93236 · tinta #0D2A18
   ============================================================ */
:root{
  --rojo:#1D7A3E; --rojo-900:#12552A; --rojo-700:#186A35; --rojo-50:#E6F2EA; --rojo-100:#C8E3D1;
  --negro:#0D2A18; --negro-2:#133820; --negro-3:#1B4A2B;
  --amarillo:#F6E313; --amarillo-50:#FDF9D0;
  --carmin:#C93236;
  --fondo:#F6F7F0; --fondo-2:#ECEEE4;
  --disp:"Anton","Inter",sans-serif;
}
.gate__t,.hub-cab h2,.boot__k b{letter-spacing:.6px}
.hub-cab h2 span{color:var(--carmin)}
/* logo: cinta horizontal, no emblema cuadrado */
.gate__logo{width:min(420px,84vw);filter:drop-shadow(0 14px 40px rgba(29,122,62,.35))}
.gate__logo .wm-svg{width:min(420px,84vw)}
.wipe__emb{width:260px;height:130px}
.wipe__emb .wm-svg{width:260px}
.marca__emb{width:66px;height:34px;flex:0 0 66px}
.marca__emb .wm-svg{width:66px}
.marca__emb svg{border-radius:4px}
.boot__emb{width:min(340px,70vw)}
/* trazo del logo: el contorno blanco de "Campesino" vuelve al final */
.wm-svg.trazok path{stroke:#F6E313}
.wm-svg.trazok path:nth-child(7){animation:trazoCamp 2.2s ease .25s forwards}
@keyframes trazoCamp{60%{stroke-dashoffset:0;fill-opacity:0;stroke:#F6E313;stroke-width:.45}100%{stroke-dashoffset:0;fill-opacity:1;stroke:#fff;stroke-width:14}}
/* tarjeta destacada en rojo Campesino para "Cómo los ve el consumidor" no: se mantiene verde; el rojo es acento */
.card--rojo{background:linear-gradient(135deg,#1D7A3E 0%,#12552A 100%);border-color:#145C2E}
.chip--rojo{background:var(--carmin);color:#fff}
/* paquete con QR */
.lote-pack{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:center;justify-items:center}
.lote-pack .lote-dat{grid-column:1/-1;justify-self:stretch}
.lote-pack img{width:150px;height:150px;object-fit:contain;border-radius:12px;background:#fff;border:1px solid var(--linea)}
.lote-qr{text-align:center}
.lote-qr .qr{width:120px;height:120px;display:block;border-radius:8px;border:1px solid var(--linea)}
.lote-qr small{display:block;font-size:11px;color:var(--tinta-45);margin-top:4px}
.lote-dat{display:flex;flex-direction:column;gap:4px;min-width:0}
.lote-dat b{font-size:15px}
.lote-dat span{font-size:13px;color:var(--tinta-70)}
@media (max-width:700px){.lote-pack{grid-template-columns:1fr 1fr}.lote-dat{grid-column:1/-1}.lote-pack img{width:100%;height:auto;max-width:150px}}
.g>*,.card,.lienzo-chart{min-width:0}
/* alturas de gráfico que el motor no traía */
.h280{height:280px}.h320{height:320px}.h360{height:360px}
/* sparkline del KPI: tamaño fijo debajo del texto (el motor no le daba ancho) */
.kpi__spark{position:static;display:block;width:100%;height:26px;margin-top:8px}
/* el motor tiene ".mapa .pt text" (11px) que pisa a ".mapa-real .et": se fuerza la escala del viewBox real */
.mapa-real .pt .et{font-size:30px;font-weight:700;paint-order:stroke;stroke:#fff;stroke-width:6px;stroke-linejoin:round}
.mapa-real .pt .ev{font-size:24px;font-weight:600;fill:var(--tinta-45);paint-order:stroke;stroke:#fff;stroke-width:6px;stroke-linejoin:round}
.mapa-real .reg{font-size:30px}
@media(max-width:700px){.mapa-real .pt .et{font-size:36px}.mapa-real .pt .ev{font-size:29px}}