@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');
:root{--bg:#0b1020;--panel:#121a2e;--text:#f4f7ff;--muted:#aab5cc;--accent:#61e4c5;--line:#25314a}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;line-height:1.65}
a{color:inherit;text-decoration:none}.site-header{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 8%;border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(11,16,32,.92);backdrop-filter:blur(12px);z-index:10}
.logo{font-family:'Space Grotesk';font-weight:700;letter-spacing:1px}.logo span,.hero h1 span{color:var(--accent)}
nav{display:flex;align-items:center;gap:30px;color:var(--muted);font-size:14px}nav a:hover{color:var(--accent)}.nav-contact{border:1px solid var(--accent);padding:8px 16px;border-radius:7px;color:var(--accent)}
.menu-toggle{display:none;background:none;color:white;border:0;font-size:25px}
.section{padding:100px 8%;max-width:1440px;margin:auto}.hero{min-height:620px;display:grid;grid-template-columns:1.35fr .8fr;align-items:center;gap:70px;background:radial-gradient(ellipse at 85% 35%,rgba(97,228,197,.12),transparent 38%)}
.eyebrow{font-size:12px;letter-spacing:2.5px;color:var(--accent);font-weight:700}.hero h1{font:700 clamp(38px,5vw,66px)/1.12 'Space Grotesk';margin:20px 0}.intro,.section-lead{max-width:650px;color:var(--muted);font-size:17px}
.hero-actions{display:flex;gap:14px;margin-top:32px}.button{padding:12px 21px;border-radius:7px;font-weight:700;font-size:14px}.primary{background:var(--accent);color:#07131a}.secondary{border:1px solid #46536e}
.hero-card{background:linear-gradient(145deg,#18243b,#10182b);border:1px solid #2c3b55;border-radius:18px;padding:38px;text-align:center;box-shadow:0 25px 80px #0005}.avatar{width:112px;height:112px;margin:0 auto 22px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),#527bff);color:#07131a;font:700 35px 'Space Grotesk'}.card-label{font-size:11px;letter-spacing:2px;color:var(--accent)}.hero-card h2{font:700 27px 'Space Grotesk';margin:4px}.hero-card p{color:var(--muted)}.mini-line{height:1px;background:var(--line);margin:25px 0}.small-note{font-size:13px}
h2{font:700 clamp(29px,3vw,42px) 'Space Grotesk';margin:10px 0 15px}.about,.projects{border-top:1px solid var(--line)}.info-grid,.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:38px}.info-card,.project-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:25px}.info-card span,.project-number{color:var(--accent);font-weight:700}.info-card h3,.project-card h3{font:600 20px 'Space Grotesk'}.info-card p,.project-card p{color:var(--muted);font-size:14px}.skill-list{max-width:850px;margin-top:35px}.skill{display:flex;justify-content:space-between;align-items:center;padding:19px 0;border-bottom:1px solid var(--line)}.skill b,.skill span{display:block}.skill span{color:var(--muted);font-size:13px}.skill i{font-style:normal;color:var(--accent);font-size:12px;border:1px solid #286b61;padding:5px 11px;border-radius:20px}.project-card span{font-size:11px;color:var(--accent);letter-spacing:.5px}.contact{background:linear-gradient(120deg,rgba(97,228,197,.07),transparent)}.contact-links{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}.contact-links a{border:1px solid var(--line);background:var(--panel);padding:12px 16px;border-radius:8px;font-size:14px}.contact-links a:hover{border-color:var(--accent)}footer{text-align:center;padding:25px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}
@media(max-width:760px){.site-header{padding:0 6%}.menu-toggle{display:block}nav{display:none;position:absolute;top:76px;left:0;right:0;background:#10182b;padding:22px 6%;flex-direction:column;align-items:flex-start;gap:18px;border-bottom:1px solid var(--line)}nav.open{display:flex}.section{padding:75px 6%}.hero{grid-template-columns:1fr;gap:40px;min-height:auto}.hero-card{max-width:420px}.info-grid,.project-grid{grid-template-columns:1fr}.hero h1{font-size:42px}.contact-links{flex-direction:column}.skill{gap:12px}.skill i{white-space:nowrap}}
