*{margin:0;padding:0;box-sizing:border-box}body{font-family:Rubik,sans-serif;font-weight:400;background-color:#000}body:before{content:"";position:fixed;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at 30% 50%,#41a2c54d,#0e1e2d00 50%),radial-gradient(circle at 70% 50%,#57126c33,#0e1e2d00 50%),radial-gradient(circle at 50% 30%,#0f265b4d,#0e1e2d00 50%);animation:flowEffect 69s ease-in-out infinite,pulseEffect 42s ease-in-out infinite;transform-origin:center;z-index:-1}@keyframes flowEffect{0%{transform:rotate(0) scale(1)}33%{transform:rotate(120deg) scale(1.2)}66%{transform:rotate(240deg) scale(.8)}to{transform:rotate(360deg) scale(1)}}@keyframes pulseEffect{0%,to{filter:brightness(.9) saturate(1)}50%{filter:brightness(1) saturate(1.25)}85%{filter:brightness(.5) saturate(1)}}main{display:flex;flex-direction:column}.slideshow{height:100vh;display:flex;align-items:center;position:relative;overflow:hidden}.slides{position:relative;width:100%;height:100%}.slide{position:absolute;width:100%;height:100%;opacity:0;transition:all .75s ease}.slide.active{opacity:1}.slide img{width:100%;height:100%;object-fit:cover}.slideshow-nav{position:absolute;height:4%;aspect-ratio:1;background:none;border:none;opacity:0;pointer-events:none;transition:all .3s ease;z-index:2}.left{left:25px}.right{right:25px}.slideshow-nav.clicking{animation:buttonClick .5s ease}@keyframes buttonClick{0%{opacity:1}50%{opacity:.3}to{opacity:1}}.hover{position:absolute;top:0;height:100%;width:8%;opacity:0;cursor:pointer;transition:all .3s ease;z-index:1}.hover.left{left:0;background:linear-gradient(to right,rgba(0,0,0,.6),transparent)}.hover.right{right:0;background:linear-gradient(to left,rgba(0,0,0,.6),transparent)}.hover:hover{opacity:1}.scroll-arrow{position:absolute;bottom:24px;left:calc(50% - 4vh);height:4vh;opacity:.6;z-index:2;cursor:pointer;animation:bounce 2s infinite;transition:all .5s ease}.scroll-arrow:hover{opacity:1}@keyframes bounce{0%,20%,50%,80%,to{transform:scalex(.9) rotate(90deg) translate(0)}40%{transform:scalex(.9) rotate(90deg) translate(-20px)}60%{transform:scalex(.9) rotate(90deg) translate(-10px)}}.gallery{display:flex;flex-direction:column}.gallery-header{width:100%;padding:16px 24px;background-color:#0d0d179f;border:none;cursor:pointer;display:flex;align-items:center;gap:16px;font-size:24px;color:#cacaca;transition:all .3s ease}.gallery-header:hover{background-color:#2c375454}.gallery-header:hover p{background:50% 100% / 50% 50% no-repeat radial-gradient(ellipse at bottom,#ffffff,transparent,transparent);-webkit-background-clip:text;background-clip:text;background-size:300% 300%;color:#fff;animation:glow 2.5s ease-in-out infinite}@keyframes glow{40%{text-shadow:0 0 9px #fff}}.arrow{height:18px;transition:all .5s ease}.arrow.expanded{transform:rotate(90deg)}.gallery-grid{height:0;overflow:hidden;transition:all .75s ease-out;display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:300px}.gallery-item{position:relative;overflow:hidden}.gallery-item.wide{grid-column:span 2}.gallery-item img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:transform .3s ease,opacity .75s ease}.gallery-item:hover img{transform:scale(1.1)}.gallery-item img.active{opacity:1}.gallery-text{position:absolute;top:32px;left:32px;display:flex;flex-direction:column;gap:8px;z-index:2}.gallery-title{color:#fff;font-size:24px;font-weight:500;opacity:0;transform:translate(20px);transition:all .3s ease}.gallery-subtitle{color:#dcdcdc;font-size:16px;opacity:0;transform:translate(40px);transition:all .5s ease .1s}.gallery-item:hover .gallery-title,.gallery-item:hover .gallery-subtitle{opacity:1;transform:translate(0)}.gallery-item .overlay{position:absolute;top:0;bottom:0;left:0;right:0;background-color:#0000;transition:all .3s ease;z-index:1}.gallery-item:hover .overlay{background-color:#00000080}
