/* ============================================================
   FINPLAI — sdílený stylesheet
   Barvy a logo vychází z brand boardu FINPLAI v1.
   Načítá ho každá stránka webu; sekční styly přidávej sem,
   ne do jednotlivých HTML souborů.
   ============================================================ */

html{-webkit-text-size-adjust:100%}
body{margin:0}
img,svg{max-width:100%}
/* ============================================================
   FINPLAI — návrh webu (landing page)
   Barvy a logo přebírají brand board FINPLAI v1.
   ============================================================ */

:root{
  /* --- ground & ink --- */
  --paper:#F4F6F7;
  --surface:#FFFFFF;
  --surface-2:#EDF1F3;
  --ink:#0C1B2A;
  --ink-2:#22384B;
  --muted:#5C6B78;
  --hair:rgba(12,27,42,.13);
  --hair-strong:rgba(12,27,42,.24);

  /* --- accent (jediný) --- */
  --acc:#0B9E76;
  --acc-ink:#07775A;        /* drobný text na světlém */
  --acc-bright:#35D9A6;     /* na tmavém */
  --acc-wash:rgba(11,158,118,.10);

  /* --- stavová, rezervovaná: jen anomálie/kritické --- */
  --crit:#C2453B;
  --crit-wash:rgba(194,69,59,.10);

  /* --- panely (hero, bezpečnost, závěr, patička) --- */
  --pnl:#FFFFFF; --pnl-2:#E7EFF3;
  --pnl-ink:#0C1B2A; --pnl-ink-2:#17293A; --pnl-ink-3:#3B4E5D;
  --pnl-muted:#5C6B78; --pnl-muted-2:#7C8B97;
  --pnl-hair:rgba(12,27,42,.14); --pnl-hair-2:rgba(12,27,42,.09); --pnl-hair-3:rgba(12,27,42,.11);
  --pnl-brd:rgba(12,27,42,.22);
  --pnl-card:#FFFFFF; --pnl-film:#F2F6F8; --pnl-film-2:#E8EFF2;
  --pnl-well:#F1F5F7; --pnl-track:rgba(12,27,42,.09);
  --pnl-acc:#0B9E76; --pnl-acc-tx:#07775A; --pnl-acc-soft:#07775A;
  --pnl-crit:#A8382F; --pnl-crit-bar:#C2453B;
  --pnl-ref:#5C6B78; --pnl-grid:rgba(12,27,42,.14); --pnl-grid-2:rgba(12,27,42,.07);
  --pnl-shadow:0 18px 44px rgba(12,27,42,.10);


  --shadow:0 1px 2px rgba(12,27,42,.05), 0 12px 34px rgba(12,27,42,.07);
  --shadow-lift:0 2px 4px rgba(12,27,42,.06), 0 22px 50px rgba(12,27,42,.11);

  --font-display:"Segoe UI Variable Display","Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --font-mono:"Cascadia Mono",Consolas,ui-monospace,"SF Mono",Menlo,"DejaVu Sans Mono",monospace;

  --maxw:1180px;
  --gut:200px;
}

@media (prefers-color-scheme:dark){
  :root{
    --paper:#08111A;
    --surface:#0F1D2B;
    --surface-2:#152738;
    --ink:#E9EFF3;
    --ink-2:#C6D5E0;
    --muted:#93A2B0;
    --hair:rgba(255,255,255,.11);
    --hair-strong:rgba(255,255,255,.20);
    --acc:#2ACB9C;
    --acc-ink:#5FE3BD;
    --acc-bright:#5FE7C0;
    --acc-wash:rgba(42,203,156,.13);
    --crit:#E0705F;
    --crit-wash:rgba(224,112,95,.14);
    /* --- panely (hero, bezpečnost, závěr, patička) --- */
    --pnl:#0A141F; --pnl-2:#122234;
    --pnl-ink:#F6FAFC; --pnl-ink-2:#EAF2F7; --pnl-ink-3:#B7C7D3;
    --pnl-muted:#9FB3C2; --pnl-muted-2:#6E8494;
    --pnl-hair:rgba(255,255,255,.10); --pnl-hair-2:rgba(255,255,255,.055); --pnl-hair-3:rgba(255,255,255,.07);
    --pnl-brd:rgba(255,255,255,.22);
    --pnl-card:rgba(255,255,255,.035); --pnl-film:rgba(255,255,255,.03); --pnl-film-2:rgba(255,255,255,.08);
    --pnl-well:rgba(0,0,0,.22); --pnl-track:rgba(255,255,255,.07);
    --pnl-acc:#35D9A6; --pnl-acc-tx:#35D9A6; --pnl-acc-soft:#8DEBCB;
    --pnl-crit:#F0A79C; --pnl-crit-bar:#E0705F;
    --pnl-ref:#68809A; --pnl-grid:rgba(255,255,255,.10); --pnl-grid-2:rgba(255,255,255,.06);
    --pnl-shadow:0 30px 70px rgba(0,0,0,.42);
    --shadow:0 1px 2px rgba(0,0,0,.45), 0 14px 38px rgba(0,0,0,.38);
    --shadow-lift:0 2px 6px rgba(0,0,0,.5), 0 24px 56px rgba(0,0,0,.45);
  }
}
:root[data-theme="light"]{
  /* --- panely (hero, bezpečnost, závěr, patička) --- */
  --pnl:#FFFFFF; --pnl-2:#E7EFF3;
  --pnl-ink:#0C1B2A; --pnl-ink-2:#17293A; --pnl-ink-3:#3B4E5D;
  --pnl-muted:#5C6B78; --pnl-muted-2:#7C8B97;
  --pnl-hair:rgba(12,27,42,.14); --pnl-hair-2:rgba(12,27,42,.09); --pnl-hair-3:rgba(12,27,42,.11);
  --pnl-brd:rgba(12,27,42,.22);
  --pnl-card:#FFFFFF; --pnl-film:#F2F6F8; --pnl-film-2:#E8EFF2;
  --pnl-well:#F1F5F7; --pnl-track:rgba(12,27,42,.09);
  --pnl-acc:#0B9E76; --pnl-acc-tx:#07775A; --pnl-acc-soft:#07775A;
  --pnl-crit:#A8382F; --pnl-crit-bar:#C2453B;
  --pnl-ref:#5C6B78; --pnl-grid:rgba(12,27,42,.14); --pnl-grid-2:rgba(12,27,42,.07);
  --pnl-shadow:0 18px 44px rgba(12,27,42,.10);

  --paper:#F4F6F7;--surface:#FFFFFF;--surface-2:#EDF1F3;--ink:#0C1B2A;--ink-2:#22384B;--muted:#5C6B78;
  --hair:rgba(12,27,42,.13);--hair-strong:rgba(12,27,42,.24);
  --acc:#0B9E76;--acc-ink:#07775A;--acc-bright:#35D9A6;--acc-wash:rgba(11,158,118,.10);
  --crit:#C2453B;--crit-wash:rgba(194,69,59,.10);
  --shadow:0 1px 2px rgba(12,27,42,.05), 0 12px 34px rgba(12,27,42,.07);
  --shadow-lift:0 2px 4px rgba(12,27,42,.06), 0 22px 50px rgba(12,27,42,.11);
}
:root[data-theme="dark"]{
  /* --- panely (hero, bezpečnost, závěr, patička) --- */
  --pnl:#0A141F; --pnl-2:#122234;
  --pnl-ink:#F6FAFC; --pnl-ink-2:#EAF2F7; --pnl-ink-3:#B7C7D3;
  --pnl-muted:#9FB3C2; --pnl-muted-2:#6E8494;
  --pnl-hair:rgba(255,255,255,.10); --pnl-hair-2:rgba(255,255,255,.055); --pnl-hair-3:rgba(255,255,255,.07);
  --pnl-brd:rgba(255,255,255,.22);
  --pnl-card:rgba(255,255,255,.035); --pnl-film:rgba(255,255,255,.03); --pnl-film-2:rgba(255,255,255,.08);
  --pnl-well:rgba(0,0,0,.22); --pnl-track:rgba(255,255,255,.07);
  --pnl-acc:#35D9A6; --pnl-acc-tx:#35D9A6; --pnl-acc-soft:#8DEBCB;
  --pnl-crit:#F0A79C; --pnl-crit-bar:#E0705F;
  --pnl-ref:#68809A; --pnl-grid:rgba(255,255,255,.10); --pnl-grid-2:rgba(255,255,255,.06);
  --pnl-shadow:0 30px 70px rgba(0,0,0,.42);

  --paper:#08111A;--surface:#0F1D2B;--surface-2:#152738;--ink:#E9EFF3;--ink-2:#C6D5E0;--muted:#93A2B0;
  --hair:rgba(255,255,255,.11);--hair-strong:rgba(255,255,255,.20);
  --acc:#2ACB9C;--acc-ink:#5FE3BD;--acc-bright:#5FE7C0;--acc-wash:rgba(42,203,156,.13);
  --crit:#E0705F;--crit-wash:rgba(224,112,95,.14);
  --shadow:0 1px 2px rgba(0,0,0,.45), 0 14px 38px rgba(0,0,0,.38);
  --shadow-lift:0 2px 6px rgba(0,0,0,.5), 0 24px 56px rgba(0,0,0,.45);
}

*,*::before,*::after{box-sizing:border-box}

.fp{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-display);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.fp :where(p){margin:0}
.fp :where(h1,h2,h3,h4){margin:0;text-wrap:balance;letter-spacing:-.025em;font-weight:800}
.fp :where(ul,ol){margin:0;padding:0;list-style:none}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}

/* ---------- páteř: úzký popisný sloupec + obsah ---------- */
.spine{display:grid;grid-template-columns:var(--gut) minmax(0,1fr);gap:0 40px;align-items:start}
/* minmax(0,…) a min-width:0 jsou nutné — jinak široká tabulka ve srovnání
   roztáhne sloupec gridu nad šířku viewportu a obsah se ořízne */
.spine > *{min-width:0}
@media(max-width:940px){ .spine{grid-template-columns:minmax(0,1fr);gap:0} }

.rail{position:sticky;top:96px;display:flex;flex-direction:column;gap:10px;padding-top:6px}
@media(max-width:940px){ .rail{position:static;flex-direction:row;align-items:center;gap:14px;margin-bottom:18px} }
.rail .no{font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--acc-ink);font-weight:700}
.rail .nm{font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.rail .bar{height:1px;background:var(--hair-strong);width:56px}
@media(max-width:940px){ .rail .bar{flex:1;width:auto} }

.band{padding:96px 0;border-top:1px solid var(--hair);scroll-margin-top:80px}
.close{scroll-margin-top:80px}
@media (prefers-reduced-motion:no-preference){ html{scroll-behavior:smooth} }
.band:first-of-type{border-top:0}
.band.tight{padding:76px 0}

.lead{font-size:clamp(1.7rem,3.6vw,2.5rem);line-height:1.16;margin:0 0 18px}
.lede{color:var(--muted);max-width:62ch;font-size:1.06rem;margin:0}
.acc{color:var(--acc-ink)}

/* ---------- značka ---------- */
.wm{font-weight:800;letter-spacing:-.03em;line-height:1;white-space:nowrap;display:inline-flex}
.wm .fin{color:var(--ink)}
.wm .plai{color:var(--acc)}

/* ---------- horní lišta ---------- */
.topbar{
  position:sticky;top:0;z-index:50;
  background:color-mix(in srgb,var(--paper) 86%,transparent);
  backdrop-filter:saturate(150%) blur(12px);
  border-bottom:1px solid var(--hair);
}
.topbar .in{max-width:var(--maxw);margin:0 auto;padding:13px 28px;display:flex;align-items:center;gap:26px}
.brandlink{display:inline-flex;align-items:center;gap:11px;text-decoration:none}
.brandlink .wm{font-size:1.24rem}
.navlinks{display:flex;gap:24px;margin-left:auto}
/* Flex položky se smrští pod obsah a text se zlomí i tam, kde by se vešel.
   nowrap to zakáže — a protože se pak menu nemá jak zúžit, schová se dřív. */
@media(max-width:1200px){ .navlinks{gap:18px} }
@media(max-width:1080px){ .navlinks{display:none} }
.navlinks a{
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--muted);text-decoration:none;padding:4px 0;border-bottom:1px solid transparent;
  white-space:nowrap;
}
.navlinks a:hover,.navlinks a:focus-visible{color:var(--ink);border-bottom-color:var(--acc)}

/* ---------- tlačítka ---------- */
.btn{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--font-display);font-size:.95rem;font-weight:650;letter-spacing:-.01em;
  padding:11px 20px;border-radius:10px;text-decoration:none;border:1px solid transparent;cursor:pointer;
  white-space:nowrap;
  transition:transform .16s ease,background-color .16s ease,border-color .16s ease;
}
.btn-primary{background:var(--acc);color:#04231A;border-color:var(--acc)}
.btn-primary:hover{transform:translateY(-1px);background:color-mix(in srgb,var(--acc) 88%,#fff)}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--hair-strong)}
.btn-ghost:hover{border-color:var(--acc);color:var(--acc-ink)}
.btn-sm{padding:8px 15px;font-size:.87rem}

.fp a:focus-visible,.fp button:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:6px}

/* ============================================================
   HERO — tmavý panel, závazně tmavý v obou režimech
   ============================================================ */
.hero{
  background:
    radial-gradient(110% 130% at 88% 4%, var(--pnl-2) 0%, var(--pnl) 58%);
  color:var(--pnl-ink-2);
  position:relative;
  overflow:hidden;
}
.hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(transparent 0 calc(100% - 1px), var(--pnl-hair) calc(100% - 1px)) 0 0/100% 26px;
  opacity:.5;
}
.hero .wrap{position:relative;z-index:1;padding-top:64px;padding-bottom:76px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:56px;align-items:start}
@media(max-width:1000px){ .hero-grid{grid-template-columns:1fr;gap:44px} }

.kicker{
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--pnl-acc-tx);display:inline-flex;align-items:center;gap:10px;margin-bottom:22px;
}
.kicker::before{content:"";width:26px;height:1px;background:var(--pnl-acc-tx);display:block}

.h1{
  font-size:clamp(2.3rem,5.4vw,3.85rem);line-height:1.04;color:var(--pnl-ink);
  letter-spacing:-.035em;margin:0 0 22px;max-width:15ch;
}
.h1 em{font-style:normal;color:var(--pnl-acc);display:inline-block}
.h1 .q{color:var(--pnl-acc-tx)}

.hero-sub{color:var(--pnl-ink-3);font-size:clamp(1.02rem,1.7vw,1.16rem);max-width:50ch;line-height:1.62}
.hero-sub b{color:var(--pnl-ink-2);font-weight:650}

.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px}
.hero .btn-ghost{color:var(--pnl-ink-2);border-color:var(--pnl-brd)}
.hero .btn-ghost:hover{border-color:var(--pnl-acc-tx);color:var(--pnl-acc-tx)}

.hero-facts{
  display:flex;flex-wrap:wrap;gap:0;margin-top:44px;
  border-top:1px solid var(--pnl-hair);padding-top:22px;
}
.hero-facts div{padding-right:30px;margin-right:30px;border-right:1px solid var(--pnl-hair)}
.hero-facts div:last-child{border-right:0;margin-right:0;padding-right:0}
.hero-facts .v{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:1.42rem;color:var(--pnl-ink);letter-spacing:-.01em;line-height:1.2}
.hero-facts .l{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--pnl-muted);margin-top:5px}

/* ============================================================
   PORADA — živý panel v heru
   ============================================================ */
.meeting{
  background:var(--pnl-card);
  border:1px solid var(--pnl-hair);
  border-radius:14px;
  overflow:hidden;
  box-shadow:var(--pnl-shadow);
}
.mtg-bar{
  display:flex;align-items:center;gap:11px;
  padding:12px 16px;border-bottom:1px solid var(--pnl-hair);
  background:var(--pnl-film);
}
.mtg-dot{width:8px;height:8px;border-radius:50%;background:var(--pnl-acc);flex:none;box-shadow:0 0 0 4px color-mix(in srgb,var(--pnl-acc) 18%,transparent)}
.mtg-title{font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--pnl-muted)}
.mtg-clock{
  margin-left:auto;font-family:var(--font-mono);font-variant-numeric:tabular-nums;
  font-size:1rem;color:var(--pnl-ink);letter-spacing:.02em;
}

.mtg-feed{padding:6px 0 2px}
.ev{
  display:grid;grid-template-columns:56px minmax(0,1fr);gap:0 14px;
  padding:14px 18px 14px 16px;position:relative;
}
.ev + .ev{border-top:1px solid var(--pnl-hair-2)}
.ev .t{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:12px;
  color:var(--pnl-muted);padding-top:2px;letter-spacing:.02em;
}
.ev .body{min-width:0}
.ev .who{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--pnl-acc-tx);margin-bottom:6px;display:inline-block;
}
.ev .who.crit{color:var(--pnl-crit)}
.ev .said{color:var(--pnl-ink);font-size:.98rem;line-height:1.5;font-weight:600}
.ev .said.ask{color:var(--pnl-ink-2);font-weight:650}
.ev .said.ask::before{content:"„";color:var(--pnl-muted)}
.ev .said.ask::after{content:"“";color:var(--pnl-muted)}
.ev .note{color:var(--pnl-muted);font-size:.88rem;line-height:1.5;margin-top:5px}
.ev .note b{color:var(--pnl-ink-2);font-weight:600}

/* postupné odkrývání */
@media (prefers-reduced-motion:no-preference){
  .meeting[data-play="1"] .ev{opacity:0;transform:translateY(8px)}
  .meeting[data-play="1"] .ev.on{opacity:1;transform:none;transition:opacity .45s ease,transform .45s cubic-bezier(.2,.7,.2,1)}
}

.mtg-foot{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:13px 16px;border-top:1px solid var(--pnl-hair);background:var(--pnl-film);
}
.mtg-foot .fin-note{font-size:.85rem;color:var(--pnl-muted)}
.mtg-foot .fin-note b{color:var(--pnl-acc-tx);font-weight:650}
.replay{
  margin-left:auto;background:transparent;border:1px solid var(--pnl-brd);color:var(--pnl-ink-2);
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;
  padding:6px 12px;border-radius:7px;cursor:pointer;transition:border-color .16s ease,color .16s ease;
}
.replay:hover{border-color:var(--pnl-acc-tx);color:var(--pnl-acc-tx)}

/* ---------- grafy uvnitř porady ---------- */
.figure{margin-top:12px;background:var(--pnl-well);border:1px solid var(--pnl-hair-3);border-radius:10px;padding:12px 13px 11px}
.fig-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.fig-title{font-family:var(--font-mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--pnl-muted)}
.chip{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;padding:2px 7px;border-radius:999px;
  font-variant-numeric:tabular-nums;
}
.chip-crit{color:var(--pnl-crit);background:color-mix(in srgb,var(--pnl-crit-bar) 15%,transparent);border:1px solid color-mix(in srgb,var(--pnl-crit-bar) 32%,transparent)}
.chip-acc{color:var(--pnl-acc-soft);background:color-mix(in srgb,var(--pnl-acc) 14%,transparent);border:1px solid color-mix(in srgb,var(--pnl-acc) 30%,transparent)}

/* pruhový graf — příčiny poklesu marže */
.bars{display:grid;gap:7px}
.bar-row{display:grid;grid-template-columns:minmax(88px,auto) minmax(0,1fr) 52px;gap:10px;align-items:center}
.bar-row .lb{font-size:.79rem;color:var(--pnl-ink-3);line-height:1.25}
.bar-track{height:9px;background:var(--pnl-track);border-radius:2px;overflow:hidden}
.bar-fill{height:100%;background:var(--pnl-crit-bar);border-radius:0 4px 4px 0;transition:filter .16s ease}
.bar-row:hover .bar-fill{filter:brightness(1.18)}
.bar-row .vl{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:.78rem;
  color:var(--pnl-crit);text-align:right;
}

/* čárový graf — what-if */
.legend{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:6px}
.legend span{display:inline-flex;align-items:center;gap:7px;font-size:.76rem;color:var(--pnl-muted)}
.legend i{width:16px;height:0;border-top-width:2px;border-top-style:solid;display:block}
.wf svg{display:block;width:100%;height:auto}

/* ============================================================
   BOLESTI
   ============================================================ */
.pains{display:grid;gap:0;margin-top:34px;border-top:1px solid var(--hair)}
.pain{
  display:grid;grid-template-columns:118px minmax(0,1fr) minmax(0,1.15fr);gap:24px;
  padding:22px 0;border-bottom:1px solid var(--hair);align-items:baseline;
}
@media(max-width:760px){ .pain{grid-template-columns:1fr;gap:6px;padding:20px 0} }
.pain .fig{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;
  font-size:1.18rem;color:var(--crit);letter-spacing:-.01em;font-weight:600;
}
.pain h3{font-size:1.06rem;font-weight:700;letter-spacing:-.015em}
.pain p{color:var(--muted);font-size:.95rem}

.quote{
  margin-top:40px;padding:26px 30px;border-left:2px solid var(--acc);
  background:var(--acc-wash);border-radius:0 12px 12px 0;
}
.quote p{font-size:1.14rem;line-height:1.5;color:var(--ink);max-width:56ch;font-weight:500}
.quote cite{
  display:block;margin-top:12px;font-style:normal;
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
}

/* ============================================================
   PILÍŘE
   ============================================================ */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:38px}
@media(max-width:900px){ .pillars{grid-template-columns:1fr} }
.pillar{
  background:var(--surface);border:1px solid var(--hair);border-radius:14px;padding:24px 22px 22px;
  box-shadow:var(--shadow);display:flex;flex-direction:column;gap:13px;
}
.pillar .rn{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;color:var(--acc-ink);font-weight:700;
}
.pillar h3{font-size:1.22rem}
.pillar > p{color:var(--muted);font-size:.94rem}
.pillar ul{display:grid;gap:8px;margin-top:2px;padding-top:14px;border-top:1px solid var(--hair)}
.pillar li{position:relative;padding-left:20px;font-size:.9rem;color:var(--ink-2);line-height:1.45}
.pillar li::before{
  content:"";position:absolute;left:0;top:.52em;width:8px;height:8px;border-radius:2px;
  background:var(--acc);opacity:.85;
}
.pillar li b{font-weight:650;color:var(--ink)}

/* ============================================================
   ROI
   ============================================================ */
.roi{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:38px;border:1px solid var(--hair);border-radius:14px;overflow:hidden;background:var(--surface)}
@media(max-width:860px){ .roi{grid-template-columns:repeat(2,1fr)} }
@media(max-width:480px){ .roi{grid-template-columns:1fr} }
.stat{padding:26px 22px;border-right:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.stat:nth-child(4){border-right:0}
@media(max-width:860px){ .stat:nth-child(2n){border-right:0} }
@media(max-width:480px){ .stat{border-right:0} }
.stat .v{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;
  font-size:clamp(1.7rem,3.4vw,2.15rem);line-height:1.05;color:var(--acc-ink);letter-spacing:-.02em;
}
.stat .v small{font-size:.46em;letter-spacing:.02em;color:var(--muted);margin-left:4px}
.stat .k{font-weight:650;font-size:.96rem;margin-top:10px}
.stat .d{color:var(--muted);font-size:.87rem;margin-top:5px;line-height:1.45}

.model{
  display:flex;gap:14px;flex-wrap:wrap;align-items:baseline;
  padding:18px 22px;background:var(--surface-2);border-top:0;
  grid-column:1/-1;
}
.model .lbl{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.model .calc{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:.9rem;color:var(--ink-2)}
.model .res{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:.95rem;color:var(--acc-ink);font-weight:700}

/* ============================================================
   BEZPEČNOST — tmavý pás
   ============================================================ */
.dark-band{background:var(--pnl);color:var(--pnl-ink-2);border-top:0}
.dark-band .rail .no{color:var(--pnl-acc-tx)}
.dark-band .rail .nm{color:var(--pnl-muted)}
.dark-band .rail .bar{background:var(--pnl-brd)}
.dark-band .lead{color:var(--pnl-ink)}
.dark-band .lede{color:var(--pnl-muted)}
.dark-band .acc{color:var(--pnl-acc-tx)}

.sec-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;margin-top:38px;background:var(--pnl-hair);border:1px solid var(--pnl-hair);border-radius:14px;overflow:hidden}
@media(max-width:760px){ .sec-grid{grid-template-columns:1fr} }
.sec{background:var(--pnl);padding:24px 24px 22px;display:flex;flex-direction:column;gap:9px}
.sec .ltr{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;color:var(--pnl-acc-tx);font-weight:700;
}
.sec h3{font-size:1.06rem;color:var(--pnl-ink)}
.sec p{color:var(--pnl-muted);font-size:.92rem;line-height:1.55}
.sec p b{color:var(--pnl-ink-2);font-weight:650}

.nis{
  margin-top:22px;padding:20px 24px;border:1px solid var(--pnl-hair);border-radius:12px;
  background:var(--pnl-film);display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap;
}
.nis .tag{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--pnl-acc-tx);padding-top:3px;flex:none}
.nis p{color:var(--pnl-muted);font-size:.9rem;line-height:1.55;max-width:78ch}
.nis p b{color:var(--pnl-ink-2);font-weight:650}

/* ============================================================
   SROVNÁNÍ
   ============================================================ */
.tablewrap{margin-top:34px;overflow-x:auto;border:1px solid var(--hair);border-radius:14px;background:var(--surface)}
table.cmp{border-collapse:collapse;width:100%;min-width:760px;font-size:.9rem}
table.cmp th,table.cmp td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--hair);vertical-align:top}
table.cmp thead th{
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);font-weight:600;background:var(--surface-2);white-space:nowrap;
}
table.cmp thead th.us{color:var(--acc-ink)}
table.cmp tbody th{font-weight:650;color:var(--ink);width:26%}
table.cmp td{color:var(--muted)}
table.cmp td.us{background:var(--acc-wash);color:var(--ink-2)}
table.cmp td b{color:var(--ink);font-weight:650}
table.cmp td.us b{color:var(--acc-ink)}
table.cmp tbody tr:last-child th,table.cmp tbody tr:last-child td{border-bottom:0}
.mark{font-family:var(--font-mono);margin-right:7px;font-size:.95em}
.m-full{color:var(--acc)}
.m-part{color:var(--muted)}
.m-none{color:var(--crit)}

/* ============================================================
   TIERY
   ============================================================ */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:38px}
@media(max-width:900px){ .tiers{grid-template-columns:1fr} }
.tier{
  background:var(--surface);border:1px solid var(--hair);border-radius:14px;
  padding:24px 22px;display:flex;flex-direction:column;gap:14px;box-shadow:var(--shadow);
}
.tier.hl{border-color:color-mix(in srgb,var(--acc) 50%,transparent);box-shadow:var(--shadow-lift)}
.tier .top{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.tier h3{font-size:1.16rem}
.tier h3 .plai{color:var(--acc)}
.tier .badge{
  margin-left:auto;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--acc-ink);border:1px solid color-mix(in srgb,var(--acc) 42%,transparent);
  padding:3px 8px;border-radius:999px;
}
.tier .aud{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);line-height:1.5}
.tier ul{display:grid;gap:8px;padding-top:14px;border-top:1px solid var(--hair)}
.tier li{position:relative;padding-left:22px;font-size:.9rem;color:var(--ink-2);line-height:1.45}
.tier li .i{position:absolute;left:0;top:0;font-family:var(--font-mono);font-size:.85rem}
.tier li.y .i{color:var(--acc)}
.tier li.n{color:var(--muted)}
.tier li.n .i{color:var(--crit)}
.tier li b{font-weight:650;color:var(--ink)}

.pricing-cta{
  display:flex;align-items:center;gap:22px;flex-wrap:wrap;
  margin-top:24px;padding:22px 26px;
  border:1px solid var(--hair);border-radius:14px;background:var(--surface-2);
}
.pricing-cta .txt{flex:1 1 320px;min-width:0}
.pricing-cta .h{font-weight:700;font-size:1.04rem;margin-bottom:4px}
.pricing-cta p{color:var(--muted);font-size:.92rem;max-width:56ch}

/* ============================================================
   PILOT
   ============================================================ */
.weeks{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:36px}
@media(max-width:800px){ .weeks{grid-template-columns:1fr} }
.week{border-top:2px solid var(--acc);padding-top:16px;display:flex;flex-direction:column;gap:8px}
.week .wn{font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--acc-ink);font-weight:700}
.week h3{font-size:1.04rem}
.week p{color:var(--muted);font-size:.92rem}
.pilot-notes{display:flex;gap:26px;flex-wrap:wrap;margin-top:34px;padding-top:22px;border-top:1px solid var(--hair)}
.pilot-notes div{flex:1 1 220px}
.pilot-notes .h{font-weight:650;font-size:.95rem;margin-bottom:5px}
.pilot-notes p{color:var(--muted);font-size:.9rem}

/* ============================================================
   ZÁVĚREČNÉ CTA
   ============================================================ */
.close{
  background:radial-gradient(100% 160% at 12% 0%, var(--pnl-2) 0%, var(--pnl) 62%);
  color:var(--pnl-ink-2);
}
.close .wrap{padding:84px 28px}
.close-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:50px;align-items:end}
@media(max-width:860px){ .close-grid{grid-template-columns:1fr;gap:34px;align-items:start} }
.close h2{font-size:clamp(1.9rem,4.2vw,2.9rem);color:var(--pnl-ink);line-height:1.08;max-width:16ch}
.close h2 em{font-style:normal;color:var(--pnl-acc-tx)}
.close .sub{color:var(--pnl-muted);margin-top:16px;max-width:48ch;font-size:1.02rem}
.contact{border-left:1px solid var(--pnl-hair);padding-left:28px;display:flex;flex-direction:column;gap:5px}
@media(max-width:860px){ .contact{border-left:0;border-top:1px solid var(--pnl-hair);padding-left:0;padding-top:24px} }
.contact .who{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--pnl-muted)}
.contact .nm2{font-size:1.16rem;font-weight:700;color:var(--pnl-ink)}
.contact a{color:var(--pnl-acc-tx);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--pnl-acc) 40%,transparent);width:fit-content}
.contact a:hover{border-bottom-color:var(--pnl-acc-tx)}
.contact .org{color:var(--pnl-muted);font-size:.9rem;margin-top:8px}

.foot{background:var(--pnl);color:var(--pnl-muted);border-top:1px solid var(--pnl-hair)}
.foot .in{max-width:var(--maxw);margin:0 auto;padding:24px 28px;display:flex;gap:18px;align-items:center;flex-wrap:wrap;font-size:.84rem}
.foot .wm{font-size:1rem}
.foot .wm .fin{color:var(--pnl-ink)}
.foot .wm .plai{color:var(--pnl-acc)}
.foot .tm{font-size:.6em;vertical-align:super;color:var(--pnl-muted);margin-left:2px;font-weight:600}
.foot .sp{margin-left:auto}
.foot a{color:var(--pnl-muted);text-decoration:none;border-bottom:1px solid transparent}
.foot a:hover{color:var(--pnl-acc-tx);border-bottom-color:var(--pnl-acc-tx)}


/* ============================================================
   404
   ============================================================ */
.nf{padding:120px 0 140px;min-height:52vh;display:flex;align-items:center}
.nf-code{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;
  font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--acc-ink);font-weight:700;
  display:inline-flex;align-items:center;gap:12px;
}
.nf-code::after{content:"";width:44px;height:1px;background:var(--hair-strong)}
.nf-h{font-size:clamp(2rem,5vw,3.1rem);line-height:1.06;margin:18px 0 14px;max-width:16ch}
.nf-p{color:var(--muted);max-width:52ch;font-size:1.04rem}
.nf-links{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}

/* ============================================================
   Ovládání v liště — jazyk a světlý/tmavý režim
   ============================================================ */
.controls{display:flex;align-items:center;gap:12px;margin-left:26px}
@media(max-width:1080px){ .controls{margin-left:auto} }
@media(max-width:860px){ .controls{gap:9px} }
@media(max-width:420px){ .controls .btn{display:none} }

/* --- přepínač jazyka --- */
.langsw{display:inline-flex;align-items:center;border:1px solid var(--hair-strong);border-radius:8px;overflow:hidden}
.langsw a,.langsw span{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  padding:5px 9px;text-decoration:none;line-height:1.4;
}
.langsw a{color:var(--muted)}
.langsw a:hover{color:var(--ink);background:var(--surface-2)}
.langsw .on{color:var(--ink);background:var(--surface-2);font-weight:700;cursor:default}
.langsw .sep{padding:0;width:1px;background:var(--hair-strong);align-self:stretch}

/* --- přepínač režimu --- */
.themesw{
  width:34px;height:34px;flex:none;display:grid;place-items:center;cursor:pointer;
  background:transparent;border:1px solid var(--hair-strong);border-radius:8px;color:var(--muted);
  transition:color .16s ease,border-color .16s ease;
}
.themesw:hover{color:var(--ink);border-color:var(--acc)}
/* pozor: bez `display` — o zobrazení rozhoduje .icon-sun / .icon-moon níž,
   a `.themesw svg` má vyšší specificitu, takže by je přebilo */
.themesw svg{width:17px;height:17px}

/* ikona se řídí stejnými signály jako barvy: nejdřív OS, pak volba uživatele */
.icon-sun{display:none}
.icon-moon{display:block}
@media (prefers-color-scheme:dark){
  .icon-sun{display:block}
  .icon-moon{display:none}
}
:root[data-theme="dark"] .icon-sun{display:block}
:root[data-theme="dark"] .icon-moon{display:none}
:root[data-theme="light"] .icon-sun{display:none}
:root[data-theme="light"] .icon-moon{display:block}

/* na tmavém pásu (patička) drží ovládání světlé barvy */
.foot .langsw{border-color:var(--pnl-brd)}
.foot .langsw a{color:var(--pnl-muted)}
.foot .langsw a:hover{color:var(--pnl-ink);background:var(--pnl-film)}
.foot .langsw .on{color:var(--pnl-ink);background:var(--pnl-film-2)}
.foot .langsw .sep{background:var(--pnl-brd)}

/* --- nabídka jiné jazykové verze --- */
.langhint{
  display:none;align-items:center;gap:14px;flex-wrap:wrap;
  padding:10px 28px;background:var(--surface-2);border-bottom:1px solid var(--hair);
  font-size:.88rem;color:var(--muted);
}
.langhint.show{display:flex}
.langhint .in{max-width:var(--maxw);margin:0 auto;display:flex;align-items:center;gap:14px;width:100%;flex-wrap:wrap}
.langhint a{color:var(--acc-ink);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--acc) 45%,transparent);font-weight:600}
.langhint button{
  margin-left:auto;background:transparent;border:0;cursor:pointer;color:var(--muted);
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;padding:4px 6px;
}
.langhint button:hover{color:var(--ink)}

/* uvozovky podle jazyka stránky */
html[lang="en"] .ev .said.ask::before{content:"\201C"}
html[lang="en"] .ev .said.ask::after{content:"\201D"}

/* ============================================================
   METODY PLÁNOVÁNÍ + NASAZENÍ BEZ PROGRAMÁTORA
   ============================================================ */
.methods{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:36px;
  background:var(--hair);border:1px solid var(--hair);border-radius:14px;overflow:hidden;
}
@media(max-width:860px){ .methods{grid-template-columns:repeat(2,1fr)} }
@media(max-width:560px){ .methods{grid-template-columns:1fr} }
.method{background:var(--surface);padding:20px;display:flex;flex-direction:column;gap:7px}
.method h3{font-size:1rem;letter-spacing:-.015em}
.method p{color:var(--muted);font-size:.89rem;line-height:1.5}

.subhead{
  display:flex;align-items:center;gap:12px;margin:48px 0 4px;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
}
.subhead::after{content:"";flex:1;height:1px;background:var(--hair)}
.subhead-h{font-size:clamp(1.25rem,2.6vw,1.6rem);margin:10px 0 8px;letter-spacing:-.02em}

.nocode{display:grid;grid-template-columns:repeat(2,1fr);gap:16px 30px;margin-top:22px}
@media(max-width:700px){ .nocode{grid-template-columns:1fr} }
.nocode > div{display:flex;gap:13px;align-items:flex-start}
.nocode .k{
  flex:none;width:20px;height:20px;border-radius:5px;margin-top:2px;
  display:grid;place-items:center;background:var(--acc);color:#04231A;
  font-family:var(--font-mono);font-size:11px;font-weight:700;
}
.nocode .h{font-weight:650;font-size:.97rem}
.nocode p{color:var(--muted);font-size:.89rem;line-height:1.5;margin-top:2px}

/* ============================================================
   PATIČKA
   ============================================================ */
.foot .in-grid{
  max-width:var(--maxw);margin:0 auto;padding:44px 28px 30px;
  display:grid;grid-template-columns:1.5fr 1fr 1.3fr;gap:36px;
}
@media(max-width:860px){ .foot .in-grid{grid-template-columns:1fr 1fr;gap:30px} }
@media(max-width:560px){ .foot .in-grid{grid-template-columns:1fr} }
.fcol{display:flex;flex-direction:column;gap:9px;min-width:0}
.fcol .fh{
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--pnl-muted);margin-bottom:2px;
}
.fcol .wm{font-size:1.16rem}
.fcol .wm .fin{color:var(--pnl-ink)}
.fcol .wm .plai{color:var(--pnl-acc)}
.fcol .claim{color:var(--pnl-muted);font-size:.88rem;max-width:34ch}
.fcol ul{display:flex;flex-direction:column;gap:7px}
.fcol li{font-size:.9rem;color:var(--pnl-ink-3)}
.fcol a{color:var(--pnl-ink-3);text-decoration:none;border-bottom:1px solid transparent;width:fit-content}
.fcol a:hover{color:var(--pnl-acc-tx);border-bottom-color:var(--pnl-acc-tx)}
.fcol .addr{color:var(--pnl-ink-3);font-size:.9rem;line-height:1.6;font-style:normal}
.fcol .li-link{display:inline-flex;align-items:center;gap:8px;margin-top:4px}
.fcol .li-link svg{width:15px;height:15px;flex:none}

.foot .in-legal{
  max-width:var(--maxw);margin:0 auto;padding:16px 28px 26px;
  border-top:1px solid var(--pnl-hair);
  display:flex;gap:16px;align-items:center;flex-wrap:wrap;
  font-size:.82rem;color:var(--pnl-muted);
}
.foot .in-legal .sp{margin-left:auto}
.foot .in-legal a{color:var(--pnl-muted);text-decoration:none;border-bottom:1px solid transparent}
.foot .in-legal a:hover{color:var(--pnl-acc-tx);border-bottom-color:var(--pnl-acc-tx)}
.foot .tm{font-size:.6em;vertical-align:super;color:var(--pnl-muted);margin-left:2px;font-weight:600}

/* číslo odchylky v textu události — stavová barva, ne akcent */
.crit-num{color:var(--pnl-crit)}