/* ========================================
VL24 PAGE HEADER — SPACIAZ EXACT LAYOUT
======================================== */

.vl24-page-header{
  position:relative;
  min-height:620px;
  display:flex;
  align-items:center;
  overflow:hidden;
  color:#fff;
}

/* BG */

.vl24-page-header__bg{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  z-index:1;
}

/* INNER */

.vl24-page-header__inner{
  position:relative;
  z-index:3;
  width:100%;
  max-width:1240px;
  margin:0 auto;
  padding:120px 24px 40px; /* ⭐ sama spacing */
}

/* GRID */

.vl24-page-header__grid{
  display:grid;
  grid-template-columns:1fr 480px;
  align-items:end;
  gap:100px;
}

/* LEFT */

.vl24-ph-left{
  max-width:760px;
}

/* BREADCRUMB — vasakul all */

.vl24-breadcrumb{
  font-size:14px;
  opacity:.85;
}

.vl24-breadcrumb span{
  margin:0 8px;
  opacity:.6;
}

/* RIGHT TEXT */

.vl24-ph-right{
  font-size:20px;
  line-height:1.7;
  opacity:.9;
  align-self:end;
}

/* ========================================
TABLET + MOBILE FIX — HEADER HEIGHT
======================================== */

@media(max-width:1024px){

  /* kogu header madalamaks */
  .vl24-page-header{
    min-height:420px !important; 
    align-items:flex-end;
  }

  /* vähem õhku sees */
  .vl24-page-header__inner{
    padding:130px 24px 80px; 
  }

  /* grid lihtsamaks */
  .vl24-page-header__grid{
    grid-template-columns:1fr;
    gap:24px;
    min-height:auto;
  }

  .vl24-ph-right{
    font-size:16px;
  }

}


/* MOBILE EXTRA SMALL */

@media(max-width:640px){

  .vl24-page-header{
    min-height:360px !important;
  }

  .vl24-page-header__inner{
    padding:110px 20px 80px;
  }

}

/* =========================
GRID HEIGHT CONTROL
========================= */

.vl24-page-header__grid{
display:grid;
grid-template-columns:1fr 480px;
gap:100px;
min-height:320px; /* ⭐ oluline */
}

/* LEFT SIDE STRUCTURE */

.vl24-ph-left{
display:flex;
flex-direction:column;
height:100%;
}

/* title jääb üles */

.vl24-ph-top{
}

/* breadcrumb läheb alla */

.vl24-ph-bottom{
margin-top:auto;
}

/* RIGHT TEXT — ALATI ALLA */

.vl24-ph-right{
align-self:end;
}

/* =========================
PAGE HEADER USES HERO SYSTEM
========================= */

.vl24-page-header{
  position:relative;
  min-height:80vh; 
  display:flex;
  align-items:center;
  overflow:hidden;
  color:#fff;

  background-size:cover;
  background-position:center;
}

/* reuse hero overlay */

.vl24-page-header .hero-overlay{
  position:absolute;
  inset:0;
  z-index:1;
}

/* content */

.vl24-page-header__inner{
  position:relative;
  z-index:2;
}

/* HERO TITLE reuse */

.vl24-page-header .hero-title{
  font-family:"Outfit",sans-serif !important;
  font-weight:600 !important;
  letter-spacing:-0.03em !important;
  line-height:1 !important;

  text-shadow:
    0 20px 60px rgba(0,0,0,.35),
    0 2px 6px rgba(0,0,0,.25);
}

/* =========================
BREADCRUMB LINK STYLE
========================= */

.vl24-breadcrumb a{
  color:#fff !important;
  text-decoration:none !important;
  border:none !important;
}

.vl24-breadcrumb a:hover{
  color:#fff !important;
  text-decoration:none !important;
  opacity:.8; /* optional hover effect */
}

/* ========================================
MOBILE — HIDE RIGHT TEXT
only title + breadcrumb visible
======================================== */

@media(max-width:1024px){

  .vl24-ph-right{
    display:none !important;
  }

}

/* ========================================
REAL MOBILE HEIGHT FIX (OVERRIDE ALL)
peab olema faili lõpus
======================================== */

@media(max-width:1024px){

  /* eemaldab 80vh reegli */
  .vl24-page-header{
    min-height:300px !important;
    height:auto !important;
  }

  /* eemaldab grid sunnitud kõrguse */
  .vl24-page-header__grid{
    min-height:0 !important;
  }

  /* vähendab pildi ala */
  .vl24-page-header__inner{
    padding:60px 24px 0px !important;
  }

}


/* EXTRA SMALL MOBILE */

@media(max-width:640px){

  .vl24-page-header{
    min-height:300px !important;
  }

  .vl24-page-header__inner{
    padding:45px 20px 0px !important;
  }

}

/* =====================================
MOBILE — HEADER + BREADCRUMB LEFT BOTTOM
===================================== */

@media(max-width:1024px){

  /* kogu header sisu alla */
  .vl24-page-header{
    align-items:flex-end !important;
  }

  /* content vasakule */
  .vl24-page-header__inner{
    padding:60px 24px 40px !important; /* reguleeri kõrgust */
  }

  /* grid vasak joondus */
  .vl24-page-header__grid{
    align-items:end !important;
    justify-items:start !important;
  }

  /* vasak blokk vasakule */
  .vl24-ph-left{
    align-items:flex-start !important;
    text-align:left !important;
  }

  /* breadcrumb vasakule */
  .vl24-breadcrumb{
    text-align:left !important;
  }
}

/* =========================
PEAMENÜÜ — SUURED TÄHED AINULT MOBILE + TABLET
DESKTOP EI MUUTU
========================= */

@media (max-width:1024px){

  #mobileMenu .mobile-nav > li > a{
    text-transform:uppercase !important;
  }

}

/* =========================================
VL24 PAGE HEADER — MOVE TITLE + BREAD
MOBILE + TABLET ONLY
DESKTOP EI MUUTU
========================================= */

@media (max-width:1024px){

  /* kogu header content block */
  .vl24-page-header__inner{
    transform:translateY(80px) !important;
    /* ↑ muuda väärtust */

    /* 80px  = allapoole */
    /* -80px = ülespoole */
  }

  /* backup — kui inner ei tööta, liiguta otse */
  .vl24-ph-left,
  .vl24-breadcrumb,
  .vl24-page-header .hero-title{
    transform:translateY(-60px) !important;
  }

}

/* =========================================
VL24 PAGE HEADER — FULL WIDTH MODE
========================================= */

/* mobile + tablet full width */

@media (max-width:1024px){

  .vl24-page-header--wide .vl24-page-header__inner{
    max-width:100% !important;
    width:100% !important;
    margin:0 !important;
    padding:60px 20px 40px !important;
  }

  .vl24-page-header--wide .vl24-ph-left{
    max-width:none !important;
    width:100% !important;
  }

  .vl24-page-header--wide .vl24-page-header__grid{
    grid-template-columns:1fr !important;
    width:100%;
  }

}

/* desktop — left area grows until right text */

.vl24-page-header--wide .vl24-ph-left{
  max-width:none;
}

/* =========================================
VL24 PAGE HEADER — FORCE FULL WIDTH + NO WRAP
Pane faili LÕPPU
========================================= */

/* 1) võta KÕIK width piirangud maha */
.vl24-page-header .vl24-page-header__inner{
  max-width:none !important;
  width:100% !important;
  margin:0 !important;
}

.vl24-page-header .vl24-ph-left{
  max-width:none !important;
  width:100% !important;
}

/* 2) mobiil/tahvel: ainult 1 veerg ja full width */
@media (max-width:1024px){
  .vl24-page-header .vl24-page-header__grid{
    grid-template-columns:1fr !important;
    width:100% !important;
    max-width:none !important;
    gap:16px !important;
  }

  .vl24-page-header .vl24-page-header__inner{
    padding:60px 16px 40px !important;
  }
}

/* 3) breadcrumb EI TOHI WRAPPIBDA — jääb 1 reale */
.vl24-page-header .vl24-breadcrumb{
  display:flex !important;
  align-items:center;
  gap:8px;
  white-space:nowrap !important;
  flex-wrap:nowrap !important;
  width:100% !important;
  max-width:none !important;

  /* kui liiga pikk: ära murra, vaid scroll */
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
}

/* scroll bar peitu (optional, kuid ilus) */
.vl24-page-header .vl24-breadcrumb::-webkit-scrollbar{
  height:0;
}

/* “•” ei tohi omaette reale minna */
.vl24-page-header .vl24-breadcrumb span{
  flex:0 0 auto;
  opacity:.6;
}

/* title osa võib vajadusel ellipsis’eks minna (kui ei taha scrolli) */
.vl24-page-header .vl24-breadcrumb{
  text-overflow:ellipsis;
}