/* MC-Node 2026 — design tokens & componenten (bron: goedgekeurde HTML-designs) */
:root{
  --mc-bg:#0a0e14; --mc-panel:#0d1219; --mc-panel2:#10151d; --mc-line:rgba(255,255,255,.08);
  --mc-text:#e8edf4; --mc-muted:#8a94a3; --mc-soft:#aab4c2; --mc-blue:#2e9bff; --mc-blue-d:#1d7df0;
  --mc-blue-l:#6cbcff; --mc-green:#41d98d; --mc-amber:#f5b301;
}
/* ===== Legacy tokens (mcnode_cart css) — NIET VERWIJDEREN (vaste server-fix #2) ===== */
:root{
--blue:#0079FF; --darkerblue:#0171f0; --maindark:#12141C; --darkerdark:#0E1118;
--lighterdark:#151720; --lightdark:#1A1C29; --text:#FFFFFF; --gray:#9BA2AB;
--darkgray:#313841; --darkerthandark:#171924;
}
body.mc{margin:0;font-family:'Space Grotesk',sans-serif}
body.mc-dark{background:var(--mc-bg);color:var(--mc-text)}
body.mc-dark a{color:var(--mc-blue);text-decoration:none}
body.mc-dark a:hover{color:var(--mc-blue-l)}
@keyframes mcOrb{0%,100%{transform:translate(0,0) scale(1);opacity:.55}50%{transform:translate(0,-24px) scale(1.08);opacity:.85}}
@keyframes mcRise{0%{transform:translateY(0) scale(1);opacity:0}12%{opacity:.9}80%{opacity:.5}100%{transform:translateY(-780px) scale(.6);opacity:0}}
/* Design-animaties (namen identiek aan de HTML-designs) */
@keyframes orb{0%,100%{transform:translate(0,0) scale(1);opacity:.55}50%{transform:translate(0,-24px) scale(1.08);opacity:.85}}
@keyframes rise{0%{transform:translateY(0) scale(1);opacity:0}12%{opacity:.9}80%{opacity:.5}100%{transform:translateY(-760px) scale(.6);opacity:0}}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes pulse{0%,100%{opacity:.5}50%{opacity:1}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes gridmove{0%{background-position:0 0}100%{background-position:0 48px}}
@keyframes blink{0%,49%{opacity:1}50%,100%{opacity:0}}
.mc-marquee:hover{animation-play-state:paused}
/* Minecraft winkel: keuzehulp + vergelijk */
.kz-seg{background:#10151d;border:1px solid rgba(255,255,255,.1);color:#8a94a3}
.kz-seg.on{background:#1971db;border:0;color:#fff}
.kz-track{width:46px;height:26px;border-radius:100px;background:rgba(255,255,255,.12);position:relative;cursor:pointer;flex:none;transition:background .15s}
.kz-knob{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:left .15s;display:block}
.mc-tab.on{background:#1971db;color:#fff}
.mc-tab{color:#8a94a3}
.mc-cmp{width:20px;height:20px;border-radius:50%;font-size:11px;display:inline-flex;align-items:center;justify-content:center}
.mc-cmp.ok{background:rgba(46,155,255,.12);border:1px solid rgba(46,155,255,.4);color:#6cbcff}
.mc-cmp.no{background:rgba(255,122,107,.1);border:1px solid rgba(255,122,107,.4);color:#ff7a6b}
/* Nav loopt door in de pagina-achtergrond (zoals in de designs) */
body.mc-dark .mc-nav{background:transparent;position:relative;z-index:20}
.mc-underlay{margin-top:-120px;padding-top:120px}

/* Nav */
.mc-nav{background:var(--mc-bg);padding:0 56px}
.mc-nav-inner{max-width:1240px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:22px 0;gap:24px}
.mc-logo{font-weight:700;font-size:20px;color:var(--mc-text)!important}
.mc-logo span{color:var(--mc-blue)}
.mc-nav-links{display:flex;gap:30px;font-size:13.5px}
.mc-nav-links a{color:var(--mc-soft)!important}
.mc-nav-links a:hover{color:#fff!important}
.mc-nav-links a.active{color:#2e9bff!important}
.mc-nav-actions{display:flex;gap:16px;align-items:center;font-size:13.5px}
.mc-langs{display:flex;align-items:center;background:var(--mc-panel);border:1px solid rgba(255,255,255,.1);border-radius:8px;overflow:hidden}
.mc-langs a{padding:7px 10px;display:flex;align-items:center;opacity:.5}
.mc-langs a.active{background:var(--mc-blue);opacity:1}
.mc-langs img{width:22px;height:15px;border-radius:2px;display:block;box-shadow:0 0 0 1px rgba(0,0,0,.25)}
.mc-cart{color:var(--mc-soft)!important;display:inline-flex;align-items:center;gap:6px}
.mc-cart:hover{color:#fff!important}
.mc-btn,.mc-btn-ghost{font-weight:700;font-size:13px;padding:12px 22px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap}
.mc-btn{background:var(--mc-blue);color:#fff!important}
.mc-btn:hover{background:var(--mc-blue-d);color:#fff!important}
.mc-btn-ghost{border:1px solid rgba(46,155,255,.5);color:var(--mc-blue-l)!important;font-weight:500}
.mc-btn-ghost:hover{background:rgba(46,155,255,.12);color:#fff!important}
.mc-btn-outline{border:1px solid rgba(46,155,255,.55);color:var(--mc-blue-l)!important;font-weight:700;font-size:12.5px;padding:11px 18px;border-radius:9px;text-align:center;display:inline-block}
.mc-btn-outline:hover{background:var(--mc-blue);color:#fff!important}

/* Secties & typografie */
.mc-section{padding:56px 56px 60px}
.mc-wrap{max-width:1080px;margin:0 auto}
.mc-wrap-wide{max-width:1240px;margin:0 auto}
.mc-kicker{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--mc-blue);letter-spacing:2px;margin-bottom:14px}
.mc-h1{margin:0 0 18px;font-size:52px;line-height:1.06;font-weight:700;letter-spacing:-1.5px}
.mc-h2{margin:0 0 12px;font-size:32px;font-weight:700;letter-spacing:-.5px}
.mc-lead{margin:0;font-size:16px;line-height:1.65;color:var(--mc-muted);max-width:640px;text-wrap:pretty}
.mc-accent{color:var(--mc-blue)}
.mc-check{color:var(--mc-green);margin-right:8px}

/* Kaarten */
.mc-card{background:var(--mc-panel);border:1px solid var(--mc-line);border-radius:16px;padding:24px 26px;display:flex;flex-direction:column}
.mc-card:hover{border-color:rgba(46,155,255,.45)}
.mc-card-featured{background:linear-gradient(var(--mc-panel),var(--mc-panel)) padding-box,linear-gradient(150deg,rgba(46,155,255,.5),rgba(46,155,255,.06)) border-box;border:1px solid transparent}
.mc-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.mc-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.mc-grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
@media(max-width:980px){.mc-grid-3,.mc-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.mc-grid-2,.mc-grid-3,.mc-grid-4{grid-template-columns:1fr}.mc-section{padding:40px 20px}.mc-nav{padding:0 20px}.mc-h1{font-size:36px}}
.mc-badge{font-size:10px;font-weight:700;letter-spacing:1px;background:rgba(46,155,255,.14);color:var(--mc-blue-l);border:1px solid rgba(46,155,255,.4);border-radius:20px;padding:3px 9px}
.mc-chip{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:1.5px;color:#7d8797}
.mc-price{color:var(--mc-blue);font-size:18px;font-weight:700}
.mc-price-free{color:var(--mc-green);font-size:18px;font-weight:700}

/* Plan-kaarten (winkels) */
.mc-plan{position:relative;background:var(--mc-panel);border:1px solid rgba(255,255,255,.09);border-radius:14px;padding:24px 22px;display:flex;flex-direction:column}
.mc-plan.rec{border:1.5px solid rgba(46,155,255,.55);box-shadow:0 20px 50px -24px rgba(46,155,255,0.25)}
.mc-plan .rec-badge{position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:var(--mc-blue);color:#fff;font-size:10px;font-weight:700;letter-spacing:1px;border-radius:20px;padding:4px 12px}
.mc-plan h4{margin:0 0 6px;font-size:17px;font-weight:700}
.mc-plan .spec{font-size:13px;color:var(--mc-muted);line-height:1.9}
.mc-plan .price{margin:12px 0 0;font-size:24px;font-weight:700}
.mc-plan .price small{font-size:12.5px;color:var(--mc-muted);font-weight:400}
.mc-plan .mc-btn,.mc-plan .mc-btn-outline{margin-top:18px;display:block;text-align:center}

/* Console-venster */
.mc-console{background:#121a28;border:1px solid rgba(255,255,255,.12);border-radius:14px;overflow:hidden;box-shadow:0 30px 80px -30px rgba(0,0,0,.8)}
.mc-console-bar{display:flex;align-items:center;gap:8px;padding:12px 16px;background:#182234;border-bottom:1px solid var(--mc-line)}
.mc-console-bar i{width:11px;height:11px;border-radius:50%;display:inline-block}
.mc-console-bar .r{background:#ff5f57}.mc-console-bar .y{background:#febc2e}.mc-console-bar .g{background:#28c840}
.mc-console-bar .t{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:#7d8797;margin-left:8px}
.mc-console-body{padding:16px 18px;font-family:'IBM Plex Mono',monospace;font-size:12.5px;line-height:1.9;color:var(--mc-muted)}

/* FAQ */
.mc-faq{background:var(--mc-panel);border:1px solid var(--mc-line);border-radius:12px;padding:18px 22px;margin-bottom:12px}
.mc-faq summary{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:15px;font-weight:700;color:var(--mc-text);cursor:pointer;list-style:none}
.mc-faq summary::-webkit-details-marker{display:none}
.mc-faq summary:after{content:'+';color:var(--mc-blue);font-size:18px}
.mc-faq[open] summary:after{content:'−'}
.mc-faq p{margin:12px 0 0;font-size:13.5px;line-height:1.65;color:var(--mc-muted)}

/* Footer */
.mc-footer{background:#070a0f;border-top:1px solid rgba(255,255,255,.06);padding:72px 56px 0;color:var(--mc-text)}
.mc-footer-grid{display:grid;grid-template-columns:1fr 1fr 1fr 1.5fr;gap:36px;align-items:start}
@media(max-width:900px){.mc-footer-grid{grid-template-columns:1fr 1fr}}
.mc-footer h5{font-size:14px;font-weight:700;letter-spacing:1px;margin:0 0 16px;color:var(--mc-text)}
.mc-footer-col{display:flex;flex-direction:column;gap:10px}
.mc-footer-col a{color:var(--mc-muted)!important;font-size:14.5px}
.mc-footer-col a:hover{color:#fff!important}
.mc-footer-quote{font-size:36px;font-weight:700;line-height:1.25;letter-spacing:-.5px;text-align:center}
.mc-footer-meta{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--mc-line);margin-top:56px;padding:24px 0 28px;font-size:13.5px;color:var(--mc-muted);flex-wrap:wrap;gap:12px}
.mc-footer-meta a{color:var(--mc-muted)!important}
.mc-footer-meta a:hover{color:#fff!important}

/* Modal (RAM-waarschuwing) */
.mc-modal-overlay{position:fixed;inset:0;background:rgba(4,7,12,.78);backdrop-filter:blur(6px);z-index:90;display:none;align-items:center;justify-content:center;padding:24px}
.mc-modal-overlay.open{display:flex}
.mc-modal{background:#0b0f16;border:1px solid rgba(255,255,255,.12);border-radius:16px;max-width:520px;width:100%;overflow:hidden;box-shadow:0 40px 110px -30px rgba(0,0,0,.95)}
.mc-modal .mc-console-bar .x{margin-left:auto;width:28px;height:28px;border-radius:7px;display:flex;align-items:center;justify-content:center;color:var(--mc-muted);cursor:pointer;font-size:13px}
.mc-modal .mc-console-bar .x:hover{color:#fff;background:rgba(255,255,255,.08)}
.mc-modal-body{padding:28px 30px 30px}
.mc-modal-body .mono-amber{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--mc-amber);letter-spacing:2px}

/* Six client-area pagina's (fallback) leesbaar houden op donkere nav */
body.mc:not(.mc-dark){background:#f4f6f9}
.mc-main{padding:32px 0 56px}
/* Standaard six-homepage-restanten verbergen op de homepage */
body.mc-dark .home-shortcuts,body.mc-dark #main-body .row.text-center{display:none}

/* ===== Dark-skin voor systeem-orderform (viewcart/configureproduct/checkout/complete) ===== */
body[data-page="configureproduct"],body[data-page="checkout"],body[data-page="complete"],body[data-page="viewcart"]{background:#0a0e14;color:#e8edf4}
body[data-page="configureproduct"] .mc-main,body[data-page="checkout"] .mc-main,body[data-page="complete"] .mc-main{padding-top:40px}
body[data-page="configureproduct"] .panel,body[data-page="checkout"] .panel,body[data-page="complete"] .panel,body[data-page="viewcart"] .panel,body[data-page="configureproduct"] .card,body[data-page="checkout"] .card,body[data-page="complete"] .card,body[data-page="viewcart"] .card{background:#0d1219;border:1px solid rgba(255,255,255,.09);color:#e8edf4;border-radius:14px}

body[data-page="configureproduct"] .panel-heading,body[data-page="viewcart"] .panel-heading,body[data-page="checkout"] .panel-heading,body[data-page="configureproduct"] .card-header,body[data-page="viewcart"] .card-header,body[data-page="checkout"] .card-header{background:#10151d;border-bottom:1px solid rgba(255,255,255,.08);color:#e8edf4;border-radius:14px 14px 0 0}
body[data-page="configureproduct"] .form-control,body[data-page="viewcart"] .form-control,body[data-page="checkout"] .form-control,body[data-page="configureproduct"] select,body[data-page="checkout"] select,body[data-page="configureproduct"] input,body[data-page="checkout"] input{background:#10151d;border:1px solid rgba(255,255,255,.12);color:#e8edf4;border-radius:9px}
body[data-page="configureproduct"] .table,body[data-page="viewcart"] .table,body[data-page="checkout"] .table{color:#e8edf4}
body[data-page="configureproduct"] .table td,body[data-page="viewcart"] .table td,body[data-page="checkout"] .table td,body[data-page="configureproduct"] .table th,body[data-page="viewcart"] .table th,body[data-page="checkout"] .table th{border-color:rgba(255,255,255,.08)}
body[data-page="configureproduct"] .btn-primary,body[data-page="viewcart"] .btn-primary,body[data-page="checkout"] .btn-primary{background:#2e9bff;border-color:#2e9bff;font-weight:700;border-radius:9px}
body[data-page="configureproduct"] .btn-primary:hover,body[data-page="viewcart"] .btn-primary:hover,body[data-page="checkout"] .btn-primary:hover{background:#1d7df0;border-color:#1d7df0}
body[data-page="configureproduct"] .btn-default,body[data-page="viewcart"] .btn-default,body[data-page="checkout"] .btn-default{background:transparent;border:1px solid rgba(46,155,255,.5);color:#6cbcff;border-radius:9px}
body[data-page="configureproduct"] .list-group-item,body[data-page="viewcart"] .list-group-item{background:#0d1219;border-color:rgba(255,255,255,.08);color:#aab4c2}
body[data-page="configureproduct"] .list-group-item.active{background:#10151d;border-color:rgba(46,155,255,.4);color:#fff}
body[data-page="configureproduct"] .well,body[data-page="viewcart"] .well,body[data-page="checkout"] .well{background:#0d1219;border:1px solid rgba(255,255,255,.09);color:#aab4c2;border-radius:12px}
body[data-page="configureproduct"] .alert-info,body[data-page="checkout"] .alert-info,body[data-page="configureproduct"] .alert-warning{background:rgba(46,155,255,.08);border:1px solid rgba(46,155,255,.3);color:#aab4c2;border-radius:10px}
body[data-page="configureproduct"] a:not(.btn),body[data-page="viewcart"] a:not(.btn),body[data-page="checkout"] a:not(.btn){color:#6cbcff}
body[data-page="configureproduct"] .text-muted,body[data-page="viewcart"] .text-muted,body[data-page="checkout"] .text-muted{color:#8a94a3!important}
body[data-page="viewcart"] .mc-main{padding-top:40px}

/* Six-fallback pagina's in huisstijl (domainchecker, login, register, password reset) */
body[data-page="domainchecker"],body[data-page="login"],body[data-page="clientregister"],body[data-page="password-reset-container"],body[data-page="pwreset"]{background:#0a0e14;color:#e8edf4}
body[data-page="domainchecker"] .mc-main,body[data-page="login"] .mc-main,body[data-page="clientregister"] .mc-main{padding-top:40px}
body[data-page="domainchecker"] .panel,body[data-page="login"] .panel,body[data-page="clientregister"] .panel,body[data-page="password-reset-container"] .panel,body[data-page="pwreset"] .panel,body[data-page="domainchecker"] .card,body[data-page="login"] .card,body[data-page="clientregister"] .card,body[data-page="password-reset-container"] .card,body[data-page="pwreset"] .card,body[data-page="domainchecker"] .well,body[data-page="login"] .well,body[data-page="clientregister"] .well,body[data-page="password-reset-container"] .well,body[data-page="pwreset"] .well{background:#0d1219;border:1px solid rgba(255,255,255,.09);color:#e8edf4;border-radius:14px}
body[data-page="domainchecker"] .panel-heading,body[data-page="login"] .panel-heading,body[data-page="clientregister"] .panel-heading,body[data-page="password-reset-container"] .panel-heading,body[data-page="pwreset"] .panel-heading,body[data-page="domainchecker"] .card-header,body[data-page="login"] .card-header,body[data-page="clientregister"] .card-header,body[data-page="password-reset-container"] .card-header,body[data-page="pwreset"] .card-header{background:#10151d;border-bottom:1px solid rgba(255,255,255,.08);color:#e8edf4;border-radius:14px 14px 0 0}
body[data-page="domainchecker"] .form-control,body[data-page="login"] .form-control,body[data-page="clientregister"] .form-control,body[data-page="password-reset-container"] .form-control,body[data-page="pwreset"] .form-control,body[data-page="domainchecker"] input[type=text],body[data-page="login"] input[type=text],body[data-page="clientregister"] input[type=text],body[data-page="password-reset-container"] input[type=text],body[data-page="pwreset"] input[type=text],body[data-page="domainchecker"] input[type=email],body[data-page="login"] input[type=email],body[data-page="clientregister"] input[type=email],body[data-page="password-reset-container"] input[type=email],body[data-page="pwreset"] input[type=email],body[data-page="domainchecker"] input[type=password],body[data-page="login"] input[type=password],body[data-page="clientregister"] input[type=password],body[data-page="password-reset-container"] input[type=password],body[data-page="pwreset"] input[type=password],body[data-page="domainchecker"] select,body[data-page="login"] select,body[data-page="clientregister"] select,body[data-page="password-reset-container"] select,body[data-page="pwreset"] select{background:#10151d;border:1px solid rgba(255,255,255,.12);color:#e8edf4;border-radius:9px}
body[data-page="domainchecker"] .btn-primary,body[data-page="login"] .btn-primary,body[data-page="clientregister"] .btn-primary,body[data-page="password-reset-container"] .btn-primary,body[data-page="pwreset"] .btn-primary{background:#2e9bff;border-color:#2e9bff;font-weight:700;border-radius:9px}
body[data-page="domainchecker"] .btn-primary:hover,body[data-page="login"] .btn-primary:hover,body[data-page="clientregister"] .btn-primary:hover,body[data-page="password-reset-container"] .btn-primary:hover,body[data-page="pwreset"] .btn-primary:hover{background:#1d7df0;border-color:#1d7df0}
body[data-page="domainchecker"] label,body[data-page="login"] label,body[data-page="clientregister"] label,body[data-page="password-reset-container"] label,body[data-page="pwreset"] label,body[data-page="domainchecker"] .control-label,body[data-page="login"] .control-label,body[data-page="clientregister"] .control-label,body[data-page="password-reset-container"] .control-label,body[data-page="pwreset"] .control-label{color:#aab4c2}body[data-page="domainchecker"] .table,body[data-page="login"] .table,body[data-page="clientregister"] .table,body[data-page="password-reset-container"] .table,body[data-page="pwreset"] .table{color:#e8edf4}body[data-page="domainchecker"] .table td,body[data-page="login"] .table td,body[data-page="clientregister"] .table td,body[data-page="password-reset-container"] .table td,body[data-page="pwreset"] .table td,body[data-page="domainchecker"] .table th,body[data-page="login"] .table th,body[data-page="clientregister"] .table th,body[data-page="password-reset-container"] .table th,body[data-page="pwreset"] .table th{border-color:rgba(255,255,255,.08)}body[data-page="domainchecker"] h1,body[data-page="login"] h1,body[data-page="clientregister"] h1,body[data-page="password-reset-container"] h1,body[data-page="pwreset"] h1,body[data-page="domainchecker"] h2,body[data-page="login"] h2,body[data-page="clientregister"] h2,body[data-page="password-reset-container"] h2,body[data-page="pwreset"] h2,body[data-page="domainchecker"] h3,body[data-page="login"] h3,body[data-page="clientregister"] h3,body[data-page="password-reset-container"] h3,body[data-page="pwreset"] h3{color:#e8edf4}body[data-page="domainchecker"] .text-muted,body[data-page="login"] .text-muted,body[data-page="clientregister"] .text-muted,body[data-page="password-reset-container"] .text-muted,body[data-page="pwreset"] .text-muted,body[data-page="domainchecker"] small,body[data-page="login"] small,body[data-page="clientregister"] small,body[data-page="password-reset-container"] small,body[data-page="pwreset"] small{color:#8a94a3!important}

/* ===== MC-Node responsive (telefoon) ===== */
@media (max-width: 760px){
  [style*="56px"]{padding-left:18px!important;padding-right:18px!important}
  h1{font-size:34px!important;line-height:1.14!important;letter-spacing:-1px!important}
  h2{font-size:24px!important;letter-spacing:-.4px!important}
  h3{font-size:19px!important}
  [style*="grid-template-columns"]{grid-template-columns:1fr!important}
  [style*="repeat(4,minmax(0,1fr))"],[style*="repeat(4,1fr)"],[style*="repeat(5,minmax(0,1fr))"],[style*="repeat(5,1fr)"],[style*="grid-template-columns:repeat(3,1fr);gap:8px"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  [style*="repeat(auto-fill"]{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))!important}
  [style*="grid-template-columns:1fr 1fr 1fr 1.5fr"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  [style*="grid-template-columns:1.7fr 1fr 1fr 1fr 1fr"]{grid-template-columns:1.7fr repeat(4,1fr)!important;font-size:10.5px!important}
  [style*="grid-template-columns:1.4fr 1fr 1.2fr 1fr"]{grid-template-columns:1.4fr repeat(3,1fr)!important;font-size:10.5px!important}
  [style*="grid-template-columns:90px 1.1fr 1.4fr"]{grid-template-columns:64px 1fr 1.2fr!important;font-size:10.5px!important}
  [style*="grid-template-columns:110px 1fr 52px"]{grid-template-columns:80px 1fr 44px!important}
  [style*="display:flex"]{flex-wrap:wrap}
  [style*="flex-direction:column"],[style*="width:max-content"],[style*="animation:marquee"],[style*="height:340px"],[style*="height:300px"],[style*="writing-mode"],[style*="overflow-x:auto"],[style*="white-space:nowrap"]{flex-wrap:nowrap!important}
  [style*="justify-content:space-between"][style*="padding:22px 0"]{row-gap:10px}
  [style*="gap:30px"][style*="font-size:13.5px"]{order:3;width:100%;overflow-x:auto;flex-wrap:nowrap!important;padding-bottom:6px;scrollbar-width:none}
  [style*="position:sticky"]{position:static!important}
  [style*="font-size:66px"],[style*="font-size:58px"],[style*="font-size:54px"],[style*="font-size:52px"],[style*="font-size:50px"]{font-size:34px!important;line-height:1.14!important;letter-spacing:-1px!important}
  [style*="font-size:42px"],[style*="font-size:40px"],[style*="font-size:38px"],[style*="font-size:36px"]{font-size:27px!important}
  [style*="font-size:30px"]{font-size:22px!important}
  [style*="padding:72px 0"],[style*="padding:150px 0 170px"]{padding-top:44px!important;padding-bottom:52px!important}
  img,video{max-width:100%;height:auto}
  [style*="grid-column"]{grid-column:auto!important}
  [style*="grid-row"]{grid-row:auto!important}
  [style*="-46px"]{margin-left:0!important;margin-right:0!important;height:380px!important}
  [style*="1fr 1fr 1fr 1.5fr"] > div:last-child{grid-column:1 / -1!important;margin-top:10px}
  [style*="justify-content:flex-end"],[style*="justify-content: flex-end"]{justify-content:flex-start!important}
}
@media (max-width: 480px){
  [style*="repeat(4"],[style*="repeat(5"],[style*="repeat(3,minmax(0,1fr))"],[style*="repeat(3, minmax(0, 1fr))"]{grid-template-columns:1fr!important}
}

@media (max-width: 980px){
  .mc-nav{padding:0 18px}
  .mc-nav-inner{flex-wrap:wrap;row-gap:10px;padding:14px 0}
  .mc-nav-links{display:flex;order:3;width:100%;overflow-x:auto;white-space:nowrap;gap:18px;padding-bottom:6px;scrollbar-width:none}
  .mc-nav-links::-webkit-scrollbar{display:none}
  .mc-nav-actions{margin-left:auto;flex-wrap:wrap;row-gap:8px;justify-content:flex-end}
}
@media (max-width: 760px){
  .mc-footer{padding:48px 18px 0}
  .mc-footer-grid{grid-template-columns:1fr 1fr}
  .mc-footer-quote{font-size:24px}
  .configure-product{padding:0 0 56px}
  .summary{position:static}
  body[data-page] .mc-main.container{padding-left:12px;padding-right:12px}
}

/* Zachte overgang onder hero-secties */
.mc-underlay{position:relative}
.mc-underlay::after{content:'';position:absolute;left:0;right:0;bottom:0;height:150px;background:linear-gradient(180deg,rgba(10,14,20,0),#0a0e14);pointer-events:none;z-index:0}

@media (max-width: 980px){
  .mc-nav-actions{gap:10px}
  .mc-nav .mc-btn-ghost{padding:8px 13px;font-size:12.5px}
  .mc-logo{font-size:18px}
  .mc-nav-inner{padding:12px 0}
}

/* domainchecker-escape: designpagina altijd full-width, ook als de container-wrap meeloopt */
body[data-page="domainchecker"] .mc-main.container,body[data-page="domainregister"] .mc-main.container{max-width:none!important;width:100%!important;padding:0!important}
/* premium plannen: laatste rij gecentreerd (flex-kaarten) */
@media (max-width: 760px){[style*="calc(33.333% - 12px)"]{width:100%!important}}

/* Taal-dropdown (NL/EN/DE — vaste server-fix meertaligheid) */
.mc-langdd{position:relative}
.mc-langdd-btn{display:inline-flex;align-items:center;gap:7px;background:transparent;border:1px solid transparent;border-radius:9px;padding:7px 11px;color:#aab4c2;font-size:12.5px;font-weight:600;cursor:pointer;font-family:inherit;transition:border-color .15s}
.mc-langdd-btn:hover,.mc-langdd.open .mc-langdd-btn{border-color:rgba(255,255,255,.18)}
.mc-langdd-btn img{width:20px;height:14px;border-radius:2px;display:block}
.mc-langdd-btn svg{color:#7d8797}
.mc-langdd-menu{display:none;position:absolute;top:calc(100% + 8px);right:0;min-width:172px;background:#0d1219;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:6px;box-shadow:0 24px 60px -18px rgba(0,0,0,.85);z-index:60}
.mc-langdd.open .mc-langdd-menu{display:block}
.mc-langdd-menu a{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:8px;font-size:13px;font-weight:600;color:#aab4c2!important;text-decoration:none}
.mc-langdd-menu a:hover{background:rgba(255,255,255,.04);color:#fff!important}
.mc-langdd-menu a.on{background:rgba(46,155,255,.1);color:#6cbcff!important}
.mc-langdd-menu a img{width:20px;height:14px;border-radius:2px}

/* DEV-banner: vast onderin beeld op alle pagina's — duwt de layout nergens meer
   omlaag (dat gaf zwarte randen boven hero's) en blijft leesbaar als dev-indicatie.
   !important is nodig omdat WHMCS de banner inline styled. */
body.mc div[style*="ffffd2"]{
  position:fixed!important;bottom:16px;left:16px;z-index:60;
  width:230px!important;max-width:60vw;margin:0!important;padding:10px 14px!important;
  font-size:11px!important;line-height:1.55;text-align:left!important;border-radius:12px;opacity:.9;
  box-shadow:0 10px 30px rgba(0,0,0,.5);
}

/* Feedback 20-07: ankerlinks (bv. "bekijk pakketten" -> #pakketten) soepel scrollen */
html{scroll-behavior:smooth}
/* game.php: subtiele hover-lift op kaarten (o.a. populair) */
#mcGameGrid .mc-gcard{transition:transform .2s ease,border-color .2s ease}
#mcGameGrid .mc-gcard:hover{transform:translateY(-4px)}

/* Locatiekaart: markers met pulse + monolabels (20-07) */
.mc-map-dot{position:absolute;transform:translate(-50%,-50%);width:0;height:0}
.mc-map-dot span{position:absolute;left:-5px;top:-5px;width:10px;height:10px;border-radius:50%;display:block}
.mc-map-dot span::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1.5px solid currentColor;opacity:0;animation:mcMapPulse 3s ease-out infinite;color:rgba(46,155,255,.55)}
.mc-map-dot b{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;letter-spacing:.5px;color:#aab4c2;text-shadow:0 2px 8px rgba(0,0,0,.9)}
@keyframes mcMapPulse{0%{transform:scale(.4);opacity:.8}70%{transform:scale(1.6);opacity:0}100%{opacity:0}}
@media (max-width:700px){.mc-map-dot b{display:none}}

/* Pakket-grids (20-07): flex met centrering zodat onvolledige onderste rijen netjes in het midden staan */
.mc-plangrid>div{width:calc(25% - 12px)}
@media (max-width:1100px){.mc-plangrid>div{width:calc(50% - 8px)}}
@media (max-width:600px){.mc-plangrid>div{width:100%}}

/* Cart-pagina's (20-07): stappenbalk loopt full-bleed door — clip voorkomt een horizontale scrollbar
   door de 50vw-truc (clip i.p.v. hidden zodat position:sticky blijft werken) */
body.mc-dark{overflow-x:clip}
.mc-main .mc-cart-steps-bar{margin-top:-40px!important}
.mc-cart-steps-bar>div{overflow-x:auto;scrollbar-width:none}
.mc-cart-steps-bar>div::-webkit-scrollbar{display:none}

/* six-fallback pagina's: WHMCS-verborgen blokken ook zonder core-css echt verbergen.
   LET OP: .w-hidden bewust ZONDER !important — WHMCS' eigen scripts.js toont elementen met
   deze klasse via jQuery .slideDown()/.show() (inline style), wat een !important-regel
   permanent zou blokkeren (brak "Al geregistreerd?" op de afrekenpagina). #providerLinkingMessages
   wordt nooit door JS zichtbaar gemaakt (alleen uitgelezen), dus die mag wel hard verborgen blijven. */
.w-hidden{display:none}
#providerLinkingMessages{display:none!important}
/* six-login binnen 2026-schil: gecentreerde kaart */
body[data-page="login"] .logincontainer,body[data-page="password-reset-container"] .logincontainer{max-width:520px;margin:30px auto 70px;background:#0d1219;border:1px solid rgba(255,255,255,.09);border-radius:16px;padding:34px 34px 30px}
body[data-page="login"] .logincontainer .header-lined h1,body[data-page="password-reset-container"] .logincontainer .header-lined h1{font-size:26px;color:#e8edf4;border:0;margin:0 0 4px}
body[data-page="login"] .logincontainer .header-lined h1 small,body[data-page="login"] .logincontainer p,body[data-page="password-reset-container"] .logincontainer .header-lined h1 small,body[data-page="password-reset-container"] .logincontainer p{color:#8a94a3}
body[data-page="login"] .logincontainer .col-sm-7,body[data-page="login"] .logincontainer .col-sm-12,body[data-page="password-reset-container"] .logincontainer .col-sm-7,body[data-page="password-reset-container"] .logincontainer .col-sm-12{width:100%;max-width:100%;flex:0 0 100%}
body[data-page="login"] .logincontainer .col-sm-5,body[data-page="password-reset-container"] .logincontainer .col-sm-5{width:100%;max-width:100%;flex:0 0 100%;margin-top:18px}
body[data-page="login"] .logincontainer .btn-default,body[data-page="password-reset-container"] .logincontainer .btn-default{background:#10151d;border:1px solid rgba(255,255,255,.12);color:#e8edf4;border-radius:9px}
body[data-page="password-reset-container"] .logincontainer .form-group-feedback{position:relative}
body[data-page="password-reset-container"] .logincontainer .form-control-feedback{position:absolute;right:12px;top:38px;color:#5b6675}
body[data-page="password-reset-container"] .logincontainer #inputNewPassword2Msg{font-size:12px;margin-top:6px}
body[data-page="password-reset-container"] .logincontainer #inputNewPassword2Msg.text-success{color:#41d98d}
body[data-page="password-reset-container"] .logincontainer #inputNewPassword2Msg.text-danger{color:#ff9c8c}
body[data-page="password-reset-container"] .logincontainer .progress{background-color:#10151d;border-radius:6px;height:7px;border:1px solid rgba(255,255,255,.08);overflow:hidden;margin:6px 0 4px}
body[data-page="password-reset-container"] .logincontainer .alert{border-radius:10px;padding:13px 16px;font-size:13.5px;line-height:1.5;border:1px solid transparent}
body[data-page="password-reset-container"] .logincontainer .alert-info{background:rgba(46,155,255,.08);border-color:rgba(46,155,255,.4);color:#bcdcff}
body[data-page="password-reset-container"] .logincontainer .alert-danger{background:rgba(255,122,107,.08);border-color:rgba(255,122,107,.4);color:#ff9c8c}
body[data-page="password-reset-container"] .logincontainer .alert-success{background:rgba(65,217,141,.08);border-color:rgba(65,217,141,.4);color:#a6f0c6}
body[data-page="password-reset-container"] .logincontainer .alert h2{font-size:14px;margin:0 0 4px;color:inherit}
body[data-page="password-reset-container"] .logincontainer .help-block{color:#ff9c8c;font-size:12.5px;margin:6px 0 0}
body[data-page="password-reset-container"] .logincontainer .form-group.has-error .form-control{border-color:rgba(255,122,107,.5)!important}
body[data-page="password-reset-container"] .logincontainer .form-group.has-success .form-control{border-color:rgba(65,217,141,.5)!important}

/* Provider-feedback (Google-koppeling): duidelijke melding i.p.v. onzichtbare tekst */
.providerLinkingFeedback:not(:empty){display:block;background:rgba(245,179,61,.08);border:1px solid rgba(245,179,61,.45);border-radius:10px;padding:13px 16px;color:#f5d9a0;font-size:13.5px;line-height:1.5;margin:0 0 16px}
.providerLinkingFeedback:not(:empty) a{color:#f5b83d}
/* Google-knop netjes in de loginkaart: eigen sectie met scheidingslijn, gecentreerd */
body[data-page="login"] .logincontainer .col-sm-5{display:flex!important;flex-direction:column;align-items:center;gap:10px;border-top:1px solid rgba(255,255,255,.08);margin-top:22px;padding-top:20px}
body[data-page="login"] .logincontainer .providerPreLinking{display:flex;justify-content:center;width:100%}
body[data-page="login"] .logincontainer iframe{max-width:100%}