﻿/* PAGE INTRO */
#page-intro{padding-top:15.9rem;position:relative;overflow:hidden;border-radius: 0 0 3.2rem 3.2rem;}
#page-intro .last-site-cta__pappaloop{opacity:.2}
#page-intro hgroup{padding: 4.4rem 0 4.8rem;text-align: center;}
#page-intro h1{font-size:4.8rem;margin: 0;line-height:1.2;}     
#page-intro h2{text-transform: uppercase;font-size: 1.4rem;letter-spacing:.1rem;margin-top:0;margin-bottom:1.6rem;line-height:1;place-content:center;display: flex;align-items:center;gap:1.6rem;flex-direction:column}   
#page-intro h2 span{line-height: 1.5;}
#page-intro .standard-list-item li {font-size:1.6rem}

#page-intro{padding-bottom: 60%;}
.page-headings{position:relative;}

@media (min-width: 500px) {
    #page-intro {padding-bottom: 20%;}
    #page-intro h2{font-size:1.6rem}
}

@media(min-width:768px){
    #page-intro h2{gap:.8rem;flex-direction:row}
}

@media(min-width:992px){
    #page-intro hgroup{padding:8.8rem 0 4.8rem}
}

    @media(min-width:1280px){
        #page-intro{border-radius: 0 0 6.4rem 6.4rem;}
    }
    
@media (min-width: 1440px) {
    #page-intro h1{font-size:6.4rem;}      
}

/* PAGE CAROUSEL */
#page-carousel{margin-top: -60%;padding-bottom: 4.4rem;}
#page-carousel .swiper-slide{width: calc(100% - 3.2rem);cursor:pointer}
#page-carousel .swiper-slide img{display: block;aspect-ratio: 1;object-fit: cover;border-radius: 1.6rem;width:100%;height:auto}
#page-carousel .swiper-pagination{position: relative;bottom: auto;left: auto;color: #99c1db;width: 60px;font-family: var(--ff-default);font-size:2rem;font-weight: bold;}
#page-carousel .swiper-pagination-current{color:var(--primary-color)}
#page-carousel .nav-carousel-control-wrapper{margin:2.4rem auto 0}
#page-carousel .nav-carousel-control{width: 5rem;height: 5rem;}
#page-carousel .swiper-slide span {pointer-events: none;border: 2px solid #fff;bottom: 1.6rem;right: 1.6rem;width: 4rem;height: 4rem;position: absolute;display: flex;place-content: center;align-items: center;border-radius: 50%;background: #fff;color: var(--primary-color);}


@media(min-width:500px){    
    #page-carousel{margin-top: -20%;}
    #page-carousel .swiper-slide img{aspect-ratio: 900 / 550;}
}

@media(min-width:992px){
    #page-carousel .swiper-slide{width: calc(((100% - 2 * 6.4rem - (12 - 1) * 2.4rem) / 12) * 8 + (8 - 1) * 2.4rem);}
}

@media(min-width:1280px){
    #page-carousel .swiper-slide{width: calc(((100% - 2 * 6.4rem - (12 - 1) * 2.4rem) / 12) * 6 + (6 - 1) * 2.4rem);}
}

/* PAGE IMAGE */
#page-image{margin-top: -60%;padding-bottom: 6.4rem;position:relative}
#page-image .image-wrapper{width: calc(100% - 3.2rem);margin:auto}
#page-image img{display: block;aspect-ratio: 1;object-fit: cover;border-radius: 1.6rem;width:100%;height:auto}

@media(min-width:500px){    
    #page-image{margin-top: -20%}
    #page-image .image-wrapper img{aspect-ratio: 900 / 550;}
}

@media(min-width:992px){
    #page-image .image-wrapper{width: calc(((100% - 2 * 6.4rem - (12 - 1) * 2.4rem) / 12) * 8 + (8 - 1) * 2.4rem);}
}

@media(min-width:1280px){
    #page-image .image-wrapper{width: calc(((100% - 2 * 6.4rem - (12 - 1) * 2.4rem) / 12) * 6 + (6 - 1) * 2.4rem);}
}

/* PAGE CONTENT */
#page-content{padding-bottom:4.4rem}
.page-content__leading{font-size:2.4rem;line-height:1.25;margin-top:0;margin-bottom:4.4rem}
.page-content__body hr{margin:4.4rem 0;border:1px solid var(--secondary-color)}
.page-content__body .post-meta{text-align:right;margin-top:4.4rem}
.page-content__body .post-meta span{font-size:1.6rem;font-weight:300;color:#333}
.page-content__body .post-meta span strong{font-weight:900;color:var(--primary-color)}

.custom-accordion{margin-top:4.4rem}
.page-content__body-description p{font-size: 1.8rem;line-height: 1.35;font-weight:400}
.page-content__body-description p:first-of-type{margin-top:0}
.page-content__body-description p:last-of-type{margin-bottom:0}
.custom-accordion-content{background:#faf9f3}
.custom-accordion-content ul{margin:0}
.custom-accordion-content li{margin:0}
.custom-accordion-content p{font-weight:400}
.custom-accordion-content-inner__icon-list{margin-top:2.4rem}
.custom-accordion-item button{text-transform:uppercase;letter-spacing: 0.05rem}
.custom-accordion-item button span{font-size: 1.8rem;}
.custom-accordion-content-inner a{color:var(--primary-color);font-weight:600;}

@media(min-width:500px){
    .page-content__body-description p{font-size:2rem}
}

@media (min-width: 1280px) {
    .custom-accordion-content > div {padding: 0 2.4rem 2.4rem;}
}

@media(min-width:1440px) {
   .page-content__body{width:calc(((100% - (12 - 1) * 2.4rem) / 12) * 8 + (8 - 1) * 2.4rem);margin:auto}
}

/* LIST ITEM */

.gen-cms-content ul:not(.icon-list-item){list-style:disc;padding-left:2.4rem;display: flex;flex-direction: column;gap: .8rem;}
.gen-cms-content ul:not(.icon-list-item) li{display:list-item;font-size: 1.6rem;font-weight:300;color: #333;}
.icon-list-item li{font-weight:300}
.gen-cms-content ul.standard-list-item li > p:first-of-type{margin-bottom:.8rem}
.gen-cms-content ul.standard-list-item li > p:last-of-type{margin:0}

/* RELATED */
#related-section{padding:4.4rem 0}
#related-section h2{text-align:center;font-size: 3.2rem;line-height: 1.2;margin-top:0}

.related-list{display: flex;gap: 2.4rem;flex-direction: column;}
.related-list li{flex:1}
.related-card{display:block;position:relative;border-radius:1.6rem;overflow:hidden;width:100%;}
.related-card__image-wrapper{position:relative}
.related-card__image-wrapper img{width:100%;height:auto;display:block;aspect-ratio: 468 / 624;object-fit: cover;}
.related-card__image-wrapper:after{background: rgba(0, 0, 0, .4);content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;pointer-events: none;mix-blend-mode: multiply;}
.related-card__title{color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:var(--ff-heading);font-size:4.8rem;width:100%;padding:0 2.4rem;line-height:1.1;text-align:center;margin:0}
.related-card__fake-button {border: 2px solid #fff;bottom: 1.6rem;right: 1.6rem;width: 4rem;height: 4rem;position: absolute;display: flex;color: #fff;place-content: center;align-items: center;border-radius: 50%;}

@media (min-width: 500px) {
    .related-card__fake-button {bottom: 2rem;}
}

@media(min-width:600px){
    .related-card__image-wrapper img{aspect-ratio:1/.5;max-height:35rem}  
}

@media(min-width:992px){
    .related-card__image-wrapper img{max-height:43rem}  
}

@media(min-width:1280px){
    .related-list{flex-wrap:wrap;flex-direction:row;place-content:center}   
    .related-list li{flex:none;width:calc(((100% - (12 - 1) * 2.4rem) / 12) * 3 + (3 - 1) * 2.4rem)}
    .related-card__image-wrapper img{aspect-ratio:468 / 624;max-height:none}  
}
@media (min-width: 1440px) {
    #related-section h2{font-size:4.8rem;}      
}