/* Nieuw hoofdmenu op technea.nl. Gemaakt door website/nieuw_menu.py uit het menuvoorstel;
   niet met de hand aanpassen. Alles staat onder #header .tn-kop; het thema wordt daar opgeheven. */
#header{position:fixed!important;top:0!important;left:0!important;right:0!important;width:100%!important;
  height:auto!important;margin:0!important;padding:0!important;border:0!important;background:#fff!important;
  box-shadow:none!important;transform:none!important;filter:none!important;z-index:999!important}
html body .header-wrapper{height:108px}
@media (max-width:1180px){html body .header-wrapper{height:100px}}
#header .tn-kop{
  --bg-soft:#F3F4F7;      /* lichte achtergrond (hero) */
  --bg-alt:#F3F4F7;       /* afwisselende sectie-achtergrond */
  --ink:#161616;          /* Technea zwart */
  --ink-soft:#5C5C5C;     /* gedempte tekstkleur */
  --orange:#F28D2D;       /* Technea oranje */
  --orange-deep:#D97A1F;  /* donkerder oranje, hover/actief */
  --navy:#1C2338;         /* tweede donkere kleur, i.p.v. zwart op grote donkere blokken */
  --navy-2:#2A3550;       /* navy gradient-stop */
  --white:#FFFFFF;
  --line:#E3E5E9;         /* neutrale randkleur */
  --radius:10px;

  font-family:'Open Sans',Arial,sans-serif;font-size:16px;line-height:1.55;color:var(--ink);text-align:left;letter-spacing:normal}
#header .tn-kop :where(*:not(svg):not(svg *)){all:revert}
#header .tn-kop :where(*:not(svg):not(svg *))::before{all:revert}
#header .tn-kop :where(*:not(svg):not(svg *))::after{all:revert}
#header .tn-kop *{box-sizing:border-box}
#header .tn-kop *::before{box-sizing:border-box}
#header .tn-kop *::after{box-sizing:border-box}
#header .tn-kop h2{font-family:'Open Sans',Arial,sans-serif;font-weight:800;margin:0;letter-spacing:-.01em;line-height:1.2}
#header .tn-kop h3{font-family:'Open Sans',Arial,sans-serif;font-weight:800;margin:0;letter-spacing:-.01em;line-height:1.2}
#header .tn-kop p{margin:0}
#header .tn-kop img{display:block;max-width:none}
/* all:revert schrapt ook height="30" op de img; een svg zonder maat tekent dan niets */
#header .tn-kop .sitehead-logo img{height:30px;width:auto}
#header .tn-kop svg{display:block}
#header .tn-kop button{font-family:'Open Sans',Arial,sans-serif}
#header .tn-kop input{font-family:'Open Sans',Arial,sans-serif}
#header .tn-kop .wrap{max-width:1280px;
  margin:0 auto;
  padding:0 28px;}
#header .tn-kop .eyebrow{display:inline-block;
  font-family:'Open Sans',Arial,sans-serif;
  font-weight:700;
  font-size:12px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--orange);
  margin-bottom:14px;}
#header .tn-kop .btn{display:inline-flex;
  align-items:center;
  gap:8px;
  background:var(--orange);
  color:var(--white);
  font-family:'Open Sans',Arial,sans-serif;
  font-weight:700;
  font-size:15px;
  padding:14px 26px;
  border-radius:6px;
  text-decoration:none;
  border:none;
  cursor:pointer;
  transition:background .18s ease, transform .18s ease;}
#header .tn-kop .btn:hover{background:var(--orange-deep); transform:translateY(-1px);}
#header .tn-kop .btn:focus-visible{outline:3px solid var(--ink); outline-offset:3px;}
#header .tn-kop .btn-ghost{background:transparent;
  color:var(--ink);
  border:1.5px solid var(--line);}
#header .tn-kop .btn-ghost:hover{background:var(--white); border-color:var(--orange); color:var(--orange);}


#header .tn-kop /* ---------- HOOFDMENU (voorstel) ----------
   Vervangt de huidige balk met negen productcategorieen naast een megamenu dat
   diezelfde categorieen nog eens herhaalt. Hier is er per bestemming nog maar
   een route: alles wat product is,#header .tn-kop zit onder Oplossingen.
   Eigen klassenamen (.sitehead...) zodat de bestaande header{}
#header .tn-kop ongemoeid blijft
   en beide naast elkaar kunnen bestaan tijdens het overzetten. */

.sitehead{position:relative; z-index:40; background:var(--white);}
#header .tn-kop .sitehead-top{background:var(--navy); color:rgba(255,255,255,.72); font-size:12.5px;}
#header .tn-kop .sitehead-top .wrap{display:flex; align-items:center; justify-content:flex-end; gap:22px; min-height:38px;}
#header .tn-kop .sitehead-top a{color:rgba(255,255,255,.8); text-decoration:none; font-weight:600;}
#header .tn-kop .sitehead-top a:hover{color:var(--orange);}
#header .tn-kop .sitehead-top .tel{margin-right:auto; color:var(--white);}
#header .tn-kop .sitehead-main{position:sticky; top:0; z-index:41;
  background:var(--white);
  border-bottom:1px solid var(--line);}
#header .tn-kop .sitehead-main .wrap{display:flex; align-items:center; gap:30px; min-height:70px;}
#header .tn-kop .sitehead-logo{flex:none; display:flex; align-items:center;}
#header .tn-kop .sitehead-logo img{display:block;}
#header .tn-kop .hoofdnav{display:flex; align-items:center; gap:4px; margin-right:auto;}
#header .tn-kop .nav-knop,#header .tn-kop .hoofdnav > a{display:inline-flex; align-items:center; gap:7px;
  padding:10px 14px;
  border:0; background:none;
  font-family:'Open Sans',Arial,sans-serif;
  font-size:15px; font-weight:600; color:var(--ink);
  text-decoration:none; cursor:pointer; border-radius:6px;}
#header .tn-kop .nav-knop:hover,#header .tn-kop .hoofdnav > a:hover{background:var(--bg-alt);}
#header .tn-kop .nav-knop:focus-visible,#header .tn-kop .hoofdnav > a:focus-visible{outline:2px solid var(--orange); outline-offset:2px;}
#header .tn-kop .nav-knop::after{content:""; width:6px; height:6px;
  border-right:2px solid var(--ink-soft); border-bottom:2px solid var(--ink-soft);
  transform:translateY(-2px) rotate(45deg); transition:transform .18s ease;}
#header .tn-kop .nav-knop[aria-expanded="true"]{background:var(--bg-alt); color:var(--orange);}
#header .tn-kop .nav-knop[aria-expanded="true"]::after{transform:translateY(1px) rotate(-135deg); border-color:var(--orange);}
#header .tn-kop .sitehead-acties{flex:none; display:flex; align-items:center; gap:10px;}
#header .tn-kop .zoekknop{width:38px; height:38px; display:grid; place-items:center;
  border:1px solid var(--line); border-radius:50%;
  background:var(--white); cursor:pointer; color:var(--ink);}
#header .tn-kop .zoekknop svg{width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:2;}
#header .tn-kop .zoekknop:hover{border-color:var(--orange); color:var(--orange);}
#header .tn-kop .zoekknop:focus-visible{outline:2px solid var(--orange); outline-offset:2px;}
#header .tn-kop .mega{position:absolute; left:0; right:0; top:100%;
  background:var(--white);
  border-bottom:1px solid var(--line);
  box-shadow:0 22px 40px -26px rgba(22,22,22,.55);
  padding:34px 0 30px;}
#header .tn-kop .mega[hidden]{display:none;}
#header .tn-kop .mega-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:30px 38px;}
#header .tn-kop .mega-grid.smal{grid-template-columns:repeat(2,1fr); max-width:620px;}
#header .tn-kop .mega-kop{font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--orange); margin:0 0 12px; padding-bottom:9px;
  border-bottom:1px solid var(--line);}
#header .tn-kop .mega-kolom a{display:block; padding:6px 0;
  font-size:14.5px; color:var(--ink); text-decoration:none; line-height:1.4;}
#header .tn-kop .mega-kolom a:hover{color:var(--orange);}
#header .tn-kop .mega-kolom a:focus-visible{outline:2px solid var(--orange); outline-offset:2px;}
#header .tn-kop .mega-alles{display:inline-flex; align-items:center; gap:6px;
  margin-top:10px; font-size:13.5px; font-weight:700; color:var(--orange);
  text-decoration:none;}
#header .tn-kop .mega-tip{background:var(--bg-alt); border-radius:var(--radius); padding:20px 22px;}
#header .tn-kop .mega-tip h3{font-size:15px; margin:0 0 8px;}
#header .tn-kop .mega-tip p{font-size:13.5px; color:var(--ink-soft); line-height:1.55; margin:0 0 14px;}
#header .tn-kop .mega-scherm{position:fixed; inset:0; z-index:39;
  background:rgba(22,22,22,.35);}
#header .tn-kop .mega-scherm[hidden]{display:none;}
#header .tn-kop .menuknop{display:none;
  width:42px; height:38px;
  border:1px solid var(--line); border-radius:6px;
  background:var(--white); cursor:pointer;
  align-items:center; justify-content:center;}
#header .tn-kop .menuknop span{position:relative; width:18px; height:2px; background:var(--ink); display:block;}
#header .tn-kop .menuknop span::before,#header .tn-kop .menuknop span::after{content:""; position:absolute; left:0; width:18px; height:2px; background:var(--ink);}
#header .tn-kop .menuknop span::before{top:-6px;}
#header .tn-kop .menuknop span::after{top:6px;}
#header .tn-kop .menuknop:focus-visible{outline:2px solid var(--orange); outline-offset:2px;}
@media (max-width:1180px){#header .tn-kop .menuknop{display:flex;}
#header .tn-kop .hoofdnav{display:none;}
#header .tn-kop .sitehead-main .wrap{gap:14px; min-height:62px;}
#header .tn-kop .sitehead-acties .btn{display:none;}
#header .tn-kop .hoofdnav.is-lade{display:block;
    position:fixed; top:0; right:0; bottom:0;
    width:min(92vw, 380px);
    z-index:60;
    background:var(--white);
    padding:0;
    overflow-y:auto;
    transform:translateX(100%);
    transition:transform .26s ease;
    box-shadow:-10px 0 34px rgba(22,22,22,.2);}
#header .tn-kop .hoofdnav.is-lade.is-open{transform:translateX(0);}
#header .tn-kop .lade-kop{display:flex; align-items:center; justify-content:space-between;
    padding:16px 20px; border-bottom:1px solid var(--line);}
#header .tn-kop .lade-kop span{font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-soft);}
#header .tn-kop .lade-sluit{width:34px; height:34px; border:0; border-radius:50%;
    background:var(--bg-alt); font-size:21px; line-height:1; cursor:pointer;}
#header .tn-kop .lade-sluit:focus-visible{outline:2px solid var(--orange); outline-offset:2px;}
#header .tn-kop .hoofdnav.is-lade .nav-groep{border-bottom:1px solid var(--line);}
#header .tn-kop .hoofdnav.is-lade .nav-knop{width:100%; justify-content:space-between;
    padding:15px 20px; border-radius:0; font-size:15.5px;}
#header .tn-kop .hoofdnav.is-lade > a{display:block; padding:15px 20px; border-bottom:1px solid var(--line);
    border-radius:0; font-size:15.5px;}
#header .tn-kop .hoofdnav.is-lade .mega{position:static; box-shadow:none; border-bottom:0;
    padding:2px 20px 18px; background:var(--bg-alt);}
#header .tn-kop .hoofdnav.is-lade .mega-grid,#header .tn-kop .hoofdnav.is-lade .mega-grid.smal{grid-template-columns:1fr; gap:22px; max-width:none;}
#header .tn-kop .hoofdnav.is-lade .mega-tip{display:none;}
#header .tn-kop .lade-voet{padding:18px 20px 26px;}
#header .tn-kop .lade-voet .btn{display:block; text-align:center;}
#header .tn-kop .lade-voet .btn + .btn{margin-top:10px;}

}
@media (min-width:1181px){#header .tn-kop .lade-kop,#header .tn-kop .lade-voet{display:none;}

}
@media (max-width:620px){#header .tn-kop .sitehead-top .wrap{gap:14px; font-size:12px;}
#header .tn-kop .sitehead-top .los{display:none;}

}
@media (prefers-reduced-motion: reduce){#header .tn-kop .hoofdnav.is-lade{transition:none;}
#header .tn-kop .nav-knop::after{transition:none;}

}
#header .tn-kop .mega.mega-themas{padding:0;}
#header .tn-kop .mega-drie{display:grid; grid-template-columns:206px minmax(0,1fr) 288px;}
#header .tn-kop .mega-drie .thema-rail{grid-row:1 / span 2;}
#header .tn-kop .mega-midden{min-width:0; padding:26px 30px 10px 30px;}
#header .tn-kop .mega-hulp{margin:26px 0 10px; min-width:0;}
#header .tn-kop .mega-drie .thema-voet{grid-column:2 / span 2; margin:0 0 0 30px;}
#header .tn-kop .hulp-kaart{background:var(--ink); color:var(--white); border-radius:12px; padding:24px 24px 22px;}
#header .tn-kop .hulp-kaart .eyebrow{color:var(--orange); display:block; margin-bottom:10px;}
#header .tn-kop .hulp-kaart h3{font-size:19px; line-height:1.25; color:var(--white); margin:0 0 10px;}
#header .tn-kop .hulp-kaart p{font-size:14px; line-height:1.6; color:rgba(255,255,255,.78); margin:0 0 18px;}
#header .tn-kop .hulp-knoppen{display:flex; flex-wrap:wrap; gap:10px;}
#header .tn-kop .hulp-knoppen .btn{font-size:14px; padding:11px 18px;}
#header .tn-kop .btn-lijn{display:inline-block; border:1.5px solid rgba(255,255,255,.55); border-radius:999px;
  padding:11px 18px; font-size:14px; font-weight:700; color:var(--white); text-decoration:none;}
#header .tn-kop .btn-lijn:hover{border-color:var(--orange); color:var(--orange);}
#header .tn-kop .btn-lijn:focus-visible{outline:2px solid var(--orange); outline-offset:2px;}
#header .tn-kop .thema-rail{background:var(--bg-alt); padding:24px 16px 24px;}
#header .tn-kop .rail-kop{display:block; margin:0 0 12px; padding-left:11px;
  font-size:10.5px; font-weight:700; letter-spacing:.09em; text-transform:uppercase;
  color:var(--ink-soft);}
#header .tn-kop .thema-knop{display:flex; align-items:center; justify-content:space-between; gap:10px;
  width:100%; padding:10px 11px; border:0; background:none;
  border-left:3px solid transparent;
  font-family:'Open Sans',Arial,sans-serif; font-size:15px; font-weight:600;
  color:var(--ink); text-align:left; cursor:pointer;}
#header .tn-kop .thema-knop::after{content:"\203A"; color:var(--ink-soft); font-size:18px; line-height:1;}
#header .tn-kop .thema-knop:hover{color:var(--orange);}
#header .tn-kop .thema-knop[aria-expanded="true"]{background:var(--white); border-left-color:var(--orange); font-weight:700;}
#header .tn-kop .thema-knop[aria-expanded="true"]::after{color:var(--orange);}
#header .tn-kop .thema-knop:focus-visible{outline:2px solid var(--orange); outline-offset:-2px;}
#header .tn-kop .rail-alles{display:inline-block; margin:18px 0 0 11px;
  font-size:13.5px; font-weight:700; color:var(--orange); text-decoration:none;}
#header .tn-kop .thema-paneel{padding:0 0 18px;}
#header .tn-kop .thema-kop{display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; margin-bottom:20px;}
#header .tn-kop .thema-kop h2{font-size:21px; margin:0;}
#header .tn-kop .thema-kop p{font-size:13.5px; color:var(--ink-soft); margin:0;}
#header .tn-kop .thema-kop a{color:var(--orange); font-weight:700; text-decoration:none;}
#header .tn-kop .thema-kop a:hover{text-decoration:underline;}
#header .tn-kop .thema-kolommen{display:grid; grid-template-columns:repeat(3,1fr); gap:24px 34px; align-items:start;}
#header .tn-kop .thema-kolommen.vier{grid-template-columns:repeat(4,1fr);}
#header .tn-kop .mega-kolom.breed{grid-column:span 2;}
#header .tn-kop .sub-twee{display:grid; grid-template-columns:1fr 1fr; gap:0 28px; align-items:start;}
#header .tn-kop .cat-kop{font-size:15px; font-weight:700; color:var(--ink); margin:0 0 9px;
  padding-bottom:8px; border-bottom:2px solid var(--orange);}
#header .tn-kop .sub-kop{display:block; margin:15px 0 6px;
  font-size:10.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--orange);}
#header .tn-kop .mega-kolom > .sub-kop:first-of-type{margin-top:10px;}
#header .tn-kop .diep{margin:1px 0 7px 2px; padding-left:12px; border-left:1px solid var(--line);}
#header .tn-kop .diep a{font-size:13px; color:var(--ink-soft); padding:3px 0;}
#header .tn-kop .diep a:hover{color:var(--orange);}
#header .tn-kop .thema-voet{display:flex; flex-wrap:wrap; gap:6px 28px;
  padding:15px 0 22px; border-top:1px solid var(--line);}
#header .tn-kop .thema-voet a{font-size:13.5px; font-weight:600; color:var(--ink); text-decoration:none;}
#header .tn-kop .thema-voet a:hover{color:var(--orange);}
#header .tn-kop .zoekveld{display:flex; align-items:center; gap:8px; flex:none;
  border:1px solid var(--line); border-radius:999px; padding:0 16px; height:40px; min-width:230px;}
#header .tn-kop .zoekveld:focus-within{border-color:var(--orange);}
#header .tn-kop .zoekveld svg{width:16px; height:16px; flex:none; fill:none; stroke:var(--ink-soft); stroke-width:2;}
#header .tn-kop .zoekveld input{border:0; outline:0; background:none; width:100%;
  font-family:'Open Sans',Arial,sans-serif; font-size:14px; color:var(--ink);}
#header .tn-kop .zoekveld input::placeholder{color:var(--ink-soft);}
@media (max-width:1180px){#header .tn-kop .mega-drie{grid-template-columns:1fr;}
#header .tn-kop .mega-midden{padding:0;}
#header .tn-kop .mega-drie .thema-voet{grid-column:auto; margin:0;}
#header .tn-kop .mega-hulp{margin:18px 0 6px;}
#header .tn-kop .thema-rail{display:none;}
#header .tn-kop .thema-paneel{padding:18px 0 10px;}
#header .tn-kop .hoofdnav.is-lade .thema-paneel[hidden]{display:block;}
#header .tn-kop .thema-kolommen,#header .tn-kop .thema-kolommen.vier{grid-template-columns:1fr; gap:20px;}
#header .tn-kop .mega-kolom.breed{grid-column:auto;}
#header .tn-kop .sub-twee{grid-template-columns:1fr; gap:0;}
#header .tn-kop .thema-kop{margin-bottom:14px;}
#header .tn-kop .thema-kop h2{font-size:18px;}
#header .tn-kop .zoekveld{display:none;}

}


#header .tn-kop .mega-grid.smal.drie{grid-template-columns:repeat(3,1fr); max-width:930px;}
@media (max-width:1180px){#header .tn-kop .hoofdnav.is-lade .mega-grid.smal.drie{grid-template-columns:1fr; max-width:none;}
}
#header .tn-kop .nav-knop,#header .tn-kop .hoofdnav > a{white-space:nowrap; padding:10px 11px;}
#header .tn-kop .hoofdnav{gap:2px;}
#header .tn-kop .sitehead-main .wrap{gap:22px;}
#header .tn-kop .zoekveld{min-width:0; width:232px;}
@media (max-width:1320px){#header .tn-kop .nav-knop,#header .tn-kop .hoofdnav > a{padding:10px 7px; font-size:14.5px;}
#header .tn-kop .zoekveld{width:202px; padding:0 13px;}
#header .tn-kop .zoekveld input{font-size:13px;}
#header .tn-kop .sitehead-main .wrap{gap:16px;}

}
#header .tn-kop .mega-grid .mega-rij{grid-column:1/-1;}
#header .tn-kop .menuknop{border-color:var(--navy);}
#header .tn-kop .menuknop span,#header .tn-kop .menuknop span::before,#header .tn-kop .menuknop span::after{background:var(--navy);}
@media (max-width:1180px){#header .tn-kop .sitehead-acties{margin-left:auto;}

}
#header .tn-kop .hulp-kaart{background:var(--navy);}
#header .tn-kop .cat-kop{font-size:14px; border-bottom:1px solid var(--line); padding-bottom:7px; margin-bottom:8px;}
#header .tn-kop .cat-kop.vervolg{margin-top:16px;}
#header .tn-kop .diep{border-left:0; padding-left:12px; margin:0 0 6px;}
#header .tn-kop .diep a{font-size:13px; padding:2px 0;}
#header .tn-kop .mega-kolom a{padding:5px 0;}
#header .tn-kop .thema-kop{margin-bottom:18px;}
#header .tn-kop .thema-kop p a + a,#header .tn-kop .thema-kop p a{white-space:nowrap;}
@media (min-width:1181px){#header .tn-kop .mega-midden{display:grid; align-items:start;}
#header .tn-kop .mega-midden .thema-paneel{grid-area:1 / 1;}
#header .tn-kop .mega-midden .thema-paneel[hidden]{display:block; visibility:hidden;}

}
@media (max-width:1180px){#header .tn-kop .hoofdnav.is-lade .mega-midden{display:none;}
#header .tn-kop .hoofdnav.is-lade .thema-rail{display:block; background:none; padding:0 0 4px;}
#header .tn-kop .hoofdnav.is-lade .rail-kop{display:none;}
#header .tn-kop .hoofdnav.is-lade .thema-knop{padding:13px 2px; border-left:0; border-bottom:1px solid var(--line); font-size:15px; background:none;}
#header .tn-kop .hoofdnav.is-lade .thema-knop::after{content:"+"; font-size:19px; font-weight:400;}
#header .tn-kop .hoofdnav.is-lade .thema-knop[aria-expanded="true"]{color:var(--orange); background:none;}
#header .tn-kop .hoofdnav.is-lade .thema-knop[aria-expanded="true"]::after{content:"\2212";}
#header .tn-kop .hoofdnav.is-lade .thema-paneel{padding:12px 0 14px; border-bottom:1px solid var(--line);}
#header .tn-kop .hoofdnav.is-lade .thema-paneel[hidden]{display:none;}
#header .tn-kop .hoofdnav.is-lade .thema-kop h2{display:none;}
#header .tn-kop .hoofdnav.is-lade .thema-kop{margin-bottom:12px;}
#header .tn-kop .hoofdnav.is-lade .thema-kolommen{gap:16px;}
#header .tn-kop .hoofdnav.is-lade .mega-kolom a{padding:4px 0;}
#header .tn-kop .hoofdnav.is-lade .diep{display:flex; flex-wrap:wrap; gap:0 14px; padding-left:12px; margin:0 0 4px;}
#header .tn-kop .hoofdnav.is-lade .diep a{display:inline-block; padding:2px 0;}
#header .tn-kop .hoofdnav.is-lade .rail-alles{margin:14px 0 4px 2px;}

}
@media (max-width:1180px){#header .tn-kop .hoofdnav.is-lade .hulp-kaart{padding:16px 18px; border-radius:10px;}
#header .tn-kop .hoofdnav.is-lade .hulp-kaart .eyebrow,#header .tn-kop .hoofdnav.is-lade .hulp-kaart p{display:none;}
#header .tn-kop .hoofdnav.is-lade .hulp-kaart h3{font-size:15px; margin:0 0 12px;}
#header .tn-kop .hoofdnav.is-lade .hulp-knoppen .btn,#header .tn-kop .hoofdnav.is-lade .hulp-knoppen .btn-lijn{padding:9px 14px; font-size:13.5px;}

}
#header .tn-kop .cat-kop{color:var(--orange);}
@media (min-width:1181px){#header .tn-kop .mega.mega-themas{max-height:calc(100vh - 110px); overflow-y:auto; overscroll-behavior:contain;}
 }
#header .tn-kop .sitehead-acties .btn{padding:9px 20px; font-size:14px;}