/* 1. STAN BAZOWY (Gdy jesteśmy na samej górze strony - z gradientem) */
#masthead {
  position: sticky !important;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999 !important;
  
  /* Gradient od białego do chłodnego błękitu strony */
  background: linear-gradient(to bottom, #ffffff, #f2f6fc) !important;
	border: none;
  transition: background .4s, box-shadow .4s, border-color .4s;
}

/* 2. STAN PO SCROLLOWANIU (Gdy JS doda klasę .is-sticky) */
#masthead.is-sticky {
  /* Nadpisujemy gradient Twoim półprzezroczystym kolorem */
  background: rgba(242, 246, 252, .82) !important;
  backdrop-filter: blur(14px) saturate(140%);
    border-bottom: 1px solid transparent;
  border-bottom-color: var(--line) !important;
  
  /* Subtelny cień odcinający nagłówek od treści */
  box-shadow: 0 10px 30px -15px rgba(16, 29, 64, 0.08); 
}

/* 3. DOPASOWANIE DO PASKA ADMINA WORDPRESS */
.admin-bar #masthead {
  top: 32px;
}
@media screen and (max-width: 782px) {
  .admin-bar #masthead {
    top: 46px;
  }
}