
:root{
  --red:#D8232B;
  --red-bright:#F03038;
  --red-dark:#A5171E;
  --ink:#23181A;
  --ink-2:#342528;
  --cream:#FFF7F2;
  --white:#fff;
  --disp:"Bricolage Grotesque",sans-serif;
  --body:"Figtree",sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:var(--body);background:var(--cream);color:var(--ink);
  font-size:1.0625rem;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased;}
h1,h2,h3{font-family:var(--disp);font-weight:800;line-height:1.02;letter-spacing:-.02em;}
h2{font-size:clamp(2.1rem,5.5vw,3.8rem);}
img,video{display:block;max-width:100%;}
section{position:relative;}
a{color:inherit;}
*:focus-visible{outline:3px solid var(--red);outline-offset:3px;}

.eyebrow{font-family:var(--body);font-weight:700;text-transform:uppercase;letter-spacing:.18em;
  font-size:.8rem;color:var(--white);background:var(--red);display:inline-block;
  padding:.35rem .85rem;border-radius:100px;margin-bottom:1.1rem;}
.eyebrow--light{background:var(--white);color:var(--ink);}

.mark{position:relative;display:inline-block;color:var(--ink);}
.mark::after{content:"";position:absolute;left:-.06em;right:-.06em;bottom:.06em;height:.42em;
  background:var(--red);z-index:-1;transform:rotate(-1.5deg);border-radius:4px;}
.hero__title .mark{color:var(--white);}
.hero__title .mark::after{height:.9em;bottom:.02em;border-radius:8px;}

/* buttons */
.btn{display:inline-block;font-family:var(--body);font-weight:700;font-size:.95rem;
  letter-spacing:.02em;text-decoration:none;padding:1rem 2rem;border-radius:100px;cursor:pointer;
  transition:transform .22s var(--ease),box-shadow .22s var(--ease),background .22s;white-space:nowrap;}
.btn--red{background:var(--red);color:var(--white);box-shadow:0 6px 0 var(--red-dark);}
.btn--red:hover{transform:translateY(-3px);box-shadow:0 9px 0 var(--red-dark);background:var(--red-bright);}
.btn--red:active{transform:translateY(2px);box-shadow:0 3px 0 var(--red-dark);}
.btn--dark{background:var(--ink);color:var(--cream);box-shadow:0 6px 0 #000;}
.btn--dark:hover{transform:translateY(-3px);box-shadow:0 9px 0 #000;background:var(--ink-2);}
.btn--dark:active{transform:translateY(2px);box-shadow:0 3px 0 #000;}
.btn--ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 2.5px var(--ink);}
.btn--ghost:hover{transform:translateY(-3px);background:var(--ink);color:var(--cream);}
.btn--sm{padding:.6rem 1.3rem;font-size:.85rem;box-shadow:0 4px 0 var(--red-dark);}
.btn--big{padding:1.15rem 2.5rem;font-size:1.05rem;}

/* top marquee */
.topbar{background:var(--ink);color:var(--white);overflow:hidden;padding:.55rem 0;}
.topbar__track{display:flex;white-space:nowrap;font-family:var(--disp);font-weight:700;
  font-size:.85rem;letter-spacing:.12em;animation:scroll-l 32s linear infinite;}
@keyframes scroll-l{to{transform:translateX(-50%);}}

/* nav */
.nav{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;
  padding:.7rem clamp(1.1rem,4vw,3rem);background:var(--cream);border-bottom:2.5px solid var(--ink);}
.nav__brand{display:flex;align-items:center;gap:.6rem;font-family:var(--disp);font-weight:800;
  font-size:1.5rem;letter-spacing:-.02em;color:var(--ink);text-decoration:none;}
.nav__logo{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid var(--ink);}
.nav__amp{color:var(--red);}
.nav__links{display:flex;gap:1.8rem;}
.nav__links a{color:var(--ink);text-decoration:none;font-weight:600;font-size:.98rem;position:relative;}
.nav__links a::after{content:"";position:absolute;left:0;bottom:-3px;width:100%;height:2.5px;
  background:var(--red);transform:scaleX(0);transform-origin:right;transition:transform .3s var(--ease);}
.nav__links a:hover::after{transform:scaleX(1);transform-origin:left;}
.nav__toggle{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px;}
.nav__toggle span{width:24px;height:2.5px;background:var(--ink);border-radius:2px;transition:.3s;}
.nav__mobile{display:none;position:absolute;top:100%;left:0;right:0;background:var(--cream);
  border-bottom:2.5px solid var(--ink);flex-direction:column;padding:.6rem clamp(1.1rem,4vw,3rem) 1.3rem;}
.nav.is-open .nav__mobile{display:flex;}
.nav__mobile a{padding:.85rem .2rem;font-weight:700;font-size:1.05rem;color:var(--ink);
  text-decoration:none;border-bottom:1px solid rgba(35,24,26,.1);}
.nav__mobile-cta{color:var(--red)!important;border-bottom:0!important;}

/* hero */
.hero{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:2rem;
  max-width:1240px;margin:0 auto;padding:clamp(2.5rem,6vw,5rem) clamp(1.2rem,4vw,3rem) clamp(3rem,7vw,5.5rem);}
.hero__eyebrow{font-weight:700;text-transform:uppercase;letter-spacing:.2em;font-size:.82rem;
  color:var(--ink);opacity:.6;margin-bottom:1rem;}
.hero__title{font-size:clamp(2.9rem,8vw,6rem);}
.hero__title span{display:block;}
.hero__title .mark{display:inline-block;}
.hero__sub{margin:1.6rem 0 2.2rem;max-width:30rem;font-size:1.15rem;color:#6b5850;}
.hero__cta{display:flex;gap:1rem;flex-wrap:wrap;}

.hero__art{position:relative;display:flex;justify-content:center;align-items:center;min-height:440px;}
.hero__frame{position:relative;z-index:3;width:min(78%,320px);aspect-ratio:9/13;border-radius:30px;
  overflow:hidden;border:4px solid var(--ink);box-shadow:14px 14px 0 var(--ink);background:var(--ink);
  transform:rotate(-3deg);}
.hero__frame video{width:100%;height:100%;object-fit:cover;}
.hero__ring{position:absolute;width:min(94%,420px);aspect-ratio:1;border-radius:50%;
  background:var(--red);z-index:1;}
.hero__ring::after{content:"";position:absolute;inset:16px;border-radius:50%;border:3px dashed rgba(255,255,255,.55);}

/* spinning badge */
.badge{position:absolute;z-index:5;top:-4%;right:2%;width:106px;height:106px;
  background:var(--ink);border-radius:50%;display:grid;place-items:center;}
.badge--spin svg{position:absolute;inset:0;width:100%;height:100%;animation:spin 16s linear infinite;}
.badge--spin text{fill:var(--white);font-family:var(--disp);font-weight:700;font-size:9px;letter-spacing:1px;}
.badge__center{font-family:var(--disp);font-weight:800;color:var(--cream);font-size:1.35rem;line-height:.8;text-align:center;}
.badge__center small{display:block;font-size:.55rem;letter-spacing:.14em;font-weight:600;color:var(--red-bright);text-transform:uppercase;margin-top:2px;}
@keyframes spin{to{transform:rotate(360deg);}}

/* deco dots */
.dot{position:absolute;border-radius:50%;z-index:0;}
.dot--1{width:16px;height:16px;background:var(--ink);top:16%;left:5%;}
.dot--2{width:26px;height:26px;background:var(--red);bottom:14%;left:12%;opacity:.9;}
.dot--3{width:12px;height:12px;background:var(--red);top:22%;right:7%;}

/* food marquee */
.foodbar{background:var(--red);border-top:2.5px solid var(--ink);border-bottom:2.5px solid var(--ink);
  overflow:hidden;padding:.7rem 0;}
.foodbar__track{display:flex;align-items:center;gap:1.4rem;white-space:nowrap;
  font-family:var(--disp);font-weight:800;font-size:1.35rem;color:var(--white);
  animation:scroll-l 28s linear infinite;}
.foodbar__track i{font-size:.6rem;opacity:.6;}

/* favourites */
.menu{max-width:1240px;margin:0 auto;padding:clamp(3.5rem,8vw,6rem) clamp(1.2rem,4vw,3rem);}
.menu__head{text-align:center;margin-bottom:clamp(2.2rem,5vw,3.5rem);}
.menu__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.3rem;}
.dish{background:var(--white);border:2.5px solid var(--ink);border-radius:22px;overflow:hidden;
  box-shadow:7px 7px 0 var(--ink);transition:transform .3s var(--ease),box-shadow .3s var(--ease);}
.dish:nth-child(even){transform:translateY(1.6rem);}
.dish.reveal:hover{transform:translateY(-6px) rotate(-1deg);box-shadow:11px 14px 0 var(--red);}
.dish.reveal:nth-child(even):hover{transform:translateY(calc(1.6rem - 6px)) rotate(1deg);}
.dish__img{aspect-ratio:1;overflow:hidden;border-bottom:2.5px solid var(--ink);}
.dish__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease);}
.dish:hover .dish__img img{transform:scale(1.07);}
.dish h3{font-size:1.25rem;margin:1rem 1.1rem .3rem;}
.dish p{font-size:.92rem;color:#6a5d58;margin:0 1.1rem 1.3rem;}
.menu__cta{text-align:center;margin-top:clamp(2.5rem,5vw,3.8rem);}
.menu__cta p{font-family:var(--disp);font-weight:700;font-size:1.4rem;margin-bottom:1.3rem;}

/* kitchen strip */
.kitchen{background:var(--ink);color:var(--cream);padding:clamp(3rem,7vw,5rem) 0;overflow:hidden;}
.kitchen__head{text-align:center;padding:0 1.2rem;margin-bottom:2.4rem;}
.kitchen__head h2{color:var(--cream);}
.kitchen__strip{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);}
.kitchen__track{display:flex;width:max-content;animation:scroll-l 42s linear infinite;}
.kitchen__track img{width:230px;margin-right:1rem;aspect-ratio:3/4;object-fit:cover;border-radius:18px;
  border:3px solid var(--red);background:var(--ink-2);}

/* full menu */
.fmenu{max-width:1240px;margin:0 auto;padding:clamp(3.5rem,8vw,6rem) clamp(1.2rem,4vw,3rem);}
.fmenu__head{text-align:center;margin-bottom:clamp(2.2rem,5vw,3.4rem);}
.fmenu__note{margin-top:1rem;color:#6a5d58;font-size:.95rem;font-weight:500;}
.fmenu__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem;align-items:start;}
.mcard{background:var(--white);border:2.5px solid var(--ink);border-radius:22px;
  padding:1.8rem 1.6rem;box-shadow:7px 7px 0 var(--ink);}
.mcard h3{font-size:1.5rem;color:var(--red);margin-bottom:1rem;display:inline-block;
  border-bottom:3px solid var(--ink);padding-bottom:.15rem;}
.mcard__sub{margin-top:1.8rem;}
.mcard ul{list-style:none;}
.mcard li{display:flex;justify-content:space-between;align-items:baseline;gap:.8rem;
  padding:.5rem 0;border-bottom:1px dashed rgba(35,24,26,.16);}
.mcard li:last-child{border-bottom:0;}
.mcard li span{font-weight:500;color:var(--ink);font-size:.98rem;}
.mcard li b{font-family:var(--disp);font-weight:700;color:var(--ink);white-space:nowrap;}
.fmenu__cta{text-align:center;margin-top:clamp(2.4rem,5vw,3.4rem);}

/* how it works */
.how{background:var(--red);color:var(--white);padding:clamp(3.5rem,8vw,6rem) clamp(1.2rem,4vw,3rem);
  border-top:2.5px solid var(--ink);border-bottom:2.5px solid var(--ink);}
.how__head{text-align:center;margin-bottom:clamp(2.2rem,5vw,3.4rem);}
.how__head h2{color:var(--white);}
.how__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem;max-width:1040px;margin:0 auto;}
.step{background:var(--cream);color:var(--ink);border:2.5px solid var(--ink);border-radius:22px;
  padding:2.2rem 1.8rem;box-shadow:7px 7px 0 var(--ink);}
.step__num{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;
  background:var(--red);color:var(--white);font-family:var(--disp);font-weight:800;font-size:1.5rem;
  margin-bottom:1.1rem;box-shadow:0 4px 0 var(--red-dark);}
.step h3{font-size:1.4rem;margin-bottom:.5rem;}
.step p{color:#6a5d58;font-size:.98rem;}

/* trust strip */
.trust{background:var(--ink);color:var(--cream);padding:clamp(2rem,4vw,2.8rem) clamp(1.2rem,4vw,3rem);}
.trust__in{max-width:1040px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;text-align:center;}
.trust__item b{display:block;font-family:var(--disp);font-weight:800;font-size:1.7rem;color:var(--white);line-height:1;}
.trust__item span{font-size:.86rem;color:rgba(255,247,242,.7);letter-spacing:.02em;}

/* order CTA */
.order{background:var(--cream);color:var(--ink);text-align:center;padding:clamp(4rem,9vw,7rem) 1.2rem;overflow:hidden;}
.order h2{font-size:clamp(2.8rem,8vw,5.5rem);margin-bottom:1rem;color:var(--ink);}
.order p{max-width:32rem;margin:0 auto 2.2rem;font-size:1.1rem;color:var(--ink);font-weight:500;}
.order__cta{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;}
.dot--4{width:30px;height:30px;background:var(--ink);top:16%;left:10%;}
.dot--5{width:18px;height:18px;background:var(--red);top:22%;right:14%;}

/* footer */
.footer{background:var(--ink);color:var(--cream);padding:clamp(3rem,6vw,4.5rem) clamp(1.2rem,4vw,3rem) 2.2rem;}
.footer__top{text-align:center;margin-bottom:2.6rem;}
.footer__logo{width:62px;height:62px;border-radius:50%;object-fit:cover;margin:0 auto .8rem;border:2.5px solid var(--red);}
.footer__top p{color:rgba(255,247,242,.6);}
.footer__cols{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;max-width:760px;margin:0 auto 2.4rem;}
.footer__cols h4{font-family:var(--body);font-weight:700;text-transform:uppercase;letter-spacing:.14em;
  font-size:.78rem;color:var(--red-bright);margin-bottom:.6rem;}
.footer__cols p{color:rgba(255,247,242,.72);font-size:.95rem;}
.footer__note{text-align:center;color:rgba(255,247,242,.35);font-size:.8rem;
  border-top:1px solid rgba(255,247,242,.14);padding-top:1.6rem;}

/* reveal */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .8s var(--ease);
  transition-delay:var(--d,0s);}
.reveal.in{opacity:1;transform:none;}

/* responsive */
@media(max-width:920px){
  .hero{grid-template-columns:1fr;text-align:center;}
  .hero__copy{order:2;}
  .hero__sub{margin-left:auto;margin-right:auto;}
  .hero__cta{justify-content:center;}
  .hero__art{order:1;min-height:380px;}
  .menu__grid{grid-template-columns:repeat(2,1fr);}
  .dish:nth-child(even){transform:none;}
  .dish:nth-child(even):hover{transform:translateY(-6px) rotate(1deg);}
  .fmenu__grid{grid-template-columns:1fr 1fr;}
  .how__grid{grid-template-columns:1fr;max-width:440px;}
  .nav__links,.nav>.btn{display:none;}
  .nav__toggle{display:flex;}
  .trust__in{grid-template-columns:1fr 1fr;gap:1.6rem;}
}
@media(max-width:560px){
  .menu__grid{grid-template-columns:1fr;max-width:360px;margin:0 auto;}
  .fmenu__grid{grid-template-columns:1fr;max-width:420px;margin:0 auto;}
  .kitchen__track img{width:160px;}
  .footer__cols{grid-template-columns:1fr;text-align:center;}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .topbar__track,.foodbar__track,.kitchen__track,.badge--spin svg{animation:none;}
  .reveal{opacity:1;transform:none;transition:none;}
}
