:root{--primary-blue: #4a90e2;--primary-blue-light: #6ba3f0;--primary-blue-dark: #357abd;--accent-coral: #ff6b6b;--accent-purple: #8b5cf6;--accent-teal: #06d6a0;--accent-orange: #f59e0b;--gray-50: #f8fafc;--gray-100: #f1f5f9;--gray-200: #e2e8f0;--gray-300: #cbd5e1;--gray-400: #94a3b8;--gray-500: #64748b;--gray-600: #475569;--gray-700: #334155;--gray-800: #1e293b;--gray-900: #0f172a;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--text-4xl: 2.25rem;--text-5xl: 3rem;--text-6xl: 3.75rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--space-24: 6rem;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-2xl: 1.5rem;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--gradient-primary: linear-gradient( 135deg, var(--primary-blue) 0%, var(--primary-blue-light) 100% );--gradient-hero: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--gradient-surface: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);--gradient-accent: linear-gradient( 135deg, var(--accent-purple) 0%, var(--accent-coral) 100% )}body{margin:0;font-family:Montserrat,-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;background-color:#9aceff;overflow-x:hidden}*{box-sizing:border-box}html{overflow-x:hidden}.header{position:fixed;top:0;left:0;right:0;z-index:1000;background:#9aceff;border-bottom:1px solid rgba(255,255,255,.2);padding:1rem 0;transition:all .3s ease}.header-container{max-width:1200px;margin:0 auto;padding:0 1rem;display:flex;justify-content:space-between;align-items:center}.logo{font-size:1.5rem;font-weight:800;color:#1a202c;text-decoration:none;transition:all .3s ease;display:flex;justify-content:center;align-items:center;gap:12px}.logo:hover{color:#2d3748;transform:scale(1.05)}nav{display:flex;align-items:center}nav ul{display:flex;list-style:none;margin:0;padding:0;gap:2rem}nav li{position:relative}nav a{color:#1a202c;text-decoration:none;font-weight:500;font-size:1rem;padding:.5rem 1rem;border-radius:.5rem;transition:all .3s ease;position:relative}nav a:hover{color:#2d3748;background:rgba(255,255,255,.2);transform:translateY(-2px)}.menu-icon{display:none;flex-direction:column;cursor:pointer;padding:var(--space-2);border-radius:var(--radius-md);transition:all .3s ease}.menu-icon:hover{background:var(--gray-100)}.menu-icon div{width:25px;height:3px;background:var(--gray-700);margin:3px 0;transition:all .3s ease;border-radius:var(--radius-sm)}.bar1.open{transform:rotate(-45deg) translate(-5px,6px)}.bar2.open{opacity:0}.bar3.open{transform:rotate(45deg) translate(-5px,-6px)}.header-cta{display:flex;align-items:center;gap:1rem}.cta-header{background:#1a202c;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:1rem;font-weight:600;font-size:.875rem;cursor:pointer;transition:all .3s ease;text-decoration:none;display:inline-flex;align-items:center;gap:.5rem}.cta-header:hover{background:#2d3748;transform:translateY(-2px);box-shadow:0 4px 12px #00000026}@media (max-width: 768px){.header{padding:.75rem 0}.header-container{padding:0 1rem}.logo{font-size:1.25rem}.menu-icon{display:flex}nav{position:absolute;top:100%;left:0;right:0;background:#9aceff;border-top:1px solid rgba(255,255,255,.2);transform:translateY(-100%);opacity:0;pointer-events:none;transition:all .3s ease;box-shadow:0 4px 12px #0000001a}nav.nav-open{transform:translateY(0);opacity:1;pointer-events:all}nav ul{flex-direction:column;padding:1.5rem;gap:1rem}nav a{display:block;padding:1rem;text-align:center;border-radius:.75rem;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2)}nav a:hover{background:rgba(255,255,255,.2);color:#1a202c;transform:translateY(0)}.header-cta{display:none}}@media (max-width: 480px){.header-container{padding:0 .75rem}nav ul{padding:1rem;gap:.75rem}nav a{padding:.75rem;font-size:.875rem}}.header.scrolled{background:rgba(154,206,255,.98);box-shadow:0 4px 6px #0000001a}nav a.active{color:#1a202c;background:rgba(255,255,255,.3)}.hero{background-color:#9aceff;text-align:center;padding:4rem 1rem}.hero-content h1{font-size:9rem;margin:0;color:#000}.hero-image{width:500px;height:500px}@media (max-width: 768px){.hero-content h1{font-size:3.3rem}.hero-image{width:300px;height:300px}}.about{padding:2rem;background-color:#9aceff}.about h2{text-align:left;margin-bottom:1rem;font-size:2rem}.about p{text-align:left;line-height:1.6}@media (max-width: 768px){.about{padding:var(--space-16) var(--space-4)}.about h2{font-size:var(--text-3xl);margin-bottom:var(--space-12)}.about p{font-size:var(--text-base);padding:var(--space-6);line-height:1.7}.about p:hover{transform:translate(4px)}}@media (max-width: 480px){.about{padding:var(--space-12) var(--space-3)}.about h2{font-size:var(--text-2xl)}.about p{padding:var(--space-5);margin-bottom:var(--space-4)}.about p:last-of-type{padding-left:var(--space-8)}.about p:last-of-type:before{left:var(--space-4);font-size:40px}}.experience{padding:2rem;background-color:#9aceff}.experience h2{text-align:left;margin-bottom:2rem;font-size:2rem;color:#2c3e50;font-weight:600}.timeline-wrapper{position:relative;margin:0 auto;padding-left:1rem}.timeline-line{position:absolute;left:0;top:0;bottom:0;width:2px;background-color:#5a9bd4;z-index:1}.timeline-item{position:relative;margin-bottom:3rem;padding-left:2rem;opacity:0;transform:translateY(20px);transition:all .6s ease}.timeline-item:last-child{margin-bottom:0}.timeline-item.timeline-visible{opacity:1;transform:translateY(0)}.timeline-dot{display:none}.timeline-content{padding:0}.timeline-content h3{margin:0 0 .3rem;font-size:1.2rem;color:#2c3e50;font-weight:600;line-height:1.3}.timeline-content h3 .location{font-weight:400;font-style:italic;color:#5a6c7d;font-size:1rem}.timeline-content h4{margin:0 0 .5rem;font-weight:600;color:#2c3e50;font-size:1rem}.timeline-content p{margin:0;line-height:1.6;color:#34495e;font-size:.95rem;text-align:justify}.timeline-item:nth-child(2){transition-delay:.1s}.timeline-item:nth-child(3){transition-delay:.2s}.timeline-item:nth-child(4){transition-delay:.3s}.timeline-item:nth-child(5){transition-delay:.4s}@media (max-width: 768px){.experience{padding:1.5rem}.experience h2{font-size:1.8rem;text-align:center;margin-bottom:1.5rem}.timeline-wrapper{padding-left:.8rem}.timeline-item{margin-bottom:2.5rem;padding-left:1.5rem}.timeline-content h3{font-size:1.1rem}.timeline-content h3 .location{display:block;margin-top:.2rem;font-size:.9rem}.timeline-content h4{font-size:.95rem}.timeline-content p{font-size:.9rem}}@media (max-width: 480px){.experience{padding:1rem}.experience h2{font-size:1.5rem;margin-bottom:1rem}.timeline-wrapper{padding-left:.6rem}.timeline-item{margin-bottom:2rem;padding-left:1.2rem}.timeline-content h3{font-size:1rem}.timeline-content h3 .location{font-size:.85rem}.timeline-content h4{font-size:.9rem}.timeline-content p{font-size:.85rem;line-height:1.5}}.skills{padding:3rem 2rem;background-color:#9aceff;position:relative}.skills:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.1) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(255,255,255,.05) 0%,transparent 50%);pointer-events:none}.skills-container{max-width:1000px;margin:0 auto;position:relative;z-index:2}.skills h2{text-align:center;margin-bottom:2rem;font-size:2.5rem;font-weight:800;color:#1a202c;position:relative}.skills h2:after{content:"";position:absolute;bottom:-.5rem;left:50%;transform:translate(-50%);width:60px;height:4px;background:linear-gradient(135deg,#1a202c 0%,#2d3748 100%);border-radius:2px}.skills-section{background:rgba(255,255,255,.9);padding:2rem;border-radius:1rem;box-shadow:0 8px 25px #0000001a;border:1px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);margin-bottom:2rem}.skills-section h3{font-size:1.5rem;font-weight:700;color:#1a202c;margin-bottom:1.5rem;text-align:center;position:relative}.language-skills{text-align:left}.language-item{margin-bottom:1rem;padding:1rem;background:rgba(26,32,44,.05);border-radius:.75rem;border-left:4px solid #1a202c;transition:all .3s ease}.language-item:hover{transform:translate(5px);background:rgba(26,32,44,.1)}.language-item strong{color:#1a202c;font-weight:600}.technical-skills{text-align:left}.skill-item{display:flex;flex-direction:column;margin-bottom:1.5rem;padding:1.25rem;background:rgba(255,255,255,.7);border-radius:1rem;border:1px solid rgba(255,255,255,.3);transition:all .3s ease;position:relative;overflow:hidden}.skill-item:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:linear-gradient(135deg,#1a202c 0%,#2d3748 100%);transform:scaleY(0);transform-origin:bottom;transition:transform .3s ease}.skill-item:hover:before{transform:scaleY(1)}.skill-item:hover{transform:translateY(-3px);box-shadow:0 12px 30px #00000026;background:rgba(255,255,255,.95)}.skill-info{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.skill-icon{width:60px;height:60px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:white;border-radius:.75rem;box-shadow:0 4px 12px #0000001a;border:1px solid rgba(255,255,255,.5)}.skill-icon img{width:70%;height:70%;object-fit:contain}.skill-details{flex:1}.skill-name{margin:0;font-size:1.125rem;font-weight:600;color:#1a202c;line-height:1.2}.skill-level-text{font-size:.875rem;color:#4a5568;margin:.25rem 0 0;font-weight:500}.skill-bar{width:100%;background:rgba(224,224,224,.6);border-radius:10px;overflow:hidden;height:10px;position:relative;box-shadow:inset 0 2px 4px #0000001a}.skill-level{background:linear-gradient(135deg,#1a202c 0%,#2d3748 50%,#4a5568 100%);height:100%;width:0%;transition:width 2s cubic-bezier(.4,0,.2,1);border-radius:10px;position:relative;overflow:hidden}.skill-level:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.4) 50%,transparent 100%);animation:shimmer 2.5s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.skills.fade-in .skill-level{animation:fillBar 2s ease-in-out forwards}.skill-level[data-level="90"]{animation-delay:.2s}.skill-level[data-level="70"]{animation-delay:.4s}.skill-level[data-level="80"]{animation-delay:.6s}.skill-level[data-level="60"]{animation-delay:.8s}.skill-level[data-level="85"]{animation-delay:1s}@keyframes fillBar{0%{width:0%}to{width:var(--target-width)}}@media (max-width: 768px){.skills{padding:2rem 1rem}.skills h2{font-size:2rem}.skills-section{padding:1.5rem;margin-bottom:1.5rem}.skills-section h3{font-size:1.25rem;margin-bottom:1rem}.language-item{padding:.75rem;font-size:.9rem}.skill-item{padding:1rem;margin-bottom:1.25rem}.skill-icon{width:50px;height:50px}.skill-name{font-size:1rem}.skill-level-text{font-size:.8rem}.skill-bar{height:8px}}@media (max-width: 480px){.skills{padding:1.5rem .75rem}.skills h2{font-size:1.75rem;margin-bottom:1.5rem}.skills h2:after{width:40px;height:3px}.skills-section{padding:1.25rem}.skills-section h3{font-size:1.125rem}.language-item{padding:.625rem;font-size:.85rem;margin-bottom:.75rem}.skill-item{padding:.875rem;margin-bottom:1rem}.skill-info{gap:.75rem;margin-bottom:.875rem}.skill-icon{width:45px;height:45px}.skill-name{font-size:.9rem}.skill-level-text{font-size:.75rem}.skill-bar{height:6px}}.my-works{padding:4rem 2rem;background-color:#9aceff;min-height:100vh;padding-bottom:0!important}.works-container{max-width:1400px;margin:0 auto;position:relative;z-index:2}.my-works h2{text-align:center;font-size:var(--text-5xl);font-weight:800;margin-bottom:var(--space-4);color:var(--gray-800);position:relative}.my-works h2:after{content:"";position:absolute;bottom:-var(--space-3);left:50%;transform:translate(-50%);width:80px;height:4px;background:var(--gradient-accent);border-radius:var(--radius-sm)}.works-subtitle{text-align:center;font-size:var(--text-xl);color:var(--gray-600);margin-bottom:var(--space-16);font-weight:500}.content-wrapper{position:relative;min-height:600px;transition:all .3s ease-in-out}.content-wrapper.transitioning{opacity:.7;transform:scale(.98)}.folder-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--space-8);padding:var(--space-12) 0;justify-items:center}.folder-item{display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .4s cubic-bezier(.175,.885,.32,1.275);animation:folderSlideIn .6s ease-out forwards;animation-delay:var(--animation-delay);opacity:0;transform:translateY(30px);padding:var(--space-6);border-radius:var(--radius-xl);background:white;box-shadow:var(--shadow-md);border:1px solid var(--gray-100);position:relative;overflow:hidden;width:100%;min-height:200px;box-sizing:border-box}.folder-item:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--gradient-accent);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}.folder-item:hover:before{transform:scaleX(1)}@keyframes folderSlideIn{to{opacity:1;transform:translateY(0)}}.folder-item:hover{transform:translateY(-12px);box-shadow:var(--shadow-xl)}.folder-item:active{transform:translateY(-4px) scale(.95)}.folder-icon-wrapper{position:relative;margin-bottom:1rem;transition:all .3s ease}.external-link-indicator{position:absolute;top:-5px;right:-5px;background:rgba(255,255,255,.9);border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #0000001a;color:#666;transition:all .3s ease}.folder-item:hover .external-link-indicator{background:white;color:#333;transform:scale(1.1)}.folder-icon{width:120px;height:120px;transition:all .3s cubic-bezier(.175,.885,.32,1.275);filter:drop-shadow(0 4px 12px rgba(0,0,0,.15))}.folder-item:hover .folder-icon{transform:scale(1.1);filter:drop-shadow(0 8px 20px rgba(0,0,0,.25))}.folder-item:active .folder-icon{transform:scale(1.05)}.folder-label{text-align:center;max-width:140px}.folder-name{display:block;font-size:1rem;font-weight:600;color:#333;line-height:1.2;word-wrap:break-word;transition:color .3s ease}.folder-item:hover .folder-name{color:#000}.project-viewer{animation:viewerSlideIn .5s ease-out}@keyframes viewerSlideIn{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}.viewer-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:3rem;padding-bottom:2rem;border-bottom:2px solid rgba(255,255,255,.3)}.back-button{display:flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.9);border:none;padding:.8rem 1.5rem;border-radius:50px;cursor:pointer;font-size:1rem;font-weight:600;color:#333;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.back-button:hover{background:white;transform:translate(-5px);box-shadow:0 4px 12px #0000001a}.folder-title{display:flex;align-items:center;gap:1rem}.folder-color-indicator{width:20px;height:20px;border-radius:50%;box-shadow:0 2px 8px #0003}.folder-title h2{margin:0;font-size:2rem;color:#333}.folder-title p{margin:0;color:#666;font-size:1rem}.thumbnails-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:2rem;padding:1rem 0}.thumbnail-item{display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:all .3s ease;animation:thumbnailSlideIn .4s ease-out forwards;animation-delay:var(--animation-delay);opacity:0;transform:translateY(20px)}@keyframes thumbnailSlideIn{to{opacity:1;transform:translateY(0)}}.thumbnail-item:hover{transform:translateY(-4px)}.thumbnail-wrapper{width:100%;aspect-ratio:3/4;overflow:hidden;border-radius:12px;box-shadow:0 4px 12px #0000001a;transition:all .3s ease;margin-bottom:.8rem}.thumbnail-item:hover .thumbnail-wrapper{box-shadow:0 8px 20px #00000026;transform:scale(1.02)}.thumbnail-image{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.thumbnail-item:hover .thumbnail-image{transform:scale(1.05)}.thumbnail-title{margin:0;font-size:.9rem;font-weight:500;color:#333;text-align:center;line-height:1.3;max-width:100%;word-wrap:break-word;transition:color .3s ease}.thumbnail-item:hover .thumbnail-title{color:#000}.project-external-indicator{position:absolute;top:8px;right:8px;background:rgba(0,0,0,.7);border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;color:#fff;opacity:0;transition:all .3s ease}.thumbnail-item:hover .project-external-indicator{opacity:1}.external-project{cursor:pointer}.external-project:hover .thumbnail-wrapper{border:2px solid #ff6b9d}.project-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;z-index:1000;animation:modalFadeIn .3s ease-out;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:white;border-radius:20px;max-width:90vw;max-height:90vh;overflow-y:auto;position:relative;animation:modalSlideIn .4s cubic-bezier(.175,.885,.32,1.275)}@keyframes modalSlideIn{0%{opacity:0;transform:scale(.8) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.close-modal{position:absolute;top:1rem;right:1rem;background:rgba(0,0,0,.5);color:#fff;border:none;width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:1001;transition:all .3s ease}.close-modal:hover{background:rgba(0,0,0,.7);transform:scale(1.1)}.modal-image{width:100%;max-height:400px;overflow:hidden;border-radius:20px 20px 0 0}.modal-image img{width:100%;height:100%;object-fit:cover}.modal-info{padding:2rem}.modal-info h2{margin:0 0 .5rem;font-size:2rem;color:#333}.modal-category{display:inline-block;background:#9aceff;color:#333;padding:.5rem 1rem;border-radius:20px;font-weight:600;margin-bottom:1rem}.modal-description{font-size:1.1rem;line-height:1.6;color:#666;margin-bottom:2rem}.modal-details{display:flex;flex-direction:column;gap:1rem}.detail-item{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:#f8f9fa;border-radius:12px}.detail-item strong{color:#333}.detail-item span{color:#666}@media (max-width: 768px){.my-works{padding:2rem 1rem;min-height:auto}.works-container{max-width:100%;padding:0}.my-works h2{font-size:2rem;margin-bottom:1rem}.works-subtitle{font-size:1rem;margin-bottom:2rem}.folder-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:2rem 1rem;padding:1.5rem 0}.folder-item{padding:1rem;border-radius:1rem;width:100%;min-height:120px;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center}.folder-icon{width:90px;height:90px}.folder-name{font-size:.875rem;max-width:120px;line-height:1.3}.viewer-header{flex-direction:column;align-items:flex-start;gap:1rem;margin-bottom:2rem;padding-bottom:1rem}.back-button{padding:.75rem 1.25rem;font-size:.9rem}.folder-title h2{font-size:1.5rem}.folder-title p{font-size:.9rem}.thumbnails-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:1.5rem;padding:1rem 0}.thumbnail-wrapper{aspect-ratio:4/5;border-radius:.75rem}.thumbnail-title{font-size:.85rem;margin-top:.5rem}.modal-content{max-width:95vw;max-height:90vh;margin:1rem;border-radius:1rem}.modal-image{max-height:300px;border-radius:1rem 1rem 0 0}.modal-info{padding:1.5rem}.modal-info h2{font-size:1.5rem;margin-bottom:.75rem}.modal-category{padding:.4rem .8rem;font-size:.8rem;margin-bottom:1rem}.modal-description{font-size:1rem;margin-bottom:1.5rem}.detail-item{flex-direction:column;align-items:flex-start;gap:.5rem;padding:.75rem}.close-modal{width:36px;height:36px;top:.75rem;right:.75rem}}@media (max-width: 480px){.my-works{padding:1.5rem .75rem}.works-container{padding:0 .25rem}.my-works h2{font-size:1.75rem;margin-bottom:.75rem}.works-subtitle{font-size:.9rem;margin-bottom:1.5rem;padding:0 .5rem}.folder-grid{grid-template-columns:1fr;gap:1.5rem;padding:1rem 0}.folder-item{padding:1rem;border-radius:1rem;display:flex;flex-direction:row;align-items:center;gap:1rem;text-align:left;width:100%;min-height:100px;box-sizing:border-box}.folder-icon{width:80px;height:80px;flex-shrink:0}.folder-label{flex:1}.folder-name{font-size:1rem;max-width:none;line-height:1.3;font-weight:600}.viewer-header{margin-bottom:1.5rem;padding-bottom:.75rem}.back-button{padding:.625rem 1rem;font-size:.85rem;border-radius:2rem}.folder-title h2{font-size:1.25rem}.folder-title p{font-size:.8rem}.folder-color-indicator{width:16px;height:16px}.thumbnails-grid{grid-template-columns:repeat(2,1fr);gap:1rem;padding:.75rem 0}.thumbnail-wrapper{aspect-ratio:1/1;border-radius:.5rem}.thumbnail-title{font-size:.75rem;margin-top:.4rem;line-height:1.2}.modal-content{max-width:98vw;max-height:95vh;margin:.5rem;border-radius:.75rem}.modal-image{max-height:250px;border-radius:.75rem .75rem 0 0}.modal-info{padding:1.25rem}.modal-info h2{font-size:1.25rem;margin-bottom:.5rem}.modal-category{padding:.3rem .6rem;font-size:.75rem;border-radius:1rem;margin-bottom:.75rem}.modal-description{font-size:.9rem;line-height:1.5;margin-bottom:1.25rem}.detail-item{padding:.5rem;border-radius:.5rem}.close-modal{width:32px;height:32px;top:.5rem;right:.5rem;font-size:1.25rem}}@media (max-width: 320px){.my-works{padding:1.25rem .5rem}.my-works h2{font-size:1.5rem}.works-subtitle{font-size:.85rem;padding:0 .25rem}.folder-grid{grid-template-columns:1fr;gap:1.25rem}.folder-item{padding:.875rem;display:flex;flex-direction:row;align-items:center;gap:.875rem;text-align:left;width:100%;min-height:90px;box-sizing:border-box}.folder-icon{width:70px;height:70px;flex-shrink:0}.folder-label{flex:1}.folder-name{font-size:.9rem;max-width:none;font-weight:600}.thumbnails-grid{grid-template-columns:1fr;gap:1.25rem}.thumbnail-wrapper{aspect-ratio:3/4;max-width:280px;margin:0 auto}.modal-content{max-width:100vw;max-height:100vh;margin:0;border-radius:0}.modal-image{max-height:200px;border-radius:0}.modal-info{padding:1rem}.modal-info h2{font-size:1.125rem}.modal-description{font-size:.85rem}.close-modal{width:28px;height:28px;font-size:1.125rem}}.contact{padding:4rem 2rem;position:relative;overflow:hidden}.contact:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none}.contact-container{max-width:1200px;margin:0 auto;position:relative;z-index:1}.contact-header{text-align:center;margin-bottom:3rem}.contact h2{font-size:2.5rem;font-weight:700;color:#1a1a1a;margin-bottom:1rem;text-shadow:0 2px 4px rgba(0,0,0,.1)}.contact-subtitle{font-size:1.2rem;color:#2c3e50;font-weight:400;opacity:.8}.contact-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;margin-bottom:3rem}.contact-option{background:rgba(255,255,255,.95);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:2rem;text-align:center;transition:all .3s cubic-bezier(.4,0,.2,1);border:1px solid rgba(255,255,255,.2);box-shadow:0 8px 32px #0000001a;position:relative;overflow:hidden}.contact-option:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);transition:left .6s}.contact-option:hover{transform:translateY(-8px);box-shadow:0 16px 48px #00000026;border-color:#fff6}.contact-option:hover:before{left:100%}.contact-icon{margin-bottom:1rem;display:inline-block;transition:transform .3s ease}.icon-svg{width:3rem;height:3rem;transition:transform .3s ease;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.contact-option:hover .contact-icon{transform:scale(1.1) rotate(5deg)}.contact-option h3{font-size:1.4rem;font-weight:600;color:#2c3e50;margin-bottom:.5rem}.contact-description{font-size:.95rem;color:#5a6c7d;margin-bottom:1rem;line-height:1.5}.contact-link{display:inline-block;font-size:1.1rem;font-weight:600;color:#3498db;text-decoration:none;padding:.75rem 1.5rem;border-radius:25px;background:linear-gradient(45deg,#3498db,#2980b9);color:#fff;transition:all .3s ease;border:none;cursor:pointer}.contact-link:hover{background:linear-gradient(45deg,#2980b9,#1f5f8b);transform:translateY(-2px);box-shadow:0 6px 20px #3498db66}.contact-link:active{transform:translateY(0)}.contact-cta{text-align:center;padding:2rem;background:rgba(255,255,255,.1);border-radius:20px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2)}.contact-cta p{font-size:1.3rem;color:#2c3e50;margin-bottom:1.5rem;font-weight:500}.cta-button{display:inline-block;background:linear-gradient(45deg,#e74c3c,#c0392b);color:#fff;padding:1rem 2.5rem;border-radius:30px;text-decoration:none;font-weight:600;font-size:1.1rem;transition:all .3s ease;box-shadow:0 6px 20px #e74c3c4d;border:none;cursor:pointer}.cta-button:hover{background:linear-gradient(45deg,#c0392b,#a93226);transform:translateY(-3px);box-shadow:0 10px 30px #e74c3c66}.cta-button:active{transform:translateY(-1px)}@media (max-width: 768px){.contact{padding:3rem 1.5rem}.contact h2{font-size:2rem}.contact-subtitle{font-size:1.1rem}.contact-options{grid-template-columns:1fr;gap:1.5rem}.contact-option{padding:1.5rem}.icon-svg{width:2.5rem;height:2.5rem}.contact-option h3{font-size:1.2rem}.contact-cta p{font-size:1.1rem}}@media (max-width: 480px){.contact{padding:2rem 1rem}.contact h2{font-size:1.8rem}.contact-subtitle{font-size:1rem}.contact-option{padding:1.25rem}.icon-svg{width:2rem;height:2rem}.contact-option h3{font-size:1.1rem}.contact-description{font-size:.9rem}.contact-link{font-size:1rem;padding:.65rem 1.25rem}.cta-button{padding:.875rem 2rem;font-size:1rem}}.footer{text-align:center;padding:1rem;background-color:#9aceff;border-top:1px solid #e0e0e0;font-size:.9rem}@media (max-width: 768px){.footer{padding:1.5rem 1rem;font-size:.85rem}}@media (max-width: 480px){.footer{padding:1rem .5rem;font-size:.8rem}}.global-image-viewer{position:fixed;top:0;left:0;width:100%;height:100vh;background:rgba(0,0,0,.95);z-index:9999;overflow:auto;display:flex;align-items:flex-start;justify-content:center;padding:60px 20px 20px}.global-close-btn{position:fixed;top:20px;right:20px;background:rgba(255,255,255,.9);border:none;width:50px;height:50px;border-radius:50%;font-size:28px;font-weight:700;cursor:pointer;z-index:10000;display:flex;align-items:center;justify-content:center;color:#333;transition:all .3s ease;box-shadow:0 4px 12px #0000004d}.global-close-btn:hover{background:white;transform:scale(1.1)}.global-image-container{display:flex;align-items:center;justify-content:center;min-height:calc(100vh - 80px);width:100%}.global-image-container img{max-width:90%;max-height:90vh;width:auto;height:auto;display:block;box-shadow:0 8px 32px #00000080;border-radius:8px;object-fit:contain}@media (max-width: 768px){.global-image-viewer{padding:50px 15px 15px}.global-close-btn{width:45px;height:45px;font-size:24px;top:15px;right:15px}.global-image-container{min-height:calc(100vh - 65px)}.global-image-container img{max-width:95%;max-height:85vh;border-radius:6px}}@media (max-width: 480px){.global-image-viewer{padding:40px 10px 10px}.global-close-btn{width:40px;height:40px;font-size:20px;top:10px;right:10px}.global-image-container{min-height:calc(100vh - 50px)}.global-image-container img{max-width:98%;max-height:80vh;border-radius:4px}}@media (hover: none) and (pointer: coarse){.global-close-btn{width:50px;height:50px;font-size:24px}.global-close-btn:active{transform:scale(.95);background:rgba(255,255,255,.8)}}.bootloader{position:fixed;top:0;left:0;width:100%;height:100vh;background:linear-gradient(135deg,#9aceff 0%,#7ab8ff 100%);display:flex;align-items:center;justify-content:center;z-index:10000;opacity:1;transition:opacity .8s ease-out}.bootloader.exiting{opacity:0}.bootloader-content{text-align:center;transform:translateY(20px);opacity:0;animation:contentSlideIn .8s ease-out .2s forwards}@keyframes contentSlideIn{to{transform:translateY(0);opacity:1}}.logo-container{margin-bottom:2rem;opacity:0;transform:scale(.8);animation:logoFadeIn 1s ease-out .3s forwards}.bootloader-logo{width:120px;height:120px;object-fit:contain;filter:drop-shadow(0 4px 20px rgba(0,0,0,.1));transition:all .5s ease}.logo-original{opacity:1;transform:scale(1) rotate(0)}.logo-kiss{opacity:1;transform:scale(1.1) rotate(2deg);animation:kissPulse .8s ease-in-out}.logo-original-final{opacity:1;transform:scale(1) rotate(0);animation:finalBounce .6s ease-out}.bootloader.typing .logo-original-final{animation:logoFloat 2s ease-in-out infinite}@keyframes logoFadeIn{to{opacity:1;transform:scale(1)}}@keyframes logoFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes kissPulse{0%{transform:scale(1) rotate(0)}25%{transform:scale(1.15) rotate(-1deg)}50%{transform:scale(1.1) rotate(2deg)}75%{transform:scale(1.05) rotate(1deg)}to{transform:scale(1.1) rotate(2deg)}}@keyframes finalBounce{0%{transform:scale(1.1) rotate(2deg)}30%{transform:scale(.9) rotate(-1deg)}60%{transform:scale(1.05) rotate(.5deg)}to{transform:scale(1) rotate(0)}}.name-container{margin-bottom:3rem}.name-text{font-size:4rem;font-weight:700;color:#333;margin:0;display:flex;flex-direction:column;align-items:center;gap:.5rem;text-shadow:0 2px 10px rgba(0,0,0,.1)}.first-name,.last-name{display:block;opacity:0;transform:translate(-30px)}.bootloader.typing .first-name{animation:typeIn .8s ease-out .5s forwards}.bootloader.typing .last-name{animation:typeIn .8s ease-out 1.2s forwards}@keyframes typeIn{0%{opacity:0;transform:translate(-30px)}50%{opacity:.7;transform:translate(5px)}to{opacity:1;transform:translate(0)}}.loading-bar{width:300px;height:4px;background:rgba(255,255,255,.3);border-radius:2px;overflow:hidden;margin:0 auto;opacity:0;animation:barFadeIn .5s ease-out 1.8s forwards}@keyframes barFadeIn{to{opacity:1}}.loading-progress{height:100%;background:linear-gradient(90deg,#333,#555,#333);background-size:200% 100%;border-radius:2px;width:0%;animation:progressFill 1.2s ease-out 2s forwards,progressShimmer 1.5s ease-in-out 2s infinite}@keyframes progressFill{to{width:100%}}@keyframes progressShimmer{0%,to{background-position:200% 0}50%{background-position:-200% 0}}@media (max-width: 768px){.bootloader-logo{width:100px;height:100px}.name-text{font-size:3rem}.loading-bar{width:250px}}@media (max-width: 480px){.bootloader-logo{width:80px;height:80px}.logo-container{margin-bottom:1.5rem}.name-text{font-size:2.5rem;gap:.3rem}.loading-bar{width:200px;height:3px}.bootloader-content{padding:0 1rem}}@media (max-width: 320px){.bootloader-logo{width:70px;height:70px}.logo-container{margin-bottom:1rem}.name-text{font-size:2rem}.loading-bar{width:150px}}.App{text-align:center;max-width:1400px;margin:0 auto;padding:0 var(--space-4);position:relative}main{background-color:#9aceff;margin-top:80px}@media (max-width: 768px){.App{padding:0 .5rem}}@media (max-width: 480px){.App{padding:0}}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn 1s ease-in-out forwards}.hidden{opacity:0}