@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root{
  --bg:#070b18;
  --card:#0f1730;
  --muted:#a9b7d7;
  --text:#eef3ff;
  --accent:#6ee7ff;
  --accent2:#a78bfa;
  --border:rgba(255,255,255,.10);
  --shadow: 0 25px 80px rgba(0,0,0,.45);
}

*{font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;}
body{
  background:
    radial-gradient(1400px 700px at 15% 10%, rgba(110,231,255,.15), transparent 55%),
    radial-gradient(1100px 550px at 85% 15%, rgba(167,139,250,.14), transparent 55%),
    linear-gradient(180deg,var(--bg),#040612);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

a{color:var(--accent); text-decoration:none}
a:hover{color:#c9f6ff}

.navbar{
  backdrop-filter: blur(12px);
  background:rgba(7,11,24,.65) !important;
  border-bottom:1px solid var(--border);
}
.navbar .nav-link{color:var(--text); opacity:.9}
.navbar .nav-link:hover{opacity:1}
.navbar-brand .small{opacity:.85}

.hero{
  padding: 6.5rem 0 3.5rem;
  border-bottom:1px solid var(--border);
}

.glow{
  box-shadow: 0 0 0 1px var(--border), var(--shadow);
}

.card, .accordion-item{
  background:rgba(15,23,48,.78);
  border:1px solid var(--border);
  border-radius:18px;
}

.badge-skill{
  background:rgba(110,231,255,.12);
  border:1px solid rgba(110,231,255,.30);
  color:#e9fdff;
  border-radius:999px;
}

.lead{color:var(--muted)}
.muted{color:var(--muted)}
.section-title{letter-spacing:.01em}

.codeframe{
  background:rgba(0,0,0,.35);
  border:1px solid var(--border);
  border-radius:18px;
  overflow:hidden;
}
.codeframe .topbar{
  padding:.7rem .9rem;
  border-bottom:1px solid var(--border);
  display:flex; gap:.5rem; align-items:center;
  background:rgba(0,0,0,.25);
}
.dot{width:10px;height:10px;border-radius:50%;}
.dot.red{background:#ff5f57}.dot.yellow{background:#febc2e}.dot.green{background:#28c840}

img.cover{width:100%; height:100%; object-fit:cover}

.btn-accent{
  background:linear-gradient(90deg, var(--accent), var(--accent2));
  border:none; color:#070b18;
  font-weight:600;
  box-shadow: 0 0 0 1px rgba(255,255,255,.10), 0 12px 30px rgba(110,231,255,.12);
}
.btn-accent:hover{filter:brightness(1.05)}
.btn-outline-light{border-color:rgba(255,255,255,.25); color:var(--text)}
.btn-outline-light:hover{background:rgba(255,255,255,.06)}

.content p, .content li{color:var(--text)}
.content h2,.content h3,.content h4{margin-top:1.25rem}

.footer{
  border-top:1px solid var(--border);
  color:var(--muted);
  background:rgba(0,0,0,.18);
}