:root{--bg-dark: #0f0f0f;--bg-light: #f8f8f8;--text-dark: #eee;--text-light: #111;--accent: #66ffcc;--muted-dark: #888;--muted-light: #444}[data-theme=dark]{background-color:var(--bg-dark);color:var(--text-dark)}[data-theme=light]{background-color:var(--bg-light);color:var(--text-light)}body{margin:0;font-family:Segoe UI,sans-serif;transition:background .3s,color .3s}header{padding:2rem;text-align:center;background:#ffffff08;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.1)}h1{font-size:2.5rem;margin:0}header p{font-size:1.2rem;color:var(--muted-dark)}nav{margin-top:1rem}nav a{margin:0 1rem;color:var(--accent);text-decoration:none;font-weight:700}nav a:hover,nav a:focus{text-decoration:underline}.theme-toggle{float:right;margin-top:-2rem;margin-right:1rem}.skip-link{position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden}.skip-link:focus{left:1rem;top:1rem;width:auto;height:auto;padding:.5rem 1rem;background:var(--accent);color:#000;z-index:1000}.hero{background:url(https://images.unsplash.com/photo-1581090700227-1e8a4f7a99e4?auto=format&fit=crop&w=1600&q=80) no-repeat center center;background-size:cover;padding:6rem 2rem;text-align:center;color:#fff}.hero h2{font-size:2.5rem;margin-bottom:1rem}.cta-btn{background:var(--accent);color:#000;padding:.8rem 1.6rem;border:none;font-size:1rem;border-radius:6px;cursor:pointer;margin-top:1rem}.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:2rem;padding:4rem 2rem;max-width:1100px;margin:auto}.feature-card{background:#ffffff0d;border:1px solid rgba(255,255,255,.08);padding:1.5rem;border-radius:12px}.feature-card h3{color:var(--accent)}pre{background:#111;padding:1rem;border-radius:8px;overflow-x:auto;color:var(--accent);font-size:.9rem;margin:2rem}main.content{padding:2rem;max-width:1100px;margin:auto}main.content h2{color:var(--accent)}a:focus{outline:2px dashed var(--accent);outline-offset:2px}footer{text-align:center;padding:2rem 1rem;font-size:.9rem;color:var(--muted-dark);border-top:1px solid rgba(255,255,255,.08)}footer a{color:var(--muted-dark);text-decoration:none;margin:0 1rem}footer a:hover,footer a:focus{color:var(--accent)}
