@import"https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;500;600;700;800&family=Nunito:wght@400;600;700;800&display=swap";:root{--green: #4CAF50;--green-light: #81C784;--yellow: #FFD54F;--orange: #FF8A65;--orange-dark: #E64A19;--blue: #4FC3F7;--pink: #F48FB1;--cream: #FFF8E1;--brown: #795548;--bg: #FFFDE7}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:Nunito,sans-serif;background:var(--bg);color:#3e2723;line-height:1.6;overflow-x:hidden}h1,h2,h3,h4{font-family:"Baloo 2",cursive}.nav{position:sticky;top:0;z-index:100;background:linear-gradient(135deg,var(--green),var(--green-light));padding:.75rem 1.5rem;display:flex;align-items:center;justify-content:space-between;box-shadow:0 4px 20px #00000026}.nav-logo{font-family:"Baloo 2",cursive;font-size:1.5rem;font-weight:800;color:#fff;text-shadow:2px 2px 0 rgba(0,0,0,.15)}.nav-links{display:flex;gap:.5rem;list-style:none;flex-wrap:wrap}.nav-links a{color:#fff;text-decoration:none;font-weight:700;font-size:.9rem;padding:.4rem .8rem;border-radius:2rem;transition:background .2s,transform .15s}.nav-links a:hover{background:#ffffff40;transform:scale(1.05)}.hero{background:linear-gradient(160deg,#a5d6a7,#66bb6a 40%,#43a047);padding:4rem 1.5rem 5rem;text-align:center;position:relative;overflow:hidden}.hero:before{content:"";position:absolute;bottom:-2px;left:0;right:0;height:60px;background:var(--bg);clip-path:ellipse(55% 100% at 50% 100%)}.hero h1{font-size:clamp(2.2rem,6vw,3.8rem);color:#fff;text-shadow:3px 3px 0 rgba(0,0,0,.15);margin-bottom:.5rem}.hero-sub{font-size:clamp(1rem,2.5vw,1.4rem);color:#ffffffe6;font-weight:600;max-width:600px;margin:0 auto 1.5rem}.hero-emoji{font-size:clamp(3rem,8vw,5rem);display:block;margin-bottom:1rem;animation:bounce 2s ease-in-out infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}.section{max-width:900px;margin:0 auto;padding:3rem 1.5rem}.section-title{text-align:center;font-size:clamp(1.6rem,4vw,2.4rem);color:var(--green);margin-bottom:.5rem}.section-subtitle{text-align:center;color:#795548;font-size:1.05rem;margin-bottom:2rem;font-weight:600}.about-card{background:#fff;border-radius:1.5rem;padding:2rem;box-shadow:0 8px 30px #00000014;border:3px solid var(--green-light);display:grid;grid-template-columns:1fr;gap:1.5rem}.about-text{font-size:1.05rem;line-height:1.8}.about-text strong{color:var(--orange-dark)}.fun-facts{background:linear-gradient(135deg,#fff3e0,#ffe0b2);border-radius:1rem;padding:1.25rem 1.5rem;border-left:5px solid var(--orange)}.fun-facts h3{color:var(--orange-dark);margin-bottom:.5rem;font-size:1.15rem}.fun-facts ul{list-style:none;padding:0}.fun-facts li{padding:.3rem 0;font-weight:600}.fun-facts li:before{content:"🌟 "}.ingredients-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1rem}.ingredient-card{background:#fff;border-radius:1rem;padding:1.25rem 1rem;text-align:center;box-shadow:0 4px 15px #0000000f;border:2px solid transparent;transition:transform .2s,border-color .2s,box-shadow .2s;cursor:default}.ingredient-card:hover{transform:translateY(-4px) scale(1.03);border-color:var(--green);box-shadow:0 8px 25px #4caf5033}.ingredient-emoji{font-size:2.5rem;display:block;margin-bottom:.5rem}.ingredient-name{font-weight:800;font-family:"Baloo 2",cursive;font-size:.95rem;color:#3e2723}.ingredient-amount{font-size:.8rem;color:#8d6e63;font-weight:600}.tools-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1rem}.tool-card{background:linear-gradient(135deg,#e3f2fd,#bbdefb);border-radius:1rem;padding:1.25rem;text-align:center;border:2px solid #90CAF9;transition:transform .2s}.tool-card:hover{transform:scale(1.05)}.tool-emoji{font-size:2rem;display:block;margin-bottom:.4rem}.tool-name{font-weight:700;font-family:"Baloo 2",cursive;color:#1565c0;font-size:.95rem}.steps-list{display:flex;flex-direction:column;gap:1.5rem;counter-reset:step}.step-card{background:#fff;border-radius:1.25rem;padding:1.75rem;display:grid;grid-template-columns:auto 1fr;gap:1.25rem;align-items:start;box-shadow:0 6px 20px #0000000f;border-left:5px solid var(--green);transition:transform .2s,box-shadow .2s;counter-increment:step}.step-card:hover{transform:translate(6px);box-shadow:0 8px 30px #4caf5026}.step-number{width:50px;height:50px;border-radius:50%;background:linear-gradient(135deg,var(--green),var(--green-light));color:#fff;font-family:"Baloo 2",cursive;font-size:1.4rem;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 4px 10px #4caf504d}.step-content h3{font-size:1.15rem;color:#2e7d32;margin-bottom:.35rem}.step-content p{color:#5d4037;line-height:1.7;font-weight:600}.step-tip{background:#fff9c4;border-radius:.75rem;padding:.6rem 1rem;margin-top:.75rem;font-size:.9rem;font-weight:700;color:#f57f17;border:1px dashed #FFD54F}.step-tip:before{content:"💡 Tip: "}.safety-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}.safety-card{background:linear-gradient(135deg,#ffebee,#ffcdd2);border-radius:1rem;padding:1.25rem;text-align:center;border:2px solid #EF9A9A}.safety-emoji{font-size:2.5rem;display:block;margin-bottom:.5rem}.safety-card h3{color:#c62828;font-size:1rem;margin-bottom:.3rem}.safety-card p{color:#b71c1c;font-size:.9rem;font-weight:600}.serve-section{background:linear-gradient(135deg,#fff8e1,#ffe0b2);border-radius:1.5rem;padding:2.5rem 2rem;text-align:center;border:3px solid var(--yellow);box-shadow:0 8px 30px #0000000f}.serve-emoji{font-size:4rem;display:block;margin-bottom:1rem}.serve-section h2{color:var(--orange-dark);font-size:1.8rem;margin-bottom:.75rem}.serve-section p{color:#5d4037;font-size:1.1rem;font-weight:600;max-width:600px;margin:0 auto}.serve-tips{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:1.5rem}.serve-tip-tag{background:#fff;padding:.5rem 1rem;border-radius:2rem;font-weight:700;font-size:.9rem;color:var(--orange-dark);box-shadow:0 2px 8px #00000014}.footer{background:linear-gradient(135deg,#3e2723,#5d4037);color:#fffc;text-align:center;padding:2rem 1.5rem;margin-top:2rem}.footer p{font-size:.95rem;font-weight:600;color:#fffc}.footer-heart{color:#ef5350}@media(max-width:600px){.nav{flex-direction:column;gap:.5rem}.nav-links{justify-content:center}.step-card{grid-template-columns:1fr;text-align:center}.step-number{margin:0 auto}}