/* ============================================================
   AI s přehledem — styly (aisprehledem.cz)
   Systémové fonty, inline SVG ikony, žádné externí závislosti.
   Struktura: proměnné → layout → hlavička → komponenty → formulář → responsive
   ============================================================ */

:root{
  --bg:#0a0c14;
  --bg-soft:#0f1220;
  --surface:rgba(255,255,255,.035);
  --surface-2:rgba(255,255,255,.06);
  --border:rgba(255,255,255,.09);
  --border-strong:rgba(255,255,255,.16);
  --text:#eef1f8;
  --muted:#9aa3b8;
  --brand:#6366f1;
  --brand-2:#22d3ee;
  --brand-3:#a855f7;
  --ok:#34d399;
  --ring:rgba(99,102,241,.45);
  --shadow:0 24px 60px -24px rgba(0,0,0,.85);

  --maxw:1160px;
  --r-sm:10px;
  --r:16px;
  --r-lg:24px;
  --f-h1:clamp(2.3rem,1.2rem + 4.4vw,4.2rem);
  --f-h2:clamp(1.75rem,1.15rem + 2.2vw,2.7rem);
  --f-h3:clamp(1.1rem,1rem + .5vw,1.32rem);
  --sp-section:clamp(4.5rem,3rem + 7vw,8rem);
}

html[data-theme="light"]{
  --bg:#f7f8fc;
  --bg-soft:#ffffff;
  --surface:rgba(15,18,32,.025);
  --surface-2:rgba(15,18,32,.05);
  --border:rgba(15,18,32,.10);
  --border-strong:rgba(15,18,32,.2);
  --text:#141827;
  --muted:#5a6379;
  --shadow:0 24px 60px -30px rgba(20,24,39,.4);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html:focus-within{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  font-size:clamp(1rem,.96rem + .18vw,1.075rem);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
body.nav-open{overflow:hidden}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{line-height:1.14;letter-spacing:-.025em;margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
ul{margin:0;padding:0;list-style:none}
:focus-visible{outline:2px solid var(--brand-2);outline-offset:3px;border-radius:6px}

/* ---------- layout ---------- */
.wrap{width:min(100% - 2.5rem,var(--maxw));margin-inline:auto}
section{position:relative;padding-block:var(--sp-section)}
.section-head{max-width:62ch;margin-bottom:clamp(2rem,1rem + 3vw,3.5rem)}
.eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;
  font-size:.775rem;font-weight:650;letter-spacing:.14em;text-transform:uppercase;
  color:var(--brand-2);margin-bottom:1rem;
}
.eyebrow::before{content:"";width:1.6rem;height:1px;background:linear-gradient(90deg,transparent,var(--brand-2))}
h2{font-size:var(--f-h2)}
.lead{color:var(--muted);font-size:1.06em;margin-top:1rem}

/* ---------- ambient background ---------- */
.glow{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5;pointer-events:none;z-index:0}
html[data-theme="light"] .glow{opacity:.28}
.glow--a{inset-block-start:-14rem;inset-inline-start:-8rem;width:38rem;height:38rem;background:radial-gradient(circle,var(--brand),transparent 66%)}
.glow--b{inset-block-start:6rem;inset-inline-end:-12rem;width:34rem;height:34rem;background:radial-gradient(circle,var(--brand-2),transparent 66%);opacity:.32}
.glow--c{inset-block-end:-16rem;inset-inline-start:30%;width:32rem;height:32rem;background:radial-gradient(circle,var(--brand-3),transparent 68%);opacity:.28}

.grid-lines{
  position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:radial-gradient(ellipse 90% 60% at 50% 0%,#000 10%,transparent 72%);
  opacity:.55;
}

/* ---------- header ---------- */
.skip{position:absolute;left:-9999px}
.skip:focus{left:1rem;top:1rem;z-index:100;background:var(--brand);color:#fff;padding:.6rem 1rem;border-radius:8px}

header.site{
  position:sticky;top:0;z-index:50;
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  background:color-mix(in srgb,var(--bg) 78%,transparent);
  border-bottom:1px solid transparent;
  transition:border-color .25s,background .25s;
}
header.site.scrolled{border-bottom-color:var(--border);background:color-mix(in srgb,var(--bg) 92%,transparent)}
.nav{display:flex;align-items:center;gap:1.25rem;height:68px}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:750;letter-spacing:-.02em;font-size:1.05rem;margin-inline-end:auto}
.brand .mark{
  width:32px;height:32px;flex:none;border-radius:9px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--brand),var(--brand-3) 55%,var(--brand-2));
  color:#fff;font-size:.78rem;font-weight:800;letter-spacing:-.02em;
  box-shadow:0 6px 18px -6px var(--brand);
}
.brand small{display:block;font-size:.68rem;font-weight:500;color:var(--muted);letter-spacing:.05em}
.nav-links{display:flex;align-items:center;gap:.25rem}
.nav-links a{
  padding:.5rem .75rem;border-radius:9px;font-size:.925rem;font-weight:520;color:var(--muted);
  transition:color .18s,background .18s;
}
.nav-links a:hover{color:var(--text);background:var(--surface-2)}
.nav-links a[aria-current="true"]{color:var(--text)}
.nav-actions{display:flex;align-items:center;gap:.5rem}

.icon-btn{
  width:38px;height:38px;flex:none;display:grid;place-items:center;
  border:1px solid var(--border);border-radius:10px;background:var(--surface);
  color:var(--text);cursor:pointer;transition:border-color .18s,background .18s,transform .18s;
}
.icon-btn:hover{border-color:var(--border-strong);background:var(--surface-2)}
.icon-btn:active{transform:scale(.94)}
.icon-btn svg{width:18px;height:18px}
html[data-theme="dark"] .i-sun{display:block}
html[data-theme="dark"] .i-moon{display:none}
html[data-theme="light"] .i-sun{display:none}
html[data-theme="light"] .i-moon{display:block}
.burger{display:none}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  padding:.8rem 1.35rem;border-radius:12px;border:1px solid transparent;
  font:inherit;font-weight:620;font-size:.95rem;letter-spacing:-.01em;
  cursor:pointer;white-space:nowrap;
  transition:transform .18s cubic-bezier(.2,.7,.3,1),box-shadow .18s,background .18s,border-color .18s,opacity .18s;
}
.btn svg{width:17px;height:17px;flex:none}
.btn--primary{
  background:linear-gradient(135deg,var(--brand),var(--brand-3));
  color:#fff;box-shadow:0 12px 28px -12px var(--brand),inset 0 1px 0 rgba(255,255,255,.22);
}
.btn--primary:hover{transform:translateY(-2px);box-shadow:0 18px 34px -12px var(--brand)}
.btn--ghost{background:var(--surface);border-color:var(--border);color:var(--text)}
.btn--ghost:hover{border-color:var(--border-strong);background:var(--surface-2);transform:translateY(-2px)}
.btn--lg{padding:.95rem 1.7rem;font-size:1rem}
.btn--block{width:100%}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}

.link-arrow{
  display:inline-flex;align-items:center;gap:.4rem;font-weight:600;font-size:.925rem;color:var(--brand-2);
}
.link-arrow svg{width:15px;height:15px;transition:transform .2s}
.link-arrow:hover svg{transform:translateX(4px)}

/* ---------- hero ---------- */
.hero{padding-block:clamp(3.5rem,2rem + 9vw,7.5rem) var(--sp-section);overflow:hidden}
.hero .wrap{position:relative;z-index:1}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(2rem,1rem + 4vw,4.5rem);align-items:center}
.pill{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.4rem .85rem .4rem .5rem;border:1px solid var(--border);border-radius:999px;
  background:var(--surface);font-size:.83rem;color:var(--muted);margin-bottom:1.6rem;
}
.pill b{
  display:inline-flex;align-items:center;gap:.35rem;
  background:linear-gradient(135deg,var(--brand),var(--brand-3));color:#fff;
  padding:.15rem .6rem;border-radius:999px;font-size:.74rem;font-weight:700;letter-spacing:.03em;
}
.dot{width:6px;height:6px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 0 var(--ok);animation:pulse 2.4s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 7px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}

h1{font-size:var(--f-h1);letter-spacing:-.04em;font-weight:780}
.gradient-text{
  background:linear-gradient(115deg,var(--brand-2),var(--brand) 42%,var(--brand-3));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero p.lead{font-size:1.14em;max-width:52ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2.2rem}
.hero-note{display:flex;flex-wrap:wrap;gap:1.25rem;margin-top:1.6rem;font-size:.86rem;color:var(--muted)}
.hero-note span{display:inline-flex;align-items:center;gap:.4rem}
.hero-note svg{width:15px;height:15px;color:var(--ok)}

/* terminál / vizuál */
.visual{
  position:relative;border:1px solid var(--border);border-radius:var(--r-lg);
  background:linear-gradient(160deg,var(--surface-2),transparent 60%),var(--bg-soft);
  box-shadow:var(--shadow);overflow:hidden;
}
.visual::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;
  background:linear-gradient(140deg,rgba(99,102,241,.5),transparent 40%,rgba(34,211,238,.35));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;
}
.visual-bar{display:flex;align-items:center;gap:.45rem;padding:.75rem 1rem;border-bottom:1px solid var(--border)}
.visual-bar i{width:10px;height:10px;border-radius:50%;background:var(--border-strong)}
.visual-bar span{margin-inline-start:.5rem;font-size:.75rem;color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.visual-body{padding:1.35rem 1.25rem;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.83rem;line-height:1.9}
.visual-body .c-dim{color:var(--muted)}
.visual-body .c-key{color:var(--brand-2)}
.visual-body .c-ok{color:var(--ok)}
.visual-body .c-br{color:var(--brand-3)}
.caret{display:inline-block;width:8px;height:1.05em;vertical-align:-.18em;background:var(--brand-2);animation:blink 1.1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}

.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border-top:1px solid var(--border)}
.stats div{background:var(--bg-soft);padding:1.05rem 1rem}
.stats b{display:block;font-size:1.5rem;font-weight:750;letter-spacing:-.03em;line-height:1.2}
.stats small{color:var(--muted);font-size:.76rem}

/* ---------- tři kategorie ---------- */
.catrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:1rem}
.catrow a{
  display:flex;align-items:center;gap:.9rem;height:100%;
  padding:1.05rem 1.15rem;border:1px solid var(--border);border-radius:var(--r);
  background:var(--surface);transition:border-color .2s,background .2s,transform .2s;
}
.catrow a:hover{border-color:var(--border-strong);background:var(--surface-2);transform:translateY(-2px)}
.catrow svg{width:22px;height:22px;flex:none;color:var(--brand-2)}
.catrow b{display:block;font-size:.98rem;font-weight:680;letter-spacing:-.015em}
.catrow small{display:block;color:var(--muted);font-size:.82rem;line-height:1.45}
.catrow-n{
  margin-inline-start:auto;flex:none;align-self:flex-start;
  font-size:.7rem;font-weight:650;letter-spacing:.05em;color:var(--muted);
  padding:.2rem .5rem;border:1px solid var(--border);border-radius:999px;white-space:nowrap;
}

/* ---------- logo řádek ---------- */
.logos{padding-block:2.5rem;border-block:1px solid var(--border)}
.logos p{text-align:center;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:1.5rem}
.logos ul{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(1.5rem,1rem + 3vw,3.5rem)}
.logos li{font-weight:700;font-size:1.05rem;letter-spacing:-.02em;color:var(--muted);opacity:.65;transition:opacity .2s,color .2s}
.logos li:hover{opacity:1;color:var(--text)}

/* ---------- karty ---------- */
.cards{display:grid;gap:1.25rem}
.cards--3{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.cards--2{grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr))}

.card{
  position:relative;display:flex;flex-direction:column;
  padding:clamp(1.5rem,1.1rem + 1vw,2rem);
  border:1px solid var(--border);border-radius:var(--r-lg);
  background:var(--surface);
  transition:transform .28s cubic-bezier(.2,.7,.3,1),border-color .28s,background .28s;
  overflow:hidden;
}
.card::after{
  content:"";position:absolute;inset:0;opacity:0;transition:opacity .3s;pointer-events:none;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(99,102,241,.14),transparent 65%);
}
.card:hover{transform:translateY(-4px);border-color:var(--border-strong);background:var(--surface-2)}
.card:hover::after{opacity:1}
.card--featured{border-color:color-mix(in srgb,var(--brand) 45%,transparent)}
.card--featured::before{
  content:"Nejžádanější";position:absolute;top:1.15rem;inset-inline-end:1.15rem;
  font-size:.68rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  padding:.28rem .6rem;border-radius:999px;color:#fff;
  background:linear-gradient(135deg,var(--brand),var(--brand-3));
}
.card-ico{
  width:46px;height:46px;flex:none;border-radius:13px;display:grid;place-items:center;margin-bottom:1.15rem;
  background:linear-gradient(140deg,color-mix(in srgb,var(--brand) 26%,transparent),color-mix(in srgb,var(--brand-2) 16%,transparent));
  border:1px solid var(--border);color:var(--brand-2);
}
.card-ico svg{width:22px;height:22px}
.card h3{font-size:var(--f-h3);font-weight:700;margin-bottom:.55rem}
.card > p{color:var(--muted);font-size:.95rem}
.card .meta{
  display:flex;flex-wrap:wrap;gap:.4rem;margin:1.1rem 0 0;
}
.tag{
  font-size:.74rem;font-weight:600;letter-spacing:.02em;color:var(--muted);
  padding:.24rem .6rem;border:1px solid var(--border);border-radius:999px;background:var(--bg-soft);
}
.tag--accent{color:var(--brand-2);border-color:color-mix(in srgb,var(--brand-2) 35%,transparent)}
.feat{margin-top:1.25rem;display:grid;gap:.55rem}
.feat li{position:relative;padding-inline-start:1.6rem;font-size:.92rem;color:var(--muted)}
.feat li::before{
  content:"";position:absolute;inset-inline-start:0;top:.5em;width:.85rem;height:.85rem;border-radius:50%;
  background:color-mix(in srgb,var(--ok) 22%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ok) 55%,transparent);
}
.feat li::after{
  content:"";position:absolute;inset-inline-start:.28rem;top:.72em;width:.28rem;height:.14rem;
  border-inline-start:1.5px solid var(--ok);border-block-end:1.5px solid var(--ok);transform:rotate(-45deg);
}
.card-foot{margin-top:auto;padding-top:1.5rem}

/* menší karty služeb */
.card--sm{padding:1.5rem}
.card--sm .card-ico{width:40px;height:40px;border-radius:11px;margin-bottom:1rem}
.card--sm .card-ico svg{width:19px;height:19px}
.card--sm h3{font-size:1.06rem}
.card--sm p{font-size:.9rem}

/* ---------- proces ---------- */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:1.25rem;counter-reset:s}
.step{position:relative;padding-top:2.6rem;counter-increment:s}
.step::before{
  content:counter(s,decimal-leading-zero);
  position:absolute;top:0;inset-inline-start:0;
  font-size:.9rem;font-weight:750;letter-spacing:.04em;color:var(--brand-2);
  width:2.2rem;height:2.2rem;display:grid;place-items:center;border-radius:50%;
  border:1px solid color-mix(in srgb,var(--brand-2) 35%,transparent);background:var(--surface);
}
.step::after{
  content:"";position:absolute;top:1.1rem;inset-inline-start:2.7rem;right:-1.25rem;height:1px;
  background:linear-gradient(90deg,var(--border),transparent);
}
.step:last-child::after{display:none}
.step h3{font-size:1.04rem;margin-bottom:.4rem}
.step p{color:var(--muted);font-size:.92rem}

/* ---------- pruh "pro koho" ---------- */
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:1.25rem}
.panel{
  padding:clamp(1.6rem,1.2rem + 1vw,2.2rem);border:1px solid var(--border);border-radius:var(--r-lg);
  background:linear-gradient(150deg,var(--surface-2),transparent 70%);
}
.panel h3{font-size:1.12rem;margin-bottom:1rem;display:flex;align-items:center;gap:.55rem}
.panel h3 svg{width:19px;height:19px;color:var(--brand-2)}
.panel li{position:relative;padding-inline-start:1.35rem;color:var(--muted);font-size:.94rem;margin-bottom:.5rem}
.panel li::before{content:"";position:absolute;inset-inline-start:.2rem;top:.72em;width:5px;height:5px;border-radius:50%;background:var(--brand)}

/* ---------- reference ---------- */
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:1.25rem}
blockquote{
  margin:0;padding:1.75rem;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface);
  display:flex;flex-direction:column;gap:1.15rem;
}
blockquote p{font-size:.98rem}
blockquote p::before{content:"„"}
blockquote p::after{content:"“"}
.who{display:flex;align-items:center;gap:.7rem;margin-top:auto}
.avatar{
  width:38px;height:38px;flex:none;border-radius:50%;display:grid;place-items:center;
  font-size:.8rem;font-weight:700;color:#fff;
  background:linear-gradient(135deg,var(--brand),var(--brand-3));
}
.who b{display:block;font-size:.9rem;font-weight:650}
.who small{color:var(--muted);font-size:.8rem}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:.7rem;max-width:820px}
details{border:1px solid var(--border);border-radius:var(--r);background:var(--surface);overflow:hidden}
details[open]{border-color:var(--border-strong);background:var(--surface-2)}
summary{
  cursor:pointer;list-style:none;padding:1.1rem 1.35rem;font-weight:600;font-size:.99rem;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
}
summary::-webkit-details-marker{display:none}
summary::after{
  content:"";width:9px;height:9px;flex:none;
  border-inline-end:2px solid var(--muted);border-block-end:2px solid var(--muted);
  transform:rotate(45deg) translateY(-2px);transition:transform .22s;
}
details[open] summary::after{transform:rotate(-135deg) translateY(-2px)}
details p{padding:0 1.35rem 1.25rem;color:var(--muted);font-size:.94rem;max-width:70ch}

/* ---------- formulář ---------- */
.contact-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(2rem,1rem + 3.5vw,4rem);align-items:start}
.contact-side .mail{
  display:inline-flex;align-items:center;gap:.6rem;margin-top:1.5rem;
  font-size:clamp(1.05rem,.95rem + .8vw,1.45rem);font-weight:700;letter-spacing:-.02em;
  background:linear-gradient(115deg,var(--brand-2),var(--brand-3));
  -webkit-background-clip:text;background-clip:text;color:transparent;word-break:break-all;
}
.contact-side .mail svg{width:20px;height:20px;color:var(--brand-2);flex:none}
.contact-meta{margin-top:2rem;display:grid;gap:1rem}
.contact-meta li{display:flex;gap:.8rem;align-items:flex-start;font-size:.93rem;color:var(--muted)}
.contact-meta svg{width:18px;height:18px;color:var(--brand-2);flex:none;margin-top:.2rem}
.contact-meta b{color:var(--text);font-weight:620;display:block;font-size:.95rem}

form{
  padding:clamp(1.5rem,1.1rem + 1.4vw,2.25rem);
  border:1px solid var(--border);border-radius:var(--r-lg);
  background:var(--bg-soft);box-shadow:var(--shadow);
}
.f-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.f-full{grid-column:1/-1}
.field{display:flex;flex-direction:column;gap:.42rem;min-width:0}
label{font-size:.84rem;font-weight:620;letter-spacing:.01em}
label .req{color:var(--brand-3)}
label .hint{font-weight:450;color:var(--muted);font-size:.8rem}
input[type=text],input[type=email],input[type=tel],input[type=month],select,textarea{
  width:100%;padding:.72rem .85rem;font:inherit;font-size:.93rem;color:var(--text);
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-sm);
  transition:border-color .18s,box-shadow .18s,background .18s;
}
select{appearance:none;padding-inline-end:2.2rem;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239aa3b8' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .8rem center;background-size:15px;
}
textarea{resize:vertical;min-height:118px;line-height:1.6}
input::placeholder,textarea::placeholder{color:color-mix(in srgb,var(--muted) 75%,transparent)}
input:focus,select:focus,textarea:focus{
  outline:none;border-color:var(--brand);background:var(--surface-2);
  box-shadow:0 0 0 3px var(--ring);
}
input:user-invalid,textarea:user-invalid{border-color:#f87171}

fieldset{border:0;margin:0;padding:0;min-width:0}
legend{font-size:.84rem;font-weight:620;padding:0;margin-bottom:.55rem}
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chips-label{
  font-size:.75rem;font-weight:650;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);margin:.9rem 0 .5rem;
}
.chips-label:first-of-type{margin-top:.2rem}
.chip input{position:absolute;opacity:0;width:0;height:0}
.chip span{
  display:inline-block;padding:.5rem .85rem;border:1px solid var(--border);border-radius:999px;
  background:var(--surface);font-size:.855rem;font-weight:550;cursor:pointer;
  transition:all .18s;user-select:none;
}
.chip span:hover{border-color:var(--border-strong);background:var(--surface-2)}
.chip input:checked + span{
  border-color:transparent;color:#fff;
  background:linear-gradient(135deg,var(--brand),var(--brand-3));
  box-shadow:0 8px 18px -10px var(--brand);
}
.chip input:focus-visible + span{outline:2px solid var(--brand-2);outline-offset:2px}

.radios{display:flex;flex-wrap:wrap;gap:1.1rem}
.radios label,.check{display:flex;align-items:flex-start;gap:.5rem;font-size:.88rem;font-weight:500;cursor:pointer}
input[type=radio],input[type=checkbox]{
  accent-color:var(--brand);width:17px;height:17px;flex:none;margin:0;margin-top:.12rem;cursor:pointer;
}
.check small{display:block;color:var(--muted);font-size:.8rem;line-height:1.5}
.hp{position:absolute!important;left:-9999px;opacity:0;height:0;width:0}

.form-foot{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;margin-top:1.5rem}
.form-foot .note{font-size:.8rem;color:var(--muted);flex:1;min-width:200px}
.form-msg{
  margin-top:1.1rem;padding:.9rem 1.1rem;border-radius:var(--r-sm);font-size:.9rem;
  border:1px solid color-mix(in srgb,var(--ok) 40%,transparent);
  background:color-mix(in srgb,var(--ok) 12%,transparent);color:var(--text);
}
.form-msg[hidden]{display:none}

/* mockup poznámka */
.spec{
  margin-top:1.5rem;border:1px dashed var(--border-strong);border-radius:var(--r);
  background:var(--surface);padding:1.25rem 1.35rem;font-size:.86rem;color:var(--muted);
}
.spec b{color:var(--text)}
.spec code{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.82em;
  background:var(--surface-2);padding:.1rem .35rem;border-radius:5px;border:1px solid var(--border);
}
.spec ul{margin-top:.6rem;display:grid;gap:.3rem}
.spec li{padding-inline-start:1rem;position:relative}
.spec li::before{content:"–";position:absolute;inset-inline-start:0}

/* ---------- kontakt bez formuláře (index4.html) ---------- */
.contact-hero{max-width:60ch;margin-inline:auto;text-align:center}
.contact-hero .eyebrow::before{display:none}
.contact-hero .lead{margin-inline:auto}
.contact-cards .card{align-items:flex-start}
.contact-value{
  display:inline-block;margin:.15rem 0 .5rem;
  font-size:clamp(1.15rem,1rem + .9vw,1.55rem);font-weight:750;letter-spacing:-.03em;
  background:linear-gradient(115deg,var(--brand-2),var(--brand-3));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  word-break:break-word;
}
.contact-value:hover{filter:brightness(1.15)}
.contact-values{display:grid;gap:.1rem;justify-items:start;margin:.15rem 0 .5rem}
.contact-values .contact-value{margin:0}
.contact-value--sm{font-size:clamp(1rem,.95rem + .45vw,1.22rem)}
.contact-sub{color:var(--muted);font-size:.92rem}
.contact-address{
  font-style:normal;font-size:1rem;line-height:1.7;margin:.3rem 0 .6rem;
}
.contact-address b{font-weight:750;letter-spacing:-.01em}
.foot-address{
  font-style:normal;color:var(--muted);font-size:.86rem;line-height:1.55;
  margin-top:1.2rem;padding-top:1.2rem;border-top:1px solid var(--border);
  max-width:26ch;
}
.foot-address b{display:block;color:var(--text);font-weight:620;margin-bottom:.15rem}
.cta-note{font-size:.8rem;color:var(--muted);margin-top:1.5rem}

/* ---------- CTA pruh ---------- */
.cta-band{
  position:relative;overflow:hidden;text-align:center;
  border:1px solid var(--border);border-radius:var(--r-lg);
  padding:clamp(2.5rem,1.5rem + 4vw,4.5rem) 1.5rem;
  background:linear-gradient(150deg,color-mix(in srgb,var(--brand) 16%,transparent),transparent 55%),var(--bg-soft);
}
.cta-band h2{max-width:22ch;margin-inline:auto}
.cta-band p{max-width:56ch;margin:1rem auto 0;color:var(--muted)}
.cta-band .hero-cta{justify-content:center}

/* ---------- footer ---------- */
footer.site{border-top:1px solid var(--border);padding-block:3rem 2rem;background:var(--bg-soft)}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(4,minmax(0,1fr));gap:2rem}
.foot-grid h4{font-size:.78rem;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-bottom:.9rem;font-weight:650}
.foot-grid li{margin-bottom:.5rem}
.foot-grid a{font-size:.91rem;color:var(--muted);transition:color .18s}
.foot-grid a:hover{color:var(--text)}
.foot-grid > div:first-child p{color:var(--muted);font-size:.9rem;margin-top:.9rem;max-width:38ch}
.foot-bottom{
  display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;
  margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid var(--border);
  font-size:.83rem;color:var(--muted);
}

/* ---------- štíhlá varianta (index2.html) ---------- */
body.lean{--sp-section:clamp(3.5rem,2.5rem + 5vw,6rem)}
.lean .hero{padding-block:clamp(3rem,2rem + 7vw,6rem) var(--sp-section)}
.lean .section-head{margin-bottom:clamp(1.5rem,1rem + 2vw,2.5rem)}
.lean .card h3{margin-bottom:.45rem}
.lean .card > p{font-size:1rem}
.lean h1{font-size:clamp(2.6rem,1.3rem + 5.2vw,5rem)}
.lean .hero p.lead{font-size:1.2em;max-width:34ch}

/* jednořádkové vysvětlení role: „radí“ / „vede“ / „staví“ */
.role-verb{
  display:inline-block;margin-bottom:.6rem;
  font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--brand-2);
}

/* velké číslo u kroku procesu ve štíhlé variantě */
.lean .step p{font-size:.95rem}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(18px);transition:opacity .6s cubic-bezier(.2,.7,.3,1),transform .6s cubic-bezier(.2,.7,.3,1)}
.rv.in{opacity:1;transform:none}

/* ---------- responsive ---------- */
@media (max-width:960px){
  .hero-grid,.contact-grid{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  .step::after{display:none}
}
@media (max-width:760px){
  .burger{display:grid}
  .nav-links{
    position:fixed;inset:68px 0 auto;flex-direction:column;align-items:stretch;gap:.15rem;
    padding:1rem 1.25rem 1.75rem;background:var(--bg);border-bottom:1px solid var(--border);
    transform:translateY(-8px);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;
    max-height:calc(100dvh - 68px);overflow-y:auto;
  }
  .nav-links.open{transform:none;opacity:1;pointer-events:auto}
  .nav-links a{padding:.8rem .75rem;font-size:1rem}
  .nav-actions .btn{display:none}
  .f-grid{grid-template-columns:1fr}
  .stats b{font-size:1.28rem}
}
@media (max-width:420px){
  .btn{width:100%}
  .hero-cta{flex-direction:column}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
}

@media print{
  header.site,.glow,.grid-lines,.btn,.visual{display:none}
  body{background:#fff;color:#000}
}