/* ============ TOKENY ============ */
:root{
  color-scheme:light dark;
  --ground:#F4F6FA; --surface:#FFFFFF; --surface-2:#FAFBFD; --surface-3:#EBEEF5;
  --line:#DDE2ED; --line-soft:#EDEFF5;
  --ink:#0F1219; --ink-2:#464C5E; --ink-3:#747B8F;
  --brand:#2B3F9E; --brand-soft:#E8ECFB; --accent:#3B57E8;
  --secure:#0A7454; --secure-soft:#E2F3EC; --secure-line:#A9DCC9;
  --warn:#9C5A08; --warn-soft:#FAEFDC; --warn-line:#EAD4AC;
  --tlp-amber:#7E5600; --tlp-red:#B93229; --tlp-green:#0A7454; --tlp-clear:#4A5163;
  /* pruhy (hero, závěr) — mění se s motivem */
  --band:#EAEFFA; --band-line:#D6DEF2;
  --glow-1:rgba(59,87,232,.16); --glow-2:rgba(10,116,84,.10);
  --shadow:0 1px 2px rgba(14,18,32,.05), 0 12px 32px -12px rgba(14,18,32,.16);
  --shadow-lg:0 2px 8px rgba(14,18,32,.10), 0 48px 90px -28px rgba(14,18,32,.30);
  --sans:"Instrument Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
  --r:16px; --maxw:1140px;
}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){
  --ground:#0A0D16; --surface:#131828; --surface-2:#10141F; --surface-3:#1E2540;
  --line:#262E4B; --line-soft:#1D2440;
  --ink:#EDF0F7; --ink-2:#A5AEC6; --ink-3:#7983A0;
  --brand:#8FA2FF; --brand-soft:#1A2246; --accent:#7C92FF;
  --secure:#45D4A3; --secure-soft:#0F2E27; --secure-line:#1D5B48;
  --warn:#DFA85C; --warn-soft:#2C2416; --warn-line:#4A3A1C;
  --tlp-amber:#E0A73A; --tlp-red:#F08279; --tlp-green:#45D4A3; --tlp-clear:#A6B0C4;
  --band:#0C1020; --band-line:#1E2640;
  --glow-1:rgba(70,96,255,.30); --glow-2:rgba(10,160,110,.14);
  --shadow:0 1px 2px rgba(0,0,0,.5), 0 12px 32px -12px rgba(0,0,0,.7);
  --shadow-lg:0 2px 8px rgba(0,0,0,.6), 0 48px 90px -28px rgba(0,0,0,.9);
}}
:root[data-theme="dark"]{
  --ground:#0A0D16; --surface:#131828; --surface-2:#10141F; --surface-3:#1E2540;
  --line:#262E4B; --line-soft:#1D2440;
  --ink:#EDF0F7; --ink-2:#A5AEC6; --ink-3:#7983A0;
  --brand:#8FA2FF; --brand-soft:#1A2246; --accent:#7C92FF;
  --secure:#45D4A3; --secure-soft:#0F2E27; --secure-line:#1D5B48;
  --warn:#DFA85C; --warn-soft:#2C2416; --warn-line:#4A3A1C;
  --tlp-amber:#E0A73A; --tlp-red:#F08279; --tlp-green:#45D4A3; --tlp-clear:#A6B0C4;
  --band:#0C1020; --band-line:#1E2640;
  --glow-1:rgba(70,96,255,.30); --glow-2:rgba(10,160,110,.14);
  --shadow:0 1px 2px rgba(0,0,0,.5), 0 12px 32px -12px rgba(0,0,0,.7);
  --shadow-lg:0 2px 8px rgba(0,0,0,.6), 0 48px 90px -28px rgba(0,0,0,.9);
}

/* ============ ZÁKLAD ============ */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; background:var(--ground); color:var(--ink);
  font-family:var(--sans); font-size:16px; line-height:1.55;
  -webkit-font-smoothing:antialiased; font-variant-numeric:tabular-nums}
img{max-width:100%; height:auto; display:block}
a{color:inherit}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px}
section{padding:92px 0}
.band{background:var(--surface-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}

/* ============ HLAVIČKA ============ */
header{position:sticky; top:0; z-index:40;
  background:color-mix(in srgb, var(--ground) 86%, transparent);
  backdrop-filter:saturate(180%) blur(14px); border-bottom:1px solid transparent; transition:border-color .3s}
header.is-scrolled{border-bottom-color:var(--line)}
.hd{display:flex; align-items:center; gap:14px; height:64px}
.logo{display:flex; align-items:center; gap:10px; text-decoration:none; font-weight:600; font-size:17.5px; letter-spacing:-.015em}
.logo .mark{width:27px; height:27px; border-radius:7px; background:linear-gradient(160deg,#3B50B8,#22337F);
  display:flex; align-items:center; justify-content:center; flex:none}
.logo .mark svg{width:15px; height:15px; display:block}
/* Menu podle web.aloo: položky vpravo, Stáhnout jako poslední položka, jazyk a motiv na kraji */
nav{display:flex; align-items:center; gap:2px; margin-left:auto}
nav .nav-cta{margin-left:10px; color:#fff}
.nav-act{display:flex; align-items:center; gap:10px}
.nav-mob{display:none}
.nav-toggle{display:none; width:44px; height:44px; border:none; background:transparent; margin-left:auto; position:relative; cursor:pointer}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{content:""; position:absolute; left:11px; width:22px; height:2px;
  background:var(--ink); border-radius:2px; transition:transform .3s, background .2s}
.nav-toggle span{top:21px}
.nav-toggle span::before,.nav-toggle span::after{left:0}
.nav-toggle span::before{top:-7px}
.nav-toggle span::after{top:7px}
body.menu-open .nav-toggle span{background:transparent}
body.menu-open .nav-toggle span::before{transform:translateY(7px) rotate(45deg)}
body.menu-open .nav-toggle span::after{transform:translateY(-7px) rotate(-45deg)}
nav a{padding:7px 11px; border-radius:8px; font-size:14.5px; font-weight:500; color:var(--ink-2); text-decoration:none}
nav a:hover{background:var(--surface-3); color:var(--ink)}
/* Jazykový přepínač — roleta (<details>), převzato z web.aloo */
.lang-select{position:relative; border:0; padding:0}
.lang-select>summary{list-style:none; cursor:pointer; display:inline-flex; align-items:center; gap:6px;
  padding:6px 11px; border:1px solid var(--line); border-radius:999px;
  font-size:13px; font-weight:600; letter-spacing:.03em; color:var(--ink); transition:border-color .2s}
.lang-select>summary::-webkit-details-marker{display:none}
.lang-select>summary::marker{content:""}
.lang-select>summary::after,details.lang-select[open]>summary::after{content:none}
.lang-select>summary:hover{border-color:var(--ink)}
.lang-select__chev{width:12px; height:12px; flex:none; transition:transform .2s}
.lang-select[open] .lang-select__chev{transform:rotate(180deg)}
.lang-select__menu{position:absolute; top:calc(100% + 8px); right:0; z-index:60;
  min-width:170px; background:var(--surface); border:1px solid var(--line);
  border-radius:12px; box-shadow:var(--shadow); padding:6px;
  display:flex; flex-direction:column; max-height:62vh; overflow-y:auto}
.lang-select__menu a{padding:9px 12px; border-radius:8px; font-size:14px; font-weight:500; color:var(--ink-3);
  text-decoration:none; white-space:nowrap; transition:background .15s, color .15s}
.lang-select__menu a:hover{background:var(--surface-3); color:var(--ink)}
.lang-select__menu a.is-current{color:var(--ink); font-weight:600}
.lang-select__menu a.is-current::after{content:"✓"; float:right; margin-left:14px; color:var(--ink-3)}
.lang-flag{display:inline-block; width:19px; height:13px; margin-right:9px; border-radius:2px; background-size:cover; background-position:center; vertical-align:-1px; box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.lang-select>summary .lang-flag{margin-right:0}
.flag-cz { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 4'%3E%3Crect width='6' height='4' fill='%23fff'/%3E%3Crect y='2' width='6' height='2' fill='%23d7141a'/%3E%3Cpath d='M0 0 3 2 0 4z' fill='%2311457e'/%3E%3C/svg%3E"); }
.flag-gb { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 30'%3E%3Crect width='60' height='30' fill='%23012169'/%3E%3Cpath d='M0 0 60 30M60 0 0 30' stroke='%23fff' stroke-width='6'/%3E%3Cpath d='M0 0 60 30M60 0 0 30' stroke='%23C8102E' stroke-width='2'/%3E%3Crect x='25' width='10' height='30' fill='%23fff'/%3E%3Crect y='10' width='60' height='10' fill='%23fff'/%3E%3Crect x='27' width='6' height='30' fill='%23C8102E'/%3E%3Crect y='12' width='60' height='6' fill='%23C8102E'/%3E%3C/svg%3E"); }
.flag-pl { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 4'%3E%3Crect width='6' height='4' fill='%23fff'/%3E%3Crect y='2' width='6' height='2' fill='%23dc143c'/%3E%3C/svg%3E"); }
.flag-de { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 3'%3E%3Crect width='6' height='1' fill='%23000'/%3E%3Crect y='1' width='6' height='1' fill='%23dd0000'/%3E%3Crect y='2' width='6' height='1' fill='%23ffce00'/%3E%3C/svg%3E"); }
.icbtn{width:34px; height:34px; border-radius:9px; border:1px solid var(--line); background:var(--surface);
  color:var(--ink-2); display:flex; align-items:center; justify-content:center; cursor:pointer; flex:none}
.icbtn:hover{color:var(--ink); border-color:var(--ink-3)}
.icbtn svg{width:16px; height:16px}

/* ============ TLAČÍTKA ============ */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:9px;
  height:46px; padding:0 22px; border-radius:12px; font:inherit; font-size:15.5px; font-weight:600;
  text-decoration:none; border:1px solid transparent; cursor:pointer; white-space:nowrap; letter-spacing:-.005em}
.btn svg{width:17px; height:17px; flex:none}
.btn.pri{background:var(--accent); color:#fff; border-color:var(--accent)}
:root[data-theme="dark"] .btn.pri{color:#0A0D16}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .btn.pri{color:#0A0D16}}
.btn.pri:hover{filter:brightness(1.08)}
.btn.sec{background:var(--surface); color:var(--ink); border-color:var(--line)}
.btn.sec:hover{border-color:var(--ink-3)}
.btn.sm{height:37px; padding:0 15px; font-size:14px; border-radius:9px}

/* ============ TYPOGRAFIE ============ */
.eyebrow{font-size:12.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); margin:0 0 16px}
h1{font-size:clamp(36px,5vw,58px); line-height:1.03; letter-spacing:-.035em; font-weight:600; margin:0 0 22px}
h2{font-size:clamp(26px,3.1vw,37px); line-height:1.1; letter-spacing:-.03em; font-weight:600; margin:0 0 14px}
h3{font-size:17.5px; line-height:1.3; letter-spacing:-.015em; font-weight:600; margin:0 0 7px}
.lead{font-size:19px; line-height:1.55; color:var(--ink-2); margin:0 0 30px; max-width:58ch}
.sub{font-size:16.5px; color:var(--ink-2); margin:0 0 34px; max-width:64ch}
p{margin:0 0 14px}
.shead{max-width:60ch; margin-bottom:42px}

/* ============ HERO ============ */
.hero{background:var(--band); border-bottom:1px solid var(--band-line); padding:80px 0 0; position:relative;
  background-image:radial-gradient(900px 420px at 74% -10%, var(--glow-1), transparent 62%),
                   radial-gradient(620px 380px at 6% 6%, var(--glow-2), transparent 60%)}
.nowrap{white-space:nowrap}
.hero h1{max-width:26ch}
/* dvě tlačítka v úvodu stejně široká (podle delšího); na telefonu pod sebou, pořád stejně široká */
.hero .cta{display:inline-grid; grid-auto-flow:column; grid-auto-columns:1fr}
@media (max-width:560px){ .hero .cta{grid-auto-flow:row} }
.hero h1 em{font-style:normal; color:var(--secure)}
.cta{display:flex; gap:12px; flex-wrap:wrap; align-items:center}
.trust{display:flex; gap:10px 28px; flex-wrap:wrap; margin-top:30px; font-size:13.5px; color:var(--ink-3)}
.trust span{display:inline-flex; align-items:center; gap:8px}
.trust svg{width:15px; height:15px; color:var(--secure); flex:none}
.heroshot{margin:58px auto -110px; max-width:1010px; border-radius:14px; overflow:hidden;
  border:1px solid var(--line); box-shadow:var(--shadow-lg)}
.afterhero{height:190px}

/* ============ ZELENÝ PRUH ============ */
.claim{background:var(--secure-soft); border-top:1px solid var(--secure-line); border-bottom:1px solid var(--secure-line); padding:32px 0}
.claimin{display:flex; align-items:center; gap:22px; flex-wrap:wrap}
.claimin>div{flex:1 1 320px}
.claimin .bx{width:44px; height:44px; border-radius:12px; background:var(--secure);
  display:flex; align-items:center; justify-content:center; flex:none; color:var(--secure-soft)}
.claimin .bx svg{width:23px; height:23px}
.claimin .t{font-size:19px; font-weight:600; letter-spacing:-.018em; color:var(--secure)}
.claimin .d{font-size:15.5px; color:var(--ink-2); margin-top:2px}

/* ============ KARTY A MŘÍŽKY ============ */
.g3{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}
.g2{display:grid; grid-template-columns:repeat(2,1fr); gap:20px}
.card{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:26px}
.card p{font-size:15px; color:var(--ink-2); margin:0}
.ic{width:36px; height:36px; border-radius:10px; background:var(--brand-soft); color:var(--brand);
  display:flex; align-items:center; justify-content:center; margin-bottom:16px}
.ic svg{width:19px; height:19px}
.ic.g{background:var(--secure-soft); color:var(--secure)}
.ic.w{background:var(--warn-soft); color:var(--warn)}

/* ============ RIZIKA ============ */
.risk{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line);
  border:1px solid var(--line); border-radius:var(--r); overflow:hidden}
.risk > div{background:var(--surface); padding:24px}
.risk .t{font-size:15.5px; font-weight:600; letter-spacing:-.012em; margin-bottom:5px}
.risk .d{font-size:14.5px; color:var(--ink-2); line-height:1.5}

/* ============ TOK ZPRÁVY ============ */
.flow{display:grid; grid-template-columns:1fr auto 1fr auto 1fr; gap:16px; align-items:stretch}
.node{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:22px}
.node.mid{background:transparent; border-style:dashed}
.node .t{font-size:15px; font-weight:600; margin-bottom:6px; letter-spacing:-.01em}
.node .d{font-size:14px; color:var(--ink-2); line-height:1.5}
.arrow{display:flex; align-items:center; color:var(--ink-3)}
.arrow svg{width:24px; height:24px}
.pill{display:inline-flex; align-items:center; gap:6px; font-size:11.5px; font-weight:600; padding:3px 9px;
  border-radius:99px; background:var(--secure-soft); color:var(--secure); margin-bottom:12px;
  letter-spacing:.04em; text-transform:uppercase}
.pill.q{background:var(--surface-3); color:var(--ink-3)}
.flownote{margin-top:20px; font-size:14.5px; color:var(--ink-3)}

/* ============ VLASTNOSTI ============ */
.feat{display:grid; grid-template-columns:1fr 1fr; gap:58px; align-items:center}
.feat.rev{direction:rtl} .feat.rev>*{direction:ltr}
.feat.phone{grid-template-columns:1fr 300px; gap:64px}
.shot{border-radius:14px; overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow-lg)}
.frame{border-radius:26px; overflow:hidden; border:1px solid var(--line);
  box-shadow:var(--shadow-lg); width:280px; margin:0 auto}
ul.ticks{list-style:none; margin:0; padding:0}
ul.ticks li{position:relative; padding-left:29px; margin-bottom:13px; font-size:15.5px; color:var(--ink-2)}
ul.ticks li b{color:var(--ink); font-weight:600}
ul.ticks li::before{content:""; position:absolute; left:0; top:6px; width:17px; height:17px; border-radius:5px;
  background:var(--secure-soft);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A7454' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  background-size:11px; background-position:center; background-repeat:no-repeat}
.tlprow{display:flex; gap:8px; flex-wrap:wrap; margin-top:20px}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) ul.ticks li::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2345D4A3' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}}
:root[data-theme="dark"] ul.ticks li::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2345D4A3' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
/* snímky podle motivu */
.only-dark{display:none}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .only-dark{display:block}
  :root:not([data-theme="light"]) .only-light{display:none}
}
:root[data-theme="dark"] .only-dark{display:block}
:root[data-theme="dark"] .only-light{display:none}
.tlp{font-size:11.5px; font-weight:600; padding:3px 9px; border-radius:6px; border:1px solid currentColor}
.tlp.r{color:var(--tlp-red)} .tlp.a{color:var(--tlp-amber)} .tlp.g{color:var(--tlp-green)} .tlp.c{color:var(--tlp-clear)}

/* ============ PLATFORMY ============ */
.plat{display:grid; grid-template-columns:repeat(4,1fr); gap:16px}
.plat .card{text-align:center; padding:24px 16px}
.plat .card .t{font-size:15px; font-weight:600; margin-top:12px}
.plat .card .d{font-size:13px; color:var(--ink-3); margin-top:3px}
.plat svg{width:23px; height:23px; margin:0 auto; color:var(--ink-2)}

/* ============ CENÍK ============ */
.price3{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:stretch}
/* karta = 10 řádků sdílených se sousedy: nadpis, cena, popis, 5 položek, tlačítko, poznámka */
.price3 .card{display:grid; grid-row:span 10; grid-template-rows:subgrid; row-gap:0; text-align:center}
.price3 .card.hl{border-color:var(--brand)}
.price3 .amt{font-size:40px; font-weight:600; letter-spacing:-.035em; margin:10px 0 0; line-height:1; align-self:center}
.price3 .amt.sm{font-size:29px}
.price3 .amt small{font-size:16px; font-weight:500; color:var(--ink-3); letter-spacing:0}
.price3 .per{font-size:14px; color:var(--ink-3); margin:10px 0 20px}
.price3 ul{display:contents}
.price3 li{font-size:14.5px; color:var(--ink-2); padding:8px 0; border-top:1px solid var(--line-soft); text-align:left; list-style:none}
.price3 .btn{grid-row:9; justify-self:center; align-self:start; margin-top:24px}
.price3 .vat{grid-row:10; font-size:12.5px; color:var(--ink-3); margin:8px 0 0}

/* ============ FAQ ============ */
details{border-bottom:1px solid var(--line); padding:18px 0}
summary{cursor:pointer; font-size:17px; font-weight:600; letter-spacing:-.015em; list-style:none;
  display:flex; justify-content:space-between; align-items:flex-start; gap:18px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+"; color:var(--ink-3); font-weight:400; font-size:22px; line-height:1; flex:none}
details[open] summary::after{content:"\2212"}
details p{margin:12px 0 0; font-size:15.5px; color:var(--ink-2); max-width:72ch}
details a{color:var(--accent)}

/* ============ ZÁVĚR ============ */
.final{background:var(--band); border-top:1px solid var(--band-line); text-align:center; padding:100px 0;
  background-image:radial-gradient(820px 340px at 50% 125%, var(--glow-1), transparent 65%)}
.final .lead{margin:0 auto 30px}
.final .cta{justify-content:center}

/* ============ PATIČKA ============ */
footer{background:var(--surface-2); border-top:1px solid var(--line); padding:58px 0 34px; font-size:14.5px}
.fgrid{display:grid; grid-template-columns:1.35fr 1fr 1fr 1.25fr 1fr; gap:30px; margin-bottom:40px}
footer h4{font-size:12px; font-weight:600; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-3); margin:0 0 14px}
footer ul{list-style:none; margin:0; padding:0}
footer li{margin-bottom:9px}
footer a{color:var(--ink-2); text-decoration:none}
footer a:hover{color:var(--ink)}
footer .logo{color:var(--ink)}
.fbrand .btn{margin-top:18px}
.fnote{font-size:13.5px; color:var(--ink-3); max-width:30ch; margin-top:14px}
.fnote a{color:var(--ink-2); text-decoration:underline; text-underline-offset:2px}
ul.also li{margin-bottom:18px}
ul.also > li > a{display:block; font-size:16px; font-weight:600; letter-spacing:-.012em; color:var(--ink); margin-bottom:3px}
ul.also span{display:block; font-size:13px; line-height:1.5; color:var(--ink-3)}
ul.also span a{color:var(--ink-2); text-decoration:underline; text-underline-offset:2px}
.fbot{border-top:1px solid var(--line); padding-top:22px; margin-top:6px; display:flex; justify-content:space-between;
  gap:16px; flex-wrap:wrap; font-size:13.5px; color:var(--ink-3)}

/* ============ NEWSLETTER ============ */
.news{background:var(--surface-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.newsin{display:grid; grid-template-columns:1.1fr .9fr; gap:48px; align-items:center}
.newsin .sub{margin-bottom:0}
.nform{display:flex; gap:10px; flex-wrap:wrap}
.nform input{flex:1 1 240px; min-width:0; height:46px; padding:0 15px; border-radius:12px;
  border:1px solid var(--line); background:var(--surface); color:var(--ink); font:inherit; font-size:15px}
.nform input::placeholder{color:var(--ink-3)}
.nform input:focus{outline:none; border-color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent)}
.vh{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
/* ============ PODSTRÁNKY (společnost, právní texty) ============ */
.h1sub{font-size:clamp(30px,4vw,44px)}
.legal{max-width:780px}
.legal h2{font-size:22px; letter-spacing:-.02em; margin:44px 0 12px}
.legal h3{font-size:17.5px; margin:30px 0 8px}
.legal h4{font-size:15.5px; margin:22px 0 6px}
.legal p,.legal li{font-size:15.5px; line-height:1.65; color:var(--ink-2)}
.legal p{margin:0 0 12px}
.legal ul,.legal ol{margin:0 0 14px; padding-left:22px}
.legal li{margin:0 0 6px}
.legal a,.card p a{color:var(--accent)}
.legal .tabwrap{overflow-x:auto; margin:18px 0 22px}
.legal table{width:100%; border-collapse:collapse; font-size:14px}
.legal th,.legal td{border-bottom:1px solid var(--line); padding:9px 10px; text-align:left; vertical-align:top; color:var(--ink-2)}
.legal th{color:var(--ink); font-weight:600}
/* Nápověda: snímky aplikace v textu, telefonní užší */
.help figure{margin:22px 0 30px}
.help figure img{border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow)}
.help figure img.phone{max-width:293px; border-radius:22px}
.help figcaption{max-width:293px; margin-top:10px; font-size:14px; line-height:1.5; color:var(--ink-3)}
.legal .cl{font-weight:600; color:var(--ink)}
.legal .vzor{border:1px solid var(--line); border-radius:12px; padding:20px 22px; margin:8px 0 24px; background:var(--surface)}
.legal .vzor p:last-child{margin-bottom:0}
.cardnote{margin-top:12px!important; font-size:13.5px!important; color:var(--ink-3)!important}

/* ============ OBJEDNÁVKA (Talkey + aloo) ============ */
.order{display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); gap:24px; align-items:start}
.oform [hidden], .order [hidden]{display:none!important}
.oform .hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.oform fieldset{border:0; padding:0; margin:0 0 10px; min-width:0}
.oform legend{font-size:16px; font-weight:600; letter-spacing:-.01em; margin:0 0 14px; padding:0}
.oform label{display:block; font-size:13px; font-weight:600; color:var(--ink-2); margin:0 0 7px}
.oform .nep{font-weight:400; color:var(--ink-3)}
.oform input[type=text], .oform input[type=email], .oform input[type=tel], .oform input[type=number], .oform select, .oform textarea{
  width:100%; height:44px; padding:0 14px; margin:0 0 16px; border:1px solid transparent; border-radius:10px;
  background:var(--surface-3); color:var(--ink); font:inherit; font-size:15px}
.oform textarea{height:auto; padding:11px 14px; resize:vertical}
.oform input:focus, .oform select:focus, .oform textarea:focus{outline:none; border-color:var(--accent); background:var(--surface);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent)}
.oform .bad{border-color:var(--warn)!important}
.orow{display:grid; grid-template-columns:1fr 1fr; gap:0 16px}
.oprod{display:grid; grid-template-columns:minmax(0,1fr) auto 110px; gap:16px; align-items:center;
  padding:14px 16px; margin:0 0 12px; border:1px solid var(--line); border-radius:12px; transition:border-color .15s}
.oprod.on{border-color:var(--brand)}
.oprod .oprod-on{display:flex; gap:12px; align-items:center; margin:0; cursor:pointer}
.oprod .oprod-on input{accent-color:var(--accent); width:18px; height:18px; flex:none}
.oprod b{display:block; font-size:15.5px; color:var(--ink)}
.oprod small{display:block; font-size:13px; font-weight:400; color:var(--ink-3)}
.oprod-price{font-size:15px; font-weight:600; color:var(--ink); white-space:nowrap; text-align:right}
.oprod-price small{display:block; font-weight:400}
.oprod-n label{font-size:12px; margin:0 0 4px}
.oprod-n input{margin:0!important; height:40px!important}
.osame{background:none; border:0; padding:0; font:inherit; font-size:13.5px; color:var(--accent); cursor:pointer; margin:0 0 14px}
.oares{display:block; font-size:12.5px; color:var(--ink-3); margin:-10px 0 14px}
.oares.ok{color:var(--secure)} .oares.chyba{color:var(--warn)}
.ocheck{display:flex!important; gap:10px; align-items:flex-start; font-weight:500!important; font-size:14px!important; margin:4px 0 18px!important}
.ocheck input{margin-top:3px; accent-color:var(--accent)}
.ocheck a, .onote a, .oerr a{color:var(--accent)}
.onote{font-size:12.5px; line-height:1.5; color:var(--ink-3); margin:14px 0 0}
.oerr{font-size:14.5px; color:var(--warn); margin:16px 0 0}
.odone h3{margin:0 0 8px; color:var(--secure)} .odone p{margin:0; color:var(--ink-2)}
.osum{position:sticky; top:84px}
.osum h3{margin:0 0 12px}
.osline{display:flex; justify-content:space-between; gap:12px; font-size:14.5px; color:var(--ink-2); padding:10px 0; border-top:1px solid var(--line-soft)}
.osline.tot{color:var(--ink); font-weight:600; font-size:16px}
.osempty{font-size:14px; color:var(--ink-3); margin:0 0 10px}
.osum .vat{font-size:12.5px; color:var(--ink-3); margin:6px 0 0}
.osbulk{font-size:13.5px; color:var(--ink-3); margin:16px 0 0}
@media (max-width:760px){
  .order, .orow{grid-template-columns:1fr} .osum{position:static}
  .oprod{grid-template-columns:minmax(0,1fr) 96px} .oprod .oprod-on{grid-column:1/-1} .oprod-price{text-align:left}
}

/* ============ FUNKCE: karta TLP + BEZPEČNOST: technický popis ============ */
.tlp{white-space:nowrap}
.tlpcard{margin-top:20px}
.tlphead{display:flex; gap:16px; align-items:flex-start}
.tlphead .ic{flex:none}
.tlphead h3{margin:0 0 6px}
.tlplvls{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:18px; margin-top:22px; padding-top:20px; border-top:1px solid var(--line-soft)}
.tlplvl .tlp{display:inline-block; font-size:11.5px; padding:3px 9px}
.tlplvl p{font-size:14px; margin:10px 0 0}
.spec{margin:0; max-width:920px; border-top:1px solid var(--line)}
.specrow{display:grid; grid-template-columns:220px minmax(0,1fr); gap:24px; padding:16px 0; border-bottom:1px solid var(--line)}
.spec dt{font-size:15px; font-weight:600; color:var(--ink)}
.spec dd{margin:0; font-size:15px; color:var(--ink-2); line-height:1.6}
@media (max-width:1040px){ .tlplvls{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:760px){ .tlplvls{grid-template-columns:1fr} .specrow{grid-template-columns:1fr; gap:4px} .tlphead{flex-direction:column} }

/* Hamburger od tabletu, jako web.aloo — položky, jazyk a motiv se vedle sebe nevejdou */
@media (max-width:960px){
  .nav-toggle{display:block}
  .nav-act{display:none}
  nav{position:fixed; inset:64px 0 auto 0; flex-direction:column; align-items:stretch; gap:2px; margin:0;
      background:var(--ground); padding:12px 16px 22px; border-bottom:1px solid var(--line); box-shadow:var(--shadow);
      transform:translateY(-150%); transition:transform .4s}
  body.menu-open nav{transform:translateY(0)}
  nav a{padding:13px 10px; font-size:16px}
  nav .nav-cta{align-self:flex-start; margin:8px 10px 0; padding:12px 28px; font-size:15px}
  .nav-mob{display:flex; align-items:center; gap:14px; padding:14px 10px 0}
  .nav-mob .lang-select__menu{left:0; right:auto}
  nav .nav-mob .lang-select__menu a{padding:9px 12px; font-size:14px}
}

@media (max-width:1040px){ .newsin{grid-template-columns:1fr; gap:26px} }

/* ============ MODÁL ============ */

.modal{position:fixed; inset:0; z-index:80; display:flex; align-items:center; justify-content:center; padding:24px}
.modal[hidden]{display:none}
.mbd{position:absolute; inset:0; background:rgba(10,14,28,.45); backdrop-filter:blur(2px)}
.mbox{position:relative; width:100%; max-width:420px; background:var(--surface); border:1px solid var(--line);
  border-radius:18px; padding:30px 30px 26px; box-shadow:var(--shadow-lg); max-height:90vh; overflow:auto}
.mclose{position:absolute; top:14px; right:16px; background:none; border:0; color:var(--ink-3);
  font:inherit; font-size:22px; line-height:1; cursor:pointer}
.mclose:hover{color:var(--ink)}
.mbox h3{font-size:21px; letter-spacing:-.022em; margin:0 0 8px}
.mdesc{font-size:14.5px; color:var(--ink-2); margin:0 0 22px}
.mbox label{display:block; font-size:13px; font-weight:600; color:var(--ink-2); margin:0 0 7px}
.mbox input[type=text], .mbox input[type=email]{width:100%; height:44px; padding:0 14px; margin:0 0 16px;
  border:1px solid transparent; border-radius:10px; background:var(--surface-3); color:var(--ink); font:inherit; font-size:15px}
.mbox input:focus{outline:none; border-color:var(--accent); background:var(--surface);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent)}
.mbox input[type=tel], .mbox select, .mbox textarea{width:100%; height:44px; padding:0 14px; margin:0 0 16px;
  border:1px solid transparent; border-radius:10px; background:var(--surface-3); color:var(--ink); font:inherit; font-size:15px}
.mbox textarea{height:auto; padding:11px 14px; resize:vertical}
.mbox select:focus, .mbox textarea:focus{outline:none; border-color:var(--accent); background:var(--surface);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent)}
.mbox .nep{font-weight:400; color:var(--ink-3)}
.mbox .bad{border-color:var(--warn)!important}
.mbox .hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.mbox [hidden]{display:none!important}
.merr{font-size:14px; color:var(--warn); margin:14px 0 0}
.mnote a{color:var(--accent)}
.mbox .btn{width:100%; margin-top:6px}
.mnote{font-size:12.5px; line-height:1.5; color:var(--ink-3); margin:16px 0 0}
.mdone{font-size:14.5px; color:var(--secure); margin:18px 0 0}


/* ============ SNÍMEK NA STŘED ============ */
.shot.center{max-width:520px; margin:52px auto 0}
.shotcap{font-size:13.5px; color:var(--ink-3); text-align:center; margin:14px 0 0}
.h3big{font-size:clamp(22px,2.4vw,28px); line-height:1.15; letter-spacing:-.025em; margin:0 0 14px}
.plat a.card{text-decoration:none; transition:border-color .15s}
.plat a.card:hover{border-color:var(--ink-3)}
.card .tlprow{margin-top:14px}
.card .tlp{font-size:10.5px; padding:2px 7px}

/* ============ O TALKEY + REFERENCE ============ */
.otk{display:grid; grid-template-columns:1fr 1fr; gap:58px; align-items:start}
.refs{display:grid; gap:14px}
.ref{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:20px 22px; position:relative}
.ref .q{position:absolute; top:10px; left:18px; font-size:34px; line-height:1; color:var(--line); font-weight:600}
.ref p{margin:0 0 6px; font-size:15px; color:var(--ink-2); padding-left:22px}
.ref .who{display:block; font-size:13px; color:var(--ink-3); padding-left:22px}
.ref.empty{border-style:dashed; background:transparent}
.ref.empty p{color:var(--ink-3)}
.refnote{font-size:13px; color:var(--ink-3); margin:4px 0 0}
@media (max-width:1040px){ .otk{grid-template-columns:1fr; gap:34px} }

@media (max-width:1040px){
  .feat,.feat.phone,.pol,.news{grid-template-columns:1fr; gap:34px}
  .flow{grid-template-columns:1fr}
  .arrow{justify-content:center; transform:rotate(90deg); height:28px}
  .plat,.proof,.risk{grid-template-columns:repeat(2,1fr)}
  .fgrid{grid-template-columns:1fr 1fr; gap:28px}
  .heroshot{margin-bottom:-70px} .afterhero{height:120px}
}
@media (max-width:760px){
  .g3,.g2,.price3,.plat,.proof,.risk{grid-template-columns:1fr}
  section{padding:64px 0}
  .hero{padding:50px 0 0}
  .fgrid{grid-template-columns:1fr; gap:26px}
    .heroshot{margin-bottom:-30px} .afterhero{height:64px}
}
/* ============ CO JE NOVÉHO (changelog) ============ */
.legal .rel + .rel{margin-top:40px; padding-top:30px; border-top:1px solid var(--line)}
.legal .rel h2{margin:0}
.legal .reldate{margin:4px 0 14px; font-size:14px; color:var(--ink-3)}
.legal .chg{list-style:none; padding:0; margin:14px 0 0}
.legal .chg li{display:grid; grid-template-columns:108px 1fr; gap:14px; align-items:baseline; margin:0;
  padding:9px 0; border-bottom:1px solid var(--line-soft)}
.legal .chg li:last-child{border-bottom:0}
.chg-t{justify-self:start; font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  padding:2px 8px; border-radius:99px; background:var(--surface-3); color:var(--ink-3); white-space:nowrap}
.chg-t.add{background:var(--secure-soft); color:var(--secure)}
.chg-t.mod{background:var(--brand-soft); color:var(--brand)}
.chg-t.rem{background:var(--warn-soft); color:var(--warn)}
.legal .relfoot{margin-top:44px}
@media (max-width:760px){ .legal .chg li{grid-template-columns:1fr; gap:6px} }
