@import"https://fonts.cdnfonts.com/css/bebas-neue";@import"https://fonts.cdnfonts.com/css/poppins";:root{--width-default: min(1200px, 90vw);--diameter: 1432px}*{padding:0;margin:0;box-sizing:border-box;list-style:none}body{margin:0;font-size:15px;background-color:#2f4f4f;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400}#root{min-height:100vh}main{width:100%}header{width:var(--width-default);height:70px;margin:auto;display:flex;justify-content:space-between;align-items:center;position:relative;z-index:1}.logo img{width:50px}svg{color:#fff}.slider{color:#eee;width:100vw;height:100vh;position:relative;overflow:hidden;margin-top:-70px}.slider .list .item{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;transition:1s}.slider .list .item .content{position:absolute;top:20%;left:5%;width:90%;max-width:90%;text-align:center;display:grid;grid-template-columns:repeat(2,1fr);text-align:left;gap:80px;font-size:1.2em;text-transform:uppercase;font-family:Poppins;text-shadow:0 0 80px #000}.slider .list .item .content .left-content-wrapper{grid-column:1;display:flex;flex-direction:column;gap:0}.slider .list .item .content .right-content-wrapper{grid-column:2;display:flex;flex-direction:column;gap:10px;align-items:flex-end}.slider .list .item .year-display{position:absolute;top:3%;left:50%;transform:translate(-50%) translateY(-100%);font-size:5em;font-family:Bebas Neue,sans-serif;color:#fff;text-shadow:0 0 80px #000;transition:transform 1s;letter-spacing:8px;font-weight:800}.slider .list .item .content h2{font-size:10em;font-family:Bebas Neue,sans-serif;line-height:.85em;transform:translateY(-100%);transition:transform 1s;margin:0 0 5px;padding:0}.slider .list .item .content .year{font-size:2.5em;font-family:Bebas Neue,sans-serif;color:#fff;margin:0 0 5px;padding:0;opacity:.9;transform:translateY(-100%);transition:transform 1s;letter-spacing:2px;line-height:1}.slider .list .item .content .tag{font-size:2.5em;font-family:Bebas Neue,sans-serif;font-weight:800;color:#fff;opacity:1;transform:translateY(-100%);transition:transform 1s;letter-spacing:2px;margin:0;padding:0;text-align:right}.slider .list .item .content .description{font-size:18px;font-family:Poppins;font-weight:400;color:#fff;opacity:.8;transform:translateY(-100%);transition:transform 1s;margin:0;padding:0;text-align:right;text-transform:none;max-width:500px;line-height:1.6}.slider .list .item .content .stats{display:flex;flex-direction:column;gap:8px;margin:0;padding:0;max-width:350px}.slider .list .item .content .stats .stat-item{display:flex;justify-content:space-between;align-items:center;padding:10px 20px;background:#0006;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-radius:5px;border-left:3px solid rgba(255,255,255,.5);transition:all .3s ease}.slider .list .item.active .content .stats .stat-item:hover{background:#ffffff1a;transform:translate(5px)}.slider .list .item .content .stats .stat-label{font-size:.9em;font-weight:400;letter-spacing:3px;color:#fff;font-family:Bebas Neue,sans-serif;opacity:.9}.slider .list .item .content .stats .stat-value{font-size:2.5em;font-weight:400;color:#fff;font-family:Bebas Neue,sans-serif;line-height:1}.slider .list .item .image{flex-shrink:0;width:var(--diameter);height:var(--diameter);background-image:var(--url);background-size:cover;background-position:center;border-radius:50%;transform:rotate(-60deg);position:relative;transition:1s}.slider .list .item .image:before{position:absolute;width:70%;height:70%;content:"";border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-120deg);background-color:var(--inner-circle-color, #333);transition:1s}.slider .list .item .image:after{position:absolute;width:30%;height:30%;content:"";background-image:var(--url);background-size:cover;background-position:center;background-repeat:no-repeat;border:3px solid #fff2;border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-170deg)}.slider .list .item .image{filter:blur(30px)}.slider .list .item{pointer-events:none;opacity:0}.slider .list .item.active{pointer-events:auto;opacity:1}.slider .item.active .image{filter:blur(0px);transform:rotate(0)}.slider .item.active .image:before,.slider .item.active .image:after{transform:translate(-50%,-50%) rotate(0)}.slider .list .item.active .year-display{transform:translate(-50%) translateY(0)}.slider .list .item.active .content h2,.slider .list .item.active .content .year,.slider .list .item.active .content .tag,.slider .list .item.active .content .description{transform:translateY(0)}.slider .list .item.active~.item{opacity:0}.slider .item.active~.item .image{transform:rotate(60deg)}.slider .item.active~.item .image:before{transform:translate(-50%,-50%) rotate(120deg)}.slider .item.active~.item .image:after{transform:translate(-50%,-50%) rotate(170deg)}.slider .list .item.active~.item .content h2{transform:translateY(100%)}.arrows{position:absolute;left:50%;transform:translate(-50%);bottom:30px;width:var(--width-default);display:flex;justify-content:space-between}.arrows button{all:unset;cursor:pointer}.slider .list:after{position:absolute;content:"";bottom:0;width:min(1000px,100vw);height:70%;left:50%;transform:translate(calc(-50% + var(--center-offset-x, 0px))) translateY(var(--center-offset-y, 0px)) scale(var(--center-scale, 1)) translateZ(50px);background-image:var(--center-image);background-size:contain;background-position:center;background-repeat:no-repeat;filter:drop-shadow(0 0 50px rgba(0,0,0,.6)) drop-shadow(0 20px 80px rgba(0,0,0,.4)) brightness(1.1) contrast(1.1);pointer-events:none;animation:showModel 1s ease-in-out 1 forwards;perspective:1000px;transform-style:preserve-3d}@keyframes showModel{0%{transform:translate(-50%) scale(1.3) translateY(88px);filter:drop-shadow(0 0 30px rgba(0,0,0,.3));opacity:0}to{opacity:1}}.arrows button.d-none{opacity:0;pointer-events:none}@media all and (max-width:1024px){.slider .list .item .content{grid-template-columns:repeat(2,300px)}.slider .list .item .content h2{font-size:8em}}@media all and (max-width:767px){.slider .list .item .content{grid-template-columns:80%;justify-content:center;gap:20px;top:70px}.slider .list .item .content h2{font-size:4em}.slider .list .item .content p{font-size:small}}