/* ===========================================================================
   PLEVIX — domovská stránka
   ---------------------------------------------------------------------------
   Prepis schváleného návrhu do produkčného CSS. Stránka je zámerne TMAVÁ
   nezávisle od témy webu: je to jej výtvarné riešenie, nie preklep. Ostatné
   stránky (cenník, nástroje, role) rešpektujú svetlú aj tmavú tému.

   Typografia: Space Grotesk na nadpisy, IBM Plex Sans na text,
   IBM Plex Mono na čísla a technické popisy — tak, ako je to v návrhu.
   =========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --px-bg:#07090F; --px-ink:#EEF1F7; --px-dim:#98A2B8; --px-dim2:#8B94A8;
  --px-line:rgba(255,255,255,.09); --px-card:rgba(255,255,255,.035);
  --px-acc:#818CF8; --px-orbit:rgba(165,180,252,.16);
}

@keyframes pxSpin{to{transform:rotate(360deg)}}
@keyframes pxSpinRev{to{transform:rotate(-360deg)}}
@keyframes pxDrift{0%{transform:translate(0,0) scale(1)}33%{transform:translate(6%,-5%) scale(1.12)}66%{transform:translate(-5%,4%) scale(.94)}100%{transform:translate(0,0) scale(1)}}
@keyframes pxPulse{0%,100%{opacity:.4;transform:scale(1)}50%{opacity:1;transform:scale(1.5)}}
@keyframes pxCorona{0%,100%{transform:scale(1);opacity:.55}50%{transform:scale(1.14);opacity:.85}}
@keyframes pxHalo{0%{transform:scale(.8);opacity:.45}100%{transform:scale(1.6);opacity:0}}
@keyframes pxSheen{to{background-position:200% 50%}}
@keyframes pxBlink{0%,45%{opacity:1}50%,95%{opacity:0}}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001s!important;animation-iteration-count:1!important}
}

html.px-domov,html.px-domov body{margin:0;background:var(--px-bg)}
html.px-domov *{box-sizing:border-box}
.pxd{font-family:'IBM Plex Sans',system-ui,sans-serif;color:var(--px-ink);
  background:var(--px-bg);overflow-x:hidden}
.pxd a{color:#A5B4FC;text-decoration:none}
/* Karty, ktoré sú celé odkazom, nesmú nič podčiarkovať ani prebarvovať. */
a.pxd-card,a.pxd-tool,a.pxd-partner,a.pxd-card *,a.pxd-tool *,a.pxd-partner *{text-decoration:none}
.pxd a:hover{color:#C7D2FE}
.pxd button{font-family:inherit}
.pxd :focus-visible{outline:2px solid var(--px-acc);outline-offset:3px}
.pxd-skip{position:absolute;left:-9999px}
.pxd-skip:focus{left:16px;top:16px;z-index:99;padding:11px 15px;border-radius:10px;
  background:#4F46E5;color:#fff;font-weight:700;font-size:13.5px}
.pxd-shell{max-width:1200px;margin:0 auto}
.pxd-eyebrow{font:500 11.5px 'IBM Plex Mono',monospace;letter-spacing:.14em;
  color:var(--px-acc);margin-bottom:14px}
.pxd h2{font:600 clamp(28px,3.5vw,42px)/1.12 'Space Grotesk',sans-serif;
  letter-spacing:-.025em;margin:0 0 14px;color:#fff}
.pxd-sub{font:400 17px/1.6 'IBM Plex Sans',sans-serif;color:var(--px-dim2);margin:0 0 32px;max-width:36em}
.pxd section{padding:0 24px 100px}

/* ── hlavička ─────────────────────────────────────────────────────────── */
.pxd-header{position:sticky;top:0;z-index:60;background:rgba(7,9,15,.86);
  backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.07)}
.pxd-header-in{max-width:1200px;margin:0 auto;padding:0 24px;height:74px;
  display:flex;align-items:center;gap:14px}
.pxd-brand{display:flex;align-items:center;gap:12px;color:#fff;flex:0 0 auto}
.pxd-mark{position:relative;width:40px;height:40px;flex:0 0 auto;border-radius:11px;
  background:linear-gradient(150deg,#1E1B4B,#0B0E1C);border:1px solid rgba(129,140,248,.3);
  box-shadow:0 8px 22px rgba(30,27,75,.55);overflow:hidden;display:block}
.pxd-mark b{position:absolute;bottom:8px;border-radius:2px;display:block}
.pxd-mark b:nth-child(1){left:8px;width:6px;height:11px;background:#4338CA}
.pxd-mark b:nth-child(2){left:17px;width:6px;height:18px;background:#6366F1}
.pxd-mark b:nth-child(3){left:26px;width:6px;height:24px;background:linear-gradient(180deg,#C7D2FE,#818CF8)}
.pxd-word{display:flex;flex-direction:column;line-height:1}
.pxd-word b{font:700 20px 'Space Grotesk',sans-serif;letter-spacing:-.035em;color:#fff}
.pxd-word b i{font-style:normal;color:var(--px-acc)}
.pxd-word span{font:500 8.5px 'IBM Plex Mono',monospace;letter-spacing:.3em;
  color:var(--px-dim);margin-top:4px}
.pxd-nav{display:flex;align-items:center;gap:2px;flex:1 1 auto}
.pxd-nav a{font:500 14.5px 'IBM Plex Sans',sans-serif;color:var(--px-dim);
  padding:10px 13px;border-radius:9px;min-height:44px;display:flex;align-items:center;white-space:nowrap}
.pxd-nav a:hover{background:rgba(255,255,255,.07);color:#fff}
.pxd-head-act{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.pxd-login{font:500 14.5px 'IBM Plex Sans',sans-serif;color:var(--px-ink);
  padding:11px 14px;border-radius:10px;min-height:44px;display:flex;align-items:center;white-space:nowrap}
.pxd-login:hover{background:rgba(255,255,255,.06)}
.pxd-burger{display:none;width:44px;height:44px;flex:0 0 auto;border:1px solid rgba(255,255,255,.14);
  border-radius:10px;background:rgba(255,255,255,.05);cursor:pointer;
  flex-direction:column;align-items:center;justify-content:center;gap:4px}
.pxd-burger i{width:17px;height:1.8px;background:var(--px-ink);border-radius:2px;display:block}
@media (max-width:1000px){
  .pxd-nav,.pxd-login{display:none}
  .pxd-burger{display:flex}
  .pxd-nav.is-open{display:flex;position:absolute;left:0;right:0;top:74px;flex-direction:column;
    align-items:stretch;gap:2px;padding:14px;background:rgba(11,14,28,.98);
    border-bottom:1px solid var(--px-line);box-shadow:0 24px 60px rgba(0,0,0,.6)}
  .pxd-nav.is-open a{min-height:50px;font-size:15px}
}

.pxd-btn{display:inline-flex;align-items:center;justify-content:center;
  font:600 15.5px 'IBM Plex Sans',sans-serif;color:#fff;
  background:linear-gradient(135deg,#6366F1,#4F46E5);padding:16px 28px;border-radius:12px;
  box-shadow:0 14px 36px rgba(79,70,229,.45);transition:transform .2s,box-shadow .2s;white-space:nowrap}
.pxd-btn:hover{transform:translateY(-2px);box-shadow:0 20px 46px rgba(79,70,229,.62);color:#fff}
.pxd-btn.sm{font-size:14.5px;padding:12px 19px;box-shadow:0 8px 24px rgba(79,70,229,.4)}
.pxd-btn.ghost{background:transparent;color:var(--px-ink);border:1px solid rgba(255,255,255,.2);box-shadow:none}
.pxd-btn.ghost:hover{border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.05);
  transform:none;box-shadow:none;color:#fff}
.pxd-btn.light{background:#fff;color:#4338CA;box-shadow:0 14px 36px rgba(0,0,0,.3)}
.pxd-btn.light:hover{color:#4338CA}

/* ── hero ─────────────────────────────────────────────────────────────── */
.pxd section.pxd-hero{position:relative;padding:56px 24px 40px;overflow:hidden}
.pxd-glows{position:absolute;inset:-15% -10%;pointer-events:none;z-index:0}
.pxd-glows i{position:absolute;border-radius:50%;display:block;filter:blur(64px);
  animation:pxDrift 28s ease-in-out infinite}
.pxd-glows i:nth-child(1){left:0;top:6%;width:48%;height:62%;
  background:radial-gradient(circle,rgba(79,70,229,.3),transparent 68%)}
.pxd-glows i:nth-child(2){right:-4%;top:-4%;width:56%;height:76%;filter:blur(74px);
  background:radial-gradient(circle,rgba(99,102,241,.24),transparent 66%);
  animation:pxDrift 36s ease-in-out infinite reverse}
.pxd-hero-in{position:relative;z-index:1;max-width:1200px;margin:0 auto}
.pxd-badge{display:inline-flex;align-items:center;gap:9px;margin-bottom:22px;
  padding:8px 14px;border-radius:999px;border:1px solid rgba(129,140,248,.3);
  background:rgba(99,102,241,.1);font:500 12.5px 'IBM Plex Sans',sans-serif;color:#C7D2FE}
.pxd-badge u{text-decoration:none;position:relative;width:7px;height:7px;display:block}
.pxd-badge u i{position:absolute;inset:0;border-radius:50%;background:var(--px-acc);
  animation:pxPulse 2.4s ease-in-out infinite;display:block}
.pxd h1{font:700 clamp(40px,5.6vw,68px)/1.02 'Space Grotesk',sans-serif;
  letter-spacing:-.035em;margin:0 0 22px;text-wrap:balance;color:#fff;max-width:18em}
.pxd h1 span{background:linear-gradient(100deg,#818CF8,#E0E7FF 28%,#818CF8 58%,#E0E7FF 88%);
  background-size:200% auto;-webkit-background-clip:text;background-clip:text;
  color:transparent;animation:pxSheen 7s linear infinite}
.pxd-lead{font:400 18.5px/1.62 'IBM Plex Sans',sans-serif;color:var(--px-dim);
  margin:0 0 34px;max-width:29em}
.pxd-acts{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:16px}
.pxd-fine{font:400 13.5px/1.55 'IBM Plex Sans',sans-serif;color:#8A93A6;margin:0;max-width:34em}

/* ── slnečná sústava ──────────────────────────────────────────────────── */
.px-sus{margin:44px 0 0}
.px-sus-head{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:170px}
.px-sus-zostavy{display:flex;flex-wrap:wrap;gap:7px;flex:1 1 auto}
.px-sus-zostavy button{min-height:44px;padding:0 16px;border-radius:999px;cursor:pointer;
  border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);
  font:600 13.5px 'IBM Plex Sans',sans-serif;color:#C3CAD8;transition:.16s}
.px-sus-zostavy button:hover{border-color:rgba(129,140,248,.45);color:#fff}
.px-sus-zostavy button.is-on{background:rgba(99,102,241,.18);border-color:rgba(129,140,248,.6);color:#fff}
.px-sus-pohlad{display:flex;gap:2px;padding:3px;border:1px solid rgba(255,255,255,.12);
  border-radius:11px;background:rgba(255,255,255,.03)}
.px-sus-pohlad button{min-height:38px;padding:0 14px;border:0;border-radius:8px;
  background:transparent;cursor:pointer;font:600 12.5px 'IBM Plex Sans',sans-serif;color:var(--px-dim)}
.px-sus-pohlad button.is-on{background:rgba(99,102,241,.22);color:#fff}

.px-sus-stage{position:relative;width:100%;max-width:940px;margin:0 auto;overflow:visible}
.px-sus-box{position:absolute;top:0;left:0;width:1360px;height:1360px;transform-origin:top left}
.px-sus[data-pohlad="table"] .px-sus-stage,
.px-sus[data-pohlad="table"] .px-sus-legend{display:none}
.px-sus[data-pohlad="orbit"] .px-sus-zoznam{display:none}

.px-sus-sun{border:0;cursor:pointer;border-radius:50%;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:9px;padding:0 10px;
  transition:transform .2s,box-shadow .2s}
.px-sus-sun:hover{transform:scale(1.05)}
.px-sus-sun-txt{display:block;text-align:center;line-height:1.15;
  padding:12px 22px;border-radius:14px;background:rgba(9,12,26,.62);
  border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(3px)}
.px-sus-sun-txt em{display:block;font-style:normal;font:600 22px 'IBM Plex Mono',monospace;
  letter-spacing:.2em;color:#C7D2FE}
.px-sus-sun-txt b{display:block;font:700 30px 'Space Grotesk',sans-serif;letter-spacing:-.02em;
  color:#fff;margin-top:7px;text-shadow:0 1px 8px rgba(30,27,75,.8)}

.px-sus-mark{position:relative;width:46px;height:46px;border-radius:13px;
  background:linear-gradient(150deg,#1E1B4B,#0B0E1C);border:1px solid rgba(129,140,248,.4);
  display:block;overflow:hidden}
.px-sus-mark b{position:absolute;bottom:13px;border-radius:3px;display:block}
.px-sus-mark b{bottom:9px}
.px-sus-mark b:nth-child(1){left:9px;width:6px;height:12px;background:#4338CA}
.px-sus-mark b:nth-child(2){left:19px;width:6px;height:20px;background:#6366F1}
.px-sus-mark b:nth-child(3){left:29px;width:6px;height:27px;background:linear-gradient(180deg,#C7D2FE,#818CF8)}

.px-sus-planet{position:absolute;border:0;border-radius:50%;cursor:pointer;padding:0;
  transition:transform .2s,box-shadow .2s}
/* Priblíženie: planéta sa nadýchne a rozsvieti, kým sa scéna vymení. */
/* Rozsah, ktorý práve pribudol do zostavy, krátko zasvieti. */
.px-sus-planet.je-nova{animation:pxSusNew 1.1s ease-out 1}
@keyframes pxSusNew{0%{box-shadow:0 0 0 0 rgba(199,210,254,.7)}
  60%{box-shadow:0 0 0 16px rgba(199,210,254,0)}100%{box-shadow:0 0 0 0 rgba(199,210,254,0)}}
/* Výmena prehľad ↔ zoom. */
.px-sus-zoom{position:absolute;inset:0;will-change:transform}
.px-sus-klon{border-radius:50%;overflow:hidden;pointer-events:none;z-index:500;
  transform-origin:center center;will-change:transform}
/* Mesiace v zoome prilietajú postupne, s miernym posunom nahor pri dosadnutí —
   nie iba náhle zväčšenie na mieste. */
@keyframes pxSusMoon{
  from{opacity:0;transform:translate(-50%,-42%) scale(.4)}
  70%{opacity:1}
  to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
/* Prvý príchod: celá sústava sa rozvinie od slnka. */
.px-sus-stage.je-prichod .px-sus-box{opacity:0;transform-origin:center;
  transform:scale(.72) !important}
.px-sus-stage .px-sus-box{transition:opacity .7s ease-out,transform .9s cubic-bezier(.2,.8,.2,1)}
/* Pri prejdení kurzorom sa planéta aj jej popis zdvojnásobia. Používa sa
   vlastnosť `scale`, nie `transform` — popis má transform nastavený z JS
   (poloha okolo planéty), takže by sa navzájom prepisovali. */
.px-sus-planet{transition:scale .2s ease-out,box-shadow .2s}
.px-sus-planet:hover{scale:2;box-shadow:0 0 0 6px rgba(199,210,254,.16),
  0 0 34px currentColor;z-index:9}
.px-sus-label{transition:scale .2s ease-out}
.px-sus-planet:hover ~ .px-sus-label{scale:2;z-index:10}
/* Popis planéty má vlastnú podložku — planéty sa pri obehu prekrývajú
   a bez nej názov zmizol v telese tej za ním. */
.px-sus-label{z-index:8;padding:7px 12px;border-radius:10px;
  background:rgba(7,9,15,.88);border:1px solid rgba(255,255,255,.14);
  box-shadow:0 6px 20px rgba(0,0,0,.55)}
.px-sus-label.is-in{border-color:rgba(129,140,248,.45);background:rgba(9,12,26,.92)}
.px-sus-label.is-vsere{background:transparent;border:0;box-shadow:none;padding:0;
  text-shadow:0 1px 6px rgba(0,0,0,.7),0 0 10px rgba(0,0,0,.5)}
.px-sus-label.is-vsere b{font-size:13px}
.px-sus-label b{display:block;font:700 30px 'Space Grotesk',sans-serif}
.px-sus-label em{display:block;font-style:normal;font:500 19px 'IBM Plex Mono',monospace;
  color:#A9B2C3;margin-top:5px}
.px-sus-focus-title b{display:block;font:600 26px 'Space Grotesk',sans-serif;
  letter-spacing:-.02em;color:#fff;text-shadow:0 1px 12px #07090F}

.px-sus-focus-title em{display:block;font-style:normal;font:400 14px 'IBM Plex Sans',sans-serif;
  color:var(--px-dim);margin-top:6px}
.px-sus-moon{display:flex;flex-direction:column;align-items:center;gap:8px;
  transition:scale .2s ease-out}
.px-sus-moon:hover{scale:2;z-index:10}
.px-sus-moon-body{position:relative;display:block;border-radius:50%}
.px-sus-moon-label{white-space:nowrap;font:600 26px 'IBM Plex Sans',sans-serif;color:var(--px-ink);
  background:rgba(7,9,15,.84);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:9px 18px}
.px-sus-moon:hover .px-sus-moon-label{color:#fff;background:rgba(99,102,241,.3)}
.px-sus-close{display:block;margin:14px auto 0;z-index:9;
  min-height:44px;padding:0 18px;border-radius:11px;cursor:pointer;
  border:1px solid rgba(255,255,255,.2);background:rgba(7,9,15,.85);
  font:600 13.5px 'IBM Plex Sans',sans-serif;color:var(--px-ink)}
.px-sus-close:hover{border-color:rgba(129,140,248,.6);color:#fff}
.px-sus-legend{font:400 14px/1.7 'IBM Plex Sans',sans-serif;color:var(--px-dim);
  text-align:center;margin:10px 0 0;animation:pxSusFade .56s cubic-bezier(.16,1,.3,1) .12s backwards}
@keyframes pxSusFade{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
/* Čistý nábeh priehľadnosti — bez transformu, aby neprepisoval vlastnú
   pozíciu/rotáciu prvku (titulok má translate, prstenec má rotate).
   Predošlá verzia animovala aj transform na "none", čím na konci prvok
   na zlomok sekundy stratil svoju polohu a potom "doskočil" na miesto. */
@keyframes pxSusFadeIn{from{opacity:0}to{opacity:1}}
.px-sus-close{animation:pxSusFade .5s cubic-bezier(.16,1,.3,1) .22s backwards}
.px-sus-legend b{color:#fff}
.px-sus-zoznam{margin-top:8px}

/* ── zoznam nástrojov (základ pre SEO aj pohľad „Zoznam") ─────────────── */
.px-tools{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px 26px}
.px-tools>div{min-width:0}
.px-tools b{display:block;font:600 11px 'IBM Plex Mono',monospace;letter-spacing:.12em;
  text-transform:uppercase;color:#8A93A6;padding-bottom:9px;margin-bottom:9px;
  border-bottom:1px solid var(--px-line)}
.px-tools a{display:block;padding:7px 0;font:500 14px 'IBM Plex Sans',sans-serif;color:#C7D2FE}
.px-tools a:hover{color:#fff}

/* ── karty ────────────────────────────────────────────────────────────── */
.pxd-grid{display:grid;gap:14px}
.pxd-grid.g3{grid-template-columns:repeat(auto-fit,minmax(262px,1fr))}
.pxd-grid.g4{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.pxd-card{background:var(--px-card);border:1px solid var(--px-line);border-radius:18px;
  padding:22px;transition:.2s;min-width:0}
a.pxd-card:hover{border-color:rgba(129,140,248,.45);transform:translateY(-3px)}
.pxd-card h3{font:600 18px 'Space Grotesk',sans-serif;color:#fff;margin:0 0 8px}
.pxd-card p{font:400 14.5px/1.6 'IBM Plex Sans',sans-serif;color:var(--px-dim);margin:0}

/* ── produkt / záber ──────────────────────────────────────────────────── */
.pxd-shot{border-radius:22px;overflow:hidden;border:1px solid rgba(255,255,255,.1);
  background:linear-gradient(180deg,#0E1421,#0A0E18);box-shadow:0 40px 100px rgba(0,0,0,.55)}
.pxd-shot img{display:block;width:100%;height:auto}
.pxd-shot figcaption{padding:18px 22px;border-top:1px solid var(--px-line);
  font:400 14px/1.6 'IBM Plex Sans',sans-serif;color:var(--px-dim)}
.pxd-shots{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin-top:16px}

/* ── VIXI ─────────────────────────────────────────────────────────────── */
.pxd-vixi{position:relative;max-width:1200px;margin:0 auto;border-radius:24px;
  padding:clamp(30px,4vw,58px);background:linear-gradient(140deg,#171B3A,#0D1020 62%);
  border:1px solid rgba(129,140,248,.22);overflow:hidden}
.pxd-vixi>i{position:absolute;right:-8%;top:-30%;width:46%;height:150%;border-radius:50%;
  background:radial-gradient(circle,rgba(99,102,241,.26),transparent 65%);filter:blur(54px);
  animation:pxDrift 30s ease-in-out infinite;display:block}
.pxd-vixi-in{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:46px;align-items:center}
.pxd-vixi-list{display:flex;flex-direction:column;gap:11px}
.pxd-vixi-list div{display:flex;gap:12px;align-items:baseline}
.pxd-vixi-list em{font-style:normal;color:var(--px-acc);font:500 14px 'IBM Plex Mono',monospace}
.pxd-vixi-list span{font:400 15px/1.5 'IBM Plex Sans',sans-serif;color:#C6CCDA}
.pxd-chat{background:rgba(7,9,15,.72);border:1px solid rgba(255,255,255,.12);
  border-radius:18px;padding:24px;backdrop-filter:blur(10px);min-width:0}
.pxd-chat-lab{font:400 11.5px 'IBM Plex Mono',monospace;color:#8A93A6;letter-spacing:.1em;margin-bottom:12px}
.pxd-chat-you{font:400 16px/1.55 'IBM Plex Sans',sans-serif;color:#fff;
  background:linear-gradient(135deg,#312E81,#1E1B4B);border:1px solid rgba(129,140,248,.28);
  border-radius:13px;padding:15px 17px;margin-bottom:22px;min-height:3.1em}
.pxd-caret{display:inline-block;width:2px;height:1.05em;background:#A5B4FC;
  vertical-align:text-bottom;margin-left:2px;animation:pxBlink 1.1s step-end infinite}
.pxd-draft{border:1px solid rgba(255,255,255,.1);border-radius:13px;overflow:hidden}
.pxd-draft div{padding:14px 16px;display:flex;justify-content:space-between;gap:12px}
.pxd-draft div+div{border-top:1px solid rgba(255,255,255,.08)}
.pxd-draft span:first-child{font:400 14px 'IBM Plex Sans',sans-serif;color:#7C8599}
.pxd-draft span:last-child{font:500 14px 'IBM Plex Sans',sans-serif;color:#fff}
.pxd-draft-act{display:flex;gap:10px;margin-top:18px;align-items:center}
.pxd-draft-act b{font:600 13.5px 'IBM Plex Sans',sans-serif;color:#fff;
  background:linear-gradient(135deg,#6366F1,#4F46E5);padding:11px 18px;border-radius:10px}
.pxd-draft-act span{font:500 13.5px 'IBM Plex Sans',sans-serif;color:#7C8599;padding:11px 10px}

/* ── štítky dôvery v hero ─────────────────────────────────────────────── */
.pxd-chips-row{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}
.pxd-chips-row span{font:500 12px 'IBM Plex Sans',sans-serif;color:#C3CAD8;
  border:1px solid var(--px-line);border-radius:999px;padding:7px 13px;background:rgba(255,255,255,.03)}

/* ── bez PLEVIXu / s PLEVIXom ─────────────────────────────────────────── */
.pxd-vs{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;margin-top:8px}
.pxd-vs>div{border:1px solid var(--px-line);border-radius:18px;padding:22px;background:var(--px-card)}
.pxd-vs-bad{border-color:rgba(248,113,113,.26)!important;background:rgba(248,113,113,.05)!important}
.pxd-vs-good{border-color:rgba(110,231,183,.3)!important;background:rgba(110,231,183,.05)!important}
.pxd-vs b{display:block;font:600 15px 'Space Grotesk',sans-serif;margin-bottom:14px}
.pxd-vs-bad b{color:#FCA5A5}
.pxd-vs-good b{color:#6EE7B7}
.pxd-vs ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:11px}
.pxd-vs li{position:relative;padding-left:22px;font:400 14.5px/1.6 'IBM Plex Sans',sans-serif;color:var(--px-dim)}
.pxd-vs li:before{position:absolute;left:0;top:0;font:600 14px 'IBM Plex Mono',monospace}
.pxd-vs-bad li:before{content:"−";color:#F87171}
.pxd-vs-good li:before{content:"+";color:#34D399}

/* ── stav dostupnosti ─────────────────────────────────────────────────── */
.pxd-state{display:inline-flex;align-items:center;gap:7px;margin-bottom:12px;
  font:600 10px 'IBM Plex Mono',monospace;letter-spacing:.1em;
  border:1px solid currentColor;border-radius:6px;padding:4px 8px}
.pxd-state.ok{color:#6EE7B7}
.pxd-state.beta{color:#FCD34D}
.pxd-state.wait{color:#8A93A6}
.pxd-card a{display:inline-block;margin-top:12px;font:600 13.5px 'IBM Plex Sans',sans-serif}

/* ── dva bloky vedľa seba ─────────────────────────────────────────────── */
.pxd-two{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px}

/* ── filter a mriežka nástrojov ───────────────────────────────────────── */
.pxd-filter{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:26px}
.pxd-filter button{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;
  border-radius:999px;cursor:pointer;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);font:600 13.5px 'IBM Plex Sans',sans-serif;color:#C3CAD8;
  transition:border-color .16s,background .16s,color .16s}
.pxd-filter button em{font-style:normal;font:500 11.5px 'IBM Plex Mono',monospace;color:#7B8598}
.pxd-filter button:hover{border-color:rgba(129,140,248,.45);color:#fff}
.pxd-filter button.is-on{background:rgba(99,102,241,.18);border-color:rgba(129,140,248,.6);color:#fff}
.pxd-filter button.is-on em{color:#C7D2FE}

.pxd-tools{display:grid;grid-template-columns:repeat(auto-fill,minmax(248px,1fr));gap:12px}
.pxd-tool{position:relative;display:flex;flex-direction:column;gap:7px;overflow:hidden;
  padding:20px 20px 18px;border-radius:16px;text-decoration:none;
  border:1px solid var(--px-line);background:var(--px-card);
  transition:transform .16s,border-color .16s,background .16s}
.pxd-tool:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:var(--k);opacity:.55;transition:opacity .16s,width .16s}
.pxd-tool:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--k) 55%,transparent);
  background:color-mix(in srgb,var(--k) 9%,rgba(255,255,255,.035))}
.pxd-tool:hover:before{opacity:1;width:4px}
@keyframes pxdCardIn{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
.pxd-tool[data-pxd-kat="peniaze"]{--k:#818CF8}
.pxd-tool[data-pxd-kat="zakazky"]{--k:#F472B6}
.pxd-tool[data-pxd-kat="teren"]{--k:#38BDF8}
.pxd-tool[data-pxd-kat="sklad"]{--k:#A78BFA}
.pxd-tool[data-pxd-kat="ludia"]{--k:#F59E0B}
.pxd-tool[data-pxd-kat="dokumenty"]{--k:#34D399}
.pxd-tool-top{display:flex;flex-wrap:wrap;gap:9px;align-items:center}
.pxd-tool-top b{flex:1 1 auto;min-width:0;font:600 16.5px 'Space Grotesk',sans-serif;
  letter-spacing:-.015em;color:#fff}
.pxd-tool-note{font:400 14px/1.55 'IBM Plex Sans',sans-serif;color:var(--px-dim);flex:1 1 auto}
.pxd-tool-go{display:inline-flex;align-items:center;gap:7px;margin-top:2px;
  font:600 13px 'IBM Plex Sans',sans-serif;color:color-mix(in srgb,var(--k) 78%,#fff);
  opacity:0;transform:translateY(4px);transition:opacity .16s,transform .16s}
.pxd-tool-go i{font-style:normal;transition:transform .16s}
.pxd-tool:hover .pxd-tool-go{opacity:1;transform:none}
.pxd-tool:hover .pxd-tool-go i{transform:translateX(3px)}
.pxd-tool.is-hero{grid-column:span 2;padding:26px 24px 22px}
.pxd-tool.is-hero .pxd-tool-top b{font-size:22px}
.pxd-tool.is-hero .pxd-tool-note{font-size:15px}
@media (max-width:560px){.pxd-tool.is-hero{grid-column:span 1;padding:20px 20px 18px}}

.pxd-tag{font:600 10px 'IBM Plex Mono',monospace;letter-spacing:.1em;white-space:nowrap;
  border:1px solid currentColor;border-radius:6px;padding:3px 7px;font-style:normal;opacity:.9}
.pxd-tag.t-LIVE{color:#6EE7B7}
.pxd-tag.t-AI{color:#C4B5FD}
.pxd-tag.t-ÚČTO{color:#93C5FD}
.pxd-tag.t-PREMIUM{color:#FCD34D}
.pxd-tag.t-NOVINKA{color:#F0ABFC}
.pxd-tag.t-ZADARMO,.pxd-tag.t-VCENE{color:#86EFAC}

/* ── pracovný tok ─────────────────────────────────────────────────────── */
.pxd-flow{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:12px}
.pxd-flow>div{background:var(--px-card);border:1px solid var(--px-line);border-radius:15px;padding:18px}
.pxd-flow em{display:block;font-style:normal;font:500 11.5px 'IBM Plex Mono',monospace;
  color:var(--px-acc);margin-bottom:10px}
.pxd-flow b{display:block;font:600 15px 'Space Grotesk',sans-serif;color:#fff;margin-bottom:5px}
.pxd-flow span{font:400 12.5px/1.5 'IBM Plex Sans',sans-serif;color:#8A93A6}

/* ── FAQ ──────────────────────────────────────────────────────────────── */
.pxd-faq{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:44px}
.pxd-faq-list{display:flex;flex-direction:column;gap:10px;min-width:0}
.pxd-q{background:var(--px-card);border:1px solid var(--px-line);border-radius:14px;
  padding:0;cursor:pointer;transition:.18s;width:100%;text-align:left}
.pxd-q.is-open{background:rgba(99,102,241,.1);border-color:rgba(129,140,248,.4)}
.pxd-q>span{display:flex;gap:14px;align-items:baseline;padding:18px 20px}
.pxd-q b{flex:1 1 auto;font:600 15.5px/1.4 'IBM Plex Sans',sans-serif;color:#fff}
.pxd-q i{flex:0 0 auto;font-style:normal;font:400 20px 'IBM Plex Sans',sans-serif;
  color:var(--px-acc);transition:transform .2s}
.pxd-q.is-open i{transform:rotate(45deg)}
.pxd-q p{margin:0;padding:0 20px 18px;font:400 14.5px/1.65 'IBM Plex Sans',sans-serif;color:var(--px-dim)}

/* ── cenník blok ──────────────────────────────────────────────────────── */
.pxd-price{position:relative;max-width:1200px;margin:0 auto;border-radius:24px;
  padding:clamp(34px,4.4vw,64px);background:linear-gradient(135deg,#1E1B4B,#0C1020 65%);
  border:1px solid rgba(129,140,248,.24);overflow:hidden;text-align:center}
.pxd-price>i{position:absolute;left:50%;top:-60%;width:70%;height:170%;margin-left:-35%;
  border-radius:50%;background:radial-gradient(circle,rgba(99,102,241,.26),transparent 62%);
  filter:blur(60px);animation:pxDrift 32s ease-in-out infinite;display:block}
.pxd-price-in{position:relative}
.pxd-price h2{max-width:16em;margin-inline:auto}
.pxd-price p{font:400 17px/1.6 'IBM Plex Sans',sans-serif;color:#A3ABBF;margin:0 auto 30px;max-width:32em}
.pxd-price-acts{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}

/* ── partneri ─────────────────────────────────────────────────────────── */
.pxd-partners{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px}
.pxd-partner{display:flex;flex-direction:column;background:var(--px-card);
  border:1px solid var(--px-line);border-radius:18px;overflow:hidden;transition:.2s}
.pxd-partner:hover{border-color:rgba(129,140,248,.45);transform:translateY(-3px)}
.pxd-partner-logo{height:132px;display:grid;place-items:center;padding:22px}
.pxd-partner-logo img{display:block;width:auto;height:auto;max-width:212px;max-height:88px}
.pxd-partner-body{padding:22px}
.pxd-partner-head{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.pxd-partner-head b{flex:1 1 auto;font:600 18px 'Space Grotesk',sans-serif;color:#fff}
.pxd-tag{font:500 10.5px 'IBM Plex Mono',monospace;letter-spacing:.1em;
  border:1px solid rgba(199,210,254,.3);border-radius:6px;padding:3px 7px;
  color:#C7D2FE;white-space:nowrap}
.pxd-tag.ok{color:#6EE7B7;border-color:rgba(110,231,183,.32)}
.pxd-partner-body .pxd-p{display:block;font:400 14.5px/1.6 'IBM Plex Sans',sans-serif;
  color:var(--px-dim);margin:0 0 14px}
.pxd-partner-body>span{font:600 14px 'IBM Plex Sans',sans-serif;color:#A5B4FC}
.pxd-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.pxd-chips span{font:500 11px 'IBM Plex Mono',monospace;color:#C7D2FE;
  background:rgba(99,102,241,.12);border:1px solid rgba(129,140,248,.26);
  border-radius:6px;padding:4px 8px}
.pxd-money{margin-top:16px;background:linear-gradient(140deg,rgba(99,102,241,.13),rgba(255,255,255,.03));
  border:1px solid rgba(129,140,248,.28);border-radius:18px;padding:26px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:28px;align-items:center}
.pxd-money h3{font:600 22px/1.25 'Space Grotesk',sans-serif;letter-spacing:-.015em;color:#fff;margin:0 0 12px}
.pxd-money p{font:400 14.5px/1.65 'IBM Plex Sans',sans-serif;color:var(--px-dim);margin:0}

/* ── pätička ──────────────────────────────────────────────────────────── */
.pxd-footer{border-top:1px solid rgba(255,255,255,.08);padding:56px 24px 40px}
.pxd-footer-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:36px;margin-bottom:44px}
.pxd-footer-id{min-width:0}
.pxd-footer-id p{font:400 13.5px/1.6 'IBM Plex Sans',sans-serif;color:#8A93A6;margin:16px 0}
.pxd-footer-id a{display:block;font:400 13.5px 'IBM Plex Sans',sans-serif;color:var(--px-dim);margin-bottom:7px}
.pxd-footer-col b{display:block;font:500 11.5px 'IBM Plex Mono',monospace;letter-spacing:.12em;
  color:#8A93A6;margin-bottom:14px}
.pxd-footer-col a{display:block;font:400 14px 'IBM Plex Sans',sans-serif;color:var(--px-dim);
  margin-bottom:9px}
.pxd-footer-col a:hover{color:#fff}
.pxd-footer-bar{border-top:1px solid rgba(255,255,255,.07);padding-top:24px;
  display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;
  font:400 13px 'IBM Plex Sans',sans-serif;color:#8A93A6}
.pxd-footer-bar div{display:flex;flex-wrap:wrap;gap:18px}
.pxd-footer-bar a{color:#8A93A6}
.pxd-footer-bar a:hover{color:#fff}

@media (max-width:640px){
  .pxd section{padding:0 20px 72px}
  .pxd section.pxd-hero{padding:36px 20px 32px}
  .pxd-btn{width:100%}
  .px-sus-legend{text-align:left}
}

/* ── zoznam nástrojov (pohľad „Zoznam") ──────────────────────────────── */
.px-sus-zoznam .px-tools{grid-template-columns:repeat(auto-fill,minmax(268px,1fr));gap:18px 20px}
.px-sus-zoznam .px-tools b{color:#C7D2FE;border-bottom-color:rgba(129,140,248,.25)}
.px-tool-riadok{position:relative;display:flex!important;align-items:center;gap:10px;
  padding:13px 14px!important;margin-bottom:7px;border-radius:13px;overflow:hidden;
  border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.035);
  font-weight:600!important;color:#EEF1F7!important;
  transition:transform .16s,border-color .16s,background .16s,opacity .2s}
.px-tool-riadok:before{content:"";width:9px;height:9px;flex:0 0 auto;border-radius:50%;
  background:var(--k);box-shadow:0 0 10px var(--k)}
.px-tool-riadok:after{content:"→";margin-left:auto;font:600 15px 'IBM Plex Sans',sans-serif;
  color:var(--k);opacity:0;transform:translateX(-4px);transition:opacity .16s,transform .16s}
.px-tool-riadok:hover{transform:translateY(-2px);color:#fff!important;
  border-color:color-mix(in srgb,var(--k) 60%,transparent);
  background:color-mix(in srgb,var(--k) 12%,rgba(255,255,255,.04))}
.px-tool-riadok:hover:after{opacity:1;transform:none}
.px-tool-tag{font:500 10px 'IBM Plex Mono',monospace;letter-spacing:.09em;text-transform:uppercase;
  color:#98A2B8;border:1px solid rgba(255,255,255,.14);border-radius:6px;padding:3px 7px;white-space:nowrap}
.px-tool-riadok.je-v-zostave{border-color:color-mix(in srgb,var(--k) 45%,transparent);
  background:color-mix(in srgb,var(--k) 10%,rgba(255,255,255,.035))}
.px-tool-riadok.je-v-zostave .px-tool-tag{color:color-mix(in srgb,var(--k) 75%,#fff);
  border-color:color-mix(in srgb,var(--k) 45%,transparent)}
.px-tool-riadok.je-mimo{opacity:.45}
.px-tool-riadok.je-mimo:hover{opacity:1}