/* hernidumarena.cz — DARK GAME-HUB / ARÉNA. Oxanium (display) + Overpass (body). */
:root{
  --bg:#0c0e13; --bg2:#12151d; --panel:#161a24; --panel2:#1c2130;
  --line:#262c3b; --line2:#333b50;
  --tx:#eef1f7; --tx-mut:#9aa3b8; --tx-dim:#6f7891;
  --viol:#7c4dff; --viol-2:#9b76ff; --cyan:#25d6e6; --cyan-2:#5fe6f2;
  --ok:#37d67a; --bad:#ff5470; --warn:#ffb020;
  --ribbon:#ff3d6e;
  --r:14px; --r-s:10px; --r-xs:7px;
  --glow:0 0 0 1px rgba(124,77,255,.35), 0 8px 30px -8px rgba(124,77,255,.45);
  --shadow:0 12px 34px -14px rgba(0,0,0,.75);
  --wrap:1240px;
  --fx:'Oxanium',system-ui,sans-serif;
  --ft:'Overpass',system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--tx);font-family:var(--ft);font-size:15px;line-height:1.55;
  background-image:radial-gradient(1200px 600px at 80% -10%,rgba(124,77,255,.10),transparent 60%),radial-gradient(900px 500px at 0% 0%,rgba(37,214,230,.06),transparent 55%);
  background-attachment:fixed;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3,h4{font-family:var(--fx);font-weight:700;line-height:1.1;margin:0}
button{font-family:inherit;cursor:pointer}
[hidden]{display:none!important}
.hda-skip{position:absolute;left:-9999px;top:0;background:var(--viol);color:#fff;padding:8px 14px;border-radius:0 0 8px 0;z-index:200}
.hda-skip:focus{left:0}

/* ============ HEADER — JEDNA hustá tmavá lišta, vše inline ============ */
.hda-bar{position:sticky;top:0;z-index:120;background:rgba(10,12,17,.86);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);box-shadow:0 1px 0 rgba(124,77,255,.14),0 10px 30px -20px #000}
.hda-bar__in{max-width:var(--wrap);margin:0 auto;padding:0 20px;height:62px;display:flex;align-items:center;gap:18px}
.hda-logo{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.hda-logo__mark{width:34px;height:34px;color:var(--cyan);filter:drop-shadow(0 0 6px rgba(37,214,230,.6))}
.hda-logo__mark svg{width:100%;height:100%;fill:var(--cyan)}
.hda-logo__txt{font-family:var(--fx);font-weight:800;font-size:19px;letter-spacing:.3px;line-height:1}
.hda-logo__txt span{color:var(--tx-mut);font-weight:600}
.hda-logo__txt b{color:var(--viol-2)}
.hda-nav{display:flex;align-items:center;gap:4px;flex:0 1 auto}
.hda-nav a{font-family:var(--fx);font-weight:600;font-size:13.5px;letter-spacing:.4px;text-transform:uppercase;
  color:var(--tx-mut);padding:9px 12px;border-radius:var(--r-xs);white-space:nowrap;transition:.15s}
.hda-nav a:hover{color:var(--tx);background:var(--panel)}
.hda-nav a[aria-current]{color:var(--cyan);background:rgba(37,214,230,.08)}
.hda-util{display:flex;align-items:center;gap:2px;flex:0 0 auto}
.hda-util a{font-size:12px;color:var(--tx-dim);padding:6px 8px;border-radius:var(--r-xs);white-space:nowrap;transition:.15s}
.hda-util a:hover{color:var(--cyan);background:var(--panel)}
@media(max-width:1160px){.hda-util{display:none}}
.hda-hledej{flex:1 1 auto;min-width:120px;max-width:340px;margin-left:auto;display:flex;align-items:center;
  background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:0 4px 0 14px;height:38px;transition:.15s}
.hda-hledej:focus-within{border-color:var(--viol);box-shadow:0 0 0 3px rgba(124,77,255,.18)}
.hda-hledej input{flex:1;background:none;border:0;color:var(--tx);font-size:13.5px;outline:none;min-width:0}
.hda-hledej input::placeholder{color:var(--tx-dim)}
.hda-hledej button{width:30px;height:30px;border:0;border-radius:999px;background:var(--viol);color:#fff;display:grid;place-items:center}
.hda-hledej svg{width:16px;height:16px}
.hda-akce{display:flex;align-items:center;gap:6px;flex:0 0 auto}
.hda-ikona{position:relative;width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);
  border-radius:var(--r-xs);background:var(--panel);color:var(--tx);transition:.15s}
.hda-ikona:hover{border-color:var(--viol);color:var(--viol-2)}
.hda-ikona svg{width:20px;height:20px}
.hda-ikona--kosik:hover{border-color:var(--cyan);color:var(--cyan)}
.hda-odznak{position:absolute;top:-6px;right:-6px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;
  background:var(--viol);color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center;line-height:1;font-family:var(--fx)}
.hda-odznak:empty{display:none}
.hda-odznak--kosik{background:var(--cyan);color:#04222a}
.hda-ikona--menu{display:none}

/* ============ LAYOUT ============ */
main{max-width:var(--wrap);margin:0 auto;padding:26px 20px 70px;min-height:60vh}
.hda-h1{font-family:var(--fx);font-weight:800;font-size:clamp(26px,4vw,38px);letter-spacing:.4px;text-transform:uppercase}
.hda-h2{font-family:var(--fx);font-weight:800;font-size:clamp(20px,2.6vw,26px);letter-spacing:.4px;text-transform:uppercase}
.hda-pocet{color:var(--cyan);font-size:.55em;vertical-align:middle}
.hda-drobky{font-size:12.5px;color:var(--tx-dim);margin-bottom:8px;letter-spacing:.3px}
.hda-drobky a{color:var(--tx-mut)}.hda-drobky a:hover{color:var(--cyan)}

/* ---- buttons ---- */
.hda-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--fx);font-weight:700;
  letter-spacing:.5px;text-transform:uppercase;font-size:13px;border:1px solid var(--line2);background:var(--panel);
  color:var(--tx);padding:11px 18px;border-radius:var(--r-s);transition:.15s}
.hda-btn:hover{border-color:var(--viol);color:#fff}
.hda-btn--plny{background:linear-gradient(135deg,var(--viol),#5a34d6);border-color:transparent;color:#fff;box-shadow:0 8px 24px -10px rgba(124,77,255,.7)}
.hda-btn--plny:hover{filter:brightness(1.08);color:#fff}
.hda-btn--ghost{background:transparent}
.hda-btn--velky{padding:14px 26px;font-size:14px}
.hda-btn--filtr svg{width:18px;height:18px}
.hda-btn--srdce{width:46px;padding:0;flex:0 0 auto}
.hda-btn--srdce svg{width:20px;height:20px}
.hda-btn--srdce.je-aktiv{color:var(--ribbon);border-color:var(--ribbon)}

/* ============ HERO ============ */
.hda-hero{position:relative;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-bottom:34px;
  background:linear-gradient(120deg,#141726,#0e1017 60%);padding:clamp(30px,6vw,64px)}
.hda-hero::after{content:"";position:absolute;inset:0;background:radial-gradient(600px 300px at 90% 20%,rgba(37,214,230,.14),transparent 60%);pointer-events:none}
.hda-hero__in{position:relative;z-index:2;max-width:640px}
/* hero s fotkou na pozadí */
.hda-hero--foto{padding:clamp(34px,6vw,72px)}
.hda-hero__poz{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.28;z-index:0}
.hda-hero--foto::after{z-index:1;background:linear-gradient(90deg,rgba(12,14,19,.95) 30%,rgba(12,14,19,.55) 70%,transparent),radial-gradient(700px 340px at 92% 10%,rgba(124,77,255,.28),transparent 60%)}
.hda-hero__cisla{list-style:none;display:flex;gap:26px;flex-wrap:wrap;margin:26px 0 0;padding:0}
.hda-hero__cisla li{display:flex;flex-direction:column}
.hda-hero__cisla b{font-family:var(--fx);font-weight:800;font-size:24px;color:var(--cyan);line-height:1}
.hda-hero__cisla span{font-size:12px;color:var(--tx-mut);letter-spacing:.3px;margin-top:3px}
.hda-hero__odznak{display:inline-block;font-family:var(--fx);font-weight:700;font-size:12px;letter-spacing:1.4px;text-transform:uppercase;
  color:var(--cyan);border:1px solid rgba(37,214,230,.4);border-radius:999px;padding:5px 12px;margin-bottom:16px}
.hda-hero__titul{font-size:clamp(30px,5vw,52px);text-transform:uppercase;letter-spacing:.5px;margin-bottom:14px}
.hda-hero__titul span{color:var(--viol-2)}
.hda-hero__text{color:var(--tx-mut);font-size:16px;max-width:520px;margin-bottom:22px}
.hda-hero__akce{display:flex;gap:12px;flex-wrap:wrap}

/* ============ PÁSY na hlavní ============ */
.hda-pas{margin:38px 0}
.hda-pas__hlava{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:16px;border-bottom:1px solid var(--line);padding-bottom:10px}
.hda-pas__hlava a{font-family:var(--fx);font-weight:600;font-size:13px;color:var(--cyan);letter-spacing:.4px}

/* ============ KATALOG hlava + nástroje ============ */
.hda-katalog__hlava{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:20px}
.hda-katalog__nastroje{display:flex;align-items:center;gap:12px}
.hda-razeni label{font-size:12.5px;color:var(--tx-mut);display:flex;align-items:center;gap:8px;font-family:var(--fx);text-transform:uppercase;letter-spacing:.4px}
.hda-razeni select{background:var(--panel);color:var(--tx);border:1px solid var(--line2);border-radius:var(--r-s);padding:9px 10px;font-family:var(--ft)}
.hda-nic{padding:50px 0;text-align:center;color:var(--tx-mut)}

/* ============ MŘÍŽKA + INVERTOVANÁ KARTA (info NAHOŘE / foto DOLE) ============ */
.hda-mrizka{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.hda-karta{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);
  overflow:hidden;transition:.18s;position:relative}
.hda-karta:hover{border-color:var(--line2);transform:translateY(-3px);box-shadow:var(--shadow)}
/* HLAVA nahoře = meta + název + cena */
.hda-karta__hlava{padding:14px 14px 12px;display:flex;flex-direction:column;gap:7px;order:1}
.hda-karta__meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.hda-karta__zanr{font-family:var(--fx);font-weight:700;font-size:10.5px;letter-spacing:.8px;text-transform:uppercase;
  color:var(--cyan);background:rgba(37,214,230,.09);border:1px solid rgba(37,214,230,.22);padding:3px 8px;border-radius:999px}
.hda-karta__plat{font-size:11px;color:var(--tx-dim);letter-spacing:.3px}
.hda-karta__nazev{font-family:var(--fx);font-weight:700;font-size:15px;line-height:1.22;min-height:2.44em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hda-karta__nazev a:hover{color:var(--viol-2)}
.hda-karta__cena{display:flex;align-items:baseline;gap:8px;margin-top:auto}
.hda-karta__now{font-family:var(--fx);font-weight:800;font-size:19px;color:#fff}
.hda-karta__old{font-size:12.5px;color:var(--tx-dim)}
/* FOTO dole = spodní polovina, add se odkryje přes foto */
.hda-karta__foto{order:2;position:relative;display:block;margin-top:auto;aspect-ratio:16/10;overflow:hidden;
  background:linear-gradient(180deg,#0f121a,#0a0c11);border-top:1px solid var(--line)}
.hda-karta__foto img{width:100%;height:100%;object-fit:cover;transition:.4s}
.hda-karta:hover .hda-karta__foto img{transform:scale(1.06)}
.hda-ribbon{position:absolute;top:12px;left:-34px;transform:rotate(-45deg);background:var(--ribbon);color:#fff;
  font-family:var(--fx);font-weight:800;font-size:11px;letter-spacing:.6px;padding:4px 40px;box-shadow:0 4px 12px -3px rgba(0,0,0,.6)}
.hda-karta__srdce{position:absolute;top:10px;right:10px;width:34px;height:34px;border-radius:999px;border:0;
  background:rgba(8,10,15,.66);color:#fff;display:grid;place-items:center;backdrop-filter:blur(4px);opacity:0;transition:.18s}
.hda-karta:hover .hda-karta__srdce{opacity:1}
.hda-karta__srdce svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}
.hda-karta__srdce.je-aktiv{opacity:1;color:var(--ribbon)}
.hda-karta__srdce.je-aktiv svg{fill:var(--ribbon);stroke:var(--ribbon)}
/* „Do košíku“ — celoširoká lišta odkrytá přes spodek fota při hoveru */
.hda-karta__kup{position:absolute;left:0;right:0;bottom:0;transform:translateY(100%);transition:.2s;
  background:linear-gradient(135deg,var(--viol),#5a34d6);color:#fff;font-family:var(--fx);font-weight:700;
  letter-spacing:.6px;text-transform:uppercase;font-size:13px;text-align:center;padding:11px;cursor:pointer}
.hda-karta:hover .hda-karta__kup,.hda-karta__kup:focus{transform:translateY(0)}
.hda-karta__kup:hover{filter:brightness(1.1)}

/* ============ DRAWER (pravý výsuvný panel) — filtr i košík ============ */
.hda-drawer{position:fixed;inset:0;z-index:150}
.hda-drawer__zaves{position:absolute;inset:0;background:rgba(4,6,10,.62);backdrop-filter:blur(2px);opacity:0;animation:hda-fade .2s forwards}
.hda-drawer__panel{position:absolute;left:50%;top:50%;width:min(440px,94vw);max-height:88vh;background:var(--bg2);
  border:1px solid var(--line2);border-radius:16px;box-shadow:0 30px 80px -20px #000;display:flex;flex-direction:column;overflow:hidden;
  transform:translate(-50%,-50%) scale(.95);animation:hda-pop .22s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes hda-fade{to{opacity:1}}
@keyframes hda-pop{to{transform:translate(-50%,-50%) scale(1)}}
.hda-drawer.je-zavira .hda-drawer__panel{animation:hda-pop-out .18s forwards}
.hda-drawer.je-zavira .hda-drawer__zaves{animation:hda-fade-out .2s forwards}
@keyframes hda-pop-out{to{transform:translate(-50%,-50%) scale(.95);opacity:0}}
@keyframes hda-fade-out{to{opacity:0}}
.hda-drawer__hlava{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line)}
.hda-drawer__hlava strong{font-family:var(--fx);font-weight:800;font-size:16px;letter-spacing:.6px;text-transform:uppercase}
.hda-drawer__hlava button{background:none;border:0;color:var(--tx-mut);font-size:18px;width:34px;height:34px;border-radius:8px}
.hda-drawer__hlava button:hover{color:#fff;background:var(--panel)}
.hda-drawer__telo{flex:1;overflow-y:auto;padding:18px}
.hda-drawer__pata{border-top:1px solid var(--line);padding:16px 18px;display:flex;flex-direction:column;gap:12px}
.hda-drawer__suma{display:flex;align-items:center;justify-content:space-between;font-family:var(--fx);font-size:17px}
.hda-drawer__suma strong{color:var(--cyan)}

/* ---- filtr obsah ---- */
.hda-filtr__grp{border:0;border-top:1px solid var(--line);padding:16px 0 6px;margin:0}
.hda-filtr__grp:first-child{border-top:0;padding-top:0}
.hda-filtr__grp legend{font-family:var(--fx);font-weight:700;font-size:12px;letter-spacing:.8px;text-transform:uppercase;color:var(--tx-mut);padding:0 0 10px}
.hda-check,.hda-radio{display:flex;align-items:center;gap:9px;padding:6px 0;font-size:14px;color:var(--tx);cursor:pointer}
.hda-check input,.hda-radio input{accent-color:var(--viol);width:16px;height:16px}
.hda-rozsah{display:flex;flex-direction:column;gap:8px}
.hda-rozsah input[type=range]{width:100%;accent-color:var(--cyan)}
.hda-rozsah output{font-family:var(--fx);color:var(--cyan);font-size:13px}
.hda-filtr__akce{display:flex;gap:10px;margin-top:18px}
.hda-filtr__akce .hda-btn{flex:1}

/* ---- mini košík obsah ---- */
.hda-kosik-prazdny{color:var(--tx-mut);text-align:center;padding:30px 0}
.hda-mk-radek{display:grid;grid-template-columns:56px 1fr auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.hda-mk-radek img{width:56px;height:56px;object-fit:cover;border-radius:8px;border:1px solid var(--line)}
.hda-mk-radek__nazev{font-size:13px;font-weight:600;line-height:1.2}
.hda-mk-radek__meta{font-size:12px;color:var(--tx-dim)}
.hda-mk-radek__cena{font-family:var(--fx);font-weight:700;color:#fff;font-size:13.5px;white-space:nowrap}
.hda-mk-radek__x{background:none;border:0;color:var(--tx-dim);font-size:14px}
.hda-mk-radek__x:hover{color:var(--bad)}

/* ============ PDP — galerie VPRAVO, buy-box VLEVO ============ */
.hda-pdp__mriz{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:34px;align-items:start}
.hda-pdp__levy{order:1;min-width:0}
.hda-pdp__pravy{order:2;min-width:0;position:sticky;top:82px}
.hda-pdp__kicker{font-family:var(--fx);font-weight:700;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--cyan)}
.hda-pdp__titul{font-size:clamp(24px,3.4vw,36px);text-transform:uppercase;letter-spacing:.4px;margin:8px 0 18px}
.hda-buybox{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:20px;box-shadow:var(--shadow)}
.hda-buybox__cena{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.hda-buybox__now{font-family:var(--fx);font-weight:800;font-size:32px;color:#fff}
.hda-buybox__old{color:var(--tx-dim);font-size:16px}
.hda-buybox__sleva{font-family:var(--fx);font-weight:700;font-size:13px;color:#fff;background:var(--ribbon);padding:3px 9px;border-radius:999px}
.hda-buybox__stav{font-size:13.5px;margin:10px 0 16px;font-weight:600}
.hda-buybox__stav.je-skladem{color:var(--ok)}
.hda-buybox__stav.neni{color:var(--bad)}
.hda-buybox__akce{display:flex;gap:10px;align-items:stretch}
.hda-buybox__akce .hda-btn--kup{flex:1}
.hda-buybox__trust{list-style:none;margin:16px 0 0;padding:14px 0 0;border-top:1px solid var(--line);color:var(--tx-mut);font-size:12.5px;display:flex;flex-direction:column;gap:6px}
.hda-buybox__trust li{padding-left:18px;position:relative}
.hda-buybox__trust li::before{content:"◈";position:absolute;left:0;color:var(--cyan)}
/* množství */
.hda-mnozstvi{display:flex;align-items:center;border:1px solid var(--line2);border-radius:var(--r-s);overflow:hidden;background:var(--bg2)}
.hda-mnozstvi button{width:38px;height:44px;background:none;border:0;color:var(--tx);font-size:18px}
.hda-mnozstvi button:hover{background:var(--panel2);color:var(--viol-2)}
.hda-mnozstvi input{width:38px;height:44px;text-align:center;background:none;border:0;color:#fff;font-family:var(--fx);font-weight:700;outline:none}
/* čipy specifikací */
.hda-cipy{list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:18px 0;margin:0}
.hda-cipy li{display:flex;flex-direction:column;gap:2px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-s);padding:8px 12px}
.hda-cipy__k{font-size:10.5px;letter-spacing:.6px;text-transform:uppercase;color:var(--tx-dim);font-family:var(--fx)}
.hda-cipy__v{font-size:13.5px;font-weight:600}
/* akordeon */
.hda-akordeon{border-top:1px solid var(--line)}
.hda-akordeon__it{border-bottom:1px solid var(--line)}
.hda-akordeon__it summary{list-style:none;cursor:pointer;padding:16px 2px;font-family:var(--fx);font-weight:700;font-size:15px;
  letter-spacing:.4px;text-transform:uppercase;display:flex;align-items:center;justify-content:space-between}
.hda-akordeon__it summary::-webkit-details-marker{display:none}
.hda-akordeon__it summary::after{content:"+";color:var(--viol-2);font-size:20px;font-weight:400}
.hda-akordeon__it[open] summary::after{content:"–"}
.hda-akordeon__telo{padding:0 2px 18px;color:var(--tx-mut);font-size:14.5px}
.hda-parametry{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;margin:0}
.hda-parametry dt{color:var(--tx-dim);font-size:13px}
.hda-parametry dd{margin:0;color:var(--tx);font-weight:600;font-size:13.5px}
/* galerie */
.hda-galerie{margin:0;display:flex;flex-direction:column;gap:12px}
.hda-galerie__hlavni{position:relative;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  background:linear-gradient(180deg,#0f121a,#0a0c11);aspect-ratio:4/3}
.hda-galerie__hlavni img{width:100%;height:100%;object-fit:cover}
.hda-ribbon--pdp{top:16px;left:-30px;font-size:12px;padding:5px 40px}
.hda-galerie__pas{display:flex;gap:10px;flex-wrap:wrap}
.hda-galerie__nahled{width:74px;height:60px;border:1px solid var(--line);border-radius:var(--r-xs);overflow:hidden;background:var(--panel);padding:0}
.hda-galerie__nahled img{width:100%;height:100%;object-fit:cover}
.hda-galerie__nahled.je-aktiv{border-color:var(--viol);box-shadow:0 0 0 2px rgba(124,77,255,.35)}

.hda-souvis{margin-top:56px}

/* ============ KOŠÍK stránka ============ */
.hda-kosik-mriz{display:grid;grid-template-columns:1fr 320px;gap:28px;align-items:start;margin-top:20px}
.hda-kosik-radek{display:grid;grid-template-columns:80px 1fr auto auto auto;gap:14px;align-items:center;
  background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:12px;margin-bottom:12px}
.hda-kosik-radek__foto img{width:80px;height:64px;object-fit:cover;border-radius:8px}
.hda-kosik-radek__nazev{font-family:var(--fx);font-weight:700;font-size:14.5px;display:block}
.hda-kosik-radek__nazev:hover{color:var(--viol-2)}
.hda-kosik-radek__plat{font-size:12px;color:var(--tx-dim)}
.hda-kosik-radek__cena{font-family:var(--fx);font-weight:800;color:#fff;white-space:nowrap}
.hda-kosik-radek__smaz{background:none;border:0;color:var(--tx-dim);font-size:15px}
.hda-kosik-radek__smaz:hover{color:var(--bad)}
.hda-kosik-souhrn{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:20px;position:sticky;top:82px}
.hda-kosik-souhrn h2{font-size:16px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:14px}
.hda-kosik-souhrn__radek{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px}
.hda-kosik-souhrn__radek strong{font-family:var(--fx);font-size:20px;color:var(--cyan)}
.hda-kosik-souhrn__doprava{font-size:12.5px;color:var(--tx-mut);margin:8px 0 16px}
.hda-kosik-souhrn .hda-btn{width:100%;margin-bottom:10px}
.hda-kosik-souhrn__zpet{display:block;text-align:center;font-size:13px;color:var(--tx-mut)}
.hda-kosik-souhrn__zpet:hover{color:var(--cyan)}
.hda-kosik-prazdny--str{text-align:center;padding:60px 0}
.hda-kosik-prazdny--str .hda-btn{margin-top:16px}

/* ============ POKLADNA ============ */
.hda-pokladna__mriz{display:grid;grid-template-columns:1fr 320px;gap:28px;align-items:start;margin-top:20px}
.hda-pokladna fieldset{border:1px solid var(--line);border-radius:var(--r);padding:20px;margin:0}
.hda-pokladna legend{font-family:var(--fx);text-transform:uppercase;letter-spacing:.5px;padding:0 8px;color:var(--cyan)}
.hda-pokladna label{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;font-size:13px;color:var(--tx-mut)}
.hda-pokladna input,.hda-pokladna select{background:var(--bg2);border:1px solid var(--line2);border-radius:var(--r-s);padding:11px;color:var(--tx);font-family:var(--ft)}
.hda-pokladna input:focus,.hda-pokladna select:focus{outline:none;border-color:var(--viol)}
.hda-pokladna__souhrn{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:20px;position:sticky;top:82px}
.hda-pokladna__souhrn h2{font-size:16px;text-transform:uppercase;margin-bottom:12px}
.hda-pokladna__souhrn .hda-btn{width:100%;margin-top:14px}

/* ============ STAV / dokument ============ */
.hda-stav{text-align:center;padding:70px 20px;max-width:520px;margin:0 auto}
.hda-stav__kod{font-family:var(--fx);font-weight:800;font-size:72px;color:var(--viol);line-height:1}
.hda-stav__kod--ok{color:var(--ok)}
.hda-stav p{color:var(--tx-mut);margin:10px 0 22px}
.hda-dokument{max-width:760px}
.hda-dokument p{color:var(--tx-mut);margin:14px 0}

/* ============ FOOTER ============ */
.hda-pata{border-top:1px solid var(--line);background:var(--bg2);margin-top:40px}
.hda-pata__in{max-width:var(--wrap);margin:0 auto;padding:44px 20px 28px;display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr;gap:30px}
.hda-pata__blok h4{font-family:var(--fx);text-transform:uppercase;letter-spacing:.6px;font-size:13px;color:var(--tx);margin-bottom:12px}
.hda-pata__blok a{display:block;color:var(--tx-mut);font-size:13.5px;padding:4px 0}
.hda-pata__blok a:hover{color:var(--cyan)}
.hda-pata__blok p{color:var(--tx-mut);font-size:13px;margin:8px 0}
.hda-logo__txt--pata{font-size:18px;display:inline-block;margin-bottom:6px}
.hda-pata__firma{color:var(--tx-dim);font-size:12px}
.hda-pata__spod{border-top:1px solid var(--line);text-align:center;color:var(--tx-dim);font-size:12px;padding:16px}

@keyframes hda-flash{0%{box-shadow:0 0 0 0 rgba(37,214,230,.5)}100%{box-shadow:0 0 0 14px rgba(37,214,230,0)}}
.je-flash{animation:hda-flash .5s ease-out}

/* ============ HLAVNÍ: slevy / aréna dlaždice / proč / dárek / magazín / FAQ ============ */
.hda-pas--slevy .hda-pas__hlava .hda-h2{display:flex;align-items:center;gap:8px}
.hda-blesk{color:var(--warn);filter:drop-shadow(0 0 6px rgba(255,176,32,.6))}

/* aréna dlaždice (platformy) */
.hda-arena{margin:44px 0}
.hda-arena__mriz{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.hda-arena__dlazd{position:relative;display:block;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  aspect-ratio:1/1;background:var(--panel);transition:.18s}
.hda-arena__dlazd:hover{border-color:var(--viol);transform:translateY(-3px);box-shadow:var(--glow)}
.hda-arena__dlazd img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.62;transition:.4s}
.hda-arena__dlazd:hover img{opacity:.8;transform:scale(1.06)}
.hda-arena__ryt{position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(10,12,18,.55) 60%,rgba(10,12,18,.95))}
.hda-arena__txt{position:absolute;left:0;right:0;bottom:0;padding:16px;display:flex;flex-direction:column;gap:2px;z-index:2}
.hda-arena__txt b{font-family:var(--fx);font-weight:800;font-size:20px;letter-spacing:.4px;text-transform:uppercase}
.hda-arena__txt em{font-style:normal;font-size:12.5px;color:var(--tx-mut)}

/* proč u nás */
.hda-proc{margin:52px 0}
.hda-proc .hda-h2{margin-bottom:20px}
.hda-proc__mriz{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.hda-proc__it{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:20px}
.hda-proc__it b{display:block;font-family:var(--fx);font-weight:700;font-size:15px;letter-spacing:.3px;margin:12px 0 6px}
.hda-proc__it p{margin:0;color:var(--tx-mut);font-size:13px;line-height:1.5}
.hda-proc__ikona{display:grid;place-items:center;width:44px;height:44px;border-radius:var(--r-s);
  background:rgba(37,214,230,.08);border:1px solid rgba(37,214,230,.24);color:var(--cyan)}
.hda-proc__ikona svg{width:22px;height:22px}

/* dárek k prvnímu nákupu */
.hda-darek{position:relative;overflow:hidden;border:1px solid var(--line2);border-radius:var(--r);margin:52px 0;
  background:linear-gradient(120deg,#1a1330,#14131f 60%);padding:clamp(28px,5vw,52px)}
.hda-darek__poz{position:absolute;right:0;top:0;height:100%;width:46%;object-fit:cover;opacity:.34;z-index:0}
.hda-darek::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#14131f 34%,rgba(20,19,31,.4) 66%,transparent);z-index:1;pointer-events:none}
.hda-darek__in{position:relative;z-index:2;max-width:560px}
.hda-darek__odznak{display:inline-block;font-family:var(--fx);font-weight:700;font-size:12px;letter-spacing:1.2px;text-transform:uppercase;
  color:#fff;background:linear-gradient(135deg,var(--viol),var(--ribbon));border-radius:999px;padding:5px 14px;margin-bottom:14px}
.hda-darek__in p{color:var(--tx-mut);margin:12px 0 20px;font-size:15px}
.hda-darek__in p b{color:var(--tx)}
.hda-darek__akce{display:flex;gap:12px;flex-wrap:wrap}

/* dárek — kompaktní pruh na detailu produktu */
.hda-pdp-darek{display:flex;align-items:center;gap:18px;margin:34px 0;padding:16px 20px;
  border:1px solid var(--line2);border-radius:var(--r);background:linear-gradient(100deg,var(--panel2),var(--panel));overflow:hidden}
.hda-pdp-darek img{width:96px;height:96px;object-fit:cover;border-radius:var(--r-s);flex:0 0 auto}
.hda-pdp-darek__txt{flex:1 1 auto;min-width:0}
.hda-pdp-darek__odznak{display:inline-block;font-family:var(--fx);font-weight:700;font-size:11px;letter-spacing:1.1px;
  text-transform:uppercase;color:var(--cyan)}
.hda-pdp-darek p{margin:6px 0 0;color:var(--tx-mut);font-size:14px;line-height:1.5}
.hda-pdp-darek p b{color:var(--tx)}
.hda-pdp-darek .hda-btn{flex:0 0 auto}
@media(max-width:640px){.hda-pdp-darek{flex-wrap:wrap}.hda-pdp-darek img{width:64px;height:64px}.hda-pdp-darek .hda-btn{width:100%}}

/* magazín / herní deník */
.hda-mag{margin:52px 0}
.hda-mag__mriz{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.hda-mag__karta{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:.18s;display:flex;flex-direction:column}
.hda-mag__karta:hover{border-color:var(--line2);transform:translateY(-3px);box-shadow:var(--shadow)}
.hda-mag__foto{aspect-ratio:16/9;overflow:hidden;background:var(--bg2)}
.hda-mag__foto img{width:100%;height:100%;object-fit:cover;transition:.4s}
.hda-mag__karta:hover .hda-mag__foto img{transform:scale(1.05)}
.hda-mag__telo{padding:16px 16px 18px}
.hda-mag__stitek{font-family:var(--fx);font-weight:700;font-size:10.5px;letter-spacing:.8px;text-transform:uppercase;
  color:var(--viol-2);background:rgba(124,77,255,.1);border:1px solid rgba(124,77,255,.28);padding:3px 8px;border-radius:999px}
.hda-mag__titul{font-family:var(--fx);font-weight:700;font-size:16px;line-height:1.25;margin:12px 0 8px}
.hda-mag__perex{margin:0;color:var(--tx-mut);font-size:13px;line-height:1.5}
.hda-mag__vic{display:inline-block;margin-top:12px;font-family:var(--fx);font-weight:700;font-size:12px;letter-spacing:.4px;text-transform:uppercase;color:var(--cyan)}
.hda-mag__karta:hover .hda-mag__vic{color:var(--cyan-2)}

/* ============ DENÍK — výpis a detail článku ============ */
.hda-denik-hlava{max-width:760px;margin-bottom:26px}
.hda-denik-lead{font-size:16px;color:var(--tx-mut);margin:14px 0 0}
.hda-clanek{max-width:820px;margin:0 auto}
.hda-clanek__stitek{display:inline-block;font-family:var(--fx);font-weight:700;font-size:11px;letter-spacing:1px;text-transform:uppercase;
  color:var(--viol-2);background:rgba(124,77,255,.1);border:1px solid rgba(124,77,255,.28);padding:4px 10px;border-radius:999px;margin:10px 0 12px}
.hda-clanek__titul{font-size:clamp(24px,3.4vw,34px);text-transform:none;letter-spacing:.2px}
.hda-clanek__perex{font-size:17px;color:var(--tx);margin:14px 0 0;line-height:1.5}
.hda-clanek__foto{margin:24px 0;border:1px solid var(--line2);border-radius:var(--r);overflow:hidden;aspect-ratio:16/9;background:var(--bg2)}
.hda-clanek__foto img{width:100%;height:100%;object-fit:cover}
.hda-clanek__telo{max-width:none}
.hda-clanek__telo p{font-size:16px;line-height:1.75}
.hda-clanek__cta{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0 8px;padding-top:22px;border-top:1px solid var(--line)}
.hda-clanek__dalsi{margin-top:44px}

/* FAQ */
.hda-faq{margin:52px 0}
.hda-faq__list{border-top:1px solid var(--line)}
.hda-faq__it{border-bottom:1px solid var(--line)}
.hda-faq__it summary{list-style:none;cursor:pointer;padding:18px 2px;font-family:var(--fx);font-weight:700;font-size:15px;
  letter-spacing:.3px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.hda-faq__it summary::-webkit-details-marker{display:none}
.hda-faq__it summary::after{content:"+";color:var(--cyan);font-size:22px;font-weight:400;flex:0 0 auto}
.hda-faq__it[open] summary::after{content:"–"}
.hda-faq__telo{padding:0 2px 18px;color:var(--tx-mut);font-size:14px;line-height:1.6;max-width:820px}
.hda-faq__telo p{margin:0}

/* ============ PLATEBNÍ STRIP (footer) ============ */
.hda-platstrip{max-width:var(--wrap);margin:0 auto;padding:22px 20px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  border-bottom:1px solid var(--line)}
.hda-platstrip__lbl{font-family:var(--fx);font-weight:700;font-size:12px;letter-spacing:.6px;text-transform:uppercase;color:var(--tx-mut)}
.hda-platstrip__ikony{list-style:none;display:flex;gap:10px;flex-wrap:wrap;margin:0;padding:0}
.hda-platstrip__ikony li{background:#fff;border-radius:6px;padding:5px 7px;height:34px;display:grid;place-items:center;border:1px solid var(--line2)}
.hda-platstrip__ikony img{height:22px;width:auto;display:block}
.hda-platstrip__txt{font-size:12.5px;color:var(--tx-dim)}

/* ============ POKLADNA — rozšíření ============ */
.hda-pokladna__radek2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.hda-pokladna__radek2 label{margin-bottom:14px}
.hda-platba{display:grid;gap:8px}
.hda-platba__it{display:flex;align-items:center;gap:10px;border:1px solid var(--line2);border-radius:var(--r-s);
  padding:12px 14px;font-size:14px;color:var(--tx);cursor:pointer;background:var(--bg2);transition:.15s}
.hda-platba__it:hover{border-color:var(--viol)}
.hda-platba__it input{accent-color:var(--viol);width:16px;height:16px}
.hda-platba__it:has(input:checked){border-color:var(--viol);box-shadow:0 0 0 2px rgba(124,77,255,.2)}
.hda-pokladna__radky{list-style:none;margin:0 0 14px;padding:0 0 14px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:8px}
.hda-pokladna__radky li{display:grid;grid-template-columns:auto 1fr auto;gap:8px;font-size:13px;align-items:baseline}
.hda-pokladna__q{color:var(--cyan);font-family:var(--fx);font-weight:700}
.hda-pokladna__n{color:var(--tx-mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hda-pokladna__c{font-family:var(--fx);font-weight:700;white-space:nowrap}
.hda-pokladna__pozn{font-size:12px;color:var(--tx-dim);margin:12px 0 0;line-height:1.5}

/* ============ POTVRZENÍ objednávky ============ */
.hda-stav--dek{max-width:600px}
.hda-stav__cislo{font-size:16px;color:var(--tx)}
.hda-stav__cislo b{font-family:var(--fx);color:var(--cyan);letter-spacing:.5px}
.hda-stav__meta{font-size:13px;color:var(--tx-mut)}
.hda-stav__akce{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:22px 0 10px}
.hda-stav__pozn{font-size:12.5px;color:var(--tx-dim)}
.hda-stav__pozn a{color:var(--cyan)}

/* ============ DOKUMENTY / právní ============ */
.hda-dokument h2{font-family:var(--fx);font-size:19px;letter-spacing:.3px;margin:28px 0 10px;color:var(--tx)}
.hda-dokument h3{font-family:var(--fx);font-size:15px;margin:0 0 8px;color:var(--tx)}
.hda-dok-lead{font-size:16px;color:var(--tx)!important;border-left:3px solid var(--viol);padding-left:14px}
.hda-dok-list{margin:10px 0;padding-left:20px;color:var(--tx-mut);font-size:14px;line-height:1.7}
.hda-dok-list li{margin:4px 0}
.hda-dok-list b{color:var(--tx)}
.hda-dok-url{color:var(--cyan)}
.hda-dok-tab{width:100%;border-collapse:collapse;margin:14px 0;font-size:13.5px}
.hda-dok-tab th,.hda-dok-tab td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line)}
.hda-dok-tab th{font-family:var(--fx);font-size:12px;letter-spacing:.4px;text-transform:uppercase;color:var(--tx-mut);background:var(--panel)}
.hda-dok-tab td{color:var(--tx-mut)}
.hda-dok-tab td b{color:var(--cyan)}
.hda-dok-karty{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0}
.hda-dok-karta{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.hda-dok-karta h3{color:var(--cyan);text-transform:uppercase;font-size:12px;letter-spacing:.5px}
.hda-dok-karta p{margin:0;color:var(--tx-mut);font-size:14px;line-height:1.6}
.hda-dok-karta a{color:var(--cyan)}
.hda-dok-fakta{list-style:none;display:flex;gap:26px;flex-wrap:wrap;padding:18px 0 0;margin:8px 0 0;border-top:1px solid var(--line)}
.hda-dok-fakta li{display:flex;flex-direction:column}
.hda-dok-fakta b{font-family:var(--fx);font-weight:800;font-size:22px;color:var(--cyan);line-height:1}
.hda-dok-fakta span{font-size:12px;color:var(--tx-mut);margin-top:4px}
.hda-dok-akt{font-size:12px;color:var(--tx-dim);margin-top:28px;border-top:1px solid var(--line);padding-top:14px}

/* ============ RESPONZIVITA ============ */
@media(max-width:960px){
  .hda-nav{display:none}
  .hda-ikona--menu{display:grid}
  .hda-pdp__mriz{grid-template-columns:1fr}
  .hda-pdp__pravy{position:static;order:1}
  .hda-pdp__levy{order:2}
  .hda-kosik-mriz,.hda-pokladna__mriz{grid-template-columns:1fr}
  .hda-pata__in{grid-template-columns:1fr 1fr}
  .hda-arena__mriz{grid-template-columns:1fr 1fr}
  .hda-proc__mriz{grid-template-columns:1fr 1fr}
  .hda-mag__mriz{grid-template-columns:1fr}
  .hda-dok-karty{grid-template-columns:1fr}
  .hda-darek__poz{width:100%;opacity:.18}
  .hda-darek::after{background:linear-gradient(180deg,rgba(20,19,31,.7),rgba(20,19,31,.92))}
}
@media(max-width:640px){
  .hda-arena__mriz,.hda-proc__mriz{grid-template-columns:1fr}
  .hda-hero__cisla{gap:18px}
  .hda-pokladna__radek2{grid-template-columns:1fr}
  .hda-dok-tab{font-size:12.5px}
  .hda-dok-tab th,.hda-dok-tab td{padding:8px 8px}
}
@media(max-width:640px){
  .hda-hledej{max-width:none}
  .hda-bar__in{gap:10px}
  .hda-kosik-radek{grid-template-columns:64px 1fr auto;grid-template-areas:"f i x" "f q c";row-gap:8px}
  .hda-kosik-radek__foto{grid-area:f}.hda-kosik-radek__info{grid-area:i}
  .hda-kosik-radek .hda-mnozstvi{grid-area:q}.hda-kosik-radek__cena{grid-area:c}.hda-kosik-radek__smaz{grid-area:x;justify-self:end}
  .hda-pata__in{grid-template-columns:1fr}
}
/* menu-open pro mobilní nav */
body.je-menu .hda-nav{display:flex;position:absolute;top:62px;left:0;right:0;flex-direction:column;background:var(--bg2);
  border-bottom:1px solid var(--line2);padding:10px;gap:2px;z-index:110}
body.je-menu .hda-nav a{padding:12px 14px}
