:root{--tw-blue:#1761dc;--tw-orange:#ff6a2d;--tw-dark:#061830;--tw-white:#fff;--tw-lime:#d6f35d;--tw-sky:#80d7ff;--tw-cream:#f7f3e9;--tw-ice:#eef6ff}
.color-demo-toggle{position:fixed;z-index:280;right:20px;bottom:20px;min-width:154px;padding:8px 10px 8px 15px;border:1px solid rgba(255,255,255,.36);border-radius:99px;background:var(--tw-dark);color:var(--tw-white);box-shadow:0 14px 45px rgba(3,11,25,.3);display:none!important;grid-template-columns:auto 1fr 34px;gap:8px;align-items:center;cursor:pointer;font:900 10px/1 Arial,sans-serif}.color-demo-toggle span{opacity:.6;text-transform:uppercase;letter-spacing:.12em}.color-demo-toggle b{text-align:left}.color-demo-toggle i{position:relative;width:34px;height:20px;border-radius:99px;background:linear-gradient(90deg,var(--tw-blue),var(--tw-orange))}.color-demo-toggle i:after{content:"";position:absolute;left:3px;top:3px;width:14px;height:14px;border-radius:50%;background:var(--tw-white);transition:transform .25s}.color-demo-toggle[aria-pressed=true] i{background:var(--tw-blue)}.color-demo-toggle[aria-pressed=true] i:after{transform:translateX(14px)}
html[data-color-theme=calm]{--blue:var(--tw-blue);--orange:var(--tw-orange);--navy:var(--tw-dark);--night:var(--tw-dark);--ink:var(--tw-dark);--lime:var(--tw-blue);--sky:var(--tw-white);--cream:var(--tw-white);--ice:var(--tw-white);--line:rgba(6,24,48,.2);--accent:var(--tw-orange);--accent-ink:var(--tw-white)}
html[data-color-theme=calm] body{background:var(--tw-white);color:var(--tw-dark)}html[data-color-theme=calm] .swipe,html[data-color-theme=calm] .daily,html[data-color-theme=calm] .quote-section,html[data-color-theme=calm] .checker-section,html[data-color-theme=calm] .packages-section{background:var(--tw-white)}html[data-color-theme=calm] .ai-sprint,html[data-color-theme=calm] .customer-shortcut{background:var(--tw-blue);color:var(--tw-white)}html[data-color-theme=calm] .ai-sprint a{background:var(--tw-orange)}html[data-color-theme=calm] .customer-shortcut .eyebrow{color:var(--tw-white)}html[data-color-theme=calm] .shared-site-header .service-menu-panel a,html[data-color-theme=calm] .mega a{background:var(--tw-white);color:var(--tw-dark);border:1px solid rgba(6,24,48,.18)}html[data-color-theme=calm] .shared-site-header .service-menu-panel a:nth-child(2),html[data-color-theme=calm] .mega a:nth-child(2){background:var(--tw-orange);color:var(--tw-white)}html[data-color-theme=calm] .shared-site-header .service-menu-panel a:nth-child(3),html[data-color-theme=calm] .mega a:nth-child(3){background:var(--tw-blue);color:var(--tw-white)}html[data-color-theme=calm] .shared-site-header .service-menu-panel a:nth-child(5),html[data-color-theme=calm] .mega a:nth-child(5){background:var(--tw-white);color:var(--tw-dark)}html[data-color-theme=calm] .shared-site-header .service-menu-panel a:nth-child(6),html[data-color-theme=calm] .shared-site-header .service-menu-panel a:nth-child(7),html[data-color-theme=calm] .mega a:nth-child(6),html[data-color-theme=calm] .mega a:nth-child(7){background:var(--tw-dark);color:var(--tw-white)}html[data-color-theme=calm] .old-school{border-color:rgba(6,24,48,.22)}
/* Homepage: behoud onderscheid wanneer groen en lichtblauw uit het palet verdwijnen. */
html[data-color-theme=calm] .timeline-story .ey,html[data-color-theme=calm] .timeline-story h2 em{color:var(--tw-white)}html[data-color-theme=calm] .time-copy b{color:var(--tw-orange)}html[data-color-theme=calm] .service-sheet[data-service=hosting]{background:var(--tw-orange);color:var(--tw-white)}html[data-color-theme=calm] .service-sheet[data-service=visibility]{background:var(--tw-white);color:var(--tw-dark)}html[data-color-theme=calm] .rail-card:nth-child(3){background:var(--tw-orange);color:var(--tw-white)}html[data-color-theme=calm] .rail-card:nth-child(6){background:var(--tw-white);color:var(--tw-dark);border:1px solid rgba(6,24,48,.2)}html[data-color-theme=calm] .site-art i{background:var(--tw-orange)}html[data-color-theme=calm] .deck-hint i{background:var(--tw-orange);box-shadow:0 0 20px var(--tw-orange)}
/* Diensten: geef ieder dienstthema een contrasterend accent op donkerblauw. */
html[data-color-theme=calm] .theme-hosting{--accent:var(--tw-orange);--accent-soft:var(--tw-white);--accent-ink:var(--tw-white)}html[data-color-theme=calm] .theme-email{--accent:var(--tw-blue);--accent-soft:var(--tw-white);--accent-ink:var(--tw-white)}html[data-color-theme=calm] .theme-visibility{--accent:var(--tw-orange);--accent-soft:var(--tw-white);--accent-ink:var(--tw-white)}html[data-color-theme=calm] .theme-care{--accent:var(--tw-blue);--accent-soft:var(--tw-white);--accent-ink:var(--tw-white)}html[data-color-theme=calm] .theme-email .hero-copy h1 em{color:var(--tw-white)}html[data-color-theme=calm] .theme-email .contact{background:var(--tw-blue);color:var(--tw-white)}html[data-color-theme=calm] .nerdy-console li b{color:var(--tw-white)}html[data-color-theme=calm] .nerdy-console li i{color:var(--tw-orange)}html[data-color-theme=calm] .console-top i:nth-child(2),html[data-color-theme=calm] .console-top i:nth-child(3){background:var(--tw-white)}
/* Pakketten, bestellen en offerte: herstel tekstcontrast op actieve vlakken. */
html[data-color-theme=calm] .package-hosting{--accent:var(--tw-orange);--accent-ink:var(--tw-white)}html[data-color-theme=calm] .domain-result[data-status=available],html[data-color-theme=calm] .success{background:var(--tw-blue);color:var(--tw-white)}html[data-color-theme=calm] .domain-result[data-status=unknown]{background:var(--tw-white);color:var(--tw-dark);border-color:var(--tw-orange)}html[data-color-theme=calm] .quote-hero aside small{color:var(--tw-orange)}html[data-color-theme=calm] .concept-choice{background:var(--tw-white)}html[data-color-theme=calm] .package-card .card-top span{background:var(--tw-orange);color:var(--tw-white)}html[data-color-theme=calm] .customer-shortcut .shortcut-card{background:var(--tw-white);color:var(--tw-dark)}html[data-color-theme=calm] .customer-shortcut .shortcut-card li{color:var(--tw-dark)}
@media(max-width:600px){.color-demo-toggle{right:12px;bottom:12px;min-width:138px}}

/* Supermenu: beeldkaarten en urgente support houden in beide kleurstanden contrast. */
html[data-color-theme=calm] .shared-site-header .service-menu-panel .supermenu-feature{background:var(--tw-dark);color:var(--tw-white);border:0}
html[data-color-theme=calm] .shared-site-header .service-menu-panel .supermenu-feature small{color:var(--tw-white)}
html[data-color-theme=calm] .shared-site-header .supermenu-support>div{background:var(--tw-dark);color:var(--tw-white)}
html[data-color-theme=calm] .shared-site-header .service-menu-panel .supermenu-support>a{background:var(--tw-white);color:var(--tw-dark);border-color:rgba(6,24,48,.2)}
html[data-color-theme=calm] .shared-site-header .service-menu-panel .supermenu-support .supermenu-urgent{background:var(--tw-orange);color:var(--tw-white);border:0}
html[data-color-theme=calm] .shared-site-header .supermenu-support .supermenu-urgent span{color:var(--tw-white)}
/* Compleet Zorgeloos: pakketopsommingen blijven ook op ruime kaarten goed leesbaar. */
.route li{padding:15px 14px 15px 0;font-size:15px;line-height:1.4;font-weight:700}
#samenwerking{scroll-margin-top:110px}
/* Compleet Zorgeloos: compacte verdiepingslinks en een leesbaar periodiek dienstenoverzicht. */
.included-item-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px}
.included-item-head h3{min-width:0}
.included-item-head a{flex:0 0 auto;color:var(--sky);font-size:9px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid rgba(128,215,255,.42);padding-bottom:3px}
.included-item-head a:hover{color:#fff;border-color:#fff}
.bill-card small:nth-of-type(2)+strong{font-size:19px;line-height:1.3}
@media(max-width:520px){.included-item-head{align-items:flex-start}.included-item-head h3{font-size:25px}.included-item-head a{margin-top:5px}}
