:root {
  --bg: #07101f;
  --bg-soft: #0c1730;
  --panel: rgba(11, 21, 42, 0.9);
  --panel-2: rgba(16, 30, 60, 0.92);
  --text: #eef4ff;
  --muted: #b9c7e6;
  --line: rgba(255,255,255,0.08);
  --brand: #82d8ff;
  --accent: #ffc96b;
  --accent-2: #ff8d67;
  --shadow: 0 18px 60px rgba(0,0,0,0.34);
  --radius: 24px;
  --radius-sm: 16px;
  --max: 1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 20% 20%, rgba(130,216,255,0.10), transparent 24%),
    radial-gradient(circle at 80% 0%, rgba(255,141,103,0.12), transparent 22%),
    linear-gradient(180deg, #050b16 0%, #081328 55%, #09162d 100%);
  line-height:1.65;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(var(--max), calc(100% - 32px));margin:0 auto}
.topbar{
  position:sticky;top:0;z-index:50;
  backdrop-filter: blur(16px);
  background:rgba(6,12,24,0.82);
  border-bottom:1px solid var(--line);
}
.topbar-inner{display:flex;align-items:center;gap:18px;padding:12px 0}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
.brand img{width:54px;height:54px;object-fit:contain;background:rgba(255,255,255,0.04);border-radius:14px;padding:8px}
.brand span{display:flex;flex-direction:column;line-height:1.1}
.brand strong{font-size:1rem}
.brand small{color:var(--muted);font-size:.8rem}
.nav{display:flex;flex-wrap:wrap;gap:8px;flex:1}
.nav a{padding:10px 14px;border-radius:999px;color:var(--muted);font-size:.95rem;border:1px solid transparent}
.nav a:hover,.nav a.active{background:rgba(255,255,255,0.06);border-color:var(--line);color:var(--text)}
.topbar-actions{display:flex;align-items:center;gap:10px}
main{padding-bottom:64px}
.hero,.page-hero{padding:48px 0 18px}
.hero-grid,.page-hero-grid,.page-hero-wrap{display:grid;grid-template-columns:1.08fr .92fr;gap:26px;align-items:stretch}
.kicker{color:var(--accent);text-transform:uppercase;letter-spacing:.14em;font-size:.78rem;font-weight:700;margin-bottom:14px}
h1{font-size:clamp(2.2rem,5vw,4.3rem);line-height:1.02;margin:0 0 18px}
h2{font-size:clamp(1.5rem,3vw,2.4rem);line-height:1.1;margin:0 0 14px}
h3{font-size:1.15rem;margin:0 0 10px}
p{margin:0 0 14px;color:var(--muted)}
.lead{font-size:1.13rem;color:var(--text)}
.hero-copy,.hero-card,.panel,.stage,.image-panel,.section-nav,.mini-card,.fact-card,.quote-box,.source-box{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.hero-copy{padding:34px}
.hero-card,.image-panel{overflow:hidden}
.hero-card img,.cover-img{width:100%;height:100%;object-fit:cover;min-height:320px}
.hero-actions,.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:999px;font-weight:700;border:1px solid var(--line);background:rgba(255,255,255,0.04)}
.btn-primary{background:linear-gradient(135deg, var(--brand), #b5f0ff);color:#062238;border:none}
.btn-secondary:hover,.btn:hover{transform:translateY(-1px)}
.section{padding:18px 0}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.panel{padding:28px}
.panel strong{color:var(--text)}
.fact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.fact{padding:16px;border-radius:18px;background:var(--panel-2);border:1px solid var(--line)}
.fact .label{font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;color:var(--brand);margin-bottom:5px}
.fact .value{font-size:1.03rem;font-weight:700}
.topic-list,.subnav-list{display:grid;gap:12px}
.topic,.subnav-link{padding:15px 16px;border-radius:18px;background:var(--panel-2);border:1px solid var(--line)}
.topic strong,.subnav-link strong{display:block;margin-bottom:4px}
.planet-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.planet-card,.subpage-card{overflow:hidden;background:var(--panel);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);display:flex;flex-direction:column}
.planet-card img,.subpage-card img{height:230px;object-fit:cover;width:100%}
.planet-card .content,.subpage-card .content{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1}
.breadcrumbs{color:var(--muted);font-size:.92rem;margin-bottom:12px}
.section-nav{padding:18px 20px}
.section-nav .subnav-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.stage{padding:26px}
.figure-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:22px;align-items:start}
.image-panel figure{margin:0}
.image-panel img{width:100%;max-height:620px;object-fit:contain;background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01))}
.image-panel figcaption{padding:14px 18px;border-top:1px solid var(--line);color:var(--muted)}
.copy-stack{display:grid;gap:18px}
.mini-card,.quote-box,.source-box{padding:20px}
.mini-card h3,.quote-box h3,.source-box h3{margin-bottom:8px}
.copy-columns{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.quote-box{background:linear-gradient(135deg, rgba(130,216,255,0.08), rgba(255,201,107,0.06));}
.note-list{padding-left:18px;color:var(--muted);margin:0}
.note-list li{margin-bottom:8px}
.speak-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,0.06);color:var(--text);font-weight:700;cursor:pointer}
.speak-btn:hover{background:rgba(255,255,255,0.1)}
.speak-btn.is-speaking{background:rgba(255,141,103,0.2);border-color:rgba(255,141,103,0.45)}
.hero-copy > .speak-btn,.panel > .speak-btn,.mini-card > .speak-btn,.image-panel > .speak-btn,.subpage-card .content > .speak-btn{margin-bottom:14px}
.callout{background:linear-gradient(135deg, rgba(255,201,107,0.09), rgba(255,141,103,0.07))}
.footer{padding:30px 0 60px;color:var(--muted)}
.footer-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:20px}
.lightbox{position:fixed;inset:0;background:rgba(2,6,16,.92);display:none;align-items:center;justify-content:center;padding:24px;z-index:120}
.lightbox.open{display:flex}.lightbox img{max-width:min(1200px,95vw);max-height:86vh;border-radius:24px}.lightbox button{position:absolute;top:18px;right:18px}
.badge{display:inline-flex;padding:7px 12px;border-radius:999px;background:rgba(130,216,255,.08);color:var(--brand);border:1px solid var(--line);font-size:.86rem;font-weight:700}
@media (max-width:1080px){
  .hero-grid,.page-hero-grid,.page-hero-wrap,.figure-grid,.grid-2,.footer-grid{grid-template-columns:1fr}
  .planet-grid,.grid-3{grid-template-columns:repeat(2,1fr)}
  .section-nav .subnav-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:760px){
  .topbar-inner{flex-wrap:wrap}
  .nav{order:3;width:100%}
  .planet-grid,.grid-3,.fact-grid,.copy-columns,.section-nav .subnav-grid{grid-template-columns:1fr}
  .hero-copy,.panel,.stage{padding:22px}
  h1{font-size:2.3rem}
}


.brand{padding:6px 10px;border-radius:20px;background:linear-gradient(135deg, rgba(255,255,255,.08), rgba(130,216,255,.06));border:1px solid rgba(255,255,255,.08);box-shadow:0 12px 35px rgba(0,0,0,.25)}
.brand img{width:190px;height:auto;object-fit:contain;background:transparent;border-radius:0;padding:0;filter:drop-shadow(0 6px 18px rgba(130,216,255,.22))}
.brand span strong{font-size:1.02rem}
.brand span small{font-size:.82rem;opacity:.95}
.topbar-actions .speak-btn{background:linear-gradient(135deg, var(--accent), #ffdca0);color:#1b1407;border:none;box-shadow:0 10px 24px rgba(255,201,107,.24)}
.topbar-actions .speak-btn:hover,.floating-voice:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(255,201,107,.25)}
.floating-voice{position:fixed;right:18px;bottom:18px;z-index:90;background:linear-gradient(135deg, var(--brand), #d0f5ff);color:#062238;border:none;box-shadow:0 16px 36px rgba(0,0,0,.34);padding:14px 18px;font-size:1rem}
.floating-voice.is-speaking{background:linear-gradient(135deg, var(--accent-2), #ffbe8f);color:#241007}
.lightbox-close{background:rgba(255,255,255,.1);color:var(--text);border:1px solid var(--line);border-radius:999px;padding:10px 16px;cursor:pointer}
.lightbox-close:hover{background:rgba(255,255,255,.16)}
.hero-copy,.panel,.mini-card,.stage,.image-panel,.subpage-card,.section-nav{position:relative}
.mini-card .speak-btn.auto-speak,.subpage-card .content .speak-btn.auto-speak,.panel .speak-btn.auto-speak{margin-bottom:12px;background:rgba(130,216,255,.08)}
@media (max-width:760px){
  .brand{width:100%;justify-content:center}
  .brand img{width:160px}
  .topbar-actions{width:100%;justify-content:flex-end}
  .floating-voice{right:12px;left:12px;bottom:12px;justify-content:center}
}

/* VisibleGalaxies.de v8 - professionelle sterrenhemel en visuele upgrade */
:root{
  --space-deep:#030712;
  --space-blue:#071529;
  --space-card:rgba(8,18,38,.78);
  --space-card-strong:rgba(10,25,52,.88);
  --space-border:rgba(178,225,255,.17);
  --space-glow:0 22px 80px rgba(51,154,255,.14), 0 10px 35px rgba(0,0,0,.42);
  --space-glow-hover:0 30px 95px rgba(130,216,255,.22), 0 14px 44px rgba(0,0,0,.48);
}
body{
  background-color:var(--space-deep);
  background-image:
    linear-gradient(180deg, rgba(3,7,18,.24), rgba(3,7,18,.76) 65%, rgba(3,7,18,.94)),
    url('../images/starfield-visiblegalaxies.svg'),
    radial-gradient(circle at 16% 18%, rgba(106,190,255,.18), transparent 32%),
    radial-gradient(circle at 88% 8%, rgba(255,201,107,.13), transparent 28%),
    linear-gradient(180deg, #040816 0%, #081329 48%, #050914 100%);
  background-attachment:fixed, fixed, fixed, fixed, fixed;
  background-size:cover, cover, cover, cover, cover;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background:
    radial-gradient(circle at 10% 30%, rgba(130,216,255,.10), transparent 26%),
    radial-gradient(circle at 82% 74%, rgba(255,201,107,.09), transparent 30%),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size:auto, auto, 96px 96px, 96px 96px;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.65), rgba(0,0,0,.08) 75%);
}
.topbar{
  background:rgba(3,8,20,.76);
  border-bottom:1px solid rgba(178,225,255,.16);
  box-shadow:0 18px 60px rgba(0,0,0,.28);
}
.brand{
  background:linear-gradient(135deg, rgba(130,216,255,.13), rgba(255,255,255,.045));
  border-color:rgba(178,225,255,.18);
}
.nav a{
  position:relative;
  overflow:hidden;
}
.nav a::after{
  content:"";
  position:absolute;
  left:14px;
  right:14px;
  bottom:6px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, transparent, rgba(130,216,255,.9), transparent);
  transform:scaleX(0);
  transition:transform .22s ease;
}
.nav a:hover::after,.nav a.active::after{transform:scaleX(1)}
.hero,.page-hero{padding-top:64px}
.hero-copy,.hero-card,.panel,.stage,.image-panel,.section-nav,.mini-card,.fact-card,.quote-box,.source-box,.planet-card,.subpage-card{
  background:linear-gradient(180deg, rgba(12,27,57,.84), rgba(5,12,28,.78));
  border:1px solid var(--space-border);
  box-shadow:var(--space-glow);
  backdrop-filter:blur(14px) saturate(118%);
}
.hero-copy::before,.panel::before,.stage::before,.mini-card::before,.planet-card::before,.subpage-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(135deg, rgba(255,255,255,.13), transparent 28%, transparent 72%, rgba(130,216,255,.08));
  opacity:.72;
}
.hero-copy,.panel,.stage,.mini-card,.planet-card,.subpage-card{overflow:hidden}
.kicker{color:#ffe2a3;text-shadow:0 0 22px rgba(255,201,107,.25)}
h1,h2,h3{letter-spacing:-.025em;text-wrap:balance}
h1{
  text-shadow:0 0 36px rgba(130,216,255,.18);
}
.lead{color:#f4f8ff}
p{color:#c6d4ee}
.btn{
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease;
}
.btn-primary{
  background:linear-gradient(135deg, #8fe4ff, #d8f8ff 55%, #fff0bd);
  color:#041827;
  box-shadow:0 14px 34px rgba(130,216,255,.22);
}
.btn-secondary,.btn:not(.btn-primary){
  background:rgba(255,255,255,.055);
  border-color:rgba(178,225,255,.16);
}
.btn:hover{box-shadow:0 18px 38px rgba(130,216,255,.20)}
.planet-card,.subpage-card,.mini-card,.topic,.subnav-link,.fact{
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
}
.planet-card:hover,.subpage-card:hover,.mini-card:hover,.topic:hover,.subnav-link:hover,.fact:hover{
  transform:translateY(-4px);
  border-color:rgba(130,216,255,.34);
  box-shadow:var(--space-glow-hover);
}
.planet-card img,.subpage-card img,.hero-card img,.cover-img{
  filter:saturate(1.08) contrast(1.05);
}
.planet-card img,.subpage-card img{
  border-bottom:1px solid rgba(178,225,255,.12);
}
.image-panel img{
  background:
    radial-gradient(circle at 50% 50%, rgba(130,216,255,.09), transparent 44%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(0,0,0,.10));
}
.fact,.topic,.subnav-link{
  background:linear-gradient(180deg, rgba(18,38,76,.80), rgba(8,20,43,.72));
  border-color:rgba(178,225,255,.13);
}
.fact .label{color:#a7ecff}
.badge{
  background:rgba(130,216,255,.11);
  border-color:rgba(130,216,255,.24);
  color:#c9f6ff;
}
.callout,.quote-box{
  background:
    radial-gradient(circle at 18% 0%, rgba(255,201,107,.18), transparent 38%),
    linear-gradient(135deg, rgba(24,41,78,.84), rgba(16,24,50,.78));
}
.section-nav .subnav-grid{gap:16px}
.subnav-link span{color:#c8d7ef}
.footer{
  border-top:1px solid rgba(178,225,255,.12);
  background:linear-gradient(180deg, rgba(3,8,20,0), rgba(3,8,20,.48));
}
::selection{background:rgba(130,216,255,.35);color:#fff}
@media (prefers-reduced-motion:no-preference){
  .hero-card,.image-panel{animation:spaceFloat 9s ease-in-out infinite alternate}
  @keyframes spaceFloat{from{transform:translateY(0)}to{transform:translateY(-7px)}}
}
@media (max-width:760px){
  body{background-attachment:scroll, scroll, scroll, scroll, scroll}
  .hero,.page-hero{padding-top:34px}
  .planet-card:hover,.subpage-card:hover,.mini-card:hover,.topic:hover,.subnav-link:hover,.fact:hover{transform:none}
}

/* VisibleGalaxies.de v9 - strakkere premium space design upgrade */
:root{
  --vg9-bg-0:#02040b;
  --vg9-bg-1:#050b18;
  --vg9-card:rgba(7,17,37,.80);
  --vg9-card-strong:rgba(9,22,48,.92);
  --vg9-stroke:rgba(190,230,255,.18);
  --vg9-stroke-strong:rgba(142,220,255,.34);
  --vg9-cyan:#8ce9ff;
  --vg9-cyan-soft:#c8f6ff;
  --vg9-gold:#ffd074;
  --vg9-violet:#b7a1ff;
  --vg9-radius:22px;
  --vg9-radius-small:15px;
  --vg9-shadow:0 28px 90px rgba(0,0,0,.44), 0 0 0 1px rgba(255,255,255,.025) inset;
  --vg9-shadow-hover:0 34px 110px rgba(75,174,255,.24), 0 18px 48px rgba(0,0,0,.50);
}
html{scroll-padding-top:100px}
body{
  font-feature-settings:"kern" 1, "liga" 1;
  letter-spacing:.002em;
  background-color:var(--vg9-bg-0);
  background-image:
    radial-gradient(ellipse at 50% -8%, rgba(122,207,255,.22), transparent 32%),
    radial-gradient(ellipse at 92% 10%, rgba(255,208,116,.12), transparent 28%),
    radial-gradient(ellipse at 5% 58%, rgba(183,161,255,.11), transparent 32%),
    linear-gradient(180deg, rgba(2,4,11,.30), rgba(2,4,11,.82) 58%, rgba(2,4,11,.96)),
    url('../images/starfield-visiblegalaxies.svg'),
    linear-gradient(180deg, #02040b 0%, #061124 45%, #02040b 100%);
  background-size:cover, cover, cover, cover, cover, cover;
  background-attachment:fixed, fixed, fixed, fixed, fixed, fixed;
}
body::before{
  z-index:0;
  opacity:.42;
  background:
    linear-gradient(90deg, rgba(140,233,255,.020) 1px, transparent 1px),
    linear-gradient(180deg, rgba(140,233,255,.020) 1px, transparent 1px),
    radial-gradient(circle at 18% 12%, rgba(140,233,255,.12), transparent 18%),
    radial-gradient(circle at 88% 72%, rgba(255,208,116,.08), transparent 22%);
  background-size:120px 120px, 120px 120px, auto, auto;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.75), rgba(0,0,0,.24) 72%, rgba(0,0,0,.08));
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:
    radial-gradient(ellipse at center, transparent 42%, rgba(0,0,0,.34) 100%),
    linear-gradient(180deg, rgba(255,255,255,.020), transparent 25%, transparent 70%, rgba(0,0,0,.18));
}
.topbar, main, .footer{position:relative;z-index:1}
.container{width:min(1260px, calc(100% - 36px))}
.topbar{
  background:linear-gradient(180deg, rgba(4,9,20,.90), rgba(4,9,20,.70));
  border-bottom:1px solid rgba(190,230,255,.16);
  box-shadow:0 14px 50px rgba(0,0,0,.34);
}
.topbar::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg, transparent, rgba(140,233,255,.62), rgba(255,208,116,.34), transparent);
}
.topbar-inner{padding:9px 0;gap:14px}
.brand{
  padding:5px 10px;
  border-radius:18px;
  background:linear-gradient(135deg, rgba(140,233,255,.12), rgba(255,255,255,.035));
  box-shadow:0 12px 32px rgba(0,0,0,.24), 0 0 0 1px rgba(255,255,255,.035) inset;
}
.brand img{width:166px;filter:drop-shadow(0 8px 22px rgba(140,233,255,.22))}
.brand span strong{font-size:.98rem;letter-spacing:-.015em}.brand span small{font-size:.78rem}
.nav{gap:6px;align-items:center;justify-content:flex-end}
.nav a{
  padding:9px 12px;
  border-radius:999px;
  font-size:.91rem;
  line-height:1;
  color:#d3def3;
  background:rgba(255,255,255,.018);
}
.nav a:hover,.nav a.active{
  color:#fff;
  background:linear-gradient(135deg, rgba(140,233,255,.12), rgba(255,255,255,.045));
  border-color:rgba(140,233,255,.22);
}
.nav a::after{bottom:4px;height:1px;left:16px;right:16px}
.hero,.page-hero{padding-top:70px;padding-bottom:26px}
.hero-grid,.page-hero-grid,.page-hero-wrap{gap:30px}
.hero-copy,.hero-card,.panel,.stage,.image-panel,.section-nav,.mini-card,.fact-card,.quote-box,.source-box,.planet-card,.subpage-card{
  border-radius:var(--vg9-radius);
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018)),
    linear-gradient(180deg, var(--vg9-card-strong), var(--vg9-card));
  border:1px solid var(--vg9-stroke);
  box-shadow:var(--vg9-shadow);
  backdrop-filter:blur(18px) saturate(128%);
}
.hero-copy,.panel,.stage,.mini-card,.planet-card,.subpage-card,.section-nav,.image-panel{position:relative;overflow:hidden}
.hero-copy::before,.panel::before,.stage::before,.mini-card::before,.planet-card::before,.subpage-card::before,.section-nav::before,.image-panel::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:
    linear-gradient(135deg, rgba(255,255,255,.16), transparent 22%, transparent 76%, rgba(140,233,255,.10)),
    radial-gradient(circle at 18% 0%, rgba(140,233,255,.13), transparent 24%);
  opacity:.60;
}
.hero-copy > *, .panel > *, .stage > *, .mini-card > *, .section-nav > *, .image-panel > *, .planet-card > *, .subpage-card > *{position:relative;z-index:1}
.hero-copy{padding:40px}.panel{padding:32px}.stage{padding:30px}.mini-card,.quote-box,.source-box{padding:24px}
.kicker{
  display:inline-flex;
  align-items:center;
  gap:9px;
  color:var(--vg9-gold);
  letter-spacing:.17em;
  font-size:.75rem;
}
.kicker::before{
  content:"";
  width:34px;height:1px;
  background:linear-gradient(90deg, var(--vg9-gold), transparent);
}
h1,h2,h3{letter-spacing:-.035em;text-wrap:balance;color:#f7fbff}
h1{
  font-size:clamp(2.45rem,5.2vw,4.75rem);
  line-height:.98;
  max-width:13ch;
  text-shadow:0 0 44px rgba(140,233,255,.22);
}
h2{font-size:clamp(1.62rem,3vw,2.55rem)}
h3{font-size:1.18rem}
.lead{font-size:1.17rem;line-height:1.72;color:#f1f7ff;max-width:72ch}
p{color:#cbd8ef;line-height:1.72}.panel p,.mini-card p,.copy-stack p{max-width:78ch}
.btn,.speak-btn{
  border-radius:999px;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease, color .18s ease;
}
.btn{padding:12px 17px;min-height:46px}.btn-primary{
  background:linear-gradient(135deg, #8ce9ff 0%, #d9fbff 52%, #ffe5a3 100%);
  color:#02101d;
  box-shadow:0 16px 40px rgba(140,233,255,.22), 0 0 0 1px rgba(255,255,255,.25) inset;
}
.btn-secondary,.btn:not(.btn-primary),.speak-btn{
  background:rgba(255,255,255,.055);
  border-color:rgba(190,230,255,.18);
  color:#eef6ff;
}
.btn:hover,.speak-btn:hover{transform:translateY(-2px);box-shadow:0 18px 42px rgba(140,233,255,.18);border-color:var(--vg9-stroke-strong)}
.hero-card,.image-panel{background:#030712}
.hero-card img,.cover-img,.planet-card img,.subpage-card img{
  filter:saturate(1.12) contrast(1.08) brightness(.98);
  transform:translateZ(0);
}
.planet-card img,.subpage-card img{height:238px;transition:transform .36s ease, filter .36s ease}
.planet-card:hover img,.subpage-card:hover img{transform:scale(1.035);filter:saturate(1.20) contrast(1.10) brightness(1.03)}
.planet-card:hover,.subpage-card:hover,.mini-card:hover,.topic:hover,.subnav-link:hover,.fact:hover{
  transform:translateY(-5px);
  border-color:var(--vg9-stroke-strong);
  box-shadow:var(--vg9-shadow-hover);
}
.planet-card .content,.subpage-card .content{padding:22px;gap:11px}.planet-card .content h3,.subpage-card .content h3{margin-bottom:2px}
.fact-grid{gap:12px}.fact,.topic,.subnav-link{
  border-radius:var(--vg9-radius-small);
  background:
    linear-gradient(180deg, rgba(140,233,255,.065), rgba(255,255,255,.020)),
    rgba(12,29,62,.72);
  border-color:rgba(190,230,255,.14);
}
.fact .label{font-size:.76rem;color:var(--vg9-cyan);letter-spacing:.105em}.fact .value{font-size:1.05rem;color:#fff}
.section-nav{padding:18px}.section-nav .subnav-grid{gap:12px}.subnav-link{padding:16px}
.copy-columns{gap:18px}.quote-box,.callout{
  background:
    radial-gradient(circle at 12% 8%, rgba(255,208,116,.18), transparent 30%),
    radial-gradient(circle at 92% 86%, rgba(140,233,255,.10), transparent 32%),
    linear-gradient(135deg, rgba(20,39,78,.90), rgba(8,18,40,.84));
}
.badge{
  color:var(--vg9-cyan-soft);
  background:rgba(140,233,255,.10);
  border-color:rgba(140,233,255,.26);
  box-shadow:0 10px 26px rgba(0,0,0,.18);
}
.image-panel figcaption{padding:15px 18px;color:#c6d3eb;background:rgba(0,0,0,.18)}
.breadcrumbs{font-size:.9rem;color:#aec0dd}.breadcrumbs a:hover{color:var(--vg9-cyan)}
.note-list{color:#cbd8ef}.note-list li::marker{color:var(--vg9-cyan)}
.footer{
  margin-top:40px;
  padding-top:34px;
  border-top:1px solid rgba(190,230,255,.13);
  background:linear-gradient(180deg, rgba(2,4,11,0), rgba(2,4,11,.70));
}
.footer a{color:#eaf4ff}.footer a:hover{color:var(--vg9-cyan)}
.lightbox img{box-shadow:0 35px 120px rgba(0,0,0,.62);border:1px solid rgba(190,230,255,.20)}
:focus-visible{outline:3px solid rgba(140,233,255,.72);outline-offset:3px;border-radius:12px}
@media (prefers-reduced-motion:no-preference){
  .hero-copy{animation:vg9Reveal .55s ease both}.hero-card{animation:vg9Reveal .70s ease both}.panel,.stage,.section-nav{animation:vg9Reveal .52s ease both}
  @keyframes vg9Reveal{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
}
@media (max-width:1080px){
  h1{max-width:16ch}.nav{justify-content:flex-start}.hero,.page-hero{padding-top:44px}
}
@media (max-width:760px){
  html{scroll-padding-top:150px}
  body{background-attachment:scroll, scroll, scroll, scroll, scroll, scroll}
  .container{width:min(100% - 24px, 1260px)}
  .topbar-inner{gap:10px}.brand{justify-content:flex-start}.brand img{width:145px}
  .nav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin;padding-bottom:4px}.nav a{white-space:nowrap;padding:10px 12px}
  .hero-copy,.panel,.stage{padding:22px}.mini-card,.quote-box,.source-box{padding:20px}
  .planet-card img,.subpage-card img{height:210px}
  h1{font-size:2.45rem;max-width:100%}.lead{font-size:1.05rem}
}

/* VisibleGalaxies.de v10 - strakkere navigatie, mobiel menu, breadcrumbs en inhoudsnavigatie */
.skip-link{
  position:fixed;
  left:16px;
  top:12px;
  z-index:1000;
  transform:translateY(-160%);
  background:#fff;
  color:#061124;
  padding:10px 14px;
  border-radius:999px;
  font-weight:800;
  box-shadow:0 12px 30px rgba(0,0,0,.35);
  transition:transform .18s ease;
}
.skip-link:focus{transform:translateY(0)}
.topbar{position:sticky;top:0;z-index:200}
.topbar-inner{position:relative}
.nav-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  gap:8px;
  border:1px solid rgba(190,230,255,.22);
  background:linear-gradient(135deg, rgba(140,233,255,.14), rgba(255,255,255,.045));
  color:#f7fbff;
  border-radius:999px;
  padding:10px 14px;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 10px 28px rgba(0,0,0,.25);
}
.nav-toggle:hover,.nav-toggle:focus-visible{border-color:rgba(140,233,255,.48);outline:none;box-shadow:0 0 0 4px rgba(140,233,255,.10),0 12px 30px rgba(0,0,0,.28)}
.nav-jump{
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:auto;
  white-space:nowrap;
}
.nav-jump label{
  color:#aebfda;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.nav-jump select{
  appearance:none;
  border:1px solid rgba(190,230,255,.18);
  color:#eef7ff;
  background:
    linear-gradient(135deg, rgba(140,233,255,.10), rgba(255,255,255,.035)),
    #061326;
  border-radius:999px;
  padding:10px 40px 10px 14px;
  font-weight:750;
  max-width:240px;
  cursor:pointer;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
}
.nav-jump::after{
  content:"⌄";
  color:#8ce9ff;
  margin-left:-34px;
  pointer-events:none;
  font-weight:900;
}
.nav a[aria-current="page"]{box-shadow:0 0 0 1px rgba(140,233,255,.12) inset,0 10px 24px rgba(140,233,255,.08)}
.site-trail{
  margin:18px auto -22px;
  position:relative;
  z-index:2;
}
.site-trail-inner{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  width:fit-content;
  max-width:100%;
  padding:9px 13px;
  border:1px solid rgba(190,230,255,.14);
  border-radius:999px;
  background:linear-gradient(135deg, rgba(9,24,50,.84), rgba(5,12,28,.72));
  box-shadow:0 12px 34px rgba(0,0,0,.24);
  backdrop-filter:blur(14px);
  color:#b9c9e2;
  font-size:.9rem;
}
.site-trail a{color:#eaf7ff;font-weight:800}.site-trail a:hover{color:#8ce9ff}.site-trail span{color:#8ce9ff}.site-trail .sep{opacity:.55;color:#c6d4ee}
.nav-enhance-section{padding-top:26px;padding-bottom:0}
.nav-smart-panel{
  padding:18px;
  border-radius:24px;
  background:linear-gradient(180deg, rgba(10,28,58,.76), rgba(4,11,26,.74));
  border:1px solid rgba(190,230,255,.14);
  box-shadow:0 18px 55px rgba(0,0,0,.26);
  backdrop-filter:blur(16px);
}
.nav-smart-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.nav-smart-heading h2{font-size:1.2rem;margin:0}.nav-smart-heading p{margin:0;color:#aebfda;font-size:.95rem}
.chapter-quick-links,.toc-links,.next-prev-grid{
  display:grid;
  gap:10px;
}
.chapter-quick-links{grid-template-columns:repeat(auto-fit,minmax(168px,1fr))}
.toc-links{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.chapter-quick-links a,.toc-links a,.next-prev-card{
  display:flex;
  flex-direction:column;
  gap:3px;
  min-height:54px;
  padding:12px 14px;
  border-radius:18px;
  border:1px solid rgba(190,230,255,.13);
  background:linear-gradient(135deg, rgba(255,255,255,.055), rgba(140,233,255,.035));
  color:#eef7ff;
  box-shadow:0 10px 28px rgba(0,0,0,.18);
}
.chapter-quick-links a:hover,.toc-links a:hover,.next-prev-card:hover{
  transform:translateY(-2px);
  border-color:rgba(140,233,255,.38);
  box-shadow:0 16px 38px rgba(0,0,0,.26),0 0 0 1px rgba(140,233,255,.08) inset;
}
.chapter-quick-links a.is-current,.toc-links a.is-current{
  border-color:rgba(255,208,116,.44);
  background:linear-gradient(135deg, rgba(255,208,116,.14), rgba(140,233,255,.06));
}
.chapter-quick-links strong,.toc-links strong,.next-prev-card strong{font-size:.98rem}.chapter-quick-links span,.toc-links span,.next-prev-card span{color:#aebfda;font-size:.86rem;line-height:1.35}
.toc-details summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:#f7fbff;
  font-size:1.2rem;
  font-weight:900;
}
.toc-details summary::-webkit-details-marker{display:none}.toc-details summary::after{content:"⌄";color:#8ce9ff}.toc-details[open] summary::after{content:"⌃"}
.toc-details .toc-links{margin-top:14px}
.next-prev-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.next-prev-card.prev{text-align:left}.next-prev-card.next{text-align:right;align-items:flex-end}.next-prev-card .label{font-size:.76rem;text-transform:uppercase;letter-spacing:.12em;color:#8ce9ff;font-weight:900}
.page-backtop{
  position:fixed;
  right:18px;
  bottom:82px;
  z-index:91;
  border:1px solid rgba(190,230,255,.18);
  background:linear-gradient(135deg, rgba(10,28,58,.92), rgba(4,11,26,.88));
  color:#f7fbff;
  border-radius:999px;
  width:46px;
  height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  cursor:pointer;
  opacity:0;
  transform:translateY(12px);
  pointer-events:none;
  transition:opacity .18s ease, transform .18s ease, border-color .18s ease;
  box-shadow:0 16px 36px rgba(0,0,0,.34);
}
.page-backtop.is-visible{opacity:1;transform:translateY(0);pointer-events:auto}.page-backtop:hover{border-color:rgba(140,233,255,.42)}
@media (max-width:1080px){
  .nav-toggle{display:inline-flex;order:2}
  .nav{
    display:none;
    order:5;
    width:100%;
    padding:12px;
    margin-top:8px;
    border:1px solid rgba(190,230,255,.13);
    border-radius:24px;
    background:linear-gradient(180deg, rgba(4,11,26,.96), rgba(8,20,43,.92));
    box-shadow:0 18px 44px rgba(0,0,0,.32);
    justify-content:flex-start;
    max-height:66vh;
    overflow:auto;
  }
  .nav.is-open{display:flex}
  .nav a{width:calc(50% - 4px);justify-content:center;text-align:center;padding:13px 10px}
  .nav-jump{order:4;width:100%;margin-left:0;justify-content:flex-end}.nav-jump select{max-width:min(100%,360px)}
  .topbar-actions{order:3;margin-left:auto}
}
@media (max-width:760px){
  .topbar-inner{gap:10px}.brand{order:1;width:auto;flex:1;justify-content:flex-start}.brand img{width:140px}.brand span{display:none}
  .topbar-actions{width:auto}.topbar-actions .speak-btn{padding:10px 12px;font-size:.88rem}.nav-toggle{padding:10px 12px}
  .nav a{width:100%}.site-trail{margin:12px auto -14px}.site-trail-inner{border-radius:18px;font-size:.84rem;width:100%}
  .nav-smart-heading{align-items:flex-start;flex-direction:column}.chapter-quick-links,.toc-links,.next-prev-grid{grid-template-columns:1fr}.next-prev-card.next{text-align:left;align-items:flex-start}
  .page-backtop{right:12px;bottom:74px;width:42px;height:42px}.floating-voice{bottom:12px}
}

/* VisibleGalaxies.de v11 extra data blocks */
.vg-pro-v11 .data-list{display:grid;grid-template-columns:minmax(130px,220px) 1fr;gap:.55rem 1rem;margin:1rem 0 0}.vg-pro-v11 .data-list dt{font-weight:800;color:#d7e8ff}.vg-pro-v11 .data-list dd{margin:0;color:#f3f7ff}.vg-pro-v11 .small-note{font-size:.95rem;opacity:.9}.vg-pro-v11 strong{color:#ffffff}@media(max-width:680px){.vg-pro-v11 .data-list{grid-template-columns:1fr}.vg-pro-v11 .data-list dt{margin-top:.55rem}}


/* Visible Galaxies DE v13 - eindronde extra check */
.vg-pro-v13 .panel{position:relative;overflow:hidden;}
.vg-pro-v13 .panel:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,rgba(114,185,255,.10),rgba(255,255,255,0) 44%,rgba(180,147,255,.08));}
.vg-pro-v13 h2{letter-spacing:-.02em;}
.vg-checklist ul{list-style:none;margin:0;padding:0;display:grid;gap:.75rem;}
.vg-checklist li{padding:.85rem 1rem .85rem 2.4rem;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(255,255,255,.045);position:relative;}
.vg-checklist li:before{content:"✓";position:absolute;left:.9rem;top:.8rem;width:1.1rem;height:1.1rem;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:.78rem;background:rgba(97,222,178,.18);color:#9ff5d1;border:1px solid rgba(159,245,209,.35);}

/* v14 Impressum update */
.vg-legal-links .panel{border-left:1px solid rgba(148,163,184,.32)}
.vg-checklist ul{margin:0;padding-left:1.15rem}.vg-checklist li{margin:.55rem 0}