:root{--ink:#e8f0f7;--muted:#9fb0c2;--navy:#07111f;--navy-2:#0b1828;--panel:#101f31;--line:#20364b;--cyan:#57d7e6;--teal:#33bca8;--white:#fff;--max:1180px;--radius:18px}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;scroll-padding-top:84px}body{background:var(--navy);color:var(--ink);font-family:"DM Sans",sans-serif;font-size:16px;line-height:1.65;overflow-x:hidden}body::before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 12% 10%,rgba(87,215,230,.07),transparent 28%),radial-gradient(circle at 85% 45%,rgba(51,188,168,.05),transparent 30%);z-index:-1}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button{font:inherit}.skip-link{position:fixed;left:1rem;top:-5rem;background:var(--white);color:var(--navy);padding:.7rem 1rem;z-index:2000;border-radius:8px}.skip-link:focus{top:1rem}
.site-header{height:74px;position:fixed;inset:0 0 auto;z-index:1000;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - var(--max))/2));background:rgba(7,17,31,.88);border-bottom:1px solid rgba(159,176,194,.14);backdrop-filter:blur(16px)}.logo{display:inline-flex;align-items:center;gap:.7rem;font:600 1rem "Space Grotesk",sans-serif;white-space:nowrap}.logo span{display:grid;place-items:center;width:36px;height:36px;border:1px solid rgba(87,215,230,.55);border-radius:10px;color:var(--cyan);font-size:.78rem;letter-spacing:.08em;background:rgba(87,215,230,.08)}.navbar{display:flex;align-items:center;gap:1.45rem}.navbar a{font-size:.83rem;color:var(--muted);font-weight:600;position:relative}.navbar a:hover,.navbar a.active{color:var(--white)}.navbar a.active::after{content:"";position:absolute;left:0;right:0;bottom:-11px;height:2px;background:var(--cyan);border-radius:2px}.menu-toggle{display:none;border:0;background:none;color:var(--white);font-size:1.3rem;cursor:pointer}
.hero{min-height:100vh;max-width:var(--max);margin:auto;padding:140px 0 80px;display:grid;grid-template-columns:1.1fr .78fr;align-items:center;gap:7rem;position:relative}.hero-grid{position:absolute;inset:74px -20vw 0;z-index:-1;opacity:.14;background-image:linear-gradient(rgba(87,215,230,.25) 1px,transparent 1px),linear-gradient(90deg,rgba(87,215,230,.25) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,black,transparent 85%)}.eyebrow{text-transform:uppercase;letter-spacing:.16em;color:var(--cyan);font-size:.73rem;font-weight:700;margin-bottom:1.2rem}.status-dot{display:inline-block;width:7px;height:7px;background:var(--teal);box-shadow:0 0 0 5px rgba(51,188,168,.12);border-radius:50%;margin-right:.65rem}h1,h2,h3{font-family:"Space Grotesk",sans-serif;line-height:1.12}h1{font-size:clamp(3.6rem,6vw,6.5rem);letter-spacing:-.06em;max-width:850px}h1 span{display:block;color:var(--cyan)}.hero-role{font-size:clamp(1.25rem,2vw,1.65rem);line-height:1.45;max-width:720px;margin:1.8rem 0 .9rem;color:#c9d7e3}.hero-role strong{color:var(--white);font-weight:600}.hero-summary{color:var(--muted);max-width:660px;font-size:1.05rem}.role-list{display:flex;flex-wrap:wrap;gap:.55rem;margin:1.5rem 0 2rem}.role-list span,.tags span,.tech-line span{font-size:.76rem;border:1px solid var(--line);background:rgba(16,31,49,.78);color:#bcd0df;border-radius:99px;padding:.38rem .7rem}.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem}.button{min-height:48px;padding:.75rem 1.2rem;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;gap:.7rem;font-weight:700;font-size:.9rem;transition:.2s ease}.button.primary{background:var(--cyan);color:#04131d}.button.primary:hover{background:#80e5ef;transform:translateY(-2px)}.button.secondary{border:1px solid var(--line);background:rgba(16,31,49,.65)}.button.secondary:hover{border-color:var(--cyan);color:var(--cyan)}.social-links{display:flex;gap:.7rem;margin-top:2rem}.social-links a{width:40px;height:40px;display:grid;place-items:center;color:var(--muted);border:1px solid var(--line);border-radius:10px}.social-links a:hover{color:var(--cyan);border-color:var(--cyan)}
.hero-visual{position:relative}.portrait-frame{padding:12px;border:1px solid var(--line);border-radius:26px;background:linear-gradient(145deg,rgba(87,215,230,.08),rgba(16,31,49,.88));box-shadow:0 32px 80px rgba(0,0,0,.3)}.portrait-frame img{aspect-ratio:4/5;object-fit:cover;object-position:top center;border-radius:18px;filter:saturate(.88) contrast(1.03)}.portrait-caption{display:flex;justify-content:space-between;gap:1rem;padding:1rem .35rem .2rem}.portrait-caption span{color:var(--muted);font-size:.75rem}.portrait-caption strong{font-size:.8rem;text-align:right}.signal-card{position:absolute;padding:.6rem .8rem;background:rgba(11,24,40,.95);border:1px solid var(--line);border-radius:10px;font-size:.72rem;box-shadow:0 12px 30px rgba(0,0,0,.25)}.signal-card i{color:var(--cyan);margin-right:.45rem}.signal-one{left:-12%;top:14%}.signal-two{right:-10%;top:43%}.signal-three{left:-8%;bottom:17%}
.section{max-width:var(--max);margin:auto;padding:112px 0}.section-heading{margin-bottom:3.2rem;max-width:760px}.section-heading h2,.contact h2{font-size:clamp(2.3rem,4vw,4.2rem);letter-spacing:-.045em}.section-heading>p:last-child:not(.eyebrow){color:var(--muted);margin-top:1rem;font-size:1.05rem}.about-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:5rem;align-items:start}.about-copy{font-size:1.22rem;color:#c4d2de}.about-copy p+p{margin-top:1.4rem}.focus-panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:1.7rem}.panel-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.13em;color:var(--muted);margin-bottom:1rem}.focus-panel ul,.timeline ul,.project-card ul,.credential-panel ul{list-style:none}.focus-panel li{display:flex;gap:1rem;padding:1rem 0;border-top:1px solid var(--line)}.focus-panel li>span{color:var(--cyan);font:600 .8rem "Space Grotesk"}.focus-panel strong,.focus-panel small{display:block}.focus-panel small{color:var(--muted);margin-top:.2rem;line-height:1.4}
.skills{max-width:none;background:rgba(11,24,40,.58);border-block:1px solid rgba(32,54,75,.65)}.skills>.section-heading,.skills-grid{max-width:var(--max);margin-left:auto;margin-right:auto}.skills-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.skill-card{padding:1.6rem;border:1px solid var(--line);background:rgba(7,17,31,.75);border-radius:var(--radius);min-height:225px}.skill-card.featured{border-color:rgba(87,215,230,.48);background:linear-gradient(145deg,rgba(87,215,230,.08),rgba(7,17,31,.88))}.skill-card>i{color:var(--cyan);font-size:1.25rem;margin-bottom:1.4rem}.skill-card h3{font-size:1.08rem;margin-bottom:1rem}.tags,.tech-line{display:flex;flex-wrap:wrap;gap:.45rem}
.timeline{border-top:1px solid var(--line)}.timeline-item{display:grid;grid-template-columns:.34fr 1fr;gap:3rem;padding:3rem 0;border-bottom:1px solid var(--line)}.timeline-meta span,.timeline-meta small{display:block}.timeline-meta span{font-weight:700;color:var(--cyan)}.timeline-meta small{color:var(--muted);margin-top:.35rem}.company{color:var(--cyan);font-weight:700;font-size:.82rem;text-transform:uppercase;letter-spacing:.09em}.timeline-content h3{font-size:1.65rem;margin:.35rem 0 1.3rem}.timeline-content ul{display:grid;gap:.75rem;color:#b8c7d4}.timeline-content li{position:relative;padding-left:1.3rem}.timeline-content li::before,.project-card li::before{content:"";position:absolute;left:0;top:.7em;width:5px;height:5px;background:var(--teal);border-radius:50%}
.projects{max-width:none;background:#091524}.projects>.section-heading,.project-grid,.section-action{max-width:var(--max);margin-left:auto;margin-right:auto}.project-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem}.project-card{overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}.project-card.project-wide{grid-column:1/-1;display:grid;grid-template-columns:1.02fr .98fr}.project-card img{width:100%;aspect-ratio:16/10;object-fit:cover}.project-wide img{height:100%;aspect-ratio:auto}.project-body{padding:1.7rem}.project-kicker{display:flex;justify-content:space-between;gap:1rem;color:var(--cyan);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700}.project-kicker time,.project-kicker span:last-child:not(:first-child){color:var(--muted)}.project-body h3{font-size:1.55rem;margin:.8rem 0}.project-body>p{color:var(--muted)}.project-body ul{display:grid;gap:.55rem;margin:1.2rem 0;color:#c0ced9;font-size:.9rem}.project-body li{position:relative;padding-left:1rem}.section-action{text-align:center;margin-top:2.5rem}.text-link{color:var(--cyan);font-weight:700}.text-link i{margin-left:.4rem;font-size:.8rem}
.education-card{position:relative;display:grid;grid-template-columns:110px 1fr auto;align-items:center;gap:2rem;padding:2rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);overflow:hidden}.education-card img{width:110px;height:90px;object-fit:contain;background:#fff;border-radius:10px;padding:.5rem}.education-card h3{font-size:1.55rem;margin:.4rem 0}.education-card p:not(.company){color:var(--muted)}.education-card .location{margin-top:.5rem}.education-year{font:700 5rem "Space Grotesk";color:rgba(87,215,230,.1);letter-spacing:-.07em}
.credentials{max-width:none;background:rgba(11,24,40,.58);border-block:1px solid rgba(32,54,75,.65)}.credentials>.section-heading,.credentials-grid{max-width:var(--max);margin-left:auto;margin-right:auto}.credentials-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}.credential-panel{padding:2rem;border:1px solid var(--line);background:rgba(7,17,31,.76);border-radius:var(--radius)}.credential-panel h3{font-size:1.4rem;margin-bottom:1.5rem}.credential-panel ul{display:grid}.credential-panel li{display:flex;gap:1rem;align-items:flex-start;padding:1rem 0;border-top:1px solid var(--line)}.credential-panel li>i{color:var(--cyan);width:20px;margin-top:.35rem}.credential-panel strong,.credential-panel span{display:block}.credential-panel span{color:var(--muted);font-size:.85rem;margin-top:.2rem}
.contact-card{display:grid;grid-template-columns:1.2fr .8fr;gap:4rem;align-items:end;padding:clamp(2rem,5vw,4.5rem);background:linear-gradient(135deg,#43cbd6,#32ad9d);color:#03151d;border-radius:26px}.contact-card .eyebrow{color:#07313a}.contact-card>div>p:last-child{max-width:650px;margin-top:1rem}.contact-actions{display:flex;flex-direction:column;align-items:flex-end;gap:1rem}.button.light{background:#f3fbfb;color:#07111f;max-width:100%;overflow-wrap:anywhere}.contact-actions p{font-size:.88rem;font-weight:700}.site-footer{max-width:var(--max);margin:auto;padding:3rem 0;display:grid;grid-template-columns:auto 1fr auto;gap:2rem;align-items:center;border-top:1px solid var(--line);color:var(--muted);font-size:.82rem}.site-footer>p:nth-of-type(1){text-align:center}.footer-links{display:flex;gap:1rem}.footer-links a:hover{color:var(--cyan)}.copyright{grid-column:1/-1;text-align:center;font-size:.74rem}.scroll-top{position:fixed;right:1.2rem;bottom:1.2rem;width:42px;height:42px;display:grid;place-items:center;background:var(--cyan);color:var(--navy);border-radius:10px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s;z-index:900}.scroll-top.visible{opacity:1;visibility:visible;transform:none}.reveal{opacity:0;transform:translateY(20px);transition:opacity .65s ease,transform .65s ease}.reveal.in-view{opacity:1;transform:none}
@media(max-width:1228px){.hero,.section,.site-footer{margin-left:24px;margin-right:24px}.skills>.section-heading,.skills-grid,.projects>.section-heading,.project-grid,.section-action,.credentials>.section-heading,.credentials-grid{margin-left:24px;margin-right:24px}}
@media(max-width:980px){.navbar{position:fixed;top:74px;right:0;bottom:0;width:min(340px,84vw);padding:2rem;display:flex;flex-direction:column;align-items:flex-start;background:#0b1828;border-left:1px solid var(--line);transform:translateX(105%);transition:.25s}.navbar.open{transform:none}.navbar a{font-size:1rem;width:100%;padding:.5rem 0}.navbar a.active::after{display:none}.menu-toggle{display:block}.hero{grid-template-columns:1fr;gap:4rem;padding-top:130px}.hero-visual{max-width:480px;margin:auto}.about-layout{grid-template-columns:1fr;gap:2rem}.skills-grid{grid-template-columns:repeat(2,1fr)}.project-card.project-wide{display:block}.project-wide img{aspect-ratio:16/10}.site-footer{grid-template-columns:1fr;text-align:center}.site-footer .logo,.footer-links{justify-self:center}.site-footer>p:nth-of-type(1){text-align:center}.copyright{grid-column:auto}}
@media(max-width:700px){html{scroll-padding-top:72px}.site-header{height:66px;padding:0 18px}.navbar{top:66px}.site-header .logo{font-size:.88rem}.hero,.section,.site-footer{margin-left:18px;margin-right:18px}.skills>.section-heading,.skills-grid,.projects>.section-heading,.project-grid,.section-action,.credentials>.section-heading,.credentials-grid{margin-left:18px;margin-right:18px}.hero{padding-top:110px}.section{padding-top:82px;padding-bottom:82px}h1{font-size:3.35rem}.signal-card{display:none}.skills-grid,.project-grid,.credentials-grid{grid-template-columns:1fr}.timeline-item{grid-template-columns:1fr;gap:1.2rem}.education-card{grid-template-columns:74px 1fr;gap:1rem}.education-card img{width:74px;height:70px}.education-year{display:none}.contact-card{grid-template-columns:1fr;gap:2rem}.contact-actions{align-items:flex-start}.site-footer{padding:2.5rem 0}.site-footer>p:nth-of-type(1){display:none}}
@media(max-width:420px){h1{font-size:2.9rem}.hero-actions .button{width:100%}.portrait-caption{display:block}.portrait-caption strong{display:block;text-align:left;margin-top:.25rem}.project-body{padding:1.25rem}.project-kicker{display:block}.project-kicker time{display:block;margin-top:.3rem}.contact-card{padding:1.6rem}.button.light{font-size:.8rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}
.hero-content,.hero-visual{min-width:0}h1 span{overflow-wrap:anywhere}.menu-toggle{width:42px;height:42px;padding:10px}.menu-icon,.menu-icon::before,.menu-icon::after{display:block;width:22px;height:2px;background:currentColor;border-radius:2px;transition:.2s}.menu-icon{position:relative}.menu-icon::before,.menu-icon::after{content:"";position:absolute;left:0}.menu-icon::before{top:-7px}.menu-icon::after{top:7px}.menu-toggle[aria-expanded="true"] .menu-icon{background:transparent}.menu-toggle[aria-expanded="true"] .menu-icon::before{top:0;transform:rotate(45deg)}.menu-toggle[aria-expanded="true"] .menu-icon::after{top:0;transform:rotate(-45deg)}