/* ==========================================================================
   Frego Pizza | Dizains: Rosso izkārtojums + Arancio stilistika (zars `edienkarte`)
   Autoritatīvais avots: design-reference/ + BRIEF-EDIENKARTE.md §3–§4.
   Tumša palete, Saira Condensed 900 versāli virsraksti, DM Sans teksts, asi stūri
   (rādiuss 0), 1px matu līnijas, bez ēnām/gradientiem. Sarkanais = vienīgais akcents.
   ========================================================================== */

/* ---- Pašhostēti, apakškopēti fonti (latin + latin-ext) --------------------- */
@font-face {
  font-family: "Saira Condensed";
  font-style: normal; font-weight: 900; font-display: swap;
  src: url("/fonts/saira-condensed-900-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Saira Condensed";
  font-style: normal; font-weight: 900; font-display: swap;
  src: url("/fonts/saira-condensed-900-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "DM Sans";
  font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("/fonts/dmsans.woff2") format("woff2");
}
/* Bricolage Grotesque 800 (opsz 96) — TIKAI virsrakstiem (h1/h2/h3). Pašhostēts, latin + latin-ext. */
@font-face {
  font-family: "Bricolage Grotesque";
  font-style: normal; font-weight: 800; font-display: swap;
  src: url("/fonts/bricolage-800-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Bricolage Grotesque";
  font-style: normal; font-weight: 800; font-display: swap;
  src: url("/fonts/bricolage-800-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ---- Dizaina tokeni (design-reference/README.md) --------------------------- */
:root {
  --ink:        #14110F;   /* lapas fons */
  --panel:      #1E1A17;   /* paceltas joslas: citāts, atsauksmes, footer bloki */
  --red:        #C8402F;   /* vienīgais akcents: numuri, eyebrow, pogas, aktīvā nav */
  --cream:      #F0E7D8;   /* pamatteksts */
  /* (P-2) Teksts uz AIZPILDĪTA sarkanā. Krēms uz --red deva 4,04:1 — zem WCAG AA 4,5:1, un
     tieši uz primārās "Pasūtīt" pogas. Tīri balts to paceļ uz 4,96:1, NEAIZTIEKOT --red, tāpēc
     logo sarkanais paliek burtiski tas pats. Lieto tikai tur, kur fons ir --red. */
  --on-red:     #FFFFFF;
  --cream-soft: rgba(240, 231, 216, .78); /* apraksti, sekundārais teksts */
  --muted:      #8A7A66;   /* mazie versālu uzraksti */
  --line:       rgba(240, 231, 216, .14); /* matu līnijas */
  --line-soft:  rgba(240, 231, 216, .12); /* joslu robežas */
  --radius:     0;

  --container: 1300px;
  --narrow:    900px;
  --pad:       28px;
  --font-display: "Saira Condensed", "Arial Narrow", "Roboto Condensed", sans-serif;
  --font-head:    "Bricolage Grotesque", "Saira Condensed", "Arial Narrow", sans-serif;   /* tikai h1/h2/h3 */
  --font-body:    "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* ---- Reset / bāze ---------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html {
  scroll-behavior: smooth; scroll-padding-top: 96px;
  -webkit-text-size-adjust: 100%; text-size-adjust: 100%;
  overflow-x: clip;
}
body {
  margin: 0; background: var(--ink); color: var(--cream);
  font-family: var(--font-body); font-size: 16px; line-height: 1.7;
  -webkit-font-smoothing: antialiased; overflow-x: clip;
}
img { display: block; max-width: 100%; }

/* ---- Tipogrāfija: Saira Condensed 900 versāli ------------------------------ */
h1, h2, h3 {
  font-family: var(--font-head); font-weight: 800; text-transform: uppercase;   /* §item4e: Bricolage 800 */
  margin: 0; letter-spacing: .01em; line-height: 1.22;   /* LV versāli ar garumzīmēm: >=1.22, lai neķeras */
}
h1 { font-size: clamp(52px, 8.4vw, 124px); line-height: 1.22; }
h2 { font-size: clamp(38px, 5.2vw, 78px); }
h3 { font-size: 25px; letter-spacing: .02em; }
p  { margin: 0 0 1em; text-wrap: pretty; }
p:last-child { margin-bottom: 0; }
a  { color: var(--red); text-decoration: none; }
a:hover { color: var(--red); }

.micro {
  font-family: var(--font-body);
  font-size: 12px; font-weight: 500; letter-spacing: .3em;
  text-transform: uppercase; line-height: 1.4; margin: 0;
}
.accent { color: var(--red); }
.muted  { color: var(--muted); }

/* ---- Primitīvi ------------------------------------------------------------- */
.container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 var(--pad); }
.narrow    { width: 100%; max-width: var(--narrow);    margin: 0 auto; padding: 0 var(--pad); }
.center    { text-align: center; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-family: var(--font-display); font-weight: 900; text-transform: uppercase;
  font-size: 16px; letter-spacing: .08em; line-height: 1.22;
  padding: 16px 40px; border-radius: var(--radius); border: 1px solid transparent;
  text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: background-color .22s, color .22s, border-color .22s;
}
.btn-red   { background: var(--red); color: var(--on-red); border-color: var(--red); }
.btn-red:hover   { background: var(--cream); color: var(--ink); border-color: var(--cream); }
/* Aizpildīta krēma poga primārajai darbībai uz sarkanā fona (hero); invertē uz caurspīdīgu. */
.btn-cream { background: var(--cream); color: var(--ink); border-color: var(--cream); }
.btn-cream:hover { background: transparent; color: var(--cream); border-color: var(--cream); }
.btn-ghost, .btn-line, .btn-ink { background: transparent; color: var(--cream); border-color: var(--line); }
.btn-ghost:hover, .btn-line:hover, .btn-ink:hover { border-color: var(--cream); color: var(--cream); }
/* (P-9) Pieskāriena mērķis vismaz 44x44 px, bet VIZUĀLAIS izmērs nemainās ne par pikseļu:
   mērķi paplašina caurspīdīgs ::after, nevis padding. .btn-sm ir 41 px augsta, tātad trūkst
   3 px — pa 1,5 px uz katru pusi. WCAG 2.2 AA (24 px) tas izturēja jau tāpat; 44 px ir Apple
   HIG un Material ieteikums, un uz galvenajām CTA (galvenes un joslas "Pasūtīt", kartes
   Google/Waze) tas ir īkšķa precizitātes jautājums. Blakus pogām atstarpe ir vismaz 10 px
   (.map-btns gap), tātad paplašinātie mērķi nepārklājas. */
.btn-sm { padding: 11px 24px; font-size: 14px; position: relative; }
.btn-sm::after {
  content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 100%; height: 100%; min-width: 44px; min-height: 44px;
}
.tlink { background: 0; border: 0; font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: 15px; letter-spacing: .06em; color: var(--red); cursor: pointer; padding: 0; }

:where(a, button):focus-visible { outline: 2px solid var(--red); outline-offset: 3px; }

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 200;
  background: var(--red); color: var(--cream); padding: 12px 20px; font-weight: 700; text-decoration: none;
}
.skip-link:focus { left: 0; }

/* ---- Kustība: viens ieejas-atklāsmes novērotājs (.rev) + attēlu nosēšanās (.rev-fig) ----
   §item2: rāmis opacity 0->1 + translateY(14px)->0 ~650ms; attēls scale(1.06)->1 tajā pašā logā.
   Fiksē vienreiz (JS noņem novērošanu), nekad atpakaļritinot. Stagger: --reveal-delay vai .rev-dN.
   Attēla mērogs = ANIMĀCIJA (ne transition) -> pēc nostrādāšanas transform atbrīvojas un hover
   scale paliek dzīvs. Transforms nerada izkārtojuma nobīdi (CLS). */
.rev { opacity: 0; transform: translateY(14px); }
.rev.is-in {
  opacity: 1; transform: none;
  transition: opacity .65s cubic-bezier(.16, 1, .3, 1), transform .65s cubic-bezier(.16, 1, .3, 1);
  transition-delay: var(--reveal-delay, 0s);
}
.rev-d1.is-in { transition-delay: .07s; }
.rev-d2.is-in { transition-delay: .14s; }

.rev-fig { overflow: hidden; }
/* ---- Ievelkama kontūra (§item9c, §item37 izcelta koplietošanā) ----
   Plāna krēma līnija 14px attēla iekšpusē -> nolasās kā apzināta ierīce, ne apmale. Zīmējas ar
   clip-path noslaucīšanu ~700ms pie pirmās atklāsmes, vienreiz. Attēls pats nosēžas no 1.06 caur
   .rev-fig. Kopīga #about abiem rāmjiem (agrāk arī #intro un #kitchen, kas ir izņemti) — kā contactsHtml() un
   quoteBandHtml(), viens avots, nevis kopija katrā sekcijā. (Pirms tam tā bija tikai .kitchen-photo;
   .about-photo to nekad nebija saņēmusi.) */
.inset-rule { position: relative; }
.inset-rule::after {
  content: ""; position: absolute; inset: 14px; z-index: 2; pointer-events: none;
  border: 1.5px solid rgba(240, 231, 216, .85); clip-path: inset(0 100% 0 0);
}
/* Otrais selektors: .about-photo pati nav .rev (atklāj vecāks .about-media), tāpēc .is-in nonāk
   uz vecāka. Tas pats pāris, kas jau ir .rev-fig attēliem zemāk. */
.inset-rule.is-in::after,
.rev.is-in .inset-rule::after { animation: inset-rule-draw .7s cubic-bezier(.16, 1, .3, 1) .12s forwards; }
@keyframes inset-rule-draw { to { clip-path: inset(0 0 0 0); } }
.rev.is-in .rev-fig img, .rev-fig.is-in img {
  animation: reveal-zoom .65s cubic-bezier(.16, 1, .3, 1) backwards;
  animation-delay: var(--reveal-delay, 0s);
}
@keyframes reveal-zoom { from { transform: scale(1.06); } to { transform: scale(1); } }

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .rev { opacity: 1; transform: none; }
  .rev-fig img { transform: none !important; }
  /* Kontūra parādās statiski, bez zīmēšanas. */
  .inset-rule::after { clip-path: inset(0 0 0 0); }
}

/* ==========================================================================
   Galva (horizontāla sticky)
   ========================================================================== */
.topbar {
  position: sticky; top: 0; z-index: 60;
  background: var(--ink); border-bottom: 1px solid transparent; transition: border-color .3s;
}
.topbar.is-solid, .topbar.solid { border-bottom-color: var(--line); }
.topbar-in {
  max-width: var(--container); margin: 0 auto; padding: 14px var(--pad);
  min-height: 74px; display: flex; align-items: center; gap: 22px;
}
.tb-logo { flex: 1 1 0; line-height: 0; display: flex; align-items: center; }
.tb-logo img { height: 34px; width: auto; }
.tb-logo .on-dark { display: block; }   /* tumšs fons -> krēma vārdzīme */
.tb-logo .on-paper { display: none; }
.tb-nav { display: flex; gap: 30px; flex: 0 0 auto; justify-content: center;
  font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: 17px; letter-spacing: .06em; }
.tb-nav a { color: var(--cream); text-decoration: none; }
.tb-nav a:hover, .tb-nav a[aria-current] { color: var(--red); }
.tb-act { display: flex; align-items: center; gap: 16px; flex: 1 1 0; justify-content: flex-end; }
.tb-tel { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: 15px; letter-spacing: .04em; color: var(--cream); text-decoration: none; white-space: nowrap; }
.tb-tel:hover { color: var(--red); }
.tb-lang { display: inline-flex; gap: 5px; align-items: center; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; }
.tb-lang a { color: var(--muted); text-decoration: none; }
.tb-lang a[aria-current] { color: var(--cream); }
.tb-lang a:hover { color: var(--red); }
.tb-lang span { color: var(--line); }
.tb-burger { display: none; flex-direction: column; gap: 5px; width: 40px; height: 40px; align-items: center; justify-content: center; background: transparent; border: 0; cursor: pointer; padding: 0; }
.tb-burger span { display: block; width: 22px; height: 2px; background: var(--cream); transition: transform .3s, opacity .3s; }
.tb-panel { display: none; }

/* ==========================================================================
   Sekciju sistēma (pilna platuma joslas)
   ========================================================================== */
.poster, .poster-inner { padding: 0; border: 0; margin: 0; max-width: none; overflow: visible; }
.has-topbar { padding-top: 0; }
.orn { display: none !important; }

.sec-band { padding: clamp(72px, 9vw, 116px) 0; }
.bg-paper  { background: var(--ink); }
.bg-paper2 { background: var(--panel); }
/* Aizpildīta sarkanā josla nes savu teksta krāsu līdzi: krēms uz --red ir tikai 4,05:1, tātad
   zem AA. --on-red (#FFF = 4,96:1) mantojas uz virsrakstiem un jebko, kam nav savas krāsas,
   tāpēc joslā ieliktam jaunam tekstam kontrasts sanāk pareizs pēc noklusējuma. */
.bg-red    { background: var(--red); color: var(--on-red); }
.head-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px 32px; flex-wrap: wrap; margin-bottom: clamp(30px, 4.5vw, 48px); }
.head-row .micro { margin-bottom: 14px; }
.head-cta { flex: 0 0 auto; }
.sign { font-size: 12px; letter-spacing: .3em; text-transform: uppercase; color: var(--muted); }
.lead { max-width: 54ch; margin: 20px auto 0; color: var(--cream-soft); font-size: clamp(16px, 1.3vw, 18px); line-height: 1.7; }
.cta-row { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; margin-top: 30px; }

/* ==========================================================================
   Sarkanā klātbūtne (§item7): sīki, apzināti akcenti katrā sekcijā — nekad dominējoši.
   Bez lieliem sarkaniem laukumiem ārpus vienas #about joslas.
   ========================================================================== */
/* Matu svītra zem sekciju virsrakstiem (galvenais jaunais akcents). Aug uz augšu head-row iekšā,
   tāpēc head-cta paliek līdzināta pie virsraksta apakšas. */
.head-row > div > h2::after,
.craft-lead h2::after,
.mc-cat-head::after {
  content: ""; display: block; width: 48px; height: 3px; background: var(--red); margin-top: clamp(14px, 1.5vw, 20px);
}
/* Kartes: sarkana matu līnija ievelkas zem kartes uz hover / tastatūras fokusa. */
.mcard { position: relative; }
.mcard::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--red);
  transform: scaleX(0); transform-origin: left; transition: transform .28s cubic-bezier(.2, .7, .2, 1);
}
.mcard:hover::after, .mcard:focus-visible::after { transform: scaleX(1); }
/* Navigācija: sarkana pasvītra uz hover / aktīvā punkta (papildus sarkanajam tekstam). */
.tb-nav a { position: relative; }
.tb-nav a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -5px; height: 2px; background: var(--red);
  transform: scaleX(0); transform-origin: left; transition: transform .2s ease;
}
.tb-nav a:hover::after, .tb-nav a[aria-current]::after { transform: scaleX(1); }

/* ==========================================================================
   Lapas galva (sarkanā josla ar H1)
   ========================================================================== */
/* (§item33) Divkolonnu masthead. Foto NAV režģa kolonna, bet absolūts bloks: tikai tā tā platums
   ir tieši 45% no JOSLAS visos platumos. Ar režģi tas būtu 45% no atlikuma pēc sānu rēņa, un pie
   1920 (rēnis 338px) foto nokristu zem 40% — sarkanais dominētu, bet pica kļūtu par šauru sloksni.
   Kreisā kolonna paliek vienīgais plūsmas bērns -> joslas augstumu nosaka tikai tā, un abas
   kolonnas beidzas vienā līnijā (foto = joslas pilns augstums). */
/* Bez overflow: hidden — attēlu jau apgriež .ph-media, un šeit tas tikai nogrieztu H1 pēdējo
   burtu pie 320px, kur virsraksts pārkāpj kolonnu (tā bija arī pirms šī remonta). */
.page-head { position: relative; background: var(--red); color: var(--cream); }
/* Vertikālais gaiss samazināts pret §item25 (92/84), jo kolonna tagad nes trīs elementus, ne vienu:
   josla ar to paliek tuvu iepriekšējam augstumam, nevis izaug par trešdaļu. Kreisā mala = tā pati
   .container iekšējā mala, ko lieto sekcijas zemāk; labajā pusē rēņa nav (foto iet līdz malai). */
.ph-text {
  padding-block: clamp(46px, 4.6vw, 62px) clamp(42px, 4.2vw, 56px);
  padding-left: max(var(--pad), calc((100% - var(--container)) / 2 + var(--pad)));
  padding-right: calc(45% + clamp(24px, 3vw, 44px));
}
/* (§item33) Mērogs ir globālais h1 (clamp(52px, 8.4vw, 124px)) ar VIENU izmaiņu: griests 124 ->
   110. "ĒDIENKARTE" ir viens vārds, tas nelaužas, un divkolonnu joslā kreisā kolonna pārstāj augt
   pie ~1300px (tālāk pieaugumu apēd sānu rēnis), kamēr 8.4vw aug līdz 1476px. Nomērīts: pie 1440
   124px prasa 683px, kolonna dod 651px. Līdz 1310px platumam rinda ir baits pret baitu tā pati, kas
   bija; griests iesitas tikai tur, kur teksts citādi ieskrietu foto. */
.page-head h1 { margin: 0; font-size: clamp(52px, 8.4vw, 110px); }
/* Tā pati virsraksta anatomija kā #edienkarte (48x3px svītra zem virsraksta). Uz sarkanā fona svītra
   invertējas uz krēmu — tas pats paņēmiens, kas jau ir .bg-red joslu virsrakstiem. */
.page-head h1::after { content: ""; display: block; width: 48px; height: 3px; background: rgba(240, 231, 216, .9); margin-top: clamp(14px, 1.5vw, 20px); }
/* Faktu pāri: liels skaitlis + mazie kapiteļi. Tā pati anatomija kā sākumlapas .hero-status
   (font-display 900 versāls + 11px/.26em kapiteļi), tikai skaitlis ir virs etiķetes. */
.ph-facts { display: flex; flex-wrap: wrap; gap: 16px 56px; margin: clamp(26px, 3.2vw, 40px) 0 0; }
.ph-fact { display: flex; flex-direction: column; gap: 6px; }
.ph-fact-n { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: clamp(26px, 2.3vw, 34px); line-height: 1.1; letter-spacing: .02em; }
.ph-fact-cap { font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: rgba(240, 231, 216, .78); }
/* Foto: joslas pilnā augstumā, pilnasiņa līdz labajai malai. Ciešais kadrējums — attēla kaste ir
   150% no rāmja un nobīdīta pa kreisi, tāpēc pica pārkāpj rāmja augšu, apakšu UN labo malu, nevis
   sēž tajā ar galda malām apkārt. Kastei un rāmim proporcija atšķiras, tāpēc cover griež;
   object-position izvēlas vertikālo kadru. */
.ph-media { position: absolute; top: 0; right: 0; bottom: 0; width: 45%; margin: 0; overflow: hidden; }
.ph-media img {
  position: absolute; display: block; max-width: none;
  top: -26%; left: -16%; width: 150%; height: 150%;
  object-fit: cover; object-position: 50% 46%;
}
/* Zem 900px foto izkrīt pavisam (nevis saspiežas vēstuļu kastē) un josla atgūst labo rēni. */
@media (max-width: 899px) {
  .ph-media { display: none; }
  .ph-text { padding-right: max(var(--pad), calc((100% - var(--container)) / 2 + var(--pad))); }
}

/* ==========================================================================
   Hero (sākumlapa: pilnekrāna video fons + saturs apakšā pa kreisi)
   ========================================================================== */
/* Tikai topbar (~75px; §item13 lente noņemta). Hero atņem šo no ekrāna augstuma. */
:root { --chrome: 75px; }

.hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--red);          /* pēdējā glābiņa — hero nekad nav tukšs */
  color: var(--cream);
  padding: 0;
  min-height: calc(100svh - var(--chrome));
  display: grid;
  /* (§item32) stretch (nevis end): .hero-grid aizņem visu joslu, lai logo kaste varētu
     centrēties starp galvenes apakšu un pogām. Pogas+statuss paliek pie apakšas. */
  align-items: stretch;
}
@supports not (height: 100svh) {
  .hero { min-height: calc(100vh - var(--chrome)); }
}

.hero-bg { position: absolute; inset: 0; z-index: -2; }
.hero-bg .hero-video { width: 100%; height: 100%; display: block; object-fit: cover; object-position: 50% 55%; /* darbība kadros ir zem centra */ }

/* Scrim (§item4): saturs tagad CENTRĒTS un apakšā -> tumšums koncentrēts apakšā, plus
   vienmērīgs plīvurs, lai centrā (kur agrāk scrim bija gaišs) teksts iztur WCAG AA pār video. */
.hero-scrim {
  position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(180deg, rgba(20,17,15,.36) 0%, rgba(20,17,15,.22) 12%, rgba(20,17,15,.50) 32%, rgba(20,17,15,.66) 58%, rgba(20,17,15,.88) 82%, rgba(20,17,15,.96) 100%),
    linear-gradient(0deg, rgba(20,17,15,.10), rgba(20,17,15,.10));
}

/* Saturs (§item4): viena CENTRĒTA kolonna, pielīmēta pie apakšas (video darbība paliek redzama augšā).
   (§item32) Augšējā padding = 0 un align-content: stretch: josla, kurā logo centrējas, sākas TIEŠI
   pie galvenes apakšas, tāpēc gapTop ir tīri (joslas augstums - logo) / 2. Kolonnas gap = 0, lai
   starp logo kasti un pogām neiekristu papildu atstarpe, kas sabojātu gapTop == gapBottom;
   vienīgā palikusī atstarpe (pogas -> statuss) tagad ir .hero-status margin-top. */
.hero-grid { display: grid; grid-template-columns: minmax(0, 1fr); align-content: stretch; padding-block: 0 clamp(34px, 7svh, 80px); }
.hero-col { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0; }
/* Aizņem visu atlikušo augstumu virs pogām un centrē logo tajā. Padding apakšā ir par 6px
   lielāks nekā augšā = optiskais pacēlums: gapBottom - gapTop = 6px (zem 8px sliekšņa), logo
   sēž 3px virs skaitliskā centra. Simetriskā daļa (12px) ir tikai grīda: kad josla sarūk līdz
   logo augstumam (~320x568), logo tomēr nepieskaras galvenei, un starpība paliek tie paši 6px.
   min-height: 0 -> zemos ekrānos sarūk kaste, nevis pogas aiziet zem locījuma. */
.hero-logo-box { flex: 1 1 auto; min-height: 0; display: flex; align-items: center; justify-content: center; padding: 12px 0 18px; }
/* Hero fokuss = logo lockup (§item20). Izmērs nāk TIKAI no CSS platuma (height:auto + proporcija no
   atribūtiem) -> lielāku eksportu vai SVG var iemainīt bez izkārtojuma izmaiņām. Native 900px = ciets
   griests: 500 CSS px ir ~1.8x uz retina; NEIET pāri ~520px ar šo failu. (§item32) Apakšmalas vairs
   nav: vertikālo novietojumu pilnībā nosaka .hero-logo-box. */
.hero-logo { width: clamp(230px, 36vw, 500px); height: auto; margin: 0;
  filter: drop-shadow(0 2px 26px rgba(0, 0, 0, .45)); }
/* Divas vienādas pogas (viens augstums >=52px un pildījums), centrētas; uz šaura ekrāna kraujas. */
.hero-cta { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px 16px; margin: 0; }
.hero-cta .btn { min-height: 56px; padding: 16px 40px; min-width: 200px; }
.hero-cta .btn-line { background: transparent; color: var(--cream); border-color: rgba(240, 231, 216, .7); border-width: 1.5px; }
.hero-cta .btn-line:hover { background: var(--cream); color: var(--ink); border-color: var(--cream); }
/* (klienta labojumi 1a) Lapas VIENĪGAIS H1 pārcēlās no izņemtās #intro joslas uz hero. Vizuālais
   svars ir tuvs .hero-status rindai, NE headline mērogam — hero fokuss paliek logo lockup.
   Displeja fonts + versāls tur to vienā ģimenē ar .hs-cap, tikai platlāk retinātu.
   text-shadow: H1 sēž uz video, tapec kontrastam vajag pašam savu aizmuguri. */
/* margin-top ir 0 ar nolūku: .hero-logo-box 12/18px padding VIENS pats tur logo optisko
   pacēlumu (gapBottom - gapTop = 6px). Jebkura mala šeit to summu izjauktu. */
.hero-h1 {
  margin: 0 0 clamp(16px, 2.4svh, 26px);
  font-family: var(--font-display); font-weight: 900; text-transform: uppercase;
  font-size: clamp(13px, 1.35vw, 17px); line-height: 1.4; letter-spacing: .16em;
  color: var(--cream); max-width: 30ch;
  text-shadow: 0 1px 3px rgba(20, 17, 15, .75), 0 2px 18px rgba(20, 17, 15, .6);
}
.hero-status { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 44px; margin: clamp(14px, 2.2svh, 24px) 0 0; padding-top: clamp(16px, 2.6svh, 24px); border-top: 1px solid rgba(240, 231, 216, .28); }
.hero-status .hs-cell { display: flex; flex-direction: column; gap: 6px; align-items: center; }
.hero-status .hs-cap { font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: rgba(240, 231, 216, .78); }
.hero-status .hs-val { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: 22px; letter-spacing: .02em; color: var(--cream); }
.hero-status a.hs-val:hover { color: var(--red); }

/* (§item39) Mazie ekrāni VAIRS nebloķē video — tas tagad tikai izvēlas mazāko failu (JS).
   Bez JS: <video preload="none" poster> parāda posteri savā rāmī, tas jau ir pareizā atbilde,
   tāpēc šeit vairs nav vajadzīga CSS aizvietotāja josla. */
/* Reduced-motion: nav video, tikai posteris (dublē JS bloku, sedz arī no-JS gadījumu). */
@media (prefers-reduced-motion: reduce) {
  .hero-bg .hero-video { display: none; }
  .hero-bg { background: url(/video/hero-poster.webp) 50% 55% / cover no-repeat, var(--red); }
}

/* ==========================================================================
   Sākumlapas ēdienkartes teaser (foto kartes)
   ========================================================================== */
.mgrid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 2px; }
.mcard { display: block; text-decoration: none; color: inherit; background: var(--panel); overflow: hidden; }
.mcard-ph { display: block; overflow: hidden; aspect-ratio: 1; background: var(--panel); }
.mcard-zoom { display: block; height: 100%; transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
.mcard-zoom img { width: 100%; height: 100%; object-fit: cover; }
.mcard:hover .mcard-zoom { transform: scale(1.04); }
.mcard-row { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 18px 20px; }
.mcard-name { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: 20px; letter-spacing: .01em; }
.mcard-price { font-family: var(--font-display); font-weight: 900; font-size: 18px; color: var(--red); font-variant-numeric: tabular-nums; }
.mcard-desc { display: none; }

/* ==========================================================================
   Craft (Trīs soļi) — foto kartes
   ========================================================================== */
.craft-sec { padding: clamp(72px, 9vw, 116px) 0; }
.craft-grid { display: block; }
.craft-lead h2 { margin: 14px 0 0; }
/* (klienta labojumi 2) Jauns lead tieši zem virsraksta. Sarkanā svītra nāk no .craft-lead h2::after,
   tāpēc šī margin-top skaitās no svītras, ne no virsraksta bāzes līnijas. */
.craft-lead-p { max-width: 60ch; margin: clamp(18px, 2.2vw, 26px) 0 0; }
/* (klienta labojumi 2) align-items: stretch + .fact-in flex: 1 tur visām trīm kartītēm vienu
   augstumu, arī kad jaunie teksti ir 17-22 vārdu gari (bija 9-12) un ietilpst dažādā rindu skaitā. */
.facts { list-style: none; margin: clamp(28px, 4vw, 44px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; align-items: stretch; }
.fact { position: relative; display: flex; flex-direction: column; background: var(--ink); overflow: hidden; }
.fact-media img { width: 100%; height: 230px; object-fit: cover; transition: transform .45s cubic-bezier(.2, .7, .2, 1); }
.fact-in { padding: 28px 28px 32px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
.fact-n { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: 14px; letter-spacing: .22em; color: var(--red); transition: transform .25s ease; }
.fact-label { font-family: var(--font-head); font-weight: 800; text-transform: uppercase; font-size: 26px; line-height: 1.22; letter-spacing: .01em; margin: 0; }
.fact-sub { margin: 0; color: var(--cream-soft); font-size: 15px; line-height: 1.6; text-wrap: pretty; }
.craft-media { display: none; }

/* Craft karšu hover / tastatūras fokuss (§item8): attēls mērogojas 1.035 fiksētā rāmī,
   numurs pabīdās, sarkana matu līnija ievelkas zem kartes ~250ms. Fokuss = tas pats + akcenta kontūra. */
.fact::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--red);
  transform: scaleX(0); transform-origin: left; transition: transform .25s ease;
}
.fact:hover .fact-media img, .fact:focus-visible .fact-media img { transform: scale(1.035); }
.fact:hover .fact-n, .fact:focus-visible .fact-n { transform: translateX(5px); }
.fact:hover::after, .fact:focus-visible::after { transform: scaleX(1); }
.fact:focus-visible { outline: 2px solid var(--red); outline-offset: 3px; }
/* Samazinātas kustības režīmā hover patur TIKAI krāsas maiņu (sarkanā līnija uzreiz), bez mērogošanas/bīdes. */
@media (prefers-reduced-motion: reduce) {
  .fact:hover .fact-media img, .fact:focus-visible .fact-media img,
  .fact:hover .fact-n, .fact:focus-visible .fact-n { transform: none; }
}

/* ==========================================================================
   Kitchen (Hot like our oven) — foto + teksts
   ========================================================================== */

/* ==========================================================================
   About story
   ========================================================================== */
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(36px, 5vw, 64px); align-items: center; }
.about-media { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; align-items: start; }
.about-photo { margin: 0; overflow: hidden; aspect-ratio: 3 / 4; }
.about-photo img { width: 100%; height: 100%; object-fit: cover; }
.about-photo-1 { margin-top: 36px; }
.about-text .micro { color: rgba(240, 231, 216, .85); }
.about-text h2 { margin: 14px 0 20px; }
.about-text p { color: rgba(240, 231, 216, .92); max-width: 48ch; line-height: 1.8; }
/* Par mums iet uz sarkanā fona -> viss teksts --on-red. Krēms tur dod 4,05:1, un .92/.85 alfa
   to nogremdē vēl zemāk (3,65:1) — uz šī sarkanā jebkura caurspīdība nokrīt zem AA, tāpēc
   hierarhiju šeit nes izmērs un burtu retinājums, nevis krāsas caurspīdīgums. */
.bg-red .about-text .micro { color: var(--on-red); }
.bg-red .about-text p { color: var(--on-red); }

/* ==========================================================================
   #contacts uz sarkanā (§item18): teksts krēms; sarkanie akcenti (eyebrow, virsraksta svītra,
   telefons, šodienas rinda, pasūtīšanas poga) kļūst krēms/tinte, lai iztur pār sarkano.
   (§item27) #contacts nāk no VIENA šablona (contactsHtml) un ir sarkans ABĀS lapās, tāpēc šie
   noteikumi tagad apkalpo gan sākumlapu, gan /menu. Nemainīt tos vienā lapā vien.
   ========================================================================== */
/* VISS teksts joslā ir --on-red (#FFF = 4,96:1). Arī virsraksti: krēms tur ir 4,05:1, kas iztur
   tikai AA-large — klienta prasība ir viens slieksnis 4,5:1 pilnīgi visam uz sarkanā.
   Caurspīdīga krāsa te vairs nav nekur, kur ir teksts: pat BALTAM pār #C8402F jau .92 alfa
   nokrīt uz 4,43:1 (krēmam ar to pašu alfu — 3,65:1). Alfa palikusi TIKAI dekorā (līnijas,
   rāmji), kur kontrasta prasības nav.
   Sargs: _test-on-red.mjs mēra katru redzamo teksta nesēju abās .bg-red joslās, abās lapās. */
.bg-red .micro, .bg-red .accent, .bg-red .muted { color: var(--on-red); }
.bg-red .head-row > div > h2::after { background: rgba(255, 255, 255, .9); }
.bg-red .contact-info h3 { color: var(--on-red); }
.bg-red .contact-addr { color: var(--on-red); }
.bg-red .contact-addr a { color: var(--on-red); text-decoration: underline; }
.bg-red .hrow { border-bottom-color: rgba(255, 255, 255, .32); }
.bg-red .hrow .hday, .bg-red .hrow > span { color: var(--on-red); }
/* "Slēgts" agrāk bija .74 alfa = 3,39:1. Sekundārais tas paliek pēc slīpuma, ne pēc bālēšanas. */
.bg-red .hrow .closed { color: var(--on-red); font-style: italic; }
.bg-red .hrow.today, .bg-red .hrow.today .hday, .bg-red .hrow.today > span { color: var(--on-red); font-weight: 700; }
.bg-red .delivery-note { color: var(--on-red); }
.bg-red .map { border-color: rgba(255, 255, 255, .38); }
.bg-red .socials a { border-color: rgba(255, 255, 255, .5); color: var(--on-red); }
.bg-red .socials a:hover { background: var(--cream); border-color: var(--cream); color: var(--ink); }
/* Kontūrpogas uz sarkanā: bāzes .btn-line/.btn-ghost/.btn-ink ir krēma (4,05:1) un domātas tumšam
   fonam. Uz sarkanā tās pārņem --on-red. Noteikums ir uz JOSLAS, nevis uz .map-btns, tāpēc tas
   stāv arī tad, ja kontūrpoga joslā parādās citur (piem. "Zvanīt" pie kontaktiem). */
.bg-red .btn-line, .bg-red .btn-ghost, .bg-red .btn-ink { color: var(--on-red); border-color: rgba(255, 255, 255, .65); }
.bg-red .btn-line:hover, .bg-red .btn-ghost:hover, .bg-red .btn-ink:hover { background: var(--cream); color: var(--ink); border-color: var(--cream); }
.bg-red .order-row .btn-red { background: var(--cream); color: var(--ink); border-color: var(--cream); }
.bg-red .order-row .btn-red:hover { background: var(--ink); color: var(--cream); border-color: var(--ink); }

/* ==========================================================================
   Citāta josla (Mūsu solījums)
   ========================================================================== */
.quoteband { position: relative; overflow: hidden; background: var(--panel); color: var(--cream); padding: clamp(72px, 9vw, 116px) 0; text-align: center; }
.quoteband-in { position: relative; padding-inline: var(--pad); max-width: 900px; margin: 0 auto; }
/* §item10: viena ierīce — milzīga sarkana pēdiņa aiz teksta. Iezīmē šo kā solījumu/citātu un
   liek lapai uz mirkli apstāties. Ghostēta, aiz teksta; NEVIS vēl viena kartīte. */
.quoteband-in::before {
  content: "\201C"; position: absolute; top: -.36em; left: 50%; transform: translateX(-50%);
  font-family: var(--font-display); font-weight: 900; line-height: 1;
  font-size: clamp(160px, 22vw, 320px); color: var(--red); opacity: .22; z-index: 0; pointer-events: none;
}
.quote-kicker, .bigquote, .quote-attrib { position: relative; z-index: 1; }
.quote-kicker { color: var(--red); margin-bottom: clamp(18px, 2.6vw, 24px); }
.bigquote { margin: 0 auto; font-family: var(--font-head); font-weight: 800; text-transform: uppercase; font-size: clamp(28px, 3.8vw, 54px); line-height: 1.22; max-width: 22ch; }
.quote-attrib { color: var(--muted); margin-top: clamp(20px, 3vw, 24px); }

/* ==========================================================================
   Galerija (§item11): horizontāla, velkama, bezgalīgi cilpaina lente.
   Katrs kadrs savā DABISKAJĀ proporcijā (aspect-ratio no DIMS) ar kopīgu bāzes AUGSTUMU
   (ne platumu). object-fit cover pie sakrītošas proporcijas nekropē. scroll-snap + vanilla JS.
   ========================================================================== */
.gallery { position: relative; margin-top: clamp(30px, 4.5vw, 48px); }
.g-track {
  display: flex; gap: 14px; overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; padding: 6px var(--pad);
  scrollbar-width: none; -ms-overflow-style: none;
}
.g-track::-webkit-scrollbar { display: none; }
.g-track:focus-visible { outline: 2px solid var(--red); outline-offset: -2px; }
.g-slide {
  position: relative; flex: 0 0 auto; height: clamp(300px, 40vw, 460px);
  scroll-snap-align: center; overflow: hidden; margin: 0; background: var(--panel);
}
.g-slide img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
.g-slide:hover img { transform: scale(1.04); }
/* Bultas ZEM attēliem, centrētas (§item16a) — rādām tikai kad JS gatavs (bez JS: velkam ar pirkstu/trackpad). */
.g-controls { display: none; justify-content: center; gap: 16px; margin-top: clamp(18px, 2.6vw, 30px); padding: 0 var(--pad); }
.gallery.g-ready .g-controls { display: flex; }
.g-arrow {
  width: 52px; height: 52px; display: grid; place-items: center; flex: 0 0 auto;
  background: rgba(20, 17, 15, .62); border: 1px solid var(--line); color: var(--cream); cursor: pointer;
  transition: background-color .2s, border-color .2s, color .2s;
}
.g-arrow:hover { background: var(--red); border-color: var(--red); color: var(--cream); }
.g-arrow:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; }

/* ==========================================================================
   Atsauksmes (§item12): featured + reitinga panelis (viena pilna platuma kompozīcija), tad kartes.
   Ķermeņa teksts DM Sans (lasāms), displeja fonts tikai virsrakstam. Iniciāļa disks + datums + Google.
   ========================================================================== */
.stars-red { color: var(--red); letter-spacing: .12em; margin: 0; }
.revs-note { margin-top: 8px; }

/* Iniciāļa disks + vārds + loma/datums + Google zīme (kopīgs featured un kartēm). */
.rv-avatar { flex: 0 0 auto; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
  background: var(--red); color: var(--cream); font-family: var(--font-display); font-weight: 900; font-size: 19px; }
.rv-who { display: flex; flex-direction: column; min-width: 0; }
.rv-who b { color: var(--cream); font-weight: 600; font-size: 14px; letter-spacing: .01em; }
.rv-role, .rv-date { color: var(--muted); font-size: 12.5px; }
.review-src { margin-left: auto; display: inline-flex; align-items: center; }

/* Augšējā kompozīcija: featured (plašāks) + reitinga panelis. */
/* §item22: reitinga kolonna = SATURA platums (auto), nevis 1fr -> nozīmīte saraujas līdz saturam,
   sēž pie labās malas bez atstarpes labajā pusē; featured aizņem pārējo. */
.reviews-top { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: clamp(20px, 3vw, 48px); align-items: start; margin-bottom: clamp(30px, 4vw, 52px); }
.review-featured { margin: 0; padding: 0; border: 0; max-width: none; }
.review-featured .review-lead { font-family: var(--font-body); font-weight: 500; text-transform: none; letter-spacing: 0;
  font-size: clamp(19px, 1.7vw, 26px); line-height: 1.5; color: var(--cream); margin: 16px 0 0; }
.rv-by { display: flex; align-items: center; gap: 14px; margin-top: clamp(20px, 2.4vw, 28px); }

/* §item17: kompakts reitinga bloks — lielais skaitlis blakus zvaigžņu+skaita kaudzītei; bez stranded gap
   (panelis tikai satura augstumā, jo .reviews-top align-items:start; poga tieši zem, bez margin-top:auto). */
.rating-panel { display: flex; flex-direction: column; align-items: flex-start; gap: clamp(18px, 2.4vw, 26px); justify-self: start;
  border: 1px solid var(--line); background: var(--ink); padding: clamp(22px, 2.6vw, 32px); }   /* ink uz panel joslas (§item18); justify-self:start = satura platums arī mobilajā */
.rating-figure { display: flex; align-items: center; gap: 16px; }
.rating-figure b { font-family: var(--font-display); font-weight: 900; font-size: clamp(48px, 5.4vw, 68px); line-height: .9; color: var(--red); }
.rating-meta { display: flex; flex-direction: column; gap: 6px; }
.rating-meta .stars-red { font-size: 16px; }
.rating-count { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size: 13px; }

/* Pārējās atsauksmes: līdzsvarotas kartes (flex-grow aizpilda pēdējo rindu -> nav karājoša ieraksta). */
.review-grid { display: flex; flex-wrap: wrap; gap: clamp(14px, 1.6vw, 22px); }
.review-item { flex: 1 1 300px; margin: 0; padding: 26px 26px 22px; border: 1px solid var(--line); background: var(--ink);
  transition: transform .25s cubic-bezier(.2, .7, .2, 1), border-color .25s; }   /* ink kartes uz panel joslas (§item18) */
.review-item:hover { transform: translateY(-4px); border-color: var(--red); }
.review-item blockquote { margin: 12px 0 0; color: var(--cream-soft); font-family: var(--font-body); font-size: 15px; line-height: 1.7; }
.review-item figcaption { display: flex; align-items: center; gap: 12px; margin-top: 20px; }

/* ==========================================================================
   Kontakti (karte + darba laiki + Waze/Maps)
   ========================================================================== */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(26px, 3vw, 26px); }
.contact-info h3 { margin-bottom: 10px; }
.contact-addr { color: var(--cream-soft); }
.hours-rows { margin-top: 20px; }
.hrow { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--line-soft); font-size: 15px; font-variant-numeric: tabular-nums; }
.hrow .hday { color: var(--cream); }
.hrow .closed { color: rgba(240, 231, 216, .45); }
.hrow.today, .hrow.today .hday { color: var(--red); }
.delivery-note { margin-top: 18px; }
.order-row { margin-top: 16px; }
.map { border: 1px solid var(--line); overflow: hidden; background: var(--panel); }
.map iframe { display: block; width: 100%; height: clamp(300px, 40vw, 420px); border: 0; filter: grayscale(.4) contrast(1.05); }
.map-btns { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.socials { display: flex; gap: 10px; margin-top: 18px; }
.socials a { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--line); color: var(--cream); transition: border-color .22s, color .22s; }
.socials a:hover { border-color: var(--cream); color: var(--red); }

/* ==========================================================================
   Footer
   ========================================================================== */
.footer { background: var(--ink); border-top: 1px solid var(--line); padding: clamp(56px, 7vw, 76px) 0 clamp(26px, 3vw, 32px); color: var(--cream); }
.footer-top { display: flex; align-items: center; justify-content: space-between; gap: 40px; flex-wrap: wrap; padding-bottom: clamp(28px, 4vw, 34px); border-bottom: 1px solid var(--line); }
.footer-emblem { width: auto; height: clamp(64px, 7vw, 88px); }
.footer-claim { margin: 0; font-size: 17px; line-height: 1.7; color: rgba(240, 231, 216, .65); max-width: 340px; }
/* (klienta labojumi 6c) Ceturā kolonna sadalījās divos blokos: "Pasūti" (Wolt/Bolt) un
   "Seko mums" (IG/FB) — kopā piecas. auto-fit + minmax, nevis repeat(5, 1fr): fiksētas piecas
   1fr kolonnas pie 1040px saspiestu adresi zem lasāmā platuma; šādi rēņi pārplūst paši un
   pēdējā rindā nepaliek viena atraitnes kolonna. */
.footer-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(148px, 1fr)); gap: clamp(24px, 3vw, 44px); margin-top: clamp(28px, 4vw, 34px); }
.footer h4 { font-family: var(--font-body); font-size: 11px; font-weight: 700; letter-spacing: .3em; text-transform: uppercase; color: var(--muted); margin: 0 0 12px; }
.footer p { color: rgba(240, 231, 216, .75); }
.footer a { color: var(--cream); text-decoration: none; }
.footer a:hover { color: var(--red); }
.footer .f-note { margin-top: 8px; color: var(--muted); font-size: 14px; }
.footer .f-tel { font-family: var(--font-display); font-weight: 900; font-size: 22px; }
/* (klienta labojumi 6b) Bija `auto 1fr` + `dd { text-align: right }`: 1fr izstiepa laika kolonnu
   līdz kājenes kolonnas platumam, un right aizgrūda laiku līdz galam pa labi — tā ir klientes
   redzētā "milzīgā atstarpe". max-content abām + kreisais līdzinājums saliek dienu un laiku kopā. */
.footer .f-hours { display: grid; grid-template-columns: max-content max-content; gap: 6px 24px; font-size: 14px; font-variant-numeric: tabular-nums; }
.footer .f-hours dt { color: var(--muted); }
.footer .f-hours dd { margin: 0; text-align: left; }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-top: clamp(28px, 4vw, 44px); padding-top: 20px; border-top: 1px solid var(--line-soft); font-size: 13px; color: rgba(240, 231, 216, .5); }
.footer-bottom .lang { display: inline-flex; gap: 8px; }
/* (§item44) Pieskāriena mērķis: teksts ir 14x22px, kas krīt zem WCAG 2.5.8 AA (24x24).
   Polsterējums palielina trāpījuma kasti līdz 26x38, negatīvā mala to atņem atpakaļ no
   izkārtojuma, tāpēc kājenes rinda vizuāli nepakustas. 44px šeit nav sasniedzami: LV / EN
   kopā aizņem ~45px, tāpēc 44px kastes pārklātos viena ar otru, kas ir sliktāk par mazu mērķi. */
.footer-bottom .lang a { color: var(--muted); text-decoration: none; padding: 8px 6px; margin: -8px -6px; }
.footer-bottom .lang a[aria-current] { color: var(--cream); }
.footer-bottom .lang span { color: var(--line); }

/* ==========================================================================
   /menu lapa
   ========================================================================== */
.menu-head { display: none; }             /* aizstāts ar .page-head sarkano joslu */

/* Foto rinda (§4.2): 220px bilde | 60px numurs | 1fr nosaukums+apraksts | auto cena */
.mc-list { list-style: none; margin: 0; padding: 0; }
.mc-item { display: grid; align-items: center; gap: 36px; padding: 26px 0; border-top: 1px solid var(--line); grid-template-columns: 1fr auto; }
.mc-list .mc-item:last-child { border-bottom: 1px solid var(--line); }
.mc-item.has-pic { grid-template-columns: 220px 60px 1fr auto; }
.mc-item.has-pic.no-num { grid-template-columns: 220px 1fr auto; }
.mc-pic { aspect-ratio: 1; overflow: hidden; background: var(--panel); }
.mc-pic img { width: 100%; height: 100%; object-fit: cover; transition: transform .22s ease-out; }
.mc-item:hover .mc-pic img { transform: scale(1.04); }
/* Burrata sapnis: grid kolonna paliek (līdzinājums), bet konteineram nav ne fona, ne rāmja, ne <img>. */
.mc-pic.empty { background: none; }
.mc-num { font-family: var(--font-display); font-weight: 900; font-size: 20px; letter-spacing: .06em; color: var(--red); align-self: center; }
.mc-body { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.mc-name { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: clamp(24px, 3vw, 40px); line-height: 1.22; letter-spacing: .01em; }
/* Kompaktās rindas (starteri + visi deserti) — viens nosaukuma svars un viena kreisā mala. */
.mc-item.text .mc-name, .mc-item.compact .mc-name { font-size: clamp(20px, 2vw, 27px); }
.mc-desc { margin: 0; color: var(--cream-soft); font-size: 15px; line-height: 1.55; max-width: 56ch; }
.mc-price { font-family: var(--font-display); font-weight: 900; font-size: 34px; color: var(--cream); white-space: nowrap; font-variant-numeric: tabular-nums; }
.mc-item.text .mc-price, .mc-item.compact .mc-price { font-size: 24px; }
.mc-tags { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.chip { font-family: var(--font-body); font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--red); border: 1px solid var(--line); padding: 2px 8px; align-self: center; }
.mc-name-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }

/* Kategoriju virsraksts starp sekcijām */
.mc-cat-head { margin: 0 0 clamp(20px, 3vw, 32px); }
.mc-section + .mc-section { margin-top: clamp(48px, 6vw, 80px); }
.drinks-note { color: var(--cream-soft); max-width: 54ch; }

/* Vizuāli slēpts (ekrānlasītājam paliek) */
.vh { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
/* Alergēnu kodi pie pozīcijas (renderē tikai, kad ALLERGENS_LIVE) — cipars redzams, vārds title/aria */
.mc-alg { display: inline-flex; gap: 5px; margin-left: 4px; vertical-align: middle; }
.mc-alg-code { font-family: var(--font-body); font-size: 11px; font-weight: 600; color: var(--muted); border: 1px solid var(--line); padding: 0 5px; text-decoration: none; cursor: help; }
/* Alergēnu leģenda lapas apakšā */
.alg-legend { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 40px; max-width: 900px; }
.alg-row { display: flex; gap: 12px; font-size: 14px; color: var(--cream-soft); padding: 8px 0; border-top: 1px solid var(--line-soft); }
.alg-n { font-family: var(--font-display); font-weight: 900; color: var(--red); min-width: 24px; }
@media (max-width: 620px) { .alg-legend { grid-template-columns: 1fr; } }

/* Mobilā sticky pasūtīšanas josla */
.menu-sticky { display: none; }

/* ==========================================================================
   Peldošā poga + Modal
   ========================================================================== */
.float-order { position: fixed; right: clamp(14px, 2.5vw, 24px); bottom: clamp(14px, 2.5vw, 24px); z-index: 50; opacity: 0; transform: translateY(14px); pointer-events: none; transition: opacity .3s, transform .3s; }
.float-order.is-vis { opacity: 1; transform: none; pointer-events: auto; }
@media (min-width: 621px) { .float-order { display: none !important; } }

.modal { position: fixed; inset: 0; z-index: 100; display: none; }
.modal.is-open { display: grid; place-items: center; padding: 24px; }
.modal-bd { position: absolute; inset: 0; background: rgba(20, 17, 15, .86); }
.modal-card { position: relative; width: 100%; max-width: 460px; background: var(--panel); border: 1px solid var(--line); padding: 44px 40px 36px; }
.modal-card h3 { font-size: 36px; color: var(--red); margin-bottom: 4px; }
.modal-btns { display: grid; gap: 10px; margin-top: 22px; }
.modal-btns .btn { width: 100%; }
.modal-foot { margin-top: 18px; font-size: 15px; color: var(--cream-soft); line-height: 1.7; }
.modal-x { position: absolute; top: 12px; right: 12px; width: 38px; height: 38px; display: grid; place-items: center; border: 0; background: transparent; color: var(--muted); font-size: 24px; cursor: pointer; }
.modal-x:hover { color: var(--cream); }
body.modal-open { overflow: hidden; }

/* ==========================================================================
   Responsīvi
   ========================================================================== */
@media (max-width: 960px) {
  .tb-nav, .tb-tel, .tb-lang { display: none; }
  .tb-burger { display: flex; }
  .topbar.is-open { border-bottom-color: var(--line); }
  .topbar.is-open .tb-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .topbar.is-open .tb-burger span:nth-child(2) { opacity: 0; }
  .topbar.is-open .tb-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .topbar.is-open .tb-panel { display: block; }
  .tb-panel { padding: 8px var(--pad) 22px; border-top: 1px solid var(--line); }
  .tb-panel a { display: block; padding: 12px 0; border-bottom: 1px solid var(--line); text-decoration: none; color: var(--cream); font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: 17px; letter-spacing: .04em; }
  .tb-panel .tel { border-bottom: 0; color: var(--red); font-size: 20px; padding-top: 16px; }
  .tb-panel .tb-panel-lang { display: flex; gap: 14px; padding-top: 14px; border-bottom: 0; }
  /* (§item44) Tas pats WCAG 2.5.8 labojums kā kājenē; vertikāli 12px jau nāca no
     .tb-panel a, tāpēc tas te jāatkārto (citādi saīsinājums nogrieztu 24px no paneļa augstuma). */
  .tb-panel .tb-panel-lang a { display: inline; color: var(--muted); text-decoration: none; padding: 12px 6px; margin: 0 -6px; }
  .tb-panel .tb-panel-lang a[aria-current] { color: var(--red); }
  /* Hero paliek viewport-locked arī mobilajā (§item13: lente noņemta, tikai topbar). */
  :root { --chrome: 75px; }
  .about-grid, .contact-grid { grid-template-columns: 1fr; gap: clamp(28px, 6vw, 40px); }
  .facts { grid-template-columns: 1fr; }
  .mgrid { grid-template-columns: 1fr 1fr; }
  .reviews-top { grid-template-columns: 1fr; }
  /* §item22: mobilajā nozīmīte pilnā platumā (kā kartes zemāk), poga aizpilda -> nav orphan atstarpes. */
  .rating-panel { justify-self: stretch; }
  .rating-panel .btn { width: 100%; }
  .footer-cols { grid-template-columns: repeat(2, 1fr); }
  /* (klienta labojumi 6c) Piecas kolonnas divās slēžās dotu 2+2+1: "Seko mums" paliktu viena
     pēdējā rindā, un blakus 7 rindu "Darba laiks" kolonnai zētotu tukšums. Darba laiki stājas
     pār divām rindām -> "Pasūti" un "Seko mums" sakārtojas tiem blakus, un atraitnes rindas nav. */
  .footer-cols > div:nth-child(3) { grid-row: span 2; }
}
@media (max-width: 620px) {
  .container, .narrow, .topbar-in, .tb-panel, .quoteband-in, .ph-text { padding-left: 20px; padding-right: 20px; }
  /* Šaurā ekrānā abiem faktiem jāpaliek vienā rindā: aptīti tie joslu izstiepj par ~70px
     (pie 320x568 tas iznesa joslu pāri 55vh). */
  .ph-facts { gap: 14px 32px; }
  .sec-band { padding: clamp(52px, 13vw, 76px) 0; }
  /* (§item42) Teasera kartes telefonā: mazs kvadrātveida sīktēls BLAKUS tekstam, nevis liels
     kvadrāts VIRS teksta. Tā pati anatomija, kas jau ir /menu rindām (sīktēls | nosaukums + cena),
     tikai sīktēls mazliet lielāks (88 pret 72), jo šī ir vilinoša sekcija, ne saraksts. Pirms:
     katra karte 390-420px augsta, piecas = 2108px režģa. Šīs ir teaseris, ne ēdienkarte — piecām
     jāsalasās kā komplektam, ne pa vienai pilnekrānā. Klikšķināmais laukums paliek visa karte. */
  .mgrid { grid-template-columns: 1fr; }
  .mcard { display: grid; grid-template-columns: 88px 1fr; align-items: center; gap: 14px; padding: 10px; }
  .mcard-ph { width: 88px; }
  .mcard-row { padding: 0; }
  /* (§item43) #reviews telefonā: izkārtojums NEMAINĀS (klients teica, ka tas ir labs) — nogriezts
     tikai vertikālais gaiss: sekcijas padding, režģa atstarpes un katras kartes iekšējā apdare.
     Tipogrāfija (fonts, rindstarpa) neaiztikta, atsauksmju skaits neaiztikts. */
  #reviews.sec-band { padding: 40px 0; }
  .reviews-top { margin-bottom: 22px; }
  .rating-panel { padding: 18px; gap: 14px; }
  .rv-by { margin-top: 16px; }
  .review-grid { gap: 10px; }
  .review-item { padding: 18px 18px 16px; }
  .review-item figcaption { margin-top: 14px; }
  /* (§item44) Telefonā rāda 3 atsauksmes no 5. Pēc apdares nogriešanas #reviews bija 1891px, no
     kuriem 1221px ir pati citātu proza — vairāk apdares tur vairs nebija ko griezt. Pārējās divas
     nav pazudušas: zem režģa jau ir poga "Visas atsauksmes Google". Dators netiek aiztikts.
     Mērīts: 390px -467, 320px -492. */
  .review-grid .review-item:nth-of-type(n+4) { display: none; }
  .about-media { grid-template-columns: 1fr 1fr; }
  .about-photo-1 { margin-top: 0; }
  .footer-cols { grid-template-columns: 1fr 1fr; }
  .footer-top { justify-content: flex-start; }
  /* (§item40, precizēts §item44) --float-reserve nāk no JS (mērīts nospiedums + 16px gaisa;
     sk. scriptsHtml). 100px ir statisks drošinātājs BEZ JS: mērītais home gadījums (poga viena) ir
     ~84px (53.5 augstums + 14 nobīde + 16 gaisa); /menu (tikai sticky josla, sk. §item44) ~90px BEZ safe-area
     -- 100px pārklāj abus ar rezervi drošai malai. */
  .footer { padding-bottom: var(--float-reserve, 100px); }

  /* Ēdienkartes rinda mobilajā: 72px bilde | nosaukums, cena zem.
     (§item44) Rinda saspiesta telefonā: padding 26 -> 16, režģa rindu atstarpe 16 -> 10,
     .mc-body 8 -> 6, un cena beidzot dabū savu line-height (22px Abril mantoja 1.7 no body,
     kas vienai rindai deva 37px augstu kasti). Sīktēls PALIEK 72px, lai gan piezīme atļāva to
     audzēt: mērīts, ka platāks sīktēls sašaurina apraksta kolonnu, teksts pārtinas garāks un
     lapa kļūst AUGSTĀKA -- 390px: -1245 pie 72px pret -1152 pie 88px; 320px: -1245 pret -952. */
  .mc-item { padding: 16px 0; }
  .mc-item.has-pic, .mc-item.has-pic.no-num { grid-template-columns: 72px 1fr; grid-template-rows: auto 1fr; gap: 10px 16px; align-items: start; }
  .mc-body { gap: 6px; }
  /* (§item44) Cena aiziet zem sīktēla, nevis zem apraksta. Sīktēls ir 72px, apraksts parasti
     127-190px, tātad kreisajā kolonnā zem bildes stāvēja 60-120px tukšuma, kamēr cena prasīja
     SAVU režģa rindu labajā pusē. Apraksts tagad pārklāj abas rindas, cena sēž tukšumā:
     rinda = max(bilde + atstarpe + cena, apraksts) nevis apraksts + atstarpe + cena.
     Mērīts: 390px -792, 360px -795, 320px -823. Uz .mc-item.text (bez bildes) neattiecas. */
  .mc-item.has-pic .mc-pic { grid-area: 1 / 1 / 2 / 2; }
  .mc-item.has-pic .mc-body { grid-area: 1 / 2 / 3 / 3; }
  .mc-item.has-pic .mc-price { grid-area: 2 / 1 / 3 / 2; align-self: start; }
  .mc-num { display: none; }
  .mc-item.has-pic .mc-num-inline { display: inline; }
  .mc-name { font-size: clamp(22px, 6vw, 30px); }
  .mc-item.text .mc-name { font-size: 20px; }
  .mc-price { grid-column: 2; font-size: 22px; line-height: 1.15; text-align: left; }
  .mc-item.text { grid-template-columns: 1fr; }
  .mc-item.text .mc-price { grid-column: 1; }

  .page-menu .menu-sticky {
    display: flex; gap: 10px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 55;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
    background: var(--ink); border-top: 1px solid var(--line);
  }
  .page-menu .menu-sticky .btn { flex: 1; }
}

/* ==========================================================================
   404 (P-12). Sava, viegla lapa: tie paši fonti, krāsas un pogas, kas visur,
   bet bez galvenes, footera un satura no store'a — 404 jāatveras arī tad, ja
   datubāze klusē. Statusa kodu uzliek serveris, ne šis fails.
   ========================================================================== */
.nf-body { min-height: 100svh; display: grid; place-items: center; padding: 40px var(--pad); }
.nf { width: 100%; max-width: 560px; text-align: center; }
.nf-logo { display: block; margin: 0 auto 34px; width: max-content; }
.nf-logo img { height: 34px; width: auto; }
.nf-code {
  font-family: var(--font-display); font-weight: 900; color: var(--red);
  font-size: clamp(72px, 18vw, 132px); line-height: 1; letter-spacing: .02em; margin: 0 0 10px;
}
.nf-h1 { font-size: clamp(28px, 6vw, 44px); margin: 0 0 14px; }
.nf-sub { color: var(--cream-soft); margin: 0 0 32px; }
.nf-cta { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.nf-cta .btn { min-width: 180px; }