/* Kop, voet en kleuren van de nieuwe Next Growth-site rond de configurators.
   Alle klassen beginnen met ngx- zodat ze niet botsen met de configuratorcode. */
:root{
  --accent:#FFC400;--accent-strong:#E6B000;--accent-light:#FFE27A;--accent-deep:#B38900;--accent-dim:rgba(255,196,0,.13);
  --font:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
}
.ngx-nav,.ngx-foot{--x-bg:#0A0A0A;--x-fg:#EDEDEA;--x-muted:#9A9A96;--x-line:#262626;--x-sig:#FFC400;--x-ink:#0A0800;
  font-family:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--x-fg);-webkit-font-smoothing:antialiased;text-align:left}
.ngx-nav *,.ngx-foot *{box-sizing:border-box}
.ngx-wrap{max-width:1360px;margin-inline:auto;padding-inline:max(24px,env(safe-area-inset-left,0px))}
.ngx-nav{position:sticky;top:0;z-index:9000;background:rgba(10,10,10,.96);border-bottom:1px solid var(--x-line)}
.ngx-nav .ngx-wrap{display:flex;align-items:center;gap:22px;min-height:70px}
.ngx-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--x-fg);font:700 15px/1.15 'Manrope',system-ui,sans-serif}
.ngx-brand small{display:block;font:500 11px/1.3 'Manrope',system-ui,sans-serif;color:var(--x-muted)}
.ngx-ring{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--x-line);border-radius:50%;font:900 13px/1 'Archivo','Arial Black',sans-serif}
.ngx-mark{display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:#FFC400;margin-inline:auto}
.ngx-mark svg{width:18px;height:18px}
.ngx-links{display:flex;gap:20px}
.ngx-links a{text-decoration:none;color:var(--x-fg);font:600 15px/1 'Manrope',system-ui,sans-serif;opacity:.86}
.ngx-links a:hover{opacity:1;color:var(--x-sig)}
.ngx-cta{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 20px;border-radius:999px;background:var(--x-sig);color:var(--x-ink)!important;text-decoration:none;font:700 15px/1 'Manrope',system-ui,sans-serif;border:0}
.ngx-cta.big{min-height:52px;padding:14px 26px;font-size:16px}
.ngx-menu{display:none;margin-left:auto;background:var(--x-sig);color:var(--x-ink);border:0;border-radius:999px;padding:11px 18px;font:700 14px/1 'Manrope',system-ui,sans-serif;cursor:pointer}
.ngx-mnav{display:flex;flex-direction:column;padding:8px 24px 22px;border-top:1px solid var(--x-line);background:#0A0A0A}
.ngx-mnav[hidden]{display:none}
.ngx-mnav a{text-decoration:none;color:var(--x-fg);font:700 20px/1.2 'Manrope',system-ui,sans-serif;padding:12px 0;border-bottom:1px solid var(--x-line)}
.ngx-mnav a.ngx-cta{margin-top:16px;border-bottom:0;font-size:16px;color:var(--x-ink)}
@media(max-width:1080px){.ngx-links,.ngx-nav .ngx-wrap>.ngx-cta{display:none}.ngx-menu{display:inline-flex}.ngx-mark{margin-inline:auto 0}}
@media(min-width:1081px){.ngx-mnav{display:none!important}}
@media(max-width:520px){.ngx-brand small{display:none}}

.ngx-foot{background:#0A0A0A;border-top:1px solid var(--x-line);overflow:hidden;margin-top:0}
.ngx-end{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:32px;align-items:center;padding:clamp(48px,6vw,90px) 0}
.ngx-end h2{margin:0;font:900 clamp(38px,5.6vw,86px)/.9 'Archivo','Arial Black',sans-serif;text-transform:uppercase;letter-spacing:-.03em;color:var(--x-fg)}
.ngx-end h2 span{color:var(--x-sig)}
.ngx-end p{color:#B5B5B0;margin:0 0 20px;font-size:16px;line-height:1.6}
.ngx-tel{display:block;margin-top:18px;font:900 clamp(24px,3vw,38px)/1 'Archivo','Arial Black',sans-serif;color:var(--x-fg);text-decoration:none}
.ngx-cols{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:28px;padding-top:32px;border-top:1px solid var(--x-line)}
.ngx-mk{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;background:#FFC400}
.ngx-mk svg{width:15px;height:15px}
.ngx-foot p{color:var(--x-muted);margin:12px 0 0;font-size:14px;line-height:1.55}
.ngx-foot h4{font:500 11px/1.3 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--x-muted);margin:6px 0 14px}
.ngx-foot ul{list-style:none;margin:0;padding:0}
.ngx-foot li{margin:7px 0}
.ngx-foot li a{text-decoration:none;color:#D3D3CF;font-size:14px}
.ngx-foot li a:hover{color:var(--x-sig)}
.ngx-legal{display:flex;flex-wrap:wrap;gap:18px;margin-top:36px;padding-top:18px;border-top:1px solid var(--x-line);font:500 11.5px/1.4 'JetBrains Mono',ui-monospace,monospace;color:var(--x-muted);letter-spacing:.06em}
.ngx-giant{margin:18px 0 -.16em!important;font:900 clamp(52px,12.5vw,210px)/.85 'Archivo','Arial Black',sans-serif!important;letter-spacing:-.04em;color:#FFC400!important;white-space:nowrap;text-align:center}
@media(max-width:900px){.ngx-end{grid-template-columns:1fr}.ngx-cols{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.ngx-cols{grid-template-columns:1fr}}

/* ---------- huisstijl over de configuratorpagina's ---------- */
html.ngx-display body,html.ngx-serif body{font-family:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif}
/* grote koppen: Archivo zwaar en in kapitalen, net als de rest van de site */
html.ngx-display h1,html.ngx-display .h1,html.ngx-display .sectie-kop h2,html.ngx-display section>.wrap>h2,html.ngx-display .h2{
  font-family:'Archivo','Arial Black',sans-serif!important;font-weight:900!important;text-transform:uppercase;letter-spacing:-.03em!important;line-height:.94!important;font-style:normal!important;text-wrap:balance;overflow-wrap:break-word;hyphens:auto;-webkit-hyphens:auto}
html.ngx-display h1,html.ngx-display .h1{font-size:clamp(34px,5vw,80px)!important}
html.ngx-display .sectie-kop h2,html.ngx-display section>.wrap>h2,html.ngx-display .h2{font-size:clamp(26px,3.4vw,54px)!important}
html.ngx-display h1 em,html.ngx-display h1 i,html.ngx-display .h1 em,html.ngx-display h2 em,html.ngx-display .grad-text{font-style:normal!important;font-family:inherit!important}
/* jacht: verfijnd met een serif, zoals de jachtstudio op de site */
html.ngx-serif h1,html.ngx-serif .h1,html.ngx-serif .h2,html.ngx-serif .sectie-kop h2{font-family:'Fraunces',Georgia,serif!important;font-weight:600!important;letter-spacing:-.02em!important}
/* kleine labels in de monoletter */
html.ngx-display .eyebrow,html.ngx-display .pill,html.ngx-display .badge,html.ngx-display .mono,html.ngx-serif .eyebrow,html.ngx-serif .pill,html.ngx-serif .mono{
  font-family:'JetBrains Mono',ui-monospace,monospace!important;letter-spacing:.14em;text-transform:uppercase}
/* knoppen als pil in de accentkleur */
html.ngx-display .btn,html.ngx-serif .btn{border-radius:999px!important;font-family:'Manrope',system-ui,sans-serif!important;font-weight:700!important;letter-spacing:0!important}
html.ngx-display .btn:not(.btn--ghost),html.ngx-serif .btn:not(.btn--ghost){background:var(--accent)!important;border-color:var(--accent)!important}
html.ngx-display .btn--ghost,html.ngx-serif .btn--ghost{background:transparent!important;border:1px solid color-mix(in srgb,currentColor 28%,transparent)!important}
/* veelgestelde vragen in de stijl van de site */
html.ngx-display details summary,html.ngx-serif details summary{font-family:'Archivo','Arial Black',sans-serif;font-weight:800;letter-spacing:-.005em}
html.ngx-serif details summary{font-family:'Manrope',system-ui,sans-serif;font-weight:700}
/* lange enkele woorden (Jachtconfigurator) passen op een telefoon */
html.ngx-serif h1,html.ngx-serif .h1{overflow-wrap:break-word;hyphens:auto;-webkit-hyphens:auto}
@media(max-width:520px){html.ngx-serif h1,html.ngx-serif .h1{font-size:clamp(30px,9vw,44px)!important}html.ngx-display h1,html.ngx-display .h1{font-size:clamp(28px,8.4vw,40px)!important}}
/* algemene footer-stijlen van een configurator mogen onze voet niet vervormen */
footer.ngx-foot{display:block!important;padding-left:0!important;padding-right:0!important;padding-top:0!important;gap:normal!important;font-size:16px;color:var(--x-fg)}
.ngx-tel{font-size:clamp(20px,7vw,38px);overflow-wrap:break-word}
.ngx-end h2{overflow-wrap:break-word;hyphens:auto;-webkit-hyphens:auto}