/* Quiet cream, cocoa and misty blue; bright color stays in the cookies. */
:root{--cream:#faf7f0;--paper:#fffdf8;--pink:#c5b6a1;--pink-soft:#f0e7da;--lime:#dde5df;--lilac:#d7e0e4;--lilac-soft:#e9eeed;--muted:#6d6257;--line:#ded4c5}
.header{position:relative}.desktopnav .btn,.cta .btn,.manifest .btn.light{background:var(--navy);color:var(--cream);border-color:var(--navy)}
.brand-wink:after,.eyebrow:before,.hug-control button span,.cta h2 em,.values span{color:#85633f}.hero h1 em:after{background:#e6d9c3}.hero-visual:before{background:#ded2bf}.floating-sticker{background:#e9eee7;border-color:#a69b89;box-shadow:3px 3px 0 #b7aa96;color:var(--choc)}.hug-control button{border-color:var(--line);background:#f0e7da}.hug-control button[aria-pressed=true]{background:#dfd8c7}.ribbon{background:#e9eee7;border-color:#d2d9d1;transform:none}.manifest{background:#e7edee;border-color:#d5dedf}.manifest p,.contact-aside p{color:#56615e}.values,.values>div{border-color:#c5cfcf}.marmotte-scene.lime{background:#edf0e9}.marmotte-scene:after{background:#c2cfc7}.price{background:#eee5d8}.team-picker button[data-team=nutella]{background:#efe4d6}.team-picker button[data-team=mms]{background:#e8eee7}.team-picker button[data-team=choco]{background:#e7edf0}.product.is-favorite .product-visual{outline-color:#6d8675}.product.is-favorite .product-title h3:after{color:#6d8675}.summary-card{border-color:var(--line);background:#f0e8da}.summary-lines{border-color:var(--line)}.choice[aria-pressed=true]{background:#dce6df}.format-grid .choice:last-child:after{background:#d9e2e8}.field input[type=range]{accent-color:#6d8675}.sparkle:before,.sparkle:after{color:#a57176}
.products{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;padding-bottom:24px}.product{min-width:0}.product-visual.cutout{height:auto;aspect-ratio:1.15;background:#eee4d6;display:grid;place-items:center;border-radius:24px}.product-visual.cutout.mms{background:#e7ece3}.product-visual.cutout.choco{background:#e4e9eb}.product-visual.cutout img{width:96%;height:96%;object-fit:contain;padding:22px 8px 8px;filter:drop-shadow(0 12px 8px #51321b23)}.product-visual .number{top:15px;left:15px;background:#fffdf5df;text-transform:uppercase;font-size:8px;padding:9px 11px;letter-spacing:1px}.product-title{align-items:center;gap:10px}.product-title h3{font-size:26px;letter-spacing:-1px;margin-bottom:0;text-transform:uppercase}.price{padding:9px 10px;font-size:16px}.product-body{display:flex;flex-direction:column;gap:15px;padding-block:23px}.product-body p{font-size:14px;line-height:1.75;margin:0;min-height:75px}.product-body details{padding-block:12px}.product-body details p{min-height:0;margin-top:12px}.product-body .textlink{align-self:start}.photo-caption{font-size:11px;color:var(--muted);padding-bottom:35px;margin:0}.recipe-counts{display:grid;gap:10px}.recipe-count{display:grid;grid-template-columns:60px minmax(0,1fr) 66px;align-items:center;gap:12px;padding:10px 13px;background:var(--paper);border:1px solid var(--line);border-radius:16px;font-size:13px}.recipe-count img{width:60px;height:60px;object-fit:contain}.recipe-count input{width:66px;padding:12px 5px;text-align:center;border:1px solid var(--line);border-radius:10px;color:var(--ink);background:#faf7f0;font-size:16px;min-height:44px}.btn:disabled{opacity:.5;transform:none;box-shadow:none}.status.invalid{color:#9b362a}.summary-card .btn{gap:10px;font-size:12px}.field select,.field input,.field textarea{font-size:16px}
@media(max-width:1050px) and (min-width:701px){.products{gap:18px}.product-title h3{font-size:21px}.product-title{align-items:start}.price{font-size:14px}.desktopnav{gap:16px}.hero h1{font-size:64px}.hero-mascot{width:190px;left:-28px}.brand-wink{display:none}.product-body p{min-height:100px}}
@media(max-width:700px){
 .wrap{padding-inline:6%}.preview{font-size:9px;padding:7px 18px;line-height:1.4;letter-spacing:0}.header{height:78px;gap:10px}.brand img{width:84px;height:66px}.header>.brand-wink{display:none}.menu-toggle{font-size:12px;min-height:44px;padding:11px 16px}.desktopnav{top:100%;padding:16px 6% 22px;max-height:calc(100dvh - 140px);overflow-y:auto;border-radius:0 0 18px 18px}.desktopnav a{font-size:15px;min-height:44px}.desktopnav .btn{justify-content:center;gap:24px}
 .hero{padding-block:27px 32px;gap:18px;grid-template-columns:minmax(0,1fr)}.hero h1{font-size:clamp(42px,12vw,54px);line-height:1;letter-spacing:-.055em;margin:16px 0}.hero-copy>p{font-size:14px;margin:16px 0;line-height:1.7;max-width:none}.hero .eyebrow{font-size:9px;letter-spacing:1.5px}.hero .actions{gap:12px;margin:21px 0 15px;align-items:center}.hero .actions .btn{font-size:12px;padding:13px 16px;min-height:47px;gap:15px}.hero .actions .outline{padding:9px 0;background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;min-height:44px;font-size:12px}.hero-note{padding-top:14px;font-size:8px;gap:20px}.hug-control{gap:10px;margin:15px 0;flex-direction:row;align-items:center}.hug-control button{min-height:44px;font-size:10px}.hug-control>span{font-size:9px;max-width:125px}.hero-visual{margin:8px 0 0;padding:0 0 28px;max-width:450px;width:100%;justify-self:center}.hero-visual>img{height:auto;aspect-ratio:1.18;object-fit:cover;border-radius:24px}.hero-visual:before{inset:8px -6px 30px;border-radius:26px;transform:rotate(2deg)}.floating-sticker{display:none}.hero-mascot{width:125px;left:-7px;bottom:0;transform:rotate(-5deg)}.hero-visual figcaption{max-width:185px;font-size:7px;letter-spacing:.6px;margin:12px 0 0 auto;min-height:22px;line-height:1.5}.ribbon{padding:14px 6%;gap:16px;font-size:8px;letter-spacing:1px}.ribbon span:last-child,.ribbon i:last-of-type{display:none}
 .section{padding-block:40px}.section-head{display:block;margin-bottom:25px}.section-head h2{font-size:34px;line-height:1.08}.section-head .textlink{display:inline-block;font-size:12px;margin-top:18px;min-height:30px}.products{grid-template-columns:minmax(0,1fr);gap:30px;padding-bottom:15px}.product-visual.cutout{aspect-ratio:1.38;border-radius:22px}.product-visual.cutout img{max-height:265px;padding:18px 12px 5px;width:100%;height:100%}.product-visual .number{font-size:8px;top:12px;left:12px}.product-body{padding-block:19px;gap:12px}.product-title h3{font-size:26px;line-height:1.1}.price{font-size:16px;padding:9px 12px}.product-body p{min-height:0;font-size:14px}.product-body details{padding:13px 0}.product-body .textlink{font-size:12px;min-height:36px;display:inline-flex;align-items:center;gap:12px}.product-body summary{min-height:24px;line-height:1.7}.photo-caption{padding-bottom:30px}
 .intro-with-mascot{grid-template-columns:minmax(0,1fr) 90px;gap:10px;padding-block:28px}.intro-with-mascot .page-intro h1{font-size:clamp(34px,9vw,44px);line-height:1.05;margin-block:14px}.intro-with-mascot .page-intro p{font-size:13px;line-height:1.7;grid-column:1/-1}.intro-mascot,.legal-intro .intro-mascot{width:90px;padding:0;margin:0;align-self:start;padding-top:25px}.intro-mascot img,.legal-intro .intro-mascot img{height:110px;max-height:none}.intro-mascot .speech{display:none}.intro-mascot:before{inset:40px 0 0}.intro-with-mascot .page-intro{display:contents}.intro-with-mascot .page-intro .eyebrow{grid-column:1/-1;font-size:9px}.intro-with-mascot .page-intro h1{grid-column:1;grid-row:2}.intro-with-mascot .intro-mascot{grid-column:2;grid-row:2}.intro-with-mascot .page-intro p{grid-row:3;margin:8px 0 0}.team-picker{gap:8px;margin-bottom:24px}.team-picker>span{font-size:12px}.team-picker button{font-size:10px;min-height:44px;padding:10px 13px}.team-picker p{font-size:10px;margin-bottom:0}
 .manifest{padding-block:35px}.manifest h2{font-size:40px;line-height:1.05}.manifest p{font-size:14px}.values>div{font-size:13px;line-height:1.6}.fun-break{padding-top:30px}.marmotte-scene{grid-template-columns:95px minmax(0,1fr);gap:14px;padding:22px 18px;border-radius:23px;min-height:0}.scene-art{width:100%;margin:0;transform:none}.scene-copy h2{font-size:25px;letter-spacing:-1px;margin-block:9px;line-height:1.1}.scene-copy p{font-size:12px;line-height:1.7}.tiny-label{font-size:7px;letter-spacing:1px}.marmotte-scene:after{display:none}.cta{padding-block:38px}.cta h2{font-size:34px}.cta p{font-size:13px}.cta .btn{width:100%;justify-content:center;gap:30px}
 .page-intro{padding-block:30px 22px}.page-intro p{font-size:14px}.page-histoire .page-intro h1,.page-commander .page-intro h1,.legal-intro .page-intro h1,.page-contact .page-intro h1{font-size:clamp(36px,10vw,46px);line-height:1.05}.page-commander .order-grid{gap:20px}.step{padding-block:23px}.step h2{font-size:22px}.format-grid{gap:7px}.choice{padding:18px 9px;border-radius:12px}.choice b{font-size:22px}.choice small{font-size:9px}.format-grid .choice:last-child:after{font-size:6px;letter-spacing:.5px;right:5px}.recipe-count{grid-template-columns:48px minmax(0,1fr) 60px;padding:10px;gap:9px;font-size:12px}.recipe-count img{width:48px;height:48px}.recipe-count input{width:60px}.summary-card{position:static;margin-top:0;padding:20px;border-radius:22px;overflow:hidden}.order-mascot{height:100px;margin:0 0 16px;display:flex;align-items:center;gap:12px}.order-mascot img{position:static;width:100px;height:100px;transform:none;order:1}.order-mascot .speech{position:static;width:auto;max-width:160px;transform:none;margin:0;font-size:10px;padding:10px;box-shadow:none}.summary-card h2{font-size:28px}.summary-card .eyebrow{font-size:9px}.summary-card .total strong{font-size:39px}.summary-card .btn{font-size:11px;padding:14px;min-height:48px}.summary-card .notice{font-size:11px}
 .contact-aside{margin-top:0;padding:22px;overflow:hidden}.contact-mascot{height:110px;margin:0 0 20px;display:flex;align-items:center;gap:10px}.contact-mascot img{position:static;order:1;width:120px;height:110px}.contact-mascot .speech{position:static;transform:none;width:auto;max-width:160px;box-shadow:none;margin:0;font-size:10px}.contact-aside h2{font-size:32px}.contact-aside p{font-size:13px}.contact-aside .btn{font-size:11px;gap:12px;max-width:100%}.story-grid{gap:24px}.story-grid img{height:320px;border-radius:22px}.story-grid h2{font-size:34px}.story-grid p,.legal p{font-size:14px}.page-histoire .fun-break{padding-bottom:35px}.legal h2{font-size:23px;line-height:1.25}.legal-intro .page-intro h1{font-size:34px}.footer-main{gap:24px}.footer-logo p{font-size:10px}.footer-bottom{line-height:1.6;font-size:10px;gap:15px}.footer-nav a{padding-block:9px}
}
@media(max-width:360px){.hero .actions{gap:8px}.hero .actions .btn{font-size:11px;padding-inline:12px}.hero .actions .outline{padding-inline:0}.hero h1{font-size:43px}.hug-control{gap:7px}.hug-control>span{font-size:8px;max-width:98px}.hug-control button{padding-inline:9px;font-size:9px}.product-title h3{font-size:23px}.recipe-count{font-size:11px}.intro-with-mascot{grid-template-columns:minmax(0,1fr) 70px}.intro-mascot{width:70px}.intro-with-mascot .page-intro h1{font-size:32px}.marmotte-scene{grid-template-columns:70px minmax(0,1fr);padding-inline:14px}.scene-copy h2{font-size:23px}.footer-logo{gap:14px}.format-grid .choice b{font-size:19px}.choice small{font-size:8px}}

@media(max-width:700px){.legal p,.contact-aside p,.footer-bottom a{overflow-wrap:anywhere}.page-cookies .products{padding-bottom:24px}.page-cookies .photo-caption{max-width:32em}}

/* Whole cookies with breathing room, perspective and hover movement. */
.product-visual.cutout{--cookie-zoom:1.02;--cookie-angle:-12deg;--cookie-x:0%;--cookie-y:2%;height:auto;aspect-ratio:1;overflow:hidden;perspective:1000px;background:#fff}
.product-visual.cutout.nutella{--cookie-zoom:.95;--cookie-angle:-20deg;--cookie-x:0%;--cookie-y:2%;background:#fff}
.product-visual.cutout.mms{--cookie-angle:9deg;background:#fff}
.product-visual.cutout.choco{background:#fff}
.product-visual.cutout img{position:absolute;inset:0;width:100%;height:100%;max-height:none;padding:0;object-fit:contain;transform-origin:50% 50%;backface-visibility:hidden;filter:drop-shadow(9px 16px 7px #57301f35);transform:translate(var(--cookie-x),var(--cookie-y)) rotateX(16deg) rotateY(-18deg) rotateZ(var(--cookie-angle)) scale(var(--cookie-zoom));transition:transform .5s ease,filter .5s ease}
@media(hover:hover) and (pointer:fine){.product:hover .product-visual.cutout img{transform:translate(var(--cookie-x),var(--cookie-y)) rotateX(13deg) rotateY(-15deg) rotateZ(var(--cookie-angle)) scale(calc(var(--cookie-zoom) + .24));filter:drop-shadow(10px 18px 8px #57301f3d)}}
.product-visual.cutout .number{z-index:2;background:#fffdf5ed}
@media(prefers-reduced-motion:reduce){.product-visual.cutout img{transition:none}}

/* A little meadow around the marmot's cookie stash. */
.product-visual.cutout,.product-visual.cutout.nutella,.product-visual.cutout.mms,.product-visual.cutout.choco{background-color:#acb67d;background-image:url("assets/prairie-terrier.webp");background-size:cover;background-position:center;box-shadow:inset 0 0 0 1px #66733d18}
.product-visual.cutout img{z-index:1;filter:drop-shadow(8px 16px 8px #26341565)}
@media(hover:hover) and (pointer:fine){.product:hover .product-visual.cutout img{filter:drop-shadow(10px 21px 10px #26341570)}}
.product-visual.cutout .number{z-index:3;background:#fffdf5ee}
.prairie-detail{position:absolute;z-index:2;right:21%;bottom:4%;max-width:36%;padding:7px 9px;border:1px solid #9e784b;border-radius:5px;background:#f8edcf;color:#573b20;box-shadow:2px 3px 0 #49341928;font:italic 11px Georgia,serif;line-height:1.3;text-align:center;transform:rotate(-6deg);pointer-events:none}
.product-visual.mms .prairie-detail{transform:rotate(5deg)}
@media(max-width:1000px) and (min-width:701px){.prairie-detail{font-size:9px;padding:5px 6px}}

/* One miniature world per recipe; the burrow belongs only to Nutella Bomb. */
.product-visual.cutout.nutella{background-image:url("assets/prairie-terrier.webp")}
.product-visual.cutout.mms{background-image:url("assets/prairie-mms.webp")}
.product-visual.cutout.choco{background-image:url("assets/prairie-choco.webp")}

/* Touch devices use an explicit toggle instead of sticky emulated :hover. */
.product-visual.cutout.is-zoomed img{transform:translate(var(--cookie-x),var(--cookie-y)) rotateX(13deg) rotateY(-15deg) rotateZ(var(--cookie-angle)) scale(calc(var(--cookie-zoom) + .24));filter:drop-shadow(10px 21px 10px #26341570)}
.product-visual.cutout[role=button]{cursor:zoom-in;touch-action:manipulation}
.product-visual.cutout.is-zoomed[role=button]{cursor:zoom-out}
.product-visual.cutout[role=button]:focus-visible{outline:3px solid #85633f;outline-offset:4px}

/* Warm lower sections and a cocoa footer matching the top banner. */
.manifest,.marmotte-scene.lilac{background:#f6eddc;border-color:#dfcfb6}
.manifest p{color:var(--muted)}
.manifest .values,.manifest .values>div{border-color:#d8c6ab}
footer{background:var(--choc);color:#fff7e9;border-top:1px solid #4a281b}
.footer-logo p,.footer-bottom{color:#eadcc6}
.footer-bottom{border-top-color:#ffffff30}
.footer-logo img{mix-blend-mode:normal;background:#f6eddc;border-radius:12px;padding:7px;object-fit:contain}
footer a:focus-visible{outline-color:#fff7e9}
.footer-nav a:hover,.footer-bottom a:hover{text-decoration:underline;text-underline-offset:4px}