:root{--bg:#222;--fg:#fff;--muted:#bfc5cc;--gap:6px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%;height:auto;display:block}

/* ---------- home (rozdelena obrazovka) ---------- */
main.split{display:flex;min-height:100vh;padding:0;max-width:none;margin:0}
.split-img{flex:0 0 50%;background:url(../img/hero.jpg) center/cover no-repeat}
.split-text{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 24px}
.split-text h1{font-size:clamp(32px,4.2vw,58px);margin:0;font-weight:700;text-transform:uppercase;line-height:1.1}
.split-text p{margin:10px 0 40px;font-size:clamp(13px,1.25vw,17px);text-transform:uppercase;color:var(--muted)}
.pills{display:flex;flex-direction:column;align-items:center;gap:16px}
.pills a{background:#fff;color:#111;font-weight:700;text-decoration:none;text-transform:uppercase;font-size:clamp(16px,1.7vw,24px);padding:4px 24px;border-radius:999px;line-height:1.5;transition:transform .15s,background .15s}
.pills a:hover{background:#e8e8e8;transform:scale(1.04)}

/* ---------- hlavicka ---------- */
.site-header{display:grid;grid-template-columns:1fr auto 1fr;align-items:start;padding:14px clamp(16px,3vw,42px) 10px}
.site-nav{grid-column:1;grid-row:1;display:flex;flex-wrap:wrap;gap:4px 24px;max-width:420px}
.site-nav a{text-decoration:none;font-size:17px;text-transform:uppercase;color:#fff;line-height:1.35}
.site-nav a:hover{opacity:.7}
.site-nav a.active{font-weight:700}
.logo{grid-column:2;grid-row:1;font-weight:700;text-decoration:none;font-size:21px;text-transform:uppercase;padding-top:2px;text-align:center}
.nav-toggle{grid-column:3;grid-row:1;justify-self:end;display:none;background:none;border:0;width:40px;height:40px;padding:8px;cursor:pointer}
.nav-toggle span{display:block;height:2px;background:#fff;margin:6px 0}

/* ---------- stranky ---------- */
main{padding:0 clamp(12px,3vw,42px) 40px;max-width:1900px;margin:0 auto}
.page-title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.hint{text-align:center;color:var(--muted);font-size:15px;text-transform:uppercase;margin:34px 0 26px}

.embeds{display:grid;gap:20px;margin:0 auto 30px;max-width:1200px}
.embeds.yt{grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr))}
.embeds.ig{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));max-width:1400px}
.embed{position:relative;background:#2c2c2c;overflow:hidden}
.yt .embed{aspect-ratio:16/9}
.ig .embed{height:640px}
.embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

.grid{display:flex;flex-wrap:wrap;gap:var(--gap)}
.grid::after{content:"";flex-grow:1000000}
.g-item{position:relative;display:block;overflow:hidden;background:#2c2c2c;cursor:zoom-in}
.g-item i{display:block}
.g-item img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .3s}
.g-item:hover img{opacity:.88}

/* ---------- o mne ---------- */
main.about{max-width:1100px;padding-top:40px}
.about-row{display:flex;gap:clamp(20px,4vw,56px);align-items:center;margin-bottom:40px}
.about-img{cursor:zoom-in}
.about-img.portrait{flex:0 0 33%;width:33%;object-fit:cover;aspect-ratio:2/3}
.about-text{flex:1;text-align:center}
.about-text p{font-size:clamp(16px,1.5vw,19px);line-height:1.45;margin:0 0 20px}
.about-img.wide{width:100%;margin:0 auto}

/* ---------- pata, hore, lightbox ---------- */
.site-footer{text-align:center;color:#8d9096;font-size:14px;padding:30px 20px 50px;display:flex;flex-direction:column;gap:2px}
.site-footer a{text-decoration:none}
.site-footer a:hover{color:#fff}
.to-top{position:fixed;right:24px;bottom:24px;width:50px;height:50px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;font-size:22px;cursor:pointer}
.to-top:hover{background:rgba(255,255,255,.28)}
.to-top[hidden]{display:none}
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.95);display:flex;align-items:center;justify-content:center}
.lightbox[hidden]{display:none}
.lightbox img{max-width:92vw;max-height:92vh;object-fit:contain}
.lightbox button{position:absolute;background:none;border:0;color:#fff;cursor:pointer;opacity:.75}
.lightbox button:hover{opacity:1}
.lb-close{top:14px;right:22px;font-size:42px;line-height:1}
.lb-prev,.lb-next{top:50%;transform:translateY(-50%);font-size:34px;padding:20px}
.lb-prev{left:6px}.lb-next{right:6px}

@media (max-width:900px){
  .split{flex-direction:column}
  .split-img{flex:0 0 auto;aspect-ratio:1/1;max-height:60vh;width:100%}
  .site-header{grid-template-columns:1fr auto;grid-template-areas:"logo btn" "nav nav";align-items:center}
  .logo{grid-column:auto;grid-row:auto;grid-area:logo;text-align:left;font-size:18px}
  .nav-toggle{grid-column:auto;grid-row:auto;grid-area:btn;display:block}
  .site-nav{grid-column:auto;grid-row:auto;grid-area:nav;display:none;flex-direction:column;max-width:none;padding:10px 0 6px;gap:2px}
  .site-nav.open{display:flex}
  .site-nav a{padding:8px 0}
  .about-row{flex-direction:column}
  .about-img.portrait{flex:none;width:70%}
  .ig .embed{height:600px}
  .g-item{width:auto!important;flex-grow:1!important;min-width:46%}
}