@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;500;600;700;800&family=Poppins:wght@400;500;600;700&display=swap');

:root{
  --orange:#f47b20; --orange2:#ff9a3d; --green:#3f6f28; --green2:#75a83d;
  --cream:#fff8e9; --cream2:#fffdf7; --brown:#57351f; --yellow:#ffd76a;
  --shadow:0 18px 45px rgba(95,60,25,.12);
}
*{box-sizing:border-box;scroll-behavior:smooth}
body{margin:0;color:var(--brown);background:var(--cream2);font-family:Poppins,Arial,sans-serif}
.navbar{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 7%;position:sticky;top:0;z-index:20;background:rgba(255,253,247,.94);backdrop-filter:blur(12px);border-bottom:1px solid #f1e4ce}
.logo{font:800 28px "Baloo 2";color:var(--orange);text-decoration:none}
nav{display:flex;gap:28px}nav a{color:var(--brown);text-decoration:none;font-weight:600;font-size:14px}
.menu-btn{display:none;border:0;background:none;font-size:25px}
.hero{min-height:calc(100vh - 72px);display:grid;grid-template-columns:1.05fr .95fr;align-items:center;padding:50px 8%;overflow:hidden;background:radial-gradient(circle at 75% 30%,#fff0c7 0 15%,transparent 38%),linear-gradient(135deg,#fffaf0,#fff4d8)}
.pill,.eyebrow{display:inline-block;color:var(--green);font-size:12px;font-weight:800;letter-spacing:1.4px}
.hero h1{font:800 clamp(70px,10vw,130px)/.8 "Baloo 2";color:var(--orange);margin:22px 0 12px;text-shadow:4px 5px 0 #ffe2a5}
.hero h2{font:700 clamp(28px,4vw,50px)/1.05 "Baloo 2";margin:0;color:var(--green)}
.tagline{font:700 20px "Baloo 2";color:var(--orange)}
.hero-copy>p:not(.tagline){max-width:590px;line-height:1.8;color:#795c46}
.hero-actions{display:flex;gap:12px;margin-top:28px}.btn{padding:13px 22px;border-radius:16px;text-decoration:none;font-weight:700;display:inline-block;border:0;cursor:pointer;font-family:inherit}
.primary{background:var(--orange);color:#fff;box-shadow:0 9px 20px rgba(244,123,32,.25)}.secondary{background:#edf5e3;color:var(--green)}
.mascot-wrap{position:relative;display:flex;justify-content:center;align-items:center}.blob{position:absolute;width:78%;aspect-ratio:1;border-radius:48% 52% 55% 45%;background:#ffe5a6;transform:rotate(10deg)}
.mascot-wrap img{position:relative;width:min(95%,560px);filter:drop-shadow(0 25px 18px rgba(85,50,20,.18));z-index:1}
.floating-card{position:absolute;right:0;bottom:12%;background:#fff;border:2px solid #f7d68d;border-radius:18px;padding:13px 17px;z-index:2;box-shadow:var(--shadow);font-size:13px}.floating-card:first-letter{font-size:22px}
.section{padding:100px 8%;}.section-head{text-align:center;max-width:750px;margin:0 auto 45px}.section h2{font:800 48px/1 "Baloo 2";margin:10px 0;color:var(--green)}.section-head p{color:#806952}
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.feature{background:white;border:1px solid #f0e5d1;padding:28px;border-radius:25px;box-shadow:var(--shadow)}.feature>div{font-size:34px}.feature h3{font:700 22px "Baloo 2";margin:12px 0 5px;color:var(--green)}.feature p,.product-card p{font-size:13px;line-height:1.7;color:#806952}
.product-section{background:#fff5dc}.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.product-card{background:#fff;border:2px solid transparent;border-radius:28px;padding:28px;text-align:center;box-shadow:var(--shadow);transition:.25s}.product-card:hover,.product-card.active{transform:translateY(-6px);border-color:#ffd77b}.product-tag{font-size:11px;font-weight:800;color:var(--orange)}.product-card h3{font:800 32px "Baloo 2";margin:3px;color:var(--green)}.detail-btn{border:0;background:#edf5e3;color:var(--green);padding:10px 15px;border-radius:12px;font-weight:700;cursor:pointer}
.pasta-art{height:180px;display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden;border-radius:20px;background:#fff7e7;margin-bottom:20px}.spaghetti-art{gap:5px}.spaghetti-art i{width:5px;height:150px;background:linear-gradient(90deg,#d76515,#ffad48,#dc6815);border-radius:50%;transform:rotate(-1deg);box-shadow:1px 0 2px #b64f12}.penne-art i{width:27px;height:105px;background:linear-gradient(90deg,#d96515,#ffad48,#cf5d13);border-radius:8px;transform:rotate(32deg);position:relative;margin:-7px}.penne-art i:after{content:"";position:absolute;inset:10px 7px;border:4px solid #a84b16;border-radius:50%;opacity:.6}.fusilli-art i{width:28px;height:110px;border:8px solid #e9791d;border-left-color:#ffad48;border-radius:50%;transform:rotate(18deg);margin:-5px}
.product-info{margin:30px auto 0;max-width:750px;text-align:center;padding:17px;border-radius:16px;background:#edf5e3;color:var(--green);font-weight:600}
.timeline{display:flex;align-items:stretch;justify-content:center;gap:14px}.step{flex:1;max-width:230px;padding:25px;background:#fff;border-radius:22px;box-shadow:var(--shadow);text-align:center}.step span{display:grid;place-items:center;margin:auto;width:45px;height:45px;border-radius:50%;background:#ffe09a;color:var(--green);font-weight:800}.step h3{font:700 23px "Baloo 2";margin:10px 0 0;color:var(--orange)}.step p{font-size:12px;line-height:1.6;color:#806952}.arrow{display:grid;place-items:center;font-size:30px;color:var(--orange)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;background:var(--green);color:#fff;padding-top:55px;padding-bottom:55px}.stats div{display:flex;align-items:center;gap:14px;justify-content:center}.stats strong{font-size:32px}.stats span{font-size:12px;line-height:1.4}.stats b{font-size:15px}
.quiz-section{display:flex;align-items:center;justify-content:center;gap:50px;background:#fffaf0}.quiz-card{max-width:700px;background:white;padding:45px;border-radius:30px;box-shadow:var(--shadow);border:1px solid #f0dfbf}.quiz-card h2{font-size:35px}.answers{display:grid;gap:10px;margin:25px 0}.answers button{padding:14px;border:2px solid #eadfc9;border-radius:14px;background:#fff;color:var(--brown);font:600 14px Poppins;cursor:pointer;text-align:left}.answers button:hover{border-color:var(--orange)}.answers button.correct{background:#eaf5df;border-color:#8ebd5a}.answers button.wrong{background:#fff0e7;border-color:#ef9b69}.quiz-result{font-weight:700;color:var(--green)}.hidden{display:none}.quiz-mascot{width:min(280px,35vw);filter:drop-shadow(0 20px 15px rgba(80,50,20,.16))}
footer{padding:35px 8%;display:flex;justify-content:space-between;align-items:center;background:#2e521d;color:#fff}footer b{font:800 28px "Baloo 2"}footer span{opacity:.8;font-size:12px}footer p{font-size:13px}
@media(max-width:850px){nav{display:none}.menu-btn{display:block}.hero{grid-template-columns:1fr;padding-top:35px}.mascot-wrap{order:-1}.mascot-wrap img{width:75%}.floating-card{right:5%;bottom:4%}.feature-grid,.product-grid{grid-template-columns:1fr 1fr}.timeline{flex-wrap:wrap}.arrow{display:none}.stats{grid-template-columns:1fr 1fr}.quiz-section{flex-direction:column}.quiz-mascot{width:230px}}
@media(max-width:560px){.section{padding:70px 5%}.feature-grid,.product-grid{grid-template-columns:1fr}.hero{padding-left:5%;padding-right:5%}.hero h1{font-size:76px}.section h2{font-size:38px}.stats{grid-template-columns:1fr}footer{flex-direction:column;gap:12px;text-align:center}.pasta-art{height:150px}}