:root{
  --terra:#bd5a34; --terra-deep:#6b3420; --terra-mid:#cf7a4e;
  --amber:#d98c2b; --amber-deep:#b5791d;
  --sage:#6f8b68; --sage-deep:#54694e;
  --cream:#f4ead7; --cream-2:#fbf5ea; --shell:#fff;
  --marca:#bd5a34; --marca-osc:#6b3420; --clr2:#fbf5ea;
  --ok:#5a8a52; --ok-bg:#e7f0e2; --ok-bd:#bcd4b0;
  --warn:#b5791d; --warn-bg:#f8ecd2; --warn-bd:#e8cd93;
  --err:#b3402f; --err-bg:#f7e2dc; --err-bd:#ecbcb0;
  --tinta:#2b241f; --gris:#6a5f55; --linea:#e3d9c6;
  --f-title:"Space Grotesk",system-ui,sans-serif;
  --f-display:"Fraunces",Georgia,serif;
  --f-body:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --r-sm:8px; --r:14px; --r-lg:22px; --r-pill:999px;
  --sh-sm:0 1px 2px rgba(107,52,32,.06),0 2px 8px rgba(107,52,32,.05);
  --sh:0 10px 30px -12px rgba(107,52,32,.22);
  --maxw:760px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--f-body);color:var(--tinta);background:var(--cream-2);line-height:1.65;font-size:17px;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.ic{width:1em;height:1em;vertical-align:-.14em;flex:0 0 auto}
a{color:var(--terra)}
::selection{background:var(--terra);color:#fff}
:focus-visible{outline:2.5px solid var(--terra);outline-offset:3px;border-radius:6px}

/* Barra superior */
header.mini{position:sticky;top:0;z-index:40;background:rgba(251,245,234,.85);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--linea);display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;align-items:center;justify-content:space-between;padding:.7rem 1.25rem}
header.mini .brand{display:inline-flex;align-items:center;gap:.55rem;color:var(--terra-deep);font-family:var(--f-title);font-weight:700;font-size:1.08rem;text-decoration:none;letter-spacing:-.01em}
header.mini .brand .mk{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--terra);color:#f9efe0}
header.mini .brand .mk svg{width:18px;height:18px}
header.mini .brand em{font-style:normal;color:var(--sage-deep);font-weight:600}
header.mini nav{display:flex;gap:.2rem .9rem;flex-wrap:wrap;align-items:center;font-family:var(--f-title);font-weight:600;font-size:.9rem}
header.mini nav a{color:var(--terra-deep);text-decoration:none;opacity:.92}
header.mini nav a:hover{color:var(--terra);text-decoration:underline}
header.mini nav .sep{color:var(--linea)}

/* Cabecera de artículo */
main{max-width:var(--maxw);margin:0 auto;padding:clamp(1.6rem,4vw,2.6rem) 1.25rem}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--f-title);font-weight:600;font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sage-deep)}
.eyebrow::before{content:"";width:24px;height:1.5px;background:var(--amber)}
h1{font-family:var(--f-display);font-weight:600;font-size:clamp(1.6rem,4.6vw,2.35rem);line-height:1.1;letter-spacing:-.015em;margin:.7rem 0 1rem;color:var(--terra-deep)}
h2{font-family:var(--f-display);font-weight:600;font-size:1.4rem;line-height:1.2;margin:2rem 0 .5rem;color:var(--terra-deep)}
article p{margin:.7rem 0}
.hero-food{width:100%;max-width:560px;display:block;margin:.4rem auto 1.4rem;border-radius:var(--r-lg);box-shadow:var(--sh);aspect-ratio:16/10;object-fit:cover}

/* Semáforo perro/gato */
.semaforo{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;margin:1.2rem 0}
.sem{border:1.5px solid var(--linea);border-radius:var(--r);padding:.9rem;background:var(--shell);display:flex;flex-direction:column;align-items:center;gap:.55rem;box-shadow:var(--sh-sm)}
.sem .lbl{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--f-title);font-weight:700;color:var(--terra-deep)}
.sem .lbl .ic{width:1.15em;height:1.15em;color:var(--terra-mid)}
.sem.seguro{border-color:var(--ok-bd)}.sem.moderacion{border-color:var(--warn-bd)}.sem.peligroso{border-color:var(--err-bd)}
.badge{display:inline-flex;align-items:center;gap:.35rem;padding:.24em .8em;border-radius:var(--r-pill);font-family:var(--f-title);font-size:.84rem;font-weight:600}
.badge.seguro{background:var(--ok-bg);color:var(--sage-deep)}.badge.moderacion{background:var(--warn-bg);color:var(--amber-deep)}.badge.peligroso{background:var(--err-bg);color:var(--err)}
.resumen{font-family:var(--f-display);font-size:1.18rem;font-weight:500;line-height:1.4;color:var(--tinta);border-left:3px solid var(--amber);padding-left:1rem;margin:1.2rem 0}

.dot{width:11px;height:11px;border-radius:50%;display:inline-block;flex:0 0 auto;margin-right:.4rem}
.dot.seguro{background:var(--sage)}.dot.moderacion{background:var(--amber)}.dot.peligroso{background:var(--err)}

.aviso{display:flex;gap:.6rem;align-items:flex-start;background:var(--err-bg);border:1px solid var(--err-bd);border-radius:var(--r);padding:.85rem 1rem;font-size:.92rem;color:#7f2418;margin:1.3rem 0}
.aviso .ic{width:1.15em;height:1.15em;color:var(--err);margin-top:.15em}
.aviso-alergia{display:flex;gap:.6rem;align-items:flex-start;background:var(--cream);border:1px solid #e6d4ac;border-radius:var(--r);padding:.85rem 1rem;font-size:.94rem;margin:1.2rem 0;color:var(--tinta)}
.aviso-alergia .ic{width:1.15em;height:1.15em;color:var(--amber-deep);margin-top:.15em}
.aviso-alergia a{color:var(--terra-deep);font-family:var(--f-title);font-weight:600;text-decoration:none}
.aviso-alergia a:hover{color:var(--terra)}

.mini-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:.5rem;margin:.7rem 0}
.mini-grid a{border:1.5px solid var(--linea);border-radius:var(--r);padding:.55rem .7rem;text-decoration:none;color:var(--tinta);font-family:var(--f-title);font-weight:500;font-size:.9rem;display:flex;align-items:center;background:var(--shell);transition:border-color .18s,background .18s}
.mini-grid a:hover{border-color:var(--terra-mid)}

.lista-alimentos{display:flex;flex-direction:column;gap:.45rem;margin:1.2rem 0}
.food-row{border:1.5px solid var(--linea);border-radius:var(--r);padding:.65rem .85rem;text-decoration:none;color:var(--tinta);background:var(--shell);display:flex;align-items:center;gap:.3rem;flex-wrap:wrap;transition:border-color .18s,box-shadow .18s;box-shadow:var(--sh-sm)}
.food-row:hover{border-color:var(--terra-mid)}
.food-row b{font-family:var(--f-title);font-weight:600}
.food-row .mini-est{color:var(--gris);font-family:var(--f-title);font-size:.8rem;margin-left:auto}

ul{margin:.5rem 0 .5rem 1.1rem}
li{margin:.25rem 0}

.adslot{background:var(--cream);border:1px dashed #d9c39a;border-radius:var(--r);padding:.85rem;text-align:center;color:#a8895a;font-family:var(--f-title);font-size:.78rem;letter-spacing:.04em;margin:2rem 0}
.volver{margin-top:1.4rem}
.volver a{display:inline-flex;align-items:center;gap:.45rem;color:var(--terra-deep);font-family:var(--f-title);font-weight:600;text-decoration:none}
.volver a:hover{color:var(--terra)}

/* Footer */
footer{background:var(--terra-deep);color:#d3b9a8;padding:clamp(2rem,5vw,3rem) 1.25rem;font-size:.9rem;line-height:1.6}
.foot-in{max-width:var(--maxw);margin:0 auto;display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:center;justify-content:center;text-align:center}
footer a{color:#e4c9b7;text-decoration:none}
footer a:hover{color:#fff;text-decoration:underline}
footer .brand{font-family:var(--f-title);font-weight:700;color:#fff}

@media(max-width:460px){
  body{font-size:16px}
  .semaforo{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important;scroll-behavior:auto}}
