/* styly stránky: home */

.brand small {display:block;font-family:var(--body);font-weight:500;font-size:11px;color:var(--muted-2);letter-spacing:.3px}

.menu a {color:var(--muted);font-size:14px;font-weight:500;padding:8px 14px;border-radius:8px;transition:.18s;cursor:pointer}

.menu a:hover {color:var(--ink);background:var(--bg-2)}

.menu a.active {color:var(--teal);background:rgba(16,185,129,.09)}

.nav-cta:hover {background:var(--teal-strong);box-shadow:0 6px 20px rgba(13,159,130,.3)}

.avail {display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;color:var(--teal-strong);border:1px solid var(--line);border-radius:100px;padding:5px 12px;background:rgba(16,185,129,.06)}

.dot {width:7px;height:7px;border-radius:50%;background:var(--green);animation:pulse 2s infinite}

.section-sm {padding:56px 0}

.section {padding:88px 0}

.btn-primary:hover {background:var(--teal-strong);box-shadow:0 8px 26px rgba(13,159,130,.3);transform:translateY(-1px)}

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

.btn:hover .arrow {transform:translateX(3px)}

.hero {padding:96px 0 60px}

.hero-single {max-width:760px;margin:0 auto;text-align:center}

.hero-single h1 span {background:linear-gradient(120deg,var(--green),var(--teal));-webkit-background-clip:text;background-clip:text;color:transparent}

.hero-single .lead {margin:22px auto 30px}

.hero-single .hero-cta {justify-content:center}

.hero-single .hero-meta {justify-content:center}

.hero-grid {display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}

.hero h1 span {background:linear-gradient(120deg,var(--green),var(--teal));-webkit-background-clip:text;background-clip:text;color:transparent}

.hero .lead {margin:22px 0 30px}

.hero-cta {display:flex;gap:14px;flex-wrap:wrap;margin-bottom:26px}

.hero-meta {display:flex;gap:26px;flex-wrap:wrap;font-family:var(--mono);font-size:12px;color:var(--muted-2)}

.hero-meta b {color:var(--text);font-weight:700}

.panel {background:linear-gradient(160deg,#fff,var(--bg-2));border:1px solid var(--line-soft);border-radius:18px;padding:22px;position:relative;overflow:hidden;box-shadow:0 24px 50px -30px rgba(12,26,23,.25)}

.panel::before {content:"";position:absolute;inset:0;background:radial-gradient(circle at 82% 0%,rgba(16,185,129,.1),transparent 55%)}

.flow-title {font-family:var(--mono);font-size:11px;color:var(--muted-2);letter-spacing:1px;text-transform:uppercase;margin-bottom:16px;position:relative}

.flow-row {display:flex;align-items:center;gap:10px;margin-bottom:11px;position:relative}

.chip {font-family:var(--mono);font-size:12px;padding:8px 11px;border-radius:8px;background:var(--surface-2);border:1px solid var(--line-soft);color:var(--muted);white-space:nowrap;flex:1;text-align:center}

.chip.hot {color:var(--teal-strong);border-color:var(--line);background:rgba(16,185,129,.08)}

.pipe {color:var(--teal);font-family:var(--mono);opacity:.7}

.flow-out {margin-top:16px;padding:14px;border-radius:11px;background:rgba(16,185,129,.07);border:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;position:relative}

.flow-out .n {font-family:var(--mono);font-size:26px;font-weight:700;color:var(--teal-strong)}

.flow-out .l {font-size:12px;color:var(--muted);text-align:right}

.grid-3 {display:grid;grid-template-columns:repeat(3,1fr);gap:20px}

.grid-2 {display:grid;grid-template-columns:repeat(2,1fr);gap:20px}

.card {background:var(--surface);border:1px solid var(--line-soft);border-radius:15px;padding:26px;transition:.2s;cursor:pointer}

.card:hover {border-color:var(--line);transform:translateY(-3px);box-shadow:0 18px 40px -24px rgba(12,26,23,.28)}

.card .ic {width:42px;height:42px;border-radius:11px;background:rgba(16,185,129,.1);border:1px solid var(--line);display:grid;place-items:center;margin-bottom:16px;color:var(--teal);font-size:18px}

.card h3 {margin-bottom:8px}

.card p {color:var(--muted);font-size:14.5px}

.card-num {font-family:var(--mono);font-size:12px;color:var(--muted-2);float:right}

.section-head {max-width:64ch;margin-bottom:44px}

.value {background:var(--bg-2);border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);position:relative;z-index:1}

.value-grid {display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}

.value h2 {margin-bottom:18px}

.value h2 em {font-style:normal;color:var(--teal-strong)}

.value .p-lead {color:var(--text);font-size:19px;line-height:1.55;margin-bottom:16px;font-weight:500}

.value p {color:var(--muted);font-size:16px;margin-bottom:16px}

.value .btn {margin-top:8px}

.pains {display:flex;flex-direction:column;gap:12px}

.pain {display:flex;gap:14px;align-items:flex-start;background:var(--surface);border:1px solid var(--line-soft);border-radius:13px;padding:18px 20px}

.pain .x {width:26px;height:26px;border-radius:7px;background:rgba(16,185,129,.1);border:1px solid var(--line);color:var(--teal);display:grid;place-items:center;flex-shrink:0;font-size:13px;margin-top:1px}

.pain .t {font-size:15px;color:var(--text)}

.pain .t b {color:var(--ink);font-weight:600}

.value-note {font-family:var(--mono);font-size:12px;color:var(--muted-2);margin-top:16px;padding-left:2px}

.value.alt {background:var(--bg)}

.value.alt .value-grid {grid-template-columns:.95fr 1.05fr}

.value.alt .pains {order:-1}

.value.alt .pain {background:var(--bg-2)}

.steps {display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:step}

.step {background:var(--surface);border:1px solid var(--line-soft);border-radius:15px;padding:26px 24px;position:relative;transition:.2s}

.step:hover {border-color:var(--line);transform:translateY(-3px);box-shadow:0 18px 40px -24px rgba(12,26,23,.28)}

.step .no {font-family:var(--mono);font-size:13px;font-weight:700;color:var(--teal);width:38px;height:38px;border-radius:10px;background:rgba(16,185,129,.1);border:1px solid var(--line);display:grid;place-items:center;margin-bottom:18px}

.step h3 {font-size:18px;margin-bottom:10px}

.step p {color:var(--muted);font-size:14px}

.step::after {content:"→";position:absolute;top:38px;right:-14px;color:var(--line);font-size:18px;z-index:2}

.step:last-child::after {display:none}

.quote {background:var(--surface);border:1px solid var(--line-soft);border-radius:15px;padding:28px}

.quote .q {font-size:16px;color:var(--ink);margin-bottom:18px;line-height:1.65}

.quote .who {display:flex;align-items:center;gap:12px}

.av {width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--green),var(--teal));display:grid;place-items:center;font-family:var(--mono);font-weight:700;color:#fff;font-size:14px}

.who .nm {font-weight:600;font-size:14px;color:var(--ink)}

.who .rl {font-size:12px;color:var(--muted-2)}

.post {background:var(--surface);border:1px solid var(--line-soft);border-radius:15px;overflow:hidden;transition:.2s;cursor:pointer}

.post:hover {border-color:var(--line);transform:translateY(-3px);box-shadow:0 18px 40px -24px rgba(12,26,23,.28)}

.post .thumb {height:150px;background:linear-gradient(135deg,var(--surface-2),#fff);position:relative;display:grid;place-items:center;border-bottom:1px solid var(--line-soft)}

.post .thumb .mono {color:var(--muted-2);font-size:12px}

.post .thumb::after {content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,#00000008 1px,transparent 1px);background-size:20px 20px}

.post .body {padding:22px}

.post .meta {font-family:var(--mono);font-size:11px;color:var(--muted-2);margin-bottom:10px;display:flex;gap:12px}

.post h3 {margin-bottom:8px;font-size:18px}

.cta-band {border:1px solid var(--line);border-radius:20px;padding:46px;text-align:center;background:radial-gradient(ellipse at 50% 120%,rgba(16,185,129,.1),transparent 60%),var(--bg-2)}

.cta-band h2 {margin-bottom:12px}

.cta-band p {color:var(--muted);max-width:52ch;margin:0 auto 26px}

.foot .links {display:flex;gap:18px}

.foot .links a:hover {color:var(--teal)}

@media(max-width:1040px) and (min-width:861px){.steps {grid-template-columns:repeat(2,1fr)}
.step:nth-child(2)::after {display:none}}

@media(max-width:860px){.hero-grid, .value-grid, .value.alt .value-grid {grid-template-columns:1fr}
.value.alt .pains {order:0}
.value-grid {gap:36px}
.steps {grid-template-columns:1fr}
.step::after {display:none}
.grid-3, .grid-2 {grid-template-columns:1fr}
.menu.open {display:flex;position:absolute;top:66px;left:0;right:0;flex-direction:column;background:#fff;border-bottom:1px solid var(--line-soft);padding:12px}
.menu.open a {width:100%}}