:root{
  --bg:#07111f;--panel:#0d1b2d;--panel2:#10233a;--text:#edf4ff;--muted:#a8b8cc;
  --accent:#4f8cff;--accent2:#63d7ff;--border:rgba(255,255,255,.09);--max:1100px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.7}
a{color:inherit;text-decoration:none}.container{width:min(var(--max),92%);margin:auto}
.header{position:sticky;top:0;z-index:20;background:rgba(7,17,31,.86);backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}
.nav{height:72px;display:flex;align-items:center;justify-content:space-between}
.logo{font-size:28px;font-weight:800}.logo span{color:var(--accent2)}
.nav-links{display:flex;gap:28px}.nav-links a{color:var(--muted);font-size:14px;font-weight:600}.nav-links a:hover{color:#fff}
.menu-btn{display:none;background:none;border:0;color:#fff;font-size:26px}
.hero{min-height:calc(100vh - 72px);display:grid;grid-template-columns:1.35fr .65fr;gap:60px;align-items:center;padding:80px 0}
.eyebrow,.section-tag{color:var(--accent2);font-weight:800;letter-spacing:2px;font-size:12px}
h1{font-size:clamp(42px,7vw,76px);line-height:1.05;margin:16px 0}h1 span{color:var(--accent2)}
.hero-copy{max-width:650px;color:var(--muted);font-size:18px}.hero-actions{display:flex;gap:14px;margin:30px 0}
.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:12px;padding:12px 20px;font-weight:700;cursor:pointer}
.primary{background:var(--accent);color:white}.secondary{border:1px solid var(--border);color:white}
.socials{display:flex;gap:20px;color:var(--muted);font-size:14px}
.hero-card{background:linear-gradient(145deg,var(--panel2),var(--panel));border:1px solid var(--border);border-radius:24px;padding:34px;text-align:center;box-shadow:0 25px 80px rgba(0,0,0,.25)}
.avatar{width:120px;height:120px;border-radius:50%;margin:0 auto 22px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#06101d;font-size:36px;font-weight:800}
.hero-card h2{font-size:20px}.hero-card p{color:var(--muted);font-size:13px}.mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:25px}.mini-grid div{padding:12px 4px;border:1px solid var(--border);border-radius:12px}.mini-grid strong,.mini-grid small{display:block}.mini-grid small{color:var(--muted);font-size:10px}
.section{padding:100px 0}.alt{background:#091727}.section-title{font-size:clamp(30px,4vw,46px);line-height:1.15;margin:10px 0 40px}.about-grid{display:grid;grid-template-columns:1.4fr .6fr;gap:50px;color:var(--muted)}.about-grid p{margin-bottom:18px}
.info-card{background:var(--panel);border:1px solid var(--border);border-radius:18px;padding:10px 22px}.info-card div{padding:18px 0;border-bottom:1px solid var(--border)}.info-card div:last-child{border:0}.info-card span{display:block;font-size:12px;color:var(--muted)}.info-card strong{font-size:15px;color:#fff}
.skills-grid,.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.skill-card,.project-card{background:var(--panel);border:1px solid var(--border);border-radius:18px;padding:25px;transition:.25s}.skill-card:hover,.project-card:hover{transform:translateY(-5px);border-color:rgba(99,215,255,.35)}.skill-card span,.project-number{color:var(--accent2);font-weight:800;font-size:12px}.skill-card h3,.project-card h3{margin:12px 0 6px}.skill-card p,.project-card p{color:var(--muted);font-size:14px}.tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}.tags span{font-size:11px;padding:5px 9px;border-radius:99px;background:#162941;color:#cfe0f4}
.contact-wrap{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start}.contact-form{display:grid;gap:12px}.contact-form input,.contact-form textarea{width:100%;background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:14px;color:#fff;font:inherit;outline:none}.contact-form input:focus,.contact-form textarea:focus{border-color:var(--accent)}.form-status{font-size:13px;color:var(--accent2)}
.footer{padding:25px 0;border-top:1px solid var(--border);color:var(--muted);font-size:12px;text-align:center}
@media(max-width:800px){.nav-links{display:none;position:absolute;top:72px;left:0;right:0;padding:18px 5%;background:var(--panel);flex-direction:column;gap:12px}.nav-links.open{display:flex}.menu-btn{display:block}.hero,.about-grid,.contact-wrap{grid-template-columns:1fr}.hero{padding:65px 0}.hero-card{max-width:430px}.skills-grid,.projects-grid{grid-template-columns:1fr}.section{padding:75px 0}}