:root { --red:#DC2626; --dark:#050505; --dark-2:#0E0E0E; --dark-3:#161616; --border:rgba(255,255,255,.1); --text:#F5F5F5; --muted:#A1A1AA; }
* { box-sizing:border-box; } body { margin:0; font-family:Inter, Arial, sans-serif; background:radial-gradient(circle at 15% 0%, rgba(220,38,38,.18), transparent 32%), var(--dark); color:var(--text); line-height:1.65; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline:2px solid #FCA5A5; outline-offset:3px; border-radius:6px; }
.skip { position:absolute; left:-9999px; top:0; background:var(--red); color:white; padding:.6rem 1rem; border-radius:8px; font-weight:800; z-index:100; }
.skip:focus { left:1rem; top:1rem; }
.nav { position:sticky; top:0; z-index:10; display:flex; justify-content:space-between; gap:1rem; align-items:center; padding:1rem clamp(1rem,4vw,3rem); background:rgba(5,5,5,.82); backdrop-filter:blur(16px); border-bottom:1px solid var(--border); }
.brand { display:flex; align-items:center; gap:.7rem; text-decoration:none; color:white; font-weight:800; } .mark { width:42px; height:42px; border-radius:10px; background:var(--red); display:grid; place-items:center; }
.nav-links { display:flex; gap:1rem; flex-wrap:wrap; font-size:.9rem; } a { color:inherit; } .nav-links a { color:var(--muted); text-decoration:none; } .nav-links a:hover { color:white; }
main { width:min(1120px, calc(100% - 2rem)); margin:0 auto; } .hero { padding:clamp(4rem,10vw,7rem) 0 3rem; } .eyebrow { color:#FCA5A5; text-transform:uppercase; letter-spacing:.16em; font-weight:800; font-size:.78rem; margin-bottom:1rem; }
h1 { font-size:clamp(2.35rem,7vw,5.1rem); line-height:.98; letter-spacing:-.05em; margin:0 0 1.25rem; max-width:900px; } .lead { color:#E5E7EB; font-size:clamp(1.05rem,2vw,1.25rem); max-width:760px; margin:0 0 2rem; }
.actions { display:flex; flex-wrap:wrap; gap:1rem; } .btn { display:inline-flex; padding:.9rem 1.35rem; border-radius:12px; background:var(--red); color:white; text-decoration:none; font-weight:800; } .btn.secondary { background:rgba(255,255,255,.05); border:1px solid var(--border); }
.grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:1rem; padding:1rem 0 4rem; } .panel { background:rgba(22,22,22,.82); border:1px solid var(--border); border-radius:22px; padding:clamp(1.25rem,3vw,2rem); }
.panel h2 { margin:0 0 1rem; font-size:1.35rem; line-height:1.2; } .panel h3 { margin:1.4rem 0 .5rem; font-size:1.05rem; } ul { margin:0; padding-left:1.15rem; color:var(--muted); } li + li { margin-top:.55rem; } .panel p { color:var(--muted); }
.prose { grid-column:1/-1; } .prose p { color:#D4D4D8; margin:.85rem 0; } .prose h2 { margin-top:2rem; font-size:1.55rem; } .prose h3 { color:white; }
ol { color:var(--muted); padding-left:1.3rem; } ol li + li { margin-top:.55rem; }
table { width:100%; border-collapse:collapse; color:var(--muted); font-size:.92rem; }
th,td { text-align:left; padding:.6rem .7rem; border-bottom:1px solid var(--border); }
th { color:#E5E7EB; font-weight:700; }
details { border-top:1px solid var(--border); padding:1rem 0; } details:first-of-type { border-top:0; } summary { cursor:pointer; font-weight:800; } details p { color:var(--muted); margin:.5rem 0 0; }
.links-panel,.cta { grid-column:1/-1; } .link-grid { display:flex; flex-wrap:wrap; gap:.75rem; } .link-grid a { color:#FCA5A5; text-decoration:none; border:1px solid rgba(220,38,38,.28); background:rgba(220,38,38,.1); padding:.65rem .85rem; border-radius:999px; font-weight:700; }
.cta { text-align:center; background:linear-gradient(135deg, rgba(220,38,38,.18), rgba(255,255,255,.04)); }
.cta-trio { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; grid-column:1/-1; } .cta-trio .panel { display:flex; flex-direction:column; gap:.4rem; } .cta-trio strong { color:white; font-size:1.05rem; }
footer { border-top:1px solid var(--border); background:var(--dark-2); padding:2rem clamp(1rem,4vw,3rem); color:var(--muted); } .footer-inner { width:min(1120px, 100%); margin:0 auto; display:grid; grid-template-columns:2fr 1fr 1fr; gap:2rem; } footer a { color:#E5E7EB; text-decoration:none; }
.glossar-list { grid-column:1/-1; } .glossar-list dl { margin:0; } .glossar-list dt { font-weight:800; color:white; margin-top:1.25rem; scroll-margin-top:90px; } .glossar-list dt:first-of-type { margin-top:0; } .glossar-list dd { margin:.4rem 0 0; color:var(--muted); }
.glossar-toc { grid-column:1/-1; } .glossar-toc a { display:inline-block; margin:.2rem .35rem .2rem 0; padding:.35rem .6rem; border-radius:999px; background:rgba(255,255,255,.05); border:1px solid var(--border); color:#E5E7EB; text-decoration:none; font-size:.85rem; }
.glossar-toc a:hover { background:rgba(220,38,38,.18); border-color:rgba(220,38,38,.4); color:white; }
@media (max-width:760px) { .nav { align-items:flex-start; flex-direction:column; } .footer-inner { grid-template-columns:1fr; } .cta-trio { grid-template-columns:1fr; } }