.main--rating{background-color:var(--main-color);justify-content:center;width:100%;display:flex}.rating__container{background:#fff;width:90%;max-width:1000px;height:fit-content;margin-bottom:8rem;padding:20px 60px;overflow-x:clip}@media screen and (max-width:720px){.rating__container{padding:20px 40px}}@media screen and (max-width:500px){.rating__container{width:95%;padding:20px 30px}}@media screen and (max-width:360px){.rating__container{width:95%;padding:20px 15px}}.rating__container .swiper{z-index:20;overflow:visible}.rating__header{width:100%;max-width:730px;margin-bottom:80px;margin-left:auto;margin-right:auto;position:relative}.rating__header__pattern{background:#d6d6d6;width:100%}.rating__header__content{z-index:2;flex-direction:column;justify-content:center;align-items:center;width:70%;display:flex;position:relative}.rating__header__illustration{aspect-ratio:1;background:#fff;flex-direction:column;justify-content:center;align-items:center;width:70%;margin:auto;display:flex;position:relative;transform:translateY(8%)}@media screen and (max-width:720px){.rating__header__illustration{width:85%}}.rating__header__illustration .rating__image{z-index:-1;object-fit:cover;object-position:center;filter:grayscale();width:100%;height:100%;position:absolute}.rating__selectors{flex-flow:wrap;gap:3rem;width:100%;display:flex}.rating__selectors>*{flex-grow:1}.rating__heading{flex-flow:column wrap;justify-content:space-between;align-items:flex-start;margin-bottom:3rem;display:flex}@media screen and (max-width:600px){.rating__heading{gap:25px}}.rating__heading hr{border-bottom:1px solid #9d9d9d;width:80%;margin:auto auto 1rem}.rating__heading__content{width:100%}.rating__heading__content p{line-height:1.8rem}.rating__heading__content p:not(last-child){margin-bottom:1rem}.rating__heading__content a{color:#2154ff}.rating__heading__content a:hover{color:#001f87}.rating__heading h1{font-size:3.1rem;font-weight:700}@media screen and (max-width:900px){.rating__heading h1{font-size:2.5rem}}@media screen and (max-width:600px){.rating__heading h1{font-size:2rem}}@media screen and (max-width:400px){.rating__heading h1{margin-bottom:1rem;font-size:1.5rem}}.rating__heading__link{text-wrap:nowrap;flex:auto;padding:.85rem 1rem}.rating__subheading{margin-top:1.5rem;margin-bottom:1rem;font-size:2.1rem;font-weight:700}.rating__rating{width:100%}.rating__element{flex-direction:row;align-items:center;width:100%;display:flex;position:relative}.rating__element:not(:last-child){border-bottom:3px solid #000}.rating__element:last-child{background-color:#0000!important}.rating__element:last-child .rating__element__data{height:45px}.rating__element:last-child .rating__element__artwork{height:35px}.rating__element:nth-of-type(odd){color:#000;background-color:#fff}.rating__element__rate{border-right:3px solid #000;flex-shrink:0;justify-content:center;align-items:center;width:50px;height:80px;padding-left:10px;padding-right:10px;font-family:TerminalGrotesk,serif;font-size:1.8rem;display:flex}@media screen and (min-width:900px){.rating__element__rate{width:90px;height:90px;font-size:2.3rem}}.rating__element__artwork{aspect-ratio:1;width:60px;height:60px;margin-left:10px;margin-right:10px}@media screen and (min-width:900px){.rating__element__artwork{width:70px;height:70px}}.rating__element__artwork img{object-fit:cover;object-position:center;width:100%;height:100%}.rating__element__data{flex-direction:column;flex-grow:1;justify-content:center;align-items:center;gap:5px;height:80px;display:flex}@media screen and (min-width:900px){.rating__element__data{height:90px}}.rating__element__data>*{-webkit-line-clamp:1;line-clamp:1;-webkit-box-orient:vertical;width:100%;display:-webkit-box;overflow:hidden}.rating__element__artist{font-size:1.1rem;font-weight:700;line-height:1.2rem}.rating__element__album{font-size:1rem;line-height:1.1rem}.rating__element__label{font-size:.8rem;line-height:.9rem}.rating__element__buttons{flex-direction:row;flex-shrink:0;justify-content:center;gap:8px;padding-left:10px;padding-right:10px;display:flex}@media screen and (min-width:900px){.rating__element__buttons{width:105px}}.rating__element__buttons button{aspect-ratio:1;cursor:pointer;background:#000;border:none;border-radius:50%}@media screen and (min-width:900px){.rating__element__buttons button svg{width:25px;height:25px}}.rating__element__buttons button svg{transition:transform .15s ease-in-out}.rating__element__buttons button:hover svg{transform:scale(1.1)}.rating__element__buttons .informations{display:none}@media screen and (min-width:900px){.rating__element__buttons .informations{display:initial;position:relative}.rating__element__buttons .informations:hover:before{width:200%}.rating__element__buttons .informations:before{content:" ";height:100%;display:block;position:absolute;bottom:0;right:0}}@media screen and (max-width:900px){.rating__element:has(>.rating__element__artwork:focus)>.rating__element__details{opacity:1;max-width:100%}}@media screen and (min-width:900px){:is(.rating__element:has(>.rating__element__buttons>.informations:hover)>.rating__element__details,.rating__element__details:hover){opacity:1;max-width:100%;left:180px}}.rating__element__details{color:#000;opacity:0;transform-origin:0;background:#fff;border:1px solid #444;align-items:center;max-width:0;height:80%;transition:max-width .3s ease-in-out,border-size 50ms ease-in-out,opacity .1s ease-in-out,left .25s ease-in-out;display:flex;position:absolute;left:130px;right:50px;overflow:hidden;box-shadow:0 3px 8px #0000003d}@media screen and (min-width:900px){.rating__element__details{transform-origin:100%;float:right;left:90%;right:100px}}.rating__element__details__container{flex-direction:row;align-items:center;gap:10px;width:100%;padding:10px;display:flex}.rating__element__details__artworks{flex-direction:row;gap:5px;display:flex}.rating__element__details__artworks p{font-size:.8rem}.rating__element__details__artworks img{aspect-ratio:1;object-fit:cover;object-position:center;opacity:1;width:40px;height:40px}
