/* DNA BOLD — sebevědomí: obří verzálky, kontrast měřítek, ostré hrany, velké plochy, rázné pohyby.
   Zakázaný vzorec (SABLONA §7): „fotka + diagonála jako celý nápad" — šikmý ořez je jen
   jeden prvek; charakter nese měřítko písma a plochy. Akcent je akcent (CTA, pás), ne pozadí. */

:root {
  --ram: 0;
  --ram-velky: 0;
  --ram-onas: 0;
  --r-tile: 0;
  --r-btn: 0;
  --tile: var(--paper-2);

  --ease: cubic-bezier(.7, 0, .2, 1);
  --anim-t: .6s;                         /* rázné posuny */
  --anim-dist: 44px;
  --anim-stagger: .05s;
  --marquee-t: 38s;
}

.nadpis { text-transform: uppercase; font-size: clamp(56px, 8.2vw, 150px); line-height: 1.22; letter-spacing: .005em; }
.nadpis em, .citat em { font-style: normal; }
h3 { text-transform: uppercase; font-size: 28px; letter-spacing: .01em; }
.dlazdice.hlavni h3 { font-size: 40px; }
.cena { font-family: var(--f-head), sans-serif; font-size: 24px; }
.popisek { font-weight: 600; letter-spacing: .2em; color: var(--ink); }
.citat { text-transform: uppercase; line-height: 1.22; }
.dlazdice .cislo-polozky { font-style: normal; font-size: 96px; line-height: .85; }

/* výrazný ořez: hlavní fotka nabídky s ostrým šikmým střihem */
.dlazdice.hlavni .ram { clip-path: polygon(0 0, 100% 0, 100% 86%, 82% 100%, 0 100%); }

/* O nás: plná akcentová plocha posunutá za fotkou místo jemného obrysu */
.onas .foto::before { inset: 36px -36px -36px 36px; border: 0; background: var(--accent); opacity: 1; z-index: 0; }
.onas .odznak { display: none; }

/* tlačítko: plná plocha, tučné verzálky */
.tlacitko { font-weight: 600; letter-spacing: .14em; height: 56px; }
.tlacitko:hover { transform: translateX(4px); }

/* běžící pás: obří verzálky na tmavé ploše */
.marquee { background: var(--dark); color: var(--on-dark); padding-block: 26px; }
.marquee span { text-transform: uppercase; font-size: clamp(36px, 4.6vw, 72px); gap: 48px; }
.marquee span::after { content: "●"; font-size: .35em; color: var(--accent-on-dark); opacity: 1; }

.hodnoceni b, .velke-cislo b { font-size: clamp(72px, 8vw, 128px); }

/* kostra BOLD (PRAVIDLA_STRANKY_DNA §1b): obří nadpisy, manifest a citát ve verzálkách */
.manifest-veta, .citat-obri { text-transform: uppercase; }
.manifest { border-bottom: 2px solid var(--ink); }

/* akcent v nadpisu jen jednou na stránce — v citátu; „černá + terakota" v každém nadpisu se opakovalo (recenze 2) */
.nadpis em { color: inherit; }

/* formulář BOLD — sebevědomá geometrie místo tenkých linek (Karel 2026-10-08: „formulář je stejný
   jako u Moniky"): pole jako plné hranaté boxy se silným rámem, velké písmo, popisky tučné verzálky,
   fokus = akcentový rám a podklad, odeslání jako plný pás přes celou šířku */
.pole label { font-weight: 600; font-size: 13px; letter-spacing: .14em; color: var(--ink); }
.pole input, .pole textarea, .telefon-pole select {
  border: 2px solid var(--ink); border-radius: 0; background: var(--paper); padding: 14px 16px;
  font-size: 19px; font-weight: 400; color: var(--ink); transition: background-color .2s, border-color .2s, box-shadow .2s; }
.pole textarea { min-height: 140px; resize: none; }
.pole input:focus, .pole textarea:focus, .telefon-pole select:focus {
  outline: none; border-color: var(--ink); background: color-mix(in srgb, var(--accent) 10%, var(--paper));
  box-shadow: 6px 6px 0 var(--accent); }
.pole input[aria-invalid], .pole textarea[aria-invalid] { border-color: #a3261c; box-shadow: 6px 6px 0 #a3261c; }
.telefon-pole { gap: 8px; }
.telefon-pole select { padding-inline: 10px; }
.kontakt-formular form { gap: 22px 20px; }
.kontakt-formular .odeslat .tlacitko { width: 100%; height: 68px; justify-content: space-between; padding-inline: 28px;
  font-size: 16px; font-weight: 600; letter-spacing: .16em; background: var(--ink); color: var(--paper); }
.kontakt-formular .odeslat .tlacitko:hover { background: var(--accent); color: var(--on-accent); transform: none; }
.kontakt-formular .odeslat .tlacitko svg { width: 32px; height: 20px; }
.siroky-formular h3 { font-size: clamp(36px, 3.6vw, 60px); line-height: 1.25; }

/* ===== BOLD ve všech prvcích (Karel 2026-10-08: DNA do všech sekcí a prvků, ne jen nadpisy) ===== */

/* linky: žádné tečkované ani vlasové — silné plné, jako černá linka pásu v heru */
.kava li, .hodiny dl div, .detaily dl div, .kontakt-blok.hodiny dl div { border-bottom: 2px solid var(--ink); padding-bottom: 8px; }
.kontakt-blok { border-top: 4px solid var(--ink); padding-top: 16px; }
.siroky-formular { border-top-width: 4px; }

/* odkazy: tučné verzálky se silným podtržením, šipka ujede */
.odkaz { font-weight: 600; letter-spacing: .14em; background-size: 100% 3px; padding-bottom: 6px; }
.odkaz:hover { background-size: 100% 3px; color: var(--accent-text); }
.odkaz span { transition: transform .25s var(--ease); display: inline-block; }
.odkaz:hover span { transform: translateX(6px); }

/* ikony: silnější tah, v akcentu */
.ikona, .ikona-nadpis { stroke-width: 2.4; }
.ikona-nadpis { color: var(--ink); }
.kontakt-detaily .ikona { color: var(--ink); }
.kontakt-detaily li { font-weight: 500; }

/* lepicí lišta: černý pás jako lišta / rubrika v heru */
.hlavicka { background: var(--ink); color: var(--paper); border-bottom: 0; backdrop-filter: none; }
.hlavicka .wrap { min-height: 64px; }
.hlavicka .logo { color: var(--paper); }   /* písmo loga = definice loga (logo_vars), ne DNA */
.hlavicka nav a { font-weight: 600; letter-spacing: .14em; color: var(--paper); }
.hlavicka nav a:hover { color: color-mix(in srgb, var(--accent) 45%, #fff); }
.hlavicka .tlacitko { background: var(--accent); color: var(--on-accent); font-weight: 600; height: 64px; margin-block: 0; padding-inline: 26px; }
.hlavicka .tlacitko:hover { background: var(--paper); color: var(--ink); transform: none; }
.hlavicka-menu { color: var(--paper); }
.hlavicka-menu span { height: 3px; }

/* mobilní menu: černá plocha, položky obřími verzálkami, CTA jako plný pás */
.menu-mobil { background: var(--ink); color: var(--paper); }
.menu-mobil .menu-logo { color: var(--paper); }
.menu-odkazy li + li { border-top: 2px solid color-mix(in srgb, var(--paper) 22%, transparent); }
.menu-odkazy a { font-family: var(--f-head), sans-serif; font-size: 44px; letter-spacing: .01em; line-height: 1.2; color: var(--paper); }
.menu-odkazy a::after { color: color-mix(in srgb, var(--accent) 45%, #fff); font-family: var(--f-text), sans-serif; font-size: 28px; }
.menu-cta { width: 100%; height: 64px; justify-content: space-between; background: var(--accent); color: var(--on-accent); font-weight: 600; }
.menu-kontakt { color: var(--paper); font-weight: 500; }
.menu-kontakt .ikona { color: color-mix(in srgb, var(--accent) 45%, #fff); }

/* patička: černý pás jako v heru, obří název v barvě papíru, sloupce tučně */
.paticka { background: var(--ink); color: var(--paper); border-top: 6px solid var(--ink); }
.paticka .maly, .paticka h4, .pravni { color: color-mix(in srgb, var(--paper) 70%, var(--ink)); }
.paticka h4 { font-weight: 600; letter-spacing: .18em; }
.paticka ul a { font-weight: 600; text-transform: uppercase; letter-spacing: .12em; font-size: 14px; }
.paticka ul a:hover { color: color-mix(in srgb, var(--accent) 45%, #fff); text-decoration: none; }
.pravni { border-top: 2px solid color-mix(in srgb, var(--paper) 25%, transparent); }
.obri { color: var(--paper); }

/* základní text BOLD (PRAVIDLA_STRANKY_DNA §3): robustní grotesk 400–500, nikdy Light, plná barva,
   krátký řádek; úvodní odstavec větší a tučnější; drobný text řez 500 v plném inkoustu, ne šedý */
body { font-weight: 400; font-size: 18px; line-height: 1.5; }
p { max-width: 24em; }                                       /* ~45 znaků */
.maly { font-size: 15px; font-weight: 500; color: var(--ink-2); }
.onas-presah .presah-pod p:not(.maly) { font-size: clamp(20px, 1.7vw, 24px); font-weight: 500; line-height: 1.4; max-width: 22em; }
.onas-presah .presah-pod p.maly { font-weight: 600; text-transform: uppercase; letter-spacing: .12em; font-size: 13px; }
.plakat-radek .maly { font-size: 15px; }
.kontakt-blok p.maly, .siroky-formular p.maly { font-size: 16px; }
.hodiny dt, .detaily dt, .kontakt-blok.hodiny dt { color: var(--ink); font-weight: 500; }
.hodiny dd, .kontakt-blok.hodiny dd { font-family: var(--f-head), sans-serif; font-size: 20px; letter-spacing: .02em; }
.kava li span:first-child { font-weight: 500; }
.paticka .maly { font-weight: 500; }
@media (max-width: 700px) { body { font-size: 18px; } .maly { font-size: 16px; } }

/* moduly „písmo přes hranu fotky" a „slovo z fotky" ve verzálkách BOLD */
.pres-hranu, .slovo { text-transform: uppercase; }

/* popisky sekcí ve všech sekcích stejně — černý štítek jako rubrika „DENNÍ BISTRO · VINOHRADY" v heru
   (Karel 2026-10-08: popisek měla jen O nás) */
.popisek { display: inline-block; justify-self: start; background: var(--ink); color: var(--paper); padding: 6px 10px 5px;
           font-size: 13px; font-weight: 600; letter-spacing: .18em; line-height: 1; }
.tmava .popisek { color: var(--paper); }

.kontakt-obri-adresa .cislo-obri { text-transform: uppercase; }
/* BOLD: výrazný obrys písmen vyplněných fotkou (Karel 2026-10-08) */
.slovo { -webkit-text-stroke: clamp(4px, .03em, 10px) var(--ink); }
.obri span:last-child { letter-spacing: 0; }   /* prostrkání za posledním písmenem nesmí název vystrčit */

/* výrazná atmosféra: barva hera nesmí skončit u hera (Karel 2026-10-10: „kde se výraznost projevila
   kromě hera?") — kobaltové plochy (O nás, patička s obřím logem), štítky sekcí v barvě plochy,
   hlavní tlačítka mandarinkou jako CTA v heru */
.atm-colorful .paticka { background: var(--dark); color: var(--on-dark); border-top-color: var(--dark); }
.atm-colorful .paticka .maly, .atm-colorful .paticka h4, .atm-colorful .pravni { color: var(--on-dark-muted); }
.atm-colorful .popisek { background: var(--dark); color: var(--on-dark); }
/* přesně mandarinka z hera i s bílým písmem jako CTA v heru (Karel 2026-10-10: posoudí čitelnost sám;
   kontrast bílé na #ff7a2f je ~2,6 : 1, pod AA) */
.atm-colorful .tlacitko, .atm-colorful .kontakt-formular .odeslat .tlacitko { background: var(--accent-fill); color: var(--on-accent-fill, #fff); }   /* barva písma podle kontrastu (WCAG AA), ne natvrdo bílá */
.atm-colorful .tlacitko:hover, .atm-colorful .kontakt-formular .odeslat .tlacitko:hover { background: var(--dark); color: var(--on-dark); }
.atm-colorful .tmava .popisek, .atm-colorful .onas .popisek { background: var(--accent-on-dark); color: var(--dark); }   /* na kobaltu by kobaltový štítek zmizel */
.atm-colorful .hlavicka { background: var(--dark); }   /* lepicí lišta kobaltem jako zeď hera, ne černá */
.atm-colorful .hlavicka .tlacitko:hover { background: var(--paper); color: var(--ink); }

/* ---------- formulář až po kliknutí (Karel 2026-10-11): obří výzva jako řádek, pole se rozbalí ---------- */
.rozbalovaci { display: block; }
.rozbalovaci summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 8px 24px; }
.rozbalovaci summary::-webkit-details-marker { display: none; }
.sf-vyzva { font-family: var(--f-head), sans-serif; text-transform: uppercase; font-size: clamp(44px, 6vw, 96px); line-height: .95; letter-spacing: -.01em; }
.sf-sipka svg { width: clamp(40px, 5vw, 80px); height: auto; transition: transform .4s var(--ease); }
.rozbalovaci summary .maly { grid-column: 1 / -1; }
.rozbalovaci summary:hover .sf-vyzva { color: var(--accent-text); }
.rozbalovaci summary:focus-visible { outline: 3px solid var(--accent); outline-offset: 6px; }
.rozbalovaci[open] .sf-sipka svg { transform: rotate(90deg); }
.rozbalovaci .kontakt-formular { margin-top: 32px; }

/* ---------- kontakt 2026-10-11: adresa jako plakátový pruh přes celou šířku (inverzně) ----------
   „KAM?" vyplněné fotkou zamítnuto — fotka v písmu nezapadala do vzhledu BOLD. Nadpis zůstává obří
   jako u ostatních sekcí, odpověď (adresa) je jiné pojetí: tmavý pruh od okraje k okraji. */
.kontakt-siroky { overflow-x: clip; }
.kontakt-siroky .kontakt-obri-adresa { background: var(--ink); color: var(--paper); margin-inline: calc(50% - 50vw);
  padding: clamp(24px, 3vw, 40px) calc(50vw - 50%); margin-block: 8px clamp(32px, 4vw, 56px); }
.kontakt-siroky .kontakt-obri-adresa .maly, .kontakt-siroky .kontakt-obri-adresa .odkaz { color: var(--paper); }
.kontakt-siroky .kontakt-obri-adresa .cislo-obri { text-transform: none; font-family: var(--f-text), sans-serif; font-weight: 700; letter-spacing: -.02em;
  font-size: clamp(36px, 4.4vw, 68px); line-height: 1.05; }   /* jiné pojetí než obří nadpis nad pruhem (audit: „totéž, jen větší") */
.sf-vyzva { text-transform: none; font-family: var(--f-text), sans-serif; font-weight: 700; letter-spacing: -.02em; font-size: clamp(36px, 4.4vw, 68px); }

/* ---------- obří čísla položek a fotka přes celou obrazovku (MANUAL_DNA) ---------- */
.dna-bold .plakat-cislo { font-family: var(--f-head), sans-serif; font-size: clamp(40px, 4vw, 64px); line-height: .9; color: var(--accent-text); letter-spacing: -.02em; }
.dna-bold .detail-remesla { position: relative; margin: 0; }
.dna-bold .detail-remesla img { display: block; width: 100%; height: 100svh; max-height: 980px; object-fit: cover; }
.dna-bold .detail-remesla figcaption { position: absolute; left: clamp(20px, 5vw, 80px); bottom: clamp(32px, 5vw, 72px); width: fit-content; max-width: 14ch;
  padding: .08em .18em .02em; background: var(--ink); color: var(--paper);
  font-family: var(--f-head), sans-serif; text-transform: uppercase; font-size: clamp(48px, 7.5vw, 132px); line-height: 1.24; letter-spacing: -.01em; font-style: normal; }

/* jídlo, jehož fotka je vlevo vidět, probarvené (Karel 2026-10-11) — jen barva, žádná změna rozměrů */
.plakat-radek.je h3 { color: var(--accent-text); }
