:root{--ink: #0b1220;--ink-line: rgba(255, 255, 255, .1);--bg: #f8fafc;--surface: #ffffff;--text: #0f172a;--text-muted: #475569;--text-on-ink: #e2e8f0;--muted-on-ink: #94a3b8;--border: #e2e8f0;--border-strong: #cbd5e1;--accent: #0e7490;--accent-hover: #155e75;--accent-soft: #ecfeff;--accent-bright: #22d3ee;--success: #22c55e;--danger: #b42318;--font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-heading: "Plus Jakarta Sans", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;--fs-small: .875rem;--fs-body: 1rem;--fs-lead: 1.125rem;--fs-h3: 1.125rem;--fs-h2: clamp(1.875rem, 1.4rem + 1.6vw, 2.5rem);--fs-h1: clamp(2.5rem, 1.6rem + 4vw, 4.25rem);--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.5rem;--space-6: 2rem;--space-7: 3rem;--space-8: 4rem;--space-9: 6rem;--container: 1140px;--measure: 68ch;--header-h: 68px;--radius: 12px;--radius-sm: 8px;--shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);--shadow-md: 0 10px 30px -12px rgba(15, 23, 42, .18);--ease: cubic-bezier(.2, .6, .2, 1);--duration: .2s}html{scroll-padding-top:calc(var(--header-h) + var(--space-4))}@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}body{font-family:var(--font-body);font-size:var(--fs-body);line-height:1.65;background-color:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}a{color:var(--accent);text-decoration:none;transition:color var(--duration) var(--ease)}a:hover{color:var(--accent-hover)}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);color:var(--text);line-height:1.2;letter-spacing:-.01em}img{max-width:100%;height:auto}:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}.site-header :focus-visible,.hero :focus-visible,.contact-panel :focus-visible,.site-footer :focus-visible{outline-color:var(--accent-bright)}main:focus{outline:none}::selection{background:var(--accent);color:#fff}.container{max-width:var(--container);padding-left:var(--space-5);padding-right:var(--space-5)}@media(max-width:575px){.container{padding-left:var(--space-4);padding-right:var(--space-4)}}.skip-link{position:absolute;left:var(--space-4);top:-100px;z-index:1000;padding:var(--space-2) var(--space-4);background:var(--accent);color:#fff;border-radius:var(--radius-sm)}.skip-link:focus{top:var(--space-3);color:#fff}.btn-primary-solid,.btn-ghost,.header-cta,.contact .contact-form button[type=submit]{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:46px;padding:var(--space-2) var(--space-5);font-family:var(--font-heading);font-size:.9375rem;font-weight:600;border-radius:var(--radius-sm);border:1px solid transparent;transition:background-color var(--duration) var(--ease),color var(--duration) var(--ease),border-color var(--duration) var(--ease)}.btn-primary-solid,.contact .contact-form button[type=submit]{background:var(--accent);border-color:var(--accent);color:#fff}.btn-primary-solid:hover,.contact .contact-form button[type=submit]:hover{background:var(--accent-hover);border-color:var(--accent-hover);color:#fff}.btn-primary-solid .bi{transition:transform var(--duration) var(--ease)}.btn-primary-solid:hover .bi{transform:translate(3px)}.btn-ghost{background:transparent;border-color:#ffffff47;color:#fff}.btn-ghost:hover{background:#ffffff14;border-color:#ffffff80;color:#fff}.site-header{position:sticky;top:0;z-index:100;background:#0b1220eb;border-bottom:1px solid var(--ink-line);transition:box-shadow var(--duration) var(--ease)}@supports (backdrop-filter: blur(8px)){.site-header{backdrop-filter:blur(8px)}}.site-header.is-scrolled{box-shadow:0 6px 24px -12px #00000080}.header-inner{display:flex;align-items:center;gap:var(--space-5);min-height:var(--header-h)}.brand{display:inline-flex;align-items:center;gap:var(--space-3);margin-right:auto;font-family:var(--font-heading);font-size:1.0625rem;font-weight:700;color:#fff}.brand img{width:36px;height:36px;object-fit:contain}.brand:hover{color:#fff}.header-cta{min-height:40px;padding:var(--space-1) var(--space-4);background:var(--accent);color:#fff;font-size:.875rem}.header-cta:hover{background:var(--accent-hover);color:#fff}.navbar{position:static;padding:0}.navbar ul{display:flex;align-items:center;gap:var(--space-1);margin:0;padding:0;list-style:none}.navbar .nav-link{display:block;position:relative;padding:var(--space-2) var(--space-3);font-family:var(--font-heading);font-size:.9375rem;font-weight:500;color:var(--muted-on-ink)}.navbar .nav-link:after{content:"";position:absolute;left:var(--space-3);right:var(--space-3);bottom:0;height:2px;border-radius:2px;background:var(--accent-bright);transform:scaleX(0);transform-origin:left;transition:transform var(--duration) var(--ease)}.navbar .nav-link:hover,.navbar .nav-link.active{color:#fff}.navbar .nav-link:hover:after,.navbar .nav-link.active:after{transform:scaleX(1)}.mobile-nav-toggle{display:none;align-items:center;justify-content:center;width:44px;height:44px;padding:0;background:none;border:0;border-radius:var(--radius-sm);color:#fff;font-size:1.75rem;line-height:1}@media(max-width:991px){.mobile-nav-toggle{display:inline-flex}.header-inner{gap:var(--space-2)}.navbar{order:3}.navbar ul{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:var(--space-2) var(--space-4) var(--space-4);background:var(--ink);border-bottom:1px solid var(--ink-line);box-shadow:0 16px 32px -16px #0009}.navbar.is-open ul{display:flex}.navbar .nav-link{padding:var(--space-3) var(--space-2);font-size:1rem;border-bottom:1px solid var(--ink-line)}.navbar li:last-child .nav-link{border-bottom:0}.navbar .nav-link:after{display:none}.navbar .nav-link.active{color:var(--accent-bright)}}@media(max-width:420px){.header-cta{display:none}}.social-links{display:flex;flex-wrap:wrap;gap:var(--space-2)}.social-links a{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid var(--ink-line);border-radius:var(--radius-sm);background:#ffffff0a;color:var(--text-on-ink);font-size:1.0625rem;transition:color var(--duration) var(--ease),border-color var(--duration) var(--ease),background-color var(--duration) var(--ease),transform var(--duration) var(--ease)}.social-links a:hover{color:#fff;border-color:var(--accent-bright);background:#22d3ee1a;transform:translateY(-2px)}section{padding:var(--space-9) 0}@media(max-width:767px){section{padding:var(--space-8) 0}}.about,.services{background:var(--surface);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.section-title{max-width:640px;margin-bottom:var(--space-7)}.section-eyebrow{display:inline-flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3);font-family:var(--font-heading);font-size:var(--fs-small);font-weight:700;letter-spacing:.08em;color:var(--accent)}.section-eyebrow:after{content:"";width:40px;height:2px;border-radius:2px;background:currentColor}.section-title h2{margin:0 0 var(--space-2);font-size:var(--fs-h2);font-weight:800}.section-title p{margin:0;color:var(--text-muted);font-size:var(--fs-lead)}.section-action{margin-top:var(--space-5)}.js-reveal .reveal{opacity:0;transform:translateY(16px);transition:opacity .5s var(--ease),transform .5s var(--ease);transition-delay:var(--reveal-delay, 0ms)}.js-reveal .reveal.is-visible{opacity:1;transform:none}.hero{position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:calc(100vh - var(--header-h));min-height:calc(100svh - var(--header-h));padding:clamp(3rem,7vw,5rem) 0 0;background-color:var(--ink);color:var(--text-on-ink)}.hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse 80% 70% at 70% 30%,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse 80% 70% at 70% 30%,#000 30%,transparent 75%);pointer-events:none}.hero:after{content:"";position:absolute;top:-20%;right:-10%;width:60%;height:80%;background:radial-gradient(closest-side,rgba(34,211,238,.16),transparent);pointer-events:none}.hero .container{position:relative;z-index:1;flex:1;display:flex;flex-direction:column}.hero-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);align-items:center;align-content:center;flex:1;gap:var(--space-8)}.hero-status{display:inline-flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-5);padding:var(--space-1) var(--space-3);border:1px solid var(--ink-line);border-radius:999px;background:#ffffff0a;font-size:var(--fs-small);color:var(--text-on-ink)}.status-dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--success);box-shadow:0 0 0 4px #22c55e2e}.hero-name{margin:0 0 var(--space-3);font-size:var(--fs-h1);font-weight:800;letter-spacing:-.03em;color:#fff}.hero-role{margin:0 0 var(--space-3);font-family:var(--font-heading);font-size:clamp(1.25rem,1rem + 1vw,1.75rem);font-weight:600;color:var(--accent-bright)}.hero-summary{margin:0 0 var(--space-3);font-size:var(--fs-lead);color:var(--text-on-ink)}.hero-location{margin:0 0 var(--space-6);color:var(--muted-on-ink)}.hero-location .bi{color:var(--accent-bright)}.hero-actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-bottom:var(--space-6)}.hero-photo{position:relative;justify-self:end;width:100%;max-width:clamp(300px,26vw,440px)}.hero-photo:before{content:"";position:absolute;inset:0;transform:translate(16px,16px);border:2px solid rgba(34,211,238,.55);border-radius:20px}.hero-photo img{position:relative;display:block;width:100%;aspect-ratio:1 / 1;object-fit:cover;border-radius:20px;box-shadow:0 30px 60px -20px #0009}.tech-strip{margin-top:clamp(2.5rem,5vw,4rem);padding:var(--space-5) 0 var(--space-6);border-top:1px solid var(--ink-line)}.tech-label{margin:0 0 var(--space-3);font-size:var(--fs-small);font-weight:500;color:var(--muted-on-ink)}.tech-list{display:flex;flex-wrap:wrap;gap:var(--space-3) var(--space-6);margin:0;padding:0;list-style:none}.tech-list li{display:inline-flex;align-items:center;gap:var(--space-2);font-family:var(--font-heading);font-weight:600;color:var(--text-on-ink)}.tech-list .bx{font-size:1.375rem;color:var(--accent-bright)}@media(prefers-reduced-motion:no-preference){.hero-text>*,.hero-photo{animation:hero-in .7s var(--ease) both}.hero-text>:nth-child(2){animation-delay:60ms}.hero-text>:nth-child(3){animation-delay:.12s}.hero-text>:nth-child(4){animation-delay:.18s}.hero-text>:nth-child(5){animation-delay:.22s}.hero-text>:nth-child(6){animation-delay:.26s}.hero-text>:nth-child(7){animation-delay:.3s}.hero-photo{animation-delay:.15s}}@keyframes hero-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@media(max-width:991px){.hero-grid{grid-template-columns:minmax(0,1fr);gap:var(--space-7)}.hero-photo{order:-1;justify-self:start;max-width:200px}.hero-photo:before{transform:translate(10px,10px)}}.about-me .content h3{margin-bottom:var(--space-4);font-size:1.5rem;font-weight:700}.about-lead{max-width:var(--measure);margin-bottom:var(--space-5);padding-left:var(--space-4);border-left:3px solid var(--accent);font-size:var(--fs-lead);line-height:1.7;color:var(--text)}.about-body{max-width:var(--measure);margin:0;color:var(--text-muted)}.about-body+.about-body{margin-top:var(--space-3)}.about-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-5);margin:0;padding:var(--space-6);background:var(--bg);border:1px solid var(--border);border-radius:var(--radius)}.about-facts dt{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-1);font-size:.8125rem;font-weight:600;letter-spacing:.02em;color:var(--text-muted)}.about-facts dt .bi{color:var(--accent)}.about-facts dd{margin:0;font-weight:500;overflow-wrap:anywhere}@media(max-width:399px){.about-facts{grid-template-columns:minmax(0,1fr);padding:var(--space-5)}}.resume-card{width:100%;padding:var(--space-6);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm)}.resume-title,.resume-heading{display:flex;align-items:center;gap:var(--space-2);font-weight:700}.resume-title{margin:0 0 var(--space-4);font-size:var(--fs-small);letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}.resume-heading{margin:var(--space-8) 0 var(--space-5);font-size:1.5rem}.resume-heading .bi{color:var(--accent)}.resume-card h4,.timeline-body h4{margin-bottom:var(--space-1);font-size:1.1875rem;font-weight:700}.resume-org{margin-bottom:var(--space-3);color:var(--text-muted)}.resume-org .bi{margin-right:var(--space-1);color:var(--accent)}.resume-date,.timeline-date{margin-bottom:var(--space-1);font-family:var(--font-heading);font-size:var(--fs-small);font-weight:700;color:var(--text-muted)}.resume-contact{margin:0;padding:0;list-style:none}.resume-contact li{padding-bottom:var(--space-2)}.resume-contact .bi{margin-right:var(--space-2);color:var(--accent)}.timeline{position:relative;margin:0;padding:0;list-style:none}.timeline:before{content:"";position:absolute;top:8px;bottom:8px;left:11rem;width:2px;background:var(--border)}.timeline-item{position:relative;display:grid;grid-template-columns:11rem minmax(0,1fr);padding-bottom:var(--space-5)}.timeline-item:last-child{padding-bottom:0}.timeline-item:before{content:"";position:absolute;top:6px;left:calc(11rem - 6px);width:14px;height:14px;border-radius:50%;background:var(--surface);border:3px solid var(--border-strong)}.timeline-item.is-current:before{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}.timeline-meta{padding-right:var(--space-6)}.badge-current{display:inline-block;margin-top:var(--space-1);padding:2px var(--space-2);border-radius:6px;background:var(--accent-soft);color:var(--accent-hover);font-size:.75rem;font-weight:700}.timeline-body{margin-left:var(--space-6);padding:var(--space-5) var(--space-6);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:box-shadow var(--duration) var(--ease),border-color var(--duration) var(--ease)}.timeline-body:hover{border-color:var(--border-strong);box-shadow:var(--shadow-md)}.timeline-body ul{max-width:var(--measure);margin:0;padding-left:var(--space-5);color:var(--text-muted)}.timeline-body ul li::marker{color:var(--accent)}.timeline-body ul li+li{margin-top:var(--space-2)}.role-tech{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-3);margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px dashed var(--border)}.role-tech-label{font-family:var(--font-heading);font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}.timeline-body .role-tech .tags{max-width:none;margin:0;padding-left:0;color:var(--text)}.timeline-body .role-tech .tags li,.timeline-body .role-tech .tags li+li{margin-top:0;padding:1px var(--space-2);font-size:.8125rem}@media(max-width:767px){.timeline:before{left:6px}.timeline-item{grid-template-columns:minmax(0,1fr);padding-left:var(--space-6)}.timeline-item:before{left:0}.timeline-meta{display:flex;align-items:center;gap:var(--space-2);padding:0 0 var(--space-2)}.badge-current{margin-top:0;margin-bottom:var(--space-1)}.timeline-body{margin-left:0;padding:var(--space-5) var(--space-4)}}.skills-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:var(--space-4)}.skill-group{padding:var(--space-5);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}.skill-group h4{margin:0;font-size:.9375rem;font-weight:700}.tags{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:var(--space-3) 0 0;padding:0;list-style:none}.tags li{padding:3px var(--space-3);border:1px solid var(--border);border-radius:6px;background:var(--bg);font-size:var(--fs-small);color:var(--text)}.services .row{row-gap:var(--space-5)}.services .icon-box{position:relative;width:100%;padding:var(--space-6);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);transition:transform var(--duration) var(--ease),box-shadow var(--duration) var(--ease),border-color var(--duration) var(--ease)}.services .icon-box:before{content:"";position:absolute;left:var(--space-6);right:var(--space-6);top:-1px;height:3px;border-radius:0 0 3px 3px;background:var(--accent);transform:scaleX(0);transition:transform var(--duration) var(--ease)}.services .icon-box:hover{transform:translateY(-4px);border-color:var(--border-strong);box-shadow:var(--shadow-md)}.services .icon-box:hover:before{transform:scaleX(1)}.services .icon-box .icon{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;margin-bottom:var(--space-4);border-radius:var(--radius-sm);background:var(--accent-soft)}.services .icon-box .icon i{color:var(--accent);font-size:1.625rem}.services .icon-box h3{margin-bottom:var(--space-2);font-size:var(--fs-h3);font-weight:700}.services .icon-box p{margin:0;color:var(--text-muted);font-size:.9375rem}@media(prefers-reduced-motion:reduce){.services .icon-box:hover,.social-links a:hover{transform:none}}.contact-panel{position:relative;overflow:hidden;padding:clamp(1.5rem,4vw,3.5rem);background:var(--ink);border-radius:20px;color:var(--text-on-ink)}.contact-panel:before{content:"";position:absolute;bottom:-40%;left:-15%;width:60%;height:90%;background:radial-gradient(closest-side,rgba(34,211,238,.14),transparent);pointer-events:none}.contact-panel>.row{position:relative}.contact-intro{margin:0 0 var(--space-5);font-family:var(--font-heading);font-size:clamp(1.5rem,1.2rem + 1vw,2rem);font-weight:800;line-height:1.2;color:#fff}.contact-info{margin:0;padding:0;list-style:none}.contact-info li{display:flex;gap:var(--space-4);padding:var(--space-4) 0;border-top:1px solid var(--ink-line)}.contact-info li:first-child{border-top:0;padding-top:0}.contact-info li>i{flex:none;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-sm);background:#22d3ee1a;color:var(--accent-bright);font-size:1.25rem}.contact-info h3{margin:0 0 2px;font-size:var(--fs-small);font-weight:600;color:var(--muted-on-ink)}.contact-info p{margin:0;color:#fff;overflow-wrap:anywhere}.contact-info a{color:#fff}.contact-info a:hover{color:var(--accent-bright)}.contact-info .social-links{margin-top:var(--space-2)}.contact .contact-form{padding:var(--space-6);background:var(--surface);border-radius:var(--radius);color:var(--text)}.contact .contact-form label{display:block;margin-bottom:var(--space-1);font-size:var(--fs-small);font-weight:600}.contact .contact-form .form-control{min-height:46px;border:1px solid #94a3b8;border-radius:var(--radius-sm);color:var(--text);background:var(--surface)}.contact .contact-form .form-control:focus{border-color:var(--accent);box-shadow:0 0 0 3px #0e74902e}.contact .contact-form .form-control.is-invalid{border-color:var(--danger);background-image:none;padding-right:.75rem}.contact .contact-form button[type=submit]{width:100%}.contact .contact-form :focus-visible{outline-color:var(--accent)}.field-error{margin:var(--space-1) 0 0;font-size:var(--fs-small);color:var(--danger)}.form-alert{margin-bottom:var(--space-4);padding:var(--space-3) var(--space-4);border:1px solid var(--danger);border-radius:var(--radius-sm);background:#fdf3f2;color:var(--danger);font-size:.9375rem}@media(max-width:575px){.contact .contact-form{padding:var(--space-5) var(--space-4)}}.site-footer{background:var(--ink);color:var(--muted-on-ink)}.footer-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-4);padding-top:var(--space-6);padding-bottom:var(--space-6)}.site-footer .brand{margin-right:0}.site-footer .brand img{width:32px;height:32px}.credits{font-size:var(--fs-small);text-align:right}.credits a{color:#fff}.credits a:hover{color:var(--accent-bright)}@media(max-width:575px){.footer-inner{flex-direction:column;text-align:center}.credits{text-align:center}}.back-to-top{position:fixed;right:var(--space-5);bottom:var(--space-5);z-index:90;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-sm);background:var(--accent);color:#fff;font-size:1.25rem;box-shadow:var(--shadow-md);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity var(--duration) var(--ease),transform var(--duration) var(--ease),visibility var(--duration),background-color var(--duration) var(--ease)}.back-to-top.is-visible{opacity:1;visibility:visible;transform:none}.back-to-top:hover{background:var(--accent-hover);color:#fff}
