:root{--bg:#0b0f1a;--fg:#e6f1ff;--muted:#94a3b8;--primary:#6ee7ff;--accent:#a78bfa;--pink:#fb7185;--card:#0f1629;--glass:rgba(255,255,255,.08);--border:rgba(255,255,255,.12)}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,"Helvetica Neue",Arial,"Apple Color Emoji","Segoe UI Emoji";overflow-x:hidden}
.bg{position:fixed;inset:0;z-index:-1}
.bg-gradient{position:absolute;inset:0;background:radial-gradient(1200px 1200px at 80% 10%,rgba(110,231,255,.25),transparent 60%),radial-gradient(1000px 1000px at 10% 80%,rgba(167,139,250,.22),transparent 60%),linear-gradient(180deg,#0b0f1a 0%,#0b1220 100%)}
.bg-grid{position:absolute;inset:-2px;background-image:linear-gradient(transparent 24px,rgba(255,255,255,.04) 25px),linear-gradient(90deg,transparent 24px,rgba(255,255,255,.04) 25px);background-size:25px 25px;mask-image:radial-gradient(1000px 1000px at 50% 50%,#000,transparent 70%)}
.bg-blobs{position:absolute;inset:0}
.blob{position:absolute;filter:blur(40px);mix-blend-mode:screen}
.blob.b1{width:300px;height:300px;left:10%;top:20%;background:conic-gradient(from 0deg,var(--primary),transparent)}
.blob.b2{width:260px;height:260px;right:18%;top:30%;background:conic-gradient(from 60deg,var(--pink),transparent)}
.blob.b3{width:220px;height:220px;left:30%;bottom:10%;background:conic-gradient(from 120deg,var(--accent),transparent)}
.hero{padding:80px 24px 24px;display:flex;justify-content:center;align-items:center}
.scene{position:relative;width:100%;max-width:1100px;height:420px;perspective:1000px}
.layer{position:absolute;inset:0;border-radius:28px;transform-style:preserve-3d}
.l-back{background:linear-gradient(135deg,rgba(110,231,255,.18),rgba(167,139,250,.18));transform:translateZ(-40px) scale(1.06);filter:drop-shadow(0 40px 60px rgba(0,0,0,.4))}
.l-mid{background:linear-gradient(135deg,rgba(255,255,255,.06),rgba(255,255,255,.02));transform:translateZ(-20px) scale(1.03);backdrop-filter:blur(10px);border:1px solid var(--border)}
.l-front{background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,0));transform:translateZ(0);border:1px solid var(--border)}
.card{position:absolute;inset:16px;border-radius:24px;background:linear-gradient(180deg,rgba(15,22,41,.88),rgba(15,22,41,.78));backdrop-filter:blur(12px);border:1px solid var(--border);box-shadow:0 20px 80px rgba(0,0,0,.45);overflow:hidden;transform-style:preserve-3d}
.card-inner{padding:36px 40px}
.name{font-size:48px;line-height:1.1;margin:0;background:linear-gradient(90deg,#fff,var(--primary) 50%,var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent}
.title{margin:10px 0 18px;color:var(--muted);font-size:18px}
.badges{display:flex;gap:10px;flex-wrap:wrap}
.badge{padding:8px 12px;border-radius:999px;background:linear-gradient(90deg,rgba(110,231,255,.18),rgba(167,139,250,.18));border:1px solid var(--border);color:#dbeafe}
.contact{display:flex;gap:16px;margin-top:18px}
.contact-item{padding:8px 12px;border-radius:12px;background:var(--glass);border:1px solid var(--border)}
.content{max-width:1100px;margin:24px auto;padding:0 24px}
.section{position:relative;margin:32px 0;padding:28px;border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02));border:1px solid var(--border)}
.section h2{margin:0 0 14px;font-size:24px}
.chips{display:flex;gap:10px;flex-wrap:wrap}
.chip{padding:8px 12px;border-radius:12px;background:var(--glass);border:1px solid var(--border);color:#cbd5e1}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.proj-card{padding:18px;border-radius:16px;background:linear-gradient(180deg,rgba(15,22,41,.88),rgba(15,22,41,.7));border:1px solid var(--border)}
.proj-title{font-weight:700;margin-bottom:8px}
.proj-desc{color:var(--muted);font-size:14px;margin-bottom:10px}
.proj-tags{display:flex;gap:8px;flex-wrap:wrap}
.tag{padding:6px 10px;border-radius:10px;background:var(--glass);border:1px solid var(--border);font-size:12px}
.timeline{position:relative;padding-left:24px}
.tl-item{position:relative;margin:18px 0;padding-left:16px}
.tl-dot{position:absolute;left:0;top:8px;width:10px;height:10px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--accent))}
.tl-content{border-left:2px dashed rgba(255,255,255,.12);padding-left:16px}
.tl-header{display:flex;justify-content:space-between;align-items:center}
.tl-role{font-weight:600}
.tl-period{color:var(--muted);font-size:14px}
.tl-desc{color:#cbd5e1}
.contact-panel{display:flex;gap:16px;align-items:center}
.cta{padding:10px 16px;border:0;border-radius:12px;background:linear-gradient(90deg,var(--primary),var(--accent));color:#081225;font-weight:700;cursor:pointer}
.cta:hover{filter:brightness(1.1)}
.footer{max-width:1100px;margin:40px auto;padding:12px 24px;color:var(--muted)}
@media (max-width:1200px){.cards{grid-template-columns:repeat(2,1fr)}.scene{height:480px}}
@media (max-width:900px){.cards{grid-template-columns:1fr}.hero{padding-top:40px}.name{font-size:38px}}