.app{width:100%;min-height:100vh;position:relative}.container{max-width:1200px;margin:0 auto;padding:0 2rem}.section-title{font-size:clamp(2rem,5vw,3rem);font-weight:700;margin-bottom:var(--spacing-lg);text-align:center;color:var(--text-primary);position:relative;animation:fadeInUp .8s ease-out;letter-spacing:-.03em;line-height:1.2}.section-title:after{content:"";position:absolute;bottom:-16px;left:50%;transform:translate(-50%);width:60px;height:2px;background:var(--black)}.navigation{position:fixed;top:0;left:0;right:0;background:var(--bg-primary);border-bottom:1px solid var(--border-light);box-shadow:var(--shadow-sm);z-index:1000;transition:all var(--transition-base);animation:fadeIn .6s ease-out}.nav-container{max-width:1200px;margin:0 auto;padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center}.nav-logo{font-size:1.5rem;font-weight:700;color:var(--text-primary);cursor:pointer;letter-spacing:-.02em;transition:all var(--transition-base);text-decoration:none}.nav-logo:hover{opacity:.7}.nav-menu{display:flex;list-style:none;gap:.5rem;align-items:center}.nav-menu button{background:transparent;border:none;font-size:.95rem;color:var(--text-secondary);cursor:pointer;padding:.625rem 1rem;min-height:44px;position:relative;transition:all var(--transition-base);font-family:inherit;font-weight:500;-webkit-tap-highlight-color:transparent}.nav-menu button:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:2px;background:var(--black);transform:translate(-50%);transition:width var(--transition-base)}.nav-menu button:hover{color:var(--text-primary)}.nav-menu button:focus{outline:none}.nav-menu button:focus-visible{outline:2px solid var(--black);outline-offset:2px}.nav-menu button.active{color:var(--text-primary);font-weight:600}.nav-menu button.active:after{width:calc(100% - 2rem)}.hamburger-menu{display:none;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:44px;height:44px;background:var(--white);border:1px solid var(--black);cursor:pointer;padding:0;z-index:1001;transition:all var(--transition-base);-webkit-tap-highlight-color:transparent}.hamburger-menu:hover{background:var(--black)}.hamburger-menu:hover .hamburger-line{background:var(--white)}.hamburger-line{width:20px;height:2px;background:var(--text-primary);border-radius:var(--radius-full);transition:all var(--transition-base);transform-origin:center;margin:0 auto}.hamburger-line.active:nth-child(1){transform:rotate(45deg) translate(6px,6px)}.hamburger-line.active:nth-child(2){opacity:0;transform:translate(-10px)}.hamburger-line.active:nth-child(3){transform:rotate(-45deg) translate(6px,-6px)}.mobile-menu-overlay{display:none;position:fixed;inset:0;background:#0009;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:999;opacity:0;transition:opacity var(--transition-base);pointer-events:none}.mobile-menu-overlay.open{opacity:1;pointer-events:all}.mobile-menu-sidebar{display:none;position:fixed;top:0;right:-320px;width:280px;height:100vh;background:var(--bg-primary);border-left:1px solid var(--black);box-shadow:var(--shadow-xl);z-index:1000;transition:right var(--transition-base),background-color var(--transition-base),border-color var(--transition-base);overflow-y:auto;padding:0}.mobile-menu-sidebar.open{right:0}.mobile-menu-header{padding:1.5rem;border-bottom:1px solid var(--border-light);display:flex;justify-content:flex-end;align-items:center}.mobile-menu-close{width:40px;height:40px;background:var(--bg-primary);border:1px solid var(--black);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-base);-webkit-tap-highlight-color:transparent}.mobile-menu-close:hover{background:var(--black)}.mobile-menu-close:hover .close-icon{color:var(--white)}.close-icon{font-size:24px;color:var(--text-primary);font-weight:300;line-height:1;transition:color var(--transition-base)}.mobile-menu-list{list-style:none;padding:1rem 0;margin:0}.mobile-menu-list li{width:100%}.mobile-menu-list button{width:100%;padding:1rem 1.5rem;background:transparent;border:none;text-align:left;font-size:1rem;color:var(--text-primary);cursor:pointer;transition:all var(--transition-base);font-family:inherit;font-weight:500;-webkit-tap-highlight-color:transparent;position:relative;margin:.25rem 1rem;border-radius:var(--radius-md)}.mobile-menu-list button:after{content:"";position:absolute;bottom:0;left:1rem;width:calc(100% - 2rem);height:2px;background:var(--black);opacity:0;transition:opacity var(--transition-base)}.mobile-menu-list button:hover{background:var(--gray-light)}.mobile-menu-list button.active{font-weight:600}.mobile-menu-list button.active:after{opacity:1}.hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;padding-top:80px;padding-bottom:4rem;background:var(--bg-primary)}.hero-container{max-width:1200px;margin:0 auto;padding:0 2rem;width:100%;display:flex;align-items:center;justify-content:center}.hero-content{text-align:center;max-width:800px;animation:fadeInUp 1s ease-out .3s both}.hero-greeting{font-size:1.125rem;font-weight:400;margin-bottom:.75rem;color:var(--text-secondary);letter-spacing:.05em;text-transform:uppercase;animation:fadeInUp .8s ease-out .4s both}.hero-name{font-size:clamp(2.5rem,8vw,5rem);font-weight:700;margin-bottom:1.5rem;line-height:1.1;color:var(--text-primary);letter-spacing:-.03em;animation:fadeInUp .8s ease-out .5s both}.hero-subtitle{font-size:clamp(1rem,2.5vw,1.375rem);margin-bottom:3rem;color:var(--text-secondary);line-height:1.7;font-weight:400;max-width:600px;margin-left:auto;margin-right:auto;animation:fadeInUp .8s ease-out .6s both}.hero-buttons{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;animation:fadeInUp .8s ease-out .7s both}.btn{padding:1rem 2.5rem;min-height:48px;font-size:1rem;font-weight:500;border:1px solid var(--black);border-radius:0;cursor:pointer;transition:all var(--transition-base);font-family:inherit;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;letter-spacing:.01em;-webkit-tap-highlight-color:transparent;background:transparent;color:var(--text-primary)}.btn-primary{background:var(--black);color:var(--white);border-color:var(--black)}.btn-primary:hover,.btn-secondary{background:var(--white);color:var(--black);border-color:var(--black)}.btn-secondary:hover{background:var(--black);color:var(--white);border-color:var(--black)}.btn:focus{outline:none}.btn:focus-visible{outline:2px solid var(--black);outline-offset:2px}.btn:active{transform:scale(.98)}.about{padding:var(--spacing-xl) 0;background:var(--bg-secondary)}.about-content{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1.5fr;gap:var(--spacing-lg);align-items:center}.about-image-container{display:flex;justify-content:center;align-items:center;animation:fadeInUp .8s ease-out .2s both}.about-image-wrapper{position:relative;width:100%;max-width:500px;aspect-ratio:1;border-radius:50%;overflow:hidden;background:var(--white);transition:all var(--transition-base);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;outline:1px solid var(--black);outline-offset:-1px}.about-image{width:100%;height:100%;object-fit:cover;object-position:center center;display:block;transform:scale(1)}.about-image-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--white);color:var(--text-secondary);font-size:1rem;font-weight:500;border:1px solid var(--black)}.about-text{animation:fadeInUp .8s ease-out .3s both}.about-text p{font-size:1.125rem;color:var(--text-primary);margin-bottom:1.5rem;line-height:1.8;letter-spacing:.01em;font-weight:400}.about-text p:last-of-type{margin-bottom:0}.skills{margin-top:var(--spacing-lg)}.skills h3{font-size:1.5rem;margin-bottom:1.5rem;color:var(--text-primary);letter-spacing:-.01em;font-weight:600}.skills-list{display:flex;flex-wrap:wrap;gap:.75rem}.skill-tag{padding:.625rem 1.5rem;background:var(--white);border:1px solid var(--black);font-size:.9rem;color:var(--text-primary);transition:all var(--transition-base);cursor:default;font-weight:500;letter-spacing:.01em}.skill-tag:hover{background:var(--black);color:var(--white);border-color:var(--black)}.experience{padding:var(--spacing-xl) 0;background:var(--bg-primary)}.experience-list{display:flex;flex-direction:column;gap:var(--spacing-md);max-width:1000px;margin:0 auto}.experience-item{background:var(--white);padding:0;border:1px solid var(--black);box-shadow:var(--shadow-sm);transition:all var(--transition-base);position:relative}.experience-item:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.experience-item-content{padding:var(--spacing-md)}.experience-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem;flex-wrap:wrap;gap:1rem}.experience-title{font-size:1.5rem;font-weight:700;color:var(--text-primary);margin-bottom:.25rem;letter-spacing:-.02em;line-height:1.3}.experience-company{font-size:1.125rem;color:var(--text-primary);font-weight:600}.experience-period{color:var(--text-secondary);font-size:.9rem;white-space:nowrap;font-weight:500;padding:.375rem .875rem;background:var(--white);border:1px solid var(--black)}.experience-description{color:var(--text-secondary);margin-bottom:1.5rem;line-height:1.8;font-size:1.0625rem}.experience-technologies{display:flex;flex-wrap:wrap;gap:.75rem}.tech-tag{padding:.5rem 1rem;background:var(--white);border:1px solid var(--black);font-size:.85rem;color:var(--text-primary);transition:all var(--transition-base);font-weight:500;letter-spacing:.01em}.tech-tag:hover{background:var(--black);color:var(--white);border-color:var(--black)}.projects{padding:var(--spacing-xl) 0;background:var(--bg-secondary)}.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:var(--spacing-md);max-width:1200px;margin:0 auto}.project-card{background:var(--white);padding:0;border:1px solid var(--black);box-shadow:var(--shadow-sm);transition:all var(--transition-base);display:flex;flex-direction:column;position:relative}.project-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.project-card-content{padding:var(--spacing-md);display:flex;flex-direction:column;flex-grow:1}.project-title{font-size:1.5rem;font-weight:700;margin-bottom:1rem;color:var(--text-primary);letter-spacing:-.02em;line-height:1.3}.project-description{color:var(--text-secondary);margin-bottom:1.5rem;line-height:1.8;flex-grow:1;font-size:1.0625rem}.project-technologies{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:1.5rem}.project-links{display:flex;gap:.75rem;margin-top:auto;flex-wrap:wrap}.project-link{text-decoration:none;font-weight:500;transition:all var(--transition-base);padding:.625rem 1.5rem;border:1px solid var(--black);font-size:.9rem;display:inline-flex;align-items:center;justify-content:center;min-height:40px;background:transparent;color:var(--text-primary)}.project-link-primary{background:var(--black);color:var(--white);border-color:var(--black)}.project-link-primary:hover,.project-link-secondary{background:var(--white);color:var(--black);border-color:var(--black)}.project-link-secondary:hover{background:var(--black);color:var(--white);border-color:var(--black)}.contact{padding:var(--spacing-xl) 0;background:var(--bg-secondary);min-height:100vh;display:flex;align-items:center;position:relative}.contact:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(0,0,0,.1),transparent)}.contact-content{max-width:800px;margin:0 auto;display:flex;justify-content:center;align-items:center;width:100%}.contact-info{width:100%;text-align:center;animation:fadeInUp .8s ease-out}.contact-info p{font-size:1.125rem;color:var(--text-secondary);margin-bottom:2rem;line-height:1.8;font-weight:400}.contact-buttons{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-top:2rem}@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}*{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}}@media(max-width:1024px){.hero-wrapper,.about-content{gap:3rem}.container{padding:0 2rem}}@media(max-width:768px){.nav-container{padding:.75rem 1.5rem;position:relative}.hamburger-menu{display:flex}.nav-menu{display:none}.mobile-menu-overlay,.mobile-menu-sidebar{display:block}.hero{padding-top:70px;padding-bottom:3rem;min-height:90vh}.hero-container{padding:0 1.5rem}.hero-content{max-width:100%}.hero-greeting{font-size:1rem}.hero-name{font-size:clamp(2rem,10vw,3.5rem)}.hero-subtitle{font-size:clamp(.95rem,3vw,1.125rem);margin-bottom:2.5rem}.hero-buttons{gap:.875rem;flex-direction:column;width:100%;max-width:300px;margin:0 auto}.btn{width:100%}.about{padding:var(--spacing-lg) 0;min-height:auto}.about-content{grid-template-columns:1fr;gap:var(--spacing-md)}.about-image-wrapper{max-width:280px;margin:0 auto}.section-title{font-size:2rem;margin-bottom:2.5rem}.container{padding:0 1.5rem}.contact{padding:var(--spacing-lg) 0;min-height:auto}.contact-content{max-width:100%;padding:0 1rem}.projects{padding:var(--spacing-lg) 0;min-height:auto}.projects-grid{grid-template-columns:1fr;gap:var(--spacing-md)}.experience{padding:var(--spacing-lg) 0;min-height:auto}.experience-list{gap:var(--spacing-md)}.experience-header{flex-direction:column;align-items:flex-start}.experience-period{margin-top:.5rem}.btn{padding:.875rem 1.75rem;font-size:.95rem}}@media(max-width:480px){.nav-container{padding:.75rem 1rem}.nav-logo{font-size:1.25rem}.hamburger-menu{width:28px;height:28px}.nav-menu button{font-size:.95rem;padding:.875rem 1.25rem}.hero{padding-top:80px;padding-bottom:2.5rem;min-height:85vh}.hero-container{padding:0 1rem}.hero-content{padding:0 .5rem}.hero-greeting{font-size:.9rem;margin-bottom:.5rem}.hero-name{font-size:clamp(1.75rem,12vw,2.5rem);margin-bottom:1rem}.hero-subtitle{font-size:clamp(.875rem,3.5vw,1rem);margin-bottom:2rem;line-height:1.6}.hero-buttons{flex-direction:column;width:100%;gap:.75rem;max-width:280px}.btn{width:100%;padding:.875rem 2rem;font-size:.95rem}.btn{width:100%;padding:1rem 1.5rem;font-size:1rem;min-height:48px}.about{padding:var(--spacing-md) 0;min-height:auto}.about-content{gap:var(--spacing-md)}.about-image-wrapper{max-width:240px}.about-text p{font-size:1rem;margin-bottom:1.25rem}.section-title{font-size:1.75rem;margin-bottom:2rem}.container{padding:0 1rem}.experience{padding:var(--spacing-md) 0;min-height:auto}.experience-item-content{padding:var(--spacing-md)}.experience-title{font-size:1.25rem}.experience-company,.experience-description{font-size:1rem}.projects{padding:var(--spacing-md) 0;min-height:auto}.project-card-content{padding:var(--spacing-md)}.project-title{font-size:1.25rem}.project-links{flex-direction:column;gap:.75rem}.project-link{width:100%}.contact{padding:var(--spacing-md) 0;min-height:auto}.contact-content{gap:var(--spacing-md)}.contact-buttons{flex-direction:column;width:100%;max-width:300px;margin:2rem auto 0}.contact-buttons .btn{width:100%}.skills-list{gap:.75rem}.skill-tag{padding:.5rem 1rem;font-size:.85rem}.tech-tag{padding:.375rem .75rem;font-size:.8rem}}@media(max-width:360px){.nav-menu button{font-size:.8rem;padding:.5rem .625rem}.hero-name{font-size:clamp(1.5rem,14vw,2rem)}.about-image-wrapper{max-width:200px}.section-title{font-size:1.5rem}.container{padding:0 .75rem}}@media(max-width:768px)and (orientation:landscape){.hero{min-height:80vh;padding-top:70px;padding-bottom:2rem}.hero-content{text-align:center}.hero-name{font-size:clamp(1.5rem,15vw,2rem)}.about-content{grid-template-columns:250px 1fr;gap:2rem}.about-image-wrapper{max-width:250px}}@media(-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){.hero-image,.about-image{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}}@supports (padding: max(0px)){.navigation,.hero-container,.container{padding-left:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right))}}*{margin:0;padding:0;box-sizing:border-box}:root{--black: #000000;--black-light: #1a1a1a;--black-lighter: #2d2d2d;--white: #ffffff;--white-off: #fafafa;--gray-light: #f5f5f5;--gray: #e5e5e5;--gray-dark: #d0d0d0;--gray-darker: #999999;--gray-darkest: #666666;--text-primary: #000000;--text-secondary: #666666;--text-tertiary: #999999;--text-on-dark: #ffffff;--bg-primary: #ffffff;--bg-secondary: #fafafa;--bg-tertiary: #f5f5f5;--bg-dark: #000000;--bg-dark-light: #1a1a1a;--border-light: #e5e5e5;--border-medium: #d0d0d0;--border-dark: #999999;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .08);--shadow-md: 0 4px 12px rgba(0, 0, 0, .1);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .12);--shadow-xl: 0 16px 48px rgba(0, 0, 0, .15);--spacing-xs: .5rem;--spacing-sm: 1rem;--spacing-md: 2rem;--spacing-lg: 4rem;--spacing-xl: 6rem;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .25s cubic-bezier(.4, 0, .2, 1);--transition-slow: .4s cubic-bezier(.4, 0, .2, 1)}html{scroll-behavior:smooth}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.reveal{opacity:0;transform:translateY(50px);transition:all .8s cubic-bezier(.25,.46,.45,.94)}.reveal.active{opacity:1;transform:translateY(0)}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:rgba(0,0,0,.1);color:var(--text-primary);line-height:1.6;background:var(--bg-primary);overflow-x:hidden}img{max-width:100%;height:auto;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}*:focus-visible{outline:2px solid var(--black);outline-offset:2px;border-radius:var(--radius-sm)}button,a,input,textarea,select{touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,.1)}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}#root{min-height:100vh}