@import url('https://fonts.googleapis.com/css2?family=Great+Vibes&family=Lora:wght@400..700&display=swap');
:root {
  --main-color: rgb(142, 209, 224);
  --text-color: rgb(0,0,0);
}
html {overflow-x: hidden;} body { font-family: "Lora", serif; font-optical-sizing: auto; font-style: normal; }
#menu { background-color: var(--main-color)!important;}
#menu .nav-link { color: var(--text-color)!important; }
#h-max { min-height: 101vh; }
.text-color {color:var(--main-color)!important}
.hermanek{ background: url(../img/HERMANKY_NAPOJENE_NEW.svg) right/13% repeat-y border-box;}
[data-wipe] { display: inline-block; }
/* obaly písmen/ slov */
[data-wipe] .piece { display:inline-block; overflow:hidden; }
[data-wipe] .inner { display:inline-block; transform: translateY(0); } /* pro budoucí efekty */
.svgLogo {  opacity: 0; height:13vh!important;width:auto!important; position: absolute!important;z-index:10!important;top:31vh!important;left:14.3vw!important; transform: translateY(16px);  }
.textH {  padding: 2vh 0; opacity:0; font-family: "Great Vibes", cursive; font-weight: 400; font-style: normal; font-size: 7vh; position: absolute!important;z-index:1!important;top:6.4vh!important;left:50vw!important  }
.textH2 {  padding: 2vh 0 0 0;opacity:0;font-family: "Great Vibes", cursive; font-weight: 400; font-style: normal; font-size:4.3vh; position: absolute!important;z-index:1!important;top:14vh!important;left:51vw!important  }
@media (max-width: 1100px) {
.textH { left:5vw!important;font-size:14vw!important;top:3vh!important; }
.textH2 { left:5vw!important;font-size:7vw!important;top:17vh!important; }
}
#videoHP { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; }
.videoHP { position: relative; z-index: 0; overflow: hidden; height: 64.5vh!important; }
#maxHeight{  position: relative;  height: 100vh; height: 100svh;  overflow: hidden; }
#maxHeight .hero-img{ will-change: transform;  position: absolute; inset: 0;  width: 100%; height: 100%;  object-fit: cover;  z-index: 0; }

#revealBox{  position: absolute; left: 0; right: 0; bottom: -13vh;  z-index: 2; opacity: 0; }
.text-secondary-50{ color: rgba(255,255,255,.6); }

[data-bs-theme="light"] .text-secondary-50{ color: rgba(0,0,0,.6); }
.project { padding: clamp(24px,6vw,56px) 0; }
.project .container-xl { position: relative; }

/* obrázek */
.project-media { overflow: hidden; border-radius: 14px; }
.project-media img{
  display:block; width:100%;
  height: min(60vh, clamp(320px, 52vw, 560px));
  object-fit: cover;
opacity:0;
  will-change: transform, opacity;
}
@media (max-width: 576px){
  .project-media img{ height: min(50vh, 420px); }
}
/* karta */
.experience{
  top: clamp(83px, 83vw, 433px)!important;  
}
.project-card{
opacity:0;
  position:absolute;
  top: clamp(16px, 6vw, 64px);
  left: clamp(12px, 5vw, 64px);
  max-width: 420px;
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(6px);
  border-radius: 12px;
  padding: clamp(16px, 3vw, 28px);
  will-change: transform, opacity;
}
[data-bs-theme="dark"] .project-card{ background: rgba(0,0,0,.55); color:#fff; }

/* zrcadlo: karta napravo */
.project--alt .project-card{ left:auto; right: clamp(12px, 5vw, 64px); }