/* ICT Empowered — test.ictempowered.nl — neon-huisstijl */
:root{
  --inkt:#0A1830; --inkt2:#04070E; --glow:#15315C; --lijn-d:#274769;
  --azuur:#1E76AE; --azuur-d:#155E9C; --emp:#4AA9DC; --hemel:#8FD4FF;
  --trace:#37A7FF; --bolt:#BFE0FF;
  --ijs:#EFF5FA; --wit:#fff; --lijn:#DCE6EF;
  --tekst:#1E2A38; --stil:#5B6B7A; --sein:#1FA971;
  --dis:"PT Sans",-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",Consolas,monospace;
  --schaduw:0 10px 30px rgba(4,7,14,.12);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{font:400 1rem/1.65 var(--dis);color:var(--tekst);background:var(--wit)}
img{max-width:100%;display:block}
a{color:var(--azuur)}
h1,h2,h3{font-family:var(--dis);font-weight:700;line-height:1.14;
  letter-spacing:-.01em;color:var(--inkt);text-wrap:balance}
h1{font-size:clamp(2.1rem,4.6vw,3.25rem)}
h2{font-size:clamp(1.55rem,3vw,2.1rem);margin-bottom:.6em}
h3{font-size:1.08rem}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-999px;top:0;background:var(--inkt);color:#fff;padding:10px 16px;z-index:99}
.skip:focus{left:0}
:focus-visible{outline:3px solid var(--azuur);outline-offset:2px;border-radius:2px}

/* eyebrow / mono */
.eyebrow{font-family:var(--mono);font-size:.72rem;font-weight:500;text-transform:uppercase;
  letter-spacing:.16em;color:var(--azuur);margin-bottom:14px}
.sec-donker .eyebrow,.hero .eyebrow{color:var(--hemel)}

/* topstrip + kop */
.topstrip{background:var(--inkt);color:#B9CCDD;border-bottom:1px solid var(--lijn-d)}
.topstrip .wrap{display:flex;gap:26px;align-items:center;min-height:36px;flex-wrap:wrap}
.ts-mono{font-family:var(--mono);font-size:.7rem;letter-spacing:.05em;color:#B9CCDD;text-decoration:none}
a.ts-mono:hover{color:#fff}
.ts-login{margin-left:auto;color:var(--hemel)}
.ts-hemel{color:var(--hemel)}
.kop{background:var(--wit);border-bottom:1px solid var(--lijn);position:sticky;top:0;z-index:60}
.kop-rij{display:flex;align-items:center;gap:28px;min-height:72px}
.logo-link{margin-right:auto;display:flex;text-decoration:none}

/* beeldmerk + woordmerk */
.logo{display:inline-flex;align-items:center;gap:11px}
.mark{width:34px;height:34px;flex:none;filter:drop-shadow(0 2px 5px rgba(4,7,14,.35))}
.mark-logo{width:40px;height:40px}
.mark-mini{width:20px;height:20px}
.wm{font-family:var(--dis);font-weight:400;font-size:1.32rem;letter-spacing:-.01em;
  color:var(--emp);line-height:1;white-space:nowrap}
.wm b{font-weight:700;color:var(--azuur)}
.wm-licht{color:var(--emp)}
.wm-licht b{color:var(--bolt)}
.hoofdnav{display:flex;align-items:center;gap:6px}
.hoofdnav a{font-weight:500;font-size:.95rem;color:var(--inkt);text-decoration:none;
  padding:9px 13px;border-radius:8px}
.hoofdnav a:hover{background:var(--ijs)}
.hoofdnav a[aria-current="page"]{color:var(--azuur)}
.nav-t,.nav-knop{display:none}

/* knoppen */
.knop{display:inline-block;background:var(--azuur);color:#fff;text-decoration:none;font-weight:600;
  font-size:.97rem;padding:13px 24px;border-radius:9px;transition:background .15s}
.knop:hover{background:var(--azuur-d)}
.knop-klein{padding:9px 16px;font-size:.9rem}
.hoofdnav .knop-klein{color:#fff}
.knop-omlijnd{background:transparent;border:1.5px solid var(--hemel);color:var(--hemel)}
.knop-omlijnd:hover{background:rgba(143,201,240,.12)}
.knop-donkerrand{border-color:var(--azuur);color:var(--azuur)}
.knop-donkerrand:hover{background:rgba(30,123,200,.08)}

/* hero */
.hero{background:radial-gradient(120% 130% at 72% 8%,var(--glow) 0%,var(--inkt) 42%,var(--inkt2) 100%);
  position:relative;overflow:hidden;color:#fff}
/* circuit-motief (echoot het beeldmerk) */
.motief{position:absolute;height:auto;pointer-events:none}
.motief .mt-lijn{fill:none;stroke:var(--trace);stroke-width:2.4;stroke-linecap:round;
  stroke-linejoin:round;filter:drop-shadow(0 0 3px rgba(55,167,255,.55))}
.motief .mt-node{fill:#0a1626;stroke:var(--hemel);stroke-width:2}
.motief-hero{right:-60px;top:-40px;width:min(58vw,640px);opacity:.5}
.motief-donker{left:-70px;bottom:-90px;width:440px;opacity:.4}
.hero-rij{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center;
  padding-top:84px;padding-bottom:92px;position:relative}
.hero h1{color:#fff;margin-bottom:20px}
.hero-sub{color:#C4D6E6;font-size:1.06rem;max-width:34rem;margin-bottom:30px}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap}

/* statuspaneel */
.paneel{background:var(--wit);border-radius:14px;box-shadow:0 24px 60px rgba(4,14,26,.45);
  overflow:hidden;max-width:430px;width:100%}
.split-beeld .paneel{box-shadow:var(--schaduw);border:1px solid var(--lijn)}
.paneel-kop{display:flex;align-items:center;gap:9px;background:var(--inkt);color:#fff;
  font-family:var(--mono);font-size:.78rem;letter-spacing:.04em;padding:11px 16px}
.pk-live{margin-left:auto;display:flex;align-items:center;gap:6px;color:var(--hemel);font-size:.68rem;
  text-transform:uppercase;letter-spacing:.12em}
.pk-live i{width:7px;height:7px;border-radius:50%;background:var(--sein);animation:puls 2.2s infinite}
@keyframes puls{0%,100%{box-shadow:0 0 0 0 rgba(31,169,113,.5)}55%{box-shadow:0 0 0 6px rgba(31,169,113,0)}}
@media (prefers-reduced-motion:reduce){.pk-live i{animation:none}}
.paneel-rijen{list-style:none;padding:6px 0}
.paneel-rijen li{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:11px 16px;border-bottom:1px solid var(--ijs)}
.paneel-rijen li:last-child{border-bottom:0}
.pr-label{font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;
  color:var(--stil)}
.pr-waarde{display:flex;align-items:center;gap:9px;font-size:.85rem;font-weight:600;color:var(--inkt);
  white-space:nowrap}
.pr-waarde.ok{color:var(--sein)}
.pr-waarde svg{width:14px;height:14px}
.pr-waarde b{font-weight:700}
.balk{width:74px;height:6px;border-radius:4px;background:var(--ijs);overflow:hidden;display:inline-block}
.balk i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--azuur),var(--hemel))}
.paneel-voet{font-size:.78rem;color:var(--stil);background:var(--ijs);padding:10px 16px}
.topo{padding:16px 12px 6px;background:var(--wit)}
.topo svg{width:100%;height:auto;display:block}

/* secties */
.sec{padding:88px 0}
.sec-alt{background:var(--ijs)}
.sec-intro{color:var(--stil);max-width:38rem;margin-bottom:34px}
.midden{text-align:center}
.midden .sec-intro{margin-left:auto;margin-right:auto}
.midden-cta{justify-content:center}
.sec-donker{background:radial-gradient(120% 130% at 20% 100%,var(--glow) 0%,var(--inkt) 45%,var(--inkt2) 100%);
  color:#fff;position:relative;overflow:hidden}
.sec-donker h2{color:#fff}
.sec-donker .sec-intro{color:#C4D6E6}
.sec-donker .wrap{position:relative}

/* punten-band */
.sec-punten{padding:52px 0;border-bottom:1px solid var(--lijn)}
.punten{display:grid;grid-template-columns:repeat(4,1fr);gap:36px}
.punt .eyebrow{margin-bottom:8px}
.punt p:last-child{font-size:.92rem;color:var(--stil)}

/* dienstkaarten */
.d-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:38px}
.d-kaart{display:flex;flex-direction:column;gap:10px;background:var(--wit);border:1px solid var(--lijn);
  border-radius:13px;padding:26px;text-decoration:none;color:var(--tekst);
  transition:transform .18s,box-shadow .18s,border-color .18s}
.d-kaart:hover{transform:translateY(-3px);box-shadow:var(--schaduw);border-color:var(--hemel)}
.d-kaart p{font-size:.93rem;color:var(--stil)}
.d-meer{margin-top:auto;display:flex;align-items:center;gap:7px;font-family:var(--mono);
  font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--azuur);padding-top:8px}
.d-meer svg{width:14px;height:14px;transition:transform .18s}
.d-kaart:hover .d-meer svg{transform:translateX(3px)}

/* split */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
.split-tekst p{margin-bottom:16px}
.split-beeld{display:flex;justify-content:center}
.beeld{border-radius:14px;box-shadow:var(--schaduw)}
.vinkjes{list-style:none;margin:4px 0 20px}
.vinkjes li{position:relative;padding:5px 0 5px 30px}
.vinkjes li::before{content:"";position:absolute;left:2px;top:.72em;width:14px;height:14px;
  background:var(--azuur);border-radius:50%;
  -webkit-mask:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M3 8.5 6.5 12 13 4.5" fill="none" stroke="black" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/contain no-repeat;
  mask:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M3 8.5 6.5 12 13 4.5" fill="none" stroke="black" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/contain no-repeat}

/* team */
.t-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin:38px 0}
.t-grid--bio{grid-template-columns:repeat(2,1fr);gap:26px}
.t-kaart{background:var(--wit);border:1px solid var(--lijn);border-radius:13px;padding:26px;
  text-align:center}
.t-grid--bio .t-kaart{text-align:left;display:grid;grid-template-columns:96px 1fr;gap:6px 22px;
  align-items:start}
.t-grid--bio .tf{grid-row:span 4}
.tf{width:96px;height:96px;border-radius:50%;object-fit:cover;margin:0 auto 14px;
  border:3px solid var(--ijs);box-shadow:0 0 0 1px var(--lijn)}
.tf-ini{display:flex;align-items:center;justify-content:center;background:
  linear-gradient(150deg,var(--inkt2),var(--inkt));color:var(--hemel);font-weight:800;
  font-size:1.6rem;font-stretch:112%}
.t-grid--bio .tf{margin:0}
.t-kaart h3{font-size:1.02rem}
.t-rol{font-family:var(--mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.09em;
  color:var(--stil);margin-top:4px}
.t-bio{font-size:.92rem;color:var(--stil);margin-top:8px}
.t-mail{font-size:.85rem;word-break:break-all}

/* paginakop */
.p-kop{background:linear-gradient(160deg,var(--inkt),var(--inkt2));color:#fff;padding:64px 0 58px}
.p-kop h1{color:#fff}
.p-kop-sub{color:#C4D6E6;margin-top:14px;max-width:36rem}
.p-kop .eyebrow{color:var(--hemel)}

/* diensten-pagina */
.dienst-wrap{max-width:820px}
.dienst p{margin-bottom:16px}
.drie{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:22px 0}
.drie-vak{background:var(--wit);border:1px solid var(--lijn);border-radius:11px;padding:20px}
.sec-alt .drie-vak{background:var(--wit)}
.drie-vak h3{margin-bottom:6px;color:var(--azuur)}
.drie-vak p{font-size:.9rem;color:var(--stil);margin:0}

/* contact */
.c-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.c-kaart{background:var(--wit);border:1px solid var(--lijn);border-radius:13px;padding:30px}
.c-groot{font-size:1.25rem;font-weight:700;margin:6px 0 10px}
.c-groot a{text-decoration:none;color:var(--inkt)}
.c-groot a:hover{color:var(--azuur)}
.c-kaart p{color:var(--stil);font-size:.95rem}

/* AI & automatisering — vibecoding-flow */
.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:38px}
.flow-stap{position:relative;background:var(--wit);border:1px solid var(--lijn);border-radius:13px;
  padding:24px 22px}
.flow-stap .nr{font-family:var(--mono);font-size:.8rem;letter-spacing:.12em;color:var(--azuur)}
.flow-stap h3{margin:10px 0 6px}
.flow-stap p{font-size:.92rem;color:var(--stil)}
.flow-stap::after{content:"";position:absolute;right:-11px;top:50%;width:14px;height:2px;
  background:var(--hemel);opacity:.7}
.flow-stap:last-child::after{display:none}
/* info-kaarten (automatisering in de praktijk) */
.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:34px}
.info-kaart{background:var(--wit);border:1px solid var(--lijn);border-radius:13px;padding:26px}
.sec-alt .info-kaart{background:var(--wit)}
.info-kaart h3{margin-bottom:8px}
.info-kaart p{font-size:.93rem;color:var(--stil)}
/* merklogo's (reseller) */
.merk-logo{display:flex;align-items:center;min-height:40px;margin-bottom:14px;color:var(--stil)}
.mlogo{height:36px;width:auto;max-width:150px}
.merk-logo .mlogo{display:block}
.mlogo-txt{font-family:var(--dis);font-weight:700;font-size:1.02rem;letter-spacing:.06em;
  color:#E9127D}
.merk-link{display:inline-flex;align-items:center;gap:7px;margin-top:12px;font-family:var(--mono);
  font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--azuur);text-decoration:none}
.merk-link:hover{text-decoration:underline}
.merk-link svg{width:14px;height:14px}
/* citaat */
.sec-citaat{padding:64px 0}
.citaat{max-width:720px;margin:0 auto;text-align:center}
.citaat img{width:72px;height:72px;border-radius:50%;object-fit:cover;margin:0 auto 20px;
  border:3px solid var(--ijs);box-shadow:0 0 0 1px var(--lijn)}
.citaat blockquote{font-size:1.28rem;line-height:1.5;color:var(--inkt);font-weight:400;
  text-wrap:balance}
.citaat blockquote::before{content:"\201C\00A0"}
.citaat blockquote::after{content:"\00A0\201D"}
.citaat figcaption{margin-top:16px;font-size:.9rem;color:var(--stil)}
/* feitlijst (zonder kaders) */
.feitlijst{display:grid;grid-template-columns:1fr 1fr;gap:0 56px;margin-top:12px}
.feitlijst-smal{grid-template-columns:1fr}
.split-boven{align-items:start}
.split-boven .split-beeld{position:sticky;top:96px}
.feit{padding:20px 0;border-bottom:1px solid var(--lijn)}
.feit h3{margin-bottom:4px}
.feit p{font-size:.94rem;color:var(--stil)}
/* portret-collage */
.collage{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:420px}
.collage img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:14px;box-shadow:var(--schaduw)}
.collage img:nth-child(2){transform:translateY(18px)}
.collage img:nth-child(3){transform:translateY(-6px)}
/* promo-carrousel */
.promo{background:radial-gradient(120% 140% at 50% 0%,var(--glow) 0%,var(--inkt) 55%,var(--inkt2) 100%);
  color:#fff;padding:56px 0 30px;overflow:hidden}
.promo-wrap{display:flex;align-items:center;gap:18px}
.promo-venster{overflow:hidden;flex:1}
.promo-track{display:flex;transition:transform .55s ease}
@media (prefers-reduced-motion:reduce){.promo-track{transition:none}}
.promo-slide{min-width:100%;text-align:center;padding:6px 12px}
.promo-slide .eyebrow{color:var(--hemel);margin-bottom:10px}
.promo-slide h2{color:#fff;margin-bottom:10px}
.promo-sub{color:#C4D6E6;max-width:36rem;margin:0 auto 22px}
.promo-pijl{flex:none;width:42px;height:42px;border-radius:50%;border:1.5px solid var(--lijn-d);
  background:transparent;color:var(--hemel);cursor:pointer;display:flex;align-items:center;
  justify-content:center;transition:background .15s,border-color .15s}
.promo-pijl:hover{background:rgba(143,212,255,.1);border-color:var(--hemel)}
.promo-pijl svg{width:17px;height:17px}
.promo-dots{display:flex;justify-content:center;gap:9px;margin-top:26px}
.promo-dot{width:8px;height:8px;border-radius:50%;border:0;padding:0;cursor:pointer;
  background:var(--lijn-d);transition:background .2s,transform .2s}
.promo-dot.actief{background:var(--hemel);transform:scale(1.25)}

/* MSP-modellen */
.modellen{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.model{border-radius:18px;padding:42px 40px;display:flex;flex-direction:column;gap:4px}
.model h3{font-size:1.45rem;margin-bottom:8px}
.model > p{margin-bottom:14px}
.model .vinkjes{margin-bottom:24px}
.model .knop{align-self:flex-start;margin-top:auto}
.model-donker{background:radial-gradient(120% 130% at 30% 0%,var(--glow) 0%,var(--inkt) 50%,var(--inkt2) 100%);
  color:#C4D6E6}
.model-donker h3{color:#fff}
.model-donker .eyebrow{color:var(--hemel)}
.model-donker .vinkjes li::before{background:var(--hemel)}
.model-licht{background:var(--wit);border:1px solid var(--lijn);box-shadow:var(--schaduw)}
.flow-drie{grid-template-columns:repeat(3,1fr)}
/* uitgelicht blok */
.uitgelicht{position:relative;overflow:hidden;border:1px solid var(--lijn);border-radius:18px;
  padding:48px;background:linear-gradient(155deg,#F4F9FD 0%,#E9F2FA 100%);box-shadow:var(--schaduw)}
.uitgelicht::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;
  background:linear-gradient(var(--azuur),var(--trace))}
.uitgelicht .split{align-items:center;gap:48px}
.uitgelicht .vinkjes{margin-bottom:0}
.uitgelicht h2{margin-bottom:.5em}

/* tekstpagina's (juridisch) */
.tekstpagina{max-width:760px}
.pdfkader{width:100%;height:78vh;min-height:480px;border:1px solid var(--lijn);
  border-radius:10px;margin-top:22px}
.tekstpagina h2{margin-top:40px;font-size:1.35rem}
.tekstpagina h3{margin-top:26px}
.tekstpagina p,.tekstpagina ul{margin-bottom:14px}
.tekstpagina ul{padding-left:22px}

/* voet */
.voet{background:var(--inkt2);color:#B9CCDD}
.voet-rij{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:36px;padding:56px 24px}
.voet .logo{margin-bottom:14px}
.voet .wm{font-size:1.24rem}
.voet-tag{font-size:.9rem;max-width:22rem}
.voet-kol{display:flex;flex-direction:column;gap:9px;font-size:.92rem}
.voet-kol h4{color:#fff;font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;
  font-family:var(--mono);font-weight:500;margin-bottom:4px}
.voet-kol a{color:#B9CCDD;text-decoration:none}
.voet-kol a:hover{color:#fff}
.voet-onder{border-top:1px solid var(--lijn-d);padding-top:20px;padding-bottom:26px;
  font-family:var(--mono);font-size:.72rem;letter-spacing:.06em}

/* onthulling */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .5s ease}
.reveal.zichtbaar{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}
.intro-1,.intro-2,.intro-3,.intro-4,.intro-5{animation:intro .6s ease both}
.intro-2{animation-delay:.08s}.intro-3{animation-delay:.16s}
.intro-4{animation-delay:.24s}.intro-5{animation-delay:.3s}
@keyframes intro{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.intro-1,.intro-2,.intro-3,.intro-4,.intro-5{animation:none}}

/* responsief */
@media (max-width:980px){
  .hero-rij{grid-template-columns:1fr;gap:44px;padding-top:60px;padding-bottom:64px}
  .hero-paneel{display:flex;justify-content:flex-start}
  .motief-hero{right:-160px;top:-100px;opacity:.35}
  .punten{grid-template-columns:repeat(2,1fr)}
  .d-grid{grid-template-columns:repeat(2,1fr)}
  .split{grid-template-columns:1fr;gap:40px}
  .t-grid{grid-template-columns:repeat(2,1fr)}
  .t-grid--bio{grid-template-columns:1fr}
  .c-grid{grid-template-columns:1fr}
  .voet-rij{grid-template-columns:1fr 1fr}
  .drie{grid-template-columns:1fr}
  .flow{grid-template-columns:repeat(2,1fr)}
  .flow-stap::after{display:none}
  .info-grid{grid-template-columns:repeat(2,1fr)}
  .uitgelicht{padding:32px}
  .uitgelicht .split{gap:36px}
  .feitlijst{grid-template-columns:1fr;gap:0}
  .collage{max-width:360px;margin:0 auto}
  .modellen{grid-template-columns:1fr}
  .flow-drie{grid-template-columns:1fr}
}
@media (max-width:720px){
  .topstrip .ts-adres{display:none}
  .sec{padding:60px 0}
  .punten{grid-template-columns:1fr;gap:22px}
  .d-grid{grid-template-columns:1fr}
  .flow{grid-template-columns:1fr}
  .info-grid{grid-template-columns:1fr}
  .t-grid{grid-template-columns:1fr 1fr}
  .voet-rij{grid-template-columns:1fr}
  .nav-knop{display:flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;
    padding:10px;cursor:pointer;border:1px solid var(--lijn);border-radius:9px}
  .nav-knop span{display:block;height:2px;background:var(--inkt);border-radius:2px;transition:transform .2s,opacity .2s}
  .hoofdnav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--wit);
    border-bottom:1px solid var(--lijn);flex-direction:column;align-items:stretch;padding:14px 24px 20px;gap:4px;
    box-shadow:var(--schaduw)}
  .hoofdnav a{padding:12px 10px}
  .hoofdnav .knop-klein{text-align:center;margin-top:8px}
  .nav-t:checked ~ .hoofdnav{display:flex}
  .nav-t:checked ~ .nav-knop span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-t:checked ~ .nav-knop span:nth-child(2){opacity:0}
  .nav-t:checked ~ .nav-knop span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}