/* Website templates for takeaways' ordering pages (1.23, rebuilt for 1.24 with the website builder). Loaded after
   shop.css on every ordering page. Template rules are scoped to a templated page (.tpl-body / .shop.tpl, set by
   order.js), so the Classic page looks exactly as before; only the page sections an owner adds in the builder
   (.t-sec) are styled on Classic too. Each takeaway's own colour is --brand (with --brand-ink for words on it and
   --brand-text for words in it, darkened by order.js until it reads at 4.5:1 on the page's background).
   Fonts are self-hosted (public/fonts, SIL Open Font License, see OFL.txt): no outside font service.
   Seven templates: 1 Smash Burger (.t-burger), 2 Italian & Pizza (.t-pizzeria), 3 Shawarma & Grill (.t-grill),
   4 Indian & Pakistani (.t-indian), 5 Café & Bakery (.t-cafe), 6 Desserts & Shakes (.t-dessert),
   7 Fried Chicken & Street Food (.t-chicken).
   1.25: Italian & Pizza and Smash Burger are now websites with pages, drawn by shop-flagship.js and styled by
   shop-flagship.css. Their 1.24 rules below are kept for the one-page fallback and apply only without .t-site. */

@font-face { font-family: "Inter"; src: url("/static/fonts/Inter-Regular.woff") format("woff"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("/static/fonts/Inter-Medium.woff") format("woff"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("/static/fonts/Inter-SemiBold.woff") format("woff"); font-weight: 600 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter Display"; src: url("/static/fonts/InterDisplay-SemiBold.woff") format("woff"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter Display"; src: url("/static/fonts/InterDisplay-Bold.woff") format("woff"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter Display"; src: url("/static/fonts/InterDisplay-ExtraBold.woff") format("woff"); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter Display"; src: url("/static/fonts/InterDisplay-Black.woff") format("woff"); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter Display"; src: url("/static/fonts/InterDisplay-BlackItalic.woff") format("woff"); font-weight: 900; font-style: italic; font-display: swap; }
@font-face { font-family: "Caladea"; src: url("/static/fonts/Caladea-Regular.woff") format("woff"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Caladea"; src: url("/static/fonts/Caladea-Italic.woff") format("woff"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Caladea"; src: url("/static/fonts/Caladea-Bold.woff") format("woff"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("/static/fonts/Poppins-Regular.woff") format("woff"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("/static/fonts/Poppins-Medium.woff") format("woff"); font-weight: 500 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("/static/fonts/Poppins-Bold.woff") format("woff"); font-weight: 700 900; font-style: normal; font-display: swap; }

/* =====================================================================================================
   TOKENS: the builder's choices (heading font, text font, buttons, spacing), drawn the same way everywhere
   ===================================================================================================== */
.shop-body {
  --t-sec: 56px; --t-btn-r: 12px; --brand-text: color-mix(in srgb, var(--brand) 80%, var(--ink));
  --t-head: inherit; --t-weight: 800; --t-case: none; --t-track: -.02em; --t-style: normal;
  --t-tint: color-mix(in srgb, var(--brand) 9%, var(--bg)); --t-tint-2: color-mix(in srgb, var(--brand) 16%, var(--bg));
  --t-accent: color-mix(in srgb, var(--brand) 78%, var(--ink));
}
.tpl-body {
  --t-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --t-head: "Inter Display", "Inter", system-ui, sans-serif;
  font-family: var(--t-body);
}
.tpl-body[data-theme="dark"] { --t-accent: color-mix(in srgb, var(--brand) 55%, #fff); }
.tpl-body[data-font="serif"] { --t-head: "Caladea", Georgia, "Times New Roman", serif; --t-weight: 700; --t-track: -.005em; }
.tpl-body[data-font="editorial"] { --t-head: "Caladea", Georgia, "Times New Roman", serif; --t-weight: 400; --t-track: -.01em; --t-style: italic; }
.tpl-body[data-font="rounded"] { --t-head: "Poppins", "Inter", system-ui, sans-serif; --t-weight: 700; --t-track: -.015em; }
.tpl-body[data-font="condensed"] { --t-weight: 900; --t-case: uppercase; --t-track: -.025em; }
.tpl-body[data-font="street"] { --t-weight: 900; --t-case: uppercase; --t-track: -.02em; --t-style: italic; }
.tpl-body[data-body-font="poppins"] { --t-body: "Poppins", "Inter", system-ui, sans-serif; }
.tpl-body[data-body-font="caladea"] { --t-body: "Caladea", Georgia, "Times New Roman", serif; }
.shop-body[data-buttons="pill"] { --t-btn-r: 999px; }
.shop-body[data-buttons="square"] { --t-btn-r: 2px; }
.shop-body[data-spacing="compact"] { --t-sec: 36px; }
.shop-body[data-spacing="airy"] { --t-sec: 76px; }
@media (min-width: 900px) {
  .shop-body { --t-sec: 80px; }
  .shop-body[data-spacing="compact"] { --t-sec: 52px; }
  .shop-body[data-spacing="airy"] { --t-sec: 112px; }
}
.shop.tpl :is(h1, h2, h3), .tpl-body .sheet-panel :is(h2, h3), .shop.tpl :is(.t-foot-name, .t-brand > span) {
  font-family: var(--t-head); font-weight: var(--t-weight); text-transform: var(--t-case); letter-spacing: var(--t-track); font-style: var(--t-style); font-stretch: normal;
}
.tpl-body .sheet-panel :is(h2, h3) { text-transform: none; font-style: normal; }
.shop.tpl .mi-price, .tpl-body .bl-price, .tpl-body .totals, .tpl-body .opt-price { font-variant-numeric: tabular-nums; }
/* Button shapes: every button on the page and in its sheets (dish, basket, checkout) */
.tpl-body :is(.btn, .hero-btn, .type-toggle, .type-toggle button) { border-radius: var(--t-btn-r); }
.tpl-body .stepper { border-radius: var(--t-btn-r); }
.tpl-body .stepper button { border-radius: max(2px, calc(var(--t-btn-r) - 4px)); }

/* ---------- focus you can always see: the page's own text colour, never only the brand colour */
.tpl-body :is(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid var(--ink); outline-offset: 2px; }
.shop.tpl .mi:focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; }

/* =====================================================================================================
   PARTS EVERY TEMPLATE SHARES
   ===================================================================================================== */
.shop.tpl .hero { position: relative; }
.shop.tpl .hero-logo { margin-top: 0; border: 0; box-shadow: none; }
.shop.tpl .hero-logo.letter { font-family: var(--t-head); font-weight: var(--t-weight); font-style: var(--t-style); }
.shop.tpl .t-cover { display: block; width: 100%; height: 100%; object-fit: cover; }
.shop.tpl .hero-status { display: inline-flex; align-items: center; gap: 8px; width: fit-content; padding: .4em .85em; border-radius: var(--pill); background: var(--soft); color: var(--ink); font-size: .92rem; }
.shop.tpl .hero-tagline { color: var(--ink); }
.shop.tpl .hero-facts { margin: 0; }
.shop.tpl .hero-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.shop.tpl .hero-btn { min-height: 44px; }
.shop-body .shop.tpl a.hero-btn { color: var(--ink); }
.shop.tpl .preview-ribbon { position: static; }
.shop.tpl .t-brand { display: flex; align-items: center; gap: 10px; min-width: 0; }
.shop.tpl .t-brand > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 1.1rem; line-height: 1.2; }
.shop.tpl .t-brand .hero-logo { flex: none; width: 44px; height: 44px; object-fit: contain; }
.shop.tpl .t-brand .hero-logo.letter { display: grid; place-items: center; font-size: 1.3rem; background: var(--brand); color: var(--brand-ink); }
.shop.tpl .t-cta { width: fit-content; padding: 0 28px; }
/* A sample photo is marked as illustrative wherever customers see it */
.shop-body .t-sample-tag { position: absolute; right: 10px; bottom: 10px; z-index: 3; padding: 3px 8px; border-radius: 4px; background: rgba(0, 0, 0, .58); color: #fff;
  font: 500 .7rem/1.3 var(--t-body, system-ui), system-ui, sans-serif; letter-spacing: .02em; text-transform: none; font-style: normal; pointer-events: none; }
.shop.tpl .cat h2 { font-size: 1.5rem; line-height: 1.15; }
.shop.tpl .mi-name { overflow-wrap: anywhere; }
.shop.tpl .mi-allergens { display: block; font-size: .78rem; line-height: 1.35; color: var(--muted); }
.shop.tpl .mi-opts { display: inline-block; font-size: .78rem; font-weight: 600; color: var(--muted); }
.shop.tpl .mi-ph { display: none; }
.shop.tpl .mi-media { overflow: hidden; border-radius: var(--r-sm); }
.shop.tpl .mi.noimg .mi-media { overflow: visible; }
.shop.tpl .mi-media img { background: var(--soft); }
@media (max-width: 599px) { .shop.tpl.l-grid .items .mi-allergens { display: none; } .shop.tpl.l-grid .cat.drinks .items .mi-allergens { display: block; } }
.shop.tpl .tags { vertical-align: 1px; }
/* Footers: the classic footer's layout is replaced; space is kept under it for the phone's basket bar. */
.shop.tpl .t-footer { display: block; margin: var(--t-sec) 0 0; padding: 40px 0 calc(120px + env(safe-area-inset-bottom)); border: 0; font-size: .95rem; color: var(--ink); text-align: left; }
@media (min-width: 1024px) { .shop.tpl .t-footer { padding-bottom: 48px; } }
.shop.tpl .t-foot-name { font-size: 1.4rem; margin: 0 0 6px; line-height: 1.2; overflow-wrap: anywhere; }
.shop.tpl .t-foot-line { margin: 0 0 4px; color: var(--muted); }
.shop.tpl .t-foot-line a { color: var(--ink); font-weight: 600; }
.shop.tpl .t-legal { display: flex; flex-wrap: wrap; gap: 6px 20px; margin-top: 18px; font-size: .9rem; }
.shop.tpl .t-legal :is(a, .link) { color: var(--ink); text-decoration: underline; min-height: 44px; display: inline-flex; align-items: center; font-weight: 500; text-align: left; }
.shop.tpl .t-footer .socials { margin-top: 14px; }
.shop.tpl .t-footer .socials a { min-height: 44px; display: inline-flex; align-items: center; color: var(--ink); border-color: var(--line); }
.shop.tpl .t-foot-cols { display: grid; gap: 22px; }
@media (min-width: 700px) { .shop.tpl .t-foot-cols { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.shop.tpl .t-foot-cols h2 { margin: 0 0 6px; font: 700 .78rem/1.3 var(--t-body); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); font-style: normal; }
.shop.tpl .menu-nav { margin-top: 18px; }
.shop.tpl .cat-tabs a { min-height: 44px; display: inline-flex; align-items: center; transition: color .2s ease, background-color .2s ease, border-color .2s ease; }
.shop.tpl .cat-group { flex: none; align-self: center; font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); padding-left: 14px; border-left: 1px solid var(--line); }
.shop.tpl .cat-group:first-child { padding-left: 0; border-left: 0; }

/* ---------- a column of section links beside the menu on wide screens (Indian & Pakistani) */
.shop.tpl .side-col { display: none; }
@media (min-width: 1200px) {
  .shop.tpl .shop-grid.has-side { grid-template-columns: 184px minmax(0, 1fr) 360px; }
  .shop.tpl .shop-grid.has-side .side-col { display: block; padding-top: 18px; }
  .shop.tpl .shop-grid.has-side .menu-nav .cat-tabs { display: none; }
  .shop.tpl .shop-grid.has-side .menu-nav { padding-bottom: 12px; }
}
.shop.tpl .side-nav { position: sticky; top: 16px; display: flex; flex-direction: column; gap: 2px; max-height: calc(100vh - 32px); overflow: auto; margin: 0; }
.shop.tpl .side-nav .side-title { margin: 0 0 8px; font-size: .74rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.shop-body .shop.tpl .side-nav a { white-space: normal; padding: 9px 12px; border-bottom: 0; border-left: 3px solid var(--line); color: var(--muted); font-weight: 600; line-height: 1.3; }
.shop-body .shop.tpl .side-nav a.active, .shop-body .shop.tpl .side-nav a:hover { color: var(--ink); border-left-color: var(--brand); background: var(--t-tint); }

/* =====================================================================================================
   PAGE SECTIONS (website builder): featured dishes, promo banners, story, gallery, opening hours and info.
   Shared shapes here (Classic too); each template adds its own look further down.
   ===================================================================================================== */
.shop .t-sec { position: relative; padding-top: var(--t-sec); }
.shop .t-sec.at-before:first-of-type { padding-top: calc(var(--t-sec) * .75); }
.shop .t-sec h2 { margin: 0; font-size: clamp(1.6rem, 5.4vw, 2.5rem); line-height: 1.08; overflow-wrap: anywhere; }
.shop .t-sec-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.shop .t-photo { display: block; width: 100%; height: 100%; object-fit: cover; }
/* Featured dishes: they scroll sideways on a phone, a grid on a computer. The cards are the menu's own dish cards. */
.shop .t-feat-track { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(220px, 74%); gap: 14px; margin: 0 -16px; padding: 4px 16px 10px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; list-style: none; }
.shop .t-feat-cell { min-width: 0; scroll-snap-align: start; display: flex; }
@media (min-width: 600px) { .shop .t-feat-track { grid-auto-columns: minmax(240px, 42%); } }
@media (min-width: 1024px) {
  .shop .t-feat-track { grid-auto-flow: row; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; padding: 4px 0 0; overflow: visible; }
  .shop .t-feat-track.many { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.shop .mi.feat { flex-direction: column-reverse; justify-content: flex-end; gap: 0; padding: 0; min-height: 0; overflow: hidden; height: 100%; }
.shop .mi.feat .mi-media { width: 100%; height: auto; aspect-ratio: 4 / 3; border-radius: 0; }
.shop .mi.feat .mi-media img { border-radius: 0; transition: transform .6s cubic-bezier(.2, .7, .2, 1); }
.shop .mi.feat:hover .mi-media img { transform: scale(1.04); }
.shop .mi.feat .mi-text { padding: 14px 16px 16px; }
.shop .mi.feat .mi-desc { -webkit-line-clamp: 2; }
.shop .mi.feat.noimg .mi-media { position: absolute; right: 12px; bottom: 12px; width: auto; aspect-ratio: auto; }
.shop .mi.feat.noimg .mi-text { padding-right: 64px; min-height: 140px; }
.shop.tpl .mi.feat.noimg .mi-media { position: relative; right: auto; bottom: auto; width: 100%; aspect-ratio: 4 / 3; }
.shop.tpl .mi.feat.noimg .mi-text { padding-right: 16px; min-height: 0; }
.shop.tpl .mi.feat .mi-ph { display: grid; place-items: center; width: 100%; height: 100%; background: var(--t-tint-2); color: var(--t-accent); font-family: var(--t-head); font-weight: var(--t-weight); font-style: var(--t-style); font-size: 3.6rem; }
.shop.tpl .mi.feat.noimg .mi-add { position: absolute; right: 10px; bottom: 10px; border: 0; box-shadow: 0 2px 10px rgba(0, 0, 0, .2); }
/* Promo banner: a photo with a panel of words, or a block of the takeaway's colour. The words always sit on a
   solid panel (never straight on the photo), so they stay readable whatever the photo looks like. */
.shop .t-promo { position: relative; display: block; overflow: hidden; isolation: isolate; }
.shop .t-promo.is-colour { background: var(--brand); color: var(--brand-ink); }
.shop .t-promo.is-photo { background: var(--ink); color: var(--bg); }
.shop .t-promo-media { position: relative; z-index: 0; aspect-ratio: 16 / 10; }
.shop .t-promo-body { position: relative; z-index: 1; width: 100%; max-width: 1200px; margin: 0 auto; padding: 32px 16px 36px; }
.shop .t-promo.is-photo .t-promo-body h2 { color: var(--bg); }
.shop .t-promo.is-colour .t-promo-body h2 { color: var(--brand-ink); }
.shop .t-promo-body h2 { max-width: 16ch; }
.shop .t-promo-body p { max-width: 46ch; margin: 10px 0 0; font-size: 1.08rem; line-height: 1.5; }
.shop .t-promo-btn { width: fit-content; margin-top: 20px; padding: 0 26px; border-radius: var(--t-btn-r); }
.shop-body .t-promo.is-photo .t-promo-btn { background: var(--bg); color: var(--ink); border-color: var(--bg); }
.shop-body .t-promo.is-colour .t-promo-btn { background: var(--brand-ink); color: var(--brand); border-color: var(--brand-ink); }
.shop-body .t-promo :focus-visible { outline-color: currentColor; }
.shop .t-promo .t-sample-tag { top: 10px; bottom: auto; }
@media (min-width: 900px) {
  .shop .t-promo.is-photo { display: grid; align-items: end; min-height: 480px; background: none; color: var(--ink); }
  .shop .t-promo.is-photo .t-promo-media { position: absolute; inset: 0; aspect-ratio: auto; z-index: -1; }
  .shop .t-promo.is-photo .t-promo-body { width: min(480px, 46%); margin: 0 0 44px max(24px, calc((100vw - 1200px) / 2 + 24px)); padding: 36px; border-radius: var(--r); background: var(--card); box-shadow: 0 30px 60px rgba(0, 0, 0, .25); }
  .shop .t-promo.is-photo .t-promo-body h2 { color: var(--ink); }
  .shop-body .t-promo.is-photo .t-promo-btn { background: var(--brand); color: var(--brand-ink); border-color: var(--brand); }
  .shop .t-promo-body { padding: 64px 24px 56px; }
}
/* The menu after sections above it: a little air before the offers and section links */
.shop .t-sec.at-before ~ .shop-grid { padding-top: calc(var(--t-sec) * .5); }
/* Story: the takeaway's own "About us" words, with a photo if they chose one */
.shop .t-story-grid { display: grid; gap: 24px; align-items: center; }
.shop .t-story-media { position: relative; overflow: hidden; aspect-ratio: 4 / 3; border-radius: var(--r); background: var(--soft); }
.shop .t-story-body .about-text { margin: 14px 0 0; max-width: 62ch; color: var(--ink); line-height: 1.7; white-space: pre-line; font-size: 1.04rem; }
@media (min-width: 900px) { .shop .t-story-grid.has-photo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; } }
/* Gallery */
.shop .t-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.shop .t-gallery li { position: relative; overflow: hidden; aspect-ratio: 1; border-radius: var(--r-sm); background: var(--soft); }
.shop .t-gallery.n1 { grid-template-columns: minmax(0, 1fr); }
.shop .t-gallery.n1 li { aspect-ratio: 16 / 9; }
@media (min-width: 900px) {
  .shop .t-gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
  .shop .t-gallery.n2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .shop .t-gallery.n3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .shop .t-gallery li:first-child:not(:only-child) { grid-row: span 2; grid-column: span 2; }
  .shop .t-gallery.n2 li:first-child, .shop .t-gallery.n3 li:first-child { grid-row: auto; grid-column: auto; }
}
/* Opening hours and info: the takeaway's real hours, address and delivery areas */
.shop .t-info-grid { display: grid; gap: 14px; }
@media (min-width: 900px) { .shop .t-info-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.shop .t-info-card { padding: 20px; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); min-width: 0; }
.shop .t-info-card h3 { margin: 0 0 12px; font-size: 1.1rem; }
.shop .t-info-card p { margin: 0 0 8px; line-height: 1.5; overflow-wrap: anywhere; }
.shop .t-info-card .socials { margin-top: 10px; }
.shop .t-hours { width: 100%; border-collapse: collapse; font-size: .95rem; }
.shop .t-hours :is(th, td) { padding: 7px 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; font-weight: 400; }
.shop .t-hours td { text-align: right; padding-left: 12px; }
.shop .t-hours tr.today :is(th, td) { font-weight: 700; }
.shop .t-zones { margin: 0 0 10px; padding: 0; list-style: none; }
.shop .t-zones li { padding: 6px 0; border-bottom: 1px solid var(--line); font-size: .93rem; line-height: 1.45; }

/* =====================================================================================================
   MOTION: only where it helps (photos settling in, sheets sliding up, the basket answering a tap), and none at
   all for people who ask for less motion
   ===================================================================================================== */
@media (prefers-reduced-motion: no-preference) {
  .shop.tpl .reveal { opacity: 0; transform: translateY(16px) scale(1.015); transition: opacity .7s ease, transform .9s cubic-bezier(.2, .7, .2, 1); }
  .shop.tpl .reveal.is-in { opacity: 1; transform: none; }
  .shop.tpl .t-hero .t-cover { animation: t-settle 1.4s cubic-bezier(.2, .7, .2, 1) both; }
  .shop.tpl .t-feat-cell { animation: t-rise .6s cubic-bezier(.2, .7, .2, 1) both; animation-delay: calc(var(--i, 0) * 60ms); }
  .tpl-body .sheet:not([hidden]) { animation: t-fade .2s ease both; }
  .tpl-body .sheet:not([hidden]) .sheet-panel { animation: t-up .34s cubic-bezier(.2, .8, .2, 1) both; }
  @media (min-width: 700px) { .tpl-body .sheet:not([hidden]) .sheet-panel { animation-name: t-pop; } }
  .tpl-body #view-basket.bump { animation: t-bump .5s cubic-bezier(.3, 1.6, .5, 1); }
  .tpl-body #view-basket.bump .count { animation: t-count .5s ease; }
  .tpl-body .basket-panel.bump { animation: t-glow .8s ease; }
  .shop.tpl .mi .mi-media img { transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
  .shop.tpl .mi:not(.soldout):hover .mi-media img { transform: scale(1.04); }
  .shop.tpl .t-cta, .shop .t-promo-btn { transition: transform .15s ease, box-shadow .15s ease; }
  .shop.tpl .t-cta:hover, .shop .t-promo-btn:hover { transform: translateY(-1px); }
}
@keyframes t-settle { from { transform: scale(1.06); opacity: .5; } to { transform: none; opacity: 1; } }
@keyframes t-rise { from { transform: translateY(14px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes t-fade { from { background: rgba(20, 16, 12, 0); } }
@keyframes t-up { from { transform: translateY(40px); opacity: .4; } to { transform: none; opacity: 1; } }
@keyframes t-pop { from { transform: translateY(14px) scale(.98); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes t-bump { 0% { transform: scale(1); } 40% { transform: scale(1.04); } 100% { transform: scale(1); } }
@keyframes t-count { 40% { transform: scale(1.35); } }
@keyframes t-glow { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--brand) 55%, transparent); } 100% { box-shadow: 0 0 0 14px color-mix(in srgb, var(--brand) 0%, transparent); } }
@media (prefers-reduced-motion: reduce) {
  .shop.tpl *, .tpl-body .sheet * { transition: none !important; animation: none !important; }
  .shop.tpl .reveal { opacity: 1; transform: none; }
}

/* =====================================================================================================
   1. SMASH BURGER: cinematic charcoal, oversized photo, the name huge across it, poster cards
   ===================================================================================================== */
.shop.t-burger:not(.t-site) { --bg-char: #121212; }
.shop.t-burger:not(.t-site) .bg-hero { background: var(--bg-char); color: #fff; }
.shop.t-burger:not(.t-site) .bg-bar { position: relative; z-index: 3; background: var(--bg-char); border-bottom: 1px solid rgba(255, 255, 255, .08); }
.shop.t-burger:not(.t-site) .bg-bar-in { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 64px; }
.shop.t-burger:not(.t-site) .bg-name { color: #fff; font-size: 1.05rem !important; }
.shop.t-burger:not(.t-site) .bg-logo { border-radius: var(--r-sm); background: #fff; }
.shop.t-burger:not(.t-site) .bg-bar .hero-actions { flex-wrap: nowrap; gap: 4px; }
.shop-body .shop.t-burger:not(.t-site) .bg-bar .hero-btn { background: transparent; color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22); font-size: .86rem; padding: 0 12px; }
.shop.t-burger:not(.t-site) .bg-bar .hero-btn:hover { background: rgba(255, 255, 255, .1); }
@media (max-width: 479px) { .shop.t-burger:not(.t-site) .bg-name { display: none; } }
.shop.t-burger:not(.t-site) .bg-stage { position: relative; overflow: hidden; display: flex; align-items: flex-end; min-height: 300px;
  background: repeating-linear-gradient(-45deg, var(--brand) 0 22px, color-mix(in srgb, var(--brand) 84%, #000) 22px 44px); color: var(--brand-ink); }
.shop.t-burger:not(.t-site) .bg-hero.has-photo .bg-stage { min-height: min(72svh, 640px); background: var(--bg-char); color: #fff; }
.shop.t-burger:not(.t-site)[data-hero="medium"] .bg-hero.has-photo .bg-stage { min-height: min(46svh, 420px); }
.shop.t-burger:not(.t-site) .bg-stage > .t-cover { position: absolute; inset: 0; }
.shop.t-burger:not(.t-site) .bg-hero.has-photo .bg-stage::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, .35) 0%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, .25) 55%, rgba(0, 0, 0, .88) 100%); }
.shop.t-burger:not(.t-site) .bg-stage .t-sample-tag { top: 12px; bottom: auto; }
.shop.t-burger:not(.t-site) .bg-copy { position: relative; z-index: 2; width: 100%; padding-top: 48px; padding-bottom: 28px; }
.shop.t-burger:not(.t-site) .bg-hero h1 { margin: 14px 0 10px; font-size: clamp(2.6rem, 13vw, 7.6rem); line-height: .88; color: inherit; overflow-wrap: anywhere; max-width: 12ch; }
.tpl-body:not([data-font="condensed"]):not([data-font="street"]) .shop.t-burger:not(.t-site) .bg-hero h1 { font-size: clamp(2.2rem, 10vw, 5.6rem); line-height: .98; }
.shop.t-burger:not(.t-site) .bg-hero .hero-tagline { margin: 0; color: inherit; font-size: 1.12rem; font-weight: 600; max-width: 36ch; }
.shop.t-burger:not(.t-site) .bg-hero.has-photo :is(h1, .hero-tagline) { text-shadow: 0 2px 18px rgba(0, 0, 0, .55); }
.shop.t-burger:not(.t-site) .bg-sticker { background: #fff; color: #111; font-weight: 800; transform: rotate(-2deg); box-shadow: 3px 3px 0 rgba(0, 0, 0, .45); border-radius: var(--r-sm); }
.shop.t-burger:not(.t-site) .bg-ctas { margin-top: 22px; }
.shop-body .shop.t-burger:not(.t-site) .bg-cta { min-height: 56px; background: var(--brand); color: var(--brand-ink); border: 0; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; box-shadow: 0 10px 30px rgba(0, 0, 0, .35); }
.shop-body .shop.t-burger:not(.t-site) .bg-hero:not(.has-photo) .bg-cta { background: #111; color: #fff; }
.shop.t-burger:not(.t-site) .bg-hero :focus-visible { outline-color: currentColor; }
.shop.t-burger:not(.t-site) .bg-orderbar { background: var(--bg-char); color: #fff; padding: 14px 0; border-top: 3px solid var(--brand); }
.shop.t-burger:not(.t-site) .bg-orderbar .wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; }
.shop.t-burger:not(.t-site) .bg-orderbar .type-toggle { background: rgba(255, 255, 255, .1); }
.shop.t-burger:not(.t-site) .bg-orderbar .type-toggle button { color: #fff; min-height: 44px; text-transform: uppercase; letter-spacing: .05em; font-size: .9rem; }
.shop.t-burger:not(.t-site) .bg-orderbar .type-toggle button.on { background: #fff; color: #111; }
.shop.t-burger:not(.t-site) .bg-orderbar .type-only { color: #fff; text-transform: uppercase; }
.shop.t-burger:not(.t-site) .bg-orderbar .hero-facts { color: rgba(255, 255, 255, .74); }
.shop.t-burger:not(.t-site) .bg-orderbar .fact b { color: #fff; }
.shop.t-burger:not(.t-site) .bg-orderbar .fact.good { color: #8be0a8; }
.shop.t-burger:not(.t-site) .bg-orderbar :focus-visible { outline-color: #fff; }
@media (min-width: 900px) { .shop.t-burger:not(.t-site) .bg-copy { padding-bottom: 56px; } }
/* Offers: loud blocks */
.shop.t-burger:not(.t-site) .bg-offers .offer-card:not(.loyalty) { background: var(--brand); color: var(--brand-ink); border: 0; }
.shop.t-burger:not(.t-site) .bg-offers .offer-card:not(.loyalty) > div > span { color: inherit; opacity: .9; }
.shop.t-burger:not(.t-site) .bg-offers .offer-card:not(.loyalty) .offer-icon { background: var(--brand-ink); color: var(--brand); }
.shop.t-burger:not(.t-site) .bg-offers .offer-card b { font-family: var(--t-head); font-weight: var(--t-weight); text-transform: var(--t-case); font-style: var(--t-style); font-size: 1.05rem; }
/* Section buttons: chunky capitals */
.shop-body .shop.t-burger:not(.t-site) .nav-chunky { border-bottom: 0; padding-bottom: 10px; }
.shop-body .shop.t-burger:not(.t-site) .nav-chunky .cat-tabs { gap: 8px; margin-top: 10px; padding-bottom: 2px; }
.shop-body .shop.t-burger:not(.t-site) .nav-chunky .cat-tabs a { padding: 0 16px; border: 2px solid var(--line); border-radius: var(--t-btn-r); color: var(--ink); font-weight: 800; text-transform: uppercase; font-size: .84rem; letter-spacing: .04em; }
.shop-body .shop.t-burger:not(.t-site) .nav-chunky .cat-tabs a.active, .shop-body .shop.t-burger:not(.t-site) .nav-chunky .cat-tabs a:hover { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.shop.t-burger:not(.t-site) .nav-chunky .search input { border-radius: var(--t-btn-r); }
.shop.t-burger:not(.t-site) .cat h2 { font-size: clamp(1.9rem, 7.4vw, 3rem); line-height: .95; }
/* Dishes: dark poster cards, the price as a tag in the takeaway's colour */
.shop.t-burger:not(.t-site) .mi-name { font-family: var(--t-head); font-weight: var(--t-weight); text-transform: var(--t-case); letter-spacing: var(--t-track); font-style: var(--t-style); font-size: 1.06rem; line-height: 1.12; }
.shop.t-burger:not(.t-site) .mi-price { width: fit-content; margin-top: 6px; padding: .2em .6em; border-radius: var(--r-sm); background: var(--brand); color: var(--brand-ink); font-weight: 800; }
.shop.t-burger:not(.t-site) .mi.soldout .mi-price { background: var(--soft); color: var(--ink); }
.shop.t-burger:not(.t-site) .mi-add { border-radius: var(--t-btn-r); background: var(--ink); color: var(--bg); box-shadow: none; }
.shop.t-burger:not(.t-site) .mi-add.has { background: var(--brand); color: var(--brand-ink); }
.shop.t-burger:not(.t-site) .items .mi { border-color: var(--line); }
.shop.t-burger:not(.t-site).l-list .items .mi-media { width: 112px; height: 112px; }
.shop.t-burger:not(.t-site).l-list .items .mi.noimg .mi-add { border: 0; }
.shop.t-burger:not(.t-site).l-grid .items { grid-template-columns: minmax(0, 1fr); gap: 14px; }
@media (min-width: 340px) { .shop.t-burger:not(.t-site).l-grid .items { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 900px) { .shop.t-burger:not(.t-site).l-grid .items { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
:is(.shop.t-burger:not(.t-site).l-grid .items, .shop.t-burger:not(.t-site) .popular-track) .mi { flex-direction: column-reverse; justify-content: flex-end; gap: 0; padding: 0; min-height: 0; overflow: hidden; }
:is(.shop.t-burger:not(.t-site).l-grid .items, .shop.t-burger:not(.t-site) .popular-track) .mi-media { width: 100%; height: auto; aspect-ratio: 1; border-radius: 0; }
:is(.shop.t-burger:not(.t-site).l-grid .items, .shop.t-burger:not(.t-site) .popular-track) .mi-media img { border-radius: 0; }
:is(.shop.t-burger:not(.t-site).l-grid .items, .shop.t-burger:not(.t-site) .popular-track, .shop.t-burger:not(.t-site) .t-feat-track) .mi.noimg .mi-media { position: relative; right: auto; bottom: auto; width: 100%; aspect-ratio: 1; }
:is(.shop.t-burger:not(.t-site).l-grid .items, .shop.t-burger:not(.t-site) .popular-track, .shop.t-burger:not(.t-site) .t-feat-track) .mi-ph { display: grid; place-items: center; width: 100%; height: 100%; color: var(--brand-ink); font-family: var(--t-head); font-weight: 900; font-size: 4.2rem;
  background: repeating-linear-gradient(-45deg, var(--brand) 0 14px, color-mix(in srgb, var(--brand) 86%, #000) 14px 28px); }
:is(.shop.t-burger:not(.t-site).l-grid .items, .shop.t-burger:not(.t-site) .popular-track) .mi.noimg .mi-add { position: absolute; right: 8px; bottom: 8px; border: 0; }
:is(.shop.t-burger:not(.t-site).l-grid .items, .shop.t-burger:not(.t-site) .popular-track) .mi-text { padding: 10px 12px 12px; min-height: 0; }
:is(.shop.t-burger:not(.t-site).l-grid .items, .shop.t-burger:not(.t-site) .popular-track) .mi-price { position: absolute; z-index: 2; top: 10px; left: 10px; margin: 0; box-shadow: 0 4px 14px rgba(0, 0, 0, .3); }
@media (max-width: 599px) { .shop.t-burger:not(.t-site).l-grid .items .mi-desc { display: none; } }
/* Featured: tall poster cards with the price stamped on the photo */
.shop.t-burger:not(.t-site) .sec-featured { background: var(--bg-char); color: #fff; padding-bottom: var(--t-sec); }
.shop.t-burger:not(.t-site) .sec-featured.at-before { padding-top: calc(var(--t-sec) * .8); }
.shop.t-burger:not(.t-site) .sec-featured h2 { color: #fff; font-size: clamp(2.2rem, 9vw, 4.4rem); line-height: .9; }
.shop.t-burger:not(.t-site) .mi.feat { background: #1c1c1c; color: #fff; border: 0; border-radius: var(--r); }
.shop.t-burger:not(.t-site) .mi.feat .mi-media { aspect-ratio: 4 / 5; }
.shop.t-burger:not(.t-site) .mi.feat .mi-name { font-size: 1.3rem; color: #fff; }
.shop.t-burger:not(.t-site) .mi.feat :is(.mi-desc, .mi-opts, .mi-allergens) { color: rgba(255, 255, 255, .7); }
.shop.t-burger:not(.t-site) .mi.feat .mi-price { position: absolute; z-index: 2; top: 12px; left: 12px; margin: 0; font-size: 1.05rem; box-shadow: 0 4px 14px rgba(0, 0, 0, .35); }
.shop.t-burger:not(.t-site) .mi.feat .mi-add { background: #fff; color: #111; width: 44px; height: 44px; }
.shop.t-burger:not(.t-site) .mi.feat .mi-add.has { background: var(--brand); color: var(--brand-ink); }
/* Promo: half photo, half a block of colour with huge words */
.shop.t-burger:not(.t-site) .t-promo.is-photo { background: var(--brand); color: var(--brand-ink); }
.shop.t-burger:not(.t-site) .t-promo.is-photo .t-promo-body h2 { color: var(--brand-ink); }
.shop-body .shop.t-burger:not(.t-site) .t-promo.is-photo .t-promo-btn { background: var(--brand-ink); color: var(--brand); border-color: var(--brand-ink); }
.shop.t-burger:not(.t-site) .sec-featured + .sec-promo, .shop.t-chicken .sec-featured + .sec-promo, .shop.t-grill .sec-featured + .sec-promo { padding-top: 0; }
@media (min-width: 900px) {
  .shop.t-burger:not(.t-site) .t-promo.is-photo { grid-template-columns: 1.1fr .9fr; align-items: stretch; min-height: 520px; }
  .shop.t-burger:not(.t-site) .t-promo.is-photo .t-promo-media { position: relative; inset: auto; z-index: 0; }
  .shop.t-burger:not(.t-site) .t-promo.is-photo .t-promo-body { display: flex; flex-direction: column; justify-content: center; width: auto; margin: 0; padding: 56px 48px; border-radius: 0; box-shadow: none; background: var(--brand); color: var(--brand-ink); }
  .shop.t-burger:not(.t-site) .t-promo.is-photo .t-promo-body h2 { color: var(--brand-ink); }
  .shop-body .shop.t-burger:not(.t-site) .t-promo.is-photo .t-promo-btn { background: var(--brand-ink); color: var(--brand); border-color: var(--brand-ink); }
}
.shop.t-burger:not(.t-site) .t-promo h2 { font-size: clamp(2.2rem, 9vw, 4.6rem); line-height: .9; }
.shop.t-burger:not(.t-site) .sec-story h2, .shop.t-burger:not(.t-site) .sec-info h2, .shop.t-burger:not(.t-site) .sec-gallery h2 { font-size: clamp(2rem, 8vw, 3.6rem); line-height: .92; }
.shop.t-burger:not(.t-site) .t-info-card { border-width: 2px; }
.shop.t-burger:not(.t-site) .bg-footer { background: var(--bg-char); color: #fff; border-top: 3px solid var(--brand); }
.shop.t-burger:not(.t-site) .bg-footer .t-foot-name { margin: 0 0 24px; font-size: clamp(2.2rem, 10vw, 4.4rem); line-height: .9; color: #fff; }
.shop.t-burger:not(.t-site) .bg-footer .t-foot-cols h2 { color: rgba(255, 255, 255, .62); }
.shop.t-burger:not(.t-site) .bg-footer :is(.t-foot-line, .t-foot-line a, .t-legal a, .t-legal .link) { color: #fff; }
.shop.t-burger:not(.t-site) .bg-footer .t-foot-line { color: rgba(255, 255, 255, .8); }
.shop.t-burger:not(.t-site) .bg-footer .socials a { color: #fff; border-color: rgba(255, 255, 255, .3); }
.shop.t-burger:not(.t-site) .bg-footer :focus-visible { outline-color: #fff; }
.shop.t-burger:not(.t-site) .basket-panel { border: 2px solid var(--line); box-shadow: none; }

/* =====================================================================================================
   2. ITALIAN & PIZZA: cream and burgundy, a printed-menu masthead, the photo in an oven's arch,
   numbered editorial picks, dishes as a printed menu with dotted leaders
   ===================================================================================================== */
.shop.t-pizzeria:not(.t-site) .pz-hero { padding-bottom: 8px; }
.shop.t-pizzeria:not(.t-site) .pz-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 56px; border-bottom: 1px solid var(--line); }
.shop.t-pizzeria:not(.t-site) .pz-kicker { margin: 0; font-size: .74rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
@media (max-width: 559px) { .shop.t-pizzeria:not(.t-site) .pz-kicker { display: none; } .shop.t-pizzeria:not(.t-site) .pz-top { justify-content: center; } }
.shop.t-pizzeria:not(.t-site) .pz-actions { gap: 2px; flex-wrap: nowrap; }
.shop-body .shop.t-pizzeria:not(.t-site) .pz-actions .hero-btn { background: transparent; padding: 0 10px; font-weight: 600; font-size: .9rem; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--ink) 25%, transparent); text-underline-offset: 4px; }
.shop.t-pizzeria:not(.t-site) .pz-actions .hero-btn:hover { text-decoration-color: currentColor; }
.shop.t-pizzeria:not(.t-site) .pz-mast { display: flex; flex-direction: column; align-items: center; gap: 6px; padding-top: 28px; padding-bottom: 24px; text-align: center; }
.shop.t-pizzeria:not(.t-site) .pz-logo { width: 72px; height: 72px; margin-bottom: 8px; border-radius: 50%; background: #fff; object-fit: contain; box-shadow: 0 0 0 1px var(--line); }
.shop.t-pizzeria:not(.t-site) .pz-logo.letter { display: grid; place-items: center; background: var(--brand); color: var(--brand-ink); font-size: 2.1rem; }
.shop.t-pizzeria:not(.t-site) .pz-hero h1 { margin: 0; font-size: clamp(2.4rem, 10vw, 5.4rem); line-height: .98; overflow-wrap: anywhere; color: var(--brand-text); }
.shop.t-pizzeria:not(.t-site) .pz-name { margin: 4px 0 0; font-size: .82rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.shop.t-pizzeria:not(.t-site) .pz-rule { display: flex; align-items: center; gap: 12px; width: min(260px, 70%); margin: 10px 0 4px; color: var(--brand-text); }
.shop.t-pizzeria:not(.t-site) .pz-rule::before, .shop.t-pizzeria:not(.t-site) .pz-rule::after { content: ""; flex: 1; height: 1px; background: currentColor; opacity: .5; }
.shop.t-pizzeria:not(.t-site) .pz-rule span { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.shop.t-pizzeria:not(.t-site) .pz-hero .hero-tagline { margin: 0; font-family: "Caladea", Georgia, serif; font-style: italic; font-size: clamp(1.15rem, 3.6vw, 1.45rem); line-height: 1.35; max-width: 34ch; }
.shop.t-pizzeria:not(.t-site) .pz-stage { display: grid; gap: 22px; }
.shop.t-pizzeria:not(.t-site) .pz-photo { position: relative; overflow: hidden; height: min(62vw, 360px); border-radius: 999px 999px var(--r) var(--r); background: var(--t-tint-2); }
.shop.t-pizzeria:not(.t-site)[data-hero="medium"] .pz-photo { height: min(44vw, 240px); }
.shop.t-pizzeria:not(.t-site) .pz-order { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
.shop.t-pizzeria:not(.t-site) .pz-order .type-toggle { background: transparent; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ink) 25%, transparent); }
.shop.t-pizzeria:not(.t-site) .pz-order .type-toggle button.on { background: var(--brand); color: var(--brand-ink); }
.shop.t-pizzeria:not(.t-site) .pz-order .hero-facts { justify-content: center; }
.shop.t-pizzeria:not(.t-site) .hero-status { background: transparent; box-shadow: inset 0 0 0 1px var(--line); }
@media (min-width: 900px) {
  .shop.t-pizzeria:not(.t-site) .pz-mast { padding-top: 44px; padding-bottom: 36px; }
  .shop.t-pizzeria:not(.t-site) .pz-stage:not(.no-photo) { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 64px; align-items: center; }
  .shop.t-pizzeria:not(.t-site) .pz-photo { order: 2; height: 520px; }
  .shop.t-pizzeria:not(.t-site)[data-hero="medium"] .pz-photo { height: 380px; }
  .shop.t-pizzeria:not(.t-site) .pz-stage:not(.no-photo) .pz-order { order: 1; align-items: flex-start; text-align: left; padding: 32px; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); }
  .shop.t-pizzeria:not(.t-site) .pz-stage:not(.no-photo) .pz-order .hero-facts { justify-content: flex-start; }
}
.shop.t-pizzeria:not(.t-site) .pz-offers .offer-card:not(.loyalty) { background: var(--card); border: 1.5px dashed color-mix(in srgb, var(--brand) 55%, var(--line)); }
.shop.t-pizzeria:not(.t-site) .nav-printed { border-top: 1px solid var(--line); }
.shop-body .shop.t-pizzeria:not(.t-site) .nav-printed .cat-tabs { gap: 22px; }
.shop.t-pizzeria:not(.t-site) .nav-printed .cat-tabs > :first-child { margin-left: auto; }
.shop.t-pizzeria:not(.t-site) .nav-printed .cat-tabs > :last-child { margin-right: auto; }
.shop-body .shop.t-pizzeria:not(.t-site) .nav-printed .cat-tabs a { font-size: .8rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.shop-body .shop.t-pizzeria:not(.t-site) .nav-printed .cat-tabs a.active, .shop-body .shop.t-pizzeria:not(.t-site) .nav-printed .cat-tabs a:hover { color: var(--ink); border-color: var(--brand); }
.shop.t-pizzeria:not(.t-site) .cat h2 { font-size: clamp(1.7rem, 5.4vw, 2.2rem); }
.shop.t-pizzeria:not(.t-site) .cat h2::after { content: ""; display: block; width: 44px; height: 3px; margin-top: 10px; background: var(--brand); border-radius: 2px; }
/* Dishes, photo beside: a printed menu line (name, dotted leader, price) with a round photo */
.shop.t-pizzeria:not(.t-site).l-list .items { gap: 0; column-gap: 44px; }
@media (min-width: 900px) { .shop.t-pizzeria:not(.t-site).l-list .items { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.shop.t-pizzeria:not(.t-site).l-list .items .mi { align-items: flex-start; gap: 16px; min-height: 0; padding: 18px 0; background: transparent; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; }
.shop.t-pizzeria:not(.t-site).l-list .items .mi:hover { box-shadow: none; border-color: color-mix(in srgb, var(--ink) 30%, var(--line)); }
.shop.t-pizzeria:not(.t-site).l-list .items .mi-media { width: 86px; height: 86px; border-radius: 50%; overflow: visible; }
.shop.t-pizzeria:not(.t-site).l-list .items .mi-media img { border-radius: 50%; }
.shop.t-pizzeria:not(.t-site).l-list .items .mi-add { right: -4px; bottom: -4px; width: 34px; height: 34px; font-size: 1.15rem; }
.shop.t-pizzeria:not(.t-site).l-list .items .mi.noimg .mi-media { width: 34px; height: 34px; align-self: center; }
.shop.t-pizzeria:not(.t-site).l-list .items .mi-text { display: grid; grid-template-columns: minmax(0, max-content) minmax(14px, 1fr) auto; row-gap: 4px; align-content: start; }
.shop.t-pizzeria:not(.t-site).l-list .items .mi-text > * { grid-column: 1 / -1; }
.shop.t-pizzeria:not(.t-site).l-list .items .mi-text::before { content: ""; grid-column: 2; grid-row: 1; align-self: end; margin: 0 8px .45em; border-bottom: 2px dotted color-mix(in srgb, var(--ink) 30%, transparent); }
.shop.t-pizzeria:not(.t-site).l-list .items .mi-name { grid-column: 1; grid-row: 1; font-family: var(--t-head); font-size: 1.14rem; }
.shop.t-pizzeria:not(.t-site).l-list .items .mi-price { grid-column: 3; grid-row: 1; align-self: end; margin: 0; padding: 0; font-weight: 700; font-size: 1.05rem; white-space: nowrap; }
.shop.t-pizzeria:not(.t-site).l-list .items .mi-desc { -webkit-line-clamp: 3; }
/* Dishes, big photo cards: the photo in an arch, words centred under it */
.shop.t-pizzeria:not(.t-site).l-grid .items { gap: 22px 14px; }
@media (min-width: 340px) { .shop.t-pizzeria:not(.t-site).l-grid .items { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 900px) { .shop.t-pizzeria:not(.t-site).l-grid .items { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
:is(.shop.t-pizzeria:not(.t-site).l-grid .items, .shop.t-pizzeria:not(.t-site) .popular-track) .mi { flex-direction: column-reverse; justify-content: flex-end; gap: 0; padding: 0; min-height: 0; background: transparent; border: 0; border-radius: 0; text-align: center; overflow: visible; }
:is(.shop.t-pizzeria:not(.t-site).l-grid .items, .shop.t-pizzeria:not(.t-site) .popular-track) .mi:hover { box-shadow: none; }
:is(.shop.t-pizzeria:not(.t-site).l-grid .items, .shop.t-pizzeria:not(.t-site) .popular-track) .mi-media { width: 100%; height: auto; aspect-ratio: 4 / 5; position: relative; border-radius: 999px 999px var(--r) var(--r); }
:is(.shop.t-pizzeria:not(.t-site).l-grid .items, .shop.t-pizzeria:not(.t-site) .popular-track) .mi-media img,
:is(.shop.t-pizzeria:not(.t-site).l-grid .items, .shop.t-pizzeria:not(.t-site) .popular-track) .mi-ph { width: 100%; height: 100%; border-radius: 999px 999px var(--r) var(--r); }
:is(.shop.t-pizzeria:not(.t-site).l-grid .items, .shop.t-pizzeria:not(.t-site) .popular-track) .mi.noimg .mi-media { position: relative; right: auto; bottom: auto; width: 100%; aspect-ratio: 4 / 5; }
:is(.shop.t-pizzeria:not(.t-site).l-grid .items, .shop.t-pizzeria:not(.t-site) .popular-track) .mi-ph { display: grid; place-items: center; background: var(--t-tint-2); color: var(--t-accent); font-family: var(--t-head); font-weight: var(--t-weight); font-size: 3.4rem; }
:is(.shop.t-pizzeria:not(.t-site).l-grid .items, .shop.t-pizzeria:not(.t-site) .popular-track) .mi.noimg .mi-add { position: absolute; }
:is(.shop.t-pizzeria:not(.t-site).l-grid .items, .shop.t-pizzeria:not(.t-site) .popular-track) .mi-text { padding: 12px 4px 0; align-items: center; min-height: 0; }
:is(.shop.t-pizzeria:not(.t-site).l-grid .items, .shop.t-pizzeria:not(.t-site) .popular-track) .mi-name { font-family: var(--t-head); font-size: 1.08rem; }
:is(.shop.t-pizzeria:not(.t-site).l-grid .items, .shop.t-pizzeria:not(.t-site) .popular-track) .mi-price { margin: 0; padding: 0; }
@media (max-width: 480px) { .shop.t-pizzeria:not(.t-site).l-grid .items .mi-desc { display: none; } }
/* Featured: a numbered list like the first page of a printed menu */
.shop.t-pizzeria:not(.t-site) .sec-featured .t-sec-head { justify-content: center; text-align: center; }
.shop.t-pizzeria:not(.t-site) .t-feat-track { counter-reset: feat; grid-auto-flow: row; grid-template-columns: minmax(0, 1fr); grid-auto-columns: auto; gap: 0; margin: 0; padding: 0; overflow: visible; }
@media (min-width: 900px) { .shop.t-pizzeria:not(.t-site) .t-feat-track, .shop.t-pizzeria:not(.t-site) .t-feat-track.many { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 56px; } }
.shop.t-pizzeria:not(.t-site) .mi.feat { counter-increment: feat; flex-direction: row-reverse; align-items: center; gap: 18px; padding: 18px 0; background: transparent; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; overflow: visible; }
.shop.t-pizzeria:not(.t-site) .mi.feat:hover { box-shadow: none; }
.shop.t-pizzeria:not(.t-site) .mi.feat::before { order: 3; content: counter(feat, decimal-leading-zero); flex: none; width: 2.2em; font-family: "Caladea", Georgia, serif; font-style: italic; font-size: 1.5rem; color: var(--brand-text); }
.shop.t-pizzeria:not(.t-site) .mi.feat .mi-media, .shop.t-pizzeria:not(.t-site) .mi.feat.noimg .mi-media { width: 96px; height: 96px; aspect-ratio: 1; border-radius: 50%; overflow: hidden; }
.shop.t-pizzeria:not(.t-site) .mi.feat.noimg .mi-media { overflow: visible; }
.shop.t-pizzeria:not(.t-site) .mi.feat .mi-media img { border-radius: 50%; }
.shop.t-pizzeria:not(.t-site) .mi.feat .mi-ph { border-radius: 50%; font-size: 2rem; }
.shop.t-pizzeria:not(.t-site) .mi.feat .mi-add { right: -4px; bottom: -4px; width: 34px; height: 34px; font-size: 1.1rem; }
.shop.t-pizzeria:not(.t-site) .mi.feat .mi-text { padding: 0; }
.shop.t-pizzeria:not(.t-site) .mi.feat .mi-name { font-family: var(--t-head); font-size: 1.2rem; }
.shop.t-pizzeria:not(.t-site) .mi.feat .mi-price { color: var(--brand-text); font-weight: 700; }
.shop.t-pizzeria:not(.t-site) .t-sec h2 { text-align: center; }
.shop.t-pizzeria:not(.t-site) .t-story-body h2, .shop.t-pizzeria:not(.t-site) .t-promo h2 { text-align: left; }
/* Promo: the photo framed, with a cream card laid over it */
.shop.t-pizzeria:not(.t-site) .sec-promo .t-promo { max-width: 1152px; margin: 0 auto; border-radius: var(--r); }
@media (min-width: 1200px) { .shop.t-pizzeria:not(.t-site) .sec-promo { padding-left: 24px; padding-right: 24px; } }
.shop.t-pizzeria:not(.t-site) .t-promo.is-photo { background: var(--t-tint); color: var(--ink); }
.shop.t-pizzeria:not(.t-site) .t-promo.is-photo .t-promo-body h2 { color: var(--brand-text); }
.shop-body .shop.t-pizzeria:not(.t-site) .t-promo.is-photo .t-promo-btn { background: var(--brand); color: var(--brand-ink); border-color: var(--brand); }
@media (min-width: 900px) {
  .shop.t-pizzeria:not(.t-site) .t-promo.is-photo { align-items: center; background: none; }
  .shop.t-pizzeria:not(.t-site) .t-promo.is-photo .t-promo-body { margin: 0 0 0 56px; background: var(--bg); }
}
.shop.t-pizzeria:not(.t-site) .t-story-body .about-text { font-family: "Caladea", Georgia, serif; font-size: 1.2rem; line-height: 1.65; }
.shop.t-pizzeria:not(.t-site) .t-story-body .about-text::first-letter { float: left; margin: .06em .1em 0 0; font-size: 3.4em; line-height: .8; color: var(--brand-text); font-weight: 700; }
.shop.t-pizzeria:not(.t-site) .t-story-grid:not(.has-photo) { text-align: center; }
.shop.t-pizzeria:not(.t-site) .t-story-grid:not(.has-photo) h2 { text-align: center; }
.shop.t-pizzeria:not(.t-site) .t-story-grid:not(.has-photo) .about-text { margin-left: auto; margin-right: auto; text-align: left; }
.shop.t-pizzeria:not(.t-site) .t-story-media { border-radius: 999px 999px var(--r) var(--r); aspect-ratio: 4 / 5; }
.shop.t-pizzeria:not(.t-site) .t-info-card { background: transparent; border-width: 1px 0 0; border-radius: 0; padding: 20px 0 0; }
.shop.t-pizzeria:not(.t-site) .pz-footer { text-align: center; border-top: 1px solid var(--line); }
.shop.t-pizzeria:not(.t-site) .pz-foot-logo { width: 56px; height: 56px; margin: 0 auto 12px; border-radius: 50%; object-fit: contain; background: #fff; box-shadow: 0 0 0 1px var(--line); }
.shop.t-pizzeria:not(.t-site) .pz-foot-logo.letter { display: grid; place-items: center; background: var(--brand); color: var(--brand-ink); font-size: 1.5rem; }
.shop.t-pizzeria:not(.t-site) .pz-footer :is(.socials, .t-legal) { justify-content: center; }
.shop.t-pizzeria:not(.t-site) .pz-footer .t-legal .link { text-align: center; }
.shop.t-pizzeria:not(.t-site) .basket-panel { box-shadow: none; }

/* =====================================================================================================
   3. SHAWARMA & GRILL: deep olive and charcoal with a warm accent, words on an olive panel beside the photo,
   section tiles, quick rows with an Add button
   ===================================================================================================== */
.shop.t-grill { --gr-olive: #34402b; --gr-olive-2: #2a3423; --gr-char: #1b1d18; --gr-cream: #f3eee2; }
.shop.t-grill .gr-bar { background: var(--gr-char); color: #fff; }
.shop.t-grill .gr-bar-in { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 64px; }
.shop.t-grill .gr-name { color: #fff; }
.shop.t-grill .gr-logo { border-radius: var(--r-sm); background: #fff; }
.shop.t-grill .gr-bar .hero-actions { flex-wrap: nowrap; gap: 4px; }
.shop-body .shop.t-grill .gr-bar .hero-btn { background: rgba(255, 255, 255, .1); color: #fff; font-size: .88rem; padding: 0 12px; }
.shop.t-grill .gr-bar .hero-btn:hover { background: rgba(255, 255, 255, .18); }
.shop.t-grill .gr-bar :focus-visible { outline-color: #fff; }
@media (max-width: 479px) { .shop.t-grill .gr-name { display: none; } }
.shop.t-grill .gr-stage { display: grid; background: var(--gr-olive); color: var(--gr-cream); }
.shop.t-grill .gr-photo { position: relative; overflow: hidden; height: min(58vw, 340px); }
.shop.t-grill[data-hero="medium"] .gr-photo { height: min(40vw, 220px); }
.shop.t-grill .gr-panel { position: relative; }
.shop.t-grill .gr-panel::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--brand); }
.shop.t-grill .gr-panel-in { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; max-width: 640px; padding: 28px 16px 32px; }
.shop.t-grill .gr-kicker { margin: 0; font-size: .76rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: color-mix(in srgb, var(--gr-cream) 72%, var(--gr-olive)); }
.shop.t-grill .gr-hero h1 { margin: 0; font-size: clamp(2.2rem, 9vw, 4.4rem); line-height: .98; color: #fff; overflow-wrap: anywhere; }
.tpl-body[data-font="rounded"] .shop.t-grill .gr-hero h1 { text-transform: uppercase; letter-spacing: -.01em; }
.shop.t-grill .gr-hero .hero-tagline { margin: 0; color: color-mix(in srgb, var(--gr-cream) 88%, var(--gr-olive)); font-size: 1.08rem; max-width: 40ch; }
.shop.t-grill .gr-hero .hero-status { background: rgba(255, 255, 255, .1); color: #fff; }
.shop.t-grill .gr-hero .hero-status.ok .dot { background: #8be0a0; }
.shop.t-grill .gr-hero .hero-status.bad .dot { background: #ff8a7a; }
.shop.t-grill .gr-hero .hero-facts { color: color-mix(in srgb, var(--gr-cream) 80%, var(--gr-olive)); }
.shop.t-grill .gr-hero .fact b { color: #fff; }
.shop.t-grill .gr-hero .fact::before { color: rgba(255, 255, 255, .55); }
.shop.t-grill .gr-hero .fact.good { color: #a6e7b8; }
.shop.t-grill .gr-toggle { display: flex; width: 100%; max-width: 440px; padding: 4px; background: rgba(0, 0, 0, .25); }
.shop.t-grill .gr-toggle button { flex: 1; min-height: 48px; color: #fff; font-size: 1rem; }
.shop.t-grill .gr-toggle button.on { background: var(--gr-cream); color: var(--gr-char); }
.shop.t-grill .gr-hero .type-only { color: #fff; }
.shop-body .shop.t-grill .gr-cta { background: var(--brand); color: var(--brand-ink); border: 0; min-height: 52px; font-weight: 700; }
.shop.t-grill .gr-hero :focus-visible { outline-color: #fff; }
@media (min-width: 900px) {
  .shop.t-grill .gr-hero.has-photo .gr-stage { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); }
  .shop.t-grill .gr-photo { order: 2; height: auto; min-height: 520px; }
  .shop.t-grill[data-hero="medium"] .gr-photo { min-height: 380px; }
  .shop.t-grill .gr-panel { display: flex; align-items: center; }
  .shop.t-grill .gr-panel::before { left: auto; right: 0; top: 0; bottom: 0; width: 4px; height: auto; }
  .shop.t-grill .gr-panel-in { margin-left: max(24px, calc((100vw - 1200px) / 2 + 24px)); padding: 48px 48px 48px 0; }
  .shop.t-grill .gr-hero:not(.has-photo) .gr-panel-in { padding: 56px 24px; }
}
.shop.t-grill .gr-deals .offer-card:not(.loyalty) { background: var(--gr-olive); color: var(--gr-cream); border: 0; border-left: 6px solid var(--brand); }
.shop.t-grill .gr-deals .offer-card:not(.loyalty) > div > span { color: color-mix(in srgb, var(--gr-cream) 80%, var(--gr-olive)); }
.shop.t-grill .gr-deals .offer-card:not(.loyalty) .offer-icon { background: var(--brand); color: var(--brand-ink); }
.shop.t-grill .gr-deals .offer-card b { font-size: 1.05rem; }
.shop.t-grill .gr-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 18px; }
@media (min-width: 600px) { .shop.t-grill .gr-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .shop.t-grill .gr-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.shop-body .shop.t-grill .gr-tiles a { display: flex; flex-direction: column; justify-content: center; gap: 2px; min-height: 64px; padding: 10px 14px; border-radius: var(--r-sm); border: 1px solid var(--line); background: var(--card); color: var(--ink); text-decoration: none; transition: border-color .2s ease, box-shadow .2s ease; }
.shop-body .shop.t-grill .gr-tiles a:hover { border-color: var(--brand); box-shadow: inset 4px 0 0 var(--brand); }
.shop.t-grill .gr-tiles b { font-weight: 700; line-height: 1.2; overflow-wrap: anywhere; }
.shop.t-grill .gr-tiles span { font-size: .8rem; color: var(--muted); }
.shop-body .shop.t-grill .nav-chips { border-bottom: 0; padding-bottom: 8px; }
.shop-body .shop.t-grill .nav-chips .cat-tabs { gap: 6px; margin-top: 10px; }
.shop-body .shop.t-grill .nav-chips .cat-tabs a { padding: 0 14px; border: 1px solid var(--line); border-radius: var(--t-btn-r); background: var(--card); color: var(--ink); font-weight: 650; font-size: .9rem; }
.shop-body .shop.t-grill .nav-chips .cat-tabs a.active, .shop-body .shop.t-grill .nav-chips .cat-tabs a:hover { background: var(--gr-olive); color: var(--gr-cream); border-color: var(--gr-olive); }
.shop.t-grill .cat h2 { padding-left: 12px; border-left: 6px solid var(--brand); font-size: clamp(1.4rem, 5vw, 1.8rem); }
.tpl-body[data-font="rounded"] .shop.t-grill :is(.cat h2, .t-sec h2) { text-transform: uppercase; letter-spacing: .01em; }
.shop.t-grill.l-list .items { gap: 10px; }
@media (min-width: 900px) { .shop.t-grill.l-list .items { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.shop.t-grill.l-list .items .mi { flex-direction: row-reverse; align-items: stretch; gap: 12px; min-height: 108px; padding: 10px; }
.shop.t-grill.l-list .items .mi-media { position: static; width: 84px; height: 84px; }
.shop.t-grill.l-list .items .mi.noimg .mi-media { width: 0; height: 0; }
.shop.t-grill.l-list .items .mi-text { padding-bottom: 2px; }
.shop.t-grill.l-list .items .mi-name { font-family: var(--t-head); font-weight: var(--t-weight); letter-spacing: var(--t-track); font-size: 1.04rem; line-height: 1.2; padding-right: 2px; }
.shop.t-grill.l-list .items .mi-price { min-height: 36px; display: flex; align-items: center; font-size: 1.08rem; font-weight: 800; padding-right: 96px; }
.shop.t-grill :is(.items, .popular-track, .t-feat-track) .mi-add { width: auto; min-width: 72px; height: 36px; padding: 0 14px; border: 0; border-radius: var(--t-btn-r); background: var(--brand); color: var(--brand-ink); box-shadow: none; font-size: 0; }
.shop.t-grill :is(.items, .popular-track, .t-feat-track) .mi-add::after { content: "Add"; font-size: .92rem; font-weight: 800; }
.shop.t-grill :is(.items, .popular-track, .t-feat-track) .mi-add.has { font-size: .92rem; font-weight: 800; background: var(--gr-olive); color: var(--gr-cream); }
.shop.t-grill :is(.items, .popular-track, .t-feat-track) .mi-add.has::after { content: " added"; white-space: pre; }
.shop.t-grill.l-list .items .mi-add, .shop.t-grill.l-list .items .mi.noimg .mi-add { position: absolute; right: 10px; bottom: 10px; }
.shop.t-grill.l-grid .items { gap: 12px; }
@media (min-width: 340px) { .shop.t-grill.l-grid .items { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 900px) { .shop.t-grill.l-grid .items { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
:is(.shop.t-grill.l-grid .items, .shop.t-grill .popular-track) .mi { flex-direction: column-reverse; justify-content: flex-end; gap: 0; padding: 0 0 52px; min-height: 0; overflow: hidden; }
:is(.shop.t-grill.l-grid .items, .shop.t-grill .popular-track) .mi-media { position: static; width: 100%; height: auto; aspect-ratio: 16 / 10; border-radius: 0; }
:is(.shop.t-grill.l-grid .items, .shop.t-grill .popular-track) .mi.noimg .mi-media { width: 100%; height: 6px; aspect-ratio: auto; background: var(--brand); }
:is(.shop.t-grill.l-grid .items, .shop.t-grill .popular-track) .mi-text { padding: 10px 12px 0; min-height: 0; }
:is(.shop.t-grill.l-grid .items, .shop.t-grill .popular-track) .mi-price { position: absolute; left: 12px; bottom: 12px; margin: 0; padding: 0; font-weight: 800; line-height: 36px; }
:is(.shop.t-grill.l-grid .items, .shop.t-grill .popular-track) .mi-add { position: absolute; right: 10px; bottom: 10px; min-width: 64px; }
@media (max-width: 599px) { .shop.t-grill.l-grid .items .mi-desc { display: none; } }
/* Featured: platters with a square photo beside the words */
.shop.t-grill .t-feat-track { grid-auto-columns: minmax(280px, 86%); }
@media (min-width: 600px) { .shop.t-grill .t-feat-track { grid-auto-columns: minmax(300px, 48%); } }
@media (min-width: 1024px) { .shop.t-grill .t-feat-track, .shop.t-grill .t-feat-track.many { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.shop.t-grill .mi.feat { flex-direction: row-reverse; align-items: stretch; gap: 0; border: 0; border-radius: var(--r); background: var(--card); box-shadow: inset 0 0 0 1px var(--line); }
.shop.t-grill .mi.feat .mi-media, .shop.t-grill .mi.feat.noimg .mi-media { flex: none; width: 42%; height: auto; aspect-ratio: auto; min-height: 168px; }
.shop.t-grill .mi.feat .mi-text { padding: 16px 16px 60px; }
.shop.t-grill .mi.feat .mi-name { font-family: var(--t-head); font-size: 1.15rem; }
.shop.t-grill .mi.feat .mi-price { position: absolute; left: calc(42% + 16px); bottom: 16px; margin: 0; padding: 0; font-weight: 800; font-size: 1.1rem; line-height: 36px; }
.shop.t-grill .mi.feat .mi-add, .shop.t-grill .mi.feat.noimg .mi-add { position: absolute; right: 14px; bottom: 16px; box-shadow: none; }
.shop.t-grill .sec-featured, .shop.t-grill .sec-info { background: var(--t-tint); padding-bottom: var(--t-sec); margin-top: var(--t-sec); padding-top: var(--t-sec); }
.shop.t-grill .t-sec.at-before:first-of-type { margin-top: 0; }
.shop.t-grill .sec-featured + .sec-info, .shop.t-grill .sec-info + .sec-featured { margin-top: 0; }
/* Promo: an olive band with the photo in a circle */
.shop.t-grill .t-promo.is-photo, .shop.t-grill .t-promo.is-colour { background: var(--gr-olive); color: var(--gr-cream); min-height: 0; }
.shop.t-grill .t-promo.is-photo::after { display: none; }
.shop.t-grill .t-promo.is-photo .t-promo-media { position: relative; z-index: 0; width: min(78vw, 360px); aspect-ratio: 1; margin: 36px auto 0; border-radius: 50%; overflow: hidden; box-shadow: 0 0 0 8px color-mix(in srgb, var(--brand) 85%, transparent); }
.shop.t-grill .t-promo-body h2, .shop.t-grill .t-promo.is-photo .t-promo-body h2 { color: #fff; }
.shop.t-grill .t-promo .t-promo-body { color: var(--gr-cream); }
.shop-body .shop.t-grill .t-promo .t-promo-btn { background: var(--brand); color: var(--brand-ink); border-color: var(--brand); }
@media (min-width: 900px) {
  .shop.t-grill .t-promo.is-photo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; min-height: 0; background: var(--gr-olive); }
  .shop.t-grill .t-promo.is-photo .t-promo-media { position: relative; inset: auto; order: 2; width: 400px; margin: 56px auto; aspect-ratio: 1; }
  .shop.t-grill .t-promo.is-photo .t-promo-body { width: auto; margin: 0 0 0 max(24px, calc((100vw - 1200px) / 2 + 24px)); padding: 56px 0; background: transparent; box-shadow: none; border-radius: 0; color: var(--gr-cream); }
  .shop.t-grill .t-promo.is-photo .t-promo-body h2 { color: #fff; }
}
.shop.t-grill .t-story-media { border-radius: var(--r); }
.shop.t-grill .gr-footer { background: var(--gr-char); color: #fff; }
.shop.t-grill .gr-footer :is(.t-foot-name, .t-foot-line a, .t-legal a, .t-legal .link) { color: #fff; }
.shop.t-grill .gr-footer .t-foot-line { color: rgba(255, 255, 255, .78); }
.shop.t-grill .gr-footer .t-foot-cols h2 { color: rgba(255, 255, 255, .6); }
.shop.t-grill .gr-footer .socials a { color: #fff; border-color: rgba(255, 255, 255, .3); }
.shop.t-grill .gr-footer :focus-visible { outline-color: #fff; }

/* =====================================================================================================
   4. INDIAN & PAKISTANI: rich but restrained, the name in spaced capitals with an ornament, a framed photo,
   section links beside a long menu, quick-to-scan rows
   ===================================================================================================== */
.shop.t-indian { --in-gold: #b08a3e; }
.shop.t-indian .in-util { background: var(--ink); color: var(--bg); font-size: .88rem; }
.shop.t-indian .in-util .wrap { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; }
.shop.t-indian .in-util-where { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; opacity: .85; }
@media (max-width: 599px) { .shop.t-indian .in-util-where { display: none; } .shop.t-indian .in-util .wrap { justify-content: center; } }
.shop.t-indian .in-util .hero-actions { flex-wrap: nowrap; gap: 0; }
.shop-body .shop.t-indian .in-util .hero-btn { background: transparent; color: var(--bg); border-radius: 0; padding: 0 12px; font-size: .88rem; text-decoration: none; }
.shop.t-indian .in-util .hero-btn:hover { background: transparent; text-decoration: underline; }
.shop.t-indian .in-util :focus-visible { outline-color: var(--bg); outline-offset: -3px; }
.shop.t-indian .in-head { display: flex; flex-direction: column; align-items: center; text-align: center; padding-top: 30px; }
.shop.t-indian .in-logo { width: 78px; height: 78px; margin-bottom: 16px; border-radius: 50%; padding: 4px; background: var(--card); object-fit: contain;
  box-shadow: 0 0 0 1px var(--in-gold), 0 0 0 5px var(--bg), 0 0 0 6px var(--in-gold); }
.shop.t-indian .in-logo.letter { display: grid; place-items: center; background: var(--brand); color: var(--brand-ink); font-size: 2.2rem; }
.shop.t-indian .in-hero h1 { margin: 0; font-size: clamp(1.9rem, 7.4vw, 3.6rem); line-height: 1.08; overflow-wrap: anywhere; text-transform: uppercase; letter-spacing: .08em; }
.tpl-body[data-font="editorial"] .shop.t-indian .in-hero h1, .tpl-body[data-font="street"] .shop.t-indian .in-hero h1 { letter-spacing: .02em; }
.shop.t-indian .in-name { margin: 6px 0 0; font-size: .82rem; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.shop.t-indian .in-orn { display: flex; align-items: center; gap: 10px; width: min(240px, 60%); margin: 14px auto 12px; color: var(--in-gold); }
.shop.t-indian .in-orn::before, .shop.t-indian .in-orn::after { content: ""; flex: 1; height: 1px; background: currentColor; opacity: .7; }
.shop.t-indian .in-orn span { width: 8px; height: 8px; background: currentColor; transform: rotate(45deg); box-shadow: 0 0 0 3px var(--bg), 0 0 0 4px currentColor; }
.shop.t-indian .in-hero .hero-tagline { margin: 0; font-family: "Caladea", Georgia, serif; font-style: italic; font-size: 1.2rem; }
.shop.t-indian .in-hero .hero-sub { margin: 6px 0 0; }
.shop.t-indian .in-stage { position: relative; margin-top: 26px; }
.shop.t-indian .in-cover { position: relative; overflow: hidden; height: min(56vw, 300px); border-radius: var(--r); background: var(--t-tint-2); }
.shop.t-indian[data-hero="medium"] .in-cover { height: min(40vw, 200px); }
.shop.t-indian .in-cover::after { content: ""; position: absolute; inset: 10px; border: 1px solid color-mix(in srgb, #fff 70%, var(--in-gold)); border-radius: max(0px, calc(var(--r) - 6px)); pointer-events: none; z-index: 2; }
.shop.t-indian .in-card { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; margin: -44px 12px 0; padding: 18px; border: 1px solid color-mix(in srgb, var(--in-gold) 45%, var(--line)); border-radius: var(--r); background: var(--card); box-shadow: 0 16px 36px rgba(0, 0, 0, .1); z-index: 3; }
.shop.t-indian .in-stage.no-photo .in-card { margin: 0 auto; max-width: 520px; align-items: center; text-align: center; }
.shop.t-indian .in-stage.no-photo .in-card .hero-facts { justify-content: center; }
.shop.t-indian .in-card .type-toggle { width: 100%; display: flex; }
.shop.t-indian .in-card .type-toggle button { flex: 1; }
.shop-body .shop.t-indian .in-cta { width: 100%; }
@media (min-width: 900px) {
  .shop.t-indian .in-stage:not(.no-photo) { margin-bottom: 48px; }
  .shop.t-indian .in-cover { height: 420px; }
  .shop.t-indian[data-hero="medium"] .in-cover { height: 300px; }
  .shop.t-indian .in-stage:not(.no-photo) .in-card { position: absolute; right: 52px; bottom: -36px; width: 390px; margin: 0; }
}
.shop.t-indian .in-offers .offer-card:not(.loyalty) { background: var(--card); border: 1px solid color-mix(in srgb, var(--in-gold) 45%, var(--line)); }
.shop.t-indian .in-offers .offer-card:not(.loyalty) .offer-icon { background: transparent; color: var(--brand-text); box-shadow: inset 0 0 0 1.5px currentColor; }
.shop-body .shop.t-indian .nav-underline .cat-tabs a { font-weight: 650; }
.shop-body .shop.t-indian .nav-underline .cat-tabs a.active, .shop-body .shop.t-indian .nav-underline .cat-tabs a:hover { border-color: var(--brand); color: var(--ink); }
.shop.t-indian .cat h2 { display: flex; align-items: center; gap: 12px; font-size: clamp(1.5rem, 5vw, 1.9rem); }
.shop.t-indian .cat h2::before { content: ""; flex: none; width: 9px; height: 9px; background: var(--in-gold); transform: rotate(45deg); }
.shop.t-indian.l-list .items { gap: 0; }
.shop.t-indian.l-list .items .mi { min-height: 0; gap: 18px; padding: 16px 0; background: transparent; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; }
.shop.t-indian.l-list .items .mi:hover { box-shadow: none; background: color-mix(in srgb, var(--brand) 4%, transparent); }
.shop.t-indian.l-list .items .mi-text { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 14px; row-gap: 4px; align-content: start; }
.shop.t-indian.l-list .items .mi-text > * { grid-column: 1 / -1; }
.shop.t-indian.l-list .items .mi-name { grid-column: 1; font-family: var(--t-head); font-size: 1.14rem; }
.shop.t-indian.l-list .items .mi-price { grid-column: 2; grid-row: 1; margin: 0; padding: 0; font-family: var(--t-head); font-weight: 700; font-size: 1.08rem; }
.shop.t-indian.l-list .items .mi-media { width: 84px; height: 84px; margin: 4px 4px 0 0; overflow: visible; }
.shop.t-indian.l-list .items .mi-media img { border-radius: var(--r-sm); outline: 1px solid color-mix(in srgb, var(--in-gold) 55%, var(--line)); outline-offset: 3px; }
.shop.t-indian .mi-add { width: 32px; height: 32px; font-size: 1.1rem; background: var(--card); color: var(--ink); box-shadow: 0 0 0 1px color-mix(in srgb, var(--in-gold) 60%, var(--line)), 0 2px 8px rgba(0, 0, 0, .12); }
.shop.t-indian .mi-add.has { background: var(--brand); color: var(--brand-ink); }
.shop.t-indian.l-list .items .mi-add { right: -8px; bottom: -8px; }
.shop.t-indian.l-list .items .mi.noimg .mi-media { width: 32px; height: 32px; margin: 0; align-self: flex-end; }
.shop.t-indian.l-grid .items { gap: 16px; }
:is(.shop.t-indian.l-grid .items, .shop.t-indian .popular-track) .mi { flex-direction: column-reverse; justify-content: flex-end; gap: 12px; padding: 10px; min-height: 0; border: 1px solid var(--line); background: var(--card); }
:is(.shop.t-indian.l-grid .items, .shop.t-indian .popular-track) .mi-media { width: 100%; height: auto; aspect-ratio: 3 / 2; }
:is(.shop.t-indian.l-grid .items, .shop.t-indian .popular-track) .mi.noimg .mi-media { position: relative; right: auto; bottom: auto; width: 100%; aspect-ratio: 3 / 2; }
:is(.shop.t-indian.l-grid .items, .shop.t-indian .popular-track) .mi-ph { display: grid; place-items: center; width: 100%; height: 100%; background: var(--t-tint); color: var(--t-accent); font-family: var(--t-head); font-weight: 700; font-size: 2.6rem; }
:is(.shop.t-indian.l-grid .items, .shop.t-indian .popular-track) .mi.noimg .mi-add { position: absolute; right: 6px; bottom: 6px; }
:is(.shop.t-indian.l-grid .items, .shop.t-indian .popular-track) .mi-text { padding: 0 4px 4px; min-height: 0; }
/* Featured: framed cards with a fine gold edge, names centred */
.shop.t-indian .sec-featured .t-sec-head { justify-content: center; text-align: center; }
.shop.t-indian .mi.feat { background: var(--card); border: 1px solid color-mix(in srgb, var(--in-gold) 40%, var(--line)); text-align: center; padding: 10px; }
.shop.t-indian .mi.feat .mi-media { border-radius: calc(var(--r) - 4px); aspect-ratio: 1; }
.shop.t-indian .mi.feat .mi-media::after { content: ""; position: absolute; inset: 8px; border: 1px solid rgba(255, 255, 255, .7); border-radius: max(0px, calc(var(--r) - 8px)); pointer-events: none; }
.shop.t-indian .mi.feat .mi-text { align-items: center; padding: 14px 8px 8px; }
.shop.t-indian .mi.feat .mi-name { font-family: var(--t-head); font-size: 1.15rem; }
.shop.t-indian .mi.feat .mi-price { color: var(--brand-text); font-family: var(--t-head); font-weight: 700; }
.shop.t-indian .mi.feat .mi-add { right: 14px; bottom: auto; top: 14px; }
.shop.t-indian .t-sec h2 { text-align: center; }
.shop.t-indian .t-sec-head { justify-content: center; }
@media (min-width: 1200px) { .shop.t-indian.l-list .shop-grid.has-side .items { grid-template-columns: minmax(0, 1fr); } }
.shop.t-indian .t-story-body h2 { text-align: left; }
.shop.t-indian .t-story-grid:not(.has-photo) { max-width: 760px; margin: 0 auto; text-align: center; }
.shop.t-indian .t-story-grid:not(.has-photo) h2 { text-align: center; }
.shop.t-indian .t-story-grid:not(.has-photo) .about-text { margin-left: auto; margin-right: auto; }
.shop.t-indian .t-story-media { outline: 1px solid var(--in-gold); outline-offset: 6px; }
/* Promo: a deep band in the takeaway's colour with a gold rule, the photo framed inside it */
.shop.t-indian .t-promo.is-photo { background: color-mix(in srgb, var(--brand) 88%, #000); color: #fff; }
.shop.t-indian .t-promo.is-photo .t-promo-body h2 { color: #fff; }
.shop-body .shop.t-indian .t-promo.is-photo .t-promo-btn { background: #fff; color: #111; border-color: #fff; }
@media (min-width: 900px) {
  .shop.t-indian .t-promo.is-photo { align-items: center; justify-items: center; background: none; }
  .shop.t-indian .t-promo.is-photo .t-promo-body { margin: 44px auto; background: var(--card); outline: 1px solid var(--in-gold); outline-offset: -10px; }
  .shop.t-indian .t-promo.is-photo .t-promo-body h2 { color: var(--ink); }
  .shop-body .shop.t-indian .t-promo.is-photo .t-promo-btn { background: var(--brand); color: var(--brand-ink); border-color: var(--brand); }
}
.shop.t-indian .t-promo-body { text-align: center; }
.shop.t-indian .t-promo-body :is(h2, p) { margin-left: auto; margin-right: auto; }
.shop.t-indian .t-promo-body .t-promo-btn { margin-left: auto; margin-right: auto; }
.shop.t-indian .t-promo-body h2::after { content: ""; display: block; width: 80px; height: 1px; margin: 14px auto 0; background: var(--in-gold); }
.shop.t-indian .t-info-card { border-color: color-mix(in srgb, var(--in-gold) 35%, var(--line)); }
.shop.t-indian .in-footer { border-top: 1px solid var(--line); background: var(--t-tint); }
.shop.t-indian .in-foot-grid { display: grid; gap: 24px; }
@media (min-width: 760px) { .shop.t-indian .in-foot-grid { grid-template-columns: 1.3fr 1fr 1fr; } }
.shop.t-indian .in-footer h2 { margin: 0 0 6px; font: 700 .78rem/1.3 var(--t-body); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.shop.t-indian .in-footer .link { color: var(--ink); text-decoration: underline; min-height: 44px; font-size: .92rem; }
.shop.t-indian .in-foot-legal { display: flex; flex-wrap: wrap; gap: 6px 22px; margin-top: 24px; padding-top: 14px; border-top: 1px solid var(--line); font-size: .88rem; color: var(--muted); }
.shop.t-indian .in-foot-legal a { color: var(--ink); min-height: 44px; display: inline-flex; align-items: center; }
.shop.t-indian .in-foot-legal span { display: inline-flex; align-items: center; min-height: 44px; }
.shop.t-indian .basket-panel { box-shadow: none; border-color: color-mix(in srgb, var(--in-gold) 35%, var(--line)); }

/* =====================================================================================================
   5. CAFÉ & BAKERY: soft cream, taupe and warm photography, generous space, a note card over the photo,
   clean product cards, food and drinks apart
   ===================================================================================================== */
.shop.t-cafe .cf-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 64px; }
.shop.t-cafe .cf-logo { border-radius: 50%; object-fit: cover; background: #fff; box-shadow: 0 0 0 1px var(--line); }
.shop.t-cafe .cf-name { font-size: 1.15rem !important; }
@media (max-width: 479px) { .shop.t-cafe .cf-name { display: none; } }
.shop.t-cafe .cf-bar .hero-actions { flex-wrap: nowrap; gap: 2px; }
.shop-body .shop.t-cafe .cf-bar .hero-btn { background: transparent; padding: 0 10px; font-size: .92rem; font-weight: 500; }
.shop.t-cafe .cf-bar .hero-btn:hover { background: var(--soft); }
.shop.t-cafe .cf-stage { position: relative; }
.shop.t-cafe .cf-cover { position: relative; overflow: hidden; height: min(70vw, 340px); border-radius: calc(var(--r) + 10px); background: var(--t-tint-2); }
.shop.t-cafe[data-hero="medium"] .cf-cover { height: min(46vw, 220px); }
.shop.t-cafe .cf-cover .t-sample-tag { top: 12px; bottom: auto; }
.shop.t-cafe .cf-note { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; margin: -72px 12px 0; padding: 22px; border-radius: calc(var(--r) + 6px); background: var(--card); box-shadow: 0 20px 50px rgba(60, 40, 20, .12); }
.shop.t-cafe .cf-stage.no-photo .cf-note { margin: 12px 0 0; box-shadow: none; background: var(--t-tint); padding: 32px 22px; }
.shop.t-cafe .cf-kicker { margin: 0; font-size: .74rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.shop.t-cafe .cf-note h1 { margin: 0; font-size: clamp(2rem, 8vw, 3.4rem); line-height: 1.02; overflow-wrap: anywhere; }
.tpl-body[data-font="modern"] .shop.t-cafe :is(h1, h2) { font-weight: 600; letter-spacing: -.025em; }
.shop.t-cafe .cf-note .hero-tagline { margin: 0; font-size: 1.06rem; color: var(--muted); line-height: 1.5; }
.shop.t-cafe .cf-note .type-toggle { margin-top: 4px; }
.shop-body .shop.t-cafe .cf-cta { background: var(--ink); color: var(--bg); border-color: var(--ink); }
@media (min-width: 900px) {
  .shop.t-cafe .cf-stage:not(.no-photo) { display: grid; grid-template-columns: minmax(0, 1fr); align-items: end; margin-top: 8px; }
  .shop.t-cafe .cf-cover { grid-area: 1 / 1; height: 560px; }
  .shop.t-cafe[data-hero="medium"] .cf-cover { height: 400px; }
  .shop.t-cafe .cf-stage:not(.no-photo) .cf-note { grid-area: 1 / 1; z-index: 1; width: min(480px, 48%); margin: 0 0 36px 36px; padding: 32px; }
}
.shop.t-cafe .cf-offers .offer-card:not(.loyalty) { background: var(--t-tint); border-color: transparent; }
.shop-body .shop.t-cafe .nav-soft { border-bottom: 0; }
.shop-body .shop.t-cafe .nav-soft .cat-tabs { gap: 8px; margin-top: 10px; padding-bottom: 10px; }
.shop-body .shop.t-cafe .nav-soft .cat-tabs a { padding: 0 16px; border: 0; border-radius: var(--t-btn-r); background: var(--soft); color: var(--ink); font-weight: 500; font-size: .92rem; }
.shop-body .shop.t-cafe .nav-soft .cat-tabs a.active, .shop-body .shop.t-cafe .nav-soft .cat-tabs a:hover { background: var(--ink); color: var(--bg); }
.shop.t-cafe .cat h2 { font-size: clamp(1.6rem, 6vw, 2.2rem); }
.shop.t-cafe.l-grid .items { gap: 26px 14px; }
@media (min-width: 340px) { .shop.t-cafe.l-grid .items { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 900px) { .shop.t-cafe.l-grid .items { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
:is(.shop.t-cafe.l-grid .cat:not(.drinks) .items, .shop.t-cafe .popular-track, .shop.t-cafe .t-feat-track) .mi { flex-direction: column-reverse; justify-content: flex-end; gap: 12px; padding: 0; min-height: 0; border: 0; background: transparent; overflow: visible; }
:is(.shop.t-cafe.l-grid .cat:not(.drinks) .items, .shop.t-cafe .popular-track, .shop.t-cafe .t-feat-track) .mi:hover { box-shadow: none; }
:is(.shop.t-cafe.l-grid .cat:not(.drinks) .items, .shop.t-cafe .popular-track, .shop.t-cafe .t-feat-track) .mi-media { width: 100%; height: auto; aspect-ratio: 4 / 3; border-radius: calc(var(--r) + 4px); }
:is(.shop.t-cafe.l-grid .cat:not(.drinks) .items, .shop.t-cafe .popular-track) .mi.noimg .mi-media { position: relative; right: auto; bottom: auto; width: 100%; aspect-ratio: 4 / 3; overflow: hidden; }
:is(.shop.t-cafe.l-grid .cat:not(.drinks) .items, .shop.t-cafe .popular-track, .shop.t-cafe .t-feat-track) .mi-ph { display: grid; place-items: center; width: 100%; height: 100%; background: var(--t-tint); color: var(--t-accent); font-family: "Caladea", Georgia, serif; font-style: italic; font-size: 3rem; }
:is(.shop.t-cafe.l-grid .cat:not(.drinks) .items, .shop.t-cafe .popular-track) .mi.noimg .mi-add { position: absolute; right: 8px; bottom: 8px; border: 0; box-shadow: 0 2px 10px rgba(0, 0, 0, .15); }
:is(.shop.t-cafe.l-grid .cat:not(.drinks) .items, .shop.t-cafe .popular-track, .shop.t-cafe .t-feat-track) .mi-text { padding: 0 2px; min-height: 0; }
:is(.shop.t-cafe.l-grid .cat:not(.drinks) .items, .shop.t-cafe .popular-track, .shop.t-cafe .t-feat-track) .mi-price { margin: 0; padding: 0; font-weight: 600; color: var(--ink); }
@media (max-width: 479px) { .shop.t-cafe.l-grid .cat:not(.drinks) .items .mi-desc { display: none; } }
.shop.t-cafe:not(.l-compact) .cat.drinks .items { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; column-gap: 32px; padding: 6px 22px; border-radius: calc(var(--r) + 6px); background: var(--t-tint); }
@media (min-width: 700px) { .shop.t-cafe:not(.l-compact) .cat.drinks .items { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.shop.t-cafe:not(.l-compact) .cat.drinks .items .mi { flex-direction: row; align-items: center; gap: 12px; min-height: 0; padding: 14px 0; border: 0; border-bottom: 1px dashed color-mix(in srgb, var(--ink) 18%, transparent); border-radius: 0; background: transparent; box-shadow: none; overflow: visible; }
.shop.t-cafe:not(.l-compact) .cat.drinks .items .mi-text { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 10px; row-gap: 2px; }
.shop.t-cafe:not(.l-compact) .cat.drinks .items .mi-text > * { grid-column: 1 / -1; }
.shop.t-cafe:not(.l-compact) .cat.drinks .items .mi-name { grid-column: 1; }
.shop.t-cafe:not(.l-compact) .cat.drinks .items .mi-price { grid-column: 2; grid-row: 1; margin: 0; padding: 0; }
.shop.t-cafe:not(.l-compact) .cat.drinks .items .mi-desc { -webkit-line-clamp: 1; }
.shop.t-cafe:not(.l-compact) .cat.drinks .items .mi-media { width: 46px; height: 46px; aspect-ratio: auto; position: relative; border-radius: 50%; overflow: visible; }
.shop.t-cafe:not(.l-compact) .cat.drinks .items .mi-media img { border-radius: 50%; }
.shop.t-cafe:not(.l-compact) .cat.drinks .items .mi-ph { display: none; }
.shop.t-cafe:not(.l-compact) .cat.drinks .items .mi-add { right: -6px; bottom: -6px; width: 28px; height: 28px; font-size: 1rem; }
.shop.t-cafe:not(.l-compact) .cat.drinks .items .mi.noimg .mi-media { width: 32px; height: 32px; }
.shop.t-cafe:not(.l-compact) .cat.drinks .items .mi.noimg .mi-add { position: static; width: 32px; height: 32px; }
.shop.t-cafe.l-list .cat:not(.drinks) .items .mi { flex-direction: row-reverse; border: 0; background: transparent; padding: 10px 0; min-height: 0; }
.shop.t-cafe.l-list .cat:not(.drinks) .items .mi:hover { box-shadow: none; }
.shop.t-cafe.l-list .cat:not(.drinks) .items .mi-media { width: 104px; height: 104px; border-radius: var(--r); }
.shop.t-cafe.l-list .cat:not(.drinks) .items .mi.noimg { flex-direction: row; }
/* Featured: clean cards, lots of air */
.shop.t-cafe .mi.feat .mi-add { width: 40px; height: 40px; background: var(--card); }
.shop.t-cafe .mi.feat .mi-name { font-size: 1.08rem; font-weight: 600; }
.shop.t-cafe .t-feat-track { gap: 18px; }
/* Promo: a soft rounded photo with a small card */
.shop.t-cafe .sec-promo > .t-promo { max-width: 1152px; margin: 0 16px; border-radius: calc(var(--r) + 10px); }
@media (min-width: 1200px) { .shop.t-cafe .sec-promo > .t-promo { margin: 0 auto; } }
.shop.t-cafe .t-promo.is-photo { background: var(--t-tint); color: var(--ink); }
.shop.t-cafe .t-promo.is-photo .t-promo-body h2 { color: var(--ink); }
.shop-body .shop.t-cafe .t-promo.is-photo .t-promo-btn { background: var(--ink); color: var(--bg); border-color: var(--ink); }
@media (min-width: 900px) { .shop.t-cafe .t-promo.is-photo { background: none; } .shop.t-cafe .t-promo.is-photo .t-promo-body { margin-left: 44px; } }
.shop.t-cafe .t-promo-body h2 { font-weight: 600; }
.shop.t-cafe .t-story-media { border-radius: calc(var(--r) + 10px); }
.shop.t-cafe .t-story-body .about-text { color: color-mix(in srgb, var(--ink) 82%, var(--bg)); }
.shop.t-cafe .t-info-card { border: 0; background: var(--t-tint); border-radius: calc(var(--r) + 6px); }
.shop.t-cafe .t-gallery li { border-radius: calc(var(--r) + 4px); }
.shop.t-cafe .cf-footer { border-top: 1px solid var(--line); }
.shop.t-cafe .cf-foot { display: grid; gap: 14px; }
@media (min-width: 760px) { .shop.t-cafe .cf-foot { grid-template-columns: 1fr auto; align-items: start; } .shop.t-cafe .cf-foot .t-legal { grid-column: 1 / -1; } }
.shop.t-cafe .basket-panel { box-shadow: 0 16px 40px rgba(60, 40, 20, .08); border-color: transparent; border-radius: calc(var(--r) + 6px); }

/* =====================================================================================================
   6. DESSERTS & SHAKES: close-up and playful but grown-up, an italic headline, the photo in a soft organic
   shape, pills, square cards, a mosaic of picks and a gentle suggestion in the basket
   ===================================================================================================== */
.shop.t-dessert .ds-hero { padding: 0 0 30px; background: var(--t-tint-2); border-radius: 0 0 36px 36px; }
.shop.t-dessert .ds-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 60px; }
.shop.t-dessert .ds-name { font-family: var(--t-head); font-weight: var(--t-weight); font-style: var(--t-style); font-size: 1.15rem; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 479px) { .shop.t-dessert .ds-name { display: none; } .shop.t-dessert .ds-bar { justify-content: center; } }
.shop.t-dessert .ds-bar .hero-actions { flex-wrap: nowrap; gap: 6px; }
.shop.t-dessert .ds-grid { display: grid; gap: 0; }
.shop.t-dessert .ds-photo { position: relative; overflow: hidden; height: min(72vw, 330px); border-radius: 40px 40px 50% 50% / 40px 40px 18% 18%; background: var(--card); }
.shop.t-dessert[data-hero="medium"] .ds-photo { height: min(50vw, 220px); }
.shop.t-dessert .ds-photo .t-sample-tag { top: 14px; bottom: auto; right: 18px; }
.shop.t-dessert .ds-text { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; padding-top: 14px; }
.shop.t-dessert .ds-logo { width: 88px; height: 88px; border-radius: 50%; border: 5px solid var(--card); background: var(--card); object-fit: contain; box-shadow: 0 8px 20px rgba(0, 0, 0, .1); position: relative; }
.shop.t-dessert .ds-photo + .ds-text .ds-logo { margin-top: -44px; }
.shop.t-dessert .ds-logo.letter { display: grid; place-items: center; background: var(--brand); color: var(--brand-ink); font-size: 2.3rem; }
.shop.t-dessert .ds-hero h1 { margin: 2px 0 0; font-size: clamp(2.4rem, 10vw, 4.6rem); line-height: 1; overflow-wrap: anywhere; color: var(--brand-text); }
.shop.t-dessert .ds-hero .hero-tagline { margin: 0; font-size: 1.08rem; max-width: 34ch; }
.shop.t-dessert .ds-hero .hero-sub { margin: 0; color: var(--muted); font-size: .92rem; }
.shop.t-dessert .ds-hero :is(.hero-status, .type-toggle, .hero-btn) { background: var(--card); }
.shop.t-dessert .ds-hero .hero-btn:hover { background: color-mix(in srgb, var(--card) 88%, var(--ink)); }
.shop.t-dessert .ds-hero .hero-facts { justify-content: center; }
.shop-body .shop.t-dessert .ds-cta { background: var(--brand); color: var(--brand-ink); border-color: var(--brand); }
@media (min-width: 900px) {
  .shop.t-dessert .ds-hero { padding-bottom: 56px; border-radius: 0 0 64px 64px; }
  .shop.t-dessert .ds-grid:not(.no-photo) { grid-template-columns: minmax(0, 1fr) minmax(0, 500px); gap: 64px; align-items: center; padding-top: 18px; }
  .shop.t-dessert .ds-photo { order: 2; height: auto; aspect-ratio: 1; border-radius: 58% 42% 52% 48% / 46% 54% 46% 54%; box-shadow: 0 0 0 12px var(--card); }
  .shop.t-dessert[data-hero="medium"] .ds-photo { height: auto; max-width: 380px; justify-self: end; width: 100%; }
  .shop.t-dessert .ds-grid:not(.no-photo) .ds-text { order: 1; align-items: flex-start; text-align: left; }
  .shop.t-dessert .ds-photo + .ds-text .ds-logo { margin-top: 0; }
  .shop.t-dessert .ds-grid:not(.no-photo) .hero-facts { justify-content: flex-start; }
}
.shop.t-dessert .ds-offers .offer-card:not(.loyalty) { background: var(--t-tint-2); border: 0; border-radius: calc(var(--r) + 8px); }
.shop-body .shop.t-dessert .nav-pills { border-bottom: 0; }
.shop-body .shop.t-dessert .nav-pills .cat-tabs { gap: 8px; margin-top: 10px; padding-bottom: 10px; }
.shop-body .shop.t-dessert .nav-pills .cat-tabs a { padding: 0 16px; border: 0; border-radius: var(--t-btn-r); background: var(--t-tint-2); color: var(--ink); font-weight: 600; }
.shop-body .shop.t-dessert .nav-pills .cat-tabs a.active, .shop-body .shop.t-dessert .nav-pills .cat-tabs a:hover { background: var(--brand); color: var(--brand-ink); }
.shop.t-dessert .nav-pills .search input { background: var(--t-tint); }
.shop.t-dessert .cat h2 { display: inline; font-size: clamp(1.6rem, 6vw, 2.1rem); background: linear-gradient(transparent 62%, var(--t-tint-2) 62%); }
.shop.t-dessert .cat h2 + .items { margin-top: 16px; }
.shop.t-dessert.l-grid .items { gap: 14px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 330px) { .shop.t-dessert.l-grid .items { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 900px) { .shop.t-dessert.l-grid .items { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
:is(.shop.t-dessert.l-grid .items, .shop.t-dessert .popular-track, .shop.t-dessert .t-feat-track) .mi { flex-direction: column-reverse; justify-content: flex-end; gap: 8px; padding: 8px; min-height: 0; border: 0; border-radius: calc(var(--r) + 8px); background: var(--t-tint); overflow: visible; }
:is(.shop.t-dessert.l-grid .items, .shop.t-dessert .popular-track, .shop.t-dessert .t-feat-track) .mi:hover { box-shadow: 0 10px 24px rgba(0, 0, 0, .08); }
:is(.shop.t-dessert.l-grid .items, .shop.t-dessert .popular-track, .shop.t-dessert .t-feat-track) .mi-media { width: 100%; height: auto; aspect-ratio: 1; border-radius: var(--r); }
:is(.shop.t-dessert.l-grid .items, .shop.t-dessert .popular-track) .mi.noimg .mi-media { position: relative; right: auto; bottom: auto; width: 100%; aspect-ratio: 1; }
:is(.shop.t-dessert.l-grid .items, .shop.t-dessert .popular-track, .shop.t-dessert .t-feat-track) .mi-ph { display: grid; place-items: center; width: 100%; height: 100%; border-radius: var(--r); color: var(--t-accent); font-family: var(--t-head); font-weight: 700; font-size: 3rem;
  background: radial-gradient(circle at 25% 30%, color-mix(in srgb, var(--brand) 22%, var(--card)) 0 7%, transparent 8%), radial-gradient(circle at 72% 64%, color-mix(in srgb, var(--brand) 22%, var(--card)) 0 5%, transparent 6%), radial-gradient(circle at 70% 22%, color-mix(in srgb, var(--brand) 14%, var(--card)) 0 4%, transparent 5%), var(--card); }
:is(.shop.t-dessert.l-grid .items, .shop.t-dessert .popular-track, .shop.t-dessert .t-feat-track) .mi-text { padding: 2px 6px 8px; min-height: 0; }
:is(.shop.t-dessert.l-grid .items, .shop.t-dessert .popular-track, .shop.t-dessert .t-feat-track) .mi-name { font-family: var(--t-head); font-weight: var(--t-weight); font-style: var(--t-style); font-size: 1.05rem; line-height: 1.25; }
:is(.shop.t-dessert.l-grid .items, .shop.t-dessert .popular-track, .shop.t-dessert .t-feat-track) .mi-price { width: fit-content; margin-top: 6px; padding: .15em .7em; border-radius: var(--pill); background: var(--card); font-weight: 700; }
.shop.t-dessert .mi-add { background: var(--brand); color: var(--brand-ink); box-shadow: 0 4px 12px rgba(0, 0, 0, .18); }
:is(.shop.t-dessert.l-grid .items, .shop.t-dessert .popular-track) .mi.noimg .mi-add { position: absolute; right: 6px; bottom: 6px; border: 0; }
@media (max-width: 479px) { .shop.t-dessert.l-grid .items .mi-desc { display: none; } }
.shop.t-dessert.l-list .items .mi { border: 0; background: var(--t-tint); border-radius: calc(var(--r) + 6px); }
.shop.t-dessert.l-list .items .mi.noimg .mi-add { border: 0; }
/* Featured: a mosaic, the first pick big */
@media (min-width: 1024px) {
  .shop.t-dessert .t-feat-track.many { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .shop.t-dessert .t-feat-track.many .t-feat-cell:first-child:nth-last-child(n+5) { grid-column: span 2; grid-row: span 2; }
  .shop.t-dessert .t-feat-track.many .t-feat-cell:first-child:nth-last-child(n+5) .mi-name { font-size: 1.5rem; }
}
.shop.t-dessert .sec-featured .t-sec-head h2, .shop.t-dessert .t-sec h2 { color: var(--brand-text); }
/* Promo: a seasonal band with sprinkles and a round photo */
.shop.t-dessert .sec-promo > .t-promo { margin: 0 16px; border-radius: 36px; }
@media (min-width: 1200px) { .shop.t-dessert .sec-promo > .t-promo { max-width: 1152px; margin: 0 auto; } }
.shop.t-dessert .t-promo.is-photo { background: var(--brand); color: var(--brand-ink); }
.shop.t-dessert .t-promo.is-photo .t-promo-body h2 { color: var(--brand-ink); }
.shop-body .shop.t-dessert .t-promo.is-photo .t-promo-btn { background: var(--brand-ink); color: var(--brand); border-color: var(--brand-ink); }
@media (min-width: 900px) { .shop.t-dessert .t-promo.is-photo { background: none; } .shop.t-dessert .t-promo.is-photo .t-promo-body { margin-left: 44px; border-radius: 28px; } .shop.t-dessert .t-promo.is-photo .t-promo-body h2 { color: var(--brand-text); } .shop-body .shop.t-dessert .t-promo.is-photo .t-promo-btn { background: var(--brand); color: var(--brand-ink); border-color: var(--brand); } }
.shop.t-dessert .t-promo.is-colour { background: radial-gradient(circle at 12% 20%, color-mix(in srgb, #fff 30%, transparent) 0 3px, transparent 4px) 0 0 / 46px 46px, var(--brand); }
.shop.t-dessert .t-promo-body h2 { font-family: "Caladea", Georgia, serif; font-style: italic; font-weight: 400; text-transform: none; }
.shop.t-dessert .t-story-media { border-radius: 58% 42% 52% 48% / 46% 54% 46% 54%; aspect-ratio: 1; }
.shop.t-dessert .t-story-grid:not(.has-photo) { max-width: 760px; margin: 0 auto; padding: 36px 24px; border-radius: 36px; background: var(--t-tint-2); text-align: center; }
.shop.t-dessert .t-story-grid:not(.has-photo) .about-text { margin-left: auto; margin-right: auto; }
.shop.t-dessert .t-info-card { border: 0; background: var(--t-tint); border-radius: calc(var(--r) + 8px); }
.shop.t-dessert .t-gallery li { border-radius: calc(var(--r) + 8px); }
.shop.t-dessert .ds-footer { background: var(--t-tint-2); border-radius: 36px 36px 0 0; text-align: center; }
.shop.t-dessert .ds-foot-logo { width: 60px; height: 60px; margin: 0 auto 10px; border-radius: 50%; border: 4px solid var(--card); background: var(--card); object-fit: contain; }
.shop.t-dessert .ds-foot-logo.letter { display: grid; place-items: center; background: var(--brand); color: var(--brand-ink); font-size: 1.5rem; }
.shop.t-dessert .ds-footer :is(.socials, .t-legal) { justify-content: center; }
.shop.t-dessert .ds-footer .t-legal .link { text-align: center; }
.shop.t-dessert .ds-footer .socials a { background: var(--card); }
.shop.t-dessert .basket-panel { border: 0; background: var(--t-tint); box-shadow: none; border-radius: calc(var(--r) + 8px); }
.shop.t-dessert .basket-panel .upsell { background: var(--card); }

/* =====================================================================================================
   7. FRIED CHICKEN & STREET FOOD: bold and fast. Ordering in the top bar, a slanted split banner, a ticker of the
   essentials, chunky chips and big Add buttons for one-handed ordering
   ===================================================================================================== */
.shop.t-chicken { --ck-yellow: #ffc533; --ck-black: #111; }
.shop.t-chicken .ck-bar { position: relative; z-index: 3; background: var(--ck-black); color: #fff; }
.shop.t-chicken .ck-bar-in { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 60px; }
.shop.t-chicken .ck-name { color: #fff; }
.shop.t-chicken .ck-logo { background: #fff; border-radius: var(--r-sm); }
.shop.t-chicken .ck-bar .hero-actions { flex-wrap: nowrap; gap: 4px; }
.shop-body .shop.t-chicken .ck-bar .hero-btn { background: transparent; color: #fff; font-size: .86rem; padding: 0 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.shop.t-chicken .ck-bar .hero-btn:hover { background: rgba(255, 255, 255, .12); }
.shop.t-chicken .ck-bar :focus-visible { outline-color: #fff; }
@media (max-width: 479px) { .shop.t-chicken .ck-name { display: none; } }
.shop.t-chicken .ck-stage { position: relative; display: grid; overflow: hidden; background: var(--brand); color: var(--brand-ink); }
.shop.t-chicken .ck-photo { position: relative; overflow: hidden; height: min(64vw, 360px); clip-path: polygon(0 0, 100% 0, 100% 86%, 0 100%); }
.shop.t-chicken[data-hero="medium"] .ck-photo { height: min(44vw, 230px); }
.shop.t-chicken .ck-photo .t-sample-tag { top: 10px; bottom: auto; }
.shop.t-chicken .ck-block-in { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 18px 16px 30px; max-width: 640px; }
.shop.t-chicken .ck-hero h1 { margin: 0; font-size: clamp(2.6rem, 12vw, 5.4rem); line-height: .86; color: inherit; overflow-wrap: anywhere; }
.shop.t-chicken .ck-hero .hero-tagline { margin: 0; color: inherit; font-size: 1.1rem; font-weight: 600; max-width: 34ch; }
.shop.t-chicken .ck-status { background: var(--ck-black); color: #fff; transform: skewX(-8deg); border-radius: 2px; font-weight: 700; }
.shop.t-chicken .ck-status.ok .dot { background: #7ee2a0; }
.shop.t-chicken .ck-ctas { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 6px; }
.shop-body .shop.t-chicken .ck-cta { background: var(--ck-yellow); color: var(--ck-black); border: 0; min-height: 56px; font-weight: 900; font-style: italic; text-transform: uppercase; letter-spacing: .02em; box-shadow: 4px 4px 0 var(--ck-black); }
.shop-body .shop.t-chicken .ck-cta:hover { box-shadow: 6px 6px 0 var(--ck-black); }
.shop.t-chicken .ck-toggle { background: color-mix(in srgb, var(--ck-black) 30%, transparent); }
.shop.t-chicken .ck-toggle button { color: var(--brand-ink); min-height: 48px; font-weight: 800; text-transform: uppercase; font-size: .88rem; }
.shop.t-chicken .ck-toggle button.on { background: #fff; color: var(--ck-black); }
.shop.t-chicken .ck-hero .type-only { color: inherit; }
.shop.t-chicken .ck-stage :focus-visible { outline-color: currentColor; }
.shop.t-chicken .ck-ticker { background: var(--ck-yellow); color: var(--ck-black); padding: 10px 0; }
.shop.t-chicken .ck-ticker .hero-facts { color: var(--ck-black); font-weight: 600; }
.shop.t-chicken .ck-ticker .fact b, .shop.t-chicken .ck-ticker .fact.good { color: var(--ck-black); }
.shop.t-chicken .ck-ticker .fact::before { color: var(--ck-black); }
@media (min-width: 900px) {
  .shop.t-chicken .ck-hero.has-photo .ck-stage { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); min-height: 540px; }
  .shop.t-chicken[data-hero="medium"] .ck-hero.has-photo .ck-stage { min-height: 400px; }
  .shop.t-chicken .ck-photo { order: 2; height: auto; clip-path: polygon(14% 0, 100% 0, 100% 100%, 0 100%); }
  .shop.t-chicken .ck-block { display: flex; align-items: center; }
  .shop.t-chicken .ck-block-in { margin-left: max(24px, calc((100vw - 1200px) / 2 + 24px)); padding: 56px 0 56px; }
  .shop.t-chicken .ck-hero:not(.has-photo) .ck-block-in { padding: 64px 24px; }
}
.shop.t-chicken .ck-deals .offer-card:not(.loyalty) { background: var(--ck-yellow); color: var(--ck-black); border: 0; border-radius: 2px; box-shadow: 4px 4px 0 var(--ck-black); }
.shop.t-chicken .ck-deals .offer-card:not(.loyalty) > div > span { color: var(--ck-black); opacity: .85; }
.shop.t-chicken .ck-deals .offer-card:not(.loyalty) .offer-icon { background: var(--ck-black); color: var(--ck-yellow); }
.shop.t-chicken .ck-deals .offer-card b { font-family: var(--t-head); font-weight: var(--t-weight); font-style: var(--t-style); text-transform: var(--t-case); font-size: 1.05rem; }
.shop-body .shop.t-chicken .ck-nav { border-bottom: 3px solid var(--ck-black); padding-bottom: 8px; }
.shop-body .shop.t-chicken .ck-nav .cat-tabs { gap: 6px; margin-top: 10px; }
.shop-body .shop.t-chicken .ck-nav .cat-tabs a { padding: 0 16px; border: 2px solid var(--ink); border-radius: var(--t-btn-r); color: var(--ink); font-weight: 900; font-style: italic; text-transform: uppercase; font-size: .86rem; letter-spacing: .02em; }
.shop-body .shop.t-chicken .ck-nav .cat-tabs a.active, .shop-body .shop.t-chicken .ck-nav .cat-tabs a:hover { background: var(--brand); color: var(--brand-ink); border-color: var(--brand); }
.shop.t-chicken .ck-nav .search input { border-radius: var(--t-btn-r); border: 2px solid var(--ink); }
.shop.t-chicken .cat h2 { font-size: clamp(2rem, 8vw, 3rem); line-height: .92; }
.shop.t-chicken .cat h2::after { content: ""; display: block; width: 64px; height: 6px; margin-top: 10px; background: var(--ck-yellow); transform: skewX(-20deg); }
.shop.t-chicken .mi-name { font-family: var(--t-head); font-weight: var(--t-weight); font-style: var(--t-style); text-transform: var(--t-case); letter-spacing: var(--t-track); font-size: 1.1rem; line-height: 1.1; }
.shop.t-chicken .mi-price { font-weight: 900; font-size: 1.1rem; }
/* Dishes, photo beside: big tap targets and a big Add */
.shop.t-chicken.l-list .items { gap: 10px; }
@media (min-width: 900px) { .shop.t-chicken.l-list .items { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.shop.t-chicken.l-list .items .mi { flex-direction: row-reverse; gap: 12px; min-height: 116px; padding: 10px; border: 2px solid var(--line); }
.shop.t-chicken.l-list .items .mi:hover { border-color: var(--ink); box-shadow: none; }
.shop.t-chicken.l-list .items .mi-media { position: static; width: 96px; height: 96px; }
.shop.t-chicken.l-list .items .mi.noimg .mi-media { width: 0; height: 0; }
.shop.t-chicken.l-list .items .mi-price { min-height: 40px; display: flex; align-items: center; padding-right: 104px; }
.shop.t-chicken :is(.items, .popular-track, .t-feat-track) .mi-add { width: auto; min-width: 84px; height: 40px; padding: 0 14px; border: 0; border-radius: var(--t-btn-r); background: var(--ck-yellow); color: var(--ck-black); box-shadow: 3px 3px 0 var(--ck-black); font-size: 0; }
.shop.t-chicken :is(.items, .popular-track, .t-feat-track) .mi-add::after { content: "+ Add"; font-size: .95rem; font-weight: 900; font-style: italic; text-transform: uppercase; }
.shop.t-chicken :is(.items, .popular-track, .t-feat-track) .mi-add.has { font-size: .95rem; font-weight: 900; background: var(--ck-black); color: #fff; box-shadow: none; }
.shop.t-chicken :is(.items, .popular-track, .t-feat-track) .mi-add.has::after { content: " in basket"; white-space: pre; font-style: normal; text-transform: none; font-weight: 700; }
.shop.t-chicken.l-list .items .mi-add, .shop.t-chicken.l-list .items .mi.noimg .mi-add { position: absolute; right: 12px; bottom: 12px; }
.shop.t-chicken.l-grid .items { gap: 12px; }
@media (min-width: 340px) { .shop.t-chicken.l-grid .items { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 900px) { .shop.t-chicken.l-grid .items { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
:is(.shop.t-chicken.l-grid .items, .shop.t-chicken .popular-track) .mi { flex-direction: column-reverse; justify-content: flex-end; gap: 0; padding: 0 0 58px; min-height: 0; overflow: hidden; border: 2px solid var(--line); }
:is(.shop.t-chicken.l-grid .items, .shop.t-chicken .popular-track) .mi-media { position: static; width: 100%; height: auto; aspect-ratio: 1; border-radius: 0; }
:is(.shop.t-chicken.l-grid .items, .shop.t-chicken .popular-track) .mi.noimg .mi-media { width: 100%; height: 8px; aspect-ratio: auto; background: var(--brand); }
:is(.shop.t-chicken.l-grid .items, .shop.t-chicken .popular-track) .mi-text { padding: 10px 12px 0; min-height: 0; }
:is(.shop.t-chicken.l-grid .items, .shop.t-chicken .popular-track) .mi-price { position: absolute; left: 12px; bottom: 14px; margin: 0; padding: 0; line-height: 40px; }
:is(.shop.t-chicken.l-grid .items, .shop.t-chicken .popular-track) .mi-add { position: absolute; right: 10px; bottom: 12px; min-width: 64px; }
@media (max-width: 599px) { .shop.t-chicken.l-grid .items .mi-desc { display: none; } :is(.shop.t-chicken.l-grid .items) .mi-add { min-width: 56px; padding: 0 10px; } }
/* Featured: deal cards with a slanted price tag */
.shop.t-chicken .sec-featured { background: var(--ck-black); color: #fff; padding-bottom: var(--t-sec); }
.shop.t-chicken .sec-featured h2 { color: #fff; font-size: clamp(2.2rem, 9vw, 4rem); line-height: .9; }
.shop.t-chicken .mi.feat { background: #1e1e1e; color: #fff; border: 0; border-radius: var(--r-sm); }
.shop.t-chicken .mi.feat .mi-media { aspect-ratio: 1; }
.shop.t-chicken .mi.feat .mi-name { color: #fff; font-size: 1.3rem; }
.shop.t-chicken .mi.feat :is(.mi-desc, .mi-opts, .mi-allergens) { color: rgba(255, 255, 255, .72); }
.shop.t-chicken .mi.feat .mi-text { padding-bottom: 18px; }
.shop.t-chicken .mi.feat .mi-price { position: absolute; z-index: 2; top: 12px; left: 8px; margin: 0; padding: .25em .7em; background: var(--brand); color: var(--brand-ink); transform: skewX(-10deg); box-shadow: 3px 3px 0 var(--ck-black); font-size: 1.15rem; }
.shop.t-chicken .mi.feat .mi-add, .shop.t-chicken .mi.feat.noimg .mi-add { position: absolute; left: 16px; right: 16px; bottom: 16px; width: auto; }
.shop.t-chicken .mi.feat .mi-add.has { background: #fff; color: var(--ck-black); }
/* Promo: a yellow band with a slanted photo */
.shop.t-chicken .t-promo.is-colour, .shop.t-chicken .t-promo.is-photo { background: var(--ck-yellow); color: var(--ck-black); min-height: 0; }
.shop.t-chicken .t-promo.is-photo::after { display: none; }
.shop.t-chicken .t-promo.is-photo .t-promo-media { position: relative; z-index: 0; height: min(60vw, 320px); aspect-ratio: auto; clip-path: polygon(0 0, 100% 0, 100% 84%, 0 100%); }
.shop.t-chicken .t-promo .t-promo-body, .shop.t-chicken .t-promo.is-photo .t-promo-body h2 { color: var(--ck-black); }
.shop.t-chicken .t-promo h2 { font-size: clamp(2.2rem, 9vw, 4.4rem); line-height: .9; }
.shop-body .shop.t-chicken .t-promo .t-promo-btn { background: var(--ck-black); color: #fff; border-color: var(--ck-black); }
@media (min-width: 900px) {
  .shop.t-chicken .t-promo.is-photo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; min-height: 0; background: var(--ck-yellow); }
  .shop.t-chicken .t-promo.is-photo .t-promo-media { position: relative; inset: auto; z-index: 0; order: 2; height: 100%; min-height: 440px; aspect-ratio: auto; clip-path: polygon(12% 0, 100% 0, 100% 100%, 0 100%); }
  .shop.t-chicken .t-promo.is-photo .t-promo-body { width: auto; margin: 0 0 0 max(24px, calc((100vw - 1200px) / 2 + 24px)); padding: 56px 0; background: transparent; box-shadow: none; border-radius: 0; }
  .shop-body .shop.t-chicken .t-promo.is-photo .t-promo-btn { background: var(--ck-black); color: #fff; border-color: var(--ck-black); }
}
.shop.t-chicken .sec-story h2, .shop.t-chicken .sec-info h2, .shop.t-chicken .sec-gallery h2 { font-size: clamp(2rem, 8vw, 3.4rem); line-height: .92; }
.shop.t-chicken .t-info-card { border: 2px solid var(--ink); border-radius: var(--r-sm); }
.shop.t-chicken .t-story-media { border-radius: var(--r-sm); }
.shop.t-chicken .ck-footer { background: var(--ck-black); color: #fff; border-top: 6px solid var(--ck-yellow); }
.shop.t-chicken .ck-footer .t-foot-name { font-size: clamp(2rem, 9vw, 3.6rem); line-height: .9; margin-bottom: 22px; color: #fff; }
.shop.t-chicken .ck-footer :is(.t-foot-line a, .t-legal a, .t-legal .link) { color: #fff; }
.shop.t-chicken .ck-footer .t-foot-line { color: rgba(255, 255, 255, .8); }
.shop.t-chicken .ck-footer .t-foot-cols h2 { color: rgba(255, 255, 255, .6); }
.shop.t-chicken .ck-footer .socials a { color: #fff; border-color: rgba(255, 255, 255, .3); }
.shop.t-chicken .ck-footer :focus-visible { outline-color: #fff; }
.shop.t-chicken .basket-panel { border: 2px solid var(--ink); border-radius: var(--r-sm); box-shadow: 5px 5px 0 var(--ck-yellow); }

/* ---------- the basket: suggestions (Desserts & Shakes) */
.tpl-body .upsell { margin-top: 14px; padding: 12px; border-radius: var(--r); background: var(--t-tint); }
.tpl-body .upsell-title { margin: 0 0 8px; font-weight: 700; font-size: .92rem; }
.tpl-body .upsell-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.tpl-body .upsell-item { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-height: 44px; padding: 6px; border: 0; border-radius: var(--r-sm); background: var(--card); color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.tpl-body .upsell-item img, .tpl-body .upsell-ph { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: calc(var(--r-sm) - 2px); }
.tpl-body .upsell-ph { display: grid; place-items: center; background: var(--t-tint-2); color: var(--t-accent); font-family: var(--t-head); font-weight: 700; font-size: 1.4rem; }
.tpl-body .upsell-name { font-size: .82rem; font-weight: 600; line-height: 1.25; overflow-wrap: anywhere; }
.tpl-body .upsell-price { font-size: .8rem; color: var(--muted); }

/* ---------- the "Popular" row in every template: a little narrower cards that scroll sideways */
.shop.tpl .popular-track .mi.card { width: 200px; }
.shop.tpl .popular-track .mi-desc, .shop.tpl .popular-track .mi-allergens { display: none; }

/* ---------- the order page after checkout (status.js) wears the template's fonts */
.tpl-body .status-page :is(h1, h3, .big) { font-family: var(--t-head); font-weight: var(--t-weight); font-style: var(--t-style); }
.tpl-body .status-brand { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 0 0 18px; font-family: var(--t-head); font-weight: var(--t-weight); font-style: var(--t-style); text-transform: var(--t-case); font-size: 1.2rem; }
.tpl-body a.status-brand { color: var(--ink); text-decoration: none; }
.tpl-body .status-brand img { width: 40px; height: 40px; border-radius: 50%; object-fit: contain; background: #fff; }