:root{
  --ink:#111111;
  --cream:#FFF9EE;
  --yellow:#FFDE59;
  --pink:#FF5CAA;
  --blue:#3D5AFE;
  --green:#8CFF3D;
  --orange:#FF8A3D;
  --white:#ffffff;
  --border:3px;
  --shadow-off:7px;
  --nav-h:64px;
}

*{box-sizing:border-box;margin:0;padding:0;}

html{scroll-behavior:smooth;}

body{
  font-family:'Space Grotesk',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  color:var(--ink);
  background:var(--cream);
  overflow-x:hidden;
}

a{color:inherit;text-decoration:none;}

h1,h2,h3{
  font-family:'Archivo Black','Arial Black',Impact,sans-serif;
  text-transform:uppercase;
  letter-spacing:-0.01em;
  line-height:1;
}

section, header.hero{scroll-margin-top:calc(var(--nav-h) + var(--border) + 8px);}
img,svg{display:block;max-width:100%;}

/* ---------- shared neubrutalist primitives ---------- */
.hard-border{
  border:var(--border) solid var(--ink);
}
.hard-shadow{
  box-shadow: var(--shadow-off) var(--shadow-off) 0 0 var(--ink);
}
.press{
  transition: transform .12s ease, box-shadow .12s ease;
}
.press:hover{
  transform: translate(-2px,-2px);
  box-shadow: calc(var(--shadow-off) + 2px) calc(var(--shadow-off) + 2px) 0 0 var(--ink);
}
.press:active{
  transform: translate(var(--shadow-off), var(--shadow-off));
  box-shadow: 0 0 0 0 var(--ink);
}

.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:'Space Grotesk',sans-serif;
  font-weight:700;
  font-size:16px;
  padding:14px 26px;
  border-radius:12px;
  border:var(--border) solid var(--ink);
  box-shadow: var(--shadow-off) var(--shadow-off) 0 0 var(--ink);
  cursor:pointer;
}
.btn-yellow{background:var(--yellow);}
.btn-pink{background:var(--pink);color:var(--white);}
.btn-blue{background:var(--blue);color:var(--white);}
.btn-black{background:var(--ink);color:var(--white);}
.btn-white{background:var(--white);}

.tag{
  display:inline-block;
  font-size:12px;font-weight:700;
  text-transform:uppercase;letter-spacing:.04em;
  padding:6px 12px;
  border-radius:999px;
  border:2px solid var(--ink);
  background:var(--white);
}

.sticker{
  position:absolute;
  border:var(--border) solid var(--ink);
  border-radius:16px;
  box-shadow: 5px 5px 0 0 var(--ink);
  background:var(--white);
  padding:10px 16px;
  font-weight:700;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.03em;
}

.reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .5s ease, transform .5s cubic-bezier(.2,.8,.2,1);
}
.reveal.visible{opacity:1;transform:translateY(0);}

/* ---------- NAV ---------- */
nav.topnav{
  position:fixed;top:0;left:0;right:0;
  height:var(--nav-h);
  z-index:1000;
  background:var(--yellow);
  border-bottom:var(--border) solid var(--ink);
}
.nav-inner{
  max-width:1120px;height:100%;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 22px;
}
.nav-logo{
  display:flex;align-items:center;gap:10px;
  font-family:'Archivo Black',sans-serif;
  font-size:16px;
  text-transform:uppercase;
}
.nav-logo .box{
  width:34px;height:34px;
  background:var(--ink);
  color:var(--yellow);
  border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  font-size:18px;
  transform:rotate(-6deg);
}
.nav-links{
  display:flex;gap:10px;list-style:none;
}
.nav-links a{
  font-size:14px;font-weight:700;
  padding:8px 14px;
  border-radius:10px;
  border:2px solid transparent;
}
.nav-links a:hover{
  border-color:var(--ink);
  background:var(--white);
}
.nav-cta{display:none;}
@media(min-width:821px){
  .nav-cta{display:inline-flex;padding:9px 18px;font-size:13px;box-shadow:4px 4px 0 0 var(--ink);}
}
.nav-toggle{
  display:none;flex-direction:column;gap:5px;
  background:var(--white);
  border:2px solid var(--ink);
  border-radius:8px;
  cursor:pointer;padding:9px 10px;
}
.nav-toggle span{width:20px;height:3px;background:var(--ink);border-radius:2px;}

.mobile-menu{
  position:fixed;inset:0;
  background:var(--yellow);
  z-index:999;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  gap:22px;
  transform:translateY(-100%);
  transition:transform .35s cubic-bezier(.2,.8,.2,1);
}
.mobile-menu.open{transform:translateY(0);}
.mobile-menu a{font-family:'Archivo Black',sans-serif;font-size:26px;text-transform:uppercase;}

/* ---------- TICKER ---------- */
.ticker{
  margin-top:calc(var(--nav-h) + var(--border));
  background:var(--ink);
  color:var(--yellow);
  overflow:hidden;
  white-space:nowrap;
  border-bottom:var(--border) solid var(--ink);
}
.ticker-track{
  display:inline-flex;
  animation:scroll-left 22s linear infinite;
  padding:10px 0;
}
.ticker-track span{
  font-family:'Archivo Black',sans-serif;
  font-size:14px;
  letter-spacing:.04em;
  padding:0 22px;
  text-transform:uppercase;
}
@keyframes scroll-left{
  0%{transform:translateX(0);}
  100%{transform:translateX(-50%);}
}

/* ---------- HERO ---------- */
header.hero{
  position:relative;
  padding:96px 24px 110px;
  text-align:center;
  display:flex;flex-direction:column;align-items:center;
  background:
    radial-gradient(circle at 15% 20%, var(--yellow) 0, var(--yellow) 8%, transparent 8.5%),
    radial-gradient(circle at 88% 30%, var(--green) 0, var(--green) 6%, transparent 6.5%),
    var(--cream);
  overflow:hidden;
}
.hero-badge{
  background:var(--white);
  border:var(--border) solid var(--ink);
  border-radius:999px;
  padding:8px 18px;
  font-weight:700;font-size:13px;
  box-shadow:4px 4px 0 0 var(--ink);
  transform:rotate(-2deg);
  margin-bottom:28px;
}
h1.headline{
  font-size:clamp(2.6rem,9vw,5.6rem);
  max-width:920px;
}
h1.headline mark{
  background:var(--pink);
  color:var(--white);
  padding:0 12px;
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
  display:inline-block;
  transform:rotate(-1deg);
}
p.subhead{
  font-size:clamp(1.05rem,2.4vw,1.4rem);
  font-weight:500;
  max-width:600px;
  margin-top:26px;
  line-height:1.5;
}
.hero-ctas{
  margin-top:36px;
  display:flex;gap:18px;flex-wrap:wrap;justify-content:center;
}
.sticker.s1{top:18%;left:6%;transform:rotate(-9deg);display:none;}
.sticker.s2{top:24%;right:7%;transform:rotate(8deg);background:var(--blue);color:var(--white);display:none;}
@media(min-width:900px){.sticker.s1,.sticker.s2{display:block;}}

/* ---------- SECTION SHARED ---------- */
section{padding:100px 24px;}
.section-inner{max-width:1120px;margin:0 auto;}
.kicker{
  display:inline-block;
  font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.06em;
  background:var(--ink);color:var(--white);
  padding:6px 14px;border-radius:8px;
  margin-bottom:18px;
}
h2.section-title{
  font-size:clamp(2rem,5.5vw,3.2rem);
  max-width:760px;
}
p.section-lead{
  font-size:clamp(1.02rem,2vw,1.2rem);
  font-weight:500;
  max-width:600px;
  margin:18px auto 0;
  line-height:1.55;
}
.center{text-align:center;margin-left:auto;margin-right:auto;}

/* ---------- O KROUZKU ---------- */
#o-krouzku{background:var(--white);border-top:var(--border) solid var(--ink);border-bottom:var(--border) solid var(--ink);}
.feature-grid{
  margin-top:56px;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:28px;
}
.feature-card{
  border-radius:20px;
  padding:34px 30px;
  position:relative;
  border:var(--border) solid var(--ink);
  box-shadow: var(--shadow-off) var(--shadow-off) 0 0 var(--ink);
}
.feature-card:nth-child(1){background:var(--yellow);transform:rotate(-1.5deg);}
.feature-card:nth-child(2){background:var(--pink);color:var(--white);transform:rotate(1.2deg);}
.feature-card:nth-child(3){background:var(--blue);color:var(--white);transform:rotate(1.5deg);}
.feature-card:nth-child(4){background:var(--green);transform:rotate(-1.2deg);}
.feature-icon{
  font-size:40px;
  margin-bottom:16px;
  display:inline-block;
  background:var(--white);
  border:var(--border) solid var(--ink);
  border-radius:14px;
  padding:10px 14px;
}
.feature-card h3{font-size:22px;margin-bottom:10px;}
.feature-card p{font-size:15px;font-weight:500;line-height:1.55;}

/* ---------- ROZVRH (dark) ---------- */
#rozvrh{background:var(--ink);color:var(--white);}
#rozvrh .kicker{background:var(--yellow);color:var(--ink);}
.schedule-card{
  margin:56px auto 0;
  max-width:800px;
  background:var(--white);
  color:var(--ink);
  border-radius:22px;
  padding:44px;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:30px;
  border:var(--border) solid var(--ink);
  box-shadow: var(--shadow-off) var(--shadow-off) 0 0 var(--yellow);
}
.schedule-item .label{
  font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  background:var(--yellow);
  display:inline-block;
  padding:3px 10px;border-radius:6px;
  margin-bottom:8px;
  border:2px solid var(--ink);
}
.schedule-item .value{
  font-family:'Archivo Black',sans-serif;
  font-size:24px;text-transform:uppercase;
}
.schedule-note{
  grid-column:1 / -1;
  padding-top:24px;
  border-top:var(--border) dashed var(--ink);
  font-size:15px;font-weight:500;line-height:1.6;
}

/* ---------- PROJEKTY ---------- */
#projekty{background:var(--cream);}
.project-grid{
  margin-top:56px;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:28px;
}
.project-card{
  border-radius:20px;
  overflow:hidden;
  background:var(--white);
}
.project-thumb{
  height:180px;
  display:flex;align-items:center;justify-content:center;
  font-size:66px;
  border-bottom:var(--border) solid var(--ink);
}
.project-thumb.t1{background:var(--pink);}
.project-thumb.t2{background:var(--blue);}
.project-thumb.t3{background:var(--green);}
.project-thumb.t4{background:var(--yellow);}
.project-body{padding:24px 26px 28px;}
.project-body h3{font-size:19px;margin:12px 0 8px;text-transform:none;}
.project-body p{font-size:14px;font-weight:500;line-height:1.5;}

/* ---------- PRIHLASKA ---------- */
#prihlaska{
  background:var(--pink);
  color:var(--white);
  border-top:var(--border) solid var(--ink);
  border-bottom:var(--border) solid var(--ink);
}
#prihlaska .kicker{background:var(--ink);color:var(--yellow);}
.contact-card{
  margin:48px auto 0;
  max-width:680px;
  background:var(--white);
  color:var(--ink);
  border-radius:22px;
  padding:48px 42px;
  text-align:center;
  border:var(--border) solid var(--ink);
  box-shadow: var(--shadow-off) var(--shadow-off) 0 0 var(--ink);
}
.contact-card h3{font-size:24px;margin-bottom:12px;}
.contact-card p{font-size:15px;font-weight:500;line-height:1.6;margin-bottom:26px;}
.contact-meta{
  display:flex;justify-content:center;gap:16px;
  margin-bottom:30px;flex-wrap:wrap;
}
.contact-meta div{
  text-align:left;
  border:2px solid var(--ink);
  border-radius:12px;
  padding:12px 16px;
  background:var(--cream);
}
.contact-meta .label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#666;margin-bottom:4px;}
.contact-meta .value{font-size:15px;font-weight:700;}

/* ---------- FOOTER ---------- */
footer{
  background:var(--ink);
  color:var(--white);
  padding:40px 24px 56px;
  text-align:center;
}
footer p{font-size:13px;font-weight:600;line-height:1.7;}
footer p.small{font-size:11px;font-weight:500;color:#999;}

/* ---------- RESPONSIVE ---------- */
@media (max-width:820px){
  section{padding:64px 20px;}
  header.hero{padding:64px 20px 80px;}
  .nav-links{display:none;}
  .nav-toggle{display:flex;}
  .feature-grid,.project-grid{grid-template-columns:1fr;}
  .schedule-card{grid-template-columns:1fr;padding:32px 26px;}
  .contact-meta div{text-align:center;}
  :root{--shadow-off:5px;}
}
