/* FAQ pro prváky – otázky podél červené linie. Vzhled sdílí se zbytkem webu. */
:root{
  --bg:#171512; --surface:#211e1a; --surface-2:#2a2621; --border:#3a352d;
  --red:#d80000; --red-dark:#a30000; --red-pale:#3a1414; --red-hot:#ff3b30; --red-text:#ff6a5f;
  --ink:#f2ede6; --ink-soft:#c2b9ac; --radius:12px;
  --spine-x:50%; --p:0; --mx:0; --my:0;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{background:var(--surface); scroll-behavior:smooth}
html,body{overflow-x:hidden}
@supports (overflow:clip){html,body{overflow-x:clip}}
body{margin:0; min-height:100vh; background:var(--bg); color:var(--ink); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; line-height:1.6; overflow-x:hidden; -webkit-font-smoothing:antialiased}
a{color:var(--red-text)}
:focus-visible{outline:3px solid var(--red-hot); outline-offset:3px; border-radius:6px}
.skip{position:absolute; left:12px; top:-60px; z-index:100; background:var(--red); color:#fff; padding:12px 16px; border-radius:999px; font-weight:800; text-decoration:none}
.skip:focus{top:12px}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}

/* ---------- hlavička (stejná jako Porovnání / Vlastní rozvrh) ---------- */
header.top{position:relative; z-index:5; background:var(--surface); border-bottom:3px solid var(--red)}
.top-inner{max-width:1100px; margin:0 auto; padding:calc(18px + env(safe-area-inset-top,0px)) 16px 16px; display:flex; align-items:center; gap:16px; flex-wrap:wrap}
.top-inner img{height:46px; width:auto; display:block}
.logo-link{display:block; border-radius:8px; flex-shrink:0}
.top-text h1{font-size:1.3rem; margin:0; font-weight:800; letter-spacing:-.01em}
.top-text p{margin:2px 0 0; color:var(--ink-soft); font-size:.85rem}

/* ---------- živé pozadí ---------- */
.bg{position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden}
.bg-base{position:absolute; inset:0; background:radial-gradient(120% 80% at 50% 0%, #221d19 0%, var(--bg) 60%)}
.bg-glow{position:absolute; width:120vmax; height:120vmax; left:50%; top:50%; margin:-60vmax 0 0 -60vmax; border-radius:50%;
  background:radial-gradient(circle, rgba(216,0,0,.22) 0%, rgba(216,0,0,.06) 35%, transparent 65%);
  transform:translate3d(calc(var(--mx) * 30px), calc(-30vh + var(--glow-y,0) * 1vh), 0) scale(var(--glow-s,1)); opacity:var(--glow-o,.9);
  transition:opacity 1.2s ease, transform 1.2s cubic-bezier(.2,.7,.2,1)}
#dust{position:absolute; inset:0; width:100%; height:100%; opacity:.85}
.bg-vignette{position:absolute; inset:0; background:radial-gradient(130% 100% at 50% 50%, transparent 55%, rgba(0,0,0,.55) 100%)}
body[data-mood="soukromi"]{--glow-o:.45; --glow-s:.8}
body[data-mood="roste"]{--glow-o:1; --glow-s:1.25}
body[data-mood="dik"],body[data-mood="napis"]{--glow-o:.8; --glow-s:1.05}

main{position:relative; z-index:1}

/* ---------- hero ---------- */
.hero{position:relative; min-height:calc(100svh - 80px); display:grid; align-items:center; padding:48px 16px 120px; max-width:1100px; margin:0 auto; overflow:hidden}
.hero-copy{position:relative; z-index:2; max-width:760px}
.hero-kicker{display:inline-flex; align-items:center; gap:8px; margin:0 0 18px; padding:6px 14px 6px 10px; border:1px solid var(--border); border-radius:999px; background:rgba(33,30,26,.7); color:var(--ink-soft); font-size:.85rem; font-weight:700; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px)}
.hero-kicker .dot{width:8px; height:8px; border-radius:50%; background:var(--red-hot); box-shadow:0 0 12px var(--red-hot)}
.hero h2{margin:0; white-space:nowrap; font-size:clamp(3rem, 13.5vw, 7rem); line-height:.92; font-weight:900; letter-spacing:-.045em}
.hero h2 .ch{display:inline-block}
.hero-slogan{margin:18px 0 0; font-size:clamp(1.15rem, 4.6vw, 1.6rem); font-weight:800; letter-spacing:-.01em}
.hero-slogan .red{color:var(--red-text)}
.hero-lead{margin:14px 0 0; max-width:34em; color:var(--ink-soft); font-size:1.02rem}
.hero-cta{display:flex; flex-wrap:wrap; gap:10px; margin-top:26px}
.btn{position:relative; display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:48px; padding:12px 22px; border-radius:999px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink); font:inherit; font-weight:800; font-size:.95rem; text-decoration:none; cursor:pointer; transition:border-color .2s, background .2s, transform .25s cubic-bezier(.2,.7,.2,1)}
.btn:hover{border-color:var(--red)}
.btn.primary{background:var(--red); border-color:var(--red); color:#fff; box-shadow:0 8px 28px rgba(216,0,0,.35)}
.btn.primary:hover{background:#e80c0c}
.btn[disabled]{opacity:.6; cursor:default}

/* 3D rozvrhová mřížka */
.grid3d{position:absolute; z-index:1; right:-12%; top:50%; width:min(78vw, 620px); aspect-ratio:1; margin-top:calc(min(78vw, 620px) / -2); perspective:1100px; pointer-events:none; opacity:.95}
.g-plane{position:absolute; inset:0; transform-style:preserve-3d;
  transform:rotateX(calc(58deg + var(--my) * -6deg + var(--p) * 18deg)) rotateZ(calc(-34deg + var(--mx) * 8deg + var(--p) * 40deg)) translateZ(calc(var(--p) * -160px));
  transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.g-floor{position:absolute; inset:0; display:grid; grid-template-columns:repeat(5,1fr); grid-template-rows:repeat(6,1fr); gap:6px; transform-style:preserve-3d}
.g-cell{border:1px solid rgba(194,185,172,.13); border-radius:6px; background:rgba(33,30,26,.35); transform-style:preserve-3d; position:relative}
.g-day{position:absolute; top:-26px; left:0; right:0; text-align:center; font-size:.8rem; font-weight:800; color:var(--ink-soft); opacity:.7}
.g-block{position:absolute; inset:2px; border-radius:6px; transform-style:preserve-3d; transform:translateZ(var(--z,28px)); background:linear-gradient(140deg, var(--red-hot), var(--red-dark)); box-shadow:0 0 22px rgba(255,59,48,.35)}
.g-block::before,.g-block::after{content:""; position:absolute; background:#7a0000; border-radius:4px}
.g-block::before{left:0; right:0; bottom:0; height:var(--z,28px); transform-origin:bottom; transform:rotateX(90deg)}
.g-block::after{top:0; bottom:0; right:0; width:var(--z,28px); transform-origin:right; transform:rotateY(-90deg); background:#5e0000}
.g-block.cv{background:linear-gradient(140deg, #4a443c, #2f2a24); box-shadow:none}
.g-block.cv::before{background:#24201b}.g-block.cv::after{background:#1b1814}
.js .g-block{opacity:0; transform:translateZ(240px)}
.js .ready .g-block{opacity:1; transform:translateZ(var(--z,28px)); transition:transform .9s cubic-bezier(.2,1.2,.3,1) var(--d,0s), opacity .5s ease var(--d,0s)}

.scroll-cue{position:absolute; left:50%; bottom:20px; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:8px; color:var(--ink-soft); font-size:.8rem; font-weight:700; text-decoration:none; min-height:44px; z-index:2}
.scroll-cue i{display:block; width:2px; height:46px; border-radius:2px; background:linear-gradient(var(--red-hot), transparent); animation:cue 1.8s ease-in-out infinite}
@keyframes cue{0%{transform:scaleY(.2); transform-origin:top; opacity:.4} 50%{transform:scaleY(1); transform-origin:top; opacity:1} 100%{transform:scaleY(1); transform-origin:bottom; opacity:0}}

/* ---------- příběh a červená linie ---------- */
.story{position:relative; max-width:1100px; margin:0 auto; padding:20px 16px 40px; --spine-x:22px}
.spine{position:absolute; top:0; height:100%; left:calc(16px + var(--spine-x)); width:2px; margin-left:-1px; pointer-events:none}
.spine-track{position:absolute; inset:0; background:linear-gradient(transparent, rgba(194,185,172,.14) 4%, rgba(194,185,172,.14) 96%, transparent); border-radius:2px}
.spine-fill{position:absolute; left:0; right:0; top:0; height:100%; transform-origin:top; transform:scaleY(var(--fill,0)); background:linear-gradient(var(--red-hot), var(--red) 70%, var(--red-hot)); border-radius:2px}
.spine-glow{position:absolute; left:-6px; right:-6px; top:0; height:100%; transform-origin:top; transform:scaleY(var(--fill,0)); background:linear-gradient(rgba(255,59,48,.55), rgba(216,0,0,.35)); filter:blur(7px); opacity:var(--spine-o,.9); transition:opacity 1s ease}
.spine-head{position:absolute; left:50%; top:0; width:14px; height:14px; margin:-7px 0 0 -7px; border-radius:50%; background:#fff; box-shadow:0 0 0 4px rgba(255,59,48,.45), 0 0 26px 6px var(--red-hot); transform:translate3d(0, var(--head,0px), 0); opacity:var(--head-o,0)}
body[data-mood="soukromi"]{--spine-o:.35}
body[data-mood="roste"]{--spine-o:1}

.chapter{position:relative; padding:56px 0 8px}
.ch-head{position:relative; padding-left:calc(var(--spine-x) + 28px); margin:0 0 22px}
.ch-head h2{margin:0; font-size:clamp(1.9rem, 7.4vw, 3.2rem); line-height:1.02; font-weight:900; letter-spacing:-.03em}
.ch-head p{margin:10px 0 0; max-width:36em; color:var(--ink-soft); font-size:1.02rem}

.node{position:absolute; left:var(--spine-x); top:var(--nt,28px); width:18px; height:18px; margin-left:-9px; border-radius:50%; background:var(--bg); border:2px solid #5a524a; transition:border-color .5s, background .5s, box-shadow .5s, transform .5s cubic-bezier(.2,1.4,.3,1); z-index:2}
.node.big{width:26px; height:26px; margin-left:-13px}
.node.on{border-color:var(--red-hot); background:var(--red); box-shadow:0 0 0 6px rgba(255,59,48,.16), 0 0 24px 4px rgba(255,59,48,.55); transform:scale(1.08)}
.node.on::after{content:""; position:absolute; inset:-8px; border-radius:50%; border:2px solid rgba(255,59,48,.6); animation:ping 2.4s ease-out infinite}
@keyframes ping{0%{transform:scale(.6); opacity:.9} 100%{transform:scale(1.9); opacity:0}}

.item{position:relative; padding-left:calc(var(--spine-x) + 28px); margin:0 0 26px}
.item .node{--nt:30px}
.item .link{position:absolute; left:var(--spine-x); top:38px; width:28px; height:2px; background:linear-gradient(90deg, var(--red), transparent); transform-origin:left; transform:scaleX(0); transition:transform .6s ease .1s}
.item.on .link{transform:scaleX(1)}
.card{position:relative; background:linear-gradient(180deg, #29251f, #211e1a); border:1px solid var(--border); border-radius:18px; padding:20px; box-shadow:0 10px 40px rgba(0,0,0,.35); transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.card h3{margin:0 0 6px; font-size:1.2rem; line-height:1.25; font-weight:800; letter-spacing:-.01em}
.card p{margin:6px 0; color:var(--ink-soft)}
.card p b,.card li b{color:var(--ink)}
.card ul{margin:8px 0 0; padding-left:20px; color:var(--ink-soft)}
.card li{margin:5px 0}
.card .sheen{position:absolute; inset:0; border-radius:inherit; pointer-events:none; background:radial-gradient(260px circle at var(--sx,50%) var(--sy,0%), rgba(255,255,255,.07), transparent 60%); opacity:0; transition:opacity .3s}
.card:hover .sheen{opacity:1}

/* odhalení při scrollu (jen s JS, bez JS je vše vidět) */
.js .rv{opacity:0; transform:translate3d(var(--rx,0), 28px, 0); transition:opacity .8s ease, transform .9s cubic-bezier(.2,.7,.2,1)}
.js .rv.in{opacity:1; transform:none}

/* ---------- vznik: časová osa ---------- */
.steps{list-style:none; margin:14px 0 0; padding:0; display:grid; gap:12px}
.steps li{position:relative; padding:12px 14px 12px 44px; border-radius:14px; background:rgba(23,21,18,.6); border:1px solid var(--border); color:var(--ink-soft)}
.steps li b{display:block; color:var(--ink); margin-bottom:2px}
.steps li::before{content:""; position:absolute; left:16px; top:18px; width:12px; height:12px; border-radius:50%; border:2px solid var(--red-hot); background:var(--bg)}
.steps li:not(:last-child)::after{content:""; position:absolute; left:21px; top:32px; bottom:-14px; width:2px; background:linear-gradient(var(--red), rgba(216,0,0,.15))}
.js .steps li{opacity:0; transform:translateX(-10px); transition:opacity .5s ease, transform .6s cubic-bezier(.2,.7,.2,1)}
.js .on .steps li{opacity:1; transform:none}
.js .on .steps li:nth-child(2){transition-delay:.15s}.js .on .steps li:nth-child(3){transition-delay:.3s}.js .on .steps li:nth-child(4){transition-delay:.45s}.js .on .steps li:nth-child(5){transition-delay:.6s}

/* ---------- mini ukázky funkcí ---------- */
.demo{margin:14px 0 4px; padding:12px; border-radius:14px; background:rgba(23,21,18,.75); border:1px solid var(--border); overflow:hidden}
.wk{display:grid; grid-template-columns:repeat(5,1fr); gap:5px}
.wk span{height:22px; border-radius:6px; background:rgba(194,185,172,.08); transition:background .4s, transform .5s cubic-bezier(.2,1.4,.3,1), box-shadow .4s}
.wk span.l{background:linear-gradient(140deg, var(--red-hot), var(--red-dark)); box-shadow:0 0 12px rgba(255,59,48,.3)}
.wk span.s{background:#5a524a}
.wk span.f{background:#e0b155}
.wk span.x{background:#ff9a3c; animation:shake .45s ease 2}
@keyframes shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
.wk-days{display:grid; grid-template-columns:repeat(5,1fr); gap:5px; margin-bottom:6px; font-size:.72rem; font-weight:800; color:var(--ink-soft); text-align:center}
.chips{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px}
.chip{display:inline-flex; align-items:center; justify-content:center; min-width:30px; height:30px; padding:0 9px; border-radius:999px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink-soft); font-size:.8rem; font-weight:800; transition:background .3s, color .3s, border-color .3s, transform .3s}
.chip.on{background:var(--red); border-color:var(--red); color:#fff; transform:scale(1.08)}
.legend{display:flex; flex-wrap:wrap; gap:12px; margin-top:8px; font-size:.75rem; color:var(--ink-soft)}
.legend i{display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:5px; vertical-align:-1px}
.toggle{display:inline-grid; grid-template-columns:1fr 1fr; position:relative; margin-bottom:10px; border:1px solid var(--border); border-radius:999px; background:var(--surface-2); padding:3px}
.toggle button{position:relative; z-index:1; min-height:44px; min-width:96px; padding:0 14px; border:0; background:transparent; color:var(--ink-soft); font:inherit; font-weight:800; font-size:.85rem; border-radius:999px; cursor:pointer; transition:color .3s}
.toggle button[aria-pressed="true"]{color:#fff}
.toggle .knob{position:absolute; top:3px; bottom:3px; left:3px; width:calc(50% - 3px); border-radius:999px; background:var(--red); box-shadow:0 4px 16px rgba(216,0,0,.4); transition:transform .45s cubic-bezier(.3,1.4,.4,1)}
.toggle[data-w="sudy"] .knob{transform:translateX(100%)}
.icons{display:grid; grid-template-columns:repeat(4,1fr); gap:8px}
.icons div{display:flex; flex-direction:column; align-items:center; gap:6px; padding:12px 4px; border-radius:12px; background:var(--surface-2); border:1px solid var(--border); font-size:.72rem; font-weight:700; color:var(--ink-soft); text-align:center}
.icons div span{font-size:1.4rem; line-height:1}
.js .icons div{opacity:0; transform:translateY(12px) scale(.9); transition:opacity .4s, transform .5s cubic-bezier(.2,1.5,.3,1)}
.js .on .icons div{opacity:1; transform:none}
.js .on .icons div:nth-child(2){transition-delay:.1s}.js .on .icons div:nth-child(3){transition-delay:.2s}.js .on .icons div:nth-child(4){transition-delay:.3s}
.marquee{overflow:hidden; -webkit-mask-image:linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image:linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent)}
.marquee .track{display:flex; gap:8px; width:max-content; animation:mq 16s linear infinite; animation-play-state:paused}
.on .marquee .track{animation-play-state:running}
.marquee .chip{height:38px; padding:0 16px; font-size:.9rem; color:var(--ink)}
@keyframes mq{to{transform:translateX(-50%)}}

/* rozdvojení linie: lichý / sudý */
.fork{position:absolute; left:calc(var(--spine-x) - 22px); top:0; width:44px; height:100%; overflow:visible; pointer-events:none}
.fork path{fill:none; stroke-width:2; stroke-linecap:round}
.fork .a{stroke:var(--red-hot)}.fork .b{stroke:#8f857a}
.js .fork path{stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset 1.4s cubic-bezier(.4,0,.2,1)}
.js .on .fork path{stroke-dashoffset:0}

/* ---------- soukromí ---------- */
.priv{display:grid; gap:14px}
.priv .card{border-color:#3d3730}
.priv .ic{display:inline-flex; width:40px; height:40px; align-items:center; justify-content:center; border-radius:12px; background:var(--surface-2); border:1px solid var(--border); font-size:1.2rem; margin-bottom:10px}
.pill{display:inline-block; margin:2px 0 6px; padding:3px 10px; border-radius:999px; font-size:.75rem; font-weight:800; background:var(--red-pale); color:#ffd3d3; border:1px solid rgba(216,0,0,.5)}
.small{font-size:.85rem; color:var(--ink-soft)}
code{background:var(--surface-2); padding:1px 6px; border-radius:6px; font-size:.86em; color:var(--ink)}

/* ---------- roste: čísla ---------- */
.nums{display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin:14px 0 4px}
.num{padding:16px 12px; border-radius:14px; background:rgba(23,21,18,.7); border:1px solid var(--border); text-align:center}
.num b{display:block; white-space:nowrap; font-size:clamp(2rem, 9vw, 2.8rem); line-height:1; font-weight:900; letter-spacing:-.03em; color:#fff; font-variant-numeric:tabular-nums}
.num span{display:block; margin-top:6px; font-size:.8rem; color:var(--ink-soft); font-weight:700}

/* ---------- poděkování ---------- */
.thanks{position:relative; margin:30px 0 0; padding:40px 0 20px calc(var(--spine-x) + 28px)}
.thanks blockquote{margin:0; font-size:clamp(1.45rem, 5.8vw, 2.4rem); line-height:1.22; font-weight:800; letter-spacing:-.02em}
.thanks blockquote .w{display:inline-block}
.js .thanks blockquote .w{opacity:.14; transition:opacity .5s ease}
.js .thanks blockquote .w.lit{opacity:1}
.thanks cite{display:block; margin-top:16px; font-style:normal; color:var(--ink-soft); font-weight:700}

/* ---------- formulář ---------- */
.write{position:relative; padding:40px 0 10px calc(var(--spine-x) + 28px)}
.ring{position:absolute; left:var(--spine-x); top:52px; width:48px; height:48px; margin-left:-24px; z-index:2; overflow:visible; filter:drop-shadow(0 0 8px rgba(255,59,48,.6))}
.ring circle{fill:var(--bg); stroke:var(--red-hot); stroke-width:2.5; stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset 1.2s ease}
.write.on .ring circle,.no-js-ring circle{stroke-dashoffset:0}
.ring text{fill:#fff; font-size:20px; text-anchor:middle; dominant-baseline:central}
.form-card{max-width:620px}
.form-card label{display:block; margin:14px 0 6px; font-weight:800; font-size:.92rem}
.form-card label small{font-weight:600; color:var(--ink-soft)}
.form-card textarea,.form-card input[type=text]{width:100%; font:inherit; font-size:16px; color:var(--ink); background:var(--bg); border:1px solid var(--border); border-radius:12px; padding:12px 14px; transition:border-color .2s, box-shadow .2s}
.form-card textarea{min-height:140px; resize:vertical}
.form-card textarea:focus,.form-card input[type=text]:focus{outline:none; border-color:var(--red-hot); box-shadow:0 0 0 3px rgba(255,59,48,.22)}
.form-row{display:flex; justify-content:space-between; gap:10px; margin-top:6px; font-size:.78rem; color:var(--ink-soft)}
.hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.f-err{display:none; margin:12px 0 0; padding:10px 12px; border-radius:10px; background:var(--red-pale); border:1px solid rgba(216,0,0,.6); color:#ffd3d3; font-size:.9rem}
.f-actions{display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:16px}
.f-note{font-size:.8rem; color:var(--ink-soft); margin:0}
.f-ok{display:none; text-align:center; padding:26px 10px}
.f-ok.show{display:block}
.f-ok .check{width:72px; height:72px; margin:0 auto 10px}
.f-ok .check circle{fill:none; stroke:var(--red-hot); stroke-width:3}
.f-ok .check path{fill:none; stroke:#fff; stroke-width:4; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:40; stroke-dashoffset:40; animation:draw .6s ease .25s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.f-ok h3{margin:0 0 6px; font-size:1.4rem}
.f-ok p{margin:0; color:var(--ink-soft)}

/* ---------- patička (stejná jako na webu) ---------- */
.site-footer{position:relative; z-index:1; margin:44px auto 0; padding:26px 16px calc(34px + env(safe-area-inset-bottom,0px)); border-top:1px solid var(--border); text-align:center; max-width:560px}
.sf-brand{font-size:1.02rem; font-weight:800; letter-spacing:.01em; color:var(--ink)}
.sf-brand b{color:#d80000}
.sf-tag{font-size:.82rem; color:var(--ink-soft); margin-top:2px}
.sf-links{display:grid; grid-template-columns:1fr 1fr; gap:10px; max-width:420px; margin:16px auto 14px}
.sf-links > :last-child:nth-child(odd){grid-column:1 / -1}
.sf-pill{min-height:44px; display:flex; justify-content:center; align-items:center; gap:6px; padding:9px 15px; border-radius:999px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink); font-family:inherit; font-size:.8rem; font-weight:700; text-decoration:none; cursor:pointer; line-height:1}
.sf-pill:hover{border-color:var(--red); color:var(--red)}
.sf-note{font-size:.72rem; line-height:1.55; color:var(--ink-soft); opacity:.85; max-width:420px; margin:0 auto}

/* ---------- kurzor (jen myš) ---------- */
.cursor{position:fixed; left:0; top:0; z-index:60; width:34px; height:34px; margin:-17px 0 0 -17px; border-radius:50%; border:1.5px solid rgba(255,59,48,.75); pointer-events:none; transform:translate3d(-100px,-100px,0); transition:width .25s, height .25s, margin .25s, background .25s, border-color .25s; display:none}
.cursor.big{width:58px; height:58px; margin:-29px 0 0 -29px; background:rgba(255,59,48,.08)}
@media (pointer:fine){ .fx .cursor{display:block} }

/* ---------- desktop: linie uprostřed, karty střídavě ---------- */

@media (max-width:520px){
  .grid3d{right:-38%; top:28%; opacity:.55}
  .icons{grid-template-columns:repeat(2,1fr)}
}

/* ---------- omezený pohyb: vše vidět a v klidu ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none !important; transition:none !important}
  .js .rv,.js .steps li,.js .icons div,.js .g-block{opacity:1 !important; transform:none !important}
  .js .g-block{transform:translateZ(var(--z,28px)) !important}
  .js .thanks blockquote .w{opacity:1}
  .js .fork path,.ring circle{stroke-dashoffset:0 !important}
  .spine-fill,.spine-glow{transform:none !important}
  .spine-head,#dust,.cursor{display:none !important}
  .g-plane{transform:rotateX(58deg) rotateZ(-34deg) !important}
}

/* nadpis po písmenech */
.js .split .ch{opacity:0; transform:translate3d(0,.45em,0) rotate(8deg); transition:opacity .6s ease var(--d,0s), transform .9s cubic-bezier(.2,1.3,.3,1) var(--d,0s)}
.js .split.go .ch{opacity:1; transform:none}
.js .hero-kicker,.js .hero-slogan,.js .hero-lead,.js .hero-cta{opacity:0; transform:translateY(14px); transition:opacity .45s ease, transform .55s cubic-bezier(.2,.7,.2,1)}
.js .go-hero .hero-kicker{opacity:1; transform:none}
.js .go-hero .hero-slogan{opacity:1; transform:none; transition-delay:.15s}      /* text hned, hledání nemá čekat na animaci */
.js .go-hero .hero-lead{opacity:1; transform:none; transition-delay:.25s}
.js .go-hero .hero-cta{opacity:1; transform:none; transition-delay:.35s}
@media (prefers-reduced-motion:reduce){ .js .split .ch,.js .hero-kicker,.js .hero-slogan,.js .hero-lead,.js .hero-cta{opacity:1 !important; transform:none !important} }
.priv > :last-child:nth-child(odd){grid-column:1 / -1}

/* ---------- FAQ ---------- */
.hero.faq-hero{min-height:auto; padding:56px 16px 90px}
@media (max-width:600px){ .hero.faq-hero{padding:24px 16px 40px} .hero.faq-hero h2{font-size:2.3rem} .faq-hero .hero-kicker{margin-bottom:12px} .faq-hero .hero-slogan{margin-top:10px; font-size:1.05rem} .faq-hero .hero-lead{display:none} }      /* na telefonu ať je hledání hned v první obrazovce */
.faq-hero h2{font-size:clamp(2.4rem, 11vw, 6rem); white-space:normal; text-wrap:balance}
.search{position:relative; margin-top:24px; max-width:520px}
.search input{width:100%; min-height:52px; padding:0 18px 0 46px; font:inherit; font-size:16px; color:var(--ink); background:rgba(23,21,18,.85); border:1px solid var(--border); border-radius:999px; -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px)}
.search input:focus{outline:none; border-color:var(--red-hot); box-shadow:0 0 0 3px rgba(255,59,48,.22)}
.search svg{position:absolute; z-index:1; left:17px; top:50%; width:18px; height:18px; margin-top:-9px; stroke:var(--ink-soft); fill:none; stroke-width:2}
.faq-tools{display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:12px; font-size:.85rem; color:var(--ink-soft)}
.linkbtn{min-height:44px; padding:0 4px; border:0; background:none; color:var(--red-text); font:inherit; font-weight:800; cursor:pointer}
.toc{display:flex; flex-wrap:wrap; gap:8px; margin-top:18px}
.toc a{display:inline-flex; align-items:center; min-height:40px; padding:0 14px; border-radius:999px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink); font-size:.85rem; font-weight:700; text-decoration:none}
.toc a:hover{border-color:var(--red)}
.faq .item{margin-bottom:12px}
.faq .item .node{--nt:26px}
.faq .item .link{top:34px}
details.qa{padding:0}
details.qa summary{list-style:none; cursor:pointer; display:flex; align-items:center; gap:14px; min-height:56px; padding:16px 18px; border-radius:18px}
details.qa summary::-webkit-details-marker{display:none}
details.qa summary h3{margin:0; flex:1; font-size:1.05rem}
details.qa summary:focus-visible{outline:3px solid var(--red-hot); outline-offset:2px}
.chev{flex:none; width:30px; height:30px; border-radius:50%; border:1px solid var(--border); display:grid; place-items:center; transition:transform .35s cubic-bezier(.2,1.3,.3,1), background .3s, border-color .3s}
.chev::before{content:""; width:8px; height:8px; border-right:2px solid var(--ink-soft); border-bottom:2px solid var(--ink-soft); transform:translateY(-2px) rotate(45deg)}
details[open] .chev{transform:rotate(180deg); background:var(--red); border-color:var(--red)}
details[open] .chev::before{border-color:#fff}
.qa-body{padding:0 18px 16px; color:var(--ink-soft)}
.qa-body p,.qa-body ul{margin:0 0 10px}
.qa-body ul{padding-left:20px}
.qa-body li{margin:4px 0}
.qa-body b{color:var(--ink)}
details[open] .qa-body{animation:qaIn .35s ease}
@keyframes qaIn{from{opacity:0; transform:translateY(-6px)}to{opacity:1; transform:none}}
.qa .copy-link{min-height:36px; padding:0 12px; border-radius:999px; border:1px solid var(--border); background:transparent; color:var(--ink-soft); font:inherit; font-size:.78rem; font-weight:700; cursor:pointer}
.no-hit{display:none; padding:18px; border:1px dashed var(--border); border-radius:16px; color:var(--ink-soft); margin-left:calc(var(--spine-x) + 28px)}
.no-hit.show{display:block}
.faq mark{background:rgba(255,59,48,.28); color:inherit; border-radius:3px; padding:0 1px}
.write{padding-top:40px}
@media (min-width:860px){
  .faq .story{max-width:860px; --spine-x:30px}
  .faq .ch-head h2{font-size:2.4rem}
  .grid3d{right:-6%}
}
@media (prefers-reduced-motion:reduce){ details[open] .qa-body{animation:none} }

/* FAQ bez červené linie: jen rozbalovací otázky */
.faq .spine{display:none}
.faq .item,.faq .ch-head,.faq .write,.faq .no-hit{padding-left:0; margin-left:0}
.faq .chapter{padding-top:44px}
.faq .write{padding-top:48px}

/* hlavička jako v oborech */
.faq header.top{background:var(--surface); background-image:linear-gradient(180deg, var(--surface) 0%, var(--surface) 92%, var(--red-pale) 100%); border-bottom:3px solid var(--red)}
.faq .top-inner{max-width:1180px}
.faq .logo-link{transition:.15s}
.faq .logo-link:hover{opacity:.8; outline:2px solid var(--red); outline-offset:3px}
.faq .top-text h1{font-size:1.4rem}
.faq .top-text p.obor{font-weight:600; color:#d80000}