/* =====================================================================
   Tata's Thai Kitchen — shared stylesheet (v2, Sept 2026)
   Tokens, reset, type, nav, drawer, buttons, page hero, menu components,
   allergen tables, footer. Page-specific styles live inline on each page.
   ===================================================================== */

/* ---------- TOKENS ---------- */
:root{
  --cream:#f4ede0;
  --cream-2:#ece2cf;
  --paper:#fbf6ec;
  --ink:#07060A;
  --ink-2:#14110D;
  --ink-soft:#3a3530;
  --line:rgba(20,17,13,.12);
  --line-strong:rgba(20,17,13,.28);
  --ember:#D3984A;
  --ember-deep:#AD702E;
  --gold-bright:#F7D47B;
  --marigold:#E77422;
  --marigold-deep:#B83918;
  --teal:#2C6E76;
  --teal-deep:#1D535A;
  --teal-soft:#6D9AA0;
  --chili:#B83918;
  --leaf:#2C6E76;
  --veg:#2F6B3A;
  --veg-bg:rgba(47,107,58,.10);
  --gf:#8A5A14;
  --gf-bg:rgba(211,152,74,.16);
  --shadow-1:0 1px 2px rgba(7,6,10,.06), 0 8px 24px -10px rgba(7,6,10,.22);
  --shadow-2:0 30px 60px -30px rgba(7,6,10,.55);
  --r-sm:6px; --r-md:14px; --r-lg:22px;
  --container:1240px;
  --nav-h:104px;
}
@media (min-width:720px){ :root{ --nav-h:124px } }
@media (min-width:980px){ :root{ --nav-h:88px } }

/* ---------- RESET ---------- */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth; scroll-padding-top:calc(var(--nav-h) + 14px)}
body{
  font-family:'Manrope', ui-sans-serif, system-ui, sans-serif;
  color:var(--ink);
  background:var(--cream);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  line-height:1.55;
  overflow-x:hidden;
}
img{max-width:100%; display:block}
picture{display:contents}
a{color:inherit; text-decoration:none}
button{font:inherit; cursor:pointer; border:0; background:none; color:inherit}
:focus-visible{outline:2px solid var(--ember); outline-offset:3px; border-radius:4px}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}

/* ---------- TYPE ---------- */
.serif{font-family:'Cormorant Garamond','Cormorant',Georgia,serif; font-weight:500; letter-spacing:-.01em}
.display{font-family:'Cormorant Garamond',Georgia,serif; font-weight:500; line-height:1.02; letter-spacing:-.02em}
.italic{font-style:italic}
.eyebrow{
  font-family:'Manrope',sans-serif;
  font-size:11px; letter-spacing:.22em; text-transform:uppercase;
  font-weight:600; color:var(--ember-deep);
}
.eyebrow.on-dark{color:var(--ember)}
.rule{display:inline-block; width:32px; height:1px; background:currentColor; vertical-align:middle; margin:0 .6em; opacity:.6}
h1,h2,h3,h4{margin:0}
.h-display{
  font-family:'Yeseva One','Cormorant Garamond',Georgia,serif; font-weight:400;
  letter-spacing:-.01em; line-height:1.02;
}
.h-display .it, .h-serif .it{font-family:'Cormorant Garamond',Georgia,serif; font-style:italic; font-weight:500; color:var(--ember)}
.h-serif{font-family:'Cormorant Garamond',Georgia,serif; font-weight:500; letter-spacing:-.02em; line-height:1.04}

/* ---------- LAYOUT ---------- */
.wrap{max-width:var(--container); margin:0 auto; padding:0 22px}
@media (min-width:720px){ .wrap{padding:0 36px} }
section{position:relative}

/* ---------- NAV ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:50;
  transition:background .3s ease, box-shadow .3s ease, color .3s ease;
  color:#fbf6ec;
}
.nav.scrolled, .nav.solid{
  background:rgba(244,237,224,.94);
  backdrop-filter:saturate(140%) blur(14px);
  -webkit-backdrop-filter:saturate(140%) blur(14px);
  color:var(--ink);
  box-shadow:0 1px 0 var(--line);
}
.nav-row{display:flex; align-items:center; justify-content:space-between; height:var(--nav-h)}
.brand{display:flex; align-items:center; gap:12px}
.brand-mark{display:grid; place-items:center}
.brand-mark.logo-img{width:84px; height:84px; border:0; background:transparent; padding:0}
@media (min-width:720px){ .brand-mark.logo-img{width:100px; height:100px} }
@media (min-width:980px){ .brand-mark.logo-img{width:76px; height:76px} }
.brand-mark.logo-img img{
  width:100%; height:100%; object-fit:contain; display:block;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.35));
}
.nav.scrolled .brand-mark.logo-img img, .nav.solid .brand-mark.logo-img img{filter:none}
.nav-links{display:none; gap:26px; align-items:center}
.nav-links a{font-size:13px; font-weight:500; letter-spacing:.04em; position:relative; padding:6px 0}
.nav-links a::after{
  content:""; position:absolute; left:50%; bottom:0; width:0; height:1px;
  background:currentColor; transition:width .3s ease, left .3s ease;
}
.nav-links a:hover::after, .nav-links a[aria-current="page"]::after{width:100%; left:0}
.nav-links a[aria-current="page"]{font-weight:700}
.nav-cta{
  display:none; align-items:center; gap:10px;
  font-size:13px; font-weight:600; letter-spacing:.04em;
  padding:10px 18px; border:1px solid currentColor; border-radius:999px;
  transition:background .25s ease, color .25s ease;
}
.nav.scrolled .nav-cta:hover, .nav.solid .nav-cta:hover{background:var(--ink); color:var(--cream); border-color:var(--ink)}
.nav:not(.scrolled):not(.solid) .nav-cta:hover{background:var(--cream); color:var(--ink)}
.nav-social{
  display:none; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:50%; border:1px solid currentColor;
  transition:background .25s ease, color .25s ease, border-color .25s ease;
}
.nav-social svg{width:15px; height:15px}
.nav.scrolled .nav-social:hover, .nav.solid .nav-social:hover{background:var(--ink); color:var(--cream); border-color:var(--ink)}
.nav:not(.scrolled):not(.solid) .nav-social:hover{background:var(--cream); color:var(--ink)}
.nav-right{display:flex; align-items:center; gap:12px}
.burger{width:42px; height:42px; display:grid; place-items:center; border:1px solid currentColor; border-radius:50%}
.burger span{display:block; width:16px; height:1.5px; background:currentColor; position:relative}
.burger span::before, .burger span::after{content:""; position:absolute; left:0; width:16px; height:1.5px; background:currentColor}
.burger span::before{top:-5px}
.burger span::after{top:5px}
@media (min-width:980px){
  .nav-links, .nav-cta, .nav-social{display:flex}
  .burger{display:none}
}

/* Mobile drawer */
.drawer{
  position:fixed; inset:0; z-index:60;
  background:var(--ink); color:var(--cream);
  display:flex; flex-direction:column;
  transform:translateY(-100%); transition:transform .45s cubic-bezier(.7,.05,.2,1);
  overflow-y:auto; visibility:hidden;
}
.drawer.open{transform:translateY(0); visibility:visible}
.drawer-head{display:flex; align-items:center; justify-content:space-between; height:72px; padding:0 22px}
.drawer .brand-mark.logo-img{width:72px; height:72px}
.drawer-close{width:42px; height:42px; border:1px solid var(--cream); border-radius:50%; display:grid; place-items:center}
.drawer-close svg{width:14px; height:14px}
.drawer-links{display:flex; flex-direction:column; padding:10px 22px 30px; gap:0}
.drawer-links a{
  font-family:'Cormorant Garamond',serif; font-size:34px; font-weight:500;
  padding:14px 0; border-bottom:1px solid rgba(244,237,224,.12);
  display:flex; align-items:baseline; justify-content:space-between;
  color:var(--ember); transition:color .25s ease, padding-left .35s ease; position:relative;
}
.drawer-links a::before{
  content:""; position:absolute; left:0; top:50%; transform:translateY(-50%) scaleX(0);
  transform-origin:left center; width:18px; height:1px; background:var(--ember); transition:transform .35s ease;
}
.drawer-links a:hover, .drawer-links a:focus-visible{padding-left:30px; color:#e89559}
.drawer-links a:hover::before, .drawer-links a:focus-visible::before{transform:translateY(-50%) scaleX(1)}
.drawer-links a span:first-child{font-style:italic; letter-spacing:-.005em}
.drawer-links a .num{font-family:'Manrope'; font-size:11px; letter-spacing:.2em; opacity:.55; color:var(--cream)}
.drawer-links a.sub{font-size:22px; padding:10px 0 10px 18px; color:var(--cream); opacity:.85}
.drawer-links a.sub span:first-child{font-style:normal}
.drawer-foot{margin-top:auto; padding:24px 22px 40px; border-top:1px solid rgba(244,237,224,.12); display:flex; flex-direction:column; gap:16px}
.drawer-foot .row{display:flex; justify-content:space-between; align-items:center; font-size:13px; opacity:.85}
.drawer-foot .row.closed span:last-child{opacity:.6; font-style:italic}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:14px 22px; border-radius:999px;
  font-size:13px; font-weight:600; letter-spacing:.05em;
  transition:transform .2s ease, background .25s ease, color .25s ease, border-color .25s ease;
}
.btn .arrow{transition:transform .25s ease}
.btn:hover .arrow{transform:translateX(4px)}
.btn-ember{background:var(--ember); color:#fff}
.btn-ember:hover{background:var(--ember-deep)}
.btn-ink{background:var(--ink); color:var(--cream)}
.btn-ink:hover{background:#000}
.btn-ghost{border:1px solid currentColor}
.btn-ghost:hover{background:var(--ink); color:var(--cream); border-color:var(--ink)}
.btn-ghost-light{border:1px solid rgba(244,237,224,.4); color:var(--cream)}
.btn-ghost-light:hover{background:var(--cream); color:var(--ink); border-color:var(--cream)}
.btn-sm{padding:10px 16px; font-size:12px}

/* ---------- PAGE HERO (inner pages) ---------- */
.page-hero{
  position:relative; background:#0e1411; color:#fbf6ec; overflow:hidden;
  padding:calc(var(--nav-h) + 48px) 0 56px;
}
@media (min-width:720px){ .page-hero{padding:calc(var(--nav-h) + 72px) 0 80px} }
.page-hero-img{position:absolute; inset:0; z-index:0; background-size:cover; background-position:center 40%; transform:scale(1.03)}
.page-hero-img::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(7,6,10,.72) 0%, rgba(7,6,10,.5) 45%, rgba(7,6,10,.92) 100%);
}
.page-hero .wrap{position:relative; z-index:1}
.page-hero h1{
  font-family:'Cormorant Garamond',serif; font-weight:500;
  font-size:clamp(46px, 8vw, 104px); line-height:.95; letter-spacing:-.025em; margin:14px 0 18px;
  text-shadow:0 2px 30px rgba(0,0,0,.45);
}
.page-hero h1 .it{font-style:italic; color:var(--ember)}
.page-hero p.lede{font-size:clamp(15px,1.6vw,18px); max-width:56ch; opacity:.95; margin:0; text-shadow:0 1px 12px rgba(0,0,0,.55)}
.page-hero .hero-meta{
  display:flex; flex-wrap:wrap; gap:10px 18px; align-items:center;
  font-size:10px; letter-spacing:.22em; text-transform:uppercase; font-weight:600; opacity:.92;
}
.page-hero .hero-meta .dot{width:4px; height:4px; background:var(--ember); border-radius:50%; display:inline-block}
.page-hero .hero-ctas{display:flex; flex-wrap:wrap; gap:12px; margin-top:28px}

/* ---------- MENU SUB-NAV (Food / Drinks / Allergens) ---------- */
.subnav{
  position:sticky; top:var(--nav-h); z-index:40;
  background:rgba(251,246,236,.94); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.subnav-row{display:flex; align-items:center; justify-content:space-between; gap:12px; height:56px}
.subnav-tabs{display:flex; gap:4px; overflow-x:auto; scrollbar-width:none; -ms-overflow-style:none}
.subnav-tabs::-webkit-scrollbar{display:none}
.subnav-tabs a{
  flex:0 0 auto; padding:8px 14px; border-radius:999px;
  font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  color:var(--ink-soft); transition:background .2s ease, color .2s ease;
}
.subnav-tabs a:hover{color:var(--ink)}
.subnav-tabs a[aria-current="page"]{background:var(--ink); color:var(--cream)}
.subnav-side{display:none; align-items:center; gap:10px; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); font-weight:600}
@media (min-width:720px){ .subnav-side{display:flex} }
.subnav-side a{border-bottom:1px solid var(--line-strong)}

/* ---------- CATEGORY PILLS (in-page jump links) ---------- */
.cat-pills{
  position:sticky; top:calc(var(--nav-h) + 56px); z-index:30;
  background:var(--paper); border-bottom:1px solid var(--line);
  padding:12px 0;
}
.cat-pills-inner{display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch}
.cat-pills-inner::-webkit-scrollbar{display:none}
.pill{
  flex:0 0 auto; padding:8px 14px; border-radius:999px;
  border:1px solid var(--line-strong); font-size:12px; letter-spacing:.04em; font-weight:600;
  color:var(--ink); white-space:nowrap; background:transparent;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.pill:hover{border-color:var(--ink)}
.pill.active{background:var(--ink); color:var(--cream); border-color:var(--ink)}

/* ---------- FILTER CHIPS ---------- */
.filters{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:28px 0 8px}
.filters .lbl{font-size:10px; letter-spacing:.22em; text-transform:uppercase; font-weight:700; color:var(--ink-soft); margin-right:6px}
.chip{
  display:inline-flex; align-items:center; gap:8px;
  padding:9px 14px; border-radius:999px; border:1px solid var(--line-strong);
  font-size:12px; font-weight:600; letter-spacing:.03em; color:var(--ink); background:#fff;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.chip:hover{border-color:var(--ink)}
.chip[aria-pressed="true"]{background:var(--ink); color:var(--cream); border-color:var(--ink)}
.chip .sw{width:10px; height:10px; border-radius:50%; display:inline-block}
.chip .sw.veg{background:var(--veg)}
.chip .sw.gf{background:var(--ember)}
.chip .sw.mild{background:var(--teal-soft)}
.chip .sw.hot{background:var(--chili)}
.filter-empty{display:none; padding:28px 0; color:var(--ink-soft); font-style:italic; font-family:'Cormorant Garamond',serif; font-size:20px}
body[data-filter]:not([data-filter="all"]) .menu-cat.is-empty .filter-empty{display:block}
body[data-filter]:not([data-filter="all"]) .menu-cat.is-empty .menu-grid{display:none}

/* ---------- BADGES ---------- */
.badge{
  display:inline-flex; align-items:center; gap:5px;
  font-size:9.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  padding:3px 8px; border-radius:999px; line-height:1.4; white-space:nowrap;
}
.badge-veg{background:var(--veg-bg); color:var(--veg)}
.badge-gf{background:var(--gf-bg); color:var(--gf)}
.badge-spice{background:rgba(184,57,24,.09); color:var(--chili)}
.badge-mild{background:rgba(109,154,160,.18); color:var(--teal-deep)}
.badge-special{background:var(--ink); color:var(--gold-bright)}
.badge-vg{background:var(--veg-bg); color:var(--veg)}
.badge-o{background:rgba(44,110,118,.12); color:var(--teal-deep)}
.badge a{border-bottom:1px dotted currentColor}

/* ---------- MENU SECTIONS ---------- */
.menu-page{background:var(--paper); padding:12px 0 96px}
.menu-cat{padding-top:56px; scroll-margin-top:calc(var(--nav-h) + 120px)}
.menu-cat:first-of-type{padding-top:40px}
.menu-cat-head{
  display:grid; gap:8px; padding-bottom:20px; margin-bottom:24px; border-bottom:1px solid var(--line-strong);
}
@media (min-width:720px){ .menu-cat-head{grid-template-columns:1fr auto; align-items:end; gap:24px} }
.menu-cat-head h2{
  font-family:'Cormorant Garamond',serif; font-weight:500;
  font-size:clamp(34px, 5vw, 52px); letter-spacing:-.02em; line-height:1;
}
.menu-cat-head h2 .num{font-family:'Manrope',sans-serif; font-size:11px; letter-spacing:.24em; color:var(--ember-deep); font-weight:700; display:block; margin-bottom:10px}
.menu-cat-head h2 .it{font-style:italic; color:var(--ember)}
.menu-cat-head p{margin:0; color:var(--ink-soft); font-size:14.5px; max-width:52ch}
.menu-cat-head .side{font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-soft); font-weight:600; text-align:left}
@media (min-width:720px){ .menu-cat-head .side{text-align:right} }
.menu-cat-head .side strong{color:var(--ember-deep)}
.menu-grid{display:grid; grid-template-columns:1fr; gap:14px}
@media (min-width:720px){ .menu-grid{grid-template-columns:repeat(2,1fr); gap:18px} }
.menu-cat.special .menu-grid{grid-template-columns:1fr}
@media (min-width:900px){ .menu-cat.special .menu-grid{grid-template-columns:repeat(3,1fr)} }
.menu-note{margin:18px 0 0; font-size:12.5px; color:var(--ink-soft); padding:12px 16px; border:1px dashed var(--line-strong); border-radius:var(--r-sm); display:inline-block}
.menu-note strong{color:var(--ember-deep)}

.mi{
  position:relative; background:#fff; border:1px solid var(--line); border-radius:var(--r-md);
  padding:22px 22px 20px; display:flex; flex-direction:column; gap:10px;
  transition:transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s ease, border-color .3s ease;
}
.mi:hover{transform:translateY(-3px); border-color:var(--ember); box-shadow:var(--shadow-1)}
.mi.hidden{display:none}
.mi-top{display:flex; justify-content:space-between; align-items:flex-start; gap:16px}
.mi h3{
  font-family:'Cormorant Garamond',serif; font-weight:600; font-size:26px; line-height:1.05; letter-spacing:-.01em;
}
.mi .en{font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); font-weight:600; margin-top:5px}
.mi .price{
  font-family:'Cormorant Garamond',serif; font-size:24px; font-weight:600; white-space:nowrap; line-height:1;
  color:var(--ink); padding-top:3px;
}
.mi .price small{display:block; font-family:'Manrope',sans-serif; font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); text-align:right; margin-top:4px}
.mi .desc{font-size:14px; color:var(--ink-soft); margin:0; line-height:1.55}
.mi .opts{
  display:flex; flex-wrap:wrap; gap:6px 8px;
  margin-top:4px; padding-top:12px; border-top:1px dashed var(--line);
}
.mi .opt{display:inline-flex; align-items:baseline; gap:7px; font-size:12.5px; padding:5px 11px 5px 12px; background:var(--paper); border:1px solid var(--line); border-radius:999px; color:var(--ink-soft)}
.menu-cat.special .mi .opt{background:rgba(244,237,224,.06); border-color:rgba(244,237,224,.14); color:var(--cream)}
.mi .opt b{font-family:'Cormorant Garamond',serif; font-weight:600; font-size:17px; color:var(--ember-deep); font-variant-numeric:tabular-nums}
.mi .tags{display:flex; flex-wrap:wrap; gap:6px; margin-top:auto; padding-top:6px}
.heat{display:inline-flex; align-items:center; gap:2px; color:var(--chili)}
.heat svg{width:12px; height:12px}
.heat .off{opacity:.18}
.heat-lbl{font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; font-weight:700; color:var(--chili); margin-left:6px}

.menu-cat.special .mi{background:var(--ink); color:var(--cream); border-color:rgba(244,237,224,.12)}
.menu-cat.special .mi:hover{border-color:var(--ember); box-shadow:var(--shadow-2)}
.menu-cat.special .mi h3{color:var(--cream); font-weight:500}
.menu-cat.special .mi .en{color:var(--ember)}
.menu-cat.special .mi .price{color:var(--gold-bright)}
.menu-cat.special .mi .price small{color:rgba(244,237,224,.55)}
.menu-cat.special .mi .desc{color:rgba(244,237,224,.82)}
.menu-cat.special .mi .opts{border-color:rgba(244,237,224,.15)}
.menu-cat.special .mi .opt b{color:var(--gold-bright)}
.menu-cat.special .badge-spice{background:rgba(231,116,34,.18); color:#f0a36a}
.menu-cat.special .badge-gf{background:rgba(247,212,123,.15); color:var(--gold-bright)}

/* Drinks: wine rows */
.wine-grid{display:grid; grid-template-columns:1fr; gap:12px}
.wine{
  display:grid; grid-template-columns:1fr; gap:10px;
  background:#fff; border:1px solid var(--line); border-radius:var(--r-md); padding:20px 22px;
}
@media (min-width:720px){ .wine{grid-template-columns:1fr auto; align-items:center; gap:28px} }
.wine h3{font-family:'Cormorant Garamond',serif; font-weight:600; font-size:23px; line-height:1.1; display:flex; flex-wrap:wrap; align-items:center; gap:8px}
.wine .desc{font-size:13.5px; color:var(--ink-soft); margin:5px 0 0; max-width:60ch}
.wine .prices{display:flex; gap:18px; flex-wrap:wrap}
.wine .pr{display:flex; flex-direction:column; align-items:flex-start; min-width:62px}
@media (min-width:720px){ .wine .pr{align-items:flex-end} }
.wine .pr b{font-family:'Cormorant Garamond',serif; font-weight:600; font-size:20px; color:var(--ember-deep); font-variant-numeric:tabular-nums; line-height:1}
.wine .pr span{font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); font-weight:700; margin-top:4px}
.menu-cat.special .wine{background:var(--ink); color:var(--cream); border-color:rgba(244,237,224,.12)}
.menu-cat.special .wine h3{color:var(--cream)}
.menu-cat.special .wine .desc{color:rgba(244,237,224,.82)}
.menu-cat.special .wine .pr b{color:var(--gold-bright)}
.menu-cat.special .wine .pr span{color:rgba(244,237,224,.6)}

/* ---------- ALLERGEN TABLES ---------- */
.al-key{
  display:grid; grid-template-columns:repeat(2,1fr); gap:10px 18px; margin:0 0 28px;
  font-size:12.5px; color:var(--ink-soft);
}
@media (min-width:720px){ .al-key{grid-template-columns:repeat(4,1fr)} }
.al-key div{display:flex; align-items:center; gap:10px}
.al-key .k{display:inline-grid; place-items:center; width:26px; height:26px; border-radius:50%; flex:0 0 auto}
.al-key .k.yes{background:var(--chili); color:#fff}
.al-key .k.no{background:var(--cream-2); color:var(--ink-soft)}
.al-key .k.na{border:1px dashed var(--line-strong); color:var(--ink-soft)}
.al-wrap{
  overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--line); border-radius:var(--r-md);
  background:#fff; box-shadow:var(--shadow-1);
}
.al-wrap table{border-collapse:separate; border-spacing:0; width:100%; min-width:880px; font-size:12.5px}
.al-wrap th, .al-wrap td{padding:10px 8px; text-align:center; border-bottom:1px solid var(--line); vertical-align:middle}
.al-wrap thead th{
  position:sticky; top:0; z-index:2; background:var(--ink); color:var(--cream);
  font-size:10px; letter-spacing:.06em; text-transform:uppercase; font-weight:700; line-height:1.25;
  padding:12px 6px;
}
.al-wrap thead th:first-child{text-align:left; padding-left:18px; letter-spacing:.14em; min-width:200px}
.al-wrap thead th .ic{display:block; font-size:16px; margin-bottom:5px; letter-spacing:0}
.al-wrap tbody th{
  position:sticky; left:0; z-index:1; text-align:left; padding-left:18px; background:#fff;
  font-family:'Cormorant Garamond',serif; font-weight:600; font-size:17px; line-height:1.15; color:var(--ink);
  box-shadow:1px 0 0 var(--line);
}
.al-wrap tbody tr:nth-child(even) th, .al-wrap tbody tr:nth-child(even) td{background:var(--paper)}
.al-wrap tbody tr:hover th, .al-wrap tbody tr:hover td{background:#fff7ea}
.al-wrap tbody th .v{font-family:'Manrope',sans-serif; font-size:9px; letter-spacing:.14em; text-transform:uppercase; color:var(--veg); font-weight:700; margin-left:6px; vertical-align:2px}
.al-wrap td .y, .al-wrap td .n{display:inline-grid; place-items:center; width:24px; height:24px; border-radius:50%; font-size:11px; font-weight:700}
.al-wrap td .y{background:var(--chili); color:#fff}
.al-wrap td .n{color:var(--line-strong)}
.al-wrap td.gluten-free{background:rgba(47,107,58,.08)}
.al-wrap td .g{display:inline-grid; place-items:center; width:26px; height:20px; border-radius:999px; font-size:9px; font-weight:800; letter-spacing:.06em; background:var(--veg-bg); color:var(--veg)}
.al-key .k.gf{background:var(--veg-bg); color:var(--veg); font-size:9px; font-weight:800; letter-spacing:.06em}
.al-wrap tbody tr:last-child th, .al-wrap tbody tr:last-child td{border-bottom:0}
.al-hint{font-size:11.5px; color:var(--ink-soft); margin:10px 0 0; letter-spacing:.04em}
@media (max-width:719px){
  .al-hint::before{content:"Swipe sideways to see every allergen. "; font-weight:600}
}

/* ---------- SPLIT / STATEMENT BLOCKS ---------- */
.statement{
  background:var(--ink); color:var(--cream); border-radius:var(--r-lg);
  padding:36px 26px; position:relative; overflow:hidden; box-shadow:var(--shadow-2);
}
@media (min-width:720px){ .statement{padding:56px 52px} }
.statement::before{
  content:""; position:absolute; inset:-1px; pointer-events:none;
  background:radial-gradient(70% 50% at 50% 0%, rgba(200,123,58,.20), transparent 60%),
             radial-gradient(40% 30% at 85% 100%, rgba(138,46,35,.16), transparent 70%);
}
.statement > *{position:relative; z-index:1}
.statement h2{font-family:'Cormorant Garamond',serif; font-weight:500; font-size:clamp(32px,5vw,52px); line-height:1.04; letter-spacing:-.02em; margin:12px 0 18px}
.statement h2 .it{font-style:italic; color:var(--ember)}
.statement p{font-size:15.5px; opacity:.88; max-width:62ch; margin:0 0 14px; line-height:1.65}
.statement p strong{color:var(--gold-bright); font-weight:600}
.statement .sig{font-family:'Cormorant Garamond',serif; font-style:italic; font-size:22px; color:var(--ember); margin-top:22px}
.statement .facts{display:grid; grid-template-columns:1fr; gap:10px; margin:26px 0 6px}
@media (min-width:720px){ .statement .facts{grid-template-columns:repeat(3,1fr); gap:14px} }
.statement .fact{
  border:1px solid rgba(244,237,224,.14); border-radius:var(--r-md); padding:16px 18px; background:rgba(244,237,224,.03);
}
.statement .fact .l{font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--ember); font-weight:700; margin-bottom:6px}
.statement .fact .v{font-size:13.5px; opacity:.9; line-height:1.5}

/* ---------- CARD TRIO (menu hub) ---------- */
.hub-grid{display:grid; grid-template-columns:1fr; gap:16px}
@media (min-width:720px){ .hub-grid{grid-template-columns:repeat(3,1fr); gap:20px} }
.hub-card{
  position:relative; display:flex; flex-direction:column; justify-content:flex-end;
  min-height:300px; border-radius:var(--r-md); overflow:hidden; isolation:isolate;
  background:var(--ink); color:#fff; box-shadow:var(--shadow-1);
}
@media (min-width:720px){ .hub-card{min-height:380px} }
.hub-card img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.hub-card:hover img{transform:scale(1.05)}
.hub-card::before{content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(7,6,10,.08) 15%, rgba(7,6,10,.55) 55%, rgba(7,6,10,.92) 100%)}
.hub-card .body{padding:24px}
.hub-card .eyebrow{color:var(--gold-bright)}
.hub-card h3{font-family:'Cormorant Garamond',serif; font-weight:500; font-size:34px; line-height:1.02; letter-spacing:-.02em; margin:8px 0 8px}
.hub-card h3 .it{font-style:italic; color:var(--ember)}
.hub-card p{font-size:13.5px; opacity:.88; margin:0 0 14px; max-width:34ch}
.hub-card .go{font-size:11px; letter-spacing:.18em; text-transform:uppercase; font-weight:700; display:inline-flex; gap:8px; align-items:center}
.hub-card .go .arrow{transition:transform .25s ease}
.hub-card:hover .go .arrow{transform:translateX(4px)}
.hub-card.solid{background:var(--teal-deep)}
.hub-card.solid::before{background:radial-gradient(80% 60% at 80% 0%, rgba(247,212,123,.18), transparent 60%)}

/* ---------- CTA BAND ---------- */
.cta-band{background:var(--cream); border-top:1px solid var(--line); padding:64px 0}
.cta-band .inner{display:grid; gap:22px; align-items:center}
@media (min-width:720px){ .cta-band .inner{grid-template-columns:1fr auto} }
.cta-band h2{font-family:'Cormorant Garamond',serif; font-weight:500; font-size:clamp(30px,4.6vw,46px); line-height:1.05; letter-spacing:-.02em; margin:10px 0 8px}
.cta-band h2 .it{font-style:italic; color:var(--ember)}
.cta-band p{margin:0; color:var(--ink-soft); font-size:14.5px; max-width:50ch}
.cta-band .btns{display:flex; flex-wrap:wrap; gap:12px}

/* ---------- FOOTER ---------- */
footer.site-footer{background:var(--ink); color:var(--cream); padding:72px 0 32px; position:relative; overflow:hidden}
footer.site-footer::before{content:""; position:absolute; inset:-1px; background:radial-gradient(70% 50% at 50% 0%, rgba(200,123,58,.10), transparent 60%); pointer-events:none}
.foot-grid{display:grid; gap:40px; position:relative}
@media (min-width:720px){ .foot-grid{grid-template-columns:1fr 2fr; align-items:start; gap:80px} }
.foot-mark .brand-mark.logo-img{width:140px; height:140px}
@media (min-width:720px){ .foot-mark .brand-mark.logo-img{width:160px; height:160px} }
.foot-mark .brand-mark.logo-img img{filter:none}
.foot-tag{font-family:'Cormorant Garamond',serif; font-style:italic; font-size:26px; line-height:1.2; max-width:20ch; margin:20px 0 0}
.foot-cols{display:grid; grid-template-columns:1fr; gap:32px}
@media (min-width:600px){ .foot-cols{grid-template-columns:1fr 1fr 1fr; gap:40px} }
.foot-col h5{font-size:10px; letter-spacing:.28em; text-transform:uppercase; font-weight:600; color:var(--gold-bright); margin:0 0 16px}
.foot-col a, .foot-col p{display:block; font-size:14px; opacity:.85; margin:6px 0; line-height:1.5}
.foot-col a:hover{opacity:1; color:var(--ember)}
.foot-col .row-hours{display:flex; justify-content:space-between; gap:14px; padding:2px 0; font-size:13.5px; opacity:.82; line-height:1.5}
.foot-col .row-hours .day{opacity:.7}
.foot-col .row-hours .time{font-weight:500}
.foot-col .row-hours.closed .time{color:rgba(244,237,224,.45); font-style:italic}
.foot-col .row-hours.kitchen{margin-top:8px; padding-top:10px; border-top:1px solid rgba(244,237,224,.12)}
.foot-col .row-hours.kitchen .time{color:var(--gold-bright); font-weight:600}
.foot-bottom{
  margin-top:48px; padding-top:24px; border-top:1px solid rgba(244,237,224,.12);
  display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; align-items:center;
  font-size:11px; letter-spacing:.18em; text-transform:uppercase; opacity:.6;
}
.foot-bottom .made-by-inline{display:inline-flex; align-items:center; gap:10px}
.foot-bottom .made-by-inline a{display:inline-flex; align-items:center; opacity:.9}
.foot-bottom .made-by-inline img{height:17px; width:auto; display:block}

/* ---------- MOTION ---------- */
.fade{transition:opacity .9s ease, transform .9s ease}
body.js-ready .fade{opacity:0; transform:translateY(18px)}
body.js-ready .fade.in{opacity:1; transform:none}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  body.js-ready .fade{opacity:1; transform:none; transition:none}
  .mi, .hub-card img{transition:none}
}

/* ---------- PRINT (menus print cleanly) ---------- */
@media print{
  .nav, .drawer, .subnav, .cat-pills, .filters, .cta-band, footer.site-footer, .page-hero-img{display:none !important}
  .page-hero{background:#fff; color:#000; padding:20px 0}
  .page-hero h1 .it{color:#000}
  body{background:#fff}
  .mi, .wine{break-inside:avoid; box-shadow:none}
  .menu-cat.special .mi, .menu-cat.special .wine{background:#fff; color:#000; border:1px solid #999}
  .menu-cat.special .mi h3, .menu-cat.special .mi .price, .menu-cat.special .mi .opt b{color:#000}
  .al-wrap{box-shadow:none}
}
@media print{
  .page-hero{display:none !important}
  .menu-page{padding:0}
  .menu-page::before{content:"Tata's Thai Kitchen \2022 30 Poulton St, Kirkham PR4 2AB \2022 07917 805 049 \2022 tatasthaikitchen.co.uk"; display:block; font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:#555; margin:0 0 6px}
  .menu-cat{padding-top:16px !important}
  .menu-cat-head{padding-bottom:8px; margin-bottom:10px}
  .menu-cat-head h2{font-size:24px}
  .menu-cat-head h2 .num, .menu-cat-head .side, .filters + p, .menu-note, .mi .tags .badge:last-child, .heat-lbl{display:none !important}
  .menu-grid{gap:8px; grid-template-columns:repeat(2,1fr) !important}
  .mi{padding:10px 12px; gap:4px; border-radius:6px}
  .mi h3{font-size:16px}
  .mi .en{font-size:9px; margin-top:2px}
  .mi .desc{font-size:10.5px; line-height:1.35}
  .mi .price{font-size:16px}
  .mi .opts{padding-top:6px; gap:4px}
  .mi .opt{font-size:10px; padding:2px 7px}
  .mi .opt b{font-size:12px}
  .badge{font-size:7.5px; padding:2px 6px}
  .wine{padding:8px 12px}
}
@media print{
  body, .menu-page, .mi, .wine{background:#fff !important}
  .menu-cat.special .mi .desc, .menu-cat.special .mi .en, .menu-cat.special .wine .desc, .menu-cat.special .wine h3{color:#222 !important}
  .menu-cat.special .mi .opt{background:#fff; border-color:#ccc; color:#222}
  .menu-cat.special .wine .pr b, .menu-cat.special .wine .pr span{color:#000 !important}
}