.elementor-widget-map-services {

    & .elementor-widget-container {

        & .container-boxed {
            padding-top: 90px;
            padding-bottom: 90px;

            & .first-row {
                margin-bottom: 100px;

                /*& .vertical-text-element {*/
                /*    margin-right: 14vw;*/
                /*}*/

                & .intro-content {
                    width: clamp(300px, 30vw, 500px);
                    margin-left: auto;

                    & .description p {
                        color: var(--Neutral-32);
                        
                        &:last-child {
                            margin-bottom: 0;
                        }
                    }

                }

                & .link-column {
                    margin-left: auto;
                    gap: 18px;
                }
            }

            & .first-row.horizontal-block {

                & .horizontal-left-column {
                    width: 65%;

                    & .intro-content {
                        margin-top: 48px;
                        width: 100%;

                        & .h3 {
                            margin-bottom: 8px;
                        }
                    }
                }
            }

            & .second-row {
                grid-template-columns: 1fr 1fr 1fr;

                &.has-bg-img {
                    padding-bottom: 132px;
                }

                & a.map-service.box {
                    background-color: var(--Neutral-Black);
                    border-radius: var(--map-rd-corner);
                    display: flex;
                    flex-direction: column;
                    gap: 80px;
                    justify-content: space-between;

                    h3, p {
                        transition: color var(--btn-transition-duration) var(--btn-transition-easing);
                    }

                    & img.arrow-icon {
                        /* animation setup */
                        transform: rotate(0deg);
                        transform-origin: center;
                        transition: transform var(--btn-transition-duration) var(--btn-transition-easing);
                        width: 80px;
                        height: 80px;
                    }

                    &:hover {

                        h3, p {
                            color: var(--Neutral-White);
                        }

                        & img.arrow-icon {
                            transform: rotate(45deg);
                        }
                    }

                    & .project-tags {
                        display: flex;
                        gap: 10px;
                        flex-wrap: wrap-reverse;
                        margin-top: auto;

                        div {
                            border: 1px solid var(--Neutral-32);
                            padding: 4px 12px;
                            border-radius: 30px;
                        }
                    }
                }
            }
        }

        @media screen and (max-width: 1024px) {
            & .container-boxed {
                display: flex;
                flex-direction: column;

                & .first-row {
                    flex-direction: column;

                    & .vertical-text-element {
                        margin-right: 0;
                        display: flex;
                        justify-content: end;
                    }

                    &.horizontal-block .horizontal-left-column {
                        width: 100%;
                    }

                    & .intro-content {
                        width: 100%;
                        max-width: 700px;
                        margin-top: 0 !important;
                        padding: 20px 0 48px;
                    }

                    & .link-column {
                        margin-left: unset;

                        & a {
                            width: 100%;
                            max-width: 350px;
                            margin-left: auto;
                            margin-right: auto;
                        }
                    }
                }

                & .second-row {
                    grid-template-columns: 1fr;

                    & a.map-service.box {
                        gap: 60px;

                        & img.arrow-icon {
                            width: 60px;
                            height: 60px;
                        }
                    }
                }

            }
        }
    }
}