/* styles.css - simple dark responsive style */
:root{
  --bg:#0f1116;--card:#12141a;--muted:#9aa4b2;--accent:#7c4dff;--accent2:#a76bff;
  --text:#e6eef8;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; background:linear-gradient(180deg,var(--bg),#0b0c10);color:var(--text);-webkit-font-smoothing:antialiased}
.container{max-width:1000px;margin:32px auto;padding:0 16px}
header{display:flex;gap:16px;align-items:center}
.logo{display:flex;align-items:center;gap:12px}
.logo img{width:64px;height:64px;border-radius:8px;object-fit:cover}
.brand{font-weight:700;font-size:20px}
nav{margin-left:auto;display:flex;gap:10px;align-items:center}
a.btn{background:transparent;border:1px solid rgba(255,255,255,0.06);padding:8px 12px;border-radius:8px;color:var(--text);text-decoration:none}
.lang{border-radius:6px;padding:6px 8px;background:rgba(255,255,255,0.02)}
.hero{background:linear-gradient(90deg,rgba(124,77,255,0.12),rgba(167,107,255,0.06));padding:20px;border-radius:12px;margin-top:18px}
h1{margin:0 0 8px 0;font-size:28px}
p.lead{color:var(--muted);margin:0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:18px}
.card{background:var(--card);padding:14px;border-radius:10px}
.skills li{margin:6px 0;color:var(--muted)}
footer{margin-top:28px;padding:18px 0;color:var(--muted);font-size:14px;text-align:center}
.btn-primary{background:linear-gradient(90deg,var(--accent),var(--accent2));color:#fff;border:none;padding:8px 12px;border-radius:8px;text-decoration:none}
form input, form textarea{width:100%;padding:8px;border-radius:6px;border:1px solid rgba(255,255,255,0.06);background:transparent;color:var(--text);margin-top:8px}
form button{margin-top:8px}
@media (max-width:640px){.brand{font-size:16px} h1{font-size:22px}}