[hidden]{display:none!important}
/* Mimo v5: content-first presentation layer (Notion calm, Apple clarity). Loaded after the base CSS in index.html. */
button,a,summary,label{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
h1,h2,h3,.sub{text-wrap:balance}
.price,.tot,.line-price,.review-line span:last-child,.savings,.sizes small,#cartCount,.cartbar{font-variant-numeric:tabular-nums}
:root{
  --radius-sm:14px;--radius-md:20px;--radius-lg:30px;
  --shadow-sm:0 8px 24px rgba(20,20,20,.07);
  --shadow-lg:0 30px 80px rgba(20,20,20,.16);
  --ease:cubic-bezier(.2,.8,.2,1);
}
html{scroll-padding-top:90px}
body{background:var(--crema)}
.skip-link{position:fixed;left:16px;top:8px;z-index:100;transform:translateY(-150%);background:var(--ink);color:#fff;padding:10px 16px;border-radius:999px;font-weight:700;text-decoration:none}
.skip-link:focus{transform:none}
header .wrap{position:relative}.mobile-scope{display:none;position:absolute;left:50%;translate:-50% 0;font:700 11px Inter;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
header{transition:height .25s var(--ease),box-shadow .25s var(--ease);border-color:rgba(20,20,20,.1)}
header.scrolled{box-shadow:0 8px 30px rgba(20,20,20,.08)}
header nav a{position:relative}
header nav a::after{content:"";position:absolute;left:0;right:100%;bottom:-7px;height:2px;background:var(--ink);transition:right .25s var(--ease)}
header nav a:hover::after,header nav a[aria-current="true"]::after{right:0}

/* Live pickup promise */
.availability{min-height:38px;background:var(--ink);color:var(--crema);display:flex;align-items:center;justify-content:center;padding:8px 20px;font:600 12px/1.4 Inter;letter-spacing:.02em;text-align:center}
.availability a{display:inline-flex;align-items:center;gap:9px;text-decoration:none;min-height:38px}
.availability-dot{width:7px;height:7px;border-radius:50%;background:var(--yema);box-shadow:0 0 0 4px rgba(245,196,28,.15)}
.availability strong{color:var(--yema)}
.availability-arrow{transition:transform .2s var(--ease)}.availability a:hover .availability-arrow{transform:translateX(3px)}

/* Editorial hero */
.hero{min-height:min(760px,calc(100svh - 114px));position:relative}
.hero-copy{position:relative;z-index:2}
.hero .eyebrow{display:inline-flex;align-items:center;gap:8px}.hero .eyebrow::before{content:"";width:22px;height:1px;background:currentColor}
.hero-art{isolation:isolate;filter:drop-shadow(0 24px 36px rgba(20,20,20,.09))}.sticker{display:none}
.cake-big{transition:transform .8s var(--ease)}

.sticker{box-shadow:0 14px 30px rgba(20,20,20,.14)}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px;align-items:center}
.hero-actions .text-link{font-weight:700;font-size:14px;text-underline-offset:4px;padding:12px 4px}

/* Quick flavor index */
.flavor-jump{display:flex;gap:8px;overflow:auto;padding:2px 0 18px;scrollbar-width:none;overscroll-behavior-inline:contain}
.flavor-jump::-webkit-scrollbar{display:none}
.flavor-jump.can-scroll{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent)}.flavor-jump{scroll-snap-type:x proximity}.flavor-jump a{scroll-snap-align:start}
.flavor-jump{text-transform:none;letter-spacing:0}.flavor-jump a{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:rgba(255,253,249,.72);backdrop-filter:blur(8px);border-radius:999px;padding:9px 13px;font:600 12px Inter;text-decoration:none;min-height:44px}
.flavor-jump i{width:8px;height:8px;border-radius:50%;background:var(--flavor)}
.flavor-jump a:hover{border-color:var(--ink)}
.card .row{align-items:center;gap:10px}.card .row .allerg{flex:1;min-width:0}
.card[id]{scroll-margin-top:112px}.card{position:relative;box-shadow:0 1px 0 rgba(20,20,20,.02);transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s}
.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm);border-color:rgba(20,20,20,.16)}
.card .cake{transition:transform .55s var(--ease),filter .55s var(--ease)}
.card:hover .cake{transform:scale(1.02)}
.in-box{position:absolute;right:12px;top:12px;z-index:2;background:var(--ink);color:var(--crema);border-radius:999px;padding:4px 9px;font:700 12px Inter;letter-spacing:.02em;box-shadow:0 4px 12px rgba(20,20,20,.18)}
.sizes button,.add,.cartbtn{min-height:44px}.qty button{width:44px;height:44px;min-height:44px}
.sizes button{padding:6px 12px;display:inline-flex;flex-direction:column;align-items:center;gap:0;line-height:1.15;transition:background .16s,border-color .16s,transform .16s}
.sizes button small{font:600 11px/1.2 Inter;color:var(--muted)}.sizes button.on small{color:rgba(246,241,232,.8)}.sizes button:active,.add:active,.btn:active{transform:scale(.97)}
.add{min-height:44px;padding:9px 16px;transition:background .18s,color .18s,transform .16s}
.card.add-pulse{animation:card-pulse .5s var(--ease)}
@keyframes card-pulse{50%{transform:translateY(-3px) scale(1.012)}}

/* Consistent section rhythm and one heading scale */
section{padding:88px 0}
h2.sec{font-size:clamp(34px,4.4vw,56px);margin:0 0 14px}
.sub{font-size:17px;max-width:56ch;margin:0 0 34px;color:var(--muted)}
#faq,#legal{padding-top:88px}
#how{background:transparent;border:0}

/* Facts: a hairline spec row, not three cards */
.facts{background:transparent}
.facts .wrap{padding:26px 24px}
.facts div{gap:4px;font-size:14px}
.facts b{font:700 15px Inter;letter-spacing:0;color:var(--ink)}

/* How it works: numbered list + a quiet "at home" card */
.how-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);gap:56px;align-items:start}
.steps{list-style:none;margin:0;padding:0;counter-reset:step;display:block}
.step{display:grid;grid-template-columns:34px 1fr;gap:16px;padding:20px 0;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent;transition:none;overflow:visible}
.step:last-child{border-bottom:1px solid var(--line)}
.step::before{grid-row:1/span 2;counter-increment:step;content:counter(step);font:700 13px/1 Inter;color:var(--muted);display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--line);border-radius:50%;margin-top:1px;background:var(--card)}
.step h4{grid-column:2;margin:4px 0 6px;font:700 17px Inter}.step p{grid-column:2;margin:0;color:var(--muted);font-size:15px;line-height:1.5;max-width:46ch}
.step:hover{transform:none;box-shadow:none}
.care{background:var(--ink);color:var(--crema);border-radius:var(--radius-md);padding:30px 30px 26px;position:sticky;top:104px}
.care .eyebrow{color:rgba(246,241,232,.62)}
.care h3{font-size:clamp(30px,3vw,40px);line-height:.92;margin:12px 0 22px;letter-spacing:-.03em}
.care h3 em{font-style:normal;color:var(--yema)}
.care ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.care li{padding:13px 0;border-top:1px solid rgba(246,241,232,.14);font-size:15px;line-height:1.5;color:rgba(246,241,232,.74)}
.care li b{color:var(--crema);font-weight:700}

/* Story */
.story h2.q{font-size:clamp(34px,4.4vw,56px)}
.story{padding-block:0}.story .q{position:relative}.story .q::after{content:"";display:block;width:56px;height:6px;background:var(--yema);margin-top:22px;border-radius:999px}
.story p{font-size:17px;line-height:1.6}

/* Questions: one column of toggles with hairlines */
.faq{display:block;max-width:760px}
.faq details{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;padding:0;transition:none}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq details[open]{border-color:var(--line);box-shadow:none}
.faq summary{padding:18px 0;font:600 17px Inter;align-items:center}
.faq summary::after{content:"";width:9px;height:9px;border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);transform:rotate(45deg);transition:transform .2s var(--ease);margin-right:4px;flex:0 0 auto}
.faq details[open] summary::after{content:"";transform:rotate(-135deg)}
.faq p{font-size:15px;line-height:1.55;margin:0 0 20px;max-width:64ch}

/* Label information */
.legal{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;padding:22px 0 0;max-width:760px;font-size:14px;line-height:1.55}
.legal p{margin:0 0 10px}.legal p.muted{color:var(--muted)}
.legal .safe{font-size:14px;font-weight:600}

label.f input,label.f textarea{min-height:46px}
.cartbar .btn{min-height:44px}
/* Drawer and checkout */
.overlay{backdrop-filter:blur(5px);background:rgba(20,20,20,.4)}
.drawer{width:min(510px,100%);transition:transform .36s var(--ease);box-shadow:-30px 0 90px rgba(20,20,20,.22)}
.drawer .head{position:relative;z-index:4;background:rgba(246,241,232,.95);backdrop-filter:blur(12px);gap:10px}
.head-titles{flex:1;min-width:0}.head-titles h3{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.head-back{display:inline-flex;align-items:center;gap:6px;min-height:44px;min-width:44px;border:0;background:transparent;padding:0 6px 0 0;font:700 13px Inter;color:var(--ink);cursor:pointer;border-radius:8px}.head-back[hidden]{display:none}
.drawer.dragging{transition:none}
.drawer .list{overscroll-behavior:contain}
.cart-trust{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:11px 0 0;color:var(--muted);font-size:12px}.cart-trust span::before{content:"✓";color:var(--ink);font-weight:800;margin-right:4px}
.co-section{display:flex;flex-direction:column;gap:12px;padding:2px 0 10px}
.co-section+.co-section{border-top:1px solid var(--line);padding-top:18px}
.co-title{display:flex;gap:11px;align-items:flex-start}
.co-title>b{display:grid;place-items:center;flex:0 0 26px;height:26px;background:var(--ink);color:var(--yema);border-radius:50%;font-size:12px}
.co-title h4{margin:1px 0 2px;font:700 15px Inter}.co-title p{margin:0;color:var(--muted);font-size:13px}
.required{font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-left:5px;text-align:right}
label.f{font-size:12px}.label-line{display:flex;justify-content:space-between;gap:10px;align-items:baseline}.field-error{display:none;color:#A12B20;font:600 12px/1.35 Inter;margin-top:2px}
label.f.has-error input,label.f.has-error textarea{border-color:#C7392D;background:#FFF8F6}
label.f.has-error .field-error{display:block}
label.f input:focus,label.f textarea:focus{border-color:var(--ink);box-shadow:0 0 0 3px rgba(245,196,28,.24);outline:0}
.days button{min-height:58px;transition:transform .16s,border-color .16s,background .16s}.days button:not(:disabled):active{transform:scale(.98)}
.pickup-promise{display:flex;align-items:flex-start;gap:9px;background:#FDF3CC;border:1px solid #EBD48A;border-radius:12px;padding:10px 12px;font:600 12px/1.4 Inter}
.pickup-promise::before{content:"◷";font-size:16px;line-height:1}
.pay-opt{min-height:72px;transition:transform .16s,border-color .16s,background .16s,box-shadow .16s}.pay-opt:active{transform:scale(.985)}.pay-opt.on{box-shadow:0 0 0 1px var(--ink)}
.pay-check{margin-top:1px}
.check{min-height:44px;align-items:flex-start;padding:5px 0}.check input{width:20px;height:20px;flex:0 0 20px}
.checkout-foot{display:none;padding:13px 22px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:rgba(246,241,232,.97);backdrop-filter:blur(12px);z-index:5;box-shadow:0 -12px 30px rgba(20,20,20,.06)}
.checkout-foot.on{display:block}.checkout-foot .tot{margin:0 0 8px}.checkout-foot .savings{display:flex;justify-content:space-between;color:var(--muted);font:600 12px Inter;margin-bottom:5px}
.checkout-foot .co-note{margin:7px 0 0}.review-edit,.linkbtn{display:inline-flex;align-items:center;min-height:44px;padding:4px 0}.checkout-foot .back-link{display:block;text-align:center;margin-top:7px;border:0;background:none;text-decoration:underline;font:600 11px Inter;color:var(--muted);cursor:pointer}

/* Reveal motion only enhances; content remains visible without JS */
.reveal-ready [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal-ready [data-reveal].revealed{opacity:1;transform:none}

@media(max-width:760px){
  .availability{min-height:36px;padding-inline:14px}
  .hero{min-height:auto}
  .how-grid{grid-template-columns:1fr;gap:36px}.care{position:static}
}

@media(max-width:560px){
  .wrap{padding-inline:20px}
  header .wrap{height:60px;padding-inline:18px}header img{height:31px}.mobile-scope{display:block}.mobile-nav{display:none}.cartbtn{padding:7px 12px}
  .availability{font-size:11px}
  .hero{padding:20px 0 22px;gap:14px}.hero-brand{height:42px;margin:11px 0 6px}.hero h1{font-size:clamp(36px,10.2vw,46px);line-height:.9}.hero .lead{font-size:15px;line-height:1.52;max-width:34ch}
  .hero-actions{margin-top:19px}.hero-actions .btn{min-height:48px;padding:12px 20px}.hero-actions .text-link{min-height:44px;display:inline-flex;align-items:center}
  .hero-art{margin-top:0}.cake-big{width:48%;min-width:174px}
  .facts .wrap{display:flex;overflow:auto;gap:8px;padding:12px 14px;scroll-snap-type:x mandatory;scrollbar-width:none}.facts .wrap::-webkit-scrollbar{display:none}.facts .wrap>div,.facts .wrap>div:last-child{flex:0 0 78%;grid-column:auto;scroll-snap-align:start;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:11px 12px}.facts b{font-size:14px}
  section{padding:52px 0}.flavor-jump{margin-inline:-20px;padding-inline:20px}
  .cards{gap:10px}.card{grid-template-columns:132px 1fr;border-radius:17px}.card .body{padding:11px 12px;gap:5px}.card h3{font-size:20px}.card p{font-size:12.5px}.card .img{min-height:0}.card .cake{width:74%}.in-box{right:7px;top:7px;font-size:9px}
  .sizes{gap:5px}.sizes button{min-height:44px;padding:6px 10px}.add{min-height:44px;min-width:100px;padding:7px 10px}.allerg{font-size:10px}
  .step{padding:16px 0;gap:12px;grid-template-columns:28px 1fr}.step h4{font-size:15px;margin-top:3px}.step p{font-size:14px}
  .care{padding:22px 20px 16px;border-radius:18px}.care h3{font-size:27px;text-wrap:balance}.care li{font-size:14px;padding:11px 0}
  .faq summary{padding:15px 0;font-size:15.5px}.faq p{font-size:14px}
  h2.sec{font-size:clamp(30px,8.6vw,36px);margin-bottom:10px}.sub{font-size:15px;margin-bottom:22px}#faq,#legal{padding-top:52px}
  footer nav{width:100%;overflow:auto;gap:18px}
  .drawer{top:auto;height:min(94dvh,900px);border-radius:26px 26px 0 0;transform:translateY(104%);box-shadow:0 -30px 80px rgba(20,20,20,.26)}
  .drawer.open{transform:translateY(0)}
  .drawer::before{content:"";position:absolute;z-index:6;top:7px;left:50%;translate:-50% 0;width:38px;height:4px;border-radius:999px;background:rgba(20,20,20,.18)}
  .drawer .head{padding:20px 18px 12px;border-radius:26px 26px 0 0}.drawer .head h3{font-size:23px}.drawer .head .cartbtn{min-height:44px}
  .drawer .list{padding:10px 18px}.drawer .foot{padding:13px 18px calc(14px + env(safe-area-inset-bottom))}
  .checkout-foot{padding-inline:18px}.checkout-foot .back-link{display:none}
  .line{grid-template-columns:40px 1fr auto;gap:9px}.dot{width:40px;height:40px}
  .co{gap:13px}.review{padding:12px}.days{gap:7px}.days button{padding:9px;min-height:60px}
  .pay-opt{padding:12px;min-height:74px}.pay h4{font-size:13px}.pay p{font-size:12px}
  .cartbar{width:calc(100% - 24px);padding-left:16px}.cartbar .btn{min-height:44px}
  .toast{bottom:calc(78px + env(safe-area-inset-bottom));max-width:calc(100% - 32px);white-space:normal;text-align:center;width:max-content}
  body.drawer-open .toast{top:calc(10px + env(safe-area-inset-top));bottom:auto}
}

@media(prefers-reduced-motion:reduce){
  .cake-big{animation:none}.reveal-ready [data-reveal]{opacity:1;transform:none}.card,.card .cake{transition:none}
}

/* Toast with an action (Undo) */
.toast{display:flex;align-items:center;gap:12px;justify-content:center;font-variant-numeric:tabular-nums}
.toast.actionable{pointer-events:auto;padding:6px 6px 6px 16px}
.toast-action{border:0;background:var(--yema);color:var(--ink);border-radius:999px;padding:8px 14px;min-height:36px;font:700 13px Inter;cursor:pointer}
.toast-action[hidden]{display:none}
body.drawer-open .toast{z-index:45}

/* Footer: lines, not dot-joined meta */
footer .wrap{align-items:flex-start}
.foot-nav{display:flex;flex-wrap:wrap;gap:8px 18px;font:600 12px Inter;letter-spacing:.06em;text-transform:uppercase}.foot-nav a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.foot-contact{display:flex;flex-direction:column;gap:0}.foot-contact a{text-decoration:none;color:var(--ink);font-weight:600;min-height:44px;display:inline-flex;align-items:center}
.foot-copy{align-self:center}

/* Sticky action bars must not hide focused fields */
.drawer .list.co{scroll-padding-bottom:180px}

@media(max-width:560px){
  /* Hero: eyebrow and headline full width, lead beside a smaller cake */
  .hero{display:grid;grid-template-columns:minmax(0,1fr) 36%;grid-template-areas:"eyebrow eyebrow" "h1 h1" "lead art" "actions actions";column-gap:14px;row-gap:0;align-items:center;padding:18px 0 20px}
  .hero-copy{display:contents}
  .hero .eyebrow{grid-area:eyebrow;margin-bottom:10px}.eyebrow-loc{display:none}.hero h1{grid-area:h1;margin-bottom:14px}
  .hero .lead{grid-area:lead;font-size:15px;line-height:1.5;margin:0;max-width:none}
  .hero-art{grid-area:art;margin:0;justify-self:end;width:100%;filter:drop-shadow(0 16px 26px rgba(20,20,20,.12))}
  .cake-big{width:100%;min-width:0;margin:0;box-shadow:0 18px 40px rgba(0,0,0,.18)}
  .hero-actions{grid-area:actions;margin-top:20px;gap:8px 14px}
  .hero-actions .btn{flex:1 1 auto;justify-content:center}
  .story{gap:14px}.story .q::after{margin-top:14px}
  footer .wrap{flex-direction:column;align-items:flex-start;gap:16px}.foot-nav{width:100%;overflow:visible}.foot-copy{align-self:flex-start}
  .head-back{padding-right:2px}.drawer.is-checkout .head-titles h3{font-size:20px}
  .drawer .head{touch-action:none;user-select:none;-webkit-user-select:none}
  .availability{font-size:12px}
  .allerg{font-size:12px}.in-box{font-size:11px;padding:3px 8px}
  .row{flex-direction:column;align-items:stretch;gap:6px;margin-top:2px}.row .add{order:1;width:100%;min-width:0;justify-content:center;padding:10px 12px}.row .allerg{order:2;font-size:12px;line-height:1.3}
  .facts .wrap{display:grid;grid-template-columns:1fr;gap:0;padding:6px 20px 8px;overflow:visible}.facts .wrap>div,.facts .wrap>div:last-child{flex:none;border:0;border-top:1px solid var(--line);background:transparent;padding:12px 0;border-radius:0}.facts .wrap>div:first-child{border-top:0}.facts b{font-size:15px}.facts span{font-size:13px}
}
