:root{
  --bg:#060606;
  --text:#f2f2f2;
  --muted:rgba(255,255,255,.72);
  --accent:#ff2fa6;
  --accent2:#ff6bd1;
  --border:rgba(255,255,255,.12);
  --glass:rgba(0,0,0,.38);
  --glass2:rgba(0,0,0,.58);
  --shadow: 0 22px 70px rgba(0,0,0,.55);
  --radius:14px;
  --container: 1100px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.65;
}
img{max-width:100%;display:block}
a{color:inherit}

.container{max-width:var(--container);margin:0 auto;padding:0 18px}

.skip{
  position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden;
}
.skip:focus{left:12px;top:12px;width:auto;height:auto;padding:10px 12px;background:#111;border:1px solid var(--border);border-radius:10px;z-index:9999}

/* ===== FIXNÍ POZADÍ ===== */
.bg{
  position:fixed;inset:0;
  z-index:-2;
  background: url('../img/hero.jpg') center/cover no-repeat;
  transform: translateZ(0);
}
.bg::after{
  content:"";
  position:absolute;inset:0;
  background:
    radial-gradient(1200px 800px at 70% 20%, rgba(255,47,166,.18), transparent 55%),
    linear-gradient(180deg, rgba(0,0,0,.65), rgba(0,0,0,.82));
}

/* ===== TOPBAR ===== */
.topbar{
  position:fixed;top:0;left:0;right:0;
  z-index:50;
  background:rgba(0,0,0,.68);
  backdrop-filter: blur(10px);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.topbar__inner{display:flex;align-items:center;gap:14px;min-height:62px}
.brand{
  display:flex;align-items:center;gap:10px;
  font-weight:900;letter-spacing:.08em;
  text-decoration:none;
}
.brand__text{font-size:14px}
.brand__text .accent{color:var(--accent)}

.nav{margin-left:auto}
.nav__toggle{
  display:none;
  border:1px solid var(--border);
  background:rgba(255,255,255,.06);
  color:var(--text);
  padding:10px 12px;
  border-radius:12px;
  font-weight:800;
  letter-spacing:.04em;
}
.nav__links{display:flex;gap:16px;align-items:center}
.nav__links a{
  text-decoration:none;
  font-size:14px;
  color:rgba(255,255,255,.78);
  padding:8px 10px;
  border-radius:10px;
}
.nav__links a:hover{color:#fff;background:rgba(255,255,255,.06)}

/* ===== HERO ===== */
.hero{
  min-height: 92vh;
  padding-top: 62px;
  display:flex;
  align-items:center;
}
.hero__grid{padding: 56px 0}
.hero__title{
  margin:0;
  font-size: clamp(34px, 5.2vw, 58px);
  letter-spacing:.08em;
  font-weight:1000;
  text-transform:uppercase;
  text-align:center;
  text-shadow: 0 18px 45px rgba(0,0,0,.70);
}
.hero__typed{color:var(--accent)}
.caret{
  display:inline-block;
  width:.6ch;
  margin-left:.2ch;
  color:rgba(255,255,255,.92);
  text-shadow: 0 18px 45px rgba(0,0,0,.70);
  animation: caretBlink 1s step-end infinite;
}
@keyframes caretBlink{50%{opacity:0}}

.hero__lead{
  margin:14px auto 0;
  max-width: 78ch;
  color: rgba(255,255,255,.86);
  text-align:center;
}
.hero__actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:18px}

.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding: 11px 16px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.16);
  text-decoration:none;
  font-weight:900;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.06em;
  box-shadow: 0 10px 26px rgba(0,0,0,.35);
}
.btn--accent{
  background: linear-gradient(180deg, var(--accent2), var(--accent));
  border-color: rgba(255,255,255,.14);
}
.btn--ghost{background: rgba(255,255,255,.06)}
.btn:focus{outline:2px solid rgba(255,47,166,.55);outline-offset:2px}

/* ===== SECTIONS / CARDS ===== */
main{padding: 36px 0 70px}
.section{padding: 28px 0}

.card{
  border-radius: var(--radius);
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
}
.card--glass{
  background: linear-gradient(180deg, rgba(0,0,0,.32), rgba(0,0,0,.50));
  backdrop-filter: blur(10px);
}
.card__body{padding: 22px}

.h2{
  margin:0 0 10px;
  font-size: 20px;
  letter-spacing:.04em;
  text-transform:uppercase;
  color: rgba(255,255,255,.92);
}
.h3{
  margin:20px 0 10px;
  font-size: 16px;
  letter-spacing:.02em;
  color: rgba(255,255,255,.92);
}
.muted{color:var(--muted)}

.prose p{margin:0 0 12px;color:rgba(255,255,255,.86)}
.prose a{color:var(--accent2)}

.bullets{margin:12px 0 0;padding-left:18px;color:rgba(255,255,255,.86)}
.bullets li{margin:6px 0}

.section__head{display:flex;flex-wrap:wrap;gap:10px;align-items:baseline;justify-content:space-between;margin-bottom:10px}

/* ===== SCHEDULE ===== */
.schedule{margin-top: 6px}
.schedule__wrap{overflow:auto;border-radius: var(--radius);border:1px solid rgba(255,255,255,.10)}
.table{
  width:100%;
  min-width: 820px;
  border-collapse: collapse;
  background: rgba(0,0,0,.30);
}
.table th,.table td{
  border:1px solid rgba(255,255,255,.12);
  padding:10px;
  vertical-align: top;
}
.table th{
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(8px);
  text-align:center;
}
.table td{min-width:140px}

.lesson{display:flex;flex-direction:column;gap:2px}
.lesson__title{font-weight:1000}
.lesson__detail{color:rgba(255,255,255,.78);font-size:13px}

/* Mobile schedule cards */
.schedule-cards{display:none;gap:12px;margin-top:12px}
.day-card{
  border:1px solid rgba(255,255,255,.10);
  border-radius: var(--radius);
  background: rgba(0,0,0,.35);
  padding: 14px;
}
.day-card h3{margin:0 0 10px;font-size:16px;letter-spacing:.04em;text-transform:uppercase}
.slot{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-top:1px solid rgba(255,255,255,.08)}
.slot:first-of-type{border-top:0;padding-top:0}
.slot__time{min-width:70px;font-weight:1000;color:rgba(255,255,255,.92)}

/* ===== TABS ===== */
.tabs{margin-top:16px}
.tablist{display:flex;flex-wrap:wrap;gap:10px;padding:0;margin:0 0 12px;list-style:none}
.tabbtn{
  border:1px solid var(--border);
  background: rgba(255,255,255,.05);
  color: var(--text);
  padding: 10px 12px;
  border-radius: 12px;
  cursor:pointer;
  font-weight:900;
  text-decoration:none;
}
.tabbtn--link{display:inline-flex;align-items:center}
.tabbtn[aria-selected="true"]{background: rgba(255,47,166,.18);border-color: rgba(255,47,166,.35)}
.tabpanel{
  border:1px solid rgba(255,255,255,.10);
  border-radius: var(--radius);
  background: rgba(0,0,0,.26);
  padding: 16px;
}

.fineprint{margin:14px 0 0;color:rgba(255,255,255,.70)}

/* ===== CONTACT ===== */
.contactGrid{display:grid;grid-template-columns: 1fr 1fr;gap:14px;margin-top:10px}
.contactCard{
  border:1px solid rgba(255,255,255,.10);
  border-radius: var(--radius);
  background: rgba(0,0,0,.28);
  padding: 14px;
}
.contactCard:first-child{display:grid;grid-template-columns: 64px 1fr;gap:12px;align-items:center}
.contactIcon{border-radius:14px}
.contactName{font-weight:1000}
.contactActions{grid-column: 1 / -1;display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}

/* ===== FOOTER ===== */
.footer{padding: 22px 0 30px;border-top:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.72)}
.footer__inner{display:flex;gap:14px;flex-wrap:wrap;align-items:center;justify-content:space-between}

/* ===== RESPONSIVE ===== */
@media (max-width: 900px){
  .hero{min-height: 82vh}
  .contactGrid{grid-template-columns:1fr}
}
@media (max-width: 760px){
  .nav__toggle{display:inline-flex}
  .nav__links{
    display:none;
    position:absolute;
    left:12px;right:12px;top:64px;
    padding:10px;
    background: rgba(0,0,0,.92);
    border:1px solid rgba(255,255,255,.10);
    border-radius: 14px;
    flex-direction:column;
    align-items:stretch;
  }
  .nav__links[data-open="true"]{display:flex}
  .nav__links a{padding:12px}

  .schedule__wrap{display:none}
  .schedule-cards{display:grid}
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .caret{animation:none}
}