/* Static site: additions to the original YOOtheme Pro (theme.css / custom.css) and Widgetkit (widgetkit.css) styles.
   jQuery, UIkit 2 and the Widgetkit scripts are replaced by js/site.js; these rules give the same look without them. */

.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}
/* A hidden heading must not push the next element down (UIkit gives "* + p" a top margin). */
.visually-hidden + * { margin-top: 0 !important; }

/* Footer: the year was dark blue on the dark footer bar (#1e4b64 on #112836) and barely readable. */
.gs-footer-copyright { color: rgba(255, 255, 255, 0.6); }

/* Mobile menu overlay: close button (new), styled like the close button of the desktop menu (custom.css). */
.gvds-mobile-close.uk-modal-close-full { top: 0; right: 0; padding: 25px 20px; background: transparent; color: #b5dd2b; }
.gvds-mobile-close svg { transform: scale(1.5, 1.5); }
.gvds-mobile-close svg line { stroke-width: 3px; }

/* Mobile coaching slideshow (icon + title, synced, with thumbnails): slides stacked in one grid cell and cross-faded,
   so the height follows the content without JavaScript measuring it. */
.gvds-mobile-icon-menu .wk-slideshow { display: grid; }
.gvds-mobile-icon-menu .wk-slideshow > li {
  position: relative;
  grid-area: 1 / 1;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s linear, visibility 0s linear 0.5s;
}
.gvds-mobile-icon-menu .wk-slideshow > li.wk-active {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.5s linear;
}
.gvds-mobile-icon-menu .wk-slideshow > li > img { visibility: inherit; display: block; width: 100%; height: auto; }

/* Logo carousel: a flex row moved with transform by js/site.js (Widgetkit positioned every slide absolutely). */
.gs-opdrachtgevers .wk-slider { display: flex; flex-wrap: nowrap; justify-content: flex-start; min-height: 160px; }
.gs-opdrachtgevers .wk-slider > * { position: relative; flex: none; top: auto; left: auto; }
.gs-opdrachtgevers .gvds-client-name {
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-size: 19.5px;
  font-weight: 700;
  line-height: 27.3px;
  color: #1e4b64;
  margin: 0;
}
button.wk-slidenav { border: 0; padding: 0; background: none; cursor: pointer; font: inherit; }
.wk-slidenav-position button.wk-slidenav { font-size: 60px; line-height: 60px; }

/* Contact: the OpenStreetMap map is a static image now (no Leaflet, no tiles from a third party).
   object-fit: none keeps the 1:1 scale of the original map, centred on the office as Leaflet did. */
.gvds-map { position: relative; height: 412px; overflow: hidden; background: #e8e4dc; }
.gvds-map > a, .gvds-map picture { display: block; height: 100%; }
.gvds-map img { display: block; width: 100%; height: 412px; max-width: none; object-fit: none; object-position: 50% 50%; }
.gvds-map-scale {
  position: absolute; left: 10px; bottom: 10px;
  width: 68px; box-sizing: border-box;
  border: 2px solid #777; border-top: 0;
  padding: 2px 5px 1px;
  font: 11px/1.1 "Helvetica Neue", Arial, Helvetica, sans-serif; color: #333;
  background: rgba(255, 255, 255, 0.5);
  pointer-events: none;
}
.gvds-map-attribution {
  position: absolute; right: 0; bottom: 0;
  padding: 0 5px;
  font: 11px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
  background: rgba(255, 255, 255, 0.7);
}
.gvds-map-attribution a { color: #333 !important; font-weight: normal !important; }
