/* =========================================================
   OBUR · short homepage (hero → menu → footer) + About page
   Loaded after style.css; same tokens, same sticker world.
   ========================================================= */

::selection { background: var(--coral); color: var(--cream); }
html { scrollbar-color: var(--ink) var(--cream-2); accent-color: var(--coral); }
a { text-underline-offset: .18em; text-decoration-thickness: 2px; }

/* ---------- marquee separator: a stamped diamond, not a glyph ---------- */
.marquee__item i.marquee__dot { display: inline-block; width: .32em; height: .32em; background: var(--coral); transform: rotate(45deg) translateY(-.12em); margin-left: 2.4rem; vertical-align: middle; }

/* ---------- hero: one screen, name + photos + action ---------- */
.page-home .hero {
  min-height: min(100svh, 900px);
  padding: calc(var(--nav-h) + clamp(1.5rem, 4vw, 3.5rem)) var(--gutter) max(24vh, 200px);
}
.page-home .hero__inner { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: center; gap: 0 clamp(2rem, 4vw, 4rem); }
.page-home .hero__title { font-size: clamp(4rem, 8.4vw, 9rem); line-height: .84; }
.page-home .hero__line--2 { margin-left: 0; }
.page-home .hero__title { grid-column: 1; grid-row: 1; align-self: end; }
.page-home .hero__aside { grid-column: 2; grid-row: 1 / span 2; padding: 0; align-self: center; }
.page-home .hero__sub { margin-bottom: 1.75rem; font-size: clamp(1.15rem, 1.05rem + .45vw, 1.4rem); }
.page-home .hero__copy { grid-column: 1; grid-row: 2; align-self: start; display: grid; justify-items: start; gap: 1.5rem; margin-top: clamp(1.5rem, 2.5vw, 2.25rem); }
.page-home .hero__copy .hero__sub { margin: 0; max-width: 30rem; }

/* three real plates from the menu, pinned like order tickets */
.hero__plates { position: relative; height: clamp(330px, 32vw, 460px); max-width: 580px; margin-left: auto; }
.plate {
  position: absolute; width: clamp(170px, 16vw, 236px); margin: 0; background: var(--cream);
  border: 3px solid var(--ink); padding: 6px 6px 0; box-shadow: 6px 6px 0 var(--ink); color: var(--ink);
  transition: transform .25s var(--ease-pop);
}
.plate img { width: 100%; height: auto; aspect-ratio: 192 / 153; object-fit: cover; }
.plate figcaption { font-family: var(--font-hand); font-weight: 700; font-size: 1.3rem; line-height: 1; padding: .3rem .1rem .4rem; }
.plate:nth-child(1) { left: 0; top: 4%; transform: rotate(-6deg); z-index: 1; }
.plate:nth-child(2) { right: 0; top: 0; transform: rotate(3deg); z-index: 2; }
.plate:nth-child(3) { left: 31%; top: 50%; transform: rotate(-2deg); z-index: 3; }
.plate:hover { transform: rotate(0) scale(1.05); z-index: 4; }

.page-home .hero__note { position: static; transform: rotate(-3deg); text-align: right; margin-top: .5rem; font-size: clamp(1.4rem, 2vw, 1.9rem); max-width: none; }

/* ---------- menu: the printed menu, one category at a time ---------- */
.page-home .menu { padding: clamp(3.5rem, 7vw, 6rem) var(--gutter) clamp(4rem, 8vw, 7rem); }
.page-home .menu__head { grid-template-columns: auto minmax(0, 1fr); margin-bottom: 1.5rem; }
.page-home .menu__title { font-size: clamp(4rem, 10vw, 9.5rem); }
.menu__blurb:empty { display: none; }
.page-home .menu__blurb { color: var(--coral-deep); }
.page-home .menu__note { font-size: 1rem; opacity: 1; }
.page-home .menu__note::before { display: none; }
.menu__panels { max-width: var(--max); margin: 0 auto; }
.menu__panel { padding-top: clamp(1.5rem, 3vw, 2.5rem); }

.menu__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(2rem, 4vw, 4.5rem); }
.dish {
  display: grid; grid-template-columns: clamp(120px, 11vw, 168px) minmax(0, 1fr) auto; gap: .25rem clamp(1rem, 1.6vw, 1.5rem);
  align-items: start; padding: 1.25rem 0; border-top: 3px solid var(--ink);
}
.dish__img, .dish__art {
  width: 100%; aspect-ratio: 192 / 153; border: 3px solid var(--ink); background: var(--cream);
  transform: rotate(-1.5deg); transition: transform .25s var(--ease-pop);
}
.dish__img { height: auto; object-fit: cover; }
.dish:nth-child(2n) .dish__img, .dish:nth-child(2n) .dish__art { transform: rotate(1.5deg); }
.dish:hover .dish__img, .dish:hover .dish__art { transform: rotate(0) scale(1.04); }
.dish__art { display: grid; place-items: center; color: var(--coral); background: var(--cream); }
.dish__art .food { width: 72%; }
.dish__art .food path { stroke-width: 7; }
.dish__body { min-width: 0; }
.dish__name {
  font-family: var(--font-display); font-weight: 800; text-transform: uppercase; line-height: .95;
  font-size: clamp(1.45rem, 1.1rem + 1vw, 2.1rem); letter-spacing: .005em; text-wrap: balance; margin-bottom: .35rem;
}
.dish__desc { font-size: 1rem; line-height: 1.45; font-weight: 500; text-wrap: pretty; }
.dish__tags { display: flex; gap: .75rem; margin-top: .3rem; }
.dish__tags span { font-family: var(--font-hand); font-weight: 700; font-size: 1.35rem; line-height: 1; color: var(--coral-deep); }
.dish__price {
  font-family: var(--font-display); font-weight: 900; font-size: clamp(1.5rem, 1.2rem + .9vw, 2.1rem); line-height: .95;
  font-variant-numeric: tabular-nums; white-space: nowrap; padding-top: .05em;
}
.dish__price.is-tbd { opacity: .45; }

.menu__deal {
  margin-top: 1.25rem; padding: 1rem 1.25rem; background: var(--ink); color: var(--cream);
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; font-weight: 600; font-size: 1.05rem;
}
.menu__deal-tag {
  font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: 1.3rem; line-height: 1;
  background: var(--coral); color: var(--cream); padding: .3em .55em .2em; transform: rotate(-2deg); display: inline-block;
}
.page-home .menu__foot {
  max-width: var(--max); margin: clamp(2rem, 4vw, 3rem) auto 0; display: flex; flex-wrap: wrap; align-items: center; gap: 1.25rem 2.5rem;
}
.menu__story { font-family: var(--font-display); font-weight: 800; text-transform: uppercase; letter-spacing: .04em; font-size: 1.3rem; text-decoration: none; }
.menu__story:hover, .menu__story:focus-visible { color: var(--coral-deep); text-decoration: underline; }

/* ---------- footer: a close, not a sitemap ---------- */
.site-footer { padding: clamp(3.5rem, 7vw, 6rem) var(--gutter) calc(1.5rem + env(safe-area-inset-bottom)); overflow: hidden; }
.site-footer__cta, .site-footer__cols, .site-footer__base { max-width: var(--max); margin: 0 auto; }
.site-footer__cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem 3rem; padding-bottom: clamp(2.5rem, 5vw, 4rem); }
.site-footer__hand { font-size: clamp(3rem, 7vw, 6rem); color: var(--coral); transform: rotate(-3deg); }
.site-footer .btn--primary { box-shadow: 5px 5px 0 var(--coral-deep); border-color: var(--cream); }
.site-footer .btn--primary:hover { background: var(--cream); color: var(--ink); box-shadow: 8px 8px 0 var(--coral); }
.site-footer__cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem clamp(1.5rem, 3vw, 3rem); padding-top: clamp(2rem, 4vw, 3rem); border-top: 3px solid var(--coral); }
.site-footer__col h2 { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: 1.6rem; line-height: 1; color: var(--coral); margin-bottom: .75rem; }
.site-footer__col p { font-size: 1.05rem; line-height: 1.5; font-weight: 500; }
.site-footer__col p + p { margin-top: .3rem; }
.site-footer__col a { text-decoration-color: var(--coral); }
.site-footer__col a:hover, .site-footer__col a:focus-visible { color: var(--coral); }
.site-footer__base { margin-top: clamp(2.5rem, 5vw, 4rem); display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem 2rem; }
.site-footer__wordmark { display: block; width: min(100%, 52rem); height: auto; aspect-ratio: 600 / 220; color: var(--coral); }
.site-footer__wordmark path { fill: currentColor; }
.site-footer__base p { font-size: 1rem; font-weight: 500; }

/* ---------- order sheet: pickup first, delivery second ---------- */
.sheet__group { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: 1.5rem; line-height: 1; margin: 1.25rem 0 .6rem; }
.sheet__body > .sheet__group:first-child { margin-top: 1.25rem; }
.sheet__list--apps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.sheet__list--apps .platform { padding: .9rem .85rem .8rem; box-shadow: 4px 4px 0 var(--ink); }
.sheet__list--apps .platform__name { font-size: 1.35rem; }
.sheet__list--apps .platform__meta { font-size: .85rem; letter-spacing: 0; text-transform: none; font-weight: 600; }
.sheet .platform--direct.platform--soon { background: var(--coral); color: var(--cream); border-style: solid; opacity: 1; }
.sheet .platform--direct.platform--soon .platform__name { opacity: 1; }
.sheet .platform__meta { text-transform: none; letter-spacing: 0; font-size: .95rem; opacity: .9; }
a.platform:hover { transform: rotate(0) translate(-2px, -2px); box-shadow: 8px 8px 0 var(--ink); }

/* ---------- about page ---------- */
.define--top { padding-top: calc(var(--nav-h) + clamp(3rem, 8vw, 7rem)); }
.page-about .street__stop { padding-top: 0; }
.plate--stop { position: relative; width: clamp(150px, 14vw, 200px); margin: 0 0 1.5rem; transform: rotate(-4deg); }
.street__stop:nth-of-type(2n) .plate--stop { transform: rotate(3deg); }
.plate--stop:hover { transform: rotate(0) scale(1.04); }

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
  .page-home .hero__inner { grid-template-columns: minmax(0, 1fr) minmax(240px, 22rem); }
  .menu__grid { grid-template-columns: minmax(0, 1fr); }
  .site-footer__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .page-home .hero { min-height: 0; padding-bottom: clamp(190px, 44vw, 300px); }
  .page-home .hero__inner { grid-template-columns: minmax(0, 1fr); }
  .page-home .hero__aside, .page-home .hero__copy { grid-column: 1; grid-row: auto; }
  .page-home .hero__title { grid-row: auto; }
  .page-home .hero__aside { grid-row: auto; margin-top: 1.75rem; }
  .page-home .hero__title { font-size: clamp(3.4rem, 16.5vw, 7rem); }
  .page-home .hero__stage { height: clamp(190px, 44vw, 300px); }
  .page-home .hero__rider { width: clamp(130px, 34vw, 220px); }
  .hero__plates { height: clamp(150px, 40vw, 260px); max-width: none; margin: 0; }
  .plate { width: 34%; padding: 4px 4px 0; box-shadow: 4px 4px 0 var(--ink); }
  .plate figcaption { font-size: 1.05rem; }
  .plate:nth-child(1) { left: 0; top: 10%; }
  .plate:nth-child(2) { left: 33%; right: auto; top: 0; }
  .plate:nth-child(3) { left: auto; right: 0; top: 18%; }
  .page-home .menu__tabs { flex-wrap: wrap; overflow: visible; gap: 0 1.1rem; }
  .page-home .hero__note { display: none; }
  .page-home .menu__head { grid-template-columns: minmax(0, 1fr); gap: .5rem; }
  .dish { grid-template-columns: 96px minmax(0, 1fr) auto; padding: 1rem 0; }
  .sheet__list--apps { grid-template-columns: minmax(0, 1fr); }
  .site-footer { padding-bottom: calc(6.5rem + env(safe-area-inset-bottom)); }
}
@media (max-width: 520px) {
  .dish { grid-template-columns: 84px minmax(0, 1fr); }
  .dish__price { grid-column: 2; grid-row: 2; font-size: 1.5rem; }
  .dish__name { font-size: 1.4rem; }
  .site-footer__cols { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.75rem 1.25rem; }
  .site-footer__col p { font-size: 1rem; overflow-wrap: anywhere; }
  .page-home .hero__copy .btn--lg { font-size: 1.25rem; }
}

@media (prefers-reduced-motion: reduce) {
  .plate, .dish__img, .dish__art { transition: none; }
}

/* coral text on cream needs the deeper coral to clear 3:1 */
.page-home .hero__line--2, .page-home .hero__dot, .page-home .hero__note { color: var(--coral-deep); }

/* cream on coral is 2.6:1; the deeper coral carries action labels at 3.5:1 */
.btn--primary, .btn--sticker, .menu__deal-tag, .platform--direct, .sheet .platform--direct.platform--soon { background: var(--coral-deep); }
.btn--primary:hover { background: var(--ink); }

/* about: the photo follows its words, the poster lines stay at two */
.page-about .define__title { margin-bottom: 2.5rem; }
.crave__plate { position: relative; z-index: 1; width: clamp(170px, 16vw, 230px); margin: 0 6vw 1.5rem 0; transform: rotate(4deg); }
@media (max-width: 900px) {
  .page-about .define__list li { font-size: 1.25rem; }
  .crave__plate { margin: 0 0 1.5rem 3vw; }
  .page-about .street__track { gap: 5rem; }
}
.btn--sticker { font-size: 1.2rem; }
.page-about .define__list li { line-height: 1.35; }
/* cream poster type on the bright coral is 2.6:1; About's coral fields take the deeper coral */
.page-about .on-coral { background: var(--coral-deep); --bg: var(--coral-deep); --m-line: var(--coral-deep); }

/* =========================================================
   Order links, 404 and policy pages
   ========================================================= */
.dish { position: relative; }
.dish__add {
  grid-column: 3; justify-self: end; align-self: end; margin-top: .5rem;
  font-family: var(--font-display); font-weight: 900; text-transform: uppercase; letter-spacing: .04em; font-size: 1.05rem; line-height: 1;
  padding: .55em .9em .45em; border: 3px solid var(--ink); background: var(--cream); color: var(--ink);
  transition: background-color .15s, color .15s, transform .18s var(--ease-pop);
}
.dish__add { text-decoration: none; }
.dish__add:hover, .dish__add:focus-visible { background: var(--ink); color: var(--cream); }
.dish__price small { font-family: var(--font-body); font-weight: 600; font-size: .55em; text-transform: lowercase; margin-right: .15em; }
.dish__add:active { transform: scale(.94) rotate(-2deg); }
.dish__soldout { grid-column: 3; justify-self: end; font-family: var(--font-hand); font-weight: 700; font-size: 1.3rem; color: var(--coral-deep); }



/* thanks + 404 + policies */
.thanks { min-height: 80svh; padding: calc(var(--nav-h) + clamp(3rem, 8vw, 6rem)) var(--gutter) clamp(4rem, 8vw, 6rem); display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 2rem; align-items: center; max-width: var(--max); margin: 0 auto; }
.thanks__title { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; line-height: .86; font-size: clamp(3.4rem, 9vw, 8rem); margin-bottom: 1.5rem; }
.thanks__lead { font-size: clamp(1.15rem, 1.05rem + .45vw, 1.4rem); font-weight: 500; max-width: 32rem; margin-bottom: 2rem; }
.thanks__order { border: 3px solid var(--ink); background: var(--cream-2); padding: 1.25rem 1.4rem; margin-bottom: 2rem; max-width: 30rem; }
.thanks__order h2 { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: 1.5rem; margin-bottom: .5rem; }
.thanks__order li { padding: .3rem 0; font-weight: 600; }
.thanks__order small { display: block; font-weight: 500; }
.thanks__total { margin-top: .6rem; font-family: var(--font-display); font-weight: 900; font-size: 1.4rem; }
.thanks__mascot { width: min(100%, 380px); justify-self: end; }
.policy { padding: calc(var(--nav-h) + clamp(3rem, 7vw, 5rem)) var(--gutter) clamp(4rem, 8vw, 6rem); }
.policy__inner { max-width: 44rem; margin: 0 auto; }
.policy__title { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; line-height: .88; font-size: clamp(3rem, 8vw, 6rem); margin-bottom: 2rem; }
.policy__inner h2 { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: 1.7rem; line-height: 1; margin: 2.25rem 0 .6rem; }
.policy__inner p { font-size: 1.1rem; line-height: 1.6; max-width: 65ch; }
.policy__inner a { color: var(--ink); text-decoration-color: var(--coral-deep); }
.tbc { background: var(--cream-3); padding: 0 .3em; font-weight: 600; }

@media (max-width: 900px) {
  .thanks { grid-template-columns: minmax(0, 1fr); }
  .thanks__mascot { justify-self: start; width: min(60%, 260px); }
}
@media (max-width: 520px) {
  .dish__add, .dish__soldout { grid-column: 2; justify-self: start; }
}
@media (prefers-reduced-motion: reduce) {
}