/* Aquastra hoofdmenu (desktop, hamburger en schermvullend menu). Overgenomen 1-op-1 uit WPCode-snippet 1375. */
.aq-menu { display:inline-flex; align-items:center; gap:6px; padding:6px; border-radius:999px; background:rgba(14,15,14,.35); border:1px solid rgba(244,242,236,.18); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); font-family:'Inter','Segoe UI',system-ui,-apple-system,sans-serif; -webkit-font-smoothing:antialiased; box-sizing:border-box; }
.aq-menu a { color:#F4F2EC !important; text-decoration:none !important; font-size:14px; line-height:1.2; padding:9px 16px; border-radius:999px; transition:background .25s ease; }
.aq-menu a:hover { background:rgba(244,242,236,.14); }
.aq-menu a.aq-menu-pill { background:#F4F2EC; color:#0E0F0E !important; font-weight:600; margin-left:16px; }
.aq-menu a:focus-visible { outline:2px solid #3A9A50; outline-offset:3px; }
@media (max-width:900px) { .aq-menu a:not(.aq-menu-pill) { display:none; } .aq-menu a.aq-menu-pill { margin-left:0; } }

.aq-burger { display:none; position:relative; flex:none; width:38px; height:38px; margin:0; padding:0; border:0; border-radius:999px; background:rgba(244,242,236,.14); cursor:pointer; transition:background .25s ease; }
.aq-burger:hover { background:rgba(244,242,236,.24); }
.aq-burger span { position:absolute; left:11px; right:11px; height:1.5px; border-radius:2px; background:#F4F2EC; transition:transform .3s ease; transform-origin:right center; }
.aq-burger span:nth-child(1) { top:13px; }
.aq-burger span:nth-child(2) { top:18.25px; }
.aq-burger span:nth-child(3) { top:23.5px; }
.aq-burger:hover span:nth-child(2) { transform:scaleX(.55); }
.aq-burger:focus-visible { outline:2px solid #3A9A50; outline-offset:3px; }
@media (max-width:1119px) {
  .aq-burger { display:inline-block; }
  .aq-nav a:not(.aq-pill), .aq-menu a:not(.aq-menu-pill) { display:none !important; }
  .aq-nav a.aq-pill, .aq-menu a.aq-menu-pill { margin-left:0 !important; }
}

html.aq-lock, html.aq-lock body { overflow:hidden !important; }

.aq-ovl { --bg:#0E0F0E; --text:#ECEBE6; --muted:#8E918C; --line:rgba(236,235,230,.13); --accent:#3A9A50; --display:'Inter Tight','Inter',system-ui,sans-serif;
  position:fixed; inset:0; z-index:2147483000; background:var(--bg); color:var(--text); font-family:'Inter','Segoe UI',system-ui,-apple-system,sans-serif; -webkit-font-smoothing:antialiased;
  overflow-y:auto; overscroll-behavior:contain; visibility:hidden;
  clip-path:circle(0px at var(--ox, calc(100% - 44px)) var(--oy, 44px));
  transition:clip-path .65s cubic-bezier(.7,0,.2,1), visibility 0s linear .65s; }
.aq-ovl.is-open { visibility:visible; clip-path:circle(150vmax at var(--ox, calc(100% - 44px)) var(--oy, 44px)); transition:clip-path .8s cubic-bezier(.7,0,.2,1), visibility 0s; }
.aq-ovl::before { content:''; position:fixed; inset:0; pointer-events:none; background:radial-gradient(60vmax 50vmax at 0% 100%, rgba(30,90,43,.55), transparent 70%), radial-gradient(40vmax 30vmax at 100% 0%, rgba(58,154,80,.12), transparent 70%); }
.aq-ovl::after { content:''; position:fixed; inset:0; pointer-events:none; opacity:.06; mix-blend-mode:overlay; background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/></svg>"); }
.aq-ovl *, .aq-ovl *::before, .aq-ovl *::after { box-sizing:border-box; }
.aq-ovl-in { position:relative; z-index:1; min-height:100%; display:flex; flex-direction:column; gap:clamp(28px,5vh,56px); padding:clamp(16px,2.4vw,28px) clamp(16px,3.5vw,56px) clamp(24px,4vh,44px); }

.aq-ovl-top { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.aq-ovl-logo { display:block; width:150px; aspect-ratio:142/35; -webkit-mask:url(/wp-content/uploads/2026/08/aquastra-logo.svg) left center/contain no-repeat; mask:url(/wp-content/uploads/2026/08/aquastra-logo.svg) left center/contain no-repeat; background:linear-gradient(100deg, #F4F2EC 0%, #F4F2EC 34%, #8FC79A 42%, #3A9A50 47%, #1F3A26 52%, #8FC79A 58%, #F4F2EC 66%, #F4F2EC 100%); background-size:320% 100%; background-position:100% 0; animation:aqOvlShine 10s cubic-bezier(.5,0,.3,1) 1s infinite; }
@keyframes aqOvlShine { 0% { background-position:100% 0; } 32% { background-position:0% 0; } 100% { background-position:0% 0; } }
.aq-ovl-close { position:relative; width:48px; height:48px; flex:none; margin:0; padding:0; border-radius:50%; border:1px solid var(--line); background:transparent; cursor:pointer; transition:transform .45s cubic-bezier(.2,.8,.2,1), background .25s ease, border-color .25s ease; }
.aq-ovl-close span { position:absolute; left:14px; right:14px; top:50%; height:1.5px; margin-top:-.75px; border-radius:2px; background:var(--text); }
.aq-ovl-close span:nth-child(1) { transform:rotate(45deg); }
.aq-ovl-close span:nth-child(2) { transform:rotate(-45deg); }
.aq-ovl-close:hover { transform:rotate(90deg); background:rgba(236,235,230,.08); border-color:rgba(236,235,230,.3); }
.aq-ovl-close:focus-visible, .aq-ovl a:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }

.aq-ovl-nav { flex:1; display:flex; align-items:center; }
.aq-ovl-nav ul { list-style:none; margin:0; padding:0; width:100%; border-top:1px solid var(--line); }
.aq-ovl-nav li { margin:0; padding:0; border-bottom:1px solid var(--line); overflow:hidden; }
.aq-ovl-nav a { display:flex; align-items:center; gap:clamp(14px,2vw,28px); padding:clamp(10px,1.8vh,20px) 4px; color:var(--text) !important; text-decoration:none !important; font-family:var(--display); font-weight:400; font-size:clamp(40px,7.5vw,92px); line-height:1; letter-spacing:-.045em;
  transform:translateY(110%); transition:transform .7s cubic-bezier(.2,.8,.2,1), color .3s ease, padding .4s cubic-bezier(.2,.8,.2,1); }
.aq-ovl.is-open .aq-ovl-nav a { transform:none; transition-delay:calc(.3s + var(--i) * .07s), 0s, 0s; }
.aq-ovl-n { align-self:flex-start; margin-top:.35em; font-family:'Inter',system-ui,sans-serif; font-size:12px; letter-spacing:.18em; color:var(--muted); }
.aq-ovl-ar { margin-left:auto; flex:none; width:clamp(42px,4.4vw,58px); height:clamp(42px,4.4vw,58px); border-radius:50%; border:1px solid var(--line); display:grid; place-items:center; font-family:'Inter',system-ui,sans-serif; font-size:clamp(16px,1.4vw,20px); letter-spacing:0; transition:transform .35s ease, background .35s ease, color .35s ease, border-color .35s ease; }
.aq-ovl-nav a:hover { color:var(--accent) !important; padding-left:clamp(10px,1.6vw,22px); }
.aq-ovl-nav a:hover .aq-ovl-ar { background:var(--accent); border-color:var(--accent); color:#fff; transform:rotate(-45deg); }
.aq-ovl-nav a[aria-current="page"] .aq-ovl-t { color:var(--accent); }

.aq-ovl-bot { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:clamp(24px,4vw,64px); align-items:end; padding-top:clamp(20px,3vh,32px); opacity:0; transform:translateY(16px); transition:opacity .4s ease, transform .4s ease; }
.aq-ovl.is-open .aq-ovl-bot { opacity:1; transform:none; transition:opacity .6s ease .65s, transform .6s cubic-bezier(.2,.8,.2,1) .65s; }
.aq-ovl-lbl { display:block; margin:0 0 12px; font-size:12px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:var(--muted); }
.aq-ovl-tel { display:block; color:var(--text) !important; text-decoration:none !important; font-family:var(--display); font-size:clamp(30px,4.6vw,56px); line-height:1; letter-spacing:-.04em; transition:color .3s ease; }
.aq-ovl-mail { display:inline-block; margin-top:12px; color:var(--text) !important; text-decoration:none !important; font-size:clamp(16px,1.6vw,20px); border-bottom:1px solid var(--line); padding-bottom:4px; transition:color .3s ease; }
.aq-ovl-tel:hover, .aq-ovl-mail:hover { color:var(--accent) !important; }
.aq-ovl-side p { margin:0 0 18px; font-size:15px; line-height:1.6; color:var(--muted); }
.aq-ovl-btns { display:flex; flex-wrap:wrap; gap:10px; }
.aq-ovl-btn { display:inline-flex; align-items:center; gap:10px; padding:14px 22px; border-radius:999px; font-size:15px; font-weight:600; text-decoration:none !important; background:var(--accent); color:#fff !important; transition:transform .25s ease; }
.aq-ovl-btn:hover { transform:translateY(-2px); }
.aq-ovl-btn.ghost { background:transparent; color:var(--text) !important; border:1px solid var(--line); font-weight:500; }

@media (max-width:700px) { .aq-ovl-bot { grid-template-columns:1fr; } .aq-ovl-n { display:none; } }
@media (prefers-reduced-motion:reduce) {
  .aq-ovl, .aq-ovl.is-open { clip-path:none; transition:visibility 0s; }
  .aq-ovl-nav a, .aq-ovl.is-open .aq-ovl-nav a { transform:none; transition:color .3s ease; }
  .aq-ovl-bot, .aq-ovl.is-open .aq-ovl-bot { opacity:1; transform:none; transition:none; }
  .aq-ovl-logo { animation:none; }
}

/* Taalwisselaar */
.aq-navwrap { display:inline-flex; align-items:center; gap:8px; }
.aq-lang { display:inline-flex; align-items:center; gap:2px; padding:6px; border-radius:999px; background:rgba(14,15,14,.35); border:1px solid rgba(244,242,236,.18); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); font-family:'Inter','Segoe UI',system-ui,-apple-system,sans-serif; box-sizing:border-box; }
.aq-lang a { color:#F4F2EC !important; text-decoration:none !important; font-size:12px; font-weight:600; letter-spacing:.08em; line-height:1.2; padding:9px 11px; border-radius:999px; transition:background .25s ease; }
.aq-lang a:hover { background:rgba(244,242,236,.14); }
.aq-lang a.is-current { background:#F4F2EC; color:#0E0F0E !important; }
.aq-lang a:focus-visible { outline:2px solid #3A9A50; outline-offset:3px; }
.aq-lang--ovl { display:none; margin-left:auto; margin-right:12px; background:transparent; border-color:rgba(236,235,230,.13); }
@media (max-width:600px) { .aq-navwrap > .aq-lang { display:none; } .aq-lang--ovl { display:inline-flex; } }
@media (min-width:601px) and (max-width:1119px) { .aq-lang--ovl { display:inline-flex; } }
