/* PERIHELIA — web + presskit. Čisté CSS, bez externích závislostí. */
@font-face{font-family:"Orbitron";src:url("../fonts/orbitron.woff2") format("woff2");font-weight:400 900;font-display:swap}
@font-face{font-family:"Exo 2";src:url("../fonts/exo2.woff2") format("woff2");font-weight:100 900;font-display:swap}

:root{
  --bg:#07070f; --bg2:#0d0d1c; --panel:#121226; --line:#26264a;
  --text:#e8ecff; --muted:#9aa3c7;
  --cyan:#35e3ff; --pink:#ff3fb4; --yellow:#ffd23f; --green:#5dffa0; --violet:#9b5cff;
  --steam:#1a9fff;
  --max:1160px; --r:14px;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:400 1.0625rem/1.6 "Exo 2",system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--cyan)}
h1,h2,h3{font-family:"Orbitron","Exo 2",sans-serif;font-weight:700;letter-spacing:.04em;line-height:1.2;margin:0 0 .6em}
h2{font-size:clamp(1.5rem,3.4vw,2.3rem)}
h3{font-size:1.05rem;letter-spacing:.08em}
p{margin:0 0 1em}
.wrap{max-width:var(--max);margin:0 auto;padding-inline:20px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px;top:8px;background:var(--cyan);color:#000;padding:8px 12px;z-index:99}
.skip:focus{left:8px}

/* --- hvězdné pozadí (čisté CSS) --- */
.stars{position:fixed;inset:0;z-index:-2;pointer-events:none;background:var(--bg)}
.stars::before,.stars::after{content:"";position:absolute;inset:-50% 0 0 0;background-repeat:repeat}
.stars::before{background-image:
  radial-gradient(1px 1px at 20px 30px,#fff9,transparent 60%),radial-gradient(1px 1px at 140px 80px,#fff7,transparent 60%),
  radial-gradient(1.5px 1.5px at 260px 170px,#9ef,transparent 60%),radial-gradient(1px 1px at 330px 40px,#fff8,transparent 60%),
  radial-gradient(1px 1px at 90px 250px,#fcf8,transparent 60%),radial-gradient(1px 1px at 200px 320px,#fff6,transparent 60%);
  background-size:380px 380px;animation:drift 140s linear infinite;opacity:.8}
.stars::after{background-image:
  radial-gradient(2px 2px at 60px 120px,#35e3ff,transparent 60%),radial-gradient(1.5px 1.5px at 400px 300px,#ff3fb4,transparent 60%),
  radial-gradient(1.5px 1.5px at 520px 60px,#fff,transparent 60%),radial-gradient(2px 2px at 250px 480px,#ffd23f,transparent 60%);
  background-size:640px 640px;animation:drift 90s linear infinite,twinkle 5s ease-in-out infinite alternate;opacity:.55}
@keyframes drift{to{transform:translateY(50%)}}
@keyframes twinkle{from{opacity:.25}to{opacity:.7}}
@media (prefers-reduced-motion:reduce){.stars::before,.stars::after,.orbit-ring{animation:none!important}html{scroll-behavior:auto}}

/* --- navigace --- */
.nav{position:sticky;top:0;z-index:50;background:#07070fcc;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid #ffffff10}
.nav .wrap{display:flex;align-items:center;gap:18px;min-height:58px}
.nav .brand{font-family:Orbitron,sans-serif;font-weight:800;letter-spacing:.14em;color:var(--text);text-decoration:none;font-size:1rem}
.nav ul{display:flex;gap:18px;list-style:none;margin:0 0 0 auto;padding:0}
.nav ul a{color:var(--muted);text-decoration:none;font-size:.92rem}
.nav ul a:hover{color:var(--text)}
.nav .btn{padding:8px 14px;font-size:.8rem}
@media (max-width:820px){.nav ul{display:none}.nav .btn{margin-left:auto}}

/* --- tlačítka --- */
.btn{display:inline-flex;align-items:center;gap:10px;font-family:Orbitron,sans-serif;font-weight:700;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;border-radius:999px;padding:16px 30px;font-size:1rem;transition:transform .15s,box-shadow .2s,background .2s;border:0;cursor:pointer}
.btn-steam{background:linear-gradient(135deg,#35e3ff,#1a9fff 55%,#9b5cff);color:#04040a;box-shadow:0 0 0 1px #35e3ff66,0 8px 30px #1a9fff55}
.btn-steam:hover,.btn-steam:focus-visible{transform:translateY(-2px);box-shadow:0 0 0 2px #35e3ff,0 10px 44px #35e3ff88}
.btn-ghost{background:transparent;color:var(--text);box-shadow:inset 0 0 0 1.5px #ffffff40}
.btn-ghost:hover{box-shadow:inset 0 0 0 1.5px var(--pink);color:#fff}
.btn svg{width:1.3em;height:1.3em;flex:none}
.btn-big{padding:20px 38px;font-size:1.1rem}

/* --- hero --- */
.hero{position:relative;min-height:min(92vh,860px);display:grid;place-items:center;text-align:center;overflow:hidden;padding-block:70px 90px}
.hero-bg{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 0%,#1b1440 0%,transparent 70%)}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;opacity:.55}
.hero-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,transparent 0%,#07070f99 55%,var(--bg) 100%),linear-gradient(transparent 60%,var(--bg))}
.orbit-ring{position:absolute;left:50%;top:46%;width:min(120vw,1100px);aspect-ratio:1;translate:-50% -50%;border-radius:50%;border:2px solid transparent;border-top-color:#ff3fb455;border-right-color:#35e3ff33;animation:spin 38s linear infinite;z-index:-1;max-width:none}
.orbit-ring.r2{width:min(80vw,720px);border-top-color:#ffd23f44;border-left-color:#35e3ff44;animation-duration:24s;animation-direction:reverse}
@keyframes spin{to{rotate:360deg}}
.hero h1{margin:0 auto 18px;max-width:880px}
.hero h1 img{width:100%;filter:drop-shadow(0 0 10px #35e3ffaa) drop-shadow(0 0 34px #35e3ff66)}
.tagline{font-family:Orbitron,sans-serif;font-weight:600;letter-spacing:.22em;text-transform:uppercase;font-size:clamp(.85rem,2vw,1.15rem);color:var(--pink);text-shadow:0 0 18px #ff3fb488;margin:0 0 14px}
.lead{font-size:clamp(1.05rem,2.2vw,1.3rem);color:#cfd6f5;max-width:640px;margin:0 auto 32px}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;align-items:center}
.meta-row{display:flex;flex-wrap:wrap;gap:8px 10px;justify-content:center;margin-top:30px;padding:0;list-style:none}
.chip{font-size:.85rem;color:var(--muted);border:1px solid var(--line);background:#0d0d1ccc;border-radius:999px;padding:5px 13px}
.chip b{color:var(--text);font-weight:600}

/* --- sekce --- */
section{padding-block:clamp(56px,9vw,110px)}
main{position:relative;isolation:isolate}
.kicker{font-family:Orbitron,sans-serif;font-size:.78rem;letter-spacing:.3em;text-transform:uppercase;color:var(--cyan);margin:0 0 10px}
.center{text-align:center}
.sub{color:var(--muted);max-width:640px}
.center .sub{margin-inline:auto}

/* trailer */
.video{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:#000;box-shadow:0 0 0 1px var(--line),0 30px 80px #000c,0 0 60px #35e3ff22;margin-top:28px}
.video img{width:100%;height:100%;object-fit:cover;opacity:.5}
.video .ph{position:absolute;inset:0;display:grid;place-content:center;gap:14px;text-align:center;padding:20px}
.video .ph span{font-family:Orbitron,sans-serif;letter-spacing:.2em;text-transform:uppercase;font-size:clamp(.8rem,2vw,1rem)}
.play{width:84px;height:84px;margin:0 auto;border-radius:50%;display:grid;place-items:center;background:#07070fb0;box-shadow:0 0 0 2px var(--cyan),0 0 40px #35e3ff88;border:0;color:var(--cyan);cursor:pointer}
.play svg{width:34px;height:34px;margin-left:5px}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video button.poster{all:unset;position:absolute;inset:0;cursor:pointer}

/* features */
.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin-top:34px}
.feature{position:relative;background:linear-gradient(180deg,#14142b,#0c0c1a);border:1px solid var(--line);border-radius:var(--r);padding:26px 22px 22px;overflow:hidden}
.feature::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:var(--accent,var(--cyan));box-shadow:0 0 18px var(--accent,var(--cyan))}
.feature .ico{width:44px;height:44px;color:var(--accent,var(--cyan));margin-bottom:14px;filter:drop-shadow(0 0 8px currentColor)}
.feature h3{color:#fff}
.feature p{color:var(--muted);font-size:.98rem;margin:0}

/* režimy */
.modes{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-top:26px}
.mode{border-left:3px solid var(--accent);padding:6px 0 6px 16px}
/* build 177 web: 6 režimů → pevně 3 + 3, na mobilu 2 + 2 + 2 (auto-fit dělal 5 + 1) */
.modes{grid-template-columns:repeat(3,1fr)}
@media (max-width:760px){.modes{grid-template-columns:1fr 1fr;gap:10px}}
.mode h3{margin:0 0 4px;color:var(--accent)}
.mode p{margin:0;color:var(--muted);font-size:.96rem}

/* split blok (BURST) */
.split{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(24px,5vw,60px);align-items:center}
.split img{border-radius:var(--r);box-shadow:0 0 0 1px var(--line),0 24px 60px #000b}
@media (max-width:820px){.split{grid-template-columns:1fr}}

/* galerie */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:30px}
.gallery a{display:block;border-radius:10px;overflow:hidden;box-shadow:0 0 0 1px var(--line);transition:transform .2s,box-shadow .2s;aspect-ratio:16/9;background:#111}
.gallery a:hover,.gallery a:focus-visible{transform:translateY(-3px);box-shadow:0 0 0 2px var(--cyan),0 12px 30px #35e3ff33}
.gallery img{width:100%;height:100%;object-fit:cover}
@media (max-width:760px){.gallery{grid-template-columns:1fr 1fr;gap:8px}}
.lightbox{position:fixed;inset:0;z-index:100;background:#000e;display:grid;place-items:center;padding:16px}
.lightbox img{max-height:90vh;width:auto;border-radius:8px}
.lightbox[hidden]{display:none}  /* build 177 web: bez toho display:grid přebil hidden a okno nešlo zavřít */
.lightbox button{z-index:1;padding:6px 14px;position:absolute;top:10px;right:14px;background:none;border:0;color:#fff;font-size:2.4rem;cursor:pointer;line-height:1}

/* soundtrack */
.ost{display:grid;grid-template-columns:1fr 1.4fr;gap:clamp(24px,5vw,60px);align-items:start}
@media (max-width:860px){.ost{grid-template-columns:1fr}}
.tracks{list-style:none;margin:0;padding:0;counter-reset:t;columns:2;column-gap:26px}
@media (max-width:560px){.tracks{columns:1}}
.tracks li{counter-increment:t;break-inside:avoid;display:grid;grid-template-columns:2.2em 1fr;padding:9px 0;border-bottom:1px solid #ffffff0f}
.tracks li::before{content:counter(t,decimal-leading-zero);font-family:Orbitron,sans-serif;font-size:.75rem;color:var(--pink);padding-top:.25em}
.tracks b{font-weight:600;color:#fff;display:block;line-height:1.3}
.tracks small{color:var(--muted);font-size:.8rem}
.spotify{display:inline-flex;gap:10px;align-items:center;margin-top:10px;padding:10px 16px;border-radius:999px;border:1px dashed #1ed76088;color:#9ff3bd;font-size:.92rem}
.spotify svg{width:20px;height:20px}
.badge-safe{display:inline-block;margin:6px 0 18px;padding:6px 12px;border-radius:8px;background:#5dffa014;border:1px solid #5dffa055;color:var(--green);font-size:.9rem}

/* datum */
.dates{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin-top:30px}
.date{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:28px 24px;text-align:center}
.date .d{font-family:Orbitron,sans-serif;font-weight:800;font-size:clamp(1.6rem,4vw,2.3rem);color:#fff;text-shadow:0 0 20px var(--accent,#35e3ff)}
.date .l{font-family:Orbitron,sans-serif;letter-spacing:.2em;text-transform:uppercase;font-size:.75rem;color:var(--accent,var(--cyan));margin-bottom:8px}
.date p{color:var(--muted);margin:8px 0 0;font-size:.95rem}
.final{margin-top:44px}

/* patička */
footer{border-top:1px solid #ffffff12;padding-block:40px;color:var(--muted);font-size:.92rem;background:#05050b}
footer .wrap{display:flex;flex-wrap:wrap;gap:20px 34px;align-items:center;justify-content:space-between}
.social{display:flex;gap:10px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.social a{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);color:var(--text)}
.social a:hover{border-color:var(--cyan);color:var(--cyan)}
.social a[aria-disabled="true"]{opacity:.45;pointer-events:none}
.social svg{width:19px;height:19px}
footer nav a{color:var(--muted);margin-right:16px;text-decoration:none}
footer nav a:hover{color:#fff}

/* presskit */
.pk-head{padding-block:60px 20px}
.pk-grid{display:grid;grid-template-columns:300px 1fr;gap:40px;align-items:start}
@media (max-width:860px){.pk-grid{grid-template-columns:1fr}}
.facts{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:22px;position:sticky;top:76px}
@media (max-width:860px){.facts{position:static}}
.facts dl{margin:0}
.facts dt{font-family:Orbitron,sans-serif;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan);margin-top:14px}
.facts dt:first-child{margin-top:0}
.facts dd{margin:3px 0 0;color:#fff}
.pk section{padding-block:0 44px}
.pk h2{font-size:1.35rem;border-bottom:1px solid var(--line);padding-bottom:10px}
.pk ul{padding-left:1.2em;color:#cfd6f5}
.pk li{margin-bottom:.4em}
.dl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.dl-grid a{display:block;text-decoration:none;color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden;font-size:.85rem}
.dl-grid a:hover{border-color:var(--cyan)}
.dl-grid img{aspect-ratio:16/9;object-fit:cover;width:100%;background:#000}
.dl-grid .logo-prev{object-fit:contain;padding:14px;background:#0a0a16}
.dl-grid span{display:block;padding:8px 10px}
.dl-grid small{color:var(--muted)}
.ph-note{color:var(--yellow)}