:root{
      --bg:#0c0c10; --card:#141419; --muted:#b9b9c7; --txt:#ececf3; --brand:#a88bff; --brand-2:#7a5cff;
      --radius:18px; --shadow:0 8px 22px rgba(0,0,0,.45); --shadow-lg:0 16px 40px rgba(0,0,0,.5);
      --maxw:1140px;
    }
    body{margin:0;font-family:system-ui, sans-serif;background:var(--bg);color:var(--txt);line-height:1.6}
    .container{max-width:var(--maxw);padding:32px 20px;margin:auto}
    header{position:sticky;top:0;background:#0c0c1090;backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.08)}
    .nav{display:flex;justify-content:space-between;align-items:center}
    .navlinks{display:flex;gap:16px}
    .navlinks a{text-decoration:none;color:var(--muted);transition:.3s}
    .navlinks a:hover{color:var(--brand)}
    .logo{height:36px;width:36px;border-radius:10px;background:linear-gradient(135deg,var(--brand),var(--brand-2))}

    .hero{padding:80px 0;display:flex;flex-direction:column;gap:10px}
    .hero h2{font-size:clamp(28px,6vw,44px);font-weight:700}
    .hero p{max-width:60ch;color:var(--muted)}

    #projects{padding-top:40px}
    #projects h2{font-size:32px;margin-bottom:20px}
    .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
    .card{background:var(--card);padding:18px;border-radius:var(--radius);box-shadow:var(--shadow);transition:.2s;border:1px solid rgba(255,255,255,.06)}
    .card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
    .thumb{aspect-ratio:16/9;border-radius:14px;background:#0e0e14;margin-bottom:12px;overflow:hidden}
    .thumb img{width:100%;height:100%;object-fit:cover;display:block}
    .meta{margin-top:12px;display:flex;justify-content:space-between;align-items:center}
    .pill{font-size:12px;padding:5px 10px;border-radius:999px;background:rgba(168,139,255,.14);border:1px solid rgba(168,139,255,.25)}
    .links a{color:var(--brand);font-size:14px;text-decoration:none;margin-left:10px;border-bottom:1px solid transparent}
    .links a:hover{border-bottom-color:var(--brand)}

    footer{margin-top:60px;padding:20px 0;text-align:center;color:var(--muted);border-top:1px solid rgba(255,255,255,.08)}