.image-card{position:relative;height:100%;width:100%;cursor:pointer;overflow:hidden;transition:all var(--transition-speed) var(--transition-ease);flex:0 0 25%;min-width:25%;border-right:1px solid rgba(255,255,255,.1)}.image-card:last-child{border-right:none}.image-card.active{border-right:none;z-index:10}.image-card.hidden{flex:0 0 0!important;min-width:0!important;border-right:none;opacity:0;margin:0;padding:0}.image-container{height:100%;width:100%;position:relative;overflow:hidden;opacity:0}.image-container.revealed{animation:reveal 1.2s cubic-bezier(.77,0,.175,1) forwards}@keyframes reveal{0%{clip-path:inset(0 100% 0 0);opacity:0;transform:scale(1.1)}to{clip-path:inset(0 0 0 0);opacity:1;transform:scale(1)}}.image-container img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--transition-ease)}.image-card:hover .image-container img{transform:scale(1.1)}.overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,.8) 100%);opacity:.6;transition:opacity .4s ease}.image-card:hover .overlay{opacity:.4}.content{position:absolute;bottom:120px;left:40px;color:var(--color-text);z-index:10;pointer-events:none;transition:opacity .3s ease}.image-card.active .content{opacity:0}.number{display:block;font-size:1.2rem;font-weight:600;margin-bottom:1rem;opacity:.8}.title{font-size:2.5rem;font-weight:700;margin-bottom:.5rem;text-transform:uppercase;letter-spacing:1px;white-space:pre-line}.category{font-size:.9rem;text-transform:uppercase;letter-spacing:2px;color:var(--color-accent);opacity:.7}.detail-view{position:absolute;top:0;right:0;width:25%;height:100%;background-color:var(--color-bg);z-index:50;padding:40px 30px 120px;overflow-y:auto;overflow-x:hidden;opacity:0;pointer-events:none;transform:translate(50px);transition:opacity .6s ease .2s,transform .6s ease .2s;display:flex;flex-direction:column;justify-content:flex-start}.detail-view.visible{opacity:1;pointer-events:auto;transform:translate(0)}.close-btn{position:absolute;top:20px;right:20px;background:none;border:none;color:var(--color-text);cursor:pointer;padding:10px;border-radius:50%;border:1px solid rgba(255,255,255,.1);transition:all .3s ease;z-index:60}.close-btn:hover{background:rgba(255,255,255,.1);transform:rotate(90deg)}.detail-category{color:var(--color-accent);text-transform:uppercase;letter-spacing:2px;font-size:.9rem;margin-bottom:1rem;display:block}.detail-title{font-size:2.5rem;font-weight:700;margin-bottom:2rem;line-height:1.1}.detail-date{color:var(--color-accent);font-size:1rem;margin-bottom:2rem;text-align:right}.detail-text{max-width:600px;color:var(--color-muted);line-height:1.8;font-size:1.1rem}.detail-text p{margin-bottom:1.5rem}.detail-text h1,.detail-text h2,.detail-text h3{color:var(--color-text);margin-top:2rem;margin-bottom:1rem;font-weight:700;line-height:1.2}.detail-text h1{font-size:1.8rem}.detail-text h2{font-size:1.5rem}.detail-text h3{font-size:1.2rem}.detail-text ul,.detail-text ol{margin-bottom:1.5rem;padding-left:1.5rem}.detail-text li{margin-bottom:.5rem}.detail-text a{color:var(--color-text);text-decoration:none;border-bottom:1px solid var(--color-accent);transition:opacity .3s ease}.detail-text a:hover{opacity:.7}.detail-text blockquote{border-left:3px solid var(--color-accent);padding-left:1rem;margin:1.5rem 0;font-style:italic;color:var(--color-text);opacity:.8}.detail-text strong{color:var(--color-text);font-weight:600}.detail-text code{background:rgba(255,255,255,.1);padding:.2em .4em;border-radius:4px;font-family:monospace;font-size:.9em}.footer{position:absolute;bottom:0;left:0;width:100%;height:60px;display:flex;align-items:center;justify-content:space-between;padding:0 40px;background:linear-gradient(to top,rgba(0,0,0,.9),transparent);z-index:100;pointer-events:none}.logo{display:flex;align-items:center;pointer-events:auto}.logo-image{height:80px;width:auto;object-fit:contain}.logo-icon{font-size:1.2rem}.progress-container{flex:1;height:2px;background:rgba(255,255,255,.1);margin:0 60px;position:relative;max-width:400px}.progress-bar{height:100%;background-color:var(--color-accent);transition:width .3s ease}.footer-links{font-size:.8rem;color:var(--color-muted);pointer-events:auto}.app-container{width:100vw;height:100vh;position:relative;overflow:hidden;background-color:var(--color-bg)}.gallery-container{display:flex;width:100%;height:100%;overflow-x:auto;overflow-y:hidden;transition:all var(--transition-speed) var(--transition-ease);scrollbar-width:none;-ms-overflow-style:none}.gallery-container::-webkit-scrollbar{display:none}.gallery-item{flex:0 0 25%;min-width:25%;height:100%;border-right:1px solid rgba(255,255,255,.1);transition:all var(--transition-speed) var(--transition-ease);position:relative;overflow:hidden}.gallery-item:last-child{border-right:none}.gallery-item.active{flex:0 0 75%;border-right:none;z-index:10}.gallery-item.hidden{flex:0 0 0;min-width:0;border-right:none;opacity:0}:root{--color-bg: #1a1a1a;--color-text: #ffffff;--color-accent: #e0e0e0;--color-muted: #888888;--font-primary: "Inter", system-ui, -apple-system, sans-serif;--transition-speed: .6s;--transition-ease: cubic-bezier(.22, 1, .36, 1)}*{margin:0;padding:0;box-sizing:border-box}body{background-color:var(--color-bg);color:var(--color-text);font-family:var(--font-primary);overflow:hidden;height:100vh;width:100vw}#root{height:100%;width:100%}.full-height{height:100%}.flex-center{display:flex;align-items:center;justify-content:center}