/* ==========================================================================
   RGc — interakční vrstva (oprava 3. 11. 2026)
   Načítá se jako POSLEDNÍ stylopis každé stránky, takže jednotně přebíjí dílčí hover pravidla.

   1. logo a navigace · 2. tlačítka · 3. odhalování od linek (data-rv)
   4. řádky (plocha mezi linkami) · 5. karty a dlaždice · 6. aktivní kapitola / fáze na ose
   Hover používá jen vlastnosti scale / translate / background / box-shadow (žádný přepočet layoutu,
   sousední obsah se neposouvá). Reakce na ukazatel jen na zařízeních s myší; u prefers-reduced-motion
   zůstává změna barvy podkladu, zvětšení a posun se vypínají.
   ========================================================================== */
:root {
  --hv-ease: cubic-bezier(.22, .61, .36, 1);
  --hv-t: .5s;
  --rv-ease: cubic-bezier(.16, .8, .28, 1);
  --hv-tr: scale var(--hv-t) var(--hv-ease), translate var(--hv-t) var(--hv-ease), background-color var(--hv-t) var(--hv-ease),
           color var(--hv-t) var(--hv-ease), border-color var(--hv-t) var(--hv-ease), box-shadow var(--hv-t) var(--hv-ease);
}

/* Prvky s třídou .reveal: po dohrání vstupu (JS přidá .rv-done) přebírá přechody hover. */
html.js .reveal.is-in.rv-done { transition: var(--hv-tr); transition-delay: 0s; }

/* ---------- 1. LOGO A NAVIGACE ---------- */
.hero__logo img, .mh__logo img, .jh__logo img {
  transform-origin: 0 50%;
  transition: scale .55s var(--hv-ease), filter .55s var(--hv-ease);
}
.nav a {
  display: inline-block; transform-origin: 50% 70%;
  transition: text-decoration-color var(--hover-time) var(--ease-out), scale .38s var(--hv-ease), filter .38s var(--hv-ease);
}
.footer__menu a { display: inline-block; transform-origin: 50% 70%;
  transition: text-decoration-color var(--hover-time) var(--ease-out), scale .38s var(--hv-ease), filter .38s var(--hv-ease); }
@media (hover: hover) and (pointer: fine) {
  .hero__logo:hover img, .hero__logo:focus-visible img,
  .mh__logo:hover img, .mh__logo:focus-visible img,
  .jh__logo:hover img, .jh__logo:focus-visible img { scale: 1.05; filter: brightness(1.12); }
  .nav a:hover, .nav a:focus-visible, .footer__menu a:hover, .footer__menu a:focus-visible { scale: 1.08; filter: brightness(1.28); }
}
.nav a:focus-visible, .footer__menu a:focus-visible { scale: 1.08; filter: brightness(1.28); }
.hero__logo:focus-visible img, .mh__logo:focus-visible img, .jh__logo:focus-visible img { scale: 1.05; filter: brightness(1.12); }

/* ---------- 2. TLAČÍTKA (jedna odezva pro všechna) ----------
   Barevná logika každého typu (plné / obrysové) zůstává z V3; společné je mírné zvětšení, nadzvednutí a měkký stín. */
.btn, .jc__b1, .jc__b2 {
  transition: scale .42s var(--hv-ease), translate .42s var(--hv-ease), box-shadow .42s var(--hv-ease),
              background-color .35s var(--hv-ease), color .35s var(--hv-ease), border-color .35s var(--hv-ease);
}
html.js .reveal.btn.is-in.rv-done {
  transition: scale .42s var(--hv-ease), translate .42s var(--hv-ease), box-shadow .42s var(--hv-ease),
              background-color .35s var(--hv-ease), color .35s var(--hv-ease), border-color .35s var(--hv-ease);
}
.btn:focus-visible, .jc__b1:focus-visible, .jc__b2:focus-visible { scale: 1.045; translate: 0 -2px; box-shadow: 0 12px 26px -14px rgba(0, 0, 0, .55); }
@media (hover: hover) and (pointer: fine) {
  .btn:hover, .jc__b1:hover, .jc__b2:hover { scale: 1.045; translate: 0 -2px; box-shadow: 0 12px 26px -14px rgba(0, 0, 0, .55); }
}
.btn:active, .jc__b1:active, .jc__b2:active { scale: .985; translate: 0 0; box-shadow: none; transition-duration: .12s; }
/* tlačítko „Zobrazit celý profil“ (textové): stejná logika — mírné zvětšení a zesvětlení, podtržení zůstává */
.prof__tg { transform-origin: 0 50%; transition: text-decoration-color var(--hover-time) var(--ease-out), scale .38s var(--hv-ease), filter .38s var(--hv-ease); }
@media (hover: hover) and (pointer: fine) { .prof__tg:hover { scale: 1.06; filter: brightness(1.25); } }
.prof__tg:focus-visible { scale: 1.06; filter: brightness(1.25); }
html.js .reveal.prof__tg.is-in.rv-done { transition: text-decoration-color var(--hover-time) var(--ease-out), scale .38s var(--hv-ease), filter .38s var(--hv-ease); }
/* odkazy s kruhovou šipkou */
a.arrow-link .arrow-circle, a.arrow-circle:not(.is-pending) { transition: background-color var(--hover-time) var(--ease-out), color var(--hover-time) var(--ease-out), border-color var(--hover-time) var(--ease-out), scale .42s var(--hv-ease), box-shadow .42s var(--hv-ease); }
@media (hover: hover) and (pointer: fine) {
  a.arrow-link:hover .arrow-circle, a.arrow-circle:not(.is-pending):hover { scale: 1.08; box-shadow: 0 10px 24px -12px rgba(0, 0, 0, .5); }
}
a.arrow-link:focus-visible .arrow-circle { scale: 1.08; }

/* ---------- 3. ODHALOVÁNÍ OD LINEK ----------
   Obsah (.rv-i) je schovaný za linkou: ořez (overflow: clip) je přesně na hraně vnitřní plochy prvku, tedy pod linkou.
   Při vstupu do zorného pole obsah pomalu vyjede od linky; skupiny postupně v pořadí čtení (--rvd = pořadí v dávce,
   --rvj = pořadí uvnitř prvku). data-rv="x": linka je svislá (vlevo), obsah vyjíždí vodorovně. */
html.js [data-rv]:not(.rv-done) { overflow: clip; }
html.js [data-rv] .rv-i { transform-origin: 0 50%; opacity: 0; translate: 0 calc(-100% - var(--rvp, 32px)); }
html.js [data-rv="x"] .rv-i { translate: calc(-100% - var(--rvp, 24px)) 0; }
html.js [data-rv].is-in .rv-i {
  opacity: 1; translate: 0 0;
  transition: translate 1.25s var(--rv-ease), opacity .7s ease-out;
  transition-delay: calc(var(--rvd, 0ms) + 260ms + var(--rvj, 0) * 170ms);
}
/* linka se „dokreslí“ zleva ještě před textem (jen hairline pseudo-prvky řádků) */
html.js [data-rv].rv-line::before, html.js [data-rv].rv-line::after { transform-origin: 0 50%; scale: 0 1; }
html.js [data-rv].rv-line.is-in::before, html.js [data-rv].rv-line.is-in::after { scale: 1 1; transition: scale 1s var(--rv-ease); transition-delay: var(--rvd, 0ms); }
html.js [data-rv].rv-done .rv-i { transition: scale var(--hv-t) var(--hv-ease), translate var(--hv-t) var(--hv-ease), color var(--hv-t) var(--hv-ease); transition-delay: 0s; }

/* ---------- 4. ŘÁDKY: podklad celé plochy mezi linkami ---------- */
.hv__bg { position: absolute; z-index: -1; top: 0; bottom: 0; left: calc(var(--hv-ext, 22px) * -1); right: calc(var(--hv-ext, 22px) * -1);
  background: var(--hv-plate, transparent); opacity: 0; pointer-events: none; transition: opacity var(--hv-t) var(--hv-ease); }
.sit-row, .diag-row, .flow-step, .lay, .nv, .mst__i, .jf__i { position: relative; isolation: isolate; }
.sit-row, .diag-row { --hv-plate: rgba(5, 17, 10, .36); }     /* tmavá zelená + světlý text: podklad se ztmaví */
.flow-step         { --hv-plate: rgba(246, 241, 231, .20); }  /* písková + tmavý text: podklad se zesvětlí o jeden tón (tan → o stupeň světlejší tan) */
.lay               { --hv-plate: rgba(255, 252, 244, .6); }  /* ivory → jiný odstín ivory */
.nv                { --hv-plate: rgba(255, 250, 240, .5); --hv-ext: 10px; }  /* béžová → světlejší béžová */
.mst__i, .jf__i    { --hv-plate: rgba(5, 17, 10, .34); --hv-ext: 0px; }
.mst__i .hv__bg, .jf__i .hv__bg { right: -40px; left: 0; }                 /* plocha sahá k dalšímu oddělovači (mezera sloupců 40 px) */
.mst__i:last-child .hv__bg, .jf__i:last-child .hv__bg { right: 0; }
.diag-row, .flow-step { --hv-ext: 26px; }
.sit-row { --hv-ext: 28px; }
.sit-row, .diag-row, .flow-step, .lay { --hv-cs: 1.028; --hv-ty: -2px; }
.nv { --hv-cs: 1.05; --hv-ty: -1px; }
.sit-row__d { --hv-cs: 1; --hv-ty: 0px; }                       /* pravý odstavec se při hoveru nezvětšuje (nesmí narazit na pravý okraj) */
.mst__n { --hv-cs: 1.07; } .mst__l { --hv-cs: 1.05; } .jf__n { --hv-cs: 1.07; } .jf__t { --hv-cs: 1.05; }
.mst__i, .jf__i { --hv-ty: -2px; }
.kp { --hv-cs: 1; --hv-ty: 0px; }                                       /* u KPI se zvětšuje celá karta, ne texty zvlášť */
@media (hover: hover) and (pointer: fine) {
  html.js [data-rv].rv-done:hover > .hv__bg, html.js [data-rv].rv-done:focus-visible > .hv__bg { opacity: 1; }
  html.js [data-rv].rv-done:hover .rv-i, html.js [data-rv].rv-done:focus-visible .rv-i { scale: var(--hv-cs, 1.03); translate: 0 var(--hv-ty, -2px); }
}

/* ---------- 5. KARTY A DLAŽDICE: zvětšení celé karty + změna podkladu ---------- */
.mcard, .mtile, .scard, .mandate, .kp, .pl { position: relative; transition: var(--hv-tr); }
html.js [data-seq].is-in.rv-done .mtile { transition: var(--hv-tr); transition-delay: 0s; opacity: 1; }
.mcard, .mandate { --hv-bg: #0e1a13; --hv-sh: 0 26px 46px -28px rgba(0, 0, 0, .8); }
.mtile  { --hv-bg: #fcf9f2; --hv-sh: 0 24px 40px -28px rgba(31, 58, 43, .55); }
.scard  { --hv-bg: rgba(246, 241, 231, .14); --hv-sh: 0 26px 44px -26px rgba(0, 0, 0, .5); }
.kp     { --hv-bg: #f7efdf; --hv-sh: 0 24px 40px -28px rgba(31, 58, 43, .5); }
.pl     { --hv-bg: #fdfaf3; --hv-sh: 0 24px 40px -28px rgba(31, 58, 43, .45); }
.mcard { --hv-s: 1.03; } .mtile { --hv-s: 1.045; } .scard { --hv-s: 1.02; } .mandate { --hv-s: 1.012; } .kp { --hv-s: 1.045; } .pl { --hv-s: 1.022; }
@media (hover: hover) and (pointer: fine) {
  .mcard:hover, .mtile:hover, .scard:hover, .mandate:hover, .kp:hover, .pl:hover { scale: var(--hv-s); background-color: var(--hv-bg); box-shadow: var(--hv-sh); z-index: 3; }
}

/* ---------- 6. AKTIVNÍ KAPITOLA / FÁZE NA OSE (řídí scroll, viz main.js) ---------- */
.chap, .ph, html.js .ph.reveal.is-in.rv-done { transition: opacity .6s var(--hv-ease); }
.chap__y, .ph__num { transform-origin: 0 50%; transition: scale .6s var(--hv-ease), color .6s var(--hv-ease); }
.chap__b, .ph__c { transform-origin: 0 0; transition: scale .6s var(--hv-ease), color .6s var(--hv-ease); }
.chap__t, .ph__t { transition: color .6s var(--hv-ease); }
.axis-live .chap:not(.is-active), .axis-live .ph:not(.is-active) { opacity: .62; }
.chap.is-active .chap__y, .ph.is-active .ph__num { scale: 1.06; color: var(--action); }
.chap.is-active .chap__b, .ph.is-active .ph__c { scale: 1.016; }
.chap.is-active .chap__t, .ph.is-active .ph__t { color: #1f7a47; }

/* ---------- Omezený pohyb: změna podkladu zůstává, zvětšení a posuny ne ---------- */
@media (prefers-reduced-motion: reduce) {
  html.js [data-rv] .rv-i, html.js [data-rv].is-in .rv-i { opacity: 1 !important; translate: none !important; transition: none !important; }
  html.js [data-rv]:not(.rv-done) { overflow: visible; }
  html.js [data-rv].rv-line::before, html.js [data-rv].rv-line::after { scale: 1 1 !important; transition: none !important; }
  .btn, .jc__b1, .jc__b2, .nav a, .prof__tg, .footer__menu a { scale: none !important; translate: none !important; }
  .hero__logo img, .mh__logo img, .jh__logo img { scale: none !important; }
  html.js [data-rv].rv-done:hover .rv-i, html.js [data-rv].rv-done:focus-visible .rv-i { scale: none; translate: none; }
  .mcard:hover, .mtile:hover, .scard:hover, .mandate:hover, .kp:hover, .pl:hover { scale: none; }
  .chap.is-active .chap__y, .ph.is-active .ph__num, .chap.is-active .chap__b, .ph.is-active .ph__c { scale: none; }
}


/* ==========================================================================
   7. KOLO 4 (3. 11. 2026) — linky × hover plocha, sazba tlačítek, aktivní osa
   ========================================================================== */

/* ---- 7.1 Linka končí na stejné svislé ose jako hover plocha ----
   Plocha (.hv__bg) přesahuje obsah o --hv-ext na obě strany; při hoveru se o stejnou hodnotu plynule prodlouží horní linka
   řádku i linka pod ním (= horní linka dalšího řádku, u posledního řádku jeho dolní linka). Mění se jen left/right
   pseudo-prvku (absolutní pozice) — layout se nepřepočítá. */
.row.rv-line::before, .row.rv-line::after, .lay.hl::before, .lay.hl::after {
  transition: left var(--hv-t) var(--hv-ease), right var(--hv-t) var(--hv-ease);
}
html.js [data-rv].rv-line.is-in::before, html.js [data-rv].rv-line.is-in::after {
  transition: scale 1s var(--rv-ease) var(--rvd, 0ms), left var(--hv-t) var(--hv-ease), right var(--hv-t) var(--hv-ease);
}
@media (hover: hover) and (pointer: fine) {
  html.js [data-rv].rv-line.rv-done:hover::before, html.js [data-rv].rv-line.rv-done:hover::after,
  html.js [data-rv].rv-line.rv-done:hover + [data-rv].rv-line::before {
    left: calc(var(--hv-ext, 22px) * -1); right: calc(var(--hv-ext, 22px) * -1);
  }
}

/* rychlé menu 01–06: horní linka je teď pseudo-prvek (dřív border-top), aby šla prodloužit společně s plochou */
.nv { border-top: 0; padding-top: 22px; position: relative; }
.nv::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: var(--green);
  transition: left var(--hv-t) var(--hv-ease), right var(--hv-t) var(--hv-ease), background-color var(--hover-time) var(--ease-out); pointer-events: none; }
html.js .nv.rv-line.is-in::before { transition: scale 1s var(--rv-ease) var(--rvd, 0ms), left var(--hv-t) var(--hv-ease), right var(--hv-t) var(--hv-ease), background-color var(--hover-time) var(--ease-out); }
.nv:hover::before, .nv:focus-visible::before { background: var(--action); }
@media (hover: hover) and (pointer: fine) {
  html.js .nv.rv-done:hover::before { left: -10px; right: -10px; }
}
.nv:focus-visible::before { left: -10px; right: -10px; }

/* ---- 7.2 Jednotný systém CTA: jedna výška, písmo, padding, radius; liší se jen barvy podle kontextu ---- */
.btn, .btn--l, .jc__b1, .jc__b2 {
  box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center;
  height: 48px; min-width: 160px; padding: 0 24px; border-radius: 999px;
  font-size: 16px; line-height: 24px; font-weight: 700; white-space: nowrap; border-width: 0; border-style: solid;
}
.btn--k2, .btn--outline-l, .mh-btn-line, .jc__b2 { border-width: 2px; padding: 0 22px; }
.mh-btn-line, .jc__b2 { border-color: var(--action); }

/* ---- 7.3 Aktivní kapitola / fáze: rok/číslo, nadpis, tečka i stopa na ose sdílejí jednu světle zelenou (--action) ---- */
.chap.is-active .chap__y, .ph.is-active .ph__num, .chap.is-active .chap__t, .ph.is-active .ph__t { color: var(--action); }
html.js .kar__trail, html.js .kar__dot, html.js .fz__trail, html.js .fz__dot { transition: background-color .6s var(--hv-ease), height .22s linear, top .22s linear; }
.axis-live .kar__trail, .axis-live .kar__dot, .axis-live .fz__trail, .axis-live .fz__dot { background: var(--action); }

/* ---- 7.4 Česká sazba: bez osamocených slov na posledním řádku odstavce (nezlomitelné mezery jsou přímo v textu) ---- */
p, li, dd, blockquote { text-wrap: pretty; }
/* texty v seznamech: obyčejné zalamování (text-wrap: pretty počítá volbu zlomu podle šířky a při měřítku/zoomu by mohl zlom přeskočit); pevné mezery řeší spojky */
.sit-row *, .diag-row *, .flow-step *, .lay *, .nv *, .mst__i *, .jf__i * { text-wrap: wrap; }

/* ---- 7.5 Odkazy se šipkou bez cíle (.is-pending): jen vizuální náhled stejného pohybu jako u funkčních odkazů; nejsou klikací ---- */
.arrow-link .arrow-circle { transition: background-color var(--hover-time) var(--ease-out), color var(--hover-time) var(--ease-out), border-color var(--hover-time) var(--ease-out), scale .42s var(--hv-ease), box-shadow .42s var(--hv-ease); }
@media (hover: hover) and (pointer: fine) {
  .arrow-link.is-pending:hover { color: var(--lk-h); }
  .arrow-link.is-pending:hover .arrow-circle { background: var(--lk); color: var(--lk-fg); scale: 1.08; box-shadow: 0 10px 24px -12px rgba(0, 0, 0, .5); }
}

/* ---- 7.6 Pět diagnostických oblastí: jednotná výška řádku (podle dvouřádkových položek), bez umělých zalomení ---- */
.diag-row__in { min-height: 84px; }

/* ---- 7.7 Karty s horní linkou: obsah vyjíždí z linky (data-rv), celá karta se při hoveru zvětšuje (ne texty zvlášť) ---- */
.mcard, .mtile, .scard, .phase { --hv-cs: 1; --hv-ty: 0px; }
.phase { --hv-cs: 1; }
/* karty „Kde Martin vede mandáty“ (.scard) sdílejí systém karet .mcard: tmavá zelená, písková horní linka, krémový hlavní text, tlumenější vedlejší text */
.scard { color: var(--cream); --plate-bg: var(--green-deep); }
.scard__t { color: var(--cream); }
.scard__q { color: var(--soft); }
.scard__l { border-top-color: rgba(192, 175, 150, .45); color: var(--soft); }
.scard__l li::marker { color: var(--tan); }

/* ---- 7.9 Typické mandáty: tři linky nad Diagnostika / Plán / Realizace se po vjezdu už nikdy neprodlužují ----
   Globální pravidlo pro .rv-line prodlužuje linku při hoveru o --hv-ext; u .phase je prodloužení explicitně nulové
   (vlastní linka i linka následující fáze zůstávají left: 0; right: 0). Úvodní vykreslení linky (scale) se nemění. */
.mandate .phase { --hv-ext: 0px; }
@media (hover: hover) and (pointer: fine) {
  html.js .mandate .phase[data-rv].rv-line.rv-done:hover::before, html.js .mandate .phase[data-rv].rv-line.rv-done:hover::after,
  html.js .mandate .phase[data-rv].rv-line.rv-done:hover + .phase[data-rv].rv-line::before { left: 0; right: 0; }
}

/* ---- 8. KARTY S VNITŘNÍMI ODDĚLOVAČI (.scard, .mandate, .pl): při hoveru roste jen podkladová plocha s horní linkou ----
   Samotná karta (a tedy její obsah a vnitřní linky) zůstává na místě; zvětšuje se pseudo-prvek ::after, který nese
   pozadí, horní linku i stín. Vnitřní oddělovače se tak nikdy nenatahují. Hit-area karty se při hoveru nemění. */
.scard, .mandate, .pl { background: none; isolation: isolate; border-top-color: transparent; overflow-clip-margin: 2px; }   /* clip-margin: linka na plošce (−2 px) je vidět i během vjezdu obsahu */
.mandate { --plate-bg: var(--green-deep); }
.pl { --plate-bg: var(--cream); }
.scard, .mandate { --plate-hv: #0e1a13; --plate-sh: 0 26px 46px -28px rgba(0, 0, 0, .8); }
.pl { --plate-hv: #fdfaf3; --plate-sh: 0 24px 40px -28px rgba(31, 58, 43, .45); }
.scard { --plate-s: 1.02; } .mandate { --plate-s: 1.012; } .pl { --plate-s: 1.022; }
.scard::after, .mandate::after, .pl::after { content: ''; position: absolute; inset: -2px 0 0 0; z-index: -1; pointer-events: none;
  background: var(--plate-bg); border-top: 2px solid var(--tan); transform-origin: 50% 50%;
  transition: scale var(--hv-t) var(--hv-ease), background-color var(--hv-t) var(--hv-ease), box-shadow var(--hv-t) var(--hv-ease); }
@media (hover: hover) and (pointer: fine) {
  .scard:hover, .mandate:hover, .pl:hover { scale: none; background: none; box-shadow: none; z-index: 3; }
  .scard:hover::after, .mandate:hover::after, .pl:hover::after { scale: var(--plate-s); background-color: var(--plate-hv); box-shadow: var(--plate-sh); }
}
@media (prefers-reduced-motion: reduce) { .scard:hover::after, .mandate:hover::after, .pl:hover::after { scale: none; } }