/* ==========================================================================
   jiskro — REDESIGN vrstva (additivní, nedestruktivní)
   Načítá se PO styles.css. Přidává 3 společné fixy (seed chipy, skládání
   návrhu, český trust slot) + přepínatelné vizuální SMĚRY přes [data-dir].
   Editorial = žádný token override (= současný web beze změny).
   Bento / Brutalist = plný override tokenů + layoutu.
   ========================================================================== */

:root{
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}

/* ---------- direction switch (v hlavičce) ---------- */
.dirswitch{display:inline-flex;gap:2px;padding:3px;border:1px solid var(--line-2);border-radius:var(--r-pill);background:var(--surface-2)}
.dirswitch .ds{width:30px;height:30px;border:0;border-radius:var(--r-pill);background:transparent;color:var(--muted);
  font-family:var(--font-display);font-weight:700;font-size:.86rem;cursor:pointer;transition:.15s var(--ease)}
.dirswitch .ds:hover{color:var(--ink)}
.dirswitch .ds.on{background:var(--spark);color:var(--spark-ink);box-shadow:var(--shadow-spark)}
.dirswitch .ds:focus-visible{outline:2px solid var(--spark);outline-offset:2px}
/* dev-only: přepínač je skrytý pro koncové uživatele; odhalí se přes jiskro.cz/?dev */
.dirswitch{display:none}
.dirswitch.dev-on{display:inline-flex}
@media(max-width:520px){.dirswitch.dev-on{display:none}}

/* ---------- seed chipy (killer prázdného pole) ---------- */
.seedlabel{margin:14px 0 8px;font-size:var(--step--1);letter-spacing:.1em;text-transform:uppercase;color:var(--faint);font-weight:600}
.seedchips{display:flex;gap:8px;overflow-x:auto;padding-bottom:5px;scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
.seedchip{flex:0 0 auto;cursor:pointer;font:inherit;font-size:.85rem;white-space:nowrap;color:var(--ink);
  background:var(--surface-2);border:1.5px solid var(--line-2);border-radius:var(--r-pill);padding:8px 14px;
  display:inline-flex;align-items:center;gap:8px;transition:.16s var(--ease)}
.seedchip i{width:9px;height:9px;border-radius:50%;background:var(--cc,var(--spark));flex:0 0 auto}
.seedchip small{color:var(--muted)}
.seedchip:hover{transform:translateY(-2px);border-color:var(--cc,var(--spark))}
.seedchip.on{border-color:var(--spark);background:color-mix(in srgb,var(--spark) 12%,var(--surface-2));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--spark) 20%,transparent)}

/* ---------- risk-reducer pod CTA ---------- */
.cta-sub{text-align:center;margin-top:10px;font-size:var(--step--1);color:var(--faint)}
.cta-sub .spark-text{color:var(--spark)}
.cta-band-sub{margin:16px auto 0;font-size:var(--step--1);opacity:.9;font-weight:500}

/* ---------- ghost: progress + skládání ---------- */
.ghost-bar{position:relative}
.ghost-prog{position:absolute;left:0;bottom:-1px;height:2px;width:0;border-radius:2px;
  background:linear-gradient(90deg,var(--spark),var(--spark-2));box-shadow:0 0 12px var(--spark)}
.build-note{margin-top:14px;text-align:center;font-size:var(--step-0);color:var(--muted);min-height:1.3em}
.build-note b{color:var(--spark);font-weight:600}
/* stav "skládání" — lišty vyjedou z nuly */
.ghost.building .ghost-h,.ghost.building .ghost-l,.ghost.building .ghost-chip{width:0!important}
.ghost .ghost-h,.ghost .ghost-l,.ghost .ghost-chip{transition:width .55s var(--ease)}

/* ---------- honest-broker věta ---------- */
.honest{max-width:760px;margin:var(--sp-l) auto 0;padding:18px 22px;border-left:3px solid var(--spark);
  background:var(--surface);border-radius:0 var(--r) var(--r) 0;color:var(--muted);font-size:var(--step-0);line-height:1.55}
.honest b{color:var(--ink);font-weight:600}

/* ---------- číslované meta-štítky (editorial páteř) ---------- */
.step-ml,.card-ml{display:block;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);font-weight:600}
.step-ml{margin:8px 0 2px}
.card-ml{margin-bottom:6px;color:var(--spark)}

/* ---------- cena / jak to funguje ---------- */
.price-band{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(22px,4vw,48px);align-items:center;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);padding:clamp(26px,4vw,44px);box-shadow:var(--shadow)}
@media(max-width:760px){.price-band{grid-template-columns:1fr}}
.price-lead h2{font-size:var(--step-3);margin:12px 0 12px}
.price-list{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.price-list li{display:flex;gap:12px;align-items:flex-start;font-size:var(--step-0);color:var(--muted);line-height:1.5}
.price-list li b{color:var(--ink);font-weight:600}
.price-list .pi{flex:0 0 auto;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-weight:700;
  font-size:.8rem;color:var(--spark-ink);background:var(--spark);margin-top:1px}

/* ---------- testimonial ---------- */
.testimonial{max-width:760px;margin:var(--sp-xl) auto 0;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-xl);padding:clamp(24px,4vw,38px);box-shadow:var(--shadow);text-align:center}
.testimonial blockquote{margin:0;font-family:var(--font-display);font-size:var(--step-2);line-height:1.35;letter-spacing:-.02em}
.testimonial figcaption{display:inline-flex;align-items:center;gap:12px;margin-top:22px}
.testimonial .t-ava{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-weight:700;
  background:color-mix(in srgb,var(--spark) 16%,transparent);color:var(--spark);border:1px solid color-mix(in srgb,var(--spark) 34%,transparent)}
.testimonial figcaption>span:last-child{display:flex;flex-direction:column;text-align:left}
.testimonial figcaption b{font-weight:600}
.testimonial figcaption small{color:var(--faint);font-size:.8rem}

/* ---------- footer: tracked wordmark + stamp ---------- */
.ft-mark{letter-spacing:.42em;text-transform:uppercase;font-family:var(--font-display);font-weight:600}
.ft-stamp{color:var(--faint);font-variant-numeric:tabular-nums}

/* ============================================================
   SMĚR A — EDITORIAL (default): jen jemná polish, žádný token override
   ============================================================ */
:root[data-dir="editorial"] .hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  opacity:.5;background-image:var(--grain);background-size:160px;mix-blend-mode:overlay}

/* ============================================================
   SMĚR B — TEPLÁ DLAŽDICE (světlá slonovina + bento)
   ============================================================ */
:root[data-dir="bento"]{
  color-scheme:light;
  --spark:#FF5B1E; --spark-2:#FF9500; --spark-ink:#FFFFFF;
  --ink:#1A1712; --muted:#6A6459; --faint:#9A9284;
  --bg:#FBF7F2; --surface:#FFFFFF; --surface-2:#F4EEE6;
  --line:#EDE6DC; --line-2:#E2D9CC;
  --glass:rgba(255,251,246,.74);
  --shadow:0 8px 22px rgba(60,45,25,.09); --shadow-lg:0 18px 44px rgba(60,45,25,.13);
  --shadow-spark:0 10px 30px rgba(255,91,30,.26);
  --r:16px; --r-lg:22px; --r-xl:30px;
}
:root[data-dir="bento"] .theme-toggle .sun{display:block}
:root[data-dir="bento"] .theme-toggle .moon{display:none}
/* bílé dlaždice plují na slonovině + měkký stín = bento hloubka */
:root[data-dir="bento"] .ghost,
:root[data-dir="bento"] .starter,
:root[data-dir="bento"] .tcard,
:root[data-dir="bento"] .show-card,
:root[data-dir="bento"] .port-card,
:root[data-dir="bento"] .price-band,
:root[data-dir="bento"] .testimonial{box-shadow:var(--shadow-lg)}
:root[data-dir="bento"] .show-prev{background:
  radial-gradient(90% 90% at 20% 0,color-mix(in srgb,var(--sc) 22%,transparent),transparent 60%),var(--surface-2)}
:root[data-dir="bento"] .hero::before{background:
  radial-gradient(90% 70% at 26% -8%,color-mix(in srgb,var(--spark) 13%,transparent),transparent 62%)}
/* proof jako řádek dlaždic */
:root[data-dir="bento"] .proof-main{gap:12px}
:root[data-dir="bento"] .proof-main span{background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);padding:12px 18px;box-shadow:var(--shadow)}

/* ============================================================
   SMĚR C — REFINED BRUTALIST KINETIC (tmavý, vysoký kontrast, obří typo)
   ============================================================ */
:root[data-dir="brutalist"]{
  color-scheme:dark;
  --ink:#FBFBFE; --muted:#BDBBCC; --faint:#807e90;
  --bg:#070709; --surface:#111119; --surface-2:#181820;
  --line:rgba(255,255,255,.14); --line-2:rgba(255,255,255,.22);
  --glass:rgba(9,9,13,.66);
}
/* obří kinetické slovo dominuje heru */
:root[data-dir="brutalist"] .kine-word{font-size:clamp(3.2rem,1.4rem + 11vw,7rem);letter-spacing:-.045em;font-weight:700}
:root[data-dir="brutalist"] .hero h1{font-size:var(--step-6);letter-spacing:-.04em}
/* viditelná baseline mřížka za herem = refined-brutalist rigor */
:root[data-dir="brutalist"] .hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:
    repeating-linear-gradient(90deg,rgba(255,255,255,.045) 0 1px,transparent 1px 25%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 1px,transparent 1px 120px);
  mask-image:linear-gradient(180deg,#000 0,#000 60%,transparent)}
:root[data-dir="brutalist"] .honest{border-left-width:4px}
:root[data-dir="brutalist"] .step .n{font-size:2.6rem}

/* reduced motion pojistka pro skládání */
@media(prefers-reduced-motion:reduce){
  .ghost .ghost-h,.ghost .ghost-l,.ghost .ghost-chip{transition:none}
  .ghost-prog{transition:none}
}

/* ==========================================================================
   TRACK B ("zbraň") — živý generátor, manifesto, cena, pro koho, výsledky
   ========================================================================== */

/* ---- živý mini-web v heru (nahrazuje placeholder lišty) ---- */
.ghost-body.live{padding:0;display:block;min-height:0}
.ghost-body.live::after{display:none}
.live{background:var(--bg);color:var(--ink);overflow:hidden}
.live-nav{display:flex;align-items:center;justify-content:space-between;padding:11px 16px;
  border-bottom:1px solid var(--line);background:var(--surface-2)}
.live-logo{font-family:var(--font-display);font-weight:700;font-size:1rem;letter-spacing:-.02em}
.live-dots{display:inline-flex;gap:12px}
.live-dots i{width:22px;height:6px;border-radius:4px;background:var(--line-2)}
.live-hero{padding:20px 16px 16px;display:flex;flex-direction:column;gap:8px;
  background:radial-gradient(120% 90% at 100% 0,color-mix(in srgb,var(--accent) 16%,transparent),transparent 60%)}
.live-tag{font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:700}
.live-h{font-family:var(--font-display);font-size:1.2rem;line-height:1.12;letter-spacing:-.02em;margin:0}
.live-sub{font-size:.8rem;color:var(--muted);line-height:1.45;margin:0}
.live-cta{align-self:flex-start;margin-top:4px;background:var(--accent);color:#fff;font-weight:600;font-size:.76rem;
  padding:7px 15px;border-radius:var(--r-pill)}
.live-feats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:14px 16px 18px}
.live-feat{display:flex;flex-direction:column;gap:4px;font-size:.68rem;line-height:1.25;color:var(--muted);
  background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:9px 10px}
.live-feat i{font-size:1.1rem;font-style:normal}
@keyframes liveIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.live.in .live-tag{animation:liveIn .45s var(--ease) both}
.live.in .live-h{animation:liveIn .45s var(--ease) .07s both}
.live.in .live-sub{animation:liveIn .45s var(--ease) .15s both}
.live.in .live-cta{animation:liveIn .45s var(--ease) .23s both}
.live.in .live-feat{animation:liveIn .45s var(--ease) both}
.live.in .live-feat:nth-child(2){animation-delay:.1s}
.live.in .live-feat:nth-child(3){animation-delay:.2s}

/* ---- manifesto + zakladatel ---- */
.sec-manifesto{padding-top:0}
.manifesto{max-width:920px;margin:0 auto;text-align:center;padding:clamp(28px,4vw,46px);
  border:1px solid var(--line);border-radius:var(--r-xl);background:var(--surface);box-shadow:var(--shadow)}
.manifesto-line{font-family:var(--font-display);font-size:var(--step-3);line-height:1.22;letter-spacing:-.02em;
  text-wrap:balance;margin:0}
.founder{display:inline-flex;align-items:center;gap:14px;margin-top:24px;text-align:left}
.founder-ava{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;
  font-family:var(--font-display);font-weight:700;font-size:1.1rem;object-fit:cover;
  background:color-mix(in srgb,var(--spark) 18%,transparent);color:var(--spark);
  border:1px solid color-mix(in srgb,var(--spark) 36%,transparent)}
.founder-txt{display:flex;flex-direction:column}
.founder-txt b{font-weight:600}
.founder-txt span{font-size:.86rem;color:var(--muted);max-width:46ch;line-height:1.4}

/* ---- cenové balíčky ---- */
.pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,22px);align-items:stretch}
@media(max-width:820px){.pricing{grid-template-columns:1fr}}
.pkg{position:relative;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-xl);padding:clamp(22px,3vw,30px);box-shadow:var(--shadow)}
.pkg-hot{border-color:color-mix(in srgb,var(--spark) 55%,transparent);box-shadow:var(--shadow-spark),var(--shadow-lg);transform:translateY(-6px)}
@media(max-width:820px){.pkg-hot{transform:none}}
.pkg-badge{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:var(--spark);color:var(--spark-ink);
  font-size:.66rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:5px 13px;border-radius:var(--r-pill);white-space:nowrap}
.pkg-name{font-size:var(--step-1)}
.pkg-price{font-family:var(--font-display);font-size:var(--step-3);letter-spacing:-.03em;margin:8px 0 2px;color:var(--ink);white-space:nowrap}
.pkg-hot .pkg-price{color:var(--spark)}
.pkg-time{font-size:var(--step--1);color:var(--muted);font-weight:600}
.pkg-desc{margin:14px 0 0;color:var(--muted);font-size:.95rem}
.pkg-list{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:9px}
.pkg-list li{position:relative;padding-left:26px;font-size:.92rem}
.pkg-list li::before{content:"✓";position:absolute;left:0;color:var(--spark);font-weight:700}
.pkg .pkg-cta{margin-top:22px;margin-top:auto;width:100%}
.pkg-list+.pkg-cta{margin-top:22px}

/* ---- pro koho (ne)jsme ---- */
.fit-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2.4vw,24px)}
@media(max-width:720px){.fit-grid{grid-template-columns:1fr}}
.fit{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);padding:clamp(22px,3vw,30px)}
.fit-yes{border-left:3px solid #12B76A}
.fit-no{border-left:3px solid var(--faint)}
.fit-tag{display:inline-block;font-weight:700;font-size:var(--step-1);margin-bottom:16px}
.fit-yes .fit-tag{color:#12B76A}
.fit-no .fit-tag{color:var(--muted)}
.fit ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.fit li{position:relative;padding-left:28px;color:var(--muted);line-height:1.45}
.fit li b{color:var(--ink);font-weight:600}
.fit-yes li::before{content:"✓";position:absolute;left:0;color:#12B76A;font-weight:700}
.fit-no li::before{content:"✕";position:absolute;left:0;color:var(--faint);font-weight:700}

/* ---- portfolio: úderný výsledek ---- */
.port-vysledek{margin:10px 0 0;font-weight:600;font-size:.96rem;line-height:1.4;color:var(--ink)}