/* A different picnic-paper palette in each chapter. */
.bowls,.recipe,.happy,footer{isolation:isolate}
.bowls,.recipe,footer{overflow:clip}
.section-scene{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:clip}
.section-scene:before,.section-scene:after{content:'';position:absolute;pointer-events:none}
.bowls{background:#edf5df}.bowls:before,.recipe:before{display:none}
.pantry-scene{background:none}.pantry-doodles{position:absolute;inset:0;background:url('assets/pantry-pattern.svg') repeat;background-size:310px 250px;opacity:.26;mask-image:linear-gradient(180deg,#000,transparent 28%,#000 65%)}
.pantry-scene:before{display:none}
.pantry-scene:after{width:1100px;height:850px;right:-260px;top:-310px;background:#f6d2c3;border-radius:49% 51% 42% 58%;transform:rotate(-16deg);z-index:-1}
.pantry-sun{position:absolute;width:540px;height:540px;left:-210px;bottom:-160px;border-radius:50%;background:#f7e5a1;z-index:-1}
.pantry-sun:after{content:'';position:absolute;inset:25px;border:2px dashed #be965b55;border-radius:50%}
.pantry-ribbon{position:absolute;right:-60px;bottom:0;width:520px;height:120px;transform:rotate(-8deg);background:repeating-conic-gradient(#c3dda5 0 25%,#dcebc6 0 50%) 0 0/34px 34px;opacity:.55;mask-image:linear-gradient(to left,#000,transparent)}
.bowls .section-heading{position:relative}.bowls .section-heading>p{background:#fff8e8de;padding:17px 23px;border:1px solid #9ba28055;border-radius:56% 44% 48% 52% / 45% 48% 52% 55%;transform:rotate(3deg)}
.bowls .menu-note{background:#edf5dfd9;display:table;margin-inline:auto;padding:8px 14px;border-radius:20px;opacity:.85}
.recipe{background:#cce5b9;background-image:none}
.recipe-scene:before{left:-170px;top:-150px;width:760px;height:760px;background:#f9e8ad;border-radius:43% 57% 52% 48%;transform:rotate(-18deg)}
.recipe-scene:after{right:-150px;bottom:-250px;width:540px;height:540px;background:#f4cabd;border-radius:50%}
.recipe-wave{position:absolute;inset:0;background:url('assets/waves.svg') repeat;background-size:140px 70px;opacity:.15;mask-image:linear-gradient(110deg,transparent 30%,#000)}
.recipe-title{align-self:center}.recipe-title .eyebrow{color:#657b45}
.recipe-steps{gap:15px}.recipe-steps article,.recipe-steps article:first-child,.recipe-steps article:last-child{border:1.5px solid #352c2850;border-radius:22px;padding:22px;background:#fffae8;box-shadow:4px 4px 0 #65844735;transition:transform .3s}
.recipe-steps article:nth-child(2){background:#f9ddd0;transform:rotate(-1.4deg)}.recipe-steps article:nth-child(3){background:#e9f2d9;transform:rotate(1deg)}
.recipe-steps article:hover{transform:translateY(-4px) rotate(0)}
.recipe-steps .step-no{background:#f0d48d;border:1px solid #352c2850;border-radius:50%;width:32px;height:32px;flex-shrink:0;display:grid;place-items:center;opacity:1;font-size:13px;margin-top:0}
.recipe-steps article:nth-child(2) .step-no{background:#bcd79c}.recipe-steps article:nth-child(3) .step-no{background:#f5b5a5}
.happy{background:#f5aa93}.party-scene{background:repeating-conic-gradient(from -8deg at 50% 56%,#f8cba655 0deg 12deg,transparent 12deg 24deg)}
.party-scene:before{width:620px;height:620px;left:-330px;top:-140px;background:#d1e7b8;border-radius:44% 56% 59% 41%;transform:rotate(-22deg);border:1px solid #352c2830}
.party-scene:after{width:420px;height:420px;right:-200px;bottom:-210px;background:#f6dc88;border-radius:50%;border:1px solid #352c2830}
.party-confetti{position:absolute;inset:0;background:url('assets/pantry-pattern.svg') repeat;background-size:390px 315px;opacity:.22;mask-image:linear-gradient(90deg,#000,transparent 35%,transparent 65%,#000)}
.happy .happy-orbit{border-color:#fff8e855}.happy .happy-orbit:after{border-color:#fff8e866}
.happy .happy-jp{background:#fff0c7;border:1.5px solid var(--ink);padding:20px 11px;border-radius:40px;box-shadow:3px 3px 0 #352c2825;left:8%;top:22%;font-size:16px}
footer{position:relative;max-width:none;background:#d2e6bd;padding-inline:max(5.5%,calc((100% - 1336px)/2))}
.footer-scene{background-image:url('assets/waves.svg');background-size:110px 55px;opacity:.35;mask-image:linear-gradient(to top,#000,transparent)}
footer:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(115deg,#f9e8ae 0 25%,transparent 25% 76%,#f5d0bd 76%);opacity:.8}
footer small{background:#d2e6bd66}
@media(max-width:1100px){.recipe-steps article,.recipe-steps article:first-child,.recipe-steps article:last-child{padding:18px}.recipe-steps article{gap:13px}.recipe-steps h3{font-size:22px}.recipe-steps .step-icon{width:45px}.recipe-scene:before{left:-320px}}
@media(max-width:760px){.pantry-doodles{background-size:240px 194px}.pantry-scene:after{width:570px;height:540px;right:-310px;top:-130px}.pantry-sun{width:430px;height:430px;left:-270px;bottom:10%}.pantry-ribbon{height:90px;width:260px;right:-40px;background-size:26px 26px}.bowls .section-heading>p{display:table;margin-top:24px;padding:13px 18px;border-radius:22px;transform:rotate(-2deg);font-size:11px}.bowls .menu-note{max-width:100%;font-size:8px;line-height:1.7;padding:10px 13px}.recipe-scene:before{width:650px;height:550px;left:-160px;top:-250px;border-radius:45%}.recipe-scene:after{width:380px;height:380px;right:-200px;bottom:-170px}.recipe-wave{opacity:.1}.recipe-steps{gap:17px}.recipe-steps article,.recipe-steps article:first-child,.recipe-steps article:last-child{padding:19px 15px;border-radius:20px;gap:12px}.recipe-steps h3{font-size:22px}.recipe-steps p{font-size:10px}.recipe-steps .step-no{width:26px;height:26px;font-size:11px}.recipe-steps .step-icon{width:42px}.party-scene:before{width:300px;height:300px;left:-220px;top:-100px}.party-scene:after{width:250px;height:250px;right:-165px;bottom:-100px}.party-confetti{background-size:255px 206px;opacity:.18;mask-image:linear-gradient(to bottom,#000,transparent 25%,transparent 75%,#000)}.happy .happy-jp{left:3%;top:10%;font-size:10px;padding:14px 6px;letter-spacing:4px}.happy h2{font-size:40px}footer{padding-inline:6%}footer:before{background:linear-gradient(125deg,#f9e8ae 0 37%,transparent 37% 80%,#f5d0bd 80%)}.footer-scene{background-size:90px 45px}}
@media(max-width:360px){.recipe-steps h3{font-size:19px}.recipe-steps p{font-size:9px}.recipe-steps .step-icon{width:33px}.recipe-steps article{gap:9px}.happy h2{font-size:35px}}
