/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Made Dillan – normaal gewicht */
@font-face {
    font-family: 'Made Dillan';
    src: url('/wp-content/uploads/2025/11/made_dillan-webfont.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* Encode Sans Regular */
@font-face {
    font-family: 'Encode Sans';
    src: url('/wp-content/uploads/2025/11/EncodeSans-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* Encode Sans Bold (als je die hebt) */
@font-face {
    font-family: 'Encode Sans';
    src: url('/wp-content/uploads/2025/11/EncodeSans-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}


/* Add your custom styles here */
header{
	width:100%!important;
}
/* html{
	 overflow: auto !important;
} */

::selection {
  background:var(--e-global-color-secondary) !important;
	color:white;
}

.doorlopend .swiper{
    overflow: visible!important;
}
body {
 font-size: 1.1vw!important;
}

@media screen and (min-width:1920px) {
 body {font-size: 21px!important;}
}

@media screen and (max-width:1100px) {
body {font-size: 16px!important;}
}
.elementor-button-icon svg{
	height:1em;
}
/* Make text look crisper and more legible in all browsers */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-smoothing: antialiased;
  text-rendering: optimizeLegibility;

}





/* SEO autolinker fixes*/
.elementor-icon-list-items:not(footer .elementor-icon-list-items) a {display:inline!important}


/* underline */
.case:hover .casetitel {
    text-decoration: underline!important;
}

/* Gravity Forms*/

.gform_button {
    background-color: var(--e-global-color-accent) !important;
    font-weight: bold !important;
    color: white;
    border-radius:0px!important;
    -moz-border-radius: 80px!important;
font-size: 1em!important;
padding: 0.7em!important;
}
.gform_button:hover {
   background-color: var(--e-global-color-primary) !important;
}
.gform_fields input:not([type="radio"], [type="checkbox"]),
.gform_fields textarea {
	border: none !important;
	border-bottom: 2px solid #C5C5C5 !important;
	border-radius: 0 !important;
	padding: 12px;
	box-shadow: none !important; 
	background-color:transparent;
}
.gform-theme--foundation .gform_fields {
  grid-row-gap: 10px !important;
}
.site-frame {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 99999;


  /* borderkleur */
  --border-color: var(--e-global-color-accent) !important;
  --border-size: 14px;
  margin:-8px;
  --inner-radius: 26px; /* ronde binnenhoeken */

  /* de border zelf */
  background:
    linear-gradient(var(--border-color), var(--border-color));

  /* snijd binnenkant uit met mask */
  -webkit-mask:
    /* borderbox: laat border volledig zien */
    linear-gradient(#fff 0 0) content-box,
    /* content-hole: snijdt binnenkant uit met radius */
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;

  /* box model zodat padding = border-thickness */
  padding: var(--border-size);
  border-radius: var(--inner-radius);
}

.hoekje-links {
  position: relative; /* maakt een lokale positioneringscontext */
}

.hoekje-links::after {
  content: "";
  position: absolute;
  inset: 0 auto auto 0; /* = top:0; left:0;  */
  width: 3em;
  height: 3em;
  background-color: #FBFBF5;
  background-image: url("https://flerque.internetbureauden-haag.nl/wp-content/uploads/2025/11/noise.webp");
  background-size: cover;
  background-blend-mode: overlay;
  pointer-events: none; /* raakt de inhoud NIET */
  z-index: 3; /* boven de inhoud */
}
.hoekje-rechts {
  position: relative; /* maakt lokale context */
}

.hoekje-rechts::after {
  content: "";
  position: absolute;
  inset: auto 0 0 auto; /* = bottom:0; right:0; */
  width: 3em;
  height: 3em;

  background-color: #FBFBF5;
  background-image: url("https://flerque.internetbureauden-haag.nl/wp-content/uploads/2025/11/noise.webp");
  background-size: cover;
  background-blend-mode: overlay;

  pointer-events: none; /* niet klikken/blokkeren */
  z-index: 3; /* boven de inhoud */
}


/* OVERLAY: zit onder de header maar boven de site-main */
body::before {
    content: "";
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0); /* standaard onzichtbaar */
    pointer-events: none;
    transition: background 0.35s ease;
    z-index: 10; /* lage waarde zodat header erboven blijft */
}

/* ACTIVE OVERLAY (donker) */
body:has(.e-n-menu-dropdown-icon[aria-expanded="true"])::before {
    background: rgba(0, 0, 0, 0.4);
}


.site-main {
    transition: filter 0.35s ease;
}

body:has(.e-n-menu-dropdown-icon[aria-expanded="true"]) .site-main {
    filter: blur(4px);
    pointer-events: none;
}


header,
.site-header,
.elementor-location-header {
    position: relative;
    z-index: 20 !important; /* boven overlay */
}