/* Hero section */
.hero-section {
    position: relative;
    z-index: 2;
    color: #fff;
    top: 0;
    height: 40%;
}


.hero-section h3 {
    position: relative;
    font-size: 64px;
    font-weight: 600;
    margin-bottom: 1rem;
    padding-top: 15%;
    z-index: 3;
}
/* End of hero section */

/* Our services */
.our-services__content h2 {
    font-size: 48px;
    font-weight: 600;
}

.our-services__content p {
    font-size: 18px;
    font-weight: 600;
}

.our-services__content_text {
    width: 70%;
}

.our-services__image {
    position: relative;
}

.our-services__image .services_img {
    width: 100%;
}

.our-services__image .services_selected {
    position: absolute;
    top: 46px;
    left: -150px;
    z-index: 3;
}

.our-services__image .services_selected .services_item {
    background-color: #fff;
    color: var(--bs-purple);
    font-size: 20px;
    width: 393px;
    height: 90px;
    transition: all 0.3s ease;
}

.our-services__image .services_selected .services_item.selected {
    background-color: var(--bs-purple);
    color: #fff;
    width: 471.6px;
    height: 108px;
}
/* End of our services */

.purple-shadow-box {
    box-shadow: 10px 9px 0px 0px #4000A6;
}

/* reviews cards */

.review-card-item.image {
    position: relative;
    overflow: hidden;
}

.review-card-item.image h2 {
    position: absolute;
    top: 0;
    left: 0;
    padding: 20px;
    color: white;
    font-size: 48;
    font-weight: 600;
    z-index: 3;
}

.reviews-wrapper {
    gap: 40px;
}

.review-card-item {
    width: 457px;
    height: 654px;
}

.review_item__quote {
    border-left: 5px solid var(--bs-purple);
    font-size: 20px;
}

.usecases h1 {
    font-weight: 600;
}

.usecases-wrapper {
    display: grid;
    grid-template-columns: repeat(5, 1fr); 
    gap: 20px;
}


.usecase_item {
    flex: 1; 
    min-width: 0; 
    height: 300px;
    box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.1);
}

.usecase_item .image {
    position: relative;
}

.usecase_item img {
    width: 100%;
}

.usecase_item .title {
    text-align: center;
    color: var(--bs-purple);
    font-size: 16px;
    font-weight: 600;
    height: 35%;
}

/* examples section */

.examples_img {
    position: relative;
    padding: 0;
    overflow: hidden;
}

.top-text {
    font-size: 20px;
}

.line {
    border-bottom: 1px solid var(--bs-purple);
}

.arrow {
  width: 50px;
  height: 10px;
  background: #4000a6; /* Tail */
  position: relative;
}

.arrow::after {
  content: "";
  position: absolute;
  right: -20px;
  top: -10px;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
  border-left: 20px solid #4000a6; /* Arrow head */
}

.external-reviews__item {
    width: 407px;
    height: 309px;
    box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.1);
}

.external-reviews .container {
    position: relative;
}

.note {
    color: #fff;
    font-size: 32px;
    font-weight: 600;
    text-align: center;
    position: absolute;
    left: 0;
    bottom: -280px;
    z-index: 3;
}

.external-reviews_wrapper {
    margin-bottom: 200px;
}

@media (max-width: 1399px) {
    .our-services__image .services_selected .services_item {
        width: 100% !important;
        height: 69px !important;
        font-size: 18px !important;
    }

    /* .our-services__image .services_selected .services_item.selected {
        width: 414.6px !important;
        height: 85px !important;
    } */
}

@media (max-width: 1199px) {
    .our-services__wrapper {
        flex-direction: column-reverse;
        align-items: center;
    }

    .our-services__image {
        width: 600px;
        margin-bottom: 50px;
    }

    .our-services__image .services_selected {
        top: 336px;
        left: 0;
        width: 100%;
    }

    .our-services__content {
        padding: 0;
    }

    .our-services__content_text {
        width: 100%;
    }

    .our-services__content h2 {
        font-size: 43px;
    }

    .reviews-wrapper {
        flex-direction: column !important;
        align-items: center;
    }

    .review-card-item.image {
        width: auto;
    }

    .review-card-item {
        width: 100%;
    }

    .examples_responsive {
        flex-direction: column;
    }

    .examples_img {
        width: 100%;
    }

    .examples_img img {
        width: 100%;
    }

    .examples_responsive-text {
        width: 100%;
    }

    .note {
        font-size: 20px;
    }

    .external-reviews__item .average p,
    .linkedin_note p {
        font-size: 16px !important;
    }
}

@media (max-width: 991px) {
    .usecases-wrapper {
        flex-direction: column;
    }

    .usecases-wrapper .title {
        padding: 50px 0;
    } 

    .our-services__content {
        width: 100%;
    }

    .external-reviews_wrapper {
        flex-direction: column;
        align-items: center;
    }

    .icons_responsive {
        width: 100%;
    }

    .external-reviews__item.linkedin svg {
        width: 65px;
    }
}   

@media (max-width: 767px) {
    .our-services__image .services_selected {
        top: 275px;
    }

    .external-reviews_wrapper .title {
        width: 100% !important;
    }

    .external-reviews__item {
        width: 100%;
    } 

    .icons_responsive {
        flex-direction: column;
    }
}

@media (max-width: 461px) {
    .hero-section h1 {
        font-size: 30px;
    }

    .hero-section h3 {
        font-size: 38px;
        padding-top: 36%
    }

    .note {
        font-size: 16px;
    }

    .before-after-responsive {
        flex-direction: column;
        align-items: center;
        gap: 50px;
    }

    .before,
    .after {
        width: 100%;
    }
}

@media (max-width: 481px) {
    .review-card-item.image {
        width: 100%;
    }
}