@font-face{font-family:"Shrikhand";src:url(fonts/shrikhand.woff) format("woff");font-display:swap}
@font-face{font-family:"Work Sans";src:url(fonts/worksans-400.woff) format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Work Sans";src:url(fonts/worksans-600.woff) format("woff");font-weight:600;font-display:swap}
@font-face{font-family:"Work Sans";src:url(fonts/worksans-700.woff) format("woff");font-weight:700;font-display:swap}
:root{--red:#D7261E;--red-dk:#B81F18;--mustard:#F4B400;--black:#161412;--cream:#F3EADB;--ink-soft:#3A332D;--line:#d8cdb9;--max:1120px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;font-family:"Work Sans",system-ui,sans-serif;color:var(--black);background:var(--cream);line-height:1.5;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
.s{font-family:"Shrikhand",Georgia,serif;font-weight:400;line-height:1.05}
.tilt{transform:rotate(-4deg)}
.cap{font-weight:700;text-transform:uppercase;letter-spacing:.18em;font-size:.82rem}
.skip{position:absolute;left:-999px;top:8px;background:var(--black);color:var(--cream);padding:8px 12px;z-index:99}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--mustard);outline-offset:3px}

/* header */
header.top{position:sticky;top:0;z-index:50;background:var(--black);color:var(--cream)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:64px;gap:16px}
.top .brand{font-size:1.45rem;color:var(--mustard);text-decoration:none;white-space:nowrap}
.top nav{display:flex;gap:22px;align-items:center}
.top nav a{text-decoration:none;font-weight:600;font-size:.95rem;opacity:.9}
.top nav a:hover{opacity:1;color:var(--mustard)}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--mustard);color:var(--black);font-weight:700;text-decoration:none;border-radius:999px;padding:12px 22px;border:3px solid var(--black);box-shadow:4px 4px 0 var(--black);transition:transform .12s,box-shadow .12s;font-size:1rem;cursor:pointer}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--black)}
.btn.small{padding:8px 16px;font-size:.9rem;box-shadow:3px 3px 0 var(--red)}
.btn.ghost{background:var(--cream)}
.btn.red{background:var(--red);color:var(--cream)}


/* hero */
.hero{background:var(--red);color:var(--cream);position:relative;overflow:hidden}
.hero .wrap{padding-top:56px;padding-bottom:72px;display:grid;grid-template-columns:1.4fr .8fr;gap:32px;align-items:center}
.hero h1{margin:14px 0 0;font-size:clamp(4rem,12vw,8.5rem)}
.hero h1 span{display:block;text-shadow:.06em .06em 0 var(--black)}
.hero h1 .l2{color:var(--mustard)}
.hero .tag{margin:28px 0 0;font-size:1rem}
.status{display:inline-flex;align-items:center;gap:10px;background:var(--black);color:var(--cream);border-radius:999px;padding:10px 18px;font-weight:600;margin-top:26px}
.status i{width:10px;height:10px;border-radius:50%;background:var(--mustard);display:inline-block}
.status.open i{background:#6BD66B}
.hero .ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px}
.badge{width:min(300px,70vw);aspect-ratio:1;border-radius:50%;background:var(--mustard);border:10px solid var(--black);display:flex;align-items:center;justify-content:center;transform:rotate(9deg);justify-self:center;box-shadow:12px 12px 0 var(--red-dk)}
.badge div{width:84%;height:84%;border-radius:50%;border:4px solid var(--black);display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--black)}
.badge .s{font-size:clamp(2rem,4.5vw,3rem)}
.badge .cap{margin-top:8px;letter-spacing:.35em}
@media (max-width:820px){.hero .wrap{grid-template-columns:1fr}}
.stripe{height:18px;background:repeating-linear-gradient(90deg,var(--red) 0 34px,var(--cream) 34px 68px)}

/* sections */
section{padding:84px 0}
.kicker{color:var(--red)}
h2{font-size:clamp(2.6rem,6vw,4rem);margin:8px 0 14px}
.lede{max-width:640px;font-size:1.1rem;color:var(--ink-soft);margin:0}

/* menu */
.menu-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px;margin-top:40px}
.item{background:#fff;border:3px solid var(--black);border-radius:18px;padding:24px 24px 20px;box-shadow:6px 6px 0 var(--black);display:flex;flex-direction:column}
.item header{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.item h3{margin:0;font-size:1.75rem;color:var(--red)}
.item .price{font-family:"Shrikhand",Georgia,serif;font-size:1.6rem;white-space:nowrap}
.item p{margin:10px 0 14px;color:var(--ink-soft)}
.item .bread{margin-top:auto;font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#7a6f63}
.v{display:inline-block;background:var(--black);color:var(--mustard);font:700 .75rem/1 "Work Sans",sans-serif;border-radius:5px;padding:4px 7px;vertical-align:middle;margin-left:6px;transform:translateY(-4px)}
.sides{margin-top:34px;background:var(--black);color:var(--cream);border-radius:18px;padding:26px 28px;display:grid;grid-template-columns:1fr 1fr;gap:8px 40px}
.sides h3{grid-column:1/-1;margin:0 0 6px;color:var(--mustard);font-size:1.6rem}
.sides div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed rgba(243,234,219,.25);padding:8px 0}

@media (max-width:700px){.sides{grid-template-columns:1fr}}
.allergy{margin-top:18px;font-size:.95rem;color:var(--ink-soft)}

/* special */
#special{background:var(--mustard)}
.special-card{margin-top:30px;background:var(--cream);border:4px solid var(--black);border-radius:22px;box-shadow:8px 8px 0 var(--black);padding:34px;display:grid;grid-template-columns:1fr auto;gap:22px;align-items:center;transform:rotate(-1deg)}
.special-card h3{margin:6px 0 10px;font-size:clamp(2rem,5vw,3.2rem);color:var(--red);text-shadow:3px 3px 0 var(--black)}
.special-card p{margin:0;font-size:1.1rem;color:var(--ink-soft);max-width:620px}
.special-card .price{font-family:"Shrikhand",Georgia,serif;font-size:3rem}
.special-next{margin-top:26px;font-weight:600}
@media (max-width:640px){.special-card{grid-template-columns:1fr}}

/* story */
#story{background:var(--black);color:var(--cream)}
#story .kicker{color:var(--mustard)}
#story .lede{color:#d9cfbf}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}
.pillar{border:2px solid rgba(243,234,219,.25);border-radius:18px;padding:26px}
.pillar h3{margin:0 0 8px;font-size:1.9rem;color:var(--mustard)}
.pillar p{margin:0;color:#d9cfbf}
@media (max-width:820px){.pillars{grid-template-columns:1fr}}

/* loyalty */
#loyalty{background:var(--red);color:var(--cream)}
#loyalty .kicker{color:var(--mustard)}
#loyalty .lede{color:var(--cream)}
.loyal{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.card{background:var(--cream);color:var(--black);border-radius:18px;padding:24px;border:4px solid var(--black);box-shadow:8px 8px 0 var(--black);transform:rotate(2deg)}
.card .s{color:var(--red);font-size:1.5rem}
.stamps{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:16px}
.stamps span{aspect-ratio:1;border-radius:50%;border:2px dashed var(--black);display:flex;align-items:center;justify-content:center;font-family:"Shrikhand",Georgia,serif;color:rgba(22,20,18,.18);font-size:1.2rem}
.stamps span.free{background:var(--red);border:none;color:var(--cream);font-size:.95rem;transform:rotate(-8deg)}
@media (max-width:760px){.loyal{grid-template-columns:1fr}}

/* find */
.find{display:grid;grid-template-columns:1fr 1.1fr;gap:34px;margin-top:36px}
.panel{background:#fff;border:3px solid var(--black);border-radius:18px;padding:26px;box-shadow:6px 6px 0 var(--black)}
.panel h3{margin:0 0 8px;font-size:1.7rem;color:var(--red)}
@media (max-width:820px){.find{grid-template-columns:1fr}}

/* order + footer */
#order{background:var(--black);color:var(--cream);text-align:center}
#order h2{color:var(--mustard)}
#order .lede{margin:0 auto;color:#d9cfbf}
#order .ctas{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:28px}
footer{background:var(--black);color:#a89c8c;border-top:1px solid #2c2622;font-size:.9rem}
footer .wrap{padding:26px 20px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* added */
.top nav a[aria-current="page"]{color:var(--mustard);opacity:1}
.coming{display:grid;grid-template-columns:1fr 1fr;gap:34px;margin-top:36px}
.coming .panel p{margin:0 0 12px;color:var(--ink-soft)}
.signup{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
@media (max-width:820px){.coming{grid-template-columns:1fr}}
.page-hero{background:var(--red);color:var(--cream)}
.page-hero .wrap{padding-top:64px;padding-bottom:64px}
.page-hero h1{font-size:clamp(2.6rem,11vw,6.5rem);margin:12px 0 0;text-shadow:.06em .06em 0 var(--black)}
.page-hero p{max-width:640px;font-size:1.15rem;margin:40px 0 0}
.prose > *{max-width:720px}
.prose p{font-size:1.1rem;color:var(--ink-soft);margin:0 0 18px}
.prose h2{margin-top:44px}
.values{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:30px}
@media (max-width:700px){.values{grid-template-columns:1fr}}

/* forms */
.form{display:flex;flex-direction:column;gap:8px;width:100%;margin-top:6px}
.form label{font-weight:600;font-size:.95rem}
.form .opt{font-weight:400;color:#7a6f63}
.form input[type=text],.form input[type=email],.form select,.form textarea{font:inherit;padding:12px 14px;border:2px solid var(--black);border-radius:12px;background:#fff;width:100%}
.form textarea{resize:vertical}
.form .check{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:.9rem;color:var(--ink-soft);margin:6px 0}
.form .check input{margin-top:4px;width:18px;height:18px;flex:none;accent-color:var(--red)}
.form button{align-self:flex-start;margin-top:8px}
.hp{position:absolute;left:-9999px}
#contact{background:var(--cream)}
button.btn{font-family:"Work Sans",system-ui,sans-serif}

/* mobile menu */
.navtoggle{display:none;background:none;border:0;padding:10px;cursor:pointer;margin-left:auto}
.navtoggle span{display:block;width:24px;height:3px;background:var(--cream);margin:4px 0;border-radius:2px;transition:transform .2s,opacity .2s}
.navtoggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.navtoggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.navtoggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media (max-width:820px){
  .navtoggle{display:block}
  .top nav{display:none;position:absolute;top:64px;left:0;right:0;background:var(--black);flex-direction:column;align-items:stretch;gap:0;padding:8px 20px 20px;border-bottom:4px solid var(--red)}
  .top nav.open{display:flex}
  .top nav a.navlink{padding:14px 0;border-bottom:1px solid #2c2622;font-size:1.1rem}
  .top nav .btn{margin-top:14px;align-self:flex-start}
}
/* readable labels on colour */
.cap.pill{display:inline-block;background:var(--mustard);color:var(--black);padding:6px 12px;border-radius:999px;letter-spacing:.14em}
.hero .tag{font-size:1.2rem;letter-spacing:.12em}
.page-hero p{font-weight:600;font-size:1.2rem}
#loyalty .lede{font-weight:600;font-size:1.2rem}
#loyalty .kicker{background:var(--mustard);color:var(--black);display:inline-block;padding:6px 12px;border-radius:999px}
@media (max-width:480px){.cap.pill{font-size:.7rem;letter-spacing:.1em}.hero .tag{font-size:1.05rem}}
.loyal > *{min-width:0}
@media (max-width:400px){.stamps{gap:7px}.card{padding:18px}}
body{overflow-x:clip}

/* photos */
.hero-photo{position:relative;margin:0;justify-self:center;width:min(420px,100%)}
.hero-photo img{width:100%;aspect-ratio:4/5;object-fit:cover;border:6px solid var(--black);border-radius:22px;box-shadow:12px 12px 0 var(--red-dk);transform:rotate(3deg);background:var(--black)}
.badge.sticker{position:absolute;left:-34px;bottom:-30px;width:150px;border-width:6px;box-shadow:6px 6px 0 var(--black)}
.badge.sticker div{border-width:3px}
.badge.sticker .s{font-size:1.45rem}
.badge.sticker .cap{font-size:.6rem;margin-top:4px}
@media (max-width:820px){.hero-photo{width:min(360px,88%);margin:10px auto 20px}.badge.sticker{width:118px;left:-18px;bottom:-22px}.badge.sticker .s{font-size:1.15rem}}
.item-photo{width:calc(100% + 48px);margin:-24px -24px 18px;max-width:none;aspect-ratio:4/3;object-fit:cover;border-bottom:3px solid var(--black);border-radius:15px 15px 0 0}
.process{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:34px}
.process figure{margin:0;border:2px solid rgba(243,234,219,.25);border-radius:18px;overflow:hidden;background:#211d1a}
.process img{width:100%;aspect-ratio:4/3;object-fit:cover}
.process figcaption{padding:14px 18px;font-weight:700;color:var(--cream);display:flex;align-items:center;gap:10px}
.process .num{display:inline-flex;width:32px;height:32px;border-radius:50%;background:var(--mustard);color:var(--black);align-items:center;justify-content:center;font-size:1rem}
@media (max-width:820px){.process{grid-template-columns:1fr}}
.wide-photo{margin:30px 0 10px}
.wide-photo img{width:100%;aspect-ratio:16/9;object-fit:cover;border:4px solid var(--black);border-radius:18px;box-shadow:6px 6px 0 var(--black)}
.wide-photo figcaption{font-size:.9rem;color:#7a6f63;margin-top:12px;font-style:italic}
.hero-photo img,.item-photo,.process img,.wide-photo img{height:auto}
.item-photo{object-position:center 60%}

.feature{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:36px}
.feature figure{margin:0;position:relative;border:4px solid var(--black);border-radius:20px;overflow:hidden;box-shadow:6px 6px 0 var(--black);background:var(--black)}
.feature img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:center 60%}
.feature figcaption{position:absolute;left:14px;bottom:14px;background:var(--mustard);color:var(--black);border:3px solid var(--black);border-radius:999px;padding:6px 16px;font-size:1.15rem;transform:rotate(-3deg)}
@media (max-width:700px){.feature{grid-template-columns:1fr}}

.special-photo{margin:0;position:relative;width:300px}
.special-photo img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:center 55%;border:4px solid var(--black);border-radius:18px;transform:rotate(3deg);box-shadow:6px 6px 0 var(--black)}
.special-photo figcaption{position:absolute;left:-12px;bottom:-14px;background:var(--red);color:var(--cream);border:3px solid var(--black);border-radius:999px;padding:5px 14px;font-size:1rem;transform:rotate(-3deg);white-space:nowrap}
@media (max-width:640px){.special-photo{width:85%;margin:10px auto 16px}}
@media (max-width:640px){.special-photo figcaption{font-size:.85rem;left:-6px;white-space:normal;max-width:90%}}

.form-error{margin:6px 0 0;color:#8E150F;font-weight:600;font-size:.95rem}
