/* V4 — sestavení: Úvod + „Na této stránce“ ← V3.2, Dvě formy financování ← V3.3 (a3-switch; CTA předvyplní
   „Zajištění“ ve formuláři přes data-topic), Proč financovat s námi ← V3.1 (čtvercové karty .ikarty),
   Pro koho ← V3.1, Jak to probíhá ← V3.1 (kroky; konstantní výška boxů řeší sdílený zaklad.css),
   Kalkulačka ← V3.1, Podklady ← V3.1, Časté otázky ← V3.3 (a3-faq), Formulář ← V3.1 (e-mail povinný).
   Komponenty a3-switch / a3-faq: alt.css + alt.js (sdílené). */
/* =====================================================================
   Financování pro podnikatele — doplňky stránky (jen tokeny ze zaklad.css)
   ===================================================================== */

/* ---------- úvod: štítek + poznámka ---------- */
.fin-hero-note{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:16px}
.phero .fin-hero-note .tag,.phero .fin-hero-note .fine{margin:0}

/* ---------- dvě formy: a3-switch (V3.3) — delší popisky voleb ---------- */
.fin-switch .a3-sw-bar{width:min(720px,100%)}

/* ---------- pro koho: čipy + jasné vymezení ---------- */
.fin-who{align-items:center}
.fin-who h2{margin:20px 0 22px}
.fin-chips{margin-top:30px}
.fin-note{position:relative;padding:58px 44px 40px;border:var(--lw) solid var(--line);background:linear-gradient(180deg,var(--card),transparent 80%);margin-top:28px}
.fin-note::before{content:"";position:absolute;inset:8px;border:var(--lw) solid var(--line-2);pointer-events:none}
.fin-note > *{position:relative}
.fin-note-ic{position:absolute;left:44px;top:-27px;width:54px;height:54px;display:grid;place-items:center;border:var(--lw) solid var(--line-s);background:var(--bg);color:var(--g2);transform:rotate(45deg)}
.fin-note > .fin-note-ic{position:absolute}
.fin-note-ic .ico{width:26px;height:26px;transform:rotate(-45deg)}
.fin-note-t{font-family:var(--display);font-size:clamp(24px,2.2vw,30px);line-height:1.25}
.fin-seg{border:0;margin:30px 0 0;padding:24px 0 0;min-width:0;border-top:var(--lw) solid var(--line-2)}
.fin-seg legend{float:left;width:100%;padding:0;margin-bottom:14px;font-size:11.5px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--g2)}
.fin-seg-opts{clear:both;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.fin-seg label{position:relative;display:block;cursor:pointer}
.fin-seg input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.fin-seg label span{display:flex;align-items:center;justify-content:center;min-height:50px;padding:4px 10px 0;text-align:center;font-size:12px;font-weight:600;letter-spacing:.14em;line-height:1.3;text-transform:uppercase;color:var(--muted);box-shadow:inset 0 0 0 var(--lw) var(--line);transition:color .3s,background .3s,box-shadow .3s}
.fin-seg label:hover span{color:var(--g2);box-shadow:inset 0 0 0 var(--lw) var(--g1)}
.fin-seg input:checked + span{color:var(--on-gold);background:var(--gg);box-shadow:none}
.fin-seg input:focus-visible + span{outline:1px solid var(--g2);outline-offset:3px}
.fin-res{margin-top:20px;min-height:76px}
.fin-res-i{display:flex;gap:12px;align-items:flex-start;font-size:15.5px;line-height:1.6;color:var(--muted)}
.fin-res-i[hidden]{display:none}
.fin-res-i .ico{width:22px;height:22px;flex:none;margin-top:1px;stroke-width:1.8}
.fin-res-i.is-ok{color:var(--ink)}
.fin-res-i.is-ok .ico{color:var(--g2)}
.fin-res-i.is-no .ico{color:var(--g1)}
.fin-res-i.is-in{animation:tabin .6s var(--ease)}
.fin-res-i a{color:var(--g2);text-underline-offset:3px;white-space:nowrap}

/* ---------- kalkulačka: hodnota → max. úvěr (50 %) → měsíční splátka ---------- */
.calc{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);border:var(--lw) solid var(--line);background:var(--bg)}
.calc-in{display:grid;align-content:center;gap:40px;padding:50px 52px 46px}
.calc-f-top{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 20px}
.calc-f label{font-size:11.5px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--g2)}
.calc-ast{margin-left:.2em;color:var(--g2);letter-spacing:0}
.calc-num{display:inline-flex;align-items:baseline;gap:10px;font-family:var(--display);font-size:32px;line-height:1}
.calc-num input{width:6.4em;padding:2px 0 8px;border:0;border-bottom:var(--lw) solid var(--line);border-radius:0;background:transparent;outline:none;text-align:right;font-family:var(--display);font-size:inherit;line-height:1.1;color:var(--ink);transition:border-color .3s}
.calc-num input:hover{border-bottom-color:var(--line-s)}
.calc-num input:focus{border-bottom-color:var(--g2)}
.calc-num > span{font-size:.62em;color:var(--muted)}
.calc-val{font-family:var(--display);font-size:32px;line-height:1;white-space:nowrap}
.calc-val small{margin-left:10px;font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--faint)}
/* posuvník: dvojitá linka jako u kroků, zlatá výplň končí ve středu kosočtverce */
.calc-range{--f:0;--th:18px;display:block;width:100%;height:32px;margin:12px 0 0;padding:0;background:transparent;cursor:pointer;-webkit-appearance:none;appearance:none}
.calc-range::-webkit-slider-runnable-track{height:6px;border:0;background:
  var(--gg) 0 0/calc((100% - var(--th)) * var(--f) + var(--th) / 2) 2px no-repeat,
  linear-gradient(var(--line),var(--line)) 0 0/100% 1px no-repeat,
  linear-gradient(var(--line-2),var(--line-2)) 0 100%/100% 1px no-repeat}
.calc-range::-moz-range-track{height:6px;border:0;background:
  var(--gg) 0 0/calc((100% - var(--th)) * var(--f) + var(--th) / 2) 2px no-repeat,
  linear-gradient(var(--line),var(--line)) 0 0/100% 1px no-repeat,
  linear-gradient(var(--line-2),var(--line-2)) 0 100%/100% 1px no-repeat}
.calc-range::-webkit-slider-thumb{width:var(--th);height:var(--th);margin-top:calc((6px - var(--th)) / 2);border:var(--lw) solid var(--g2);background:radial-gradient(circle,var(--g2) 0 2.5px,var(--bg) 3.5px);transform:rotate(45deg);box-shadow:0 0 0 0 transparent;transition:box-shadow .3s,background .3s;-webkit-appearance:none;appearance:none}
.calc-range::-moz-range-thumb{box-sizing:border-box;width:var(--th);height:var(--th);border:var(--lw) solid var(--g2);border-radius:0;background:radial-gradient(circle,var(--g2) 0 2.5px,var(--bg) 3.5px);transform:rotate(45deg);transition:box-shadow .3s}
.calc-range:hover::-webkit-slider-thumb,.calc-range:active::-webkit-slider-thumb{box-shadow:0 0 14px -2px var(--g2)}
.calc-range:hover::-moz-range-thumb,.calc-range:active::-moz-range-thumb{box-shadow:0 0 14px -2px var(--g2)}
.calc-range:focus{outline:none}
.calc-range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--bg),0 0 0 4px var(--g2)}
.calc-range:focus-visible::-moz-range-thumb{box-shadow:0 0 0 3px var(--bg),0 0 0 4px var(--g2)}
.calc-sc{display:flex;justify-content:space-between;margin-top:4px;font-size:12.5px;letter-spacing:.04em;color:var(--faint)}
.calc-out{position:relative;display:flex;flex-direction:column;padding:50px 48px 46px;border-left:var(--lw) solid var(--line);background:radial-gradient(80% 90% at 100% 0%,var(--card-2),transparent 70%),var(--bg-2);container-type:inline-size}
.calc-out::before{content:"";position:absolute;inset:8px;border:var(--lw) solid var(--line-2);pointer-events:none}
.calc-out > *{position:relative}
.calc-r-l{display:block;font-size:11.5px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--g2)}
.calc-r-n{display:block;margin-top:12px;font-family:var(--display);font-weight:400;font-size:clamp(30px,10cqi,46px);line-height:1.05;white-space:nowrap}
.calc-r-s{display:block;margin-top:8px;font-size:14px;line-height:1.5;color:var(--muted)}
.calc-r + .calc-r{position:relative;margin-top:28px;padding-top:30px}
.calc-r + .calc-r::before{content:"";position:absolute;left:0;right:0;top:0;height:calc(var(--lw) * 2 + var(--dl-gap));border-top:var(--lw) solid var(--line);border-bottom:var(--lw) solid var(--line-2)}
.calc-r--main .calc-r-n{font-size:clamp(38px,14cqi,72px);line-height:1}
.calc-cta{align-self:flex-start;margin-top:auto}
.calc-res{margin-bottom:36px}
.calc-note{grid-column:1/-1;padding:20px 52px 22px;border-top:var(--lw) solid var(--line-2);font-size:13px;line-height:1.6;color:var(--faint)}

/* ---------- co si připravit: zaškrtávací seznam ---------- */
.fin-prep{align-items:start}
.fin-prep h2{margin:20px 0 22px}
.fin-count b{min-width:1.4ch}
.fin-count span{max-width:22ch}
.fin-prep-ctas{margin-top:30px;align-items:center;gap:18px 30px}
.fin-reset[hidden]{display:none}
.fin-list{border:var(--lw) solid var(--line);background:linear-gradient(180deg,var(--card),transparent 90%)}
.fin-item{position:relative;display:grid;grid-template-columns:40px minmax(0,1fr);gap:20px;align-items:start;padding:24px 30px 22px;border-top:var(--lw) solid var(--line-2);cursor:pointer;transition:background .3s}
.fin-item:first-child{border-top:0}
.fin-item:hover{background:var(--card)}
.fin-item input{position:absolute;left:30px;top:24px;width:30px;height:30px;margin:0;opacity:0;cursor:pointer}
.fin-box{position:relative;width:26px;height:26px;margin:4px 0 0 7px;display:grid;place-items:center;border:var(--lw) solid var(--line-s);transform:rotate(45deg);transition:background .35s,border-color .35s,transform .6s var(--ease)}
.fin-box .ico{width:18px;height:18px;stroke-width:2.2;color:var(--on-gold);transform:rotate(-45deg) scale(.4);opacity:0;transition:opacity .3s,transform .45s var(--ease)}
.fin-item:hover .fin-box{border-color:var(--g1)}
.fin-item input:checked + .fin-box{background:var(--gg);border-color:transparent;transform:rotate(135deg)}
.fin-item input:checked + .fin-box .ico{opacity:1;transform:rotate(-135deg) scale(1)}
.fin-item input:focus-visible + .fin-box{outline:1px solid var(--g2);outline-offset:4px}
.fin-txt b{display:block;font-family:var(--display);font-weight:400;font-size:21px;line-height:1.25;transition:color .3s}
.fin-txt small{display:block;margin-top:6px;font-size:14.5px;line-height:1.55;color:var(--muted)}
.fin-item input:checked ~ .fin-txt b{color:var(--g2)}

/* ---------- formulář ---------- */
.fin-fs{border:0;margin:0 0 8px;padding:0;min-width:0}
.fin-fs legend{display:flex;align-items:center;gap:14px;width:100%;padding:0;margin-bottom:22px;font-size:11.5px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--faint)}
.fin-fs legend::after{content:"";flex:1;height:var(--lw);background:var(--line-2)}
.fin-fs + .fin-fs{margin-top:12px}
.page-financovani .form .check{margin-bottom:14px}
.page-financovani .form .check:last-of-type{margin-bottom:28px}
.fin-ct-note{margin-top:8px;padding-top:24px;border-top:var(--lw) solid var(--line-2)}
.fin-ct-note .fine{margin-top:12px}

/* ---------- responzivita ---------- */
@media (max-width:960px){
  .fin-note,.fin-list{margin-top:44px}
  .calc{grid-template-columns:minmax(0,1fr)}
  .calc-out{border-left:0;border-top:var(--lw) solid var(--line)}
}
@media (max-width:760px){
  .fin-switch .a3-sw-bar [role="tab"]{text-align:center}
  .fin-note{padding:50px 22px 28px}
  .fin-note-ic{left:22px;width:48px;height:48px;top:-24px}
  .fin-seg-opts{grid-template-columns:minmax(0,1fr)}
  .fin-seg label span{min-height:46px}
  .fin-item{grid-template-columns:34px minmax(0,1fr);gap:14px;padding:20px 18px 18px}
  .fin-item input{left:18px;top:20px}
  .fin-box{width:22px;height:22px;margin-left:5px}
  .fin-box .ico{width:15px;height:15px}
  .fin-txt b{font-size:19px}
  .fin-prep-ctas .link{width:100%;justify-content:center}
  .calc-in{gap:32px;padding:32px 22px 30px}
  .calc-num,.calc-val{font-size:26px}
  .calc-num{flex:1 1 100%}
  .calc-num input{flex:1;width:auto;min-width:0}
  .calc-out{padding:34px 22px 30px}
  .calc-out::before{inset:6px}
  .calc-cta{align-self:stretch}
  .calc-res{margin-bottom:30px}
  .calc-note{padding:18px 22px 20px}
}
.page-financovani .phero h1 .gold{white-space:nowrap}

/* ---------- V4 · mobil: přepínač Zajištěné × Nezajištěné „plave“ pod hlavičkou,
   dokud je vidět obsah sekce Dvě formy financování (pak s ní odjede) ---------- */
@media (max-width:960px){
  .fin-switch .a3-sw-head{position:sticky;top:62px;z-index:6;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding:10px calc(50vw - 50%) 12px;background:var(--bg);transition:box-shadow .35s var(--ease)}
  .fin-switch .a3-sw-head.is-stuck{box-shadow:0 1px 0 var(--line),0 14px 24px -18px rgba(0,0,0,.7)}
}