/* =========================================================
   HEADER ALGEMEEN (≥ 981px)
   ========================================================= */
#main-header {
  transition: background 0.35s ease, padding 0.35s ease;
  padding-top: 50px;
}

h1, h2, h3, h4, h5, h6,
.et_pb_module_header,
.entry-title {
  font-family: 'Open Sans', sans-serif !important;
  font-weight: 400;
}

#main-header.et-fixed-header {
  padding-top: 0;
}

/* Homepagina */
#main-header.et-fixed-header {
  background: linear-gradient(
    140deg,
    rgba(0,98,173, 0.99) 1%,  /* Blauw #0062ad bij 1% */
    rgba(41,17,96, 0.99) 100%    /* donkerblauw #291160 bij 100% */
  ) !important;
}

/* =========================================================
   HEADER – MOBIEL (≤ 980px)
   ========================================================= */
@media (max-width: 980px) {

  /* Sticky header gedrag */
  #main-header {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    background: transparent !important;
    padding-top: 20px;
  }

  #main-header.et-fixed-header {
    padding-top: 0;
  }

  #page-container {
    padding-top: 80px; /* pas aan aan je headerhoogte */
  }

  /* Homepagina kleurverloop bij scroll */
  #main-header.et-fixed-header {
    background: linear-gradient(
      140deg,
      rgba(0,98,173, 0.99) 1%,  /* Blauw #0062ad bij 1% */
      rgba(41,17,96, 0.99) 100%    /* donkerblauw #291160 bij 100% */
    ) !important;
  }

  /* Mobiel menu (hamburger) */
  #main-header .et_mobile_menu {
    background: inherit !important;
  }
  #main-header .et_mobile_menu a {
    color: #ffffff !important;
    transition: color 0.25s ease;
  }
  #main-header .et_mobile_menu a:hover {
    color: #ffffff !important;
  }
}

/* =========================================================
   Browserbalkkleur per pagina (iOS/Android Safari effect)
   ========================================================= */

/* Homepagina */
html.home, body.home {
  background-color: #fff;
}

/* Specifieke pagina’s */
html.page-id-63, body.page-id-63,
html.page-id-103, body.page-id-103,
html.page-id-117, body.page-id-117,
html.page-id-134, body.page-id-134 {
  background-color: #352597;
}
