/*! tailwindcss v3.4 | base */
*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}
:after,:before{--tw-content:""}
html{line-height:1.5;-webkit-text-size-adjust:100%;tab-size:4;font-family:var(--font-body);font-feature-settings:normal;font-variation-settings:normal}
body{margin:0;min-height:100vh;position:relative;background-color:var(--color-background);color:var(--color-text-primary)}
body::before{content:"";position:fixed;inset:0;background-image:radial-gradient(ellipse 80% 50% at 50% -20%,rgba(59,130,246,0.15),transparent),radial-gradient(ellipse 60% 40% at 100% 100%,rgba(139,92,246,0.1),transparent),radial-gradient(ellipse 40% 30% at 0% 0%,rgba(34,197,94,0.08),transparent);pointer-events:none;z-index:-2}
body::after{content:"";position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");opacity:0.03;pointer-events:none;z-index:-1}
::selection{background:var(--color-primary);color:var(--color-background)}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:var(--color-background)}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--color-primary),var(--color-accent));border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,var(--color-primary-dark),var(--color-accent-dark))}
:root{--color-primary:#3B82F6;--color-primary-dark:#2563EB;--color-primary-light:#60A5FA;--color-accent:#8B5CF6;--color-accent-dark:#7C3AED;--color-accent-light:#A78BFA;--color-background:#050816;--color-surface:#0A0F26;--color-surface-elevated:#11182F;--color-border:#1E293B;--color-border-light:#334155;--color-text-primary:#F8FAFC;--color-text-secondary:#94A3B8;--color-text-muted:#64748B;--color-success:#22C55E;--color-warning:#F59E0B;--color-error:#EF4444;--font-display:"Space Grotesk",sans-serif;--font-body:"Inter",sans-serif;--font-mono:"JetBrains Mono",monospace}
html{scroll-behavior:smooth}

/* Utilities */
.text-balance{text-wrap:balance}
.text-display{font-family:var(--font-display);font-weight:700;letter-spacing:-0.02em}
.text-body{font-family:var(--font-body)}
.text-mono{font-family:var(--font-mono)}
.text-muted{color:var(--color-text-muted)}
.glass{background:rgba(10,15,38,0.7);backdrop-filter:blur(20px);border:1px solid var(--color-border)}
.glass-strong{background:rgba(10,15,38,0.85);backdrop-filter:blur(30px);border:1px solid var(--color-border-light)}
.glass-card{background:linear-gradient(135deg,rgba(17,24,47,0.9) 0%,rgba(10,15,38,0.7) 100%);backdrop-filter:blur(20px);border:1px solid var(--color-border)}
.gradient-text{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-accent) 50%,var(--color-primary-light) 100%);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.grid-pattern{background-image:linear-gradient(rgba(59,130,246,0.03) 1px,transparent 1px),linear-gradient(90deg,rgba(59,130,246,0.03) 1px,transparent 1px);background-size:60px 60px}
.typing-cursor{display:inline-block;width:2px;height:1.2em;background:var(--color-primary);animation:blink 1s infinite;margin-left:4px;vertical-align:text-bottom}

/* Components */
.btn-primary{position:relative;padding:14px 32px;border-radius:12px;font-weight:500;overflow:hidden;background:linear-gradient(135deg,var(--color-primary),var(--color-accent));color:var(--color-background);transition:all .3s ease-out;display:inline-flex;align-items:center;gap:8px;cursor:pointer;text-decoration:none}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 0 40px rgba(59,130,246,0.3)}
.btn-primary:active{transform:translateY(0)}
.btn-ghost{position:relative;padding:14px 32px;border-radius:12px;font-weight:500;overflow:hidden;background:transparent;color:var(--color-text-primary);border:1px solid var(--color-border-light);transition:all .3s ease-out;display:inline-flex;align-items:center;gap:8px;cursor:pointer;text-decoration:none}
.btn-ghost:hover{border-color:var(--color-primary);color:var(--color-primary);background:rgba(59,130,246,0.1)}
.section-container{max-width:1280px;margin:0 auto;padding-left:1.5rem;padding-right:1.5rem}
@media(min-width:768px){.section-container{padding-left:3rem;padding-right:3rem}}
@media(min-width:1280px){.section-container{padding-left:5rem;padding-right:5rem}}
.section-title{font-family:var(--font-display);font-weight:700;letter-spacing:-0.02em;font-size:2.25rem;margin-bottom:1.5rem;background:linear-gradient(135deg,var(--color-text-primary) 0%,var(--color-primary) 50%,var(--color-accent) 100%);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
@media(min-width:768px){.section-title{font-size:3rem}}
@media(min-width:1024px){.section-title{font-size:3.75rem}}
.section-subtitle{font-family:var(--font-body);font-size:1.125rem;max-width:42rem;color:var(--color-text-muted)}
@media(min-width:768px){.section-subtitle{font-size:1.25rem}}
.nav-link{position:relative;color:var(--color-text-muted);transition:color .3s ease-out;padding:4px;cursor:pointer;background:none;border:none;font-family:var(--font-body);font-size:inherit}
.nav-link::after{content:"";position:absolute;bottom:0;left:0;height:2px;width:0;background:var(--color-primary);transition:width .3s ease-out}
.nav-link:hover,.nav-link.active{color:var(--color-primary)}
.nav-link:hover::after,.nav-link.active::after{width:100%}
#navbar.scrolled{background:rgba(5,8,22,0.95)!important;border-bottom-color:var(--color-border-light)}
.skill-tag{padding:8px 16px;border-radius:12px;font-size:.875rem;font-weight:500;transition:all .3s ease-out;cursor:default;background:rgba(17,24,47,0.8);border:1px solid var(--color-border);display:inline-flex;align-items:center;gap:6px}
.skill-tag:hover{border-color:var(--color-primary);background:rgba(59,130,246,0.1);transform:translateY(-2px);box-shadow:0 8px 24px rgba(59,130,246,0.2)}
.skill-bar{width:100%;height:.5rem;border-radius:9999px;overflow:hidden;background:var(--color-border)}
.skill-bar-fill{height:100%;border-radius:9999px;background:linear-gradient(90deg,var(--color-primary),var(--color-accent))}
.tl-dot{border-color:var(--color-primary);background:var(--color-background)}
.tl-inner{background:var(--color-primary)}
.tl-card{border-left:3px solid var(--color-primary)}
.tl-badge{background:rgba(59,130,246,0.13);color:var(--color-primary);border:1px solid rgba(59,130,246,0.27)}
.skill-tag:hover{border-color:var(--color-primary);background:rgba(59,130,246,0.1);transform:translateY(-2px);box-shadow:0 8px 24px rgba(59,130,246,0.2)}
.skill-category{font-family:var(--font-display);font-weight:600;color:var(--color-primary);margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid var(--color-border)}
.project-card{background:linear-gradient(135deg,rgba(17,24,47,0.9) 0%,rgba(10,15,38,0.7) 100%);backdrop-filter:blur(20px);border:1px solid var(--color-border);border-radius:16px;overflow:hidden;padding:1.5rem;transition:all .3s ease-out}
.project-card:hover{transform:translateY(-8px);box-shadow:0 0 40px rgba(59,130,246,0.3);border-color:var(--color-primary)}
.timeline-item{position:relative;padding-left:3rem;padding-bottom:3rem}
.timeline-item:last-child{padding-bottom:0}
.timeline-item::before{content:"";position:absolute;left:0;top:4px;width:2px;height:100%;background:linear-gradient(180deg,var(--color-primary),var(--color-accent))}
.social-link{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;transition:all .3s ease-out;background:rgba(17,24,47,0.8);border:1px solid var(--color-border);color:var(--color-text-secondary);text-decoration:none}
.social-link:hover{background:linear-gradient(135deg,var(--color-primary),var(--color-accent));border-color:transparent;color:var(--color-background);transform:translateY(-4px) scale(1.1);box-shadow:0 0 40px rgba(59,130,246,0.3)}
.terminal-window{background:rgba(10,15,38,0.85);backdrop-filter:blur(30px);border:1px solid var(--color-border-light);border-radius:16px;overflow:hidden;font-family:var(--font-mono);font-size:.875rem}
.terminal-header{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--color-border);background:rgba(17,24,47,0.9)}
.terminal-body{padding:16px;max-height:400px;overflow-y:auto}
.terminal-prompt{display:flex;align-items:center;gap:8px;color:var(--color-primary);flex-shrink:0}
.terminal-input{background:transparent;border:none;outline:none;color:var(--color-text-primary);flex:1;font-family:var(--font-mono);font-size:.875rem}
.input-field{width:100%;padding:16px 20px;border-radius:12px;font-family:var(--font-body);background:rgba(10,15,38,0.5);border:1px solid var(--color-border-light);color:var(--color-text-primary);transition:all .3s ease-out}
.input-field::placeholder{color:var(--color-text-muted)}
.input-field:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(59,130,246,0.4)}
.card-hover{transition:all .3s ease-out}
.card-hover:hover{transform:translateY(-8px);box-shadow:0 0 40px rgba(59,130,246,0.3);border-color:var(--color-primary)}

/* Animations */
@keyframes blink{0%,50%{opacity:1}51%,100%{opacity:0}}
@keyframes rotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes gradient-shift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}

/* Tailwind utility classes */
.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0}
.z-10{z-index:10}.z-40{z-index:40}.z-50{z-index:50}.-z-10{z-index:-10}.-z-20{z-index:-20}
.mx-auto{margin-left:auto;margin-right:auto}.my-4{margin-top:1rem;margin-bottom:1rem}
.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-10{margin-top:2.5rem}.mt-12{margin-top:3rem}.mt-16{margin-top:4rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}.mb-16{margin-bottom:4rem}
.mr-1{margin-right:.25rem}.ml-2{margin-left:.5rem}.ml-auto{margin-left:auto}
.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.hidden{display:none}
.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-center{align-items:center}.items-end{align-items:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}
.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-12{gap:3rem}.gap-\[3px\]{gap:3px}
.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem*var(--tw-space-y-reverse))}
.space-y-6>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem*var(--tw-space-y-reverse))}
.space-y-8>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(2rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(2rem*var(--tw-space-y-reverse))}
.space-y-12>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(3rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(3rem*var(--tw-space-y-reverse))}
.w-2{width:.5rem}.w-3{width:.75rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-7{width:1.75rem}.w-8{width:2rem}.w-9{width:2.25rem}.w-10{width:2.5rem}.w-12{width:3rem}.w-16{width:4rem}.w-20{width:5rem}.w-24{width:6rem}.w-full{width:100%}.w-\[12px\]{width:12px}.w-\[40px\]{width:40px}
.h-2{height:.5rem}.h-3{height:.75rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-7{height:1.75rem}.h-8{height:2rem}.h-9{height:2.25rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-16{height:4rem}.h-20{height:5rem}.h-24{height:6rem}.h-full{height:100%}.h-\[12px\]{height:12px}.h-\[13px\]{height:13px}.min-h-screen{min-height:100vh}.min-h-\[60px\]{min-height:60px}.min-h-\[150px\]{min-height:150px}
.max-w-md{max-width:28rem}.max-w-2xl{max-width:42rem}.max-w-5xl{max-width:64rem}
.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}
.rounded{border-radius:.25rem}.rounded-sm{border-radius:.125rem}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-2xl{border-radius:1rem}.rounded-3xl{border-radius:1.5rem}.rounded-full{border-radius:9999px}
.border{border-width:1px}.border-t{border-top-width:1px}.border-b{border-bottom-width:1px}
.border-border{border-color:var(--color-border)}.border-border-light{border-color:var(--color-border-light)}
.bg-transparent{background:transparent}.bg-background{background:var(--color-background)}.bg-surface{background:var(--color-surface)}
.p-2{padding:.5rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-8{padding:2rem}
.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}
.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-20{padding-top:5rem;padding-bottom:5rem}
.pt-4{padding-top:1rem}.pb-2{padding-bottom:.5rem}.pr-1{padding-right:.25rem}
.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}
.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.text-5xl{font-size:3rem}
.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}
.uppercase{text-transform:uppercase}.tracking-wider{letter-spacing:.05em}.leading-relaxed{line-height:1.625}.leading-\[1\.1\]{line-height:1.1}
.text-primary{color:var(--color-primary)}.text-accent{color:var(--color-accent)}.text-success{color:var(--color-success)}.text-warning{color:var(--color-warning)}.text-error{color:var(--color-error)}.text-text-primary{color:var(--color-text-primary)}.text-text-secondary{color:var(--color-text-secondary)}.text-text-muted{color:var(--color-text-muted)}.text-background{color:var(--color-background)}
.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.opacity-0{opacity:0}.opacity-15{opacity:.15}.opacity-20{opacity:.2}
.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}
.duration-300{transition-duration:.3s}
.pointer-events-none{pointer-events:none}
.aspect-video{aspect-ratio:16/9}.aspect-square{aspect-ratio:1/1}
.cursor-pointer{cursor:pointer}
.overflow-y-auto{overflow-y:auto}
.whitespace-pre-wrap{white-space:pre-wrap}
.break-words{word-wrap:break-word}

/* Extra */
.pulse-glow{animation:pulseGlow 2s infinite}
@keyframes pulseGlow{0%,100%{box-shadow:0 0 6px var(--color-primary)}50%{box-shadow:0 0 20px var(--color-primary)}}
.hover\:scale-150:hover{transform:scale(1.5)}
.hover\:underline:hover{text-decoration:underline}
.group:hover .group-hover\:opacity-100{opacity:1}

/* Responsive */
@media(min-width:768px){
  .md\:flex{display:flex}.md\:hidden{display:none}
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
  .md\:text-7xl{font-size:4.5rem}.md\:py-32{padding-top:8rem;padding-bottom:8rem}.md\:px-12{padding-left:3rem;padding-right:3rem}.md\:gap-16{gap:4rem}
}
@media(min-width:1024px){
  .lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lg\:gap-20{gap:5rem}.lg\:text-8xl{font-size:6rem}.lg\:px-20{padding-left:5rem;padding-right:5rem}
}
@media(min-width:1280px){
  .xl\:px-32{padding-left:8rem;padding-right:8rem}
}

/* Orbit ring */
.orbital-ring::before{content:"";position:absolute;inset:-2px;border-radius:50%;background:conic-gradient(from 0deg,var(--color-primary),var(--color-accent),var(--color-primary));animation:rotate 20s linear infinite;z-index:-1;opacity:0.5;filter:blur(8px)}

/* ===== Missing Utilities ===== */
.top-0{top:0}
.left-0{left:0}
.right-0{right:0}
.bottom-6{bottom:1.5rem}
.left-6{left:1.5rem}
.right-6{right:1.5rem}
.z-20{z-index:20}
.z-30{z-index:30}
.pt-2{padding-top:.5rem}.pt-5{padding-top:1.25rem}.pt-8{padding-top:2rem}
.pt-16{padding-top:4rem}
.py-1{padding-top:.25rem;padding-bottom:.25rem}
.py-3{padding-top:.75rem;padding-bottom:.75rem}
.p-3{padding:.75rem}
.mt-1{margin-top:.25rem}
.w-14{width:3.5rem}
.h-14{height:3.5rem}
.w-56{width:14rem}
.h-56{height:14rem}
.w-64{width:16rem}
.h-64{height:16rem}
.text-6xl{font-size:3.75rem}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.border-2{border-width:2px}
.bg-opacity-80{opacity:0.8}
.flex-row-reverse{flex-direction:row-reverse}
.group{position:relative}
.hover\:text-primary:hover{color:var(--color-primary)}
.hover\:text-text-primary:hover{color:var(--color-text-primary)}
@media(min-width:768px){
  .md\:text-lg{font-size:1.125rem}
  .md\:text-2xl{font-size:1.5rem}
  .md\:text-3xl{font-size:1.875rem}
  .md\:text-6xl{font-size:3.75rem}
  .md\:w-64{width:16rem}
  .md\:h-64{height:16rem}
  .md\:w-80{width:20rem}
  .md\:h-80{height:20rem}
  .md\:flex-row{flex-direction:row}
  .md\:items-start{align-items:flex-start}
}
@media(min-width:1024px){
  .lg\:w-96{width:24rem}
  .lg\:h-96{height:24rem}
  .lg\:flex-row{flex-direction:row}
  .lg\:justify-start{justify-content:flex-start}
  .lg\:text-left{text-align:left}
  .lg\:mx-0{margin-left:0;margin-right:0}
}