*{box-sizing:border-box}

html{scroll-behavior:smooth;scroll-padding-top:var(--head-h)}
body{
  margin:0;
  padding-bottom:env(safe-area-inset-bottom,0px);
  background:var(--bg);
  color:var(--ink);
  font-family:var(--f-body);
  font-size:18px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%}
[hidden]:not([hidden=until-found i]){display:none !important}
a{color:inherit}
h1,h2,h3{font-family:var(--f-display);font-weight:700;line-height:1.12;margin:0;text-wrap:balance;letter-spacing:-.01em}
p{margin:0}
:focus-visible{outline:3px solid var(--cyan);outline-offset:3px;border-radius:6px}

.wrap{max-width:var(--wrap);margin-inline:auto;padding-left:var(--gx);padding-right:var(--gx-r)}

.eyebrow{font-family:var(--f-mono);font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--cyan-ink);display:flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:18px;height:2px;background:var(--cyan)}
.lead{font-size:20px;color:var(--steel);max-width:60ch}

/* Tlačidlá */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--f-display);font-weight:700;font-size:15px;letter-spacing:.01em;padding:13px 22px;border-radius:999px;text-decoration:none;border:1.5px solid transparent;cursor:pointer;transition:transform .15s,background .15s,box-shadow .15s,color .15s}
.btn-primary{background:var(--ink);color:#fff}
.btn-primary:hover{background:#1c2c37;transform:translateY(-1px);box-shadow:0 8px 24px -10px rgba(18,198,230,.7)}
.btn-accent{background:var(--cyan);color:var(--ink)}
.btn-accent:hover{background:var(--cyan-hi);transform:translateY(-1px);box-shadow:0 10px 26px -10px rgba(18,198,230,.85)}
.btn-outline{border-color:var(--ink);background:var(--surface);color:var(--ink)}
.btn-outline:hover{background:var(--ink);color:#fff}
.btn-ghost{border-color:var(--line);background:var(--surface);color:var(--ink)}
.btn-ghost:hover{border-color:var(--cyan)}
.btn .arr{transition:transform .15s}
.btn:hover .arr{transform:translateX(3px)}

/* Sekcie */
section.block{padding-block:96px}
.sec-head{display:flex;flex-direction:column;gap:16px;margin-bottom:48px;max-width:760px}
.sec-head.flush{margin-bottom:0}
.sec-head h2{font-size:clamp(30px,3.6vw,44px)}
@media (max-width:700px){
  section.block{padding-block:64px}
  .sec-head{margin-bottom:32px}
}

@media (prefers-reduced-motion:reduce){
  *{transition:none !important;animation:none !important;scroll-behavior:auto !important}
}