/* 24hod.sk – dizajn v2 Titulka (zdroj: design-2026/v2/src/base.css + titulka/style.css) */
@import url(/fonty/fonty.css);

/* ==========================================================
   24hod.sk v2 – spoločný základ všetkých troch smerov
   Funkčné vzory: hlavička, navigácia, mega menu, karty, bloky,
   článok, rubrika, pätička, responzivita. Vzhľad dolaďuje style.css smeru.
   ========================================================== */

:root {
  /* Farby z loga a doplnkové */
  --atrament: #121210;
  --text-2: #3A3D42;
  --tlmena: #5E6670;
  --linka: #E4E6EA;
  --hmla: #F3F4F6;
  --oranzova: #F6841F;
  --oranzova-text: #B85A0B;
  --oranzova-jemna: #FEF1E6;
  --modra: #0F2D4A;
  --modra-2: #1B4269;
  --biela: #FFFFFF;

  /* Písmo a rozmery – prepisuje každý smer */
  --font-ui: system-ui, sans-serif;
  --font-titul: var(--font-ui);
  --font-text: var(--font-ui);
  --sirka: 1280px;
  --okraj: 24px;
  --medzera: 32px;
  --radius: 0px;
  --logo-v: 40px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 72px; }
body {
  margin: 0;
  background: var(--biela);
  color: var(--atrament);
  font: 400 16px/1.5 var(--font-ui);
  font-kerning: normal;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, p, figure { margin: 0; }
button, input { font: inherit; color: inherit; }
button { cursor: pointer; }
.ico { width: 1.15em; height: 1.15em; flex: none; vertical-align: -.2em; }
.znak { width: 1.05em; height: 1.05em; flex: none; }
:focus-visible { outline: 2px solid var(--oranzova); outline-offset: 3px; border-radius: 2px; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 12px; top: -60px; z-index: 100; padding: 10px 14px; background: var(--atrament); color: #fff; font-weight: 700; }
.skip:focus { top: 12px; }
.wrap { width: 100%; max-width: var(--sirka); margin-inline: auto; padding-inline: var(--okraj); }

/* ---------- Horná lišta ---------- */

.horna { border-bottom: 1px solid var(--linka); font-size: 13px; color: var(--tlmena); }
.horna__in { display: flex; align-items: center; gap: 20px; min-height: 36px; }
.horna__pocasie { display: inline-flex; align-items: center; gap: 6px; padding-left: 20px; border-left: 1px solid var(--linka); }
.horna__pocasie .ico { width: 20px; height: 20px; color: var(--tlmena); }
.horna__odkazy { display: flex; gap: 18px; margin-left: auto; }
.horna__odkazy a:hover, .horna__pocasie:hover { color: var(--atrament); }
.horna__soc { display: flex; gap: 12px; padding-left: 20px; border-left: 1px solid var(--linka); }
.horna__soc .ico { width: 17px; height: 17px; }
.horna__soc a { color: var(--text-2); }
.horna__soc a:hover { color: var(--oranzova-text); }

/* ---------- Hlavička ---------- */

.hlavicka { position: relative; z-index: 40; background: var(--biela); }
.hlavicka__in { display: flex; align-items: center; gap: 28px; padding-block: 20px; }
.logo { flex: none; line-height: 0; }
.logo img { width: auto; height: var(--logo-v); }
.hladaj { position: relative; display: flex; flex: 0 1 440px; margin-left: auto; }
.hladaj input {
  width: 100%; height: 46px; padding: 0 48px 0 16px;
  border: 1px solid #CDD1D6; border-radius: var(--radius); background: var(--biela);
  font-size: 15px;
}
.hladaj input::placeholder { color: #80878F; }
.hladaj input:focus { outline: none; border-color: var(--atrament); box-shadow: 0 0 0 3px rgb(246 132 31 / .25); }
.hladaj button { position: absolute; right: 0; top: 0; display: grid; place-items: center; width: 46px; height: 46px; border: 0; background: none; }
.hladaj button .ico { width: 21px; height: 21px; }
.hl-btn { display: none; place-items: center; width: 44px; height: 44px; border: 0; background: none; }
.hl-btn .ico { width: 24px; height: 24px; }

/* ---------- Navigácia ---------- */

.nav { border-block: 1px solid var(--linka); }
.nav__in { display: flex; align-items: stretch; gap: 8px; }
.nav__zoznam { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; }
.nav__zoznam::-webkit-scrollbar { display: none; }
.nav__zoznam a {
  position: relative; display: flex; align-items: center; gap: 7px;
  height: 52px; padding: 0 12px;
  font-weight: 600; font-size: 16px; white-space: nowrap;
}
.nav__zoznam a::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: -1px; height: 3px; background: var(--oranzova); transform: scaleX(0); transition: transform .2s ease-out; }
.nav__zoznam a:hover::after, .nav__zoznam a[aria-current]::after { transform: none; }
.nav__zoznam li:first-child a { padding-left: 0; }
.nav__zoznam li:first-child a::after { left: 0; }
.nav__vsetky { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; padding: 0 0 0 16px; border: 0; border-left: 1px solid var(--linka); background: none; font-weight: 600; font-size: 15px; white-space: nowrap; }
.ico--sipka { width: 16px; height: 16px; transition: transform .2s; }
[data-otvorene="mega"] .nav__vsetky .ico--sipka { transform: rotate(180deg); }

/* ---------- Mega menu (všetky rubriky v hierarchii) ---------- */

.mega {
  position: absolute; left: 0; right: 0; top: 100%;
  display: none;
  background: var(--biela);
  border-bottom: 1px solid var(--linka);
  box-shadow: 0 24px 40px -24px rgb(18 18 16 / .25);
}
[data-otvorene="mega"] .mega { display: block; }
.mega__in { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 32px; padding-block: 28px 36px; }
.mega__hlavicka { display: none; }
.mega__nazov { margin-bottom: 12px; padding-bottom: 8px; border-bottom: 2px solid var(--atrament); font-size: 13px; font-weight: 700; color: var(--tlmena); letter-spacing: .02em; }
.mega__skupina > ul > li { padding: 5px 0; }
.mega__rubrika { font-weight: 700; font-size: 16px; }
.mega__rubrika:hover, .mega__pod a:hover { color: var(--oranzova-text); }
.mega__pod { margin-top: 3px; padding-left: 12px; border-left: 2px solid var(--linka); }
.mega__pod a { display: block; padding: 2px 0; font-size: 14px; color: var(--text-2); }
.mega__pozn { display: block; font-size: 13px; color: var(--tlmena); }

/* ---------- Spoločné bloky ---------- */

.blok-hlavicka { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 12px; margin-bottom: 12px; }
.blok-hlavicka__nazov { white-space: nowrap; display: flex; align-items: center; gap: 8px; font-family: var(--font-titul); font-size: 21px; font-weight: 700; line-height: 1.2; }
.blok-hlavicka__pozn { font-size: 13px; color: var(--tlmena); text-align: right; white-space: nowrap; }
.blok-viac { display: inline-block; margin-top: 12px; font-size: 14px; font-weight: 600; color: var(--oranzova-text); }
.blok-viac:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Karta článku */
.karta { display: grid; gap: 10px; align-content: start; }
.karta__foto { display: block; align-self: start; overflow: hidden; border-radius: var(--radius); background: var(--hmla); }
.karta__foto img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; transition: transform .4s ease-out; }
.karta:hover .karta__foto img { transform: scale(1.03); }
.karta__text { display: grid; gap: 6px; align-content: start; }
.karta__rubrika { justify-self: start; font-size: 13px; font-weight: 700; color: var(--oranzova-text); }
.karta__rubrika:hover { text-decoration: underline; }
.karta__titul { font-family: var(--font-titul); font-size: 19px; font-weight: 700; line-height: 1.22; text-wrap: balance; }
.karta__titul a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.karta__perex { color: var(--text-2); font-size: 15px; line-height: 1.5; }
.karta__meta { display: flex; align-items: center; gap: 12px; font-size: 13px; color: var(--tlmena); font-variant-numeric: tabular-nums; }
.karta--lead .karta__titul { font-size: clamp(28px, 3.4vw, 44px); line-height: 1.08; letter-spacing: -.02em; }
.karta--lead .karta__perex { font-size: 18px; }
.karta--velka .karta__titul { font-size: 24px; line-height: 1.15; letter-spacing: -.01em; }
.karta--vodorovna { grid-template-columns: 132px minmax(0, 1fr); gap: 14px; }
.karta--vodorovna .karta__titul { font-size: 17px; }
.karta--vodorovna .karta__perex { display: none; }
.karta--titul .karta__titul { font-size: 16px; }
.karta--text .karta__titul { font-size: 19px; }

/* Najnovšie */
.najnovsie__zoznam li { display: grid; grid-template-columns: 50px minmax(0, 1fr); gap: 10px; padding: 11px 0; border-top: 1px solid var(--linka); }
.najnovsie__zoznam time { font-weight: 700; font-size: 14px; color: var(--oranzova-text); font-variant-numeric: tabular-nums; line-height: 1.45; }
.najnovsie__zoznam a { font-size: 15px; font-weight: 500; line-height: 1.4; }
.najnovsie__zoznam a:hover { text-decoration: underline; text-underline-offset: 3px; }
.najnovsie__rubrika { display: block; margin-top: 2px; font-size: 12px; color: var(--tlmena); }

/* Najčítanejšie so záložkami */
.zalozky { display: flex; gap: 4px; }
.zalozky button {
  height: 32px; padding: 0 12px; border: 0; border-radius: var(--radius);
  background: transparent; color: var(--tlmena); font-size: 14px; font-weight: 600;
  box-shadow: inset 0 -2px 0 var(--linka);
}
.zalozky button[aria-selected="true"] { color: var(--atrament); box-shadow: inset 0 -3px 0 var(--oranzova); }
.najcitanejsie__zoznam { counter-reset: n; }
.najcitanejsie__zoznam li { counter-increment: n; display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: baseline; padding: 11px 0; border-top: 1px solid var(--linka); }
.najcitanejsie__zoznam li::before { content: counter(n); font-family: var(--font-titul); font-size: 24px; font-weight: 700; line-height: 1; color: var(--oranzova); font-variant-numeric: tabular-nums; }
.najcitanejsie__zoznam a { font-size: 15px; font-weight: 600; line-height: 1.38; }
.najcitanejsie__zoznam a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Informačný servis (rubrika Tlačové správy) */
.infoservis__zoznam li { padding: 10px 0; border-top: 1px solid var(--linka); }
.infoservis__zoznam a { font-size: 15px; font-weight: 500; line-height: 1.4; }
.infoservis__zoznam a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Reklamné odkazy */
.odkazy { padding: 16px 18px 6px; background: var(--hmla); border-radius: var(--radius); }
.odkazy__nazov { margin-bottom: 4px; font-size: 13px; font-weight: 700; color: var(--tlmena); }
.odkazy li a { display: grid; gap: 1px; padding: 10px 0; border-top: 1px solid #DDE0E4; font-size: 14px; line-height: 1.4; }
.odkazy li:first-child a { border-top: 0; }
.odkazy b { font-weight: 700; }
.odkazy span { color: var(--text-2); }
.odkazy a:hover b { text-decoration: underline; }
.odkazy--tok { display: none; }

/* Počasie, kurzy, horoskop */
.autodoc { margin-bottom: 24px; text-align: center; font-size: 14px; }
.autodoc a { display: inline-block; padding: 10px; text-decoration: underline; }
.pocasie__mesta { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.pocasie__mesta li { display: grid; grid-template-columns: 26px 1fr auto; align-items: center; gap: 6px; padding: 8px 0; border-top: 1px solid var(--linka); font-size: 14px; }
.pocasie__ico { width: 24px; height: 24px; color: var(--tlmena); }
.pocasie__mesta b { font-variant-numeric: tabular-nums; }
.pocasie__zdroj { margin-top: 6px; font-size: 12px; color: var(--tlmena); }
.kurzy table { width: 100%; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
.kurzy th { display: flex; align-items: center; gap: 8px; padding: 8px 0; font-weight: 600; text-align: left; }
.kurzy td { padding: 8px 0; text-align: right; }
.kurzy tr + tr > * { border-top: 1px solid var(--linka); }
.kurzy td:last-child { width: 22px; }
.vlajka { width: 21px; height: 14px; border-radius: 2px; box-shadow: 0 0 0 1px rgb(0 0 0 / .1); }
.smer { width: 9px; height: 9px; }
.horoskop__znamenia { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px 4px; }
.horoskop__znamenia a { display: grid; justify-items: center; gap: 3px; font-size: 11px; color: var(--text-2); }
.znamenie { width: 40px; height: 40px; color: var(--atrament); transition: color .15s; }
.horoskop__znamenia a:hover .znamenie { color: var(--oranzova-text); --zb: var(--oranzova-jemna); }

/* Reklamné plochy (zástupné) */
.ad {
  display: grid; place-items: center;
  background: repeating-linear-gradient(-45deg, #F6F7F8 0 8px, #EFF1F3 8px 16px);
  font: 12px/1.3 var(--font-ui); color: #7B828A; text-align: center;
}
.ad b { font-weight: 700; }
.ad--billboard { width: min(970px, 100%); height: 250px; margin: 40px auto; }
.ad--feed { height: 250px; margin-block: 8px; }
.ad--rail { height: 600px; position: sticky; top: 24px; }
.ad--rail:not(:last-child) { position: static; }
.ad--clanok { height: 280px; margin-block: 28px; }
.ad--karta { min-height: 250px; }
.ad--pod-clankom { min-height: 120px; margin-block: 28px; }
.ad--zive { display: block; background: none; }

/* Informačné stránky (kontakt, inzercia, cookies) */
.info { max-width: 760px; margin: 40px auto 64px; font: 17px/1.6 var(--font-text, inherit); }
.info h1 { font-size: 28px; line-height: 1.25; margin-bottom: 20px; }
.info h2 { font-size: 20px; margin: 28px 0 10px; }
.info p, .info ul { margin-bottom: 14px; }
.info ul { padding-left: 20px; list-style: disc; }
.info dl { display: grid; grid-template-columns: max-content 1fr; gap: 8px 20px; margin-bottom: 20px; }
.info dt { font-weight: 700; }
.info dd { margin: 0; }
.info a { color: var(--modra, #134D78); text-decoration: underline; }
@media (max-width: 767px) { .info dl { grid-template-columns: 1fr; gap: 2px; } .info dd { margin-bottom: 8px; } }

/* Pás rubriky: hlavička */
.pas-hlavicka { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 18px; margin-bottom: 18px; padding-top: 14px; border-top: 2px solid var(--atrament); }
.pas-hlavicka__nazov { font-family: var(--font-titul); font-size: 26px; font-weight: 700; line-height: 1.1; letter-spacing: -.01em; }
.pas-hlavicka__nazov a:hover { color: var(--oranzova-text); }
.pas-hlavicka__pod { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 14px; color: var(--tlmena); }
.pas-hlavicka__pod a:hover { color: var(--atrament); text-decoration: underline; }
.pas-hlavicka__viac { margin-left: auto; font-size: 14px; font-weight: 600; color: var(--oranzova-text); }
.pas-hlavicka__viac:hover { text-decoration: underline; }

/* ---------- Článok ---------- */

.clanok-mriezka, .rubrika-mriezka { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 56px; align-items: start; padding-block: 28px 64px; }
.lista-pravy { display: grid; gap: 36px; align-content: start; }
.omrvinky ol { display: flex; flex-wrap: wrap; gap: 6px; font-size: 14px; color: var(--tlmena); }
.omrvinky li + li::before { content: "/"; margin-right: 6px; color: #B5BAC0; }
.omrvinky a:hover { color: var(--atrament); text-decoration: underline; }
.clanok { max-width: 760px; }
.clanok__hlavicka { display: grid; gap: 16px; margin-top: 16px; }
.clanok__nadpis { font-family: var(--font-titul); font-size: clamp(30px, 3.6vw, 46px); font-weight: 700; line-height: 1.08; letter-spacing: -.02em; text-wrap: balance; }
.clanok__perex { font-family: var(--font-text); font-size: 20px; font-weight: 500; line-height: 1.45; color: var(--text-2); }
.clanok__meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; padding-block: 14px; border-block: 1px solid var(--linka); }
.clanok__kedy { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 14px; color: var(--tlmena); }
.clanok__kedy time { color: var(--atrament); font-weight: 600; }
.zdielat { display: flex; align-items: center; gap: 6px; }
.zdielat a { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 38px; height: 38px; padding: 0 10px; border: 1px solid var(--linka); border-radius: var(--radius); font-size: 14px; font-weight: 600; }
.zdielat a:hover { border-color: var(--atrament); }
.stav-kopirovania { font-size: 14px; }
.zdielat .zdielat__fb { background: #1877F2; border-color: #1877F2; color: #fff; }
.clanok__foto { margin-top: 24px; }
.clanok__foto img { width: 100%; border-radius: var(--radius); }
.clanok__foto figcaption { margin-top: 8px; font-size: 13px; color: var(--tlmena); }
.clanok__telo { margin-top: 28px; font-family: var(--font-text); font-size: 19px; line-height: 1.65; }
.clanok__telo > * + :is(p, div, aside, figure, ul, ol, blockquote) { margin-top: .8em; }
.clanok__telo h2 { margin-top: 1.7em; font-family: var(--font-titul); font-size: 26px; line-height: 1.2; letter-spacing: -.01em; }
.clanok__telo > * + h3 { margin-top: 1.2em; }
.clanok__telo > :is(h2, h3) + :is(p, div, ul, ol, blockquote) { margin-top: .35em; }
.clanok__telo a { color: var(--atrament); text-decoration: underline; text-decoration-color: var(--oranzova); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.clanok__telo a:hover { color: var(--oranzova-text); }
.clanok__zdroj { font-family: var(--font-ui); font-size: 14px; color: var(--tlmena); }
.clanok__zdroj a { text-decoration-thickness: 1px; }
.tiez-vlozene { display: grid; gap: 4px; padding: 14px 18px; border-left: 3px solid var(--oranzova); background: var(--hmla); font-family: var(--font-ui); }
.tiez-vlozene span { font-size: 13px; font-weight: 700; color: var(--tlmena); }
.tiez-vlozene a { font-size: 17px; font-weight: 700; line-height: 1.3; text-decoration: none !important; }
.tiez-vlozene a:hover { text-decoration: underline !important; }
/* Fotogaléria článku */
.clanok__foto-ram { position: relative; }
.clanok__galeria { position: absolute; left: 12px; bottom: 12px; display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 14px; border: 0; border-radius: var(--radius); background: rgb(18 18 16 / .82); color: #fff; font: 600 14px/1 var(--font-ui); cursor: pointer; backdrop-filter: blur(4px); }
.clanok__galeria:hover { background: var(--atrament); }
.clanok__galeria .ico { width: 18px; height: 18px; color: var(--oranzova); }
.galeria { margin-top: 40px; font-family: var(--font-ui); }
.galeria__hlavicka { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 14px; padding-top: 14px; border-top: 2px solid var(--atrament); }
.galeria__nazov { display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-titul); font-size: 24px; }
.galeria__nazov .ico { width: 22px; height: 22px; color: var(--oranzova); }
.galeria__pocet { font-size: 14px; color: var(--tlmena); }
.galeria__mriezka { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.galeria__mriezka li:first-child { grid-column: span 2; grid-row: span 2; }
.galeria__dlazdica { position: relative; display: block; width: 100%; height: 100%; padding: 0; border: 0; background: var(--hmla); cursor: zoom-in; overflow: hidden; }
.galeria__dlazdica img { width: 100%; height: 100%; aspect-ratio: 3 / 2; object-fit: cover; transition: transform .3s ease-out; }
.galeria__dlazdica:hover img { transform: scale(1.04); }
.galeria__viac { position: absolute; inset: 0; display: grid; place-items: center; background: rgb(18 18 16 / .6); color: #fff; font-size: 28px; font-weight: 700; }
.prehliadac { width: 100vw; max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; background: #0B0B0A; color: #fff; font-family: var(--font-ui); }
.prehliadac[open] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; }
.prehliadac::backdrop { background: #0B0B0A; }
.bez-posunu { overflow: hidden; }
.prehliadac__lista { display: flex; align-items: center; justify-content: space-between; padding: 10px 12px 10px 20px; }
.prehliadac__pocitadlo { font-size: 15px; color: #A9AEB4; font-variant-numeric: tabular-nums; }
.prehliadac__pocitadlo b { color: #fff; }
.prehliadac__zavriet, .prehliadac__sipka { display: grid; place-items: center; width: 48px; height: 48px; padding: 0; border: 0; border-radius: 50%; background: rgb(255 255 255 / .08); color: #fff; cursor: pointer; }
.prehliadac__zavriet:hover, .prehliadac__sipka:hover { background: rgb(255 255 255 / .18); }
.prehliadac__zavriet .ico, .prehliadac__sipka .ico { width: 24px; height: 24px; }
.prehliadac__scena { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; min-height: 0; padding: 0 84px; }
.prehliadac__scena img { width: auto; max-width: 100%; height: auto; max-height: calc(100dvh - 250px); object-fit: contain; touch-action: pan-y; user-select: none; }
.prehliadac__popis { max-width: 760px; font-size: 15px; line-height: 1.5; color: #E6E8EB; text-align: center; }
.prehliadac__zdroj { color: #A9AEB4; }
.prehliadac__sipka { position: absolute; top: 50%; transform: translateY(-50%); width: 56px; height: 56px; }
.prehliadac__sipka--pred { left: 16px; }
.prehliadac__sipka--dalej { right: 16px; }
.prehliadac__nahlady { display: flex; gap: 6px; justify-content: safe center; padding: 14px 20px 18px; overflow-x: auto; scrollbar-width: none; }
.prehliadac__nahlady button { display: block; padding: 0; border: 2px solid transparent; background: none; opacity: .55; cursor: pointer; }
.prehliadac__nahlady button:hover { opacity: .85; }
.prehliadac__nahlady button[aria-current] { border-color: var(--oranzova); opacity: 1; }
.prehliadac__nahlady img { width: 72px; height: 48px; object-fit: cover; }
.clanok__paticka {display: grid; gap: 20px; margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--linka); }
.stitky { display: grid; grid-template-columns: 160px 1fr; gap: 8px 16px; align-items: baseline; }
.stitky__nazov { font-size: 14px; font-weight: 700; color: var(--tlmena); }
.stitky ul { display: flex; flex-wrap: wrap; gap: 8px; }
.stitky a { display: inline-block; padding: 5px 12px; border: 1px solid var(--linka); border-radius: 999px; font-size: 14px; font-weight: 500; }
.stitky a:hover { border-color: var(--atrament); }
.stitky--osoby a { border-style: dashed; }
.dalsie { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 8px; }
.dalsie a { display: grid; gap: 6px; align-content: start; padding: 16px 18px; border: 1px solid var(--linka); border-radius: var(--radius); font-family: var(--font-titul); font-size: 17px; font-weight: 700; line-height: 1.3; }
.dalsie a:hover { border-color: var(--atrament); }
.dalsie span { display: inline-flex; align-items: center; gap: 4px; font-family: var(--font-ui); font-size: 13px; font-weight: 600; color: var(--tlmena); }
.dalsie__nasl { text-align: right; }
.dalsie__nasl span { justify-content: flex-end; }
.suvisiace, .tiez { margin-top: 48px; }
.suvisiace h3, .tiez h3 { margin-bottom: 16px; padding-top: 14px; border-top: 2px solid var(--atrament); font-family: var(--font-titul); font-size: 24px; }
.suvisiace__mriezka { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 24px; }
.suvisiace .karta__titul { font-size: 17px; }
.tl { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 0 16px; border-radius: var(--radius); font-size: 15px; font-weight: 600; }
.tl--obrys { border: 1px solid #C9CDD2; background: var(--biela); }
.tl--obrys:hover { border-color: var(--atrament); }
.tl--plne { background: var(--atrament); color: #fff; }
.tl--plne:hover { background: #2D2E30; }
.tiez li { padding: 10px 0; border-bottom: 1px solid var(--linka); font-weight: 600; }
.tiez a:hover { text-decoration: underline; }

/* ---------- Rubrika ---------- */

.rubrika__hlavicka { display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: end; margin: 14px 0 28px; padding-bottom: 20px; border-bottom: 2px solid var(--atrament); }
.rubrika__nadpis { font-family: var(--font-titul); font-size: clamp(36px, 4.4vw, 60px); font-weight: 700; line-height: 1; letter-spacing: -.025em; }
.rubrika__den { display: block; margin-top: 10px; font-family: var(--font-ui); font-size: 16px; font-weight: 400; letter-spacing: 0; color: var(--tlmena); }
.dni { display: flex; align-items: center; gap: 12px; font-size: 14px; font-weight: 600; }
.dni a, .dni span { display: inline-flex; align-items: center; gap: 4px; }
.dni span[aria-disabled] { color: #A9AFB6; }
.dni input { height: 38px; padding: 0 10px; border: 1px solid var(--linka); border-radius: var(--radius); }
.podrubriky { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; }
.podrubriky a { display: inline-block; padding: 6px 14px; border: 1px solid var(--linka); border-radius: 999px; font-size: 14px; font-weight: 600; }
.podrubriky a[aria-current] { background: var(--atrament); border-color: var(--atrament); color: #fff; }
.rubrika__zoznam { display: grid; gap: 24px; }
.rubrika__zoznam .karta--vodorovna { grid-template-columns: 220px minmax(0, 1fr); padding-top: 24px; border-top: 1px solid var(--linka); }
.rubrika__zoznam .karta--vodorovna .karta__perex { display: block; }
.rubrika__zoznam .karta--vodorovna .karta__titul { font-size: 21px; }
.strankovanie { margin-top: 32px; }

/* ---------- Pätička ---------- */

.paticka { margin-top: 64px; background: var(--modra); color: #C5D0DB; font-size: 15px; border-top: 4px solid var(--oranzova); }
.paticka__in { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; padding-block: 48px 40px; }
.paticka__logo img { width: auto; height: 34px; }
.paticka__o p { max-width: 34ch; margin-top: 16px; line-height: 1.55; }
.paticka__soc { display: flex; gap: 16px; }
.paticka__soc .ico { width: 20px; height: 20px; color: #fff; }
.paticka__nazov { margin-bottom: 12px; font-family: var(--font-ui); font-size: 13px; font-weight: 700; color: #fff; letter-spacing: .02em; }
.paticka__stlpec ul { display: grid; gap: 8px; }
.paticka a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.paticka__spodok { display: flex; flex-wrap: wrap; gap: 8px 32px; padding-block: 18px 88px; border-top: 1px solid rgb(255 255 255 / .12); font-size: 13px; color: #9FB0C1; }
.paticka__pravne { display: flex; gap: 20px; }
.paticka__spodok p:last-child { margin-left: auto; }

/* ==========================================================
   Responzivita
   ========================================================== */

@media (max-width: 1279px) {
  :root { --okraj: 20px; }
  .clanok-mriezka, .rubrika-mriezka { grid-template-columns: minmax(0, 1fr) 300px; gap: 40px; }
  .mega__in { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1023px) {
  .horna__odkazy, .horna__meniny { display: none; }
  .horna__soc { margin-left: auto; }
  .hlavicka__in { gap: 12px; padding-block: 12px; }
  .hl-btn--menu { display: grid; margin-left: -10px; }
  .nav__vsetky { display: none; }
  /* Mega menu ako celá obrazovka */
  .mega { position: fixed; inset: 0; z-index: 80; overflow-y: auto; box-shadow: none; border: 0; }
  .mega__in { grid-template-columns: 1fr 1fr; gap: 28px 24px; padding-block: 0 48px; }
  .mega__hlavicka { grid-column: 1 / -1; position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; margin-inline: calc(var(--okraj) * -1); padding: 8px 10px 8px var(--okraj); background: var(--biela); border-bottom: 1px solid var(--linka); font-weight: 700; }
  .mega__hlavicka .hl-btn { display: grid; }
  [data-otvorene="mega"] { overflow: hidden; }
  .clanok-mriezka, .rubrika-mriezka { grid-template-columns: minmax(0, 1fr); }
  .clanok { max-width: none; }
  .lista-pravy { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
  .lista-pravy .ad--rail { display: none; }
  .odkazy--tok { display: block; }
  .rubrika-mriezka .lista-pravy .odkazy { display: none; }
  .paticka__in { grid-template-columns: 1fr 1fr; }
  .paticka__o { grid-column: 1 / -1; }
}

@media (max-width: 767px) {
  :root { --okraj: 16px; --logo-v: 30px; }
  .galeria__mriezka li:first-child { grid-column: 1 / -1; grid-row: auto; }
  .galeria__viac { font-size: 20px; }
  .prehliadac__scena { padding: 0 12px; }
  .prehliadac__sipka { top: auto; bottom: 84px; transform: none; width: 44px; height: 44px; }
  .prehliadac__sipka--pred { left: 12px; }
  .prehliadac__sipka--dalej { right: 12px; }
  .prehliadac__popis { padding-inline: 52px; font-size: 14px; }
  .prehliadac__nahlady img { width: 56px; height: 38px; }
  body { font-size: 16px; }
  .horna__pocasie { padding-left: 0; border: 0; }
  .horna__den { display: none; }
  .hladaj { display: none; }
  .hl-btn--hladaj { display: grid; margin-left: auto; }
  [data-otvorene="hladaj"] .hladaj { display: flex; position: absolute; left: 0; right: 0; top: 100%; z-index: 50; padding: 12px var(--okraj); background: var(--biela); border-bottom: 1px solid var(--linka); box-shadow: 0 12px 24px -12px rgb(0 0 0 / .2); }
  .nav__zoznam a { height: 46px; font-size: 15px; padding: 0 10px; }
  .mega__in { grid-template-columns: 1fr; }
  .karta--vodorovna { grid-template-columns: 104px minmax(0, 1fr); }
  .karta--velka .karta__titul { font-size: 22px; }
  .lista-pravy { grid-template-columns: minmax(0, 1fr); }
  .clanok__perex { font-size: 18px; }
  .clanok__telo { font-size: 18px; }
  .stitky { grid-template-columns: 1fr; }
  .dalsie { grid-template-columns: 1fr; }
  .dalsie__nasl { text-align: left; }
  .dalsie__nasl span { justify-content: flex-start; }
  .suvisiace__mriezka { grid-template-columns: 1fr 1fr; gap: 20px 14px; }
  .suvisiace .karta__titul { font-size: 15px; }
  .rubrika__hlavicka { grid-template-columns: 1fr; }
  .rubrika__zoznam .karta--vodorovna { grid-template-columns: 112px minmax(0, 1fr); }
  .rubrika__zoznam .karta--vodorovna .karta__titul { font-size: 17px; }
  .rubrika__zoznam .karta--vodorovna .karta__perex { display: none; }
  .zdielat__fb span { display: none; }
  .ad--billboard { height: 250px; width: 300px; }
  .paticka__in { grid-template-columns: 1fr 1fr; gap: 28px; }
  .paticka__spodok p:last-child { margin-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

@media print {
  .horna, .nav, .mega, .lista-pravy, .ad, .zdielat, .galeria, .clanok__galeria, .prehliadac, .suvisiace, .tiez, .paticka, .odkazy { display: none !important; }
  .clanok-mriezka { display: block; }
}

/* ==========================================================
   Podpisové prvky v2.1: témy dňa, ciferník dňa, voľby, štítky
   ========================================================== */

/* Témy dňa pod navigáciou */
.temy { border-bottom: 1px solid var(--linka); }
.temy__in { display: flex; align-items: center; gap: 16px; min-height: 44px; }
.temy__nazov { flex: none; font-size: 13px; font-weight: 700; color: var(--oranzova-text); }
.temy ul { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.temy ul::-webkit-scrollbar { display: none; }
.temy a { display: inline-block; padding: 4px 12px; border-radius: 999px; background: var(--hmla); font-size: 14px; font-weight: 600; white-space: nowrap; }
.temy a:hover { background: #E7E9EC; }
.temy .temy__hlavna { background: var(--oranzova); color: var(--atrament); }
.temy .temy__hlavna:hover { background: #F89A45; }

/* Ciferník dňa */
.cifernik { margin: 4px 0 14px; }
.cifernik svg { display: block; width: 100%; max-width: 168px; height: auto; margin-inline: auto; overflow: visible; }
.cifernik__kruh { fill: none; stroke: var(--linka); stroke-width: 5; }
.cifernik__den { fill: none; stroke: var(--oranzova-jemna); stroke-width: 9; }
.cifernik__ryska { stroke: #C3C8CE; stroke-width: 1; }
.cifernik__ryska--hl { stroke: var(--atrament); stroke-width: 1.6; }
.cifernik__sprava { stroke: var(--oranzova); stroke-width: 1.6; stroke-linecap: round; opacity: .7; }
.cifernik__hodina { font: 600 8px/1 var(--font-ui); text-anchor: middle; fill: var(--tlmena); }
.cifernik__teraz { fill: var(--atrament); stroke: #fff; stroke-width: 2; }
.cifernik__pocet { font: 700 26px/1 var(--font-titul); text-anchor: middle; fill: var(--atrament); }
.cifernik__popis { font: 500 9px/1 var(--font-ui); text-anchor: middle; fill: var(--tlmena); }

/* Štítky Video / Foto / Rozhovor na fotke */
.karta__foto { position: relative; }
.znacky { position: absolute; left: 10px; bottom: 10px; display: flex; gap: 4px; }
.znacka { display: inline-flex; align-items: center; gap: 5px; padding: 3px 8px 3px 6px; border-radius: 3px; background: rgb(18 18 16 / .82); color: #fff; font: 600 12px/1.4 var(--font-ui); backdrop-filter: blur(4px); }
.znacka .ico { width: 14px; height: 14px; }
.znacka--video { background: var(--oranzova); color: var(--atrament); }
.znacka--video .ico circle { fill: var(--atrament); }
.karta--vodorovna .znacky, .karta--stred .znacky { left: 6px; bottom: 6px; }
.karta--vodorovna .znacka { padding: 2px 5px; font-size: 0; gap: 0; }
.karta--vodorovna .znacka .ico { width: 13px; height: 13px; }

/* Voľby 2026: redakčný blok v oranžovej z loga */
.volby { padding: 28px 28px 30px; background: var(--oranzova); color: var(--atrament); border-radius: var(--radius); }
.volby__hlavicka { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 20px; align-items: center; margin-bottom: 24px; }
.volby__odpocet { display: grid; justify-items: center; width: 84px; padding: 8px 0 9px; background: var(--atrament); color: #fff; border-radius: var(--radius); line-height: 1; }
.volby__odpocet b { font: 700 40px/1 var(--font-titul); }
.volby__odpocet span { margin-top: 4px; font-size: 11px; font-weight: 600; color: #FFC796; }
.volby__nazov { font-family: var(--font-titul); font-size: clamp(24px, 2.4vw, 32px); font-weight: 700; line-height: 1.05; letter-spacing: -.02em; }
.volby__nazov a:hover { text-decoration: underline; text-decoration-thickness: 2px; }
.volby__den { margin-top: 6px; font-size: 15px; font-weight: 500; }
.volby__viac { align-self: start; padding: 9px 14px; border: 2px solid var(--atrament); border-radius: var(--radius); font-size: 14px; font-weight: 700; white-space: nowrap; }
.volby__viac:hover { background: var(--atrament); color: #fff; }
.volby__obsah { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.1fr); gap: 22px; }
.volby .karta__foto { background: rgb(0 0 0 / .1); }
.volby .karta__titul { font-size: 18px; }
.volby .karta__meta { color: rgb(18 18 16 / .7); }
.volby__kratke { display: grid; align-content: start; }
.volby__kratke li { padding: 10px 0; border-top: 1px solid rgb(18 18 16 / .22); font-weight: 600; font-size: 15px; line-height: 1.35; }
.volby__kratke li:first-child { padding-top: 0; border-top: 0; }
.volby__kratke a:hover { text-decoration: underline; }

@media (max-width: 1023px) {
  .volby__obsah { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .volby__kratke { grid-column: 1 / -1; }
  .volby__kratke li:first-child { padding-top: 10px; border-top: 1px solid rgb(18 18 16 / .22); }
}
@media (max-width: 767px) {
  .temy__nazov { display: none; }
  .volby { padding: 20px 16px 22px; margin-inline: calc(var(--okraj) * -1); border-radius: 0; }
  .volby__hlavicka { grid-template-columns: auto minmax(0, 1fr); gap: 14px; }
  .volby__odpocet { width: 66px; }
  .volby__odpocet b { font-size: 30px; }
  .volby__viac { grid-column: 1 / -1; justify-self: start; }
  .volby__den { font-size: 14px; }
  .volby__obsah { grid-template-columns: 1fr; gap: 0; }
  .volby .karta--stred { grid-template-columns: 104px minmax(0, 1fr); gap: 12px; padding: 12px 0; border-top: 1px solid rgb(18 18 16 / .22); }
  .volby .karta--stred:first-child { border-top: 0; padding-top: 0; }
  .volby .karta__titul { font-size: 16px; }
}
.znacka-text { display: inline-block; padding: 0 5px; border-radius: 3px; background: var(--hmla); font-size: 11px; font-weight: 700; color: var(--text-2); vertical-align: 1px; }
@media (max-width: 767px) {
  .cifernik svg { max-width: 128px; }
}

/* Karta bez fotky má celú šírku; v rubrike idú textové správy po 2 na riadok */
.karta.bez-foto { grid-template-columns: minmax(0, 1fr); }
.rubrika__text-mriezka { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; margin-top: 32px; border-top: 2px solid var(--atrament); }
.rubrika__text-mriezka .karta { padding: 18px 0; border-bottom: 1px solid var(--linka); }
.rubrika__text-mriezka .karta__titul { font-size: 18px; }
.rubrika__text-mriezka .karta__perex { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; font-size: 15px; }
@media (max-width: 767px) {
  .rubrika__text-mriezka { grid-template-columns: 1fr; }
}

/* ---------- TV program ---------- */

.tv { min-width: 0; padding-block: 28px 32px; }
.tv__hlavicka { margin-bottom: 24px; }
.tv__hlavicka > * { min-width: 0; }
.tv-dni ol { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; }
.tv-dni a { display: grid; justify-items: center; min-width: 58px; padding: 7px 8px 8px; border: 1px solid var(--linka); border-radius: var(--radius); font-size: 12px; line-height: 1.25; color: var(--tlmena); }
.tv-dni b { white-space: nowrap; font-size: 15px; color: var(--atrament); font-variant-numeric: tabular-nums; }
.tv-dni a:hover { border-color: var(--atrament); }
.tv-dni a[aria-current] { background: var(--atrament); border-color: var(--atrament); color: #C9CCD1; }
.tv-dni a[aria-current] b { color: #fff; }

.tv-bod { width: 10px; height: 10px; border-radius: 50%; background: var(--oranzova); box-shadow: 0 0 0 4px var(--oranzova-jemna); }
.tv-kanal { font-size: 13px; font-weight: 700; color: var(--oranzova-text); }
.tv-teraz__zoznam { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(200px, 1fr); gap: 0; overflow-x: auto; scroll-snap-type: x mandatory; border-block: 1px solid var(--linka); scrollbar-width: thin; }
.tv-teraz__zoznam li { position: relative; scroll-snap-align: start; border-left: 1px solid var(--linka); }
.tv-teraz__zoznam li:first-child { border-left: 0; }
.tv-teraz__karta { display: grid; gap: 4px; align-content: start; width: 100%; height: 100%; padding: 14px 16px 16px; border: 0; background: none; text-align: left; }
.tv-teraz__karta:hover { background: var(--hmla); }
.tv-teraz__titul { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.5em; font-family: var(--font-titul); font-size: 17px; line-height: 1.25; }
.tv-teraz__cas { font-size: 13px; color: var(--tlmena); font-variant-numeric: tabular-nums; }
.tv-priebeh { display: block; height: 3px; margin-block: 4px 2px; border-radius: 2px; background: linear-gradient(90deg, var(--oranzova) var(--p), var(--linka) var(--p)); }
.tv-teraz__potom { overflow: hidden; font-size: 13px; color: var(--text-2); white-space: nowrap; text-overflow: ellipsis; }
.tv-teraz__potom span { color: var(--tlmena); }

.tv-program { margin-top: 36px; }
.tv-lista { position: sticky; top: 0; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; padding-block: 12px; background: var(--biela); border-top: 2px solid var(--atrament); }
.tv-pohlad button { height: 36px; }
.tv-pohlad button[aria-pressed="true"] { color: var(--atrament); box-shadow: inset 0 -3px 0 var(--oranzova); }
.tv-casti { display: flex; gap: 2px; padding: 3px; background: var(--hmla); border-radius: calc(var(--radius) + 3px); }
.tv-casti button { height: 30px; padding: 0 10px; border: 0; border-radius: var(--radius); background: none; font-size: 14px; font-weight: 600; }
.tv-casti button span { font-weight: 400; color: var(--tlmena); font-variant-numeric: tabular-nums; }
.tv-casti button:hover { background: var(--biela); }
.tv-casti button:first-child { color: var(--oranzova-text); }
.tv-upravit { min-height: 36px; margin-left: auto; font-size: 14px; }
.tv-zanre { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 6px; }
.tv-zaner { display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px 4px 9px; border: 1px solid var(--linka); border-radius: 999px; background: var(--biela); font-size: 13px; font-weight: 600; }
.tv-zaner::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--z, #B5BAC0); }
.tv-zaner[aria-pressed="true"] { border-color: var(--atrament); background: var(--atrament); color: #fff; }
[data-zaner="film"] { --z: var(--oranzova); }
[data-zaner="seriál"] { --z: #1B4269; }
[data-zaner="šport"] { --z: #2F7D4F; }
[data-zaner="spravodajstvo"] { --z: #8A9099; }
[data-zaner="zábava"] { --z: #A3488A; }
[data-zaner="dokument"] { --z: #8C6D3F; }
[data-zaner="detský"] { --z: #2B8DB8; }

/* Časová os: 1 minúta = --min, stĺpec staníc je prilepený vľavo */
.tv-os { --min: 3.2px; --kanal: 116px; --riadok: 60px; position: relative; overflow-x: auto; border-block: 1px solid var(--linka); overscroll-behavior-x: contain; }
.tv-os__platno { position: relative; width: calc(var(--kanal) + 1440 * var(--min)); }
.tv-os__riadok--hodiny { height: 30px; border-top: 0; }
.tv-os__riadok--hodiny span:not(.tv-os__kanal) { position: absolute; left: calc(var(--m) * var(--min)); top: 0; height: 100%; padding: 7px 0 0 6px; border-left: 1px solid var(--linka); font-size: 12px; font-weight: 600; color: var(--tlmena); font-variant-numeric: tabular-nums; }
.tv-os__teraz { position: absolute; z-index: 3; top: 0; bottom: 0; left: calc(var(--kanal) + var(--teraz) * var(--min)); width: 2px; margin-left: -1px; background: var(--oranzova); pointer-events: none; }
.tv-os__teraz span { position: absolute; top: 4px; left: 50%; transform: translateX(-50%); padding: 2px 6px; border-radius: 3px; background: var(--oranzova); color: var(--atrament); font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; }
.tv-os__riadok { display: flex; height: var(--riadok); border-top: 1px solid var(--linka); }
.tv-os__riadok[hidden] { display: none; }
.tv-os__kanal { position: sticky; left: 0; z-index: 4; display: flex; align-items: center; flex: none; width: var(--kanal); padding: 0 12px; background: var(--biela); border-right: 1px solid var(--linka); font-family: var(--font-ui); font-size: 14px; font-weight: 700; line-height: 1.2; box-shadow: 6px 0 8px -6px rgb(0 0 0 / .12); }
.tv-os__relacie { position: relative; flex: 1; }
.tv-os__relacie li { position: absolute; top: 4px; bottom: 4px; left: calc(var(--od) * var(--min)); width: calc(var(--dlzka) * var(--min) - 3px); }
.tv-os__relacie button { display: flex; flex-direction: column; justify-content: center; gap: 1px; width: 100%; height: 100%; padding: 0 8px; overflow: hidden; border: 0; border-left: 3px solid var(--z, #C9CDD2); border-radius: var(--radius); background: var(--hmla); text-align: left; }
.tv-os__relacie time { font-size: 11px; color: var(--tlmena); font-variant-numeric: tabular-nums; }
.tv-rel--kratka time, .tv-rel--kratka b { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.tv-os__relacie .tv-rel--kratka button { padding: 0; }
.tv-os__relacie b { overflow: hidden; font-size: 13px; font-weight: 600; line-height: 1.25; white-space: nowrap; text-overflow: ellipsis; }
.tv-os__relacie button:hover { background: #E8EAEE; }
.tv-rel--minula button { color: var(--tlmena); }
.tv-rel--minula b { font-weight: 500; }
.tv-os__relacie .tv-rel--bezi button { background: var(--oranzova-jemna); }
.tv-os__relacie .tv-rel--bezi button:hover { background: #FDE3CC; }
.je-filter .tv-rel:not(.je-vybrana) { opacity: .3; }
.je-filter .tv-os__relacie .je-vybrana button { background: var(--biela); box-shadow: inset 0 0 0 1px var(--z); }

/* Podľa staníc */
.tv-stanice { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px 28px; padding-top: 12px; }
.tv-stanice[hidden], .tv-stanica[hidden] { display: none; }
.tv-stanica__nazov { padding-bottom: 8px; border-bottom: 2px solid var(--atrament); font-family: var(--font-titul); font-size: 19px; font-weight: 700; }
.tv-stanica__zoznam button { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 8px; width: 100%; padding: 7px 0; border: 0; border-bottom: 1px solid var(--linka); background: none; text-align: left; font-size: 14px; line-height: 1.35; }
.tv-stanica__zoznam time { white-space: nowrap; color: var(--tlmena); font-variant-numeric: tabular-nums; }
.tv-stanica__zoznam time::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: var(--z, #C9CDD2); vertical-align: 2px; }
.tv-stanica__zoznam b { font-weight: 600; }
.tv-stanica__zoznam button:hover b { text-decoration: underline; text-underline-offset: 3px; }
.tv-stanica__zoznam .tv-rel--bezi button { margin-inline: -8px; padding-inline: 8px; width: calc(100% + 16px); background: var(--oranzova-jemna); }
.tv-stanica__zoznam .tv-rel--bezi time { color: var(--oranzova-text); font-weight: 700; }
.tv-stanica__cely summary { padding: 8px 0; font-size: 14px; font-weight: 600; color: var(--oranzova-text); cursor: pointer; }

/* Tipy */
.tv-tipy { margin-top: 48px; }
.tv-tipy__zoznam { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.tv-tip { display: grid; gap: 8px; align-content: start; width: 100%; height: 100%; padding: 16px 18px 18px; border: 0; border-top: 3px solid var(--oranzova); border-radius: var(--radius); background: var(--hmla); text-align: left; }
.tv-tip:hover .tv-tip__titul { text-decoration: underline; text-underline-offset: 3px; }
.tv-tip__kedy { font-size: 14px; color: var(--tlmena); }
.tv-tip__kedy b { margin-right: 4px; color: var(--atrament); font-variant-numeric: tabular-nums; }
.tv-tip__titul { font-family: var(--font-titul); font-size: 22px; font-weight: 700; line-height: 1.15; }
.tv-tip__popis { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; font-size: 14px; line-height: 1.5; color: var(--text-2); }
.tv-zdroj { margin-top: -16px; font-size: 13px; color: var(--tlmena); text-align: center; }

/* Detail relácie a výber staníc */
.tv-detail { width: min(560px, calc(100% - 32px)); max-height: min(80vh, 640px); padding: 24px 28px 28px; border: 0; border-radius: calc(var(--radius) + 4px); color: var(--atrament); box-shadow: 0 24px 64px -16px rgb(0 0 0 / .35); }
.tv-detail::backdrop { background: rgb(18 18 16 / .45); }
.tv-detail .hl-btn { display: grid; float: right; margin: -12px -16px 0 8px; }
.tv-detail__kedy { font-size: 14px; font-weight: 600; color: var(--oranzova-text); }
.tv-detail__titul { margin-top: 6px; font-family: var(--font-titul); font-size: 26px; font-weight: 700; line-height: 1.15; }
.tv-detail__sub { margin-top: 6px; color: var(--tlmena); }
.tv-detail__sub:empty { display: none; }
.tv-detail__popis { margin-top: 14px; font-family: var(--font-text); font-size: 17px; line-height: 1.6; color: var(--text-2); }
.tv-vyber__zoznam { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 16px; margin: 16px 0 20px; }
.tv-vyber__zoznam label { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--linka); font-weight: 600; }
.tv-vyber__zoznam input { width: 18px; height: 18px; accent-color: var(--oranzova); }

@media (max-width: 1023px) {
  .tv-stanice, .tv-tipy__zoznam { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .tv-teraz__zoznam { grid-auto-columns: 78%; }
  .tv-lista { gap: 10px 12px; }
  .tv-casti { order: 3; overflow-x: auto; max-width: 100%; }
  .tv-casti button { flex: none; }
  .tv-zanre { order: 4; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--okraj) * -1); padding-inline: var(--okraj); }
  .tv-zaner { flex: none; }
  .tv-upravit { padding: 0 12px; }
  .tv-os { --min: 2.6px; --kanal: 84px; --riadok: 56px; margin-inline: calc(var(--okraj) * -1); }
  .tv-os__kanal { padding: 0 8px; font-size: 13px; }
  .tv-stanice, .tv-tipy__zoznam { grid-template-columns: 1fr; }
  .tv-detail { width: 100%; max-width: none; max-height: 85vh; margin: auto 0 0; border-radius: 12px 12px 0 0; padding: 20px 20px 28px; }
  .tv-vyber__zoznam { grid-template-columns: 1fr; }
}

/* ==========================================================
   Smer 1 – Titulka
   Redakčný, pokojný. Newsreader nesie titulky a text článkov,
   Schibsted Grotesk (písmo navrhnuté pre spravodajstvo) rozhranie.
   Žiadne zaoblenia, hierarchia stojí na veľkosti písma a linkách.
   ========================================================== */

:root {
  --font-ui: "Schibsted Grotesk", system-ui, sans-serif;
  --font-titul: "Newsreader", Georgia, serif;
  --font-text: "Newsreader", Georgia, serif;
  --radius: 0px;
  --logo-v: 42px;
}

.karta__titul, .clanok__nadpis, .pas-hlavicka__nazov, .rubrika__nadpis, .blok-hlavicka__nazov {
  font-weight: 600;
  font-optical-sizing: auto;
}
.karta__titul { letter-spacing: -.005em; }
.karta__rubrika { font-family: var(--font-ui); }

/* ---------- Horná zóna: hlavná správa, trojica, najnovšie ---------- */

.hore {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  grid-template-areas: "lead novy" "trio novy";
  grid-template-rows: auto 1fr;
  gap: 0 48px;
  padding-top: 32px;
}
.hore__lead { grid-area: lead; }
.hore__trio { grid-area: trio; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--linka); }
.hore__najnovsie { grid-area: novy; padding-left: 32px; border-left: 1px solid var(--linka); }

.karta--lead { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 28px; align-items: start; }
.karta--lead .karta__foto img { aspect-ratio: 4 / 3; }
.karta--lead .karta__text { gap: 12px; padding-top: 4px; }
.karta--lead .karta__titul { font-size: clamp(28px, 2.5vw, 37px); font-weight: 600; line-height: 1.06; letter-spacing: -.018em; }
.karta--lead .karta__perex { font-family: var(--font-text); font-size: 18px; line-height: 1.5; color: var(--text-2); }
.hore__trio .karta__titul { font-size: 20px; }
.hore__trio .karta__perex { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

.najnovsie .blok-hlavicka { padding-bottom: 2px; }
.najnovsie__zoznam li:first-child { border-top: 2px solid var(--atrament); }
.najnovsie__zoznam a { font-family: var(--font-ui); }

/* ---------- Spodok: pásy rubrík + pravý stĺpec ---------- */

.spodok { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 0 48px; align-items: start; margin-top: 32px; } /* bez billboardu (adblock) sa nelepí na hornú zónu; s ním sa okraje zlúčia */
.spodok > :not(.lista-pravy) { grid-column: 1; }
.spodok > .lista-pravy { grid-column: 2; grid-row: 1 / span 8; position: relative; }
.lista-pravy { gap: 40px; }

.pas { margin-bottom: 52px; }
.pas__obsah { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 32px; }
.pas__zoznam { display: grid; align-content: start; }
.pas__zoznam .karta { padding: 14px 0; border-top: 1px solid var(--linka); }
.pas__zoznam .karta:first-child { padding-top: 0; border-top: 0; }
.pas__zoznam .karta--vodorovna { grid-template-columns: 112px minmax(0, 1fr); }
.karta--velka .karta__titul { font-size: 27px; line-height: 1.12; }

.duo { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-bottom: 52px; }
.duo .pas { margin: 0; }
.pas--uzky .karta--titul { padding: 12px 0; border-top: 1px solid var(--linka); }
.pas--uzky .karta--stred { margin-bottom: 14px; }
.pas--uzky .karta--stred .karta__titul { font-size: 22px; }

.ad--feed { margin-bottom: 52px; height: 250px; }

/* Najčítanejšie: kurzívne čísla */
.najcitanejsie__zoznam li::before { font-style: italic; font-weight: 500; font-size: 30px; }
.najcitanejsie__zoznam a { font-family: var(--font-ui); }

/* ---------- Článok ---------- */

.clanok__nadpis { font-size: clamp(32px, 3.8vw, 50px); line-height: 1.06; }
.clanok__perex { font-weight: 400; font-size: 22px; font-style: italic; color: #2E3135; }
.clanok__telo { font-size: 20px; line-height: 1.6; }
.clanok__telo p:first-child::first-letter { font-weight: 600; }
.tiez-vlozene a { font-family: var(--font-titul); font-size: 19px; font-weight: 600; }

/* ---------- Responzivita ---------- */

@media (max-width: 1279px) {
  .hore { grid-template-columns: minmax(0, 1fr) 300px; gap: 0 32px; }
  .hore__najnovsie { padding-left: 24px; }
  .spodok { grid-template-columns: minmax(0, 1fr) 300px; gap: 0 32px; }
  .karta--lead { grid-template-columns: 1fr; }
  .karta--lead .karta__foto img { aspect-ratio: 16 / 9; }
}

@media (max-width: 1023px) {
  .hore { grid-template-columns: 1fr; grid-template-areas: "lead" "novy" "trio"; }
  .hore__najnovsie { margin-top: 28px; padding: 0; border: 0; }
  .spodok { grid-template-columns: 1fr; }
  .spodok > .lista-pravy { grid-column: 1; grid-row: auto; margin-bottom: 52px; }
}

@media (max-width: 767px) {
  .hore { padding-top: 16px; }
  .karta--lead .karta__titul { font-size: 30px; }
  .karta--lead .karta__perex { font-size: 17px; }
  .hore__trio { grid-template-columns: 1fr; gap: 0; }
  .hore__trio .karta { grid-template-columns: 112px minmax(0, 1fr); gap: 14px; padding: 14px 0; border-top: 1px solid var(--linka); }
  .hore__trio .karta:first-child { border-top: 0; padding-top: 0; }
  .hore__trio .karta__titul { font-size: 18px; }
  .hore__trio .karta__perex { display: none; }
  .pas__obsah, .duo { grid-template-columns: 1fr; gap: 24px; }
  .karta--velka .karta__titul { font-size: 24px; }
  .clanok__perex { font-size: 19px; }
  .clanok__telo { font-size: 18px; }
}

/* v2.1: blok Voľby a ciferník */
.volby--titulka { margin-top: 44px; }

/* ---------- Vyhľadávanie a tagy (v prototype nie sú; rozloženie rubriky) ---------- */

.rubrika__zoznam .karta.bez-foto { grid-template-columns: minmax(0, 1fr); }
.hladanie__formular { display: grid; gap: 20px; margin-bottom: 32px; padding: 24px; border: 1px solid var(--linka); border-top: 3px solid var(--oranzova); background: var(--hmla); }
.hladanie .hladanie__formular { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 20px 24px; padding: 28px; }
.hladanie .hladanie__rubriky, .hladanie .hladanie__formular .tl { grid-column: 1 / -1; }
.hladanie__pole { display: grid; gap: 7px; }
.hladanie__pole label, .hladanie__rubriky legend { font-size: 14px; font-weight: 700; color: var(--atrament); }
.hladanie__pole input, .hladanie__pole select { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid #CDD1D6; border-radius: var(--radius); background: var(--biela); font: inherit; color: var(--atrament); }
.hladanie__pole input:focus-visible, .hladanie__pole select:focus-visible { outline: 2px solid var(--oranzova); outline-offset: 2px; border-color: var(--atrament); }
.hladanie__rubriky { min-width: 0; margin: 0; padding: 0; border: 0; }
.hladanie__pomoc { margin: 6px 0 10px; font-size: 14px; line-height: 1.45; color: var(--text-2); }
.hladanie__vyber { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: 224px; overflow-y: auto; border: 1px solid #CDD1D6; background: var(--biela); }
.hladanie__rubrika { display: flex; align-items: center; gap: 9px; min-height: 44px; padding: 8px 12px; font-size: 14px; cursor: pointer; }
.hladanie__rubrika:hover { background: var(--oranzova-jemna); }
.hladanie__rubrika input { flex: none; width: 17px; height: 17px; accent-color: var(--modra); }
.hladanie__rubrika--pod { padding-left: 22px; }
.hladanie__formular .tl { justify-self: start; min-height: 46px; padding-inline: 22px; }
@media (max-width: 600px) { .hladanie .hladanie__formular { grid-template-columns: 1fr; padding: 20px; } .hladanie__vyber { grid-template-columns: 1fr; } .hladanie__formular .tl { justify-self: stretch; } }
.hladanie__hlaska { margin: 8px 0 24px; font-size: 17px; }
.hladanie__napoveda { margin-top: 28px; padding: 24px 28px; border: 1px solid var(--linka); font-size: 15px; line-height: 1.6; color: var(--text-2); }
.hladanie__napoveda h2 { margin: 0 0 12px; font: 700 20px var(--font-titul); color: var(--atrament); }
.hladanie__napoveda p { margin: 12px 0 0; }
.hladanie__napoveda ul { display: grid; gap: 8px; margin: 16px 0; padding-left: 20px; list-style: square; }
.hladanie__napoveda code { padding: 2px 5px; background: var(--hmla); color: var(--atrament); }

/* Ankety (11a §15): box v pravom stĺpci a archív /ankety/ – dizajn ich nemá, štýl blokov pravého stĺpca */
.anketa__otazka { margin: 0 0 12px; font-family: var(--font-titul); font-size: 18px; line-height: 1.3; }
.anketa__odpovede { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; font-size: 15px; }
.anketa__odpovede li { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; align-items: baseline; }
.anketa__odpovede a { color: var(--atrament); text-decoration: underline; text-decoration-color: var(--linka); text-underline-offset: 3px; }
.anketa__odpovede a:hover { text-decoration-color: var(--oranzova); }
.anketa__percenta { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--text-2); }
.anketa__pruh { grid-column: 1 / -1; display: block; min-width: 3px; height: 6px; border-radius: 3px; background: var(--oranzova); }
.anketa__pata { margin: 12px 0 0; font-size: 14px; color: var(--text-2); }
.anketa--archiv { padding: 20px 0; border-bottom: 1px solid var(--linka); }

/* Kalendár archívu /archiv.html (11a §11) – dizajn ho nemá: rozloženie rubriky, roky zbaliteľné */
.archiv__roky { display: grid; }
.archiv__rok { border-bottom: 1px solid var(--linka); }
.archiv__rok summary { display: flex; justify-content: space-between; align-items: center; padding: 14px 0; cursor: pointer; list-style: none; font-family: var(--font-titul); font-size: 24px; font-weight: 700; }
.archiv__rok summary::-webkit-details-marker { display: none; }
.archiv__rok summary::after { content: "+"; font-family: var(--font-ui); font-size: 22px; font-weight: 400; color: var(--tlmena); }
.archiv__rok[open] summary::after { content: "–"; }
.archiv__rok summary:focus-visible { outline: 2px solid var(--oranzova); outline-offset: 2px; }
.archiv__mesiace { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 28px 32px; padding: 8px 0 28px; }
.kalendar { width: 100%; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
.kalendar caption { margin-bottom: 8px; text-align: left; font-weight: 700; }
.kalendar th { padding: 4px 0; font-size: 12px; font-weight: 600; color: var(--tlmena); }
.kalendar td { height: 32px; padding: 0; text-align: center; color: #A9AFB6; }
.kalendar a { display: flex; align-items: center; justify-content: center; height: 32px; font-weight: 600; color: var(--atrament); }
.kalendar a:hover { background: var(--oranzova-jemna); color: var(--oranzova-text); }
.kalendar td[aria-current] { box-shadow: inset 0 0 0 2px var(--oranzova); font-weight: 700; color: var(--atrament); }

/* 24 hodín v skratke /24-hodin-spravy.html (11a §11) – dizajn ju nemá: riadky ako blok Najnovšie, sekcie pod sebou */
.v-skratke__uvod { margin: -12px 0 24px; padding: 10px 14px; background: var(--oranzova-jemna); color: var(--oranzova-text); font-weight: 600; text-align: center; }
.v-skratke__sekcia + .v-skratke__sekcia { margin-top: 32px; }
.v-skratke .najnovsie__zoznam li { grid-template-columns: 96px minmax(0, 1fr); }

/* Nastavenie kurzového lístka /nastavenie.html (11a §16) – dizajn ho nemá: formulár ako hľadanie, meny v 2 stĺpcoch */
.nastavenie__meny { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 24px; margin: 0; padding: 0; border: 0; font-size: 15px; }
.nastavenie__meny legend { margin-bottom: 14px; font-size: 16px; font-weight: 600; }
.nastavenie__meny label { display: flex; align-items: center; gap: 10px; min-height: 32px; cursor: pointer; }
.nastavenie__meny input { width: 18px; height: 18px; accent-color: var(--oranzova); }
.nastavenie__ulozene { margin: -12px 0 20px; padding: 10px 14px; background: var(--oranzova-jemna); color: var(--oranzova-text); font-weight: 600; }
.nastavenie .hladanie__formular { max-width: none; }
@media (max-width: 767px) { .nastavenie__meny { grid-template-columns: 1fr; } }

/* Chybové stránky 404/410 (layout webu) a 500/503 (bez DB, iba logo) – 11c 11.2 */
.chyba { margin: 40px 0 16px; font-family: var(--font-titul); font-size: clamp(24px, 3vw, 34px); line-height: 1.2; }
.chyba-stranka { padding: 8px 0 96px; font-size: 17px; color: var(--text-2); }
