:root{--color-primary: #ffffff;--color-secondary: #e0e0e0;--color-tertiary: #a0a0a0;--color-background: #0a0a0a;--color-surface: #1a1a1a;--color-surface-hover: #2a2a2a;--color-accent: #ff6b6b;--color-accent-hover: #ff5252;--color-border: #333333;--color-shadow: rgba(0, 0, 0, .5);--font-family-primary: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;--font-family-secondary: Georgia, "Times New Roman", serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-size-5xl: 3rem;--font-weight-light: 300;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--spacing-3xl: 4rem;--spacing-4xl: 6rem;--container-max-width: 1200px;--container-padding: var(--spacing-md);--grid-gap: var(--spacing-md);--border-radius: .5rem;--border-radius-sm: .25rem;--border-radius-md: .75rem;--border-radius-lg: 1rem;--transition-fast: .15s ease-in-out;--transition-normal: .3s ease-in-out;--transition-slow: .5s ease-in-out;--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-modal-backdrop: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{font-family:var(--font-family-primary);font-size:var(--font-size-base);font-weight:var(--font-weight-normal);line-height:var(--line-height-normal);color:var(--color-primary);background-color:var(--color-background);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}h1,h2,h3,h4,h5,h6{font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);margin-bottom:var(--spacing-md);color:var(--color-primary)}h1{font-size:var(--font-size-4xl)}h2{font-size:var(--font-size-3xl)}h3{font-size:var(--font-size-2xl)}h4{font-size:var(--font-size-xl)}h5{font-size:var(--font-size-lg)}h6{font-size:var(--font-size-base)}p{margin-bottom:var(--spacing-md);color:var(--color-secondary)}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover,a:focus{color:var(--color-accent);outline:none}ul,ol{margin-bottom:var(--spacing-md);padding-left:var(--spacing-lg)}li{margin-bottom:var(--spacing-xs);color:var(--color-secondary)}img{max-width:100%;height:auto;display:block}button{font-family:inherit;font-size:inherit;border:none;background:none;cursor:pointer;transition:all var(--transition-fast)}button:focus{outline:2px solid var(--color-accent);outline-offset:2px}input,textarea,select{font-family:inherit;font-size:inherit;color:var(--color-primary);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius-sm);padding:var(--spacing-sm) var(--spacing-md);transition:border-color var(--transition-fast)}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--color-accent)}.skip-link{position:absolute;top:-40px;left:6px;background:var(--color-accent);color:var(--color-background);padding:8px;text-decoration:none;border-radius:var(--border-radius-sm);z-index:var(--z-tooltip);transition:top var(--transition-fast)}.skip-link:focus{top:6px}.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}*:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media (prefers-contrast: high){:root{--color-primary: #ffffff;--color-secondary: #ffffff;--color-background: #000000;--color-surface: #000000;--color-border: #ffffff}}@media print{*{background:transparent!important;color:#000!important;box-shadow:none!important;text-shadow:none!important}a,a:visited{text-decoration:underline}img{max-width:100%!important}@page{margin:.5cm}}.header{position:fixed;top:0;left:0;right:0;background-color:#0a0a0af2;backdrop-filter:blur(10px);border-bottom:1px solid var(--color-border);z-index:var(--z-fixed);transition:all var(--transition-normal)}.header.scrolled{background-color:#0a0a0afa;backdrop-filter:blur(15px);box-shadow:0 2px 20px #0000004d}.nav-container{max-width:var(--container-max-width);margin:0 auto;padding:0 var(--container-padding);display:flex;align-items:center;justify-content:space-between;height:4rem}.nav-brand .brand-link{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-primary)}.nav-menu{display:flex;list-style:none;margin:0;padding:0;gap:var(--spacing-xl)}.nav-link{font-weight:var(--font-weight-medium);padding:var(--spacing-sm) 0;position:relative;transition:all var(--transition-fast);border-radius:var(--border-radius-sm)}.nav-link:after{content:"";position:absolute;bottom:0;left:0;width:0;height:2px;background-color:var(--color-accent);transition:width var(--transition-normal);border-radius:1px}.nav-link:hover:after,.nav-link[aria-current=page]:after{width:100%}.nav-link:hover{color:var(--color-accent);transform:translateY(-1px)}.nav-link[aria-current=page]{color:var(--color-accent)}html{scroll-behavior:smooth}@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}.nav-link{transition:none}.nav-link:hover{transform:none}}.nav-toggle{display:none;flex-direction:column;width:2rem;height:2rem;justify-content:center;align-items:center;gap:.25rem}.hamburger-line{width:1.5rem;height:2px;background-color:var(--color-primary);transition:all var(--transition-fast);border-radius:1px;transform-origin:center}.nav-menu:before{content:"";position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#00000080;opacity:0;visibility:hidden;transition:all var(--transition-normal);z-index:-1}.nav-menu.active:before{opacity:1;visibility:visible}@media (max-width: 991px){.nav-link:focus{background-color:var(--color-surface-hover);border-radius:var(--border-radius-sm);outline:2px solid var(--color-accent);outline-offset:2px}.nav-toggle:focus{outline:2px solid var(--color-accent);outline-offset:4px;border-radius:var(--border-radius-sm)}}.main{padding-top:4rem}.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;position:relative;overflow:hidden}.hero:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:url(/images/portfolio/hero-bg.png);background-size:cover;background-position:center;background-repeat:no-repeat;filter:blur(8px);transform:scale(1.1);z-index:-1}.hero:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:#0006;z-index:0}.hero-container{max-width:var(--container-max-width);padding:0 var(--container-padding);position:relative;z-index:1}.hero-title{font-size:var(--font-size-5xl);font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-lg);background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-secondary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-subtitle{font-size:var(--font-size-xl);color:var(--color-tertiary);font-weight:var(--font-weight-light)}section{padding:var(--spacing-4xl) 0}.section-title{text-align:center;margin-bottom:var(--spacing-3xl);font-size:var(--font-size-3xl)}.portfolio-container,.about-container,.contact-container{max-width:var(--container-max-width);margin:0 auto;padding:0 var(--container-padding)}.about,.contact{text-align:center}.about-content,.contact-content{max-width:600px;margin:0 auto}.about-text,.contact-text{font-weight:var(--font-weight-bold)}.portfolio-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--grid-gap);margin-bottom:var(--spacing-2xl);padding:0;list-style:none}.portfolio-item{position:relative;aspect-ratio:1;overflow:hidden;border-radius:var(--border-radius);background-color:var(--color-surface);cursor:pointer;transition:all var(--transition-normal);transform:translateY(0);box-shadow:0 4px 6px #0000001a;outline:none}.portfolio-item:focus{outline:2px solid var(--color-accent);outline-offset:2px}.portfolio-item:hover{transform:translateY(-.5rem);box-shadow:0 12px 24px #0000004d}.portfolio-item:hover .portfolio-item-image{transform:scale(1.05)}.portfolio-item:hover .portfolio-item-overlay{opacity:1}.portfolio-item:hover .portfolio-item-title,.portfolio-item:hover .portfolio-item-category{transform:translateY(0)}.portfolio-item:active{transform:translateY(-.25rem);transition-duration:.1s}.portfolio-item-image{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-slow);will-change:transform}.portfolio-item-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,transparent 0%,transparent 60%,rgba(0,0,0,.8) 100%);opacity:0;transition:opacity var(--transition-normal);display:flex;flex-direction:column;justify-content:flex-end;padding:var(--spacing-lg);will-change:opacity}.portfolio-item-title{color:var(--color-primary);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-xs) 0;transform:translateY(1rem);transition:transform var(--transition-normal);will-change:transform}.portfolio-item-category{color:var(--color-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-normal);margin:0;transform:translateY(1rem);transition:transform var(--transition-normal);will-change:transform}.portfolio-item.featured:hover{transform:translateY(-.75rem);box-shadow:0 16px 32px #0006}.portfolio-item.featured:hover .portfolio-item-image{transform:scale(1.03)}.portfolio-item{animation:fadeInUp .6s ease-out forwards;opacity:0}.portfolio-item:nth-child(1){animation-delay:.1s}.portfolio-item:nth-child(2){animation-delay:.2s}.portfolio-item:nth-child(3){animation-delay:.3s}.portfolio-item:nth-child(4){animation-delay:.4s}.portfolio-item:nth-child(5){animation-delay:.5s}.portfolio-item:nth-child(6){animation-delay:.6s}.portfolio-item:nth-child(7){animation-delay:.7s}.portfolio-item:nth-child(8){animation-delay:.8s}.portfolio-item:nth-child(n+9){animation-delay:.9s}@keyframes fadeInUp{0%{opacity:0;transform:translateY(2rem)}to{opacity:1;transform:translateY(0)}}.portfolio-item:before{content:"";position:absolute;inset:0;background:linear-gradient(45deg,transparent 0%,rgba(255,107,107,.1) 50%,transparent 100%);opacity:0;transition:opacity var(--transition-normal);pointer-events:none;z-index:1}.portfolio-item:hover:before{opacity:1}.portfolio-item{position:relative;overflow:hidden}.portfolio-item:after{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:#ff6b6b4d;border-radius:50%;transform:translate(-50%,-50%);transition:width .6s,height .6s;pointer-events:none;z-index:2}.portfolio-item:active:after{width:300px;height:300px}.portfolio-item:focus-visible{outline:3px solid var(--color-accent);outline-offset:3px;transform:translateY(-.25rem)}.portfolio-item:focus-visible .portfolio-item-overlay{opacity:.8}.portfolio-item.loading:before{display:none}.portfolio-item.loading:after{display:none}@media (prefers-reduced-motion: reduce){.portfolio-item,.portfolio-item-image,.portfolio-item-overlay,.portfolio-item-title,.portfolio-item-category{transition:none;animation:none}.portfolio-item:hover{transform:none;box-shadow:0 4px 6px #0000001a}.portfolio-item:hover .portfolio-item-image{transform:none}}.portfolio-item.featured{grid-column:span 2;grid-row:span 2}.portfolio-item.loading{background:linear-gradient(90deg,var(--color-surface) 0%,var(--color-surface-hover) 50%,var(--color-surface) 100%);background-size:200% 100%;animation:shimmer 1.5s ease-in-out infinite}.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-2xl)}.loading-spinner{width:2rem;height:2rem;border:2px solid var(--color-border);border-top:2px solid var(--color-accent);border-radius:50%;animation:spin 1s linear infinite}.loading-text{margin-top:var(--spacing-md);color:var(--color-tertiary)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.error-container{text-align:center;padding:var(--spacing-4xl) var(--spacing-md);background-color:var(--color-surface);border-radius:var(--border-radius-lg);border:1px solid var(--color-border);margin:var(--spacing-xl) 0}.error-message{max-width:500px;margin:0 auto}.error-message h3{color:var(--color-accent);font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-md)}.error-message p{color:var(--color-secondary);font-size:var(--font-size-base);line-height:var(--line-height-relaxed);margin-bottom:var(--spacing-xl)}.error-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-4xl) var(--spacing-md);text-align:center}.error-icon{font-size:var(--font-size-4xl);margin-bottom:var(--spacing-lg)}.error-title{color:var(--color-accent);font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-md)}.error-description{color:var(--color-secondary);font-size:var(--font-size-base);line-height:var(--line-height-relaxed);margin-bottom:var(--spacing-xl);max-width:500px}.retry-btn{background-color:var(--color-accent);color:var(--color-primary);border:none;padding:var(--spacing-sm) var(--spacing-lg);border-radius:var(--border-radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:background-color .2s ease}.retry-btn:hover{background-color:var(--color-accent-hover)}.retry-btn:focus{outline:2px solid var(--color-accent);outline-offset:2px}.portfolio-image,.modal-image,img{transition:opacity .3s ease-in-out,filter .3s ease-in-out}img.loading{opacity:.7;filter:blur(2px);background-color:var(--color-surface);background-image:linear-gradient(90deg,var(--color-surface) 0%,var(--color-surface-hover) 50%,var(--color-surface) 100%);background-size:200% 100%;animation:shimmer 1.5s ease-in-out infinite}img.loaded{opacity:1;filter:none;background:none;animation:none}img.error{opacity:.5;filter:grayscale(100%);background-color:var(--color-surface)}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.image-container{position:relative;overflow:hidden;background-color:var(--color-surface)}.image-container:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.1) 50%,transparent 100%);transform:translate(-100%);transition:transform .6s ease-in-out;pointer-events:none;z-index:1}.image-container.loading:before{animation:shimmerOverlay 1.5s ease-in-out infinite}@keyframes shimmerOverlay{0%{transform:translate(-100%)}to{transform:translate(100%)}}.portfolio-image-container{position:relative;overflow:hidden;background-color:var(--color-surface);width:100%;height:100%;display:flex}.portfolio-image{width:100%;height:100%;object-fit:cover;display:block}.portfolio-image-container:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:2rem;height:2rem;border:2px solid var(--color-border);border-top:2px solid var(--color-accent);border-radius:50%;opacity:0;animation:spin 1s linear infinite;transition:opacity .3s ease-in-out;pointer-events:none;z-index:2}.portfolio-image-container.loading:after{opacity:1}.portfolio-image-container.loaded:after,.portfolio-image-container.error:after{opacity:0}.progressive-image{filter:blur(5px);transition:filter .3s ease-in-out}.progressive-image.loaded{filter:blur(0)}.lqip-container{position:relative;overflow:hidden}.lqip-placeholder{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;filter:blur(10px);transform:scale(1.1);transition:opacity .3s ease-in-out;z-index:1}.lqip-main{position:relative;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .3s ease-in-out;z-index:2}.lqip-main.loaded{opacity:1}.lqip-main.loaded+.lqip-placeholder{opacity:0}.no-intersection-observer img[data-src]{opacity:1;filter:none}picture{display:block;width:100%;height:100%}picture img{width:100%;height:100%;object-fit:cover}.no-webp .webp-image,.no-avif .avif-image,.webp .webp-fallback,.avif .avif-fallback{display:none}.responsive-image-container{position:relative;width:100%;height:100%;overflow:hidden}.responsive-image-container picture,.responsive-image-container img{width:100%;height:100%;object-fit:cover}source{display:none}.image-quality-high{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}.image-quality-medium{image-rendering:auto}.image-quality-low{image-rendering:pixelated}@media (prefers-reduced-data: reduce){.portfolio-image,.modal-image{image-rendering:auto}.portfolio-item:before,.portfolio-item:after{display:none}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){.portfolio-image,.modal-image{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}}@media (prefers-reduced-motion: reduce){img.loading,img.loaded,.progressive-image,.lqip-placeholder,.lqip-main{transition:none;animation:none}.image-container:before,.portfolio-image-container:after{animation:none}}.modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:all var(--transition-normal)}.modal[aria-hidden=false]{opacity:1;visibility:visible}.modal-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000000e6;backdrop-filter:blur(5px)}.modal-content{position:relative;max-width:90vw;max-height:90vh;background-color:var(--color-surface);border-radius:var(--border-radius-lg);overflow:hidden;transform:scale(.9);transition:transform var(--transition-normal)}.modal[aria-hidden=false] .modal-content{transform:scale(1)}.modal-close{position:absolute;top:var(--spacing-md);right:var(--spacing-md);width:2.5rem;height:2.5rem;background-color:#00000080;color:var(--color-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:1;transition:background-color var(--transition-fast)}.modal-close:hover{background-color:#000c}.close-icon{font-size:var(--font-size-2xl);line-height:1}.modal-body{display:flex;flex-direction:column;height:100%;min-height:60vh}.modal-image-container{flex:1;display:flex;align-items:center;justify-content:center;background-color:var(--color-background);position:relative;overflow:hidden}.modal-image-container:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:2.5rem;height:2.5rem;border:3px solid var(--color-border);border-top:3px solid var(--color-accent);border-radius:50%;opacity:0;animation:spin 1s linear infinite;transition:opacity var(--transition-normal);z-index:1}.modal-image-container.loading:before{opacity:1}.modal-image-container.loaded:before,.modal-image-container.error:before{opacity:0}.modal-image{max-width:100%;max-height:100%;object-fit:contain;transition:opacity var(--transition-normal)}.modal-image.loading{opacity:.7;filter:blur(2px)}.modal-image.loaded{opacity:1;filter:none}.modal-image.error{opacity:.5;filter:grayscale(100%)}.modal-info{padding:var(--spacing-xl);background-color:var(--color-surface);border-top:1px solid var(--color-border)}.modal-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);color:var(--color-primary);margin:0 0 var(--spacing-md) 0}.modal-description{font-size:var(--font-size-base);color:var(--color-secondary);line-height:var(--line-height-relaxed);margin:0 0 var(--spacing-lg) 0}.modal-meta{display:flex;flex-direction:column;gap:var(--spacing-md);font-size:var(--font-size-sm)}.meta-item{display:flex;align-items:flex-start;gap:var(--spacing-sm);flex-wrap:wrap}.meta-label{color:var(--color-tertiary);font-weight:var(--font-weight-medium);min-width:3rem;flex-shrink:0}.meta-category,.meta-date{padding:var(--spacing-xs) var(--spacing-sm);background-color:var(--color-surface-hover);border-radius:var(--border-radius-sm);border:1px solid var(--color-border);color:var(--color-secondary)}.meta-featured{padding:var(--spacing-xs) var(--spacing-sm);background-color:var(--color-accent);color:var(--color-background);border-radius:var(--border-radius-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:.5px}.meta-tags-container{align-items:flex-start}.meta-tags{display:flex;flex-wrap:wrap;gap:var(--spacing-xs);flex:1}.meta-tag{padding:var(--spacing-xs) var(--spacing-sm);background-color:#ff6b6b1a;color:var(--color-accent);border:1px solid rgba(255,107,107,.3);border-radius:var(--border-radius-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);transition:all var(--transition-fast)}.meta-tag:hover{background-color:var(--color-accent);color:var(--color-background)}.modal-nav{position:absolute;top:50%;transform:translateY(-50%);width:3rem;height:3rem;background-color:#00000080;color:var(--color-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast);z-index:2}.modal-nav:hover{background-color:#000c;transform:translateY(-50%) scale(1.1)}.modal-nav:focus{outline:2px solid var(--color-accent);outline-offset:2px}.modal-prev{left:var(--spacing-lg)}.modal-next{right:var(--spacing-lg)}.nav-arrow{font-size:var(--font-size-xl);line-height:1}.modal-help-overlay{position:absolute;inset:0;background-color:#000000e6;display:none;align-items:center;justify-content:center;z-index:10;backdrop-filter:blur(5px)}.modal-help-content{background-color:var(--color-surface);border-radius:var(--border-radius-lg);padding:var(--spacing-xl);max-width:90vw;max-height:90vh;overflow-y:auto;box-shadow:0 20px 40px #00000080}.modal-help-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);color:var(--color-primary);margin:0 0 var(--spacing-lg) 0;text-align:center}.modal-help-shortcuts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-xl);margin-bottom:var(--spacing-xl)}.shortcut-group h4{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-accent);margin:0 0 var(--spacing-md) 0;border-bottom:1px solid var(--color-border);padding-bottom:var(--spacing-xs)}.shortcut-item{display:flex;align-items:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-sm);font-size:var(--font-size-sm)}.shortcut-item kbd{background-color:var(--color-surface-hover);color:var(--color-primary);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--border-radius-sm);border:1px solid var(--color-border);font-family:var(--font-family-primary);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);min-width:1.5rem;text-align:center;box-shadow:0 1px 2px #0000001a}.shortcut-item .gesture{background-color:#ff6b6b1a;color:var(--color-accent);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--border-radius-sm);border:1px solid rgba(255,107,107,.3);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);min-width:3rem;text-align:center}.shortcut-item span:last-child{color:var(--color-secondary);flex:1}.modal-help-close{display:block;margin:0 auto;padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--color-accent);color:var(--color-background);border:none;border-radius:var(--border-radius);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast)}.modal-help-close:hover{background-color:var(--color-accent-hover);transform:translateY(-1px)}.modal-help-close:focus{outline:2px solid var(--color-accent);outline-offset:2px}.keyboard-indicator{position:absolute;top:var(--spacing-lg);left:50%;transform:translate(-50%);z-index:5;opacity:1;transition:opacity var(--transition-normal)}.keyboard-hint{background-color:#000c;color:var(--color-primary);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--border-radius);font-size:var(--font-size-sm);backdrop-filter:blur(5px);border:1px solid var(--color-border)}.keyboard-hint kbd{background-color:var(--color-surface-hover);color:var(--color-accent);padding:2px var(--spacing-xs);border-radius:var(--border-radius-sm);border:1px solid var(--color-border);font-family:var(--font-family-primary);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);margin:0 2px}.navigation-feedback{position:absolute;top:50%;transform:translateY(-50%);z-index:5;display:none;align-items:center;justify-content:center;opacity:0;transition:opacity var(--transition-normal);pointer-events:none}.navigation-feedback.prev{left:var(--spacing-xl)}.navigation-feedback.next{right:var(--spacing-xl)}.feedback-content{background-color:#000c;color:var(--color-primary);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--border-radius);display:flex;align-items:center;gap:var(--spacing-sm);backdrop-filter:blur(5px);border:1px solid var(--color-border);animation:feedbackPulse .8s ease-out}.feedback-arrow{font-size:var(--font-size-xl);color:var(--color-accent)}.feedback-text{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}@keyframes feedbackPulse{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.1);opacity:1}to{transform:scale(1);opacity:1}}.footer{background-color:var(--color-surface);border-top:1px solid var(--color-border);padding:var(--spacing-xl) 0;text-align:center}.footer-container{max-width:var(--container-max-width);margin:0 auto;padding:0 var(--container-padding)}.footer-text{color:var(--color-tertiary);font-size:var(--font-size-sm);margin:0}@media (min-width: 1200px){.portfolio-grid{grid-template-columns:repeat(4,1fr);gap:var(--spacing-xl)}}@media (max-width: 1199px) and (min-width: 992px){.portfolio-grid{grid-template-columns:repeat(4,1fr);gap:var(--spacing-lg)}}@media (max-width: 991px) and (min-width: 768px){.nav-menu{position:fixed;top:4rem;left:0;right:0;background-color:#0a0a0afa;backdrop-filter:blur(15px);border-bottom:1px solid var(--color-border);box-shadow:0 4px 20px #0000004d;flex-direction:column;padding:var(--spacing-lg);gap:var(--spacing-lg);transform:translateY(-100%);opacity:0;visibility:hidden;transition:all var(--transition-normal);max-height:calc(100vh - 4rem);overflow-y:auto}.nav-menu.active{transform:translateY(0);opacity:1;visibility:visible}.nav-menu .nav-item{transform:translate(-2rem);opacity:0;transition:all var(--transition-normal)}.nav-menu.active .nav-item{transform:translate(0);opacity:1}.nav-menu.active .nav-item:nth-child(1){transition-delay:.1s}.nav-menu.active .nav-item:nth-child(2){transition-delay:.2s}.nav-menu.active .nav-item:nth-child(3){transition-delay:.3s}.nav-menu.active .nav-item:nth-child(4){transition-delay:.4s}.nav-link{padding:var(--spacing-md) 0;font-size:var(--font-size-lg);border-bottom:1px solid transparent;transition:all var(--transition-fast)}.nav-link:hover,.nav-link:focus{border-bottom-color:var(--color-accent);padding-left:var(--spacing-sm)}.nav-toggle{display:flex;position:relative;z-index:var(--z-fixed)}.nav-toggle:hover .hamburger-line{background-color:var(--color-accent)}.nav-toggle[aria-expanded=true] .hamburger-line:nth-child(1){transform:rotate(45deg) translate(.375rem,.375rem);background-color:var(--color-accent)}.nav-toggle[aria-expanded=true] .hamburger-line:nth-child(2){opacity:0;transform:scale(0)}.nav-toggle[aria-expanded=true] .hamburger-line:nth-child(3){transform:rotate(-45deg) translate(.375rem,-.375rem);background-color:var(--color-accent)}.hero-title{font-size:var(--font-size-4xl)}.hero-subtitle{font-size:var(--font-size-lg)}.portfolio-grid{grid-template-columns:repeat(3,1fr);gap:var(--spacing-lg)}.portfolio-item.featured{grid-column:span 2;grid-row:span 1}.modal-content{max-width:95vw;max-height:95vh}.modal-info{padding:var(--spacing-lg)}.modal-title{font-size:var(--font-size-xl)}.modal-nav{width:2.5rem;height:2.5rem}.modal-prev{left:var(--spacing-md)}.modal-next{right:var(--spacing-md)}section{padding:var(--spacing-3xl) 0}}@media (max-width: 767px) and (min-width: 576px){.nav-menu{position:fixed;top:4rem;left:0;right:0;background-color:#0a0a0afa;backdrop-filter:blur(15px);border-bottom:1px solid var(--color-border);box-shadow:0 4px 20px #0000004d;flex-direction:column;padding:var(--spacing-lg);gap:var(--spacing-lg);transform:translateY(-100%);opacity:0;visibility:hidden;transition:all var(--transition-normal);max-height:calc(100vh - 4rem);overflow-y:auto}.nav-menu.active{transform:translateY(0);opacity:1;visibility:visible}.nav-menu .nav-item{transform:translate(-2rem);opacity:0;transition:all var(--transition-normal)}.nav-menu.active .nav-item{transform:translate(0);opacity:1}.nav-menu.active .nav-item:nth-child(1){transition-delay:.1s}.nav-menu.active .nav-item:nth-child(2){transition-delay:.2s}.nav-menu.active .nav-item:nth-child(3){transition-delay:.3s}.nav-menu.active .nav-item:nth-child(4){transition-delay:.4s}.nav-link{padding:var(--spacing-md) 0;font-size:var(--font-size-lg);border-bottom:1px solid transparent;transition:all var(--transition-fast)}.nav-link:hover,.nav-link:focus{border-bottom-color:var(--color-accent);padding-left:var(--spacing-sm)}.nav-toggle{display:flex;position:relative;z-index:var(--z-fixed)}.nav-toggle:hover .hamburger-line{background-color:var(--color-accent)}.nav-toggle[aria-expanded=true] .hamburger-line:nth-child(1){transform:rotate(45deg) translate(.375rem,.375rem);background-color:var(--color-accent)}.nav-toggle[aria-expanded=true] .hamburger-line:nth-child(2){opacity:0;transform:scale(0)}.nav-toggle[aria-expanded=true] .hamburger-line:nth-child(3){transform:rotate(-45deg) translate(.375rem,-.375rem);background-color:var(--color-accent)}.hero-title{font-size:var(--font-size-3xl)}.hero-subtitle{font-size:var(--font-size-base)}.section-title{font-size:var(--font-size-2xl)}.portfolio-grid{grid-template-columns:repeat(2,1fr);gap:var(--spacing-md)}.portfolio-item.featured{grid-column:span 1;grid-row:span 1}section{padding:var(--spacing-2xl) 0}.modal-content{max-width:95vw;max-height:95vh}.modal-body{min-height:50vh}.modal-info{padding:var(--spacing-md)}.modal-title{font-size:var(--font-size-lg)}.modal-description{font-size:var(--font-size-sm)}.modal-nav{width:2rem;height:2rem}.modal-prev{left:var(--spacing-sm)}.modal-next{right:var(--spacing-sm)}.nav-arrow{font-size:var(--font-size-base)}.modal-help-content{padding:var(--spacing-lg);max-width:95vw}.modal-help-shortcuts{grid-template-columns:1fr;gap:var(--spacing-lg)}.modal-help-title{font-size:var(--font-size-xl)}}@media (max-width: 575px){.nav-menu{position:fixed;top:4rem;left:0;right:0;background-color:#0a0a0afa;backdrop-filter:blur(15px);border-bottom:1px solid var(--color-border);box-shadow:0 4px 20px #0000004d;flex-direction:column;padding:var(--spacing-lg);gap:var(--spacing-lg);transform:translateY(-100%);opacity:0;visibility:hidden;transition:all var(--transition-normal);max-height:calc(100vh - 4rem);overflow-y:auto}.nav-menu.active{transform:translateY(0);opacity:1;visibility:visible}.nav-menu .nav-item{transform:translate(-2rem);opacity:0;transition:all var(--transition-normal)}.nav-menu.active .nav-item{transform:translate(0);opacity:1}.nav-menu.active .nav-item:nth-child(1){transition-delay:.1s}.nav-menu.active .nav-item:nth-child(2){transition-delay:.2s}.nav-menu.active .nav-item:nth-child(3){transition-delay:.3s}.nav-menu.active .nav-item:nth-child(4){transition-delay:.4s}.nav-link{padding:var(--spacing-md) 0;font-size:var(--font-size-lg);border-bottom:1px solid transparent;transition:all var(--transition-fast)}.nav-link:hover,.nav-link:focus{border-bottom-color:var(--color-accent);padding-left:var(--spacing-sm)}.nav-toggle{display:flex;position:relative;z-index:var(--z-fixed)}.nav-toggle:hover .hamburger-line{background-color:var(--color-accent)}.nav-toggle[aria-expanded=true] .hamburger-line:nth-child(1){transform:rotate(45deg) translate(.375rem,.375rem);background-color:var(--color-accent)}.nav-toggle[aria-expanded=true] .hamburger-line:nth-child(2){opacity:0;transform:scale(0)}.nav-toggle[aria-expanded=true] .hamburger-line:nth-child(3){transform:rotate(-45deg) translate(.375rem,-.375rem);background-color:var(--color-accent)}.hero-title{font-size:var(--font-size-2xl)}.hero-subtitle{font-size:var(--font-size-sm)}.section-title{font-size:var(--font-size-xl)}.portfolio-grid{grid-template-columns:repeat(2,1fr);gap:var(--spacing-sm)}.portfolio-item.featured{grid-column:span 1;grid-row:span 1}.portfolio-item{aspect-ratio:1}section{padding:var(--spacing-xl) 0}.modal-content{max-width:95vw;max-height:95vh}:root{--container-padding: var(--spacing-sm)}}