/* ===== FIREMNÍ ZÁLOŽNA — page styles (loads after cfg-base.css + brand.css) ===== */

html,
body {
  overflow-x: hidden;
}

/* Nav je position: fixed / 88px vysoký (cfg-base.css) — bez tohoto by skok na
   #kalkulacka, #zajisteni apod. schoval nadpis sekce pod lištu. */
html {
  scroll-padding-top: 104px;
}

body {
  background: var(--bg-white);
  color: var(--text-body);
}

/* Accessibility basics */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 999;
  background: var(--brand-accent);
  color: #fff;
  padding: 12px 20px;
  border-radius: 0 0 var(--fz-r) 0;
  font-family: var(--f-ui);
}

.skip-link:focus {
  left: 0;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--brand-accent);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Reveal-on-scroll (subtle, banka-light) */
.reveal {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity .5s ease, transform .5s ease;
}

.reveal.is-visible {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
  }

  .fz-param.is-visible .fz-param__ic,
  .fz-param.is-visible .fz-param__ic::before,
  .fz-param.is-visible .fz-param__ic svg,
  .fz-reason.is-visible .fz-reason__icon,
  .fz-reason.is-visible .fz-reason__icon svg,
  .fz-zajisteni__col.is-visible .fz-zajisteni__ic--lg {
    animation: none;
    filter: none;
  }

  .fz-param.is-visible .fz-param__ic,
  .fz-param.is-visible .fz-param__ic svg {
    color: #fff;
  }

  .fz-param.is-visible .fz-param__ic::before {
    opacity: 1;
  }
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ===== ANIMACE — hero grafika + text při každém načtení stránky ===== */
@keyframes fzFadeUp {
  from {
    opacity: 0;
    transform: translateY(18px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes fzGrowBar {
  from {
    transform: scaleY(0);
  }

  to {
    transform: scaleY(1);
  }
}

@keyframes fzDraw {
  from {
    stroke-dashoffset: 700;
  }

  to {
    stroke-dashoffset: 0;
  }
}

@keyframes fzPop {
  from {
    opacity: 0;
    transform: translateY(12px) scale(.95);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes fzBob {
  from {
    transform: translateY(0);
  }

  to {
    transform: translateY(-7px);
  }
}

/* naskočení kruhu ikony s mírným přestřelením (karty důvodů) */
@keyframes fzIconIn {
  0% {
    opacity: 0;
    transform: scale(.5);
  }

  62% {
    opacity: 1;
    transform: scale(1.09);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

/* parametry: ikona se z šedé vybarví do značky */
@keyframes fzParamTint {
  0% {
    filter: grayscale(1);
    transform: scale(.72);
  }

  58% {
    filter: grayscale(.15);
    transform: scale(1.08);
  }

  100% {
    filter: none;
    transform: scale(1);
  }
}

@keyframes fzParamFillIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* piktogram uvnitř kruhu doskočí o chvilku později */
@keyframes fzGlyphIn {
  from {
    opacity: 0;
    transform: scale(.6) rotate(-10deg);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes fzSpin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes fzPulse {

  0%,
  100% {
    opacity: .2;
  }

  50% {
    opacity: .45;
  }
}

/* texty hero (homepage) */
.fz-hero__kicker,
.fz-hero h1,
.fz-hero__sub,
.fz-hero__ctas,
.fz-hero__trust,
.fz-hero__note {
  animation: fzFadeUp .6s var(--ease-out) both;
}

.fz-hero h1 {
  animation-delay: .06s;
}

.fz-hero__sub {
  animation-delay: .12s;
}

.fz-hero__ctas {
  animation-delay: .22s;
}

.fz-hero__trust {
  animation-delay: .32s;
}

.fz-hero__note {
  animation-delay: .4s;
}

/* texty pagehero (podstránky) — animují se při každém přechodu na stránku */
.fz-pagehero .fz-kicker {
  animation: fzFadeUp .5s var(--ease-out) both;
}

.fz-pagehero h1 {
  animation: fzFadeUp .6s var(--ease-out) .08s both;
}

.fz-pagehero__sub {
  animation: fzFadeUp .6s var(--ease-out) .18s both;
}

.fz-pagehero .fz-hero__trust {
  animation: fzFadeUp .6s var(--ease-out) .26s both;
}

.fz-pagehero .fz-hero__note {
  animation: fzFadeUp .6s var(--ease-out) .34s both;
}

/* hero grafika */
.fz-hero__art .fz-bar {
  transform-box: fill-box;
  transform-origin: center bottom;
  animation: fzGrowBar .8s cubic-bezier(.2, .7, .3, 1) both;
}

.fz-hero__art .fz-bar--1 {
  animation-delay: .35s;
}

.fz-hero__art .fz-bar--2 {
  animation-delay: .5s;
}

.fz-hero__art .fz-bar--3 {
  animation-delay: .65s;
}

.fz-hero__art .fz-bar--4 {
  animation-delay: .8s;
}

.fz-hero__art .fz-line {
  stroke-dasharray: 700;
  stroke-dashoffset: 700;
  animation: fzDraw 1.3s ease .9s forwards;
}

/* šipka jede celá po křivce odspodu nahoru spolu s kreslením čáry;
   fallback bez offset-path: objeví se rovnou na konci čáry */
.fz-hero__art .fz-arrow {
  opacity: 0;
  transform: translate(396px, 60px) rotate(-26deg);
  animation: fzAppear .3s ease 2.1s forwards;
}

@supports (offset-path: path("M0 0 L10 10")) {
  .fz-hero__art .fz-arrow {
    transform: none;
    offset-path: path("M58 240 C140 220 180 168 232 138 C284 108 330 92 396 60");
    offset-rotate: auto;
    animation: fzAppear .15s ease .9s forwards, fzRide 1.3s ease .9s both;
  }
}

@keyframes fzRide {
  from {
    offset-distance: 0%;
  }

  to {
    offset-distance: 100%;
  }
}

.fz-hero__art .fz-chip {
  transform-box: fill-box;
  animation: fzPop .5s ease both, fzBob 3.2s ease-in-out infinite alternate;
}

.fz-hero__art .fz-chip--1 {
  animation-delay: 1.5s, 2.2s;
}

.fz-hero__art .fz-chip--2 {
  animation-delay: 1.65s, 2.6s;
}

/* kroužky na pozadí se objeví až po dokreslení šipky (~2.45s) */
.fz-hero__art .fz-ring {
  transform-box: fill-box;
  transform-origin: center;
  opacity: 0;
  animation: fzAppear .6s ease 2.5s forwards, fzSpin 60s linear infinite;
}

.fz-hero__art .fz-pulse {
  opacity: 0;
  animation: fzAppearPulse .6s ease 2.6s forwards, fzPulse 4s ease-in-out 3.4s infinite;
}

@keyframes fzAppear {
  to {
    opacity: 1;
  }
}

@keyframes fzAppearPulse {
  to {
    opacity: .25;
  }
}

@media (prefers-reduced-motion: reduce) {

  .fz-hero__kicker,
  .fz-hero h1,
  .fz-hero__sub,
  .fz-hero__ctas,
  .fz-hero__trust,
  .fz-hero__note,
  .fz-pagehero .fz-kicker,
  .fz-pagehero h1,
  .fz-pagehero__sub,
  .fz-hero__art .fz-bar,
  .fz-hero__art .fz-chip,
  .fz-hero__art .fz-ring,
  .fz-hero__art .fz-pulse {
    animation: none !important;
  }

  .fz-hero__art .fz-line {
    animation: none !important;
    stroke-dashoffset: 0;
  }

  .fz-hero__art .fz-arrow {
    animation: none !important;
    opacity: 1;
    offset-path: none !important;
    transform: translate(396px, 60px) rotate(-26deg);
  }

  .fz-hero__art .fz-ring {
    opacity: 1;
  }

  .fz-hero__art .fz-pulse {
    opacity: .25;
  }
}

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-family: var(--f-head);
  font-size: 16px;
  font-weight: 700;
  padding: 16px 28px;
  border-radius: var(--r-pill);
  border: none;
  min-height: 52px;
  max-width: 100%;
  box-sizing: border-box;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
  transition: opacity .2s, transform .15s;
}

.btn:active {
  transform: scale(.97);
  transition: transform var(--dur-fast) var(--ease-out);
}

.btn--primary {
  background: var(--fz-grad);
  color: #fff;
}

.btn--primary:hover {
  opacity: .9;
  transform: translateY(-1px);
}

.btn--ghost {
  background: transparent;
  color: inherit;
  border: 1.5px solid rgba(var(--brand-text-on-dark-rgb), .35);
}

.btn--ghost:hover {
  border-color: rgba(var(--brand-text-on-dark-rgb), .7);
}

.btn--ghost-dark {
  background: transparent;
  color: var(--text-dark);
  border: 1.5px solid var(--divider-dark);
}

.btn--ghost-dark:hover {
  border-color: var(--text-dark);
}

.icon {
  width: 22px;
  height: 22px;
  stroke: currentColor;
  stroke-width: 1.8;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex-shrink: 0;
}

/* ===== NAV additions (light: bílý nav, tmavý text) ===== */
.nav {
  border-bottom: 1px solid rgba(28, 34, 40, .08);
  height: auto;
  min-height: 88px;
  overflow: visible;
}

.nav__inner {
  min-height: 88px;
  overflow: visible;
}

.nav__item {
  color: var(--text-dark);
}

.nav__item.nav__cta {
  color: #fff;
  white-space: nowrap;
}

/* logo FZ + CFG badge vlevo vedle sebe */
.nav__brand {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
  flex-shrink: 0;
}

.nav__logo img {
  width: 140px;
  height: auto;
}

.nav__cfg-badge {
  font-size: 9px;
  gap: 2px;
  padding-left: 16px;
  margin-left: 0;
}

.nav__cfg-badge img {
  width: 44px;
}

/* kompaktní odkazy — vše na jeden řádek */
.nav__links {
  gap: 26px;
}

.nav__item {
  font-size: 14.5px;
  white-space: nowrap;
}

.nav__cta {
  padding: 10px 18px;
  background: var(--fz-grad);
  color: #fff;
  border: none;
  transition: opacity .2s ease, transform .2s ease;
}

.nav__item.nav__cta:hover {
  opacity: .9;
  transform: translateY(-1px);
}

/* footer submit — stejný gradient jako .btn--primary */
.footer__submit {
  background: var(--fz-grad);
  color: #fff;
  border: none;
  transition: opacity .2s ease, transform .2s ease;
}

.footer__submit:hover {
  opacity: .9;
  transform: translateY(-1px);
}

.nav__lang {
  font-family: var(--f-ui);
  font-size: 13px;
  font-weight: 600;
  color: rgba(var(--brand-text-on-dark-rgb), .7);
  padding: 6px 10px;
  border: 1px solid rgba(var(--brand-text-on-dark-rgb), .25);
  border-radius: var(--r-pill);
  transition: opacity .2s;
}

.nav__lang:hover {
  opacity: .7;
}

.nav__burger {
  display: none;
  background: none;
  border: none;
  width: 48px;
  height: 48px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.nav__burger span {
  display: block;
  width: 26px;
  height: 2.5px;
  background: var(--text-dark);
  border-radius: 2px;
  transition: transform .25s, opacity .25s;
}

/* telefon v navigaci (desktop + mobilní menu) */
.nav__actions {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
}

.nav__actions .nav__phone {
  align-self: center;
}

.nav__phone {
  display: none;
  font-family: var(--f-head);
  font-weight: 600;
  font-size: 16px;
  color: var(--text-dark);
  flex-shrink: 0;
  text-decoration: none;
  line-height: 1.25;
}

.nav__phone:hover {
  opacity: .85;
}

.nav__phone.fz-hours-phone,
.nav__phone.fz-hours-phone--stacked {
  flex-direction: row;
  align-items: center;
  gap: 8px;
  width: auto;
  overflow: visible;
}

.nav__phone__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  color: inherit;
}

.nav__phone__icon svg {
  display: block;
  width: 16px;
  height: 16px;
  color: var(--fz-accent-dark);
}

html[data-fz-hours="closed"] .nav__phone__icon svg {
  color: inherit;
}

.nav__phone__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0;
  min-width: 0;
}

.nav__phone .fz-hours-phone__main {
  display: block;
  line-height: 1.2;
  font-size: 16px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  white-space: nowrap;
  color: inherit;
}

.nav__phone .fz-hours-phone__sub {
  display: block !important;
  font-size: 10px;
  font-weight: 500;
  text-align: left;
  line-height: 1.25;
  white-space: nowrap;
  color: var(--text-muted);
  min-height: 1.25em;
}

html[data-fz-hours="closed"] .nav__phone .fz-hours-phone__sub {
  color: var(--text-muted);
}

html[data-fz-hours="open"] .nav__phone .fz-hours-phone__sub {
  color: var(--fz-accent-dark);
  font-weight: 600;
}

.nav__phone svg {
  color: inherit;
}

@media (min-width: 1025px) {
  .nav__links {
    flex: 1;
    justify-content: flex-end;
  }

  .nav__actions {
    margin-left: 20px;
  }

  .nav__links .nav__phone--mobile {
    display: none !important;
  }

  .nav__actions .nav__phone:not(.nav__phone--mobile) {
    display: inline-flex;
  }

  .nav__links .nav__cta--mobile {
    display: none !important;
  }
}

@media (max-width: 1024px) {
  .nav__actions .nav__phone {
    display: none !important;
  }

  .nav__actions {
    gap: 8px;
  }

  /* CTA stays in the header bar; hide the duplicate inside the drawer. */
  .nav__actions .nav__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 14px;
    min-height: 44px;
    font-size: 13px;
  }

  .nav__links .nav__cta--mobile {
    display: none !important;
  }

  .nav__links .nav__phone--mobile {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    padding: 16px 4px;
    min-height: 48px;
    border-bottom: 1px solid rgba(var(--brand-text-on-dark-rgb), .12);
    font-size: 18px;
    color: var(--brand-text-on-dark);
  }

  .nav__links .nav__phone--mobile .nav__phone__icon svg {
    width: 16px;
    height: 16px;
  }

  .nav__links .nav__phone--mobile .fz-hours-phone__main {
    font-size: 18px;
  }

  .nav__links .nav__phone--mobile .nav__phone__text {
    align-items: flex-start;
  }

  .nav__links .nav__phone--mobile .fz-hours-phone__sub {
    color: var(--text-muted);
  }

  html[data-fz-hours="open"] .nav__links .nav__phone--mobile .fz-hours-phone__sub {
    color: rgba(var(--fz-accent-rgb), .92);
  }
}

/* telefonní CTA podle pracovní doby (data-fz-hours na <html>) */
.fz-hours-phone {
  transition: color .16s ease, background-color .16s ease;
}

.fz-hours-phone--stacked:not(.nav__phone) {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  width: max-content;
  max-width: 100%;
  gap: 2px;
  line-height: 1.25;
}

.fz-hours-phone__main {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.fz-hours-phone__sub {
  font-family: var(--f-body);
  font-size: 12px;
  font-weight: 500;
  color: var(--text-muted);
  line-height: 1.3;
  text-align: right;
  align-self: flex-end;
  display: block;
  min-height: 1.3em;
}

.fz-hours-phone__sub[hidden] {
  display: none;
}

html[data-fz-hours="closed"] .nav__phone,
html[data-fz-hours="closed"] .fz-deptcard__row[href^="tel:"],
html[data-fz-hours="closed"] .fz-agent__phone,
html[data-fz-hours="closed"] .fz-agent__id,
html[data-fz-hours="closed"] .fz-precta__spec-phone,
html[data-fz-hours="closed"] .fz-infobox__phone,
html[data-fz-hours="closed"] a.btn[href^="tel:"] {
  color: var(--text-muted);
}

html[data-fz-hours="closed"] .fz-agent__id span {
  color: var(--text-muted);
}

html[data-fz-hours="closed"] .fz-deptcard__row[href^="tel:"] svg,
html[data-fz-hours="closed"] a.btn[href^="tel:"] svg {
  color: inherit;
}

html[data-fz-hours="open"] .nav__phone .fz-hours-phone__sub,
html[data-fz-hours="open"] .fz-deptcard__row .fz-hours-phone__sub,
html[data-fz-hours="open"] .fz-agent__phone .fz-hours-phone__sub,
html[data-fz-hours="open"] .fz-agent__id .fz-hours-phone__sub,
html[data-fz-hours="open"] .fz-precta__spec-phone .fz-hours-phone__sub,
html[data-fz-hours="open"] .fz-infobox__phone .fz-hours-phone__sub,
html[data-fz-hours="open"] a.btn[href^="tel:"] .fz-hours-phone__sub {
  color: var(--fz-accent-dark);
}

.fz-deptcard__row.fz-hours-phone--stacked {
  flex-direction: column;
  align-items: flex-end;
  width: max-content;
  max-width: 100%;
  margin-inline: auto;
  gap: 2px;
}

.fz-deptcard__row .fz-hours-phone__main {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: inherit;
}

.fz-deptcard__row .fz-hours-phone__sub {
  font-weight: 500;
  text-align: right;
  width: auto;
}


.fz-infobox__phone.fz-hours-phone--stacked {
  align-items: flex-start;
  gap: 2px;
}

.fz-infobox__phone .fz-hours-phone__sub {
  text-align: left;
  font-size: 13px;
}

.fz-precta__spec-phone.fz-hours-phone--stacked {
  display: grid;
  grid-template-columns: auto auto;
  grid-template-rows: auto auto;
  column-gap: 10px;
  row-gap: 2px;
  align-items: center;
  justify-items: end;
  width: max-content;
  max-width: 100%;
  margin-top: 0;
  padding: 0;
  text-decoration: none;
  transition: color .15s ease;
}

.fz-precta__spec-phone .fz-hours-phone__main {
  grid-row: 1;
  grid-column: 2;
  display: block;
  font-family: var(--f-head);
  font-size: clamp(20px, 5.2vw, 28px);
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.15;
  color: #fff;
  white-space: normal;
}

.fz-precta__spec-phone .fz-precta__spec-ic {
  grid-row: 1;
  grid-column: 1;
  align-self: center;
  width: 20px;
  height: 20px;
  color: rgba(255, 255, 255, .72);
}

.fz-precta__spec-phone .fz-hours-phone__sub {
  grid-row: 2;
  grid-column: 2;
  text-align: right;
  font-family: var(--f-ui);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.35;
  color: var(--fz-on-dark-soft);
}

.fz-precta__spec-phone:hover .fz-hours-phone__main {
  color: #e8e4ff;
}

.fz-precta__spec-phone:hover .fz-precta__spec-ic {
  color: rgba(255, 255, 255, .9);
}

a.btn.fz-hours-phone--stacked {
  align-items: flex-end;
  width: max-content;
  max-width: 100%;
  gap: 4px;
  line-height: 1.2;
}

a.btn.fz-hours-phone--stacked .fz-hours-phone__sub {
  font-size: 12px;
  font-weight: 500;
  opacity: .9;
  text-align: right;
}

html[data-fz-hours="closed"] a.btn[href^="tel:"] .fz-hours-phone__sub {
  color: inherit;
  opacity: .85;
}

.fz-agent__phone.fz-hours-phone--stacked,
.fz-agent__id.fz-hours-phone--stacked {
  align-items: flex-start;
  gap: 2px;
}

.fz-agent__id.fz-hours-phone--stacked .fz-hours-phone__main {
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  line-height: 1.25;
}

.fz-agent__dot.is-offline {
  background: #9aa3ab;
}

html[data-fz-hours="closed"] .fz-agent__bar {
  box-shadow: 0 10px 30px rgba(21, 16, 31, .14);
}

/* těsné desktopy — ještě kompaktnější, ať se řádek nezlomí */
@media (max-width: 1280px) and (min-width: 1025px) {
  .nav__links {
    gap: 18px;
  }

  .nav__item {
    font-size: 13.5px;
  }

  .nav__cta {
    padding: 9px 14px;
  }

  .nav__logo img {
    width: 120px;
  }
}

/* Mobile drawer */
@media (max-width: 1024px) {
  .nav__links {
    position: fixed;
    inset: 88px 0 0 0;
    background: var(--brand-darker);
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 24px 24px calc(24px + env(safe-area-inset-bottom));
    transform: translateX(100%);
    transition: transform .28s var(--ease-drawer);
    overflow-y: auto;
    z-index: 99;
  }

  .nav.is-open .nav__links {
    transform: none;
  }

  .nav__links .nav__item {
    display: flex;
    padding: 16px 4px;
    min-height: 48px;
    border-bottom: 1px solid rgba(var(--brand-text-on-dark-rgb), .12);
    font-size: 18px;
  }

  .nav__links .nav__cta {
    display: none;
  }

  .nav__links .nav__cfg-badge {
    border-left: none;
    padding: 24px 4px 0;
    margin: 8px 0 0;
  }

  .nav__links .nav__lang {
    align-self: flex-start;
    margin-top: 20px;
  }

  .nav__burger {
    display: flex;
  }

  .nav.is-open .nav__burger span:nth-child(1) {
    transform: translateY(8.5px) rotate(45deg);
  }

  .nav.is-open .nav__burger span:nth-child(2) {
    opacity: 0;
  }

  .nav.is-open .nav__burger span:nth-child(3) {
    transform: translateY(-8.5px) rotate(-45deg);
  }

  body.menu-open {
    overflow: hidden;
  }
}

@media (max-width: 640px) {

  /* override base: keep items, drawer handles them */
  .nav__links .nav__item:not(.nav__cta) {
    display: flex;
  }

  .nav__actions .nav__cta {
    padding: 9px 12px;
    font-size: 12.5px;
  }

  .nav__logo img {
    width: 112px;
  }

  .nav__cfg-badge {
    padding-left: 12px;
  }

  .nav__cfg-badge img {
    width: 36px;
  }
}

/* ===== HERO ===== */
.fz-hero {
  background: linear-gradient(180deg, #ffffff 0%, var(--fz-hero-end) 100%);
  padding: calc(88px + 32px) var(--px) 88px;
  position: relative;
  overflow: hidden;
}

.fz-hero__inner {
  max-width: var(--max-w);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 440px);
  gap: 40px 56px;
  align-items: center;
  position: relative;
  z-index: 1;
}

.fz-hero__copy {
  min-width: 0;
}

.fz-hero__kicker {
  margin-bottom: 14px;
}

.fz-hero h1 {
  font-family: var(--f-head);
  font-size: clamp(32px, 4.6vw, 48px);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -1.6px;
  color: var(--brand-text-on-dark);
  text-wrap: balance;
  overflow-wrap: anywhere;
}

@media (min-width: 1025px) {
  .fz-hero h1 {
    font-size: clamp(32px, 2.8vw, 44px);
  }
}

.fz-hero h1 em {
  font-style: normal;
  background: var(--fz-grad-light);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.fz-hero__sub {
  margin-top: 18px;
  font-size: clamp(16px, 1.4vw, 18px);
  line-height: 1.55;
  color: var(--text-body);
  max-width: 42em;
}

.fz-hero__ctas {
  margin-top: 36px;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.fz-hero__trust {
  margin-top: 40px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.fz-trust-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--f-ui);
  font-size: 13.5px;
  font-weight: 600;
  color: rgba(var(--brand-text-on-dark-rgb), .9);
  background: rgba(var(--brand-text-on-dark-rgb), .07);
  border: 1px solid rgba(var(--brand-text-on-dark-rgb), .14);
  padding: 9px 14px;
  border-radius: var(--r-pill);
}

.fz-trust-chip .icon {
  width: 17px;
  height: 17px;
  color: var(--fz-accent-dark);
}

/* na pagehero podstránek jen těsnější odsazení, vzhled štítků je stejný */
.fz-pagehero .fz-hero__trust {
  margin-top: 28px;
}

/* homepage – tři claimy jen v levém sloupci, vedle kalkulačky */
.fz-hero__trust.fz-hero__trust--stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  align-items: stretch;
  width: 100%;
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid rgba(var(--brand-text-on-dark-rgb), .1);
}

.fz-pagehero .fz-hero__trust.fz-hero__trust--stats {
  margin-top: 28px;
  padding-top: 24px;
}

.fz-hero__stat {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
  height: 100%;
  padding: 0 16px;
}

.fz-hero__stat:first-child {
  padding-left: 0;
}

.fz-hero__stat:last-child {
  padding-right: 0;
}

.fz-hero__stat + .fz-hero__stat {
  border-left: 1px solid rgba(var(--brand-text-on-dark-rgb), .1);
}

.fz-hero__stat-ic {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--fz-grad-soft);
  color: var(--fz-accent-dark);
}

.fz-hero__stat-ic svg {
  width: 20px;
  height: 20px;
  stroke: currentColor;
  stroke-width: 1.8;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.fz-hero__stat-num {
  font-family: var(--f-head);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -.2px;
  color: var(--brand-text-on-dark);
  min-height: 1.25em;
}

.fz-hero__stat-num em {
  font-style: normal;
}

.fz-hero__stat-desc {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--text-muted);
}

@media (max-width: 1280px) and (min-width: 1025px) {
  /* benefity sedí v levém sloupci vedle kalkulačky — 3 sloupce tam přetékají */
  .fz-hero__copy .fz-hero__trust--stats {
    grid-template-columns: 1fr;
  }

  .fz-hero__copy .fz-hero__stat,
  .fz-hero__copy .fz-hero__stat:first-child,
  .fz-hero__copy .fz-hero__stat:last-child {
    padding: 14px 0;
  }

  .fz-hero__copy .fz-hero__stat + .fz-hero__stat {
    border-left: 0;
    border-top: 1px solid rgba(var(--brand-text-on-dark-rgb), .1);
  }

  .fz-hero__copy .fz-hero__stat:first-child {
    padding-top: 0;
  }

  .fz-hero__copy .fz-hero__stat:last-child {
    padding-bottom: 0;
  }
}

@media (max-width: 900px) {
  .fz-hero__trust.fz-hero__trust--stats {
    grid-template-columns: 1fr;
    gap: 0;
    margin-top: 8px;
    padding-top: 24px;
  }

  .fz-hero__stat,
  .fz-hero__stat:first-child,
  .fz-hero__stat:last-child {
    padding: 16px 0;
  }

  .fz-hero__stat + .fz-hero__stat {
    border-left: 0;
    border-top: 1px solid rgba(var(--brand-text-on-dark-rgb), .1);
  }

  .fz-hero__stat:first-child {
    padding-top: 0;
  }

  .fz-hero__stat:last-child {
    padding-bottom: 0;
  }
}

.fz-hero__art {
  min-width: 0;
}

.fz-hero__art svg {
  width: 100%;
  height: auto;
  display: block;
}

.fz-hero__note {
  margin-top: 18px;
  font-size: 13px;
  color: var(--text-muted);
}

/* stejná poznámka na světlém pagehero podstránek */
.fz-pagehero .fz-hero__note {
  color: var(--text-muted);
}

@media (max-width: 1024px) {
  .fz-hero__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .fz-hero__art {
    max-width: 480px;
  }
}

@media (max-width: 640px) {
  .fz-hero {
    padding-top: calc(88px + 18px);
    padding-bottom: 56px;
  }

  .fz-hero__ctas .btn {
    width: 100%;
  }
}

/* ===== NUMBERS (počítadla) ===== */
.fz-numbers {
  background: var(--brand-darker);
  padding: clamp(40px, 5vw, 56px) var(--px);
}

.fz-numbers__inner {
  max-width: var(--max-w);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}

.fz-num {
  text-align: left;
}

.fz-num__val {
  font-family: var(--f-head);
  font-size: clamp(22px, 2.4vw, 36px);
  font-weight: 600;
  letter-spacing: -.6px;
  color: var(--brand-text-on-dark);
  line-height: 1.1;
  display: block;
  overflow-wrap: anywhere;
}

.fz-num__val em {
  font-style: normal;
  background: var(--fz-grad-light);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.fz-num__label {
  display: block;
  margin-top: 8px;
  font-size: 14.5px;
  color: var(--text-muted);
}

@media (max-width: 1024px) {
  .fz-numbers__inner {
    grid-template-columns: repeat(2, 1fr);
  }

  .fz-numbers__inner--3 {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 768px) {
  .fz-numbers__inner--3 {
    grid-template-columns: 1fr;
  }
}

/* ===== SECTION SHELL (light) ===== */
.fz-section {
  padding: var(--py) var(--px);
  background: var(--bg-white);
}

.fz-numbers__inner--3 {
  grid-template-columns: repeat(3, 1fr);
  max-width: 1040px;
}

/* tři klíčová čísla v jednom panelu — oddělené svislými linkami */
.fz-numbers--band {
  padding: clamp(48px, 5vw, 72px) var(--px);
  background: linear-gradient(180deg, var(--brand-darker) 0%, var(--brand-surface) 100%);
}

.fz-numbers--band .fz-numbers__inner--3 {
  position: relative;
  gap: 0;
  max-width: 1080px;
  background: var(--bg-white);
  border: 1px solid rgba(var(--fz-accent-rgb), .12);
  border-radius: 16px;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .8) inset,
    0 18px 50px rgba(55, 53, 127, .1);
  overflow: hidden;
}

.fz-numbers--band .fz-numbers__inner--3::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: var(--fz-grad);
  z-index: 1;
}

.fz-numbers--band .fz-num {
  position: relative;
  text-align: center;
  padding: clamp(28px, 3.5vw, 40px) clamp(14px, 2vw, 24px);
  transition: background-color .25s ease, transform .25s ease;
}

.fz-numbers--band .fz-num:hover {
  background: rgba(var(--fz-accent-rgb), .04);
}

.fz-numbers--band .fz-num + .fz-num::before {
  content: "";
  position: absolute;
  left: 0;
  top: 22%;
  bottom: 22%;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(var(--fz-accent-rgb), .18), transparent);
}

.fz-numbers--band .fz-num__val {
  font-size: clamp(22px, 2.4vw, 34px);
  font-weight: 700;
  letter-spacing: -.5px;
  line-height: 1.2;
  white-space: nowrap;
  overflow-wrap: normal;
  font-variant-numeric: tabular-nums;
}

.fz-numbers--band .fz-num__val--tight {
  font-size: clamp(20px, 2.2vw, 30px);
  letter-spacing: -.4px;
}

.fz-numbers--band .fz-num__label {
  margin-top: 10px;
  font-family: var(--f-body);
  font-size: 14px;
  line-height: 1.45;
  color: var(--text-muted);
  max-width: 22ch;
  margin-inline: auto;
}

@media (max-width: 900px) {
  .fz-numbers--band .fz-numbers__inner--3 {
    grid-template-columns: 1fr;
  }

  .fz-numbers--band .fz-num + .fz-num::before {
    left: 14%;
    right: 14%;
    top: 0;
    bottom: auto;
    width: auto;
    height: 1px;
    background: rgba(var(--fz-accent-rgb), .12);
  }

  .fz-numbers--band .fz-num__val,
  .fz-numbers--band .fz-num__val--tight {
    white-space: normal;
  }
}

.fz-section--values {
  background: var(--bg-white);
}

.fz-section--surface {
  background: var(--brand-surface);
}

/* Sytější banda než --brand-surface: pro sekce, které mají z rytmu stránky
   opticky vystoupit (kalkulačka). Vlasové linky dělají
   hranu banda explicitní i tam, kde soused je taky světle fialový. */
.fz-section--tint {
  background: linear-gradient(180deg, #f0ebf8, #e8e1f4);
  border-top: 1px solid rgba(var(--fz-accent-rgb), .14);
  border-bottom: 1px solid rgba(var(--fz-accent-rgb), .14);
}

/* Přechod ze shora na světle fialový povrch. Používá se tam, kde je předchozí
   sekce skoro stejně světlá (hero končí na #f7f3fc) a plochá hrana by se ztratila:
   horní pás je sytější a do ~300 px vyprchá do --brand-surface.
   Nekombinovat s .fz-section--surface, barvu plochy nese druhá vrstva sama. */
.fz-section--fade-top {
  /* position: relative kvůli dělící lince (::before) a .fz-section__arrow */
  position: relative;
  /* horní odsazení menší než --py: hranu už drží linka se šipkou, tolik vzduchu
     nad hlavičkou není potřeba. Přes calc, aby se to zmenšovalo i na mobilu. */
  padding-top: calc(var(--py) * .62);
  background:
    linear-gradient(180deg, rgba(var(--fz-accent-rgb), .16), rgba(var(--fz-accent-rgb), 0) 300px),
    var(--brand-surface);
}

/* Dělící linka na horní hraně: uprostřed se propadne do „V" (.fz-section__arrow).
   Aby to byl jeden nepřerušený tah, musí přesně sedět tři věci:
   – mezera v lince = šířka SVG (52px, tedy ±26px od středu),
   – tloušťka linky = stroke-width šipky (2px),
   – konce path leží na y=1, takže tah krajů pokrývá y 0–2 = přesně pásmo linky.
   Proto má .fz-section__arrow `top: 0` bez svislého posunu a linecap `butt`
   (kulatý by konce přetáhl a napojení by nabylo). */
.fz-section--fade-top::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg,
      rgba(var(--fz-accent-rgb), 0) 0,
      rgba(var(--fz-accent-rgb), .38) 8%,
      rgba(var(--fz-accent-rgb), .38) calc(50% - 26px),
      rgba(var(--fz-accent-rgb), 0) calc(50% - 26px),
      rgba(var(--fz-accent-rgb), 0) calc(50% + 26px),
      rgba(var(--fz-accent-rgb), .38) calc(50% + 26px),
      rgba(var(--fz-accent-rgb), .38) 92%,
      rgba(var(--fz-accent-rgb), 0) 100%);
}

.fz-section__arrow {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  display: block;
  color: rgba(var(--fz-accent-rgb), .38);
}

.fz-section__arrow svg {
  display: block;
}

/* Výplň „V" je barva sekce NAD hranou (konec hero gradientu), takže propad
   vypadá jako výběžek předchozí sekce, ne jako dutý trojúhelník. Vlastní path
   (ne fill na tahu) proto, že sahá až na y=0, tedy i pod horní polovinu linky.
   Pod jinou sekcí přebarvit přes --fz-arrow-fill. */
.fz-section__arrow-fill {
  fill: var(--fz-arrow-fill, var(--fz-hero-end));
  stroke: none;
}

.fz-section__arrow-line {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: butt;
  stroke-linejoin: round;
}

.fz-section--dark {
  background: var(--brand-surface);
  color: var(--brand-text-on-dark);
}

.fz-section__inner {
  max-width: var(--max-w);
  margin: 0 auto;
}

.fz-kicker {
  display: inline-block;
  font-family: var(--f-ui);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2.2px;
  text-transform: uppercase;
  color: var(--fz-accent-dark);
  margin-bottom: 16px;
}

.fz-section--dark .fz-kicker {
  color: var(--fz-accent-dark);
}

.fz-h2 {
  font-family: var(--f-head);
  font-size: clamp(30px, 3.6vw, 46px);
  font-weight: 600;
  letter-spacing: -.8px;
  line-height: 1.12;
  color: var(--text-dark);
  max-width: 720px;
  overflow-wrap: anywhere;
}

.fz-h2 em {
  font-style: normal;
  background: var(--fz-grad-light);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.fz-section--dark .fz-h2 {
  color: var(--brand-text-on-dark);
}

/* Vycentrovaná hlavička sekce (kicker + h2). Wrapper, ne text-align přímo na
   .fz-section__inner — to by se zdědilo i do karet uvnitř sekce.
   .fz-h2 má max-width, takže potřebuje ještě margin-inline: auto. */
.fz-sechead {
  text-align: center;
}

.fz-sechead .fz-h2,
.fz-sechead .fz-lead {
  margin-inline: auto;
}

.fz-lead {
  margin-top: 18px;
  font-family: var(--f-body);
  font-size: 17px;
  line-height: 1.6;
  color: var(--text-body);
  max-width: 640px;
}

.fz-section--dark .fz-lead {
  color: var(--text-body);
}

/* ===== CALCULATOR ===== */
.fz-calc {
  margin-top: 56px;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 24px 64px rgba(21, 16, 31, .12);
}

.fz-calc__controls {
  background: var(--bg-white);
  padding: clamp(28px, 4vw, 48px);
  display: flex;
  flex-direction: column;
  gap: 36px;
}

.fz-calc__group-label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 16px;
  font-family: var(--f-head);
  font-size: 15px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 14px;
}

.fz-calc__value-input {
  font-family: var(--f-head);
  font-size: 18px;
  font-weight: 700;
  color: var(--fz-accent-dark);
  border: 1px solid var(--divider-dark);
  border-radius: var(--fz-r);
  padding: 8px 12px;
  width: 150px;
  max-width: 100%;
  min-width: 0;
  min-height: 44px;
  text-align: right;
  background: #fff;
}

.fz-calc__unit {
  font-size: 14px;
  color: var(--text-muted);
  margin-left: 6px;
}

input[type="range"].fz-range {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 6px;
  border-radius: 3px;
  background: linear-gradient(to right, var(--brand-accent) var(--fill, 50%), #e6e1ef var(--fill, 50%));
  touch-action: pan-y;
}

input[type="range"].fz-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--fz-grad);
  border: 4px solid #fff;
  box-shadow: 0 2px 10px rgba(var(--fz-accent-rgb), .45);
  cursor: grab;
}

input[type="range"].fz-range::-moz-range-thumb {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--brand-accent);
  border: 4px solid #fff;
  box-shadow: 0 2px 10px rgba(var(--fz-accent-rgb), .45);
  cursor: grab;
}

.fz-range-scale {
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
  font-size: 12.5px;
  color: var(--text-muted);
  font-family: var(--f-ui);
}

.fz-calc__more {
  font-size: 14px;
  color: var(--text-body);
  background: var(--fz-grad-soft);
  border-radius: var(--fz-r);
  padding: 12px 16px;
}

.fz-calc__more a {
  color: var(--fz-accent-dark);
  font-weight: 700;
  text-decoration: underline;
}

.fz-calc__result {
  background: var(--brand-darker);
  border-left: 1px solid rgba(28, 34, 40, .07);
  color: var(--brand-text-on-dark);
  padding: clamp(28px, 4vw, 48px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 18px;
}

.fz-calc__result-label {
  font-family: var(--f-ui);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--text-muted);
}

.fz-calc__result-value {
  font-family: var(--f-head);
  font-size: clamp(40px, 4.6vw, 58px);
  font-weight: 700;
  letter-spacing: -1.2px;
  line-height: 1;
}

.fz-calc__result-value em {
  font-style: normal;
  background: var(--fz-grad-light);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.fz-calc__params {
  font-size: 14.5px;
  line-height: 1.7;
  color: var(--text-body);
}

.fz-calc__disclaimer {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  max-width: 52ch;
  margin: 0;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--text-muted);
}

.fz-calc__disclaimer-ic {
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  margin-top: 2px;
  color: var(--text-muted);
}

@media (max-width: 480px) {
  .fz-calc__disclaimer {
    max-width: 100%;
    font-size: 11.5px;
  }

  .fz-calc__value-input {
    width: 100%;
    max-width: 200px;
  }
}

.fz-calc__result .btn {
  align-self: flex-start;
}

.fz-calc__price-link {
  font-size: 13.5px;
  color: var(--fz-accent-dark);
  text-decoration: underline;
}

@media (max-width: 1024px) {
  .fz-calc {
    grid-template-columns: 1fr;
  }

  .fz-calc__result .btn {
    align-self: stretch;
  }
}

/* ===== CALCULATOR IN HERO ===== */
.fz-hero__calc {
  min-width: 0;
}

.fz-calc--hero {
  margin-top: 0;
  grid-template-columns: 1fr;
  background: var(--bg-white);
}

.fz-calc--hero .fz-calc__controls {
  gap: 18px;
  padding: clamp(18px, 2.2vw, 26px);
}

.fz-calc__head {
  font-family: var(--f-head);
  font-size: 15px;
  font-weight: 700;
  color: var(--text-dark);
  margin: 0;
}

.fz-calc--hero .fz-calc__group-label {
  font-size: 14px;
  margin-bottom: 9px;
}

.fz-calc--hero .fz-calc__value-input {
  font-size: 16px;
  padding: 6px 10px;
  width: 128px;
}

.fz-calc--hero input[type="range"].fz-range {
  height: 5px;
}

.fz-calc--hero input[type="range"].fz-range::-webkit-slider-thumb {
  width: 22px;
  height: 22px;
  border-width: 3px;
}

.fz-calc--hero input[type="range"].fz-range::-moz-range-thumb {
  width: 22px;
  height: 22px;
  border-width: 3px;
}

.fz-calc--hero .fz-range-scale {
  margin-top: 7px;
  font-size: 12px;
}

.fz-calc--hero .fz-calc__more {
  font-size: 13px;
  padding: 10px 14px;
}

.fz-calc--hero .fz-calc__result {
  border-left: 0;
  border-top: 1px solid rgba(28, 34, 40, .07);
  padding: clamp(18px, 2.2vw, 26px);
  gap: 12px;
}

.fz-calc--hero .fz-calc__result-label {
  font-size: 12px;
  letter-spacing: 1.3px;
}

.fz-calc--hero .fz-calc__result-value {
  font-size: clamp(30px, 3.2vw, 42px);
}

.fz-calc--hero .fz-calc__params {
  font-size: 13.5px;
  line-height: 1.6;
}

.fz-calc--hero .fz-calc__disclaimer {
  font-size: 12px;
  max-width: 100%;
  color: var(--text-muted);
}

.fz-calc--hero .fz-calc__disclaimer-ic {
  color: var(--text-muted);
}

.fz-calc--hero .fz-calc__result .btn {
  align-self: stretch;
  text-align: center;
}

/* ===== BENEFIT CARDS ===== */
/* karty přes celý řádek: ikona | nadpis | text, aby dlouhý odstavec nemusel
   téct v úzkém sloupci. Pod 900 px se skládá zpátky pod sebe. */
/* Tři karty vedle sebe, obsah pod sebou (ikona → titulek → text).
   Dřív to byly široké řádky s pevným sloupcem 280px na titulek — krátké titulky
   tam nechávaly mrtvé místo a karty měly každá jinou výšku. Grid je teď srovná. */
.fz-cards {
  margin-top: 56px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.fz-card {
  background: var(--bg-white);
  border: 1px solid rgba(28, 34, 40, .08);
  border-radius: 10px;
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
  transition: transform .2s, box-shadow .2s;
}

.fz-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(21, 16, 31, .1);
}

.fz-card--accent {
  background: var(--fz-grad);
  color: #fff;
  border: none;
}

.fz-card__icon {
  width: 48px;
  height: 48px;
  border-radius: 10px;
  background: var(--fz-grad-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--fz-accent-dark);
}

.fz-card--accent .fz-card__icon {
  background: rgba(255, 255, 255, .16);
  color: #fff;
}

.fz-card h3 {
  margin-top: 22px;
  font-family: var(--f-head);
  font-size: 19px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -.2px;
  color: var(--text-dark);
}

.fz-card--accent h3 {
  color: #fff;
}

.fz-card p {
  margin-top: 10px;
  font-size: 15px;
  line-height: 1.6;
  color: var(--text-body);
}

.fz-card--accent p {
  color: rgba(255, 255, 255, .92);
}

/* Informační karty bez prokliku — decentní statický vzhled */
.fz-cards--static .fz-card {
  cursor: default;
  box-shadow: 0 10px 28px rgba(21, 16, 31, .07);
  border-color: rgba(55, 53, 127, .1);
}

.fz-cards--static .fz-card:hover {
  transform: none;
  box-shadow: 0 10px 28px rgba(21, 16, 31, .07);
}

.fz-cards--static .fz-card__icon {
  background: linear-gradient(135deg, rgba(228, 98, 153, .14), rgba(55, 53, 127, .1));
}

@media (max-width: 1000px) {
  .fz-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .fz-cards {
    grid-template-columns: 1fr;
  }
}

/* ===== CARDS — 2 sloupce (zajištění) ===== */
.fz-cards--2 {
  grid-template-columns: repeat(2, 1fr);
}

@media (max-width: 640px) {
  .fz-cards--2 {
    grid-template-columns: 1fr;
  }
}

/* ===== NEED — co od vás potřebujeme (intro vlevo, seznam podkladů vpravo) ===== */
.fz-need {
  display: grid;
  gap: 40px;
  align-items: start;
}

@media (min-width: 900px) {
  .fz-need {
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.15fr);
    gap: 56px 72px;
  }
}

.fz-need__intro .fz-h2 {
  margin-bottom: 16px;
}

.fz-need__intro .fz-lead {
  margin: 0;
  max-width: 36ch;
}

/* CTA sedí pod perexem v levém sloupci — inline-flex, aby si tlačítko nebralo
   celou šířku sloupce */
.fz-need__cta {
  display: inline-flex;
  margin-top: 28px;
}

.fz-need__note {
  margin-top: 28px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--text-body);
  max-width: 40ch;
}

/* plochý seznam s dělicími linkami — bez bílého panelu (vzor cm-need) */
.fz-need__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.fz-need__item {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 14px 16px;
  align-items: start;
  padding: 22px 0;
  border-bottom: 1px solid rgba(var(--fz-accent-rgb), .12);
}

.fz-need__item:first-child {
  padding-top: 0;
}

.fz-need__item:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.fz-need__icon {
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  margin-top: 1px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--fz-grad-soft);
  color: var(--fz-accent-dark);
}

.fz-need__icon svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  stroke-width: 1.8;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.fz-need__body strong {
  display: block;
  margin-bottom: 4px;
  font-family: var(--f-head);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -.2px;
  color: var(--text-dark);
}

.fz-need__body span {
  display: block;
  font-size: 15px;
  line-height: 1.55;
  color: var(--text-body);
}

/* ===== FEATURE BANNER (rychlost a flexibilita) ===== */
.fz-feature {
  background: var(--fz-grad);
  color: #fff;
  border-radius: 14px;
  padding: clamp(32px, 4vw, 56px);
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  gap: 40px;
  align-items: center;
}

.fz-feature .fz-kicker {
  color: rgba(255, 255, 255, .85);
}

.fz-feature .fz-h2 {
  color: #fff;
  max-width: 620px;
}

.fz-feature__text {
  margin-top: 18px;
  font-size: 17px;
  line-height: 1.6;
  color: rgba(255, 255, 255, .92);
  max-width: 620px;
}

.fz-feature__cta {
  margin-top: 28px;
  background: #fff;
  color: var(--fz-accent-dark);
}

.fz-feature__cta:hover {
  opacity: .9;
  transform: translateY(-1px);
}

.fz-feature__stat {
  text-align: center;
  border-left: 1px solid rgba(255, 255, 255, .25);
  padding-left: 40px;
}

.fz-feature__stat strong {
  display: block;
  font-family: var(--f-head);
  font-size: clamp(56px, 7vw, 88px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -2px;
}

.fz-feature__stat span {
  display: block;
  margin-top: 12px;
  font-size: 15px;
  line-height: 1.5;
  color: rgba(255, 255, 255, .85);
}

/* Varianta s fotkou místo číselné statistiky */
.fz-feature--photo {
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
}

.fz-feature__claims {
  list-style: none;
  margin: 24px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.fz-feature__claims li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .14);
  border: 1px solid rgba(255, 255, 255, .24);
  font-family: var(--f-ui);
  font-size: 13.5px;
  font-weight: 600;
  color: #fff;
}

.fz-feature__claims svg {
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
}

.fz-feature__photo {
  position: relative;
  margin: 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 24px 60px -24px rgba(12, 14, 20, .55);
}

.fz-feature__photo img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.fz-feature__photo figcaption {
  position: absolute;
  inset: auto 0 0 0;
  padding: 44px 18px 16px;
  background: linear-gradient(to top, rgba(12, 14, 20, .88), rgba(12, 14, 20, 0));
  font-size: 13.5px;
  line-height: 1.5;
  color: #fff;
}

@media (max-width: 768px) {

  .fz-feature,
  .fz-feature--photo {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .fz-feature__stat {
    border-left: 0;
    border-top: 1px solid rgba(255, 255, 255, .25);
    padding-left: 0;
    padding-top: 28px;
    text-align: left;
  }

  .fz-feature__photo img {
    aspect-ratio: 3 / 2;
  }
}

/* ===== REASONS (důvody, 3 sloupce) =====
   Ikona v kruhu nad nadpisem + akcentní oddělovač, převzato z .cm-why--3
   na Comfort Money. Dřív byla ikona jen vodoznak na 8 % krytí za textem. */
.fz-reasons {
  margin-top: 56px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

/* čtyři karty v jedné řadě (hodnoty na /o-nas/, kde by 3 sloupce daly 3+1) */
.fz-reasons--4 {
  grid-template-columns: repeat(4, 1fr);
}

/* /o-nas/ — hodnoty: karty vždy „aktivní“, bez hoveru, neklikatelné */
.fz-reasons--static {
  margin-top: 48px;
}

.fz-reasons--static .fz-reason {
  cursor: default;
  text-align: center;
  align-items: start;
  justify-items: center;
  grid-template-rows: auto auto auto 1fr;
  padding: 36px 24px 32px;
  border-color: rgba(var(--fz-accent-rgb), .14);
  box-shadow: 0 14px 36px rgba(55, 53, 127, .08);
}

.fz-reasons--static .fz-reason:hover {
  transform: none;
  box-shadow: 0 14px 36px rgba(55, 53, 127, .08);
}

.fz-reasons--static .fz-reason:hover .fz-reason__icon,
.fz-reasons--static .fz-reason:hover .fz-reason__icon svg {
  transform: none;
}

.fz-reasons--static .fz-reason__icon {
  transform: none;
}

.fz-reasons--static .fz-reason__icon::before {
  opacity: 1;
}

.fz-reasons--static .fz-reason__icon svg {
  color: #fff;
  transform: none;
}

.fz-reasons--static .fz-reason.is-visible .fz-reason__icon,
.fz-reasons--static .fz-reason.is-visible .fz-reason__icon svg {
  animation: none;
}

.fz-reasons--static .fz-reason h3 {
  margin-top: 22px;
  min-height: calc(1.25em * 3);
}

.fz-reasons--static .fz-reason p {
  flex: none;
  max-width: 240px;
}

.fz-reason {
  /* position: relative kvůli roztaženému .fz-reason__link — klikatelná je celá karta */
  position: relative;
  background: var(--bg-white);
  border: 1px solid rgba(28, 34, 40, .08);
  border-radius: 10px;
  padding: 32px 28px;
  height: 100%;
  display: grid;
  grid-template-rows: auto auto auto 1fr auto;
  align-items: start;
  justify-items: center;
  text-align: center;
  /* .reveal deklaruje transition dřív a stejně specificky, takže ho tady
     musíme převzít CELÝ včetně opacity. Jinak by se karta jen posunula
     a prolnutí by proskočilo naráz. */
  transition:
    opacity .5s var(--ease-out),
    transform .35s var(--ease-out),
    box-shadow .25s ease;
}

.fz-reason:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(21, 16, 31, .1);
}

.fz-reason__icon {
  position: relative;
  width: 62px;
  height: 62px;
  border-radius: 50%;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  background: var(--fz-grad-soft);
  color: var(--fz-accent-dark);
  transition: transform .28s var(--ease-out);
}

/* plný přechod pod kruhem, na hoveru se prolne přes jemné podbarvení
   (dva gradienty mezi sebou transitionovat nejdou, proto překryv) */
.fz-reason__icon::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--fz-grad);
  opacity: 0;
  transition: opacity .28s ease;
}

.fz-reason__icon svg {
  position: relative;
  z-index: 1;
  width: 28px;
  height: 28px;
  stroke: currentColor;
  stroke-width: 1.8;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .28s var(--ease-out), color .28s ease;
}

.fz-reason:hover .fz-reason__icon {
  transform: scale(1.05);
}

.fz-reason:hover .fz-reason__icon::before {
  opacity: 1;
}

.fz-reason:hover .fz-reason__icon svg {
  color: #fff;
  transform: scale(1.1);
}

/* Animace při naskočení karty. fill-mode `backwards` (ne `both`) je záměr:
   po dojetí se prvek vrátí do normálního stylu, takže transform zůstane volný
   pro hover. S `both` by ho animace držela zamčený na scale(1). */
.fz-reason.is-visible .fz-reason__icon {
  animation: fzIconIn .55s var(--ease-out) .1s backwards;
}

.fz-reason.is-visible .fz-reason__icon svg {
  animation: fzGlyphIn .45s var(--ease-out) .26s backwards;
}

.fz-reason__divider {
  display: block;
  width: 26px;
  height: 3px;
  flex-shrink: 0;
  border-radius: 3px;
  background: var(--fz-grad);
  margin: 8px auto 10px;
}

.fz-reason h3 {
  margin-top: 16px;
  min-height: 0;
  font-family: var(--f-head);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -.2px;
  color: var(--text-dark);
}

/* odstavec vyplní zbylou výšku, odkazy v řadě sedí na stejné lince */
.fz-reason p {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--text-body);
}

/* Cíl karty: viditelný odkaz dole + ::after roztažené přes celou kartu,
   takže se dá kliknout kamkoli, ale odkaz má normální text pro čtečky.
   Stejný vzor jako .fz-param__link u parametrů úvěru. */
.fz-reason__link {
  justify-self: center;
  margin-top: 0;
  padding-top: 18px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: var(--f-ui);
  font-size: 13.5px;
  font-weight: 700;
  color: var(--fz-accent-dark);
  text-decoration: none;
}

.fz-reason__link::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 10px;
}

.fz-reason__link svg {
  width: 15px;
  height: 15px;
  stroke: currentColor;
  stroke-width: 2.2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .22s var(--ease-out);
}

.fz-reason:hover .fz-reason__link {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.fz-reason:hover .fz-reason__link svg {
  transform: translateX(4px);
}

/* Focus ring patří celé kartě, ne jen textu odkazu (ten je roztažený přes ni). */
@supports selector(:has(*)) {
  .fz-reason:has(.fz-reason__link:focus-visible) {
    outline: 3px solid var(--brand-accent);
    outline-offset: 2px;
  }

  .fz-reason__link:focus-visible {
    outline: none;
  }
}

@media (max-width: 1024px) {
  .fz-reasons {
    grid-template-columns: repeat(2, 1fr);
  }

  .fz-reasons--4.fz-reasons--static {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .fz-reasons:not(.fz-reasons--4) {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .fz-reasons {
    grid-template-columns: 1fr;
  }
}

/* ===== STEPS ===== */
.fz-steps {
  margin-top: 56px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  counter-reset: step;
}

.fz-step {
  position: relative;
  background: var(--bg-white);
  border-radius: 10px;
  padding: 36px 28px 32px;
  border: 1px solid rgba(28, 34, 40, .08);
}

.fz-step__num {
  font-family: var(--f-head);
  font-size: 56px;
  font-weight: 700;
  line-height: 1;
  background: var(--fz-grad-light);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.fz-step h3 {
  margin-top: 16px;
  font-family: var(--f-head);
  font-size: 21px;
  font-weight: 700;
  color: var(--text-dark);
}

.fz-step__sound {
  font-size: 13px;
  font-weight: 600;
  color: var(--fz-accent-dark);
  font-style: italic;
  margin-left: 6px;
}

.fz-step p {
  margin-top: 12px;
  font-size: 15px;
  line-height: 1.6;
  color: var(--text-body);
}

@media (max-width: 1024px) {
  .fz-steps {
    grid-template-columns: 1fr;
  }
}

/* ===== SEGMENTS (pro koho / co financovat) ===== */
.fz-segments {
  margin-top: 56px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

.fz-seg-panel {
  background: var(--bg-white);
  border: 1px solid rgba(28, 34, 40, .08);
  border-radius: 10px;
  padding: 36px 32px;
}

.fz-seg-panel h3 {
  font-family: var(--f-head);
  font-size: 22px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 20px;
}

/* Hlavička panelu: ikona v kolečku + název a jednovětné vysvětlení */
.fz-seg-panel__head {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  padding-bottom: 22px;
  border-bottom: 1px solid rgba(28, 34, 40, .08);
}

.fz-seg-panel__head h3 {
  margin-bottom: 0;
}

.fz-seg-panel__head p {
  margin-top: 8px;
  font-size: 15.5px;
  line-height: 1.6;
  color: var(--text-body);
}

.fz-seg-panel__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: rgba(var(--fz-accent-rgb), .09);
  color: var(--fz-accent-dark);
  flex-shrink: 0;
  margin-top: 2px;
}

.fz-seg-panel__icon .icon {
  width: 26px;
  height: 26px;
  stroke-width: 1.5;
}

.fz-checklist li {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 16px 0;
  font-size: 15.5px;
  line-height: 1.55;
  color: var(--text-body);
  border-bottom: 1px solid rgba(28, 34, 40, .06);
}

.fz-checklist li:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.fz-checklist .icon {
  width: 20px;
  height: 20px;
  color: var(--fz-accent-dark);
  margin-top: 2px;
}

.fz-checklist__mark {
  width: 20px;
  height: 20px;
  color: var(--fz-accent-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 3px;
}

.fz-checklist__mark .icon {
  width: 18px;
  height: 18px;
  stroke-width: 1.8;
  margin-top: 0;
}

.fz-checklist strong {
  display: block;
  font-family: var(--f-head);
  font-size: 16px;
  font-weight: 700;
  color: var(--text-dark);
}

.fz-checklist__note {
  display: block;
  margin-top: 3px;
  font-size: 14.5px;
  line-height: 1.5;
  color: var(--text-muted);
}

/* Uzavírací poznámka pod oběma panely */
.fz-seg-note {
  margin-top: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 15px;
  line-height: 1.5;
  color: var(--text-body);
  text-align: center;
}

.fz-seg-note .icon {
  width: 20px;
  height: 20px;
  color: var(--fz-accent-dark);
}

@media (max-width: 1024px) {
  .fz-segments {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .fz-seg-panel {
    padding: 28px 22px;
  }

  .fz-seg-panel__head {
    gap: 14px;
  }

  .fz-seg-panel__icon {
    width: 46px;
    height: 46px;
  }

  .fz-seg-panel__icon .icon {
    width: 23px;
    height: 23px;
  }

  .fz-seg-note {
    align-items: flex-start;
    text-align: left;
  }
}

/* ===== ZAJIŠTĚNÍ — plochý layout ve stejném jazyce jako hero benefity ===== */
.fz-zajisteni {
  margin-top: 40px;
}

.fz-zajisteni__ic {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--fz-grad-soft);
  color: var(--fz-accent-dark);
}

.fz-zajisteni__ic svg {
  width: 20px;
  height: 20px;
  stroke: currentColor;
  stroke-width: 1.8;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.fz-zajisteni__ic--lg {
  width: 58px;
  height: 58px;
  background: var(--fz-grad);
  color: #fff;
  box-shadow: 0 10px 24px rgba(var(--fz-accent-rgb), .28);
}

.fz-zajisteni__ic--lg svg {
  width: 28px;
  height: 28px;
  stroke-width: 1.7;
}

.fz-zajisteni__col.is-visible .fz-zajisteni__ic--lg {
  filter: none;
  animation: fzParamTint .7s var(--ease-out) .08s backwards;
}

.fz-zajisteni__types {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  align-items: start;
}

.fz-zajisteni__col {
  min-width: 0;
  padding: 0 36px;
}

.fz-zajisteni__col:first-child {
  padding-left: 0;
}

.fz-zajisteni__col:last-child {
  padding-right: 0;
}

.fz-zajisteni__col + .fz-zajisteni__col {
  border-left: 1px solid rgba(28, 34, 40, .1);
}

.fz-zajisteni__col-head {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  margin-bottom: 8px;
}

.fz-zajisteni__col-head h3 {
  margin: 0;
  font-family: var(--f-head);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -.2px;
  line-height: 1.2;
  color: var(--text-dark);
}

.fz-zajisteni__col-head p {
  margin: 6px 0 0;
  font-size: 14.5px;
  line-height: 1.5;
  color: var(--text-body);
}

.fz-zajisteni__items {
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
}

.fz-zajisteni__items li {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  column-gap: 10px;
  padding: 12px 0;
  border-top: 1px solid rgba(28, 34, 40, .08);
}

.fz-zajisteni__items li:first-child {
  border-top: 0;
}

.fz-zajisteni__items li::before {
  content: "";
  grid-column: 1;
  grid-row: 1 / span 2;
  width: 18px;
  height: 18px;
  margin-top: 2px;
  background: var(--fz-accent-dark);
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
}

.fz-zajisteni__items strong {
  grid-column: 2;
  display: block;
  font-family: var(--f-head);
  font-size: 15px;
  font-weight: 650;
  line-height: 1.3;
  color: var(--text-dark);
}

.fz-zajisteni__items span {
  grid-column: 2;
  display: block;
  margin-top: 2px;
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--text-muted);
}

.fz-zajisteni__practice {
  margin-top: 40px;
  padding-top: 32px;
  border-top: 1px solid rgba(28, 34, 40, .1);
}

.fz-zajisteni__practice-title {
  font-family: var(--f-head);
  font-size: clamp(20px, 2.2vw, 26px);
  font-weight: 700;
  letter-spacing: -.3px;
  line-height: 1.2;
  color: var(--text-dark);
  margin: 0 0 24px;
}

.fz-zajisteni__steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  align-items: start;
}

.fz-zajisteni__step {
  min-width: 0;
  padding: 0 28px;
}

.fz-zajisteni__step:first-child {
  padding-left: 0;
}

.fz-zajisteni__step:last-child {
  padding-right: 0;
}

.fz-zajisteni__step + .fz-zajisteni__step {
  border-left: 1px solid rgba(28, 34, 40, .1);
}

.fz-zajisteni__step h4 {
  margin: 12px 0 8px;
  font-family: var(--f-head);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -.15px;
  color: var(--text-dark);
}

.fz-zajisteni__step p {
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
  color: var(--text-body);
}

@media (max-width: 1024px) {
  .fz-zajisteni__types,
  .fz-zajisteni__steps {
    grid-template-columns: 1fr;
  }

  .fz-zajisteni__col,
  .fz-zajisteni__col:first-child,
  .fz-zajisteni__col:last-child,
  .fz-zajisteni__step,
  .fz-zajisteni__step:first-child,
  .fz-zajisteni__step:last-child {
    padding: 0;
  }

  .fz-zajisteni__col + .fz-zajisteni__col {
    border-left: 0;
    border-top: 1px solid rgba(28, 34, 40, .1);
    margin-top: 24px;
    padding-top: 24px;
  }

  .fz-zajisteni__step + .fz-zajisteni__step {
    border-left: 0;
    border-top: 1px solid rgba(28, 34, 40, .1);
    margin-top: 20px;
    padding-top: 20px;
  }
}

@media (max-width: 640px) {
  .fz-zajisteni {
    margin-top: 28px;
  }
}

/* ===== COMPARE (banka vs FZ) ===== */
/* ===== PARAMETRY ÚVĚRU =====
   Dvě úrovně: čtyři klíčové rozsahy jako karty (.fz-params) a zbytek podmínek
   jako dvousloupcový seznam (.fz-spec). Sémanticky obojí <dl>: dt = název
   parametru, dd = hodnota. Naskakování řeší [data-stagger] + .reveal v main.js. */
.fz-params {
  margin: 36px 0 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  align-items: stretch;
}

.fz-param {
  /* position: relative kvůli roztaženému .fz-param__link — klikatelná je celá karta */
  position: relative;
  min-width: 0;
  background: var(--bg-white);
  border: 1px solid rgba(28, 34, 40, .07);
  border-radius: 12px;
  padding: 22px 20px 20px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  /* .reveal deklaruje transition dřív a stejně specificky → přebíráme ho celý */
  transition:
    opacity .5s var(--ease-out),
    transform .35s var(--ease-out),
    box-shadow .25s ease;
}

.fz-param:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(21, 16, 31, .1);
}

.fz-param__ic {
  position: relative;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  background: var(--fz-grad-soft);
  color: var(--fz-accent-dark);
  filter: grayscale(1);
  transition: transform .28s var(--ease-out), filter .55s ease, color .45s ease;
}

/* plný přechod pod kruhem — naběhne při zobrazení karty, ne až na hover */
.fz-param__ic::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--fz-grad);
  opacity: 0;
}

.fz-param__ic svg {
  position: relative;
  z-index: 1;
  width: 22px;
  height: 22px;
  stroke: currentColor;
  stroke-width: 1.8;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .28s var(--ease-out), color .28s ease;
}

.fz-params:not(.fz-params--static) .fz-param:hover .fz-param__ic {
  transform: scale(1.05);
}

.fz-params:not(.fz-params--static) .fz-param:hover .fz-param__ic svg {
  transform: scale(1.1);
}

.fz-param.is-visible .fz-param__ic {
  filter: none;
  color: #fff;
  animation: fzParamTint .7s var(--ease-out) .12s backwards;
}

.fz-param.is-visible .fz-param__ic::before {
  opacity: 1;
  animation: fzParamFillIn .5s ease .2s backwards;
}

.fz-param.is-visible .fz-param__ic svg {
  color: #fff;
  animation: fzGlyphIn .45s var(--ease-out) .28s backwards;
}

.fz-param dt {
  margin-top: 14px;
  font-family: var(--f-ui);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: var(--fz-accent-dark);
}

/* dd roste do zbylé výšky karty, aby se poznámky srovnaly na jednu spodní linku */
.fz-param dd {
  margin: 6px 0 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  width: 100%;
}

.fz-param__val {
  display: block;
  font-family: var(--f-head);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -.15px;
  color: var(--text-dark);
  text-wrap: balance;
  overflow-wrap: anywhere;
  min-height: 2.6em;
}

.fz-param__divider {
  display: block;
  width: 20px;
  height: 2px;
  border-radius: 2px;
  background: var(--fz-grad);
  margin: 10px 0;
  flex-shrink: 0;
}

.fz-param__note {
  display: block;
  font-size: 13px;
  line-height: 1.45;
  color: var(--text-body);
}

/* Cíl karty: viditelný odkaz dole + ::after roztažené přes celou kartu,
   takže se dá kliknout kamkoli, ale odkaz má normální text pro čtečky. */
.fz-param__link {
  align-self: flex-start;
  margin-top: auto;
  padding-top: 18px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: var(--f-ui);
  font-size: 13.5px;
  font-weight: 700;
  color: var(--fz-accent-dark);
  text-decoration: none;
}

.fz-param__link::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 10px;
}

.fz-param__link svg {
  width: 15px;
  height: 15px;
  stroke: currentColor;
  stroke-width: 2.2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .22s var(--ease-out);
}

.fz-param:hover .fz-param__link {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.fz-param:hover .fz-param__link svg {
  transform: translateX(4px);
}

/* Focus ring patří celé kartě, ne jen textu odkazu (ten je roztažený přes ni).
   Bez :has() zůstane výchozí ring na odkazu z globálního a:focus-visible. */
@supports selector(:has(*)) {
  .fz-param:has(.fz-param__link:focus-visible) {
    outline: 3px solid var(--brand-accent);
    outline-offset: 2px;
  }

  .fz-param__link:focus-visible {
    outline: none;
  }
}

/* Parametry bez prokliků — decentní statický vzhled, bez trvalého hover efektu */
.fz-params--static .fz-param {
  cursor: default;
  box-shadow: 0 4px 18px rgba(21, 16, 31, .05);
}

.fz-params--static .fz-param:hover {
  transform: none;
  box-shadow: 0 4px 18px rgba(21, 16, 31, .05);
}

.fz-params--static .fz-param:hover .fz-param__ic,
.fz-params--static .fz-param:hover .fz-param__ic svg {
  transform: none;
}

.fz-params--static .fz-param:not(.is-visible) .fz-param__ic::before {
  opacity: 0;
}

.fz-params--static .fz-param.is-visible .fz-param__ic::before {
  opacity: 1;
}

.fz-params--static .fz-param.is-visible .fz-param__ic svg {
  color: #fff;
}

.fz-params--static .fz-param dd {
  flex: 1 1 auto;
}

/* ---- Zbylé podmínky: dva sloupce, název nad hodnotou ----
   Ne karty (těch už je nahoře dost) a ne dlouhý jednosloupcový seznam:
   název jde jako malý štítek NAD text, takže se celá sekce zkrátí na polovinu
   a každá buňka je krátký čitelný odstavec místo řádku tabulky. */
.fz-spec {
  margin: 44px 0 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  /* plní se po sloupcích (1–4 vlevo, 5–7 vpravo), aby se seznam četl shora dolů;
     pevné řádky drží linky obou sloupců na stejné výšce */
  grid-template-rows: repeat(4, auto);
  grid-auto-flow: column;
  column-gap: 56px;
}

.fz-spec__row {
  padding: 20px 0;
  border-top: 1px solid rgba(28, 34, 40, .12);
}

/* první buňka v každém sloupci nese horní linku, spodní hrana sekce zůstává volná */
.fz-spec__row dt {
  font-family: var(--f-ui);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--fz-accent-dark);
}

.fz-spec__row dd {
  margin: 6px 0 0;
  font-size: 15.5px;
  line-height: 1.6;
  color: var(--text-body);
  max-width: 46em;
}

@media (max-width: 1024px) {
  .fz-params {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }
}

@media (max-width: 760px) {
  .fz-spec {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    grid-auto-flow: row;
  }
}

@media (max-width: 540px) {
  .fz-params {
    grid-template-columns: 1fr;
  }

  .fz-param__val {
    min-height: 0;
  }
}

/* ---- NEPOUŽITO: srovnávací tabulka. Parametry jedou přes .fz-params. ---- */
.fz-compare {
  margin-top: 56px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(28, 34, 40, .1);
}

.fz-compare table {
  width: 100%;
  border-collapse: collapse;
}

.fz-compare th,
.fz-compare td {
  padding: 18px 24px;
  text-align: left;
  font-size: 15.5px;
  line-height: 1.5;
  border-bottom: 1px solid rgba(28, 34, 40, .08);
  vertical-align: top;
}

.fz-compare thead th {
  font-family: var(--f-head);
  font-size: 16px;
  font-weight: 700;
}

.fz-compare th[scope="row"] {
  font-family: var(--f-head);
  font-weight: 600;
  color: var(--text-dark);
  width: 26%;
}

.fz-compare .col-bank {
  background: #f2f2f4;
  color: var(--text-muted);
  width: 37%;
}

.fz-compare .col-fz {
  background: var(--fz-grad-soft);
  color: var(--text-dark);
  font-weight: 600;
  width: 37%;
}

.fz-compare thead .col-fz {
  background: var(--fz-grad);
  color: #fff;
}

.fz-compare thead .col-bank {
  background: #e7e7ea;
  color: var(--text-body);
}

/* stacked on mobile */
@media (max-width: 640px) {
  .fz-compare {
    border: none;
  }

  .fz-compare table,
  .fz-compare tbody,
  .fz-compare tr,
  .fz-compare th,
  .fz-compare td {
    display: block;
    width: 100%;
  }

  .fz-compare thead {
    display: none;
  }

  .fz-compare tr {
    margin-bottom: 16px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid rgba(28, 34, 40, .1);
  }

  .fz-compare th[scope="row"] {
    border-bottom: none;
    background: var(--bg-white);
    padding-bottom: 8px;
  }

  .fz-compare td::before {
    display: block;
    font-family: var(--f-ui);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    margin-bottom: 4px;
  }

  .fz-compare td.col-bank::before {
    content: "Banka";
    color: var(--text-muted);
  }

  .fz-compare td.col-fz::before {
    content: "Firemní záložna";
    color: var(--fz-accent-dark);
  }
}

/* ===== PRICE EXAMPLE ===== */
.fz-price-card {
  margin-top: 48px;
  background: var(--brand-surface);
  border-radius: 12px;
  padding: clamp(28px, 4vw, 44px);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
}

.fz-price-card h3 {
  font-family: var(--f-head);
  font-size: 20px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 16px;
}

.fz-price-card p,
.fz-price-card li {
  font-size: 15px;
  line-height: 1.65;
  color: var(--text-body);
}

.fz-price-example {
  background: var(--bg-white);
  border-radius: 10px;
  padding: 28px;
  border: 1px solid rgba(28, 34, 40, .08);
}

.fz-price-example dl {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px 16px;
  margin: 16px 0;
}

.fz-price-example dt {
  font-size: 14.5px;
  color: var(--text-muted);
}

.fz-price-example dd {
  font-family: var(--f-head);
  font-size: 14.5px;
  font-weight: 700;
  color: var(--text-dark);
  text-align: right;
}

.fz-price-example .fz-todo {
  color: var(--fz-accent-dark);
}

.fz-fineprint {
  font-size: 12.5px;
  color: var(--text-muted);
  line-height: 1.55;
}

@media (max-width: 1024px) {
  .fz-price-card {
    grid-template-columns: 1fr;
  }
}

/* ===== FAQ =====
   Stejný vzor jako Comfort Money: každá otázka je samostatná karta se značkou
   +/− vpravo. Rozbalování drží nativní <details> (funguje i bez JS), JS
   ([data-faq] v main.js) jen zavírá ostatní položky. */
.fz-faq {
  margin-top: 40px;
  max-width: 820px;
  display: grid;
  gap: 12px;
}

.fz-faq details {
  background: var(--bg-white);
  border: 1px solid rgba(28, 34, 40, .08);
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(28, 34, 40, .05), 0 18px 40px -24px rgba(21, 16, 31, .18);
  overflow: hidden;
}

.fz-faq summary {
  list-style: none;
  position: relative;
  padding: 20px 58px 20px 22px;
  min-height: 48px;
  font-family: var(--f-head);
  font-size: 17px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--text-dark);
  cursor: pointer;
}

.fz-faq summary::-webkit-details-marker {
  display: none;
}

/* Značka je text (+/−), ne SVG: přepnutí stavu je pak jen změna `content`. */
.fz-faq summary::after {
  content: "+";
  position: absolute;
  right: 22px;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--f-body);
  font-size: 26px;
  font-weight: 400;
  line-height: 1;
  color: var(--fz-accent-dark);
  transition: transform .18s ease;
}

/* Press feedback jen na značce, ne na celém řádku přes celou šířku karty. */
.fz-faq summary:active::after {
  transform: translateY(-50%) scale(.85);
}

.fz-faq details[open] summary::after {
  content: "–";
}

.fz-faq__answer {
  padding: 0 22px 22px;
  font-size: 15.5px;
  line-height: 1.65;
  color: var(--text-body);
  max-width: 700px;
  overflow-wrap: break-word;
}

.fz-faq__answer a {
  color: var(--fz-accent-dark);
  text-decoration: underline;
}

@media (max-width: 640px) {
  .fz-faq summary {
    padding: 18px 50px 18px 18px;
    font-size: 16px;
  }

  .fz-faq summary::after {
    right: 18px;
  }

  .fz-faq__answer {
    padding: 0 18px 20px;
  }
}

/* Velký jemný otazník na pozadí sekce (jako u Comfort Money FAQ). Na FZ je
   obsah zarovnaný vlevo, proto glyf sedí u pravé hrany, ne u levé. */
.fz-section--faq {
  position: relative;
  overflow: hidden;
}

.fz-section--faq::before {
  content: "?";
  position: absolute;
  right: 1%;
  bottom: -6%;
  transform: rotate(14deg);
  transform-origin: right bottom;
  font-family: var(--f-head);
  font-weight: 700;
  font-size: min(84vw, 700px);
  line-height: .7;
  color: rgba(var(--fz-accent-rgb), .13);
  pointer-events: none;
  z-index: 0;
  user-select: none;
}

.fz-section--faq>.fz-section__inner {
  position: relative;
  z-index: 1;
}

/* ===== GROUP (CFG) ===== */
.fz-group {
  margin-top: 48px;
  display: flex;
  align-items: center;
  gap: 48px;
}

.fz-group__logo img {
  width: 140px;
  height: auto;
}

.fz-group__text {
  font-size: 15.5px;
  line-height: 1.65;
  color: var(--text-body);
  max-width: 620px;
}

.fz-group__text a {
  color: var(--fz-accent-dark);
  font-weight: 700;
  text-decoration: underline;
}

@media (max-width: 1024px) {
  .fz-group {
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
  }
}

/* ===== FOOTER additions ===== */
.footer__form-card {
  border: 1px solid rgba(28, 34, 40, .08);
}

.footer__specialist {
  display: flex;
  align-items: center;
  gap: 16px;
  padding-bottom: 4px;
}

.footer__specialist img {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  object-fit: cover;
  background: #e9e3f2;
}

.footer__specialist-name {
  font-family: var(--f-head);
  font-size: 17px;
  font-weight: 700;
  color: var(--brand-text-on-dark);
}

.footer__specialist-role {
  font-size: 13.5px;
  color: var(--text-muted);
  margin-top: 2px;
}

.footer__field input,
.footer__field textarea {
  font-size: 16px;
  /* iOS no-zoom */
}

.footer__claim {
  font-family: var(--f-head);
  font-size: 15px;
  font-weight: 700;
  background: var(--fz-grad-light);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.form-error {
  display: none;
  font-size: 13px;
  color: var(--fz-error);
}

.footer__field.has-error input,
.footer__field.has-error textarea,
.footer__gdpr.has-error input {
  border-color: #d23f3f;
}

.footer__gdpr .form-error {
  flex: 1 1 100%;
}

.footer__gdpr.has-error .form-error {
  display: block;
}

.footer__gdpr.has-error label {
  color: #d23f3f;
}

.footer__gdpr.has-error input {
  outline: 2px solid #d23f3f;
  outline-offset: 2px;
}

.footer__field.has-error .form-error {
  display: block;
}

.form-status {
  display: none;
  margin-top: 14px;
  font-size: 14.5px;
  line-height: 1.55;
  font-weight: 500;
  border-radius: 10px;
  padding: 16px 18px;
  border: 1px solid transparent;
}

.form-status.is-visible {
  display: block;
}

.form-status__kicker {
  margin: 0 0 6px;
  font-family: var(--f-ui);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.form-status__title {
  margin: 0;
  font-family: var(--f-head);
  font-size: 16.5px;
  font-weight: 700;
  line-height: 1.3;
  color: inherit;
}

.form-status__text {
  margin: 8px 0 0;
  font-size: 14px;
  line-height: 1.55;
  font-weight: 500;
}

.form-status--success {
  background: rgba(29, 122, 68, .1);
  border-color: rgba(29, 122, 68, .28);
  color: var(--fz-success);
}

.form-status--error {
  background: rgba(176, 42, 42, .08);
  border-color: rgba(176, 42, 42, .28);
  color: var(--fz-error);
}

.form-status a {
  color: inherit;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.footer__submit[disabled] {
  opacity: .6;
  cursor: wait;
}

.hp-field {
  position: absolute !important;
  left: -9999px !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Sticky lišta na mobilu nahrazena plovoucím badge specialisty (.fz-agent) */
.fz-call-sticky {
  display: none;
}

/* ===== COOKIE BAR ===== */
.fz-cookies {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: calc(16px + env(safe-area-inset-bottom));
  z-index: 200;
  background: var(--brand-darker);
  color: var(--brand-text-on-dark);
  border-radius: 12px;
  padding: 22px;
  box-shadow: 0 16px 48px rgba(21, 16, 31, .18);
  border: 1px solid rgba(28, 34, 40, .08);
  max-width: 560px;
  margin: 0 auto;
  display: none;
}

.fz-cookies.is-visible {
  display: block;
}

.fz-cookies h2 {
  font-family: var(--f-head);
  font-size: 17px;
  font-weight: 700;
  margin-bottom: 8px;
}

.fz-cookies p {
  font-size: 13.5px;
  line-height: 1.55;
  color: rgba(var(--brand-text-on-dark-rgb), .75);
}

.fz-cookies p a {
  text-decoration: underline;
}

.fz-cookies__cats {
  margin: 14px 0;
  display: none;
  flex-direction: column;
  gap: 10px;
}

.fz-cookies.show-settings .fz-cookies__cats {
  display: flex;
}

.fz-cookies__cat {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
}

.fz-cookies__cat input {
  width: 18px;
  height: 18px;
  accent-color: var(--brand-accent);
}

.fz-cookies__btns {
  margin-top: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.fz-cookies__btns .btn {
  min-height: 48px;
  padding: 12px 20px;
  font-size: 14.5px;
  flex: 1 1 auto;
}

.btn--cookie-ghost {
  background: transparent;
  color: var(--brand-text-on-dark);
  border: 1.5px solid rgba(var(--brand-text-on-dark-rgb), .3);
}

/* ===== SUBPAGE HERO (light, kicker + gradient akcent) ===== */
.fz-pagehero {
  background: linear-gradient(180deg, #ffffff 0%, #f8f4fd 100%);
  padding: calc(88px + 72px) var(--px) 80px;
}

.fz-pagehero__inner {
  max-width: var(--max-w);
  margin: 0 auto;
}

.fz-pagehero .fz-kicker {
  margin-bottom: 20px;
}

.fz-pagehero h1 {
  font-family: var(--f-head);
  font-size: clamp(38px, 5vw, 62px);
  font-weight: 700;
  letter-spacing: -1.4px;
  color: var(--text-dark);
  line-height: 1.06;
  max-width: 860px;
}

.fz-pagehero h1 em {
  font-style: normal;
  background: var(--fz-grad-light);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.fz-pagehero__sub {
  margin-top: 22px;
  font-size: 17px;
  line-height: 1.6;
  color: var(--text-body);
  max-width: 640px;
}

/* Page hero s lead formulářem (text vlevo, formulář vpravo) */
.fz-pagehero--form {
  padding-bottom: 72px;
}

.fz-pagehero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  gap: 64px;
  align-items: center;
}

.fz-pagehero--form .footer__field label,
.fz-pagehero--form .footer__field input,
.fz-pagehero--form .footer__field textarea {
  color: var(--text-dark);
}

.fz-pagehero--form .footer__gdpr label {
  color: var(--text-body);
}

.fz-pagehero--form .footer__submit {
  align-self: stretch;
  display: flex;
  justify-content: center;
  text-align: center;
  font-size: 17px;
}

/* Page hero s výřezovou fotkou (text vlevo, postava vpravo).
   Pozadí sekce je PLNÁ #f5f6ff, tedy přesně barva plochy ve výřezu bg-01.webp
   (naměřeno na okrajovém rámečku), ne gradient: ten by nechal výřez splynout
   jen v jedné vodorovné úrovni. Při výměně fotky barvu přeměř a srovnej.
   Postava je zdola seříznutá v pasu, proto dosedá na spodní hranu sekce. */
.fz-pagehero--art {
  padding-top: calc(88px + 48px);
  padding-bottom: 0;
  background: #f5f6ff;
  overflow: hidden;
}

.fz-pagehero--art .fz-pagehero__grid {
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  align-items: end;
  gap: 40px;
}

/* nadpis stojí v užším sloupci vedle fotky, proto menší strop než u plné šířky */
.fz-pagehero--art h1 {
  font-size: clamp(34px, 3.8vw, 50px);
  letter-spacing: -1px;
}

/* fotka je vyšší než text, proto se text centruje proti ní */
.fz-pagehero--art .fz-pagehero__copy {
  align-self: center;
  padding-bottom: 48px;
}

.fz-pagehero__art {
  align-self: end;
  justify-self: center;
  width: 100%;
  max-width: 520px;
}

.fz-pagehero__art img {
  display: block;
  width: 100%;
  height: auto;
}

@media (max-width: 1024px) {
  .fz-pagehero__grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .fz-pagehero--art .fz-pagehero__grid {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 24px;
  }

  .fz-pagehero--art .fz-pagehero__copy {
    align-self: start;
    padding-bottom: 0;
  }

  .fz-pagehero__art {
    max-width: 360px;
    justify-self: start;
  }
}

@media (max-width: 640px) {

  /* fotka je dekorativní, na telefonu by jen odtlačila CTA pod ohyb */
  .fz-pagehero--art {
    padding-bottom: 64px;
  }

  .fz-pagehero__art {
    display: none;
  }
}

.fz-prose {
  max-width: 760px;
}

.fz-prose h2 {
  font-family: var(--f-head);
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -.4px;
  color: var(--text-dark);
  margin: 48px 0 16px;
}

.fz-prose h2:first-child {
  margin-top: 0;
}

.fz-prose h3 {
  font-family: var(--f-head);
  font-size: 20px;
  font-weight: 700;
  color: var(--text-dark);
  margin: 32px 0 12px;
}

.fz-prose p,
.fz-prose li {
  font-size: 16px;
  line-height: 1.7;
  color: var(--text-body);
  margin-bottom: 14px;
}

.fz-prose ul {
  list-style: disc;
  padding-left: 22px;
  margin-bottom: 16px;
}

.fz-prose ul li {
  margin-bottom: 8px;
}

.fz-prose a {
  color: var(--fz-accent-dark);
  text-decoration: underline;
}

.fz-prose strong {
  color: var(--text-dark);
}

.fz-prose table {
  width: 100%;
  border-collapse: collapse;
  margin: 16px 0 24px;
  font-size: 14.5px;
}

.fz-prose th,
.fz-prose td {
  text-align: left;
  padding: 10px 14px;
  border: 1px solid rgba(28, 34, 40, .12);
  vertical-align: top;
}

.fz-prose thead th {
  background: var(--brand-surface);
  font-family: var(--f-head);
  font-weight: 700;
  color: var(--text-dark);
}

/* širší varianta pro obsah s tabulkou (seznam firem ve skupině) */
.fz-prose--wide {
  max-width: 980px;
}

.fz-table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.fz-table-scroll table {
  min-width: 640px;
}

.fz-timeline {
  margin: 32px 0;
  border-left: 2px solid rgba(139, 53, 221, .3);
  padding-left: 28px;
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.fz-timeline__item {
  position: relative;
}

.fz-timeline__item::before {
  content: "";
  position: absolute;
  left: -36px;
  top: 4px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--fz-grad);
}

.fz-timeline__when {
  font-family: var(--f-ui);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--fz-accent-dark);
}

.fz-timeline__item h3 {
  margin: 6px 0 6px;
}

.fz-timeline__item p {
  margin-bottom: 0;
}

/* ===== STEPPER — vodorovná timeline (jako comfortmoney) ===== */
.fz-stepper {
  position: relative;
  margin-top: 56px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

/* vodorovná spojnice přes středy koleček */
.fz-stepper::before {
  content: "";
  position: absolute;
  top: 28px;
  left: 16.66%;
  right: 16.66%;
  height: 2px;
  background: rgba(139, 53, 221, .25);
  z-index: 0;
}

.fz-stepper__step {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.fz-stepper__num {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--fz-grad);
  color: #fff;
  font-family: var(--f-head);
  font-size: 22px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 22px;
  box-shadow: 0 0 0 7px var(--brand-surface);
}

.fz-stepper__step h3 {
  font-family: var(--f-head);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -.2px;
  color: var(--text-dark);
  margin-bottom: 8px;
}

.fz-stepper__step p {
  font-size: 15px;
  line-height: 1.6;
  color: var(--text-body);
  max-width: 320px;
}

@media (max-width: 768px) {
  .fz-stepper {
    grid-template-columns: 1fr;
    gap: 28px;
    max-width: 460px;
  }

  .fz-stepper::before {
    display: none;
  }

  .fz-stepper__step {
    flex-direction: row;
    align-items: flex-start;
    text-align: left;
    gap: 18px;
  }

  .fz-stepper__num {
    flex-shrink: 0;
    margin-bottom: 0;
    box-shadow: none;
  }

  .fz-stepper__step p {
    max-width: none;
  }
}

/* ===== PROCESS TIMELINE (fz-proc) — animovaný krokový proces (obdoba comfortmoney) ===== */
.fz-proc__fallback {
  margin: 28px 0 0;
  padding-left: 20px;
  display: grid;
  gap: 12px;
  color: var(--text-body);
  line-height: 1.6;
}

.fz-proc {
  margin-top: 48px;
}

.fz-proc__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 20px;
}

/* ---- jeden krok ---- */
.fz-proc__step {
  position: relative;
  display: grid;
  grid-template-columns: 56px 1fr;
  column-gap: 18px;
  align-items: stretch;
  padding-bottom: 30px;
}

.fz-proc__step:last-child {
  padding-bottom: 0;
}

/* ---- marker (bod + konektor) ---- */
.fz-proc__marker {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.fz-proc__connector {
  position: absolute;
  z-index: 0;
  top: 56px;
  bottom: -30px;
  left: 50%;
  width: 2px;
  transform: translateX(-50%);
  background: rgba(28, 34, 40, .12);
  border-radius: 2px;
  overflow: hidden;
}

.fz-proc__connector-fill {
  position: absolute;
  inset: 0;
  background: var(--fz-grad);
  transform: scaleY(0);
  transform-origin: top;
  transition: transform .7s cubic-bezier(.4, 0, .2, 1);
}

.fz-proc__step.is-filled .fz-proc__connector-fill {
  transform: scaleY(1);
}

/* ---- bod (číslo zůstává i po rozsvícení; žádné fajfky) ---- */
.fz-proc__dot {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 2px solid rgba(var(--fz-accent-rgb), .28);
  transition: border-color .45s ease;
}

.fz-proc__num {
  font-family: var(--f-head);
  font-weight: 700;
  font-size: 22px;
  color: var(--fz-accent-dark);
  transition: color .45s ease;
}

.fz-proc__step.is-on .fz-proc__dot {
  border-color: var(--brand-accent);
}

.fz-proc__step.is-on .fz-proc__num {
  color: var(--brand-accent);
}

/* ---- karta (centrovaný obsah) ---- */
.fz-proc__card {
  position: relative;
  height: 100%;
  min-height: 210px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background: var(--bg-white);
  border: 1px solid rgba(28, 34, 40, .08);
  border-radius: 12px;
  padding: 30px 22px 26px;
  box-shadow: 0 1px 3px rgba(28, 34, 40, .05);
  opacity: 0;
  transform: translateY(16px) scale(.98);
  transition:
    opacity .5s cubic-bezier(.22, 1, .36, 1),
    transform .5s cubic-bezier(.22, 1, .36, 1),
    box-shadow .5s ease;
}

.fz-proc__step.is-on .fz-proc__card {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* ikony jsou jednobarevné line SVG: tahy dědí `color`, podkladový kruh je
   jemný odstín téže barvy. Obojí z brand tokenů, žádné hexy v JS. */
.fz-proc__icon {
  display: block;
  width: 96px;
  height: 96px;
  margin: 0 auto 16px;
  flex-shrink: 0;
  color: var(--fz-accent-dark);
}

.fz-proc__icon-bg {
  fill: rgba(var(--fz-accent-rgb), .10);
}

.fz-proc__title {
  font-family: var(--f-head);
  font-size: 19px;
  font-weight: 700;
  line-height: 1.25;
  color: var(--text-dark);
  margin: 0;
}

.fz-proc__divider {
  display: block;
  width: 26px;
  height: 3px;
  border-radius: 3px;
  background: var(--fz-grad);
  margin: 14px 0;
}

.fz-proc__text {
  font-size: 15px;
  line-height: 1.55;
  color: var(--text-body);
  margin: 0;
  max-width: 30ch;
}

/* ---- volitelné CTA na kartě (1. krok: online žádost) ----
   `margin-bottom: auto` u textu přisadí tlačítko ke spodní hraně karty
   (v prohlížečích bez :has zůstane rovnou pod textem). */
.fz-proc__text:has(+ .fz-proc__cta) {
  margin-bottom: auto;
}

.fz-proc__cta {
  margin-top: 20px;
  padding: 12px 22px;
  min-height: 46px;
  font-size: 15px;
}

.fz-proc__cta-note {
  margin-top: 9px;
  font-size: 12.5px;
  line-height: 1.4;
  color: var(--text-muted);
}

/* ---- badge „jen u nás" na klíčovém kroku ---- */
.fz-proc__badge {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  white-space: nowrap;
  font-family: var(--f-ui);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: #fff;
  background: var(--fz-grad);
  padding: 6px 13px;
  border-radius: 999px;
  box-shadow: 0 4px 12px -3px rgba(var(--fz-accent-rgb), .5);
  z-index: 2;
}

/* ---- klíčový krok – trvalý lila akcent ---- */
.fz-proc__step--key .fz-proc__card {
  background: var(--brand-darker);
  border-color: var(--brand-accent);
}

/* na zvýrazněné kartě je kruh ikony bílý, aby nesplýval s pozadím */
.fz-proc__step--key .fz-proc__icon-bg {
  fill: #fff;
}

.fz-proc__step--key .fz-proc__title {
  color: var(--fz-accent-dark);
}

.fz-proc__step--key.is-on .fz-proc__card {
  box-shadow: 0 14px 34px -18px rgba(var(--fz-accent-rgb), .35), 0 2px 6px rgba(28, 34, 40, .06);
}

/* ---- DESKTOP: horizontální timeline ---- */
@media (min-width: 860px) {
  .fz-proc__list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
  }

  .fz-proc__step {
    grid-template-columns: none;
    grid-template-rows: 56px 1fr;
    row-gap: 26px;
    column-gap: 0;
    padding-bottom: 0;
  }

  .fz-proc__connector {
    top: 27px;
    bottom: auto;
    left: 50%;
    width: calc(100% + 24px);
    height: 2px;
    transform: none;
  }

  .fz-proc__connector-fill {
    transform: scaleX(0);
    transform-origin: left;
  }

  .fz-proc__step.is-filled .fz-proc__connector-fill {
    transform: scaleX(1);
  }

  .fz-proc__step--key.is-on .fz-proc__card {
    transform: translateY(-6px) scale(1);
  }
}

/* ---- přístupnost: prefers-reduced-motion (backstop) ---- */
@media (prefers-reduced-motion: reduce) {

  .fz-proc__card,
  .fz-proc__connector-fill,
  .fz-proc__dot,
  .fz-proc__num {
    transition: none !important;
  }

  .fz-proc__card {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ===== DIFF CARDS (fz-diff) — „oni vs my" (obdoba comfortmoney) ===== */
.fz-diff {
  margin-top: 56px;
  position: relative;
}

.fz-diff__grid {
  display: grid;
  gap: 20px;
  align-items: start;
  position: relative;
}

.fz-diff__card {
  position: relative;
  border-radius: 14px;
  padding: 30px 28px;
  background: var(--bg-white);
}

.fz-diff__card--them {
  background: #f6f6f8;
  border: 1px solid rgba(28, 34, 40, .1);
}

.fz-diff__card--us {
  background: linear-gradient(180deg, #f7f0fd 0%, #fdfbff 100%);
  border: 1.5px solid rgba(139, 53, 221, .35);
  box-shadow: 0 24px 60px -30px rgba(var(--fz-accent-rgb), .5);
}

/* badge „nezávazné posouzení i nabídka" na us kartě */
.fz-diff__free {
  position: absolute;
  top: 0;
  right: 24px;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--f-ui);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .4px;
  text-transform: uppercase;
  color: #fff;
  background: var(--fz-grad);
  padding: 7px 14px;
  border-radius: 999px;
  box-shadow: 0 6px 16px -4px rgba(var(--fz-accent-rgb), .5);
}

.fz-diff__head {
  display: flex;
  gap: 14px;
  align-items: center;
  padding-bottom: 22px;
  margin-bottom: 22px;
  border-bottom: 1px solid rgba(28, 34, 40, .1);
}

.fz-diff__card--us .fz-diff__head {
  border-bottom-color: rgba(139, 53, 221, .18);
}

.fz-diff__headtext strong {
  display: block;
  font-family: var(--f-head);
  font-weight: 700;
  font-size: clamp(18px, 2.2vw, 22px);
  color: var(--text-dark);
  line-height: 1.2;
}

.fz-diff__headtext span {
  font-size: 15px;
  color: var(--text-body);
}

.fz-diff__card--us .fz-diff__headtext span {
  color: var(--fz-accent-dark);
  font-weight: 600;
}

.fz-diff__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 18px;
}

.fz-diff__list li {
  display: flex;
  gap: 13px;
  align-items: flex-start;
}

.fz-diff__list strong {
  display: block;
  font-family: var(--f-head);
  font-weight: 700;
  font-size: 16px;
  color: var(--text-dark);
  margin-bottom: 2px;
}

.fz-diff__list span {
  font-size: 14.5px;
  color: var(--text-body);
  line-height: 1.5;
}

.fz-diff__ic {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.fz-diff__ic svg {
  width: 22px;
  height: 22px;
}

.fz-diff__ic--sm {
  width: 26px;
  height: 26px;
  margin-top: 1px;
}

.fz-diff__ic--sm svg {
  width: 15px;
  height: 15px;
}

.fz-diff__card--them .fz-diff__ic {
  background: #e6e6ea;
  color: #8a8a95;
}

.fz-diff__card--us .fz-diff__ic {
  background: var(--fz-grad);
  color: #fff;
}

.fz-diff__card--us .fz-diff__ic--sm {
  background: #ede1fb;
  color: var(--fz-accent-dark);
}

/* VS badge mezi kartami */
.fz-diff__vs {
  display: none;
  position: absolute;
  top: 92px;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: #fff;
  color: var(--text-dark);
  font-family: var(--f-head);
  font-weight: 800;
  font-size: 17px;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 20px -6px rgba(28, 34, 40, .3), 0 0 0 6px var(--brand-surface);
}

/* CTA + chipy na us kartě */
.fz-diff__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  margin-top: 26px;
}

.fz-diff__chips {
  list-style: none;
  margin: 16px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 20px;
}

.fz-diff__chips li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--f-ui);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--text-body);
}

.fz-diff__chips svg {
  width: 16px;
  height: 16px;
  color: var(--brand-accent);
}

@media (min-width: 900px) {
  .fz-diff__grid {
    grid-template-columns: 1fr 1fr;
    gap: 28px;
  }

  .fz-diff__vs {
    display: inline-flex;
  }
}

/* ===== SPLIT (obrázek + text) ===== */
.fz-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(32px, 5vw, 64px);
  align-items: center;
}

.fz-split__media {
  margin: 0;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 24px 60px -30px rgba(28, 34, 40, .35);
}

.fz-split__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 3 / 2;
}

.fz-split__body .fz-kicker {
  margin-bottom: 12px;
  display: inline-block;
}

.fz-split__body .fz-lead {
  margin-top: 18px;
}

.fz-split__body .fz-lead + .fz-lead {
  margin-top: 14px;
}

@media (max-width: 900px) {
  .fz-split {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .fz-split__media {
    order: -1;
  }
}

/* ===== GALLERY (dvě fotky vedle sebe) ===== */
.fz-gallery {
  margin-top: 40px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.fz-gallery figure {
  margin: 0;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 18px 44px -26px rgba(28, 34, 40, .35);
}

.fz-gallery img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 3 / 2;
}

@media (max-width: 768px) {
  .fz-gallery {
    grid-template-columns: 1fr;
  }
}

/* CTA band */
.fz-cta-band {
  margin-top: 64px;
  background: var(--fz-grad);
  border-radius: 12px;
  padding: clamp(28px, 4vw, 48px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  color: #fff;
}

.fz-cta-band h2 {
  font-family: var(--f-head);
  font-size: clamp(22px, 2.6vw, 32px);
  font-weight: 700;
  letter-spacing: -.4px;
}

.fz-cta-band p {
  margin-top: 8px;
  font-size: 15px;
  opacity: .92;
}

.fz-cta-band .btn {
  background: #fff;
  color: var(--fz-accent-dark);
  flex-shrink: 0;
  gap: 8px;
  box-shadow: 0 2px 10px rgba(21, 16, 31, .12);
  transition: opacity .2s ease, transform .2s ease, box-shadow .2s ease;
}

.fz-cta-band .btn svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  stroke: currentColor;
  stroke-width: 2.2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .22s var(--ease-out);
}

.fz-cta-band .btn:hover {
  opacity: .96;
  transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(21, 16, 31, .22);
}

.fz-cta-band .btn:hover svg {
  transform: translateX(4px);
}

.fz-cta-band .btn:active {
  transform: translateY(0) scale(.98);
  box-shadow: 0 2px 10px rgba(21, 16, 31, .12);
}

@media (max-width: 1024px) {
  .fz-cta-band {
    flex-direction: column;
    align-items: flex-start;
  }

  .fz-cta-band .btn {
    width: 100%;
  }
}

/* jednoduchý proklik na kontakt — /o-nas/ Naše zázemí */
.fz-visit {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-top: 32px;
  max-width: 720px;
  padding: 22px 24px;
  background: var(--bg-white);
  border: 1px solid rgba(var(--fz-accent-rgb), .12);
  border-radius: 10px;
  text-decoration: none;
  color: inherit;
  transition:
    border-color .25s ease,
    box-shadow .25s ease,
    transform .25s var(--ease-out);
}

.fz-visit:hover {
  border-color: rgba(var(--fz-accent-rgb), .22);
  box-shadow: 0 12px 36px rgba(55, 53, 127, .08);
  transform: translateY(-2px);
}

.fz-visit__ic {
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--fz-grad-soft);
  color: var(--fz-accent-dark);
}

.fz-visit__ic svg {
  width: 22px;
  height: 22px;
  stroke: currentColor;
  stroke-width: 1.8;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.fz-visit__body {
  min-width: 0;
  flex: 1 1 auto;
}

.fz-visit__body strong {
  display: block;
  font-family: var(--f-head);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -.2px;
  color: var(--text-dark);
}

.fz-visit__body span {
  display: block;
  margin-top: 4px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--text-body);
}

.fz-visit__cta {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--f-ui);
  font-size: 13.5px;
  font-weight: 700;
  color: var(--fz-accent-dark);
  white-space: nowrap;
}

.fz-visit__cta svg {
  width: 15px;
  height: 15px;
  stroke: currentColor;
  stroke-width: 2.2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .22s var(--ease-out);
}

.fz-visit:hover .fz-visit__cta {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.fz-visit:hover .fz-visit__cta svg {
  transform: translateX(4px);
}

@media (max-width: 640px) {
  .fz-visit {
    flex-wrap: wrap;
    gap: 14px 16px;
    padding: 20px;
  }

  .fz-visit__cta {
    width: 100%;
    padding-top: 4px;
    border-top: 1px solid rgba(var(--fz-accent-rgb), .1);
  }
}

/* Contact page */
.fz-contact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  margin-top: 8px;
}

.fz-contact-card {
  background: var(--brand-surface);
  border-radius: 12px;
  padding: 36px 32px;
}

.fz-contact-card h2 {
  font-family: var(--f-head);
  font-size: 22px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 20px;
}

.fz-contact-row {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 12px 0;
  font-size: 16px;
  color: var(--text-body);
}

.fz-contact-row .icon {
  color: var(--fz-accent-dark);
  margin-top: 2px;
}

.fz-contact-row a {
  color: var(--text-dark);
  font-weight: 700;
}

.fz-contact-row a:hover {
  text-decoration: underline;
}

.fz-hours {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.fz-hours h3 {
  font-family: var(--f-head);
  font-size: 17px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 10px;
}

.fz-hours__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
  color: var(--text-body);
}

.fz-hours__table th,
.fz-hours__table td {
  padding: 6px 0;
  text-align: left;
  font-weight: 400;
}

.fz-hours__table th {
  font-weight: 600;
  color: var(--text-dark);
  width: 55%;
}

.fz-hours__note {
  margin-top: 12px;
  font-size: 14px;
  color: var(--text-muted);
}

.fz-map {
  width: 100%;
  height: 100%;
  min-height: 320px;
  border: 0;
  border-radius: 12px;
}

@media (max-width: 1024px) {
  .fz-contact-grid {
    grid-template-columns: 1fr;
  }
}

/* Contact page — dept cards (CM-style, 2 sloupce) */
.fz-pagehero--contact {
  padding-bottom: 64px;
}

.fz-pagehero--contact .fz-pagehero__inner--center {
  text-align: center;
  padding-bottom: 8px;
}

.fz-pagehero--contact .fz-pagehero__inner--center .fz-kicker {
  display: block;
}

.fz-pagehero--contact .fz-pagehero__inner--center h1 {
  margin-inline: auto;
}

.fz-pagehero--contact .fz-pagehero__inner--center .fz-pagehero__sub {
  margin-inline: auto;
  max-width: 42ch;
}

.fz-pagehero--contact .fz-pagehero__inner + .fz-pagehero__inner {
  padding-top: 0;
}

.fz-contactgrid--dept {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  margin-top: 28px;
  align-items: stretch;
}

.fz-contactgrid--dept .fz-deptcard {
  align-items: stretch;
  text-align: center;
  gap: 0;
  padding: 22px 20px 18px;
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-rows: auto 1fr auto;
}

.fz-deptcard {
  background: #fff;
  border-radius: 16px;
  padding: 22px 20px 18px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  box-shadow: 0 4px 24px rgba(28, 34, 40, 0.05);
  border: 1px solid rgba(28, 34, 40, 0.08);
  height: 100%;
  transition: transform .2s ease, box-shadow .2s ease;
}

.fz-deptcard:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 32px rgba(28, 34, 40, 0.08);
}

.fz-deptcard__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin: 0 0 14px;
  width: 100%;
  flex: none;
}

.fz-deptcard__head > div {
  min-height: 3.2em;
}

.fz-contactgrid--dept .fz-deptcard__head > div {
  min-height: 4.5em;
}

.fz-deptcard__head h3 {
  margin: 0;
}

.fz-deptcard__head .fz-deptcard__note {
  margin: 4px 0 0;
}

.fz-deptcard__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--fz-grad-soft);
  color: var(--fz-accent-dark);
  flex: none;
}

.fz-deptcard__icon svg {
  width: 22px;
  height: 22px;
}

.fz-deptcard h3 {
  font-family: var(--f-head);
  font-size: 18px;
  font-weight: 600;
  color: var(--text-dark);
  line-height: 1.25;
  letter-spacing: -.2px;
}

.fz-deptcard__note {
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--text-muted);
  margin: 0;
}

.fz-deptcard__main {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  flex: 1 1 auto;
  min-height: 52px;
  padding-bottom: 16px;
}

.fz-deptcard__main .btn {
  width: auto;
  max-width: 100%;
  justify-content: center;
  padding-left: 20px;
  padding-right: 20px;
}

.fz-deptcard__main .fz-deptcard__row {
  display: flex;
  align-self: center;
  width: auto;
  max-width: 100%;
  border-top: 0;
  padding: 0;
}

.fz-deptcard__foot {
  width: 100%;
  flex: none;
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid rgba(28, 34, 40, 0.08);
  min-height: 72px;
  box-sizing: border-box;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.fz-deptcard__foot .fz-deptcard__row {
  border-top: 0;
  padding: 0;
  width: 100%;
  justify-content: center;
}

.fz-deptcard__row {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 0;
  font-family: var(--f-head);
  font-weight: 600;
  font-size: 16px;
  color: var(--text-dark);
  text-decoration: none;
  border-top: 1px solid rgba(28, 34, 40, 0.08);
  transition: color .16s ease;
  width: 100%;
}

.fz-deptcard__row:hover {
  color: var(--fz-accent-dark);
}

.fz-deptcard__row svg {
  flex: none;
  color: var(--fz-accent-dark);
}

.fz-contactgrid--dept .fz-deptcard__row.fz-hours-phone--stacked {
  flex-direction: column;
  align-items: center;
  width: max-content;
  max-width: 100%;
  margin-inline: auto;
  gap: 2px;
  min-height: 48px;
}

.fz-contactgrid--dept .fz-deptcard__row .fz-hours-phone__sub {
  text-align: center;
  align-self: center;
  font-size: 12px;
}

/* světlá karta: muted text, ne --fz-on-dark-soft */
html[data-fz-hours="closed"] .fz-contactgrid--dept .fz-deptcard__row .fz-hours-phone__sub {
  color: var(--text-muted);
}

html[data-fz-hours="closed"] .fz-precta__spec-phone .fz-hours-phone__main {
  color: var(--fz-on-dark-soft);
}

html[data-fz-hours="closed"] .fz-precta__spec-phone .fz-precta__spec-ic {
  color: var(--fz-on-dark-soft);
}

html[data-fz-hours="closed"] .fz-precta__spec-phone .fz-hours-phone__sub {
  color: var(--fz-on-dark-soft);
}

html[data-fz-hours="open"] .fz-precta__spec-phone .fz-hours-phone__sub {
  color: #cfcaf7;
  font-weight: 500;
}

.fz-infogrid {
  display: grid;
  grid-template-columns: 1.25fr 0.85fr;
  gap: 28px;
  align-items: stretch;
}

.fz-contact-sidlo__head {
  margin-bottom: 32px;
}

.fz-contact-sidlo__head .fz-h2 {
  margin-top: 4px;
}

.fz-infobox {
  background: #fff;
  border-radius: 16px;
  padding: 26px 28px;
  border: 1px solid rgba(28, 34, 40, 0.08);
  box-shadow: 0 4px 24px rgba(28, 34, 40, 0.05);
  height: 100%;
}

.fz-infobox__title {
  font-family: var(--f-head);
  font-size: 18px;
  font-weight: 600;
  color: var(--text-dark);
  margin: 0 0 4px;
  padding: 0 0 14px;
  border-bottom: 1px solid rgba(28, 34, 40, 0.08);
}

.fz-infobox__note {
  margin: 0;
  padding-top: 16px;
  border-top: 1px solid rgba(28, 34, 40, 0.08);
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--text-muted);
}

.fz-deflist {
  margin: 0;
  display: grid;
  gap: 0;
}

.fz-deflist > div {
  display: grid;
  grid-template-columns: 148px 1fr;
  gap: 12px 20px;
  padding: 14px 0;
  border-top: 1px solid rgba(28, 34, 40, 0.08);
  background: none;
  border-radius: 0;
}

.fz-deflist > div + div {
  margin-top: 0;
}

.fz-deflist > div:first-child {
  border-top: 0;
  padding-top: 16px;
}

.fz-deflist > div:last-child {
  padding-bottom: 0;
}

.fz-deflist dt {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-muted);
  padding-top: 2px;
  letter-spacing: .01em;
  text-transform: none;
}

.fz-deflist dd {
  margin: 0;
  font-size: 15px;
  line-height: 1.5;
  color: var(--text-dark);
}

.fz-hours-list {
  list-style: none;
  margin: 0;
  padding: 16px 0 4px;
  display: grid;
  gap: 0;
}

.fz-hours-list li {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0;
  border-top: 1px solid rgba(28, 34, 40, 0.08);
  font-size: 15px;
  color: var(--text-body);
  background: none;
  border-radius: 0;
}

.fz-hours-list li:first-child {
  border-top: 0;
  padding-top: 0;
}

.fz-hours-list li:last-child {
  padding-bottom: 16px;
}

.fz-hours-list strong {
  color: var(--text-dark);
  font-weight: 700;
}

.fz-contact-map {
  margin-top: 28px;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(55, 53, 127, 0.1);
  box-shadow: 0 8px 28px rgba(55, 53, 127, 0.08);
  background: var(--bg-white);
}

.fz-contact-map iframe {
  display: block;
  width: 100%;
  height: 420px;
  border: 0;
}

@media (max-width: 900px) {
  .fz-contactgrid--dept,
  .fz-infogrid {
    grid-template-columns: 1fr;
  }

  .fz-deflist > div {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

/* Thank-you page */
.fz-thanks {
  min-height: 60vh;
  display: flex;
  align-items: center;
}

/* ===== IKONOVÉ KARTY (pro-koho a spol.) ===== */
.fz-twocol {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: start;
}

.fz-twocol .fz-h2 {
  font-size: clamp(24px, 2.4vw, 32px);
  margin-bottom: 24px;
}

.fz-icards {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.fz-icard {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  background: var(--bg-white);
  border: 1px solid rgba(28, 34, 40, .08);
  border-radius: 10px;
  padding: 18px 20px;
  box-shadow: 0 4px 18px rgba(21, 16, 31, .06);
}

.fz-icard__icon {
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--fz-accent-dark);
  flex-shrink: 0;
}

.fz-icard__icon .icon {
  width: 24px;
  height: 24px;
}

.fz-icard h3 {
  font-family: var(--f-head);
  font-size: 16.5px;
  font-weight: 700;
  color: var(--text-dark);
}

.fz-icard p {
  margin-top: 4px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--text-muted);
}

.fz-icard p strong {
  color: var(--text-dark);
  font-weight: 600;
}

.fz-uses {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.fz-uses li {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  background: var(--bg-white);
  border: 1px solid rgba(28, 34, 40, .08);
  border-radius: 10px;
  box-shadow: 0 4px 18px rgba(21, 16, 31, .06);
  font-family: var(--f-head);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--text-dark);
}

.fz-uses__ic {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  background: var(--fz-grad-soft);
  color: var(--fz-accent-dark);
}

.fz-uses__ic svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  stroke-width: 1.8;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.fz-quote {
  font-style: italic;
  font-size: 14px;
  color: var(--text-muted);
  margin-bottom: 10px;
}

@media (max-width: 1024px) {
  .fz-twocol {
    grid-template-columns: 1fr;
  }
}

/* ===== PRE-FOOTER: kontakt + lead formulář =====
   Tmavý pás ze stejné rodiny jako .fz-tsit, aby závěrečné CTA neslo váhu konce
   stránky. Skládá se ze tří vrstev:
     1. indigo základ, svisle ztmavující (nahoře brandové #37357f, dole #211f47),
     2. lososový reflex vpravo nahoře,
     3. lososový přeliv v úhlu 135°, tedy ve stejném směru jako --fz-grad
        u tlačítek — pás tak jde od indiga k druhé brandové barvě (#E46299).
   Losos je držený vpravo dole (kde leží bílá karta formuláře), aby bílý text
   v levém sloupci zůstal na tmavém indigu. Karty uvnitř zůstávají bílé,
   přebarvují se jen texty ležící přímo na pásu. */
.fz-precta {
  background:
    linear-gradient(135deg, rgba(228, 98, 153, 0) 40%, rgba(228, 98, 153, .3) 100%),
    radial-gradient(760px 420px at 94% -10%, rgba(228, 98, 153, .22), transparent 62%),
    linear-gradient(163deg, #37357f 0%, #2c2a63 46%, #211f47 100%);
  color: #fff;
  padding: var(--py) var(--px);
}

.fz-precta .fz-kicker {
  color: #cfcaf7;
}

.fz-precta__inner {
  max-width: var(--max-w);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 520px);
  gap: 64px;
  align-items: start;
}

.fz-precta h2 {
  font-family: var(--f-head);
  font-size: clamp(30px, 3.6vw, 46px);
  font-weight: 700;
  letter-spacing: -.8px;
  line-height: 1.12;
  color: #fff;
}

/* --fz-grad-light je ladovaný na světlé plochy, na indigu by zmizel:
   na tmavém pásu jede gradientový text ve světlé variantě obou konců
   (obojí drží nad 6:1 proti #2c2a63). */
.fz-precta h2 em {
  font-style: normal;
  background: linear-gradient(135deg, #bdb8f7, #f3a2be);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.fz-precta__text {
  margin-top: 18px;
  font-size: 16px;
  line-height: 1.6;
  color: var(--fz-on-dark-muted);
  max-width: 480px;
}

.fz-precta__spec {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, .12);
  max-width: 100%;
}

.fz-precta__spec-label {
  font-family: var(--f-ui);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--fz-on-dark-soft);
  line-height: 1.3;
}

.fz-precta__spec img {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  background: #e9e3f2;
}

.fz-precta__spec-name {
  font-family: var(--f-head);
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  margin-top: 2px;
}

.fz-precta__spec-hours {
  font-family: var(--f-ui);
  font-size: 13px;
  font-weight: 600;
  color: var(--fz-on-dark-soft);
  margin-top: 3px;
}

.fz-precta__spec a:not(.fz-precta__spec-phone) {
  font-size: 14px;
  font-weight: 700;
  color: var(--fz-accent-dark);
}

.fz-precta__spec a:not(.fz-precta__spec-phone):hover {
  text-decoration: underline;
}

.fz-precta__form-card {
  background: var(--bg-white);
  border: 1px solid transparent;
  border-radius: 12px;
  padding: clamp(24px, 3vw, 36px);
  box-shadow: 0 24px 60px rgba(12, 10, 40, .3);
}

.fz-precta__form-title {
  font-family: var(--f-head);
  font-size: 22px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 20px;
}

/* Když pod titulkem stojí podtitulek, titulek si vezme menší mezeru.
   Modal „Zavoláme vám zpátky" (main.js) staví kartu bez podtitulku
   a nechává si původních 20px. */
.fz-precta__form-title:has(+ .fz-precta__form-sub) {
  margin-bottom: 8px;
}

.fz-precta__form-sub {
  margin: 0 0 20px;
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--text-body);
}

/* Lead formulář — precta i modal (karta se při otevření modalu přesune mimo .fz-precta) */
.fz-precta__form-card .footer__form {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}

.fz-precta__form-card .footer__form-row {
  display: flex;
  gap: 16px;
  width: 100%;
}

.fz-precta__form-card .footer__field {
  flex: 1;
  min-width: 0;
  width: 100%;
}

.fz-precta__form-card .footer__field label {
  color: var(--text-dark);
}

.fz-precta__form-card .footer__field input,
.fz-precta__form-card .footer__field textarea {
  color: var(--text-dark);
  background: #fff;
  border: 1px solid rgba(28, 34, 40, 0.16);
  border-radius: 10px;
}

.fz-precta__form-card .footer__field input:focus,
.fz-precta__form-card .footer__field textarea:focus {
  border-color: rgba(var(--fz-accent-rgb), 0.45);
}

.fz-precta__form-card .footer__gdpr {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 8px 10px;
  width: 100%;
}

.fz-precta__form-card .footer__gdpr input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin-top: 2px;
  flex: none;
}

.fz-precta__form-card .footer__gdpr label {
  flex: 1;
  min-width: 0;
  color: var(--text-body);
  font-size: 13px;
  line-height: 1.45;
}

.fz-precta__form-card .footer__gdpr .form-error {
  flex: 1 1 100%;
  margin-left: 28px;
}

.fz-precta__form-card .form-status {
  width: 100%;
  margin-top: 0;
}

.fz-precta__form-card .footer__submit {
  width: 100%;
  align-self: stretch;
  text-align: center;
  justify-content: center;
  display: flex;
  font-size: 17px;
  min-height: 52px;
  background: var(--fz-grad);
  color: #fff;
  border: none;
}

.fz-precta__form-card .footer__submit:hover {
  opacity: .9;
  transform: translateY(-1px);
}

@media (max-width: 520px) {
  .fz-precta__form-card .footer__form-row {
    flex-direction: column;
    gap: 20px;
  }
}

@media (max-width: 640px) {
  .footer__form-row,
  .fz-precta__form-card .footer__form-row {
    flex-direction: column;
    gap: 20px;
  }

  .footer__submit,
  .fz-precta__form-card .footer__submit {
    width: 100%;
    min-height: 52px;
  }
}

@media (max-width: 1024px) {
  .fz-precta__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .fz-precta__spec {
    margin-top: 28px;
    padding-top: 22px;
  }

  .fz-precta__spec-phone {
    min-height: 44px;
  }
}

/* ===== MODAL — formulář po kliku na CTA kalkulačky ===== */
.fz-modal {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  padding-bottom: max(16px, env(safe-area-inset-bottom));
}

.fz-modal[hidden] {
  display: none;
}

.fz-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(21, 16, 31, .55);
}

.fz-modal__dialog {
  position: relative;
  width: 100%;
  max-width: 560px;
  max-height: calc(100dvh - 40px);
  overflow-y: auto;
  border-radius: 14px;
  animation: fzFadeUp .3s var(--ease-out) both;
}

.fz-modal__dialog .fz-precta__form-card {
  box-shadow: 0 24px 80px rgba(21, 16, 31, .35);
  padding-right: 52px;
}

.fz-modal__dialog .fz-precta__form-title {
  padding-right: 8px;
}

.fz-modal__close {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 2;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background: rgba(28, 34, 40, .07);
  color: var(--text-dark);
  font-size: 18px;
  line-height: 1;
}

.fz-modal__close:hover {
  background: rgba(28, 34, 40, .14);
}

body.modal-open {
  overflow: hidden;
}

/* ===== PLOVOUCÍ BADGE SPECIALISTY (vpravo dole) ===== */
.fz-agent {
  position: fixed;
  right: 20px;
  bottom: calc(20px + env(safe-area-inset-bottom));
  z-index: 250;
}

/* zabalený stav: pill s fotkou + klikatelným číslem */
.fz-agent__bar {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--bg-white);
  border: 1px solid rgba(28, 34, 40, .08);
  border-radius: var(--r-pill);
  padding: 5px 18px 5px 5px;
  box-shadow: 0 10px 30px rgba(21, 16, 31, .25);
}

.fz-agent__id {
  display: flex;
  flex-direction: column;
  line-height: 1.25;
  white-space: nowrap;
}

.fz-agent__id strong {
  font-family: var(--f-head);
  font-size: 13px;
  font-weight: 600;
  color: var(--text-muted);
}

.fz-agent__id span {
  font-family: var(--f-head);
  font-size: 16px;
  font-weight: 700;
  color: var(--text-dark);
}

.fz-agent__id:hover span {
  color: var(--fz-accent-dark);
}

.fz-agent__toggle {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: none;
  padding: 0;
  position: relative;
  background: #e9e3f2;
  flex-shrink: 0;
  transition: transform .15s;
}

.fz-agent__toggle:hover {
  transform: scale(1.05);
}

.fz-agent__toggle img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}

.fz-agent__dot {
  position: absolute;
  top: 0;
  right: 0;
  width: 15px;
  height: 15px;
  background: var(--green);
  border: 2.5px solid #fff;
  border-radius: 50%;
}

.fz-agent__panel {
  position: absolute;
  right: 0;
  bottom: 68px;
  width: 296px;
  background: var(--bg-white);
  border: 1px solid rgba(28, 34, 40, .08);
  border-radius: 14px;
  box-shadow: 0 24px 64px rgba(21, 16, 31, .25);
  padding: 20px;
  display: none;
  transform-origin: bottom right;
}

.fz-agent.is-open .fz-agent__panel {
  display: block;
  animation: fzFadeUp .25s var(--ease-out) both;
}

.fz-agent__head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}

.fz-agent__head img {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
  background: #e9e3f2;
}

.fz-agent__head strong {
  display: block;
  font-family: var(--f-head);
  font-size: 16px;
  font-weight: 700;
  color: var(--text-dark);
}

.fz-agent__head span {
  display: block;
  font-size: 12.5px;
  color: var(--text-muted);
  margin-top: 2px;
}

.fz-agent__phone {
  display: block;
  font-family: var(--f-head);
  font-size: 22px;
  font-weight: 700;
  color: var(--fz-accent-dark);
}

.fz-agent__phone:hover {
  text-decoration: underline;
}

.fz-agent__hours {
  display: block;
  font-size: 12.5px;
  color: var(--text-muted);
  margin: 2px 0 14px;
}

.fz-agent__btns {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.fz-agent__btns .btn {
  min-height: 44px;
  padding: 10px 16px;
  font-size: 14.5px;
}

@media (max-width: 640px) {

  /* na mobilu je badge hlavní kontaktní prvek — o chlup menší, panel přes šířku */
  .fz-agent {
    right: 16px;
  }

  .fz-agent__panel {
    bottom: 66px;
    width: calc(100vw - 32px);
    max-width: 320px;
  }
}

/* ===== FOOTER (tmavý) =====
   Nejtmavší plocha webu: navazuje na spodní hranu .fz-precta (#211f47) a jde
   ještě hlouběji, takže konec stránky opticky "dosedne". Hranici drží samotný
   propad odstínu, ne linka — světlá hairline mezi dvěma tmavými pásy by
   působila jako šev. Logo musí být bílá varianta: assets/logo-fz.png má pozadí
   zapečené v RGB (bez alfa kanálu), na tmavém pásu by svítil bílý obdélník. */
.fz-footer {
  background: linear-gradient(160deg, #1c2029 0%, #15171C 55%, #0f1115 100%);
  color: #fff;
  padding-block: 56px 28px;
}

.fz-footer__container {
  max-width: var(--max-w);
  margin: 0 auto;
  padding-inline: var(--px);
}

.fz-footer__grid {
  display: grid;
  gap: 32px;
}

.fz-footer__logo {
  height: 52px;
  width: auto;
  display: block;
}

.fz-footer a:has(> .fz-footer__logo) {
  display: inline-block;
  margin-bottom: 14px;
}

.fz-footer a:has(> .fz-footer__logo) .fz-footer__logo {
  margin-bottom: 0;
}

.fz-footer__about {
  font-size: 14px;
  color: var(--fz-on-dark-muted);
  max-width: 40ch;
  margin: 0;
  line-height: 1.6;
}

.fz-footer__about strong {
  color: #fff;
  font-weight: 700;
}

.fz-footer__col h3 {
  font-family: var(--f-body);
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 12px;
}

.fz-footer__col a {
  display: block;
  font-size: 14px;
  color: var(--fz-on-dark-muted);
  padding: 5px 0;
  transition: opacity .2s;
  text-decoration: none;
}

.fz-footer__col a:hover {
  opacity: .65;
}

.fz-footer__legal {
  margin-top: 32px;
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, .14);
  font-size: 12.5px;
  color: var(--fz-on-dark-soft);
  line-height: 1.7;
}

.fz-footer__legal p {
  margin: 0;
}

.fz-footer__bottom {
  margin-top: 22px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 18px;
  font-size: 12.5px;
  color: var(--fz-on-dark-soft);
}

.fz-footer__legal-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin-left: auto;
}

.fz-footer__legal-links a {
  color: inherit;
  text-decoration: none;
  transition: opacity .2s;
}

.fz-footer__legal-links a:hover {
  opacity: .65;
}

.fz-footer a:focus-visible {
  outline-color: #fff;
}

@media (min-width: 992px) {
  .fz-footer__grid {
    grid-template-columns: 2fr 1fr 1.4fr;
  }
}

@media (max-width: 640px) {
  .fz-footer__legal-links {
    margin-left: 0;
  }

  .fz-footer__legal-links a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
}

@media (pointer: coarse) {
  input[type="range"].fz-range::-webkit-slider-thumb,
  input[type="range"].fz-range::-moz-range-thumb {
    width: 32px;
    height: 32px;
  }
}

.cfg-cc__btn {
  min-height: 48px;
}

@media (max-width: 640px) {
  .cfg-cc__btns {
    flex-direction: column;
  }

  .cfg-cc__btn {
    width: 100%;
  }

  .fz-need__cta {
    display: flex;
    width: 100%;
  }

  .fz-need__cta .btn {
    width: 100%;
  }
}

/* Footer (light) */
.footer {
  border-top: 1px solid rgba(28, 34, 40, .08);
}

.footer__watermark {
  font-size: clamp(140px, 30vw, 460px);
  color: rgba(28, 34, 40, .04);
}

/* Honeypot: display:none na inputu brání autofillu prohlížeče (off-screen ho nezastaví),
   ale HTTP boti pole stejně vyplní → past zůstává funkční. */
input[name="website"] {
  display: none !important
}

/* Dotyk: ruší „přilepený" hover transform po tapnutí na touch zařízeních */
@media (hover: none) {

  .btn--primary:hover,
  .fz-cta-band .btn:hover,
  .fz-card:hover,
  .fz-param:hover,
  .fz-feature__cta:hover,
  .fz-reason:hover,
  .fz-agent__toggle:hover {
    transform: none;
  }

  /* podtržení a posun šipky nechat jen pro skutečný hover */
  .fz-param:hover .fz-param__link,
  .fz-reason:hover .fz-reason__link {
    text-decoration: none;
  }

  .fz-param:hover .fz-param__link svg,
  .fz-reason:hover .fz-reason__link svg,
  .fz-cta-band .btn:hover svg {
    transform: none;
  }
}

/* ============================================================
   KARUSEL TYPICKÝCH SITUACÍ (persona + citace + popis)
   Převzato z Comfort Money (.cm-tcar), přebarveno na FZ tokeny
   a bez avatarů/jmen: případy jsou ilustrativní, ne reference.
   ============================================================ */
/* Tmavý indigo pás, na kterém karusel leží — aby se „Typické situace" oddělily
   od okolních bílých a světle fialových sekcí. Druhý tmavý pás webu je
   závěrečné CTA (.fz-precta), gradient drží stejnou paletu.
   Karty uvnitř zůstávají bílé, mění se jen texty sekce (kicker, h2, lead, poznámky). */
.fz-tsit {
  background:
    radial-gradient(760px 400px at 6% -10%, rgba(228, 98, 153, .22), transparent 62%),
    linear-gradient(150deg, #2c2a63 0%, #37357f 52%, #423f93 100%);
  color: #fff;
  overflow: hidden;
}

.fz-tsit .fz-kicker {
  color: #cfcaf7;
}

/* .fz-h2 má max-width 720px, takže text-align sám nestačí — box se musí
   vycentrovat i margin auto, jinak nadpis sedí vlevo (stejně jako .fz-lead). */
.fz-tsit .fz-h2 {
  color: #fff;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

/* lead má max-width 640px, proto se kromě zarovnání musí i vycentrovat boxem */
.fz-tsit .fz-lead {
  color: var(--fz-on-dark-muted);
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.fz-tsit .fz-tstory {
  border-color: transparent;
  box-shadow: 0 24px 60px rgba(12, 10, 40, .3);
}

.fz-tsit .fz-tcar__count {
  color: var(--fz-on-dark-muted);
}

.fz-tsit .fz-tcar__count b {
  color: #fff;
}

.fz-tsit .fz-tcar__dot {
  background: rgba(255, 255, 255, .3);
}

.fz-tsit .fz-tcar__dot.is-active {
  background: #fff;
}

.fz-tsit .fz-disclaimer {
  color: var(--fz-on-dark-muted);
}

.fz-tsit__note {
  margin-top: 40px;
  font-size: 14px;
  color: var(--fz-on-dark-soft);
}

.fz-tsit__note strong {
  color: rgba(255, 255, 255, .88);
}

.fz-tcar {
  margin-top: 40px;
}

.fz-tcar__stage {
  display: flex;
  align-items: center;
  gap: 14px;
}

.fz-tcar__nav {
  flex: 0 0 auto;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 0;
  background: var(--bg-white);
  color: var(--fz-accent-dark);
  display: grid;
  place-items: center;
  box-shadow: 0 6px 18px rgba(21, 16, 31, .07);
  transition: transform var(--dur-fast) var(--ease-out), background-color var(--dur-fast) ease, color var(--dur-fast) ease;
}

.fz-tcar__nav svg {
  width: 24px;
  height: 24px;
}

.fz-tcar__nav:hover {
  background: var(--fz-grad);
  color: #fff;
  transform: scale(1.06);
}

/* na tmavém pásu je výchozí indigo focus ring neviditelný → bílý */
.fz-tsit .fz-tcar__nav:focus-visible {
  outline-color: #fff;
}

/* musí být PO :hover — stejná specificita, jinak by hover přebil press */
.fz-tcar__nav:active {
  transform: scale(.94);
}

.fz-tcar__viewport {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  border-radius: 10px;
}

.fz-tcar__track {
  display: flex;
  will-change: transform;
  transition: transform .5s var(--ease-in-out);
}

.fz-tstory {
  flex: 0 0 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  background: var(--bg-white);
  border: 1px solid rgba(28, 34, 40, .08);
  border-radius: 10px;
  padding: 28px 32px 32px;
}

.fz-tstory__head {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid rgba(28, 34, 40, .08);
}

.fz-tstory__badge {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  background: var(--fz-grad-soft);
  color: var(--fz-accent-dark);
}

.fz-tstory__badge svg {
  width: 24px;
  height: 24px;
}

.fz-tstory__role {
  margin: 0;
  font-family: var(--f-head);
  font-weight: 700;
  font-size: 18px;
  line-height: 1.25;
  letter-spacing: -.15px;
  color: var(--text-dark);
}

.fz-tstory__tag {
  margin: 4px 0 0;
  font-size: 14px;
  line-height: 1.45;
  color: var(--text-muted);
}

.fz-tstory__quote {
  margin: 0 0 16px;
  padding: 0 0 0 14px;
  border-left: 3px solid var(--fz-accent-dark);
  font-family: var(--f-head);
  font-size: 15px;
  font-weight: 600;
  font-style: normal;
  line-height: 1.5;
  color: var(--text-dark);
}

.fz-tstory__quote::before {
  content: "\201E";
  margin-right: .12em;
  color: var(--fz-accent-dark);
}

.fz-tstory__desc {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--text-body);
}

/* ---- NEPOUŽITO: krokový diagram (Situace → Naše řešení → Výsledek).
   Markup byl z karet odstraněn, pravidla zůstávají pro případný návrat. ---- */
.fz-tstory__flow {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 4px;
}

.fz-tstep {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 4px;
}

.fz-tstep__icon {
  width: 78px;
  height: 78px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--fz-grad-soft);
  color: var(--fz-accent-dark);
  margin-bottom: 6px;
}

.fz-tstep__icon svg {
  width: 36px;
  height: 36px;
}

/* „Situace" = neutrální šedý (výchozí stav klienta) */
.fz-tstory__flow .fz-tstep:first-child .fz-tstep__icon {
  background: #eef0f2;
  color: #8a9099;
}

.fz-tstory__flow .fz-tstep:first-child .fz-tstep__big {
  color: #6b7280;
}

/* „Výsledek" = zelený */
.fz-tstep--after .fz-tstep__icon {
  background: #e9f5ee;
  color: var(--fz-success);
}

.fz-tstep__label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.fz-tstory__flow .fz-tstep:not(:first-child):not(.fz-tstep--after) .fz-tstep__label {
  color: var(--fz-accent-dark);
}

.fz-tstep--after .fz-tstep__label {
  color: var(--fz-success);
}

.fz-tstep__big {
  font-family: var(--f-head);
  font-weight: 700;
  font-size: 19px;
  line-height: 1.2;
  color: var(--text-dark);
}

.fz-tstep__big--ok {
  color: var(--fz-success);
}

.fz-tstep__val {
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--text-body);
}

.fz-tstep__val i {
  font-style: normal;
  color: var(--text-muted);
}

.fz-tstep__pill {
  margin-top: 10px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  background: #e9f5ee;
  color: var(--fz-success);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.3;
}

.fz-tstep__pill::before {
  content: "✓";
  font-weight: 800;
}

.fz-tflow-arrow {
  flex: 0 0 auto;
  color: #aeb4ba;
  margin-top: 22px;
}

.fz-tflow-arrow svg {
  width: 42px;
  height: 42px;
}

.fz-tcar__foot {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  margin-top: 22px;
}

.fz-tcar__count {
  font-family: var(--f-head);
  font-size: 14px;
  color: var(--text-muted);
}

.fz-tcar__count b {
  color: var(--text-dark);
}

.fz-tcar__dots {
  display: flex;
  gap: 8px;
}

.fz-tcar__dot {
  width: 9px;
  height: 9px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(28, 34, 40, .16);
  transition: background .2s ease, width .2s ease;
}

.fz-tcar__dot.is-active {
  width: 24px;
  border-radius: 999px;
  background: var(--fz-accent-dark);
}

/* Poznámka o ilustrativnosti případů */
.fz-disclaimer {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 8px;
  margin: 28px auto 0;
  max-width: 46em;
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--text-muted);
  text-align: left;
}

.fz-disclaimer svg {
  flex: 0 0 auto;
  margin-top: 2px;
}

@media (max-width: 960px) {
  .fz-tstory {
    gap: 26px;
    padding: 30px 26px;
  }

  .fz-tstep__icon {
    width: 64px;
    height: 64px;
  }

  .fz-tstep__icon svg {
    width: 30px;
    height: 30px;
  }

  .fz-tflow-arrow svg {
    width: 30px;
    height: 30px;
  }
}

@media (max-width: 768px) {

  /* na telefonu i tabletu na výšku stačí swipe a tečky */
  .fz-tcar__nav {
    display: none;
  }

  .fz-tcar__stage {
    gap: 0;
  }

  .fz-tstory {
    padding: 24px 18px 26px;
  }

  .fz-tstory__head {
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    gap: 12px;
    padding-bottom: 16px;
    margin-bottom: 16px;
  }

  .fz-tstory__quote {
    margin-bottom: 14px;
  }

  .fz-tstory__desc {
    text-align: left;
  }

  /* svisle naskládané kroky; „Naše řešení" je u nás hlavní odlišení, proto zůstává */
  .fz-tstory__flow {
    flex-direction: column;
    align-items: center;
    gap: 6px;
  }

  .fz-tflow-arrow {
    margin-top: 0;
    transform: rotate(90deg);
  }

  .fz-disclaimer {
    text-align: left;
  }
}