@font-face{font-family:"Young Serif";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/young-serif-latin-400-normal.woff2) format("woff2");}
@font-face{font-family:"Work Sans";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/work-sans-latin-400-normal.woff2) format("woff2");}
@font-face{font-family:"Work Sans";font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/work-sans-latin-600-normal.woff2) format("woff2");}

:root{
  --bg:#FBF6EC;
  --band:#F2E7D2;
  --board:#2B1D14;
  --board-ink:#F6EBD6;
  --ink:#2B1D14;
  --muted:#6A5646;
  --accent:#A8431F;
  --accent-dark:#862F12;
  --line:#DBC9A8;
  --display:"Young Serif", Georgia, "Times New Roman", serif;
  --sans:"Work Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:48px;--s6:64px;--s7:96px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:1.0625rem;line-height:1.65;}
a{color:var(--accent-dark);text-underline-offset:4px;text-decoration-thickness:2px;}
a,button{touch-action:manipulation;}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;}
.wrap{width:100%;max-width:1040px;margin:0 auto;padding:0 20px;}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:10px 16px;z-index:10;}
.skip:focus{left:8px;}
[hidden]{display:none !important;}

h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.1;letter-spacing:-.01em;margin:0;text-wrap:balance;}
h1{font-size:clamp(2.6rem,9vw,5rem);}
h2{font-size:clamp(1.8rem,5vw,2.5rem);margin-bottom:var(--s2);}
h3{font-size:1.35rem;margin-bottom:var(--s1);}
p{margin:0 0 var(--s2);max-width:60ch;}

/* sample strip: delete the element when the owner confirms the details */
.sample{background:var(--board);color:var(--board-ink);font-size:.9rem;padding:8px 0;}
.sample p{margin:0;max-width:none;}

/* header */
.head{padding:var(--s1) 0;border-bottom:2px solid var(--ink);}
.head .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0 var(--s3);}
.brand{font-family:var(--display);font-size:1.4rem;color:var(--ink);text-decoration:none;min-height:44px;display:inline-flex;align-items:center;}
nav{display:flex;flex-wrap:wrap;align-items:center;gap:0 var(--s3);font-weight:600;}
nav a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);text-decoration:none;}
nav a:hover,nav a[aria-current="page"]{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px;}
nav a.order{color:var(--accent-dark);}

/* hero */
.hero{padding:var(--s6) 0 var(--s6);}
.hero .wrap{display:grid;gap:var(--s5);}
.where{font-weight:600;color:var(--muted);margin:0 0 var(--s2);letter-spacing:.04em;text-transform:uppercase;font-size:.85rem;}
.lead{font-size:1.25rem;margin:var(--s3) 0 var(--s4);max-width:34ch;}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s3);}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;background:var(--accent);color:#fff;font:600 1.05rem var(--sans);text-decoration:none;border:2px solid var(--accent);border-radius:4px;cursor:pointer;transition:background-color .15s ease;}
.btn:hover{background:var(--accent-dark);border-color:var(--accent-dark);}
.btn[aria-disabled="true"]{background:#C9B79B;border-color:#C9B79B;color:#3B2A1E;cursor:not-allowed;}
.textlink{font-weight:600;}

/* chalkboard */
.board{background:var(--board);color:var(--board-ink);padding:var(--s4) var(--s3);border-radius:6px;box-shadow:0 0 0 6px var(--bg),0 0 0 8px var(--ink);}
.board h2{color:var(--board-ink);font-size:1.7rem;margin-bottom:var(--s2);}
.board p{max-width:none;}
.board .small{font-size:.9rem;opacity:.85;margin-top:var(--s2);margin-bottom:0;}

/* price list with dotted leaders */
.list{list-style:none;margin:0;padding:0;}
.list li{display:flex;align-items:baseline;gap:var(--s1);padding:6px 0;}
.list .dots{flex:1;border-bottom:2px dotted currentColor;opacity:.4;transform:translateY(-4px);min-width:16px;}
.list .price{font-weight:600;white-space:nowrap;}
.list .note{display:block;font-size:.9rem;opacity:.8;}

/* sections */
.band{padding:var(--s6) 0;border-top:2px solid var(--ink);}
.band.tint{background:var(--band);}
.split{display:grid;gap:var(--s5);}
dl{margin:0;display:grid;gap:var(--s3);}
dt{font-size:.85rem;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;}
dd{margin:2px 0 0;font-size:1.2rem;font-weight:600;}
.steps{list-style:none;counter-reset:s;margin:0;padding:0;display:grid;gap:var(--s3);}
.steps li{counter-increment:s;padding-left:56px;position:relative;max-width:52ch;}
.steps li::before{content:counter(s);position:absolute;left:0;top:-2px;width:40px;height:40px;border-radius:50%;background:var(--ink);color:var(--bg);font:1.2rem/40px var(--display);text-align:center;}
.steps strong{display:block;font-family:var(--display);font-weight:400;font-size:1.2rem;}

/* order page */
.menu h2{margin-top:var(--s5);}
.menu h2:first-of-type{margin-top:0;}
.item{display:grid;grid-template-columns:1fr auto;gap:var(--s1) var(--s2);align-items:center;padding:var(--s2) 0;border-bottom:1px solid var(--line);}
.item .name{font-weight:600;font-size:1.1rem;margin:0;}
.item .desc{grid-column:1;margin:0;color:var(--muted);font-size:.95rem;}
.item .price{color:var(--muted);font-weight:400;}
.qty{display:inline-flex;align-items:center;grid-column:2;grid-row:1 / span 2;}
.qty button{width:44px;height:44px;border:2px solid var(--ink);background:var(--bg);color:var(--ink);font:600 1.4rem/1 var(--sans);cursor:pointer;}
.qty button:hover{background:var(--band);}
.qty button:first-child{border-radius:4px 0 0 4px;}
.qty button:last-child{border-radius:0 4px 4px 0;}
.qty input{width:52px;height:44px;border:2px solid var(--ink);border-left:0;border-right:0;border-radius:0;text-align:center;font:600 1.05rem var(--sans);background:#fff;color:var(--ink);-moz-appearance:textfield;appearance:textfield;}
.qty input::-webkit-outer-spin-button,.qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.cart{background:var(--board);color:var(--board-ink);padding:var(--s4) var(--s3);border-radius:6px;}
.cart h2{color:var(--board-ink);}
.cart .empty{margin:0 0 var(--s3);}
.cart .total{display:flex;justify-content:space-between;font-family:var(--display);font-size:1.5rem;border-top:2px solid var(--board-ink);padding-top:var(--s2);margin:var(--s2) 0 var(--s3);}
.field{margin-bottom:var(--s3);}
.field label{display:block;font-weight:600;margin-bottom:6px;}
.field input,.field textarea{width:100%;min-height:48px;padding:10px 12px;border:2px solid var(--board-ink);border-radius:4px;background:#fff;color:var(--ink);font:1.05rem var(--sans);}
.field textarea{min-height:88px;resize:vertical;}
.field .hint{font-size:.9rem;opacity:.85;margin:6px 0 0;}
.error{background:#FBE1D6;color:#6B1D07;padding:10px 14px;border-radius:4px;margin:0 0 var(--s2);font-weight:600;}
.cart .btn{width:100%;background:var(--bg);color:var(--ink);border-color:var(--bg);}
.cart .btn:hover{background:var(--band);border-color:var(--band);}
.cart .btn[aria-disabled="true"]{background:#7A6654;border-color:#7A6654;color:#F6EBD6;}
.cart a:not(.btn){color:var(--board-ink);}
.cart :focus-visible{outline-color:var(--board-ink);}

.foot{padding:var(--s4) 0;border-top:2px solid var(--ink);background:var(--band);font-size:.95rem;color:var(--muted);}
.foot .wrap{display:grid;gap:var(--s1);}
.foot p{margin:0;max-width:none;}

/* placeholders: hidden for visitors, shown with ?preview on the address */
[data-todo]{display:none;}
.preview [data-todo]{display:block;border:2px dashed #B3341C;background:rgba(179,52,28,.06);color:#8F2815;padding:var(--s2) var(--s3);margin:var(--s2) 0;font-size:.95rem;max-width:60ch;}
.preview section[data-todo]{max-width:none;}

@media (min-width:820px){
  .hero .wrap{grid-template-columns:1.1fr .9fr;align-items:center;}
  .split{grid-template-columns:1fr 1fr;align-items:start;}
  .order-layout{display:grid;grid-template-columns:1.25fr .85fr;gap:var(--s6);align-items:start;}
  .cart{position:sticky;top:var(--s2);}
  .foot .wrap{grid-template-columns:1fr auto;}
}
@media (prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important;scroll-behavior:auto !important;}}
.cart .hint{font-size:.9rem;opacity:.85;margin:var(--s2) 0 0;}
.board a{color:var(--board-ink);}
.board :focus-visible{outline-color:var(--board-ink);}