:root{
  --bg:#F4F7F5; --surface:#FFFFFF; --fg:#17202A; --muted:#4E5B63; --line:#CDD8D1;
  --accent:#0E6B54; --accent-strong:#0A5241; --accent-fg:#FFFFFF; --accent-soft:#E1F0E9;
  --warn-bg:#FFF4E3; --warn-fg:#7A4A05; --error:#B3261E; --leaf:#8FCB7E;
  --font:"Atkinson Hyperlegible",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{color-scheme:light}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font);font-size:19px;line-height:1.5;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:0 48px}
@media (min-width:700px){body{font-size:20px}}
.wrap{max-width:640px;margin:0 auto}
.top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:14px 0 4px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.brand{font-weight:700;letter-spacing:.02em}
.brand-sub{color:var(--muted);font-size:.85em}
h1,h2{line-height:1.2;text-wrap:balance;margin:0}
h1{font-size:1.75em;font-weight:700}
h2{font-size:1.45em;font-weight:700}
h2.h-small{font-size:1.15em}
p{margin:0}
a{color:var(--accent)}
.eyebrow{font-size:.78em;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700}
.stack{display:grid;gap:20px}
.stack-sm{display:grid;gap:12px}
.screen{padding-block:24px}
.facts{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.facts li{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:12px}
.facts .ico{width:28px;height:28px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-weight:700;margin-top:2px;font-size:.8em}
.facts strong{display:block}
.btn{display:flex;align-items:center;justify-content:center;width:100%;min-height:62px;padding:12px 20px;border-radius:14px;border:2px solid var(--accent);
  background:var(--accent);color:var(--accent-fg);font:inherit;font-size:1.1em;font-weight:700;cursor:pointer;text-decoration:none}
.btn:hover{background:var(--accent-strong);border-color:var(--accent-strong)}
.btn.secondary{background:var(--surface);color:var(--accent)}
.btn.secondary:hover{background:var(--accent-soft)}
.btn.small{min-height:48px;font-size:1em;width:auto;padding:8px 18px}
.btn:disabled{opacity:.6;cursor:wait}
.btn:focus-visible,input:focus-visible,button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.linkbtn{background:none;border:0;padding:8px 0;color:var(--accent);font:inherit;font-weight:700;text-decoration:underline;cursor:pointer;text-align:left}
.linkbtn.small-link{font-size:.9em;font-weight:400}
.muted{color:var(--muted)}
.small{font-size:.85em}
.soldout{background:var(--warn-bg);color:var(--warn-fg);padding:14px 16px;border-radius:12px;font-weight:700}
.docs{display:flex;flex-wrap:wrap;gap:8px 20px}
.docs a{color:var(--accent);font-weight:700}
.faq summary{cursor:pointer;font-weight:700;color:var(--accent)}
.faq .next{margin-top:12px}
.progress{display:grid;gap:8px;padding-block:16px 0}
.progress .bar{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.progress .bar span{height:10px;border-radius:6px;background:var(--line)}
.progress .bar span.done{background:var(--accent)}
.progress .label{font-weight:700}
.amount{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px;display:grid;gap:16px}
.stepper{display:grid;grid-template-columns:72px 1fr 72px;gap:10px;align-items:center}
.stepper button{min-height:72px;border-radius:14px;border:2px solid var(--accent);background:var(--surface);color:var(--accent);font:inherit;font-size:2em;font-weight:700;cursor:pointer;line-height:1}
.stepper button:hover{background:var(--accent-soft)}
.stepper button:disabled{opacity:.4;cursor:default}
.stepper .count{text-align:center;font-size:1.6em;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1}
.stepper .count small{display:block;font-size:.5em;font-weight:400;color:var(--muted)}
.quick{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.quick button{min-height:54px;border-radius:12px;border:2px solid var(--line);background:var(--surface);color:var(--fg);font:inherit;font-weight:700;cursor:pointer;font-variant-numeric:tabular-nums}
.quick button[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
.result{display:grid;gap:12px;background:var(--accent-soft);border-radius:14px;padding:18px}
.result .row{display:grid;gap:2px}
.result .k{font-size:.85em;color:var(--muted)}
.result .v{font-size:1.45em;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.15}
.result .v.big{font-size:1.9em}
.field{display:grid;gap:6px}
.field label,.sig .lbl{font-weight:700}
.field .hint{font-size:.85em;color:var(--muted)}
.field input{width:100%;min-height:60px;font:inherit;font-size:1.05em;padding:10px 16px;border-radius:12px;border:2px solid var(--line);background:var(--surface);color:var(--fg)}
.field input::placeholder{color:var(--muted);opacity:.7}
.field.invalid input{border-color:var(--error)}
.field .err{display:none;color:var(--error);font-weight:700;font-size:.9em}
.field.invalid .err{display:block}
.hp{position:absolute;left:-9999px;top:-9999px;height:0;overflow:hidden}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:460px){.row2{grid-template-columns:1fr}}
.row-psc{display:grid;grid-template-columns:2fr 1fr;gap:12px}
#company-fields{display:grid;gap:20px}
.check{display:grid;grid-template-columns:34px 1fr;gap:14px;align-items:start;padding:16px;border:2px solid var(--line);border-radius:12px;background:var(--surface);cursor:pointer}
.check input{width:30px;height:30px;margin:2px 0 0;accent-color:var(--accent);cursor:pointer}
.check.invalid{border-color:var(--error)}
.summary{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:4px 18px}
.summary div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.summary div:last-child{border-bottom:0}
.summary b{font-variant-numeric:tabular-nums;text-align:right}
.sig{display:grid;gap:10px}
.sig canvas{width:100%;height:190px;border:2px dashed var(--accent);border-radius:12px;background:var(--surface);touch-action:none;display:block}
.sig .tools{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.sig.invalid canvas{border-color:var(--error)}
.err-global{display:none;color:var(--error);font-weight:700}
.err-global.show{display:block}
.callback{background:var(--surface);border:2px solid var(--accent);border-radius:14px;padding:18px;display:grid;gap:14px}
.callback h2{margin:0}
.callback .lead-intro{margin:-6px 0 0;color:var(--muted)}
.next{display:grid;gap:12px;margin:0;padding:0;list-style:none;counter-reset:n}
.next li{display:grid;grid-template-columns:40px 1fr;gap:12px;align-items:start}
.next li::before{counter-increment:n;content:counter(n);width:40px;height:40px;border-radius:50%;background:var(--accent);color:var(--accent-fg);display:grid;place-items:center;font-weight:700}
.foot{border-top:1px solid var(--line);padding-top:16px;display:grid;gap:8px;margin-top:24px}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--fg);color:var(--bg);padding:10px 18px;border-radius:10px;font-weight:700;opacity:0;transition:opacity .2s;pointer-events:none;max-width:calc(100% - 32px)}
.toast.show{opacity:1}
.cookiebar{position:fixed;left:0;right:0;bottom:0;background:var(--surface);border-top:2px solid var(--accent);padding:14px max(16px,env(safe-area-inset-left,0px)) calc(14px + env(safe-area-inset-bottom,0px));display:grid;gap:10px;font-size:.9em;z-index:20;box-shadow:0 -4px 16px rgba(0,0,0,.08)}
.cookiebtns{display:flex;gap:10px;flex-wrap:wrap}
/* platba */
.done-head{display:grid;gap:8px;padding:18px;border-radius:14px;background:var(--accent-soft)}
.done-head .big{font-size:1.5em;font-weight:700}
.pay{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px;display:grid;gap:16px}
.qr{display:grid;place-items:center;gap:6px}
.qr .box{background:#fff;padding:12px;border-radius:12px;border:1px solid var(--line)}
.qr .box img,.qr .box canvas{display:block;max-width:100%}
.kv{display:grid;gap:10px}
.kv div{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:10px;min-width:0}
.kv div:last-child{border-bottom:0;padding-bottom:0}
.kv .k{font-size:.85em;color:var(--muted)}
.kv .v{font-size:1.1em;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.copy{min-height:44px;padding:6px 14px;border-radius:10px;border:2px solid var(--accent);background:var(--surface);color:var(--accent);font:inherit;font-weight:700;cursor:pointer}
.paid{background:var(--accent-soft);border-radius:14px;padding:18px;font-weight:700}
@media (prefers-reduced-motion:reduce){.toast{transition:none}}

/* landing */
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--fg)}
.logo-mark{flex:none}
.logo-text{display:grid;line-height:1.05}
.logo-name{font-weight:700;font-size:1.35em;letter-spacing:.01em;color:var(--accent)}
.logo-claim{font-size:.72em;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
h2.sec{margin-top:16px;padding-top:18px;border-top:1px solid var(--line)}
.story{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.story li{display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:start;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.story .n{width:44px;height:44px;border-radius:50%;background:var(--accent);color:var(--accent-fg);display:grid;place-items:center;font-weight:700;font-size:1.2em}
.eco{display:grid;grid-template-columns:48px 1fr;gap:12px;align-items:start;background:var(--accent-soft);border-radius:14px;padding:16px}
.map svg{width:100%;height:auto;display:block;background:var(--surface);border:1px solid var(--line);border-radius:14px}
.houses{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:520px){.houses{grid-template-columns:1fr}}
.house{display:grid;gap:6px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px}
.house img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;display:block}
.house .photo{aspect-ratio:4/3;max-width:100%;border:2px dashed var(--line);border-radius:10px;display:grid;place-items:center;color:var(--muted);font-size:.9em}
.trust{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.trust li{padding-left:34px;position:relative}
.trust li::before{content:"✓";position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-weight:700}
.tablewrap{overflow-x:auto}
table.yield{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow:hidden;font-variant-numeric:tabular-nums}
table.yield th,table.yield td{padding:10px 12px;text-align:right;border-bottom:1px solid var(--line)}
table.yield th:first-child,table.yield td:first-child{text-align:left}
table.yield th{background:var(--accent-soft);font-size:.85em}
table.yield tr:last-child td{border-bottom:0}
details.faq{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 16px}
details.faq summary{font-weight:700;cursor:pointer;color:var(--fg)}
details.faq p{margin-top:8px}
mark.todo{background:#FFE86B;color:#5A4A00;font-size:.75em;font-weight:700;padding:2px 6px;border-radius:6px;vertical-align:middle}

/* účet + banka */
.acct{display:grid;gap:14px}
.acct .sub{font-weight:700;font-size:.95em}
.acct .part{display:grid;gap:6px}
.field select{width:100%;min-height:60px;font:inherit;font-size:1.05em;padding:10px 44px 10px 16px;border-radius:12px;border:2px solid var(--line);background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath d='M5 7l5 6 5-6' fill='none' stroke='%2317202A' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 14px center;color:var(--fg);-webkit-appearance:none;appearance:none}
.field.invalid select{border-color:var(--error)}
.acct-preview{font-weight:700;font-size:1.1em;font-variant-numeric:tabular-nums}

/* ===== vizuál v2: úvodní pás, zvýraznění ===== */
html{overflow-x:hidden}
.hero{position:relative;color:#fff;padding:26px 0 30px;isolation:isolate}
.hero::before{content:"";position:absolute;top:-24px;bottom:0;left:50%;width:100vw;margin-left:-50vw;background:linear-gradient(165deg,#0A5241 0%,#0E6B54 60%,#13805F 100%);z-index:-1;border-radius:0 0 26px 26px}
.hero .eyebrow{color:#BFE3D0}
.hero h1{font-size:1.95em;color:#fff}
.hero h1 .hl{color:#F6D06A;white-space:nowrap}
.hero h1 .hl2{color:#DDF2E6}
.hero p{color:#EAF5EF}
.hero .facts li{border:0;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.hero .facts li{color:var(--fg)}
.facts li{padding:16px 18px;border-radius:14px}
.facts strong{font-size:1.12em;line-height:1.25}
.facts .ico{width:42px;height:42px;font-size:1em;background:var(--accent);color:#fff;margin-top:0}
.facts li.bonus{background:#FFF8E1;border:2px solid #F2C94C}
.facts li.bonus .ico{background:#E6B422;color:#fff}
.badge-new{display:inline-block;background:#E6B422;color:#3B2A00;font-size:.68em;font-weight:700;letter-spacing:.04em;padding:2px 8px;border-radius:999px;vertical-align:middle;margin-left:6px}
.hero .btn{box-shadow:0 8px 22px rgba(0,0,0,.25);min-height:68px;font-size:1.2em}
.hero .btn:not(.secondary){background:#F6D06A;border-color:#F6D06A;color:#17202A}
.hero .btn:not(.secondary):hover{background:#FFE08A;border-color:#FFE08A}
.hero .btn.secondary{background:rgba(255,255,255,.12);border-color:#fff;color:#fff}
.hero .btn.secondary:hover{background:rgba(255,255,255,.22)}
.btn{box-shadow:0 6px 16px rgba(14,107,84,.22)}
.btn.secondary{box-shadow:none}
h2.sec{border-top:0;padding-top:8px;margin-top:22px;font-size:1.55em}
h2.sec::before{content:"";display:block;width:52px;height:6px;border-radius:3px;background:var(--accent);margin-bottom:12px}
.story li{padding:16px 18px;border-left:5px solid var(--accent)}
.story strong{font-size:1.08em}
.story .n{width:48px;height:48px;font-size:1.3em}
.eco{border-left:5px solid var(--leaf);padding:18px}
.eco strong{font-size:1.08em}
.trust li{padding-left:40px;font-size:1.02em}
.trust li::before{width:30px;height:30px;background:var(--accent);color:#fff;font-size:1em}
table.yield th{background:var(--accent);color:#fff;font-size:.9em;padding:12px 8px}
table.yield td{padding:13px 8px;font-size:1.02em;white-space:nowrap}
@media (max-width:430px){table.yield{font-size:.9em}}
table.yield td b{color:var(--accent);font-size:1.12em}
.next li{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 16px 14px 14px}
details.faq summary{font-size:1.05em;padding:4px 0}
.docs a{font-size:1.05em}

/* ===== počítač: širší rozložení, více sloupců ===== */
@media (min-width:900px){
  .wrap{max-width:760px}
  .hero{padding:34px 0 38px}
  .hero h1{font-size:2.35em}
  .hero .facts{grid-template-columns:1fr 1fr;gap:14px}
  .hero .stack-sm{grid-template-columns:1fr 1fr;gap:14px}
  .story{grid-template-columns:repeat(3,1fr)}
  .story li{grid-template-columns:1fr;gap:10px;align-content:start}
  .trust{grid-template-columns:1fr 1fr;gap:14px 24px}
  .next{grid-template-columns:repeat(3,1fr)}
  .next li{grid-template-columns:1fr;gap:10px;align-content:start}
  .next li::before{margin-bottom:2px}
  .docs{gap:8px 32px}
  .map svg{max-width:520px;display:block;margin:0 auto}
}