@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@600;700;800&display=swap');
:root{color-scheme:dark;--bg:#071116;--panel:#0e1c24;--gold:#ffba08;--text:#f5f5f1;--muted:#b8c2c8}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:17px/1.75 'DM Sans',Arial,sans-serif}a{color:var(--gold)}a:hover{text-decoration:underline}.wrap{max-width:1200px;margin:auto;padding:0 24px}.header{background:#041015;border-bottom:1px solid #27333a}.header .wrap{display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:85px}.brand{color:#fff;text-decoration:none;font-weight:800;font-size:25px;line-height:1.1}.brand b{color:var(--gold)}.brand small{display:block;letter-spacing:.18em;font-size:11px;font-weight:400;margin-top:8px}.nav{display:flex;gap:20px;flex-wrap:wrap}.nav a{color:#fff;text-decoration:none;font-size:14px}.hero{background:linear-gradient(90deg,rgba(0,0,0,.8),rgba(0,0,0,.18)),url('magazin-start.jpg') center/cover;min-height:420px;display:flex;align-items:center}.hero h1{font:800 clamp(42px,6vw,76px)/1.04 'Playfair Display',Georgia,serif;max-width:730px;margin:10px 0}.hero h1 em{color:var(--gold);font-style:normal}.eyebrow{color:var(--gold);text-transform:uppercase;letter-spacing:.2em;font-size:12px;font-weight:700}.hero p{font-size:19px;max-width:670px}.btn{display:inline-block;background:var(--gold);color:#081014!important;border-radius:5px;padding:11px 19px;text-decoration:none;font-weight:800;font-size:14px}.section{padding:50px 0}.section h2,.article h2{font:700 34px/1.2 'Playfair Display',Georgia,serif}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.card{border:1px solid #33424a;border-radius:7px;overflow:hidden;background:var(--panel)}.card img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}.card-body{padding:19px}.card h3{font:700 23px/1.25 'Playfair Display',Georgia,serif;margin:10px 0}.card p{color:var(--muted);margin:0 0 14px}.card a{font-weight:700;text-decoration:none}.tag{font-size:11px;color:#121a1f;background:var(--gold);font-weight:800;padding:4px 8px;border-radius:3px}.article{max-width:860px;margin:45px auto 75px;padding:0 24px}.article h1{font:800 clamp(35px,5vw,57px)/1.12 'Playfair Display',Georgia,serif;margin:16px 0}.article h2{margin-top:42px}.article .lead{font-size:21px;color:#e1e7e9}.article .feature{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:8px;margin:22px 0}.article p,.article li{color:#d4dce0}.article li{margin:9px 0}.article .note{background:#15252e;border-left:4px solid var(--gold);padding:18px 22px;margin:30px 0}.article .cta{background:linear-gradient(110deg,#13252c,#26303a);border:1px solid #57616b;border-radius:9px;padding:25px;margin-top:36px}.article .cta h2{margin:0 0 14px}.footer{border-top:1px solid #33424a;padding:30px 0;color:var(--muted);font-size:14px}.footer a{color:#fff}@media(max-width:850px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.header .wrap{display:block;padding-top:18px;padding-bottom:16px}.nav{margin-top:15px}}@media(max-width:550px){.grid{grid-template-columns:1fr}.hero{min-height:360px}.section{padding:32px 0}}

/* Schnellwahl der Magazinartikel im Kopfmenü – ohne JavaScript */
.nav{align-items:center}
.nav-dropdown{position:relative;color:#fff;font-size:14px}
.nav-dropdown summary{cursor:pointer;list-style:none;padding:8px 10px;border:1px solid #40505a;border-radius:5px;white-space:nowrap;font-weight:700}
.nav-dropdown summary::-webkit-details-marker{display:none}
.nav-dropdown summary:hover,.nav-dropdown[open] summary{background:#1c303a;color:var(--gold)}
.nav-dropdown summary:focus-visible,.nav-dropdown-panel a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.nav-dropdown-panel{position:absolute;z-index:100;right:0;top:calc(100% + 8px);min-width:295px;max-width:min(360px,90vw);background:#0d1e27;border:1px solid #52616b;border-radius:7px;box-shadow:0 15px 35px #000a;padding:8px}
.nav-dropdown-panel a{display:block;padding:10px 12px;border-radius:4px;line-height:1.35;color:#fff;text-decoration:none}
.nav-dropdown-panel a:hover{background:#233844;color:var(--gold)}
@media(max-width:850px){.nav-dropdown-panel{left:0;right:auto}}
@media(max-width:550px){.nav-dropdown{width:100%}.nav-dropdown summary{width:100%}.nav-dropdown-panel{position:relative;top:4px;max-width:100%;min-width:0}}

/* SEO/UX Update: Lesbarkeit, zugängliche Navigation, saubere Bilddarstellung */
.article .faq h3{font-size:20px;line-height:1.35;margin:24px 0 5px;color:#fff}.article .faq p{margin:0 0 16px}.related{border-top:1px solid #43515b;margin-top:30px;padding-top:12px}.related h2{font-size:25px}.related ul{padding-left:22px}.related a{color:var(--gold)}.card img{object-position:center center}.hero{background-position:center center}.article .feature{height:auto;aspect-ratio:16/9}a:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:3px}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}