/* ===========================================================
   SUNDAY CRUMB — neighbourhood bakery
   Fraunces display / Karla UI. Cream paper, terracotta, butter.
   Soft blob shapes, warm shadows, hand-lettered accent.
   =========================================================== */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400&family=Karla:wght@400;500;600;700&family=Caveat:wght@500;600&display=swap');

:root{
  --font-display:'Fraunces',Georgia,serif;
  --font-body:'Karla',system-ui,sans-serif;
  --font-ui:'Karla',sans-serif;
  --font-quote:'Fraunces',Georgia,serif;
  --font-hand:'Caveat',cursive;

  --bg:#fbf1e3; --fg:#4a2b1c; --muted:#8a6650; --line:#e6d2bb;
  --surface:#fffaf2; --tint:#f5e4ce; --accent:#c2683a; --on-accent:#fffaf2;
  --ink-bg:#52301f; --ink-fg:#fdf3e6; --ink-muted:#e0c2a6;
  --head-bg:rgba(251,241,227,.88);
  --bar-bg:#f5e4ce; --bar-fg:#4a2b1c; --bar-line:#e6d2bb;
  --hero-scrim:linear-gradient(84deg,rgba(60,32,18,.84) 4%,rgba(60,32,18,.24) 62%),
               linear-gradient(0deg,rgba(60,32,18,.66),transparent 52%);
  --hero-kicker:#f3c98f;
  --shadow-sm:0 20px 46px rgba(102,60,34,.17);

  --h1:clamp(46px,6vw,88px); --h1-weight:500; --h1-lh:1.02; --h1-tracking:-.025em;
  --hero-p:18.5px; --hero-max:780px; --hero-h:84vh;
  --logo-size:24px; --logo-weight:600; --logo-tracking:-.02em;
  --menu-size:14px; --menu-weight:600; --menu-gap:28px;
  --btn-radius:999px; --btn-pad:15px 28px; --btn-size:13.5px; --btn-weight:700;
  --card-radius:28px; --img-radius:28px; --card-pad:32px; --card-h:23px;
  --kicker-tracking:.2em; --section-pad:94px;
  --quote-size:clamp(24px,2.8vw,36px);
  --dock-bg:rgba(255,250,242,.92); --dock-bg-solid:#fffaf2; --dock-line:#e6d2bb;
  --dock-seg:#f5e4ce; --dock-active:#fffaf2; --dock-fg:#4a2b1c; --dock-muted:#8a6650;
}
html[data-theme="dark"]{
  --bg:#211510; --fg:#f8e9d8; --muted:#c3a08a; --line:#3a2619;
  --surface:#2b1b12; --tint:#2b1b12; --accent:#e08a56; --on-accent:#211510;
  --ink-bg:#160d09; --ink-fg:#f8e9d8; --ink-muted:#d4b398;
  --head-bg:rgba(33,21,16,.88); --bar-bg:#2b1b12; --bar-fg:#f8e9d8; --bar-line:#3a2619;
  --dock-bg:rgba(43,27,18,.93); --dock-bg-solid:#2b1b12; --dock-line:#3a2619;
  --dock-seg:#33200f; --dock-active:#3f281a; --dock-fg:#f8e9d8; --dock-muted:#c3a08a;
  color-scheme:dark;
}
h2{font-size:clamp(34px,4.2vw,58px);line-height:1.05;letter-spacing:-.03em;font-weight:500}
h3{font-weight:600;letter-spacing:-.02em}
.hand{font-family:var(--font-hand);font-size:27px;color:var(--accent);
  transform:rotate(-3deg);display:inline-block}
.mosaic .shot:first-child{border-radius:170px 28px 28px 28px}
.mosaic .shot:nth-child(3){border-radius:28px 28px 170px 28px}
.board{background:var(--surface);border:2px dashed var(--line);border-radius:30px;padding:36px}
.board .row{border-bottom:1px dashed var(--line)}
.board .sold{color:var(--muted);text-decoration:line-through;opacity:.6}
.chip{display:inline-block;padding:6px 13px;margin:3px 4px 3px 0;border-radius:999px;
  background:var(--tint);font-size:11.5px;font-weight:600;color:var(--muted)}
.chip.hot{background:var(--accent);color:var(--on-accent)}
.bakecard{text-align:center}
.bakecard .shot{height:220px;border-radius:999px 999px 26px 26px;margin-bottom:20px}
.bakecard h3{font-size:22px;margin-bottom:6px}
.bakecard .price{font-family:var(--font-display);color:var(--accent);font-size:17px}


/* Distinctive bakery direction: friendly counter labels */
.concept-tabs--bakery{background:#fffaf2;border-bottom:2px dashed #e6d2bb}
.concept-tabs--bakery .wrap{gap:10px}
.concept-tabs--bakery a{border-radius:999px;background:#f5e4ce;color:#6f4934;font-size:13px}
.concept-tabs--bakery a[aria-current="page"]{transform:rotate(-2deg);box-shadow:0 6px 14px rgba(102,60,34,.15)}
.concept-tabs--bakery a:nth-child(2n){transform:rotate(1deg)}
.hero{--hero-pos:58% 55%;border-radius:0 0 42% 0 / 0 0 10% 0}
.hero-inner{margin-left:6%;max-width:760px}
.section:nth-of-type(odd) h2::after{content:'fresh today';display:block;font-family:var(--font-hand);font-size:25px;color:var(--accent);letter-spacing:0;transform:rotate(-2deg);margin-top:8px}
.bakecard:nth-child(2){transform:translateY(24px)}
@media(max-width:860px){.hero{--hero-mobile-pos:52% 55%;border-radius:0 0 18% 0 / 0 0 4% 0}.bakecard:nth-child(2){transform:none}}
