/* DVOJKA v1.5.1 — robust header stack
   Layout:
   announcement (optional) -> utility bar -> main navigation over hero
*/
:root{
  --dvojka-announcement-h:0px;
  --dvojka-utility-h:37px;
  --dvojka-nav-h:92px;
}

.utility-bar{
  position:relative;
  z-index:40;
  height:var(--dvojka-utility-h);
}
.utility-inner{
  height:var(--dvojka-utility-h)!important;
}

.site-header{
  position:absolute!important;
  top:calc(var(--dvojka-announcement-h) + var(--dvojka-utility-h))!important;
  left:0;
  right:0;
  z-index:30;
  color:#fff;
}
.nav-wrap{
  height:var(--dvojka-nav-h)!important;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}
.brand{
  min-width:250px!important;
  flex:0 0 auto;
  display:flex;
  align-items:center;
}
.brand-logo{
  display:block;
  width:250px!important;
  max-width:26vw!important;
  height:62px!important;
  max-height:62px!important;
  object-fit:contain!important;
  object-position:left center!important;
}
.main-nav{
  min-width:0;
  flex:1 1 auto;
  justify-content:flex-end;
}

/* Mega menu must follow the complete top stack too. */
.mega-menu{
  top:calc(var(--dvojka-announcement-h) + var(--dvojka-utility-h) + var(--dvojka-nav-h))!important;
}

/* Keep utility text/links visually separate from the logo/navigation. */
.utility-school{
  white-space:nowrap;
}
.utility-links{
  align-items:center;
}

/* Announcement itself should never overlap following layers. */
.school-announcement{
  position:relative!important;
  z-index:60!important;
}

/* Hero begins after the normal-flow utility bar; navigation overlays only hero. */
.hero{
  position:relative;
}

/* Desktop polish */
@media(min-width:1100px){
  .main-nav{gap:18px!important}
  .nav-top{padding-left:8px!important;padding-right:8px!important}
}
@media(max-width:1099px){
  .brand{min-width:220px!important}
  .brand-logo{width:220px!important;max-width:31vw!important}
}

/* Tablet/mobile: announcement height is still measured dynamically,
   but normal mobile menu rules remain in charge. */
@media(max-width:900px){
  :root{--dvojka-nav-h:76px}
  .site-header{
    top:calc(var(--dvojka-announcement-h) + var(--dvojka-utility-h))!important;
  }
  .brand{min-width:0!important}
  .brand-logo{
    width:205px!important;
    max-width:55vw!important;
    height:54px!important;
  }
  .mega-menu{
    top:calc(var(--dvojka-announcement-h) + var(--dvojka-utility-h) + var(--dvojka-nav-h))!important;
  }
}
@media(max-width:680px){
  :root{--dvojka-utility-h:37px;--dvojka-nav-h:76px}
  .brand-logo{
    width:185px!important;
    max-width:60vw!important;
    height:50px!important;
  }
}


/* v3.6.13 — compact single-message school info rotator */
.utility-inner{gap:18px!important}
.school-news-ticker{
  min-width:0;
  flex:0 1 610px;
  width:min(610px,48vw);
  height:var(--dvojka-utility-h);
  display:flex;
  align-items:center;
  gap:10px;
  overflow:hidden;
  font-size:11px;
  font-weight:750;
  color:#e8edf5;
}
.ticker-live{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  height:22px;
  padding:0 9px;
  border-radius:6px;
  background:#e52b32;
  color:#fff;
  font-size:9px;
  font-weight:900;
  letter-spacing:.11em;
  box-shadow:0 0 0 1px rgba(255,255,255,.08) inset;
}
.ticker-viewport{
  position:relative;
  min-width:0;
  flex:1 1 auto;
  height:28px;
  overflow:hidden;
  border-left:1px solid rgba(255,255,255,.10);
  padding-left:12px;
}
.ticker-card{
  position:absolute;
  inset:0 0 0 12px;
  display:flex;
  align-items:center;
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  color:#eef3f8;
  letter-spacing:.01em;
  will-change:transform,opacity;
}
.ticker-card a{
  color:#7edcff!important;
  font-weight:800!important;
  text-decoration:none;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.ticker-card a:hover{color:#fff!important}
.ticker-card.is-current{transform:translateX(0);opacity:1}
.ticker-card.is-next{transform:translateX(108%);opacity:0}
.ticker-viewport.is-switching .ticker-card.is-current{
  animation:dvojkaInfoOut .46s cubic-bezier(.55,.06,.68,.19) forwards;
}
.ticker-viewport.is-switching .ticker-card.is-next{
  animation:dvojkaInfoIn .52s cubic-bezier(.18,.84,.3,1) forwards;
}
@keyframes dvojkaInfoOut{
  0%{transform:translateX(0);opacity:1}
  100%{transform:translateX(-108%);opacity:.1}
}
@keyframes dvojkaInfoIn{
  0%{transform:translateX(108%);opacity:.15}
  100%{transform:translateX(0);opacity:1}
}
@media(max-width:1180px){
  .school-news-ticker{flex-basis:500px;width:min(500px,43vw);font-size:10px}
  .utility-links{gap:12px!important}
}
@media(max-width:900px){
  .school-news-ticker{flex:1 1 auto;width:auto;max-width:48vw}
  .ticker-live{display:none}
  .ticker-viewport{border-left:0;padding-left:0}
  .ticker-card{left:0}
}
@media(max-width:680px){
  .school-news-ticker{display:none!important}
}
@media(prefers-reduced-motion:reduce){
  .ticker-viewport.is-switching .ticker-card.is-current,
  .ticker-viewport.is-switching .ticker-card.is-next{animation-duration:.01ms!important}
}