*{margin:0;padding:0;box-sizing:border-box}
:root{--bg:#080a0f;--panel:#0d1119;--panel2:#111722;--text:#f4f7fb;--muted:#9aa5b5;--line:rgba(255,255,255,.09);--blue:#4d8dff;--orange:#ff8a3d;--max:1180px}
html{scroll-behavior:smooth}
body{font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.6;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit}
.scroll-progress{position:fixed;z-index:1000;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--blue),var(--orange))}
.navbar{height:76px;position:fixed;top:0;left:0;right:0;z-index:999;display:flex;align-items:center;justify-content:space-between;padding:0 max(28px,calc((100vw - var(--max))/2));background:rgba(8,10,15,.76);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.logo{font:700 25px "Space Grotesk",sans-serif;letter-spacing:-1px}.logo span{color:var(--blue)}
nav{display:flex;gap:28px;margin-left:auto;margin-right:30px}nav a{font-size:13px;color:var(--muted);transition:.25s}nav a:hover,nav a.active{color:var(--text)}
.nav-cta{border:1px solid var(--line);padding:9px 15px;border-radius:7px;font-size:13px}.nav-cta span{color:var(--orange)}
.menu-toggle{display:none;background:none;color:var(--text);border:0;font-size:25px}
.section{max-width:var(--max);margin:auto;padding:120px 28px;position:relative}
.hero{min-height:100vh;max-width:none;padding:150px max(28px,calc((100vw - var(--max))/2)) 90px;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:70px;overflow:hidden}
.hero-grid{position:absolute;inset:76px 0 0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:60px 60px;mask-image:linear-gradient(to bottom,black,transparent)}
.hero-glow{position:absolute;border-radius:50%;filter:blur(90px);opacity:.18;pointer-events:none}.glow-one{width:330px;height:330px;background:var(--blue);left:-100px;top:250px}.glow-two{width:300px;height:300px;background:var(--orange);right:-80px;bottom:70px}
.hero-content,.hero-visual{position:relative;z-index:2}.eyebrow,.section-number{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--muted)}.eyebrow{display:flex;align-items:center;gap:9px;margin-bottom:25px}.pulse{width:7px;height:7px;border-radius:50%;background:#55d68a;box-shadow:0 0 14px #55d68a}
h1,h2,h3{font-family:"Space Grotesk",sans-serif;line-height:1.05;letter-spacing:-1.5px}h1{font-size:clamp(52px,6.2vw,86px);max-width:850px}h1 span,h2 span{background:linear-gradient(100deg,var(--blue),var(--orange));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-text{max-width:650px;color:var(--muted);font-size:17px;margin:28px 0}.hero-text strong{color:var(--text)}
.hero-buttons,.contact-actions{display:flex;gap:12px;flex-wrap:wrap}.btn{padding:13px 19px;border-radius:8px;font-size:13px;font-weight:700;border:1px solid var(--line);transition:.25s}.btn.primary{background:var(--text);color:#080a0f}.btn.primary:hover{transform:translateY(-2px);box-shadow:0 12px 35px rgba(255,255,255,.12)}.btn.secondary:hover{border-color:rgba(255,255,255,.25);transform:translateY(-2px)}
.social-row{display:flex;gap:22px;margin-top:32px}.social-row a{font-size:12px;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:3px}.social-row a:hover{color:var(--text)}
.hero-visual{height:480px;display:flex;align-items:center;justify-content:center}.profile-card{width:min(360px,90%);padding:28px;background:linear-gradient(145deg,rgba(22,29,41,.95),rgba(10,13,19,.9));border:1px solid var(--line);border-radius:22px;box-shadow:0 30px 100px rgba(0,0,0,.45);transform:rotate(-4deg);position:relative;z-index:3}.profile-photo{height:250px;border-radius:15px;background:radial-gradient(circle at 30% 20%,rgba(77,141,255,.3),transparent 35%),linear-gradient(135deg,#182235,#0b0f17);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.photo-placeholder{font:700 82px "Space Grotesk";letter-spacing:-6px;color:rgba(255,255,255,.13)}.status-dot{position:absolute;right:14px;bottom:14px;width:12px;height:12px;background:#52d98a;border:3px solid #111722;border-radius:50%}.profile-info{padding-top:20px;display:grid;gap:4px}.profile-info span{font-size:9px;color:var(--blue);letter-spacing:1.5px}.profile-info strong{font:700 27px "Space Grotesk"}.profile-info small{color:var(--muted)}.mini-stat{position:absolute;right:20px;top:20px;text-align:right}.mini-stat strong{display:block;font-size:22px}.mini-stat span{font-size:9px;color:var(--muted);text-transform:uppercase}
.orbit{position:absolute;border:1px solid rgba(77,141,255,.18);border-radius:50%;transform:rotate(28deg)}.orbit-a{width:500px;height:260px}.orbit-b{width:570px;height:340px;border-color:rgba(255,138,61,.12);transform:rotate(-30deg)}.floating-card{position:absolute;z-index:5;display:flex;gap:10px;align-items:center;background:rgba(15,20,29,.9);border:1px solid var(--line);padding:12px 15px;border-radius:12px;box-shadow:0 15px 40px rgba(0,0,0,.3);font-size:11px}.floating-card>span{font-size:20px;color:var(--orange)}.floating-card small{display:block;color:var(--muted);font-size:9px}.card-top{top:55px;right:0}.card-bottom{bottom:55px;left:0}.card-bottom>span{color:var(--blue)}
.scroll-hint{position:absolute;bottom:35px;left:max(28px,calc((100vw - var(--max))/2));font-size:9px;letter-spacing:2px;color:var(--muted)}.scroll-hint span{margin-left:9px;color:var(--text)}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:55px}.section-heading h2{font-size:clamp(40px,5vw,62px);margin-left:auto;max-width:750px}
.about{border-top:1px solid var(--line)}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px}.about-copy{max-width:570px}.lead{font:600 30px "Space Grotesk";margin-bottom:20px}.about-copy p:not(.lead){color:var(--muted);margin-bottom:18px}.text-link{display:inline-block;margin-top:15px;font-size:13px;font-weight:700;border-bottom:1px solid var(--line);padding-bottom:5px}.text-link span{color:var(--orange);margin-left:7px}
.about-facts{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line)}.fact{padding:23px 0;border-bottom:1px solid var(--line)}.fact:nth-child(odd){padding-right:20px;border-right:1px solid var(--line)}.fact:nth-child(even){padding-left:25px}.fact span{display:block;color:var(--muted);font-size:9px;letter-spacing:1.5px;margin-bottom:8px}.fact strong{display:block;font-size:15px}.fact small{color:var(--muted);font-size:11px}
.skills-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:80px}.skill-intro>p{color:var(--muted);max-width:420px;margin-bottom:40px}.skill-meter{margin:23px 0}.skill-meter>span{font-size:11px;color:var(--muted)}.skill-meter>div{height:2px;background:var(--line);margin-top:8px}.skill-meter i{display:block;height:100%;width:88%;background:linear-gradient(90deg,var(--blue),var(--orange))}.skill-meter:nth-child(3) i{width:80%}.skill-meter:nth-child(4) i{width:92%}.skill-cloud{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.skill-card{min-height:120px;border:1px solid var(--line);background:var(--panel);border-radius:12px;padding:20px;display:flex;flex-direction:column;justify-content:space-between;transition:.25s}.skill-card:hover{transform:translateY(-5px);border-color:rgba(77,141,255,.4);background:var(--panel2)}.skill-card b{font:700 22px "Space Grotesk";color:var(--blue)}.skill-card span{font-size:12px;color:var(--muted)}
.project-list{display:grid;gap:12px}.project-card{display:grid;grid-template-columns:90px 1fr 60px;align-items:center;gap:20px;padding:32px 28px;background:var(--panel);border:1px solid var(--line);border-radius:13px;transition:.3s}.project-card:hover{transform:translateX(5px);border-color:rgba(255,255,255,.18)}.project-card.featured{background:linear-gradient(110deg,rgba(77,141,255,.1),rgba(255,138,61,.04)),var(--panel)}.project-number{font:600 14px "Space Grotesk";color:var(--muted)}.project-top{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.5px;color:var(--muted);margin-bottom:9px}.project-main h3{font-size:29px;margin-bottom:8px}.project-main p{color:var(--muted);font-size:13px;max-width:760px}.tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:15px}.tags span,.leadership-tags span{font-size:9px;letter-spacing:.8px;border:1px solid var(--line);padding:5px 8px;border-radius:5px;color:#b9c2cf}.project-arrow{width:42px;height:42px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;transition:.25s}.project-arrow:hover{background:var(--text);color:var(--bg);transform:rotate(10deg)}
.achievements{border-top:1px solid var(--line)}.timeline{margin-left:15%;border-left:1px solid var(--line)}.timeline-item{display:grid;grid-template-columns:100px 1fr;gap:25px;position:relative;padding:0 0 48px 45px}.timeline-item:last-child{padding-bottom:0}.timeline-item>span{font-size:11px;color:var(--muted)}.timeline-dot{position:absolute;width:9px;height:9px;border-radius:50%;background:var(--bg);border:2px solid var(--blue);left:-5px;top:4px}.timeline-item h3{font-size:22px;margin-bottom:6px}.timeline-item p{font-size:13px;color:var(--muted)}
.leadership-box{padding:60px;border:1px solid var(--line);border-radius:18px;background:radial-gradient(circle at 90% 10%,rgba(255,138,61,.09),transparent 30%),var(--panel);display:grid;grid-template-columns:1fr 1fr;gap:80px}.leadership-box h2{font-size:52px;margin-top:18px}.leadership-copy{color:var(--muted);font-size:14px;align-self:end}.leadership-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:25px}
.contact{min-height:75vh;display:flex;align-items:center;justify-content:space-between;overflow:hidden}.contact-content{position:relative;z-index:2}.contact h2{font-size:clamp(52px,7vw,92px);margin:18px 0 25px}.contact p{color:var(--muted);max-width:500px;margin-bottom:28px}.contact-decoration{position:absolute;right:5%;font:700 320px "Space Grotesk";color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.05);transform:rotate(-12deg);pointer-events:none}
footer{max-width:var(--max);margin:auto;padding:28px;color:var(--muted);font-size:10px;border-top:1px solid var(--line);display:flex;justify-content:space-between;letter-spacing:.3px}footer a:hover{color:var(--text)}
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:translateY(0)}.delay{transition-delay:.15s}
@media(max-width:900px){nav{gap:15px;margin-right:15px}.nav-cta{display:none}.hero{grid-template-columns:1fr;gap:20px;padding-top:130px}.hero-visual{height:400px}.card-top{right:5%}.card-bottom{left:5%}.about-grid,.skills-layout,.leadership-box{grid-template-columns:1fr;gap:45px}.section-heading{display:block}.section-heading h2{margin-top:14px}.timeline{margin-left:5%}.contact-decoration{opacity:.5}}
@media(max-width:680px){.navbar{padding:0 20px}.menu-toggle{display:block}nav{position:absolute;top:76px;left:15px;right:15px;margin:0;padding:18px;display:none;flex-direction:column;gap:17px;background:rgba(13,17,25,.98);border:1px solid var(--line);border-radius:10px}nav.open{display:flex}.hero{padding-left:20px;padding-right:20px;min-height:auto;padding-bottom:110px}.section{padding:90px 20px}h1{font-size:48px}.hero-text{font-size:15px}.hero-visual{height:330px}.profile-card{width:300px;padding:18px}.profile-photo{height:190px}.floating-card{transform:scale(.85)}.card-top{top:15px;right:-5px}.card-bottom{bottom:10px;left:-5px}.orbit-a{width:350px;height:200px}.orbit-b{width:390px;height:240px}.skill-cloud{grid-template-columns:1fr 1fr}.skill-card{min-height:105px}.project-card{grid-template-columns:45px 1fr;padding:24px 18px}.project-arrow{display:none}.project-main h3{font-size:23px}.project-top{font-size:8px}.timeline-item{grid-template-columns:1fr;gap:5px;padding-left:30px}.leadership-box{padding:35px 25px}.leadership-box h2{font-size:42px}.contact{min-height:65vh}.contact-decoration{font-size:200px;right:-35px}footer{padding:24px 20px;flex-wrap:wrap;gap:12px}}
.profile-photo {
  position: relative;
  width: 82px;
  height: 82px;
  border-radius: 50%;
  overflow: visible;
}

.profile-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  display: block;
}

.status-dot {
  position: absolute;
  right: 2px;
  bottom: 4px;
  width: 15px;
  height: 15px;
  background: #22c55e;
  border: 3px solid #0b0d12;
  border-radius: 50%;
}