:root{
  --oat:#f8f0dc; --paper:#fffaf0; --butter:#f4c542; --butter-l:#fbe9a8;
  --sage:#34553a; --sage-l:#dfe9d3; --clay:#c8532a; --ink:#2a2820; --muted:#645f50;
  --rule:rgba(42,40,32,.18);
  --display:'Bagel Fat One',Georgia,serif; --body:'Figtree',system-ui,sans-serif;
}
html{scroll-behavior:smooth;scroll-padding-top:150px}
body{font-family:var(--body);background:var(--oat);color:var(--ink);font-size:1.0625rem;line-height:1.65;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--display);font-weight:400;line-height:1.08;color:var(--sage)}
h2{font-size:clamp(2.1rem,5vw,3.4rem);margin-bottom:1rem}
a{color:var(--clay)}
img{max-width:100%;height:auto}
.eyebrow{font-weight:800;font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;color:var(--clay);margin-bottom:.6rem}
.section{padding:5.5rem 0;position:relative}
.lead-copy{font-size:1.2rem;max-width:58ch}
.btn-wf{background:var(--clay);color:#fff;border:3px solid var(--ink);border-radius:999px;font-weight:800;padding:.7rem 1.6rem;box-shadow:4px 4px 0 var(--ink);transition:transform .15s,box-shadow .15s}
.btn-wf:hover{color:#fff;transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink)}
.btn-wf-alt{background:var(--butter);color:var(--ink)}
.btn-wf-alt:hover{color:var(--ink)}

/* nav: centered logo over a row of links */
.site-nav{background:var(--paper);border-bottom:3px solid var(--ink);padding:.5rem 0}
.site-nav .brand{display:flex;flex-direction:column;align-items:center;text-decoration:none;margin:0 auto}
.site-nav .brand img{height:64px;width:auto}
.site-nav .brand span{font-family:var(--display);color:var(--sage);font-size:1.5rem;line-height:1.1}
.site-nav .nav-link{color:var(--ink);font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:.85rem;padding:.5rem 1rem}
.site-nav .nav-link:hover{color:var(--clay)}
.navbar.site-nav .navbar-collapse{justify-content:center}
.navbar.site-nav .navbar-nav{flex-wrap:wrap;justify-content:center}
.navbar-toggler{border:3px solid var(--ink);position:absolute;right:12px;top:18px}
.nav-top{display:flex;justify-content:center;width:100%}

/* hero: mosaic + color block on marble */
.hero{background:var(--sage-l) url('img/hero.webp') center/cover;border-bottom:3px solid var(--ink);padding:3.5rem 0 4rem;position:relative;overflow:hidden}
.hero-block{background:var(--butter);border:3px solid var(--ink);border-radius:28px;padding:2.5rem 2.25rem;box-shadow:8px 8px 0 var(--ink);height:100%}
.hero-block h1{font-size:clamp(2.6rem,6.2vw,4.6rem);color:var(--ink);margin-bottom:1rem}
.hero-block h1 em{font-style:normal;color:var(--clay)}
.hero-block p{font-size:1.2rem;color:var(--ink)}
.hero-block .eyebrow{color:var(--sage)}
.tile{border:3px solid var(--ink);border-radius:22px;overflow:hidden;box-shadow:6px 6px 0 var(--ink);background:#fff;height:100%}
.tile img{width:100%;height:100%;object-fit:cover;display:block}
.tile-a{transform:rotate(-2deg)}.tile-b{transform:rotate(1.5deg)}.tile-c{transform:rotate(-1deg)}
.hero-mosaic{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:230px 190px;gap:1.1rem}
.hero-mosaic .tile-a{grid-column:1 / 2;grid-row:1 / 3}
.pill-row{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.5rem}
.pill{border:2px solid var(--ink);border-radius:999px;padding:.2rem .85rem;font-weight:800;font-size:.85rem;background:var(--paper)}

/* signature: bread scoring slashes */
.score{display:block;width:100%;height:34px;color:var(--ink);opacity:.9}
.score-band{background:var(--oat);padding:.25rem 0}
.score-rev{color:var(--oat)}

/* marquee */
.ticker{background:var(--ink);color:var(--butter);overflow:hidden;white-space:nowrap;padding:.7rem 0;font-family:var(--display);font-size:1.25rem}
.ticker-track{display:inline-block;animation:tick 40s linear infinite}
.ticker span{margin:0 1.25rem}
@keyframes tick{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.ticker-track{animation:none}}

/* about / process */
.about{background:var(--paper)}
.steps{list-style:none;padding:0;margin:2rem 0 0;counter-reset:s}
.steps li{counter-increment:s;display:flex;gap:1rem;padding:1rem 0;border-bottom:2px dashed var(--rule)}
.steps li::before{content:counter(s);flex:0 0 2.6rem;height:2.6rem;border-radius:50%;background:var(--butter);border:3px solid var(--ink);display:grid;place-items:center;font-family:var(--display)}
.ticket{background:var(--butter-l);border:3px solid var(--ink);border-radius:18px;padding:1.75rem;position:relative;box-shadow:6px 6px 0 var(--ink);transform:rotate(1deg)}
.ticket::before,.ticket::after{content:"";position:absolute;top:50%;width:26px;height:26px;border-radius:50%;background:var(--paper);border:3px solid var(--ink)}
.ticket::before{left:-15px}.ticket::after{right:-15px}
.ticket h3{color:var(--ink)}
.ticket .big{font-family:var(--display);font-size:2.6rem;color:var(--clay);line-height:1}

/* menu index */
.menu{background:var(--sage);color:var(--paper)}
.menu h2,.menu .eyebrow{color:var(--butter)}
.menu .lead-copy{color:var(--paper)}
.menu-group{color:var(--ink);background:var(--butter);display:inline-block;padding:.25rem 1rem;border-radius:999px;border:3px solid var(--ink);font-size:1.3rem;margin:2rem 0 1rem;transform:rotate(-1.5deg)}
.menu-list{list-style:none;padding:0;margin:0}
.menu-list li{display:flex;align-items:baseline;gap:.5rem;padding:.4rem 0}
.mi-name{font-weight:700}
.mi-qty{color:var(--butter-l);font-size:.9rem}
.mi-dots{flex:1;border-bottom:2px dotted rgba(255,250,240,.5);transform:translateY(-4px);min-width:16px}
.mi-price{font-family:var(--display);color:var(--butter);font-size:1.25rem}
.menu-note{border-top:2px dashed rgba(255,250,240,.45);margin-top:2.5rem;padding-top:1.5rem}

/* gallery */
.gallery{background:var(--oat)}
.g-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.g-grid .tile{aspect-ratio:1/1;border-radius:20px}
.g-grid .tile:nth-child(2n){transform:rotate(1.2deg)}.g-grid .tile:nth-child(2n+1){transform:rotate(-1deg)}
.g-wide{grid-column:span 2}
.g-wide.tile{aspect-ratio:2/1}

/* stockists */
.stock{background:var(--butter)}
.stock h2{color:var(--ink)}
.stock-list{columns:3 220px;column-gap:2rem;list-style:none;padding:0;margin:1.5rem 0 0}
.stock-list li{break-inside:avoid;padding:.45rem 0;border-bottom:2px dashed rgba(42,40,32,.3)}
.stock-list b{display:block;font-weight:800}
.stock-list small{color:var(--ink);opacity:.8}

/* wholesale + gift */
.duo .panel{border:3px solid var(--ink);border-radius:24px;padding:2.25rem;height:100%;box-shadow:6px 6px 0 var(--ink)}
.panel-w{background:var(--paper)}.panel-g{background:var(--clay);color:#fff}
.panel-g h2{color:#fff}
.panel-g .btn-wf{background:var(--butter);color:var(--ink)}
.press{background:var(--paper);border-top:3px solid var(--ink);border-bottom:3px solid var(--ink)}
.press img{max-width:260px}

/* visit */
.visit{background:var(--sage-l)}
.visit dt{font-weight:800;text-transform:uppercase;letter-spacing:.1em;font-size:.8rem;color:var(--clay);margin-top:1.1rem}
.visit dd{margin:0;font-size:1.15rem}
.map{border:3px solid var(--ink);border-radius:22px;overflow:hidden;box-shadow:6px 6px 0 var(--ink);height:100%;min-height:380px}
.map iframe{width:100%;height:100%;min-height:380px;border:0;display:block}

footer{background:var(--ink);color:var(--oat);padding:3rem 0 1.5rem}
footer a{color:var(--butter)}
footer .f-logo{background:var(--paper);border-radius:14px;padding:.5rem .75rem;display:inline-block}
footer .f-logo img{height:56px;width:auto}
.powered{border-top:1px solid rgba(248,240,220,.25);margin-top:2rem;padding-top:1rem;font-size:.9rem}
.disclaimer{font-size:.78rem;opacity:.7;margin-top:.75rem}
@media (max-width:991px){
  .site-nav .brand{margin:0 auto}
  .hero-mosaic{grid-template-rows:200px 160px}
  .g-grid{grid-template-columns:repeat(2,1fr)}
  .section{padding:4rem 0}
}
@media (max-width:575px){.hero-block{padding:1.75rem 1.4rem}.hero-mosaic{grid-template-rows:170px 140px}}