/* ============================================================
   Nutri Fitness Py · identidad sobre el motor de demos
   Rojo corazón #D9231B (logo) · contorno #6E170D · maní #D19F77 (fondo del avatar)
   · verde etiqueta #6E9A2A · crema #FBF6EF
   ============================================================ */
:root{
  --rojo:#D9231B; --rojo-900:#8E1510; --rojo-700:#B81C15; --rojo-50:#FDECEA; --rojo-100:#F8C9C5;
  --negro:#24110D; --negro-2:#361A13; --negro-3:#4A2419;
  --tinta:#1E1310; --tinta-70:#4A3A33; --tinta-45:#76655C; --tinta-25:#A8998F;
  --linea:#EADFD0; --linea-fuerte:#D8C8B3; --papel:#FFFFFF; --fondo:#FBF6EF; --fondo-2:#F2E8DA;
  --verde:#5E8A1E; --verde-50:#EEF5E1; --azul:#2563A8; --azul-50:#E6EEF8; --ambar:#C2700A; --ambar-50:#FCEFDC;
  --violeta:#7A4A26; --violeta-50:#F4EADF; --amarillo:#D19F77; --amarillo-50:#F8EDE3; --naranja:#D19F77;
  --mani:#D19F77; --mani-osc:#9B6A42;
  --disp:"Barlow Condensed","Inter",sans-serif;
  --guion:"Lora",Georgia,serif;
}
.gate{background:#140906}
.gate__bg i{background:linear-gradient(90deg,transparent,var(--rojo) 40%,var(--mani) 60%,transparent);opacity:.12}
.gate__t{font-family:var(--guion);font-style:italic;font-weight:700;letter-spacing:0;text-transform:none;font-size:clamp(22px,4vw,30px)}
.boot{background:#140906}
.boot__emb{width:min(190px,48vw)}
.boot__emb .la-placa{padding:14px}
.wipe{background:var(--rojo)}
.marca__emb .wm-svg{background:var(--mani);border-radius:50%;padding:3px}
.hub-cab h2 span{color:var(--rojo)}
.kpi--naranja .kpi__val,.kpi--amarillo .kpi__val{color:var(--mani-osc)}

/* ---------- hallazgos: número grande con corazón ---------- */
.hallazgo .num{color:var(--rojo)}
.hallazgo .sol{border-left-color:var(--rojo)}
.evid{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 8px}
.evid code{font-family:var(--mono);font-size:11.5px;background:var(--fondo-2);border:1px solid var(--linea);border-radius:6px;padding:2px 7px;color:var(--tinta-70);word-break:break-all}

/* ---------- vitrina de potes ---------- */
.potes{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,170px),1fr));gap:14px}
.pote{position:relative;background:var(--papel);border:1px solid var(--linea);border-radius:16px;padding:12px;display:flex;flex-direction:column;gap:6px;transition:transform .25s ease,box-shadow .25s ease;min-width:0;cursor:pointer}
.pote:hover{transform:translateY(-4px);box-shadow:var(--sombra-2)}
.pote.on{outline:2px solid var(--rojo);outline-offset:2px}
.pote img{width:100%;aspect-ratio:1/1;object-fit:contain;border-radius:10px;background:#fff}
.pote b{font-size:13px;line-height:1.25}
.pote small{color:var(--tinta-45);font-size:11.5px}
.pote .pr{font-family:var(--disp);font-weight:800;font-size:22px;color:var(--rojo);line-height:1}
.pote .p100{font-size:11px;color:var(--tinta-45)}
.pote .sku{font-family:var(--mono);font-size:10px;color:var(--tinta-25)}
.pote .cinta{position:absolute;top:10px;left:10px;background:var(--rojo);color:#fff;font:800 10px/1 Inter,sans-serif;letter-spacing:.08em;padding:5px 7px;border-radius:6px}
.pote .cinta--alerta{background:var(--ambar)}

/* ---------- regla de precio por 100 g ---------- */
.regla{display:flex;flex-direction:column;gap:9px}
.regla__f{display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr) 92px;gap:10px;align-items:center;font-size:12.5px}
.regla__f .lb{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.regla__f .tr{height:14px;border-radius:99px;background:var(--fondo-2);overflow:hidden}
.regla__f .tr i{display:block;height:100%;width:0;border-radius:99px;background:var(--linea-fuerte);transition:width 1.1s cubic-bezier(.2,.8,.2,1)}
.regla__f.nf .tr i{background:var(--rojo)}
.regla__f .v{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
@media(max-width:560px){.regla__f{grid-template-columns:minmax(0,1fr) 86px}.regla__f .tr{grid-column:1/-1;order:3}}

/* ---------- flujo del pedido (SVG con objeto que viaja) ---------- */
.flujo-nf{position:relative;width:100%}
.flujo-nf svg{width:100%;height:auto;display:block}
.flujo-nf .camino{fill:none;stroke:var(--linea-fuerte);stroke-width:3;stroke-dasharray:6 7}
.flujo-nf .camino-on{fill:none;stroke:var(--rojo);stroke-width:3;stroke-dasharray:1200;stroke-dashoffset:1200;animation:dibuja 3.6s ease forwards}
@keyframes dibuja{to{stroke-dashoffset:0}}
.flujo-nf .nodo circle{fill:#fff;stroke:var(--rojo);stroke-width:3}
.flujo-nf .nodo text{font:600 12px Inter,sans-serif;fill:var(--tinta);text-anchor:middle}
.flujo-nf .nodo .sub{font-size:10.5px;fill:var(--tinta-45);font-weight:500}
.flujo-nf .viajero{offset-path:var(--ruta);offset-rotate:0deg;animation:viaja 6s cubic-bezier(.6,0,.4,1) infinite}
@keyframes viaja{0%{offset-distance:0%}85%,100%{offset-distance:100%}}
.flujo-nf .late{animation:late 1.6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes late{50%{transform:scale(1.18)}}

/* ---------- pote que se llena (taller) ---------- */
.llenado{display:flex;gap:16px;align-items:center}
.llenado svg{width:120px;flex:0 0 120px}
.llenado .masa{animation:llena 3.2s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:bottom}
@keyframes llena{from{transform:scaleY(.15)}to{transform:scaleY(1)}}
.llenado .gota{animation:cae 1.6s ease-in infinite}
@keyframes cae{0%{transform:translateY(-14px);opacity:0}30%{opacity:1}100%{transform:translateY(36px);opacity:0}}

/* ---------- propuesta modular ---------- */
.modu{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:16px}
.modu__c{position:relative;background:var(--papel);border:1px solid var(--linea);border-radius:18px;padding:18px;display:flex;flex-direction:column;gap:10px;min-width:0;transition:border-color .2s,box-shadow .2s}
.modu__c.on{border-color:var(--rojo);box-shadow:0 0 0 3px rgba(217,35,27,.14)}
.modu__c h3{margin:0;font-size:17px}
.modu__c .tipo{font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;font-weight:700;color:var(--tinta-45)}
.modu__c .res{font-size:13px;color:var(--tinta-70);line-height:1.5}
.modu__c .res b{color:var(--rojo)}
.modu__c .plazo{font-size:12px;color:var(--tinta-45)}
.modu__p{display:grid;grid-template-columns:1fr 1fr;gap:10px;border-top:1px dashed var(--linea);padding-top:12px;margin-top:auto}
.modu__p>div{text-align:center;min-width:0}
.modu__p small{display:block;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--tinta-45);font-weight:700}
.modu__p b{display:block;font-family:var(--disp);font-size:28px;line-height:1.05;color:var(--tinta)}
.modu__p span{display:block;font-size:11.5px;color:var(--tinta-45)}
.modu__sel{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;cursor:pointer;user-select:none}
.modu__sel input{accent-color:var(--rojo);width:17px;height:17px}
.combo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;text-align:center}
.combo>div{min-width:0}
.combo small{display:block;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.7);font-weight:700}
.combo b{display:block;font-family:var(--disp);font-size:34px;line-height:1.05;color:#fff}
.combo span{display:block;font-size:12px;color:rgba(255,255,255,.75)}
.escalon{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:14px}
.escalon span{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:99px;padding:6px 12px;font-size:12px;color:#fff}
@media(max-width:700px){.combo{grid-template-columns:1fr}}
.cta-mod{display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--rojo);font-weight:800;border-radius:12px;padding:12px 18px;font-size:14px}

/* ---------- dominio ---------- */
.dns{display:grid;grid-template-columns:minmax(0,120px) minmax(0,1fr);gap:6px 12px;font-size:12.5px}
.dns dt{color:var(--tinta-45);font-weight:600}
.dns dd{margin:0;font-family:var(--mono);font-size:11.5px;word-break:break-all}
.sobre{display:flex;align-items:center;gap:14px}
.sobre svg{width:110px;flex:0 0 110px}
.sobre .rebota{animation:rebota 2.8s cubic-bezier(.5,0,.5,1) infinite}
@keyframes rebota{0%{transform:translateX(0)}45%{transform:translateX(52px)}55%{transform:translateX(52px) rotate(8deg)}100%{transform:translateX(0)}}

.mani-fondo{position:absolute;inset:0;pointer-events:none;overflow:hidden;opacity:.5}
.t td .fo{vertical-align:middle;margin-right:8px}
.celda-prod{display:flex;align-items:center;gap:8px;min-width:0}
.local-foto{width:100%;border-radius:14px;display:block;aspect-ratio:4/5;object-fit:cover}
@media (prefers-reduced-motion:reduce){.flujo-nf .viajero,.flujo-nf .late,.llenado .masa,.llenado .gota,.sobre .rebota,.flujo-nf .camino-on{animation:none!important;stroke-dashoffset:0}}
.mt16{margin-top:16px}
.wipe{overflow:hidden}
.wow-datos b{font-size:24px}
.card--rojo{background:linear-gradient(135deg,#C21F18 0%,#7A140F 100%);border-color:#7A140F}