/* ══════════════════════════════════════════════════════════════════════
   QUEMACHINA-MC
   Palette aus dem Logo: Navy / Blau / Cyan / Gold
   ══════════════════════════════════════════════════════════════════════ */

:root {
  --navy-0:#020a1e; --navy-1:#04123a; --navy-2:#061535;
  --panel:#0e224f; --panel-2:#0a1730;
  --blue:#2c70b6; --blue-dk:#19549a; --blue-lt:#3a7dc1;
  --cyan:#76dff0; --cyan-2:#75bcf1; --cyan-3:#cdeafd;
  --gold:#ecc653; --border:#376bc1;
  --text:#dbe6f5; --text-dim:#9fb4d4;
  --maxw:1180px;
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  background:var(--navy-0);
  color:var(--text);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a { color:var(--cyan-2); text-decoration:none; }
a:hover { color:var(--cyan); }
code { font-family:'JetBrains Mono',monospace; }

/* Auswahl & Scrollbar in Markenfarbe */
::selection { background:rgba(118,223,240,0.28); color:#fff; }
::-webkit-scrollbar { width:12px; height:12px; }
::-webkit-scrollbar-track { background:var(--navy-1); }
::-webkit-scrollbar-thumb { background:#1c3a6e; border-radius:6px; border:3px solid var(--navy-1); }
::-webkit-scrollbar-thumb:hover { background:var(--blue-dk); }

/* Inline-Button (z.B. Account verknüpfen) */
.btn-inline {
  display:inline-block; font-weight:700; color:#1a1028 !important;
  background:linear-gradient(135deg,#ffe08a,var(--gold));
  padding:0.35rem 1rem; border-radius:7px; text-decoration:none !important;
  border:1px solid rgba(0,0,0,0.15); transition:transform .12s, filter .15s;
}
.btn-inline:hover { transform:translateY(-1px); filter:brightness(1.05); }

/* ── Top-Nav ─────────────────────────────────────────────────────────── */
.topnav {
  position:sticky; top:0; z-index:50;
  background:rgba(4,18,58,0.82);
  backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(55,107,193,0.25);
}
.topnav-inner {
  max-width:var(--maxw); margin:0 auto;
  display:flex; align-items:center; gap:1.5rem;
  padding:0.6rem 1.2rem;
}
.topnav-brand { display:flex; align-items:center; }
.brand-logo { height:30px; width:auto; display:block; image-rendering:pixelated; }
.topnav-links { display:flex; align-items:center; gap:0.3rem; margin-left:auto; }
.topnav-link {
  display:inline-flex; align-items:center; gap:0.3rem;
  font-family:inherit; background:none; border:0; cursor:pointer;
  color:var(--text-dim); font-weight:600; font-size:0.9rem;
  padding:0.5rem 0.85rem; border-radius:7px;
  transition:color .15s, background .15s;
}
.topnav-link:hover { color:#fff; background:rgba(55,107,193,0.14); }
.topnav-link.active { color:var(--cyan-2); }
a.topnav-link.active::after {
  content:""; display:block; position:absolute; left:0.85rem; right:0.85rem; bottom:2px;
  height:2px; border-radius:2px; background:linear-gradient(90deg,var(--cyan),var(--gold));
}
a.topnav-link.active { position:relative; }
.topnav-discord {
  color:#fff; background:linear-gradient(135deg,var(--blue),var(--blue-dk));
  border:1px solid var(--border);
}
.topnav-discord:hover { color:#fff; filter:brightness(1.1); }

/* Dropdown-Menü (Section-Reiter) */
.topnav-item.has-dropdown { position:relative; }
.topnav-item.has-dropdown.active > .topnav-section-link { color:var(--cyan-2); }
.dropdown {
  position:absolute; top:calc(100% + 6px); left:0; min-width:190px;
  background:rgba(6,21,53,0.98); backdrop-filter:blur(12px);
  border:1px solid var(--border); border-top:3px solid var(--gold);
  border-radius:10px; padding:0.4rem; z-index:60;
  box-shadow:0 14px 40px rgba(0,0,0,0.5);
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity .15s, transform .15s, visibility .15s;
}
.topnav-item.has-dropdown:hover .dropdown,
.topnav-item.has-dropdown.open .dropdown {
  opacity:1; visibility:visible; transform:translateY(0);
}
.dropdown-link {
  display:block; padding:0.5rem 0.8rem; border-radius:7px;
  color:var(--text-dim); font-weight:600; font-size:0.88rem;
  transition:background .15s, color .15s;
}
.dropdown-link:hover { background:rgba(55,107,193,0.16); color:#fff; }
.dropdown-link.active { color:var(--cyan-2); }

.topnav-burger { display:none; background:none; border:0; cursor:pointer; padding:8px; margin-left:auto; }
.topnav-burger span { display:block; width:24px; height:2px; margin:5px 0; background:var(--cyan-3); border-radius:2px; }

/* ── Hero ────────────────────────────────────────────────────────────── */
.hero {
  position:relative; min-height:clamp(520px,92vh,860px);
  display:flex; align-items:center; justify-content:center;
  overflow:hidden; text-align:center;
}
.hero-bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center bottom;
  z-index:0;
}
.hero-fade {
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(2,10,30,0.35) 0%, rgba(2,10,30,0.15) 45%, var(--navy-0) 100%);
}
.hero-render {
  position:absolute; right:max(2vw,calc(50% - 560px)); bottom:0; z-index:2;
  height:min(74vh,640px); width:auto;
  filter:drop-shadow(0 20px 40px rgba(0,0,0,0.5));
  pointer-events:none;
}
/* Zwei flankierende Skin-Renders (statische PNGs, generische Skins) */
.hero-render--right { height:min(58vh,480px); right:max(3vw,calc(50% - 600px)); }
.hero-render--left {
  height:min(52vh,430px); right:auto; left:max(3vw,calc(50% - 600px));
  transform:scaleX(-1);
}
.hero-content {
  position:relative; z-index:3;
  padding:2rem 1.2rem; max-width:760px;
}
.hero-logo {
  width:min(560px,80vw); height:auto; display:block; margin:0 auto 1.2rem;
  image-rendering:pixelated;
  filter:drop-shadow(0 6px 24px rgba(0,0,0,0.55));
}
.hero-tagline {
  font-size:clamp(1rem,2.4vw,1.35rem); font-weight:600;
  color:var(--cyan-3); margin:0 0 1.8rem; text-shadow:0 2px 12px rgba(0,0,0,0.6);
}
.hero-cta { display:flex; gap:0.9rem; justify-content:center; flex-wrap:wrap; }

.btn-play {
  display:inline-flex; flex-direction:column; align-items:center;
  gap:2px; cursor:pointer;
  background:linear-gradient(135deg,#ffe08a,var(--gold));
  color:#1a1028; border:1px solid rgba(0,0,0,0.15); border-bottom:4px solid #ad8e2d;
  padding:0.7rem 2.4rem; border-radius:10px;
  font-family:inherit; transition:transform .12s, box-shadow .15s, filter .15s;
  box-shadow:0 8px 30px rgba(236,198,83,0.25);
}
.btn-play { animation:playGlow 2.6s ease-in-out infinite; }
.btn-play:hover { transform:translateY(-2px); filter:brightness(1.05); animation:none; }
.btn-play:active { transform:translateY(0); border-bottom-width:2px; }
@keyframes playGlow {
  0%,100% { box-shadow:0 8px 30px rgba(236,198,83,0.22); }
  50%     { box-shadow:0 8px 38px rgba(236,198,83,0.42); }
}
.btn-play-main { font-size:1.15rem; font-weight:800; line-height:1; }
.btn-play-ip { font-family:'JetBrains Mono',monospace; font-size:0.72rem; font-weight:700; opacity:0.65; }
.btn-play.copied { background:linear-gradient(135deg,#8be89a,#56d04e); border-bottom-color:#3e9638; }

.btn-ghost {
  display:inline-flex; align-items:center;
  padding:0.7rem 1.8rem; border-radius:10px;
  font-weight:700; color:var(--cyan-3);
  background:rgba(14,34,79,0.6); border:1px solid var(--border); border-bottom:4px solid #22427b;
  transition:transform .12s, background .15s;
}
.btn-ghost:hover { transform:translateY(-2px); background:rgba(20,42,90,0.8); color:#fff; }
.btn-ghost:active { transform:translateY(0); border-bottom-width:2px; }

.hero-meta {
  display:flex; gap:1rem; justify-content:center; align-items:center; flex-wrap:wrap;
  margin-top:1.8rem; font-size:0.72rem; font-weight:600; letter-spacing:0.6px;
  text-transform:uppercase; color:rgba(205,234,253,0.55);
}
.hero-meta-item { display:flex; align-items:center; gap:0.4rem; }
.dot { width:7px; height:7px; border-radius:50%; display:inline-block; }
.dot-green { background:#56d04e; box-shadow:0 0 7px rgba(86,208,78,0.6); }
.dot-blue  { background:var(--cyan); box-shadow:0 0 7px rgba(118,223,240,0.6); }
.dot-gold  { background:var(--gold); box-shadow:0 0 7px rgba(236,198,83,0.6); }
.hero-sep  { width:1px; height:14px; background:rgba(118,223,240,0.18); }
.hero-scroll {
  position:absolute; bottom:14px; left:50%; transform:translateX(-50%); z-index:3;
  color:var(--cyan-2); font-size:1.4rem; opacity:0.6;
  animation:bob 1.8s ease-in-out infinite;
}
@keyframes bob { 0%,100%{transform:translate(-50%,0)} 50%{transform:translate(-50%,6px)} }

/* ── Landing-Inhalt (index.md) ───────────────────────────────────────── */
.landing {
  max-width:var(--maxw); margin:0 auto; padding:3.5rem 1.2rem 4rem;
}
.landing .section-head {
  text-align:center; margin:0 auto 2rem;
}
.landing .section-head h2 {
  font-size:clamp(1.5rem,3.4vw,2.1rem); font-weight:800; margin:0 0 0.4rem;
  color:#fff;
}
.landing .section-head p { color:var(--text-dim); margin:0; }

.feature-grid {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:1.1rem; margin:0 0 3rem;
}
.feature-card {
  position:relative; overflow:hidden;
  background:linear-gradient(160deg,var(--panel) 0%,var(--panel-2) 100%);
  border:1px solid var(--border); border-radius:12px;
  padding:1.5rem 1.4rem;
  transition:transform .15s, border-color .2s, box-shadow .2s;
}
.feature-card::before {
  content:""; position:absolute; inset:0 auto 0 0; width:3px; background:var(--blue-lt);
}
.feature-card:hover {
  transform:translateY(-4px); border-color:var(--cyan-2);
  box-shadow:0 12px 34px rgba(0,0,0,0.4),0 0 26px rgba(118,223,240,0.08);
}
.feature-card .fc-icon {
  display:inline-flex; align-items:center; justify-content:center;
  width:44px; height:44px; margin-bottom:0.9rem; border-radius:10px;
  background:rgba(55,107,193,0.16); border:1px solid rgba(55,107,193,0.28);
}
.feature-card.fc-shop .fc-icon { background:rgba(236,198,83,0.14); border-color:rgba(236,198,83,0.3); }
.feature-card h3 { margin:0 0 0.4rem; font-size:1.12rem; font-weight:800; color:#fff; }
.feature-card h3 a { color:#fff; }
.feature-card p { margin:0; font-size:0.9rem; color:var(--text-dim); }
.feature-card.fc-freebuild::before { background:var(--cyan); }
.feature-card.fc-shop::before { background:var(--gold); }
.feature-card.fc-shop .fc-icon { color:var(--gold); }

/* CTA-Banner in der Landing */
.cta-banner {
  background:linear-gradient(135deg,var(--blue-dk),var(--panel-2));
  border:1px solid var(--border); border-top:3px solid var(--gold); border-radius:14px;
  padding:2.2rem 1.6rem; text-align:center; margin:0 auto;
  box-shadow:0 14px 44px rgba(0,0,0,0.35), 0 0 34px rgba(44,112,182,0.12);
}
.cta-banner h2 { margin:0 0 0.5rem; color:#fff; font-size:1.5rem; font-weight:800; }
.cta-banner p { margin:0 0 1.3rem; color:var(--cyan-3); }

/* ── Doc-Shell (Unterseiten) ─────────────────────────────────────────── */
.doc-shell {
  max-width:var(--maxw); margin:0 auto; padding:1.5rem 1.2rem 3rem;
  display:grid; grid-template-columns:240px 1fr; gap:2rem; align-items:start;
}
.doc-sidebar { position:sticky; top:70px; }
.sidenav { display:flex; flex-direction:column; gap:2px; }
.sidenav-group { margin-bottom:1rem; }
.sidenav-group-title {
  font-size:0.72rem; font-weight:800; letter-spacing:1.2px; text-transform:uppercase;
  color:var(--cyan-2); padding:0.4rem 0.7rem; margin-top:0.4rem;
}
.sidenav-link {
  display:block; padding:0.42rem 0.7rem; border-radius:7px;
  color:var(--text-dim); font-size:0.9rem; font-weight:500;
  border-left:2px solid transparent; transition:background .15s, color .15s, border-color .15s;
}
.sidenav-link:hover { background:rgba(55,107,193,0.12); color:#fff; }
.sidenav-link.active {
  background:rgba(55,107,193,0.16); color:var(--cyan-2);
  border-left-color:var(--gold);
}

.doc-main { min-width:0; }
.doc-article {
  background:linear-gradient(160deg,rgba(14,34,79,0.55) 0%,rgba(10,23,48,0.55) 100%);
  border:1px solid rgba(55,107,193,0.22); border-radius:14px;
  padding:2rem 2.2rem;
}
.doc-title {
  font-size:2rem; font-weight:800; color:#fff; margin:0 0 1.2rem;
  padding-bottom:0.6rem; border-bottom:1px solid rgba(55,107,193,0.25);
}

/* ── Markdown-Typografie (.md-typeset) ───────────────────────────────── */
.md-typeset { font-size:0.95rem; }
.md-typeset h1,.md-typeset h2,.md-typeset h3 { color:#fff; font-weight:800; scroll-margin-top:80px; }
.md-typeset h1 { font-size:2rem; margin:0 0 1.2rem; padding-bottom:0.6rem; border-bottom:1px solid rgba(55,107,193,0.25); }
.md-typeset h2 { margin-top:2rem; padding-bottom:0.3rem; border-bottom:1px solid rgba(55,107,193,0.22); }
.md-typeset h3 { margin-top:1.5rem; }
.md-typeset a { color:var(--cyan-2); }
.md-typeset a:hover { color:var(--cyan); text-decoration:underline; }
.md-typeset code {
  background:rgba(55,107,193,0.16); color:var(--cyan-2);
  padding:0.12em 0.42em; border-radius:5px; font-size:0.85em;
  border:1px solid rgba(55,107,193,0.2);
}
.md-typeset pre { background:var(--navy-1); border:1px solid rgba(55,107,193,0.25); border-radius:10px; padding:1rem; overflow:auto; }
.md-typeset pre code { background:none; border:0; color:var(--cyan-3); }
.md-typeset hr { border:0; border-top:1px solid rgba(55,107,193,0.2); margin:1.6rem 0; }
.md-typeset ul,.md-typeset ol { padding-left:1.3rem; }
.md-typeset li { margin:0.3rem 0; }
.md-typeset blockquote { border-left:3px solid var(--blue-lt); padding-left:1rem; color:var(--text-dim); margin:1rem 0; }

.md-typeset table {
  width:100%; border-collapse:collapse; margin:1.2rem 0;
  border:1px solid rgba(55,107,193,0.22); border-radius:10px; overflow:hidden; font-size:0.9rem;
}
.md-typeset th { background:rgba(55,107,193,0.18); color:var(--cyan-3); text-align:left; font-weight:700; }
.md-typeset th,.md-typeset td { padding:0.55rem 0.8rem; border-bottom:1px solid rgba(55,107,193,0.1); }
.md-typeset tbody tr:hover { background:rgba(55,107,193,0.06); }
.md-typeset td code { color:var(--cyan-2); }

/* Permalink-Anker (¶) global ausblenden – nur bei Hover in Doc-Artikeln dezent */
.headerlink { display:none; }
.doc-article h1:hover .headerlink,
.doc-article h2:hover .headerlink,
.doc-article h3:hover .headerlink {
  display:inline; margin-left:0.4rem; opacity:0.45; color:var(--blue-lt);
}
.doc-article h2:hover .headerlink:hover,
.doc-article h3:hover .headerlink:hover { opacity:1; }

/* Regelwerk: Anker jeder Regel dauerhaft sichtbar (Direktlink-Button) */
.doc-article .rules h3 .headerlink {
  display:inline; margin-left:0.5rem; opacity:0.4;
  color:var(--blue-lt); font-weight:400; transition:opacity .15s, color .15s;
}
.doc-article .rules h3:hover .headerlink { opacity:0.75; }
.doc-article .rules h3 .headerlink:hover { opacity:1; color:var(--cyan); }
.doc-article .rules h3 {
  scroll-margin-top:80px; margin-top:1.8rem;
  padding-bottom:0.35rem; border-bottom:1px solid rgba(55,107,193,0.18);
}
.doc-article .rules h3:target {
  background:rgba(236,198,83,0.08);
  box-shadow:-0.9rem 0 0 rgba(236,198,83,0.08), 0.9rem 0 0 rgba(236,198,83,0.08);
  border-radius:4px;
}

/* Material-Icons (twemoji-SVG) in Markenfarbe */
.md-typeset .twemoji,
.feature-card .fc-icon .twemoji { fill:currentColor; }
.feature-card .fc-icon { color:var(--cyan-2); }
.feature-card .fc-icon svg { height:1.7rem; width:1.7rem; vertical-align:middle; }
.feature-card.fc-shop .fc-icon { color:var(--gold); }

.md-typeset img { max-width:100%; border-radius:10px; }
.md-content img[alt="Freebuild"] { width:100%; max-height:160px; object-fit:cover; box-shadow:0 6px 24px rgba(0,0,0,0.4); }
.md-content img[alt*="Menü"],
.md-content img[alt*="Marktplatz"],
.md-content img[alt*="Verwaltung"],
.md-content img[alt*="Shopkiste"] {
  max-width:520px; display:block; margin:1.2rem 0;
  border:1px solid rgba(55,107,193,0.25); border-radius:10px;
  box-shadow:0 6px 24px rgba(0,0,0,0.35);
  image-rendering:pixelated;
}

/* Zebra-Streifen + Befehls-Spalte nicht umbrechen */
.md-typeset tbody tr:nth-child(even) { background:rgba(55,107,193,0.05); }
.md-typeset tbody tr:nth-child(even):hover { background:rgba(55,107,193,0.1); }
.md-typeset td:first-child code { white-space:nowrap; }

/* ── Premium-Badge ───────────────────────────────────────────────────── */
.badge-premium {
  display:inline-flex; align-items:center; gap:0.3em;
  padding:0.05em 0.55em; border-radius:99px;
  font-size:0.72em; font-weight:800; letter-spacing:0.5px; text-transform:uppercase;
  color:var(--gold); background:rgba(236,198,83,0.12);
  border:1px solid rgba(236,198,83,0.35);
  white-space:nowrap; vertical-align:baseline;
}

/* ── Kicker über dem Seitentitel ─────────────────────────────────────── */
.doc-kicker {
  display:block; font-size:0.72rem; font-weight:800;
  letter-spacing:1.6px; text-transform:uppercase;
  color:var(--cyan-2); margin:0 0 0.35rem;
}

/* ── Tabs (Java/Bedrock u.ä.) ────────────────────────────────────────── */
.qm-tabs { margin:1.4rem 0; }
.qm-tab-bar { display:flex; gap:0.5rem; flex-wrap:wrap; margin-bottom:1rem; }
.qm-tab {
  font-family:inherit; cursor:pointer;
  padding:0.5rem 1.3rem; border-radius:99px;
  font-weight:700; font-size:0.9rem;
  color:var(--text-dim); background:rgba(14,34,79,0.6);
  border:1px solid rgba(55,107,193,0.35);
  transition:color .15s, background .15s, border-color .15s;
}
.qm-tab:hover { color:#fff; border-color:var(--cyan-2); }
.qm-tab.active {
  color:#1a1028; font-weight:800;
  background:linear-gradient(135deg,#ffe08a,var(--gold));
  border-color:rgba(0,0,0,0.15);
}
.qm-tab-panel { display:none; }
.qm-tab-panel.active { display:block; }

/* ── Nummerierte Klick-Schritte ──────────────────────────────────────── */
.md-typeset ol.steps,
ol.steps { list-style:none; counter-reset:step; margin:0; padding:0; }
ol.steps > li {
  counter-increment:step;
  position:relative; margin:0 0 0.6rem; padding:0.75rem 1rem 0.75rem 3.4rem;
  background:rgba(14,34,79,0.45);
  border:1px solid rgba(55,107,193,0.22); border-radius:10px;
}
ol.steps > li::before {
  content:counter(step);
  position:absolute; left:0.85rem; top:50%; transform:translateY(-50%);
  width:1.9rem; height:1.9rem; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-weight:800; font-size:0.9rem; color:var(--gold);
  background:var(--navy-1); border:1px solid rgba(236,198,83,0.4);
}

/* ── Premium-Hinweisbox ──────────────────────────────────────────────── */
.premium-cta {
  background:linear-gradient(160deg,rgba(14,34,79,0.6),rgba(10,23,48,0.6));
  border:1px solid rgba(55,107,193,0.25); border-left:4px solid var(--gold);
  border-radius:10px; padding:1rem 1.2rem; margin:1.6rem 0;
}
.premium-cta strong:first-child { color:var(--gold); }
.premium-cta p { margin:0.3rem 0; }

/* Admonitions */
.md-typeset .admonition,.md-typeset details {
  background:rgba(14,34,79,0.5); border:1px solid rgba(55,107,193,0.25);
  border-left:4px solid var(--blue-lt); border-radius:10px; padding:0.9rem 1.1rem; margin:1.2rem 0;
}
.md-typeset .admonition-title,.md-typeset summary { font-weight:700; color:#fff; margin:-0.9rem -1.1rem 0.7rem; padding:0.6rem 1.1rem; background:rgba(58,125,193,0.14); }
.md-typeset details.question,.md-typeset .admonition.tip { border-left-color:var(--gold); }
.md-typeset details.question > summary,.md-typeset .tip > .admonition-title { background:rgba(236,198,83,0.12); }

/* ── Footer ──────────────────────────────────────────────────────────── */
.site-footer {
  background:var(--navy-1); border-top:1px solid rgba(55,107,193,0.25);
  padding:2.5rem 1.2rem 1.4rem; margin-top:2rem;
}
.footer-inner {
  max-width:var(--maxw); margin:0 auto;
  display:flex; justify-content:space-between; align-items:center; gap:2rem; flex-wrap:wrap;
}
.footer-logo { height:26px; image-rendering:pixelated; margin-bottom:0.5rem; display:block; }
.footer-ip { margin:0; font-size:0.85rem; color:var(--text-dim); }
.footer-ip code { color:var(--cyan-2); background:rgba(55,107,193,0.14); padding:0.1rem 0.45rem; border-radius:5px; }
.footer-links { display:flex; gap:1.2rem; flex-wrap:wrap; }
.footer-links a { color:var(--text-dim); font-weight:600; font-size:0.9rem; }
.footer-links a:hover { color:var(--cyan); }
.footer-legal {
  max-width:var(--maxw); margin:1.6rem auto 0; padding-top:1.2rem;
  border-top:1px solid rgba(55,107,193,0.15);
  text-align:center; font-size:0.8rem; color:rgba(159,180,212,0.6);
}
.footer-legal a { color:var(--text-dim); }

/* ── Responsive ──────────────────────────────────────────────────────── */
@media (max-width:900px) {
  .doc-shell { grid-template-columns:1fr; }
  .doc-sidebar { position:static; margin-bottom:0.5rem; }
  .sidenav { flex-direction:row; flex-wrap:wrap; }
  .sidenav-group { display:contents; }
  .doc-article { padding:1.4rem; }
  .hero-render { opacity:0.35; right:-4vw; }
  .hero-render--left { display:none; }
  .hero-render--right { opacity:0.35; right:-4vw; }
}
@media (max-width:720px) {
  .topnav-burger { display:block; }
  .topnav-links {
    display:none; position:absolute; top:100%; left:0; right:0;
    flex-direction:column; align-items:stretch; gap:0.2rem;
    background:rgba(4,18,58,0.98); padding:0.8rem 1rem 1.2rem;
    border-bottom:1px solid rgba(55,107,193,0.25);
  }
  body.nav-open .topnav-links { display:flex; }
  .topnav-link { padding:0.7rem 0.9rem; width:100%; justify-content:space-between; }
  /* Dropdowns mobil: inline aufgeklappt statt schwebend */
  .topnav-item.has-dropdown { width:100%; }
  .dropdown {
    position:static; opacity:1; visibility:visible; transform:none;
    min-width:0; background:none; border:0; border-top:0; box-shadow:none;
    padding:0 0 0.3rem 0.6rem; display:block;
  }
  .dropdown-link { padding:0.55rem 0.6rem; }
  .hero-render { display:none; }
  .footer-inner { flex-direction:column; align-items:flex-start; }
}