/* seo.css — the restaurant page's own blocks (/restaurants/<slug>).
   Everything else on the page is the homepage's bundle.css. Every value here reuses
   the homepage's tokens and recipes so the new blocks read as the same site:
     - section eyebrow  = .ta-pricing__eyebrow  (Figtree 600 12px, .22em, gold)
     - section title    = .ta-pricing__title    (Figtree Headline 600, clamp 24-48px)
     - panels, topbars  = the live monitor (.ta-live__panel / __topbar, css/live.css)
     - body text        = Figtree 400 15px/1.6, muted
   Mobile first: one column, bars that stay readable at 360px. */

.ta-rp{
  --rp-panel:#110f0d; --rp-top:#161513;
  --rp-t1:#F5F0E8; --rp-t2:#A39E93; --rp-t3:#6B665E;
  --rp-green:#4ADE80;
  --rp-bdr:rgba(245,240,232,.05); --rp-bdr-m:rgba(245,240,232,.08); --rp-bdr-s:rgba(245,240,232,.11);
}

/* ---- the H1 is a question, longer than the homepage's two words: let it wrap ---- */
.ta-rp .ta-hero__title{ white-space:normal; text-wrap:balance; font-size:clamp(34px,4.6vw,58px); }
@media (max-width:820px){ .ta-rp .ta-hero__title{ white-space:normal !important; font-size:clamp(28px,7.6vw,42px) !important; } }

/* ---- MOBILE HERO IS COMPACT (operator decision 2026-11-07): the homepage's scroll film
   (a 150svh scroll range with the phone pinned) pushed the short answer ~1,800px down.
   Here the phone is static and cropped to its lock-screen notification, as the homepage's
   own static mobile design does, so the answer sits right under the CTA. hero.js keeps
   running: with no scroll range its progress() returns 0 and the alert frame stays on.
   html[data-ta-hero="text"] is the no-phone alternative kept for comparison. ---- */
@media (max-width:820px){
  .ta-rp .ta-hero{ display:flex; flex-direction:column; min-height:0; padding-bottom:clamp(20px,3vh,32px); }
  .ta-rp .ta-hero__intro{ padding:clamp(26px,4vh,44px) 22px clamp(8px,1.4vh,14px); }
  .ta-rp .ta-hero__sub{ margin:0 0 18px; }
  .ta-rp .ta-hero__stagewrap{ height:auto; margin-top:22px; }
  .ta-rp .ta-hero__stage{ position:static; height:auto; min-height:0; padding:0; }
  .ta-rp .ta-hero__center{ align-items:flex-start; overflow:hidden; max-height:min(150px,37vw); }
  .ta-rp .ta-hero__photo{ width:min(340px,84vw); height:auto; }
  .ta-rp .ta-hero__steps, .ta-rp .ta-hero__scrollcue{ display:none !important; }
  html[data-ta-hero="text"] .ta-rp .ta-hero__stagewrap{ display:none; }
}

/* ---- hero facts strip (search-landing hero, 2026-11-07): real text under the answer
   line, above the CTA. Chips in the homepage's mono label voice. ---- */
.ta-rp .ta-hero__facts{ list-style:none; margin:0 0 22px; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.ta-rp .ta-hero__fact{ font:500 12px/1 var(--ta-mono); letter-spacing:.04em; color:var(--rp-t1);
  padding:8px 12px; border-radius:100px; border:.5px solid rgba(200,170,110,.45); background:rgba(200,170,110,.08); white-space:nowrap; }
@media (max-width:820px){ .ta-rp .ta-hero__facts{ justify-content:center; margin:-4px 0 18px; } .ta-rp .ta-hero__fact{ font-size:11px; padding:7px 10px; } }

/* ---- breadcrumb: a quiet line above the hero ---- */
/* the breadcrumb speaks the page's eyebrow language (mono, letter-spaced caps) so it
   reads as a label above the H1, not as a stray line of body text (operator 2026-11-12) */
.ta-crumbs{ max-width:var(--ta-container); margin:0 auto; padding:clamp(18px,2.4vh,26px) clamp(20px,5vw,40px) 2px;
  font:500 11px/1.4 var(--ta-mono); letter-spacing:.12em; text-transform:uppercase; color:var(--ta-muted);
  text-align:center; position:relative; z-index:3; }
.ta-crumbs__list{ list-style:none; margin:0; padding:0; display:inline-flex; flex-wrap:wrap; justify-content:center; gap:0 10px; }
.ta-crumbs__item{ display:inline-flex; align-items:center; gap:10px; }
.ta-crumbs__item + .ta-crumbs__item::before{ content:"/"; opacity:.4; font-weight:400; }
.ta-crumbs a{ color:var(--ta-muted); text-decoration:none; }
.ta-crumbs a:hover{ color:var(--ta-gold); }
.ta-crumbs [aria-current]{ color:var(--ta-gold); opacity:.9; }

/* ---- the short answer: one panel, four one-line answers ---- */
.ta-sa{ background:var(--ta-bg); padding:var(--sp-6) clamp(20px,5vw,40px) var(--sp-7); position:relative; z-index:2; }
.ta-sa__inner{ max-width:var(--ta-container-mid); margin:0 auto; }
.ta-sa__panel{ background:var(--rp-panel); border:.5px solid var(--rp-bdr-s); border-radius:16px; overflow:hidden;
  box-shadow:0 4px 32px rgba(0,0,0,.35), inset 0 0 0 .5px rgba(255,255,255,.02); }
.ta-sa__topbar{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 20px;
  border-bottom:.5px solid var(--rp-bdr-m); background:var(--rp-top); }
.ta-sa__title{ display:flex; align-items:center; gap:8px; margin:0; font:500 11px/1 var(--ta-mono); letter-spacing:.12em;
  text-transform:uppercase; color:var(--rp-t2); }
.ta-sa__dot{ width:6px; height:6px; border-radius:50%; background:var(--rp-green); flex:none; }
.ta-sa__updated{ font:400 11px/1 var(--ta-mono); color:var(--rp-t3); white-space:nowrap; }
.ta-sa__title, .ta-rb__topbar-l{ white-space:nowrap; }
@media (max-width:480px){
  .ta-sa__topbar, .ta-rb__topbar{ flex-wrap:wrap; row-gap:6px; }
  .ta-sa__updated, .ta-rb__topbar-r{ white-space:normal; flex:1 1 100%; text-align:left; line-height:1.4; }
}
.ta-sa__list{ margin:0; padding:0; }
.ta-sa__row{ display:grid; grid-template-columns:1fr; gap:4px; padding:16px 20px; border-bottom:.5px solid var(--rp-bdr); }
.ta-sa__row:last-child{ border-bottom:0; }
.ta-sa__q{ font:600 12px/1.2 var(--ta-sans); letter-spacing:.06em; text-transform:uppercase; color:var(--ta-gold); }
.ta-sa__a{ margin:0; font:400 16px/1.5 var(--ta-sans); color:var(--rp-t1); }
.ta-sa__note{ margin:0; padding:12px 20px 14px; border-top:.5px solid var(--rp-bdr-m); font:400 13px/1.5 var(--ta-sans); color:var(--rp-t2); }
@media (min-width:821px){
  .ta-sa__row{ grid-template-columns:200px 1fr; gap:20px; align-items:baseline; padding:16px 24px; }
  .ta-sa__topbar, .ta-sa__note{ padding-left:24px; padding-right:24px; }
}

/* ---- restaurant blocks: facts, numbers, steps, menu, sources ---- */
.ta-rb{ background:var(--ta-bg); color:var(--ta-ink); padding:var(--ta-sec-pad) clamp(20px,5vw,40px); position:relative; z-index:2; }
.ta-rb + .ta-rb{ padding-top:0; }
.ta-rb__inner{ max-width:var(--ta-container-mid); margin:0 auto; }
.ta-rb__inner--narrow{ max-width:var(--ta-container-narrow); }
.ta-rb__head{ text-align:center; margin:0 0 clamp(20px,3vw,32px); }
.ta-rb__eyebrow{ font:600 12px/1 var(--ta-sans); letter-spacing:.22em; text-transform:uppercase; color:var(--ta-gold); margin:0 0 16px; }
.ta-rb__title{ font-family:var(--ta-serif); font-weight:600; font-size:clamp(24px,5.6vw,48px); line-height:1.1;
  letter-spacing:-.03em; margin:0; color:var(--ta-ink); text-wrap:balance; }
.ta-rb__title--sm{ font-size:clamp(20px,3vw,28px); margin:0 0 12px; }
.ta-rb__lede{ font:400 15px/1.6 var(--ta-sans); color:var(--ta-muted); margin:14px auto 0; max-width:560px; }
.ta-rb__panel{ background:var(--rp-panel); border:.5px solid var(--rp-bdr-s); border-radius:16px; overflow:hidden;
  box-shadow:0 4px 32px rgba(0,0,0,.35), inset 0 0 0 .5px rgba(255,255,255,.02); }
.ta-rb__topbar{ display:flex; align-items:center; justify-content:space-between; padding:12px 20px;
  border-bottom:.5px solid var(--rp-bdr-m); background:var(--rp-top); }
.ta-rb__topbar-l{ display:flex; align-items:center; gap:8px; }
.ta-rb__dot{ width:6px; height:6px; border-radius:50%; background:var(--rp-green); }
.ta-rb__topbar-label{ font:500 11px/1 var(--ta-mono); letter-spacing:.12em; text-transform:uppercase; color:var(--rp-t2); }
.ta-rb__topbar-r{ font:400 11px/1 var(--ta-mono); color:var(--rp-t3); }
.ta-rb__src, .ta-rb__text{ font:400 13px/1.6 var(--ta-sans); color:var(--ta-muted); margin:14px 0 0; text-align:center; }
.ta-rb__text{ text-align:left; font-size:15px; margin:0 0 12px; }
.ta-rb__src a, .ta-rb__text a, .ta-sa__a a{ color:var(--ta-gold); text-decoration:none; }
.ta-rb__src a:hover, .ta-rb__text a:hover{ text-decoration:underline; }

/* facts and menu tables */
.ta-facts{ width:100%; border-collapse:collapse; font:400 15px/1.45 var(--ta-sans); }
.ta-facts th, .ta-facts td{ text-align:left; vertical-align:top; padding:14px 20px; border-top:.5px solid var(--rp-bdr); }
.ta-facts tr:first-child th, .ta-facts tr:first-child td{ border-top:0; }
.ta-facts th{ font-weight:500; color:var(--rp-t2); width:38%; }
.ta-facts td{ color:var(--rp-t1); }
.ta-facts td a{ color:var(--ta-gold); text-decoration:none; font-weight:600; }
.ta-facts--menu td{ text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; width:1%; }
.ta-facts--menu th{ width:auto; color:var(--rp-t1); font-weight:400; }
.ta-facts--menu .ta-bars__head th{ font:500 10px/1 var(--ta-mono); letter-spacing:.1em; text-transform:uppercase; color:var(--rp-t3); padding:12px 20px 0; }
.ta-facts--menu .ta-bars__head th:last-child{ text-align:right; width:1%; white-space:nowrap; }
.ta-menu__item{ display:block; font-weight:500; }
.ta-menu__note{ display:block; margin-top:3px; font-size:13px; line-height:1.45; color:var(--rp-t2); }
@media (max-width:520px){
  /* label beside the value, not above it: ten stacked rows were 1.4 screens (2026-11-12) */
  .ta-facts th, .ta-facts td{ padding:10px 12px; font-size:14px; line-height:1.4; }
  .ta-facts:not(.ta-facts--menu) th{ width:31%; font-size:12px; letter-spacing:.02em; padding-right:6px; }
}

/* the numbers: four bar blocks */
.ta-rb__grid{ display:grid; grid-template-columns:1fr; }
.ta-rb__block{ padding:20px 20px 22px; border-bottom:.5px solid var(--rp-bdr); }
.ta-rb__block:last-child{ border-bottom:0; }
.ta-rb__label{ margin:0 0 14px; font:500 11px/1 var(--ta-mono); letter-spacing:.1em; text-transform:uppercase; color:var(--rp-t2); }
/* each number block is a real table: the caption is the block label, the header row
   names the columns for a machine, the bar is decoration inside the share cell */
.ta-bars{ width:100%; border-collapse:collapse; }
.ta-bars caption{ text-align:left; caption-side:top; }
/* the column header row is VISIBLE (no hidden copy): small, muted, mono */
.ta-bars__head th{ font:500 10px/1 var(--ta-mono); letter-spacing:.1em; text-transform:uppercase; color:var(--rp-t3); padding:0 0 8px; text-align:left; border:0; white-space:nowrap; }
.ta-bars__head th:last-child{ text-align:right; }
.ta-rb__brow th, .ta-rb__brow td{ padding:5px 0; border:0; vertical-align:middle; }
.ta-rb__brow th{ width:1%; padding-right:12px; }
.ta-rb__bcell{ display:grid; grid-template-columns:1fr 44px; align-items:center; gap:12px; }
.ta-rb__blabel{ font:400 14px/1.2 var(--ta-sans); color:var(--rp-t1); white-space:nowrap; text-align:left; }
.ta-rb__btrack{ display:block; height:10px; border-radius:5px; background:rgba(245,240,232,.07); overflow:hidden; }
.ta-rb__bfill{ display:block; height:100%; border-radius:5px; background:var(--ta-gold); }
.ta-rb__bpct{ font:500 12px/1 var(--ta-mono); color:var(--rp-t2); text-align:right; font-variant-numeric:tabular-nums; }
.ta-rb__cap{ margin:12px 0 0; font:400 13px/1.45 var(--ta-sans); color:var(--rp-t2); }
@media (min-width:821px){
  .ta-rb__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ta-rb__block{ padding:22px 24px 24px; border-right:.5px solid var(--rp-bdr); }
  .ta-rb__block:nth-child(2n){ border-right:0; }
  .ta-rb__block:nth-last-child(-n+2){ border-bottom:0; }
  .ta-rb__topbar{ padding-left:24px; padding-right:24px; }
}

/* steps: a real sequence, so numbered */
.ta-rb__steps{ counter-reset:rbstep; list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; }
.ta-rb__step{ counter-increment:rbstep; position:relative; padding:2px 0 0 48px; min-height:32px;
  font:400 16px/1.55 var(--ta-sans); color:var(--rp-t1); }
.ta-rb__step::before{ content:counter(rbstep); position:absolute; left:0; top:0; width:32px; height:32px; border-radius:50%;
  border:1px solid rgba(200,170,110,.55); color:var(--ta-gold); font:600 14px/30px var(--ta-sans); text-align:center; }
.ta-rb__links{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin:24px 0 0; }
/* the booking-platform link: a plain text link, so it never competes with the one CTA */
.ta-rb__out{ display:inline-flex; align-items:center; gap:6px; padding:12px 6px; color:var(--rp-t2); text-decoration:none; font:500 14px/1 var(--ta-sans); }
.ta-rb__out:hover{ color:var(--ta-gold); text-decoration:underline; }
.ta-rb__cta{ display:inline-flex; align-items:center; gap:8px; padding:12px 20px; border-radius:100px; background:var(--ta-gold); color:#120f0a; font:600 15px/1 var(--ta-sans); text-decoration:none; }
.ta-rb__cta:hover{ filter:brightness(1.06); }
@media (max-width:480px){ .ta-rb__links{ flex-direction:column; align-items:stretch; } .ta-rb__out, .ta-rb__cta{ justify-content:center; }
  .ta-rb__lede, .ta-rb__src, .ta-rb__cap{ text-align:left; } }

/* sources */
.ta-rb--quiet{ padding-top:var(--sp-7); }
.ta-rb__sources{ margin:0; padding:0 0 0 18px; font:400 14px/1.7 var(--ta-sans); color:var(--ta-muted); }
.ta-rb__sources a{ color:var(--rp-t1); text-decoration:none; border-bottom:1px solid rgba(200,170,110,.45); }
.ta-rb__title--xs{ font-size:clamp(17px,2.2vw,20px); margin:22px 0 8px; }
.ta-rb__more a{ color:var(--ta-gold); border-bottom-color:transparent; }
.ta-rb__more a:hover{ border-bottom-color:rgba(200,170,110,.6); }

/* FAQ: each question sits in an h3 around the homepage's own button */
.ta-faq__q{ margin:0; font:inherit; }

/* footer standing line */
.ta-ft__standing{ max-width:560px; margin:8px auto 0; font-size:13px; opacity:.8; }

/* admin preview banner */
.ta-preview{ position:sticky; top:0; z-index:1100; background:#3b2b00; color:#fff; font:400 13px/1.4 var(--ta-sans); padding:8px 16px; border-bottom:1px solid var(--ta-gold); }
.ta-preview__ok{ color:#6BC96B; }
.ta-preview__no{ color:#ff9a8a; }
.ta-preview code{ opacity:.8; }


/* ---- editorial pages: prose + multi-column data tables ---- */
.ta-rb__head--left{ text-align:left; }
.ta-rb__p{ font:400 16px/1.65 var(--ta-sans); color:var(--rp-t1); margin:0 0 14px; max-width:68ch; }
.ta-rb__bullets{ margin:0 0 16px; padding-left:20px; font:400 16px/1.6 var(--ta-sans); color:var(--rp-t1); max-width:68ch; }
.ta-rb__bullets li{ margin:0 0 6px; }
.ta-rb__panel--tbl{ margin:8px 0 18px; }
.ta-tbl__wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.ta-tbl{ width:100%; border-collapse:collapse; font:400 14px/1.4 var(--ta-sans); min-width:520px; }
.ta-tbl__cap{ margin:0; font:400 13px/1.5 var(--ta-sans); color:var(--rp-t2); padding:12px 16px 8px; }
.ta-tbl__hint{ display:none; margin:0; padding:8px 16px 10px; font:400 12px/1.4 var(--ta-sans); color:var(--rp-t3); }
.ta-tbl thead th:first-child, .ta-tbl tbody th{ position:sticky; left:0; background:var(--rp-panel, #141210); z-index:1; }
.ta-tbl thead th{ font:500 10px/1 var(--ta-mono); letter-spacing:.1em; text-transform:uppercase; color:var(--rp-t3); text-align:left; padding:8px 12px; border-bottom:.5px solid var(--rp-bdr); white-space:nowrap; }
.ta-tbl tbody th, .ta-tbl tbody td{ text-align:left; vertical-align:top; padding:10px 12px; border-top:.5px solid var(--rp-bdr); color:var(--rp-t1); font-weight:400; }
.ta-tbl tbody tr:first-child th, .ta-tbl tbody tr:first-child td{ border-top:0; }
.ta-tbl tbody th{ font-weight:500; }
.ta-tbl tbody td{ color:var(--rp-t2); font-variant-numeric:tabular-nums; }
.ta-tbl a{ color:var(--ta-gold); text-decoration:none; font-weight:500; }
.ta-tbl a:hover{ text-decoration:underline; }
/* a hand-written table (rules, fees, a comparison grid) wraps its prose instead of scrolling */
.ta-tbl--prose{ min-width:0; }
.ta-tbl--prose tbody th, .ta-tbl--prose tbody td{ white-space:normal; font-variant-numeric:normal; }
.ta-tbl--prose thead th:first-child, .ta-tbl--prose tbody th{ position:static; }
@media (max-width:520px){ .ta-tbl{ font-size:13px; min-width:460px; } .ta-tbl--prose{ min-width:0; } .ta-tbl tbody th, .ta-tbl tbody td{ padding:9px 10px; } .ta-tbl__hint{ display:block; } .ta-tbl--prose + .ta-tbl__hint{ display:none; } }