@font-face {
    font-family: 'DMSans Thin';
    font-weight: 100;
    src: url('../fonts/DMSans/DMSans-Thin.woff2') format('woff2');
}

@font-face {
    font-family: 'DMSans ExtraLight';
    font-weight: 200;
    src: url('../fonts/DMSans/DMSans-ExtraLight.woff2') format('woff2');
}

@font-face {
    font-family: 'DMSans Light';
    font-weight: 300;
    src: url('../fonts/DMSans/DMSans-Light.woff2') format('woff2');
}

@font-face {
    font-family: 'DMSans';
    font-weight: 400;
    src: url('../fonts/DMSans/DMSans-Regular.woff2') format('woff2');
}

@font-face {
    font-family: 'DMSans Medium';
    font-weight: 500;
    src: url('../fonts/DMSans/DMSans-Medium.woff2') format('woff2');
}

@font-face {
    font-family: 'DMSans SemiBold';
    font-weight: 600;
    src: url('../fonts/DMSans/DMSans-SemiBold.woff2') format('woff2');
}

@font-face {
    font-family: 'DMSans Bold';
    font-weight: 700;
    src: url('../fonts/DMSans/DMSans-Bold.woff2') format('woff2');
}

@font-face {
    font-family: 'DMSans ExtraBold';
    font-weight: 800;
    src: url('../fonts/DMSans/DMSans-ExtraBold.woff2') format('woff2');
}

@font-face {
    font-family: 'DMSans Black';
    font-weight: 900;
    src: url('../fonts/DMSans/DMSans-Black.woff2') format('woff2');
}

@font-face {
    font-family: 'HelveticaNeue Thin';
    font-weight: 100;
    src: url('../fonts/Helvetica/HelveticaNeue-Thin.woff2') format('woff2');
}

@font-face {
    font-family: 'HelveticaNeue Light';
    font-weight: 300;
    src: url('../fonts/Helvetica/HelveticaNeue-Light.woff2') format('woff2');
}

@font-face {
    font-family: 'HelveticaNeue';
    font-weight: 400;
    src: url('../fonts/Helvetica/HelveticaNeue-Roman.woff2') format('woff2');
}

@font-face {
    font-family: 'HelveticaNeue Medium';
    font-weight: 500;
    src: url('../fonts/Helvetica/HelveticaNeue-Medium.woff2') format('woff2');
}

@font-face {
    font-family: 'HelveticaNeue Bold';
    font-weight: 700;
    src: url('../fonts/Helvetica/HelveticaNeue-Bold.woff2') format('woff2');
}


:root {
    --proweb-white: #FFFFFF;
    --proweb-black: #141414;
    --proweb-gray: #F7F7F7;
    --proweb-orange: #FF590B;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    overflow-x: hidden !important;
}

body {
    font: 400 16px/24px 'DMSans', sans-serif;
    background: var(--proweb-white);
    overflow-x: hidden !important;
}

main {
    /* min-height: calc(100vh - 78px); */
    min-height: 400px;
}

/* Utils */
img,
svg,
video,
iframe {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.container_custom {
    padding-left: 32px;
    padding-right: 32px;
}

.swiper {
    width: 100%;
    height: 100%;
}

.fix-class {
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

.horizontal_rule {
    height: 1px;
    width: 100%;
    background: var(--proweb-black);
}

.arrow_animation {
    width: 24px;
    height: 24px;
    margin-left: 0px;
    transform: rotate(-45deg);
    overflow: hidden;
}

.arrow_animation .picture {
    width: 24px;
    height: 24px;
    position: relative;
    transition: 0.3s;
    transform: translateX(-100%);
}

.arrow_animation .picture img {
    display: block;
    width: 24px;
    height: 24px;
    object-fit: cover;
}

.arrow_animation .picture::before {
    content: "";
    position: absolute;
    top: 0;
    left: 100%;
    width: 24px;
    height: 24px;
    background-image: url(../images/svg/arrow_Right.svg);
    background-size: cover;
    background-position: center;
}

.arrow_animation.light .picture::before {
    background-image: url(../images/svg/arrow_Right_Light.svg);
}

.arrow_animation.dark .picture::before {
    background-image: url(../images/svg/arrow_Right_Dark.svg);
}

.mainpage_heading_row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 60px;
    margin-bottom: 50px;
}

@media (max-height: 800px) {
    .mainpage_heading_row {
        margin-bottom: 30px !important;
    }
}

.mainpage_heading_row .mainpage_heading_col:first-child {
    width: 57% !important;
}

.mainpage_heading_row .mainpage_heading_col:last-child {
    width: calc(43% - 60px);
}

.mainpage_heading_row .mainpage_heading_col .mainpage_heading_description {
    color: var(--proweb-black);
    font: 300 32px/42px "DMSans Light", sans-serif;
    text-align: left;
}

.mainpage_heading_row .mainpage_heading_col .mainpage_heading_description span {
    font: 400 32px/42px "DMSans", sans-serif;
}

.mainpage_heading_row .mainpage_heading_col .mainpage_heading_title {
    color: var(--proweb-black);
    font: 400 60px/78px "DMSans", sans-serif;
    text-align: left;
}

.mainpage_heading_row .mainpage_heading_col .mainpage_heading_link {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.mainpage_heading_row .mainpage_heading_col .mainpage_heading_link a {
    background: var(--proweb-black);
    border-radius: 40px;
    overflow: hidden;
}

.mainpage_heading_row .mainpage_heading_col .mainpage_heading_link a:hover .text {
    transform: translateY(-100%);
}

.mainpage_heading_row .mainpage_heading_col .mainpage_heading_link a .text {
    color: var(--proweb-white);
    font: 400 24px/24px "HelveticaNeue", sans-serif;
    text-align: center;
    padding: 16px 32px;
    position: relative;
    transition: 0.3s;
}

.mainpage_heading_row .mainpage_heading_col .mainpage_heading_link a .text::after {
    content: attr(data-value);
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 100%;
    color: var(--proweb-white);
    font: 400 24px/24px "HelveticaNeue", sans-serif;
    text-align: center;
    padding: 16px 32px;
}

.mainpage_heading_row.ask_question {
    align-items: center;
}

.mainpage_heading_row.ask_question .mainpage_heading_col .mainpage_heading_description2 {
    color: #000000;
    font: 300 24px/31px "DMSans Light", sans-serif;
    text-align: left;
    margin: 0 0 20px 0;
}

.mainpage_heading_row.ask_question .mainpage_heading_col .mainpage_heading_link {
    justify-content: flex-start;
}

.mainpage_heading_row.ask_question .mainpage_heading_col .mainpage_heading_link a .text::after {
    content: attr(data-value);
}

.second_heading_row {
    margin-top: 30px;
    margin-bottom: 58px;
}

.second_heading_row .second_heading_col .second_heading_title {
    color: var(--proweb-black);
    font: 400 120px/120px "HelveticaNeue", sans-serif;
    text-align: left;
    margin: 0 0 58px 0;
}

.second_heading_row .second_heading_col .second_heading_title span {
    font: italic 200 120px/120px "HelveticaNeue Thin", sans-serif;
}

.main_heading_row {
    width: 704px;
    margin: 50px auto 80px;
}

.main_heading_row .main_heading_title {
    color: var(--proweb-black);
    font: 500 80px/80px "HelveticaNeue Medium", sans-serif;
    text-align: center;
    margin: 0 0 20px 0;
}

.main_heading_row .main_heading_title span {
    color: var(--proweb-orange);
    font: italic 100 80px/80px "HelveticaNeue Thin", sans-serif;
}

.main_heading_row .main_heading_description {
    color: var(--proweb-black);
    font: 300 24px/31px "DMSans Light", sans-serif;
    text-align: center;
}

.main_heading_row .main_heading_link {
    margin: 32px 0 0 0;
    display: flex;
    justify-content: center;
}

.main_heading_row .main_heading_link a {
    padding: 15px 21px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border: 1px solid var(--proweb-black);
    border-radius: 40px;
}

.main_heading_row .main_heading_link a .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 24px/24px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

.main_heading_row .main_heading_link a:hover .arrow_animation .picture {
    transform: translateX(0);
}


/* Utils */



/* Back to Top Button */
.backToTopButton {
    position: fixed;
    z-index: 9;
    bottom: 0;
    right: 44px;
    background: var(--proweb-orange);
    box-shadow: 0px 4px 4px 0px rgba(83, 63, 7, 0.25);
    border-radius: 50%;
    width: 70px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s;
    opacity: 0;
    pointer-events: none;
    cursor: pointer;
    overflow: hidden;
}

.backToTopButton .pic {
    width: 100%;
    height: 100%;
    position: relative;
    transition: 0.3s;
}

.backToTopButton .pic::before {
    content: "";
    position: absolute;
    z-index: 999;
    top: 100%;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(../images/svg/arrowUp.svg);
    background-size: cover;
    background-position: center;
}

.backToTopButton:hover .pic {
    transform: translateY(-100%);
}

.backToTopButton:hover {
    box-shadow: 0px 6px 8px 3px rgba(242, 107, 3, 0.4);
}

.backToTopButton.active {
    bottom: 50px;
    opacity: 1;
    pointer-events: auto;
}

.backToTopButton:active {
    transform: translateY(5px);
}

/* Back to Top Button */



/* Swiper Wrapper */
.swiper_wrapper {
    width: 100%;
    height: 100%;
}

.swiper_wrapper .swiper-slide {
    width: 100%;
    height: 100%;
}

.swiper_wrapper .swiper-slide .media_wrapper {
    outline: none;
    border: none;
    background: #0000001F;
    width: 100%;
    height: 100%;
}

.swiper_wrapper .swiper-slide .media_wrapper video {
    width: 100%;
    height: 100%;
    border: none !important;
    outline: none !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-tap-highlight-color: transparent !important;
}

.swiper_wrapper .swiper-slide .media_wrapper video,
.swiper_wrapper .swiper-slide .media_wrapper img,
.swiper_wrapper .swiper-slide .media_wrapper iframe,
.swiper_wrapper .swiper-slide .media_wrapper svg {
    transition: 1s;
    filter: grayscale(100%);
}

.swiper_wrapper .swiper-slide:hover .media_wrapper video,
.swiper_wrapper .swiper-slide:hover .media_wrapper img,
.swiper_wrapper .swiper-slide:hover .media_wrapper iframe,
.swiper_wrapper .swiper-slide:hover .media_wrapper svg {
    filter: grayscale(0);
}

.swiper_wrapper .swiper-pagination .swiper-pagination-bullet {
    width: 16px !important;
    height: 16px !important;
    background: var(--proweb-white) !important;
}

.swiper_wrapper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--proweb-white) !important;
}

.swiper_wrapper .swiper-button-next,
.swiper_wrapper .swiper-button-prev {
    width: 48px;
    height: 48px;
    border-radius: 40px;
    background: #FFFFFF66;
    backdrop-filter: blur(12px);
    transition: 0.3s;
    position: absolute;
    overflow: hidden;
    user-select: none;
}

.swiper_wrapper .swiper-button-next:hover,
.swiper_wrapper .swiper-button-prev:hover {
    background: #FF590B66;
}

.swiper_wrapper .swiper-button-next::after,
.swiper_wrapper .swiper-button-prev::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-size: 60%;
    background-repeat: no-repeat;
    background-position: center;
    transition: 0.3s;
    user-select: none;
}

.swiper_wrapper .swiper-button-next .svg,
.swiper_wrapper .swiper-button-prev .svg {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s;
}

.swiper_wrapper .swiper-button-next .svg img,
.swiper_wrapper .swiper-button-prev .svg img {
    width: 60%;
    height: 60%;
}

.swiper_wrapper .swiper-button-next::after {
    background-image: url(../images/svg/arrow_Right_Light.svg);
}

.swiper_wrapper .swiper-button-next .svg {
    transform: translateX(-100%);
}

.swiper_wrapper .swiper-button-next:hover .svg {
    transform: translateX(0);
}

.swiper_wrapper .swiper-button-next:hover::after {
    transform: translateX(100%);
}

.swiper_wrapper .swiper-button-prev::after {
    background-image: url(../images/svg/arrow_Left_Light.svg );
}

.swiper_wrapper .swiper-button-prev .svg {
    transform: translateX(100%);
}

.swiper_wrapper .swiper-button-prev:hover .svg {
    transform: translateX(0);
}

.swiper_wrapper .swiper-button-prev:hover::after {
    transform: translateX(-100%);
}

/* Swiper Wrapper */




/* Breadcrumbs */
.breadcrumbs .breadcrumbs_wrapper {
    padding-top: 24px;
    padding-bottom: 24px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    column-gap: 16px;
    row-gap: 8px;
}

.breadcrumbs .breadcrumbs_wrapper a {
    color: #5B5B5B;
    text-align: left;
    font: 300 12px/16px "DMSans Light", sans-serif;
}

.breadcrumbs .breadcrumbs_wrapper a:not(:last-child) {
    position: relative;
}

.breadcrumbs .breadcrumbs_wrapper a:not(:last-child)::before {
    content: "•";
    position: absolute;
    top: 0;
    left: 100%;
    width: 16px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #5B5B5B;
}

/* Breadcrumbs */





/* Sidebar */
.sidebar.offcanvas.offcanvas-start {
    top: 77px;
    left: 0;
    right: 0;
    overflow-x: auto;
    width: 100%;
}

.sidebar.offcanvas.offcanvas-start::-webkit-scrollbar {
    display: none;
}

.sidebar .body {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    padding-top: 50px;
}

.sidebar .body ul {
    max-width: 280px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
}

.sidebar .body ul li {
    width: 100%;
}

.sidebar .body ul li a {
    display: block;
    padding: 16px 68px 16px 32px;
    font: 400 20px/26px "DMSans", sans-serif;
    color: var(--proweb-black);
}

.sidebar .body ul li a.active:not(.has-dropdown) {
    color: var(--proweb-orange);
}

.sidebar .body ul li a.has-dropdown {
    position: relative;
}

.sidebar .body ul li a.has-dropdown::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%) rotate(0);
    width: 24px;
    height: 24px;
    background-image: url(../images/svg/arrowDown.svg);
    background-size: cover;
    transition: 0.3s;
}

.sidebar .body ul li a.has-dropdown::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 1px;
    background: var(--proweb-black);
    transition: 0.3s;
}

.sidebar .body ul li a.has-dropdown.active::after {
    transform: translateY(-50%) rotate(-180deg);
}

.sidebar .body ul li a.has-dropdown.active::before {
    width: 100%;
}

.sidebar .body ul.inner_dropdown {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    margin-top: 8px;
    transition: 0.3s;
    overflow: hidden;
    height: 0;
    interpolate-size: allow-keywords;
}

.sidebar .body ul li a.has-dropdown.active+ul.inner_dropdown {
    height: auto;
}

/* .sidebar .body ul.inner_dropdown li {
    width: auto;
} */

.sidebar .body ul.inner_dropdown li a {
    display: block;
    padding: 0px 32px;
    font: 400 20px/26px "DMSans", sans-serif;
    color: var(--proweb-black);
}

.sidebar .body ul.inner_dropdown li a.active {
    color: var(--proweb-orange);
}

.sidebar .sidebar_link {
    padding: 15px 21px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    background: var(--proweb-white);
    border: 1px solid var(--proweb-black);
    border-radius: 40px;
}

.sidebar .sidebar_link .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 24px/24px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

.sidebar .sidebar_link:hover .arrow_animation .picture {
    transform: translateX(0);
}

/* Sidebar */



/* Header */
header {
    background: var(--proweb-white);
    border-bottom: 1px solid #F8F8F8;
    transition: 0.3s;
    z-index: 10;
}

header.active {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9;
    box-shadow: 0px 10px 20px 0px rgba(0, 15, 56, 0.06);
    animation: smoothScroll 0.3s forwards;
}


@keyframes smoothScroll {
    0% {
        transform: translateY(-100%);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes smoothScroll2 {
    0% {
        transform: translateY(0%);
    }

    100% {
        transform: translateY(-102%);
    }
}

header .header_wrapper {
    height: 77px;
    padding: 8px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 52px;
}

header .header_wrapper .header_logo a {
    display: block;
    width: 194px;
}

header .header_wrapper .header_logo {
    width: 218px;
    height: 60px;
}

header .header_wrapper .header_nav {
    width: calc(100% - 2 * 52px - 218px - 290px);
}

header .header_wrapper .header_extra {
    width: 290px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 17px;
}

header .header_wrapper .header_logo a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0;
}

header .header_wrapper .header_logo a .picture {
    width: calc(84px + 10px);
    height: 100%;
    padding-right: 10px;
    position: relative;
}

header .header_wrapper .header_logo a .picture::after {
    content: "";
    position: absolute;
    top: 4px;
    right: 0;
    height: calc(100% - 2 * 4px);
    width: 0.8px;
    background: #141414;
}

header .header_wrapper .header_logo a .context {
    height: 100%;
    width: calc((100% - 84px - 10px));
    padding-left: 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 0;
    color: var(--proweb-black);
    font: 300 italic 14px/16px "DMSans Light", sans-serif;
    text-align: left;
}

header .header_wrapper .header_logo a .context span {
    color: var(--proweb-black);
    font: 400 16px/18px "DMSans", sans-serif;
}

header .header_wrapper .header_nav ul {
    display: flex;
    align-items: center;
    gap: 16px;
}

header .header_wrapper .header_nav ul li>a {
    color: var(--proweb-black);
    padding: 8px;
    font: 400 16px/24px "DMSans", sans-serif;
    text-align: left;
    text-transform: capitalize;
    display: flex;
    align-items: center;
    gap: 3px;
}

header .header_wrapper .header_nav ul li>a img.submenu_icon {
    width: 20px;
    height: 20px;
}

header .header_wrapper .header_nav ul li.has_submenu {
    position: relative;
}

header .header_wrapper .header_nav ul li.has_submenu::after {
    content: "";
    position: absolute;
    width: 100%;
    height: calc(100% + 20px);
    top: 0;
    left: 0;
    cursor: pointer;
}

header .header_wrapper .header_nav>ul>li>a {
    position: relative;
    z-index: 1;
}

header .header_wrapper .header_nav>ul>li>a::after {
    content: "";
    position: absolute;
    bottom: 2px;
    left: 8px;
    height: 0.9px;
    width: 0;
    background: var(--proweb-black);
    transition: 0.3s;
}

header .header_wrapper .header_nav>ul>li:hover>a::after {
    width: calc(100% - 2 * 8px);
}

header .header_wrapper .header_nav ul li.has_submenu .submenu {
    position: absolute;
    z-index: 9;
    top: calc(100% + 20px);
    left: 0;
    height: 0;
    border-radius: 8px;
    background: var(--proweb-white);
    box-shadow: 0px 0px 24px 0px #0000001A;
    overflow: hidden;
    interpolate-size: allow-keywords;
    transition: all 0.3s ease-in-out;
}

header .header_wrapper .header_nav ul li.has_submenu:hover .submenu {
    height: auto;
}

header .header_wrapper .header_nav ul li.has_submenu .submenu ul.version1 {
    width: 258px;
    padding: 8px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 4px;
}

header .header_wrapper .header_nav ul li.has_submenu .submenu ul.version1 li {
    width: 100%;
    transition: 0.3s;
}

header .header_wrapper .header_nav ul li.has_submenu .submenu ul li:hover {
    background: #F6F6F6;
}

header .header_wrapper .header_nav ul li.has_submenu .submenu ul li a {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0;
    padding: 16px 20px;
}

header .header_wrapper .header_nav ul li.has_submenu .submenu ul li a .submenu_picture {
    width: 124px;
    height: 100px;
    border-radius: 8px;
    border: 1px solid #161616;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 8px 0;
}

header .header_wrapper .header_nav ul li.has_submenu .submenu ul li a .submenu_picture svg {
    width: 60px;
    height: 60px;
}

header .header_wrapper .header_nav ul li.has_submenu .submenu ul.version2 li:nth-child(2n + 1) a .submenu_picture {
    border: 1px solid var(--proweb-orange);
}

header .header_wrapper .header_nav ul li.has_submenu .submenu ul li a .submenu_picture svg path,
header .header_wrapper .header_nav ul li.has_submenu .submenu ul li a .submenu_picture svg rect,
header .header_wrapper .header_nav ul li.has_submenu .submenu ul li a .submenu_picture svg circle {
    stroke: #161616;
}

header .header_wrapper .header_nav ul li.has_submenu .submenu ul li:nth-child(2n + 1) a .submenu_picture svg path,
header .header_wrapper .header_nav ul li.has_submenu .submenu ul li:nth-child(2n + 1) a .submenu_picture svg rect,
header .header_wrapper .header_nav ul li.has_submenu .submenu ul li:nth-child(2n + 1) a .submenu_picture svg circle {
    stroke: var(--proweb-orange);
}

header .header_wrapper .header_nav ul li.has_submenu .submenu ul li a .submenu_link {
    color: var(--proweb-black);
    font: 500 16px/24px "DMSans Medium", sans-serif;
    text-align: left;
    margin: 0 0 4px 0;
    width: 100%;
}

header .header_wrapper .header_nav ul li.has_submenu .submenu ul li a .submenu_link.active {
    color: var(--proweb-orange);
}

header .header_wrapper .header_nav ul li.has_submenu .submenu ul li a .submenu_description {
    color: #727272;
    font: 400 16px/24px "DMSans", sans-serif;
    text-align: left;
    width: 100%;
}

header .header_wrapper .header_nav ul li.has_submenu .submenu ul.version2 {
    width: 800px;
    padding: 8px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0;
}

header .header_wrapper .header_nav ul li.has_submenu .submenu ul.version2 li {
    width: calc(100% / 3);
    transition: 0.3s;
}

header .header_wrapper .header_nav ul li.has_submenu .submenu ul.version2 li a .submenu_link,
header .header_wrapper .header_nav ul li.has_submenu .submenu ul.version2 li a .submenu_description {
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

header .header_wrapper .header_extra .language_dropdown {
    width: 46px;
    position: relative;
}

header .header_wrapper .header_extra .language_dropdown::after {
    content: "";
    position: absolute;
    width: 100%;
    height: calc(100% + 20px);
    top: 0;
    left: 0;
    cursor: pointer;
}

header .header_wrapper .header_extra .language_dropdown>a {
    color: var(--proweb-black);
    padding: 8px 0;
    font: 400 16px/24px "DMSans", sans-serif;
    text-align: left;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 6px;
}

header .header_wrapper .header_extra .language_dropdown>a img.submenu_icon {
    width: 20px;
    height: 20px;
}

header .header_wrapper .header_extra .language_dropdown .inner_dropdown {
    position: absolute;
    z-index: 9999;
    top: calc(100% + 20px);
    left: 50%;
    transform: translateX(-50%);
    height: 0;
    width: 100%;
    border-radius: 8px;
    background: var(--proweb-white);
    box-shadow: 0px 0px 24px 0px #0000001A;
    overflow: hidden;
    interpolate-size: allow-keywords;
    transition: all 0.3s ease-in-out;
}

header .header_wrapper .header_extra .language_dropdown.active .inner_dropdown {
    height: auto;
}

header .header_wrapper .header_extra .language_dropdown .inner_dropdown ul {
    padding: 8px 4px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 4px;
}

header .header_wrapper .header_extra .language_dropdown .inner_dropdown ul li {
    width: 100%;
    transition: 0.3s;
}

header .header_wrapper .header_extra .language_dropdown .inner_dropdown ul li:hover {
    background: #F6F6F6;
}

header .header_wrapper .header_extra .language_dropdown .inner_dropdown ul li a {
    display: block;
    width: 100%;
    color: var(--proweb-black);
    font: 500 16px/24px "DMSans Medium", sans-serif;
    text-align: center;
}

header .header_wrapper .header_extra .extras_wrapper {
    height: 40px;
    max-width: calc(100% - 46px - 34px);
}

header .header_wrapper .header_extra .extras_wrapper a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
}

header .header_wrapper .header_extra .extras_wrapper a .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 24px/40px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

header .header_wrapper .header_extra .extras_wrapper a .context::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0px;
    height: 0.9px;
    width: 0;
    background: var(--proweb-black);
    transition: 0.3s;
}

header .header_wrapper .header_extra .extras_wrapper a:hover .context::after {
    width: 100%;
}

header .header_wrapper .header_extra .extras_wrapper a:hover .arrow_animation .picture {
    transform: translateX(0);
}

header .header_wrapper .header_extra .sidebar_opener {
    width: 36px;
    height: 36px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Header */



/* Footer */
footer {
    padding-bottom: 32px;
    overflow-y: hidden;
}

footer .footer_wrapper {
    background: #161616;
    width: 100%;
    border-radius: 20px;
    padding-top: 52px;
    padding-bottom: 32px;
}

footer .footer_wrapper .footer_top .footer_top_wrapper {
    width: 100%;
    /* height: 252px; */
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 70px;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_left {
    width: 301px;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_center {
    width: calc(100% - 2 * 70px - 301px - 244px);
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_right {
    width: 244px;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_left .footer_logo {
    width: 120px;
    margin: 0 0 25px 0;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_left .footer_logo a {
    display: block;
    width: 100%;
    height: 100%;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_left .footer_description {
    color: var(--proweb-white);
    font: 500 16px/24px "DMSans Medium", sans-serif;
    text-align: left;
    margin: 0 0 12px 0;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_left .footer_form {
    width: 100%;
    height: 53px;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_left .footer_form form {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 40px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_left .footer_form form input {
    position: absolute;
    top: 0;
    left: 0;
    border: none;
    outline: none;
    width: 100%;
    height: 100%;
    padding: 8px 52px 8px 20px;
    color: #000000;
    font: 400 14px/21px "HelveticaNeue", sans-serif;
    text-align: left;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_left .footer_form form input::placeholder {
    color: #000000;
    font: 400 14px/21px "HelveticaNeue", sans-serif;
    text-align: left;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_left .footer_form form button {
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
    width: 37px;
    height: 37px;
    border-radius: 50%;
    padding: 4px;
    background: var(--proweb-black);
    border: none;
    outline: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_left .footer_form form:hover button .arrow_animation .picture {
    transform: translateX(0);
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_center .footer_nav {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 50px;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_center .footer_nav .footer_nav_item {
    width: calc((100% - 3 * 50px) / 4);
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_center .footer_nav .footer_nav_item .title {
    color: var(--proweb-white);
    font: 400 20px/30px "HelveticaNeue", sans-serif;
    text-align: left;
    margin: 0 0 12px 0;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_center .footer_nav .footer_nav_item ul {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 4px;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_center .footer_nav .footer_nav_item ul li {
    white-space: nowrap;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_center .footer_nav .footer_nav_item ul li a {
    display: inline-block;
    width: 100%;
    padding: 5.5px 0;
    color: var(--proweb-white);
    font: 400 16px/24px "DMSans", sans-serif;
    text-align: left;
    text-transform: capitalize;
    position: relative;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_center .footer_nav .footer_nav_item ul li a::after {
    content: "";
    position: absolute;
    bottom: 2px;
    left: 0;
    height: 0.8px;
    width: 0;
    background: var(--proweb-white);
    transition: 0.3s;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_center .footer_nav .footer_nav_item ul li:hover a::after {
    width: 100%;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_right .footer_nav {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 44px;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_right .footer_nav .footer_nav_item {
    width: 100%;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_right .footer_nav .footer_nav_item .title {
    color: var(--proweb-white);
    font: 400 20px/30px "HelveticaNeue", sans-serif;
    text-align: left;
    margin: 0 0 12px 0;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_right .footer_nav .footer_nav_item ul {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 4px;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_right .footer_nav .footer_nav_item ul li a {
    display: inline-block;
    width: 100%;
    padding: 5.5px 0;
    color: var(--proweb-white);
    font: 400 16px/24px "DMSans", sans-serif;
    text-align: left;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_right .footer_nav .footer_nav_item ul.social_icons {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_right .footer_nav .footer_nav_item ul.social_icons li {
    width: 48px;
    height: 48px;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_right .footer_nav .footer_nav_item ul.social_icons li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 0px solid var(--proweb-orange);
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_right .footer_nav .footer_nav_item ul.social_icons li a svg {
    display: block;
    width: 24px;
    height: 24px;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_right .footer_nav .footer_nav_item ul.social_icons li:hover a {
    border-width: 2px;
}

footer .footer_wrapper .footer_top .footer_top_wrapper .footer_top_right .footer_nav .footer_nav_item ul.social_icons li:hover a svg path {
    fill: var(--proweb-orange);
}

footer .footer_wrapper .footer_bottom .innovativ_animation {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 150px;
    margin: 32px 0;
}

footer .footer_wrapper .footer_bottom .innovativ_animation .text {
    color: var(--proweb-white);
    font: 400 128px/150px "DMSans", sans-serif;
    text-align: left;
    /* display: inline-block; */
    white-space: nowrap;
    animation: innovativ 5s linear infinite alternate;
}

@keyframes innovativ {
    0% {
        transform: translateX(0);
    }

    8% {
        transform: translateX(0);
    }

    92% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(-100%);
    }
}

footer .footer_wrapper .footer_bottom .copyright {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 60px;
}

footer .footer_wrapper .footer_bottom .copyright>div {
    width: calc((100% - 60px) / 2);
}

footer .footer_wrapper .footer_bottom .copyright .copyright_left {
    color: var(--proweb-white);
    font: 400 16px/24px "DMSans", sans-serif;
    text-align: left;
}

footer .footer_wrapper .footer_bottom .copyright .copyright_left a {
    color: var(--proweb-white);
    font: 400 16px/24px "DMSans", sans-serif;
    text-align: left;
}

footer .footer_wrapper .footer_bottom .copyright .copyright_right ul {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 20px;
}

footer .footer_wrapper .footer_bottom .copyright .copyright_right ul li a {
    padding: 5.5px 8px;
    color: var(--proweb-white);
    font: 400 16px/24px "DMSans", sans-serif;
    text-align: left;
}

/* Footer */


/* Home Section */
section.home {
    margin: 64px auto 120px;
}

@media (max-height: 800px) {

    section.home {
        margin: 20px auto 45px !important;
    }
}

section.home .home_wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 44px;
}

section.home .home_wrapper>div {
    width: calc((100% - 44px) / 2);
}

section.home .home_wrapper .home_wrapper_left h1 {
    color: var(--proweb-black);
    font: 400 100px/100px 'HelveticaNeue', sans-serif;
    text-align: left;
    margin: 10px 0 32px 0;
}

@media (max-height: 800px) {
    section.home .home_wrapper .home_wrapper_left h1 {
        line-height: 60px !important;
    }
}

section.home .home_wrapper .home_wrapper_left h1 span {
    font: 100 italic 100px/100px 'HelveticaNeue Thin', sans-serif;
}

section.home .home_wrapper .home_wrapper_left a {
    padding: 15px 21px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    margin: 0 0 62px 0;
    background: var(--proweb-white);
    border: 1px solid var(--proweb-black);
    border-radius: 40px;
}

@media (max-height: 800px) {

    section.home .home_wrapper .home_wrapper_left a {
        margin: 0 0 22px 0 !important;

    }
}

section.home .home_wrapper .home_wrapper_left a .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 24px/24px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

section.home .home_wrapper .home_wrapper_left a:hover .arrow_animation .picture {
    transform: translateX(0);
}

section.home .home_wrapper .home_wrapper_left .home_results {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 70px;
    padding: 16px 12px 0;
    border-top: 1px solid var(--proweb-black);
    position: relative;
}

section.home .home_wrapper .home_wrapper_left .home_results::after {
    content: "";
    position: absolute;
    top: 16px;
    left: 49%;
    transform: translateX(-50%);
    height: calc(100% - 16px);
    border-left: 1px solid var(--proweb-black);
}

section.home .home_wrapper .home_wrapper_left .home_results>div {
    width: calc((100% - 1 * 70px) / 2);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
}

section.home .home_wrapper .home_wrapper_left .home_results .result {
    color: var(--proweb-black);
    font: 500 44px/65px "DMSans Medium", sans-serif;
    text-align: left;
}

section.home .home_wrapper .home_wrapper_left .home_results .home_result_right .result {
    color: var(--proweb-orange);
}

section.home .home_wrapper .home_wrapper_left .home_results .context {
    color: var(--proweb-black);
    font: 300 16px/20px "DMSans Light", sans-serif;
    text-align: left;
    width: 80px;
}

section.home .home_wrapper .home_wrapper_right .media_wrapper {
    outline: none;
    border: none;
    background: var(--proweb-gray);
    height: 444px;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
}

@media (max-height: 800px) {
    section.home .home_wrapper .home_wrapper_right .media_wrapper {
        height: 380px !important;
    }
}

section.home .home_wrapper .home_wrapper_right .media_wrapper video {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 10px;
    width: 100%;
    height: 100%;
    border: none !important;
    outline: none !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-tap-highlight-color: transparent !important;
}

section.home .home_wrapper .home_wrapper_right .media_wrapper video,
section.home .home_wrapper .home_wrapper_right .media_wrapper img,
section.home .home_wrapper .home_wrapper_right .media_wrapper iframe,
section.home .home_wrapper .home_wrapper_right .media_wrapper svg {
    transition: 1s;
    filter: grayscale(100%);
}

section.home .home_wrapper .home_wrapper_right .media_wrapper:hover video,
section.home .home_wrapper .home_wrapper_right .media_wrapper:hover img,
section.home .home_wrapper .home_wrapper_right .media_wrapper:hover iframe,
section.home .home_wrapper .home_wrapper_right .media_wrapper:hover svg {
    filter: grayscale(0);
}

/* Home Section */



/* Estimated Clients Section */
section.esteemed_clients {
    margin: 0 0 80px 0;
}

section.esteemed_clients .company_swiper {
    margin: -10px 0 0 0;

}

section.esteemed_clients .company_swiper .carouselTicker__list .carouselTicker__item {
    background-color: var(--proweb-gray);
    border-radius: 35px;
}

/* Estimated Clients Section */



/* Featured Works Section */
section.featured_section {
    margin: 0 0 100px 0;
}

section.featured_section .featured_section_wrapper {
    padding: 44px 0;
    margin-bottom: 24px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 44px;
}

section.featured_section .featured_section_wrapper>div {
    width: calc((100% - 1 * 44px) / 2);
}

section.featured_section .featured_section_wrapper .featured_wrapper_left .media_wrapper {
    outline: none;
    border: none;
    background: var(--proweb-gray);
    height: 444px;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
}

section.featured_section .featured_section_wrapper .featured_wrapper_left .media_wrapper .badge {
    position: absolute;
    z-index: 2;
    top: 16px;
    left: 16px;
    max-width: calc(100% - 32px);
    overflow: hidden;
    padding: 8px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    background: #00000099;
    backdrop-filter: blur(8px);
    border-radius: 40px;
}

section.featured_section .featured_section_wrapper .featured_wrapper_left .media_wrapper .badge span {
    color: var(--proweb-white);
    font: 400 14px/18px "DMSans", sans-serif;
    text-align: center;
    position: relative;
}

section.featured_section .featured_section_wrapper .featured_wrapper_left .media_wrapper .badge span:not(:first-child)::after {
    content: "";
    position: absolute;
    top: 50%;
    left: -10px;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--proweb-white);
}

section.featured_section .featured_section_wrapper .featured_wrapper_left .media_wrapper video {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 10px;
    width: 100%;
    height: 100%;
    border: none !important;
    outline: none !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-tap-highlight-color: transparent !important;
}

section.featured_section .featured_section_wrapper .featured_wrapper_left .media_wrapper video,
section.featured_section .featured_section_wrapper .featured_wrapper_left .media_wrapper img,
section.featured_section .featured_section_wrapper .featured_wrapper_left .media_wrapper iframe,
section.featured_section .featured_section_wrapper .featured_wrapper_left .media_wrapper svg {
    transition: 1s;
    filter: grayscale(100%);
}

section.featured_section .featured_section_wrapper .featured_wrapper_left .media_wrapper:hover video,
section.featured_section .featured_section_wrapper .featured_wrapper_left .media_wrapper:hover img,
section.featured_section .featured_section_wrapper .featured_wrapper_left .media_wrapper:hover iframe,
section.featured_section .featured_section_wrapper .featured_wrapper_left .media_wrapper:hover svg {
    filter: grayscale(0);
}

section.featured_section .featured_section_wrapper .featured_wrapper_left .media_wrapper.imageScale:hover img {
    transform: scale(1.1);
}

section.featured_section .featured_section_wrapper .featured_wrapper_right .picture {
    width: 123px;
    margin: 0 0 16px 0;
}

section.featured_section .featured_section_wrapper .featured_wrapper_right .title {
    color: var(--proweb-black);
    font: 400 32px/42px "DMSans", sans-serif;
    text-align: left;
    margin: 0 0 8px 0;
}

section.featured_section .featured_section_wrapper .featured_wrapper_right .description {
    color: var(--proweb-black);
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: left;
    margin: 0 0 24px 0;
}

section.featured_section .featured_section_wrapper .featured_wrapper_right .technologies {
    margin: 0 0 32px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 12px;
}

section.featured_section .featured_section_wrapper .featured_wrapper_right .technologies .technology_item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 12px;
    border-radius: 40px;
    background: var(--proweb-gray);
    overflow: hidden;
}

section.featured_section .featured_section_wrapper .featured_wrapper_right .technologies .technology_item .icon {
    width: 16px;
    height: 18.03px;
    margin-right: 8px;
}

section.featured_section .featured_section_wrapper .featured_wrapper_right .technologies .technology_item .text {
    color: var(--proweb-black);
    font: 400 14px/18px "DMSans", sans-serif;
}

section.featured_section .featured_section_wrapper .featured_wrapper_right a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 5px 5px 5px 0;
}

section.featured_section .featured_section_wrapper .featured_wrapper_right a .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 24px/24px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

section.featured_section .featured_section_wrapper .featured_wrapper_right a .context::after {
    content: "";
    position: absolute;
    bottom: -5px;
    left: 0;
    height: 0.8px;
    width: 0;
    background: var(--proweb-black);
    transition: 0.3s;
}

section.featured_section .featured_section_wrapper .featured_wrapper_right a:hover .arrow_animation .picture {
    transform: translateX(0);
}

section.featured_section .featured_section_wrapper .featured_wrapper_right a:hover .context::after {
    width: 100%;
}

/* Featured Works Section */


/* Know Us Section  */
section.know_us {
    margin: 0 0 100px 0;
    padding-bottom: 196px;
}

section.know_us .know_us_wrapper {
    padding: 80px 0 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 28px;
}

section.know_us .know_us_wrapper .know_us_item {
    background: var(--proweb-gray);
    height: auto;
    border-radius: 16px;
    border: 1px solid var(--proweb-gray);
    overflow: hidden;
    position: relative;
}

section.know_us .know_us_wrapper .know_us_item:nth-child(3) {
    background: var(--proweb-black);
}

section.know_us .know_us_wrapper .know_us_item:nth-child(5) {
    background: var(--proweb-orange);
}

section.know_us .know_us_wrapper .know_us_item .details {
    position: absolute;
}

section.know_us .know_us_wrapper .know_us_item .details .count {
    font: 600 60px/78px "DMSans SemiBold", sans-serif;
}

section.know_us .know_us_wrapper .know_us_item .details .text {
    font: 300 28px/36px "DMSans Light", sans-serif;
}

section.know_us .know_us_wrapper .know_us_item:nth-child(1) .details {
    bottom: 32px;
    left: 32px;
}

section.know_us .know_us_wrapper .know_us_item:nth-child(5) .details {
    top: 32px;
    right: 32px;
    text-align: right;
}

section.know_us .know_us_wrapper .know_us_item:nth-child(3) .details,
section.know_us .know_us_wrapper .know_us_item:nth-child(6) .details {
    top: 32px;
    left: 32px;
}

section.know_us .know_us_wrapper .know_us_item:nth-child(1) .details .count,
section.know_us .know_us_wrapper .know_us_item:nth-child(1) .details .text,
section.know_us .know_us_wrapper .know_us_item:nth-child(6) .details .count,
section.know_us .know_us_wrapper .know_us_item:nth-child(6) .details .text {
    color: var(--proweb-orange);
}

section.know_us .know_us_wrapper .know_us_item:nth-child(3) .details .count,
section.know_us .know_us_wrapper .know_us_item:nth-child(3) .details .text,
section.know_us .know_us_wrapper .know_us_item:nth-child(5) .details .count,
section.know_us .know_us_wrapper .know_us_item:nth-child(5) .details .text {
    color: var(--proweb-white);
}

/* Some changes */
section.know_us .know_us_wrapper .know_us_item {
    width: 400px;
    height: 450px;
    margin: 0;
    padding: 0;
}

section.know_us .know_us_wrapper .know_us_item>img.innerImage {
    display: block;
    width: 100%;
    height: 100%;
}

section.know_us .know_us_wrapper .know_us_item:nth-child(3n - 2) {
    width: 440px;
    height: auto;
}

section.know_us .know_us_wrapper .know_us_item:nth-child(3n - 1) {
    transform: translateY(196px);
}

section.know_us .know_us_wrapper .know_us_item img.animated_pic {
    position: absolute;
    width: 120px;
    height: 120px;
}

section.know_us .know_us_wrapper .know_us_item img.animated_pic.rotate {
    animation: rotate 4s linear infinite;
    top: 32px;
    right: 32px;
}

section.know_us .know_us_wrapper .know_us_item img.animated_pic.scale {
    animation: scale 4s linear infinite;
    bottom: 32px;
    right: 32px;
}

@keyframes rotate {
    from {
        transform: rotate(0);
    }

    to {
        transform: rotate(360deg);
    }
}

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

    25% {
        transform: scale(1.3);
    }

    50% {
        transform: scale(1);
    }

    75% {
        transform: scale(1.3);
    }

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

section.know_us .know_us_wrapper .know_us_item.cardArrowFollow .animated-line {
    position: absolute;
    left: -50px;
    top: 50px;
    opacity: 0;
}

section.know_us .know_us_wrapper .know_us_item .small-card {
    position: absolute;
    height: 96px;
    width: 183px;
    border-radius: 8px;
    top: 70px;
    right: -10px;
    background-color: var(--proweb-white);
    opacity: 1;
    transform: rotate(90deg);
    z-index: 2;
    overflow: visible;
    border: 2px solid var(--proweb-orange);
}

/* Some changes */
/* Know Us Section  */



/* Innovative Solutions */
section.innovative_solutions {
    margin: 0 0 110px 0;
}

section.innovative_solutions .innovative_wrapper {
    background: var(--proweb-gray);
    padding: 70px 40px;
    border-radius: 20px;
}

section.innovative_solutions .innovative_wrapper .innovative_items {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 40px;
    padding: 58px 0;
    border-top: 1px solid #161616;
    position: relative;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_count {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    font: 400 20px/20px "HelveticaNeue", sans-serif;
    text-align: right;
    color: #222222;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_picture {
    width: 260px;
    height: 210px;
    border-radius: 8px;
    border: 1px solid var(--proweb-orange);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 8px 0;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_picture svg {
    width: 120px;
    height: 120px;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item:nth-child(2n) .innovative_picture {
    border: 1px solid #161616;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_picture svg path,
section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_picture svg rect,
section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_picture svg circle {
    stroke: var(--proweb-orange);
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item:nth-child(2n) .innovative_picture svg path,
section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item:nth-child(2n) .innovative_picture svg rect,
section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item:nth-child(2n) .innovative_picture svg circle {
    stroke: #161616;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_context {
    width: 587px;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_context p {
    font: 400 20px/26px "DMSans", sans-serif;
    text-align: left;
    color: var(--proweb-black);
    margin: 14px 0 0 0;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_context a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 5px 5px 5px 0;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_context a .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 38px/38px "HelveticaNeue", sans-serif;
    text-align: left;
    position: relative;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_context a .context::after {
    content: "";
    position: absolute;
    bottom: -5px;
    left: 0;
    height: 0.9px;
    width: 0;
    background: var(--proweb-black);
    transition: 0.3s;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_context a:hover .context::after {
    width: 100%;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_context a .arrow_animation {
    width: 32px;
    height: 32px;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_context a .arrow_animation .picture {
    width: 32px;
    height: 32px;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_context a .arrow_animation .picture img {
    width: 32px;
    height: 32px;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_context a .arrow_animation .picture::before {
    width: 32px;
    height: 32px;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item .innovative_context a:hover .arrow_animation .picture {
    transform: translateX(0);
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item:nth-child(1) .innovative_picture svg {
    animation: rotate 5s linear infinite;

}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item:nth-child(2) .innovative_picture svg {
    transform-style: preserve-3d;
    animation: flipY 2s linear infinite;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item:nth-child(3) .innovative_picture svg {
    animation: small-scale 4s linear infinite;
}

section.innovative_solutions .innovative_wrapper .innovative_items .innovative_item:nth-child(4) .innovative_picture svg {
    animation: scale 2s linear infinite;
}

@keyframes flipY {
    0% {
        transform: rotateX(0deg) rotateY(0deg);
    }

    50% {
        transform: rotateX(20deg) rotateY(20deg);
    }

    100% {
        transform: rotateX(0deg) rotateY(0deg);
    }
}

@keyframes small-scale {
    0% {
        transform: scale(1);
    }

    25% {
        transform: scale(1.05);
    }

    50% {
        transform: scale(1);
    }

    75% {
        transform: scale(1.05);
    }

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

/* Innovative Solutions */



/* FAQ Section */
section.faq {
    margin: 0 0 110px 0;
}

section.faq .faq_header {
    border-bottom: 1px solid var(--proweb-black);
    padding-bottom: 32px;
    margin-bottom: 40px;
}

section.faq .faq_header h1 {
    font-family: "HelveticaNeue";
    font-size: 80px;
}

section.faq .faq_wrapper {
    background: var(--proweb-gray);
    padding: 70px 40px;
    border-radius: 20px;
}



section.faq .faq_wrapper .faq_accordion {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}

section.faq .faq_wrapper .faq_accordion .faq_items {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
}


section.faq .faq_wrapper .faq_accordion .faq_items .faq_item {
    width: 100%;
    /* border-radius: 20px; */
    /* overflow: hidden; */
}

section.faq .faq_wrapper .faq_accordion .faq_items .faq_item .accordion-item {
    border: none;
    outline: none;
    box-shadow: none;
    background: transparent;
}

section.faq .faq_wrapper .faq_accordion .faq_items .faq_item:first-child .accordion_opener {
    border: none;
}

section.faq .faq_wrapper .faq_accordion .faq_items .faq_item .accordion_opener {
    padding: 60px 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
    border: none;
    outline: none;
    box-shadow: none;
    cursor: pointer;
    border-top: 1px solid #161616;
}

section.faq .faq_wrapper .faq_accordion .faq_items .faq_item .accordion_opener .icon {
    width: 36px;
    height: 36px;
    cursor: pointer;
    user-select: none;
}

section.faq .faq_wrapper .faq_accordion .faq_items .faq_item .accordion_opener .text {
    text-align: left;
    font: 400 28px/36px "DMSans", sans-serif;
    color: var(--proweb-black);
    user-select: none;
    width: 835px;
}

section.faq .faq_wrapper .faq_accordion .faq_items .faq_item .accordion-collapse p {
    margin: 0 52px;
    font: 400 20px/30px "DMSans", sans-serif;
    text-align: left;
    color: var(--proweb-black);
    user-select: none;
    width: 835px;
    padding-bottom: 20px;
}

section.faq .faq_wrapper .faq_bottom {
    width: 100%;
    background-color: var(--proweb-white);
    border-radius: 40px;
    padding: 20px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

section.faq .faq_wrapper .faq_bottom p {
    font-family: "DmSans";
    font-size: 20px;
}

section.faq .faq_wrapper .faq_bottom button .text {
    transition: all .3s;
    color: var(--proweb-white);
}

section.faq .faq_wrapper .faq_bottom button {
    color: var(--proweb-white);
    background-color: var(--proweb-black);
    border: none;
    padding: 16px 32px;
    font-size: 20px;
    border-radius: 35px;
    overflow: hidden;
    position: relative;
}

section.faq .faq_wrapper .faq_bottom button a {
    color: var(--proweb-white);
}

section.faq .faq_wrapper .faq_bottom button:after {
    content: "ask a question";
    position: absolute;
    left: 50%;
    top: 100%;
    width: 100%;
    transform: translate(-50%, 0);
    transition: all .2s;

}

section.faq .faq_wrapper .faq_bottom button:hover .text {
    transform: translateY(-170%);
}

section.faq .faq_wrapper .faq_bottom button:hover::after {
    top: 30% !important;
}

/* FAQ Section */



/* Clients Section */
section.clients {
    margin: 0 0 110px 0;
}

section.clients .clients_heading {
    width: 796px;
    margin: 0 auto 60px;
}

section.clients .clients_heading .description {
    margin: 0 0 16px 0;
    font: 400 32px/42px "DMSans", sans-serif;
    text-align: center;
    color: var(--proweb-black);
}

section.clients .clients_heading .title {
    font: 300 60px/70px "DMSans Light", sans-serif;
    text-align: center;
    color: var(--proweb-black);
}

section.clients .clients_swiper_wrapper {
    height: 590px;
}

section.clients .clients_swiper_wrapper .swiper {
    height: 590px;
    padding-top: 20px;
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide:first-child {
    margin-left: 195px;
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide {
    height: 547.94px;
    width: 424.47px;
    border-radius: 20px;
    box-shadow: 0px 0px 6px 0px #0000001F;
    padding: 24px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    transition: all .3s;
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide:nth-child(2n + 1) {
    background: #161616;
    transform: rotate(5.68deg);
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide:nth-child(2n) {
    background: #FF590B;
    transform: rotate(-3.51deg);
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide:hover {
    transform: rotate(0deg);
    z-index: 1;
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .clientSwiper_top {
    width: 100%;
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .clientSwiper_top .stars {
    height: 40px;
    margin: 0 0 30px 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .clientSwiper_top .stars .star {
    width: 40px;
    height: 40px;
    padding: 2px;
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .clientSwiper_top .description {
    height: 182px;
    font: 400 20px/26px "DMSans", sans-serif;
    text-align: left;
    color: var(--proweb-white);
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 7 !important;
    line-clamp: 7 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .clientSwiper_bottom {
    width: 100%;
    height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .clientSwiper_bottom .right {
    width: 54px;
    height: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .clientSwiper_bottom .right a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #FFF8F1;
    border-radius: 50%;
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .clientSwiper_bottom .right a:hover .arrow_animation .picture {
    transform: translateX(0);
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .clientSwiper_bottom .left {
    height: 100%;
    width: calc(100% - 20px - 54px);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .clientSwiper_bottom .left .picture {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    overflow: hidden;
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .clientSwiper_bottom .left .context {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    width: calc(100% - 6px - 54px);
}

section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .clientSwiper_bottom .left .context .name,
section.clients .clients_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .clientSwiper_bottom .left .context .profession {
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: left;
    color: var(--proweb-white);
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

/* Clients Section */



/* Home Detailed */
section.home_detailed {
    margin: 10px 0 65px 0;
}

section.home_detailed .home_detailed_wrapper {
    background: var(--proweb-gray);
    border-radius: 20px;
    position: relative;
    overflow: hidden;
}

section.home_detailed .home_detailed_wrapper .project_status {
    position: absolute;
    bottom: 50px;
    font-family: "DmSans";
    left: 50px;
    z-index: 2;
    border: 3px solid var(--proweb-white);
    background-color: rgba(255, 255, 255, 0.3);
    /* Semi-transparent white */
    backdrop-filter: blur(10px);
    /* Blur effect */
    -webkit-backdrop-filter: blur(10px);
    /* For Safari */
    border-radius: 35px;
    padding: 10px 20px 10px 40px;
    color: #000;
    /* Optional: ensure text stays readable */
}

section.home_detailed .home_detailed_wrapper .project_status:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(20px, -50%);
    width: 10px;
    height: 10px;
    background-color: var(--proweb-black);
    border-radius: 100%;
}




section.home_detailed .home_detailed_wrapper .media_wrapper {
    outline: none;
    border: none;
    /* background: var(--proweb-gray); */
    width: 100%;
    height: 580px;
    overflow: hidden;
    position: relative;
}

section.home_detailed .home_detailed_wrapper .media_wrapper:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgb(0, 0, 0, .2);

}

section.home_detailed .home_detailed_wrapper .media_wrapper .job_detailed_banner_texts {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 5;
    padding: 20px;

}

section.home_detailed .home_detailed_wrapper .media_wrapper .job_detailed_banner_texts h1 {
    font-family: "DmSans ExtraBold";
    font-size: 60px;
    /* width: 60%; */
}

section.home_detailed .home_detailed_wrapper .media_wrapper .job_detailed_banner_texts p {
    font-family: "DmSans medium";
}

section.home_detailed .home_detailed_wrapper .media_wrapper .job_detailed_banner_texts h1,
section.home_detailed .home_detailed_wrapper .media_wrapper .job_detailed_banner_texts p {
    color: var(--proweb-white);

}

section.home_detailed .home_detailed_wrapper .media_wrapper .job_detailed_banner_texts .lets_design {
    background-color: var(--proweb-white);
    margin-bottom: 20px;
    justify-content: space-between;
    padding: 10px 20px;
    border-radius: 35px;
    cursor: pointer;
}

section.home_detailed .home_detailed_wrapper .media_wrapper .job_detailed_banner_texts .lets_design:hover .arrow_animation .picture {
    transform: translateX(0);
}

section.home_detailed .home_detailed_wrapper .media_wrapper .job_detailed_banner_texts .lets_design p {
    color: var(--proweb-black);
    font-size: 20px;
    font-family: "DmSans";
}

section.home_detailed .home_detailed_wrapper .media_wrapper .white-layer,
section.home_detailed .home_detailed_wrapper .media_wrapper .black-layer {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 50%;
}

section.home_detailed .home_detailed_wrapper .media_wrapper .black-layer {
    z-index: 2;
}

section.home_detailed .home_detailed_wrapper .media_wrapper .white-layer {
    left: 20px;
    z-index: 1;
}

section.home_detailed .home_detailed_wrapper .media_wrapper video {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    border: none !important;
    outline: none !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-tap-highlight-color: transparent !important;
}

section.home_detailed .home_detailed_wrapper .media_wrapper video,
section.home_detailed .home_detailed_wrapper .media_wrapper img,
section.home_detailed .home_detailed_wrapper .media_wrapper iframe,
section.home_detailed .home_detailed_wrapper .media_wrapper svg {
    transition: 1s;
    filter: grayscale(100%);
}

section.home_detailed .home_detailed_wrapper .media_wrapper:hover video,
section.home_detailed .home_detailed_wrapper .media_wrapper:hover img,
section.home_detailed .home_detailed_wrapper .media_wrapper:hover iframe,
section.home_detailed .home_detailed_wrapper .media_wrapper:hover svg {
    filter: grayscale(0);
}

section.home_detailed .home_detailed_wrapper .home_detailed_details {
    padding: 44px 40px 80px;
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .title {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-bottom: 50px;
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .title h2 {
    font: 400 40px/52px "DMSans", sans-serif;
    text-align: left;
    color: var(--proweb-black);
    margin: 0;
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .title .condition {
    padding: 10px 20px 10px 35px;
    border-radius: 40px;
    border: 1px solid var(--proweb-orange);
    vertical-align: middle;
    font: 400 16px/21px "DMSans", sans-serif;
    color: var(--proweb-orange);
    text-align: center;
    position: relative;
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .title .condition::after {
    content: "";
    position: absolute;
    top: 53%;
    left: 20px;
    transform: translateY(-50%);
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--proweb-orange);
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .more_details {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 100px;
    margin: 0;
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .more_details .left {
    width: 40%;
    padding: 0;
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .more_details .right {
    width: calc(60% - 100px);
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    column-gap: 100px;
    row-gap: 44px;
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .more_details .right .item {
    width: calc((100% - 1 * 100px) / 2);
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .more_details .right .item .item_title {
    font: 500 16px/21px "DMSans Medium", sans-serif;
    text-align: left;
    color: var(--proweb-orange);
    margin: 0 0 8px 0;
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .more_details .right .item .item_description {
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: left;
    color: var(--proweb-black);
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .more_details .left .more_details_breadcrumbs .breadcrumbs_wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    column-gap: 20px;
    row-gap: 4px;
    margin: 0 0 12px 0;
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .more_details .left .more_details_breadcrumbs .breadcrumbs_wrapper p {
    color: #727272;
    text-align: left;
    font: 400 16px/21px "DMSans", sans-serif;
    margin: 0;
    padding: 0;
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .more_details .left .more_details_breadcrumbs .breadcrumbs_wrapper p:not(:last-child) {
    position: relative;
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .more_details .left .more_details_breadcrumbs .breadcrumbs_wrapper p:not(:last-child)::before {
    content: "•";
    position: absolute;
    top: 0;
    left: 100%;
    width: 20px;
    height: 100%;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #727272;
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .more_details .left p {
    margin: 0 0 24px 0;
    font: 400 20px/26px "DMSans", sans-serif;
    text-align: left;
    color: var(--proweb-black);
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .more_details .left ul {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 10px;
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .more_details .left ul li a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 5px 5px 5px 0;
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .more_details .left ul li a .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .more_details .left ul li a .context::after {
    content: "";
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 1px;
    background: var(--proweb-black);
}

section.home_detailed .home_detailed_wrapper .home_detailed_details .more_details .left ul li a:hover .arrow_animation .picture {
    transform: translateX(0);
}

section.service_detailed.tech_used .tech_used_wrapper .title {
    color: var(--proweb-orange) !important;
    font-size: 16px !important;
    margin: 30px 0;
    position: relative;

}

section.service_detailed.tech_used .tech_used_wrapper .title:before {
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 100%;
    background-color: var(--proweb-orange);
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(-10px, -50%);
}



section.why_this_profession .section_title span {
    color: var(--proweb-orange);
    margin: 30px 0;
    position: relative;

}

section.why_this_profession .section_title span:before {
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 100%;
    background-color: var(--proweb-orange);
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(-10px, -50%);
}


section.why_this_profession .section_title h2 {

    font-family: "DmSans SemiBold";
    font-size: 40px;
    margin: 20px 0;
}

section.why_this_profession .profession_wrapper {
    margin: 20px 0;

}

section.why_this_profession .profession_wrapper h3 {
    font-family: "DmSans SemiBold";
    font-size: 40px;

}

section.why_this_profession .about-service p {
    font-family: "DmSans";
    font-size: 20px;

}

section.why_this_profession .profession_wrapper p {
    font-family: "DmSans";
    font-size: 20px;

}

section.why_this_profession .service_we_provide {
    margin: 40px 0;
}

section.why_this_profession .service_we_provide .provide_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
}

section.why_this_profession .service_we_provide .services_card {
    display: flex;
    flex-direction: column;
    align-items: center;
}

section.why_this_profession .service_we_provide .services_card .service_card {
    border-radius: 20px;
    transition: all .4s;
    border: 1px solid #ECECEC;
    padding: 20px;
    position: relative;
    background-color: var(--proweb-gray);

}

section.why_this_profession .service_we_provide .services_card .service_card:hover {
    transform: scale(0.8);
}

section.why_this_profession .service_we_provide .services_card .service_card:hover img {
    transform: rotate(90deg);
}

section.why_this_profession .service_we_provide .services_card .service_card:nth-child(2) {
    margin: 20px 0;
    align-self: flex-start;
}

section.why_this_profession .service_we_provide .services_card .service_card img {
    position: absolute;
    top: -20px;
    right: -20px;
    width: 80px;
    transition: all .4s;
    height: 80px;
}

section.why_this_profession .service_we_provide .services_card .service_card .card_inner {
    background-color: var(--proweb-white);
    border-radius: 20px;
    border: 1px solid #ECECEC;
    padding: 20px;
}

section.why_this_profession .service_we_provide .services_card .service_card .card_inner h3 {
    font-family: "DmSans SemiBold";

}

/* Ana bölmə */
section.design_process {
    background-color: #fff;
}

/* Bölmə etiketi (məsələn: "• DESIGN PROCESS") */
.design_process .section_label {
    color: #ff6a00;
    font-family: "DmSans";
    text-transform: uppercase;
    margin-bottom: 10px;
    font-size: 16px;
}

/* Bölmə başlığı */
.design_process .section_title {
    font-size: 32px;
    width: 40%;
    font-weight: bold;
    margin-bottom: 40px;
}

/* Addımlar konteyneri */
.design_process .design_steps {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

/* Hər bir addım üçün blok */
.design_process .design_steps .step {
    display: flex;
    flex-wrap: wrap;
    border-bottom: 1px solid #ddd;
    padding-bottom: 20px;
}

/* Addım nömrəsi və başlığı olan hissə */
.design_process .design_steps .step .step_info {
    /* flex: 0 0 300px; */
    display: flex;
    font-weight: 500;
    color: #111;
    align-items: center;
    text-transform: uppercase;
    margin-bottom: 10px;
}

/* Addım nömrəsi (01/, 02/...) */
.design_process .design_steps .step .step_info .step_number {
    font-size: 16px;
    color: #999;
}

/* Addım başlığı */
.design_process .design_steps .step .step_info .step_title {
    font-size: 15px;
    margin-left: 40px;
}

/* Addım açıqlaması */
.design_process .design_steps .step .step_description {
    font-size: 15px;
    color: #444;
    line-height: 1.6;
}


/* Home Detailed */

/* SERVICE DETAILED SEE OUR DESIGN */

section.see_our_design.second {
    margin-top: 70px;
}

section.see_our_design.second .container,
section.see_our_design.bg_image .container {
    border-radius: 16px;
    border: 2px solid var(--proweb-gray);

}

section.see_our_design.bg_image .design_img {
    background-color: var(--proweb-gray);
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: 2px solid var(--proweb-gray);
}

section.see_our_design.second .design_img {
    background-color: var(--proweb-gray);
    border-right: 2px solid var(--proweb-gray);
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;

}


/* section.see_our_design {
    min-height: 90vh;
} */

section.see_our_design .section_label {
    margin: 40px 0 40px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

section.see_our_design .section_label p {
    font-size: 26px;
    font-style: italic;
    text-transform: uppercase;
    line-height: 1.5;
}

section.see_our_design .section_label span {
    font-family: "DmSans Bold";
    font-style: normal;
}

section.see_our_design .section_label .arrow {
    width: 80px;
}

section.see_our_design .section_label .arrow img {
    transform: rotate(145deg);
    cursor: pointer;
    width: 100%;
}

.design_img {
    background-color: var(--proweb-gray);
    border-radius: 16px;
    padding: 100px 16px;

    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.design_img:hover {
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
}

.design_img img {
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    width: 100%;
    height: auto;
    border-radius: 12px;
    display: block;
}

section.see_our_design .task_left {
    padding: 44px 60px;
    position: relative;
}

section.see_our_design .task_left h3 {
    font-family: "dmsans";
    font-size: 28px;
    font-style: italic;
    text-transform: uppercase;
    margin-bottom: 40px;
}

@media (max-width: 576px) {
    section.see_our_design .task_left {
        padding: 30px 20px;
    }

    section.see_our_design .task_left h3 {
        font-size: 24px;
    }

    section.see_our_design.bg_image .design_img,
    section.see_our_design.bg_image .container {
        border: none;
        border-radius: 16px;
    }

}

section.see_our_design .task_left h3 span {
    font-style: normal;
    font-family: "DmSans bold";
}

section.see_our_design .task_left .task_desc {
    font-family: "DmSans";
    line-height: 30px;
    font-size: 20px;
}

section.see_our_design .task_left .star_img {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 80px;
    height: 80px;
}

section.see_our_design .task_left .star_img img {
    width: 100%;
    object-fit: cover;
    animation: rotate 3s linear infinite;
}

/* SERVICE DETAILED SEE OUR DESIGN */



/* Tailored */



/* section.tailored {
    min-height: 90vh;
} */

section.tailored .tailoredWrapper {
    background-color: var(--proweb-gray);
    border-radius: 24px;
}

section.tailored .section_label {
    margin-bottom: 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

section.tailored .section_label p {
    font-size: 26px;
    font-style: italic;
    text-transform: uppercase;
    line-height: 1.5;
}

section.tailored .section_label span {
    font-family: "DmSans Bold";
    font-style: normal;
}

section.tailored .section_label .arrow {
    width: 80px;
}

section.tailored .section_label .arrow img {
    transform: rotate(145deg);
    cursor: pointer;
    width: 100%;
}

.tailoredWrapper {
    border-radius: 20px;
    padding: 40px 20px;
    margin-bottom: 60px;
    overflow: hidden;
}

.tailoredWrapper .tailored_img {
    text-align: center;
    border-radius: 24px;
    transition: transform 0.3s ease;
    height: 500px;
}

.tailoredWrapper .tailored_img img {
    max-width: 100%;
    height: 100%;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    border-radius: 16px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}


/* Spacing for large screens */
@media (min-width: 992px) {

    .tailoredWrapper .col-lg-8,
    .tailoredWrapper .col-lg-4 {
        display: flex;
        align-items: center;
        justify-content: center;
    }
}



/* Tailored */




/* Transforming */




section.transforming .section_label {
    margin-bottom: 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

section.transforming .section_label p {
    font-size: 26px;
    font-style: italic;
    text-transform: uppercase;
    line-height: 1.5;
}

section.transforming.service_detailed .section_label p {
    width: 25%;
}

section.transforming .section_label span {
    font-family: "DmSans Bold";
    font-style: normal;
}

section.transforming .section_label .arrow {
    width: 80px;
}

section.transforming .section_label .arrow img {
    transform: rotate(145deg);
    cursor: pointer;
    width: 100%;
}


section.transforming .transforming_wrapper {
    background-color: var(--proweb-gray);
    border-radius: 24px;
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    margin-bottom: 40px;
}

section.transforming .transforming_wrapper .transforming_img {
    height: 90vh;
    overflow-y: auto;
    overflow-x: hidden;
    /* border-radius: 70px; */
    padding-right: 10px;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    position: relative;
}

section.transforming .transforming_wrapper .transforming_img .browser_tab {
    position: sticky;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 2;
}

section.transforming .transforming_wrapper .transforming_img img {
    max-width: 100%;
    height: auto;
    display: block;
    /* border-radius: 12px; */
}

/* section.transforming .transforming_wrapper .transforming_img::-webkit-scrollbar {
    display: none;
} */


/* Transforming */



/* Custom Designs */

section.custom_designs .section_label {
    margin-bottom: 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

section.custom_designs .section_label p {
    font-size: 26px;
    font-style: italic;
    text-transform: uppercase;
    line-height: 1.5;
}

section.custom_designs.service_detailed .section_label p {
    width: 33%;

}

section.custom_designs .section_label span {
    font-family: "DmSans Bold";
    font-style: normal;
}

section.custom_designs .section_label .arrow {
    width: 80px;
}

section.custom_designs .section_label .arrow img {
    transform: rotate(145deg);
    cursor: pointer;
    width: 100%;
}

section.custom_designs .custom_designs_wrapper {
    background-color: var(--proweb-gray);
    border-radius: 24px;
    margin-bottom: 40px;
}

section.custom_designs .custom_designs_wrapper .swiper-wrapper .swiper-slide img {
    width: 75%;
    border-radius: 40px;
}



/* Custom Designs */

/* About Project */

/* Section base */
.about_project {
    background-color: #fff;
    font-family: 'Inter', sans-serif;
    color: #1a1a1a;
}

/* Label */
.about_project .section_label p {
    color: #FF5722;
    font-weight: 500;
    font-family: "DmSans";
    font-size: 14px;
    margin-bottom: 8px;
    text-transform: uppercase;
}

/* Title */
.about_project .title h2 {
    font-size: 40px;
    font-weight: 700;
    margin-bottom: 24px;
}

.about_project .title .status p {
    border: 1px solid var(--proweb-black);
    background-color: rgba(255, 255, 255, 0.3);
    backdrop-filter: blur(10px);
    /* Blur effect */
    border-radius: 35px;
    padding: 10px 20px 10px 40px;
    font-family: "DmSans";
}

.about_project .title .status p:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(20px, -50%);
    width: 10px;
    height: 10px;
    background-color: var(--proweb-black);
    border-radius: 100%;
}

/* Description Paragraphs */
.about_project .project_desc p {
    font-size: 17px;
    line-height: 1.6;
    font-family: "DmSans";
    margin-bottom: 16px;
}

/* Left Column */
.about_project .left ul {
    display: flex;
    gap: 30px;
    padding: 0;
    list-style: none;
    margin: 30px 0;
}

.about_project .left ul li a {
    display: flex;
    align-items: center;
    gap: 8px;
    text-decoration: underline;
    color: #1a1a1a;
    font-weight: 500;
    font-size: 15px;
    transition: all 0.2s ease;
}

.about_project .left ul li a:hover {
    color: var(--proweb-orange);
    text-decoration: underline;
}

.about_project .left .section_label {
    color: var(--proweb-orange);
    margin-top: 50px;
    font-family: "dmSans";
    font-size: 16px;
    margin-bottom: 0;
}

.about_project .left .services {
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
    margin-bottom: 30px;
}

.about_project .left .services li {
    padding: 8px 14px;
    font-size: 13px;
    font-weight: 500;
    color: #333;
    border-radius: 999px;
    border: 1px solid #e0e0e0;
    white-space: nowrap;
}

.about_project .left .key_words li {
    text-decoration: none;
    padding: 10px 15px;
    border-radius: 35px;
    background-color: #ececec;
    color: #828282;
}

.about_project .left .arrow_animation img {
    width: 14px;
    transition: transform 0.2s ease;
}

.about_project .left ul li a:hover .arrow_animation .picture {
    transform: translateX(0);
}

/* Right Column */
.about_project .right {
    background-color: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 16px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    height: fit-content;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.03);
}

.about_project .right .item {
    display: flex;
    padding: 10px 0;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #ececec;
}

.about_project .right .item_title {
    font-size: 14px;
    color: #666;
    margin-bottom: 4px;
}

.about_project .right .item_description {
    font-weight: 600;
    font-size: 15px;
    color: #000;
    display: flex;
    align-items: center;
    text-transform: uppercase;
    position: relative;
}

/* Team images */
.about_project .right .item_description img {
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);

}

.about_project .right .item_description img:nth-child(1) {
    right: 15px;
    z-index: 3;
}

.about_project .right .item_description img:nth-child(2) {
    right: 30px;
    z-index: 2;
}

.about_project .right .item_description img:nth-child(3) {
    right: 50px;
    z-index: 1;
}

.about_project .right .item_description img {
    width: 36px;
    height: 36px;
    object-fit: cover;
    border-radius: 50%;
    margin-right: 6px;
    margin-bottom: 10px;
}

.about_project .right .item_description p {
    display: inline-block;
    font-weight: 600;
    font-size: 14px;
    position: absolute;
    z-index: 5;
    right: 0;
    background-color: var(--proweb-gray);
    border: 1px solid #ececec;
    border-radius: 100%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Services */
.about_project .right .services p {
    font-size: 15px;
    margin-bottom: 12px;
    font-size: 14px;
    color: #666;
}

.about_project .right .services ul {
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.about_project .right .services ul li {
    padding: 8px 14px;
    font-size: 13px;
    font-weight: 500;
    color: #333;
    border-radius: 999px;
    border: 1px solid #e0e0e0;
    white-space: nowrap;
}


/* About Project */


/* Tech Used */
section.tech_used {
    margin: 30px 0 60px 0;
}

section.tech_used .tech_used_wrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 60px;
}

section.tech_used .tech_used_wrapper .item .title {
    color: var(--proweb-orange);
    font: 400 16px/16px "DMSans", sans-serif;
    text-align: left;
    margin-bottom: 20px;
    text-transform: uppercase;
    position: relative;
}

section.tech_used .tech_used_wrapper .item .title:before {
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 100%;
    background-color: var(--proweb-orange);
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(-10px, -50%);
}

section.tech_used .tech_used_wrapper .item .description {
    color: var(--proweb-black);
    font: 400 20px/26px "DMSans", sans-serif;
    text-align: left;
}

section.tech_used .tech_used_wrapper .item .technologies {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 16px;
}

section.tech_used .tech_used_wrapper .item .technologies .technology_item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 32px;
    border-radius: 40px;
    background: var(--proweb-gray);
    overflow: hidden;
}

section.tech_used .tech_used_wrapper .item .technologies .technology_item .icon {
    width: 24px;
    height: 27.05px;
    margin-right: 8px;
}

section.tech_used .tech_used_wrapper .item .technologies .technology_item .text {
    color: var(--proweb-black);
    font: 400 20px/26px "DMSans", sans-serif;
}

/* Tech Used */


/* Before After */
section.before_after {
    margin: 0 0 120px 0;
}

section.before_after .section_label {
    color: var(--proweb-orange);
    display: block;
    margin: 40px 0 20px 0;
    text-transform: uppercase;
    font-size: 16px;
    font-family: "DmSans";
}

section.before_after .before_after_wrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    background-color: var(--proweb-gray);
    gap: 120px;
    border-radius: 24px;
    padding: 30px;
}

section.before_after .before_after_wrapper .item {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 60px;
}

section.before_after .before_after_wrapper .item .left {
    width: calc(55% - 60px);
}

section.before_after .before_after_wrapper .item .right {
    width: 45%;
}

section.before_after .before_after_wrapper .item.context {
    background-color: var(--proweb-white);
    border-radius: 24px;
    padding: 12px;
}

section.before_after .before_after_wrapper .item.context .left {
    padding-right: 160px;
    position: relative;
}

section.before_after .before_after_wrapper .item.context .left .arrowLeft {
    width: 100px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

section.before_after .before_after_wrapper .item.context .left .arrowDown {
    height: 100px;
    position: absolute;
    top: calc(100% + 35px);
    left: 50%;
    transform: translateX(-50%);
}

section.before_after .before_after_wrapper .item.context .right {
    padding-right: 100px;
}

section.before_after .before_after_wrapper .item .title {
    color: var(--proweb-black);
    font: 500 40px/40px "DMSans Medium", sans-serif;
    text-align: left;
    margin: 0 0 16px 0;
}

section.before_after .before_after_wrapper .item .title.color {
    color: var(--proweb-orange);
}

section.before_after .before_after_wrapper .item .description {
    color: var(--proweb-black);
    font: 400 24px/31px "DMSans", sans-serif;
    text-align: left;
}

section.before_after .before_after_wrapper .item .description span.color {
    color: var(--proweb-orange);
    font: 700 24px/31px "DMSans Bold", sans-serif;
}

section.before_after .before_after_wrapper .item .description span.bold {
    font: 700 24px/31px "DMSans Bold", sans-serif;
}

section.before_after .before_after_wrapper .item .media_wrapper {
    outline: none;
    border: none;
    background: #0000001F;
    width: 100%;
    overflow: hidden;
    border-radius: 16px;
}

section.before_after .before_after_wrapper .item .media_wrapper video {
    width: 100%;
    height: 100%;
    border: none !important;
    outline: none !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-tap-highlight-color: transparent !important;
}

section.before_after .before_after_wrapper .item .media_wrapper video,
section.before_after .before_after_wrapper .item .media_wrapper img,
section.before_after .before_after_wrapper .item .media_wrapper iframe,
section.before_after .before_after_wrapper .item .media_wrapper svg {
    transition: 1s;
    filter: grayscale(100%);
}

section.before_after .before_after_wrapper .item .media_wrapper:hover video,
section.before_after .before_after_wrapper .item .media_wrapper:hover img,
section.before_after .before_after_wrapper .item .media_wrapper:hover iframe,
section.before_after .before_after_wrapper .item .media_wrapper:hover svg {
    filter: grayscale(0);
}

/* Before After */



/* Gallery */
section.gallery {
    margin: 0 0 120px 0;
}

section.gallery .gallery_wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 80px;
}

section.gallery .gallery_wrapper .item {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 80px;
}

section.gallery .gallery_wrapper .item.doubled .media_wrapper:first-child {
    width: 42%;
}

section.gallery .gallery_wrapper .item.doubled .media_wrapper:last-child {
    width: calc(58% - 80px);
}

section.gallery .gallery_wrapper .item .media_wrapper {
    outline: none;
    border: none;
    background: #0000001F;
    width: 100%;
    height: 580px;
    overflow: hidden;
    border-radius: 20px;
}

section.gallery .gallery_wrapper .item .media_wrapper video {
    width: 100%;
    height: 100%;
    border: none !important;
    outline: none !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-tap-highlight-color: transparent !important;
}

section.gallery .gallery_wrapper .item .media_wrapper video,
section.gallery .gallery_wrapper .item .media_wrapper img,
section.gallery .gallery_wrapper .item .media_wrapper iframe,
section.gallery .gallery_wrapper .item .media_wrapper svg {
    transition: 1s;
    filter: grayscale(100%);
}

section.gallery .gallery_wrapper .item .media_wrapper:hover video,
section.gallery .gallery_wrapper .item .media_wrapper:hover img,
section.gallery .gallery_wrapper .item .media_wrapper:hover iframe,
section.gallery .gallery_wrapper .item .media_wrapper:hover svg {
    filter: grayscale(0);
}

/* Gallery */


/* Color Zone */
section.color_zone {
    margin: 0 0 120px 0;
}

section.color_zone .color_zone_wrapper {
    border: 1px solid var(--proweb-gray);
    border-radius: 20px;
    padding: 70px 40px;
}

section.color_zone .color_zone_wrapper .color_zone_title {
    color: var(--proweb-black);
    font: italic 300 40px/40px "DMSans Light", sans-serif;
    text-align: left;
    margin: 0 0 44px 0;
    text-transform: uppercase;
}

section.color_zone .color_zone_wrapper .color_zone_title span {
    color: var(--proweb-black);
    font: 300 40px/40px "DMSans", sans-serif;
    text-align: left;
}

section.color_zone .color_zone_wrapper .items {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 32px;
}

section.color_zone .color_zone_wrapper .items .item {
    height: 418px;
    border-radius: 16px;
    overflow: hidden;
    background: #0000001F;
}

section.color_zone .color_zone_wrapper .items .item:nth-child(-n+3) {
    width: calc((100% - 2 * 32px) / 3);
}

section.color_zone .color_zone_wrapper .items .item:nth-child(4) {
    width: calc(60% - 32px);
}

section.color_zone .color_zone_wrapper .items .item:nth-child(5) {
    width: 40%;
}

section.color_zone .color_zone_wrapper .items .item:nth-child(6) {
    width: calc((100% - 1 * 32px) / 2);
}

section.color_zone .color_zone_wrapper .items .item:nth-child(7) {
    width: calc((100% - 1 * 32px) / 2);
}

section.color_zone .color_zone_wrapper .items .item .media_wrapper {
    outline: none;
    border: none;
    background: #0000001F;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 20px;
}

section.color_zone .color_zone_wrapper .items .item .media_wrapper video {
    width: 100%;
    height: 100%;
    border: none !important;
    outline: none !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-tap-highlight-color: transparent !important;
}

section.color_zone .color_zone_wrapper .items .item .media_wrapper video,
section.color_zone .color_zone_wrapper .items .item .media_wrapper img,
section.color_zone .color_zone_wrapper .items .item .media_wrapper iframe,
section.color_zone .color_zone_wrapper .items .item .media_wrapper svg {
    transition: 1s;
    filter: grayscale(100%);
}

section.color_zone .color_zone_wrapper .items .item .media_wrapper:hover video,
section.color_zone .color_zone_wrapper .items .item .media_wrapper:hover img,
section.color_zone .color_zone_wrapper .items .item .media_wrapper:hover iframe,
section.color_zone .color_zone_wrapper .items .item .media_wrapper:hover svg {
    filter: grayscale(0);
}

/* Color Zone */



/* Other Works Section */
section.otherWorks {
    margin: 0 0 120px 0;
}

section.otherWorks .otherWorks_heading .title {
    font: 400 40px/40px "HelveticaNeue", sans-serif;
    text-align: left;
    color: var(--proweb-black);
    margin: 0 0 16px 0;
}

section.otherWorks .otherWorks_heading .description {
    margin: 0 0 40px 0;
    font: 400 20px/26px "DMSans", sans-serif;
    text-align: left;
    color: #727272;
    width: 700px;
}

section.otherWorks .otherWorks_swiper_wrapper {
    margin: 60px 0 0 0;
}


section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide:first-child {
    margin-left: 110px;
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide {
    width: 636px;
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide:not(:last-child) {
    margin-right: 24px;
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper {
    outline: none;
    border: none;
    background: var(--proweb-gray);
    height: 485px;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    margin: 0 0 16px 0;
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper .technologies {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 12px;
    position: absolute;
    bottom: -100%;
    left: 16px;
    z-index: 2;
    transition: 0.3s;
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper:hover .technologies {
    bottom: 16px;
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper .technologies .technology_item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 12px;
    border-radius: 40px;
    background: var(--proweb-gray);
    overflow: hidden;
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper .technologies .technology_item .icon {
    width: 16px;
    height: 18.03px;
    margin-right: 8px;
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper .technologies .technology_item .text {
    color: var(--proweb-black);
    font: 400 14px/18px "DMSans", sans-serif;
}


section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper .badge {
    position: absolute;
    z-index: 2;
    top: 16px;
    left: 16px;
    max-width: calc(100% - 32px);
    overflow: hidden;
    padding: 8px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    background: #00000099;
    backdrop-filter: blur(8px);
    border-radius: 40px;
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper .badge span {
    color: var(--proweb-white);
    font: 400 14px/18px "DMSans", sans-serif;
    text-align: center;
    position: relative;
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper .badge span:not(:first-child)::after {
    content: "";
    position: absolute;
    top: 50%;
    left: -10px;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--proweb-white);
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper video {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 10px;
    width: 100%;
    height: 100%;
    border: none !important;
    outline: none !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-tap-highlight-color: transparent !important;
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper video,
section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper img,
section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper iframe,
section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper svg {
    transition: 1s;
    filter: grayscale(100%);
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper:hover video,
section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper:hover img,
section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper:hover iframe,
section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper:hover svg {
    filter: grayscale(0);
    transform: scale(1.1);
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .media_wrapper.imageScale:hover img {
    transform: scale(1.1);
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .solution_title {

    color: #414141;
    font-size: 20px;
    font-family: "DmSans medium";
    margin-bottom: 5px;
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide .description {
    margin: 0 0 16px 0;
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: left;
    height: 42px;
    color: #414141;
    display: block !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 5px 5px 5px 0;
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide a .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 24px/24px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide a:hover .arrow_animation .picture {
    transform: translateX(0);
}


section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide a .context::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -5px;
    height: 0.8px;
    width: 0;
    background: var(--proweb-black);
    transition: 0.3s;
}

section.otherWorks .otherWorks_swiper_wrapper .swiper .swiper-wrapper .swiper-slide a:hover .context::after {
    width: 100%;
}

/* Other Works Section */



/* Bring Ideas */
section.bring_ideas {
    margin: 0 0 120px 0;
}

section.bring_ideas .bring_ideas_wrapper {
    border-radius: 20px;
    background: var(--proweb-gray);
    position: relative;
    overflow: hidden;
}

section.bring_ideas .bring_ideas_wrapper .bring_ideas_background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: 3s;
}

@media only screen and (max-width: 1399.98px) {
    section.bring_ideas .bring_ideas_wrapper .bring_ideas_background {
        display: none;
    }
}

section.bring_ideas .bring_ideas_wrapper .bring_ideas_background .img {
    position: absolute;
    width: 120px;
    height: 120px;
    transform: rotate(135deg);
    transition: 1.5s;
}

section.bring_ideas .bring_ideas_wrapper .bring_ideas_background .img:nth-child(1) {
    top: 120%;
    left: -20%;
}

section.bring_ideas .bring_ideas_wrapper .bring_ideas_background .img.active:nth-child(1) {
    top: -50%;
    left: 40%;
}

section.bring_ideas .bring_ideas_wrapper .bring_ideas_background .img:nth-child(3) {
    top: 120%;
    right: 70%;
}

section.bring_ideas .bring_ideas_wrapper .bring_ideas_background .img.active:nth-child(3) {
    top: -50%;
    right: 10%;
}

section.bring_ideas .bring_ideas_wrapper .bring_ideas_background .img:nth-child(2) {
    top: 160%;
    left: -10%;
}

section.bring_ideas .bring_ideas_wrapper .bring_ideas_background .img.active:nth-child(2) {
    top: -50%;
    left: 60%;
}

section.bring_ideas .bring_ideas_wrapper .bring_ideas_background .img:nth-child(4) {
    top: 170%;
    left: 30%;
}

section.bring_ideas .bring_ideas_wrapper .bring_ideas_background .img.active:nth-child(4) {
    top: -70%;
    left: 110%;
}

section.bring_ideas .bring_ideas_wrapper .bring_ideas_context {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 117px 278px;
}

section.bring_ideas .bring_ideas_wrapper .title {
    color: var(--proweb-black);
    font: 400 64px/64px "HelveticaNeue", sans-serif;
    text-align: center;
    margin: 0 0 12px 0;
}

section.bring_ideas .bring_ideas_wrapper .title span {
    color: var(--proweb-orange);
    font: italic 300 64px/64px "HelveticaNeue Light", sans-serif;
}

section.bring_ideas .bring_ideas_wrapper .description {
    color: var(--proweb-black);
    font: 300 28px/36px "DMSans Light", sans-serif;
    text-align: center;
    margin: 0 0 44px 0;
    width: 80%;
}

section.bring_ideas .bring_ideas_wrapper a {
    padding: 15px 21px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border: 1px solid var(--proweb-black);
    border-radius: 40px;
}

section.bring_ideas .bring_ideas_wrapper a .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 24px/24px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

section.bring_ideas .bring_ideas_wrapper a:hover .arrow_animation .picture {
    transform: translateX(0);
}

/* Bring Ideas */



/* Client Review Section */
section.client_review {
    margin: 0 0 120px 0;
}

section.client_review .client_review_wrapper .title {
    font: 400 40px/40px "HelveticaNeue", sans-serif;
    text-align: left;
    color: var(--proweb-black);
    margin: 0 0 32px 0;
}

section.client_review .client_review_wrapper .client_review_items {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 95px;
}

section.client_review .client_review_wrapper .client_review_items .left {
    width: 505px;
    padding: 0;
}

section.client_review .client_review_wrapper .client_review_items .right {
    width: calc((100% - 505px - 95px));
    padding: 0;
}

section.client_review .client_review_wrapper .client_review_items .left .picture_wrapper {
    width: 381px;
    height: 533px;
    border-radius: 16px;
    border: 1px solid var(--proweb-black);
    position: relative;
}

section.client_review .client_review_wrapper .client_review_items .left .picture_wrapper .picture_inner_wrapper {
    position: absolute;
    top: 52px;
    left: 90px;
    width: 414px;
    height: 429px;
    overflow: hidden;
    border-radius: 16px;
}

section.client_review .client_review_wrapper .client_review_items .right .quotes {
    width: 60px;
    height: 60px;
    margin: 0 0 8px 0;
}

section.client_review .client_review_wrapper .client_review_items .right .description {
    font: 400 36px/47px "DMSans", sans-serif;
    text-align: left;
    color: var(--proweb-black);
    margin: 0 0 44px 0;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 6 !important;
    line-clamp: 6 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.client_review .client_review_wrapper .client_review_items .right .description span {
    font: 700 36px/47px "DMSans Bold", sans-serif;
}

section.client_review .client_review_wrapper .client_review_items .right .references_wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 30px;
}

section.client_review .client_review_wrapper .client_review_items .right .references_wrapper>div {
    width: calc((100% - 30px) / 2);
}

section.client_review .client_review_wrapper .client_review_items .right .references_wrapper .left .name {
    font: 700 24px/31px "DMSans Bold", sans-serif;
    text-align: left;
    color: var(--proweb-black);
    margin: 0 0 4px 0;
}

section.client_review .client_review_wrapper .client_review_items .right .references_wrapper .left .profession {
    font: 500 16px/21px "DMSans Medium", sans-serif;
    text-align: left;
    color: var(--proweb-black);
}

section.client_review .client_review_wrapper .client_review_items .right .references_wrapper .right {
    display: flex;
    justify-content: flex-end;
}

section.client_review .client_review_wrapper .client_review_items .right .references_wrapper .right a {
    padding: 15px 21px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border: 1px solid var(--proweb-black);
    border-radius: 40px;
}

section.client_review .client_review_wrapper .client_review_items .right .references_wrapper .right a .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 24px/24px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

section.client_review .client_review_wrapper .client_review_items .right .references_wrapper .right a:hover .arrow_animation .picture {
    transform: translateX(0);
}

/* Client Review Section */




/* Client Review Carousel Section */
section.client_review.carousel_section .client_review_wrapper .title {
    margin: 0 0 16px 0;
}

section.client_review.carousel_section .client_review_wrapper .review_description {
    margin: 0 0 60px 0;
    font: 400 20px/26px "DMSans", sans-serif;
    text-align: left;
    color: #727272;
    padding-right: 148px;
}

section.client_review.carousel_section .review_swiper .swiper-button-next,
section.client_review.carousel_section .review_swiper .swiper-button-prev {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: var(--proweb-gray);
    transition: 0.3s;
    position: absolute;
    overflow: hidden;
    user-select: none;
    top: unset;
    bottom: 0;
}

section.client_review.carousel_section .review_swiper .swiper-button-next {
    bottom: 30px;
}

section.client_review.carousel_section .review_swiper .swiper-button-prev {
    left: unset;
    right: calc(10px + 64px + 16px);
    bottom: 30px;
}

section.client_review.carousel_section .review_swiper .swiper-button-next:hover,
section.client_review.carousel_section .review_swiper .swiper-button-prev:hover {
    background: var(--proweb-orange);
}

section.client_review.carousel_section .review_swiper .swiper-button-next::after,
section.client_review.carousel_section .review_swiper .swiper-button-prev::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
    transition: 0.3s;
    user-select: none;
}

section.client_review.carousel_section .review_swiper .swiper-button-next .svg,
section.client_review.carousel_section .review_swiper .swiper-button-prev .svg {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s;
}

section.client_review.carousel_section .review_swiper .swiper-button-next .svg img,
section.client_review.carousel_section .review_swiper .swiper-button-prev .svg img {
    width: 24px;
    height: 24px;
}

section.client_review.carousel_section .review_swiper .swiper-button-next::after {
    background-image: url(../images/svg/arrow_Right_Dark.svg);
}

section.client_review.carousel_section .review_swiper .swiper-button-next .svg {
    transform: translateX(-100%);
}

section.client_review.carousel_section .review_swiper .swiper-button-next:hover .svg {
    transform: translateX(0);
}

section.client_review.carousel_section .review_swiper .swiper-button-next:hover::after {
    transform: translateX(100%);
}

section.client_review.carousel_section .review_swiper .swiper-button-prev::after {
    background-image: url(../images/svg/arrow_Left_Dark.svg );
}

section.client_review.carousel_section .review_swiper .swiper-button-prev .svg {
    transform: translateX(100%);
}

section.client_review.carousel_section .review_swiper .swiper-button-prev:hover .svg {
    transform: translateX(0);
}

section.client_review.carousel_section .review_swiper .swiper-button-prev:hover::after {
    transform: translateX(-100%);
}

/* Client Review Carousel Section */



/* Portfolio Section */
section.portfolio form.portfolio_wrapper {
    margin: 0 0 120px 0;
}

section.portfolio form.portfolio_wrapper .load_more {
    display: flex;
    align-items: center;
    border-radius: 35px;
    border: 1px solid var(--proweb-black);
    padding: 12px 24px;
    margin: 50px auto;
    width: fit-content;
    cursor: pointer;
    transition: all .3s;

}

section.portfolio form.portfolio_wrapper .load_more:hover {
    background-color: var(--proweb-orange);
    border-color: var(--proweb-orange);
    color: var(--proweb-white);
}

section.portfolio form.portfolio_wrapper .load_more:hover .arrow_animation .picture {
    transform: translateX(0);
}

section.portfolio .portfolio_wrapper .portfolio_filtering {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-self: flex-start;
    gap: 12px;
    padding-bottom: 80px;
}

section.portfolio .portfolio_wrapper .portfolio_filtering li a {
    display: block;
    width: 100%;
    height: 100%;
    text-align: center;
    color: var(--proweb-black);
    font: 500 16px/21px 'DMSans', sans-serif;
    padding: 12px 40px;
    border-radius: 40px;
    border: 1px solid var(--proweb-black);
    transition: all .6s;
}

section.portfolio .portfolio_wrapper .portfolio_filtering li a:hover {
    background-color: var(--proweb-orange);
    color: var(--proweb-white);
    border-color: var(--proweb-white);
}

section.portfolio .portfolio_wrapper .portfolio_filtering li.active a {
    background: var(--proweb-orange);
    color: var(--proweb-white);
    border: 1px solid var(--proweb-orange);
}

.portfolio_items {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    column-gap: 24px;
    row-gap: 60px;
}

.portfolio_items .portfolio_item {
    width: calc((100% - 1 * 24px) / 2);
    padding: 0;
}

.portfolio_items .portfolio_item .portfolio_title {
    color: #414141;
    font-size: 20px;
    font-family: "DmSans medium";
    margin-bottom: 5px;
}

.portfolio_items .portfolio_item .media_wrapper {
    outline: none;
    border: none;
    background: var(--proweb-gray);
    width: 100%;
    height: 485px;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    margin: 0 0 16px 0;
}

.portfolio_items .portfolio_item .media_wrapper .technologies {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 12px;
    position: absolute;
    bottom: -100%;
    left: 16px;
    z-index: 2;
    transition: 0.3s;
}

.portfolio_items .portfolio_item .media_wrapper:hover .technologies {
    bottom: 16px;
}

.portfolio_items .portfolio_item .media_wrapper .technologies .technology_item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 12px;
    border-radius: 40px;
    background: var(--proweb-gray);
    overflow: hidden;
}

.portfolio_items .portfolio_item .media_wrapper .technologies .technology_item .icon {
    width: 16px;
    height: 18.03px;
    margin-right: 8px;
}

.portfolio_items .portfolio_item .media_wrapper .technologies .technology_item .text {
    color: var(--proweb-black);
    font: 400 14px/18px "DMSans", sans-serif;
}

.portfolio_items .portfolio_item .media_wrapper .badge {
    position: absolute;
    z-index: 2;
    top: 16px;
    left: 16px;
    max-width: calc(100% - 32px);
    overflow: hidden;
    padding: 8px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    background: #00000099;
    backdrop-filter: blur(8px);
    border-radius: 40px;
}

.portfolio_items .portfolio_item .media_wrapper .badge span {
    color: var(--proweb-white);
    font: 400 14px/18px "DMSans", sans-serif;
    text-align: center;
    position: relative;
}

.portfolio_items .portfolio_item .media_wrapper .badge span:not(:first-child)::after {
    content: "";
    position: absolute;
    top: 50%;
    left: -10px;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--proweb-white);
}

.portfolio_items .portfolio_item .media_wrapper video {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 10px;
    width: 100%;
    height: 100%;
    border: none !important;
    outline: none !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-tap-highlight-color: transparent !important;
}

.portfolio_items .portfolio_item .media_wrapper video,
.portfolio_items .portfolio_item .media_wrapper img,
.portfolio_items .portfolio_item .media_wrapper iframe,
.portfolio_items .portfolio_item .media_wrapper svg {
    transition: 1s;
    filter: grayscale(100%);
}

.portfolio_items .portfolio_item .media_wrapper:hover video,
.portfolio_items .portfolio_item .media_wrapper:hover img,
.portfolio_items .portfolio_item .media_wrapper:hover iframe,
.portfolio_items .portfolio_item .media_wrapper:hover svg {
    filter: grayscale(0);
    transform: scale(1.1);
}

.portfolio_items .portfolio_item .media_wrapper.imageScale:hover img {
    transform: scale(1.1);
}

.portfolio_items .portfolio_item .description {
    margin: 0 0 16px 0;
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: left;
    height: 42px;
    color: #414141;
    display: block !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

.portfolio_items .portfolio_item a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 5px 5px 5px 0;
}


.portfolio_items .portfolio_item .img_link {
    width: 100%;
    height: 100%;
    padding: 0;
}

.portfolio_items .portfolio_item a .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 24px/24px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

.portfolio_items .portfolio_item a .context::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -5px;
    height: 0.8px;
    width: 0;
    background: var(--proweb-black);
    transition: 0.3s;
}

.portfolio_items .portfolio_item a:hover .context::after {
    width: 100%;
}

.portfolio_items .portfolio_item a:hover .arrow_animation .picture {
    transform: translateX(0);
}

/* Portfolio Section */



/* Services Section */
section.services .services_items {
    margin: 0 0 120px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    column-gap: 32px;
    row-gap: 52px;
}

section.services .services_items .services_item {
    width: calc((100% - 1 * 32px) / 2);
    background: var(--proweb-gray);
    border-radius: 20px;
    padding: 52px 40px;
}

section.services .services_items .services_item .services_picture {
    width: 260px;
    height: 210px;
    border-radius: 16px;
    border: 1px solid #161616;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 40px 0;
    background: var(--proweb-white);
}

section.services .services_items .services_item .services_picture svg {
    width: 120px;
    height: 120px;
}


section.services .services_items .services_item:nth-child(1) .services_picture,
section.services .services_items .services_item:nth-child(4n) .services_picture,
section.services .services_items .services_item:nth-child(4n + 1) .services_picture {
    border: 1px solid var(--proweb-orange);
}

section.services .services_items .services_item .services_picture svg path,
section.services .services_items .services_item .services_picture svg rect,
section.services .services_items .services_item .services_picture svg circle {
    stroke: #161616;
}

section.services .services_items .services_item:nth-child(1) .services_picture svg path,
section.services .services_items .services_item:nth-child(1) .services_picture svg rect,
section.services .services_items .services_item:nth-child(1) .services_picture svg circle,
section.services .services_items .services_item:nth-child(4n) .services_picture svg path,
section.services .services_items .services_item:nth-child(4n) .services_picture svg rect,
section.services .services_items .services_item:nth-child(4n) .services_picture svg circle,
section.services .services_items .services_item:nth-child(4n + 1) .services_picture svg path,
section.services .services_items .services_item:nth-child(4n + 1) .services_picture svg rect,
section.services .services_items .services_item:nth-child(4n + 1) .services_picture svg circle {
    stroke: var(--proweb-orange);
}

section.services .services_items .services_item .services_description {
    height: 52px;
    color: var(--proweb-black);
    font: 400 20px/26px "DMSans", sans-serif;
    text-align: left;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
    margin: 12px 0 0 0;
}


section.services .services_items .services_item a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

section.services .services_items .services_item a .context {
    max-width: calc((100% - 4px - 32px));
    color: var(--proweb-black);
    font: 400 38px/48px "HelveticaNeue", sans-serif;
    height: 48px;
    text-align: left;
    position: relative;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.services .services_items .services_item a .context::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: 0.8px;
    width: 0px;
    background: var(--proweb-black);
    transition: 0.3s;
}

section.services .services_items .services_item a:hover .context::after {
    width: 100%;
}

section.services .services_items .services_item a .arrow_animation {
    width: 32px;
    height: 32px;
}

section.services .services_items .services_item a .arrow_animation .picture {
    width: 32px;
    height: 32px;
}

section.services .services_items .services_item a .arrow_animation .picture img {
    width: 32px;
    height: 32px;
}

section.services .services_items .services_item a .arrow_animation .picture::before {
    width: 32px;
    height: 32px;
}

section.services .services_items .services_item a:hover .arrow_animation .picture {
    transform: translateX(0);
}

/* Services Section */



/* Contact Us */
section.contact {
    margin: 0 0 120px 0;
}

section.contact .contact_wrapper .contact_info {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 128px;
    margin: 0 0 120px 0;
}

section.contact .contact_wrapper .contact_info .right {
    width: calc((100% - 128px - 415px));
    height: 480px;
    background: #0000001F;
    border-radius: 20px;
    overflow: hidden;
    padding: 0;
}

section.contact .contact_wrapper .contact_info .left {
    width: 415px;
    padding: 0;
}

section.contact .contact_wrapper .contact_info .left .contact_nav {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 40px;
}

section.contact .contact_wrapper .contact_info .left .contact_nav .contact_nav_item {
    width: 100%;
}

section.contact .contact_wrapper .contact_info .left .contact_nav .contact_nav_item .title {
    width: 100%;
    color: var(--proweb-black);
    font: 500 28px/36px "DMSans Medium", sans-serif;
    text-align: left;
    margin: 0 0 8px 0;
}

section.contact .contact_wrapper .contact_info .left .contact_nav .contact_nav_item ul {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 8px;
}

section.contact .contact_wrapper .contact_info .left .contact_nav .contact_nav_item ul li a {
    display: inline-block;
    width: 100%;
    padding: 8px 0;
    color: var(--proweb-black);
    font: 400 20px/26px "DMSans", sans-serif;
    text-align: left;
    position: relative;
}

section.contact .contact_wrapper .contact_info .left .contact_nav .contact_nav_item ul li a.underline::after {
    content: "";
    position: absolute;
    bottom: 0px;
    left: 0;
    height: 0.8px;
    width: 0;
    background: var(--proweb-black);
    transition: 0.3s;
}

section.contact .contact_wrapper .contact_info .left .contact_nav .contact_nav_item ul li:hover a.underline::after {
    width: 100%;
}

section.contact .contact_wrapper .contact_info .left .contact_nav .contact_nav_item ul.social_icons {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 20px;
    margin-top: 16px;
}

section.contact .contact_wrapper .contact_info .left .contact_nav .contact_nav_item ul.social_icons li {
    width: 48px;
    height: 48px;
}

section.contact .contact_wrapper .contact_info .left .contact_nav .contact_nav_item ul.social_icons li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 2px solid var(--proweb-black);
    transition: 0.3s;
}

section.contact .contact_wrapper .contact_info .left .contact_nav .contact_nav_item ul.social_icons li a svg {
    display: block;
    width: 24px;
    height: 24px;
}

section.contact .contact_wrapper .contact_info .left .contact_nav .contact_nav_item ul.social_icons li a svg path {
    fill: var(--proweb-black);
    transition: 0.3s;
}

section.contact .contact_wrapper .contact_info .left .contact_nav .contact_nav_item ul.social_icons li:hover a {
    border: 2px solid var(--proweb-orange);
}

section.contact .contact_wrapper .contact_info .left .contact_nav .contact_nav_item ul.social_icons li:hover a svg path {
    fill: var(--proweb-orange);
}

section.contact .contact_wrapper .contact_form {
    background: var(--proweb-orange);
    padding: 60px;
    border-radius: 20px;
}

section.contact .contact_wrapper .contact_form .title {
    color: var(--proweb-white);
    font: 700 44px/44px "HelveticaNeue Bold", sans-serif;
    text-align: left;
    width: 880px;
}

section.contact .contact_wrapper .contact_form .footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 32px;
}

section.contact .contact_wrapper .contact_form .footer button {
    padding: 17px 54px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: none;
    outline: none;
    box-shadow: none;
    border: 1px solid var(--proweb-white);
    background: var(--proweb-white);
    border-radius: 40px;
}

section.contact .contact_wrapper .contact_form .footer button .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 24px/24px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

section.contact .contact_wrapper .contact_form .footer button:hover .arrow_animation .picture {
    transform: translateX(0);
}

section.contact .contact_wrapper .contact_form .footer .description {
    width: 350px;
    color: #FFAC85;
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: left;
}

section.contact .contact_wrapper .contact_form .footer .description a {
    color: #FFAC85;
    position: relative;
}

section.contact .contact_wrapper .contact_form .footer .description a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 2px;
    width: 100%;
    height: 0.8px;
    background: #FFAC85;
}

section.contact .contact_wrapper .contact_form .main_form {
    margin: 60px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    column-gap: 24px;
    row-gap: 52px;
}



section.contact .contact_wrapper .contact_form .main_form .input_wrapper {
    border-bottom: 1px solid #FFAC85;
    margin: 20px 0;
}

section.contact .contact_wrapper .contact_form .main_form .input_wrapper input {
    background: transparent;
    border: none;
    outline: none;
    box-shadow: none;
    color: var(--proweb-white);
    font: 600 16px/21px "DMSans SemiBold", sans-serif;
    text-align: left;
    padding-left: 0;
    padding-right: 0;
}

section.contact .contact_wrapper .contact_form .main_form .input_wrapper label {
    color: var(--proweb-white);
    font: 600 16px/21px "DMSans SemiBold", sans-serif;
    text-align: left;
    padding-left: 0;
    padding-right: 0;
}

/* Contact Us */



/* About Us */
section.about {
    margin: 0 0 120px 0;
}

section.about .about_wrapper .about_banner {
    background: var(--proweb-gray);
    height: 440px;
    background: #0000001F;
    border-radius: 20px;
    overflow: hidden;
    margin: 0 0 120px 0;
}

section.about .about_wrapper .media_wrapper {
    outline: none;
    border: none;
    background: #0000001F;
    width: 100%;
    height: 100%;
}

section.about .about_wrapper .media_wrapper video {
    width: 100%;
    height: 100%;
    border: none !important;
    outline: none !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-tap-highlight-color: transparent !important;
}

section.about .about_wrapper .media_wrapper video,
section.about .about_wrapper .media_wrapper img,
section.about .about_wrapper .media_wrapper iframe,
section.about .about_wrapper .media_wrapper svg {
    transition: 1s;
    filter: grayscale(100%);
}

section.about .about_wrapper .media_wrapper:hover video,
section.about .about_wrapper .media_wrapper:hover img,
section.about .about_wrapper .media_wrapper:hover iframe,
section.about .about_wrapper .media_wrapper:hover svg {
    filter: grayscale(0);
}

section.about .about_wrapper .about_banner_wrapper {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 80px;
}

section.about .about_wrapper .about_banner_wrapper .right {
    background: var(--proweb-gray);
    width: 596px;
    height: 410px;
    background: #0000001F;
    border-radius: 20px;
    overflow: hidden;
    padding: 0;
}

section.about .about_wrapper .about_banner_wrapper .left {
    width: calc(100% - 80px - 596px);
}

section.about .about_wrapper .about_banner_wrapper .left .context {
    color: var(--proweb-black);
    font: 400 40px/52px "DMSans", sans-serif;
    text-align: left;
}

section.about .about_wrapper .about_banner_wrapper .left .context span {
    font: 800 40px/52px "DMSans ExtraBold", sans-serif;
}

section.about .about_wrapper .about_banner_wrapper .left .title {
    color: var(--proweb-black);
    font: 500 52px/68px "DMSans Medium", sans-serif;
    text-align: left;
    margin: 0 0 24px 0;
}

section.about .about_wrapper .about_banner_wrapper .left .title span {
    color: var(--proweb-orange);
}

section.about .about_wrapper .about_banner_wrapper .left .description {
    color: var(--proweb-black);
    font: 400 24px/31px "DMSans", sans-serif;
    text-align: left;
    padding-right: 35px;
}

section.about .about_wrapper .about_banner_wrapper .left .quotes {
    width: 60px;
    height: 60px;
}

section.about .job_date {
    line-height: 1;
    text-align: center;
    width: 100%;
}

section.about .job_date span {
    font-style: italic;
    color: #141414;
    font-family: "DmSans Light";
}

/* About Us */



/* Our team  */
section.our_team {
    margin: 0 0 120px 0;
}

section.our_team .our_team_heading {
    width: 796px;
    margin: 0 auto 80px;
    padding-top: 120px;
}

section.our_team .our_team_heading .description {
    margin: 0 0 16px 0;
    font: 400 32px/42px "DMSans", sans-serif;
    text-align: center;
    color: var(--proweb-black);
}

section.our_team .our_team_heading .title {
    font: italic 100 80px/80px "HelveticaNeue Thin", sans-serif;
    text-align: center;
    color: var(--proweb-black);
}

section.our_team .our_team_heading .title span {
    font: 500 80px/80px "HelveticaNeue Medium", sans-serif;
}

section.our_team .our_team_wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    column-gap: 32px;
    row-gap: 80px;
    margin: 0;
}

section.our_team .our_team_wrapper .our_team_item {
    width: calc((100% - 3 * 32px) / 4);
    padding: 0;
}

section.our_team .our_team_wrapper .our_team_item .picture {
    background: #0000001F;
    width: 100%;
    height: 400px;
    border-radius: 16px;
    overflow: hidden;
    margin: 0 0 16px 0;
    position: relative;
}

section.our_team .our_team_wrapper .our_team_item .picture img {
    transition: 1s;
    filter: grayscale(100%);
}

section.our_team .our_team_wrapper .our_team_item .picture:hover img {
    filter: grayscale(0);
}

section.our_team .our_team_wrapper .our_team_item .name {
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
    font: 400 32px/42px "DMSans", sans-serif;
    text-align: left;
    color: var(--proweb-black);
}

section.our_team .our_team_wrapper .our_team_item .profession {
    font: 400 20px/26px "DMSans", sans-serif;
    text-align: left;
    color: var(--proweb-black);
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.our_team .our_team_wrapper .our_team_item .picture .layer {
    position: absolute;
    top: -100%;
    left: 100%;
    transform: rotate(20deg);
    background: var(--proweb-orange);
    width: 100%;
    height: 100%;
    border-radius: 16px;
    transition: 0.5s;
    padding: 44px 25px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    gap: 50px;
}

section.our_team .our_team_wrapper .our_team_item:hover .picture .layer {
    top: 0;
    left: 0;
    transform: rotate(0);
}

section.our_team .our_team_wrapper .our_team_item .picture .layer .context {
    width: 100%;
    font: 400 20px/26px "DMSans", sans-serif;
    text-align: left;
    color: var(--proweb-white);
    max-height: calc(7 * 26px);
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 7 !important;
    line-clamp: 7 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.our_team .our_team_wrapper .our_team_item .picture .layer ul.social_icons {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 20px;
}

section.our_team .our_team_wrapper .our_team_item .picture .layer ul.social_icons li {
    width: 48px;
    height: 48px;
}

section.our_team .our_team_wrapper .our_team_item .picture .layer ul.social_icons li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 2px solid var(--proweb-white);
    transition: 0.3s;
}

section.our_team .our_team_wrapper .our_team_item .picture .layer ul.social_icons li a svg {
    display: block;
    width: 24px;
    height: 24px;
}

section.our_team .our_team_wrapper .our_team_item .picture .layer ul.social_icons li a svg path {
    fill: var(--proweb-white);
}

section.our_team .our_team_wrapper .our_team_item:nth-child(2n) .picture .layer {
    background: var(--proweb-black);
}

section.our_team .our_team_wrapper .our_team_item:nth-child(2n) .picture .layer .context {
    color: var(--proweb-white);
}

section.our_team .our_team_wrapper .our_team_item:nth-child(2n) .picture .layer ul.social_icons li a {
    border: 2px solid var(--proweb-white);
}

section.our_team .our_team_wrapper .our_team_item:nth-child(2n) .picture .layer ul.social_icons li a svg path {
    fill: var(--proweb-white);
}

/* Our team  */




/* Blog Detailed */
section.blog_detailed {
    margin: 40px 0 60px 0;
}

section.blog_detailed .blog_detailed_row {
    width: 100%;
    margin: 50px auto 80px;
    position: relative;
    display: flex;
    align-items: center;
    flex-direction: column;
}

section.blog_detailed .blog_detailed_row .share_icon {
    position: absolute;
    top: 0;
    right: 0;
    width: 52px;
    height: 52px;
}

section.blog_detailed .blog_detailed_row .share_icon img {
    width: 100%;
    cursor: pointer;
    height: 100%;
    object-fit: cover;
}

section.blog_detailed .blog_detailed_row .dropdown-menu {
    background-color: var(--proweb-gray);
    width: 308px;
    padding: 20px;
    position: relative;
    z-index: 100;
}

section.blog_detailed .blog_detailed_row .dropdown-menu .share_icons {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
}

section.blog_detailed .blog_detailed_row .dropdown-menu .share_icons .social_media_icon {
    width: 40px;
    height: 40px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    background-color: var(--proweb-white);
    border-radius: 100%;
    transition: all .3s;
}

section.blog_detailed .blog_detailed_row .dropdown-menu .share_icons .social_media_icon:hover {
    background-color: var(--proweb-gray);
}

section.blog_detailed .blog_detailed_row .dropdown-menu .share_icons .social_media_icon img {
    width: 100%;
}

section.blog_detailed .blog_detailed_row .dropdown-menu .copy_link {
    width: 100%;
    background-color: var(--proweb-white);
    padding: 8px 12px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

section.blog_detailed .blog_detailed_row .dropdown-menu .copy_link p {
    width: 80%;
    height: 24px;
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    line-clamp: 1 !important;
    text-overflow: ellipsis;
    overflow: hidden;
    min-height: auto !important;
    color: #A5A5A5;
}

section.blog_detailed .blog_detailed_row .dropdown-menu .copy_link img {
    width: 20px;
    height: 20px;
}


section.blog_detailed .blog_detailed_row .blog_detailed_title,
section.blog_detailed .blog_detailed_row .author_wrapper {
    width: 704px;
}

section.blog_detailed .blog_detailed_row .blog_detailed_title {
    color: var(--proweb-black);
    font: 500 60px/60px "HelveticaNeue Medium", sans-serif;
    text-align: center;
    margin: 0 0 36px 0;
}

section.blog_detailed .blog_detailed_row .author_wrapper {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 10px;
}

section.blog_detailed .blog_detailed_row .author_wrapper>div {
    width: calc((100% - 1 * 10px) / 2);
}

section.blog_detailed .blog_detailed_row .author_wrapper .left .title {
    color: var(--proweb-black);
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: right;
}

section.blog_detailed .blog_detailed_row .author_wrapper .right .description {
    color: var(--proweb-black);
    font: italic 200 16px/21px "DMSans ExtraLight", sans-serif;
    text-align: left;
}

section.blog_detailed .blog_detailed_wrapper .blog_detailed_banner {
    height: 480px;
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid var(--proweb-black);
    margin: 0 0 80px 0;
}

section.blog_detailed .blog_detailed_wrapper .blog_detailed_banner .media_wrapper {
    outline: none;
    border: none;
    background: #0000001F;
    width: 100%;
    height: 100%;
}

section.blog_detailed .blog_detailed_wrapper .blog_detailed_banner .media_wrapper video {
    width: 100%;
    height: 100%;
    border: none !important;
    outline: none !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-tap-highlight-color: transparent !important;
}

section.blog_detailed .blog_detailed_wrapper .blog_detailed_banner .media_wrapper video,
section.blog_detailed .blog_detailed_wrapper .blog_detailed_banner .media_wrapper img,
section.blog_detailed .blog_detailed_wrapper .blog_detailed_banner .media_wrapper iframe,
section.blog_detailed .blog_detailed_wrapper .blog_detailed_banner .media_wrapper svg {
    transition: 1s;
    filter: grayscale(100%);
}

section.blog_detailed .blog_detailed_wrapper .blog_detailed_banner .media_wrapper:hover video,
section.blog_detailed .blog_detailed_wrapper .blog_detailed_banner .media_wrapper:hover img,
section.blog_detailed .blog_detailed_wrapper .blog_detailed_banner .media_wrapper:hover iframe,
section.blog_detailed .blog_detailed_wrapper .blog_detailed_banner .media_wrapper:hover svg {
    filter: grayscale(0);
}

section.blog_detailed .blog_detailed_wrapper .blog_used_wrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 60px;
}

section.blog_detailed .blog_detailed_wrapper .blog_used_wrapper .item .title {
    color: var(--proweb-black);
    font: 400 40px/40px "DMSans", sans-serif;
    text-align: left;
    margin-bottom: 20px;
}

section.blog_detailed .blog_detailed_wrapper .blog_used_wrapper .item .description {
    color: var(--proweb-black);
    font: 400 20px/26px "DMSans", sans-serif;
    text-align: left;
}

section.blog_detailed .blog_detailed_wrapper .blog_used_wrapper .item .description span {
    color: var(--proweb-orange);
    position: relative;
}

section.blog_detailed .blog_detailed_wrapper .blog_used_wrapper .item .description span::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 2px;
    width: 100%;
    height: 1px;
    background: var(--proweb-orange);
}


section.most_searched {
    margin: 30px 0 80px 0;
}

section.most_searched .container {
    padding-top: 30px;
    border-top: 1px solid #e1e1e1;
}

section.most_searched .title h2 {
    font-family: "dmsans";
    font-size: 32px;
}

section.most_searched .serached_items {
    padding-top: 20px;
}

section.most_searched .serached_items .serached_item {
    background-color: var(--proweb-gray);
    border-radius: 35px;
    padding: 12px 16px;
    font-family: "Dmsans";
    font-size: 20px;
    border: 1px solid #ececec;
    width: fit-content;


}

section.most_searched .serached_items .serached_item a {
    color: black;
}



section.tracking {
    margin: 40px 0 120px 0;
    min-height: 300px;

}

section.tracking .container {
    padding-top: 50px;
    border-top: 1px solid #e1e1e1;
}

section.tracking .container .row {
    background-color: var(--proweb-black);
    border-radius: 20px;
    min-height: 300px;

}

section.tracking .container .image {
    position: relative;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    min-height: 300px;
    overflow: hidden;

}

section.tracking .container .image .text {
    position: absolute;
    top: 30px;
    left: 30px;
    z-index: 2;
    padding: 8px 20px;
    display: flex;
    border-radius: 35px;
    font-family: 'dmsans';
    width: fit-content;
    background-color: rgb(20, 20, 20, .6);
    gap: 10px;
    backdrop-filter: blur(2px);
    color: white;
}

section.tracking .container .image img {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(1);
    transition: all 1s;
}

section.tracking:hover .container .image img {
    filter: grayscale(0);
    transform: scale(1.1);
}

section.tracking .container .content {
    position: relative;
    padding: 40px;
    color: var(--proweb-white);
}

@media (max-width: 768px) {

    section.tracking {
        margin: 40px 10px 120px 10px;
    }

    section.tracking .container .content {
        padding: 20px;
    }


    section.tracking .container .content .bottom {
        flex-direction: column;
        align-items: flex-start !important;
    }

    section.tracking .container .content .bottom p {
        width: 100% !important;
    }

    section.most_searched {
        margin: 30px 10px 30px 10px;
    }
}

section.tracking .container .content .corner_image {
    width: 80px;
    height: 80px;
    position: absolute;
    top: 20px;
    right: 20px;
    animation: scale 4s linear infinite;
}

section.tracking .container .content h3 {
    font-family: "Dmsans medium";
    font-size: 20px;
    margin-bottom: 40px;

}

section.tracking .container .content a {
    color: var(--proweb-white);
    font-family: "Dmsans semibold";
    font-size: 44px;
    display: block;
    margin-bottom: 2rem;
}

section.tracking .container .content .bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

section.tracking .container .content .bottom p {
    margin-top: 10px;
    width: 60%;
    font-family: "Dmsans";
    color: #8B8B8B;
}

section.tracking .container .content .bottom button {
    padding: 12px 32px;
    display: flex;
    align-items: center;
    height: 58px;
    justify-content: center;
    gap: 10px;
    border: none;
    outline: none;
    box-shadow: none;
    border: 1px solid var(--proweb-white);
    background: transparent;
    border-radius: 40px;
}

section.tracking .container .content .bottom button .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-white);
    font: 400 24px/24px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

section.tracking .container .content .bottom button:hover .arrow_animation .picture {
    transform: translateX(0);
}

section.tracking .container .content .bottom button .arrow_animation {
    width: 24px;
    height: 24px;
}

section.tracking .container .content .bottom button .arrow_animation .picture {
    width: 24px;
    height: 24px;
}

section.tracking .container .content .bottom button .arrow_animation .picture img {
    width: 24px;
    height: 24px;
}

section.tracking .container .content .bottom button .arrow_animation .picture::before {
    width: 24px;
    height: 24px;
}

/* Blog Detailed */



/* Blog Section */
section.blog {
    margin: 0 0 120px 0;
}

section.blog .blog_heading {
    width: 796px;
    margin: 0 auto 80px;
}

section.blog .blog_heading .description {
    margin: 0 0 16px 0;
    font: 400 32px/42px "DMSans", sans-serif;
    text-align: center;
    color: var(--proweb-black);
}

section.blog .blog_heading .title {
    font: 300 60px/70px "DMSans Light", sans-serif;
    text-align: center;
    color: var(--proweb-black);
}

section.blog .blog_wrapper form {
    margin: 0 0 120px 0;
}

section.blog .blog_wrapper form .form_description {
    color: var(--proweb-black);
    font: 400 24px/31px "DMSans", sans-serif;
    text-align: left;
    margin: 0 0 24px 0;
}

section.blog .blog_wrapper form .input_wrapper {
    width: 510px;
    height: 60px;
    border-radius: 40px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    border: 1px solid var(--proweb-black);
}

section.blog .blog_wrapper form .input_wrapper input {
    position: absolute;
    top: 0;
    left: 0;
    border: none;
    outline: none;
    width: 100%;
    height: 100%;
    padding: 19.5px 60px 19.5px 20px;
    color: var(--proweb-black);
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: left;
}

section.blog .blog_wrapper form .input_wrapper input::placeholder {
    color: var(--proweb-black);
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: left;
}

section.blog .blog_wrapper form .input_wrapper button {
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
    width: 37px;
    height: 37px;
    border-radius: 50%;
    padding: 4px;
    background: var(--proweb-orange);
    border: none;
    outline: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

section.blog .blog_wrapper form .input_wrapper:hover button .arrow_animation .picture {
    transform: translateX(0);
}

section.blog .blog_wrapper .blog_items {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    column-gap: 40px;
    row-gap: 60px;
}

section.blog .blog_wrapper .blog_items .blog_item {
    width: calc((100% - 2 * 40px) / 3);
    border-radius: 16px;
    overflow: hidden;
    background: var(--proweb-gray);
    padding: 0;
}

section.blog .blog_wrapper .blog_items .blog_item .top {
    height: 270px;
    overflow: hidden;
}

section.blog .blog_wrapper .blog_items .blog_item .top img {
    transition: 0.3s;
    filter: grayscale(100%);
}

section.blog .blog_wrapper .blog_items .blog_item .top:hover img {
    filter: grayscale(0);
    transform: scale(1.1);
}

section.blog .blog_wrapper .blog_items .blog_item .bottom {
    padding: 24px;
}

section.blog .blog_wrapper .blog_items .blog_item .bottom .title {
    color: var(--proweb-black);
    font: 400 20px/26px "DMSans", sans-serif;
    text-align: left;
    margin: 0 0 12px 0;
    height: 52px;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.blog .blog_wrapper .blog_items .blog_item .bottom .description {
    color: #5B5B5B;
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: left;
    margin: 0 0 24px 0;
    height: 42px;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.blog .blog_wrapper .blog_items .blog_item .bottom .link {
    display: flex;
    justify-content: flex-start;
}

section.blog .blog_wrapper .blog_items .blog_item .bottom .link a {
    padding: 17px 21px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border: 1px solid var(--proweb-black);
    border-radius: 40px;
}

section.blog .blog_wrapper .blog_items .blog_item .bottom .link a .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 24px/24px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

section.blog .blog_wrapper .blog_items .blog_item .bottom .link a:hover .arrow_animation .picture {
    transform: translateX(0);
}

/* Blog Section */



/* Technologies Section */
section.technologies {
    margin: 40px 0 120px 0;
}

section.technologies .technologies_row {
    width: 704px;
    margin: 50px auto 80px;
}

section.technologies .technologies_row .technologies_title {
    color: var(--proweb-black);
    font: 500 60px/60px "HelveticaNeue Medium", sans-serif;
    text-align: center;
    margin: 0 0 36px 0;
}

section.technologies .technologies_row .technologies_title span {
    color: var(--proweb-orange);
    font: italic 100 60px/60px "HelveticaNeue Thin", sans-serif;
}

section.technologies .technologies_row .technologies_description {
    color: var(--proweb-black);
    font: 300 24px/31px "HelveticaNeue Light", sans-serif;
    text-align: center;
}

section.technologies .technologies_banner {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 25px;
}

section.technologies .technologies_banner>div {
    height: 380px;
    border-radius: 16px;
    background: #0000001F;
    overflow: hidden;
    padding: 0;
}

section.technologies .technologies_banner .banner_item:first-child {
    width: calc(100% - 25px - 503px);
}

section.technologies .technologies_banner .banner_item:last-child {
    width: 503px;
}

section.technologies .technologies_banner .banner_item .media_wrapper {
    outline: none;
    border: none;
    background: #0000001F;
    width: 100%;
    height: 100%;
}

section.technologies .technologies_banner .banner_item .media_wrapper video {
    width: 100%;
    height: 100%;
    border: none !important;
    outline: none !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-tap-highlight-color: transparent !important;
}

section.technologies .technologies_banner .banner_item .media_wrapper video,
section.technologies .technologies_banner .banner_item .media_wrapper img,
section.technologies .technologies_banner .banner_item .media_wrapper iframe,
section.technologies .technologies_banner .banner_item .media_wrapper svg {
    transition: 1s;
    filter: grayscale(100%);
}

section.technologies .technologies_banner .banner_item .media_wrapper:hover video,
section.technologies .technologies_banner .banner_item .media_wrapper:hover img,
section.technologies .technologies_banner .banner_item .media_wrapper:hover iframe,
section.technologies .technologies_banner .banner_item .media_wrapper:hover svg {
    filter: grayscale(0);
}

/* Technologies Section */



/* Development Section */
section.development {
    margin: 0 0 120px 0;
}

section.development .collapse {
    height: auto !important;
    visibility: visible !important;
    transition: none !important;
}

section.development .collapsing {
    height: auto !important;
    transition: none !important;
    display: none !important;
}

section.development .collapse:not(.show) {
    display: none !important;
}

section.development .development_wrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 80px;
}

section.development .development_wrapper .development_item {
    width: 100%;
}

section.development .development_wrapper .development_item .heading {
    margin: 0 0 40px;
}

section.development .development_wrapper .development_item .heading .title {
    color: var(--proweb-black);
    font: 400 32px/42px "DMSans", sans-serif;
    text-align: left;
    margin: 0 0 40px 0;
}

section.development .development_wrapper .development_item .web_programs {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 16px;
}

section.development .development_wrapper .development_item .web_programs .web_program {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 32px;
    border-radius: 40px;
    background: var(--proweb-gray);
    overflow: hidden;
    cursor: pointer;
}

section.development .development_wrapper .development_item .web_programs .web_program .icon {
    width: 24px;
    height: 27.05px;
    margin-right: 8px;
    user-select: none;
}

section.development .development_wrapper .development_item .web_programs .web_program .text {
    color: var(--proweb-black);
    font: 400 20px/26px "DMSans", sans-serif;
    user-select: none;
}

section.development .development_wrapper .development_item .web_programs .web_program_description {
    width: 100%;
    background: #161616;
    padding: 16px 44px 32px;
    border-radius: 20px;
    position: relative;
    margin-top: 15px;
    margin-bottom: 15px;
    display: none;
}

section.development .development_wrapper .development_item .web_programs .web_program_description.show {
    display: block;
}

section.development .development_wrapper .development_item .web_programs .web_program_description::before {
    content: "";
    position: absolute;
    top: -13px;
    left: 50px;
    transform: translateX(-50%);
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-bottom: 15px solid #161616;
}

section.development .development_wrapper .development_item .web_programs .web_program_description .web_program_close {
    position: absolute;
    top: 16px;
    right: 44px;
    width: 44px;
    height: 44px;
    cursor: pointer;
}

section.development .development_wrapper .development_item .web_programs .web_program_description .horizontal_bar {
    height: 1px;
    width: 100%;
    background: #525252;
    margin: 60px 0 24px;
}

section.development .development_wrapper .development_item .web_programs .web_program_description .web_title {
    color: var(--proweb-white);
    font: 500 40px/52px "DMSans Medium", sans-serif;
    text-align: left;
    margin: 0 0 15px 0;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.development .development_wrapper .development_item .web_programs .web_program_description .web_description {
    color: var(--proweb-white);
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: left;
    max-height: 105px;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 5 !important;
    line-clamp: 5 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.development .development_wrapper .development_item .web_programs .web_program_description a {
    padding: 17px 21px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border: 1px solid var(--proweb-white);
    border-radius: 40px;
    margin-top: 20px;
}

section.development .development_wrapper .development_item .web_programs .web_program_description a .context {
    max-width: calc((100% - 4px - 32px));
    color: var(--proweb-white);
    font: 400 24px/24px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

section.development .development_wrapper .development_item .web_programs .web_program_description a:hover .arrow_animation .picture {
    transform: translateX(0);
}

section.development .development_wrapper .development_item .web_programs .web_program_description a .arrow_animation {
    width: 32px;
    height: 32px;
}

section.development .development_wrapper .development_item .web_programs .web_program_description a .arrow_animation .picture {
    width: 32px;
    height: 32px;
}

section.development .development_wrapper .development_item .web_programs .web_program_description a .arrow_animation .picture img {
    width: 32px;
    height: 32px;
}

section.development .development_wrapper .development_item .web_programs .web_program_description a .arrow_animation .picture::before {
    width: 32px;
    height: 32px;
}

/* Development Section */


/* News Section */
section.news {
    margin: 0 0 120px 0;
}

section.news .news_row {
    width: 680px;
    margin: 50px auto 80px;
}

section.news .news_row .news_title {
    color: var(--proweb-black);
    font: 500 60px/60px "HelveticaNeue Medium", sans-serif;
    text-align: center;
    margin: 0 0 36px 0;
}

section.news .news_row .news_title span {
    color: var(--proweb-orange);
    font: italic 100 60px/60px "HelveticaNeue Thin", sans-serif;
}

section.news .news_row .news_description {
    color: var(--proweb-black);
    font: 300 24px/31px "HelveticaNeue Light", sans-serif;
    text-align: center;
}

section.news .news_banner {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 32px;
}

section.news .news_banner .left {
    width: 520px;
    height: 600px;
    border-radius: 16px;
    overflow: hidden;
    background: var(--proweb-gray);
    padding: 0;
}

section.news .news_banner .right {
    width: calc(100% - 32px - 520px);
    padding: 0;
}

section.news .news_banner .right .picture_wrapper {
    background: #0000001F;
    height: 365px;
    border-radius: 16px;
    overflow: hidden;
    position: relative;
}

section.news .news_banner .right .picture_wrapper .picture_context {
    position: absolute;
    bottom: 40px;
    left: 40px;
    z-index: 2;
    width: 522px;
    color: var(--proweb-white);
    font: 700 24px/31px "DMSans Bold", sans-serif;
    text-align: left;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
    line-clamp: 3 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.news .news_banner .right .picture_wrapper .media_wrapper {
    outline: none;
    border: none;
    background: #0000001F;
    width: 100%;
    height: 100%;
}

section.news .news_banner .right .picture_wrapper .media_wrapper video {
    width: 100%;
    height: 100%;
    border: none !important;
    outline: none !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-tap-highlight-color: transparent !important;
}

section.news .news_banner .right .picture_wrapper .media_wrapper video,
section.news .news_banner .right .picture_wrapper .media_wrapper img,
section.news .news_banner .right .picture_wrapper .media_wrapper iframe,
section.news .news_banner .right .picture_wrapper .media_wrapper svg {
    transition: 1s;
    filter: grayscale(100%);
}

section.news .news_banner .right .picture_wrapper:hover .media_wrapper video,
section.news .news_banner .right .picture_wrapper:hover .media_wrapper img,
section.news .news_banner .right .picture_wrapper:hover .media_wrapper iframe,
section.news .news_banner .right .picture_wrapper:hover .media_wrapper svg {
    filter: grayscale(0);
    transform: scale(1.1);
}

section.news .news_banner .right form {
    margin: 60px 0 0 0;
    padding-bottom: 58px;
    border-bottom: 1px solid var(--proweb-black);
}

section.news .news_banner .right form .form_description {
    color: var(--proweb-black);
    font: 400 24px/31px "DMSans", sans-serif;
    text-align: left;
    margin: 0 0 24px 0;
}

section.news .news_banner .right form .input_wrapper {
    width: 510px;
    height: 60px;
    border-radius: 40px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    border: 1px solid var(--proweb-black);
}

section.news .news_banner .right form .input_wrapper input {
    position: absolute;
    top: 0;
    left: 0;
    border: none;
    outline: none;
    width: 100%;
    height: 100%;
    padding: 19.5px 60px 19.5px 20px;
    color: var(--proweb-black);
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: left;
}

section.news .news_banner .right form .input_wrapper input::placeholder {
    color: var(--proweb-black);
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: left;
}

section.news .news_banner .right form .input_wrapper button {
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
    width: 37px;
    height: 37px;
    border-radius: 50%;
    padding: 4px;
    background: var(--proweb-orange);
    border: none;
    outline: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

section.news .news_banner .right form .input_wrapper:hover button .arrow_animation .picture {
    transform: translateX(0);
}

/* News Section */



/* Vacancies Section */
section.vacancies {
    margin: 0 0 120px 0;
}

section.vacancies .vacancies_heading {
    width: 796px;
    margin: 0 auto 80px;
}

section.vacancies .vacancies_heading .title {
    font: italic 100 80px/80px "HelveticaNeue Thin", sans-serif;
    text-align: center;
    color: var(--proweb-black);
}

section.vacancies .vacancies_heading .title span {
    font: 500 80px/80px "HelveticaNeue Medium", sans-serif;
}

section.vacancies .vacancies_wrapper {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    column-gap: 30px;
    row-gap: 40px;
}

section.vacancies .vacancies_wrapper .vacancies_item {
    width: calc((100% - 2 * 30px) / 3);
    border-radius: 16px;
    padding: 32px;
    overflow: hidden;
    background: var(--proweb-gray);
}

section.vacancies .vacancies_wrapper .vacancies_item .title {
    color: var(--proweb-black);
    font: 500 28px/36px "DMSans Medium", sans-serif;
    text-align: left;
    height: 36px;
    margin: 0 0 12px 0;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.vacancies .vacancies_wrapper .vacancies_item .features_wrapper {
    margin: 0 0 12px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 8px;
}

section.vacancies .vacancies_wrapper .vacancies_item .features_wrapper .feature_item {
    border-radius: 40px;
    padding: 10px 24px;
    background: var(--proweb-white);
    border: 1px solid var(--proweb-orange);
    color: var(--proweb-orange);
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: center;
}

section.vacancies .vacancies_wrapper .vacancies_item .description {
    color: #5B5B5B;
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: left;
    height: 84px;
    margin: 0 0 24px 0;
    height: 84px;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 4 !important;
    line-clamp: 4 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.vacancies .vacancies_wrapper .vacancies_item .link {
    display: flex;
    justify-content: flex-start;
}

section.vacancies .vacancies_wrapper .vacancies_item .link a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

section.vacancies .vacancies_wrapper .vacancies_item .link a .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 24px/24px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

section.vacancies .vacancies_wrapper .vacancies_item .link a .context::after {
    content: "";
    position: absolute;
    bottom: -4px;
    left: 0px;
    height: 0.9px;
    width: 0;
    background: var(--proweb-black);
    transition: 0.3s;
}

section.vacancies .vacancies_wrapper .vacancies_item .link a:hover .context::after {
    width: 100%;
}

section.vacancies .vacancies_wrapper .vacancies_item .link a .arrow_animation,
section.vacancies .vacancies_wrapper .vacancies_item .link a .arrow_animation .picture,
section.vacancies .vacancies_wrapper .vacancies_item .link a .arrow_animation .picture img,
section.vacancies .vacancies_wrapper .vacancies_item .link a .arrow_animation .picture::before {
    width: 32px;
    height: 32px;
}

section.vacancies .vacancies_wrapper .vacancies_item .link a:hover .arrow_animation .picture {
    transform: translateX(0);
}

section.vacancies .no_vacancy {
    width: 100%;
    background-color: var(--proweb-gray);
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 16px;
    align-items: center;
    gap: 20px;
    padding: 32px;
}

section.vacancies .no_vacancy h3 {
    font-family: "DmSans";
    font-style: italic;
    font-size: 24px;
}

section.vacancies .no_vacancy button {
    border: none;
    background-color: transparent;
}

section.vacancies .no_vacancy button a {
    border: 1px solid var(--proweb-black);
    color: black;
    border-radius: 35px;
    background-color: var(--proweb-white);
    display: flex;
    align-items: center;
    padding: 12px 20px;
}

section.vacancies .no_vacancy button .arrow_animation {
    transform: rotate(90deg) !important;
}

section.vacancies .no_vacancy button:hover .arrow_animation .picture {
    transform: translateX(0);
}

/* Vacancies Section */



/* Feedback Section */
section.feedback {
    margin: 0 0 120px 0;
}

section.feedback .feedback_heading {
    width: 796px;
    margin: 0 auto 80px;
}

section.feedback .feedback_heading .description {
    margin: 0 0 16px 0;
    font: 400 32px/42px "DMSans", sans-serif;
    text-align: center;
    color: var(--proweb-black);
}

section.feedback .feedback_heading .title {
    font: 300 60px/70px "DMSans Light", sans-serif;
    text-align: center;
    color: var(--proweb-black);
}

section.feedback .feedback_swiper {
    height: 480px;
}

section.feedback .feedback_swiper .swiper {
    position: relative;
    border-radius: 20px;
}

section.feedback .feedback_swiper .swiper-wrapper .swiper-slide {
    background: #161616;
    height: 400px;
    border-radius: 20px;
    padding: 44px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 40px;
}

section.feedback .feedback_swiper .swiper-wrapper .swiper-slide .picture {
    background: #0000001F;
    border-radius: 16px;
    overflow: hidden;
    width: 375px;
    height: 312px;
}

section.feedback .feedback_swiper .swiper-wrapper .swiper-slide .picture .media_wrapper img {
    transition: 1s;
    filter: grayscale(100%);
}

section.feedback .feedback_swiper .swiper-wrapper .swiper-slide .picture .media_wrapper:hover img {
    filter: grayscale(0);
}

section.feedback .feedback_swiper .swiper-wrapper .swiper-slide .context {
    width: calc(100% - 40px - 375px);
    height: 312px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}


section.feedback .feedback_swiper .swiper-wrapper .swiper-slide .context .title,
section.feedback .feedback_swiper .swiper-wrapper .swiper-slide .context .name,
section.feedback .feedback_swiper .swiper-wrapper .swiper-slide .context .profession {
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.feedback .feedback_swiper .swiper-wrapper .swiper-slide .context .title {
    font: 500 24px/31px "DMSans Medium", sans-serif;
    text-align: left;
    color: var(--proweb-white);
    margin: 0 0 32px 0;
}

section.feedback .feedback_swiper .swiper-wrapper .swiper-slide .context .description {
    font: 400 28px/36px "DMSans", sans-serif;
    height: 108px;
    text-align: left;
    color: var(--proweb-white);
    margin: 0 0 61px 0;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
    line-clamp: 3 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.feedback .feedback_swiper .swiper-wrapper .swiper-slide .context .description span {
    color: var(--proweb-orange);
}

section.feedback .feedback_swiper .swiper-wrapper .swiper-slide .context .name {
    font: 500 32px/42px "DMSans Medium", sans-serif;
    text-align: left;
    color: var(--proweb-white);
    margin: 0 0 8px 0;
}

section.feedback .feedback_swiper .swiper-wrapper .swiper-slide .context .profession {
    font: 500 24px/31px "DMSans Medium", sans-serif;
    text-align: left;
    color: var(--proweb-white);
}

section.feedback .feedback_swiper .swiper-button-next,
section.feedback .feedback_swiper .swiper-button-prev {
    width: 104px;
    height: 48px;
    border-radius: 40px;
    background: var(--proweb-gray);
    transition: 0.3s;
    position: absolute;
    overflow: hidden;
    user-select: none;
    top: unset;
    bottom: 0;
}

section.feedback .feedback_swiper .swiper-button-next {
    right: unset;
    left: calc(50% + 10px);
}

section.feedback .feedback_swiper .swiper-button-prev {
    left: unset;
    right: calc(50% + 10px);
}

section.feedback .feedback_swiper .swiper-button-next:hover,
section.feedback .feedback_swiper .swiper-button-prev:hover {
    background: var(--proweb-orange);
}

section.feedback .feedback_swiper .swiper-button-next::after,
section.feedback .feedback_swiper .swiper-button-prev::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
    transition: 0.3s;
    user-select: none;
}

section.feedback .feedback_swiper .swiper-button-next .svg,
section.feedback .feedback_swiper .swiper-button-prev .svg {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s;
}

section.feedback .feedback_swiper .swiper-button-next .svg img,
section.feedback .feedback_swiper .swiper-button-prev .svg img {
    width: 24px;
    height: 24px;
}

section.feedback .feedback_swiper .swiper-button-next::after {
    background-image: url(../images/svg/arrow_Right_Dark.svg);
}

section.feedback .feedback_swiper .swiper-button-next .svg {
    transform: translateX(-100%);
}

section.feedback .feedback_swiper .swiper-button-next:hover .svg {
    transform: translateX(0);
}

section.feedback .feedback_swiper .swiper-button-next:hover::after {
    transform: translateX(100%);
}

section.feedback .feedback_swiper .swiper-button-prev::after {
    background-image: url(../images/svg/arrow_Left_Dark.svg );
}

section.feedback .feedback_swiper .swiper-button-prev .svg {
    transform: translateX(100%);
}

section.feedback .feedback_swiper .swiper-button-prev:hover .svg {
    transform: translateX(0);
}

section.feedback .feedback_swiper .swiper-button-prev:hover::after {
    transform: translateX(-100%);
}

/* Feedback Section */




/* Careers Form  */
section.careers_from {
    margin: 0 0 120px 0;
}

section.careers_from form {
    background: var(--proweb-gray);
    padding: 60px;
    border-radius: 20px;
}

section.careers_from form .title {
    color: var(--proweb-black);
    font: 700 44px/44px "HelveticaNeue Bold", sans-serif;
    text-align: left;
    width: 715px;
    margin: 0 0 16px 0;
}

section.careers_from form .title_context {
    color: var(--proweb-black);
    font: 400 24px/31px "DMSans", sans-serif;
    text-align: left;
    width: 715px;
}

section.careers_from form .main_form {
    margin: 60px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    column-gap: 24px;
    row-gap: 52px;
}

section.careers_from form .main_form .input_wrapper {
    border-bottom: 1px solid #222222;
    margin: 20px 0;
}

section.careers_from form .main_form .input_wrapper input {
    background: transparent;
    border: none;
    outline: none;
    box-shadow: none;
    color: var(--proweb-black);
    font: 600 16px/21px "DMSans SemiBold", sans-serif;
    text-align: left;
    padding-left: 0;
    padding-right: 0;
}

section.careers_from form .main_form .input_wrapper label {
    color: var(--proweb-black);
    font: 600 16px/21px "DMSans SemiBold", sans-serif;
    text-align: left;
    padding-left: 0;
    padding-right: 0;
}

section.careers_from form .footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 32px;
}

section.careers_from form .footer button {
    padding: 17px 54px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: none;
    outline: none;
    box-shadow: none;
    border: 1px solid var(--proweb-white);
    background: var(--proweb-white);
    border-radius: 40px;
}

section.careers_from form .footer button .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 24px/24px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

section.careers_from form .footer button:hover .arrow_animation .picture {
    transform: translateX(0);
}

section.careers_from form .footer .description {
    width: 350px;
    color: #222222;
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: left;
}

section.careers_from form .footer .description a {
    color: #222222;
    position: relative;
}

section.careers_from form .footer .description a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 2px;
    width: 100%;
    height: 0.8px;
    background: #222222;
}

section.careers_from form .positions {
    margin: 0 0 60px 0;
}

section.careers_from form .positions .heading {
    margin: 0 0 16px 0;
    color: var(--proweb-black);
    font: 600 16px/21px "DMSans SemiBold", sans-serif;
    text-align: left;
}

section.careers_from form .positions .positions_wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: flex-start;
    justify-content: flex-start;
}

section.careers_from form .positions .positions_wrapper .form-check {
    min-height: auto;
    padding: 0;
    margin: 0;
}

section.careers_from form .positions .positions_wrapper input {
    display: none;
}

section.careers_from form .positions .positions_wrapper label {
    border-radius: 40px;
    padding: 12px 40px;
    border: 1px solid var(--proweb-black);
    color: var(--proweb-black);
    font: 500 16px/21px "DMSans Medium", sans-serif;
    text-align: center;
    cursor: pointer;
    user-select: none;
    transform: all 0.3s;
}

section.careers_from form .positions .positions_wrapper input:checked+label {
    background: var(--proweb-orange);
    color: var(--proweb-white);
    border: 1px solid var(--proweb-orange);
}

section.careers_from form .upload_cv {
    margin: 0 0 50px 0;
}

section.careers_from form .upload_cv .heading {
    margin: 0 0 16px 0;
    color: var(--proweb-black);
    font: 600 16px/21px "DMSans SemiBold", sans-serif;
    text-align: left;
}

section.careers_from form .upload_cv .image_uploader {
    height: 125px;
    width: 100%;
    border-radius: 16px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    border: 2px dashed #5e5e5e;
}

section.careers_from form .upload_cv .image_uploader .drop_area {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 16px;
    position: relative;
    overflow: hidden;
}

section.careers_from form .upload_cv .image_uploader .drop_area.active {
    display: none;
}

section.careers_from form .upload_cv .image_uploader .drop_area .input_file {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

section.careers_from form .upload_cv .image_uploader .drop_area .image_upload {
    width: 100%;
    height: 100%;
    padding: 16px 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

section.careers_from form .upload_cv .image_uploader .drop_area .image_upload img {
    display: block;
    width: 24px;
    height: 24px;
    object-fit: cover;
}

section.careers_from form .upload_cv .image_uploader .drop_area .image_upload span {
    font: 400 16px/21px "DMSans", sans-serif;
    color: var(--proweb-black);
    background: var(--proweb-white);
    border-radius: 40px;
    padding: 10px 24px;
    margin: 12px 0 0 0;
}

section.careers_from form .upload_cv .image_uploader .cv_display {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 30px;
    overflow: hidden;
    display: none;
}

section.careers_from form .upload_cv .image_uploader .cv_display.active {
    display: flex;
}

section.careers_from form .upload_cv .image_uploader .cv_display .cv_name {
    max-width: 500px;
    height: 50px;
    border-radius: 20px;
    background: var(--proweb-white);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 30px;
}

section.careers_from form .upload_cv .image_uploader .cv_display .cv_name .text {
    color: var(--proweb-black);
    font: 500 20px/30px "DMSans Medium", sans-serif;
    text-align: center;
    user-select: none;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.careers_from form .upload_cv .image_uploader .cv_display .cv_configuration {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 115px;
    gap: 15px;
}

section.careers_from form .upload_cv .image_uploader .cv_display .cv_configuration .delete,
section.careers_from form .upload_cv .image_uploader .cv_display .cv_configuration .new {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #FF2E00;
    background: var(--proweb-white);
}

section.careers_from form .upload_cv .image_uploader .cv_display .cv_configuration .delete img,
section.careers_from form .upload_cv .image_uploader .cv_display .cv_configuration .new img {
    width: 28px;
    height: 28px;
}

section.careers_from form .upload_cv .image_uploader .cv_display .cv_configuration .new {
    position: relative;
}

section.careers_from form .upload_cv .image_uploader .cv_display .cv_configuration .new input {
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: auto;
}

/* Careers Form  */



/* Solutions Section */
section.solutions {
    margin: 0 0 120px 0;
}

section.solutions .solutions_row {
    width: 704px;
    margin: 50px auto 120px;
}

section.solutions .solutions_row .solutions_title {
    color: var(--proweb-black);
    font: 500 60px/60px "HelveticaNeue Medium", sans-serif;
    text-align: center;
    margin: 0 0 36px 0;
}

section.solutions .solutions_row .solutions_title span {
    color: var(--proweb-orange);
    font: italic 100 60px/60px "HelveticaNeue Thin", sans-serif;
}

section.solutions .solutions_row .solutions_description {
    color: var(--proweb-black);
    font: 300 24px/31px "HelveticaNeue Light", sans-serif;
    text-align: center;
}

section.solutions .solutions_heading {
    width: calc((100% - 24px) / 2);
    margin: 0 0 180px 0;
}

section.solutions .portfolio_items .portfolio_item .solution_title {

    color: #414141;
    font-size: 20px;
    font-family: "DmSans medium";
    margin-bottom: 5px;
}

section.solutions .portfolio_items .portfolio_item:nth-child(2n) {
    position: relative;
    top: -350px;
}

section.solutions .portfolio_items .portfolio_item .media_wrapper .technologies {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 12px;
    position: absolute;
    bottom: -100%;
    left: 16px;
    z-index: 2;
    transition: 0.3s;
    width: calc((100% - 2 * 16px));

}

section.solutions .portfolio_items .portfolio_item .media_wrapper:hover .technologies {
    bottom: 16px;
}

section.solutions .portfolio_items .portfolio_item .media_wrapper .technologies .technology_item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 12px;
    border-radius: 40px;
    background: var(--proweb-gray);
    overflow: hidden;
}

section.solutions .portfolio_items .portfolio_item .media_wrapper .technologies .technology_item .icon {
    width: 16px;
    height: 18.03px;
    margin-right: 8px;
}

section.solutions .portfolio_items .portfolio_item .media_wrapper .technologies .technology_item .text {
    color: var(--proweb-black);
    font: 400 14px/18px "DMSans", sans-serif;
}

/* Solutions Section */

/* Solution Detailed */
.challenges {
    padding: 80px 0;
    background-color: #fff;

}

.section_label p {
    color: var(--proweb-orange);
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 0.5px;
    margin-bottom: 30px;
}

.challenges_wrapper {
    justify-content: space-between;
    align-items: center;
}

.challenges_img img {
    width: 100%;
    height: auto;
    border-radius: 12px;
    object-fit: cover;
}

.challenges_texts {
    max-height: 100%;
    height: 798px;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 5px 0;
}

.challenge_item {
    border: 1px solid #d9d9d9;
    border-radius: 12px;
    transition: all 0.8s ease;
    position: relative;
}

.challenge_item img {
    position: absolute;
    top: -60px;
    right: -60px;
    width: 60px;
    height: 60px;
    transition: all .8s;
    transform: rotate(-45deg);
}

.challenge_item a {
    font-family: "DmSans Semibold";
    font-size: 40px;
    position: absolute;
    bottom: 20px;
    z-index: 9;
    right: -370px;
    color: var(--proweb-white);
    transition: all .8s;
}

.challenge_item:hover {
    transform: scale(.9);
}


.challenge_item:hover a {
    right: 20px;
}

.challenge_item:hover img {
    top: 7px;
    right: 15px;
}

.challenge_item:hover p,
.challenge_item:hover span,
.challenge_item:hover h2 {
    color: var(--proweb-white) !important;
}

.challenge_item:hover .desc p {
    transform: translate(10px, 10px);
    opacity: 0;
}


.challenge_item:nth-child(odd):hover {
    background-color: var(--proweb-orange);
}

.challenge_item:nth-child(even):hover {
    background-color: var(--proweb-black);
}

.challenge_item .title p {
    margin-bottom: 12.5px;
    font-size: 26px;
    font-family: "DmSans semibold";
    text-transform: uppercase;
    transition: all 0.8s ease;
    color: #4e4e4e;
}

.challenge_item .title span {
    font-style: italic;
    color: #4e4e4e;
    transition: all 0.8s ease;
    font-family: "DmSans";
    font-size: 14px;
}

.challenge_item .desc p {
    transition: all 0.8s ease;
    margin-top: 8px;
    color: #555;
    font-family: "DmSans";
    font-size: 14px;
    line-height: 1.6;
}

section.companies .section_title h2 {
    font-size: 40px;
    width: 40%;
    font-family: "DmSans semibold";
}

section.companies .companies_wrapper {
    margin: 20px 0;
}

section.companies .companies_wrapper .company {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 300px;
    height: 300px;
    background-color: var(--proweb-gray);
    border-radius: 16px;
    border-bottom: 5px solid rgb(214, 214, 214);

}

section.companies .companies_wrapper .company .company_img {
    width: 50%;
}

section.companies .companies_wrapper .company .company_img img {
    width: 100%;
}




div.client_review {
    padding: 40px 0;
    background-color: #fff;
    text-align: center;
}

div.client_review .title:first-child p:first-child {
    text-transform: lowercase;
    font-size: 26px;
    color: #555;
    margin-bottom: 8px;
}

div.client_review .title:first-child p:last-child {
    font-size: 50px;
    font-weight: 600;
    color: #000;
    max-width: 700px;
    margin: 0 auto 40px auto;
    line-height: 1.4;
}

div.client_review .client_review_wrapper .row {
    background-color: #1a1a1a;
    color: #fff;
    border-radius: 16px;
    height: 470px;
    overflow: hidden;
    padding: 40px;
    align-items: center;
    position: relative;
}

div.client_review .client_review_wrapper .swiper-cards .swiper-slide {
    border-radius: 16px !important;
}

div.client_review .client_review_wrapper .swiper-wrapper {
    padding-bottom: 60px;
}

div.client_review .client_review_wrapper .swiper-button-next,
div.client_review .client_review_wrapper .swiper-button-prev {
    width: 104px;
    height: 48px;
    border-radius: 40px;
    background: #ececec;
    transition: 0.3s;
    position: absolute;
    overflow: hidden;
    user-select: none;
    top: unset;
    bottom: 0;
}

div.client_review .client_review_wrapper .swiper-button-next {
    right: unset;
    left: calc(50% + 10px);
}

div.client_review .client_review_wrapper .swiper-button-prev {
    left: unset;
    right: calc(50% + 10px);
}

div.client_review .client_review_wrapper .swiper-button-next:hover,
div.client_review .client_review_wrapper .swiper-button-prev:hover {
    background: var(--proweb-orange);
}

div.client_review .client_review_wrapper .swiper-button-next::after,
div.client_review .client_review_wrapper .swiper-button-prev::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
    transition: 0.3s;
    user-select: none;
}

div.client_review .client_review_wrapper .swiper-button-next .svg,
div.client_review .client_review_wrapper .swiper-button-prev .svg {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s;
}

div.client_review .client_review_wrapper .swiper-button-next .svg img,
div.client_review .client_review_wrapper .swiper-button-prev .svg img {
    width: 24px;
    height: 24px;
}

div.client_review .client_review_wrapper .swiper-button-next::after {
    background-image: url(../images/svg/arrow_Right_Dark.svg);
}

div.client_review .client_review_wrapper .swiper-button-next .svg {
    transform: translateX(-100%);
}

div.client_review .client_review_wrapper .swiper-button-next:hover .svg {
    transform: translateX(0);
}

div.client_review .client_review_wrapper .swiper-button-next:hover::after {
    transform: translateX(100%);
}

div.client_review .client_review_wrapper .swiper-button-prev::after {
    background-image: url(../images/svg/arrow_Left_Dark.svg );
}

div.client_review .client_review_wrapper .swiper-button-prev .svg {
    transform: translateX(100%);
}

div.client_review .client_review_wrapper .swiper-button-prev:hover .svg {
    transform: translateX(0);
}

div.client_review .client_review_wrapper .swiper-button-prev:hover::after {
    transform: translateX(-100%);
}




div.client_review .left,
div.client_review .left .picture_wrapper {
    height: 100%;
}

div.client_review .left .picture_wrapper img {
    width: 100%;
    border-radius: 10px;
    object-fit: cover;
}

div.client_review .right {
    text-align: left;
    height: 100%;
}

div.client_review .right .title {
    text-transform: uppercase;
    font-size: 24px;
    letter-spacing: 1px;
    font-weight: 500;
    color: var(--proweb-white);
}

div.client_review .right .description {
    font-size: 26px;
    line-height: 1.5;
    font-weight: 400;
    color: #f0f0f0;
    font-family: "DmSans";
    margin: 80px 0 50px 0;
}

div.client_review .right .description span {
    color: var(--proweb-orange);
    font-size: 24px;
    font-weight: 700;
}

div.client_review .references_wrapper {
    margin-top: 20px;
}

div.client_review .references_wrapper .name {
    font-family: "DmSans medium";
    font-size: 22px;
    text-transform: uppercase;
    margin-bottom: 4px;
}

div.client_review .references_wrapper .profession span {
    font-size: 14px;
    color: var(--proweb-orange);
    font-style: italic;
}



section.our_solutions {
    padding: 80px 0;
    background-color: #fff;
}

section.our_solutions .section_label p {
    font-weight: bold;
    color: var(--proweb-orange);
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
}

section.our_solutions .section_title h2 {
    font-size: 28px;
    font-weight: 600;
    text-transform: uppercase;
    color: #000;
    margin: 40px 0;
}

section.our_solutions .section_title .section-desc {
    display: none;

}

section.our_solutions .our_solutions_wrapper {
    background-color: var(--proweb-gray);
    border-radius: 16px;
    padding: 40px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

section.our_solutions .our_solutions_wrapper.bg_image {
    background-image: url('../images/background/our_solutions_bg.jpg');
    background-position: center;
    background-repeat: no-repeat;
    height: 75vh;
    background-size: cover;
    filter: grayscale(100%);
    transition: all .3s;
}

section.our_solutions .our_solutions_wrapper.bg_image:hover {
    filter: grayscale(0%);
}

section.our_solutions .our_solutions_wrapper .number {
    position: absolute;
    top: 20px;
    left: 20px;
    background-color: #fff;
    padding: 10px 14px;
    border-radius: 12px;
    font-weight: 600;
    font-size: 16px;
    color: var(--proweb-orange);
}

section.our_solutions .our_solutions_wrapper .number-right {
    position: absolute;
    top: 20px;
    right: 20px;
    background-color: #fff;
    padding: 10px 14px;
    border-radius: 12px;
    font-weight: 600;
    font-size: 16px;
    color: var(--proweb-orange);
}

section.our_solutions .our_solutions_wrapper .description {
    position: absolute;
    top: 0;
    right: 0;
    width: 220px;
    background-color: var(--proweb-white);
    padding: 0 0 20px 20px;
    border-bottom-left-radius: 16px;
    border-top-right-radius: 16px;
}

section.our_solutions .our_solutions_wrapper .swiper-wrapper {
    background-color: var(--proweb-gray) !important;
}

section.our_solutions .our_solutions_wrapper .description-right {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 220px;
    background-color: var(--proweb-white);
    padding: 20px 20px 0 0;
    border-bottom-left-radius: 16px;
    border-top-right-radius: 16px;
}

section.our_solutions .our_solutions_wrapper .description-right .notMeanLeftBox {
    right: -40px;
    bottom: 0px;
    transform: rotate(180deg);
    background: #ffffff;
    position: absolute;
    width: 40px;
    height: 40px;
    clip-path: polygon(0% 0%, 63.15% 0%, 80.9% 8.54%, 89.96% 17.24%, 96% 28.03%, 100% 50%, 100% 100%, 100% 0%);
}

section.our_solutions .our_solutions_wrapper .description-right .notMeanBottomBox {
    top: -40px;
    left: 0px;
    transform: rotate(180deg);
    background: #ffffff;
    position: absolute;
    width: 40px;
    height: 40px;
    clip-path: polygon(0% 0%, 63.15% 0%, 80.9% 8.54%, 89.96% 17.24%, 96% 28.03%, 100% 50%, 100% 100%, 100% 0%);
}

section.our_solutions .our_solutions_wrapper .description .notMeanLeftBox {
    background: #ffffff;
    position: absolute;
    right: 0px;
    bottom: -39px;
    width: 40px;
    height: 40px;
    clip-path: polygon(0% 0%, 63.15% 0%, 80.9% 8.54%, 89.96% 17.24%, 96% 28.03%, 100% 50%, 100% 100%, 100% 0%);
}


section.our_solutions .our_solutions_wrapper .description .notMeanBottomBox {
    background: #ffffff;
    position: absolute;
    top: 0px;
    left: -39px;
    width: 40px;
    height: 40px;
    clip-path: polygon(0% 0%, 63.15% 0%, 80.9% 8.54%, 89.96% 17.24%, 96% 28.03%, 100% 50%, 100% 100%, 100% 0%);
}

section.our_solutions .our_solutions_wrapper .description-right p {
    font-size: 14px;
    line-height: 1.6;
    color: #333;
    border: 2px solid rgb(230, 230, 230);
    background-color: #fff;
    padding: 16px;
    border-radius: 16px;
    text-align: left;
}

section.our_solutions .our_solutions_wrapper .description p {
    font-size: 14px;
    line-height: 1.6;
    color: #333;
    border: 2px solid rgb(230, 230, 230);
    background-color: #fff;
    padding: 16px;
    border-radius: 16px;
    text-align: left;
}



section.our_solutions .our_solutions_wrapper .center_img {
    margin-top: 40px;
    width: 50%;
    max-height: 60vh;
    overflow-y: auto;
    overflow-x: hidden;
    position: relative;
}

section.our_solutions .our_solutions_wrapper .center_img .browser_tab {
    position: sticky;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 2;
}


section.our_solutions .our_solutions_wrapper .center_img img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    /* box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); */
}


section.our_solutions .our_solutions_wrapper .back {
    position: absolute;
    bottom: 20px;
    right: 20px;
    display: inline-block;
    margin-top: 40px;
    font-size: 14px;
    color: #666;
    text-decoration: underline;
    cursor: pointer;
    transition: color 0.3s ease;
}

section.our_solutions .our_solutions_wrapper .back:hover {
    color: var(--proweb-orange);
}



section.how_it_works .section_title h2 {
    font-size: 60px;
    color: #141414;
    font-family: "DmSans semibold";
    text-transform: uppercase;
}

section.how_it_works .steps {
    padding: 60px 0;
    display: flex;
    flex-direction: column;
    gap: 200px;
}

section.how_it_works .step {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

section.how_it_works .step .number {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
}

section.how_it_works .step .number .img img {
    width: 50px;
    height: 50px;
    padding: 5px;
    border-radius: 100%;
    background-color: var(--proweb-black);
}

section.how_it_works .step .number span {
    font-size: 24px;
    font-family: "DmSans semibold";
}

section.how_it_works .step .title p {
    display: inline-block;
    padding: 20px 24px;
    font-size: 32px;
    border-radius: 12px;
    margin-bottom: 20px;
    border: 1px solid #ececec;
    width: 75%;
    line-height: 1.3;
    font-family: "DmSans semibold";
}

section.how_it_works .step .desc p {
    font-size: 16px;
    line-height: 1.6;
    color: #555;
    font-family: "DmSans";
    max-width: 90%;
}

section.how_it_works .img_wrapper {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;

}

section.how_it_works .img_wrapper img:nth-child(1) {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0);
    width: 90%;
    max-width: 100%;
    z-index: 0;
    overflow: visible;
}

section.how_it_works .img_wrapper img:nth-child(2) {
    position: absolute;
    top: 0;
    right: 150px;
    width: 100px;
    height: 100px;
    object-fit: cover;
    z-index: 3;
    transition: all .6s;
}

section.how_it_works .img_wrapper img:nth-child(3) {
    filter: grayscale(100%);
    width: 280px;
    height: 280px;
    transition: all .6s;
    border-radius: 50%;
    object-fit: cover;
    z-index: 2;
    position: relative;
}

section.how_it_works .step:hover .img_wrapper img:nth-child(2) {

    transform: rotate(90deg);
}

section.how_it_works .step:hover .img_wrapper img:nth-child(3) {
    filter: grayscale(0%);
}

section.how_it_works .img_wrapper img:nth-child(4) {
    position: absolute;
    bottom: -300px;
    left: 55%;
    transform: translate(-55%, 0);
    overflow: visible;
    width: 80px;
    height: 200px;
    object-fit: cover;
}

section.how_it_works .img_wrapper img.second_way {
    bottom: -300px;
    height: 300px;
}


/* Solution Detailed */





/* Industrie Section */
section.industry {
    margin: 0 0 120px 0;
}

section.industry .industry_wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 32px;
    margin: 0;
}

section.industry .industry_wrapper .right {
    width: 496px;
    max-height: 720px;
    overflow: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 16px;
    padding: 0;
}

section.industry .industry_wrapper .right {
    scrollbar-color: var(--proweb-orange) var(--proweb-gray);
}


section.industry .industry_wrapper .right .item {
    padding: 10px 0;
    width: 100%;
}

section.industry .industry_wrapper .right .item .item_title {
    color: var(--proweb-black);
    font: 400 32px/42px "DMSans", sans-serif;
    text-align: left;
    display: block;
    margin: 0 0 16px 0;
}

section.industry .industry_wrapper .right .item .item_description {
    color: #727272;
    font: 400 24px/31px "DMSans", sans-serif;
    text-align: left;
}

section.industry .industry_wrapper .right .item .item_link {
    display: block;
    margin-top: 16px;
    width: fit-content;
    background-color: var(--proweb-gray);
    color: var(--proweb-orange);
    font-family: "Dmsans";
    padding: 6px 12px;
    border-radius: 35px;
    transition: all .3s;
}

section.industry .industry_wrapper .right .item .item_link:hover {
    background-color: var(--proweb-black);
    color: var(--proweb-white);
}

section.industry .industry_wrapper .left {
    width: calc(100% - 32px - 496px);
    border-radius: 16px;
    background: var(--proweb-gray);
    padding: 44px 32px;
}

section.industry .industry_wrapper .left .industry_title {
    color: var(--proweb-black);
    font: 500 40px/40px "HelveticaNeue Medium", sans-serif;
    text-align: left;
    margin: 0 0 24px 0;
}

section.industry .industry_wrapper .left .industry_title span {
    color: var(--proweb-orange);
    font: italic 100 40px/40px "HelveticaNeue Thin", sans-serif;
}

section.industry .industry_wrapper .left .industry_description {
    color: #727272;
    font: 400 20px/26px "DMSans", sans-serif;
    text-align: left;
    margin: 0 0 44px 0;
}

section.industry .industry_wrapper .left .carousel_container {
    height: 472px;
    border-radius: 16px;
    overflow: hidden;
}

/* Industrie Section */



/* Industrie Section Detailed */
section.industry .industry_detailed {
    border-radius: 16px;
    background: var(--proweb-gray);
    padding: 44px 32px;
}

section.industry .industry_detailed .industry_wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 56px;
    margin: 0;
}

section.industry .industry_detailed .industry_wrapper .right {
    width: calc(100% - 56px - 573px);
    max-height: 791px;
    overflow: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 32px;
    padding: 0;
}

section.industry .industry_detailed .industry_wrapper .left {
    width: 573px;
    border-radius: 0;
    background: none;
    padding: 0;
}

section.industry .industry_detailed .industry_wrapper .left .industry_title {
    color: var(--proweb-black);
    font: 500 52px/52px "HelveticaNeue Medium", sans-serif;
    text-align: left;
    margin: 0 0 24px 0;
}

section.industry .industry_detailed .industry_wrapper .left .industry_title span {
    color: var(--proweb-orange);
    font: italic 100 52px/52px "HelveticaNeue Thin", sans-serif;
}

section.industry .industry_detailed .industry_wrapper .left .industry_description {
    color: #595959;
    font: 400 24px/31px "DMSans", sans-serif;
    text-align: left;
    margin: 0 0 50px 0;
    height: 186px;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 6 !important;
    line-clamp: 6 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.industry .industry_detailed .industry_wrapper .left .industry_description span {
    font: 800 24px/31px "DMSans ExtraBold", sans-serif;
}

section.industry .industry_detailed .industry_wrapper .left .carousel_container {
    height: 472px;
    border-radius: 16px;
    overflow: hidden;
}

section.industry .industry_detailed .industry_wrapper .right .right_item {
    width: 100%;
    padding: 32px;
    border-top: 1px solid #727272;
    position: relative;
}

section.industry .industry_detailed .industry_wrapper .right .right_item::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 10px;
    height: 40px;
    background-image: url(../images/svg/arrow_Double_Down.svg);
    background-size: cover;
    background-position: center;
}

section.industry .industry_detailed .industry_wrapper .right .right_item .item_title {
    color: var(--proweb-black);
    font: 500 32px/42px "DMSans Medium", sans-serif;
    text-align: left;
    margin: 0 0 15px 0;
}

section.industry .industry_detailed .industry_wrapper .right .right_item .item_description {
    color: #727272;
    font: 500 20px/26px "DMSans Medium", sans-serif;
    text-align: left;
}

/* Industrie Section Detailed */



/* References Section */
.references {
    position: relative;
    margin: 80px 0 120px 0;
}

.references .references_timeline {
    position: absolute;
    top: 45px;
    bottom: 45px;
    right: 0;
    width: 1px;
    background: #5B5B5B;
}

.references .references_item {
    width: 980px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 80px;
    padding: 24px 32px;
    border-radius: 16px;
    background: var(--proweb-gray);
    position: relative;
}

.references .references_item:not(:last-child) {
    margin-bottom: 28px;
}

.references .references_item::after {
    content: attr(data-year);
    position: absolute;
    top: 40px;
    right: -300px;
    font: 500 16px/21px "DMSans Medium", sans-serif;
    color: #5B5B5B;
}

.references .references_item::before {
    content: "";
    position: absolute;
    top: 45px;
    right: -319px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #5B5B5B;
}

.references .references_item.no-year::after {
    content: "";
}

.references .references_item.no-year::before {
    width: 0;
    height: 0;
}

.references .references_item .website {
    font: 400 24px/31px "DMSans", sans-serif;
    color: var(--proweb-black);
    text-align: left;
    max-width: calc((100% - 80px - 250px));
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

.references .references_item a {
    padding: 12px 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    background: var(--proweb-white);
    border-radius: 40px;
}

.references .references_item a .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 20px/20px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

.references .references_item a:hover .arrow_animation .picture {
    transform: translateX(0);
}

/* References Section */


/* Clients Development Section  */
section.clients_development {
    margin: 0 0 120px 0;
}

section.clients_development .clients_development_heading {
    width: 796px;
    margin: 0 auto 80px;
}

section.clients_development .clients_development_heading .heading {
    font: italic 100 80px/80px "HelveticaNeue Thin", sans-serif;
    text-align: center;
    color: var(--proweb-black);
}

section.clients_development .clients_development_heading .heading span {
    font: 500 80px/80px "HelveticaNeue Medium", sans-serif;
}

section.clients_development .clients_programs {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    column-gap: 24px;
    row-gap: 32px;
}

@media only screen and (max-width: 992px) {
    section.clients_development .clients_programs {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media only screen and (max-width: 768px) {
    section.clients_development .clients_programs {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media only screen and (max-width: 576px) {
    section.clients_development .clients_programs {
        grid-template-columns: repeat(1, 1fr);
    }
}

section.clients_development .clients_programs .clients_program {
    background: var(--proweb-gray);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0px 6px 0px 0px #00000014;
    transition: 0.3s;
    cursor: pointer;
}

section.clients_development .clients_programs .clients_program:hover {
    box-shadow: 0px 0px 0px 0px #00000014;
    transform: translateY(5px);
}


section.clients_development .clients_programs .clients_program img {
    transition: 1s;
    filter: grayscale(100%);
}

section.clients_development .clients_programs .clients_program:hover img {
    filter: grayscale(0);
}

section.clients_development .clients_programs .clients_program_description {
    width: 100%;
    background: #161616;
    padding: 16px 44px 32px;
    border-radius: 20px;
    position: relative;
    margin-top: 15px;
    margin-bottom: 15px;
    display: none;
    grid-column: 1 / -1;
}

section.clients_development .clients_programs .clients_program_description.show {
    display: block;
}

section.clients_development .clients_programs .clients_program_description::before {
    content: "";
    position: absolute;
    top: -13px;
    left: var(--arrow-left);
    transform: translateX(-50%);
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-bottom: 15px solid #161616;
}


section.clients_development .clients_programs .clients_program_description .clients_program_close {
    position: absolute;
    top: 16px;
    right: 44px;
    width: 44px;
    height: 44px;
    cursor: pointer;
}

section.clients_development .clients_programs .clients_program_description .horizontal_bar {
    height: 1px;
    width: 100%;
    background: #525252;
    margin: 60px 0 24px;
}

section.clients_development .clients_programs .clients_program_description .clients_title {
    color: var(--proweb-white);
    font: 500 40px/52px "DMSans Medium", sans-serif;
    text-align: left;
    margin: 0 0 15px 0;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.clients_development .clients_programs .clients_program_description .clients_description {
    color: var(--proweb-white);
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: left;
    max-height: 105px;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 5 !important;
    line-clamp: 5 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.clients_development .clients_programs .clients_program_description a {
    padding: 17px 21px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border: 1px solid var(--proweb-white);
    border-radius: 40px;
    margin-top: 20px;
}

section.clients_development .clients_programs .clients_program_description a .context {
    max-width: calc((100% - 4px - 32px));
    color: var(--proweb-white);
    font: 400 24px/24px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

section.clients_development .clients_programs .clients_program_description a:hover .arrow_animation .picture {
    transform: translateX(0);
}

section.clients_development .clients_programs .clients_program_description a .arrow_animation {
    width: 32px;
    height: 32px;
}

section.clients_development .clients_programs .clients_program_description a .arrow_animation .picture {
    width: 32px;
    height: 32px;
}

section.clients_development .clients_programs .clients_program_description a .arrow_animation .picture img {
    width: 32px;
    height: 32px;
}

section.clients_development .clients_programs .clients_program_description a .arrow_animation .picture::before {
    width: 32px;
    height: 32px;
}

/* Clients Development Section  */



/* Reference Detailed  */
section.references_detailed {
    margin: 50px 0 120px 0;
}



section.references_detailed .references_detailed_wrapper {
    position: relative;
}

section.references_detailed .references_detailed_wrapper .title {
    color: var(--proweb-black);
    font: 300 80px/80px "HelveticaNeue Light", sans-serif;
    text-align: left;
    margin: 0 0 20px 0;
}

section.references_detailed .references_detailed_wrapper .date {
    color: #727272;
    font: 400 32px/32px "HelveticaNeue", sans-serif;
    text-align: left;
}

section.references_detailed .references_detailed_wrapper .referenceImage {
    position: relative;
    top: 305px;
    width: 760px;
    height: 1149px;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid var(--proweb-gray);
    box-shadow: 0px 0px 12px 2px #00000014;
    margin: -320px auto 350px;
    cursor: pointer;
}

.referenceArrowHead {
    transition: opacity 0.3s ease;
    transform: translate(295px, 30px) rotate(90deg);
    /* transform: rotate(90deg); */
    opacity: 0;
    position: absolute;
    transform-origin: center;
    pointer-events: none;
}

@media only screen and (min-width: 992px) and (max-width: 1199.98px) {
    .referenceArrowHead {
        transform: translate(265px, 50px) rotate(90deg) !important;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991.98px) {
    .referenceArrowHead {
        transform: translate(188px, 60px) rotate(90deg) !important;
    }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
    .referenceArrowHead {
        transform: translate(188px, 60px) rotate(90deg) !important;
    }
}

@media (max-height: 800px) {
    section.references_detailed .references_detailed_wrapper .referenceDetailArrowContainer {
        height: 100vh !important;
    }

    section.references_detailed .references_detailed_wrapper .referenceImage {
        /* margin: -280px auto 0; */
    }

}

section.references_detailed .references_detailed_wrapper .referenceDetailArrowContainer .referenceArrowHead {
    /* opacity: 0; */
}

section.references_detailed .references_detailed_wrapper .referenceDetailArrowContainer {
    width: 100%;
    margin-top: -148px;
    margin-left: 170px;
    position: absolute;
    z-index: -1;
}


section.references_detailed .references_detailed_wrapper svg {
    width: 100%;
    height: 100%;
    overflow: visible;
}

section.references_detailed .references_detailed_wrapper path {
    stroke: var(--proweb-orange);
    stroke-width: 5;
    fill: none;
}

section.references_detailed .references_detailed_wrapper .referenceDetailDot {
    fill: var(--proweb-orange);
    stroke: none;
    r: 10;
}

.animate-path {
    stroke-dasharray: 2000;
    /* Big enough to cover full path length */
    stroke-dashoffset: 2000;
    animation: drawPath 4s ease forwards;
}

@keyframes drawPath {
    to {
        stroke-dashoffset: 0;
    }
}

/* Reference Detailed  */



/* Work Process */
section.work_process {
    margin: 0 0 180px 0;
}

section.work_process .work_process_wrapper {
    position: relative;
}

section.work_process .work_process_wrapper .title {
    color: var(--proweb-black);
    font: 500 48px/60px "DMSans Medium", sans-serif;
    text-align: left;
    margin: 0 0 28px 0;
    width: 805px;
}

section.work_process .work_process_wrapper .description {
    color: var(--proweb-orange);
    font: 500 48px/62px "DMSans Medium", sans-serif;
    text-align: left;
    width: 805px;

}

section.work_process .work_process_wrapper .description span {
    font: italic 100 48px/62px "DMSans Thin", sans-serif;
}

section.work_process .work_process_wrapper .work_process_sections {
    margin-top: 280px;
}

section.work_process .work_process_wrapper .work_process_sections .endSection {
    margin-top: 600px;
    color: var(--proweb-black);
    font: 500 60px/78px "DMSans Medium", sans-serif;
    text-align: left;
}

section.work_process .work_process_wrapper .work_process_sections .endSection span {
    color: var(--proweb-orange);
    font: italic 100 60px/78px "DMSans Thin", sans-serif;
}

section.work_process .work_process_wrapper .work_process_sections .workSection {
    height: 410px;
    width: 1100px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

section.work_process .work_process_wrapper .work_process_sections .workSection:not(:last-child) {
    margin-bottom: 150px;
}

section.work_process .work_process_wrapper .work_process_sections .workSection:nth-child(2n + 1) {
    margin-left: auto;
}

section.work_process .work_process_wrapper .work_process_sections .workSection:nth-child(2n) .imageContainer {
    order: 1;
}

section.work_process .work_process_wrapper .work_process_sections .workSection:nth-child(2n) .context {
    order: 2;
}

section.work_process .work_process_wrapper .work_process_sections .workSection .imageContainer {
    width: calc((100% - 40px - 517px));
    height: 100%;
    background: #0000001F;
    border-radius: 16px;
    overflow: hidden;
    cursor: pointer;
}

section.work_process .work_process_wrapper .work_process_sections .workSection .imageContainer img {
    transition: 1s;
    filter: grayscale(100%);
}

section.work_process .work_process_wrapper .work_process_sections .workSection .imageContainer:hover img {
    filter: grayscale(0);
}

section.work_process .work_process_wrapper .work_process_sections .workSection .context {
    width: 517px;
    max-height: 250px;
    color: var(--proweb-black);
    font: 500 36px/50px "DMSans Medium", sans-serif;
    text-align: left;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 5 !important;
    line-clamp: 5 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.work_process .work_process_wrapper .workProcessArrowContainer {
    position: absolute;
    top: 303px;
    left: 0;
    width: 100%;
    z-index: -1;
}

section.work_process .work_process_wrapper svg {
    width: 100%;
    height: 100%;
    overflow: visible;
}

section.work_process .work_process_wrapper path {
    stroke: var(--proweb-orange);
    stroke-width: 5;
    fill: none;
}

section.work_process .work_process_wrapper .workProcessDot {
    fill: var(--proweb-orange);
    stroke: none;
    r: 10;
}

section.work_process .work_process_wrapper #workProcessMovingDot {
    opacity: 0;
}

/* Work Process */



/* Choose Work Section  */
section.choose_work {
    margin: 0 0 120px 0;
}

section.choose_work .choose_work_wrapper {
    border-radius: 20px;
    padding: 40px 44px 32px;
    background: var(--proweb-gray);
}

section.choose_work .choose_work_wrapper .title {
    color: var(--proweb-black);
    font: 300 24px/31px "DMSans Light", sans-serif;
    text-align: left;
    text-transform: lowercase;
    margin: 0 0 12px 0;
}

section.choose_work .choose_work_wrapper .description {
    color: var(--proweb-black);
    font: 300 60px/70px "DMSans Light", sans-serif;
    text-align: left;
    text-transform: lowercase;
    margin: 0 0 60px 0;
}

section.choose_work .choose_work_wrapper form {
    margin: 0 0 55px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 32px;
}

section.choose_work .choose_work_wrapper form .switcher_item {
    background: var(--proweb-white);
    width: calc((100% - 2 * 32px) / 3);
    padding: 32px;
    border-radius: 20px;
    border: 1px solid #E9E6E6;
}

section.choose_work .choose_work_wrapper form .switcher_item .switcher_title {
    margin: 0 0 20px 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
}

section.choose_work .choose_work_wrapper form .switcher_item .switcher_title .icon {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    padding: 12px;
    border: 1px solid #FF8A52;
}

section.choose_work .choose_work_wrapper form .switcher_item .switcher_title .text {
    max-width: calc(100% - 16px - 52px);
    color: var(--proweb-black);
    font: 300 28px/36px "DMSans Light", sans-serif;
    height: 36px;
    text-align: left;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.choose_work .choose_work_wrapper form .switcher_item .switcher_description {
    color: #838383;
    font: 300 24px/31px "DMSans Light", sans-serif;
    height: 31px;
    text-align: left;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
    margin: 0 0 40px 0;
}

section.choose_work .choose_work_wrapper form .switcher_item .switcher_label {
    width: 84px;
    height: 44px;
    border-radius: 100px;
    box-shadow: 1px 1px 4px 0px #00000029 inset;
    overflow: hidden;
}

section.choose_work .choose_work_wrapper form .switcher_item .switcher_label label {
    position: relative;
    width: 100%;
    height: 100%;
}

section.choose_work .choose_work_wrapper form .switcher_item .switcher_label label input {
    opacity: 0;
    width: 0;
    height: 0;
    visibility: hidden;
}

section.choose_work .choose_work_wrapper form .switcher_item .switcher_label label span {
    position: absolute;
    cursor: pointer;
    background-color: #D9D9D9;
    transition: 0.4s;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: 1px 1px 4px 0px #00000029 inset;
}

section.choose_work .choose_work_wrapper form .switcher_item .switcher_label label span:before {
    position: absolute;
    content: "";
    height: 36px;
    width: 36px;
    top: 50%;
    transform: translateY(-50%);
    left: 4px;
    transition: 0.4s;
    border-radius: 50%;
    background-color: var(--proweb-white);
    box-shadow: 0px 2px 4px 0px #00000029;
}

section.choose_work .choose_work_wrapper form .switcher_item .switcher_label label input:checked+span {
    background-color: var(--proweb-orange);
}

section.choose_work .choose_work_wrapper form .switcher_item .switcher_label label input:checked+span:before {
    transform: translate(40px, -50%);
}

section.choose_work .choose_work_wrapper .switcherBack {
    margin: 0 auto;
    width: 80%;
    position: relative;
    overflow: hidden;
}

section.choose_work .choose_work_wrapper .switcherBack .switcher_output {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 40px;
    padding: 12px 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 9px solid #FF9969;
    background: #FF6720;
    transition: 0.3s;
}

section.choose_work .choose_work_wrapper .switcherBack .switcher_output a {
    display: flex;
    align-items: center;
    color: white;
    font-size: 24px;

}

section.choose_work .choose_work_wrapper .switcherBack .switcher_output .arrow_animation .picture:before,
section.choose_work .choose_work_wrapper .switcherBack .switcher_output .arrow_animation .picture img,
section.choose_work .choose_work_wrapper .switcherBack .switcher_output .arrow_animation .picture,
section.choose_work .choose_work_wrapper .switcherBack .switcher_output .arrow_animation {
    width: 32px !important;
    height: 32px !important;
}

section.choose_work .choose_work_wrapper .switcherBack .switcher_output:hover .arrow_animation .picture {
    transform: translateX(0);
}

section.choose_work .choose_work_wrapper .switcherBack .switcher_output.active {
    /* opacity: 0 !important; */
    /* visibility: hidden; */
    /* top: 20px; */
    top: 100%;
    visibility: visible;
    opacity: 1;
}

section.choose_work .choose_work_wrapper .switcherBack .switcher_output .text {
    max-width: 610px;
    height: 31px;
    font: 500 24px/31px "DMSans Light", sans-serif;
    color: var(--proweb-white);
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
}

/* Choose Work Section  */


/* Job Detailed Page */
section.job_detailed {
    margin: 0 0 120px 0;
}

section.job_detailed .about_job {
    background: var(--proweb-gray, #f5f5f5);
    padding: 60px;
    border-radius: 20px;
    position: relative;
}

.about_job h2 {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 30px;
}

.apply_title {
    display: flex;
    align-items: center;
    gap: 20px;
}

@media (max-width: 992px) {
    .apply_title {
        flex-direction: column;
        gap: 0;
        align-items: flex-start;
    }

    .apply_title .job_button {
        margin-bottom: 10px;
        white-space: nowrap;
    }
}

.apply_title .job_button span {
    font-style: italic;
    color: var(--proweb-orange);
    font-family: "DmSans";
}

.apply_title .job_button:nth-child(2),
.apply_title .job_button:nth-child(3) {
    font-family: "DmSans light";
}

.job_button {
    background-color: white;
    border: none;
    padding: 12px 24px;
    width: fit-content;
    border-radius: 30px;
    font-size: 16px;
    font-family: "DmSans medium";
    margin-bottom: 30px;
}

.job_description {
    font-size: 16px;
    line-height: 1.7;
    color: #333;
    margin-bottom: 40px;
}

.job_info_grid {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    margin-bottom: 60px;
}

.job_info_block {
    flex: 1 1 250px;
}

.info_title {
    display: inline-block;
    background-color: var(--proweb-white);
    padding: 10px 20px;
    border-radius: 30px;
    font-family: "DmSans medium";
    margin-bottom: 20px;
    font-size: 16px;
}

.skills_list {
    padding-left: 20px;
    font-size: 15px;
    color: #444;
}

.skills_list li {
    margin-bottom: 10px;
    list-style: disc;
}

.job_info_value {
    font-size: 16px;
    font-weight: 500;
    margin-top: 10px;
    color: #111;
}

.apply_now_area {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.apply_button {
    font-size: 20px;
    color: var(--proweb-orange);
    text-decoration: none;
    font-family: "DmSans Medium";
}

.apply_arrow {
    padding: 12px;
    width: 45px;
    height: 45px;
    font-size: 32px;
    color: var(--proweb-orange);
    margin-top: 5px;
    animation: bounce 1.5s infinite;
    background-color: var(--proweb-white);
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

@keyframes bounce {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(16px);
    }
}



/* Light Box image */

.light_box_image {
    cursor: pointer;
}

/* Make modal background slightly dimmed */
.modal.show {
    background-color: gba(0, 0, 0, 0.03);
}

/* Modal content (transparent by default in JS) */
#modalImage .modal-content {
    background-color: transparent;
    border: none;
    box-shadow: none;
}

/* Modal body - no padding */
#modalImage .modal-body {
    padding: 0;
    text-align: center;
}

/* Image styling inside the modal */
#modalImage {
    max-width: 100%;
    max-height: 90vh;
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 12px;
}


/* Light Box image */




/* Privacy Policy */
section.privacy_policy .title h1 {
    font-size: 60px;
    color: #141414;
    font-family: "DmSans medium";
}

section.privacy_policy .privacy_policy_wrapper {
    margin: 40px 0;
    display: flex;
    gap: 20px;
    flex-direction: column;
}

section.privacy_policy .privacy_policy_wrapper li h2 {
    color: #141414;
    font-family: "DmSans medium";
    font-size: 31px;
}

section.privacy_policy .privacy_policy_wrapper li p {
    font-family: "DmSans";

}

/* Privacy Policy */




/* Lets talk ideas */
section.talk_ideas {
    margin: 0 0 120px 0;
}

section.talk_ideas .main_heading_row {
    width: 890px;
}

section.talk_ideas .talk_ideas_wrapper .talk_ideas_form {
    background: var(--proweb-gray, #f5f5f5);
    padding: 60px;
    border-radius: 20px;
}

section.talk_ideas .talk_ideas_wrapper .talk_ideas_form .title_context {
    color: var(--proweb-black);
    font: 400 24px/31px "DMSans", sans-serif;
    text-align: left;
}

section.talk_ideas .talk_ideas_wrapper .talk_ideas_form .footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 32px;
}

section.talk_ideas .talk_ideas_wrapper .talk_ideas_form .footer button {
    padding: 17px 54px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: none;
    outline: none;
    box-shadow: none;
    border: 1px solid var(--proweb-white);
    background: var(--proweb-white);
    border-radius: 40px;
}



section.talk_ideas .talk_ideas_wrapper .talk_ideas_form .footer button .context {
    max-width: calc((100% - 4px - 24px));
    color: var(--proweb-black);
    font: 400 24px/24px "DMSans", sans-serif;
    text-align: right;
    position: relative;
}

section.talk_ideas .talk_ideas_wrapper .talk_ideas_form .footer button:hover .arrow_animation .picture {
    transform: translateX(0);
}

section.talk_ideas .talk_ideas_wrapper .talk_ideas_form .footer .description {
    width: 350px;
    color: var(--proweb-black);
    font: 400 16px/21px "DMSans", sans-serif;
    text-align: left;
}

section.talk_ideas .talk_ideas_wrapper .talk_ideas_form .footer .description a {
    color: var(--proweb-black);
    position: relative;
}

section.talk_ideas .talk_ideas_wrapper .talk_ideas_form .footer .description a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 2px;
    width: 100%;
    height: 0.8px;
    background: var(--proweb-black);
}

section.talk_ideas .talk_ideas_wrapper .talk_ideas_form .main_form {
    margin: 60px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    column-gap: 24px;
    row-gap: 52px;
}


section.talk_ideas .talk_ideas_wrapper .talk_ideas_form .main_form .industry_wrapper {
    width: 100%;
}





section.talk_ideas .talk_ideas_wrapper .talk_ideas_form .main_form .input_wrapper {
    border-bottom: 1px solid #353535;
    margin: 20px 0;
}

section.talk_ideas .talk_ideas_wrapper .talk_ideas_form .main_form .input_wrapper textarea {
    height: 80px;
}

section.talk_ideas .talk_ideas_wrapper .talk_ideas_form .main_form .input_wrapper textarea,
section.talk_ideas .talk_ideas_wrapper .talk_ideas_form .main_form .input_wrapper input {
    background: transparent;
    border: none;
    outline: none;
    box-shadow: none;
    color: var(--proweb-black);
    font: 600 16px/21px "DMSans SemiBold", sans-serif;
    text-align: left;
    padding-left: 0;
    padding-right: 0;
}

section.talk_ideas .talk_ideas_wrapper .talk_ideas_form .main_form .input_wrapper label {
    color: var(--proweb-black);
    font: 600 16px/21px "DMSans SemiBold", sans-serif;
    text-align: left;
    padding-left: 0;
    padding-right: 0;
}

section.talk_ideas .talk_ideas_wrapper .project_type,
section.talk_ideas .talk_ideas_wrapper .badge_range,
section.talk_ideas .talk_ideas_wrapper .team_size {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    align-items: flex-start;
    justify-self: flex-start;
    gap: 12px;
}

section.talk_ideas .talk_ideas_wrapper .project_type li a,
section.talk_ideas .talk_ideas_wrapper .badge_range li a,
section.talk_ideas .talk_ideas_wrapper .team_size li a {
    display: block;
    width: 100%;
    height: 100%;
    text-align: center;
    color: var(--proweb-black);
    font: 500 16px/21px 'DMSans medium', sans-serif;
    padding: 12px 40px;
    border-radius: 40px;
    border: 1px solid var(--proweb-black);
    transition: all .6s;
}

section.talk_ideas .talk_ideas_wrapper .project_type li a:hover,
section.talk_ideas .talk_ideas_wrapper .badge_range li a:hover,
section.talk_ideas .talk_ideas_wrapper .team_size li a:hover {
    background-color: var(--proweb-orange);
    color: var(--proweb-white);
    border-color: var(--proweb-white);
}

section.talk_ideas .talk_ideas_wrapper .project_type li.active a,
section.talk_ideas .talk_ideas_wrapper .badge_range li.active a,
section.talk_ideas .talk_ideas_wrapper .team_size li.active a {
    background: var(--proweb-orange);
    color: var(--proweb-white);
    border: 1px solid var(--proweb-orange);
}



section.talk_ideas .talk_ideas_wrapper form .upload_cv .heading {
    margin: 0 0 16px 0;
    color: var(--proweb-black);
    font: 600 16px/21px "DMSans SemiBold", sans-serif;
    text-align: left;
}

section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader {
    height: 125px;
    width: 100%;
    border-radius: 16px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    border: 2px dashed #5e5e5e;
}

section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .drop_area {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 16px;
    position: relative;
    overflow: hidden;
}

section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .drop_area.active {
    display: none;
}

section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .drop_area .input_file {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .drop_area .image_upload {
    width: 100%;
    height: 100%;
    padding: 16px 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .drop_area .image_upload img {
    display: block;
    width: 24px;
    height: 24px;
    object-fit: cover;
}

section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .drop_area .image_upload span {
    font: 400 16px/21px "DMSans", sans-serif;
    color: var(--proweb-black);
    background: var(--proweb-white);
    border-radius: 40px;
    padding: 10px 24px;
    margin: 12px 0 0 0;
}

section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .cv_display {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 30px;
    overflow: hidden;
    display: none;
}

section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .cv_display.active {
    display: flex;
}

section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .cv_display .cv_name {
    max-width: 500px;
    height: 50px;
    border-radius: 20px;
    background: var(--proweb-white);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 30px;
}

section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .cv_display .cv_name .text {
    color: var(--proweb-black);
    font: 500 20px/30px "DMSans Medium", sans-serif;
    text-align: center;
    user-select: none;
    display: -webkit-inline-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .cv_display .cv_configuration {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 115px;
    gap: 15px;
}

section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .cv_display .cv_configuration .delete,
section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .cv_display .cv_configuration .new {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #FF2E00;
    background: var(--proweb-white);
}

section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .cv_display .cv_configuration .delete img,
section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .cv_display .cv_configuration .new img {
    width: 28px;
    height: 28px;
}

section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .cv_display .cv_configuration .new {
    position: relative;
}

section.talk_ideas .talk_ideas_wrapper form .upload_cv .image_uploader .cv_display .cv_configuration .new input {
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: auto;
}


/* Lets talk ideas */


/* Accept Cookies modal  */

.cookie-consent {
    position: fixed;
    bottom: 20px;
    left: 20px;
    max-width: 472px;
    background: white;
    border: 1px solid #ccc;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
    z-index: 5;
    display: none;
}

.cookie-consent h2 {
    margin: 0 0 10px;
    font-size: 1.2rem;
    font-family: "DmSans medium";
}

.cookie-consent p {
    font-size: 0.95rem;
    font-family: "DmSans";
    margin-bottom: 20px;
}

.cookie-consent a {
    text-decoration: underline;
    color: #000;
}

.cookie-buttons {
    display: flex;
    gap: 12px;
    justify-content: space-between;
    flex-wrap: wrap;
}

.cookie-buttons button {
    width: fit-content;
    padding: 10px 20px;
    border-radius: 30px;
    border: 1px solid var(--proweb-black);
    background: var(--proweb-white);
    cursor: pointer;
    font-family: "DmSans medium";
}

.cookie-buttons .customize {
    background-color: var(--proweb-gray);
    border-color: var(--proweb-gray);
    color: var(--proweb-black);
}

.cookie-buttons .accept {
    background: var(--proweb-black);
    color: var(--proweb-white);
}

.cookie-buttons .decline:hover,
.cookie-buttons .accept:hover {
    opacity: 0.9;
}

/* Accept Cookies modal  */

/* Cookies Form Modal */
#cookiesModal .modal-dialog {
    max-width: 50%;
}

#cookiesModal .modal-dialog .modal-content {
    padding: 24px;
}

#cookiesModal .modal-dialog .modal-content .modal-header {
    display: flex;
    flex-direction: column;
    align-items: start;
    border: none;
}

#cookiesModal .modal-dialog .modal-content .close .fa-xmark {
    transition: all .3s;
    font-size: 1.2em;
}

#cookiesModal .modal-dialog .modal-content .close {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 34px;
    height: 34px;
    color: gray;
    border: 1px solid gray;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    /* z-index: 10; */
}

#cookiesModal .modal-dialog .modal-content .close:hover .fa-xmark {
    transform: rotate(90deg);
}


#cookiesModal .modal-dialog .modal-content .modal-header .modal-title {
    font-family: "DmSans semibold";
    color: #141414;
}

#cookiesModal .modal-dialog .modal-content .modal-header p a {
    font-family: "DmSans";
    text-decoration: underline;
    color: #424242;
}

#cookiesModal .modal-dialog .modal-content .modal-header p {
    font-family: "DmSans";
    color: #424242;
}

#cookiesModal .modal-dialog .modal-content .modal-body ul {
    border: 2px solid #ececec;
    padding: 16px 20px;
    border-radius: 8px;
}

#cookiesModal .modal-dialog .modal-content .modal-body ul li h3 {
    font-family: "Dmsans medium";
}

#cookiesModal .modal-dialog .modal-content .modal-body ul li p {
    font-family: "DmSans";
}

#cookiesModal .modal-dialog .modal-content .modal-body ul li p:first-child {
    font-style: italic;

}

#cookiesModal .modal-dialog .modal-content .modal-body ul li p.active {
    color: var(--proweb-orange);
    font-family: "dmsans medium";
}

#cookiesModal .modal-dialog .modal-content .modal-body ul li:last-child {
    border: none;
}

#cookiesModal .modal-dialog .modal-content .modal-body ul li {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px;
    border-bottom: 2px solid #ececec;
}

#cookiesModal .modal-dialog .modal-content .modal-body ul li .switcher_label {
    width: 47px;
    height: 24px;
    border-radius: 100px;
    box-shadow: 1px 1px 4px 0px #00000029 inset;
    overflow: hidden;
}

#cookiesModal .modal-dialog .modal-content .modal-body ul li .switcher_label label {
    position: relative;
    width: 100%;
    height: 100%;
}

#cookiesModal .modal-dialog .modal-content .modal-body ul li .switcher_label label input {
    opacity: 0;
    width: 0;
    height: 0;
    visibility: hidden;
}

#cookiesModal .modal-dialog .modal-content .modal-body ul li .switcher_label label span {
    position: absolute;
    cursor: pointer;
    background-color: #D9D9D9;
    transition: 0.4s;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: 1px 1px 4px 0px #00000029 inset;
}

#cookiesModal .modal-dialog .modal-content .modal-body ul li .switcher_label label span:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    top: 50%;
    transform: translateY(-50%);
    left: 3px;
    transition: 0.4s;
    border-radius: 50%;
    background-color: var(--proweb-white);
    box-shadow: 0px 2px 4px 0px #00000029;
}

#cookiesModal .modal-dialog .modal-content .modal-body ul li .switcher_label label input:checked+span {
    background-color: var(--proweb-orange);
}

#cookiesModal .modal-dialog .modal-content .modal-body ul li .switcher_label label input:checked+span:before {
    transform: translate(22px, -50%);
}

#cookiesModal .modal-dialog .modal-content .modal-footer {
    justify-content: flex-start;
}

#cookiesModal .modal-dialog .modal-content .modal-footer button {
    border-radius: 35px;
    border: 1px solid var(--proweb-black);
    position: relative;
    padding: 8px 24px;
    overflow: hidden;
}

#cookiesModal .modal-dialog .modal-content .modal-footer button .text {
    transition: all .2s;
}

#cookiesModal .modal-dialog .modal-content .modal-footer button:hover .text {
    transform: translateY(-150%);
}

#cookiesModal .modal-dialog .modal-content .modal-footer button:hover::after {
    top: 20% !important;
}

#cookiesModal .modal-dialog .modal-content .modal-footer button:last-child {
    background-color: var(--proweb-black);
    color: var(--proweb-white);
    font-family: "DmSans medium";
}

#cookiesModal .modal-dialog .modal-content .modal-footer button::after {
    content: "Decline all";
    position: absolute;
    left: 50%;
    top: 100%;
    width: 100%;
    transform: translate(-50%, 0);
    transition: all .2s;
}

#cookiesModal .modal-dialog .modal-content .modal-footer button:last-child:after {
    content: "Accept all";

}

#cookiesModal .modal-dialog .modal-content .modal-footer button:first-child:after {
    content: "Decline all";
}

/* Cookies Form Modal */

/* Error */
section.error {
    height: 85vh;
    display: flex;
    align-items: center;
}

section.error .error_content {
    position: relative;
    text-align: center;
}

section.error .error_content .bg_image {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}

section.error .error_content .bg_image img {
    width: 100%;
    z-index: 0;
}

section.error .error_content h1 {
    font-size: 128px;
    color: var(--proweb-orange);
    font-family: "DmSans medium";
}

section.error .error_content h1 span {
    color: var(--proweb-black);
}

section.error .error_content h2 {
    font-family: "DmSans medium";
    font-size: 40px;
}

section.error .error_content p {
    font-family: "DmSans";
    width: 40%;
    font-size: 16px;
    position: relative;
    z-index: 1;
    margin: 10px auto;
}

section.error .error_content p a {
    color: var(--proweb-orange);
    text-decoration: underline;
}


/* Error */


.animated-line .extra-dot {
    r: 8;
    /* bigger radius */
    fill: #FF590B;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

/* Pagination */
.pagination {
    list-style: none;
    padding-left: 0;
    display: flex;
    gap: 6px;
}

.pagination li a {
    color: var(--proweb-black);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 10px;
}

.pagination li {
    cursor: pointer;
    overflow: hidden;
    width: 40px;
    height: 40px;
    background: transparent;
    border-radius: 100%;
    border: 1px solid var(--proweb-black);
    transition: 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pagination li.active a,
.pagination li.active {
    background-color: var(--proweb-orange);
    border-color: var(--proweb-orange);
    color: white;
}

.pagination li:hover a {
    color: white;
}

.pagination li:hover {
    background-color: #ff6016;
    border-color: #ff6016;
    color: white;
}

.pagination li.disabled a,
.pagination li.disabled {
    pointer-events: none;
    background: transparent;
    background-color: rgb(228, 228, 228);
    border-color: rgb(228, 228, 228);
    color: #999;
}

.pagination li img {
    width: 24px;
    height: auto;
    vertical-align: middle;
    pointer-events: none;
}



/* Spinner */
.spinner {
    width: 24px;
    height: 24px;
    border-radius: 100%;
    border: 3px dotted rgb(244, 177, 152);
    border-left-color: var(--proweb-orange);
    border-bottom-color: var(--proweb-orange);
    animation: spin 1s linear infinite;
}

@keyframes spin {
    from {
        transform: rotate(0);
    }

    to {
        transform: rotate(360deg);
    }
}

/* Spinner */


/* Root section */
.under_construction {
    position: relative;
    width: 100%;
    height: 100vh;
    padding: 60px 0px;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow-x: hidden;
    font-family: 'Arial', sans-serif;
}

/* Corner image */
.corner_img {
    position: absolute;
    top: 0;
    left: -2px;
    width: 306px;
    height: 306px;
    z-index: 1;
}

.corner_img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* Centered main content */
.main_content {
    position: relative;
    z-index: 2;
    text-align: center;
    margin-top: 100px;
    height: 100%;
    width: 100%;
}

.main_content h1 {
    font-size: 60px;
    font-family: "Dmsans medium";
    margin-bottom: 30px;
    color: #000;
    width: 28%;
    margin: auto;
    text-align: left;
}

.main_content h1 span {
    font-style: italic;
    color: #ff590b;
    font-family: "DmSans light";
}

/* Marquee styling */
.main_content .marquee {
    border-top: 2px solid var(--proweb-black);
    border-bottom: 2px solid var(--proweb-black);
    transform: rotate(-11deg) translate(-5%, 50px);
    overflow: hidden;
    background: #fff;
    width: 110%;
}

.main_content .marquee .content {
    display: flex;
    white-space: nowrap;
    overflow: hidden;
}

.main_content .marquee .track {
    padding: 25px 0;
    display: inline-flex;
    align-items: center;
    gap: 20px;
    font-size: 68px;
    font-weight: 500;
    color: #000;
    animation: ticker 10s linear infinite;
}

.main_content .marquee p {
    font-family: "Dmsans medium";
    color: #222222;
    margin: 0;
    display: inline-block;
}

@keyframes ticker {
    0% {
        transform: translateX(0%);
    }

    100% {
        transform: translateX(-50%);
    }
}


.main_content svg {
    height: 40px;
    width: auto;
    vertical-align: middle;
}

/* Contact Info */
.contact_infos {
    width: 60%;
    max-width: 1200px;
    margin-top: 80px;
    display: flex;
    justify-content: flex-end;
    text-align: center;
    position: absolute;
    bottom: 0;
    right: 0;
    text-align: left;
    padding: 0 30px;
}




.contact_infos .title {
    font-family: "DmSans medium";
    color: #555;
    margin-bottom: 5px;
    font-style: italic;
}

.contact_infos .value {
    color: #555;
    font-family: "DmSans";
    font-size: 16px;
}