@import "https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700&family=DM+Sans:wght@300;400;500;600&display=swap";
:root{--green:#2d5a27;--green-light:#4a7c42;--green-pale:#eef4ed;--cream:#faf8f3;--cream-dark:#f0ebe0;--text:#1a1a1a;--text-muted:#6b6b6b;--orange:#e86c2f;--white:#fff;--border:#e0d9cc;--shadow:0 2px 16px #00000012;--radius:16px}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--cream);color:var(--text);min-height:100vh;font-family:DM Sans,sans-serif}h1,h2,h3{font-family:Playfair Display,serif}html{-webkit-text-size-adjust:100%}.grid-4{grid-template-columns:repeat(4,1fr);gap:16px;display:grid}.grid-auto{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;display:grid}.grid-ingredients{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px;display:grid}@media (max-width:768px){.grid-4,.grid-auto{grid-template-columns:repeat(2,1fr);gap:10px}.grid-ingredients{grid-template-columns:1fr}}@media (max-width:480px){.grid-4{grid-template-columns:repeat(2,1fr);gap:8px}.grid-auto{grid-template-columns:1fr 1fr;gap:8px}}