/*--------------------------------------------------------------

FRONT PAGE STYLE

--------------------------------------------------------------*/
body.home {
    scroll-padding-top: 120px;
}
/*--------------------------------------------------------------

Front page  - slider

--------------------------------------------------------------*/

.section-front-page--slider {
    position: relative;

    display: block;

    margin: 0 auto;

    overflow: hidden;

    background-color: var(--color-background);
}

.section-front-page--slider .slick-dotted.slick-slider {
    margin-bottom: 0;
}

.container-front-page--slider {
    max-width: var(--container-4xl);

    display: block;

    margin: 0 auto;
}

.front-page--slider--slide-wrapper {
    height: 700px;

    padding: 0 var(--space-4);

    background-repeat: no-repeat;

    background-size: cover;
}

.front-page--slider--slide {
    height: 700px;

    max-width: var(--container-2xl);

    display: flex;

    flex-direction: row;

    align-items: center;

    gap: var(--space-16);

    justify-content: center;

    margin: 0 auto;
}

.front-page--slider--slide-row {
    width: 50%;
}


.front-page--slide-title {
    max-width: 520px;

    display: block;

    margin-bottom: var(--space-5);

    font-family: var(--heading-font);

    font-size: var(--text-3xl);

    font-weight: var(--font-normal);

    line-height: var(--leading-5);
}

.front-page--slide-description > * {
    max-width: 490px;

    display: block;

    margin-bottom: var(--space-10);

    color: var(--color-primary);

    font-size: var(--text-lg);

    line-height: var(--leading-7);
}

.front-page--slide-description strong {
    font-weight: var(--font-bold);
}

.front-page--slide-button {
    border: none;
}

a.front-page--slide-button {
    display: inline-block;

    margin-right: var(--space-6);

    padding: var(--space-3) var(--space-8);

    border-radius: var(--border-radius);

    background-color: var(--color-secondary);

    text-decoration: none;
}

a.front-page--slide-button .front-page--slide-button--text {

    color: var(--color-white);

    font-size: var(--text-base);

    font-weight: var(--font-normal);

    line-height: 1;

    text-align: center;

    text-decoration: none;
}

.front-page--slide-button button:hover {
    border-color: unset;

    background: unset;
}

.front-page--slide-button:hover,
.front-page--slide-button:hover button {
    background-color: var(--color-primary);
}

.front-page--slide--thumbnail {
    max-width: 520px;
}

a.front-page--slide-button.slide-button--grey {
    background-color: #666;
}

a.front-page--slide-button.slide-button--grey:hover {
    background-color: var(--color-primary);
}

.section-front-page--slider ul {
    list-style: none;

    margin: 0;
}

.section-front-page--slider .slick-prev {
    left: 50px;
}

.section-front-page--slider .slick-next {
    right: 50px;
}


.section-front-page--slider .slick-arrow {

    z-index: 2;
}

.section-front-page--slider .slick-slide img {
    width: 100%;
}

.section-front-page--slider .slick-dots {
    bottom: 24px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: var(--space-2);
}

.section-front-page--slider .slick-dots li button {
    width: 30px;

    height: 6px;

    margin-right: var(--space-3);

    border-radius: var(--border-radius);

    background-color: var(--color-primary);
}

.section-front-page--slider .slick-dots li.slick-active button {
    background-color: var(--color-secondary);
}

.slick-dots li button:before {
    display: none;
}
@media screen and (max-width: 1560px) {
    .front-page--slider--slide{
        max-width: var(--container-xl);
        gap: var(--space-8);
    }

.section-front-page--slider .slick-prev {
    left: 0px;
    }

.section-front-page--slider .slick-next {
    right: 0px;
    }


}
@media only screen and (max-width: 1360px) and (min-width: 1024px) {
     .front-page--slider--slide{
        max-width: var(--container-lg);
        gap: var(--space-4);
        margin-left: 48px;
     }
     .front-page--slider--slide-row:nth-child(1){
        width: 65%;
     }
    .front-page--slider--slide-row:nth-child(2){
        width: 35%;
     }
    .front-page--slide--thumbnail {
        max-width: 360px;
        text-align: center;
    }
}

@media only screen and (max-width: 1024px) {
    .front-page--slider--slide-wrapper {
        padding: 0 var(--space-10);
    }

    .front-page--slide-title {
        font-size: var(--text-2xl);
    }

    .front-page--slide-description > * {
        font-size: var(--text-lg);
    }

    a.front-page--slide-button {
        margin-right: 0;
		padding: var(--space-2) var(--space-4) !important;
        margin-bottom: var(--space-6);
    }

    .front-page--slide--thumbnail {
        max-width: 300px;
    }

    .section-front-page--slider .slick-prev,
    .section-front-page--slider .slick-next {
        height: 20px;
        width: 20px;
        object-fit: contain;
    }

    .section-front-page--slider .slick-prev {
        left: 8px;
    }

    .section-front-page--slider .slick-next {
        right: 8px;
    }

	ul.front-page-vehicle-tracking--tabs {
        justify-content: center;
    }

	.footer-column--first .footer-logo {
        width: 100%
    }

	.page-service--service-cta-content > * {
        font-size: var(--text-base) !important;
    }

	.page-service--service-cta-title {
        font-size: var(--text-xxl) !important;
		margin-bottom: var(--space-10) !important;
    }
}

@media only screen and (max-width: 768px) {
    .front-page--slider--slide-wrapper {
        padding: var(--space-8);
    }

    .front-page--slider--slide,
    .front-page--slider--slide-wrapper {
        height: auto;
    }

    .front-page--slider--slide {
        flex-direction: column-reverse;

        align-items: center;

        justify-content: center;

        gap: var(--space-6);
    }

    .front-page--slider--slide-row {
        width: 100%;

        text-align: center;
    }

    .front-page--slide-title {
        font-size: var(--text-xxl);
    }

    .front-page--slide-description > * {
        font-size: var(--text-base);
    }

    .front-page--slide--thumbnail {
        max-width: 200px;

        margin: 0 auto;
    }

    .front-page .section-front-page--slider {
        margin-top: 0;
    }
}

/*--------------------------------------------------------------

Front page services

--------------------------------------------------------------*/

.section-front-page--services {
    display: block;

    margin: 0 auto;

    padding: var(--space-10) var(--space-4);

    background-color: var(--color-background);
}

.container-front-page--services {
    max-width: var(--container-2xl);

    display: flex;

    flex-direction: row;

    flex-wrap: wrap;

    align-items: center;

    justify-content: center;

    gap: var(--space-24);

    margin: 0 auto;
}

.front-page-service img {
    max-height: 48px;

    display: block;

    margin: 0 auto var(--space-4) auto;

    transition: transform var(--transition-time) ease-in-out;
}

a.front-page-service,
.front-page-service--title {
    text-decoration-color: transparent;

    transition: transform var(--transition-time) ease-in-out;
}

a.front-page-service:hover .front-page-service--title {
    color: var(--color-secondary);
}

a.front-page-service:hover img {
    transform: translateY(-8px);
}

.front-page-service--title {
    color: var(--color-primary);

    font-size: var(--text-lg);

    line-height: var(--leading-5);
}

@media only screen and (max-width: 1280px) {
    .container-front-page--services {
        row-gap: var(--space-10);

        column-gap: var(--space-16);
    }
}

@media only screen and (max-width: 1024px) {
    .front-page-service {
        min-width: 150px;

        max-width: 150px;

        text-align: center;
    }
}

@media only screen and (max-width: 600px) {
    .container-front-page--services {
        column-gap: var(--space-8);
    }
}

/*--------------------------------------------------------------

Front page about us

--------------------------------------------------------------*/

.section-front-page--about-us {
    display: block;

    margin: var(--space-28) auto;

    padding: 0 var(--space-4);
}

.container-front-page--about-us {
    max-width: var(--container-2xl);

    display: block;

    margin: 0 auto;
}

.front-page-about-us--sub-tittle {
    display: block;

    margin-bottom: var(--space-4);

    color: var(--color-secondary);

    font-size: var(--text-xxl);

    font-weight: var(--font-bold);

    line-height: var(--leading-5);

    text-align: center;
}

.front-page-about-us--tittle {
    display: block;

    color: var(--color-primary);

    font-size: var(--text-3xl);

    font-weight: var(--font-bold);

    line-height: var(--leading-5);

    text-align: center;
}

.section-front-page--about-us .simptom-divider {
    display: block;

    margin: var(--space-8) auto var(--space-12) auto;
}

.front-page-about-us--description-wrapper {
    display: flex;

    flex-direction: row;

    align-items: center;

    justify-content: center;

    gap: var(--space-24);

    margin: 0 auto;
}

.front-page-about-us-fx--wrapper {
    position: relative;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;
}
@media screen and (max-width: 1560px) {
    .front-page-about-us--description-wrapper{
        gap: var(--space-12);
    }
        .container-front-page--about-us{
            max-width: var(--container-xxl);
        }
        .front-page-about-us-fx--title{
            font-size: var(--text-xl) !important;
            margin-bottom: var(--space-2);
        }
        .front-page-about-us-fx--description p {
            font-size: var(--text-base);
        }
        .front-page-about-us--description-wrapper .front-page-about-us-fx--wrapper:after{
            width: 70% !important;
            right: -45% !important;
        }
}
@media screen and (min-width: 1024px) {
    .front-page-about-us--description-wrapper .front-page-about-us-fx--wrapper:after {
        content: "";

        position: absolute;

        top: 50px;

        right: -80%;

        height: 100%;

        width: 100%;

        background: url("/wp-content/uploads/2023/11/line-about-us.png") no-repeat;
    }

    .front-page-about-us--description-wrapper .front-page-about-us-fx--wrapper:last-of-type::after {
        background: transparent;
    }
}

.front-page-about-us-fx--thumbnail-wrapper {
    position: relative;

    min-width: 100px;

    min-height: 100px;

    display: grid;

    place-items: center;

    margin-bottom: var(--space-4);

    isolation: isolate;
}
@media screen and (max-width:1360px) {
    .front-page-about-us--description-wrapper{
        gap: var(--space-6);
    }
    .front-page-about-us--description-wrapper .front-page-about-us-fx--wrapper:after{
        width: 50% !important;
        top: 35px;
        right: -30% !important;
    }
    .front-page-about-us-fx--thumbnail-wrapper {

    min-width: 60px;
    min-height: 60px;
    margin-bottom: var(--space-8);
    }
    .front-page-about-us-fx--thumbnail-wrapper::before{
        width: 70px;
        height: 70px;
    }
    .front-page-about-us-fx--thumbnail-wrapper::after{
        width: 60px;
        height: 60px;
    }
}

.front-page-about-us-fx--thumbnail {
    width: 60px;

    height: 60px;

    display: block;

    z-index: 1;
}

.front-page-about-us-fx--thumbnail-wrapper::before,
.front-page-about-us-fx--thumbnail-wrapper::after {
    position: absolute;

    /* top: 50%;

    left: 50%;

    transform: translate(-50%, -50%); */

    border-radius: 50%;
}

.front-page-about-us-fx--thumbnail-wrapper::before {
    content: "";

    display: block;

    width: 80px;

    height: 80px;

    background-color: rgb(6 110 175 / 40%);

    z-index: 0;

    transition: all ease-in 250ms;

    animation: pulse 2s infinite;
}

.front-page-about-us-fx--thumbnail-wrapper::after {
    content: "";

    display: block;

    width: 100px;

    height: 100px;

    background-color: rgb(6 110 175 / 20%);

    z-index: 0;

    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% {
        transform: scale(0.95);
    }

    50% {
        transform: scale(1);
    }

    100% {
        transform: scale(0.95);
    }
}

.front-page-about-us-fx--wrapper:hover .front-page-about-us-fx--title {
    color: var(--color-secondary);
}

.front-page-about-us-fx--wrapper:hover .front-page-about-us-fx--thumbnail-wrapper::before,
.front-page-about-us-fx--wrapper:hover .front-page-about-us-fx--thumbnail-wrapper::after {
    animation: pulse 1s infinite;
}

.front-page-about-us-fx--title {
    display: block;

    margin-bottom: var(--space-4);

    color: var(--color-primary);

    font-size: var(--text-xxl);

    font-weight: var(--font-bold);

    line-height: var(--leading-5);

    text-align: center;

    transition: all ease-in 250ms;
}

.front-page-about-us-fx--description {
    max-width: 284px;

    display: block;

    color: var(--color-primary);

    font-size: var(--text-lg);

    line-height: var(--leading-7);

    text-align: center;
}

.front-page-about-us-fx--description p {
    margin-bottom: 0;
}

@media only screen and (max-width: 1360px) {
    .front-page-about-us-fx--wrapper:after {
        background: unset;
    }
}

@media only screen and (max-width: 1024px) {
    .section-front-page--about-us {
        margin: var(--space-16) auto;
    }

    .front-page-about-us--description-wrapper {
        display: grid;

        grid-template-columns: repeat(2, 1fr);

        gap: var(--space-12);

        align-items: baseline;
    }

    .front-page-about-us--sub-tittle,
    .front-page-about-us-fx--title {
        font-size: var(--text-xl);
    }

    .front-page-about-us--tittle {
        font-size: var(--text-2xl);
    }
}

@media only screen and (max-width: 768px) {
    .front-page-about-us--description-wrapper {
        gap: var(--space-8);
    }

    .front-page-about-us-fx--thumbnail {
        width: 80px;

        height: 80px;
    }

    .front-page-about-us-fx--description {
        line-height: var(--leading-6);
    }
}

/*--------------------------------------------------------------

Front page IOT

--------------------------------------------------------------*/

.section-front-page--iot {
    display: block;

    margin: 0 auto;

    padding: var(--space-24) var(--space-4) var(--space-60) var(--space-4);

    border-radius: var(--border-radius);

    background-color: var(--color-background);

    background-image: url("/wp-content/uploads/2023/11/background-iot.jpg");

    background-repeat: no-repeat;

    background-size: cover;

    background-position: center center;
}

.section-front-page--iot a {
    text-decoration: none !important;
}

.container-front-page--iot {
    max-width: 1180px;

    display: block;

    margin: 0 auto;
}

.front-page-iot--column.iot-column__first {
    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: var(--space-5);

    margin-bottom: var(--space-14);
}

.front-page-iot--sub-tittle {
    display: block;

    margin-bottom: var(--space-4);

    color: var(--color-white);

    font-size: var(--text-xxl);

    font-weight: var(--font-bold);

    line-height: var(--leading-5);

    text-align: center;
}

.front-page-iot--tittle {
    display: block;

    margin-bottom: var(--space-4);

    color: var(--color-white);

    font-size: var(--text-3xl);

    font-weight: var(--font-bold);

    line-height: var(--leading-5);

    text-align: center;
}

.front-page-iot--column.iot-column__last {
    display: grid;

    grid-template-columns: repeat(3, 1fr);

    grid-gap: var(--space-6);
}

.front-page-iot-fx--wrapper {
    position: relative;

    height: 400px;

    display: flex;

    flex-direction: column;

    align-items: flex-start;

    justify-content: flex-end;

    padding: var(--space-5) var(--space-8) var(--space-10) var(--space-8);

    border-radius: var(--border-radius);

    background-repeat: no-repeat;

    background-size: cover;

    background-position: center center;
    transition: all ease-in 200ms;
}

.container-single-page-iot-fx a {
    text-decoration: none !important;
}

.front-page-iot-fx--wrapper .front-page-iot-fx--icon {
    max-height: 35px;

    display: block;

    margin-bottom: var(--space-3);

    z-index: 2;

    transition: all var(--transition-time) ease-in-out;
}

.front-page-iot-fx--title {
    display: block;

    margin-bottom: var(--space-4);

    color: var(--color-white);

    font-size: var(--text-xxl);

    font-weight: var(--font-bold);

    line-height: var(--leading-5);

    z-index: 2;

    transition: all var(--transition-time);
}

.front-page-iot-fx--description {
    display: block;

    opacity: 0;

    height: 0;

    z-index: 2;
}

.front-page-iot-fx--description p {
    color: var(--color-white);

    font-size: 0;

    line-height: var(--leading-6);

    z-index: 2;
}

.front-page-iot-fx--button-wrapper {
    display: flex;

    flex-direction: row;

    opacity: 0;

    height: 0;

    z-index: 2;

    transition: all var(--transition-time);
}

.front-page-iot-fx--icon-forward {
    display: inline-block;

    margin-left: var(--space-2);

    transition: transform var(--transition-time) ease-in-out;
}

.front-page-iot-fx--button-wrapper .front-page-iot-fx--link {
    display: inline-block;

    color: var(--color-white);

    font-size: var(--text-lg);

    font-weight: var(--font-light);

    line-height: 1;

    text-decoration-color: transparent;
}

.front-page-iot-fx--button-wrapper:hover .front-page-iot-fx--icon-forward {
    transform: translateX(8px);
}

.front-page-iot-fx--button-wrapper .front-page-iot-fx--link:hover {
    color: var(--color-white);

    text-decoration-color: var(--color-white);
}

.front-page-iot-fx--wrapper:after {
    content: "";

    position: absolute;

    top: 0;

    left: 0;

    height: 400px;

    width: 100%;

    border-radius: var(--border-radius);

    background-color: var(--color-secondary);

    opacity: 0;

    z-index: 1;

    transition: all var(--transition-time);
}

.front-page-iot-fx--wrapper:hover:after {
    opacity: 75%;
}

.front-page-iot-fx--wrapper:hover .front-page-iot-fx--description,
.front-page-iot-fx--wrapper:hover .front-page-iot-fx--description p {
    height: auto;

    font-size: var(--text-lg);

    opacity: 1;
}

.front-page-iot-fx--wrapper:hover .front-page-iot-fx--button-wrapper {
    opacity: 1;

    height: auto;
}

.container-front-page--iot .simptom-btn.primary {
    max-width: 33%;

    display: block;

    margin: var(--space-12) auto;

    text-align: center;
}
@media only screen and (max-width: 1600px) {
    .front-page-iot--tittle {
        font-size: var(--text-2xl);
    }
}
@media only screen and (max-width: 1024px) {
    .section-front-page--iot {
        padding: var(--space-16) var(--space-4) var(--space-32) var(--space-4);
    }

    .front-page-iot--column.iot-column__last {
        grid-template-columns: repeat(2, 1fr);
    }

    .front-page-iot-fx--wrapper {
        padding: var(--space-5) var(--space-8);
    }

    .front-page-iot-fx--wrapper,
    .front-page-iot-fx--wrapper:after {
        height: 240px;
    }

    .front-page-iot--sub-tittle {
        font-size: var(--text-xl);
    }

}

@media only screen and (max-width: 768px) {
    .front-page-iot-fx--title {
        font-size: var(--text-xl);
    }

    .front-page-iot-fx--title {
        font-size: var(--text-lg);
    }

    .front-page-iot-fx--description {
        display: none;
    }
    .front-page-iot--column.iot-column__last {
        grid-template-columns: 1fr;
    }
    .container-front-page--iot .simptom-btn.primary {
        max-width: 100%;
    }
}

@media only screen and (max-width: 450px) {
    .section-front-page--iot {
        padding: var(--space-16) var(--space-4) var(--space-48) var(--space-4);
    }

    .front-page-iot-fx--wrapper {
        height: 240px;

        padding: var(--space-5) var(--space-4) var(--space-5) var(--space-4);
    }

    .front-page-iot-fx--title {
        font-size: var(--text-base);
    }
}

/*--------------------------------------------------------------

Front page numbers

--------------------------------------------------------------*/

.section-front-page--numbers {
    position: relative;

    max-width: 1180px;

    display: block;

    margin: -130px auto 0 auto;

    padding: var(--space-14) var(--space-4);

    border-radius: var(--space-4);

    background-color: var(--color-background);

    background-image: url("/wp-content/uploads/2023/11/bacground-numbers.jpg");

    background-repeat: no-repeat;

    background-size: cover;

    background-position: center center;

    box-shadow: 0 3px 6px #00000029;

    z-index: 3;
}

.container-front-page--numbers {
    display: flex;

    flex-direction: row;

    align-items: center;

    justify-content: center;
}

.column-front-page-numbers {
    display: flex;

    flex-direction:row;
    flex-wrap: wrap;

    align-items: center;

    justify-content: center;

    gap: var(--space-2);

    padding: var(--space-4) var(--space-14);

    border-right: 1px solid var(--color-white);
}

.column-front-page-numbers:last-child {
    border-right: none;
}

.front-page-numbers--number {
    flex: 0 0 fit-content;
    display: block;

    color: var(--color-white);

    font-family: var(--heading-font);

    font-size: var(--text-3xl);

    font-weight: var(--font-bold);

    line-height: var(--leading-5);
}

.front-page-numbers--number-suffixe {
    flex: 0 0 fit-content;
    color: var(--color-white);

    font-size: var(--text-3xl);

    font-weight: var(--font-bold);

    line-height: var(--leading-5);
}


.front-page-numbers--title {
    flex: 0 0 100%;
    display: block;

    color: var(--color-white);

    font-size: var(--text-base);

    font-weight: var(--font-normal);

    line-height: var(--leading-5);

    text-align: center;
}
@media screen and (max-width:1360px) {
    .section-front-page--numbers{
        margin: -130px auto 0 auto;
        width: 90%;
    }
    .column-front-page-numbers{
         padding: var(--space-4);

    }
}


@media only screen and (max-width: 1024px) {
    .section-front-page--numbers {
        margin: -84px var(--space-4) 0 var(--space-4);

        padding: var(--space-10) var(--space-4);
    }

    .column-front-page-numbers {
        padding: var(--space-4) var(--space-8);
    }

    .front-page-numbers--number,
    .front-page-numbers--number:after {
        font-size: var(--text-2xl);
    }
}

@media only screen and (max-width: 768px) {
    .section-front-page--numbers {
        padding: var(--space-6) var(--space-2);
    }

    .container-front-page--numbers {
        display: grid;

        grid-template-columns: repeat(2, 1fr);

        align-items: baseline;

        justify-content: center;
    }

    .column-front-page-numbers:nth-of-type(2) {
        border-right: none;
    }
}

@media only screen and (max-width: 450px) {
    .section-front-page--numbers {
        margin: -124px var(--space-4) 0 var(--space-4);
    }
}

/*--------------------------------------------------------------

Front page - Technical equipment

--------------------------------------------------------------*/

.section-front-page--technical-equipment {
    display: block;

    margin: -100px auto 0 auto;

    padding: var(--space-52) var(--space-4) var(--space-32) var(--space-4);

    background-color: var(--color-background);
}

.container-front-page--technical-equipment {
    max-width: var(--container-2xl);

    display: flex;

    flex-direction: row;

    align-items: flex-start;

    justify-content: space-between;

    gap: var(--space-8);

    margin: 0 auto;
}

.column-front-page-technical-equipment {
    max-width: 50%;

    display: flex;

    flex-direction: column;

    align-items: flex-start;

    justify-content: flex-start;
}

.column-front-page-technical-equipment.desktop-hover img {
    transition: all ease-in 350ms;
}

.front-page-technical-equipment--section-tittle {
    display: block;

    margin-bottom: var(--space-4);

    color: var(--color-secondary);

    font-size: var(--text-xxl);

    font-weight: var(--font-bold);

    line-height: var(--leading-5);
}

.front-page-technical-equipment--tittle {
    max-width: 550px;

    display: block;

    margin-bottom: var(--space-5);

    color: var(--color-primary);

    font-size: var(--text-3xl);

    font-weight: var(--font-bold);

    line-height: var(--leading-5);
}

.front-page-technical-equipment--description {
    display: block;

    margin-bottom: var(--space-7);
}

.section-front-page--technical-equipment .simptom-divider {
    display: block;

    margin: var(--space-2) 0 var(--space-7) 0;
}

.front-page-technical-equipment--description > * {
    max-width: 540px;

    display: block;

    margin-bottom: var(--space-4);

    font-size: var(--text-base);

    line-height: var(--leading-8);
}

.front-page-technical-equipment--services {
    margin: 0 0 var(--space-6) 0;

    padding: 0;

    columns: 2;

    list-style: none;
}

.front-page-technical-equipment--service a {
    max-width: 300px;

    display: flex;
    align-items: center;

    margin-bottom: var(--space-4);

    padding: var(--space-5) var(--space-4) var(--space-5) var(--space-4);

    color: var(--color-text);

    font-size: var(--text-xl);

    font-weight: var(--font-body);

    line-height: 1;

    break-inside: avoid-column;

    text-decoration: none;
}

.front-page-technical-equipment--service a:before {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-right: var(--space-3);
    margin-bottom: 3px;
    background: var(--color-secondary);
}

/* .front-page-technical-equipment--service a:hover,

.front-page-technical-equipment--service a.active {

    background-color: var(--color-white);

} */


.front-page-technical-equipment--service.active a {
 /*   background-color: var(--color-secondary) !important;*/

    color: var(--color-secondary) !important;

    transform: translateX(0px);
	font-weight: var(--font-semibold);
}

.front-page-technical-equipment--service a::before {
    transition: all ease-in 250ms;
}

.front-page-technical-equipment--service a:hover:before,
.front-page-technical-equipment--service.active a::before {
    content: " ";
    background-color: var(--color-secondary);
}

.front-page-technical-equipment--divider {
    height: 1px;

    width: 100%;

    max-width: 620px;

    display: block;

    margin-bottom: var(--space-10);

    background-color: #707070;

    opacity: 20%;
}

.section-front-page--technical-equipment .front-page-technical-equipment--link {
    width: 100%;

    max-width: 620px;

    display: inline-block;

    padding: 1.3rem var(--space-10);

    border-radius: var(--border-radius);

    color: var(--color-white);

    background-color: var(--color-secondary);

    font-size: var(--text-base);

    font-weight: var(--font-normal);

    line-height: 1;

    text-decoration-color: transparent;

    text-align: center;

    transition: all var(--transition-time);
}

.front-page-technical-equipment--link:hover {
    background-color: var(--color-primary);

    color: var(--color-white);
}

.front-page-technical-equipment--thumbnail {
    display: block;

    margin-top: var(--space-14);
}
@media only screen and (max-width: 1600px) {
    .container-front-page--technical-equipment{
        width: 90%;
    }
}

@media only screen and (max-width: 1360px) {
.front-page-technical-equipment--tittle{
    font-size: var(--text-2xl);
}


}
@media only screen and (max-width: 1024px) {
    .section-front-page--technical-equipment {
        margin: -84px 0 var(--space-16) 0;

        padding: var(--space-40) 0 var(--space-16) 0;
    }

    .container-front-page--technical-equipment {
        flex-direction: column;

        gap: var(--space-6);

        padding: 0 var(--space-4);
    }

    .column-front-page-technical-equipment {
        max-width: unset;
        width: 100%;
    }

    .front-page-technical-equipment--section-tittle {
        font-size: var(--text-xl);
    }

    .front-page-technical-equipment--tittle {
        font-size: var(--text-2xl);
    }

    .front-page-technical-equipment--thumbnail {
        width: 100%;
        max-height: 480px;
        object-fit: cover;
        margin: 0 0 var(--space-8) 0;
    }
    .front-page-technical-equipment--services{
        width: 100%;
        column-count: unset;
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .section-front-page--technical-equipment .front-page-technical-equipment--link{
        max-width: unset;
    }
}
/* *{
    outline: 1px solid red;
} */
@media only screen and (max-width: 768px) {
    .section-front-page--technical-equipment {
        margin: -84px 0 var(--space-10) 0;

        padding: var(--space-40) 0 var(--space-10) 0;
    }

    .container-front-page--technical-equipment {
        align-items: flex-start;

        justify-content: flex-start;
    }

    .front-page-technical-equipment--services {
        display: grid;

        grid-template-columns: repeat(2, 1fr);

        columns: unset;
    }

    .front-page-technical-equipment--thumbnail {
        max-width: 350px;
        width: 100%;
    }
    .front-page-technical-equipment--services{
        column-gap: 16px;
    }

    .front-page-technical-equipment--service a {
        max-width: 100%;

        display: inline-flex;

        padding: var(--space-2) var(--space-2) var(--space-2) var(--space-2);

        font-size: var(--text-base);

        line-height: var(--leading-6);
    }
}

/*--------------------------------------------------------------

Front page Vis manage

--------------------------------------------------------------*/

.section-front-page--vis-manage {
    display: block;
    margin: 0 auto;
    padding: var(--space-28) var(--space-4);

}

.container-front-page--vis-manage {
    max-width: var(--container-2xl);

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    margin: 0 auto;
}


/* * * Animation * * */
.container-front-page--vis-manage:hover img {
    opacity: 1;
    -webkit-animation: flash 1.5s;
    animation: flash 1.5s;
}
@-webkit-keyframes flash {
    0% {
        opacity: 0.4;
    }
    100% {
        opacity: 1;
    }
}
@keyframes flash {
    0% {
        opacity: 0.4;
    }
    100% {
        opacity: 1;
    }
}


.container-front-page--vis-manage h2 {
    color: var(--color-secondary);
    font-size: var(--text-xxl);
    line-height: var(--leading-5);

    margin-bottom: var(--space-2);

    text-align: center;
}

.container-front-page--vis-manage h3 {
    max-width: 560px;
    font-size: var(--text-2xl);
    line-height: var(--leading-5);
    font-weight: var(--font-bold);
text-align: center;
    color: var(--color-primary);

    padding-block: var(--space-4);
}
.vis-manage-images-wrapper {
    overflow: hidden;
}
.vis-manage-images-wrapper img {
    display: block;
    animation: kenburns 15s ease alternate forwards;
}

/*Ken Burns*/
@keyframes kenburns {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(1.15);
    }
}
.container-front-page--vis-manage .vis-manage-description p {
    text-align: center;

    margin-bottom: var(--space-8);

    color: var(--color-text);

    font-size: var(--text-base);

    line-height: var(--leading-8);
}

.container-front-page--vis-manage .simptom-btn {
    padding-inline: var(--space-24);
}

.container-vis-manage-wrapper {
    margin-top: 70px;
}

.container-vis-manage-wrapper {
    display: flex;

    gap: var(--space-12);
}

.container-vis-manage-wrapper .vis-manage-images-wrapper,
.container-vis-manage-wrapper .vis-manage-description-wrapper {
    flex: 1 50%;
}

.container-vis-manage-wrapper .vis-manage-description-wrapper p {
    text-align: left;

    padding-right: 36px;
}

@media screen and (max-width: 1024px) {
    .container-vis-manage-wrapper {
        flex-direction: column;
    }
}

.vis-manage-description ul {
    column-count: 2;
    margin: 0;
	padding-top: 20px;
}

.vis-manage-description ul li {
    display: flex;

    align-items: center;

    gap: 8px;

    list-style: none;

    margin-bottom: 5px;
}

/* .vis-manage-description ul li a::before {
    content: "";

    display: inline-block;

    width: 20px;

    height: 20px;

    margin-right: var(--space-3);

    margin-bottom: -2px;

    background: url(/wp-content/themes/simptom-wp-theme/assets/img/icon-check-circle.png) no-repeat;

    transition: all ease-in 250ms;
} */

.vis-manage-description ul li a {
    display: block;
    padding: var(--space-4) var(--space-2) var(--space-4) var(--space-2);

    color: var(--color-text);

    font-size: var(--text-lg);

    font-weight: var(--font-body);

    line-height: 1;

    text-decoration: none;

    /* transition: all ease-in 250ms; */
}

.vis-manage-description ul li:hover {
 /*   background-color: var(--color-secondary) !important; */

    color: var(--color-secondary) !important;
	font-weight: var(--font-semibold);

}
.vis-manage-description ul li:hover a{
    color: var(--color-secondary) !important;
}
.vis-manage-description ul li::before{
    left: 4px !important;
    transition: all ease-in 250ms;
}
.vis-manage-description ul li:hover::before{
    left: 6px !important;
    background-color: var(--color-secondary);
}
/* .vis-manage-description ul li a:hover::before {
    transform: translateX(4px);

    background-image: url(/wp-content/uploads/2024/04/Icon-awesome-check-circle.svg);
} */
@media screen and (max-width: 1600px) {
.section-front-page--vis-manage {
    width: 90%;
}
}

@media screen and (max-width: 1480px) {
    .vis-manage-description ul{
        column-count: 1;
        column-count: unset;
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .vis-manage-description ul li a{
        padding: var(--space-2) var(--space-1) var(--space-2) var(--space-1);
    }
}

@media screen and (max-width: 767px) {
    .container-front-page--vis-manage h2 {
        font-size: var(--text-xxl);
    }

    .container-front-page--vis-manage h3 {
        font-size: var(--text-lg);
    }

    .container-front-page--vis-manage .vis-manage-description p {
        font-size: var(--text-base);
    }

    .container-front-page--vis-manage .simptom-btn {
        padding-inline: var(--space-12);
    }
}

.front-page-vis-manage--thumbnail {
    display: block;

    margin: 0 auto var(--space-10) auto;
}

h4.front-page-vis-manage--description {
    max-width: 1012px;

    display: block;

    color: var(--color-primary);

    font-family: var(--heading-font);

    font-size: var(--text-3xl);

    font-weight: var(--font-bold);

    line-height: var(--leading-6);

    text-align: center;
}

@media only screen and (max-width: 1024px) {
    .section-front-page--vis-manage {
        margin: var(--space-16) auto;
    }

    h4.front-page-vis-manage--description {
        font-size: var(--text-2xl);
    }
}

@media only screen and (max-width: 768px) {
    .section-front-page--vis-manage {
        margin: var(--space-16) auto;
    }

    h4.front-page-vis-manage--description {
        font-size: var(--text-xxl);
    }
    .vis-manage-description ul {
        column-count: 1;
    }

}

.vis-manage-description-wrapper .simptom-btn.primary {
    display: inline-block;

    margin-top: 36px;
}

/*--------------------------------------------------------------

Front page CTA Banner

--------------------------------------------------------------*/

.section-front-page--cta-banner {
    display: block;
}

.container-front-page--cta-banner {
    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    margin: 0 auto;

    padding: var(--space-24) var(--space-4);

    color: var(--color-white);
}

.front-page-cta-banner--sub-tittle {
    display: block;

    margin-bottom: var(--space-4);

    color: var(--color-white);

    font-size: var(--text-xl);

    font-weight: var(--font-bold);

    line-height: var(--leading-5);

    text-align: center;
}

.front-page-cta-banner--tittle {
    max-width: var(--container-2xl);

    display: block;

    margin-bottom: var(--space-10);

    color: var(--color-white);

    font-size: var(--text-3xl);

    font-weight: var(--font-bold);

    line-height: var(--leading-5);

    text-align: center;
}

.front-page-cta-banner--button-wrapper {
    display: flex;

    flex-direction: row;

    align-items: center;

    justify-content: center;

    border-radius: var(--border-radius);

    background-color: var(--color-secondary);

    transition: all var(--transition-time);
}

.front-page-cta-banner--button-wrapper .front-page-cta-banner--link {
    display: inline-block;

    padding: var(--space-5) var(--space-24);

    color: var(--color-white);

    font-size: var(--text-base);

    font-weight: var(--font-bold);

    line-height: 1;

    text-decoration-color: transparent;
}

.front-page-cta-banner--button-wrapper:hover {
    background-color: var(--color-primary);
}

a.front-page-cta-banner--link:after {
    content: url("/wp-content/uploads/2023/11/arrow-forward.svg");

    position: relative;

    top: 2px;

    height: 20px;

    width: 20px;

    display: inline-block;

    margin-left: var(--space-4);

    transition: transform var(--transition-time) ease-in-out;
}

.front-page-cta-banner--button-wrapper:hover a.front-page-cta-banner--link:after {
    transform: translateX(8px);
}

@media only screen and (max-width: 1024px) {
    .section-front-page--cta-banner {
        margin: var(--space-16) auto;
    }

    .container-front-page--cta-banner {
        padding: var(--space-16) var(--space-4);
    }

    .front-page-cta-banner--sub-tittle {
        font-size: var(--text-lg);
    }

    .front-page-cta-banner--tittle {
        font-size: var(--text-2xl);
    }

}

@media only screen and (max-width: 450px) {

    .front-page-cta-banner--tittle{
        font-size: var(--text-xxl);
    }
    .front-page-cta-banner--button-wrapper .front-page-cta-banner--link{
        padding: var(--space-3) var(--space-6);
    }
}

/*--------------------------------------------------------------

Front page Vehicle tracking

--------------------------------------------------------------*/

.section-front-page--vehicle-tracking {
    display: block;
    margin: 0 auto;
    padding: var(--space-32)  var(--space-4);
}

.container-front-page--vehicle-tracking {
    max-width: 1180px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    margin: 0 auto;
}

.front-page-vehicle-tracking--column {
    display: block;
}

.front-page-vehicle-tracking--sub-tittle {
    display: block;

    margin-bottom: var(--space-4);

    color: var(--color-secondary);

    font-size: var(--text-xxl);

    font-weight: var(--font-bold);

    line-height: var(--leading-5);

    text-align: center;

    text-transform: uppercase;
}

.front-page-vehicle-tracking--tittle {
    display: block;

    margin-bottom: var(--space-8);

    color: var(--color-primary);

    font-size: var(--text-3xl);

    font-weight: var(--font-bold);

    line-height: var(--leading-5);

    text-align: center;
}

.section-front-page--vehicle-tracking .simptom-divider {
    display: block;

    margin: 0 auto var(--space-16) auto;
}

.front-page-vehicle-tracking--description > * {
    display: block;

    margin-bottom: var(--space-20);

    color: var(--color-text);

    font-size: var(--text-normal);

    line-height: var(--leading-8);

    text-align: center;
}

.vehicle-tracking-column__last .front-page-vehicle-tracking--description > * {
    margin-bottom: var(--space-8);

    font-weight: var(--font-bold);
}

.front-page-vehicle-tracking--button-wrapper {
    max-width: 240px;

    display: flex;

    flex-direction: row;

    align-items: center;

    justify-content: center;

    margin: 0 auto;

    border-radius: var(--border-radius);

    background-color: var(--color-secondary);

    color: var(--color-white);

    transition: all var(--transition-time);
}

a.front-page-vehicle-tracking--link {
    display: inline-block;

    padding: 1.3rem var(--space-6);

    color: var(--color-white);

    font-size: var(--text-base);

    font-weight: var(--font-normal);

    line-height: 1;

    text-decoration-color: transparent;
}

.front-page-vehicle-tracking--button-wrapper:hover {
    background-color: var(--color-primary);
}

.vehicle-tracking-column__middle {
    display: block;

    margin-bottom: var(--space-16);
}

.front-page-vehicle-tracking--tabs {
    display: flex;

    flex-direction: row;

    align-items: center;

    justify-content: center;

    margin-bottom: var(--space-12);

    padding: 0;

    list-style: none;
}

.front-page-vehicle-tracking--tabs__tab {
    display: inline-block;

    margin: 0 var(--space-4);

    padding: var(--space-4) var(--space-8);

    border-radius: var(--border-radius);

    background-color: var(--color-background);

    color: #666;

    font-size: var(--text-lg);

    font-weight: var(--font-normal);

    line-height: 1;

    text-decoration-color: transparent;

    transition: all var(--transition-time);

    cursor: pointer;
}

.front-page-vehicle-tracking--tabs__tab:hover {
    background-color: var(--color-primary);

    color: var(--color-white);
}

.front-page-vehicle-tracking--tabs__tab:active,
.front-page-vehicle-tracking--tabs__tab.active {
    background-color: var(--color-secondary);

    color: var(--color-white);
}

/***************/

.front-page-vehicle-tracking--services {
    display: flex;

    flex-direction: row;

    align-items: flex-start;

    justify-content: flex-start;

    gap: var(--space-9);
}

.front-page-vehicle_tracking-fx--wrapper {
    position: relative;

    width: 365px;

    height: 35vh;

    display: flex;

    flex-direction: column;

    align-items: flex-start;

    justify-content: flex-end;

    padding: var(--space-5) var(--space-8) var(--space-10) var(--space-8);

    border-radius: var(--border-radius);

    text-decoration: none;

    background-size: cover;

    background-position: center;
}

.front-page-vehicle_tracking-fx--wrapper::before {
    content: " ";

    position: absolute;

    top: 0;

    left: 0;

    height: 100%;

    width: 100%;

    background-color: rgba(0, 0, 0, 0.2);
}

.front-page-vehicle_tracking-fx--wrapper .front-page-vehicle_tracking-fx--icon {
    max-height: 60px;

    display: block;

    margin-bottom: var(--space-3);

    z-index: 2;

    transition: all var(--transition-time);
}

.front-page-vehicle_tracking-fx--title {
    display: block;

    margin-bottom: var(--space-4);

    color: var(--color-white);

    font-size: var(--text-xxl);

    font-weight: var(--font-bold);

    line-height: var(--leading-5);

    z-index: 2;

    transition: all var(--transition-time);
}

.front-page-vehicle_tracking-fx--description {
    display: block;

    opacity: 0;

    height: 0;

    z-index: 2;
}

.front-page-vehicle_tracking-fx--description p {
    margin-bottom: 0;

    color: var(--color-white);

    font-size: 0;

    line-height: var(--leading-6);

    z-index: 2;
}

.front-page-vehicle_tracking-fx--wrapper:after {
    content: "";

    position: absolute;

    top: 0;

    left: 0;

    height: 35vh;

    width: 100%;

    border-radius: var(--border-radius);

    background-color: var(--color-secondary);

    opacity: 0;

    z-index: 1;

    transition: all var(--transition-time);
}

.front-page-vehicle_tracking-fx--wrapper:hover:after {
    opacity: 75%;
}

.front-page-vehicle_tracking-fx--wrapper:hover .front-page-vehicle_tracking-fx--description,
.front-page-vehicle_tracking-fx--wrapper:hover .front-page-vehicle_tracking-fx--description p {
    opacity: 1;

    font-size: var(--text-lg);

    height: auto;
}

.front-page-iot-fx--wrapper:hover .front-page-iot-fx--button-wrapper {
    opacity: 1;

    height: auto;
}
@media only screen and (max-width: 1560px) {

.front-page-iot-fx--wrapper{
    /* height: 300px; */
    padding: var(--space-5);
}
}
@media only screen and (max-width: 1024px) {
    .section-front-page--vehicle-tracking {
        margin: var(--space-16) auto;
    }

    .section-front-page--vehicle-tracking .simptom-divider {
        margin: 0 auto var(--space-10) auto;
    }

    .front-page-vehicle-tracking--description > * {
        margin-bottom: var(--space-12);
    }

    .front-page-vehicle-tracking--tabs {
        flex-wrap: wrap;

        justify-content: flex-start;

        gap: var(--space-6);
    }

    .front-page-vehicle-tracking--tabs__tab {
        margin: 0 var(--space-2);
    }

    .front-page-vehicle_tracking-fx--wrapper {
        padding: var(--space-5) var(--space-8);
    }

    .front-page-vehicle_tracking-fx--wrapper,
    .front-page-vehicle_tracking-fx--wrapper:after {
        width: 100%;

        height: 300px;
    }

    .front-page-vehicle-tracking--services {
        display: grid;

        grid-template-columns: repeat(3, 1fr);
    }

    .front-page-vehicle-tracking--sub-tittle {
        font-size: var(--text-xl);
    }

    .front-page-vehicle-tracking--tittle {
        font-size: var(--text-2xl);
    }

    .vehicle-tracking-column__last .front-page-vehicle-tracking--description > * {
        font-size: var(--text-base);
    }
}

@media only screen and (max-width: 768px) {
    .front-page-vehicle-tracking--sub-tittle {
        font-size: var(--text-lg);
    }

    ul.front-page-vehicle-tracking--tabs {
        margin: 0 0 var(--space-10) 0;

        gap: var(--space-4);
    }

    .front-page-vehicle-tracking--tabs__tab {
        padding: var(--space-2) var(--space-4);

        font-size: var(--text-base);
    }

    .front-page-vehicle_tracking-fx--title {
        font-size: var(--text-lg);
    }

    .front-page-vehicle_tracking-fx--description {
        display: none;
    }
    .front-page-vehicle-tracking--services {
        grid-template-columns: 1fr;
    }
}

@media only screen and (max-width: 450px) {
    .front-page-vehicle_tracking-fx--wrapper {
        height: 240px;

        padding: var(--space-5) var(--space-4) var(--space-5) var(--space-4);
    }

    .front-page-vehicle_tracking-fx--wrapper .front-page-vehicle_tracking-fx--icon {
        max-height: 40px;
    }

    .front-page-vehicle_tracking-fx--title {
        font-size: var(--text-base);
    }
}


/*****CTA layout*****/
.page-service--service-cta-layout {
    max-width: 1920px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0 auto;
    padding: var(--space-18) var(--space-4);
    background-color: var(--color-background);
    min-height: 500px;
}

.page-service--service-cta-title {
    display: block;
    margin-bottom: var(--space-4);
    color: var(--color-white);
    text-align: center;
    font-size: var(--text-3xl);
    font-weight: var(--font-bold);
    line-height: var(--leading-8);
}

.page-service--service-cta-content {
    max-width: var(--container-2xl);
    display: block;
    margin: 0 auto var(--space-12) auto;
}

.page-service--service-cta-content p {
    margin-bottom: 0;
}

.page-service--service-cta-content > * {
    color: var(--color-white);
    text-align: center;
    font-size: var(--text-xl);
    font-weight: var(--font-normal);
    line-height: var(--leading-6);
}
.page-service--service-cta-layout.sledenje-page .page-service--service-cta-content > * {
    font-size: var(--text-xxl);
    font-weight: var(--font-normal);
}

.page-service--service-cta-layout.sledenje-page .page-service--service-cta-title:has(:not(#podrocja-page)) {
    width: fit-content;
    margin: var(--space-8) auto;
    font-size: var(--text-3xl);
    line-height: 1em;
    border: 6px solid var(--color-white);
    text-align: center;
    padding: var(--space-4) var(--space-8);
}
.page-service--service-buttons-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 26px;
    flex-wrap: wrap;
}
.page-service--service-cta-button {
    cursor: pointer;
    display: inline-block;
    padding: var(--space-5) var(--space-10);
    border: 1px solid var(--color-secondary);
    border-radius: var(--border-radius);
    background-color: var(--color-secondary);
    color: var(--color-white);
    font-weight: var(--font-normal);
    text-decoration: none;
    line-height: 1;
}
.page-service--service-secound-cta-button {
    padding: var(--space-6) var(--space-14);
    border: 1px solid #666;
    border-radius: var(--border-radius);
    background-color: #666;
    color: var(--color-white);
    font-size: var(--text-lg);
    font-weight: var(--font-bold);
    text-decoration: none;
    line-height: 1;
}
.page-service--service-secound-cta-button:hover {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-white);
}
.page-service--service-cta-button img {
    margin-left: var(--space-1);
    transition: all linear 300ms;
}
.page-service--service-cta-button:hover {
    color: var(--color-white);
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}
.page-service--service-cta-button:hover img {
    transform: translateX(8px);
}

.simptom-banner-form {
    max-width: 1920px;
    margin-inline: auto;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-out;
    background-color: var(--color-background);
}
.cta-form-container{
    max-width: 1080px;
    margin: 0 auto;
    padding-top: var(--space-8);
}
.cta-form-container h2{
    font-size: var(--text-2xl);
    line-height: var(--leading-5);
    margin-bottom: var(--space-5);
    text-align: center;
}


.cta-form-container.center{
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.cta-form-container .simptom-divider{
    margin: 0 auto;
}
.simptom-banner-form:has(.center) .cta-form-container{
    max-width: 560px;
}
.simptom-banner-form  .cf7mls_next{
    float: unset !important;
    margin: 0;
    padding-bottom: var(--space-8);

}
.simptom-banner-form:has(.center) input:not(input[type='checkbox']){
    width: 100%;
}
.simptom-banner-form:has(.center) .cf7mls-btns{
    text-align: center;
}
.simptom-banner-form  .cf7mls-btns .cf7mls_back,
.simptom-banner-form p:empty{
    display: none !important;
}
.simptom-banner-form  p{
    margin-bottom: unset;
}
.simptom-banner-form:has(.center) input[type="submit"]{
    width: 100%;
    padding-block: 16px !important;
}

.simptom-banner-form:has(.center) .wpcf7-response-output{
    max-width: 560px;
    margin: 0 auto  var(--space-8) auto;
}
.button.page-service--service-cta-button:focus{
    color: var(--color-white) !important;
}
.simptom-banner-form:has(.center) h4{
    font-weight: 400;
    text-align: center;
}
@media only screen and (max-width: 1024px) {
    .page-service--service-cta-layout {
        padding: var(--space-12) var(--space-4);
    }

    .page-service--service-cta-title {
        font-size: var(--text-lg);
    }

    .page-service--service-cta-content > * {
        font-size: var(--text-2xl);
    }
}

@media only screen and (max-width: 768px) {
    .page-service--service-cta-content > * {
        font-size: var(--text-xxl);
    }

    .page-service--service-cta-button {
        padding: var(--space-6);
        line-height: var(--leading-6);
        text-align: center;
        font-size: var(--text-base);
    }
}