
/* css 3 kroku 5.3.2026 */
   #krok3 .ks-tool{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:#1f2a37;
  max-width: 980px;
  margin: 0 auto;
}
#krok3 .ks-card{
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 18px;
  background: #fff;
}
#krok3 .ks-stack{ display:flex; flex-direction:column; gap:14px; }

#krok3 .ks-head{
  display:flex;
  gap:14px;
  align-items:flex-start;
  justify-content:space-between;
  flex-wrap:wrap;
  margin-bottom: 10px;
}
#krok3 .ks-title{
  margin:0;
  font-size: 20px;
  line-height:1.25;
  font-weight: 750;
}
#krok3 .ks-sub{
  margin:6px 0 0 0;
  color:#6b7280;
  font-size: 14px;
  line-height:1.35;
  max-width: 78ch;
}

#krok3 .ks-stepbadge{
  border:1px solid #d6dde6;
  background:#f8fafc;
  color:#334155;
  padding:6px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 650;
  white-space: nowrap;
}

#krok3 .ks-step{
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 16px;
  background:#ffffff;
}
#krok3 .ks-step.is-locked{
  opacity: .65;
  filter: grayscale(.1);
}
#krok3 .ks-step-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom: 10px;
}
#krok3 .ks-step-title{
  margin:0;
  font-size: 16px;
  font-weight: 800;
}
#krok3 .ks-step-desc{
  margin:6px 0 0 0;
  color:#6b7280;
  font-size: 13px;
  line-height: 1.35;
  max-width: 86ch;
}

#krok3 .ks-q{
  margin: 10px 0 10px 0;
  font-size: 14px;
  font-weight: 750;
}

#krok3 .ks-options{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 10px;
}
#krok3 .ks-options.cols-4{ grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 980px){
  #krok3 .ks-options.cols-4{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 820px){
  #krok3 .ks-options{ grid-template-columns: 1fr; }
}
@media (max-width: 620px){
  #krok3 .ks-options.cols-4{ grid-template-columns: 1fr; }
}

#krok3 .ks-opt{
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 14px;
  background: #fbfbfd;
  cursor: pointer;
  transition: transform .08s ease, box-shadow .08s ease, border-color .08s ease, background .08s ease;
  position: relative;
  min-height: 96px;
  display:flex;
  gap: 12px;
  align-items:flex-start;
  text-align:left;
}
#krok3 .ks-opt:hover{
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,.06);
  border-color:#cbd5e1;
  background:#ffffff;
}
#krok3 .ks-opt[aria-pressed="true"]{
  border-color:#2f6ea7;
  box-shadow: 0 0 0 3px rgba(47,110,167,.18);
  background:#ffffff;
}
#krok3 .ks-ico{
  width: 60px; height: 60px;
  border-radius: 16px;
  border:1px solid #e5e7eb;
  display:flex; align-items:center; justify-content:center;
  font-size: 30px;
  background:#fff;
  flex: 0 0 auto;

  /* roof overlay support */
  position: relative;
  padding-top: 8px;           /* pushes existing icon content slightly down */
  box-sizing: border-box;
}

#krok3 .ks-ico::before{
  content:"";
  position:absolute;
  top: -3px;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 32px;
  background: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20160%2070%22%3E%0A%20%20%3C%21--%20roof%20%28straight%2C%20broken%20only%20by%20window%29%20--%3E%0A%20%20%3Cpath%20d%3D%22M4%2054%20L80%2012%20L108.9%2028.0%22%20fill%3D%22none%22%20stroke%3D%22%23111827%22%20stroke-width%3D%2210%22%0A%20%20%20%20%20%20%20%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%0A%20%20%3Cpath%20d%3D%22M145.4%2048.1%20L156%2054%22%20fill%3D%22none%22%20stroke%3D%22%23111827%22%20stroke-width%3D%2210%22%0A%20%20%20%20%20%20%20%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%0A%0A%20%20%3C%21--%20gray%20interruption%20%28longer%20%2B%20lighter%2C%20reaches%20into%20black%29%20--%3E%0A%20%20%3Cpath%20d%3D%22M108.9%2028.0%20L145.4%2048.1%22%20fill%3D%22none%22%20stroke%3D%22%23D1D5DB%22%20stroke-width%3D%2214%22%0A%20%20%20%20%20%20%20%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%0A%0A%20%20%3C%21--%20blue%20light%20BELOW%20roof/gray%20--%3E%0A%20%20%3Cpath%20d%3D%22M111.8%2022.7%20L148.3%2042.9%22%20fill%3D%22none%22%20stroke%3D%22%231D6FD6%22%20stroke-width%3D%226%22%0A%20%20%20%20%20%20%20%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%0A%3C/svg%3E") no-repeat center;
  background-size: contain;
  pointer-events:none;
  opacity: 1;
}

#krok3 .ks-opt h4{
  margin: 0;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.2;
}
#krok3 .ks-opt p{
  margin: 6px 0 0 0;
  color:#6b7280;
  font-size: 13px;
  line-height: 1.35;
}
#krok3 .ks-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-top:8px;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid #e5e7eb;
  background:#f8fafc;
  color:#334155;
  font-size:12px;
  font-weight:650;
  width: fit-content;
}

#krok3 .ks-confirm{
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 12px;
  background:#f1f5f9;
  border:1px solid #e2e8f0;
  color:#334155;
  font-size: 14px;
  display:none;
}
#krok3 .ks-confirm strong{ font-weight: 850; }

#krok3 .ks-actions{
  margin-top: 12px;
  display:flex;
  gap: 10px;
  justify-content:flex-end;
  align-items:center;
  flex-wrap:wrap;
}
#krok3 .ks-btn{
  border:1px solid #d1d5db;
  background:#fff;
  padding: 10px 14px;
  border-radius: 12px;
  font-weight: 780;
  cursor:pointer;
}
#krok3 .ks-btn-primary{
  border-color:#2f6ea7;
  background:#2f6ea7;
  color:#fff;
}
#krok3 .ks-btn:disabled{
  opacity:.55;
  cursor:not-allowed;
}
#krok3 .ks-btn-primary.is-ready{
  box-shadow: 0 10px 24px rgba(47,110,167,.28);
}

#krok3 .ks-hint{
  margin-top: 8px;
  color:#6b7280;
  font-size: 12px;
  line-height:1.35;
}
#krok3 .ks-hidden{ display:none !important; }

#krok3 .ks-progress{
  margin-top: 6px;
  display:flex;
  gap:8px;
  align-items:center;
  color:#6b7280;
  font-size: 12px;
}
#krok3 .ks-dot{
  width:8px; height:8px; border-radius:99px;
  background:#cbd5e1;
}
#krok3 .ks-dot.on{ background:#2f6ea7; }

/* ===== KROK 4 VÝSLEDEK ===== */
#krok3 .ks-result-main{
  font-size: 18px;
  font-weight: 850;
}
#krok3 .ks-result-explain{
  color:#334155;
  font-size: 14px;
  line-height:1.45;
}
#krok3 .ks-result-warn{
  background:#fff7ed;
  border:1px solid #fed7aa;
  border-radius:12px;
  padding:12px;
  color:#7c2d12;
  font-size: 13px;
  display:none;
}
#krok3 .ks-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid #e5e7eb;
  background:#f8fafc;
  color:#334155;
  font-size:12px;
  font-weight:700;
  width: fit-content;
}
#krok3 .ks-mini{
  color:#6b7280;
  font-size:12px;
  line-height:1.35;
  margin-top: 6px;
}

/* ===== KROK 4 (nový layout) ===== */
#krok3 #ksStep4 .k4-wrap{ display:flex; flex-direction:column; gap:14px; margin-top:12px; }
#krok3 #ksStep4 .k4-section{
  border:1px solid rgba(0,0,0,.08);
  border-radius:14px;
  padding:14px 14px 12px;
  background:#fff;
}
#krok3 #ksStep4 .k4-secHead{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
#krok3 #ksStep4 .k4-title{ margin:0; font-size:22px; line-height:1.15; letter-spacing:-.2px; }
#krok3 #ksStep4 .k4-ico{
  width:56px; height:56px;
  border-radius:16px;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:30px;
  user-select:none;
}
#krok3 #ksStep4 .k4-ico svg{ width:34px; height:34px; display:block; }
#krok3 #ksStep4 .k4-ico{ color:#111827; }

#krok3 #ksStep4 .k4-ico-aha{ background:#ecfdf5; }
#krok3 #ksStep4 .k4-ico-pozor{ background:#fffbeb; }
#krok3 #ksStep4 .k4-ico-next{ background:#eef2ff; }
#krok3 #ksStep4 .k4-ico-next{ background:#16a34a; border-radius:10px; padding:6px; }

#krok3 #ksStep4 .k4-chips{ display:flex; flex-wrap:wrap; gap:8px; margin:2px 0 10px; }
#krok3 #ksStep4 .k4-chip{
  display:inline-flex;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.10);
  background:rgba(0,0,0,.02);
  font-size:16px;
  line-height:1.1;
  white-space:nowrap;
}

#krok3 #ksStep4 .k4-verdict{
  font-size:20px;
  line-height:1.35;
  margin:0;
  font-weight:650;
  letter-spacing:-.2px;
}
#krok3 #ksStep4 .k4-explain{
  font-size:18px;
  line-height:1.45;
  margin-top:8px;
  color:rgba(0,0,0,.72);
}

#krok3 #ksStep4 .k4-box{
  font-size:18px;
  line-height:1.45;
  padding:12px 12px;
  border-radius:12px;
  background:rgba(245, 158, 11, .10);
  border:1px solid rgba(245, 158, 11, .25);
}
#krok3 #ksStep4 .k4-li{ margin:0 0 10px; }
#krok3 #ksStep4 .k4-li:last-child{ margin-bottom:0; }

#krok3 #ksStep4 .k4-next{ display:flex; flex-direction:column; gap:10px; }
#krok3 #ksStep4 .k4-rec{
  padding:12px 12px;
  border-radius:12px;
  background:rgba(99, 102, 241, .08);
  border:1px solid rgba(99, 102, 241, .18);
}
#krok3 #ksStep4 .k4-rec-title{ font-size:18px; font-weight:700; margin:0 0 6px; }
#krok3 #ksStep4 .k4-rec-text{ font-size:18px; line-height:1.45; margin:0; color:rgba(0,0,0,.78); }

/* Zvýšení typografie o 2 „řády“ pro celý krok 4 */
#krok3 #ksStep4 .ks-step-title{ font-size:28px; }
#krok3 #ksStep4 .ks-step-desc{ font-size:18px; }
#krok3 #ksStep4 .ks-hint{ font-size:16px; }

/* Mobilní drobnosti */
@media (max-width: 520px){
  #krok3 #ksStep4 .k4-title{ font-size:20px; }
  #krok3 #ksStep4 .k4-verdict{ font-size:19px; }
  #krok3 #ksStep4 .k4-chip{ font-size:15px; }
}

#krok3 #ksStep4 .k4-ico-next{ color:#16a34a; }
#krok3 #ksStep4 .k4-ico-next{ background:#16a34a; border-radius:10px; padding:6px; }
#krok3 #ksStep4 .k4-next-btn,
#krok3 #ksStep4 .k4-next-btn:hover{
  background:#16a34a;
  border-color:#16a34a;
  color:#ffffff;
}

/* KROK 4 – ikony */
#krok3 #ksStep4 .k4-ico svg{ width:34px; height:34px; display:block; }
#krok3 #ksStep4 .k4-ico{ color:#111827; }
#krok3 #ksStep4 .k4-ico-pozor{ background:#fffbeb; } /* keep section bg; sign itself is red/white */
#krok3 #ksStep4 .k4-ico-next{ color:#ffffff; }
#krok3 #ksStep4 .k4-ico-next{ background:#16a34a; border-radius:10px; padding:6px; } /* arrow uses currentColor -> white */

/* zelené CTA tlačítko (včetně hover) */
#krok3 #ksStep4 .k4-next-btn,
#krok3 #ksStep4 .k4-next-btn:hover,
#krok3 #ksStep4 .k4-next-btn:active{
  background:#16a34a !important;
  border-color:#16a34a !important;
  color:#ffffff !important;
}

/* NEXT CTA only */
#krok3 #ksStep4 .k4-next-btn{
  background-color:#16a34a !important;
  border-color:#16a34a !important;
  color:#ffffff !important;
}
#krok3 #ksStep4 .k4-next-btn *{
  color:#ffffff !important;
}

/* KROK 4: tlačítko Zpět má být 1:1 stejné jako v kroku 3 */
#krok3 #ksStep4 #ksBack3{
  border:1px solid #d1d5db;
  background:#fff;
  padding:10px 14px;
  border-radius:12px;
  font-weight:780;
  cursor:pointer;
}
#krok3 #ksStep4 #ksBack3:hover{
  background:#f9fafb;
}

/* KROK 4 – mikro animace při zobrazení výsledku */
@keyframes krok3K4PopIn {
  from { opacity: 0; transform: translateY(8px) scale(.99); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes krok3K4PulseRing {
  0%   { box-shadow: 0 0 0 0 rgba(47,110,167,.20); }
  100% { box-shadow: 0 0 0 10px rgba(47,110,167,0); }
}

/* celé vyhodnocení */
#krok3 #ksStep4.k4-animate .k4-wrap{
  animation: krok3K4PopIn .28s ease-out both;
}

/* jemné postupné “naskočení” sekcí */
#krok3 #ksStep4.k4-animate .k4-section{
  opacity: 0;
  transform: translateY(10px);
  animation: krok3K4PopIn .32s ease-out both;
}

#krok3 #ksStep4.k4-animate .k4-s1{ animation-delay: .02s; }
#krok3 #ksStep4.k4-animate .k4-s2{ animation-delay: .08s; }
#krok3 #ksStep4.k4-animate .k4-s3{ animation-delay: .14s; }

/* CTA dostane decentní pulse, aby zrak našel “další krok” */
#krok3 #ksStep4.k4-animate #ksSendEmail{
  animation: krok3K4PulseRing .55s ease-out .22s both;
}

/* respekt k preferenci: méně pohybu */
@media (prefers-reduced-motion: reduce){
  #krok3 #ksStep4.k4-animate .k4-wrap,
  #krok3 #ksStep4.k4-animate .k4-section,
  #krok3 #ksStep4.k4-animate #ksSendEmail{
    animation: none !important;
    transform: none !important;
  }
}


/* style hlavička a patička + 2 krok */
  :root{
    --text:#1f2a37;
    --muted:#6b7280;
    --line:#e5e7eb;
    --panel:#ffffff;

    /* obecné barvy */
    --blue:#2f6ea7;
    --green:#2f8a2a;

    /* stepper */
    --ks-rail:#eef2f6;
    --ks-border:#d6dde6;
    --ks-text:#3a4a5e;
    --ks-text-soft:#5b6b7b;
    --ks-blue:#2f6ea7;
    --ks-blue2:#2a6295;
    --ks-notch:18px;
  }

  /* ===========================================
     IZOLACE: nic mimo #kalkul3-wrap
     =========================================== */
  #kalkul3-wrap,
  #kalkul3-wrap *{ box-sizing:border-box; }

  /* místo body – aplikujeme jen na wrapper */
  #kalkul3-wrap{
    font-family: Arial, Helvetica, sans-serif;
    color:var(--text);
    background:#ffffff;
  }

  /* Top photo strip */
  #kalkul3-wrap .hero{
    width:100%;
    height:92px;
    overflow:hidden;
    background:#ddd;
    border-bottom:1px solid #d6d6d6;
  }
  #kalkul3-wrap .hero img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }

  /* Page */
  #kalkul3-wrap .wrap{
    max-width:870px;
    margin:0 auto;
    padding:28px 18px 40px;
  }

  #kalkul3-wrap h1{
    margin:10px 0 10px;
    font-size:34px;
    letter-spacing:.2px;
    text-align:center;
    color:#243447;
  }
  #kalkul3-wrap .subhead{
    text-align:center;
    color:#3f4b59;
    line-height:1.45;
    font-size:15px;
    margin:0 auto 18px;
    max-width:680px;
  }

  /* ====== STEPPER ====== */
  #kalkul3-wrap .ks-stepper{
    max-width:660px;
    margin:18px auto 0;
    height:44px;
    display:flex;
    background:var(--ks-rail);
    border:1px solid var(--ks-border);
    border-radius:7px;
    overflow:hidden;
    align-items:stretch;
  }
  #kalkul3-wrap .ks-stepper .ks-step{
    flex:1 1 0;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    font:700 14px/1 Arial, Helvetica, sans-serif;
    color:var(--ks-text-soft);
    padding:0 10px;
    position:relative;
    user-select:none;
    white-space:nowrap;
    background:transparent;
  }
  #kalkul3-wrap .ks-stepper .ks-step + .ks-step{
    box-shadow: inset 1px 0 0 rgba(214,221,230,.9);
  }
  #kalkul3-wrap .ks-stepper .ks-ico{
    width:18px;
    height:18px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
  }
  #kalkul3-wrap .ks-stepper .ks-label{ transform: translateY(0.5px); }

  #kalkul3-wrap .ks-stepper .ks-box{
    width:15px;
    height:15px;
    border:2px solid #a9b4c2;
    border-radius:2px;
    background:#fff;
  }

  /* ACTIVE: levý výkus dovnitř, pravá špička ven (celistvé) */
  #kalkul3-wrap .ks-stepper .ks-active{
    background:linear-gradient(var(--ks-blue), var(--ks-blue2));
    color:#fff;
    font-weight:800;
    z-index:5;

    clip-path: polygon(
      0 0,
      calc(100% - var(--ks-notch)) 0,
      100% 50%,
      calc(100% - var(--ks-notch)) 100%,
      0 100%,
      var(--ks-notch) 50%
    );

    margin-right: calc(var(--ks-notch) * -1);
    padding-right: var(--ks-notch);

    box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
  }

  #kalkul3-wrap .ks-stepper .ks-active + .ks-step{
    box-shadow:none !important;
    padding-left: var(--ks-notch);
  }

  #kalkul3-wrap .ks-stepper .ks-active svg{
    width:18px; height:18px;
    color:#fff;
    display:block;
  }

  #kalkul3-wrap .step-note{
    text-align:center;
    color:#667085;
    font-size:13px;
    margin:10px 0 14px;
  }
  #kalkul3-wrap .step-note b{ color:#2a3a4d; }

  #kalkul3-wrap hr.sep{
    border:none;
    height:1px;
    background:var(--line);
    margin:14px 0 22px;
  }

  #kalkul3-wrap h2{
    text-align:center;
    margin:0 0 10px;
    font-size:26px;
    color:#243447;
  }
  #kalkul3-wrap .model{
    text-align:center;
    color:#4b5563;
    font-size:14px;
    margin:0 auto 18px;
    max-width:760px;
    line-height:1.55;
  }

  /* ====== Kalkulátor (graf) ====== */
  #kalkul3-wrap .container{
    max-width: 870px;
    margin: 0 auto;
  }
  #kalkul3-wrap .chart-wrapper{
    height: 420px;
    position: relative;
    margin-top: 8px;
  }
  #kalkul3-wrap .badge{
    display: inline-block;
    padding: 10px 16px;
    background: #4A90E2;
    color: #fff;
    border-radius: 8px;
    margin-top: 10px;
    font-weight: 800;
  }
  #kalkul3-wrap .options{
    margin-top: 16px;
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
  }
  #kalkul3-wrap .options h3{
    margin: 0 0 10px;
    font-size: 16px;
    color:#243447;
  }
  #kalkul3-wrap .options label{
    display: block;
    margin-bottom: 8px;
    cursor: pointer;
    padding: 8px 10px;
    background: #f3f3f3;
    border-radius: 10px;
    border: 1px solid #e8e8e8;
  }
  #kalkul3-wrap .options label input{
    margin-right: 8px;
  }
  #kalkul3-wrap .options label span.price{
    font-weight: normal;
    font-size: 0.95em;
    color:#374151;
  }
  #kalkul3-wrap .note{
    margin: 10px auto 0;
    font-style: italic;
    color: #444;
    max-width: 760px;
    text-align:center;
  }

  /* ====== Mini tabulka: textový přepis grafu ====== */
  #kalkul3-wrap .ks-mini-breakdown{
    max-width: 560px;
    margin: 16px auto 0;
    border: 1px solid #d9e1ea;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 1px 0 rgba(0,0,0,.04);
  }
  #kalkul3-wrap .ks-mini-breakdown-head{
    background: #e9eff5;
    border-bottom: 1px solid #d9e1ea;
    padding: 10px 12px;
    font-weight: 900;
    color: #243447;
    font-size: 14px;
  }
  #kalkul3-wrap .ks-mini-breakdown-table{
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
  }
  #kalkul3-wrap .ks-mini-breakdown-table td{
    padding: 9px 12px;
    border-bottom: 1px solid #eef2f6;
    color: #344a5f;
  }
  #kalkul3-wrap .ks-mini-breakdown-table td:last-child{
    text-align: right;
    white-space: nowrap;
    font-weight: 900;
    color: #1d4e89;
  }
  #kalkul3-wrap .ks-mini-breakdown-total{
    display:flex;
    justify-content: space-between;
    align-items:center;
    padding: 10px 12px;
    background: #f8fafc;
    font-weight: 900;
    color: #111827;
  }
  #kalkul3-wrap .ks-mini-breakdown-total strong{
    color: #1d4e89;
  }

  /* ====== Shrnutí (před mini tabulkou) ====== */
  #kalkul3-wrap .ks-price-summary{
    max-width: 760px;
    margin: 18px auto 0;
    border: 1px solid #d9e1ea;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 1px 0 rgba(0,0,0,.04);
  }
  #kalkul3-wrap .ks-price-summary-head{
    background:#e9eff5;
    border-bottom:1px solid #d9e1ea;
    padding:12px 14px;
  }
  #kalkul3-wrap .ks-price-summary-title{
    font-weight: 900;
    color:#243447;
    font-size: 16px;
    line-height: 1.25;
  }
  #kalkul3-wrap .ks-price-summary-body{
    padding: 14px 14px 16px;
    color:#4b5563;
    line-height: 1.65;
    font-size: 14px;
  }
  #kalkul3-wrap .ks-price-summary-body p{ margin: 10px 0; }
  #kalkul3-wrap .ks-price-summary-body strong{ color:#111827; }

  #kalkul3-wrap .ks-price-summary-list{
    margin: 10px 0 10px;
    display: grid;
    gap: 8px;
    padding: 10px 12px;
    background: #f8fafc;
    border: 1px solid #eef2f6;
    border-radius: 10px;
  }
  #kalkul3-wrap .ks-price-summary-li{
    display:flex;
    gap: 10px;
    align-items:flex-start;
    color:#344a5f;
  }
  #kalkul3-wrap .ks-dot{
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: #2f6ea7;
    margin-top: 6px;
    flex: 0 0 10px;
  }

  #kalkul3-wrap .ks-price-summary-next{
    margin-top: 12px;
    padding: 12px 12px;
    border-left: 4px solid #2f6ea7;
    background: #f3f6fa;
    border-radius: 10px;
  }
  #kalkul3-wrap .ks-next-title{
    font-weight: 900;
    color:#243447;
    margin-bottom: 6px;
  }
  #kalkul3-wrap .ks-next-text{
    color:#344a5f;
    font-weight: 700;
  }

  /* ====== CTA blok pod tabulkou ====== */
  #kalkul3-wrap .ks-price-cta{
    max-width: 760px;
    margin: 22px auto 0;
    padding: 0 12px;
  }
  #kalkul3-wrap .ks-price-cta-inner{
    background: linear-gradient(135deg, #2f6ea7, #2a6295);
    color: #fff;
    padding: 20px 22px;
    border-radius: 14px;
    box-shadow: 0 6px 18px rgba(0,0,0,.12);
    text-align: center;
  }
  #kalkul3-wrap .ks-price-cta-title{
    font-size: 18px;
    font-weight: 900;
    margin-bottom: 8px;
  }
  #kalkul3-wrap .ks-price-cta-text{
    font-size: 14px;
    line-height: 1.6;
    opacity: .95;
  }

  /* Responsive */
  @media (max-width: 640px){
    #kalkul3-wrap .ks-stepper{ height:auto; flex-wrap:wrap; border-radius:10px; }
    #kalkul3-wrap .ks-stepper .ks-step{ padding:12px 10px; flex:1 1 45%; justify-content:flex-start; }
    #kalkul3-wrap .ks-stepper .ks-active{
      clip-path:none;
      margin-right:0;
      padding-right:10px;
    }
    #kalkul3-wrap .ks-stepper .ks-active + .ks-step{
      box-shadow: inset 1px 0 0 rgba(214,221,230,.9) !important;
      padding-left:10px;
    }
  }

  /* ===== ACTION BUTTONS ===== */
  #kalkul3-wrap .actions{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
    margin:18px 0 8px;
  }
  #kalkul3-wrap .btn{
    border-radius:6px;
    font-weight:700;
    cursor:pointer;
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:10px 18px;
    line-height:1;
    border:2px solid transparent;
    transition:transform .02s ease, filter .15s ease;
    user-select:none;
  }
  #kalkul3-wrap .btn:active{ transform:translateY(1px); }

  #kalkul3-wrap .btn-outline{
    background:#fff;
    border-color:#9fb2c6;
    color:#2a4a6a;
    min-width:290px;
    box-shadow:0 1px 0 rgba(0,0,0,.05);
  }
  #kalkul3-wrap .btn-outline:hover{ filter:brightness(.98); }

  #kalkul3-wrap .btn-green{
    background:linear-gradient(#3aa535, #2f8a2a);
    border-color:#2c7f27;
    color:#fff;
    min-width:420px;
    padding:14px 22px;
    box-shadow:0 2px 0 rgba(0,0,0,.18);
  }
  #kalkul3-wrap .btn-green:hover{ filter:brightness(1.02); }

  #kalkul3-wrap .btn-green .arrow{
    width:18px;
    height:18px;
    display:inline-block;
  }

  /* ===== BACKLINK ===== */
  #kalkul3-wrap .backlink{
    text-align:center;
    margin:10px 0 18px;
    color:#2a4a6a;
    font-size:14px;
  }
  #kalkul3-wrap .backlink a{
    color:#2a4a6a;
    text-decoration:none;
    border-bottom:1px solid rgba(42,74,106,.35);
  }
  #kalkul3-wrap .backlink a:hover{
    border-bottom-color:rgba(42,74,106,.85);
  }

  /* ===== FOOTER ===== */
  #kalkul3-wrap .ks-input-wrap{ margin-bottom: 12px; }

  #kalkul3-wrap .ks-footer{
    max-width: 800px;
    margin: 24px auto 0;
  }
  #kalkul3-wrap .ks-footer .ks-footer-top{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
    align-items:start;
  }
  #kalkul3-wrap .ks-footer .ks-box{
    background:#fff;
    border:1px solid #d9e1ea;
    border-radius:6px;
    padding:14px;
  }
  #kalkul3-wrap .ks-footer .ks-box-head{
    display:flex;
    gap:10px;
    align-items:flex-start;
    margin-bottom:10px;
  }
  #kalkul3-wrap .ks-footer .ks-ico{
    width:22px;
    height:22px;
    color:#4b5563;
    flex:0 0 22px;
    transform: translateY(1px);
  }
  #kalkul3-wrap .ks-footer .ks-ico svg{ width:22px; height:22px; display:block; }

  #kalkul3-wrap .ks-footer .ks-box-title{
    font-weight:700;
    color:#1f2a37;
    font-size:14px;
    line-height:1.2;
  }
  #kalkul3-wrap .ks-footer .ks-box-title--plain{ margin-bottom:10px; }
  #kalkul3-wrap .ks-footer .ks-box-sub{
    margin-top:4px;
    font-size:12px;
    color:#6b7280;
    line-height:1.35;
  }
  #kalkul3-wrap .ks-footer .ks-input{
    width:100%;
    padding:10px 10px;
    border:1px solid #cfd8e3;
    border-radius:4px;
    font-size:13px;
    outline:none;
  }
  #kalkul3-wrap .ks-footer .ks-input:focus{
    border-color:#93b3d6;
    box-shadow:0 0 0 3px rgba(47,110,167,.12);
  }
  #kalkul3-wrap .ks-footer .ks-row{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:10px;
    margin:10px 0;
  }
  #kalkul3-wrap .ks-footer .ks-btn{
    width:100%;
    border:0;
    border-radius:6px;
    font-weight:700;
    cursor:pointer;
    padding:12px 14px;
    font-size:14px;
    line-height:1;
  }
  #kalkul3-wrap .ks-footer .ks-btn-blue{
    background: linear-gradient(#3f7fbe,#2f6ea7);
    color:#fff;
    box-shadow:0 2px 0 rgba(0,0,0,.15);
  }
  #kalkul3-wrap .ks-footer .ks-btn-green{
    background: linear-gradient(#3aa535,#2f8a2a);
    color:#fff;
    box-shadow:0 2px 0 rgba(0,0,0,.15);
  }
  #kalkul3-wrap .ks-footer .ks-arrow{
    margin-left:10px;
    font-size:18px;
    font-weight:900;
  }
  #kalkul3-wrap .ks-footer .ks-note{
    margin-top:10px;
    font-size:12px;
    color:#6b7280;
    text-align:center;
  }

  #kalkul3-wrap .ks-footer-bottom{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:40px;
    margin-top:18px;
    color:#6b7280;
  }
  #kalkul3-wrap .ks-footer-bottom,
  #kalkul3-wrap .ks-footer-bottom *{
    font-size:15px;
    line-height:1.55;
  }
  #kalkul3-wrap .ks-footer-bottom .ks-bottom-head{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:10px;
    font-weight:600;
    color:#6b7280;
  }
  #kalkul3-wrap .ks-footer-bottom .ks-gt{
    color:#2f6ea7;
    font-weight:900;
    flex:0 0 auto;
    transform: translateY(1px);
  }
  #kalkul3-wrap .ks-footer-bottom .ks-list{
    display:flex;
    flex-direction:column;
    gap:6px;
  }
  #kalkul3-wrap .ks-footer-bottom .ks-li{
    display:flex;
    align-items:flex-start;
    gap:10px;
    color:#4b5563;
  }
  #kalkul3-wrap .ks-footer-bottom .ks-par{
    color:#6b7280;
    margin-bottom:12px;
  }
  #kalkul3-wrap .ks-footer-bottom a.ks-link{
    display:flex;
    align-items:flex-start;
    gap:10px;
    color:#2f6ea7;
    text-decoration: underline;
    text-underline-offset: 2px;
  }
  #kalkul3-wrap .ks-footer-bottom a.ks-link:hover{
    filter: brightness(0.95);
  }

  @media (max-width: 760px){
    #kalkul3-wrap .ks-footer .ks-footer-top{ grid-template-columns: 1fr; }
    #kalkul3-wrap .ks-footer .ks-footer-bottom{ grid-template-columns: 1fr; }
    #kalkul3-wrap .ks-footer .ks-row{ grid-template-columns: 1fr; }
    #kalkul3-wrap .btn-green{ min-width:100%; }
    #kalkul3-wrap .btn-outline{ min-width:100%; }
  }
  @media (max-width: 860px){
    #kalkul3-wrap .ks-footer-bottom{
      grid-template-columns: 1fr;
      gap:18px;
    }
  }

  #kalkul3-wrap .ks-btn.ks-btn-blue.ks-proxy-submit{
    -webkit-appearance: none;
    appearance: none;
    border: 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
  }

  #kalkul3-wrap .ks-proxy-submit.type-submit,
  #kalkul3-wrap .ks-proxy-submit.btn-type-2,
  #kalkul3-wrap .ks-proxy-submit.g-recaptcha{
    border: 0 !important;
  }

/* zobraz checkboxy v kalkulačce 4.3.2026*/
/* ✅ ZVIDITELNI CHECKBOXY V KALKUL3 (jen uvnitř #kalkul3-wrap) */
#kalkul3-wrap .options label{
  display:flex;
  align-items:center;
  gap:10px;
}

#kalkul3-wrap .options input[type="checkbox"]{
  position:static !important;
  opacity:1 !important;
  display:inline-block !important;

  width:16px !important;
  height:16px !important;
  margin:0 !important;

  pointer-events:auto !important;

  -webkit-appearance:auto !important;
  appearance:auto !important;

  transform:none !important;
  clip:auto !important;
}

/* když by web dělal pseudo-checkbox přes ::before/::after, tak tohle tomu usekne ruce */
#kalkul3-wrap .options input[type="checkbox"]::before,
#kalkul3-wrap .options input[type="checkbox"]::after{
  content:none !important;
  display:none !important;
}

/* když je aktivní krok 26.2. */
.ks-step.ks-active,
.ks-step.ks-active .ks-label{
  color: #fff;
}

.ks-step.ks-active svg path{
  stroke:#fff !important;
}


