/* ========================================================================== */
/*  SPARK DESIGN                                                              */
/* ========================================================================== */

/* ========================================================================== */
/*  COMPONENTS                                                                */
/* ========================================================================== */

/* Navigation */

nav .wp-block-navigation-item__label{
    font-weight: 500;
}

nav .current-menu-item .wp-block-navigation-item__label,
nav a:hover .wp-block-navigation-item__label{
    color: var(--wp--preset--color--brand-accent);
}

nav .wp-block-navigation-item button.wp-block-navigation__submenu-icon{
    padding-right: 15px;
}

.wp-block-navigation-item .wp-block-navigation-submenu .wp-block-navigation-item .wp-block-navigation-item__label{
    font-weight: 400;
    text-transform: none;
}

.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item.has-child > .wp-block-navigation__submenu-container
  > .wp-block-navigation-item.has-child {
  margin-block: 24px;
  padding-bottom: 30px;
  border-bottom: 1px solid rgba(0,0,0,0.2);
}

.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__submenu-container
  > .wp-block-navigation-item.has-child
  > a.wp-block-navigation-item__content {
  font-weight: bold !important;
}

/* Image */

.wp-block-image.is-placeholder{
    display: none;
}

/* Social Media Links */

.wp-block-social-links li.wp-social-link a{
    border-radius: 0;
    background: transparent;
    --social-link-bg-hover: transparent;
    color: var(--wp--preset--color--brand-text);
    padding: 0;
}

.wp-block-social-links li.wp-social-link a:hover{
    color: var(--wp--preset--color--brand-accent);
}

.wp-block-social-links li.wp-social-link a svg{
    width: 24px;
    height: 24px;
}

/* Eyebrow */

.eyebrow{
    color: var(--wp--preset--color--brand-accent);
    text-transform: uppercase;
    font-weight: 600;
}

/* Map */

.autosweet-location-map{
    border-radius: 6px;
    box-shadow: var(--wp--custom--shadow--media);
}

/* Section Title */

.section-title h2.wp-block-heading{
    font-size: 40px;
}

.autosweet-data-items.autosweet-data-items--grid .autosweet-data-items__featured{
    margin-bottom: 40px;
    aspect-ratio: 16/9;
    overflow: hidden;
    border-radius: var(--wp--custom--radius--image);
}

.autosweet-data-items.autosweet-data-items--grid .autosweet-data-items__featured img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.autosweet-data-items.autosweet-data-items--grid .autosweet-data-items__title{
    margin-bottom: 20px;
}

.autosweet-archive-card__media {
    overflow: hidden;
}

.autosweet-archive-card__media img {
    border-radius: var(--wp--custom--radius--image);
}

.spark-design .autosweet-contact-info__list{
    gap: 5px;
}

/* Credentials Block */
footer #bottombar .autosweet-credentials-list ul{
    display: flex;
    justify-content: center;
    gap: 20px;
}

@media(min-width:782px){
    
    footer #bottombar .autosweet-credentials-list ul{
        justify-content: flex-end;
    }

}


/* ========================================================================== */
/*  HEADER                                                                    */
/* ========================================================================== */

header{
    padding: 20px 0;
    border-bottom: 1px solid #CCCCCC;
}

header .site-logo{
    max-height: 120px;
}

header nav .wp-block-navigation-item__label{
    font-weight: 600;
    text-transform: uppercase;
    transition: 0.2s;
}

header nav .current-menu-item .wp-block-navigation-item__label,
header nav a:hover .wp-block-navigation-item__label{
    color: var(--wp--preset--color--brand-accent);
}


/* ========================================================================== */
/*  FOOTER                                                                    */
/* ========================================================================== */

footer{
    padding-top: 50px;
}

footer .site-logo{
    max-width: 200px;
}

footer .autosweet-location-contacts .as-contact__item{
    display: flex;
    gap: 10px;
    margin-bottom: 5px;
}

footer .autosweet-location-contacts .as-contact__item a{
    color: var(--wp--preset--color--brand-text);
}

footer #bottombar{
    padding: 35px;
    font-size: 0.875rem;
    border-top: 1px solid #CCCCCC;
}

footer #bottombar a{
    color: var(--wp--preset--color--brand-text);
}

footer #bottombar a:hover{
    color: var(--wp--preset--color--brand-accent);
}

@media(max-width:781px){

    footer{
        text-align: center;
    }

    footer .wp-block-group{
        align-items: center;
        justify-content: center;
    }

    footer .wp-block-navigation__container{
        justify-content: center;
    }

    footer .autosweet-location-contacts .as-contact__item{
        justify-content: center;
    }

    footer .autosweet-contact-info .autosweet-contact-info__list,
    footer .autosweet-contact-info .autosweet-contact-info__list .autosweet-contact-info__item{
        justify-content: center;
    }

}


/* ========================================================================== */
/*  HERO SECTION                                                              */
/* ========================================================================== */

#hero-section{
    padding: 0;
    padding-top: 60px;
}

#hero-section .color-block{
    background: var(--wp--preset--color--brand-primary);
}

#hero-section .wp-block-post-featured-image{
    margin-bottom: -150px;
}

#hero-section .wp-block-post-featured-image :where(img){
    height: 500px;
    object-position: center;
}

@media (max-width:1240px){

    #hero-section .hero-section__content{
        padding-left: 20px;
        padding-right: 20px;
    }

    #hero-section .wp-block-post-featured-image,
    #hero-section .service-domain-image{
        padding-left: 30px;
        padding-right: 30px;
    }

}

/* ========================================================================== */
/*  ABOUT SECTION                                                             */
/* ========================================================================== */

#about-section{
    padding: 0;
}

#about-section .about-section__content{
    background: var(--wp--preset--color--brand-primary);
    margin-top: 0;
}

#about-section .about-section__content,
#about-section .about-section__content .wp-block-heading{
    color: white;
}

#about-section .wp-block-image img{
    height: 500px;
    object-fit: cover
}

@media (max-width:1240px){

    .about-section__content,
    .about-section__mission{
        padding-left: 30px;
        padding-right: 30px;
        padding-bottom: 40px;
    }


}

@media(min-width:1240px){
    
    #about-section{
        margin-bottom: -75px;
    }

}

@media (min-width: 782px){

    #about-section .about-section__content-image-column{
        transform: translateY(175px);
    }

    #about-section .about-section__mission-image-column{
        transform: translateY(-175px);
    }

}

@media (max-width: 781px){

    #about-section .about-section__mission .wp-block-columns{
        flex-direction: column-reverse;
    }

    .about-section__content .wp-block-spacer,
    .about-section__mission .wp-block-spacer{
        display: none;
    }

}


/* ========================================================================== */
/*  CALL TO ACTION SECTION                                                    */
/* ========================================================================== */

.call-to-action-section{
    text-align: center;
    color: white;
    background: var(--wp--preset--color--brand-primary);
}

.call-to-action-section,
.call-to-action-section .wp-block-heading{
    color: white;
}

@media(max-width:781px){

    .call-to-action-section{
        padding: 50px 10px;
    }

}


/* ========================================================================== */
/*  SERVICE AREA SECTION                                                      */
/* ========================================================================== */

#service-area-section .service-area-content-column {
    padding: 0 75px;
}

#service-area-section .wp-block-heading,
#service-area-section p {
    max-width: 550px;
}

#service-area-section .autosweet-service-areas ul {
    columns: 2;
}

@media (min-width: 1024px) {
    #service-area-section .autosweet-service-areas ul {
        columns: 3;
    }
}

#service-area-section .autosweet-service-areas ul li {
    margin-bottom: 15px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

#service-area-section .autosweet-service-areas ul li .autosweet-service-areas__text {
    font-size: 16px;
    font-weight: 600;
}

#service-area-section .autosweet-service-areas ul li .autosweet-marker {
    color: var(--wp--preset--color--brand-accent);
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    display: block;
}

/* ========================================================================== */
/*  SERVICES ARCHIVE                                                          */
/* ========================================================================== */

.spark-design.archive-template--services .services-by-domain-archive {
    gap: 42px;
}

.spark-design.archive-template--services .services-by-domain-archive__domain-group {
    gap: 22px;
}

.spark-design.archive-template--services .services-by-domain-archive__domain-header {
    border-bottom: 1px solid var(--wp--preset--color--brand-primary);
    padding-bottom: 14px;
    margin-bottom: 50px;
}

.spark-design.archive-template--services .services-by-domain-archive__domain-title,
.spark-design.archive-template--services .services-by-domain-archive__domain-title a {
    color: var(--wp--preset--color--brand-primary);
}

.spark-design.archive-template--services .services-by-domain-archive__domain-title a:hover {
    color: var(--wp--preset--color--brand-accent);
}

.spark-design.archive-template--services .services-by-domain-archive__cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 30px;
    row-gap: 30px;
}

@media (max-width: 1024px) {
    .spark-design.archive-template--services .services-by-domain-archive__cards-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .spark-design.archive-template--services .services-by-domain-archive__cards-grid {
        grid-template-columns: 1fr;
    }
}


/* ========================================================================== */
/*  DOMAIN SECTION                                                            */
/* ========================================================================== */

.service-domain-image :where(img){
    height: 500px;
    object-position: center;
    object-fit: cover;
    border-radius: var(--wp--custom--radius--image);
    margin-block-end: -150px;
    box-shadow: var(--wp--custom--shadow--media);
}

/* ========================================================================== */
/*  SERVICES SECTION                                                          */
/* ========================================================================== */

#services-section{
    color: white;
    background: var(--wp--preset--color--brand-primary);
}

#services-section .wp-block-group .wp-block-columns{
    gap: 75px;
}

#services-section .autosweet-data-items__inner{
    display: flex;
    flex-direction: column;
    gap: 35px;
}

#services-section .autosweet-data-items__item{
    align-items: flex-start;
    text-align: left;
    padding-bottom: 10px;
}

#services-section .wp-block-heading,
#services-section .autosweet-data-items__title{
    color: white;
}

#services-section .autosweet-data-items__item:not(:last-child){
    border-bottom: 1px solid rgba(255, 255, 255, 0.33);
}

#services-section .autosweet-data-items__number{
    color: var(--wp--preset--color--brand-accent);
    font-weight: 700;
}

#services-section .services-section__image-column > .wp-block-image{
    height: 100%;
}

#services-section .services-section__image-column > .wp-block-image img{
    height: 100%;
    max-height: 750px;
    object-fit: cover;
    object-position: center;
}

#services-section .services-section__featured-service-image,
#services-section .services-section__featured-service-image .autosweet-data-items__inner,
#services-section .services-section__featured-service-image .autosweet-data-items__item,
#services-section .services-section__featured-service-image .autosweet-data-items__featured {
    height: 100%;
}

#services-section .services-section__featured-service-image .autosweet-data-items__inner {
    gap: 0;
}

#services-section .services-section__featured-service-image .autosweet-data-items__item {
    padding-bottom: 0;
    border-bottom: 0;
}

#services-section .services-section__featured-service-image .autosweet-data-items__featured {
    margin-bottom: 0;
    aspect-ratio: auto;
}

#services-section .services-section__featured-service-image .autosweet-data-items__featured img {
    height: 100%;
    max-height: 500px;
    object-fit: cover;
    object-position: center;
}

@media (max-width:1240px){

    #services-section{
        padding: 0 40px;
        padding-bottom: 50px;
    }

}


/* ========================================================================== */
/*  SECTION TITLE SECTION                                                     */
/* ========================================================================== */

.section-title{
    margin-bottom: 0;
}

@media(min-width:782px){
    .section-title{
        margin-bottom: 100px;
    }
}


/* ========================================================================== */
/*  SERVICES BULLET POINTS SECTION                                            */
/* ========================================================================== */

.service-bullet-points-section{
    margin-top: 0;
    background: var(--wp--preset--color--brand-primary);
    padding-bottom: 75px;
}

.service-bullet-points-section,
.service-bullet-points-section .autosweet-data-items__title{
    color: white;
}

@media(max-width:1240px){
    .service-bullet-points-section{
        padding: 0 40px;
        padding-bottom: 75px;
    }
}


/* ========================================================================== */
/*  CONTACT PAGE                                                              */
/* ========================================================================== */

.contact-page #hero-section .wp-block-post-featured-image{
    margin-bottom: 0;
}

#contact-section{
    padding: 30px 40px;
}