/* ==========================================================================
   overrides.css — tweaks layered over the original theme.
   Interior-page heroes use the real banner photos (images/banner1s–4s.jpg,
   downloaded from the live site) shown via the theme's per-page background-image,
   with a navy scrim so the white page title stays legible. Loaded AFTER style.css.
   ========================================================================== */

.page-header-other1,
.page-header-other2,
.page-header-other3,
.page-header-other4 {
  position: relative;
  padding: 78px 0 !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  box-shadow: inset 0 -3px 0 rgba(0,0,0,.18) !important;
}
/* navy scrim over the photo for title legibility */
.page-header-other1::before,
.page-header-other2::before,
.page-header-other3::before,
.page-header-other4::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(11,37,69,.66) 0%, rgba(11,37,69,.42) 60%, rgba(11,37,69,.30) 100%);
  pointer-events: none;
}
.hero-area .page-title {
  position: relative;
  z-index: 1;
  margin: 0;
  color: #fff;
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 700;
  font-size: 40px;
  letter-spacing: .01em;
  text-shadow: 0 2px 12px rgba(0,0,0,.45);
}
.hero-area .page-subtitle {
  position: relative;
  z-index: 1;
  color: #e8eef5;
  margin: 8px 0 0;
  font-size: 17px;
  text-shadow: 0 1px 8px rgba(0,0,0,.4);
}

/* Homepage "We are hiring" CTA band (navy .site-footer strip) */
.site-footer .text-align-center h2 {
  color: #fff;
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 700;
  margin: 0;
}
.site-footer .btn-ghost.btn-light {
  background: transparent;
  border: 2px solid #fff;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 700;
  font-size: 13px;
  padding: 9px 20px;
  margin-left: 16px;
  border-radius: 0;
}
.site-footer .btn-ghost.btn-light:hover { background: #fff; color: rgb(41,80,114); }

/* Make accreditation logos in the footer sit neatly */
.footer_widget.widget_links img { display: inline-block; margin-bottom: 8px; max-height: 70px; }

/* Friendly fallback if a form is submitted in this static copy */
.static-note {
  margin-top: 10px;
  font-size: 13px;
  color: #295072;
}

@media (max-width: 767px) {
  .hero-area .page-title { font-size: 30px; }
}

/* ==========================================================================
   Language switcher (EN / NL) — replaces the old "United States users" link
   ========================================================================== */
.site-header .container { position: relative; }
.lang-switch {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: stretch;
  border: 1px solid #cdd5de;
  border-radius: 7px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 1px 3px rgba(41,80,114,.12);
  z-index: 6;
}
.lang-switch .lang {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: .03em;
  color: #295072;
  text-decoration: none;
  line-height: 1;
}
.lang-switch .lang + .lang { border-left: 1px solid #e1e6eb; }
.lang-switch .lang:hover { background: #eef2f6; color: #295072; }
.lang-switch .lang.active { background: #295072; color: #fff; }
.lang-switch .flag { width: 18px; height: 12px; border-radius: 2px; box-shadow: 0 0 0 1px rgba(0,0,0,.12); display: block; }

@media (max-width: 600px) {
  .lang-switch { right: 12px; }
  .lang-switch .lang { padding: 6px 9px; font-size: 12px; }
  .lang-switch .flag { display: none; }
}

/* ==========================================================================
   Homepage hero slider — rotating banner (slide-1.jpg … slide-6.jpg).
   Images carry the centred WORLDWIDE logo (as in the original). If a file is
   missing the slide hides itself (onerror) and the light gradient shows.
   ========================================================================== */
.hero-slider {
  position: relative;
  width: 100%;
  aspect-ratio: 2000 / 458;
  background: linear-gradient(120deg, #eef1f4 0%, #e3e8ee 100%);
  overflow: hidden;
}
.hero-slider .hs-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  transition: opacity .9s ease;
}
.hero-slider .hs-slide.is-active { opacity: 1; }
/* centred WORLDWIDE logo overlay (logo1.png), as on the original */
.hs-logo {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  pointer-events: none;
}
.hs-logo img { height: 62%; width: auto; max-height: 300px; }
.hs-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 46px;
  height: 64px;
  border: 0;
  background: rgba(60,60,60,.72);
  color: #fff;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  z-index: 3;
  transition: background .15s ease;
}
.hs-arrow:hover { background: rgba(41,80,114,.95); }
.hs-prev { left: 0; }
.hs-next { right: 0; }
.hs-dots { position: absolute; left: 0; right: 0; bottom: 12px; text-align: center; z-index: 3; line-height: 0; }
.hs-dots button {
  width: 10px; height: 10px; padding: 0; margin: 0 4px;
  border: 0; border-radius: 50%;
  background: rgba(41,80,114,.35);
  cursor: pointer; vertical-align: middle;
}
.hs-dots button.is-active { background: #295072; }

@media (max-width: 900px) {
  .hero-slider { aspect-ratio: auto; height: 240px; }
  .hs-arrow { width: 36px; height: 50px; font-size: 22px; }
}
@media (max-width: 560px) {
  .hero-slider { height: 160px; }
  .hs-logo img { height: 56%; }
}