/* Stránky funkcí na portálu: rozcestník /funkce a stránka funkce /funkce/<slug> (app/modules/funkce.php, šablony
   app/views/portal/funkce/*.php, plátno „Funkce banda!cz“ 3. 11. 2026). Barvy a písmo z portal.css (tokeny :root), ukázky
   administrace z administrace.css (.admst-*), web klubu z portal.css (.scena). Desktop ≥ 1100 px, tablet 760–1099 px, mobil < 760 px. */

/* ---------- štítky ---------- */
.fk-stitek { display: inline-block; padding: 4px 11px; border-radius: 999px; font-size: 13px; font-weight: 700; letter-spacing: 0; text-transform: none; white-space: nowrap; vertical-align: middle; }
.fk-stitek-0 { background: var(--krem-2); color: var(--text-2); }
.fk-stitek-1 { padding: 3px 10px; border: 1px solid var(--cervena-text); color: var(--cervena-text); }
.fk-stitek-2 { background: var(--kava); color: var(--zluta); font-weight: 800; }
.tmava .fk-stitek-0 { background: var(--kava-2); color: var(--svetly-text); }
.fk-nove { display: inline-block; padding: 4px 10px; border-radius: 999px; background: var(--zluta-bublina); color: var(--kava); font-size: 12px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; vertical-align: middle; }
.fk-sekce-in { padding-top: 88px; padding-bottom: 88px; }

/* ---------- rozcestník: úvod, filtr, skoky ---------- */
.fk-prehled { padding: 72px 0 28px; }
.fk-prehled-nadpis { max-width: 900px; margin-top: 16px; font-size: clamp(40px, 5vw, 64px); line-height: 1.04; letter-spacing: -0.035em; }
.fk-prehled .perex { max-width: 720px; }
.fk-filtr { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 36px; }
.fk-filtr[hidden] { display: none; }
.fk-filtr-popis { margin-right: 6px; font-size: 14px; font-weight: 700; color: var(--text-3); }
.fk-pil { min-height: 44px; padding: 9px 18px; border: 2px solid var(--kava); border-radius: 999px; background: transparent; color: var(--kava); font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; }
.fk-pil:hover { background: var(--krem-2); }
.fk-pil[aria-pressed="true"] { background: var(--kava); color: #fff; }
.fk-skoky { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-top: 24px; font-size: 15px; font-weight: 700; }
.fk-skoky a { color: var(--kava); text-decoration: underline; text-decoration-color: var(--linka-2); text-underline-offset: 5px; }
.fk-skoky a:hover { text-decoration-color: var(--kava); }
.fk-skoky span { color: var(--text-3); font-weight: 500; }
.fk-skoky a[hidden] { display: none; }

/* ---------- rozcestník: skupiny a karty (i komponenta f-karty) ---------- */
.fk-skupiny { padding-bottom: 88px; }
.fk-skupina { padding-top: 40px; scroll-margin-top: 90px; }
.fk-skupina[hidden] { display: none; }
.fk-skupina-hlava { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px; padding-bottom: 14px; border-bottom: 1px solid var(--linka); }
.fk-skupina-hlava h2 { font-size: clamp(26px, 2.4vw, 32px); letter-spacing: -0.02em; }
.fk-skupina-hlava p { color: var(--text-3); font-size: 16px; }
.fk-karty { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 18px; margin-top: 22px; }
.fk-karty-sekce .fk-karty { margin-top: 36px; }
.fk-karta { --fk-ik-x: 48px; --fk-ik-y: 48px; position: relative; display: flex; flex-direction: column; gap: 12px; min-height: 230px; padding: 24px; border: 1px solid var(--linka); border-radius: 22px; background: #fff; }
.fk-karta[hidden] { display: none; }
.fk-karta-hl { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.fk-karta .ikona { width: 48px; height: 48px; border-radius: 15px; }
.fk-karta h3 { font-size: 20px; letter-spacing: -0.01em; }
.fk-karta p { flex: 1 1 auto; font-size: 15px; line-height: 1.5; color: var(--text-2); }
.fk-karta-pata { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.fk-vice { display: inline-flex; align-items: center; gap: 6px; color: var(--cervena-text); font-size: 14px; font-weight: 800; }
.fk-karta-odkaz { color: inherit; text-decoration: none; }
.fk-karta-odkaz::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.fk-karta-odkaz:hover, .fk-karta-odkaz:focus { color: inherit; }
.fk-karta-odkaz:focus-visible { outline: none; box-shadow: none; }
/* Najetí na kartu s odkazem (majitel 3. 11. 2026, varianta B): tmavá vlna se rozlije ze středu žluté ikony přes celou kartu
   s lehkým přešvihnutím a karta se zvedne; při odjetí se vlna stáhne zpět přesně pod ikonu, plynule a bez přešvihnutí.
   Přechod v základním stavu = odjezd, v hover stavu = nájezd. Střed ikony --fk-ik-x / --fk-ik-y (odsazení + půlka ikony).
   Ikona i text jsou nad vlnou (vlna má z-index -1 uvnitř izolované karty). */
.fk-karta.s-odkazem, .fk-souvisi-karta:has(.fk-karta-odkaz) { isolation: isolate; transition: border-color 0.3s ease, color 0.3s ease, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
.fk-karta.s-odkazem::before, .fk-souvisi-karta:has(.fk-karta-odkaz)::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit;
  background: var(--kava); clip-path: circle(0 at var(--fk-ik-x) var(--fk-ik-y)); transition: clip-path 0.35s cubic-bezier(0.4, 0, 0.2, 1); pointer-events: none; }
.fk-karta.s-odkazem p, .fk-karta.s-odkazem .fk-stitek, .fk-karta.s-odkazem .fk-vice, .fk-souvisi-karta .fk-stitek {
  transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease; }
.fk-karta.s-odkazem:hover, .fk-karta.s-odkazem:has(.fk-karta-odkaz:focus-visible),
.fk-souvisi-karta:has(.fk-karta-odkaz:hover), .fk-souvisi-karta:has(.fk-karta-odkaz:focus-visible) {
  border-color: var(--kava); color: #fff; transform: translateY(-6px);
  transition: border-color 0.2s ease, color 0.25s ease, transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1); }
.fk-karta.s-odkazem:hover::before, .fk-karta.s-odkazem:has(.fk-karta-odkaz:focus-visible)::before,
.fk-souvisi-karta:has(.fk-karta-odkaz:hover)::before, .fk-souvisi-karta:has(.fk-karta-odkaz:focus-visible)::before {
  clip-path: circle(145% at var(--fk-ik-x) var(--fk-ik-y)); transition: clip-path 0.55s cubic-bezier(0.34, 1.2, 0.64, 1); }
:is(.fk-karta.s-odkazem:hover, .fk-karta.s-odkazem:has(.fk-karta-odkaz:focus-visible)) p { color: var(--svetly-text); }
:is(.fk-karta.s-odkazem:hover, .fk-karta.s-odkazem:has(.fk-karta-odkaz:focus-visible)) .fk-vice { color: var(--zluta); }
:is(.fk-karta.s-odkazem:hover, .fk-karta.s-odkazem:has(.fk-karta-odkaz:focus-visible), .fk-souvisi-karta:has(.fk-karta-odkaz:hover), .fk-souvisi-karta:has(.fk-karta-odkaz:focus-visible)) .fk-stitek-0 { background: var(--kava-2); color: var(--svetly-text); }
:is(.fk-karta.s-odkazem:hover, .fk-karta.s-odkazem:has(.fk-karta-odkaz:focus-visible), .fk-souvisi-karta:has(.fk-karta-odkaz:hover), .fk-souvisi-karta:has(.fk-karta-odkaz:focus-visible)) .fk-stitek-1 { border-color: var(--zluta); color: var(--zluta); }
:is(.fk-karta.s-odkazem:hover, .fk-karta.s-odkazem:has(.fk-karta-odkaz:focus-visible), .fk-souvisi-karta:has(.fk-karta-odkaz:hover), .fk-souvisi-karta:has(.fk-karta-odkaz:focus-visible)) .fk-stitek-2 { background: var(--zluta); color: var(--kava); }
.fk-karta:has(.fk-karta-odkaz:focus-visible), .fk-souvisi-karta:has(.fk-karta-odkaz:focus-visible) { outline: 3px solid var(--kava); outline-offset: 2px; box-shadow: 0 0 0 6px var(--zluta); }
.fk-prazdno { margin-top: 40px; font-size: 17px; color: var(--text-2); }

/* ---------- rozcestník: pruh s ceníkem ---------- */
.fk-cenik { background: var(--kava); color: #fff; }
.fk-cenik .nadpis-2 { color: #fff; }
.fk-tarif-hlava { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px 32px; }
.fk-tarif-hlava .nadpis-2 { max-width: 760px; }
.fk-cenik-tarify { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 40px; }
.fk-cenik-tarify li { display: flex; flex-direction: column; gap: 10px; padding: 26px; border: 1px solid var(--kava-linka); border-radius: 22px; }
.fk-cenik-tarify li.hlavni { border: 2px solid var(--cervena); }
.fk-cenik-tarify h3 { font-size: 22px; }
.fk-cenik-cena { color: var(--svetly-text); font-size: 15px; }
.fk-cenik-cena b { margin-right: 4px; color: #fff; font-size: 30px; letter-spacing: -0.02em; }
.fk-cenik-tarify p:last-child { color: var(--svetly-text); font-size: 15px; line-height: 1.5; }

/* ---------- stránka funkce: úvod se scénou ---------- */
.fk-hero { padding: 24px 0 72px; overflow-x: clip; }
.fk-drobky { display: flex; flex-wrap: wrap; gap: 8px; font-size: 14px; font-weight: 600; color: var(--text-3); }
.fk-drobky a { color: var(--text-3); }
.fk-drobky a:hover { color: var(--kava); }
.fk-drobky [aria-current] { color: var(--kava); }
.fk-hero-in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 56px; align-items: center; margin-top: 40px; }
.fk-hero.siroka .fk-hero-in { grid-template-columns: minmax(0, 1fr); gap: 8px; }
.fk-hero.siroka .fk-hero-text { max-width: 820px; }
.fk-nadtitulek { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.fk-hero-nadpis { margin-top: 16px; font-size: clamp(36px, 3.8vw, 52px); line-height: 1.04; letter-spacing: -0.035em; }
.fk-body { display: flex; flex-direction: column; gap: 10px; margin-top: 24px; }
.fk-body li { display: flex; align-items: flex-start; gap: 10px; font-size: 16px; font-weight: 600; line-height: 1.45; }
.fk-body svg { flex: none; margin-top: 2px; color: #1C7A34; }
.fk-hero-tl { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; margin-top: 32px; }
.fk-hero-tl .odkaz-sipka { color: var(--kava); }
.fk-hero-tl .odkaz-sipka:hover { color: var(--cervena-text); }
.fk-ukazka { margin: 0; min-width: 0; }
.fk-ukazka .admst-scena { justify-self: start; }
.fk-ukazka figcaption { margin-top: 10px; font-size: 13px; color: var(--text-3); }
.fk-hero.siroka .fk-ukazka figcaption { text-align: center; }
.fk-hero.siroka .scena { margin-top: 32px; }
/* Aplikace: ze scény webu klubu jen telefon (jako .scena na mobilu v portal.css) */
.fk-jen-telefon { display: flex; justify-content: center; }
.fk-jen-telefon .scena { zoom: 1; width: 280px; height: 580px; margin: 0; }
.fk-jen-telefon .prohlizec { display: none; }
.fk-jen-telefon .telefon { left: 0; top: 0; }
.fk-hero:has(.fk-jen-telefon) .fk-ukazka figcaption { text-align: center; }

/* ---------- obrazovky administrace 2. části (views/portal/ukazky/obrazovka.php) — doplněk ke třídám ua-* z administrace.css ---------- */
.ua .ua-chip.on { background: var(--kava); color: #fff; }
.fk-ua-filtr { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.fk-ua-mezera { width: 10px; }
.fk-ua-procento { display: flex; align-items: center; gap: 7px; }
.fk-ua-procento .ua-pruh { flex: 1; min-width: 60px; margin: 0; }
.fk-ua-procento b { font-size: 10px; min-width: 30px; text-align: right; }
.fk-ua-skore { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 18px; border-radius: 14px; background: var(--kava); color: #fff; }
.fk-ua-skore small { display: block; font-size: 9.5px; color: var(--svetly-text); font-weight: 600; }
.fk-ua-skore b { font-size: 17px; font-weight: 800; }
.fk-ua-skore div:first-child b { color: #8FB8EC; }
.fk-ua-skore strong { font-size: 34px; font-weight: 800; letter-spacing: -.03em; color: var(--zluta); }
.fk-ua-skore .vpravo { text-align: right; }
.fk-ua-zapis { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 6px 0 10px; font-size: 12px; font-weight: 800; }
.fk-ua-zapis b { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border: 2px solid var(--kava); border-radius: 12px; font-size: 24px; }
.fk-ua-zapis em { font-style: normal; font-size: 22px; }
.ua-ar.fk-ua-nahoru { align-items: flex-start; }
.fk-ua-zprava { display: block; font-size: 10px; line-height: 1.4; color: var(--text-2); }
.fk-ua-smajliky { display: flex; align-items: center; gap: 6px; font-size: 9.5px; color: var(--text-3); font-weight: 600; }
.fk-ua-smajliky i { width: 18px; height: 18px; border-radius: 50%; background: var(--zluta); box-shadow: inset 0 -3px 0 rgba(25, 20, 17, .12); }
.fk-ua-obr { height: 74px; margin: 6px 0; border-radius: 10px; background: #1D4E89; box-shadow: inset 0 -26px 0 #173F70; }
.fk-ua-obr.vyssi { display: flex; align-items: center; justify-content: center; height: 150px; box-shadow: none; color: var(--zluta); }
.fk-ua-txt { display: flex; flex-direction: column; gap: 5px; margin: 6px 0; }
.fk-ua-txt i { display: block; height: 6px; border-radius: 99px; background: #EADCC6; }
.fk-ua-txt i.kratka { width: 60%; }
.fk-ua-vlozka { display: flex; align-items: center; gap: 9px; margin: 6px 0; padding: 7px 9px; border: 1px solid #EADCC6; border-left: 3px solid var(--cervena); border-radius: 10px; background: var(--krem); font-size: 10.5px; }
.fk-ua-fotky { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.fk-ua-fotky.tri { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fk-ua-fotky i, .fk-ua-nahl { display: block; aspect-ratio: 4 / 3; border-radius: 8px; background: #1D4E89; }
.fk-ua-nahl { width: 34px; flex: none; }
.fk-ua-fotky i.a, .fk-ua-nahl.a { background: #1D4E89; }
.fk-ua-fotky i.b, .fk-ua-nahl.b { background: #E08A1E; }
.fk-ua-fotky i.c, .fk-ua-nahl.c { background: #1C7A34; }
.fk-ua-fotky i.d, .fk-ua-nahl.d { background: #C0301A; }
.fk-ua-fotky i.e, .fk-ua-nahl.e { background: #5C5046; }
.fk-ua-volby { display: flex; flex-direction: column; gap: 6px; margin: 8px 0 10px; font-size: 11px; font-weight: 600; }
.fk-ua-volby span { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border: 1px solid #EADCC6; border-radius: 10px; }
.fk-ua-volby i { width: 13px; height: 13px; border: 2px solid var(--text-3); border-radius: 50%; }
.fk-ua-volby .on { border-color: var(--kava); }
.fk-ua-volby .on i { border: 4px solid var(--kava); }
.fk-ua-logo { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 24px; border-radius: 6px; color: #fff; font-size: 9px; font-weight: 800; letter-spacing: .04em; }
.fk-ua-logo.a { background: #B5620A; } .fk-ua-logo.b { background: #1D4E89; } .fk-ua-logo.c { background: #1C7A34; } .fk-ua-logo.d { background: #C0301A; }
.fk-ua-paticka { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 12px; border-radius: 14px; background: var(--kava); color: var(--svetly-text); text-align: center; }
.fk-ua-paticka small { font-size: 9.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--zluta); }
.fk-ua-paticka div { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.fk-ua-paticka em { font-style: normal; font-size: 9px; }
.fk-ua-prava { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.fk-ua-prava.jeden { grid-template-columns: minmax(0, 1fr); }
.fk-ua-prava > div { display: flex; flex-direction: column; gap: 6px; }
.fk-ua-prava small { font-size: 8.5px; font-weight: 800; letter-spacing: .1em; color: var(--text-3); }
.fk-ua-prava span { display: flex; align-items: center; gap: 6px; font-size: 10.5px; font-weight: 600; }
.fk-ua-ch { position: relative; width: 14px; height: 14px; flex: none; border-radius: 4px; background: var(--kava); }
.fk-ua-ch::after { content: ""; position: absolute; left: 4.5px; top: 1.5px; width: 4px; height: 7px; border: solid var(--zluta); border-width: 0 2px 2px 0; transform: rotate(45deg); }
.fk-ua-ch.ne { background: #fff; box-shadow: inset 0 0 0 1.5px var(--linka-2); }
.fk-ua-ch.ne::after { display: none; }

/* ---------- stránka funkce: co umí ---------- */
.fk-vyhody { border-top: 1px solid var(--linka); border-bottom: 1px solid var(--linka); background: #fff; }
.fk-vyhody .nadpis-2 { max-width: 820px; }
.fk-vyhody-mriz { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 40px; }
.fk-vyhoda { padding: 26px; border: 1px solid var(--krem-2); border-radius: 22px; background: var(--krem); }
.fk-vyhoda .ikona { width: 46px; height: 46px; border-radius: 14px; }
.fk-vyhoda h3 { margin-top: 18px; font-size: 19px; letter-spacing: -0.01em; }
.fk-vyhoda p { margin-top: 8px; font-size: 15.5px; line-height: 1.5; color: var(--text-3); }

/* ---------- stránka funkce: jak to funguje (třídy .jak/.kroky z portal.css) ---------- */
.fk-kroky .kroky { margin-top: 40px; }
.fk-kroky .krok { min-height: 0; }

/* ---------- stránka funkce: ve kterém tarifu (i komponenta f-tarif) ---------- */
.fk-tarif { background: var(--krem-2); scroll-margin-top: 80px; }
.fk-tarif .odkaz-sipka { color: var(--kava); }
.fk-tarif .odkaz-sipka:hover { color: var(--cervena-text); }
.fk-tarify { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 36px; }
.fk-tarif-karta { display: flex; flex-direction: column; gap: 10px; padding: 26px; border: 1px solid var(--linka); border-radius: 22px; background: #fff; }
.fk-tarif-karta.hlavni { border: 2px solid var(--cervena); }
.fk-tarif-karta h3 { font-size: 22px; }
.fk-tarif-cena { color: var(--text-2); font-size: 15px; }
.fk-tarif-cena b { color: var(--kava); font-size: 18px; }
.fk-tarif-radky { display: flex; flex: 1 1 auto; flex-direction: column; gap: 10px; margin: 8px 0 12px; }
.fk-tarif-radky li { display: flex; align-items: flex-start; gap: 10px; font-size: 15px; line-height: 1.45; }
.fk-tarif-radky li.ne { color: var(--text-3); }
.fk-ano, .fk-ne { display: inline-flex; flex: none; margin-top: 1px; }
.fk-ano { color: #1C7A34; }
.fk-ne { margin-top: 2px; color: var(--cervena-text); }
.fk-hodnota { flex: none; min-width: 58px; font-weight: 800; }
.fk-tarif-karta .tl { margin-top: auto; }
.fk-tarif-pozn { margin-top: 22px; font-size: 15px; color: var(--text-2); }

/* ---------- stránka funkce: časté otázky (.otazky z portal.css), související ---------- */
.fk-otazky-in { display: grid; grid-template-columns: minmax(0, 400px) minmax(0, 760px); justify-content: space-between; gap: 40px; }
.fk-otazky h2 { margin-top: 16px; font-size: clamp(30px, 3.2vw, 42px); line-height: 1.08; letter-spacing: -0.02em; }
.fk-souvisi { border-top: 1px solid var(--linka); background: #fff; }
.fk-souvisi .fk-sekce-in { padding-top: 64px; padding-bottom: 64px; }
.fk-souvisi h2 { font-size: clamp(26px, 2.4vw, 32px); letter-spacing: -0.02em; }
.fk-souvisi-mriz { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 24px; }
.fk-souvisi-karta { --fk-ik-x: 42px; --fk-ik-y: 50%; position: relative; display: flex; align-items: center; gap: 14px; padding: 20px; border: 1px solid var(--linka); border-radius: 20px; background: var(--krem); }
.fk-souvisi-karta .ikona { flex: none; width: 44px; height: 44px; border-radius: 14px; }
.fk-souvisi-karta > span:last-child { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.fk-souvisi-karta a, .fk-souvisi-karta b { font-size: 17px; font-weight: 800; }
.fk-vse { margin-top: 24px; }
.fk-vyzva { margin-top: 72px; }

@media (prefers-reduced-motion: reduce) {
  /* bez pohybu: karta se nezvedá a vlna se nerozlévá — tmavá barva naskočí hned */
  .fk-karta.s-odkazem, .fk-souvisi-karta:has(.fk-karta-odkaz) { transform: none !important; }
  .fk-karta.s-odkazem::before, .fk-souvisi-karta:has(.fk-karta-odkaz)::before { transition: none !important; }
}

/* ========== tablet ========== */
@media (max-width: 1099px) {
  .fk-sekce-in { padding-top: 64px; padding-bottom: 64px; }
  .fk-hero-in { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .fk-ukazka { justify-self: center; }
  .fk-vyhody-mriz, .fk-tarify, .fk-cenik-tarify { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fk-otazky-in { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .fk-souvisi-mriz { grid-template-columns: minmax(0, 1fr); }
}

/* ========== mobil ========== */
@media (max-width: 759px) {
  .fk-prehled { padding-top: 40px; }
  .fk-sekce-in { padding-top: 48px; padding-bottom: 48px; }
  .fk-skupiny { padding-bottom: 48px; }
  .fk-karty { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .fk-karta { --fk-ik-x: 44px; --fk-ik-y: 44px; min-height: 0; padding: 20px; }
  .fk-hero { padding-bottom: 48px; }
  .fk-hero-in { margin-top: 24px; gap: 28px; }
  .fk-hero-tl .tl { width: 100%; }
  .fk-ukazka { justify-self: stretch; }
  .fk-ukazka .admst-scena { display: flex; justify-content: center; justify-self: stretch; }   /* z okna a telefonu zbude telefon (administrace.css) */
  .fk-ukazka figcaption { text-align: center; }
  .fk-vyhody-mriz, .fk-tarify, .fk-cenik-tarify { grid-template-columns: minmax(0, 1fr); }
  .fk-vyhoda { padding: 20px; }
  .fk-tarif-karta.hlavni { order: -1; }
  .fk-vyzva { margin-top: 48px; }
}