/* ==========================================
   1. ASTRA CONTAINER BELSŐ MARGÓK NULLÁZÁSA
   ========================================== */
#masthead,
#masthead .ast-container,
.main-header-bar,
.main-header-bar-navigation {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Fix (sticky) fejléc - nincs ingyenes beépített opció Astrában/HFE-ben,
   ezért sima CSS-sel */
#masthead {
  position: sticky;
  top: 0;
  z-index: 999;
}

/* Bejelentkezve a WordPress admin sáv is fixen a tetején van (32px,
   mobilon 46px) - enélkül a sticky fejléc alá/mögé csúszna, és levágná
   a logó tetejét. A látogatóknak (nincs admin sáv) ez nem számít. */
body.admin-bar #masthead {
  top: 32px;
}

@media (max-width: 782px) {
  body.admin-bar #masthead {
    top: 46px;
  }
}

/* Teljes sáv zsugorodása scroll esetén (scroll-effects.js kapcsolja a body-ra az
   is-scrolled class-t 100px fölött) - az Astra saját 80px-es min-height-jét
   és a menüpontok line-height-jét is összehangoljuk a logó paddingjével,
   különben csak a logó zsugorodna, a sáv többi része nem. */
.ast-primary-header-bar,
.ast-primary-header-bar .site-primary-header-wrap {
  transition: min-height 0.2s ease;
}

.ast-primary-header-bar .main-header-menu > .menu-item {
  transition: line-height 0.2s ease;
}

body.is-scrolled .ast-primary-header-bar,
body.is-scrolled .ast-primary-header-bar .site-primary-header-wrap {
  min-height: 50px !important;
}

body.is-scrolled .ast-primary-header-bar .main-header-menu > .menu-item {
  line-height: 50px !important;
}

/* ==========================================
   2. ALAPVETŐ MENÜPONT STÍLUSOK
   ========================================== */
li.menu-item > a {
  position: relative !important;
  color: #000000 !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  transition: color 0.3s ease;
}

/* Hover aláhúzás (balra igazítva, 30px széles, 20px-re a szöveg alatt) */
li.menu-item > a:hover::after {
  content: '';
  position: absolute;
  bottom: 20px !important;
  left: 15px !important;
  width: 30px !important;
  height: 4px !important;
  background-color: #000000 !important;
}

/* A 20px-es távolság a 80px-es (nem görgetett) sávmagassághoz lett igazítva -
   zsugorodott (50px-es) sávnál arányosan kevesebb kell, különben az aláhúzás
   nem a szöveg alatt jelenik meg. */
body.is-scrolled li.menu-item > a:hover::after {
  bottom: 13px !important;
}

/* ==========================================
   3. BAL OLDALI SÁRGA LOGÓ KONTÉNER
   (a valódi wrapper a .site-branding - Astra saját "Egyéni logó"
   funkciója, a .site-logo-container soha nem létezett a HTML-ben)
   ========================================== */
.site-branding img {
  max-height: 50px !important;
  width: auto !important;
  display: block !important;
}

/* ==========================================
   4. JOBB OLDALI SÁRGA KONTAKT GOMB
   ========================================== */
li.menu-item:last-child {
  margin-right: 0 !important;
  padding-right: 0 !important;
  height: 100% !important;
}

li.menu-item:last-child > a {
  background-color: #ffc920 !important;
  color: #000000 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 100% !important;
  padding: 0 35px !important;
  margin: 0 !important;
}

/* Hover aláhúzás letiltása a sárga Kontakt gombra */
li.menu-item:last-child > a:hover::after {
  display: none !important;
}
.site-branding {
    /* Az Astra saját .ast-site-identity{width:100%} szabálya miatt a doboz
       a szülő (auto méretű flex elem) méretéhez igazodott, és a padding nem
       tudta ténylegesen kiszélesíteni - width:auto-val és explicit
       box-sizinggal a padding most már valóban megnöveli a dobozt. */
    width: auto !important;
    box-sizing: content-box !important;
    background-color: #FFC920;
    /* padding: 16px 162px 14px 69px !important; */
    padding: 16px 90px 14px 69px !important;
    transition: padding-top 0.2s ease, padding-bottom 0.2s ease;
}

/* Mobilon a 69px+90px oldalpadding túl sok helyet venne el a keskeny
   képernyőn (a logó dobozt szinte a teljes szélességre nyújtaná) -
   ezért ott jelentősen csökkentve. */
@media (max-width: 768px) {
    .site-branding {
        padding: 12px 20px 10px 16px !important;
    }
}

/* A sáv tényleges magasságát a .site-branding tartalma (kép + fent/lent
   padding) adja, a min-height-nek emiatt nincs látható hatása - ezért itt
   a függőleges paddingot csökkentjük scroll esetén (a bal/jobb padding
   marad), így zsugorodik ténylegesen az egész sáv. */
body.is-scrolled .site-branding {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}