/* Maple & Crumb — Bakery | Soft pastel whimsical */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
:root{
  --cream:#fffaf3; --pink:#fbdfe6; --mint:#dcf0e2; --ink:#4a3b3c; --brown:#a9694a;
  --display:'Fredoka',sans-serif; --sans:'Quicksand',sans-serif;
}
body{background:var(--cream);color:var(--ink);font-family:var(--sans);font-weight:500;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--display);font-weight:600}
:focus-visible{outline:2px solid var(--brown);outline-offset:3px}

.header{display:flex;justify-content:space-between;align-items:center;padding:1.2rem clamp(1.2rem,4vw,3rem);position:sticky;top:0;z-index:40;background:rgba(255,250,243,.9);backdrop-filter:blur(8px)}
.logo{font-family:var(--display);font-size:1.3rem}
header nav{display:flex;gap:1.8rem;font-weight:600;font-size:.9rem}
header nav a:hover{color:var(--brown)}
.menu-btn{display:none;background:var(--pink);border:none;width:40px;height:40px;border-radius:50%}
.mobile-nav{display:none;flex-direction:column;background:var(--cream);border-bottom:2px solid var(--pink)}
.mobile-nav.open{display:flex}
.mobile-nav a{padding:1rem 1.5rem;border-top:1px solid var(--pink);font-weight:600}

.hero{position:relative;display:grid;grid-template-columns:1.1fr 1fr;gap:2rem;align-items:center;max-width:1280px;margin:0 auto;padding:clamp(2rem,6vw,4rem) 1.5rem;overflow:hidden}
.blob{position:absolute;border-radius:50%;filter:blur(10px);opacity:.6;z-index:0}
.blob-1{width:280px;height:280px;background:var(--pink);top:-80px;left:-80px}
.blob-2{width:220px;height:220px;background:var(--mint);bottom:-60px;right:10%}
.hero-copy,.hero img{position:relative;z-index:1}
.hero-copy h1{font-size:clamp(2.2rem,5vw,3.2rem);line-height:1.15;margin-bottom:1.2rem;color:var(--brown)}
.hero-copy p{max-width:40ch;margin-bottom:1.8rem}
.hero img{border-radius:32px;box-shadow:0 16px 32px rgba(169,105,74,.18)}
.btn{display:inline-block;background:var(--brown);color:#fff;padding:.95rem 1.9rem;border-radius:100px;font-weight:600;border:none;cursor:pointer;transition:.25s;box-shadow:0 8px 18px rgba(169,105,74,.3)}
.btn:hover{transform:translateY(-2px)}
.btn-block{width:100%;text-align:center}

.daily{max-width:1280px;margin:0 auto;padding:clamp(3rem,6vw,5rem) 1.5rem}
.daily h2,.cake h2,.visit h2{text-align:center;font-size:clamp(1.8rem,4vw,2.4rem);margin-bottom:2rem;color:var(--brown)}
.bake-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.3rem}
.bake-card{position:relative;background:#fff;border-radius:20px;overflow:hidden;padding:1rem;text-align:center;box-shadow:0 8px 20px rgba(169,105,74,.08);transition:.25s}
.bake-card:hover{transform:translateY(-6px)}
.bake-card img{border-radius:14px;margin-bottom:.8rem;aspect-ratio:5/4;object-fit:cover}
.bake-card p{color:var(--brown);font-weight:600}
.bake-card.sold-out img{filter:grayscale(.6);opacity:.6}
.badge{position:absolute;top:1rem;left:1rem;background:var(--ink);color:#fff;font-size:.7rem;padding:.3rem .6rem;border-radius:100px;font-weight:600}

.cake{max-width:1100px;margin:0 auto;padding:clamp(3rem,6vw,5rem) 1.5rem}
.cake-builder{display:grid;grid-template-columns:1fr 1.2fr;gap:3rem;align-items:center;background:#fff;border-radius:24px;padding:clamp(1.5rem,4vw,3rem);box-shadow:0 10px 30px rgba(169,105,74,.1)}
.cake-preview{text-align:center}
.cake-visual{width:200px;height:160px;margin:0 auto 1rem;position:relative}
.cake-layer{position:absolute;left:10%;width:80%;border-radius:12px;transition:background .3s}
#layer1{bottom:0;height:60%;background:var(--flavor-color,#f6e7c8)}
#layer2{bottom:55%;left:18%;width:64%;height:45%;background:var(--flavor-color,#f6e7c8);filter:brightness(1.08)}
.cake-msg{font-family:var(--display);color:var(--brown);font-size:1.1rem}
.option-label{font-weight:700;margin-bottom:.6rem;font-size:.9rem}
.option-group{margin-bottom:1.4rem}
.pill-row{display:flex;gap:.6rem;flex-wrap:wrap}
.pill{background:var(--cream);border:2px solid transparent;padding:.6rem 1.1rem;border-radius:100px;cursor:pointer;font-weight:600;font-size:.85rem}
.pill.active{border-color:var(--brown);background:#fff}
#cakeMsg{width:100%;padding:.7rem 1rem;border-radius:10px;border:2px solid var(--pink);font-family:inherit}
.cake-total{margin:1rem 0;font-size:1.15rem}
.cake-total strong{color:var(--brown)}
.form-note{margin-top:1rem;color:var(--brown);font-weight:600}

.visit{max-width:900px;margin:0 auto;padding:clamp(3rem,6vw,5rem) 1.5rem;text-align:center}

.footer{text-align:center;padding:2.5rem;border-top:2px solid var(--pink)}
.footer p:last-child{font-size:.8rem;color:#8a7060;margin-top:.4rem}

@media (max-width:900px){
  header nav{display:none}
  .menu-btn{display:block}
  .hero{grid-template-columns:1fr}
  .hero img{order:-1}
  .bake-grid{grid-template-columns:repeat(2,1fr)}
  .cake-builder{grid-template-columns:1fr}
}
@media (max-width:520px){
  .bake-grid{grid-template-columns:1fr}
}
