:root{--brand:#2E837D;--bg:#F7FAF9;--text:#0f172a}
*{box-sizing:border-box} body{font-family:Inter,system-ui,Segoe UI,Roboto;background:var(--bg);color:var(--text);margin:0}
.container{max-width:1100px;margin-inline:auto} a{text-decoration:none;color:inherit} a:hover{color:var(--brand)}
header,footer{background:#fff;border-color:#e2e8f0} .btn{display:inline-flex;align-items:center;gap:.5rem;background:var(--brand);color:#fff;padding:.8rem 1.15rem;border-radius:12px;font-weight:600}
.btn.alt{background:#fff;color:#0f172a;border:1px solid #cbd5e1} .card{background:#fff;border:1px solid #e2e8f0;border-radius:18px;overflow:hidden}
.card-img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block} .hero-img{width:100%;max-height:300px;object-fit:cover;border-radius:18px}
.grid{display:grid;gap:1rem} .grid.auto{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.search{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap} .search input{width:min(100%,520px);padding:.9rem 1rem;border:1px solid #e2e8f0;border-radius:12px;background:#fff}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center} .chip{padding:.5rem .8rem;border-radius:999px;background:#e6f3f2;border:1px solid #c8e6e3;font-weight:600;cursor:pointer}
.chip.active{background:#2E837D;color:#fff;border-color:#2E837D}
.counter{display:inline-flex;align-items:center;gap:.5rem;border:1px solid #e2e8f0;border-radius:12px;padding:.3rem .6rem}
.counter button{padding:.3rem .6rem;border-radius:10px;border:1px solid #cbd5e1;background:#fff}
.pill{display:inline-block;border:1px solid #cbd5e1;border-radius:999px;padding:.28rem .65rem;font-size:.88rem;background:#fff}
.nutri{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:1rem}
@media (max-width:768px){.hero-img{max-height:220px}}