/* ==========================================================================
   Hosting & Design – huisstijl bovenop het Antler-thema
   Opbouw: 1 lettertypes · 2 tokens · 3 basis · 4 knoppen · 5 header
           6 hero en banner · 7 secties · 8 pakketten · 9 tabellen
           10 kaarten · 11 FAQ · 12 CTA · 13 footer · 14 formulieren
           15 kennisbank · 16 contact en inloggen · 17 toegankelijkheid
           18 mobiel
   Regel: gebruik altijd een token (var(--…)), nooit een losse kleur of maat.
   !important staat er alleen waar het Antler-thema anders wint.
   ========================================================================== */

/* 1. Lettertypes ---------------------------------------------------------- */
@font-face{font-family:Poppins;font-weight:400;font-display:swap;src:url(../assets/fonts/poppins/poppins-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Poppins;font-weight:500;font-display:swap;src:url(../assets/fonts/poppins/poppins-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:Poppins;font-weight:600;font-display:swap;src:url(../assets/fonts/poppins/poppins-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:Poppins;font-weight:700;font-display:swap;src:url(../assets/fonts/poppins/poppins-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Libre Baskerville";font-style:italic;font-weight:400;font-display:swap;src:url(../assets/fonts/poppins/libre-baskerville-latin-400-italic.woff2) format("woff2")}

/* 2. Tokens --------------------------------------------------------------- */
:root{
  /* merk */
  --hed-accent:#4b3fd1;          /* hoofdkleur: knoppen, links, accenten */
  --hed-accent-dark:#3a2fb0;     /* hover */
  --hed-accent-deep:#2c2582;     /* midden van verlopen */
  --hed-accent-soft:#eceaff;     /* lichte vlakken, infobalk, stapnummers */
  --hed-accent-light:#c9c4ff;    /* accent op donkere achtergrond */
  --hed-focus:#8b80ff;           /* focusrand */
  --hed-check:#8ef0b6;           /* vinkjes op donker */
  /* neutraal */
  --hed-ink:#1b1a33;             /* koppen, footer, donkere vlakken */
  --hed-text:#3d3b55;            /* lopende tekst in artikelen */
  --hed-muted:#5f5d78;           /* ondergeschikte tekst */
  --hed-muted-strong:#4a4860;    /* labels op lichte vlakken */
  --hed-placeholder:#6b6980;
  --hed-border:#e4e3ef;
  --hed-border-input:#d9d7e8;
  --hed-surface:#f6f6fb;         /* lichte kaart- en sectieachtergrond */
  --hed-white:#fff;
  --hed-on-dark:rgba(255,255,255,.85);
  --hed-on-dark-muted:rgba(255,255,255,.75);
  --hed-line-on-dark:rgba(255,255,255,.12);
  /* status */
  --hed-ok:#2e7d32;
  --hed-danger:#c62828;
  /* verlopen */
  --hed-gradient:linear-gradient(135deg,var(--hed-ink) 0%,var(--hed-accent-deep) 60%,var(--hed-accent) 100%);
  --hed-gradient-cta:linear-gradient(135deg,var(--hed-accent-deep),var(--hed-accent));
  /* typografie */
  --hed-font:Poppins,"Open Sans",Arial,sans-serif;
  --hed-font-accent:"Libre Baskerville",Georgia,serif;
  --fs-xs:12px;  --fs-sm:13px;  --fs-md:14px;  --fs-body-sm:15px;
  --fs-body:16px; --fs-lg:18px; --fs-xl:22px;  --fs-2xl:32px;
  --lh-body:1.65;
  /* ruimte */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px;
  --section-y:96px; --section-y-mobile:60px;
  /* vormen */
  --r-xs:4px; --r-sm:6px; --r-md:10px; --r-card:14px; --r-panel:16px; --r-cta:20px; --r-pill:50px;
  --sh-header:0 2px 14px rgba(27,26,51,.07);
  --sh-card:0 10px 30px rgba(27,26,51,.06);
  --sh-float:0 10px 30px rgba(27,26,51,.08);
  --sh-hover:0 10px 30px rgba(75,63,209,.12);
  --sh-feature:0 20px 50px rgba(75,63,209,.25);
  --ring:0 0 0 3px rgba(75,63,209,.2);
}

/* 3. Basis ---------------------------------------------------------------- */
body,.hed-page,.footer,.menu-wrap,h1,h2,h3,h4,h5,h6,.btn,input,select,textarea{font-family:var(--hed-font)}
h1,h2,h3,h4,h5,h6,.section-heading,.heading,.btn,.title,.main-menu a{text-transform:none!important}
.hed-page p:not(.hed-voetnoot):not(.special-note),.hed-page li{font-size:var(--fs-body);line-height:var(--lh-body)}
.hed-page p a,.hed-tekst a,.hed-faq .info a{color:var(--hed-accent)}
.float-end{float:right}
@media (min-width:992px){.offset-md-1{margin-left:8.333333%}}
#spinner-area{display:none!important}
.c-yellow{color:var(--hed-accent-light)!important}
.c-purple{color:var(--hed-accent)!important}
.bg-purple{background-color:var(--hed-ink)!important}
.hed-eyebrow{display:block!important;width:max-content;text-transform:uppercase;letter-spacing:.12em;font-size:var(--fs-sm)!important;font-weight:600;color:var(--hed-accent);margin-bottom:10px}

/* 4. Knoppen -------------------------------------------------------------- */
.btn-default-yellow-fill,.btn-primary{background-color:var(--hed-accent)!important;color:var(--hed-white)!important}
.btn-default-yellow-fill:hover,.btn-default-yellow-fill:focus,.btn-primary:hover{background-color:var(--hed-accent-dark)!important;border-color:var(--hed-accent-dark)!important;color:var(--hed-white)!important}
.btn-primary:focus{color:var(--hed-white)!important}
.btn-default-purple-fill{background-color:var(--hed-ink)!important}
.btn-default-purple-fill:hover{background-color:var(--hed-accent)!important}
.btn-default-fill{border:2px solid var(--hed-accent)!important;color:var(--hed-accent)!important;background:var(--hed-white)!important}
.btn-default-fill:hover{background:var(--hed-accent)!important;color:var(--hed-white)!important}
.hed-btn-licht{background:transparent!important;border:2px solid rgba(255,255,255,.7)!important;color:var(--hed-white)!important}
.hed-btn-licht:hover{background:var(--hed-white)!important;color:var(--hed-ink)!important}
.btn-yes{background:var(--hed-ok)!important;color:var(--hed-white)!important}
.btn-no{background:var(--hed-danger)!important;color:var(--hed-white)!important}

/* 5. Header en infobalk --------------------------------------------------- */
.hed-logo{width:auto;height:46px;max-width:190px}
#menu-mobile .hed-logo{height:40px}
.infonews{background:var(--hed-accent-soft)!important}
.infonews,.infonews span,.infonews a,.infonews .iconews,.infonews i{color:var(--hed-ink)!important}
.infonews .c-yellow{color:var(--hed-accent)!important;font-weight:600}
.infonews .tabphone{margin-left:14px}
.infonews .iconews:not(.tabphone){display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}
#header .menu-wrap,#header .nav-menu{background:var(--hed-white)!important}
#header .menu-wrap{box-shadow:var(--sh-header)}
#menu .main-menu>li{margin:0 14px!important}
#menu .main-menu>li>a{font-weight:500;margin:0 14px!important}
#header #menu .main-menu>li>a{color:var(--hed-ink)!important}
#header #menu .main-menu>li>a:hover{color:var(--hed-accent)!important}
#menu-mobile .menu-toggle .icon{background:var(--hed-ink)!important}
.menu-toggle{min-width:44px;min-height:44px}

/* 6. Hero (startpagina) en paginabanner ------------------------------------ */
.hed-hero .carousel-cell{background:var(--hed-gradient);min-height:0!important;display:flex;align-items:center}
.hed-hero .slider-content{padding:150px 0 90px!important;width:100%}
.hed-hero [data-aos]{opacity:1!important;transform:none!important}
.hed-hero .flickity-page-dots,.hed-hero .flickity-prev-next-button,.hed-hero .gocontent{display:none!important}
.hed-hero h1{color:var(--hed-white);font-weight:700;line-height:1.15;font-size:clamp(32px,4vw,51px);letter-spacing:normal!important}
.hed-hero h1 em{font-family:var(--hed-font-accent);font-style:italic;font-weight:400;color:var(--hed-accent-light)}
.hed-hero p{color:var(--hed-on-dark);font-size:var(--fs-lg);max-width:600px}
.hed-hero .hed-eyebrow{color:var(--hed-accent-light)}
.hed-hero .special-note{position:static!important;margin:12px 0 0!important}
.hed-hero .special-note .text{color:var(--hed-on-dark);font-size:var(--fs-body-sm)!important}
.hed-hero .custom-element-right{opacity:.35}
.hed-hero-knoppen{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin:22px 0 6px}
.hed-checks{list-style:none;padding:0;margin:22px 0 0;display:flex;flex-wrap:wrap;gap:8px 22px}
.hed-checks li{color:var(--hed-white);font-weight:500}
.hed-checks i{color:var(--hed-check);margin-right:6px}
.hed-banner.top-header{background:var(--hed-gradient)!important;padding:170px 0 70px}
.hed-banner .heading{color:var(--hed-white);font-weight:700;letter-spacing:normal!important}
.hed-banner .subheading{color:var(--hed-on-dark);font-weight:400;font-size:var(--fs-lg)}

/* 7. Secties -------------------------------------------------------------- */
.box-container .sec-normal{padding-top:var(--section-y)!important;padding-bottom:var(--section-y)!important}
.box-container .wrapper.sec-normal{padding-top:56px!important}
.box-container .hed-cta.sec-normal{padding-top:40px!important;padding-bottom:40px!important}
/* paarse band (.sec-bg4): het thema geeft de paarse achtergrond, wij de leesbare tekst */
[data-background] .box-container .sec-bg4 .section-heading{color:var(--hed-white)!important}
[data-background] .box-container .sec-bg4 .section-subheading{color:rgba(255,255,255,.88)!important}

/* 8. Pakketten ------------------------------------------------------------ */
.hed-plans:not(.specialposition){padding-top:70px}
.hed-plans.specialposition{margin-top:0!important;padding-top:70px!important}
.hed-plans .sec-up-slider{margin-top:10px!important}
.hed-plans [hidden]{display:none!important}
.hed-switch{display:flex;justify-content:center;gap:6px;margin:0 auto 30px;background:var(--hed-white);border-radius:var(--r-pill);padding:6px;width:max-content;box-shadow:var(--sh-float);position:relative;z-index:2}
.hed-plans .hed-switch{margin-bottom:56px}
.hed-switch button{border:0;background:transparent;padding:10px 22px;border-radius:var(--r-pill);font-weight:600;color:var(--hed-ink);cursor:pointer}
.hed-switch button.active{background:var(--hed-accent);color:var(--hed-white)}
.hed-switch .badge,.badge.bg-pink{font-size:11px!important}
.hed-switch .badge{margin-left:4px}
.hed-plans .price{font-size:var(--fs-2xl)!important;line-height:1.2;font-weight:700;color:var(--hed-ink)}
.hed-plans .price .period{font-weight:400;color:var(--hed-muted)}
.hed-plans .price .period,.hed-incl,.hed-incl-inline{font-size:var(--fs-sm)!important}
.hed-incl{color:var(--hed-muted);margin:-4px 0 16px}
.hed-incl-inline{color:var(--hed-muted)}
.hed-uitgelicht{box-shadow:var(--sh-feature)!important;border-radius:12px}
.hed-plans .hed-uitgelicht{outline:2px solid var(--hed-accent);outline-offset:-2px}
.hed-plans .hed-uitgelicht .top-content,.hed-plans .hed-uitgelicht .list-info{border-color:var(--hed-accent)!important}
.hed-plans .list-info,.hed-plans .list-info.bg-purple{background:var(--hed-white)!important;border:1px solid var(--hed-border);border-top:0}
.list-info li{display:flex;align-items:center;gap:var(--sp-3);padding:7px 0!important}
.hed-plans .list-info li{font-size:var(--fs-body-sm);padding:10px 0!important}
.hed-plans .list-info li,.hed-plans .list-info li span{color:var(--hed-ink)!important}
.list-info li span{font-size:var(--fs-body-sm)!important;line-height:1.45!important}
.list-info li i.fa-check-circle,.list-info li i.fa-check{font-size:20px!important;line-height:1!important;width:auto!important;margin:0!important;flex:0 0 auto}
.list-info li i,.hed-plans .list-info li i{color:var(--hed-accent)!important}
.hed-voetnoot{color:var(--hed-muted);margin-top:22px;font-size:var(--fs-md)!important;line-height:1.6}

/* 9. Tabellen ------------------------------------------------------------- */
.hed-tld{width:100%}
.hed-tld th,.hed-tld td{font-size:var(--fs-body)}
.hed-tld td,.hed-tld th,.hed-vergelijk td,.hed-vergelijk th{vertical-align:middle}
.table-responsive-lg{display:block;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}

/* 10. Kaarten, lijsten en stappen ------------------------------------------ */
.hed-kaart{background:var(--hed-white);border:1px solid var(--hed-border);border-radius:var(--r-panel);padding:var(--sp-6);box-shadow:var(--sh-card)}
.hed-kaart h2,.hed-kaart h3{color:var(--hed-ink);font-weight:700;margin-bottom:14px}
.hed-lijst{list-style:none;padding:0;margin:18px 0}
.hed-lijst li{padding:5px 0}
.hed-lijst i{color:var(--hed-accent);margin-right:var(--sp-2);width:18px}
.hed-stappen{counter-reset:stap;list-style:none;padding:0;margin:0}
.hed-stappen li{counter-increment:stap;position:relative;padding:0 0 18px 48px;color:var(--hed-muted)}
.hed-stappen li::before{content:counter(stap);position:absolute;left:0;top:0;width:32px;height:32px;border-radius:50%;background:var(--hed-accent-soft);color:var(--hed-accent);font-weight:700;display:flex;align-items:center;justify-content:center}
.hed-stappen strong{display:block;color:var(--hed-ink)}
.hed-page .hed-stappen li strong{font-size:var(--fs-body)}
.hed-zoekkaart{text-align:center}
.hed-zoeker{max-width:640px;margin:20px auto 0}
.hed-zoeker input[type=text],.hed-zoekkaart input[type=text]{background:var(--hed-white)!important;color:var(--hed-ink)!important;border:1px solid var(--hed-border-input)!important}
/* kaart (gedeeld door paarse band, keuzekaarten en nieuws) */
.sec-bg4 .row:has(>[class*=col-]>.service-section),.hed-route .row,.hed-nieuws .row{display:flex;flex-wrap:wrap}
.sec-bg4 .row>[class*=col-]:has(>.service-section){display:flex;margin-bottom:var(--sp-5)}
.sec-bg4 .row>[class*=col-]>.service-section{flex:1 1 auto;width:100%;margin:0!important;padding:30px 26px!important;border-radius:var(--r-card)!important;background:var(--hed-white)!important;border:1px solid var(--hed-border);display:flex;flex-direction:column;text-align:left}
.sec-bg4 .service-section img.svg{width:46px;height:46px;margin:0 0 16px!important}
.sec-bg4 .service-section .title{font-size:var(--fs-lg)!important;font-weight:700!important;margin-bottom:var(--sp-2)!important;line-height:1.35;color:var(--hed-ink)!important}
.sec-bg4 .service-section .subtitle{font-size:var(--fs-body-sm)!important;line-height:1.6!important;margin-bottom:14px;color:var(--hed-text)!important}
.sec-bg4 .service-section>a:last-child{margin-top:auto;font-weight:600;color:var(--hed-accent)!important;text-decoration:none!important}
.sec-bg4 .service-section>a:last-child::after{content:" →"}
/* keuzekaarten 'Waar kunnen we je mee helpen?' */
.hed-route .row{row-gap:var(--sp-5)}
.hed-route [class*=col-]:has(>.service-section){display:flex}
.hed-route .service-section{position:relative;flex:1 1 auto;padding:28px 26px!important;border-radius:var(--r-card);border:1px solid var(--hed-border);background:var(--hed-surface)!important;transition:border-color .2s,box-shadow .2s,transform .2s;display:flex;flex-direction:column}
.hed-route .service-section:hover{border-color:var(--hed-accent);box-shadow:var(--sh-hover);transform:translateY(-2px)}
.hed-route .service-section:focus-within{outline:3px solid var(--hed-focus);outline-offset:2px}
.hed-route .service-section img.svg{width:44px;height:44px;margin-bottom:16px}
.hed-route .service-section .title{font-size:var(--fs-lg)!important;font-weight:700!important;color:var(--hed-ink)!important;margin-bottom:var(--sp-2)}
.hed-route .service-section .subtitle{font-size:var(--fs-body-sm)!important;line-height:1.6!important;color:var(--hed-muted)!important;margin-bottom:var(--sp-4)}
.hed-route .service-section>a{margin-top:auto;font-weight:600;color:var(--hed-accent)!important;text-decoration:none!important}
.hed-route .service-section>a::after{content:" →"}
.hed-route .service-section>a::before{content:"";position:absolute;inset:0}
/* nieuws */
.hed-nieuws .row{justify-content:center}
.hed-page .service-section.bg-pratalight{padding:28px;border-radius:var(--r-card)}
.hed-nieuws .service-section{height:100%}
.hed-nieuws .service-section .title{font-size:19px!important;font-weight:700!important;margin-bottom:10px}
.hed-nieuws .service-section .subtitle{font-size:var(--fs-body-sm)!important;line-height:1.6}

/* 11. FAQ en lopende tekst ------------------------------------------------- */
.hed-faq .panel-title{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-4)}
.hed-faq .panel-title span{font-weight:600}
.hed-faq .info,.hed-faq .info p,.hed-faq .list{font-size:var(--fs-body);line-height:1.7}
.hed-tekst h2{font-size:var(--fs-xl);font-weight:700;color:var(--hed-ink);margin:28px 0 10px}
.hed-tekst p,.hed-tekst li{color:var(--hed-muted);line-height:1.7}

/* 12. Call to action ------------------------------------------------------- */
.hed-cta-box{background:var(--hed-gradient-cta);color:var(--hed-white);border-radius:var(--r-cta);padding:44px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-5)}
.hed-cta-box h2{color:var(--hed-white);font-weight:700;margin:0 0 6px}
.hed-cta-box p{color:var(--hed-on-dark);margin:0}
.hed-cta-box .btn-default-yellow-fill{background:var(--hed-white)!important;color:var(--hed-accent)!important}
.hed-cta-box .btn-default-yellow-fill:hover{background:var(--hed-ink)!important;color:var(--hed-white)!important}

/* 13. Footer -------------------------------------------------------------- */
.footer.hed-footer,#footer.hed-footer,.hed-footer .footer-top,.hed-footer .footer-bottom{background:var(--hed-ink)!important}
.hed-footer .container,.hed-footer .footer-top .row{background:transparent!important}
.hed-footer .heading{color:var(--hed-white)!important}
.hed-footer a,.hed-footer .menu-item,.hed-footer .footer-menu li,.hed-footer .payment-list p,.hed-footer .payment-list i,.hed-footer .hed-betaal{color:rgba(255,255,255,.78)!important}
.hed-footer a:hover{color:var(--hed-white)!important}
.hed-footer .hed-logo{display:block!important;height:48px}
.hed-footer .hed-footer-tekst{color:rgba(255,255,255,.7);font-size:var(--fs-body-sm)!important;line-height:1.6}
.hed-footer .payment-list .hed-betaal{font-weight:700;font-size:var(--fs-md);border:1px solid rgba(255,255,255,.35);border-radius:var(--r-xs);padding:2px 6px}
.hed-footer .footer-bottom{border-top:1px solid var(--hed-line-on-dark)}
.hed-footer .footer-bottom .footer-menu{display:flex;flex-wrap:wrap;gap:6px 22px}
.hed-footer .footer-bottom .footer-menu li{margin:0!important;white-space:nowrap}

/* 14. Formulieren en bestelproces ------------------------------------------ */
input[type=radio],input[type=checkbox]{accent-color:var(--hed-accent)}
.iradio_square-blue,.icheckbox_square-blue{filter:hue-rotate(42deg) saturate(1.15)}
.custom-control-input:checked~.custom-control-label::before,.checkbox input[type=checkbox]:checked+.cr::before{background-color:var(--hed-accent)!important;border-color:var(--hed-accent)!important}
.radio input[type=radio]:checked+.cr::before{border-color:var(--hed-accent)!important}
.radio input[type=radio]:checked+.cr::after,.switch input[type=checkbox]:checked+.cr::before{background:var(--hed-accent)!important}
.custom-control-input:focus~.custom-control-label::before{box-shadow:var(--ring)!important}
.form-control:focus{border-color:var(--hed-accent)!important;box-shadow:var(--ring)!important}
input::placeholder,textarea::placeholder,#order-standard_cart input::placeholder,#order-standard_cart .field::placeholder{color:var(--hed-placeholder)!important;opacity:1}
#order-standard_cart #inputPromotionCode{color:var(--hed-ink)!important}
#order-standard_cart p a:not(.btn),.main-content p a:not(.btn){color:var(--hed-accent)}
#order-standard_cart .option label,.bg-pratalight label,.custom-control-label,.divider span,.ticket-attachments-message,.text-muted{color:var(--hed-muted-strong)!important}
.divider span{font-size:var(--fs-sm)!important}
.small-font,.markdown-save{color:var(--hed-muted)!important;font-size:var(--fs-xs)!important}

/* 15. Kennisbank ----------------------------------------------------------- */
.kb-search-background{background:var(--hed-gradient)!important;border-radius:var(--r-panel);padding:44px 20px!important;margin:0 0 36px!important}
.kb-search-background .kb-search{background:none!important;margin:0 auto!important;padding:0!important}
.kb-search-background .overlay::before,.kb-search-background .overlay::after,.kb-search-background [class*=col-]::before{display:none!important}
.kb-search .form-control{font-size:var(--fs-body)!important}
html body .know-bgbox-container a.mergecolor span,html body .kbcategories a span{color:var(--hed-white)!important;font-weight:600}
.kb-article-content{overflow-wrap:anywhere}
.kb-article-content h2{font-size:var(--fs-xl)!important;font-weight:700;color:var(--hed-ink)!important;margin:28px 0 10px}
.kb-article-content p,.kb-article-content li{font-size:var(--fs-body);line-height:1.7;color:var(--hed-text)}
.kb-article-content a{color:var(--hed-accent)!important}
.kb-article-content code{color:var(--hed-accent-dark)!important;background:var(--hed-accent-soft)!important;padding:1px 6px;border-radius:var(--r-sm);font-size:.92em;white-space:normal;word-break:break-word;overflow-wrap:anywhere}

/* 16. Contact en inloggen -------------------------------------------------- */
.hed-contact{margin-top:10px}
.hed-contact .hed-kaart h2{font-size:var(--fs-xl)}
.hed-contact .hed-lijst li,.hed-contact p{font-size:var(--fs-body);line-height:var(--lh-body)}
.hed-contact .hed-lijst a,.hed-contact p a{color:var(--hed-accent)}
.hed-contact label{font-weight:600;margin-bottom:6px;font-size:var(--fs-md)}
.hed-contact .form-control{border-radius:var(--r-md)!important;border:1px solid var(--hed-border-input)!important;padding:12px 14px!important;height:auto!important;font-size:var(--fs-body)!important}
.hed-contact textarea.form-control{min-height:170px}
.hed-contact .h-100{height:100%}
.hed-contact form .row>div{padding-left:var(--sp-2)!important;padding-right:var(--sp-2)!important;flex:0 0 auto}
.hed-contact form .row>.col-12{width:100%;max-width:100%}
.login-page-header{display:flex;justify-content:space-between;align-items:center}
.hed-login-label{display:block;font-weight:600;font-size:var(--fs-md);color:var(--hed-ink);margin:0 0 6px 4px}
.hed-login-terug{font-weight:600;color:var(--hed-accent)!important;align-self:center}
.hed-login-nieuw{margin:28px 0 0;text-align:center;font-size:var(--fs-body-sm);color:var(--hed-muted-strong)}
.hed-login-nieuw a{color:var(--hed-accent)!important;text-decoration:underline!important}

/* 17. Toegankelijkheid ----------------------------------------------------- */
.hed-skip{position:absolute;left:12px;top:-60px;z-index:10000;background:var(--hed-ink);color:var(--hed-white)!important;padding:10px 16px;border-radius:var(--r-md);font-weight:600;text-decoration:none}
.hed-skip:focus{top:12px}
#hed-main:focus{outline:none}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible,.btn:focus-visible,#header a:focus-visible,#menu a:focus-visible{outline:3px solid var(--hed-focus)!important;outline-offset:2px!important}
.hed-page p a:not(.btn),.hed-page li a:not(.btn),.hed-faq .info a,.hed-tekst a,.kb-article-content a,.main-content p a:not(.btn),.hed-contact p a,#registration a.c-pink,label a{text-decoration:underline!important;text-underline-offset:2px}

/* 18. Mobiel (tot 767px) --------------------------------------------------- */
@media (max-width:767px){
  .box-container .sec-normal{padding-top:var(--section-y-mobile)!important;padding-bottom:var(--section-y-mobile)!important}
  .box-container .hed-cta.sec-normal{padding-top:var(--sp-5)!important;padding-bottom:var(--sp-5)!important}
  .hed-hero .slider-content{padding:120px 0 50px!important}
  .hed-hero h1{font-size:var(--fs-2xl)!important}
  .hed-hero p{font-size:var(--fs-body);line-height:1.6!important}
  .hed-hero-knoppen .btn{flex:1 1 100%}
  .hed-banner.top-header{padding:120px 0 40px}
  .hed-banner .heading{font-size:var(--fs-2xl)!important}
  .domains-search{display:flex;flex-wrap:wrap;gap:10px}
  .domains-search .inputdomainsearch{width:100%!important;padding-right:20px!important;font-size:var(--fs-body-sm)!important}
  .domains-search .ds-content{position:static!important;display:flex;gap:10px;width:100%}
  .domains-search .ds-content .search{flex:1;position:static!important}
  .domains-search .ds-content button{position:static!important;margin:0!important}
  .hed-switch{width:100%}
  .hed-switch button{flex:1;padding:10px 8px}
  .hed-plans .price .period{display:block;margin-top:2px;line-height:1.4}
  .hed-cta-box{padding:28px}
  .hed-vergelijk,.hed-tld{table-layout:fixed;width:100%!important;min-width:0!important}
  .hed-vergelijk th,.hed-vergelijk td{padding:9px 4px!important;white-space:normal!important;overflow-wrap:normal;word-break:normal;font-size:var(--fs-sm)!important}
  .hed-vergelijk tr>*:first-child{width:31%}
  .hed-vergelijk .btn{padding:8px 6px!important;font-size:var(--fs-xs)!important;white-space:normal!important;line-height:1.3;width:100%}
  .hed-tld th,.hed-tld td{padding:9px 4px!important;font-size:var(--fs-sm)!important;white-space:normal!important;word-break:normal}
  .hed-tld tr>*:first-child{width:22%}
  .hed-tld .hed-incl-inline{display:block;font-size:11.5px!important}
  .hed-footer .footer-menu li a{display:inline-block;padding:10px 0}
  .hed-footer .footer-menu li{margin:0!important}
}
.marketing-email-optin p{text-transform:none!important}
/* alleen e-mail */
.hed-mailgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:var(--sp-5);margin-top:var(--sp-6)}
.hed-mailkaart{background:var(--hed-white);border:1px solid var(--hed-border);border-radius:var(--r-card);padding:28px 26px;display:flex;flex-direction:column}
.hed-mailnaam{font-size:var(--fs-xl)!important;font-weight:700;color:var(--hed-accent);margin:0 0 var(--sp-2)}
.hed-mailprijs{font-size:var(--fs-2xl)!important;font-weight:700;color:var(--hed-ink);line-height:1.2;margin:0}
.hed-mailprijs span{display:block;margin-top:2px;line-height:1.4;font-size:var(--fs-sm);font-weight:400;color:var(--hed-muted)}
.hed-mailkaart .hed-incl{margin:4px 0 0}
.hed-mailkaart .hed-lijst{margin:18px 0 22px}
.hed-mailkaart .hed-lijst li{font-size:var(--fs-body-sm)!important}
.hed-mailkaart .btn{margin-top:auto;align-self:flex-start}
.hed-eyebrow.mx-auto{margin-left:auto;margin-right:auto}

/* opslagtreden */
.hed-aanbod{row-gap:var(--sp-5);align-items:stretch}
.hed-aanbod>[class*=col-]{display:flex}
.hed-aanbod>[class*=col-]>*{flex:1 1 auto;width:100%}
.hed-aanbod .wrapper{margin:0!important}
.hed-treden{background:var(--hed-white);border:1px solid var(--hed-border);border-radius:var(--r-panel);padding:var(--sp-6);box-shadow:var(--sh-card);display:flex;flex-direction:column}
.hed-treden h3{color:var(--hed-ink);font-weight:700;font-size:var(--fs-xl)!important;margin:0 0 14px}
.hed-tredentabel{width:100%;border-collapse:collapse;margin:0 0 18px}
.hed-tredentabel th,.hed-tredentabel td{padding:12px 10px;border-bottom:1px solid var(--hed-border);font-size:var(--fs-body)!important;color:var(--hed-text);text-align:left;vertical-align:middle}
.hed-tredentabel thead th{font-size:var(--fs-sm)!important;font-weight:600;color:var(--hed-muted);text-transform:uppercase;letter-spacing:.06em;padding-top:0}
.hed-tredentabel tbody th{color:var(--hed-ink);font-weight:700}
.hed-tredentabel td{font-variant-numeric:tabular-nums}
.hed-tredentabel tr.hed-start th,.hed-tredentabel tr.hed-start td{background:var(--hed-accent-soft)}
.hed-tredentabel tbody tr:last-child th,.hed-tredentabel tbody tr:last-child td{border-bottom:0}
.hed-label{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:var(--r-pill);background:var(--hed-accent);color:#fff;font-size:var(--fs-xs)!important;font-weight:600;vertical-align:middle}
.hed-uitleg{color:var(--hed-text);font-size:var(--fs-body-sm)!important;line-height:1.6;margin:auto 0 0}
.hed-voorbeelden .row{row-gap:var(--sp-5)}
.hed-voorbeelden .hed-kaart{height:100%;display:flex;flex-direction:column}
.hed-voorbeeldprijs{margin:auto 0 0;color:var(--hed-text);font-size:var(--fs-body)!important}
.hed-voorbeeldprijs strong{font-size:var(--fs-xl);color:var(--hed-ink)}
.hed-voorbeeldprijs span{display:block;font-size:var(--fs-sm)!important;color:var(--hed-muted)}
@media (max-width:575px){.hed-treden{padding:var(--sp-5)}.hed-tredentabel th,.hed-tredentabel td{padding:10px 6px;font-size:var(--fs-body-sm)!important}.hed-label{display:block;margin:4px 0 0;width:max-content}}

.hed-plans .hed-prijs .period{display:block;margin-top:4px;line-height:1.4}

.hed-gebruik{justify-content:center}
.hed-gebruik h3{font-size:var(--fs-2xl)!important;line-height:1.3;margin:6px 0 18px}
.hed-gebruik .hed-uitleg{margin:0}
@media (max-width:575px){.hed-gebruik h3{font-size:var(--fs-xl)!important}}
