:root{--page:#d5d5d3;--surface:#eeeeeC;--white:#fafaf9;--ink:#242423;--muted:#666664;--line:#dadad7}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;padding:56px 24px;background:var(--page);color:var(--ink);font-family:'Segoe UI',Arial,sans-serif;font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:2px solid #333;outline-offset:5px}::selection{background:#c9c9c4}.portfolio-shell{max-width:1120px;margin:auto;background:var(--surface);border:2px solid #fafaf9;border-radius:64px;overflow:hidden;box-shadow:0 16px 55px #22222205}.topbar{padding:34px 48px;display:flex;align-items:center;justify-content:space-between;gap:24px}.email-tools{display:flex;align-items:center;gap:10px}.email-address{font-size:.8rem;margin-right:6px}.pill{display:inline-flex;align-items:center;justify-content:center;gap:13px;border:1px solid #e8e8e5;background:var(--white);color:#222;border-radius:999px;padding:14px 28px;min-height:48px;font-size:.875rem;font-weight:500;transition:background .2s,transform .2s}.pill:hover{background:#e2e2df;color:#222;transform:translateY(-2px)}.small-pill{font-size:.75rem;padding:8px 19px;min-height:34px}.topbar nav{display:flex;align-items:center;gap:11px;font-size:.8rem}.topbar nav>span{color:#aaa}.topbar nav a:hover{text-decoration:underline;text-underline-offset:5px}.hero{text-align:center;padding:40px 24px 76px;border-radius:0 0 70px 70px}.avatar-wrap{position:relative;width:106px;margin:0 auto 24px}.avatar{width:106px;height:106px;border-radius:50%;border:5px solid #fafaf9;box-shadow:0 0 0 1px #dededb;display:flex;align-items:center;justify-content:center;font-size:1.6rem;letter-spacing:-1.8px;font-weight:650;color:#42423f;background:#d8d8d4}.avatar span{color:#8b8b85}.name-sticker{position:absolute;white-space:nowrap;left:81px;top:36px;padding:8px 13px;border-radius:30px;background:#fff;font-size:.65rem;transform:rotate(-11deg);box-shadow:0 4px 12px #22222204}.name-sticker span{margin-left:4px}.hero-role{font-size:.75rem;color:#6e6e69;margin-bottom:17px}h1{font-size:clamp(2.7rem,4.6vw,3.65rem);line-height:1.12;letter-spacing:-2.3px;font-weight:600;margin:0 0 22px}h1 span,h2 span{color:#72726c}.hero-description{font-size:.875rem;line-height:1.75;color:var(--muted);margin-bottom:26px}.dark-pill{background:#252523;color:#fff;border-color:#252523;box-shadow:inset 0 0 0 3px #ffffff08}.dark-pill:hover{background:#42423e;border-color:#42423e;color:#fff}.technology-strip{background:var(--white);border-radius:0 0 65px 65px;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:55px 48px;min-height:155px}.technology-strip>span{font-size:1.2rem;font-weight:650;letter-spacing:-.6px;white-space:nowrap}.technology-strip .tech-light{font-weight:400;font-size:.9rem}.technology-strip .javascript{font-weight:600;letter-spacing:-1px}.bootstrap-brand{font-weight:750!important}.php-brand{font-style:italic;font-size:1.65rem!important}.database-brand{font-family:Georgia,serif}.content-section{padding:75px 60px}.services h2{text-align:center;font-size:1.6rem;line-height:1.5;letter-spacing:-.6px;font-weight:500;margin:0 auto 40px;max-width:720px}.section-divider{height:32px;display:flex;align-items:center;justify-content:center;position:relative;margin-bottom:48px}.section-divider:before{content:'';position:absolute;left:0;right:0;height:1px;background:var(--line)}.section-divider>span{position:relative;display:inline-block;padding:7px 23px;background:#fff;border-radius:30px;font-size:.75rem;transform:rotate(-8deg)}.service-grid{--bs-gutter-x:2.3rem}.service-icon{display:flex;align-items:center;height:45px;margin-bottom:17px;font-size:2rem;line-height:1;font-weight:400}.code-icon{font-family:monospace;font-size:1.55rem}.service-grid h3{font-size:1rem;font-weight:500;letter-spacing:-.25px;margin-bottom:12px}.service-grid p{font-size:.875rem;color:var(--muted);line-height:1.65;margin:0}.work-section{padding-top:20px}.section-intro{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:32px}h2{font-size:2rem;line-height:1.3;font-weight:500;letter-spacing:-1px}.section-intro p{font-size:.875rem;color:var(--muted);margin-bottom:8px}.project{background:#fafaf9;border-radius:24px;padding:12px;height:100%;display:flex;flex-direction:column;border:1px solid #e5e5e1}.project-visual{background:#dfdfda;border-radius:16px;min-height:238px;padding:25px;display:flex;flex-direction:column;justify-content:space-between;gap:24px}.project-category{font-size:.65rem;letter-spacing:1.3px}.project-visual strong{font-size:1.75rem;font-weight:500;letter-spacing:-.9px;line-height:1.2}.visual-caption{font-size:.75rem;color:#5c5c56}.gym-visual{background:#33332f;color:#f7f7f2}.gym-visual .visual-caption{color:#ccccC4}.project-content{padding:22px 13px 16px;display:flex;flex-direction:column;flex:1}.project h3{font-size:1.1rem;font-weight:600;line-height:1.4;letter-spacing:-.4px}.project p{font-size:.9rem;color:var(--muted);margin:10px 0 22px}.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}.tags span{background:#eeeee9;border-radius:30px;font-size:.7rem;padding:5px 10px;color:#60605a}.additional-projects{margin-top:32px}.additional-projects article{display:grid;grid-template-columns:30px 1fr auto;gap:20px;border-bottom:1px solid var(--line);padding:24px 0;align-items:start}.project-number{font-size:.75rem;color:#82827b;padding-top:3px}.additional-projects h3{font-size:1rem;font-weight:500;line-height:1.5;margin-bottom:7px}.additional-projects p{font-size:.875rem;color:var(--muted);margin:0}.project-kind{font-size:.75rem;color:#71716a;padding-top:4px}.experience-section{padding-top:20px}.background-copy{font-size:.9rem;color:var(--muted);margin:20px 0 0}.job{border-bottom:1px solid var(--line);padding:0 0 22px;margin-bottom:24px}.job:last-child{margin-bottom:0}.job-heading{display:flex;justify-content:space-between;gap:20px}.job h3{font-size:1.05rem;font-weight:600;line-height:1.4}.job-heading>span{font-size:.75rem;color:#77776f;white-space:nowrap}.organization{font-size:.8rem;color:#797972;margin-bottom:12px}.job>p:last-child{font-size:.9rem;color:var(--muted);margin:0}.qualifications{margin-top:30px}.qualification-panel{background:#f8f8f5;border-radius:22px;padding:26px;height:100%}.overline{font-size:.65rem;letter-spacing:1.4px;color:#73736c;margin-bottom:22px}.qualification-panel h3{font-size:1.1rem;font-weight:500}.qualification-panel>p:not(.overline){font-size:.8rem;color:var(--muted)}.credential-list{padding:0;margin:20px 0 0;list-style:none}.credential-list li,.language{display:flex;justify-content:space-between;gap:12px;font-size:.8rem;padding:11px 0;border-bottom:1px solid #e3e3dd}.credential-list li>span:last-child,.language>span:last-child{color:#73736c;text-align:right}.credential-list li:last-child{border:0}.strengths{display:flex;flex-wrap:wrap;gap:7px;margin-top:24px}.strengths>span{font-size:.75rem;background:#eaeae5;padding:5px 10px;border-radius:20px;color:#64645d}.contact-section{text-align:center;background:var(--white);border-radius:65px 65px 0 0;padding:60px 24px 44px}.contact-symbol{width:84px;height:84px;border-radius:50%;background:#efefeb;display:flex;align-items:center;justify-content:center;font-size:2.4rem;margin:0 auto 25px;font-weight:300}.contact-section h2{font-size:2.5rem;letter-spacing:-1.2px}.contact-section>p{font-size:.875rem;color:var(--muted);margin:17px 0 24px}.contact-actions{display:flex;justify-content:center;gap:12px}.contact-section .contact-details{font-size:.75rem;margin:26px 0 0}.contact-details>span{margin:0 10px}footer{display:flex;justify-content:space-between;gap:20px;background:var(--white);margin:0;padding:24px 48px;border-top:1px solid #e6e6e1;font-size:.75rem;color:#73736b}footer p{margin:0}.skip{position:fixed;left:20px;top:-100px;background:white;padding:12px;z-index:999}.skip:focus{top:10px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:991px){body{padding:28px 18px}.portfolio-shell{border-radius:45px}.topbar{padding:28px 30px;flex-wrap:wrap}.content-section{padding-inline:35px}.technology-strip{padding:36px 30px;gap:28px;flex-wrap:wrap;justify-content:center}.technology-strip>span{font-size:1.1rem}.hero{padding-top:32px}.service-grid{--bs-gutter-y:2.5rem}.experience-section h2 br{display:none}.project-kind{display:none}.additional-projects article{grid-template-columns:26px 1fr}.section-intro p br{display:none}.section-intro p{max-width:230px}.name-sticker{left:70px}}
@media(max-width:575px){body{padding:12px 8px}.portfolio-shell{border-radius:32px}.topbar{padding:22px 19px;justify-content:center;gap:19px}.email-address{font-size:.7rem;margin-right:0}.email-tools{gap:6px}.small-pill{padding:7px 12px;min-height:32px;font-size:.7rem}.topbar nav{font-size:.75rem;gap:16px}.hero{padding:30px 20px 48px}.avatar{width:90px;height:90px}.avatar-wrap{width:90px;margin-bottom:22px}.name-sticker{left:65px;top:28px;font-size:.6rem;padding:7px 10px}h1{font-size:2.7rem;letter-spacing:-1.8px}.hero-description{font-size:.8rem;max-width:290px;margin-inline:auto}.hero-role{font-size:.7rem}.technology-strip{border-radius:0 0 38px 38px;padding:30px 22px;gap:24px 26px}.technology-strip>span{font-size:1rem}.content-section{padding:50px 23px}.services h2{font-size:1.4rem}.desktop-break{display:none}.section-divider{margin-bottom:34px}.service-grid{--bs-gutter-x:1.2rem}.service-grid h3{font-size:.95rem}.service-grid p{font-size:.875rem}.work-section,.experience-section{padding-top:10px}.section-intro{display:block}.section-intro p{margin-top:16px;max-width:none}h2{font-size:1.8rem}.project-visual{min-height:220px}.additional-projects article{gap:10px;padding:21px 0}.additional-projects h3{font-size:.95rem}.qualification-panel{padding:22px}.credential-list li{font-size:.8rem;flex-wrap:wrap}.contact-section{border-radius:38px 38px 0 0;padding-top:45px}.contact-section h2{font-size:2.2rem}.contact-section>p{max-width:270px;margin-inline:auto}.contact-actions .pill{padding:13px 22px}footer{padding:22px;flex-wrap:wrap;font-size:.7rem}footer a{margin-left:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.avatar.portrait{display:block;object-fit:cover;object-position:center 28%;}
/* Continuous technology marquee. Each equal-width group creates a seamless loop. */
.technology-strip{display:block;position:relative;padding:48px 0 42px;overflow:hidden}
.technology-window{overflow:hidden;width:100%}
.technology-track{display:flex;width:max-content;animation:technology-scroll 26s linear infinite}
.technology-group{display:flex;align-items:center;justify-content:space-around;gap:52px;flex-shrink:0;min-width:1120px;padding:0 26px}
.technology-group>span{font-size:1.2rem;font-weight:650;letter-spacing:-.6px;white-space:nowrap}
.technology-strip .technology-group .tech-light{font-weight:400;font-size:.9rem}
.motion-toggle{position:absolute;bottom:10px;right:38px;border:0;background:transparent;color:#666664;padding:3px 8px;font-size:.75rem;text-decoration:underline;text-underline-offset:3px}
.technology-strip.is-paused .technology-track{animation-play-state:paused}
@keyframes technology-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(max-width:575px){.technology-strip{padding:35px 0 38px;min-height:120px}.technology-group{min-width:850px;gap:38px;padding:0 19px}.technology-group>span{font-size:1rem}.motion-toggle{right:24px}}
@media(prefers-reduced-motion:reduce){.technology-track{animation:none;width:100%}.technology-group{min-width:0;width:100%;padding:0 24px;flex-wrap:wrap;gap:24px}.technology-group[aria-hidden="true"],.motion-toggle{display:none}}
/* Gentle entrance, reveal, and interaction motion. */
@keyframes hero-enter{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference){
.hero .avatar-wrap{animation:hero-enter .65s ease-out both}
.hero-role{animation:hero-enter .65s .08s ease-out both}
.hero h1{animation:hero-enter .7s .16s ease-out both}
.hero-description{animation:hero-enter .7s .24s ease-out both}
.hero>.pill{animation:hero-enter .7s .32s ease-out backwards}
.services h2,.service-grid article,.section-intro,.project,.additional-projects article,.job,.qualification-panel,.contact-section h2,.contact-actions{transition:opacity .65s ease,transform .65s cubic-bezier(.2,.65,.3,1),box-shadow .3s ease}
.reveal-pending{opacity:0;transform:translateY(22px)}
.project:hover{transform:translateY(-5px);box-shadow:0 14px 28px #2222220b}
.service-icon{transition:transform .25s ease}
.service-grid article:hover .service-icon{transform:translateY(-4px)}
.avatar.portrait{transition:transform .3s ease,box-shadow .3s ease}
.avatar.portrait:hover{transform:scale(1.045);box-shadow:0 6px 20px #22222215}
}
@media(prefers-reduced-motion:reduce){.reveal-pending{opacity:1;transform:none}.hero *{animation:none!important}}
.gym-gallery{padding:0;min-width:0}.gym-preview{display:block;border:1px solid #e0e0dc;border-radius:16px;overflow:hidden;background:#f0f0ec}.gym-preview>img{width:100%;height:auto;aspect-ratio:1918/850;object-fit:contain;display:block}.gym-preview>span{display:block;text-align:right;padding:8px 12px;font-size:.75rem;color:#55554f}.gym-thumbnails{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;padding-top:12px}.gym-thumb{border:1px solid #deded8;border-radius:8px;background:#f3f3ee;padding:4px;min-width:0;color:#64645d}.gym-thumb[aria-pressed="true"]{border-color:#33332f;background:#e5e5dd;color:#222}.gym-thumb img{display:block;width:100%;aspect-ratio:2.24;object-fit:contain;border-radius:4px}.gym-thumb span{display:block;font-size:.65rem;line-height:1.3;padding:6px 0;overflow-wrap:anywhere}.gym-thumb:focus-visible{outline:2px solid #333;outline-offset:2px}#gym-lightbox{width:min(1400px,96vw);max-width:96vw;max-height:94dvh;padding:20px;border:1px solid #d8d8d0;border-radius:20px;background:#fafaf9;color:#242423}#gym-lightbox::backdrop{background:#161614d9}body:has(#gym-lightbox[open]){overflow:hidden}.lightbox-header{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:15px}.lightbox-header h2{font-size:1.15rem;margin:0;letter-spacing:0}#gym-large-image{display:block;width:100%;max-height:70dvh;object-fit:contain}.lightbox-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px}.lightbox-controls>span{font-size:.875rem}@media(max-width:575px){#gym-lightbox{padding:12px}.lightbox-controls .pill{padding:9px 14px}.gym-thumb span{font-size:.6rem}}
.papers-thumbnails{grid-template-columns:repeat(3,minmax(0,1fr))}
.papers-preview>img{object-fit:contain;background:#f7f9fb}
#papers-lightbox{width:min(1200px,96vw);max-width:96vw;max-height:94dvh;padding:20px;border:1px solid #d8d8d0;border-radius:20px;background:#fafaf9;color:#242423}
#papers-lightbox::backdrop{background:#161614d9}
body:has(#papers-lightbox[open]){overflow:hidden}
#papers-large-image{display:block;width:100%;max-height:70dvh;object-fit:contain}
@media(max-width:575px){#papers-lightbox{padding:12px}}
.additional-projects article.driving-project{grid-template-columns:1fr 1.7fr;gap:28px;padding:24px;background:#fafaf9;border:1px solid #e5e5e1;border-radius:24px;margin-bottom:12px}
.driving-description h3{margin-top:16px}.driving-gallery{min-width:0}.driving-thumbnails{grid-template-columns:repeat(3,minmax(0,1fr))}
#driving-lightbox{width:min(1400px,96vw);max-width:96vw;max-height:94dvh;padding:20px;border:1px solid #d8d8d0;border-radius:20px;background:#fafaf9;color:#242423}
#driving-lightbox::backdrop{background:#161614d9}body:has(#driving-lightbox[open]){overflow:hidden}
#driving-large-image{display:block;width:100%;max-height:70dvh;object-fit:contain}
@media(max-width:767px){.additional-projects article.driving-project{grid-template-columns:1fr;padding:16px;gap:20px}}
@media(max-width:575px){#driving-lightbox{padding:12px}}
footer{justify-content:center;text-align:center}footer p{width:100%;margin:0}
.topbar{flex-wrap:wrap}.topbar nav{flex-wrap:wrap;row-gap:10px}#education,#languages{scroll-margin-top:30px}@media(max-width:575px){.topbar nav{justify-content:center;column-gap:10px}}
.mobile-menu-toggle{display:none}
@media(max-width:767px){
.topbar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;padding:24px 20px}
.email-tools{min-width:0}.email-address{font-size:.75rem;overflow-wrap:anywhere}
.mobile-menu-toggle{display:inline-flex;align-items:center;gap:10px;justify-content:center;background:#fafaf9;border:1px solid #d9d9d3;border-radius:24px;min-height:44px;padding:10px 14px;font-size:.8rem}
.menu-bars{position:relative;width:16px;height:12px;border-top:1.5px solid currentColor;border-bottom:1.5px solid currentColor}
.menu-bars:after{content:'';position:absolute;left:0;right:0;top:4px;border-top:1.5px solid currentColor}
.mobile-menu-toggle[aria-expanded="true"] .menu-bars{border:0}
.mobile-menu-toggle[aria-expanded="true"] .menu-bars:before,.mobile-menu-toggle[aria-expanded="true"] .menu-bars:after{content:'';position:absolute;left:0;right:0;top:5px;border-top:1.5px solid currentColor;transform:rotate(45deg)}
.mobile-menu-toggle[aria-expanded="true"] .menu-bars:after{transform:rotate(-45deg)}
.topbar #main-navigation{display:none;grid-column:1/-1;background:#fafaf9;border:1px solid #deded8;border-radius:18px;padding:10px;gap:0}
.topbar #main-navigation.is-open{display:grid;grid-template-columns:1fr}
.topbar #main-navigation>span{display:none}
.topbar #main-navigation>a{display:block;padding:11px 14px;font-size:.9rem;border-radius:10px;min-height:44px}
.topbar #main-navigation>a:hover,.topbar #main-navigation>a:focus-visible{background:#eaeae5;text-decoration:none}
}