/* =====================================================================
   GOTHICREMAKE.CZ — 1:1 v designovém jazyce gothic.thqnordic.com
   Bitter · černá · uppercase nadpisy s teplou září · kosočtvercové
   oddělovače · prapor-tlačítka · dřevěný rám videa
   ===================================================================== */

:root{
  --cerna:#000;
  --bila:#fff;
  --sedy-text:#c9c9c9;
  --pill-bg:#d6d6d6;
  --zar: 0 0 14px rgba(255,190,120,.55), 0 0 42px rgba(255,150,70,.22);
  --f:"Bitter",Georgia,serif;
  --wrap:1240px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--cerna);color:var(--bila);font-family:var(--f);font-size:16px;line-height:1.6;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:var(--bila)}
::selection{background:#c8551d;color:#fff}

/* placeholder pro chybějící obrázky */
.ph{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:1rem;
  font-size:.72rem;letter-spacing:.06em;color:#6f6f6f;
  background:
    radial-gradient(circle at 50% 40%,rgba(200,85,29,.12),transparent 65%),
    linear-gradient(160deg,#141414,#060606);
  border:1px solid #222}
img:not(.chybi)+.ph{display:none}
.hero__art img,.zprava__img img,.feat__img img,.edice__pack img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero__art img{object-position:center top}
img.chybi{display:none}

/* ============ NAV ============ */
.nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;
  background:#000;border-bottom:1px solid #151515;height:64px;padding:0 clamp(1rem,3vw,2.2rem)}
.nav__links{flex:1;display:flex;justify-content:space-evenly;max-width:900px;margin:0 auto}
.nav__links a{font-weight:700;font-size:1.05rem;text-transform:uppercase;letter-spacing:.04em;
  text-decoration:none;color:var(--bila);padding:.4rem .2rem;transition:text-shadow .2s,color .2s}
.nav__links a:hover{text-shadow:var(--zar)}
.nav__side{display:flex;align-items:center;gap:1rem}
.nav__soc{color:var(--bila);opacity:.9;transition:opacity .2s,filter .2s}
.nav__soc:hover{opacity:1;filter:drop-shadow(0 0 8px rgba(255,190,120,.7))}
.nav__lang{font-size:.85rem;color:var(--sedy-text)}
.nav__burger{display:none}

/* ============ HERO ============ */
.hero{position:relative;display:grid;grid-template-columns:1fr 1fr;min-height:calc(100svh - 64px);
  background:#000;overflow:hidden}
.hero__art{position:relative;min-height:420px}
.hero__art .ph{font-size:.8rem}
.hero__art::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,transparent 55%,#000 100%),
             linear-gradient(0deg,rgba(0,0,0,.85) 0%,transparent 30%)}

.hero__right{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:1.6rem;padding:2.5rem clamp(1.2rem,4vw,4rem)}

/* "logo" — kamenná typografie */
.hero__logo{text-align:center;line-height:1}
.hero__logo-main{display:block;font-weight:800;text-transform:uppercase;
  font-size:clamp(2.6rem,5.4vw,4.6rem);letter-spacing:.02em;
  background:linear-gradient(180deg,#f4ede2 0%,#cfc4b0 38%,#7a6f5c 55%,#e8ddc9 72%,#5d5344 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 3px 3px rgba(0,0,0,.9)) drop-shadow(0 0 26px rgba(255,180,110,.28))}
.hero__logo-sub{display:block;margin-top:.55rem;font-weight:500;text-transform:uppercase;
  font-size:clamp(.8rem,1.4vw,1.05rem);letter-spacing:.3em;color:#b8ad99}

/* dřevěný rám videa */
.ram{width:min(100%,620px);padding:14px;position:relative;
  background:
    repeating-linear-gradient(90deg,rgba(0,0,0,.22) 0 3px,transparent 3px 9px),
    linear-gradient(180deg,#6b4f33,#4a3520 30%,#5d4227 52%,#3c2a18 78%,#57402a);
  box-shadow:0 14px 40px -14px rgba(0,0,0,.95), inset 0 0 0 2px rgba(0,0,0,.55), inset 0 0 0 3px rgba(190,150,100,.25)}
.ram::before,.ram::after{content:"";position:absolute;width:9px;height:9px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#8a6a44,#241708 70%);box-shadow:0 1px 2px rgba(0,0,0,.8)}
.ram::before{top:5px;left:5px;box-shadow:calc(100% + 585px) 0 0 0 transparent}
.ram::after{bottom:5px;right:5px}
.ram__video{position:relative;aspect-ratio:16/9;background:#0c0c0c;display:grid;place-content:center;
  gap:.7rem;cursor:pointer;border:1px solid #000}
.ram__video:hover .ram__play{transform:scale(1.08);filter:drop-shadow(0 0 14px rgba(255,190,120,.8))}
.ram__play{margin:0 auto;transition:transform .2s,filter .2s}
.ram__hint{font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:#9a9a9a;text-align:center}
.ram iframe{aspect-ratio:16/9;width:100%;display:block;border:0}

/* prapor-tlačítka (banner s šipkovými konci) */
.banner{display:inline-flex;align-items:center;gap:.9rem;position:relative;
  font-family:var(--f);font-weight:700;font-size:1.15rem;text-transform:uppercase;letter-spacing:.03em;
  color:#000;background:#fff;text-decoration:none;border:0;cursor:pointer;
  padding:.72rem 1.6rem;
  clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,14px 100%,0 50%);
  transition:filter .2s,transform .12s}
.banner i{font-style:normal;font-weight:800;font-size:1.25em;line-height:0}
.banner:hover{filter:drop-shadow(0 0 12px rgba(255,200,140,.75))}
.banner:active{transform:scale(.97)}
.banner--velky{font-size:1.35rem;padding:.85rem 2.2rem}

.hero__btns{display:flex;gap:1.1rem;flex-wrap:wrap;justify-content:center}
.hero__plat{font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;color:#9a9a9a}

/* news ticker vlevo dole */
.hero__news{position:absolute;left:clamp(1rem,2.5vw,2rem);bottom:1.4rem;z-index:3;max-width:min(560px,60vw)}
.hero__news h6{font-size:1rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;margin-bottom:.5rem;
  text-shadow:0 2px 6px #000}
.hero__news ul{list-style:none}
.hero__news li{display:flex;align-items:baseline;gap:.7rem;margin-bottom:.45rem;flex-wrap:wrap}
.hero__news time{font-size:.85rem;color:#cfcfcf;text-shadow:0 1px 4px #000;white-space:nowrap}
.hero__news a{font-weight:700;text-transform:uppercase;font-size:.98rem;text-decoration:none;
  text-shadow:0 2px 6px #000;transition:text-shadow .2s}
.hero__news a:hover{text-shadow:var(--zar)}

.pill{display:inline-block;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  color:#161616;background:var(--pill-bg);border-radius:999px;padding:.18rem .65rem;white-space:nowrap}

/* ============ SEKCE ============ */
.sekce{padding:5.5rem clamp(1rem,4vw,3rem);max-width:var(--wrap);margin:0 auto}
.sekce--plna{max-width:none;padding-left:0;padding-right:0}
.sekce--plna .nadpis,.sekce--plna .orn,.sekce--plna .perex,
.sekce--plna .galerie,.sekce--plna .podpora{max-width:var(--wrap);margin-left:auto;margin-right:auto}
.sekce--plna .perex,.sekce--plna .nadpis{padding:0 clamp(1rem,4vw,3rem)}

.nadpis{font-weight:800;font-size:clamp(2.3rem,5vw,3.4rem);text-transform:uppercase;text-align:center;
  letter-spacing:.02em;text-shadow:var(--zar)}

/* ozdobný oddělovač s kosočtvercem */
.orn{display:flex;align-items:center;justify-content:center;margin:1.1rem auto 1.6rem;max-width:760px;position:relative}
.orn::before,.orn::after{content:"";flex:1;height:1px;
  background:linear-gradient(90deg,transparent,#e6e6e6 30%,#e6e6e6)}
.orn::after{background:linear-gradient(90deg,#e6e6e6,#e6e6e6 70%,transparent)}
.orn i{width:13px;height:13px;background:#f2f2f2;transform:rotate(45deg);margin:0 .9rem;flex:none;
  box-shadow:0 0 12px rgba(255,200,140,.6)}

.perex{text-align:center;color:var(--sedy-text);max-width:660px;margin:0 auto 3rem}

/* ============ AKTUALITY ============ */
.zpravy{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.zprava__img{position:relative;aspect-ratio:16/9;border-radius:8px;overflow:hidden;margin-bottom:1rem}
.zprava__img .ph{border-radius:8px}
.zprava__meta{display:flex;align-items:center;gap:.7rem;margin-bottom:.55rem}
.zprava__meta time{font-size:.85rem;color:#cfcfcf}
.zprava h3{font-weight:800;font-size:1.3rem;text-transform:uppercase;line-height:1.25;margin-bottom:.7rem;
  text-shadow:0 0 18px rgba(255,190,120,.18)}
.zprava__text{color:var(--sedy-text);font-size:.95rem;margin-bottom:.9rem}
.dal{font-weight:800;text-transform:uppercase;font-size:.92rem;text-decoration:none;
  border-bottom:1px solid transparent;transition:text-shadow .2s}
.dal:hover{text-shadow:var(--zar)}

/* ============ FEATURE BLOKY (Čeština) ============ */
.feat{display:grid;grid-template-columns:1fr 1fr;min-height:min(62vh,640px);margin-top:3rem}
.feat__img{position:relative}
.feat__img .ph{font-size:.78rem}
.feat__img::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(270deg,transparent 55%,#000 100%)}
.feat--obr .feat__img{order:2}
.feat--obr .feat__img::after{background:linear-gradient(90deg,transparent 55%,#000 100%)}
.feat__text{display:flex;flex-direction:column;justify-content:center;gap:1rem;
  padding:3rem clamp(1.2rem,5vw,5rem)}
.feat__text h3{font-weight:800;font-size:clamp(1.6rem,3vw,2.3rem);text-transform:uppercase;
  text-shadow:var(--zar)}
.feat__text p{color:var(--sedy-text);max-width:520px;font-size:1.05rem}

/* ============ POSTAVY ============ */
.postavy{display:grid;grid-template-columns:repeat(4,1fr);gap:1.6rem}
.post{outline:none}
.post__img{position:relative;aspect-ratio:3/4;border-radius:8px;overflow:hidden;margin-bottom:.9rem}
.post__img img{width:100%;height:100%;object-fit:cover;transition:transform .45s}
.post:hover .post__img img,.post:focus-visible .post__img img{transform:scale(1.05)}
.post__img .ph{border-radius:8px}
.post__meta{margin-bottom:.4rem}
.post h3{font-weight:800;font-size:1.45rem;text-transform:uppercase;margin-bottom:.45rem;
  transition:text-shadow .2s}
.post:hover h3,.post:focus-visible h3{text-shadow:var(--zar)}
.post__replika{color:var(--sedy-text);font-style:italic;font-size:.92rem;line-height:1.5}

/* ============ MÉDIA ============ */
.galerie{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:0 clamp(.4rem,1vw,1rem)}
.shot{position:relative;aspect-ratio:16/9;border:0;background:#0a0a0a;cursor:pointer;padding:0;overflow:hidden}
.shot img{width:100%;height:100%;object-fit:cover;transition:transform .4s,filter .3s}
.shot:hover img{transform:scale(1.04);filter:brightness(1.1)}
.shot:hover .ph{color:#bdbdbd}

/* lightbox */
.lightbox{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.92);display:grid;place-items:center;padding:2rem}
.lightbox[hidden]{display:none}
.lightbox__obsah img{max-width:min(1400px,92vw);max-height:86vh;box-shadow:0 20px 80px rgba(0,0,0,.9)}
.lightbox__zavrit{position:absolute;top:1rem;right:1.4rem;font-size:2.6rem;background:none;border:0;color:#fff;cursor:pointer;line-height:1}

/* ============ STÁHNOUT ============ */
.edice{display:grid;grid-template-columns:1fr 1.15fr;gap:2.5rem;align-items:start}
.edice__karta{text-align:center}
.edice__pack{position:relative;aspect-ratio:1/1;max-width:420px;margin:0 auto 1.4rem;border-radius:8px;overflow:hidden}
.edice__karta h3{font-weight:800;font-size:1.7rem;text-transform:uppercase;margin-bottom:.4rem;text-shadow:var(--zar)}
.edice__pozn{color:#9a9a9a;font-size:.9rem;margin-bottom:1.3rem;text-transform:uppercase;letter-spacing:.06em}
.edice__karta--kroky{text-align:left;border:1px solid #1e1e1e;border-radius:8px;padding:2rem;background:#070707}
.kroky{list-style:none;counter-reset:k;display:flex;flex-direction:column;gap:1.2rem;margin:1.2rem 0 1.4rem}
.kroky li{counter-increment:k;position:relative;padding-left:3.2rem;color:var(--sedy-text)}
.kroky li::before{content:counter(k);position:absolute;left:0;top:0;width:2.2rem;height:2.2rem;
  display:grid;place-items:center;font-weight:800;color:#000;background:#fff;
  clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.kroky pre{margin-top:.55rem;font-family:ui-monospace,Consolas,monospace;font-size:.8rem;line-height:1.7;
  color:#e8e8e8;background:#000;border:1px solid #222;border-left:3px solid #fff;
  padding:.7rem .9rem;overflow-x:auto}

/* ============ PODPOŘIT ============ */
.podpora{display:grid;grid-template-columns:1fr 1fr;gap:2rem;padding:0 clamp(1rem,4vw,3rem)}
.podpora__box{border:1px solid #1e1e1e;border-radius:8px;background:#070707;padding:2.2rem;text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:1rem}
.podpora__box h3{font-weight:800;font-size:1.5rem;text-transform:uppercase;text-shadow:var(--zar)}
.podpora__qr{position:relative;width:190px;height:190px;background:#fff;padding:10px;border-radius:4px}
.podpora__qr img{width:100%;height:100%;object-fit:contain}
.podpora__qr .ph{background:#fff;color:#888;border:2px dashed #bbb;inset:10px}
.podpora__box p{color:var(--sedy-text)}
.podpora__box b{color:#fff}
.podpora__box small{color:#9a9a9a}

/* ============ KONTAKT ============ */
.formular{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:1.2rem;
  border:1px solid #1e1e1e;border-radius:8px;background:#070707;padding:clamp(1.4rem,4vw,2.4rem)}
.formular__rada{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.formular label{display:flex;flex-direction:column;gap:.45rem}
.formular label span{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#bdbdbd}
.formular input,.formular textarea{font-family:var(--f);font-size:1rem;color:#fff;background:#000;
  border:1px solid #262626;padding:.75rem .9rem;border-radius:4px;resize:vertical;transition:border-color .2s,box-shadow .2s}
.formular input::placeholder,.formular textarea::placeholder{color:#5b5b5b}
.formular input:focus,.formular textarea:focus{outline:none;border-color:#fff;box-shadow:0 0 14px rgba(255,200,140,.25)}
.formular .banner{align-self:flex-start}
.formular__stav{font-size:.9rem;min-height:1.2em}
.formular__stav.ok{color:#9fd9a8}
.formular__stav.chyba{color:#e08a7a}

/* ============ FOOTER ============ */
.pata{border-top:1px solid #151515;margin-top:4rem;padding:3rem clamp(1rem,4vw,3rem) 4rem;text-align:center}
.pata__logo{font-weight:800;font-size:1.35rem;text-transform:uppercase;margin-bottom:1rem;text-shadow:var(--zar)}
.pata__logo b{color:#c8551d}
.pata p{max-width:760px;margin:0 auto .8rem;color:#8b8b8b;font-size:.85rem}
.pata__c{color:#5c5c5c!important;font-size:.78rem!important}

/* ============ REVEAL ============ */
.zprava,.feat,.post,.shot,.edice__karta,.podpora__box,.formular{opacity:0;transform:translateY(24px);
  transition:opacity .6s ease,transform .6s cubic-bezier(.22,1,.36,1)}
.viditelne{opacity:1!important;transform:none!important}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
  .zprava,.feat,.post,.shot,.edice__karta,.podpora__box,.formular{opacity:1;transform:none}
}

/* ============ RESPONSIVE ============ */
@media(max-width:1080px){.postavy{grid-template-columns:repeat(3,1fr)}}
@media(max-width:960px){
  .hero{grid-template-columns:1fr}
  .hero__art{min-height:52vh}
  .hero__art::after{background:linear-gradient(0deg,#000 0%,transparent 45%)}
  .hero__news{position:static;max-width:none;padding:1.2rem clamp(1rem,4vw,2rem) 0;order:3}
  .hero{display:flex;flex-direction:column}
  .zpravy{grid-template-columns:1fr}
  .feat{grid-template-columns:1fr;min-height:0}
  .feat--obr .feat__img{order:0}
  .feat__img{aspect-ratio:16/9}
  .feat__img::after,.feat--obr .feat__img::after{background:linear-gradient(0deg,#000 0%,transparent 45%)}
  .edice,.podpora{grid-template-columns:1fr}
}
@media(max-width:760px){
  .postavy{grid-template-columns:repeat(2,1fr)}
  .galerie{grid-template-columns:repeat(2,1fr)}
  .formular__rada{grid-template-columns:1fr}
  .nav{justify-content:space-between}
  .nav__burger{display:flex;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:.4rem}
  .nav__burger span{width:25px;height:2px;background:#fff;transition:transform .25s,opacity .2s}
  .nav__burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav__burger[aria-expanded="true"] span:nth-child(2){opacity:0}
  .nav__burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .nav__links{position:fixed;top:64px;left:0;right:0;flex-direction:column;align-items:center;gap:1.1rem;
    background:rgba(0,0,0,.97);border-bottom:1px solid #1a1a1a;padding:1.4rem 1rem 1.8rem;
    transform:translateY(-140%);transition:transform .3s ease}
  .nav__links.otevrene{transform:translateY(0)}
}
@media(max-width:460px){.postavy{grid-template-columns:1fr}.galerie{grid-template-columns:1fr}}

/* ============ AUDIO NA KARTÁCH ============ */
.post{cursor:pointer}
.post__zvuk{position:absolute;top:.6rem;right:.6rem;z-index:2;width:34px;height:34px;border-radius:50%;
  display:grid;place-items:center;color:#fff;background:rgba(0,0,0,.65);border:1px solid rgba(255,255,255,.35);
  transition:box-shadow .2s,background .2s}
.post:hover .post__zvuk{background:rgba(0,0,0,.85);box-shadow:0 0 14px rgba(255,190,120,.6)}
.post.hraje .post__zvuk{background:#fff;color:#000;box-shadow:0 0 18px rgba(255,200,140,.9);
  animation:tep 1s ease-in-out infinite}
@keyframes tep{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}
.post.hraje .post__img{outline:2px solid #fff;outline-offset:-2px;border-radius:8px}
.post.hraje h3{text-shadow:var(--zar)}
.post__stav{display:block;font-style:normal;font-size:.78rem;color:#e0a06a;margin-top:.35rem;min-height:1em}

/* lokální video v rámu */
.ram video{aspect-ratio:16/9;width:100%;display:block;background:#000}