:root{--bg:#07090d;--panel:#0d1118;--line:#1c2632;--text:#f4f7fb;--muted:#97a3b2;--accent:#66e3ff;--accent2:#8d7cff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,sans-serif;background:var(--bg);color:var(--text);line-height:1.65}a{text-decoration:none;color:inherit}.nav{position:fixed;z-index:20;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:22px 6vw;background:linear-gradient(180deg,rgba(7,9,13,.92),rgba(7,9,13,.45),transparent);backdrop-filter:blur(10px)}.brand{font:700 1.05rem 'Space Grotesk';letter-spacing:.08em}.brand span,.section-head span,h1 span{color:var(--accent)}nav{display:flex;gap:28px;color:#c2cbd5;font-size:.88rem}nav a:hover{color:white}.menu-btn{display:none;background:none;border:0;color:white;font-size:1.4rem}.hero{min-height:100vh;display:grid;grid-template-columns:1.15fr .85fr;align-items:center;padding:120px 8vw 70px;gap:30px;background:radial-gradient(circle at 75% 35%,rgba(102,227,255,.14),transparent 25%),radial-gradient(circle at 55% 60%,rgba(141,124,255,.12),transparent 22%)}.eyebrow{letter-spacing:.18em;font-size:.72rem;color:var(--accent);font-weight:700}.hero h1{font:700 clamp(3rem,7vw,6.4rem)/.95 'Space Grotesk';margin:14px 0 24px;letter-spacing:-.055em}.lead{max-width:680px;color:var(--muted);font-size:1.08rem}.cta{display:flex;gap:12px;margin:30px 0}.btn{padding:13px 20px;border-radius:999px;font-weight:700;font-size:.88rem}.primary{background:var(--text);color:#071018}.ghost{border:1px solid var(--line);color:#dce5ed}.mini-stats{display:flex;gap:30px;margin-top:34px}.mini-stats div{display:grid}.mini-stats b{font-size:1.05rem}.mini-stats span{font-size:.75rem;color:var(--muted)}.orb-wrap{height:520px;position:relative;display:grid;place-items:center}.orb{width:min(35vw,390px);height:min(35vw,390px);border-radius:50%;background:conic-gradient(from 160deg,var(--accent),#152034,var(--accent2),#152034,var(--accent));filter:blur(.2px);box-shadow:0 0 100px rgba(102,227,255,.12);animation:float 7s ease-in-out infinite}.orb:after{content:"";position:absolute;inset:35px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#162838,#090d13 65%);box-shadow:inset 0 0 80px rgba(102,227,255,.08)}.profile-photo{position:absolute;z-index:2;width:clamp(230px,25vw,320px);height:clamp(290px,34vw,400px);object-fit:cover;object-position:center 12%;border-radius:22px;border:1px solid rgba(226,232,240,.24);background:#f7f8fa;box-shadow:0 24px 65px rgba(0,0,0,.48),0 8px 24px rgba(0,0,0,.22);outline:1px solid rgba(255,255,255,.04);outline-offset:4px}.floating-card{z-index:3;position:absolute;background:rgba(13,17,24,.82);border:1px solid var(--line);backdrop-filter:blur(14px);padding:12px 16px;border-radius:12px;font-size:.78rem}.card-one{top:18%;left:0}.card-two{right:0;top:44%}.card-three{bottom:17%;left:10%}.section{padding:110px 8vw}.dark{background:#0a0d12}.section-head{max-width:820px;margin-bottom:50px}.section-head h2{font:700 clamp(2.2rem,4.5vw,4.2rem)/1.03 'Space Grotesk';letter-spacing:-.04em;margin:8px 0}.glass{background:linear-gradient(145deg,#0e141c,#0a0e14);border:1px solid var(--line);border-radius:24px;padding:34px}.glass p{color:#bac4ce}.about-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:20px}.about-list{display:grid;gap:12px}.about-list>div{padding:23px;border-top:1px solid var(--line);display:grid;grid-template-columns:42px 1fr;column-gap:16px}.about-list span{color:var(--accent);grid-row:1/3}.about-list small{color:var(--muted);grid-column:2}.skill-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.skill-card{border:1px solid var(--line);border-radius:20px;padding:27px;background:rgba(255,255,255,.015)}.skill-card strong,.project span{color:var(--accent);font-size:.75rem}.skill-card h3{font:600 1.25rem 'Space Grotesk';margin:22px 0 8px}.skill-card p,.project p,.job p{color:var(--muted);font-size:.88rem}.tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}.tags i{font-style:normal;font-size:.69rem;border:1px solid var(--line);padding:6px 9px;border-radius:999px;color:#c9d2db}.timeline{border-left:1px solid var(--line);margin-left:12px}.job{display:grid;grid-template-columns:160px 1fr;gap:25px;padding:0 0 45px 32px;position:relative}.job:before{content:"";position:absolute;left:-5px;top:7px;width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 6px #0a0d12}.year{color:#c4ced8;font-size:.82rem}.job h3{font:600 1.35rem 'Space Grotesk';margin:0}.company{color:var(--accent)!important;margin:.3rem 0}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.project{border:1px solid var(--line);border-radius:22px;padding:30px;min-height:230px;transition:.25s;display:flex;flex-direction:column}.project:hover{transform:translateY(-6px);border-color:#314052}.project h3{font:600 1.45rem 'Space Grotesk';margin:32px 0 7px}.project em{font-style:normal;margin-top:auto;color:var(--accent);font-size:.8rem}.contact{padding-bottom:90px}.contact-box{border:1px solid var(--line);border-radius:28px;padding:55px;background:radial-gradient(circle at 85% 20%,rgba(102,227,255,.12),transparent 25%),#0c1118}.contact h2{font:700 clamp(2.4rem,5vw,4.8rem)/1 'Space Grotesk';letter-spacing:-.04em;margin:12px 0 18px}.contact p{color:var(--muted);max-width:700px}.contact-links{display:flex;gap:12px;margin-top:28px}.contact-links a{padding:12px 17px;border:1px solid var(--line);border-radius:999px;font-size:.8rem}footer{border-top:1px solid var(--line);padding:22px 8vw;display:flex;justify-content:space-between;color:#6f7b87;font-size:.75rem}@keyframes float{50%{transform:translateY(-14px) rotate(3deg)}}.reveal{opacity:0;transform:translateY(22px);transition:.75s ease}.reveal.show{opacity:1;transform:none}@media(max-width:900px){nav{display:none;position:absolute;right:6vw;top:70px;flex-direction:column;background:#0c1118;border:1px solid var(--line);padding:15px 20px;border-radius:14px}.menu-btn{display:block}.hero{grid-template-columns:1fr;padding-top:130px}.orb-wrap{height:420px}.orb{width:300px;height:300px}.profile-photo{width:230px;height:300px;border-radius:20px}.card-one{left:0;top:12%}.card-two{right:0;top:43%}.card-three{left:5%;bottom:6%}.about-grid,.skill-grid,.project-grid{grid-template-columns:1fr}.job{grid-template-columns:1fr;gap:5px}.section{padding:85px 7vw}.contact-box{padding:38px 25px}footer{padding:18px 7vw}}

/* Portrait layout refinement: keep all labels clear of the face */
.orb-wrap{overflow:visible;isolation:isolate}
.profile-photo{
  width:clamp(220px,20vw,260px);
  height:clamp(290px,29vw,350px);
  object-fit:cover;
  object-position:center 10%;
  border-radius:20px;
  border:1px solid rgba(226,232,240,.28);
  box-shadow:0 24px 64px rgba(0,0,0,.48),0 8px 22px rgba(0,0,0,.20);
}
.floating-card{white-space:nowrap;max-width:max-content}
.card-one{left:-8%;top:14%}
.card-two{right:-8%;top:44%}
.card-three{left:-4%;bottom:8%}

/* On mobile, use a clean portrait first and stack skill labels below it */
@media(max-width:900px){
  .orb-wrap{
    height:auto;
    min-height:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    gap:11px;
    padding:20px 0 12px;
  }
  .orb{display:none}
  .profile-photo{
    position:relative;
    inset:auto;
    display:block;
    flex:none;
    width:min(64vw,245px);
    height:auto;
    aspect-ratio:3/4;
    margin:0 auto 6px;
    border-radius:20px;
    object-position:center 8%;
  }
  .floating-card{
    position:relative;
    inset:auto;
    display:block;
    align-self:center;
    width:max-content;
    max-width:100%;
    margin:0;
    transform:none;
    white-space:normal;
    text-align:center;
    font-size:clamp(.68rem,2.8vw,.78rem);
    line-height:1.35;
    padding:10px 13px;
    border-radius:12px;
    background:rgba(13,17,24,.92);
    border:1px solid rgba(226,232,240,.20);
    box-shadow:0 8px 24px rgba(0,0,0,.22);
  }
  .card-one,.card-two,.card-three{left:auto;right:auto;top:auto;bottom:auto}
}
@media(min-width:901px){
  .hero{grid-template-columns:minmax(0,1.05fr) minmax(390px,.95fr)}
  .orb-wrap{min-width:0}
}
