:root{
  --bg:#020821;
  --bg2:#041039;
  --panel:#07133e;
  --panel2:#0b1747;
  --line:#2441a5;
  --text:#f7f7ff;
  --muted:#b9c0df;
  --pink:#ff2d8d;
  --orange:#ff9d00;
  --purple:#752bff;
  --cyan:#00c7ff;
  --teal:#00d6c3;
  --yellow:#ffc21c;
  --green:#71df4a;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,Segoe UI,Arial,sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 78% 9%,rgba(87,21,190,.22),transparent 24%),
    radial-gradient(circle at 15% 25%,rgba(0,117,255,.12),transparent 25%),
    linear-gradient(180deg,#02071d,#030925 50%,#02071d);
  line-height:1.45;
}
a{color:inherit}
img{max-width:100%;display:block}
button,input{font:inherit}
.shell{width:min(1460px,calc(100% - 40px));margin:auto}

.topbar{background:#02061a;border-bottom:1px solid rgba(255,255,255,.06);font-size:12px}
.topbar-inner{height:34px;display:flex;align-items:center;justify-content:space-between}
.topbar b{display:inline-grid;place-items:center;width:30px;height:24px;border-radius:50%;background:var(--pink);margin-right:8px}

.header{position:sticky;top:0;z-index:20;background:rgba(2,8,33,.95);backdrop-filter:blur(15px);border-bottom:1px solid rgba(255,255,255,.07)}
.nav{height:78px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.logo{display:flex;align-items:center;gap:11px;text-decoration:none;min-width:260px}
.logo-orbit{
  width:48px;height:48px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 35% 30%,#fff,#ff8b41 20%,#9b27ed 58%,#1a0b66 72%);
  color:#fff;font-weight:950;font-size:22px;
  border:3px solid rgba(255,166,0,.75);
  box-shadow:0 0 18px #ff2d8d,0 0 28px #752bff;
}
.logo-copy strong{display:block;font-size:24px;line-height:1}
.logo-copy strong span{color:#ffad16}
.logo-copy small{font-size:10px;color:#c7cae3}
.menu{display:flex;gap:36px}
.menu a{text-decoration:none;font-size:13px;font-weight:800;position:relative}
.menu a.active{color:#ffc21c}
.menu a.active::after{content:"";position:absolute;left:0;right:0;bottom:-17px;height:3px;background:#ffc21c}
.header-actions{display:flex;gap:14px;align-items:center}
.search-button{width:43px;height:43px;border-radius:50%;border:1px solid #ff45ba;background:transparent;color:#fff;font-size:24px}
.compare-button{
  padding:13px 20px;border-radius:12px;
  background:linear-gradient(90deg,#ff45b8,#ff9724);
  color:#fff;text-decoration:none;font-weight:850;font-size:12px;
  box-shadow:0 0 22px rgba(255,45,141,.34)
}

.hero{
  display:grid;grid-template-columns:.88fr 1.12fr;align-items:center;
  min-height:520px;padding-top:34px
}
.hero-label{display:inline-block;padding:8px 16px;border-radius:8px;background:linear-gradient(90deg,#6b22d6,#a32bbd);font-weight:850;font-size:12px}
.hero h1{font-size:54px;line-height:1.08;margin:20px 0 15px;letter-spacing:-.035em}
.hero h1 .gold{color:#ffb000}.hero h1 .pink{color:#ff2d8d}
.hero p{font-size:17px;color:#e2e5f5;max-width:520px}
.benefit-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:25px 0}
.benefit-row>div{display:grid;grid-template-columns:43px 1fr;gap:9px;align-items:center}
.benefit-icon{width:39px;height:39px;border-radius:11px;display:grid;place-items:center;font-size:18px;border:1px solid currentColor;background:rgba(255,255,255,.04)}
.benefit-icon.blue{color:#0aa7ff}.benefit-icon.purple{color:#b344ff}.benefit-icon.green{color:#25e6aa}.benefit-icon.orange{color:#ff9700}
.benefit-row b{font-size:11px}.benefit-row small{display:block;font-size:10px;color:#fff}
.hero-actions{display:flex;gap:16px}
.hero-actions a{padding:15px 25px;border-radius:12px;text-decoration:none;font-weight:850}
.primary-btn{background:linear-gradient(90deg,#ff32a0,#ff9d00);box-shadow:0 0 24px rgba(255,50,160,.3)}
.secondary-btn{border:1px solid #7b79aa;background:rgba(255,255,255,.03)}
.hero-art img{width:100%;max-height:520px;object-fit:contain;filter:drop-shadow(0 0 32px rgba(121,34,255,.55))}

.ranking{
  margin-top:5px;padding:16px 18px 18px;border:1px solid #2549aa;border-radius:17px;
  background:linear-gradient(180deg,rgba(5,17,58,.98),rgba(2,10,38,.98));
  box-shadow:0 20px 48px rgba(0,0,0,.32)
}
.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.section-heading>div{display:flex;gap:10px;align-items:center}.section-heading h2{font-size:15px;margin:0}.section-heading a{font-size:10px;text-decoration:none}
.ranking-wrap{position:relative}
.ranking-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.rank-card{position:relative;min-height:215px;padding:24px 14px 14px;border:1px solid #243d8e;border-radius:12px;background:linear-gradient(180deg,#091641,#050e31);text-align:center}
.rank-badge{position:absolute;left:10px;top:9px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;color:#06102f;font-weight:900;font-size:11px}
.yellow{background:#ffc21c}.lilac{background:#c995ff}.pink-bg{background:#ff42a6}.blue-bg{background:#5cb7ff}.teal-bg{background:#25dbc8}.orange-bg{background:#ff9d22}
.rank-card h3{height:50px;display:grid;place-items:center;font-size:18px;margin:0}.red{color:#ff334a}.teal-text{color:#17e0d2}.lime{color:#a9df3b}
.stars{font-size:12px;color:#ffc21c}.stars b{color:#fff;margin-left:5px}
.rank-card>strong{display:block;margin:15px 0;color:#ffcd25;font-size:11px}
.rank-card a{display:flex;justify-content:center;gap:15px;padding:10px;border-radius:7px;text-decoration:none;font-size:10px;font-weight:850}
.yellow-btn{background:linear-gradient(90deg,#ffb100,#ffc82e);color:#181538}.purple-btn{background:linear-gradient(90deg,#7125ec,#9c3bff)}.pink-btn{background:linear-gradient(90deg,#ef1c75,#ff3b99)}.cyan-btn{background:linear-gradient(90deg,#049fee,#00c7ff)}.teal-btn{background:linear-gradient(90deg,#00aa9e,#11ddc5)}.orange-btn{background:linear-gradient(90deg,#ff7a13,#ff9c25)}
.carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:32px;height:32px;border-radius:50%;border:0;background:#0c2d78;color:#fff;font-size:22px}.carousel-arrow.left{left:-35px}.carousel-arrow.right{right:-35px}

.dashboard{display:grid;grid-template-columns:1fr .86fr 1.15fr;gap:18px;margin-top:18px}
.panel,.bonus-card{border:1px solid #203f92;border-radius:15px;background:linear-gradient(180deg,#07143d,#040d2d);padding:22px}
.panel h2,.bonus-card h2{font-size:15px;margin:0 0 18px}
.stats-content{display:grid;grid-template-columns:140px 1fr;gap:18px;align-items:center}
.donut{width:130px;height:130px;border-radius:50%;display:grid;place-items:center;position:relative;background:conic-gradient(#7136e8 0 60%,#05d0e0 60% 85%,#ff257c 85% 95%,#ff5a7e 95%)}
.donut::before{content:"";position:absolute;inset:25px;border-radius:50%;background:#07143d}
.donut span,.donut small{position:relative;z-index:1;text-align:center}.donut span{font-size:21px;font-weight:900}.donut small{font-size:9px;margin-top:37px;margin-left:-80px}
.stats-content ul{list-style:none;padding:0;margin:0;display:grid;gap:12px;font-size:9px}.dot{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:7px}.purple-dot{background:#7136e8}.cyan-dot{background:#05d0e0}.pink-dot{background:#ff257c}.coral-dot{background:#ff5a7e}
.why-list{list-style:none;padding:0;margin:0;display:grid;gap:15px;font-size:11px}.why-list span{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1px solid #ff9d00;margin-right:8px;color:#ffb000}
.bonus-card{display:grid;grid-template-columns:1fr 180px;align-items:center;background:radial-gradient(circle at 70% 40%,rgba(255,45,141,.42),transparent 40%),linear-gradient(135deg,#4b0b75,#901278 70%,#3d0d64);border-color:#ff51ce;box-shadow:0 0 20px rgba(255,45,141,.26)}
.bonus-card h2{font-size:18px}.bonus-card p{font-size:13px;color:#f1d9ff}.bonus-card strong{display:block;font-size:56px;color:#d7a0ff;line-height:1}.bonus-card>div>span{display:block;margin-bottom:10px}.bonus-card a{display:inline-block;padding:9px 12px;border:1px solid #bd76ff;border-radius:7px;text-decoration:none;font-size:10px}.bonus-card img{width:170px}

.middle-grid{display:grid;grid-template-columns:1.65fr 1fr;gap:18px;margin-top:18px}
.games-panel,.winners-panel{padding:18px}
.games-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.games-grid>div{padding:10px;border-right:1px solid rgba(255,255,255,.07);text-align:center}.games-grid img{width:95px;height:95px;object-fit:contain;margin:auto}.games-grid h3{font-size:12px}.games-grid p{font-size:10px;color:#d9dcf0}
.winner{display:grid;grid-template-columns:34px 1fr 75px 80px;gap:8px;align-items:center;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08)}.winner b,.winner strong,.winner small{font-size:10px}.winner small{color:#ff455b}.winners-panel>a{display:inline-block;margin-top:14px;padding:8px 13px;border:1px solid #7848dd;border-radius:7px;text-decoration:none;font-size:10px}

.bottom-grid{display:grid;grid-template-columns:.9fr 1.4fr;gap:18px;margin-top:18px}
.tips-panel,.newsletter-panel{border:1px solid #0b8fee;border-radius:16px;background:linear-gradient(180deg,#06133b,#03102d);padding:18px;display:grid;align-items:center}
.tips-panel{grid-template-columns:170px 1fr}.tips-panel img{width:150px}.tips-panel h2,.newsletter-panel h2{font-size:17px;margin:0 0 10px}.tips-panel a{display:flex;justify-content:space-between;text-decoration:none;font-size:10px;padding:3px 0}.tips-panel button{margin-top:10px;padding:8px 13px;border-radius:7px;border:1px solid #5681f0;background:transparent;color:#fff}
.newsletter-panel{grid-template-columns:1fr 280px;border-color:#9c2eff;background:radial-gradient(circle at 80% 30%,rgba(208,48,255,.25),transparent 40%),linear-gradient(180deg,#101042,#090d32)}.newsletter-panel img{width:260px;margin-left:auto}.newsletter-copy p{font-size:11px;color:#e4e6f5}.newsletter-panel form{display:flex;background:#1a174d;border-radius:8px;overflow:hidden}.newsletter-panel input{flex:1;border:0;outline:0;background:transparent;color:#fff;padding:11px}.newsletter-panel button{width:120px;border:0;background:linear-gradient(90deg,#ff2d8d,#ff9d00);color:#fff}.newsletter-panel label{display:block;font-size:9px;margin-top:8px}

.trust-strip{margin-top:18px;background:#06132f;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.trust-strip .shell{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;padding:16px 0}.trust-strip span{display:grid;grid-template-columns:36px 1fr}.trust-strip b,.trust-strip small{grid-column:2}.trust-strip b{font-size:11px}.trust-strip small{font-size:9px;color:#c4c8df}

.footer{background:#020719;padding:28px 0 12px}
.footer-grid{display:grid;grid-template-columns:1.25fr repeat(3,.75fr) 1fr;gap:26px}.footer-logo{min-width:0}.footer h3{font-size:12px}.footer a,.footer p{font-size:10px;color:#c6c9dc;text-decoration:none}.footer a{display:block;margin:5px 0}.socials{display:flex;gap:9px;margin-top:18px}.socials span{width:28px;height:28px;border-radius:50%;background:#141d42;display:grid;place-items:center}.license-box{padding:14px;border:1px solid #5d369d;border-radius:12px;background:#0c1034}.footer-bottom{display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.07);margin-top:18px;padding-top:10px;font-size:9px}

@media(max-width:1100px){
  .menu{display:none}
  .hero{grid-template-columns:1fr}
  .hero-art{order:-1}
  .ranking-grid{grid-template-columns:repeat(3,1fr)}
  .dashboard,.middle-grid,.bottom-grid{grid-template-columns:1fr}
  .trust-strip .shell{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr 1fr 1fr}
}
@media(max-width:700px){
  .shell{width:min(100% - 22px,1460px)}
  .topbar-inner span:last-child,.compare-button{display:none}
  .hero h1{font-size:40px}
  .benefit-row{grid-template-columns:1fr 1fr}
  .ranking-grid,.games-grid{grid-template-columns:1fr}
  .carousel-arrow{display:none}
  .dashboard,.middle-grid,.bottom-grid,.stats-content,.bonus-card,.tips-panel,.newsletter-panel{grid-template-columns:1fr}
  .trust-strip .shell,.footer-grid{grid-template-columns:1fr}
  .newsletter-panel img{margin:auto}
}

.ranking-wrap{position:relative;overflow:hidden;padding:0 4px}
.ranking-grid{display:flex;gap:14px;overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px 0 8px}
.ranking-grid::-webkit-scrollbar{display:none}
.ranking-grid .rank-card{flex:0 0 calc((100% - 70px)/6);scroll-snap-align:start}
.carousel-arrow{cursor:pointer;transition:.2s}
.carousel-arrow:hover{background:#1747b8;transform:translateY(-50%) scale(1.1)}
.carousel-arrow:disabled{opacity:.35;cursor:default}
.green-bg{background:#73df61}.violet-bg{background:#b871ff}.coral-bg{background:#ff6f75}.aqua-bg{background:#47e4db}
.green-btn{background:linear-gradient(90deg,#39b54a,#80e348)}
.violet-btn{background:linear-gradient(90deg,#6a25d9,#ad4cff)}
.coral-btn{background:linear-gradient(90deg,#ed344c,#ff6c71)}
.aqua-btn{background:linear-gradient(90deg,#00a89f,#30ddce)}
@media(max-width:1100px){.ranking-grid .rank-card{flex-basis:calc((100% - 28px)/3)}}
@media(max-width:700px){.ranking-grid .rank-card{flex-basis:100%}.carousel-arrow{display:block}.carousel-arrow.left{left:4px}.carousel-arrow.right{right:4px}}

/* ===== VERBETERDE RESPONSIVE WEERGAVE ===== */
.mobile-menu-toggle{
  display:none;width:42px;height:42px;border:1px solid rgba(255,255,255,.22);
  border-radius:12px;background:rgba(255,255,255,.05);color:#fff;font-size:22px;cursor:pointer
}

@media(max-width:1100px){
  .shell{width:min(100% - 32px,1180px)}
  .nav{gap:16px}.logo{min-width:auto}.header-actions{margin-left:auto}
  .mobile-menu-toggle{display:grid;place-items:center}
  .menu{
    position:absolute;left:16px;right:16px;top:76px;display:none;
    grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:14px;
    border:1px solid rgba(255,255,255,.12);border-radius:16px;
    background:rgba(3,9,37,.98);box-shadow:0 18px 40px rgba(0,0,0,.35)
  }
  .menu.is-open{display:grid}
  .menu a{padding:11px 12px;border-radius:10px;text-align:center;background:rgba(255,255,255,.045)}
  .menu a.active::after{display:none}
  .hero{grid-template-columns:minmax(0,1fr) minmax(320px,.9fr);min-height:auto;gap:24px;padding:36px 0 26px}
  .hero-art{order:0}.hero-art img{max-height:410px}
  .benefit-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dashboard{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bonus-card{grid-column:1/-1}
  .middle-grid{grid-template-columns:1.35fr .9fr}
  .bottom-grid{grid-template-columns:1fr 1.25fr}
  .footer-grid{grid-template-columns:1.2fr repeat(2,1fr)}
}

@media(max-width:780px){
  .shell{width:min(100% - 22px,720px)}
  .topbar-inner{height:auto;min-height:34px;padding:7px 0}.topbar-inner span:last-child{display:none}
  .nav{height:68px}.logo-orbit{width:42px;height:42px}.logo-copy strong{font-size:20px}.logo-copy small{display:none}
  .compare-button{display:none}.search-button{width:40px;height:40px}
  .menu{top:66px;grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero{grid-template-columns:1fr;gap:8px;padding:26px 0 20px}
  .hero-copy{text-align:center}.hero h1{margin:15px 0 10px;font-size:clamp(34px,10vw,45px);line-height:1.04}
  .hero p{margin:0 auto;font-size:16px}
  .hero-art{order:-1}.hero-art img{width:min(88%,460px);max-height:285px;margin:auto}
  .benefit-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:18px 0;text-align:left}
  .benefit-row>div{min-height:64px;padding:10px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(255,255,255,.035)}
  .hero-actions{justify-content:center;flex-wrap:wrap}
  .ranking{padding:14px 12px}.ranking-grid{gap:12px;padding-right:34px}
  .ranking-grid .rank-card{flex:0 0 min(78vw,270px);min-height:200px}
  .carousel-arrow{display:grid;place-items:center;width:36px;height:36px}.carousel-arrow.left{left:4px}.carousel-arrow.right{right:4px}
  .dashboard{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .panel,.bonus-card{padding:16px}
  .stats-content{grid-template-columns:108px 1fr;gap:12px}
  .donut{width:104px;height:104px}.donut::before{inset:20px}
  .bonus-card{grid-template-columns:1fr 130px;min-height:0}.bonus-card img{width:125px}
  .middle-grid,.bottom-grid{grid-template-columns:1fr;gap:12px}
  .games-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .games-grid>div{border:1px solid rgba(255,255,255,.07);border-radius:12px}
  .tips-panel{grid-template-columns:110px 1fr}.tips-panel img{width:100px}
  .newsletter-panel{grid-template-columns:1fr 160px}.newsletter-panel img{width:150px}
  .trust-strip .shell{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .trust-strip span{padding:9px;border-radius:10px;background:rgba(255,255,255,.03)}
  .network-hub{margin:36px auto!important;padding:26px 16px!important}
  .network-hub__links{display:flex!important;overflow-x:auto;gap:10px;padding-bottom:6px;scroll-snap-type:x mandatory;scrollbar-width:none}
  .network-hub__links::-webkit-scrollbar{display:none}
  .network-hub__links a{flex:0 0 min(72vw,240px);min-height:54px;scroll-snap-align:start}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
  .footer-grid>div:first-child,.footer-grid .license-box{grid-column:1/-1}
}

@media(max-width:520px){
  .shell{width:calc(100% - 18px)}.search-button{display:none}.menu{left:9px;right:9px}
  .hero-art img{width:94%;max-height:235px}
  .benefit-row>div{grid-template-columns:34px 1fr;min-height:58px;padding:8px}
  .benefit-icon{width:32px;height:32px}
  .hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}
  .hero-actions a{display:grid;place-items:center;padding:12px 8px;font-size:12px;text-align:center}
  .dashboard{grid-template-columns:1fr}
  .stats-content{grid-template-columns:100px 1fr}
  .bonus-card{grid-template-columns:1fr 100px}.bonus-card img{width:95px}.bonus-card strong{font-size:38px}
  .games-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .newsletter-panel{grid-template-columns:1fr}.newsletter-panel img{display:none}
  .newsletter-panel form{display:grid;grid-template-columns:minmax(0,1fr) 96px}
  .newsletter-panel button{width:auto}
  .trust-strip .shell{grid-template-columns:1fr 1fr;gap:8px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:14px 18px}
}

/* ===== MOBIELE VERFIJNING V2 ===== */
@media(max-width:780px){
  body{overflow-x:hidden}

  .dashboard{
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
  }

  .panel,.bonus-card{
    border-radius:18px;
    padding:18px;
  }

  .panel h2,.bonus-card h2{
    font-size:17px;
    margin-bottom:16px;
  }

  .stats-content{
    display:grid;
    grid-template-columns:118px minmax(0,1fr);
    gap:18px;
    align-items:center;
  }

  .donut{
    width:116px;
    height:116px;
    margin:auto;
  }

  .donut::before{inset:22px}

  .donut-center{
    position:absolute;
    inset:0;
    z-index:2;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:28px;
  }

  .donut-center span{
    position:static!important;
    margin:0!important;
    font-size:18px!important;
    line-height:1!important;
    font-weight:900;
    white-space:nowrap;
  }

  .donut-center small{
    position:static!important;
    margin:5px 0 0!important;
    width:72px;
    font-size:9px!important;
    line-height:1.15!important;
  }

  .stats-content ul{
    gap:11px;
    font-size:11px;
  }

  .stats-content li{
    display:grid;
    grid-template-columns:12px 1fr auto;
    align-items:center;
    gap:7px;
  }

  .stats-content li .dot{margin:0}

  .why-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .why-list li{
    display:grid;
    grid-template-columns:42px 1fr;
    align-items:center;
    gap:10px;
    min-height:74px;
    padding:11px;
    border-radius:13px;
    background:rgba(255,255,255,.035);
    border:1px solid rgba(255,255,255,.065);
    font-size:11px;
    line-height:1.35;
  }

  .why-list span{
    width:42px;
    height:42px;
    margin:0;
    font-size:18px;
  }

  .bonus-card{
    grid-template-columns:minmax(0,1fr) 118px;
    gap:12px;
    align-items:center;
    min-height:210px;
  }

  .bonus-card>div{
    display:grid;
    align-content:center;
  }

  .bonus-card h2{
    font-size:18px;
    line-height:1.15;
  }

  .bonus-card p{
    font-size:14px;
    line-height:1.45;
    margin:0 0 10px;
  }

  .bonus-card strong{
    font-size:42px;
    margin-bottom:2px;
  }

  .bonus-card>div>span{
    font-size:14px;
    margin-bottom:12px;
  }

  .bonus-card a{
    width:max-content;
    font-size:12px;
    padding:10px 13px;
  }

  .bonus-card img{
    width:105px;
    justify-self:end;
  }

  .footer{
    padding:30px 0 18px;
  }

  .footer-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:24px 18px;
    align-items:start;
  }

  .footer-grid>div:first-child{
    grid-column:1/-1;
    display:grid;
    grid-template-columns:auto 1fr;
    align-items:center;
    gap:12px;
  }

  .footer-grid>div:first-child .footer-logo{
    grid-column:1/-1;
  }

  .socials{
    grid-column:1/-1;
    margin-top:4px;
  }

  .footer-grid .license-box{
    grid-column:1/-1;
    margin-top:2px;
  }

  .footer h3{
    font-size:13px;
    margin:0 0 10px;
  }

  .footer a,.footer p{
    font-size:12px;
    line-height:1.45;
  }

  .footer a{
    margin:7px 0;
  }

  .footer-bottom{
    font-size:10px;
    gap:12px;
  }
}

@media(max-width:520px){
  .stats-content{
    grid-template-columns:110px minmax(0,1fr);
    gap:14px;
  }

  .donut{
    width:108px;
    height:108px;
  }

  .donut-center span{font-size:17px!important}
  .donut-center small{font-size:8.5px!important}

  .why-list{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }

  .why-list li{
    min-height:70px;
    grid-template-columns:38px 1fr;
    padding:9px;
    font-size:10.5px;
  }

  .why-list span{
    width:38px;
    height:38px;
    font-size:16px;
  }

  .bonus-card{
    grid-template-columns:minmax(0,1fr) 90px;
    padding:17px;
    min-height:190px;
  }

  .bonus-card img{width:82px}
  .bonus-card h2{font-size:16px}
  .bonus-card p{font-size:12.5px}
  .bonus-card strong{font-size:36px}
  .bonus-card a{font-size:11px;padding:9px 11px}

  .footer-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px 14px;
  }

  .footer-grid>div{
    min-width:0;
  }

  .footer a{
    white-space:normal;
    word-break:normal;
    overflow-wrap:anywhere;
  }

  .footer-bottom{
    flex-direction:column;
    align-items:flex-start;
  }
}

/* ===== DOORLINKBLOK: ALLE 20 LINKS ZICHTBAAR OP MOBIEL ===== */
@media(max-width:780px){
  .network-hub{
    padding:24px 14px!important;
  }

  .network-hub__head{
    margin-bottom:18px;
  }

  .network-hub__head h2{
    margin:12px 0 7px;
    font-size:clamp(26px,7vw,32px);
  }

  .network-hub__head p{
    font-size:14px!important;
    line-height:1.5;
  }

  .network-hub__links{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    overflow:visible!important;
    padding:0!important;
    scroll-snap-type:none!important;
  }

  .network-hub__links a{
    width:100%;
    min-width:0;
    min-height:46px!important;
    padding:9px 10px!important;
    gap:7px!important;
    border-radius:12px!important;
    font-size:11px!important;
    line-height:1.2;
    box-shadow:none!important;
  }

  .network-hub__links a span{
    width:25px!important;
    height:25px!important;
    font-size:13px!important;
  }
}

@media(max-width:390px){
  .network-hub{
    padding:22px 10px!important;
  }

  .network-hub__links{
    gap:6px!important;
  }

  .network-hub__links a{
    min-height:43px!important;
    padding:8px!important;
    font-size:10.5px!important;
  }

  .network-hub__links a span{
    width:23px!important;
    height:23px!important;
  }
}