/* style-alien.css — Layout 6 ("Alien Attack"), gebaseerd op style-gc.css (Gaming & Cars). */
/* style-rh.css — Layout 3 ("RH"): donkerblauw met oranje vuur en blauwe gloed. Hoort bij includes/layout-alien.php */
body.layout-alien{background:radial-gradient(ellipse 50% 40% at 50% 0%,rgba(58,120,255,.12),transparent 70%),radial-gradient(ellipse 40% 60% at 0% 100%,rgba(255,110,20,.10),transparent 70%),radial-gradient(ellipse 40% 60% at 100% 100%,rgba(255,110,20,.10),transparent 70%),#05080f!important;display:block!important;min-height:100vh}
/* Vuur en kettingen aan de zijkanten (alleen op brede schermen, vast in beeld) */
body.layout-alien::before,body.layout-alien::after{content:"";position:fixed;top:0;bottom:0;width:340px;background:url(images/alien/zijkant.jpg) center/cover no-repeat;z-index:-1;pointer-events:none;opacity:.9}
body.layout-alien::before{left:0;-webkit-mask-image:linear-gradient(90deg,#000 55%,transparent);mask-image:linear-gradient(90deg,#000 55%,transparent)}
body.layout-alien::after{right:0;transform:scaleX(-1);-webkit-mask-image:linear-gradient(90deg,#000 55%,transparent);mask-image:linear-gradient(90deg,#000 55%,transparent)}
@media (max-width:1500px){body.layout-alien::before,body.layout-alien::after{opacity:.45}}
.al{--rh-blauw:#3aa8ff;--rh-blauw2:#5fd0ff;--rh-oranje:#ff8a1f;--rh-goud:#ffcc44;--rh-kaart:linear-gradient(180deg,rgba(14,22,38,.94),rgba(8,13,24,.96));--rh-rand:rgba(70,160,255,.28);
    max-width:1240px;margin:0 auto;padding:0 12px 20px;color:#dce6f2;font-family:'Barlow','Segoe UI',Arial,sans-serif}
.al a{color:inherit}

/* ── Bovenbalk ── */
.al-kopvak{position:relative;margin:0 -12px 16px}
.al-balk{position:absolute;top:0;left:0;right:0;z-index:50;padding:8px 16px 0;background:linear-gradient(180deg,rgba(3,6,14,.92),rgba(3,6,14,.55) 70%,transparent)}
.al-balk__in{display:flex;align-items:center;gap:10px;height:52px}
.al-logo{align-self:flex-start;margin-top:-8px}
.al-logo img{height:72px;display:block;-webkit-mask-image:radial-gradient(ellipse 60% 70% at 50% 40%,#000 60%,transparent 100%);mask-image:radial-gradient(ellipse 60% 70% at 50% 40%,#000 60%,transparent 100%);filter:drop-shadow(0 0 10px rgba(58,168,255,.6))}
.al-top{display:flex;gap:2px;margin:0 auto 0 30px;min-width:0;overflow:hidden;padding:4px;border-radius:12px;background:rgba(4,8,18,.75);border:1px solid rgba(70,160,255,.22);box-shadow:0 0 14px rgba(0,0,0,.6)}
.al-top a{padding:8px 12px;border-radius:8px;font-size:14px;font-weight:700;text-decoration:none;color:#cfe0f5;white-space:nowrap}
.al-top a:hover{background:rgba(58,168,255,.12);color:#fff}
.al-top a.actief{color:#fff;background:linear-gradient(180deg,rgba(58,168,255,.28),rgba(58,168,255,.08));box-shadow:inset 0 -2px 0 var(--rh-blauw)}
.al-zoek{display:flex;align-items:center;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:9px;overflow:hidden}
.al-zoek input{background:transparent;border:0;outline:0;color:#fff;padding:8px 10px;width:160px;font-size:13px}
.al-zoek button{background:transparent;border:0;color:#9fb6cf;cursor:pointer;padding:0 10px}
.al-icoon{position:relative;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:9px;text-decoration:none;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}
.al-icoon span{position:absolute;top:-5px;right:-5px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:#ff3b4f;color:#fff;font-size:10px;font-weight:900;display:flex;align-items:center;justify-content:center}
.al-ik,.al-mobielmenu{position:relative}
.al-ik summary,.al-mobielmenu summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;padding:4px 8px 4px 4px;border-radius:20px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04)}
.al-ik summary::-webkit-details-marker,.al-mobielmenu summary::-webkit-details-marker{display:none}
.al-ik summary img{width:30px;height:30px;border-radius:50%;object-fit:cover;border:2px solid var(--rh-blauw)}
.al-ik summary b{font-size:13.5px}
.al-ik summary i{font-style:normal;font-size:11px;color:#9fb6cf}
.al-ik__menu{position:absolute;right:0;top:calc(100% + 8px);min-width:200px;padding:6px;border-radius:12px;background:#0b1424;border:1px solid var(--rh-rand);box-shadow:0 12px 30px rgba(0,0,0,.6);z-index:60}
.al-ik__menu a{display:block;padding:9px 12px;border-radius:8px;font-size:13.5px;text-decoration:none;color:#dce6f2}
.al-ik__menu a:hover{background:rgba(58,168,255,.14)}
.al-ik__menu a.rood{color:#ff7a86}
.al-ik__kop{font-size:10.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:#6f86a0;padding:8px 12px 2px}
.al-mobielmenu{display:none}
.al-mobielmenu summary{padding:6px 12px;font-size:18px;border-radius:9px}
.al-knop{display:inline-block;padding:8px 14px;border-radius:9px;font-weight:800;font-size:13px;text-decoration:none;color:#04111f!important;background:linear-gradient(180deg,var(--rh-blauw2),var(--rh-blauw));box-shadow:0 0 14px rgba(58,168,255,.35)}
.al-knop.rand{background:transparent;color:#cfe0f5!important;border:1px solid var(--rh-rand);box-shadow:none}

/* ── Kop ── */
.al-kop{margin:0}
.al-kop img{display:block;width:100%;height:auto;max-height:470px;object-fit:cover;object-position:center 30%;-webkit-mask-image:linear-gradient(180deg,#000 88%,transparent);mask-image:linear-gradient(180deg,#000 88%,transparent)}

/* ── Blokken ── */
.al-midden{display:grid;grid-template-columns:230px 1fr;gap:14px;align-items:start}
.al-inhoud,.al-zij{min-width:0}
.al-pagina{overflow-x:auto}
.al-pagina table{max-width:100%}
.al-blok{position:relative;border-radius:14px;background:var(--rh-kaart);border:1px solid var(--rh-rand);box-shadow:0 0 0 1px rgba(0,0,0,.4),0 0 18px rgba(58,168,255,.08),inset 0 1px 0 rgba(120,190,255,.12);margin-bottom:14px;overflow:hidden}
.al-blok,.al-welkom,.al-pagina,.al-tabs{background-clip:padding-box}
.al-blok::before,.al-blok::after,.al-welkom::before,.al-welkom::after,.al-pagina::before,.al-pagina::after{content:"";position:absolute;width:38px;height:38px;pointer-events:none;z-index:3}
.al-blok::before,.al-welkom::before,.al-pagina::before{top:-1px;left:-1px;border-top:2px solid #5fd0ff;border-left:2px solid #5fd0ff;border-top-left-radius:14px;box-shadow:-3px -3px 10px -4px #3aa8ff}
.al-blok::after,.al-welkom::after,.al-pagina::after{bottom:-1px;right:-1px;border-bottom:2px solid #5fd0ff;border-right:2px solid #5fd0ff;border-bottom-right-radius:14px;box-shadow:3px 3px 10px -4px #3aa8ff}
.al-pagina{position:relative}
.al-ikkaart::before,.al-ikkaart::after{border-color:#ffcc44!important;box-shadow:none!important}
.al-blok__titel{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 14px 10px;font-family:'Barlow Condensed','Barlow',sans-serif;font-size:15px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--rh-blauw2);border-bottom:1px solid rgba(70,160,255,.15)}
.al-blok__titel a{font-size:12px;letter-spacing:0;text-transform:none;font-weight:700;color:var(--rh-blauw2);text-decoration:none}
.al-leeg{padding:14px;color:#7a8ea6;font-size:13px}

/* Navigatie links */
.al-nav{padding-bottom:8px}
.al-nav a{display:flex;align-items:center;gap:10px;margin:6px 8px 0;padding:9px 10px;border-radius:10px;font-size:14px;font-weight:700;text-decoration:none;color:#dce6f2;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.05)}
.al-nav__ico{flex:0 0 30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;background:rgba(255,255,255,.06);border:1px solid rgba(120,180,255,.25)}
.al-nav a.actief .al-nav__ico{border-color:#5fd0ff;box-shadow:0 0 8px rgba(58,168,255,.6)}
.al-nav a i{margin-left:auto;font-style:normal;color:#6f86a0;font-size:16px}
.al-nav a em{font-style:normal;font-size:10px;font-weight:900;background:#ff3b4f;color:#fff;border-radius:8px;padding:1px 6px;margin-left:4px}
.al-nav a:hover{border-color:rgba(58,168,255,.4);background:rgba(58,168,255,.08)}
.al-nav a.actief{border-color:var(--rh-blauw);background:linear-gradient(90deg,rgba(58,168,255,.25),rgba(58,168,255,.06));box-shadow:0 0 14px rgba(58,168,255,.35);color:#fff}
.al-nav a.actief i{color:#fff}
.al-online{display:flex;flex-wrap:wrap;gap:6px;padding:10px 12px 12px}
.al-online img{width:34px;height:34px;border-radius:50%;object-fit:cover;border:2px solid rgba(68,255,136,.6)}
.al-shout{padding:4px}

/* Welkom + nieuws */
.al-boven{display:grid;grid-template-columns:1.25fr 1fr;gap:14px;margin-bottom:0}
.al-welkom{position:relative;border-radius:14px;overflow:hidden;border:1px solid var(--rh-rand);box-shadow:0 0 18px rgba(58,168,255,.12);margin-bottom:14px;min-height:240px;background:#0a1222}
.al-welkom img{display:block;width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.al-welkom__tekst{position:absolute;left:0;right:0;bottom:0;padding:40px 18px 16px;background:linear-gradient(transparent,rgba(4,8,16,.92))}
.al-welkom__pijl{position:absolute;bottom:18px;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;line-height:1;text-decoration:none;color:#fff;background:rgba(5,10,20,.7);border:1px solid rgba(255,255,255,.25);z-index:2}
.al-welkom__pijl.links{left:12px}.al-welkom__pijl.rechts{right:12px}
.al-welkom__tekst{padding-left:58px!important}
.al-welkom__tekst b{display:block;font-size:18px;color:#fff}
.al-welkom__tekst span{font-size:13.5px;color:#c6d6ea}
.al-nieuws__item{display:flex;gap:10px;padding:9px 12px;text-decoration:none;border-bottom:1px solid rgba(70,160,255,.08)}
.al-nieuws__item:last-child{border-bottom:0}
.al-nieuws__item:hover{background:rgba(58,168,255,.06)}
.al-nieuws__img{flex:0 0 76px;height:52px;border-radius:8px;background:#13213a url(images/alien/welkom_beeld.jpg) center/cover;border:1px solid rgba(70,160,255,.25)}
.al-nieuws__item b{display:block;font-size:13.5px;color:#fff;line-height:1.25}
.al-nieuws__item small{display:block;font-size:12px;color:#9fb6cf;line-height:1.35;margin-top:2px}
.al-nieuws__item em{display:block;font-style:normal;font-size:11px;color:#6f86a0;margin-top:2px}

/* Jouw kaart */
.al-ikkaart{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:14px;border-color:rgba(255,204,68,.4);box-shadow:0 0 20px rgba(255,170,40,.12)}
.al-ikkaart__av{width:84px;height:84px;border-radius:10px;object-fit:cover;border:2px solid var(--rh-oranje);box-shadow:0 0 14px rgba(255,138,31,.4)}
.al-ikkaart__naam{font-size:20px;font-weight:900;display:flex;align-items:center;gap:8px}
.al-ikkaart__naam a{text-decoration:none;color:#ffcc44!important}
.al-vip{font-size:10px;font-weight:900;padding:2px 7px;border-radius:5px;background:var(--rh-goud);color:#2a1a00}
.al-rol{display:inline-block;font-size:11px;font-weight:800;padding:3px 9px;border-radius:6px;background:#5b2bd6;color:#fff;margin-top:4px}
.al-ikkaart__titel{font-size:12.5px;color:#c6d6ea;font-style:italic;margin-top:4px}
.al-ikkaart__sinds{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;color:#c6d6ea;margin-top:6px}
.al-stats{display:flex;gap:8px}
.al-stats div.breed{min-width:150px}
.al-stats div.breed b{font-size:17px;line-height:26px}
.al-stats div{min-width:84px;text-align:center;padding:10px 8px;border-radius:10px;border:1px solid var(--rh-rand);background:rgba(58,168,255,.05)}
.al-stats b{display:block;font-family:'Barlow Condensed','Barlow',sans-serif;font-size:22px;color:var(--rh-goud)}
.al-stats small{font-size:10.5px;letter-spacing:.8px;text-transform:uppercase;color:#8ea3bb}
.al-level{grid-column:1/-1;display:flex;align-items:center;gap:10px}
.al-level>span{font-size:22px}
.al-level>div{flex:1}
.al-level__kop{display:flex;justify-content:space-between;font-size:13px}
.al-level__kop b{color:var(--rh-goud)}
.al-level__kop small{color:#c6d6ea}
.al-level__balk{height:8px;border-radius:5px;background:rgba(255,255,255,.08);margin-top:5px;overflow:hidden}
.al-level__balk i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,#ff9a1f,#ffd84a);box-shadow:0 0 10px rgba(255,190,40,.6)}

/* Profieltabs onder je kaart */
.al-tabs{display:flex;gap:4px;flex-wrap:wrap;overflow:hidden;margin:-4px 0 14px;padding:6px;border-radius:12px;background:rgba(8,13,24,.9);border:1px solid var(--rh-rand);scrollbar-width:thin}
.al-tabs a{flex:0 0 auto;display:flex;align-items:center;gap:6px;padding:8px 10px;border-radius:9px;font-size:12.5px;font-weight:700;text-decoration:none;color:#9fc4ea;border-bottom:2px solid transparent}
.al-tabs a i{font-style:normal}
.al-tabs a:hover{background:rgba(58,168,255,.1);color:#fff}
.al-tabs a.goud{color:#ffcc44}
/* De pagina zelf (alle bestaande pagina's) */
.al-pagina{border-radius:14px;background:var(--rh-kaart);border:1px solid var(--rh-rand);box-shadow:0 0 18px rgba(58,168,255,.08);padding:16px;min-height:300px;overflow:hidden}
.al-pagina img{max-width:100%}

/* Vier kaarten */
.al-kaarten{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0 14px}
.al-kaarten a{display:block;border-radius:16px;overflow:hidden;transition:transform .2s,box-shadow .2s;box-shadow:0 0 18px rgba(58,168,255,.15)}
.al-kaarten a:hover{transform:translateY(-3px);box-shadow:0 0 26px rgba(58,168,255,.4)}
.al-kaarten img{display:block;width:100%;height:auto}

/* Voet */
.al-voet{border-top:1px solid var(--rh-rand);padding:16px 0 6px}
.al-voet__in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;font-size:13px;color:#9fb6cf}
.al-voet__embleem img{height:90px;display:block;filter:drop-shadow(0 0 12px rgba(58,168,255,.5));-webkit-mask-image:radial-gradient(circle,#000 55%,transparent 72%);mask-image:radial-gradient(circle,#000 55%,transparent 72%)}
.al-voet__links{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end}
.al-voet__links a{text-decoration:none;color:#cfe0f5}
.al-voet__links a:hover{color:var(--rh-blauw2)}
.al-voet__layout{flex-basis:100%;text-align:right;font-size:12px;color:#6f86a0}

/* ── Extreme-onderdelen in de pagina's neutraliseren (kaders, vaste maten, achtergronden) ── */
body.layout-alien .content-top,body.layout-alien .content-bottom{display:none!important}
body.layout-alien .content-wrapper{width:auto!important;height:auto!important;overflow:visible!important;display:block!important}
body.layout-alien .content-middle{height:auto!important;background:none!important;overflow:visible!important;border:0;padding:0;display:block}
body.layout-alien .content-inner{padding:0;width:auto!important;max-width:100%}
body.layout-alien .content-wrapper+.content-wrapper,body.layout-alien .al-pagina>*+.content-wrapper{margin-top:16px}
body.layout-alien .al-pagina .content-wrapper{border-top:1px solid rgba(70,160,255,.15);padding-top:14px;margin-top:14px}
body.layout-alien .al-pagina>.content-wrapper:first-child{border-top:0;padding-top:0;margin-top:0}
body.layout-alien .midden-content,body.layout-alien .midden-center{width:auto!important;height:auto!important;background:none!important;overflow:visible!important}

/* ── Kleiner scherm ── */
@media (max-width:1100px){.al-top{display:none}.al-boven{grid-template-columns:1fr}.al-kaarten{grid-template-columns:repeat(2,1fr)}}
@media (max-width:820px){
    body.layout-alien::after,body.layout-alien::before{display:none}
    .al-balk{position:relative;background:#050a14;padding:6px 10px}
    .al-logo{margin-top:0}.al-logo img{height:42px}
    .al-midden{grid-template-columns:1fr}
    .al-zij{order:2}
    .al-nav{display:none}
    .al-mobielmenu{display:block}
    .al-zoek{display:none}
    .al-kiezer select{max-width:110px!important}
    .al-ik summary b,.al-ik summary i{display:none}
    .al-ikkaart{grid-template-columns:auto 1fr}
    .al-stats{grid-column:1/-1}
    .al-stats div{flex:1;min-width:0}
    .al-voet__in{grid-template-columns:1fr;text-align:center}
    .al-voet__embleem{justify-self:center}
    .al-voet__links,.al-voet__layout{justify-content:center;text-align:center}
}
@media (max-width:520px){.al-kaarten{grid-template-columns:1fr 1fr;gap:8px}.al-pagina{padding:10px}.al-welkom{min-height:180px}}


/* ══════════ Eigen stijl "Gaming & Cars" (gaat boven de RH-stijl hierboven) ══════════ */
body.layout-alien{background:radial-gradient(ellipse 60% 35% at 50% 0%,rgba(30,123,255,.10),transparent 70%),#070b14!important}
body.layout-alien::before,body.layout-alien::after{display:none!important}
.al{--rh-blauw:#1e7bff;--rh-blauw2:#4da3ff;--rh-kaart:#0c1321;--rh-rand:rgba(255,255,255,.08);max-width:1280px}
.al-blok::before,.al-blok::after,.al-welkom::before,.al-welkom::after,.al-pagina::before,.al-pagina::after{display:none!important}
.al-blok,.al-pagina{box-shadow:0 6px 20px rgba(0,0,0,.35)!important;border-color:rgba(255,255,255,.08)!important;background:#0c1321!important}
/* Bovenbalk: los boven de kop, iconen boven de woorden */
.al-kopvak{margin:0 -12px 0}
.al-balk{position:relative!important;background:#090e19!important;padding:0 18px!important;border-bottom:1px solid rgba(255,255,255,.07)}
.al-balk__in{height:64px}
.al-logo{margin-top:0!important;align-self:center!important}
.al-logo img{height:44px!important;-webkit-mask-image:none!important;mask-image:none!important;filter:none!important}
.al-top{background:none!important;border:0!important;box-shadow:none!important;padding:0!important;margin:0 auto 0 30px!important;gap:0!important;align-self:stretch}
.al-top a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:0 16px!important;border-radius:0!important;font-size:12.5px!important;font-weight:600!important;color:#c9d6e8!important;box-shadow:none!important;background:none!important;border-bottom:2px solid transparent}
.al-top a i{font-style:normal;font-size:16px;line-height:1;filter:grayscale(1) brightness(1.6)}
.al-top a:hover{color:#fff!important;background:rgba(255,255,255,.03)!important}
.al-top a.actief{color:#4da3ff!important;background:linear-gradient(180deg,transparent,rgba(30,123,255,.14))!important;border-bottom-color:#1e7bff}
.al-top a.actief i{filter:none}
.al-zoek{border-radius:8px!important;background:#0f1726!important}
.al-icoon{border-radius:50%!important;background:transparent!important;border:0!important}
.al-ik summary{border:0!important;background:transparent!important}
.al-ik summary img{border-color:transparent!important}
.al-kop img{max-height:440px!important;object-position:center 45%!important;-webkit-mask-image:none!important;mask-image:none!important}
/* Vier punten onder de kop */
.al-punten{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:16px 0;padding:14px 18px;border-radius:14px;background:#0c1321;border:1px solid rgba(255,255,255,.08)}
.al-punten a{display:flex;align-items:center;gap:14px;text-decoration:none;padding:4px 8px;border-radius:10px}
.al-punten a:hover{background:rgba(30,123,255,.07)}
.al-punten span{flex:0 0 46px;height:46px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:22px;background:#111b2d;border:1px solid rgba(255,255,255,.06)}
.al-punten b{font-size:14.5px;color:#fff;font-weight:700}
.al-punten small{display:block;font-size:12.5px;color:#8ea0b8;font-weight:400;margin-top:2px}
/* Navigatie links */
.al-nav .al-blok__titel{display:none}
.al-nav{padding:6px 0 8px}
.al-nav a{margin:2px 8px 0!important;border-radius:9px!important;background:none!important;border:1px solid transparent!important;font-weight:600!important;color:#dbe5f3!important}
.al-nav a:hover{background:rgba(255,255,255,.04)!important}
.al-nav__ico{background:none!important;border:0!important;filter:grayscale(1) brightness(1.7)}
.al-nav a.actief{background:linear-gradient(180deg,#2a8bff,#1667e6)!important;border-color:#4da3ff!important;color:#fff!important;box-shadow:0 0 14px rgba(30,123,255,.35)!important}
.al-nav a.actief .al-nav__ico{filter:none;box-shadow:none!important}
.al-nav a.actief i{color:#fff}
/* Welkom: tekst links, beeld rechts */
.al-boven{grid-template-columns:1.6fr 1fr}
.al-welkom{min-height:290px;background:linear-gradient(90deg,#0b1424 40%,rgba(11,20,36,.2)),#0b1424!important;border-color:rgba(255,255,255,.08)!important}
.al-welkom__beeld{position:absolute;top:0;right:0;bottom:0;width:58%;background:center/cover no-repeat;-webkit-mask-image:linear-gradient(90deg,transparent,#000 35%);mask-image:linear-gradient(90deg,transparent,#000 35%)}
.al-welkom__tekst{position:relative!important;inset:auto!important;background:none!important;padding:44px 28px 50px!important;max-width:62%}
.al-welkom__klein{font-size:21px;font-weight:700;color:#fff}
.al-welkom__groot{font-family:'Orbitron','Barlow Condensed','Barlow',sans-serif;font-size:42px;font-weight:900;letter-spacing:1px;color:#e9eef6;line-height:1.05}
.al-welkom__groot span{color:#2a8bff;font-size:inherit!important;display:inline!important}
.al-welkom__tekst p{font-size:14.5px;color:#d3dceb;line-height:1.55;margin:12px 0 18px}
.al-welkom__tekst p span{color:#4da3ff;font-size:inherit!important;display:inline!important}
.al-welkom__knoppen{display:flex;gap:12px;flex-wrap:wrap}
.al-knop{display:inline-block;padding:10px 26px;border-radius:7px;font-weight:700;font-size:13.5px;text-decoration:none;color:#fff!important;background:linear-gradient(180deg,#2a8bff,#1667e6);box-shadow:0 0 14px rgba(30,123,255,.35)}
.al-knop.rand{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.35);box-shadow:none}
.al-welkom__pijl{bottom:auto!important;top:auto!important;bottom:16px!important}
.al-welkom__stippen{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);display:flex;gap:6px}
.al-welkom__stippen i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.3)}
.al-welkom__stippen i.aan{background:#2a8bff}
.al-blok__titel{font-family:'Barlow','Segoe UI',sans-serif!important;text-transform:none!important;letter-spacing:0!important;font-size:16px!important;color:#fff!important;font-weight:700!important;border-bottom:0!important}
.al-blok__titel a{color:#4da3ff!important}
.al-nieuws__item{border-bottom:1px solid rgba(255,255,255,.05)!important}
.al-nieuws__img{flex-basis:84px!important;height:58px!important;border-radius:6px!important}
.al-nieuws__item u{display:inline-block;text-decoration:none;font-size:10px;font-weight:700;color:#fff;padding:1px 6px;border-radius:3px;margin-bottom:3px}
.al-nieuws__item b{font-size:14px!important}
/* Jouw kaart en tabs */
.al-ikkaart{border-color:rgba(255,255,255,.08)!important;box-shadow:0 6px 20px rgba(0,0,0,.35)!important}
.al-ikkaart__av{border:1px solid rgba(255,255,255,.15)!important;box-shadow:none!important;border-radius:8px!important}
.al-stats div{background:#0f1828!important;border-color:rgba(255,255,255,.08)!important}
.al-tabs{background:#0c1321!important;border-color:rgba(255,255,255,.08)!important}
.al-tabs a{color:#cfd9e8}
.al-tabs a.goud{color:#4da3ff;border-bottom-color:#1e7bff}
/* Kaarten en voet */
.al-kaarten a{border-radius:12px;box-shadow:0 6px 18px rgba(0,0,0,.4)}
.al-kaarten a:hover{box-shadow:0 0 20px rgba(30,123,255,.35)}
.al-voet{border-top:1px solid rgba(255,255,255,.07)}
.al-voet__in{grid-template-columns:auto 1fr auto!important;text-align:left}
.al-voet__logo img{height:46px;display:block}
.al-omhoog{width:36px;height:36px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#111b2d;border:1px solid rgba(255,255,255,.12);text-decoration:none;color:#fff!important}
@media (max-width:1100px){.al-punten{grid-template-columns:1fr 1fr}.al-top a{padding:0 9px!important}}
@media (max-width:820px){.al-boven{grid-template-columns:1fr}.al-welkom__tekst{max-width:100%;padding:28px 18px 50px!important}.al-welkom__beeld{width:100%;opacity:.35}.al-welkom__groot{font-size:32px}.al-voet__in{grid-template-columns:1fr!important;text-align:center}.al-voet__logo{justify-self:center}}
@media (max-width:520px){.al-punten{grid-template-columns:1fr}}
@media (max-width:520px){
    .al-balk{padding:0 8px!important}
    .al-balk__in{gap:6px}
    .al-logo img{height:28px!important}
    .al-kiezer select{max-width:84px!important;font-size:11px!important;padding:4px!important}
    .al-icoon[title="Berichten"]{display:none}
    .al-ik summary{padding:2px!important}
}

/* ── Nieuwe versie (okt 2026): blauwe iconen en socials in de voet ── */
.al-punten span svg{width:26px;height:26px;fill:#2a8bff;filter:drop-shadow(0 0 6px rgba(42,139,255,.45))}
.al-voet__links{align-items:center}
.al-voet__links>a{order:4;font-size:12.5px}.al-voet__layout{order:5}.al-breuk{order:3;flex-basis:100%;height:0}
.al-socials{order:1;display:flex;align-items:center;gap:14px}
.al-voet__links>a.al-omhoog{order:2;margin-left:14px}
.al-socials i svg{width:20px;height:20px;fill:#cfe0f5;display:block;opacity:.85}
.al-socials em{font-style:normal;font-size:12.5px;color:#7f93ad}
@media (max-width:820px){.al-socials{justify-content:center}}

/* ══════════ Eigen stijl "Alien Attack" ══════════ */
body.layout-alien{background:radial-gradient(ellipse 60% 40% at 50% 0%,rgba(60,90,255,.18),transparent 70%),#04060d!important}
body.layout-alien::before,body.layout-alien::after{display:block!important;opacity:.6!important;width:300px!important;background:url(images/alien/zijkant.jpg) center/cover no-repeat!important}
@media (max-width:1700px){body.layout-alien::before,body.layout-alien::after{opacity:.3!important}}
@media (max-width:820px){body.layout-alien::before,body.layout-alien::after{display:none!important}}
/* sci-fi randen: cyaan gloed rond de blokken */
.al-blok,.al-welkom,.al-pagina,.al-tabs{border:1px solid rgba(60,200,255,.35)!important;box-shadow:0 0 14px rgba(40,170,255,.18),inset 0 0 18px rgba(40,170,255,.05)!important}
.al-kop img{border-bottom:1px solid rgba(60,200,255,.45);box-shadow:0 6px 24px rgba(40,170,255,.25)}
/* zes tegels */
.al-tegels{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:12px 0 16px}
.al-tegels a{display:block;border-radius:10px;overflow:hidden;border:1px solid rgba(60,200,255,.4);box-shadow:0 0 12px rgba(40,170,255,.2);transition:transform .15s,box-shadow .15s}
.al-tegels a:hover{transform:translateY(-3px);box-shadow:0 0 20px rgba(60,200,255,.45)}
.al-tegels img{display:block;width:100%;height:auto;aspect-ratio:300/250;object-fit:cover}
.al-kaarten a{border:1px solid rgba(60,200,255,.35);box-shadow:0 0 12px rgba(40,170,255,.18)}
.al-welkom__beeld{width:68%!important}
@media (max-width:1100px){.al-tegels{grid-template-columns:repeat(3,1fr)}}
@media (max-width:520px){.al-tegels{grid-template-columns:1fr 1fr}}