@media (max-width:1350px) {
    .grid-mosaic{    grid-template-columns: repeat(3, minmax(0px, 1fr));}
}

@media (max-width:1210px) {
    .split-section{gap: 60px;}

    .banner-wrapper.generic{min-height:360px;}
}


@media (max-width:1080px) {
    /* === HEADER === */
    nav.desktop{ display:none;}
    .trigger-overlay{display:flex;}
    .main-header .logo{width: 80px;}

    /* === BANNER === */
    .banner-wrapper{min-height: calc(100vh - 196px);}
    .banner-wrapper.community-run{min-height: calc(100vh - 236px);}
    .banner-wrapper .banner-content h1{font-size: 3.6em;}

    .banner-wrapper.event-banner .banner-content h1{font-size: 3.2em;}

    .split-section{flex-direction: column; text-align: center; gap:40px;}

    .contact-page-wrapper{padding: 30px; gap:30px;}

    .team-grid{gap: 20px;}
    .team-grid .card img{height: 420px;}

    #map.event-map{height:330px;}

    .event-card-summary.list .img-wrapper{max-width:300px; display:flex;}
    .event-details-card .button-grid{grid-template-columns: repeat(1, minmax(0, 1fr)); gap:15px;}
}

@media (max-width:800px) {

    /* === BANNER === */
    .banner-wrapper .banner-content h1, .banner-wrapper.event-banner .banner-content h1, .banner-wrapper.generic .banner-content h1{font-size: 2.6em;}

    .banner-wrapper.generic{min-height:320px;}

    .contact-page-wrapper{flex-direction:column; padding: 30px; gap:30px;}
    .contact-page-wrapper .contact-details-container{order:2;}
    .contact-page-wrapper .contact-form-container{order:1;}

    .event-banner .sub-title{font-size: 1.1rem;  line-height: 2rem;}

    

    .event-details-table{grid-template-columns: repeat(1, minmax(0, 1fr));}
    .event-details-table .item.colspan-2{    grid-column: span 1;}
    .event-details-table .item:nth-of-type(odd){border-right:none;}

    .grid-mosaic{grid-auto-rows: 200px;}

    
}

@media (max-width:740px) {
    .banner-wrapper{min-height: calc(100vh - 256px);}
    .banner-wrapper.community-run{min-height: calc(100vh - 298px);}
    .banner-sub-bar{padding-top:12px; padding-bottom:12px;}
    .banner-sub-bar .border-button{height: 48px;}
    .banner-wrapper .banner-content .text-arrow-link{margin:10px 0 50px 0;}

    .team-grid{grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 30px;}
    .team-grid .card img{height: auto;}

    .event-slider .event-item{padding: 20px 7px;}
    .event-details-card{    padding: 20px 20px;}
    .event-card-summary .name{    font-size: 1.1rem; line-height: 1.7rem;}

    .event-location-card.event-details-card .header-container .solid-button{display:none;}
    .event-location-card.event-details-card .mob.solid-button{display:flex;}
    
    .event-card-summary.list{flex-direction: column;}
    .event-card-summary.list .img-wrapper{ max-width: none; width:100%;}
    .event-card-summary.list .img-container{width:100%;}
    .event-card-summary.list .img-container:before{ width: 100%; height: 20%; background: linear-gradient(0deg, rgba(22, 22, 22, 1) 5%, rgba(22, 22, 22, 0) 100%); bottom: -1px; right:auto;}
    .event-card-summary.list .solid-button{width:100%;}
}


@media (max-width:640px) {
    h1{font-size: 2.2rem; line-height: 2.5rem;}
    h2{font-size: 1.8rem; line-height: 2.3rem;}
    h3{font-size: 1.4rem; line-height: 1.9rem;}
    h4{font-size: 1.4rem; line-height: 1.9rem;}
    h5{font-size: 1.2rem; line-height: 1.7rem;}

    .results-page-wrapper h2{font-size: 1.6rem; line-height: 2.2rem;}

    .underlined-header:after{margin: 12px auto;}

    .accordion .heading{padding: 10px 15px;}
    .accordion .heading h3, .accordion .heading h4{font-size: 1rem; line-height: 1.5rem;}

    .banner-wrapper.generic{min-height:260px;}

    .banner-wrapper.homepage .banner-content h1{font-size: 2.3em; line-height: 1.2em;}
    .banner-wrapper.generic.event-banner{min-height: 320px;}
    .banner-wrapper.event-banner .banner-content h1{font-size: 2.2em; line-height: 1.15em;}
    .banner-wrapper .banner-content h1, .banner-wrapper.generic .banner-content h1{font-size: 2.1em; line-height: 1.2em;}
    .event-banner .sub-title{ font-size: 1rem; line-height: 1.7rem; letter-spacing: 2px;}

    .event-details-card .title{font-size: 1.4rem;  line-height: 1.8rem; letter-spacing: 1px;}
    .event-details-table .item{padding: 10px 12px;}

    .gpx-table{padding:0;}
    .gpx-table .item{flex-direction:column; justify-content:center; text-align:center; padding: 17px 17px;}
    .gpx-table .item img.garmin, .gpx-table .item img.osmaps{margin:5px auto 10px auto;}
    .gpx-table .item .solid-button{width: 100%; margin: 5px 0 0 0;}

    .grid-mosaic{grid-auto-rows: auto; grid-template-columns: repeat(1, minmax(0px, 1fr));}

    .card .text-container{padding:20px 20px 20px 20px}
    .event-card-summary .text-container{padding:20px 20px 10px 20px;}
    .event-card-summary .item{ gap: 8px;}
    .event-card-summary .button-container{    padding: 10px 20px 20px 20px;}
    .blog-card .solid-button{width:100%;}

    .event-card-summary.list .text-container{padding:20px 20px 20px 20px;}
    .event-card-summary.list .solid-button{margin: 15px 0 0 0;}

    #map.event-map{height:260px;}

    .blog-article .text-container h1{font-size: 1.9rem; line-height: 2.5rem; letter-spacing: 1px;}
    .blog-article .text-container h2{ font-size: 1.6rem; line-height: 2.1rem;}
    .blog-article .text-container h3{font-size: 1.4rem;}
    .blog-article .text-container h4{font-size: 1.2rem; line-height: 1.8rem;}
    
    .cms-content h2, .cms-content h3, .cms-content h4{padding-top:10px;}
    .cms-content h1{font-size: 1.8rem; line-height: 2.2rem; letter-spacing: 1px;}
    .cms-content h2{font-size: 1.5rem; line-height: 2.1rem; font-weight:600; letter-spacing: 1px;}
    .cms-content h3{font-size: 1.3rem; line-height: 1.7rem; font-weight:500; letter-spacing: 1px;}
    .cms-content h4{font-size: 1.1rem; line-height: 1.5rem; font-weight:600; letter-spacing: 1px;} 
}

@media (max-width:540px){
    .event-card-summary .img-container img{height: 200px;}
    .event-card-summary .item{padding:8px 0;}
    .event-card-summary .item i{font-size: 23px;}

    .event-card-summary.list .img-container img{height: 200px; width:100%;}
}

@media (max-width:460px) {
    h1{font-size: 1.7rem; line-height: 2.1rem;}
    h2{font-size: 1.5rem; line-height: 2rem;}
    h3{font-size: 1.3rem; line-height: 1.8rem;}
    h4{font-size: 1.2rem; line-height: 1.7rem;}
    h5{font-size: 1.4rem; line-height: 1.6rem;}

    .community-header {padding-top:5px; padding-bottom:7px;}
    .community-header .site-container{display:flex; align-items:center; justify-content:center; gap:2px; flex-direction:column;}
    .community-header .solid-button{padding: 5px 8px; min-height: 24px; font-size: 0.8em; letter-spacing: 1px;}

    .event-details-card .event-descrption h3{font-size: 1.4rem; line-height: 1.8rem; letter-spacing: 1px;}
    .event-details-card .event-descrption h3{font-size: 1.2rem; line-height: 1.7rem; letter-spacing: 1px;}


    {{/* .accordion .heading h3, .accordion .heading h4{font-size: 0.9rem; line-height: 1.4rem;} */}}

    /* === BANNER === */
    .banner-wrapper.homepage .banner-content h1{font-size: 2.1em; line-height: 1.2em;}
    .banner-wrapper.event-banner .banner-content h1{font-size: 1.8em;}
    .banner-wrapper .banner-content h1, .banner-wrapper.generic .banner-content h1{font-size: 1.8em;}
    .banner-sub-bar .border-button{font-size: 1.3rem;}

    .contact-page-wrapper{ padding: 20px; gap:30px; border-radius: 12px;}
    .split-inputs{flex-direction:column; gap:0;}
    .contact-item{gap: 15px;}

    #map.event-map{height:240px;}

   
}
