:root {
    --background-color: #ffffff;
    --text-color: #1B1B1B;
    --accent-color: #ED1F3D;
    --button-black-bg: #1B1B1B;
    --button-red-bg: #E31B39;
    --button-text: #ffffff;
    --backgound-grey: #F9F9F9;
    --backgound-grey-hover: rgba(0, 0, 0, 0.07);
    --invert-color: invert(0);
    --blur-color: rgba(255, 255, 255, 0.8);
}

[data-theme="dark"] {
    --background-color: #1a1a1a;
    --text-color: #ffffff;
    --accent-color: #ED1F3D;
    --button-black-bg: #ffffff;
    --button-red-bg: #E31B39;
    --button-text: #000000;
    --backgound-grey: #2c2c2c;
    --backgound-grey-hover: rgb(173 173 173 / 8%);
    --invert-color: invert(1);
    --blur-color: rgba(26, 26, 26, 0.8);
}

body {
    background-color: var(--background-color);
    color: var(--text-color);
    font-family: "Inter", sans-serif;
    transition: background-color 0.3s ease, color 0.3s ease;
}

html {
    scroll-behavior: smooth;
    scroll-padding: 90px;
}

/* a,
button {
    color: var(--accent-color);
} */

/* button {
    background-color: var(--button-bg);
    color: var(--button-text);
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
} */

/* button:hover {
    opacity: 0.9;
} */

.theme-toggle {
    padding: 8px 16px;
    background-color: var(--button-bg);
    color: var(--button-text);
    border: none;
    border-radius: 5px;
    cursor: pointer;
    /* border: 1px solid red; */
    width: 100%;
    padding: 0;
    height: 40px;
    position: absolute;
    z-index: 10;
    bottom: 0;
    left: 0;
}

.theme-toggle.btn_dark {
    bottom: unset;
    top: 0;
}

.theme-toggle.btn_white {
    bottom: 0;
    top: unset;
}

.container {
    max-width: 1800px;
    width: 100%;
    padding: 0 60px;
}

.header_wrapper {
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: space-between;
    padding: 40px 0;
    transition: 0.6s;
}

@media(min-width: 992px) {
    .header.sticky .header_wrapper {
        padding: 15px 0;
    }
}

.home .header.sticky {
    box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.25);
    background: var(--background-color) !important;
}

.menu_header ul {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 40px;
    padding-left: 0;
    margin: 0;
}

.menu_header ul li a {
    transition: 0.3s;
    text-decoration: unset;
    font-weight: 380;
    font-size: 18px;
    color: var(--text-color);
    white-space: nowrap;
}

.menu_header .sub-menu li a {
    color: #1B1B1B;
    font-size: 16px;
}

.button_new {
    border-radius: 50px;
    padding: 0 40px;
    height: 48px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: unset;
    cursor: pointer;
    transition: 0.3s;
}

.our_works {
    margin-top: -40px;
}

.header_btn {
    background-color: var(--button-black-bg);
    color: var(--button-text);
    white-space: nowrap;
    font-weight: 500;
    font-size: 16px;
    transition: 0.3s;
}

.header_btn:hover {
    background: #ed1f3d;
    color: white;
}

.new_top {
    height: 75vh;
}

.new_top .container {
    height: 100%;
}

.new_top_wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    margin-top: 50px;
}

.new_top_title {
    font-weight: 600;
    font-size: 90px;
    letter-spacing: -0.03em;
    font-family: "Montserrat", sans-serif;
    margin-bottom: 15px;
    text-align: center;
    margin-top: 0;
    padding: 0;
    color: var(--text-color);
    transition: 0.3s;
}

.new_top_subtitle {
    font-family: "Montserrat", sans-serif;
    font-weight: 600;
    font-size: 42px;
    letter-spacing: -0.03em;
    text-align: center;
    display: block;
    text-align: center;
    margin-bottom: 20px;
}

.new_top_descr {
    font-weight: 200;
    font-size: 24px;
    line-height: 140%;
    letter-spacing: 0.03em;
    text-align: center;
    margin: 0;
    width: 100%;
    max-width: 630px;
}

.new_top_btn {
    background-color: var(--button-red-bg);
    color: #fff;
    margin-top: 30px;
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.new_top_btn:before {
    content: '';
    position: absolute;
    background: radial-gradient(var(--clr), transparent, transparent);
    width: 300px;
    height: 300px;
    top: var(--y);
    left: var(--x);
    translate: -50% -50%;
    transition: 0.5s, top 0s, left 0s;
    opacity: 0;
    z-index: -1;
    color: #fff !important;
}

.new_top_btn:after {
    content: '';
    position: absolute;
    inset: 2px;
    border-radius: 25px;
    background-color: rgba(237, 31, 61, 0.5);
    z-index: -1;
}

.new_top_btn:hover:before {
    opacity: 1;
}

.theme_widget {
    position: fixed;
    right: 10px;
    top: 50%;
    backdrop-filter: blur(2.5px);
    background: rgba(236, 236, 236, 0.7);
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 25px;
    padding: 2px;
    translate: 0 -50%;
    z-index: 2000;
    display: none;
}

.home .theme_widget,
.page-template-page-flex-new .theme_widget {
    display: flex;
}

.white_theme_icon {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    background-color: white;
    width: 25px;
    height: 40px;
}

.dark_theme_icon {
    width: 25px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
}

.theme_icon svg {
    transition: 0.4s;
}

.theme_widget:has(.theme-toggle.btn_white:hover) .dark_theme_icon svg {
    rotate: 55deg;
}

.theme_widget:has(.theme-toggle.btn_dark) .dark_theme_icon {
    background-color: white;
}

.theme_widget:has(.theme-toggle.btn_dark:hover) .white_theme_icon svg {
    rotate: 55deg;
}

.theme_widget:has(.theme-toggle.btn_dark) .white_theme_icon {
    background-color: transparent;
}

body:has(.btn_dark) .header_logo img,
body:has(.btn_dark) .footer_logo img {
    filter: invert(1);
}

.our_works_title {
    font-family: "Montserrat", sans-serif;
    font-weight: 600;
    font-size: 65px;
    line-height: 100%;
    letter-spacing: -0.03em;
    text-transform: uppercase;
    text-align: center;
    color: var(--text-color);
}

.our_works_subtitle {
    font-weight: 300;
    font-size: 19px;
    line-height: 180%;
    text-transform: capitalize;
    text-align: center;
    opacity: 0.5;
    margin-top: -10px;
}

.our_works_wrapper {
    margin-top: 60px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
}

.our_works_wrapper_page {
    margin-bottom: 80px;
}

.our_works_block_img_cover img {
    width: 100%;
    display: block;
    border-radius: 20px;
    transition: 0.4s;
    position: relative;
    z-index: 10;
}

.our_works_block:hover .our_works_block_img_cover img {
    opacity: 0;
    visibility: hidden;
}


.our_works_block_hover {
    opacity: 0;
}

.our_works_block_hover_img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 5;
    transition: 0.7s;
}

.our_works_block:hover .our_works_block_hover_img {
    translate: 0 -50%;
    transition-delay: 0.6s;
    width: 100%;
}

.our_works_block:hover .our_works_block_hover {
    opacity: 1;
}

.our_works_block {
    overflow: hidden;
    position: relative;
    border-radius: 20px;
    isolation: isolate;
    transition: 0.6s;
}

.our_works_block:hover {
    border-radius: 20px 20px 200px 20px;
}


.our_works_block:before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 6;
    height: 185px;
    transition: 0.7s;
    transition-delay: 0.6s;
    translate: 0 15px;
    opacity: 0;
    visibility: hidden;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
}

.our_works_block:hover:before {
    opacity: 1;
    visibility: visible;
    translate: 0 0;
}

.our_works_block_hover_bottom {
    position: absolute;
    left: 40px;
    right: 40px;
    bottom: 36px;
    z-index: 7;
    transition: 0.8s;
    transition-delay: 0.6s;
    translate: 0 15px;
    opacity: 0;
    visibility: hidden;
}

.our_works_block:hover .our_works_block_hover_bottom {
    opacity: 1;
    visibility: visible;
    translate: 0 0;
}

.our_works_block_hover_site {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-bottom: 30px;
}

.our_works_block_hover_site span {
    font-weight: 500;
    font-size: 21px;
    letter-spacing: -0.03em;
    text-align: center;
    color: white;
}

.our_works_block_hover_tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.our_works_block_hover_tags a {
    display: flex;
    justify-content: center;
    align-items: center;
    background: white;
    border-radius: 25px;
    height: 31px;
    padding: 0 15px;
    font-weight: 400;
    font-size: 14px;
    letter-spacing: -0.03em;
    text-align: center;
    color: #000000;
    transition: 0.3s;
}

.inputs-blocks-popup input {
    margin-top: 14px;
}

.our_works_block_hover_tags a:hover {
    color: #fff;
    background: #e91e42;
}

.portfolio_btn {
    margin-top: 60px;
}

.portfolio_btn:hover {
    color: #fff !important;
}

.our_works .container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.testimonials_item {
    height: 523px;
    position: relative;
    isolation: isolate;
    border-radius: 20px;
    overflow: hidden;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #F9F9F9;
}

.testimonials_item_img_bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
    position: absolute;
}

.testimonials_item_img_rate {
    position: absolute;
    left: 50%;
    translate: -50% 0;
    top: 60px;
    z-index: 2;
}

.testimonials_item_txt {
    max-width: 800px;
    transition: 0.8s;
    translate: 0 50px;
}

#breadcrumbs a {
    color: var(--text-color);
}

.testimonials_item:nth-child(2) .testimonials_item_txt {
    translate: 0 -50px;
}

.slick-current .testimonials_item_txt {
    translate: 0 0 !important;
}

.testimonials_item_title {
    font-weight: 500;
    font-size: 25px;
    letter-spacing: -0.03em;
    text-transform: capitalize;
    text-align: center;
    color: white;
    margin-bottom: 25px;
    text-align: center;
}

.testimonials_item_descr p {
    font-weight: 200;
    font-size: 16px;
    line-height: 150%;
    text-align: center;
    color: white;
    font-family: "Inter", sans-serif;
}

.testimonials_item_color .testimonials_item_title {
    color: #1B1B1B;
}

.testimonials_item_color .testimonials_item_descr p {
    color: #1B1B1B;
}

.slick-dots {
    display: flex;
    align-items: center;
    position: absolute;
    left: 50%;
    translate: -50% 0;
    bottom: 60px;
    list-style: none;
    padding-left: 0;
    margin: 0;
    gap: 7px;
    border-radius: 21px;
    padding: 0 15px;
    height: 30px;
    background: rgba(255, 255, 255, 0.15);
    transition: 0.4s;
}

.slick-dots li button {
    font-size: 0;
    color: transparent;
    padding: 0;
    border-radius: 50%;
    width: 10px;
    height: 10px;
    background: white;
    opacity: 0.25;
    margin: 0;
    border: unset;
    display: block;
    transition: 0.4s;
}

.slick-dots li.slick-active button {
    opacity: 1;
}

.slick-dots li {
    height: 10px;
}

.testimonials_wrapper:has(.testimonials_item_color) .slick-dots {
    background: rgba(27, 27, 27, 0.05);
}

.dark_color.slick-dots li button {
    background: #000000;
}

.slick-arrow {
    position: absolute;
    top: 50%;
    translate: 0 -50%;
    left: 60px;
    background: transparent;
    border: unset;
    cursor: pointer;
    background-image: url(/wp-content/uploads/2025/06/slider-arrov.svg);
    background-repeat: no-repeat;
    background-size: cover;
    font-size: 0;
    color: transparent;
    z-index: 10;
    width: 11px;
    height: 23px;
    padding: 0;
    transition: 0.3s;
}

.slick-arrow:hover {
    scale: 1.2;
}

.slick-next {
    left: unset;
    right: 60px;
    rotate: 180deg;
}

.testimonials_wrapper:has(.dark_color) .slick-arrow {
    filter: invert(1);
}

.testimonials {
    padding: 160px 0;
}

.testimonials_wrapper {
    margin-top: 60px;
}

.numbers_block {
    margin-top: 105px;
    display: flex;
    gap: 50px;
}

.number_block {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.number_block_num,
.number_block_num span {
    font-weight: 600;
    font-size: 75px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--black);
    text-align: left;
}

.number_block:nth-child(4) .number_block_num {
    width: 414px;
}

.number_block:nth-child(3) .number_block_num {
    width: 331px;
}

.number_block_txt {
    font-weight: 500;
    font-size: 18px;
    line-height: 120%;
    color: var(--black);
    width: 100%;
    max-width: 310px;
    padding-top: 25px;
    margin-top: 25px;
    border-top: 1px solid #c2c2c2;
}

.services {
    padding-bottom: 100px;
}

.services_wrapper {
    margin-top: 60px;
}

.services_item {
    display: flex;
    align-items: center;
}

.services_wrapper_video video {
    height: 100%;
    display: block;
    object-fit: cover;
    pointer-events: none;
}

.services_wrapper_video {
    border-radius: 0 25px 25px 0;
    overflow: hidden;
    height: 710px;
}

.services_wrapper_side {
    flex-basis: 50%;
}

.services_wrapper_side img,
.services_wrapper_side video {
    width: 100%;
}

.services_wrapper_txt {
    padding: 30px 75px;
}

.services_wrapper_side_title {
    font-weight: 500;
    font-size: 60px;
    line-height: 110%;
    text-transform: uppercase;
    color: var(--black);
    margin-bottom: 15px;
}

.services_wrapper_side_subtitle {
    font-size: 30px;
    margin-bottom: 10px;
}

.services_wrapper_side_descr p {
    font-weight: 200;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0.01em;
    color: var(--black);
    margin-bottom: 20px;
}

.services_wrapper_side_descr p:last-child {
    margin-bottom: 0;
}

.services_wrapper_side_btns {
    margin-top: 35px;
    display: flex;
    align-items: center;
    gap: 15px;
}

.services_wrapper_side_btns a,
.services_wrapper_side_btns .services_link_new {
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    padding: 0 32px;
    height: 53px;
    display: inline-flex;
    cursor: pointer;
}

.services_link_price {
    border: 1px solid var(--text-color);
    background: var(--background-color);
    color: var(--text-color);
    transition: 0.4s;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    padding: 0 32px;
    height: 53px;
    display: inline-flex;
    cursor: pointer;
}

.services_link_price:hover {
    background: var(--text-color);
    color: var(--button-text);
}

.services_link {
    background: #ED1F3D;
    color: white;
    position: relative;
    transition: 0.6s;
    border: 1px solid transparent;
}

.services_link:hover {
    background: #1B1B1B;
    border: 1px solid #fff;
}

.services_link span {
    color: white;
    font-weight: 500;
    font-size: 16px;
    letter-spacing: -0.03em;
    display: block;
    padding-left: 60px;
    transition: 0.6s;
}

.services_link_arrow {
    border-radius: 22px;
    background: white;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 5px;
    top: 5px;
    bottom: 5px;
    z-index: 10;
    width: 62px;
    transition: 0.7s;
}

.services_link:hover .services_link_arrow {
    left: calc(100% - 67px);
}

.services_link:hover span {
    padding-left: 0;
    padding-right: 60px;
}

.reverse_section {
    flex-direction: row-reverse;
}

.reverse_section .services_wrapper_video {
    border-radius: 25px 0 0 25px;
}

.services_perelink {
    margin: 35px 0;
}

.services_perelink {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.services_perelink_item {
    background: var(--backgound-grey);
    border-radius: 10px;
    padding: 10px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    color: var(--text-color);
    flex-basis: calc(50% - 10px);
    transition: 0.5s;
}

.services_perelink_item path {
    stroke: var(--text-color);
}

.services_perelink_item:hover {
    color: var(--text-color);
    background: var(--backgound-grey-hover);
}

.services_perelink_column {
    flex-wrap: nowrap;
    flex-direction: column;
}

.services_perelink_column {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.team_position_block:nth-child(1) .team_position_items,
.team_position_block:nth-child(3) .team_position_items {
    grid-template-rows: repeat(2, 1fr);
}

.team_position_block:nth-child(1) .team_position_item:nth-child(2),
.team_position_block:nth-child(3) .team_position_item:nth-child(2) {
    grid-column: 2;
    grid-row: 2;
}

.google_partner_img {
    width: 190px;
    border-radius: 13px;
}

.marquee-wrapper {
    overflow: hidden;
    transform: rotate(-3deg);
    height: 58px;
    width: 110%;
    position: relative;
    left: -15px;
    display: flex;
    align-items: center;
    top: -22px;
}

.marquee-wrapper.red {
    background-color: #e91e42;
    z-index: 2;
}

.marquee-wrapper.black {
    background-color: var(--button-black-bg);
    z-index: 1;
    top: -29px;
    transform: rotate(8deg);
    /* трохи зсунемо, щоб виглядало як у тебе */
}

.marquee-track {
    display: flex;
    white-space: nowrap;
    animation: scroll 30s linear infinite;
}

.marquee-track.reverse {
    animation: scroll-reverse 30s linear infinite;
}

.marquee-track span {
    display: inline-block;
    font-weight: 500;
    font-size: 14px;
    color: white;
}

.marquee-wrapper.black span {
    color: var(--button-text);
}

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

    to {
        transform: translateX(-50%);
    }
}

@keyframes scroll-reverse {
    from {
        transform: translateX(-50%);
    }

    to {
        transform: translateX(0%);
    }
}

.btn-slide-newHome {
    display: none;
}

.process {
    padding-bottom: 160px;
}

.process_content {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.process_wrapper {
    margin-top: 60px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);

}

.process_item {
    border-radius: 15px;
    padding: 40px;
    transition: 0.4s;
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* background: transparent; */
    margin-top: 0;
}

.process_item.new_top_btn:after {
    border-radius: 15px;
}

.process_item.new_top_btn:before {
    width: 600px;
    height: 600px;
}

.process_item:hover {
    background: #ED1F3D;
}

.process_item_title {
    font-weight: 500;
    font-size: 25px;
    letter-spacing: -0.03em;
    text-transform: capitalize;
    color: var(--text-color);
    transition: 0.4s;
}

.process_item_num {
    color: #ED1F3D;
    transition: 0.4s;
}

.process_item_subtitle {
    font-weight: 200;
    font-size: 13px;
    line-height: 150%;
    letter-spacing: 0.01em;
    margin-top: 8px;
    transition: 0.4s;
}

.process_item:hover .process_item_title,
.process_item:hover .process_item_num,
.process_item:hover .process_item_subtitle {
    color: white;
}

.clients_wrapper {
    margin-top: 60px;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    background: var(--backgound-grey);
    border-radius: 20px;
    padding: 80px;
    row-gap: 80px;
    transition: 0.4s;
}

.clients_item {
    display: flex;
    justify-content: center;
    align-items: center;
}

.clients_item img {
    transition: 0.5s;
    filter: var(--invert-color);
}

.clients_item img:hover {
    scale: 1.1;
}

.clients_btn {
    display: flex;
    justify-content: center;
    width: 100%;
}

.news_wrapper {
    margin-top: 60px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

.post_img img {
    width: 100%;
    height: 340px;
    object-fit: cover;
    display: block;
    border-radius: 20px;
    transition: 0.3s;
}

.post_img {
    display: block;
    position: relative;
    overflow: hidden;
}

.section_words_anim {
    position: relative;
    height: 70vh;
    width: 90%;
    display: flex;
    align-items: center;
    gap: 20px;
    right: 0;
    margin: 0 auto;
    justify-content: center;
    margin-top: -145px;
    margin-left: 15px;
    margin-bottom: 70px;
    pointer-events: none;
    overflow: hidden;
}

.section_words_anim .map-canvas {
    position: relative;
    width: 420px;
    margin-bottom: 0 !important;
    right: 0 !important;
    top: 0 !important;
    display: flex;
    justify-content: center;
}

#js-map-canvas-v {
    scale: 0.8;
}

#js-map-canvas-o {
    scale: 0.55;
}

#js-map-canvas-l {
    scale: 0.63;
    margin-top: 83px;
}

#js-map-canvas-l-second {
    scale: 0.63;
    margin-top: 83px;
    margin-left: -54px;
}

/* .section_words_anim .map-canvas #canvas-map {
    width: 100% !important;
} */

.post_img:before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    /* background: rgba(237, 31, 61, 0.5); */
    background: gray;
    border-radius: 20px;
    transition: 0.3s;
    opacity: 0.4;
}

.news_item:hover .post_img:before {
    opacity: 0;
}

.news_item_bottom {
    margin-top: 30px;
}

.main_new {
    /* overflow: hidden; */
}

.post_title {
    font-weight: 500;
    font-size: 25px;
    text-transform: capitalize;
    color: var(--text-color);
    transition: 0.3s;
}

.news_tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 15px;
}

.news_tags a {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 25px;
    padding: 0 15px;
    height: 31px;
    background: var(--backgound-grey);
    font-weight: 400;
    font-size: 14px;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--text-color);
    transition: 0.3s;
}

.news_tags a:hover {
    background: #ED1F3D;
    color: #fff;
}

.news {
    padding: 160px 0 70px;
}

.seo_new_wrapper {
    display: flex;
    align-items: center;
    gap: 40px;
}

.seo_new_side {
    flex-basis: 50%;
}

.seo_new_side_img img {
    width: 100%;
    display: block;
    border-radius: 20px;
    height: 460px;
    object-fit: cover;
}

.seo_new_side_txt {
    padding: 40px;
}

.seo_new_side_txt_wrapper {
    height: 460px;
    overflow: auto;
    padding-right: 20px;
}

.seo_new_side_txt_wrapper::-webkit-scrollbar-thumb {
    background-color: #ED1F3D;
    outline: unset;
    border-radius: 10px;
}

.seo_new_side_txt_wrapper::-webkit-scrollbar {
    width: 8px;
    height: 13px;
    background: #e8e8e8;
    border-radius: 10px;
}

.seo_new_description h3 {
    margin: 35px 0 24px;
    font-weight: 600;
    font-size: 38px;
    line-height: 100%;
    color: var(--text-color);
}

.seo_new_description>h3 {
    margin-top: 0;
}

.seo_new_description h4 {
    font-weight: 600;
    font-size: 27px;
    line-height: 100%;
    color: var(--text-color);
}

.seo_new_description p {
    font-weight: 200;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-color);
    margin-bottom: 20px;
}

.seo_new_description p:last-child {
    margin-bottom: 0;
}

.seo_new_description ul {
    list-style: none;
    padding-left: 23px;
}

.seo_new_description ul li {
    position: relative;
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-color);
    margin-bottom: 10px;
}

.seo_new_description ul li:last-child {
    margin-bottom: 0;
}

.seo_new_description ul li:before {
    content: '';
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ED1F3D;
    top: 9px;
    left: -20px;
}

.seo_new {
    padding-bottom: 100px;
    margin-top: -240px;
}

.seo_new h2,
.seo_new .our_works_subtitle {
    position: relative;
}

.seo_new_description h3,
.seo_new_description p {
    position: relative;
}


/* .faqs_wrapper {
    display: flex;
} */

.faqs_content {
    position: relative;
}

.faqs_wrapper {
    /* opacity: 0; */
    /* transform: translateY(20px); */
    /* transition: opacity 0.3s ease, transform 0.3s ease; */
    display: none;
}

.faqs_wrapper.active {
    /* opacity: 1; */
    /* transform: translateY(0); */
    display: block;
}

.faqs_title_side_wrapper h2,
.faqs_title_side_wrapper .our_works_subtitle {
    text-align: left;
}

.faqs_title_side_wrapper {
    max-width: 340px;
}

.faqs_title_side_wrapper a {
    margin-top: 30px;
}

.faq_title {
    margin-top: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: space-between;
    font-weight: 500;
    font-size: 20px;
    text-transform: none;
    /* questions are written as normal sentences (2026-10-31) */
    /* text-align: center; */
    color: var(--text-color);
    font-family: "Inter", sans-serif !important;
    transition: 0.3s;
    margin-bottom: 0;
    cursor: pointer;
}

.faq_title:hover,
.faq_title.active {
    color: #ED1F3D;
}

.faq_title.active svg {
    rotate: 45deg;
}

.faq_title svg rect {
    fill: var(--text-color);
}

.faq_title:hover rect {
    fill: #ED1F3D;
}

.faq_title svg,
.faq_title svg rect {
    transition: 0.3s;
}



.faq_answ {
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    visibility: hidden;
    transition: 0.4s;
    font-weight: 200;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-color);
}

.faq_answ p {
    margin-bottom: 0;
}

.faq_cat_item {
    padding: 25px 0;
    border-bottom: 1px solid #D9D9D9;
    transition: 0.3s;
}

.faq_title.active+.faq_answ {
    opacity: 1;
    visibility: visible;
    margin-top: 25px;
}

.faq_cat_item:has(.active) {
    border-bottom: 1px solid #ED1F3D
}

.faqs {
    padding-bottom: 120px;
}

.faqs_tabs {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 20px 0;
    gap: 20px;
    flex-wrap: wrap;
}

.faqs_tab {
    border-radius: 50px;
    height: 40px;
    padding: 0 20px;
    border: 1px solid var(--accent-color);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: 0.3s;
}

.faqs_tab:hover,
.faqs_tab.active {
    border: 1px solid var(--accent-color);
    background: var(--accent-color);
    color: white;
}

.faqs_tab_content {
    max-width: 1100px;
    width: 100%;
    margin: 0 auto;
}

#myHeader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    transition: 0.4s;
    /* background: var(--background-color); */
    background: white;
}

.home #myHeader {
    background: unset;
}

.page-template-page-flex-new #myHeader {
    background: var(--background-color);
}

.header_wrapper {
    padding: 15px 0;
}

.home .header_wrapper {
    padding: 40px 0;
}

.menu_header .menu-item-has-children {
    position: relative;
    padding-bottom: 30px;
    margin-bottom: -30px;
}

.menu_header .menu-item-has-children .sub-menu {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    position: absolute;
    padding: 20px;
    padding-right: 0;
    left: 0;
    background: white;
    border-radius: 15px;
    top: 55px;
    transition: 0.4s;
    translate: 0 -20px;
    opacity: 0;
    visibility: hidden;
    z-index: 600;
}

.menu_header .menu-item-has-children .sub-menu li {
    padding-right: 40px;
}

.menu_header .menu-item-has-children .sub-menu a:hover {
    color: #ED1F3D;
}

.menu_header .menu-item-has-children:hover .sub-menu {
    opacity: 1;
    visibility: visible;
    translate: 0 0;
}

.menu_header .menu-item-has-children:hover>a {
    color: #ED1F3D;
}

.overlay_menu {
    position: fixed;
    inset: 0;
    z-index: 500;
    background: #000;
    opacity: 0;
    pointer-events: none;
    transition: 0.5s;
}

.header_wrapper:has(.menu-item-has-children:hover) .overlay_menu {
    opacity: 0.4;
}

.section_interest_new {
    padding-bottom: 80px;
}

footer {
    background: var(--backgound-grey);
    padding: 80px 0;
    position: relative;
    z-index: 900;
}

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

#menu-footer-menu-new {
    display: flex;
    gap: 8%;
    flex-wrap: wrap;
    row-gap: 60px;
}



.sub-menu:has(.menu_not_child) {
    display: flex;
    gap: 8%;
}

/* .menu-item-has-children>a {
    font-weight: 700;
    font-size: 21px;
    color: var(--text-color);
} */

#menu-footer-menu-new>.menu-item-has-children>a {
    font-weight: 700;
    font-size: 21px;
    color: var(--text-color);
    margin-bottom: 30px;
    display: block;
}

/* #menu-footer-menu-new>li:last-child {
    width: 100%;
} */

#menu-footer-menu-new .sub-menu>li>a,
#menu-footer-menu-new .sub-menu>.menu_not_child>li>a {
    font-weight: 500;
    font-size: 16px;
    display: block;
    color: var(--text-color);
    margin-bottom: 13px;
    white-space: nowrap;
}

#menu-footer-menu-new .sub-menu .sub-menu li a {
    font-weight: 400;
    font-size: 14px;
    white-space: nowrap;
    color: var(--text-color);
}

#menu-item-7570 {
    width: 100%;
}

#menu-item-7570>ul {
    gap: 20px;
    justify-content: space-between;
}

#menu-item-7570 ul a {
    white-space: unset !important;
}

#menu-footer-menu-new a {
    transition: 0.3s;
}

#menu-footer-menu-new a:hover {
    color: #ED1F3D !important;
}

.footer_bottom {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-top: 80px;
    padding-top: 80px;
    border-top: 1px solid #D9D9D9;
}

.footer_logo span {
    display: block;
    font-weight: 400;
    font-size: 15px;
    line-height: 180%;
    text-transform: capitalize;
    color: var(--text-color);
    margin-top: 12px;
}

.footer_socials {
    margin-top: 30px;
    display: flex;
    align-items: center;
    gap: 17px;
}

.footer_socials svg {
    width: 30px;
    height: 30px;
}

.footer_btn {
    margin-top: 0;
    margin: 30px 0;
}

.footer_bottom_column_menu {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-left: 50px;
}

.footer_bottom_column_menu a {
    font-weight: 400;
    font-size: 17px;
    color: var(--text-color);
    transition: 0.3s;
}

.footer_bottom_column_menu a:hover,
.contacts_link_footer:hover {
    color: #ED1F3D;
}

.contacts_link_footer {
    display: block;
    font-weight: 500;
    font-size: 20px;
    line-height: 150%;
    color: var(--text-color);
}

header .sub-menu .menu-item-has-children {
    padding-bottom: 0;
    margin-bottom: 0;
    width: 100%;
    position: relative;
}

header .sub-menu .menu-item-has-children:after {
    content: '';
    position: absolute;
    right: 10px;
    top: 50%;
    translate: 0 -50%;
    background-image: url(/wp-content/uploads/2025/08/arrow-menu.svg);
    width: 15px;
    height: 15px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 10px;
    transition: 0.3s;
    filter: brightness(0);
}

header .sub-menu .menu-item-has-children:hover:after {
    translate: 5px -50%;
    filter: brightness(1);
}


.menu_header .sub-menu .menu-item-has-children .sub-menu {
    left: 101%;
    top: -20px;
    translate: -10px 0;
    transition: 0.4s;
    opacity: 0;
    visibility: hidden;
}

.menu_header .menu-item-has-children .sub-menu .menu-item-has-children:hover .sub-menu {
    opacity: 1;
    visibility: visible;
    translate: 0 0;
}

.footer_phone {
    display: block;
    margin: 0 0 17px;
    font-weight: 600;
    font-size: 60px;
    line-height: 100%;
    color: var(--text-color);
    white-space: nowrap;
}

.footer_mail {
    font-weight: 400;
    font-size: 35px;
    line-height: 69%;
    color: var(--text-color);
    margin-bottom: 27px;
    display: block;
}

.footer_addrs {
    font-weight: 100;
    font-size: 15px;
    line-height: 150%;
    color: var(--text-color);
}

.footer_socials svg {
    filter: var(--invert-color);
}

.burger_block {
    display: none;
}


.burger-menu-wraper {
    display: none;
    width: 45px;
    height: 27px;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    transform: rotate(0deg);
    transition: .5s ease-in-out;
    margin-right: 0;
}

#nav-icon3 span {
    display: block;
    position: absolute;
    height: 5px;
    width: 100%;
    background: var(--text-color);
    border-radius: 2px;
    opacity: 1;
    left: 0;
    transform: rotate(0deg);
    transition: .25s ease-in-out;
}

#nav-icon3 span:nth-child(1) {
    top: 0px;
}

#nav-icon3 span:nth-child(2),
#nav-icon3 span:nth-child(3) {
    top: 12px;
}

#nav-icon3 span:nth-child(4) {
    top: 24px;
    width: 50%;
    right: 0;
    left: unset;
}

#nav-icon3.show-menu span:nth-child(1) {
    top: 12px;
    width: 0%;
    left: 50%;
}

#nav-icon3.show-menu span:nth-child(2) {
    transform: rotate(45deg);
}

#nav-icon3.show-menu span:nth-child(3) {
    transform: rotate(-45deg);
}

#nav-icon3.show-menu span:nth-child(4) {
    top: 12px;
    width: 0%;
    left: 50%;
}

@media(min-width: 992px) {
    .services_wrapper_txt .container {
        padding: 0;
        max-width: unset;
        width: unset;
    }
}

.team {
    padding-bottom: 120px;
}

.team_wrapper {
    display: flex;
    margin-top: 80px;
    gap: 80px;
}

.team_positions {
    flex-basis: 55%;
}

.team_positions_btns {
    flex-basis: 45%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}


.team_position_block {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.3s ease, transform 0.3s ease;
    display: none;
}

.team_position_block.active {
    opacity: 1;
    transform: translateY(0);
    display: block;
}

.team_position_items {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

a.button_new:hover {
    color: white;
}

.team_cont_wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.team_position_item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    padding: 20px;
    background: #F9F9F9;
    min-height: 345px;
    overflow: hidden;
}

.team_position_item_icon {
    width: 86px;
    height: 86px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #ED1F3D;
    margin-bottom: 40px;
    transition: 0.3s;
    opacity: 1;
    visibility: visible;
    overflow: hidden;
}

.team_position_item:hover .team_position_item_icon {
    opacity: 0;
    visibility: hidden;
    translate: 0 -100px;
    height: 0;
    width: 0;
    margin-bottom: 0;
}

.team_position_item_description {
    opacity: 0;
    visibility: hidden;
    max-height: 0;
    font-weight: 200;
    font-size: 16px;
    line-height: 150%;
    text-align: center;
    color: #000;
    transition: 0.6s;
}

.team_position_item_description p {
    margin-bottom: 0;
}

.team_position_item:hover .team_position_item_description {
    max-height: 225px;
    opacity: 1;
    visibility: visible;
    margin-top: 15px;
}

.team_position_item_title {
    font-weight: 500;
    font-size: 19px;
    text-transform: capitalize;
    text-align: center;
    color: #000;
}

.team_positions_btn svg {
    position: absolute;
    z-index: 10;
    left: 0;
    top: 50%;
    translate: 0 -50%;
    opacity: 0;
    visibility: hidden;
    transition: 0.6s;
}

.team_positions_btn {
    position: relative;
    font-weight: 600;
    font-size: 68px;
    letter-spacing: -0.03em;
    color: var(--text-color);
    margin-bottom: 30px;
    line-height: 100%;
    display: inline-block;
    cursor: pointer;
    transition: 0.7s;
    white-space: nowrap;
}

.team_positions_btn:hover,
.team_positions_btn.active {
    color: #e91e42;
    padding-left: 65px;
}

.team_positions_btn.active {
    pointer-events: none;
    cursor: default;
}

.team_positions_btn:hover svg,
.team_positions_btn.active svg {
    opacity: 1;
    visibility: visible;
}

.team_positions_btn_num {
    position: absolute;
    right: -45px;
    top: -12px;
    border-radius: 42px;
    padding: 0 20px;
    height: 33px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 500;
    font-size: 25px;
    text-transform: capitalize;
    color: white;
    background: #e91e42;
    transition: 0.4s;
    opacity: 1;
    visibility: visible;
}

.team_positions_btn:hover .team_positions_btn_num,
.team_positions_btn.active .team_positions_btn_num {
    opacity: 0;
    visibility: hidden;
    translate: 30px 0;
    scale: 0.8;
}

.video-foreground {
    background: var(--background-color);
    z-index: -1;
    overflow: hidden;
}

.mobile_menu {
    display: none;
}

.show_footer_menu {
    cursor: pointer;
    position: absolute;
    bottom: -25px;
    left: 0;
    display: flex;
    align-items: center;
    gap: 4px;
    z-index: 10;
    font-weight: 400;
    font-size: 14px;
    text-decoration: underline;
    text-decoration-skip-ink: none;
    color: #ED1F3D;
}

.show_footer_menu img {
    margin-top: 2px;
}

.hide_footer_menu img {
    rotate: 180deg;
}

.menu-item {
    transition: all 0.3s ease;
}

#menu-footer-menu-new .menu-item-has-children .sub-menu-1 .menu-item-has-children .sub-menu-1 .menu_not_child:has(.hidden) {
    max-height: 100px;
    overflow: hidden;
    transition: max-height 0.4s ease;
}

.sub-menu-1 {
    position: relative;
}




.page_new {
    padding-top: 85px;
    /* overflow: hidden; */
}

.page_new_top_wrapper {
    display: flex;
    align-items: center;
    height: 75vh;
}

.page_new_top_wrapper:has(.page_new_side_video_img) {
    /* height: auto !important; */
    height: 57vh !important;
}

.page_new_top:has(.page_new_side_video_img) {
    overflow: unset;
}

.page_new_side_video_img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: bottom left;
}

.page_new_side {
    flex-basis: 50%;
}

.page_new_side video {
    height: 100%;
    object-fit: cover;
    rotate: 17deg;
    position: relative;
    left: -118px;
    width: 110%;
    bottom: -100px;
    scale: 1.1;
}

.page_new_title {
    font-weight: 600;
    font-size: 75px;
    line-height: 100%;
    letter-spacing: -0.03em;
    color: var(--text-color);
    margin-top: 0;
    margin-bottom: 27px;
}

.page_new_top {
    position: relative;
    padding-bottom: 135px;
    overflow: hidden;
}

.page_new_side_video {
    position: absolute;
    top: -180px;
    right: -57px;
    width: 48%;
    /* clip-path: polygon(1% 0, 100% 0, 100% 71%, 21% 100%); */
    height: 90%;
    border-radius: 15px;
    overflow: hidden;
    rotate: -17deg;
}

.page_new_side_video:has(.page_new_side_video_img) {
    overflow: unset;
}

.img_txt_block_wrapper {
    display: flex;
    align-items: center;
    gap: 80px;
}

.img_txt_block_side {
    flex-basis: 50%;
}

.img_txt_block_side img {
    width: 100%;
    display: block;
    border-radius: 20px;
}

.new_temp_title {
    font-weight: 600;
    font-size: 60px;
    line-height: 110%;
    letter-spacing: -0.03em;
    color: var(--text-color);
    margin-bottom: 35px;
    margin-top: 0;
}

.icons_blocks_wrapper_half .icons_blocks_item:nth-last-child(-n+2) {
    flex-basis: 48.5%;
}

.img_txt_block .new_temp_title {
    font-size: 47px;
}

.new_temp_title_small {
    font-size: 30px;
}

.new_temp_descr {
    font-weight: 200;
    font-size: 18px;
    line-height: 150%;
    letter-spacing: 0.01em;
    color: var(--text-color);
}

.new_temp_descr p {
    margin-bottom: 20px;
}

.icons_blocks {
    margin: 80px 0 100px;
    position: relative;
    z-index: 10;
}

.icons_blocks_title {
    margin-bottom: 15px;
}

.new_temp_subtitle {
    text-align: center;
    font-weight: 300;
    font-size: 19px;
    line-height: 180%;
    text-transform: capitalize;
    text-align: center;
    color: var(--text-color);
    opacity: 0.7;
    margin-bottom: 35px;
}

.icons_blocks_descr {
    text-align: center;
    max-width: 1073px;
    width: 100%;
    margin: 0 auto;
}

.icons_blocks_wrapper {
    margin: 60px -10px;
    display: flex;
    /* gap: 20px; */
    flex-wrap: wrap;
    row-gap: 20px;
}

.icons_blocks_item {
    flex-basis: 23.65%;
    margin: 0 10px;
    height: 342px;
    /* background: #F9F9F9; */
    background: var(--backgound-grey);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 15px;
    flex-direction: column;
    border-radius: 20px;
    transition: 0.4s;
}

.text_center {
    text-align: center;
}

.icons_blocks_item:hover {
    background: var(--backgound-grey-hover);
}

.icons_blocks_item:nth-child(-n+3) {
    flex-basis: 31.9%;
}

.icons_blocks_wrapper_same .icons_blocks_item {
    flex-basis: 31.9%;
}

.icons_blocks_wrapper_same {
    justify-content: center;
}

.icons_blocks_item_title {
    margin: 30px 0 5px;
    font-weight: 500;
    font-size: 21px;
    text-transform: capitalize;
    text-align: center;
    color: var(--text-color);
}

.icons_blocks_item_descr {
    font-weight: 300;
    font-size: 19px;
    text-transform: lowercase;
    text-align: center;
    color: var(--text-color);
    line-height: 130%;
}

.animated_banner_title {
    font-size: 47px;
    margin-bottom: 27px;
    margin-top: 0;
}

.animated_banner_wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 400px;
    transition: 1.7s;
    transition-delay: 0.6s;
}

.animated_banner_wrapper .new_top_btn {
    margin-top: 0;
}

/* The banner grows when it scrolls into view (scale on the wrapper). Buttons are scaled back by the same factor,
   so their text stays 16px like every other button on the site (2026-10-31). */
.animated_banner_wrapper .new_top_btn,
.animated_banner_wrapper .animated_banner_btns_black {
    transition: 0.3s, scale 1.7s 0.6s;
}

.animated_banner:has(.show-elements) .animated_banner_wrapper .new_top_btn,
.animated_banner:has(.show-elements) .animated_banner_wrapper .animated_banner_btns_black {
    scale: calc(1 / var(--banner-scale, 1));
}

.animated_banner {
    margin: 100px 0;
    background: var(--backgound-grey);
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.anim_img {
    position: absolute;
    top: 50%;
    left: 50%;
    translate: -50% -50%;
    z-index: -1;
    transition: 1.6s;
    width: 518px;
    height: 518px;
}

.show-elements.anim_img {
    /* width: 2000px;
    height: 2000px; */
    rotate: 90deg;
    scale: 3.8;
    filter: grayscale(1);
    transition-delay: 0.3s;
}

.animated_banner:has(.show-elements) .animated_banner_wrapper {
    scale: 1.4;
    --banner-scale: 1.4;
}

.services_block_title {
    margin-bottom: 80px;
}

.services_block_wrapper {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 25px;
}

.services_block_wrapper>.services_block_item {
    grid-column: span 2;
}

.services_block_wrapper:has(> .services_block_item:last-child:nth-child(3n+2))>.services_block_item:nth-last-child(1),
.services_block_wrapper:has(> .services_block_item:last-child:nth-child(3n+2))>.services_block_item:nth-last-child(2) {
    grid-column: span 3;
}

.services_block_item {
    background: var(--backgound-grey);
    border-radius: 20px;
    padding: 40px 45px;
    transition: 0.3s;
}

.services_block_item:hover {
    background: var(--backgound-grey-hover);
}

.services_block_item_head {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 35px;
}

.services_block_item_head img {
    filter: var(--invert-color);
}

.services_block_item_head h3 {
    font-weight: 600;
    font-size: 22px;
    margin-top: 0;
    margin-bottom: 0;
    line-height: 100%;
    color: var(--text-color);
}

.services_block_item_descr p {
    margin-bottom: 0;
}

.how_we_work {
    margin: 100px 0;
}

.how_we_work_wrapper {
    display: flex;
    gap: 40px;
}

.how_we_work_list,
.how_we_work_l_inn h2 {
    margin-bottom: 15px;
}

.how_we_work_list {
    margin-top: 80px;
}

.how_we_work_descr {
    width: 400px;
}

.how_we_work_l {
    width: 600px;
    min-width: 600px;
}

.how_we_work_l_inn {
    position: sticky;
    top: 100px;
    z-index: 10;
}

.how_we_work_list_item span {
    opacity: 0;
    color: #ED1F3D;
    display: inline-block;
    width: 18px;
    transition: 0.3s;
}

.how_we_work_list_item {
    opacity: 0.2;
    font-weight: 500;
    font-size: 21px;
    letter-spacing: -0.03em;
    text-transform: capitalize;
    color: var(--text-color);
    margin-bottom: 25px;
    transition: 0.3s;
    cursor: pointer;
}

.how_we_work_list_item:hover {
    color: #ED1F3D;
    opacity: 1;
}

.how_we_work_list_item.active {
    opacity: 1;
    color: var(--text-color) !important;
}

.how_we_work_list_item.active span {
    opacity: 1;
}

.how_we_work_r_head {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-bottom: 35px;
}

.how_we_work_r_head img {
    filter: var(--invert-color);
}

.how_we_work_r_head h3 {
    margin: 0 !important;
    font-weight: 600;
    font-size: 30px;
    line-height: 100%;
    color: var(--text-color);

}

.how_we_work_r_item {
    margin-bottom: 160px;
}

.how_we_work_r_inn {
    padding-top: 144px;
    position: relative;
}

.page-id-7952 .how_we_work_r_inn {
    padding-top: 210px;
}

.how_we_work_l_inn:before {
    content: '';
    position: absolute;
    top: -30px;
    width: 170%;
    width: calc(94vw - 600px);
    z-index: 5;
    height: 200px;
    left: 100%;
    backdrop-filter: blur(3px);
    background: var(--blur-color);
    -webkit-mask-image: linear-gradient(to top, transparent, black 30%, black 100%);
    mask-image: linear-gradient(to top, transparent, black 30%, black 100%);
}

/* .how_we_work_l_inn:after {
    content: '';
    position: absolute;
    bottom: 0;
    width: 170%;
    width: calc(94vw - 600px);
    height: 23vh;
    left: 100%;
    backdrop-filter: blur(3px);
    background: var(--blur-color);
    -webkit-mask-image: linear-gradient(to bottom, transparent, black 15%, black 100%);
    mask-image: linear-gradient(to bottom, transparent, black 15%, black 100%);
} */

.how_we_work_bottom_fade {
    position: fixed;
    bottom: 0;
    width: calc(94vw - 650px);
    height: 18vh;
    z-index: 5;
    backdrop-filter: blur(3px);
    background: var(--blur-color);
    -webkit-mask-image: linear-gradient(to bottom, transparent, black 15%, black 100%);
    mask-image: linear-gradient(to bottom, transparent, black 15%, black 100%);
    pointer-events: none;
}

.how_we_work_bottom_fade.is-static {
    position: absolute;
}

.popupWindowNew {
    position: fixed;
    top: 50%;
    left: 50%;
    translate: -50% -30%;
    background: #fff;
    border-radius: 30px;
    padding: 60px 75px;
    width: 92%;
    max-width: 1042px;
    transition: 0.5s;
    opacity: 0;
    visibility: hidden;
    scale: 0.9;
}

.popupWindowNew.in {
    scale: 1;
    translate: -50% -50%;
    opacity: 1;
    visibility: visible;
}

.overlay {
    display: block;
    opacity: 0;
    visibility: hidden;
    transition: 0.4s;
}

.popupWindowNew.in+.overlay {
    display: block;
    opacity: 1;
    visibility: visible;
}

.popupWindowNewSide {
    flex-basis: 50%;
}

.popupWindowNewSide .popupText {
    text-align: left;
    font-weight: 600;
    font-size: 28px;
    letter-spacing: -0.02em;
    color: #1B1B1B;
    margin-bottom: 32px;
    top: 0;
}

.popupWindowNewSide .inputs-blocks-popup p {
    margin-bottom: 12px;
}

.popupWindowNewSide .buttons-blocks-popup {
    text-align: left;
    margin-top: 0;
}

.popupWindowNewSide .buttons-blocks-popup input {
    font-size: 16px;
}

.popupWindowNewSide .privacy-form-text {
    font-weight: 200;
    font-size: 13px;
    line-height: 140%;
    color: #1B1B1B;
    max-width: 100%;
    margin-left: 48px;
    text-align: left;
}

.popup-form.popupWindowNewSide {
    flex-basis: 53%;
}

.popupWindowNewSide .privacy-form-block {
    justify-content: flex-start;
}

.popupWindowNewSide .privacy-form-text p:after {
    top: 0px;
    left: -29px;
}

.popupWindowNewSide .privacy-form-text p:before {
    top: -2px;
    left: -32px;
}

.row.privacy-form-block {
    margin-bottom: 13px;
    margin-top: 22px;
}

div#wpcf7-f225-o2,
div#wpcf7-f225-o4 {
    max-width: unset;
}

.popup-form .iti.iti--allow-dropdown {
    margin-top: 0;
}

.popupWindowNewSide .inputs-blocks-popup input {
    margin-top: 0;
    border: unset !important;
    border: 1px solid #C3C3C3 !important;
    border-radius: 8px !important;
    padding: 0 25px;
    width: 100%;
    height: 53px;
}

.popupWindowNewSide .inputs-blocks-popup input::placeholder {
    font-size: 16px;
}

.popupWindow_wrapper {
    display: flex;
    align-items: center;
    gap: 60px;
}

.popupWindow_cont {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 60px;
}

.popupWindow_cont_item {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.popupWindow_cont_num_icon {
    display: flex !important;
    justify-content: center !important;
    align-items: center;
    border-radius: 50%;
    background: #F9F9F9;
    width: 80px;
    height: 80px;
    margin-bottom: 20px !important;
    transition: 0.3s;
}

.popupWindow_cont_num_icon:hover {
    background: #dddddd;
}

.popupWindow_cont_item a {
    font-weight: 600;
    font-size: 24px;
    line-height: 100%;
    color: #1B1B1B;
    display: block;
    text-align: center;
    margin-bottom: 4px;
    transition: 0.3s;
}

.popupCloseNew {
    display: flex !important;
    justify-content: center;
    align-items: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #f3f3f3;
    top: 25px !important;
    right: 25px !important;
    transition: 0.3s;
    rotate: 45deg !important;
}

.popupCloseNew:hover {
    background: #dddddd;
}

.popupWindow_cont_item a:hover {
    color: #ed1f3d;
}

.popupWindow_cont_item span {
    font-weight: 300;
    font-size: 15px;
    line-height: 145%;
    text-align: center;
    color: #1B1B1B;
}

/* @media(min-width: 1800px) {
    .how_we_work_l_inn:after {
        bottom: -170%;
        height: 83vh;
    }
} */


.new_portfolio {
    padding: 100px 0;
    background: #1B1B1B;
    position: relative;
    z-index: 50;
}

.new_portfolio_title {
    color: #fff;
    text-align: center;
    margin-bottom: 5px;
}

.new_portfolio_subtitle {
    color: #fff;
}

.new_portfolio_wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 30px;
    row-gap: 80px;
}

.new_portfolio_item_title {
    font-weight: 500;
    font-size: 21px;
    line-height: 150%;
    letter-spacing: 0.01em;
    color: #fff;
    margin: 25px 0 12px;
}

.new_portfolio_item_descr {
    font-weight: 200;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0.01em;
    color: #fff;
}

.new_portfolio_wrapper .our_works_block_hover_site {
    margin-bottom: 0;
}

.new_portfolio_bottom_t {
    color: #fff;
    text-align: center;
    margin-bottom: 35px;
}

.new_portfolio_bottom_t p {
    margin-bottom: 0;
}

.new_portfolio_bottom {
    max-width: 900px;
    width: 100%;
    margin: 80px auto 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.new_portfolio_bottom a {
    margin-top: 0;
}

.notes_block_wrapper {
    padding-bottom: 80px;
}

.services_block {
    padding-top: 90px;
}


.new_pricing {
    margin: 100px 0;
    position: relative;
    z-index: 10;
}

.new_pricing_subtitle {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
}

.new_pricing_wrapper {
    margin-top: 80px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
    display: flex;
}

.new_pricing_item {
    padding: 20px;
    border-radius: 20px;
    background: var(--backgound-grey);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: 0.3s;
    flex: 1;
}


.new_pricing_item:hover {
    background: var(--backgound-grey-hover);
}

.new_pricing_item_top {
    padding: 25px 10px 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.new_pricing_item_top h3 {
    font-weight: 600;
    font-size: 22px;
    line-height: 100%;
    color: var(--text-color);
    margin: 35px 0;
}

.new_pricing_item_descr p {
    margin-bottom: 0;
}


.new_pricing_item_price {
    font-weight: 500;
    font-size: 17px;
    line-height: 150%;
    letter-spacing: 0.01em;
    color: var(--text-color);
    margin-top: 35px;

}

.new_pricing_item_price span {
    opacity: 0.45;
    display: inline-block;
    margin-right: 4px;
}

.new_pricing_item_bottom {
    margin-top: 40px;
    border-radius: 10px;
    padding: 19px 24px;
    background: var(--background-color);
}

.new_pricing_item_bottom_title {
    font-weight: 500;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0.01em;
    color: var(--text-color);
}

.new_pricing_item_bottom_descr {
    font-weight: 200;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0.01em;
    color: var(--text-color);
    margin-top: 15px;
}

.new_pricing_item_bottom_descr p {
    margin-bottom: 0;
}

.notes_block {
    margin: 80px auto 0;
    width: 100%;
    max-width: 900px;
}

.notes_block_title {
    font-weight: 600;
    font-size: 30px;
    line-height: 110%;
    letter-spacing: -0.03em;
    text-align: center;
    color: var(--text-color);
    margin-bottom: 35px;
}

.notes_block_descr {
    text-align: center;
}

.notes_block_list {
    margin: 35px -7.5px 30px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.notes_block_list_txt {
    margin: 0 7.5px;
    margin-bottom: 15px;
    background: var(--backgound-grey);
    border-radius: 10px;
    padding: 10px 20px;
    padding-left: 36px;
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-color);
    position: relative;
    flex-basis: 48.3%;
    transition: 0.3s;
}

/* .flex_cont {
    overflow: hidden;
} */

.notes_block_list_txt:hover {
    background: var(--backgound-grey-hover);
}

.notes_block_list_txt:before {
    content: '';
    position: absolute;
    left: 20px;
    border-radius: 50%;
    width: 6px;
    height: 6px;
    background: #ED1F3D;
    top: 50%;
    translate: 0 -50%;
}

.animated_banner_btns_black {
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--button-black-bg);
    color: var(--button-text);
    border-radius: 42px;
    padding: 0 33px;
    height: 44px;
    transition: 0.3s;
    font-weight: 500;
    font-size: 16px;
    letter-spacing: -0.03em;
    cursor: pointer;
    transition: 0.4s;
}



.animated_banner_btns_black:hover {
    background: var(--button-red-bg);
    color: #fff;
}

/* Cursor glow on black buttons that turn red on hover, the same effect as .new_top_btn (2026-10-31).
   --x / --y are set by the site-wide listener in inc/page-head.php. */
.header_btn,
.animated_banner_btns_black {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.header_btn::before,
.animated_banner_btns_black::before {
    content: '';
    position: absolute;
    background: radial-gradient(#ffdce1, transparent, transparent);
    width: 300px;
    height: 300px;
    top: var(--y);
    left: var(--x);
    translate: -50% -50%;
    transition: 0.5s, top 0s, left 0s;
    opacity: 0;
    z-index: -1;
    pointer-events: none;
}

.header_btn::after,
.animated_banner_btns_black::after {
    content: '';
    position: absolute;
    inset: 2px;
    border-radius: 25px;
    background-color: rgba(237, 31, 61, 0.5);
    z-index: -1;
    opacity: 0;
    transition: 0.3s;
    pointer-events: none;
}

.header_btn:hover::before,
.animated_banner_btns_black:hover::before,
.header_btn:hover::after,
.animated_banner_btns_black:hover::after {
    opacity: 1;
}

.animated_banner_btns #formTitle,
.animated_banner_btns .new_top_btn {
    font-size: 16px;
    /* CTA banner buttons: one size, the same as the Related chips (2026-10-31) */
}

.animated_banner_btns {
    display: flex;
    align-items: center;
    gap: 28px;
}

.animated_banner_btns_txt {
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--text-color);
}

.img_txt_block_wrapper_rev {
    flex-direction: row-reverse;
}

.lines_block {
    /* margin: 100px 0; */
    overflow: hidden;
    height: 316px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.clients_block {
    margin: 100px 0;
}

.faqs_wrapper_temp {
    display: block;
    width: 100%;
    max-width: 1100px;
    margin: 20px auto 0;
}

.faq_temp {
    margin-bottom: 100px;
}


.buttons-blocks-popup.new_top_btn.button_new p {
    margin-bottom: 0;
}

.buttons-blocks-popup.new_top_btn.button_new input {
    background-color: transparent !important;
    padding: 0;
}









.hidden-anim {
    /* opacity: 0;
    visibility: hidden; */
    transition: 1.7s cubic-bezier(.34, .88, .44, .95);
}



/* 
.leftAnim {
    translate: -50px 0;
    transition: 1s;
}

.rightAnim {
    translate: 50px 0;
}

.bottomAnim {
    translate: 0 50px;
}

.topAnim {
    translate: 0 -50px;
}

.scaleAnim {
    scale: 0.1;
}

.scaleAnim07 {
    scale: 0.7;
}

.delay_02 {
    transition-delay: 0.2s;
}

.delay_03 {
    transition-delay: 0.3s;
}

.delay_04 {
    transition-delay: 0.4s;
}

.delay_05 {
    transition-delay: 0.5s;
}

.delay_06 {
    transition-delay: 0.6s;
}

.delay_08 {
    transition-delay: 0.8s;
}

.delay_1 {
    transition-delay: 1s;
}


.show-elements.leftAnim,
.show-elements.rightAnim,
.show-elements.bottomAnim,
.show-elements.topAnim,
.show-elements.scaleAnim,
.show-elements.scaleAnim07 {
    translate: 0;
    visibility: visible;
    opacity: 1;
    scale: 1;
} */


.new_temp_descr ul {
    padding-left: 0;
    list-style: none;
}

.new_temp_descr ul li {
    padding-left: 36px;
    padding: 10px 10px 10px 36px;
    font-weight: 500;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-color);
    background: var(--backgound-grey);
    border-radius: 10px;
    margin-bottom: 15px;
    position: relative;
}

.new_pricing_item_descr ul li {
    padding: 0;
    padding-left: 20px;
    background: transparent;
    border-radius: 0;
    margin-bottom: 10px;
    font-weight: 200;
    font-size: 18px;
    line-height: 150%;
    letter-spacing: 0.01em;
}

.new_temp_descr ul li:before {
    content: '';
    position: absolute;
    top: 50%;
    translate: 0 -50%;
    left: 20px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #ED1F3D;
}

.new_pricing_item_descr ul li:before {
    translate: 0 0;
    top: 10px;
    left: 0;
    background: var(--button-black-bg);
}

.new_temp_descr ul li:last-child {
    margin-bottom: 0;
}


.inside_process {
    position: relative;
    z-index: 15;
    padding: 100px 0;
    margin-bottom: 90px;
    background: var(--backgound-grey);
}

.inside_process_title {
    text-align: center;
    margin-bottom: 15px;
}

.inside_process_wrapper {
    margin-top: 50px;
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
    justify-content: center;
}

.inside_process_item {
    flex-basis: 32%;
    background: var(--background-color);
    border-radius: 20px;
    padding: 15px;
}

.inside_process_item img {
    width: 100%;
    display: block;
    object-fit: cover;
    height: 200px;
    border-radius: 5px;
}

.inside_process_item_txt {
    margin-top: 15px;
    padding: 20px 25px;
}

.inside_process_item_title {
    font-weight: 600;
    font-size: 24px;
    line-height: 100%;
    color: var(--text-color);
    margin-bottom: 20px;
}

.inside_process_item_descr {
    font-weight: 200;
    font-size: 18px;
    line-height: 150%;
    letter-spacing: 0.01em;
    color: var(--text-color);
}

.inside_process_item_descr p {
    margin-bottom: 0;
}

.new_pricing_wrapper_descr p {
    margin-bottom: 0;
}

.new_pricing_wrapper_descr {
    margin: 80px 0;
    text-align: center;
}

.pricicng_btn_wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
}

.notes_block_list_width {
    flex-wrap: wrap;
}

.notes_block_list_width .notes_block_list_txt {
    flex-basis: 100%;
    width: 100%;
}

.popupWindow_cont_ite_bottom {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.watsapp_btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border-radius: 50px;
    padding: 0 33px;
    height: 50px;
    font-weight: 500;
    font-size: 16px;
    text-transform: uppercase;
    color: var(--button-text);
    background: var(--button-black-bg);
    position: fixed;
    right: 60px;
    bottom: 15px;
    z-index: 8000;
    transition: 0.3s;
}

.watsapp_btn svg {
    filter: var(--invert-color);
}

.watsapp_btn:hover {
    background: #40B257;
    color: white;
}

.form-obrat-contact textarea {
    width: 100%;
    border-radius: 10px;
    padding: 10px;
    font-size: 16px;
}

.form-obrat-contact textarea::placeholder {
    font-size: 16px;
}

.img_txt_block_ch {
    padding-top: 80px;
}

.img_txt_imgs {
    position: relative;
}

.img_txt_imgs img {
    /* transition: 0.3s; */
}

.img_txt_imgs img:not(:first-child) {
    position: absolute;
    /* transition: 0.3s; */
    inset: 0;
    z-index: 1;
    opacity: 0;
}

.img_txt_imgs img.img_txt_imgs_1 {
    position: relative;
    z-index: 8;
}

.img_txt_imgs img.show_ch {
    z-index: 10 !important;
    opacity: 1;
}

.img_txt_block_side_item_t {
    padding: 10px 10px 10px 36px;
    font-weight: 500;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-color);
    background: var(--backgound-grey);
    border-radius: 10px;
    margin-bottom: 15px;
    position: relative;
    cursor: pointer;
    transition: 0.3s;
}

.img_txt_block_side_item_t:hover {
    background: var(--background-color);
    box-shadow: 0 4px 55px 0 rgba(0, 0, 0, 0.1);
}

.img_txt_block_side_item_t:before {
    content: '';
    position: absolute;
    top: 50%;
    translate: 0 -50%;
    left: 20px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #ED1F3D;
}

.popupWindowNewSide .inputs-blocks-popup input.wpcf7-not-valid {
    border: 1px solid red !important;
}

.wpcf7-not-valid-tip,
.wpcf7-response-output {
    display: none !important;
}

.popupWindowNewSide .inputs-blocks-popup textarea.msg_field {
    height: 124px;
    vertical-align: top;
    margin-top: 0;
    border: unset !important;
    border: 1px solid #C3C3C3 !important;
    border-radius: 8px !important;
    padding: 10px 25px;
    width: 100%;
    background: white;
    font-size: 16px;
    font-weight: 400;
    resize: none;
    font-family: sans-serif;
}

.portfolio_title {
    margin-top: 110px;
    font-weight: 600;
    font-size: 65px;
    line-height: 100%;
    color: var(--text-color);
    margin-bottom: 35px;
}

.portfolio_tabs {
    display: flex;
    gap: 15px;
    margin-bottom: 80px;
    flex-wrap: wrap;
}

.portfolio_tab_item {
    border: 1px solid var(--text-color);
    border-radius: 50px;
    padding: 0 24px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: transparent;
    font-weight: 500;
    font-size: 16px;
    letter-spacing: -0.03em;
    color: var(--text-color);
    transition: 0.3s;
}

.portfolio_tab_item.active,
.portfolio_tab_item:hover {
    color: #fff !important;
    background: #ED1F3D !important;
    border: 1px solid #ED1F3D;
}

.portfolio_custom_block {
    display: flex;
    margin-bottom: 100px;
    gap: 50px;
    align-items: flex-start;
}

.portfolio_custom_block:nth-child(even) {
    flex-direction: row-reverse;
}

.portfolio_custom_info {
    flex-basis: 540px;
    min-width: 540px;
}

.portfolio_custom_image {
    flex-basis: 100%;
    overflow: hidden;
    border-radius: 20px;
    aspect-ratio: 1 / 0.56;
    /* height: 612px; */
}

.portfolio_custom_main_img img {
    width: 100%;
    border-radius: 20px;
    display: block;
}

.portfolio_custom_image img {
    transition: 1.5s cubic-bezier(.34, .88, .44, .95);
    width: 100%;
}

.portfolio_custom_image:hover img {
    translate: 0 -50%;
}


.portfolio_custom_main_img {
    margin-bottom: 25px;
}

.portfolio_custom_title {
    font-weight: 500;
    font-size: 23px;
    line-height: 137%;
    letter-spacing: 0.01em;
    color: var(--text-color);
    margin-bottom: 15px;
}

.portfolio_custom_descr {
    font-weight: 200;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0.01em;
    color: var(--text-color);
}

.portfolio_custom_tabs_inn {
    display: flex;
    align-items: center;
    gap: 11px;
    margin: 20px 0 25px;
    flex-wrap: wrap;
}

.portfolio_custom_tabs_inn_txt {
    background: var(--backgound-grey);
    border-radius: 23px;
    padding: 0 13px;
    height: 28px;
    font-weight: 400;
    font-size: 13px;
    letter-spacing: -0.03em;
    text-align: center;
    color: var(--text-color);
    display: flex;
    justify-content: center;
    align-items: center;
}

.portfolio_custom_info .services_link {
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    padding: 0 32px;
    height: 53px;
    display: inline-flex;
    cursor: pointer;
}

/* 
.all_portfolio .our_works_block {
    height: 430px;
} */

.all_portfolio .our_works_block_hover_site span {
    text-align: left;
    display: block;
}

.all_portfolio_title {
    font-weight: 600;
    font-size: 60px;
    line-height: 100%;
    letter-spacing: -0.03em;
    text-align: center;
    color: var(--text-color);
    margin-bottom: 60px;
}

.all_port_btn {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-bottom: 30px;
    color: var(--button-text);
}

.portfolio_seo {
    margin-top: 120px;
}

.portfolio_seo_wrapper {
    display: flex;
    align-items: center;
    gap: 100px;
    margin-bottom: 80px;
}

.portfolio_seo_side img {
    width: 100%;
    border-radius: 20px;
    display: block;
}

.portfolio_seo_side {
    flex-basis: 50%;
}

.portfolio_seo_descr p {
    font-weight: 200;
    font-size: 18px;
    line-height: 150%;
    letter-spacing: 0.01em;
    color: var(--text-color);
    margin-bottom: 20px;
}

.portfolio_seo_descr p:last-child {
    margin-bottom: 0;
}




.temp_block_img_txt_title_with_txt {
    font-size: 53px;
}

.page_new_side_video:has(img) {
    rotate: 0deg;
    top: 0;
    right: 0;
    border-radius: unset;
    width: 48%;
    height: 88%;
}

/* .page_new_side_video:has(img):before {
    content: '';
    position: absolute;
    width: 80%;
    height: 57%;
    z-index: -1;
    border-radius: 15px;
    background: var(--backgound-grey);
    rotate: 5deg;
    left: 63px;
    top: 45px;
} */

.img_txt_block_side_time {
    display: inline-flex;
    align-items: center;
    background: var(--background-color);
    gap: 14px;
    border-radius: 10px;
    padding: 0 20px;
    height: 65px;
    font-weight: 600;
    font-size: 23px;
    line-height: 150%;
    color: var(--text-color);
    margin-bottom: 35px;
}

.img_txt_block_gray {
    background: var(--backgound-grey);
}

.pb80 {
    padding-bottom: 80px;
}

.pb100 {
    padding-bottom: 100px;
}

.pt100 {
    padding-top: 100px;
}

.title_subtitle_section {
    background: var(--backgound-grey);
}

.icons_blocks_title_small {
    font-size: 30px;
    margin-bottom: 35px;
}

.icons_blocks_gray {
    background: var(--backgound-grey);
    margin: 0;
    padding: 80px 0;
}

.icons_blocks_gray .icons_blocks_item {
    background: var(--background-color);
}

.icons_blocks_gray .icons_blocks_wrapper {
    margin-bottom: 0;
}

.icons_blocks:has(.icons_blocks_title_small) .icons_blocks_wrapper {
    margin-top: 0;
}

.title_subtitle_section_t {
    font-weight: 600;
    font-size: 60px;
    line-height: 110%;
    letter-spacing: -0.03em;
    text-align: center;
    color: var(--text-color);
}

.title_subtitle_section_s {
    font-weight: 200;
    font-size: 18px;
    line-height: 150%;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--text-color);
}

.img_txt_block_side_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    padding: 0 32px;
    height: 53px;
    background: var(--button-black-bg);
    color: var(--button-text);
    font-weight: 500;
    nt-size: 16px;
    letter-spacing: -0.03em;
    transition: 0.3s;
    margin-top: 15px;
    border: unset;
}



.img_txt_block_side_btn:hover {
    color: white;
    background: var(--accent-color);
}

.industries_work_title,
.industries_work_subtitle {
    text-align: center;
}

.industries_work_subtitle {
    width: 100%;
    max-width: 1070px;
    margin: 0 auto;
}

.industries_work_wrapper {
    margin-top: 50px;
}

.industries_work_wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 25px;
}

.industries_work_item {
    flex-basis: 32%;
    padding: 15px;
    border-radius: 20px;
    background: var(--backgound-grey);
    display: flex;
    flex-direction: column;
    gap: 15px;
    transition: 0.3s;
}

.industries_work_item:hover {
    box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.15);
}

.industries_work_item img {
    width: 100%;
    display: block;
    border-radius: 5px;

}

.industries_work_item span {
    padding: 20px;
    font-weight: 600;
    font-size: 30px;
    line-height: 100%;
    color: var(--text-color);
}

.price_bottom_block {
    margin-top: 80px;
}

.price_bottom_block_title {
    font-weight: 600;
    font-size: 30px;
    line-height: 110%;
    letter-spacing: -0.03em;
    color: var(--text-color);
    margin-bottom: 35px;
}

.price_bottom_block_descr {
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
}

.price_bottom_block_descr ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
    padding-left: 0;
    list-style: none;
    margin: 0;
}

.price_bottom_block_descr ul li {
    border-radius: 10px;
    padding: 10px 20px;
    padding-left: 35px;
    background: var(--backgound-grey);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--text-color);
    position: relative;
}

.price_bottom_block_descr ul li:before {
    content: '';
    position: absolute;
    top: 50%;
    translate: 0 -50%;
    left: 18px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--accent-color);
}

.btn_black {
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--button-black-bg);
    color: var(--button-text);
    height: 53px;
    border-radius: 50px;
    padding: 0 32px;
    display: inline-flex;
    cursor: pointer;
    transition: 0.3s;
    position: relative;
    left: 50%;
    translate: -50% 0;
}

.price_bottom_block_btn {
    margin-top: 35px;
}

.btn_black:hover {
    color: white;
    background: var(--accent-color);
}

.pb0 {
    padding-bottom: 0;
}

.how_we_work:has(.how_we_work_top_title) .how_we_work_list {
    margin-top: 0;
}

.how_we_work:has(.how_we_work_top_title) .how_we_work_l {
    padding-top: 60px;
}

.how_we_work:has(.how_we_work_top_title) .how_we_work_descr {
    max-width: 820px;
    width: 100%;
}

.how_we_work:has(.how_we_work_top_title) .how_we_work_r_inn {
    padding-top: 60px;
}

.how_we_work:has(.how_we_work_top_title) .how_we_work_l_inn:before {
    opacity: 0;
    transition: opacity 0.6s ease;
}

.how_we_work:has(.how_we_work_top_title) .how_we_work_l_inn.show-top-fade:before {
    opacity: 1;
}

.faq_temp_title {
    margin-bottom: 60px;
}





















































@media(max-width: 1700px) {
    .menu_header ul {
        gap: 30px;
    }

    .menu_header ul li a {
        font-size: 16px;
    }

    .header_btn {
        font-size: 14px;
        padding: 0 30px;
    }
}

@media(max-width: 1560px) {

    .page_new_side_video:has(img) {
        height: 88%;
    }

    .icons_blocks_item {
        flex-basis: 23.45%;
    }

    .icons_blocks_item:nth-child(-n+3) {
        flex-basis: 31.8%;
    }

    .page_new_top {
        overflow: hidden;
    }

    .number_block:nth-child(4) .number_block_num {
        width: 365px;
    }

    .header_logo img {
        width: 98px;
    }

    .menu_header ul {
        gap: 27px;
    }

    .menu_header ul li a {
        font-size: 14px;
    }

    .services_wrapper_side_title {
        font-size: 40px;
        margin-bottom: 20px;
    }

    .services_wrapper_txt {
        padding: 30px 50px;
    }

    .services_perelink {
        margin: 25px 0;
    }

    .services_wrapper_side_descr p {
        margin-bottom: 15px;
        font-size: 14px;
    }

    .post_title {
        font-size: 23px;
    }

    .footer_phone {
        font-size: 50px;
    }

    .footer_mail {
        font-size: 28px;
    }

    #menu-footer-menu-new .sub-menu>li>a,
    #menu-footer-menu-new .sub-menu>.menu_not_child>li>a {
        white-space: unset;
    }

    .team_position_item {
        min-height: 290px;
    }

    .team_positions_btn {
        font-size: 50px;
    }

    .team_positions_btn_num {
        font-size: 19px;
        padding: 0 11px;
        height: 24px;
        border-radius: 11px;
    }
}

@media(max-width: 1440px) {
    .icons_blocks_wrapper_half .icons_blocks_item:nth-last-child(-n+2) {
        flex-basis: 48.1%;
    }
}

@media(max-width: 1380px) {

    .icons_blocks_item {
        flex-basis: 23.2%;
    }

    .icons_blocks_item:nth-child(-n+3) {
        flex-basis: 31.5%;
    }

    .section_words_anim {
        width: 100%;
        margin-left: -32px;
    }

    .new_top_title {
        font-size: 80px;
    }

    .our_works_title {
        font-size: 60px;
    }

    .number_block_num,
    .number_block_num span {
        font-size: 60px;
    }

    .number_block_txt {
        font-size: 16px;
    }

    .post_img img {
        height: 265px;
    }

    .post_title {
        font-size: 21px;
    }

    .news_item_bottom {
        margin-top: 18px;
    }

    .seo_new_description h3 {
        font-size: 30px;
    }

    .seo_new_side_txt {
        padding: 30px;
    }

    #menu-footer-menu-new .sub-menu>li>a,
    #menu-footer-menu-new .sub-menu>.menu_not_child>li>a {
        font-size: 14px;
    }

    #menu-footer-menu-new .sub-menu .sub-menu li a {
        font-size: 12px;
    }

    .footer_phone {
        font-size: 40px;
    }

    .footer_mail {
        font-size: 23px;
    }

    #menu-footer-menu-new .menu-item-has-children .sub-menu-1 .menu-item-has-children .sub-menu-1 .menu_not_child:has(.hidden) {
        max-height: 94px;
    }

    .icons_blocks_item {
        height: auto;
        padding: 20px;
    }

    .new_pricing_wrapper {
        gap: 12px;
    }

    .new_pricing_item_top {
        padding: 25px 0 0;
    }
}

@media(max-width: 1280px) {

    .new_pricing_item_price {
        font-size: 16px;
    }

    .industries_work_item {
        flex-basis: 31%;
    }

    .icons_blocks_item .icons_blocks_item {
        flex-basis: 22.8%;
    }

    .icons_blocks_item:nth-child(-n+3) {
        flex-basis: 31.1%;
    }

    .animated_banner:has(.show-elements) .animated_banner_wrapper {
        scale: 1.2;
        --banner-scale: 1.2;
    }

    .show-elements.anim_img {
        scale: 3.15;
    }

    .page_new_top_wrapper {
        height: 76vh;
    }

    .img_txt_block_wrapper {
        gap: 40px;
    }

    .new_temp_title {
        font-size: 50px;
    }

    .page_new_title {
        font-size: 66px;
    }

    .section_words_anim .map-canvas {
        width: 370px;
    }

    .section_words_anim {
        height: 75vh;
    }

    .menu_header ul {
        gap: 18px;
    }

    .menu_header ul li a {
        font-size: 13px;
    }

    .our_works_title {
        font-size: 50px;
    }

    .new_top_title {
        font-size: 70px;
    }

    .services_perelink_item {
        font-size: 12px;
    }
}

@media(max-width: 1024px) {

    .page_new {
        padding-top: 100px;
    }

    .icons_blocks_wrapper_half .icons_blocks_item:last-child {
        flex-basis: 100%;
    }

    .page_new_top_wrapper:has(.page_new_side_video_img) {
        height: 53vh;
    }

    .how_we_work_bottom_fade {
        width: calc(94vw - 450px);
    }

    .title_subtitle_section_t {
        font-size: 38px;
    }

    .industries_work_item span {
        font-size: 20px;
    }

    .icons_blocks_wrapper_same .icons_blocks_item {
        flex-basis: 47.5%;
    }

    .icons_blocks_item:nth-child(-n+3) {
        flex-basis: 47.5%;
    }

    .our_works_title,
    .our_works_title {
        font-size: 38px;
    }

    .new_pricing_item {
        flex-basis: 48.5%;
    }

    .portfolio_seo {
        margin-top: 70px;
    }

    .show-elements.anim_img {
        scale: 2.5;
    }

    .portfolio_seo_wrapper {
        gap: 30px;
    }

    .portfolio_seo_descr p {
        font-size: 14px;
    }

    .page_new_title {
        font-size: 50px;
    }

    .show_footer_menu {
        font-size: 12px;
        bottom: -18px;
    }

    .section_words_anim {
        scale: 0.7;
    }

    .section_words_anim {
        width: 137%;
        margin-left: -237px;
    }

    .section_words_anim .map-canvas {
        width: 410px;
    }

    .services_link_price {
        height: 40px;
    }

    .new_temp_title {
        font-size: 38px;
    }

    .new_temp_descr {
        font-size: 16px;
    }

    .icons_blocks_item {
        height: 280px;
    }

    .icons_blocks_item_title {
        font-size: 19px;
    }

    .icons_blocks_item_descr {
        font-size: 16px;
    }

    .animated_banner_wrapper {
        height: 290px;
    }

    .services_block_item {
        padding: 25px 30px;
    }

    .services_block_wrapper {
        grid-template-columns: repeat(2, 1fr);
    }

    .how_we_work_list_item {
        font-size: 18px;
        margin-bottom: 17px;
    }

    .how_we_work_r_inn {
        padding-top: 115px;
    }

    .how_we_work_r_head h3 {
        font-size: 24px;
    }

    .how_we_work_r_head img {
        width: 25px;
    }

    .how_we_work_r_head {
        margin-bottom: 20px;
    }

    .how_we_work_r_item:last-child {
        margin-bottom: 128px;
    }

    .new_pricing_item_top h3 {
        margin: 20px 0;
    }

    .new_pricing_wrapper {
        /* grid-template-columns: repeat(2, 1fr); */
        flex-wrap: wrap;
    }

    .how_we_work_l_inn:after,
    .how_we_work_l_inn:before {
        width: calc(94vw - 380px);
    }

    .how_we_work_l {
        width: 380px;
        min-width: 380px;
    }

    .team_position_item {
        min-height: 250px;
    }

    .team_position_item_title {
        font-size: 17px;
    }

    .team_position_item_description {
        font-size: 14px;
    }

    .new_top_title {
        font-size: 55px;
    }

    .header_btn {
        display: none;
    }

    .container {
        padding: 0 50px;
    }

    .header_wrapper {
        padding: 25px 0;
    }

    .our_works_wrapper {
        gap: 28px;
    }

    .testimonials {
        padding: 110px 0;
    }

    .testimonials_item {
        height: 380px;
    }

    .testimonials_item_img_rate {
        top: 42px;
    }

    .slick-dots {
        bottom: 30px;
    }

    .numbers_block {
        margin-top: 75px;
        gap: 35px;
        flex-wrap: wrap;
    }

    .team_positions_btn {
        font-size: 33px;
    }

    .team_wrapper {
        gap: 48px;
    }

    .number_block {
        flex-basis: 46%;
    }

    .number_block_num,
    .number_block_num span {
        font-size: 40px;
    }

    .number_block_txt {
        font-size: 14px;
    }

    .number_block_txt {
        margin-top: 15px;
        padding-top: 15px;
    }

    .services_wrapper_side_title {
        font-size: 27px;
    }

    .theme_widget {
        right: 3px;
    }

    .services_perelink_item {
        font-size: 11px;
    }

    .services_wrapper_video {
        height: 538px;
    }

    .process_item {
        padding: 24px;
    }

    .process_item_title {
        font-size: 22px;
    }

    .process_item_subtitle {
        font-size: 12px;
    }

    .process {
        padding-bottom: 110px;
    }

    .clients_wrapper {
        padding: 45px;
    }

    .clients_wrapper {
        gap: 60px;
    }

    .news {
        padding: 110px 0;
    }

    .post_img img {
        height: 190px;
    }

    .news_wrapper {
        gap: 20px;
    }

    .post_title {
        font-size: 15px;
    }

    .news_tags {
        gap: 10px;
    }

    .news_tags a {
        font-size: 12px;
    }

    .seo_new_wrapper {
        gap: 20px;
    }

    .seo_new_side_img img,
    .seo_new_side_txt_wrapper {
        height: 390px;
    }

    .seo_new_description h3 {
        font-size: 24px;
    }

    .seo_new_description p {
        font-size: 14px;
    }

    .services_wrapper_side_descr p {
        font-size: 12px;
    }

    .seo_new_description p {
        margin-bottom: 9px;
    }

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

    .seo_new_side_txt {
        padding: 20px;
    }

    .faq_title {
        font-size: 18px;
    }

    /* .faq_cat_item {
        padding: 18px 0;
    } */

    .faq_cat_item {
        padding: 18px 0;
    }

    #menu-footer-menu-new>.menu-item-has-children>a {
        font-size: 18px;
    }

    .services_link span {
        font-size: 13px;
        padding-left: 48px;
    }

    .services_link_arrow {
        width: 53px;
    }

    .services_wrapper_side_btns a {
        font-size: 12px;
        height: 40px;
    }

    .services_wrapper_side_btns a {
        padding: 0 25px;
    }

    .services_perelink_item {
        padding: 5px 15px;
    }

    .services_wrapper_txt {
        padding: 30px;
    }

    .services_wrapper_side_btns {
        margin-top: 25px;
    }
}

@media(max-width: 992px) {

    body:has(.page_new_side_video_img) .services_block {
        padding-top: 70px;
    }

    .page_new {
        padding-top: 105px;
    }

    .page_new_side_video:has(img):before {
        top: -29px;
    }

    .img_txt_block_wrapper:has(.img_txt_block_side_btn) {
        gap: 30px;
    }

    .industries_work_item {
        flex-basis: 48%;
    }

    .icons_blocks_item_title {
        margin-top: 15px;
    }

    .img_txt_block_side {
        flex-basis: 100%;
        width: 100%;
    }

    .portfolio_title {
        margin-top: 20px;
        font-size: 38px;
        margin-bottom: 20px;
    }

    .portfolio_custom_block {
        margin-bottom: 70px;
    }

    .all_portfolio_title {
        margin-bottom: 45px;
    }

    .all_portfolio_title {
        font-size: 35px;
    }

    .img_txt_block .new_temp_title {
        font-size: 38px;
    }

    .new_pricing_item_price {
        font-size: 20px;
    }

    .how_we_work_bottom_fade {
        width: calc(94vw - 400px);
    }

    .portfolio_tabs {
        margin-bottom: 43px;
    }

    .portfolio_custom_image {
        display: none;
    }

    .portfolio_custom_info {
        min-width: unset;
        flex-basis: 100%;
    }

    .icons_blocks_wrapper {
        justify-content: center;
    }

    .inside_process_item {
        flex-basis: 48%;
    }

    .page_new_side .services_link_price {
        height: 53px;
    }

    .icons_blocks_item,
    .icons_blocks_item:nth-child(-n+3),
    .icons_blocks_wrapper_same .icons_blocks_item {
        flex-basis: 46.2%;
    }

    .icons_blocks_wrapper_half .icons_blocks_item:nth-last-child(-n+2) {
        flex-basis: 46.2%;
    }

    .icons_blocks_wrapper_half .icons_blocks_item:last-child {
        flex-basis: 100%;
    }

    .page_new_title {
        font-size: 46px;
    }

    .container {
        padding: 0 15px;
    }

    #menu-footer-menu-new .menu-item-has-children .sub-menu-1 .menu-item-has-children .sub-menu-1 .menu_not_child:has(.hidden) {
        max-height: 104px;
    }

    .home .header_wrapper {
        padding: 18px 0;
    }

    .services_wrapper_side_subtitle {
        font-size: 20px;
    }

    .footer_bottom_column {
        text-align: center;
        width: 100%;
    }

    .page_new_side_video {
        width: 56%;
        top: -100px;
    }

    .animated_banner:has(.show-elements) .animated_banner_wrapper {
        scale: 1.1;
        --banner-scale: 1.1;
    }

    .show-elements.anim_img {
        scale: 2.1;
    }

    .services_wrapper_side_btns * {
        white-space: nowrap;
    }

    .footer_bottom_column_menu {
        align-items: center;
        padding-left: 0;
        margin: 30px 0;
        width: 47%;
    }

    .page_new_side {
        flex-basis: 43%;
        width: 50%;
    }

    .how_we_work_l_inn:after,
    .how_we_work_l_inn:before {
        width: calc(94vw - 358px);
    }

    .new_pricing_wrapper {
        gap: 15px;
    }

    .lines_block {
        height: 210px;
    }

    .notes_block_list_txt {
        flex-basis: 47.9%;
    }

    .img_txt_block_wrapper {
        flex-direction: column-reverse;
    }

    .services_block_title {
        margin-bottom: 40px;
    }

    .new_portfolio_wrapper {
        grid-template-columns: repeat(2, 1fr);
    }

    .new_portfolio_wrapper {
        column-gap: 15px;
        row-gap: 30px;
    }

    .services_block_item_head {
        margin-bottom: 18px;
    }

    .how_we_work_r_inn {
        padding-top: 94px;
    }

    .how_we_work_list {
        margin-top: 50px;
    }

    .page_new_top {
        padding-bottom: 50px;
    }

    .img_txt_block_wrapper {
        gap: 12px;
    }

    li.menu-item-has-children {
        display: block;
    }

    #js-map-canvas-o {
        scale: 0.7;
    }

    .mobile_menu {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
        background: var(--background-color);
        padding: 0 50px;
        overflow: auto;
        padding-bottom: 24px;
        position: fixed;
        z-index: 2000;
        top: 88px;
        padding-top: 15px;
        left: 0;
        right: 0;
        bottom: 0;
        transition: 0.5s;
        translate: -120% 0;
    }

    .header:has(.burger-menu-wraper.show-menu) {
        background: var(--background-color) !important;
    }

    .mobile_menu.show-menu {
        translate: 0 0;
    }

    .menu-wrapper-mobile {
        width: 100%;
    }

    .mobile_menu .header_btn {
        display: flex;
    }

    .mobile_menu .menu-header li a {
        font-weight: 600;
        font-size: 19px;
        line-height: 110%;
        color: var(--text-color);
        padding-bottom: 24px;
        margin-bottom: 24px;
        border-bottom: 1px solid #D9D9D9;
        display: block;
    }

    .mobile_menu .menu-header li {
        position: relative;
    }

    .header_mob_tel {
        font-weight: 600;
        font-size: 31px;
        line-height: 100%;
        color: var(--text-color);
        margin: 27px 0 7px;
    }

    .header_mob_mail {
        font-weight: 400;
        font-size: 18px;
        line-height: 73%;
        color: var(--text-color);
        /* margin-bottom: 27px; */
    }

    .mobile_menu .menu-header li:last-child a {
        border-bottom: unset;
    }

    .mobile_menu_btn {
        margin-top: 10px;
        display: inline-flex;
        background: #ED1F3D;
        font-weight: 500;
        font-size: 14px;
        color: white;
    }

    .mobile_menu .menu-header ul {
        list-style: none;
        padding: 0;
        margin: 0;
        width: 100%;
    }


    li.menu-item-has-children::before,
    li.menu-item-has-children::after,
    li.menu-item-has-children>a::after,
    li.menu-item-has-children>span::after,
    li.menu-item-has-children>a::before,
    li.menu-item-has-children>a::after,
    li.menu-item-has-children>span::before,
    li.menu-item-has-children>span::after {
        display: none;
    }



    header .sub-menu {
        display: block;
        position: fixed;
        top: 0;
        left: 50px;
        right: 0;
        bottom: 0;
        z-index: 100;
        padding-top: 55px !important;
        background: var(--background-color);
        transition: 0.9s;
        opacity: 0;
        visibility: hidden;
    }

    .openSubBtn {
        width: 20px;
        height: 20px;
        position: absolute;
        top: 0px;
        right: 0;
        z-index: 50;
        background-image: url(/wp-content/uploads/2025/07/menu-arrow.svg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        filter: var(--invert-color);
    }


    .menu-wrapper-mobile {
        transition: 0.3s;
    }

    .btn_temp {
        opacity: 0;
    }

    .menu-wrapper-mobile.temp_hidden {
        opacity: 0;
        visibility: hidden;
    }

    .menu-item.open_menu_mob>.sub-menu {
        translate: 0 0;
        opacity: 1;
        visibility: visible;
    }

    .menu-item.open_menu_mob>.openSubBtn {
        z-index: 500;
        rotate: 180deg;
        position: fixed;
        top: 5px;
        left: 45px;
    }

    .menu-header .menu-item-has-children .sub-menu .menu-item-has-children .openSubBtn {
        z-index: 500;
    }

    .menu-header .menu-item-has-children .sub-menu .menu-item {
        width: 87%;
    }

    .menu-header .menu-item-has-children .sub-menu .menu-item-has-children .sub-menu {
        left: 0;
    }

    .menu-header:has(.menu-item-has-children .sub-menu .menu-item-has-children.open_menu_mob) .openSubBtn {
        display: none;
    }

    .menu-header .menu-item-has-children .sub-menu .menu-item-has-children.open_menu_mob .openSubBtn {
        display: block;
        left: 0;
        z-index: 600;
        /* background-color: var(--background-color); */
    }

    .mobile_menu:has(.menu-item-has-children.open_menu_mob) .mobile_menu_bottom {
        display: none !important;
    }


    .sub-menu a {
        white-space: nowrap;
    }

    .marquee-wrapper {
        top: 15px;
    }

    .team_positions_btn {
        font-size: 23px;
        margin-bottom: 26px;
    }

    .team_positions_btn_num {
        font-size: 14px;
    }

    .team {
        padding-bottom: 70px;
    }

    .team_position_item {
        min-height: 180px;
        justify-content: flex-start;
    }

    .team_positions_btn svg {
        width: 35px;
    }

    .team_positions_btn:hover,
    .team_positions_btn.active {
        padding-left: 44px;
    }

    .mobile_menu_bottom {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        transition: 0.3s;
        margin: -20px auto 0;
        align-items: center;
    }

    .mobile_menu_bottom.hidden {
        opacity: 0;
        visibility: hidden;
    }

    .team_position_item_icon {
        width: 50px;
        height: 50px;
        margin-bottom: 20px;
    }

    .team_positions {
        flex-basis: 60%;
    }

    .team_positions_btns {
        flex-basis: 40%;
    }

    .team_position_item_title {
        font-size: 14px;
    }

    .team_position_item_description {
        font-size: 12px;
    }

    .team_position_items {
        gap: 15px;
    }

    .team_position_item {
        padding: 15px;
    }

    .team_wrapper {
        gap: 30px;
    }

    .section_words_anim {
        scale: 0.5;
        width: 170%;
        margin-left: -313px;
        height: 55vh;
    }

    #js-map-canvas-l-second {
        scale: 0.68;
    }

    .marquee-wrapper.black {
        top: -10px;
    }

    .burger_block {
        display: block;
    }

    .menu_header {
        display: none;
    }

    .burger-menu-wraper {
        display: block;
    }

    .new_top_title {
        font-size: 46px;
    }

    .new_top_subtitle {
        font-size: 26px;
    }

    .new_top_descr {
        font-size: 16px;
    }

    .our_works_title {
        font-size: 40px;
    }

    .our_works_wrapper {
        margin-top: 34px;
    }

    .portfolio_btn {
        margin-top: 40px;
    }

    .our_works_block_hover_tags span {
        height: 25px;
        font-size: 12px;
    }

    .our_works_block_hover_bottom {
        left: 17px;
        bottom: 17px;
    }

    .our_works_block_hover_site {
        margin-bottom: 18px;
    }

    .our_works_block_hover_site span {
        font-size: 18px;
    }

    .our_works_block:hover {
        border-radius: 20px 20px 114px 20px;
    }

    .our_works_wrapper {
        gap: 20px;
    }

    .testimonials {
        padding: 50px 0;
    }

    .testimonials_wrapper {
        margin-top: 38px;
    }

    .slick-arrow {
        left: 22px;
    }

    .slick-next {
        left: unset;
        right: 22px;
    }

    .testimonials_item {
        height: 365px;
    }

    .testimonials_item_img_rate {
        top: 28px;
    }

    .testimonials_item_descr p {
        font-size: 14px;
        padding: 0 55px;
    }

    .testimonials_item_title {
        font-size: 22px;
        margin-bottom: 14px;
    }

    .numbers_block {
        flex-wrap: wrap;
    }

    .number_block:nth-child(4) .number_block_num {
        width: 320px;
    }

    .number_block {
        flex: unset;
        flex-basis: calc(50% - 35px);
    }

    .theme_widget {
        right: 11px;
    }

    .number_block_num,
    .number_block_num span {
        font-size: 36px;
    }

    .services_wrapper {
        margin-top: 38px;
    }

    .services_item,
    .reverse_section {
        flex-direction: column;
    }

    .services_wrapper_video {
        height: auto;
    }

    .services_wrapper_video {
        border-radius: 0;
    }

    .services_wrapper_txt {
        padding: 18px 0;
    }

    .services_wrapper_side_title {
        margin-bottom: 13px;
    }

    .services_wrapper {
        display: flex;
        flex-direction: column;
        gap: 40px;
    }

    .number_block:nth-child(3) .number_block_num {
        width: auto;
    }

    .reverse_section .services_wrapper_video {
        border-radius: 0;
    }

    .marquee-wrapper {
        left: -33px;
    }

    .marquee-wrapper {
        height: 48px;
    }

    .services {
        padding-bottom: 70px;
    }

    .process_wrapper {
        margin-top: 38px;
        grid-template-columns: repeat(3, 1fr);
    }

    .process_item_title {
        font-size: 20px;
    }

    .process {
        padding-bottom: 50px;
    }

    .clients_wrapper {
        gap: 35px;
        padding: 30px;
        margin-top: 40px;
        grid-template-columns: repeat(4, 1fr);
    }

    .post_title {
        font-size: 18px;
    }



    .news {
        padding: 50px 0;
    }

    .news_wrapper {
        margin-top: 38px;
        grid-template-columns: repeat(1, 1fr);
        gap: 30px;
    }

    .post_img img {
        height: 340px;
    }

    .news_item_bottom {
        margin-top: 14px;
    }

    .seo_new_wrapper {
        flex-direction: column;
        margin-top: 33px;
        gap: 15px;
    }

    .seo_new_description h3 {
        margin: 20px 0 12px;
        line-height: 126%;
    }

    .faqs_tabs {
        gap: 15px;
    }

    .seo_new_side_txt {
        padding: 20px 0;
    }

    .seo_new_side_img img {
        height: auto;
    }

    .faqs_wrapper {
        flex-direction: column;
        gap: 35px;
    }

    .seo_new {
        padding-bottom: 50px;
    }

    .faqs_title_side_wrapper h2,
    .faqs_title_side_wrapper .our_works_subtitle {
        text-align: center;
    }

    .faqs_title_side_wrapper a {
        margin-top: 15px;
        position: relative;
        left: 50%;
        translate: -50% 0;
    }

    .faqs {
        padding-bottom: 50px;
    }

    footer {
        padding: 50px 0 80px;
    }

    .sub-menu:has(.menu_not_child) {
        display: flex;
        gap: 3%;
    }

    #menu-footer-menu-new .sub-menu>li>a,
    #menu-footer-menu-new .sub-menu>.menu_not_child>li>a {
        font-size: 13px;
        margin-bottom: 14px;
    }

    #menu-item-7570>ul {
        flex-wrap: wrap;
    }

    #menu-item-7570>ul li {
        flex-basis: 31%;
    }

    .footer_bottom {
        grid-template-columns: repeat(1, 1fr);
        display: flex;
        flex-wrap: wrap;
        margin-top: 18px;
        padding-top: 34px;
    }

    .footer_bottom_column_logo {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
    }

    .footer_socials {
        margin-top: 18px;
    }

    .footer_btn {
        margin-top: 24px;
    }

}

@media(max-width: 600px) {

    body:has(.page_new_side_video_img) .services_block {
        padding-top: 33px;
    }

    .portfolio_seo_wrapper {
        flex-direction: column-reverse;
        gap: 15px;
    }

    .portfolio_seo_wrapper {
        margin-bottom: 40px;
    }

    .portfolio_seo_wrapper:last-child {
        flex-direction: column;
    }

    .portfolio_seo_descr p {
        margin-bottom: 12px;
    }

    .all_portfolio_title {
        margin-bottom: 20px;
    }

    .img_txt_block .new_temp_title {
        font-size: 28px;
    }

    .services {
        overflow: hidden;
    }

    .watsapp_btn {
        right: 15px;
        width: 45px;
        height: 45px;
        padding: 0;
        border-radius: 50%;
        gap: 0;
        font-size: 0;
    }

    .page_new_top_wrapper {
        flex-direction: column;
    }

    .page_new_top_wrapper {
        height: auto;
    }

    .page_new_side_video {
        position: relative;
        top: unset;
        right: unset;
        width: 100%;
        margin-top: 30px;
        rotate: 0deg;
        display: block;
        overflow: unset;
    }

    .new_temp_title {
        font-size: 30px;
        margin-bottom: 20px;
    }

    .new_temp_subtitle {
        line-height: 130%;
        margin-bottom: 20px;
        font-size: 16px;
    }

    .icons_blocks_wrapper {
        margin: 20px 0;
        flex-direction: column;
        gap: 15px;
    }

    .animated_banner {
        margin: 34px 0;
    }

    .how_we_work_l_inn:after,
    .how_we_work_l_inn:before {
        display: none;
    }

    .how_we_work_r_inn,
    .page-id-7952 .how_we_work_r_inn {
        padding-top: 0;
    }

    .inside_process {
        padding: 46px 0;
        margin-bottom: 46px;
    }

    .inside_process_wrapper {
        margin-top: 30px;
    }

    .new_pricing_wrapper_descr {
        margin: 30px 0;
    }

    .inside_process_item {
        flex-basis: 100%;
        width: 100%;
    }

    .icons_blocks {
        margin-bottom: 50px;
        margin-top: 30px;
    }

    .how_we_work_title {
        text-align: center;
    }

    .how_we_work {
        margin: 35px 0;
        margin-bottom: 25px;
    }

    .how_we_work_list {
        display: none;
    }

    .icons_blocks_item:nth-child(-n+3),
    .icons_blocks_item {
        flex-basis: 100%;
        width: 100%;
        padding: 25px;
        height: auto;
        margin: 0;
    }

    .new_portfolio {
        padding: 50px 0;
    }

    .new_pricing_item,
    .new_pricing_item_bottom {
        padding: 15px;
    }

    .new_pricing_item_top {
        padding: 15px 15px 0;
    }

    .new_portfolio_wrapper {
        grid-template-columns: repeat(1, 1fr);
    }

    .new_pricing {
        margin: 34px 0;
    }

    .animated_banner:has(.show-elements) .animated_banner_wrapper {
        scale: 1.05;
        --banner-scale: 1.05;
    }

    .notes_block {
        margin: 37px auto 0;
    }

    .notes_block_list_txt {
        flex-basis: 100%;
    }

    .new_portfolio_bottom {
        margin-top: 10px;
    }

    .new_portfolio_item_title {
        margin: 17px 0 12px;
    }

    .icons_blocks_item_title {
        margin: 8px 0 5px;
    }

    .icons_blocks_item_icon img {
        width: 50px;
        height: 50px;
    }

    .page_new_top {
        padding-top: 28px;
        padding-bottom: 28px;
    }

    .page_new_title {
        font-size: 35px;
        padding-bottom: 0;
        margin-bottom: 15px;
    }

    .services_link_price {
        height: 53px;
    }

    .page_new_side video {
        height: 100%;
        object-fit: cover;
        scale: 1;
        rotate: 0deg;
        position: relative;
        left: 0;
        width: 100%;
        bottom: 0;
        border-radius: 15px;
    }

    .anim_img {
        width: 330px;
        height: 330px;
    }

    .show-elements.anim_img {
        scale: 1.8;
    }

    .page_new_side:has(.page_new_side_video) {
        width: 100%;
        flex-basis: 100%;
    }

    .how_we_work_wrapper {
        flex-direction: column;
        gap: 14px;
    }

    .how_we_work_r_item {
        margin-bottom: 35px;
    }

    .how_we_work_r_head h3 {
        font-size: 22px;
    }

    .how_we_work_r_head {
        gap: 15px;
        margin-bottom: 12px;
    }

    .how_we_work_r_item:last-child {
        margin-bottom: 0;
    }

    .services_block_item {
        padding: 20px 15px;
    }

    .new_pricing_wrapper {
        grid-template-columns: repeat(1, 1fr);
        margin-top: 27px;
    }

    .animated_banner_btns {
        flex-direction: column;
        gap: 15px;
    }

    .clients_block {
        margin: 32px 0;
    }

    .faq_temp {
        margin-bottom: 50px;
    }

    .page_new_top_wrapper .services_wrapper_side_btns a,
    .page_new_top_wrapper .services_wrapper_side_btns .services_link_price,
    .page_new_top #formTitle {
        width: 300px;
        font-size: 14px;
    }

    .inside_process_item_txt {
        padding: 0;
        padding-top: 10px;
    }

    .services_link span,
    .new_portfolio .portfolio_btn,
    .clients_block #formTitle {
        font-size: 14px;
    }

    .services_block_wrapper {
        grid-template-columns: repeat(1, 1fr);
        display: flex;
        flex-wrap: wrap;
    }

    .services_block_item {
        width: 100%;
        flex-basis: 100%;
    }

    .pb100 {
        padding-bottom: 50px;
    }

    .how_we_work:has(.how_we_work_top_title) .how_we_work_r_inn {
        padding-top: 0;
    }

    .how_we_work:has(.how_we_work_top_title) .how_we_work_l {
        padding-top: 0;
    }

    .pt100 {
        padding-top: 50px;
    }

    .img_txt_block_side_time {
        height: 50px;
        font-size: 18px;
        margin-bottom: 20px;
    }

    .pb80 {
        padding-bottom: 60px;
    }

    .industries_work_item {
        flex-basis: 100%;
    }

    .price_bottom_block_descr ul {
        grid-template-columns: repeat(1, 1fr);
    }

    .icons_blocks.icons_blocks_gray {
        margin-bottom: 20px;
    }

    .our_works_title,
    h2 {
        font-size: 30px;
    }

    .faq_temp_title {
        margin-bottom: 20px;
    }

    .title_subtitle_section_t {
        margin-top: 0;
        font-size: 30px;
    }

    .page_new_side {
        width: 100%;
        flex-basis: 100%;
    }


    #menu-footer-menu-new .menu-item-has-children .sub-menu-1 .menu-item-has-children .sub-menu-1 .menu_not_child:has(.hidden) {
        max-height: 98px;
        /* border: 1px solid red; */
        margin-bottom: 37px;
    }

    .menu_not_child:has(.hide_footer_menu) {
        margin-bottom: 37px;
    }

    .show_footer_menu {
        bottom: 22px;
        translate: -50% 0;
        left: 50%;
        font-size: 13px;
    }

    /* .hide_footer_menu {
        bottom: -10px;
    } */

    .menu_not_child,
    li.menu-item-has-children {
        width: 100%;
    }

    .menu-header .menu-item-has-children .sub-menu a {
        font-size: 16px;
    }

    .dark_theme_icon svg {
        rotate: -55deg;
    }

    .menu-header .menu-item-has-children .sub-menu .menu-item-has-children .openSubBtn {
        left: unset;
        right: 0;
    }

    .menu-header .menu-item-has-children .sub-menu .menu-item {
        width: 92%;
    }

    .mobile_menu .menu-header li a {
        margin-bottom: 20px;
        padding-bottom: 20px;
    }

    .sub-menu:has(.menu_not_child) {
        flex-wrap: wrap;
    }

    #menu-footer-menu-new {
        row-gap: 22px;
    }

    footer .container {
        display: flex;
        flex-direction: column-reverse;
        gap: 50px;
    }

    .footer_wrapper_menu {
        text-align: center;
    }

    .sub-menu:has(.menu_not_child) {
        justify-content: center;
    }

    #menu-footer-menu-new {
        justify-content: center;
    }

    #menu-footer-menu-new>.menu-item-has-children>a {
        margin-bottom: 15px;
        text-align: left;
    }

    footer #menu-footer-menu-new>li.menu-item-has-children {
        padding: 10px 12px;
        border-radius: 7px;
        background: var(--background-color);
    }

    footer #menu-footer-menu-new>li.menu-item-has-children>.sub-menu {
        max-height: 0;
        overflow: hidden;
        transition: 0.3s;
    }

    footer #menu-footer-menu-new>li.menu-item-has-children>.sub-menu.showSub {
        max-height: 1200px;
        margin-top: 15px;
    }

    footer #menu-footer-menu-new>li.menu-item-has-children>a {
        margin-bottom: 0;
    }

    .footerAccBtn {
        position: absolute;
        z-index: 10;
        right: 3px;
        top: 4px;
        width: 40px;
        height: 40px;
        background-image: url(/wp-content/uploads/2025/08/arrow-d.svg);
        background-position: center;
        background-size: 15px;
        filter: grayscale(1);
        background-repeat: no-repeat;
        transition: 0.3s;
    }

    .footerAccBtn.showSub {
        rotate: 180deg;
    }

    .footer_bottom {
        padding-top: 0;
        margin-top: 0;
        border-top: unset;
    }

    #menu-item-7570>ul li {
        flex-basis: 100%;
    }

    #menu-footer-menu-new .sub-menu>li>a,
    #menu-footer-menu-new .sub-menu>.menu_not_child>li>a {
        margin-bottom: 12px;
        font-size: 14px;
        font-weight: 400;
        text-align: left;
    }

    .mobile_menu {
        top: 76px;
    }

    .mobile_menu {
        padding: 15px 15px 24px 15px;
    }

    .process_item_subtitle {
        font-size: 13px;
    }

    .container {
        padding: 0 14px;
    }

    .new_top_title {
        font-size: 40px;
    }

    .new_top_subtitle {
        font-size: 20px;
        max-width: 230px;
    }

    .new_top_descr {
        font-size: 16px;
    }

    .our_works_wrapper {
        grid-template-columns: repeat(1, 1fr);
    }

    .our_works_title,
    h2 {
        font-size: 36px;
    }

    .testimonials_item_descr p {
        font-size: 13px;
    }

    .testimonials_item {
        height: 534px;
    }

    .number_block {
        flex-basis: 100%;
    }

    .theme_widget {
        right: unset;
        bottom: -12px;
        top: unset;
        translate: -50% 0;
        left: 50%;
        rotate: -90deg;
    }

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

    .services_link_price {
        width: 70%;
    }

    .services_wrapper_side_btns a {
        width: 70%;
        height: 53px;
    }

    .services_link:hover .services_link_arrow {
        left: calc(100% - 59px);
    }

    .services_wrapper_side_title {
        font-size: 25px;
    }

    .services_wrapper_side_subtitle {
        font-size: 20px;
    }

    .marquee-wrapper {
        height: 40px;
        left: -15px;
    }

    .process_wrapper {
        grid-template-columns: repeat(2, 1fr);
        margin-top: 25px;
    }

    .process_item_title {
        font-size: 17px;
    }

    .process_item {
        padding: 12px;
        justify-content: flex-start;
    }

    .team_wrapper {
        flex-direction: column;
        gap: 20px;
        margin-top: 40px;
    }

    .team_positions_btn {
        font-size: 25px;
        font-weight: 500;
    }

    .team_positions_btn:hover,
    .team_positions_btn.active {
        padding-left: 35px;
    }

    .team_btn_bottom {
        font-size: 16px;
        margin-top: 20px;
    }

    .team_position_item {
        min-height: 180px;
    }

    .team_positions_btn svg {
        width: 24px;
    }

    .team {
        padding-bottom: 50px;
    }

    .clients_wrapper {
        margin-top: 25px;
        padding: 30px 15px;
    }

    .clients_item img {
        width: 80%;
    }

    .clients_wrapper {
        gap: 25px;
        grid-template-columns: repeat(2, 1fr);
    }

    .seo_new_description p {
        font-size: 16px;
    }

    .post_img img {
        height: 240px;
    }

    .post_title {
        font-size: 20px;
    }

    .portfolio_btn {
        margin-top: 30px;
    }

    .section_words_anim {
        display: none;
    }

    .seo_new {
        margin-top: 0;
    }

    .our_works_subtitle {
        font-size: 16px;
    }

    .seo_new_wrapper {
        margin-top: 30px;
    }

    .seo_new_side_txt {
        padding: 0;
    }

    .footer_bottom_column_menu {
        gap: 13px;
    }

    .menu-item.open_menu_mob .openSubBtn {
        left: 14px;
    }

    header .sub-menu {
        left: 13px;
    }

    .seo_new_description h3 {
        font-size: 20px;
        line-height: 130%;
    }

    .faqs_tabs {
        gap: 10px;
    }

    .faqs_tab {
        height: 35px;
        padding: 0 13px;
        font-size: 10px;
    }

    .faq_title {
        font-size: 16px;
        font-weight: 400;
        gap: 15px;
    }

    .faq_title svg {
        width: 15px;
        height: 15px;
    }

    .faq_answ {
        font-size: 14px;
    }

    .home .header_wrapper {
        padding: 15px 0;
    }

    .services_wrapper {
        margin-top: 25px;
    }

    .burger_block {
        scale: 0.9;
    }

    .page_new {
        overflow: hidden;
        padding-top: 80px;
    }

    .new_pricing_item {
        flex-basis: 100%;
        width: 100%;
    }

    .popupWindowNew {
        padding: 20px 15px;
    }

    .popupWindow_wrapper {
        flex-direction: column;
        gap: 24px;
    }

    .buttons-blocks-popup p {
        margin-bottom: 10px;
    }

    .popupWindowNewSide .privacy-form-text {
        margin-left: 9px;
        margin-top: 4px;
    }

    .popupWindowNewSide .buttons-blocks-popup input {
        padding: 10px 40px;
    }

    .popupWindowNewSide .buttons-blocks-popup {
        text-align: center;
    }

    .popupCloseNew {
        top: 10px;
        right: 10px;
    }

    .popupCloseNew {
        top: 10px !important;
        right: 10px !important;
        width: 30px;
        height: 30px;
    }

    .popupCloseNew svg {
        width: 50%;
    }

    .popupWindow_cont {
        gap: 20px;
        align-items: flex-start;
    }

    .popupWindow_cont_num_icon {
        width: 55px;
        height: 55px;
        margin-bottom: 8px !important;
    }

    .popupWindow_cont_num_icon svg {
        width: 50%;
    }

    .popup-form .iti.iti--allow-dropdown {
        margin-top: 0;
    }

    .popupWindowNewSide .popupText {
        font-size: 22px;
        margin-bottom: 15px;
    }

    .popupWindowNewSide .buttons-blocks-popup {
        margin-top: 20px;
    }

    .popupWindow_cont_item a {
        font-size: 17px;
        text-align: left;
    }

    .popupWindow_cont_item span {
        text-align: left;
        font-size: 13px;
    }

    .popupWindow_cont_item {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 15px;
    }

    .popupWindow_cont_ite_bottom {
        align-items: flex-start;
    }

    .popupWindowNewSide .inputs-blocks-popup input {
        height: 43px;
        padding: 0 14px;
    }

    .popupWindowNewSide .inputs-blocks-popup input::placeholder {
        font-size: 14px;
    }

    .services_block {
        padding-top: 44px;
    }

    .notes_block_wrapper {
        padding-bottom: 27px;
    }

    .section_interest_new {
        padding-bottom: 40px;
    }

    .header_wrapper {
        padding: 15px 0;
    }

    .header.sticky {
        box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.25);
    }

    .absolut-block {
        top: 15%;
        width: 100%;
    }

    .default-map-contacts {
        height: 62vh;
    }

    .our-contacts-title {
        font-size: 48px;
    }

    .img_txt_block_ch {
        padding-top: 40px;
    }

    .portfolio_tab_item {
        height: 35px;
        font-size: 14px;
    }

    .portfolio_tabs {
        gap: 10px;
    }

    .page_new_top_wrapper:has(.page_new_side_video_img) {
        height: auto !important;
    }

    .page_new_side_video:has(img):before {
        display: none;
    }

    .page_new_side_video:has(img) {
        width: 100%;
    }



    .page_new_side {
        padding: 0 15px;
    }

    .page_new_top .container,
    .page_new_side_r {
        padding: 0;
    }

}

@media(max-width: 321px) {
    .page_new_top_wrapper:has(.page_new_side_video_img) {
        height: auto;
    }
}

/* Services block CTA button and text CTA banner (animated_banner_2 with text) - 2026-10-11 */
.services_block_btn_wrapper {
    display: flex;
    justify-content: center;
    margin-top: 50px;
}

.services_block_btn_wrapper .new_top_btn {
    margin-top: 0;
}

.animated_banner_wrapper_txt {
    height: auto;
    min-height: 400px;
    padding: 70px 0;
}

.animated_banner:has(.show-elements) .animated_banner_wrapper_txt {
    scale: 1.15;
    --banner-scale: 1.15;
}

.animated_banner_txt {
    font-weight: 500;
    font-size: 26px;
    line-height: 135%;
    letter-spacing: -0.02em;
    color: var(--text-color);
    width: 100%;
    max-width: 760px;
    margin: 0 auto 30px;
}

@media(max-width: 1024px) {
    .animated_banner_txt {
        font-size: 22px;
    }
}

@media(max-width: 600px) {
    .services_block_btn_wrapper {
        margin-top: 30px;
    }

    .animated_banner_wrapper_txt {
        min-height: 290px;
        padding: 40px 0;
    }

    .animated_banner:has(.show-elements) .animated_banner_wrapper_txt {
        scale: 1.02;
        --banner-scale: 1.02;
    }

    .animated_banner_txt {
        font-size: 18px;
        margin-bottom: 22px;
    }
}

/* Pricing: prices in accent colour, button-only bottom block - 2026-10-11 */
.new_pricing_item_price {
    color: var(--accent-color);
}

.price_bottom_block_btn_only {
    margin-top: 50px;
}

.price_bottom_block_btn_only .price_bottom_block_btn {
    margin-top: 0;
}

/* Hero with image (page-flex-new): more space under the header on desktop and laptop - 2026-10-11 */
@media(min-width: 1025px) {
    .page_new_top_wrapper:has(.page_new_side_video_img) {
        height: auto !important;
        min-height: 57vh;
        padding-top: 110px;
    }
}

@media(min-width: 1025px) and (max-width: 1560px) {
    .page_new_top_wrapper:has(.page_new_side_video_img) {
        padding-top: 80px;
    }
}

/* ===== page-flex-new updates - 2026-10-12 ===== */

/* Services: when the card count is 4, 7, 10..., the last two rows hold 2 cards each (4 = 2+2, 7 = 3+2+2) */
.services_block_wrapper:has(> .services_block_item:last-child:nth-child(3n+4))>.services_block_item:nth-last-child(-n+4) {
    grid-column: span 3;
}

/* Services on tablet: plain 2-column grid, the desktop spans do not apply */
@media(max-width: 1024px) {
    .services_block_wrapper>.services_block_item {
        grid-column: auto !important;
    }
}

/* Text is shown as written - no forced lowercase or Title Case (Tasklist J1) */
.page_new .icons_blocks_item_title,
.page_new .icons_blocks_item_descr,
.page_new .new_temp_subtitle,
.page_new .faq_temp .faq_title,
.page_new .how_we_work_list_item {
    text-transform: none;
}

/* Pricing: compact cards so the whole block fits one laptop screen */
@media(min-width: 601px) {
    .page_new .new_pricing_wrapper {
        margin-top: 36px;
    }

    .page_new .new_pricing_item {
        padding: 16px;
    }

    .page_new .new_pricing_item_top {
        padding: 8px 8px 0;
    }

    .page_new .new_pricing_item_icon {
        float: left;
        margin: 0 12px 0 0;
    }

    .page_new .new_pricing_item_icon img {
        width: 32px;
        height: auto;
        display: block;
    }

    .page_new .new_pricing_item_top h3 {
        font-size: 20px;
        line-height: 120%;
        margin: 4px 0 14px;
        min-height: 24px;
        clear: none;
    }

    .page_new .new_pricing_item_descr {
        clear: both;
    }

    .page_new .new_pricing_item_descr,
    .page_new .new_pricing_item_descr ul li {
        font-size: 16px;
        line-height: 145%;
    }

    .page_new .new_pricing_item_descr ul li {
        margin-bottom: 4px;
    }

    .page_new .new_pricing_item_descr ul li:before {
        top: 9px;
    }

    .page_new .new_pricing_item_price {
        margin-top: 16px;
        font-size: 18px;
        font-weight: 600;
    }

    .page_new .new_pricing_item_bottom {
        margin-top: 14px;
        padding: 12px 16px;
    }

    .page_new .new_pricing_item_bottom_title {
        font-size: 15px;
    }

    .page_new .new_pricing_item_bottom_descr {
        font-size: 15px;
        line-height: 140%;
        margin-top: 4px;
    }

    .page_new .new_pricing_wrapper_descr {
        margin: 32px 0 0;
    }

    .page_new .price_bottom_block_btn_only {
        margin-top: 32px;
    }

    /* plain compact list inside the card label box (not the "chip" list style) */
    .page_new .new_pricing_item_bottom_descr ul {
        margin: 0;
    }

    .page_new .new_pricing_item_bottom_descr ul li {
        padding: 0 0 0 16px;
        margin-bottom: 4px;
        background: transparent;
        border-radius: 0;
        font-size: 15px;
        font-weight: 300;
        line-height: 140%;
    }

    .page_new .new_pricing_item_bottom_descr ul li:hover {
        background: transparent;
    }

    .page_new .new_pricing_item_bottom_descr ul li:before {
        left: 0;
        top: 8px;
        translate: 0 0;
        width: 5px;
        height: 5px;
    }
}

/* Title + Subtitle: grey background only when it opens a grey group (as on /seo-services), otherwise white */
.page_new .title_subtitle_section {
    background: transparent;
}

.page_new .title_subtitle_section:has(+ .img_txt_block_gray),
.page_new .title_subtitle_section:has(+ .icons_blocks_gray) {
    background: var(--backgound-grey);
}

/* Services cards: space between paragraphs and before a list in the description */
.page_new .services_block_item_descr p+p,
.page_new .services_block_item_descr p+ul {
    margin-top: 12px;
}

/* Services cards: plain compact list (not the "chip" list style) */
.page_new .services_block_item_descr ul {
    margin: 0;
}

.page_new .services_block_item_descr ul li {
    padding: 0 0 0 16px;
    margin-bottom: 6px;
    background: transparent;
    border-radius: 0;
    font-size: 16px;
    font-weight: 300;
    line-height: 145%;
}

.page_new .services_block_item_descr ul li:hover {
    background: transparent;
}

.page_new .services_block_item_descr ul li:before {
    left: 0;
    top: 10px;
    translate: 0 0;
    width: 5px;
    height: 5px;
}

/* ===== Hero constellation (page-flex-new) - 2026-10-12 ===== */
.page_new_top {
    isolation: isolate
}

.page_new_top>.page_new_constellation {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    pointer-events: none
}

.page_new_top>.page_new_constellation.is-ready {
    opacity: 1 !important
}

/* Phones and tablets: shown too since 2026-10-31 (lines follow a drifting point, see hero-constellation.js) */

/* ===== Laptop scale - 2026-10-12 =====
   Laptops (1281-1799px wide) get the whole site at 80%, the same as browser zoom 80%.
   Pure CSS: same HTML and text for search engines; phones, tablets and big monitors are not affected.
   Viewport units (vh/vw) are not scaled by zoom, so the rules that use them are divided by the factor. */
@media (min-width: 1281px) and (max-width: 1799px) {
    html {
        --laptop-zoom: .8;
        zoom: var(--laptop-zoom);
    }

    /* Header as on large screens (the max-width 1700/1560 header rules are undone) */
    .header_logo img {
        width: auto;
    }

    .menu_header ul {
        gap: 40px;
    }

    .menu_header ul li a {
        font-size: 18px;
    }

    .header_btn {
        font-size: 16px;
    }

    /* Viewport-based sizes, kept at their unzoomed proportions */
    .new_top {
        height: calc(75vh / var(--laptop-zoom));
    }

    .section_words_anim {
        height: calc(70vh / var(--laptop-zoom));
    }

    .page_new_top_wrapper {
        height: calc(75vh / var(--laptop-zoom));
    }

    .page_new_top_wrapper:has(.page_new_side_video_img) {
        min-height: calc(57vh / var(--laptop-zoom));
    }

    .how_we_work_l_inn:before {
        width: calc(94vw / var(--laptop-zoom) - 600px);
    }

    .how_we_work_bottom_fade {
        width: calc(94vw / var(--laptop-zoom) - 650px);
        height: calc(18vh / var(--laptop-zoom));
    }

    .bg-slide-web,
    section.main-slider-top,
    section.bg-main-keis,
    .first-section_container {
        height: calc(100vh / var(--laptop-zoom));
    }

    section.main-home-slider-video {
        width: calc(100vw / var(--laptop-zoom));
        height: calc(100vh / var(--laptop-zoom));
    }

    .custom_first_bg {
        min-height: calc(100vh / var(--laptop-zoom));
    }

    .default-map-contacts {
        height: calc(80vh / var(--laptop-zoom) - 80px);
    }

    section.section-media-bg {
        height: calc(60vh / var(--laptop-zoom));
    }

    ul#main-nav-voll ul.dropdown-menu {
        width: calc(90vw / var(--laptop-zoom));
    }

    .flex-block-banner img {
        right: calc((100vw / var(--laptop-zoom) - 1116px) / 2);
    }

    /* Homepage dots: the script sizes the canvas in screen pixels, so its box is enlarged back to 1:1 */
    canvas#homeVideo {
        width: calc(100vw / var(--laptop-zoom));
        height: calc(1220px / var(--laptop-zoom));
    }
}

/* Hero on tablets and small laptops: the first screen grows with its text,
   so the H1 is never pushed up under the header (Tasklist J14) - 2026-10-12 */
@media (min-width: 601px) and (max-width: 1280px) {
    .page_new_top_wrapper:not(:has(.page_new_side_video_img)) {
        height: auto;
        min-height: 76vh;
        padding-top: 70px;
    }
}

@media (min-width: 601px) and (max-width: 1024px) {

    .page_new_top_wrapper,
    .page_new_top_wrapper:has(.page_new_side_video_img) {
        height: auto !important;
        min-height: 53vh;
        padding-top: 80px;
    }
}

/* Animated banner 2: a long text (over 160 characters) gets a smaller size, so it stays at 3-4 lines - 2026-10-13 */
.animated_banner_txt.animated_banner_txt_long {
    font-size: 20px;
    max-width: 900px;
}

@media (max-width: 1024px) {
    .animated_banner_txt.animated_banner_txt_long {
        font-size: 18px;
    }
}

@media (max-width: 600px) {
    .animated_banner_txt.animated_banner_txt_long {
        font-size: 16px;
    }
}

/* Icons blocks: a list in the text under the cards - left-aligned and centred as a whole, white pills on the grey background - 2026-10-13 */
.page_new .icons_blocks_descr ul {
    display: inline-block;
    text-align: left;
    margin: 8px 0 0;
}

.page_new .icons_blocks_gray .icons_blocks_descr ul li {
    background: var(--background-color);
}

/* Pricing: space between paragraphs of the text under the cards - 2026-10-13 */
.page_new .new_pricing_wrapper_descr p+p {
    margin-top: 8px;
}

/* Header button on phones and tablets (burger menu, <=992px): black "Get in Touch" next to the burger, 2026-10-31.
   Desktop keeps "Discuss Your Project". Hidden while the mobile menu is open: the menu has its own button. */
.header_btn .header_btn_short {
    display: none;
}

@media (max-width: 992px) {
    .header_wrapper>.header_btn {
        display: inline-flex;
        margin-left: auto;
        margin-right: 10px;
        height: 40px;
        padding: 0 20px;
        font-size: 14px;
    }

    .header_wrapper>.header_btn .header_btn_long {
        display: none;
    }

    .header_wrapper>.header_btn .header_btn_short {
        display: inline;
    }

    body:has(.mobile_menu.show-menu) .header_wrapper>.header_btn {
        visibility: hidden;
    }
}

@media (max-width: 360px) {
    .header_wrapper>.header_btn {
        margin-right: 4px;
        padding: 0 14px;
        font-size: 13px;
    }
}

/* ===== Footer, new design (2026-10-31), markup in footer.php =====
   Light site theme: black footer. Dark site theme: grey footer, so it stands apart from the #1a1a1a page. */
footer.voll-footer {
    --vf-bg: #1b1b1b;
    --vf-line: #3a3a3a;
    --vf-muted: #b8b8b8;
    --vf-link: #d9d9d9;
    background: var(--vf-bg);
    color: #fff;
    text-align: left;
    padding: 80px 0 32px;
    font-family: "Inter", sans-serif;
}

[data-theme="dark"] footer.voll-footer {
    --vf-bg: #2c2c2c;
    --vf-line: #474747;
    --vf-muted: #c4c4c4;
}

footer.voll-footer .vf-container {
    display: block;
}

.voll-footer p {
    margin: 0;
}

.voll-footer a {
    color: var(--vf-link);
    text-decoration: none;
    transition: color .2s;
}

.voll-footer a:hover {
    color: #ff5a72;
}

/* Call to action */
.vf-cta {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 48px;
    padding-bottom: 56px;
}

.vf-cta-title {
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
    font-size: 52px;
    line-height: 1.1;
    letter-spacing: -1px;
    color: #fff;
}

.vf-cta-text {
    font-size: 18px;
    line-height: 1.5;
    color: var(--vf-muted);
    max-width: 560px;
    margin-top: 20px !important;
}

.vf-cta-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 28px;
}

.voll-footer .vf-btn-red {
    font-size: 16px;
    padding: 0 36px;
    height: 52px;
    margin: 0;
}

.voll-footer .vf-btn-outline {
    display: inline-flex;
    align-items: center;
    height: 52px;
    padding: 0 28px;
    border: 1px solid #5a5a5a;
    border-radius: 50px;
    color: #fff;
    font-weight: 500;
    font-size: 16px;
}

.voll-footer .vf-btn-outline:hover {
    border-color: #fff;
    color: #fff;
}

.vf-cta-contact {
    text-align: right;
    flex: 0 0 auto;
}

.voll-footer .vf-phone {
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
    font-size: 44px;
    line-height: 1.1;
    color: #fff;
    white-space: nowrap;
}

.vf-addr {
    font-size: 15px;
    line-height: 1.5;
    color: var(--vf-muted);
    margin-top: 10px !important;
}

/* Logo, socials, Google Partner and the link groups */
.vf-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 4fr);
    gap: 32px;
    padding: 56px 0;
    border-top: 1px solid var(--vf-line);
}

.vf-brand {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
}

.vf-logo img {
    display: block;
    width: 155px;
    height: auto;
    filter: invert(1);
}

.vf-tagline {
    font-size: 15px;
    line-height: 1.5;
    color: var(--vf-muted);
    max-width: 260px;
}

.vf-socials {
    display: flex;
    gap: 8px;
    margin-top: 6px;
}

.voll-footer .vf-socials a {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #5a5a5a;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}

.voll-footer .vf-socials a:hover {
    border-color: #ed1f3d;
    background: #ed1f3d;
    color: #fff;
}

.vf-be {
    font-weight: 700;
    font-size: 13px;
    line-height: 1;
}

.vf-partner {
    color: #fff;
    line-height: 0;
}

.vf-partner svg {
    max-width: 100%;
    height: auto;
}

.vf-nav {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 32px;
}

.voll-footer .vf-group-title {
    display: block;
    width: 100%;
    background: none;
    border: 0;
    padding: 0;
    margin: 0 0 18px;
    text-align: left;
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
    font-size: 18px;
    line-height: 1.3;
    color: #fff;
    cursor: default;
}

.vf-plus {
    display: none;
}

.vf-links {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.vf-links li {
    margin: 0;
    font-size: 16px;
    line-height: 1.35;
}

/* Legal line */
.vf-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 32px;
    padding-top: 24px;
    border-top: 1px solid var(--vf-line);
    font-size: 14px;
    color: var(--vf-muted);
}

.vf-legal {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 28px;
}

.voll-footer .vf-legal a {
    color: var(--vf-muted);
}

.voll-footer .vf-legal a:hover {
    color: #fff;
}

@media (max-width: 1280px) {
    .vf-cta-title {
        font-size: 44px;
    }

    .voll-footer .vf-phone {
        font-size: 36px;
    }
}

/* Up to 1200px the logo block moves above the link groups, in one row */
@media (max-width: 1200px) {
    .vf-main {
        grid-template-columns: minmax(0, 1fr);
        gap: 40px;
    }

    .vf-brand {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 20px 24px;
    }

    .vf-tagline {
        max-width: 220px;
    }

    .vf-socials {
        margin-top: 0;
    }
}

@media (max-width: 992px) {
    footer.voll-footer {
        padding: 64px 0 28px;
    }

    .vf-cta {
        flex-direction: column;
        align-items: flex-start;
        gap: 32px;
    }

    .vf-cta-contact {
        text-align: left;
    }

}

@media (max-width: 767px) {
    footer.voll-footer {
        padding: 48px 0 24px;
    }

    .vf-cta {
        padding-bottom: 40px;
    }

    .vf-cta-title {
        font-size: 32px;
        letter-spacing: -0.5px;
    }

    .vf-cta-text {
        font-size: 16px;
        margin-top: 14px !important;
    }

    .vf-cta-btns {
        flex-direction: column;
        gap: 12px;
        margin-top: 24px;
    }

    .voll-footer .vf-btn-red,
    .voll-footer .vf-btn-outline {
        width: 100%;
        justify-content: center;
        box-sizing: border-box;
    }

    .vf-cta-contact {
        width: 100%;
    }

    .voll-footer .vf-phone {
        font-size: 30px;
    }

    .vf-main {
        padding: 40px 0 24px;
        gap: 32px;
    }

    .vf-brand {
        flex-direction: column;
        align-items: flex-start;
        gap: 18px;
    }

    .vf-nav {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
        border-top: 1px solid var(--vf-line);
    }

    .vf-group {
        border-bottom: 1px solid var(--vf-line);
    }

    .voll-footer button.vf-group-title {
        display: flex;
        justify-content: space-between;
        align-items: center;
        min-height: 56px;
        margin: 0;
        font-size: 17px;
        cursor: pointer;
    }

    .vf-plus {
        display: block;
        position: relative;
        width: 16px;
        height: 16px;
        flex: 0 0 16px;
    }

    .vf-plus::before,
    .vf-plus::after {
        content: '';
        position: absolute;
        background: currentColor;
        border-radius: 1px;
        transition: transform .2s, opacity .2s;
    }

    .vf-plus::before {
        left: 0;
        top: 7px;
        width: 16px;
        height: 2px;
    }

    .vf-plus::after {
        left: 7px;
        top: 0;
        width: 2px;
        height: 16px;
    }

    .vf-group.is-open .vf-plus {
        color: #ed1f3d;
    }

    .vf-group.is-open .vf-plus::after {
        transform: rotate(90deg);
        opacity: 0;
    }

    .vf-group .vf-links {
        display: none;
        gap: 0;
        padding-bottom: 12px;
    }

    .vf-group.is-open .vf-links {
        display: flex;
    }

    .vf-links li a {
        display: block;
        padding: 10px 0;
    }

    /* Company: always open, links as a wrapped row */
    .vf-group-plain {
        border-bottom: 0;
        padding-top: 24px;
    }

    .voll-footer p.vf-group-title {
        margin-bottom: 8px;
        font-size: 17px;
    }

    .vf-group-plain .vf-links {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 0 24px;
    }

    .vf-bottom {
        flex-direction: column-reverse;
        align-items: flex-start;
        gap: 8px;
    }

    .vf-legal {
        gap: 0 20px;
    }

    .vf-legal a {
        display: inline-block;
        padding: 8px 0;
    }
}

/* Service page hero on phones: the second (pricing) button gets a light outline, the red button stays the main one (2026-10-31) */
@media (max-width: 767px) {
    .page_new_side .services_link_price {
        border-color: #d9d9d9;
    }

    [data-theme="dark"] .page_new_side .services_link_price {
        border-color: #4a4a4a;
    }
}

/* ===== Mobile menu, new design (2026-10-31), markup: template-parts/mobile-menu.php =====
   The panel keeps the old open/close mechanics (.mobile_menu, fixed under the header, slides in with .show-menu). */
@media (max-width: 992px) {
    .mobile_menu.vm {
        --vm-line: rgba(127, 127, 127, .2);
        --vm-soft: rgba(127, 127, 127, .12);
        --vm-muted: #6b6b6b;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        padding: 0;
        overflow: hidden;
        border-top: 1px solid var(--vm-line);
        font-family: "Inter", sans-serif;
        color: var(--text-color);
    }

    [data-theme="dark"] .mobile_menu.vm {
        --vm-muted: #b8b8b8;
    }

    .mobile_menu.vm a {
        color: var(--text-color);
        text-decoration: none;
    }

    .mobile_menu.vm p {
        margin: 0;
    }

    .vm-scroll {
        flex: 1;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding: 12px 24px 28px;
    }

    .vm-view[hidden] {
        display: none;
    }

    .vm-label {
        font-size: 13px;
        font-weight: 600;
        letter-spacing: .4px;
        text-transform: uppercase;
        color: var(--vm-muted);
        margin-bottom: 6px !important;
    }

    .vm-services,
    .vm-items,
    .vm-sub {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .vm-row {
        display: flex;
        align-items: center;
        gap: 12px;
        min-height: 60px;
        border-bottom: 1px solid var(--vm-line);
    }

    .mobile_menu.vm .vm-row>a {
        flex: 1;
        padding: 14px 0;
        font-weight: 600;
        font-size: 19px;
        line-height: 1.25;
    }

    .vm-open {
        width: 44px;
        height: 44px;
        flex: 0 0 44px;
        border-radius: 50%;
        border: 0;
        padding: 0;
        background: var(--vm-soft);
        color: var(--text-color);
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
    }

    .vm-open .vm-chev {
        width: 18px;
        height: 18px;
    }

    /* Portfolio card on light grey */
    /* No line under the last service; the card sits the same distance from the last service and from the links below */
    .vm-services .vm-row:last-child {
        border-bottom: 0;
    }

    .mobile_menu.vm .vm-portfolio {
        margin-top: 4px;
        min-height: 76px;
        border-radius: 16px;
        background: var(--backgound-grey);
        border: 1px solid var(--vm-line);
        display: flex;
        align-items: center;
        gap: 14px;
        padding: 12px 14px 12px 18px;
    }

    .vm-portfolio-text {
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .vm-portfolio-title {
        font-family: "Montserrat", sans-serif;
        font-weight: 700;
        font-size: 20px;
    }

    .vm-portfolio-sub {
        font-size: 14px;
        color: var(--vm-muted);
    }

    .vm-portfolio-arrow {
        width: 44px;
        height: 44px;
        flex: 0 0 44px;
        border-radius: 50%;
        background: #ed1f3d;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .vm-links {
        display: flex;
        justify-content: space-between;
        gap: 12px;
        margin-top: 10px;
    }

    .mobile_menu.vm .vm-links a {
        font-size: 17px;
        font-weight: 500;
        padding: 12px 0;
    }

    .vm-contacts {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 14px;
        margin-top: 18px;
        padding-top: 22px;
        border-top: 1px solid var(--vm-line);
    }

    .mobile_menu.vm .vm-mail {
        font-size: 16px;
        padding: 4px 0;
        opacity: .85;
    }

    .vm-socials {
        display: flex;
        gap: 8px;
    }

    .mobile_menu.vm .vm-socials a {
        width: 44px;
        height: 44px;
        border-radius: 50%;
        border: 1px solid #d9d9d9;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    [data-theme="dark"] .mobile_menu.vm .vm-socials a {
        border-color: #4a4a4a;
    }

    .vm-be {
        font-weight: 700;
        font-size: 13px;
        line-height: 1;
    }

    /* Service panel */
    .vm-back {
        display: flex;
        align-items: center;
        gap: 8px;
        min-height: 44px;
        background: none;
        border: 0;
        padding: 0;
        font: inherit;
        font-size: 15px;
        font-weight: 500;
        color: var(--vm-muted);
        cursor: pointer;
    }

    .vm-title {
        font-family: "Montserrat", sans-serif;
        font-weight: 700;
        font-size: 26px;
        line-height: 1.2;
        margin: 6px 0 10px !important;
    }

    .mobile_menu.vm .vm-link {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        min-height: 50px;
        font-size: 17px;
        line-height: 1.3;
        padding: 6px 0;
        border-bottom: 1px solid var(--vm-line);
    }

    .vm-link .vm-chev {
        flex: 0 0 16px;
        color: #9a9a9a;
    }

    .mobile_menu.vm .vm-group-link {
        margin-top: 14px;
        font-weight: 600;
    }

    .vm-group-label {
        font-size: 12px;
        font-weight: 600;
        letter-spacing: .5px;
        text-transform: uppercase;
        color: var(--vm-muted);
        margin: 22px 0 2px !important;
    }

    .vm-sub {
        padding-left: 14px;
        margin-left: 2px;
        border-left: 2px solid var(--vm-line);
    }

    .mobile_menu.vm .vm-sub .vm-link {
        min-height: 46px;
        font-size: 16px;
    }

    /* Action bar fixed at the bottom of the menu */
    .vm-bar {
        flex: 0 0 auto;
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 12px 24px calc(16px + env(safe-area-inset-bottom));
        border-top: 1px solid var(--vm-line);
        background: var(--background-color);
    }

    .vm-bar .vm-cta {
        flex: 1;
        height: 52px;
        padding: 0 16px;
        margin: 0;
        border: 0;
        border-radius: 50px;
        background: #ed1f3d;
        color: #fff;
        font-family: "Inter", sans-serif;
        font-weight: 600;
        font-size: 16px;
        cursor: pointer;
    }

    .mobile_menu.vm .vm-round {
        width: 52px;
        height: 52px;
        flex: 0 0 52px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
    }

    .mobile_menu.vm .vm-call {
        background: var(--text-color);
        color: var(--background-color);
    }

    .mobile_menu.vm .vm-wa {
        border: 1.5px solid var(--text-color);
        color: var(--text-color);
    }
}

/* While the mobile menu is open, floating buttons (theme switch, WhatsApp, cookie settings) would cover its action bar */
@media (max-width: 992px) {

    body:has(.mobile_menu.vm.show-menu) .theme_widget,
    body:has(.mobile_menu.vm.show-menu) .watsapp_btn,
    body:has(.mobile_menu.vm.show-menu) #CookiebotWidget,
    body:has(.mobile_menu.vm.show-menu) .cky-btn-revisit-wrapper,
    body:has(.mobile_menu.vm.show-menu) #cmplz-manage-consent {
        display: none !important;
    }
}


/* ===== Mega menu 2026-11-01 =====
   Desktop header menu built by voll_mega_menu_render() (inc/mega-menu.php) from the menu "Header New".
   Canvas "VOLL desktop menu" v5. Off switch: Settings > General > Header menu. Below 993px the burger and the mobile menu take over. */
.header_wrapper {
    position: relative;
}

.vmm {
    --vmm-line: rgba(127, 127, 127, .22);
    --vmm-hover: rgba(127, 127, 127, .12);
    --vmm-muted: #6B6B6B;
    --vmm-text2: #4A4A4A;
}

[data-theme="dark"] .vmm {
    --vmm-muted: #A8A8A8;
    --vmm-text2: #C9C9C9;
}

.vmm-bar {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 36px;
    margin: 0;
    padding: 0;
}

.vmm-top {
    display: flex;
    align-items: center;
}

.vmm-top-link {
    display: inline-flex;
    align-items: center;
    height: 44px;
    font-size: 18px;
    font-weight: 380;
    color: var(--text-color);
    text-decoration: none;
    white-space: nowrap;
    border-bottom: 2px solid transparent;
    transition: border-color .15s ease, color .15s ease;
}

.vmm-top-link:hover,
.vmm-top-link:focus-visible {
    color: var(--text-color);
    text-decoration: none;
    border-bottom-color: var(--text-color);
}

.vmm-top.is-current>.vmm-top-link,
.vmm-top.is-open>.vmm-top-link {
    border-bottom-color: var(--accent-color);
}

/* Toggle for keyboard users: visible only when focused */
.vmm-toggle {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    border: 0;
    padding: 0;
    background: transparent;
    color: var(--text-color);
}

.vmm-toggle:focus-visible {
    position: static;
    width: 24px;
    height: 24px;
    clip: auto;
    margin-left: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    outline: 2px solid var(--accent-color);
    border-radius: 6px;
}

.vmm-toggle svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
}

.vmm-panel {
    /* Full width of the header. The script sets --vmm-top (just under the section link) and the tab
       over the link: --vmm-tab-x, --vmm-tab-w, --vmm-tab-h */
    position: absolute;
    left: 0;
    right: 0;
    top: var(--vmm-top, 100%);
    background: var(--background-color);
    border: 1px solid var(--vmm-line);
    border-radius: 16px;
    box-shadow: 0 12px 32px rgba(27, 27, 27, .08);
    z-index: 600;
    opacity: 0;
    visibility: hidden;
    translate: 0 -8px;
    transition: opacity .2s ease, translate .2s ease, visibility .2s;
}

/* Tab behind the open section link: joins the link to the panel (also the hover bridge) */
.vmm-panel::before {
    content: '';
    position: absolute;
    left: var(--vmm-tab-x, 0px);
    top: calc(-1px - var(--vmm-tab-h, 0px));
    width: var(--vmm-tab-w, 0px);
    height: calc(var(--vmm-tab-h, 0px) + 2px);
    background: var(--background-color);
    border-radius: 14px 14px 0 0;
}

/* Rounded inner corners where the tab meets the panel */
.vmm-panel::after {
    content: '';
    position: absolute;
    left: calc(var(--vmm-tab-x, 0px) - 12px);
    top: -12px;
    width: calc(var(--vmm-tab-w, 0px) + 24px);
    height: 12px;
    background:
        radial-gradient(circle at 0 0, transparent 11.5px, var(--background-color) 12px) left bottom / 12px 12px no-repeat,
        radial-gradient(circle at 100% 0, transparent 11.5px, var(--background-color) 12px) right bottom / 12px 12px no-repeat;
}

/* The open section link sits on the tab, above the dimmed page */
.vmm-top.is-open>.vmm-top-link {
    position: relative;
    z-index: 601;
}

.vmm-top.is-open>.vmm-panel,
.vmm:not(.js) .vmm-top:hover>.vmm-panel,
.vmm-top:focus-within>.vmm-panel {
    opacity: 1;
    visibility: visible;
    translate: 0 0;
}

.header_wrapper:has(.vmm-top.is-open) .overlay_menu {
    opacity: .4;
}

.vmm-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 32px;
    border-bottom: 1px solid var(--vmm-line);
}

.vmm-head-title {
    font-family: "Montserrat", sans-serif;
    font-size: 22px;
    line-height: 28px;
    font-weight: 700;
    color: var(--text-color);
    text-decoration: none;
}

.vmm-all {
    font-size: 15px;
    font-weight: 600;
    color: var(--text-color);
    text-decoration: none;
    white-space: nowrap;
}

.vmm-head-title:hover,
.vmm-all:hover,
.vmm-more:hover,
.vmm-group-title a:hover,
.vmm-card-title:hover {
    color: var(--accent-color);
    text-decoration: none;
}

.vmm-all-arr,
.vmm-more-arr {
    color: var(--accent-color);
}

.vmm-body {
    display: grid;
    grid-template-columns: repeat(var(--vmm-cols, 3), minmax(0, 1fr)) 300px;
    gap: 24px 40px;
    padding: 28px 32px;
    align-items: start;
    max-height: calc(100vh - 220px);
    overflow-y: auto;
}

.vmm-body.no-card {
    grid-template-columns: repeat(var(--vmm-cols, 3), minmax(0, 1fr));
}

.vmm-group {
    min-width: 0;
}

.vmm-group-title {
    margin: 0 0 8px;
    font-size: 13px;
    line-height: 18px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--text-color);
    opacity: .5;
    /* as the section subtitles on the site (.our_works_subtitle) */
}

.vmm-group-title a {
    color: inherit;
    text-decoration: none;
}

.vmm-list,
.vmm-sub {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

.vmm-list>li,
.vmm-sub>li {
    max-width: 100%;
}

.vmm-item {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    max-width: calc(100% + 12px);
    margin-left: -12px;
    padding: 7px 12px;
    border-radius: 10px;
    font-size: 16px;
    line-height: 22px;
    font-weight: 400;
    color: var(--text-color);
    text-decoration: none;
    transition: background-color .15s ease;
}

.vmm-item:hover,
.vmm-item:focus-visible {
    background: var(--vmm-hover);
    color: var(--text-color);
    text-decoration: none;
}

.vmm-item.is-primary {
    font-weight: 600;
}

.vmm-arr {
    flex: none;
    color: var(--accent-color);
    font-weight: 600;
    opacity: 0;
    translate: -4px 0;
    transition: opacity .15s ease, translate .15s ease;
}

.vmm-item:hover .vmm-arr,
.vmm-item:focus-visible .vmm-arr {
    opacity: 1;
    translate: 0 0;
}

.vmm-more {
    display: inline-block;
    margin-top: 8px;
    font-size: 15px;
    line-height: 24px;
    font-weight: 600;
    color: var(--text-color);
    text-decoration: none;
}

.vmm-exp {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.vmm-exp-row {
    display: flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
}

.vmm-plus {
    flex: none;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid var(--vmm-line);
    border-radius: 8px;
    background: transparent;
    color: var(--text-color);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: border-color .15s ease, color .15s ease;
}

.vmm-plus:hover,
.vmm-plus:focus-visible {
    border-color: var(--accent-color);
    color: var(--accent-color);
}

.vmm-plus svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
}

.vmm-plus .vmm-i-minus,
.vmm-plus[aria-expanded="true"] .vmm-i-plus {
    display: none;
}

.vmm-plus[aria-expanded="true"] .vmm-i-minus {
    display: block;
}

.vmm-sub {
    margin: 2px 0 8px 12px;
    padding-left: 8px;
    border-left: 2px solid var(--vmm-line);
}

/* Closed "+" list: zero height but keeps its width, so the column and the card stay in place when it opens.
   !important - Bootstrap hides [hidden] with display: none !important */
.vmm .vmm-sub[hidden] {
    display: flex !important;
    height: 0;
    margin-top: 0;
    margin-bottom: 0;
    overflow: hidden;
    visibility: hidden;
}

.vmm-item-sub {
    max-width: 100%;
    margin-left: 0;
    padding: 6px 12px;
    font-size: 15px;
    line-height: 21px;
}

.vmm-card {
    align-self: start;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 32px 28px;
    background: var(--backgound-grey);
    border: 1px solid var(--vmm-line);
    border-radius: 16px;
}

.vmm-card-title {
    margin: 0;
    font-family: "Montserrat", sans-serif;
    font-size: 21px;
    line-height: 27px;
    font-weight: 700;
    color: var(--text-color);
    text-decoration: none;
}

.vmm-card-text {
    margin: 0;
    font-size: 15px;
    line-height: 23px;
    color: var(--vmm-text2);
}

/* Red pill with a white arrow circle, one width in every card (also used on /site-map) */
.vmm-cta {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    box-sizing: border-box;
    height: 52px;
    margin-top: 16px;
    padding: 0 16px 0 5px;
    border: 0;
    border-radius: 26px;
    background: var(--button-red-bg);
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    white-space: nowrap;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .2s ease;
}

.vmm-cta:hover,
.vmm-cta:focus-visible {
    background: #d4163a;
    color: #fff;
    text-decoration: none;
}

.vmm-cta-ico {
    flex: none;
    width: 56px;
    height: 42px;
    border-radius: 21px;
    background: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.vmm-cta-ico svg {
    fill: none;
    stroke: #1B1B1B;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.vmm-cta-txt {
    flex: 1;
    text-align: center;
    padding-right: 28px;
}

.vmm a:focus-visible,
.vmm button:focus-visible {
    outline: 2px solid var(--accent-color);
    outline-offset: 2px;
}

@media (max-width: 1700px) {
    .vmm-bar {
        gap: 30px;
    }

    .vmm-top-link {
        font-size: 16px;
    }
}

@media (max-width: 1280px) {
    .vmm-bar {
        gap: 22px;
    }

    .vmm-top-link {
        font-size: 15px;
    }

    .vmm-body {
        grid-template-columns: repeat(var(--vmm-cols, 3), minmax(0, 1fr));
        gap: 24px;
    }

    .vmm-card {
        grid-column: 1 / -1;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        padding: 20px 24px;
    }

    .vmm-card-text {
        flex: 1 1 260px;
    }

    .vmm-cta {
        width: 260px;
        margin-top: 0;
    }
}

@media (min-width: 1281px) and (max-width: 1799px) {

    /* Laptop scale (zoom .8): header as on large screens, viewport units divided by the zoom */
    .vmm-bar {
        gap: 36px;
    }

    .vmm-top-link {
        font-size: 18px;
    }

    .vmm-body {
        max-height: calc(100vh / var(--laptop-zoom) - 220px);
    }
}

@media (max-width: 992px) {
    .vmm {
        display: none;
    }
}

/* Mobile menu: sub-pages (level 4) under a page */
.vm-sub-2 {
    padding-left: 16px;
}

/* ===== HTML sitemap 2026-11-01 (page-sitemap.php, /site-map) ===== */
.vsm {
    --vsm-line: rgba(127, 127, 127, .22);
    --vsm-muted: #6B6B6B;
    --vsm-text2: #4A4A4A;
    padding: 40px 0 100px;
}

[data-theme="dark"] .vsm {
    --vsm-muted: #A8A8A8;
    --vsm-text2: #C9C9C9;
}

.vsm-crumbs {
    font-size: 14px;
    line-height: 20px;
    color: var(--text-color);
}

.vsm-crumbs a {
    color: var(--vsm-muted);
    text-decoration: none;
}

.vsm-crumbs a:hover {
    color: var(--accent-color);
}

.vsm-crumbs span[aria-hidden] {
    color: var(--vsm-line);
    margin: 0 4px;
}

.vsm-h1 {
    margin: 16px 0 16px;
    font-family: "Montserrat", sans-serif;
    font-size: 48px;
    line-height: 56px;
    font-weight: 700;
    color: var(--text-color);
}

.vsm-intro {
    margin: 0 0 20px;
    max-width: 760px;
    font-size: 18px;
    line-height: 28px;
    color: var(--vsm-text2);
}

.vsm-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 56px;
}

.vsm-chips a {
    display: inline-flex;
    align-items: center;
    height: 40px;
    padding: 0 16px;
    border: 1px solid var(--vsm-line);
    border-radius: 20px;
    color: var(--text-color);
    text-decoration: none;
    font-size: 15px;
}

.vsm-chips a:hover {
    color: var(--accent-color);
    border-color: var(--accent-color);
}

html:has(.vsm) {
    scroll-behavior: smooth;
}

.vsm-section,
.vsm-card[id] {
    scroll-margin-top: 140px;
}

.vsm-section {
    margin-bottom: 56px;
}

.vsm-section-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 12px;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--vsm-line);
}

.vsm-section-head h2 {
    margin: 0;
    font-family: "Montserrat", sans-serif;
    font-size: 30px;
    line-height: 36px;
    font-weight: 700;
    color: var(--text-color);
}

.vsm-hub {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-color);
    text-decoration: none;
}

.vsm-hub span {
    color: var(--accent-color);
}

.vsm-hub:hover {
    color: var(--accent-color);
}

.vsm-grid {
    display: grid;
    grid-template-columns: repeat(var(--vsm-cols, 3), minmax(0, 1fr));
    gap: 20px;
    align-items: stretch;
    /* cards in a row get the height of the tallest one */
}

.vsm-card {
    min-width: 0;
    padding: 24px;
    background: var(--backgound-grey);
    border: 1px solid var(--vsm-line);
    border-radius: 16px;
}

.vsm-grid.is-wide .vsm-list {
    column-count: 3;
    column-gap: 32px;
}

.vsm-card-title {
    margin: 0 0 10px;
    font-family: "Inter", sans-serif;
    font-size: 13px;
    line-height: 18px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--vsm-muted);
}

.vsm-list,
.vsm-sub {
    list-style: none;
    margin: 0;
    padding: 0;
}

.vsm-list li {
    break-inside: avoid;
}

.vsm-list a {
    display: inline-block;
    font-size: 15px;
    line-height: 22px;
    padding: 3px 0;
    color: var(--text-color);
    text-decoration: none;
}

.vsm-list a.is-primary {
    font-weight: 600;
}

.vsm-list a:hover {
    color: var(--accent-color);
}

.vsm-sub {
    margin: 2px 0 6px 4px;
    padding-left: 14px;
    border-left: 2px solid var(--vsm-line);
}

.vsm-cta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 32px 36px;
    background: var(--backgound-grey);
    border: 1px solid var(--vsm-line);
    border-radius: 16px;
}

.vsm-cta-title {
    margin: 0 0 6px;
    font-family: "Montserrat", sans-serif;
    font-size: 24px;
    line-height: 30px;
    font-weight: 700;
    color: var(--text-color);
}

.vsm-cta-text {
    margin: 0;
    font-size: 16px;
    line-height: 25px;
    color: var(--vsm-text2);
}

.vsm-cta .vsm-cta-btn {
    width: 280px;
    margin-top: 0;
}

@media (max-width: 1024px) {
    .vsm-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .vsm-grid.is-wide .vsm-list {
        column-count: 2;
    }
}

@media (max-width: 640px) {
    .vsm-h1 {
        font-size: 34px;
        line-height: 40px;
    }

    .vsm-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .vsm-grid.is-wide .vsm-list {
        column-count: 1;
    }

    .vsm-section-head h2 {
        font-size: 26px;
        line-height: 32px;
    }

    .vsm-cta .vsm-cta-btn {
        width: 100%;
    }
}

/* ===== Section hubs 2026-11-01 =====
   Blocks for /design, /dev, /seo, /ppc, /smm (page-flex-new.php + inc/hub-blocks.php): hero badge, flat hero
   illustration, cards grid (cards_grid), areas map (areas_map), Image - Text with an image by path. */
.hub_badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 16px 8px 10px;
    border-radius: 100px;
    background: var(--backgound-grey);
    color: var(--text-color);
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 24px;
}

.hub_badge_dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ED1F3D;
    box-shadow: 0 0 0 5px rgba(237, 31, 61, 0.15);
    flex-shrink: 0;
}

.hub_hero_link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 500;
    color: var(--text-color);
    text-decoration: none;
    align-self: center;
}

.hub_hero_link:hover {
    color: #ED1F3D;
}

.page_new_hub .page_new_top_wrapper {
    height: auto !important;
    gap: 48px;
    padding-top: 40px;
}

.page_new_hub .page_new_side {
    flex: 1 1 50%;
    min-width: 0;
}

.hub_hero_vis {
    display: flex;
    justify-content: center;
}

.hub_hero_vis img {
    width: 100%;
    max-width: 600px;
    height: auto;
    display: block;
}

.img_txt_block_hub .img_txt_block_side img {
    height: auto;
    border-radius: 20px;
}

/* Section header */
.hub_cg {
    margin: 100px 0;
}

.hub_cg_bg_gray {
    margin: 0;
    padding: 110px 0;
    background: var(--backgound-grey);
}

.hub_cg_header {
    margin-bottom: 56px;
}

.hub_h2.new_temp_title {
    margin-bottom: 0;
}

.hub_cg_head_split .hub_cg_header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px 48px;
}

.hub_cg_head_split .hub_h2 {
    max-width: 720px;
}

.hub_cg_head_split .hub_lead {
    max-width: 520px;
}

.hub_cg_head_center .hub_cg_header {
    text-align: center;
}

.hub_cg_head_center .hub_lead {
    max-width: 760px;
    margin: 20px auto 0;
}

.hub_lead p:last-child {
    margin-bottom: 0;
}

.hub_cg_head_side .hub_cg_wrap {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 64px;
    align-items: start;
}

.hub_cg_head_side .hub_cg_header {
    margin-bottom: 0;
}

.hub_cg_head_side .hub_lead {
    margin-top: 28px;
}

.hub_eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 10px 18px 10px 10px;
    border-radius: 100px;
    background: var(--background-color);
    border: 1px solid #e2e2e2;
    color: var(--text-color);
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 28px;
}

.hub_eyebrow_ic {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #1B1B1B;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Cards */
.hub_cards {
    display: grid;
    gap: 20px;
    align-items: stretch;
}

.hub_cards_1 {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
}

.hub_cards_2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.hub_cards_3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.hub_cards_4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.hub_card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 32px 30px;
    border-radius: 20px;
    background: var(--backgound-grey);
    color: var(--text-color);
    text-decoration: none;
    transition: background 0.3s;
}

.hub_card_white {
    background: var(--background-color);
}

.hub_card_dark {
    background: #1B1B1B;
    color: #ffffff;
}

.hub_card_outline {
    background: transparent;
    border: 1.5px dashed #c4c4c4;
}

a.hub_card:hover {
    color: var(--text-color);
    background: var(--backgound-grey-hover);
}

a.hub_card_dark:hover {
    color: #ffffff;
    background: #000000;
}

a.hub_card:focus-visible {
    outline: 2px solid #ED1F3D;
    outline-offset: 3px;
}

.hub_cards_1 .hub_card {
    flex-direction: row;
    align-items: flex-start;
    gap: 20px;
    padding: 30px 32px;
}

.hub_card_top {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.hub_card_ic {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: var(--background-color);
    color: var(--text-color);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.hub_card_white .hub_card_ic {
    background: var(--backgound-grey);
}

.hub_card_dark .hub_card_ic {
    background: #ED1F3D;
    color: #ffffff;
}

.hub_card_arr {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--background-color);
    color: #ED1F3D;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s, transform 0.2s, color 0.2s;
}

a.hub_card:hover .hub_card_arr {
    background: #ED1F3D;
    color: #ffffff;
    transform: translateX(3px);
}

.hub_card_img {
    border-radius: 16px;
    overflow: hidden;
    background: var(--background-color);
}

.hub_card_img img {
    width: 100%;
    height: auto;
    display: block;
}

.hub_card_num {
    display: flex;
    align-items: center;
    gap: 14px;
}

.hub_card_num span {
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
    font-size: 15px;
    color: #ED1F3D;
}

.hub_card_num:after {
    content: "";
    height: 1px;
    flex: 1;
    background: #e2e2e2;
}

.hub_card_body {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.hub_card_title {
    font-family: "Montserrat", sans-serif;
    font-weight: 600;
    font-size: 21px;
    line-height: 135%;
    margin: 0;
    color: inherit;
}

.hub_card_text {
    font-weight: 300;
    font-size: 16px;
    line-height: 155%;
}

.hub_card_dark .hub_card_text {
    color: #e8e8e8;
}

.hub_card_text p {
    margin: 0 0 12px;
}

.hub_card_text p:last-child {
    margin-bottom: 0;
}

.hub_card_text a {
    color: #007BFF;
    text-decoration: none;
}

.hub_card_text a:hover {
    color: #f5001d;
}

/* Link lists inside cards */
.hub_card_text ul.hub_links {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.hub_card_text ul.hub_links+p,
.hub_card_text p+ul.hub_links {
    margin-top: 14px;
}

.hub_card_text .hub_links li {
    margin: 0;
    padding: 0;
}

.hub_card_text .hub_links a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    margin-left: -12px;
    border-radius: 10px;
    color: inherit;
    font-weight: 400;
    font-size: 16px;
    transition: background 0.2s;
}

.hub_card_text .hub_links a:after {
    content: "\2192";
    color: #ED1F3D;
    opacity: 0;
    transform: translateX(-4px);
    transition: opacity 0.2s, transform 0.2s;
}

.hub_card_text .hub_links a:hover {
    background: var(--background-color);
    color: inherit;
}

.hub_card_dark .hub_card_text .hub_links a:hover {
    background: #2c2c2c;
}

.hub_card_text .hub_links a:hover:after {
    opacity: 1;
    transform: none;
}

.hub_card_text .hub_links li.primary a {
    font-weight: 600;
}

.hub_card_text .hub_links li.plain {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    font-size: 16px;
    opacity: 0.75;
}

.hub_card_text .hub_links li.plain:before {
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #b8b8b8;
    flex-shrink: 0;
}

.hub_cg_bottom {
    max-width: 900px;
    margin: 48px auto 0;
    text-align: center;
}

.hub_cg_bottom p:last-child {
    margin-bottom: 0;
}

/* Landing Page Design Services: card images 200 px high, as in Figma (images of different widths) */
#key-components .hub_card_img img,
#best-practice-tips .hub_card_img img {
    height: 200px;
    object-fit: cover;
}

.hub_cg_bottom_img {
    margin-top: 20px;
}

.hub_cg_bottom_img img {
    width: 100%;
    height: auto;
    display: block;
}

/* Dark band */
.hub_band {
    border-radius: 24px;
    background: #1B1B1B;
    color: #ffffff;
    padding: 56px;
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    align-items: center;
    justify-content: space-between;
}

.hub_band_txt {
    flex: 1 1 520px;
    min-width: 0;
}

.hub_band .hub_h2.new_temp_title {
    color: #ffffff;
    font-size: 44px;
    margin-bottom: 22px;
}

.hub_band .hub_lead,
.hub_band .hub_lead p {
    color: #e8e8e8;
}

.hub_band_chips {
    flex: 0 1 380px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.hub_band_label {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #b8b8b8;
}

.hub_band_row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 6px;
}

.hub_band_chip {
    padding: 9px 16px;
    border-radius: 100px;
    background: #2c2c2c;
    font-size: 14px;
    font-weight: 500;
}

.hub_band_chip_hl {
    background: #ED1F3D;
    font-weight: 600;
}

/* Areas map */
.hub_areas {
    margin: 110px 0;
}

.hub_areas_grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 64px;
    align-items: center;
}

.hub_areas_text {
    margin-top: 32px;
}

.hub_chips {
    list-style: none;
    margin: 32px 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.hub_chip {
    padding: 10px 18px;
    border-radius: 100px;
    background: var(--backgound-grey);
    color: var(--text-color);
    font-size: 14px;
    font-weight: 500;
}

.hub_chip_base {
    background: #1B1B1B;
    color: #ffffff;
}

.hub_chip_dashed {
    background: transparent;
    border: 1px dashed #b8b8b8;
}

.hub_addr {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 32px;
    padding: 20px 24px;
    border-radius: 20px;
    border: 1px solid #e8e8e8;
    font-size: 15px;
    line-height: 145%;
}

.hub_addr_ic {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #ED1F3D;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.hub_addr_t {
    font-weight: 600;
}

.hub_addr_d {
    font-weight: 300;
}

.hub_map {
    position: relative;
    width: 100%;
    aspect-ratio: 560 / 620;
    border-radius: 24px;
    background: var(--backgound-grey);
    overflow: hidden;
    color: var(--text-color);
}

.hub_map_circle {
    position: absolute;
    aspect-ratio: 1;
    border-radius: 50%;
    background: rgba(237, 31, 61, 0.06);
    border: 1.5px dashed rgba(237, 31, 61, 0.45);
    box-sizing: border-box;
}

.hub_map_area {
    position: absolute;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.14em;
    color: #8a8a8a;
}

.hub_map_lines {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.hub_map_line {
    stroke: #ED1F3D;
    stroke-opacity: 0.45;
    stroke-width: 1;
}

.hub_map_line_minor {
    stroke: #9a9a9a;
    stroke-opacity: 0.6;
    stroke-width: 1;
    stroke-dasharray: 3 4;
}

.hub_town {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    font-size: 15px;
    font-weight: 600;
    transform: translate(-6px, -50%);
}

.hub_town_dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: currentColor;
    flex-shrink: 0;
}

.hub_town_left {
    flex-direction: row-reverse;
    transform: translate(calc(-100% + 6px), -50%);
}

.hub_town_below {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    transform: translate(-6px, -6px);
}

.hub_town_minor {
    font-size: 14px;
    font-weight: 500;
    color: #6b6b6b;
}

.hub_town_minor .hub_town_dot {
    width: 9px;
    height: 9px;
    background: #9a9a9a;
}

.hub_town_base {
    transform: translate(-9px, -50%);
}

.hub_town_base .hub_town_dot {
    width: 18px;
    height: 18px;
    background: #ED1F3D;
    box-shadow: 0 0 0 8px rgba(237, 31, 61, 0.16), 0 0 0 18px rgba(237, 31, 61, 0.07);
}

.hub_town_base .hub_town_name {
    margin-left: 4px;
    background: #1B1B1B;
    color: #ffffff;
    font-size: 13px;
    padding: 7px 12px;
    border-radius: 100px;
}

.hub_map_online {
    position: absolute;
    right: 20px;
    top: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border-radius: 100px;
    background: var(--background-color);
    font-size: 12px;
    font-weight: 500;
}

.hub_map_legend {
    position: absolute;
    left: 20px;
    top: 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 16px;
    border-radius: 14px;
    background: var(--background-color);
    font-size: 12px;
    font-weight: 500;
}

.hub_map_legend span {
    display: flex;
    align-items: center;
    gap: 8px;
}

.hub_map_legend i {
    display: inline-block;
    flex-shrink: 0;
}

.hub_lg_main {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: rgba(237, 31, 61, 0.12);
    border: 1.5px dashed rgba(237, 31, 61, 0.6);
    box-sizing: border-box;
}

.hub_lg_minor {
    width: 9px;
    height: 9px;
    margin: 0 2.5px;
    border-radius: 50%;
    background: #9a9a9a;
}

/* Areas map with a background map (2026-11-03): am_bg, tiers city / town / village, label "above".
   Sizes are in container units of the map (drawn at 560px wide), so every screen shows the same picture. */
.hub_map_bg_on {
    container-type: inline-size;
    background: #F4F4F2;
    color: #1B1B1B;
}

.hub_map_bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
}

.hub_map_bg_on .hub_town {
    gap: 1.429cqw;
    font-size: 2.500cqw;
    font-weight: 500;
    transform: translate(-1.071cqw, -50%);
}

.hub_map_bg_on .hub_town_name {
    text-shadow: 0 0 3px #fff, 0 0 3px #fff, 0 0 2px #fff;
}

.hub_map_bg_on .hub_town_dot {
    width: 1.429cqw;
    height: 1.429cqw;
    margin: 0 0.357cqw;
    background: #1B1B1B;
}

.hub_map_bg_on .hub_town_city {
    font-size: 2.857cqw;
    font-weight: 700;
}

.hub_map_bg_on .hub_town_city .hub_town_dot {
    width: 2.500cqw;
    height: 2.500cqw;
    margin: 0;
    background: #ffffff;
    border: 0.714cqw solid #1B1B1B;
    box-sizing: border-box;
}

.hub_map_bg_on .hub_town_village {
    font-size: 2.232cqw;
    color: #7a7a7a;
}

.hub_map_bg_on .hub_town_village .hub_town_dot {
    width: 1.071cqw;
    height: 1.071cqw;
    margin: 0 0.536cqw;
    background: #9a9a9a;
}

.hub_map_bg_on .hub_town_left {
    transform: translate(calc(-100% + 1.071cqw), -50%);
}

.hub_map_bg_on .hub_town_below {
    gap: 0.714cqw;
    transform: translate(-1.071cqw, -1.071cqw);
}

.hub_map_bg_on .hub_town_above {
    flex-direction: column-reverse;
    align-items: center;
    gap: 0.714cqw;
    transform: translate(-50%, calc(-100% + 1.071cqw));
}

.hub_map_bg_on .hub_town_base {
    transform: translate(-1.607cqw, -50%);
}

.hub_map_bg_on .hub_town_base .hub_town_dot {
    width: 3.214cqw;
    height: 3.214cqw;
    margin: 0;
    background: #ED1F3D;
    box-shadow: 0 0 0 1.429cqw rgba(237, 31, 61, 0.16), 0 0 0 3.214cqw rgba(237, 31, 61, 0.07);
}

.hub_map_bg_on .hub_town_base.hub_town_above {
    gap: 1.786cqw;
    transform: translate(-50%, calc(-100% + 1.607cqw));
}

.hub_map_bg_on .hub_town_base .hub_town_name {
    margin-left: 0;
    font-size: 2.143cqw;
    font-weight: 600;
    padding: 0.893cqw 1.786cqw;
    background: #1B1B1B;
    color: #ffffff;
    text-shadow: none;
}

.hub_map_bg_on .hub_map_legend,
.hub_map_bg_on .hub_map_online {
    background: #ffffff;
    color: #1B1B1B;
}

[data-theme="dark"] .hub_map_bg_on .hub_town_base .hub_town_name {
    background: #1B1B1B;
    color: #ffffff;
}

/* Dark theme */
[data-theme="dark"] .hub_card_dark {
    background: #000000;
}

[data-theme="dark"] .hub_card_outline,
[data-theme="dark"] .hub_addr,
[data-theme="dark"] .hub_eyebrow {
    border-color: #4a4a4a;
}

[data-theme="dark"] .hub_chip_base,
[data-theme="dark"] .hub_town_base .hub_town_name {
    background: #ffffff;
    color: #1B1B1B;
}

[data-theme="dark"] .hub_town_minor {
    color: #b8b8b8;
}

[data-theme="dark"] .hub_card_num:after {
    background: #4a4a4a;
}

@media (max-width: 1180px) {
    .hub_cards_4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991px) {
    .page_new_hub .page_new_top_wrapper {
        flex-direction: column;
        align-items: stretch;
        padding-top: 0;
    }

    .hub_hero_vis img {
        max-width: 480px;
    }

    .hub_cg {
        margin: 70px 0;
    }

    .hub_cg_bg_gray {
        margin: 0;
        padding: 70px 0;
    }

    .hub_cg_head_side .hub_cg_wrap,
    .hub_areas_grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 40px;
    }

    .hub_cards_3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hub_cg_header {
        margin-bottom: 36px;
    }

    .hub_band {
        padding: 40px 32px;
    }

    .hub_band .hub_h2.new_temp_title {
        font-size: 36px;
    }

    .hub_areas {
        margin: 70px 0;
    }
}

@media (max-width: 600px) {

    .hub_cards_2,
    .hub_cards_3,
    .hub_cards_4 {
        grid-template-columns: minmax(0, 1fr);
    }

    .hub_card {
        padding: 26px 22px;
    }

    .hub_cards_1 .hub_card {
        padding: 24px 22px;
        flex-direction: column;
    }

    .hub_band {
        padding: 32px 22px;
    }

    .hub_band .hub_h2.new_temp_title {
        font-size: 30px;
    }

    .hub_town {
        font-size: 12px;
        gap: 5px;
    }

    .hub_town_minor {
        font-size: 11px;
    }

    .hub_town_base .hub_town_name {
        font-size: 11px;
        padding: 5px 9px;
    }

    .hub_map_legend,
    .hub_map_online {
        font-size: 10px;
        padding: 7px 10px;
    }

    .hub_map_online {
        right: 12px;
        top: 12px;
    }

    .hub_map_legend {
        left: 12px;
        top: 12px;
    }
}

/* ===== Floating buttons 2026-11-01 =====
   Back to top (bottom left, shown after 60% of the page, up to 992px - after 40%; script in footer.php) and WhatsApp (bottom right).
   The footer keeps an empty band under its bottom row, so at the end of the page the buttons never cover the legal links;
   over the dark footer both buttons turn light (class voll-float-over-footer on <html>, light theme only).
   The CookieYes floating button is switched off in the CookieYes dashboard; "Cookie settings" in the footer opens it. */
footer.voll-footer {
    padding-bottom: 80px;
}

.voll-totop {
    position: fixed;
    left: 60px;
    bottom: 15px;
    z-index: 8000;
    width: 50px;
    height: 50px;
    border: 0;
    border-radius: 50%;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--button-black-bg);
    color: var(--button-text);
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s, background 0.3s, color 0.3s;
}

.voll-totop.is-visible {
    opacity: 1;
    visibility: visible;
}

.voll-totop:hover {
    background: #ED1F3D;
    color: #ffffff;
}

.voll-totop:focus-visible {
    outline: 2px solid #ED1F3D;
    outline-offset: 3px;
}

html.voll-float-over-footer:not([data-theme="dark"]) .watsapp_btn,
html.voll-float-over-footer:not([data-theme="dark"]) .voll-totop {
    background: #ffffff;
    color: #1B1B1B;
}

html.voll-float-over-footer:not([data-theme="dark"]) .watsapp_btn svg {
    filter: invert(1);
}

html.voll-float-over-footer .watsapp_btn:hover {
    background: #40B257;
    color: #ffffff;
}

html.voll-float-over-footer .watsapp_btn:hover svg {
    filter: none;
}

html.voll-float-over-footer .voll-totop:hover {
    background: #ED1F3D;
    color: #ffffff;
}

.voll-footer .vf-legal .vf-cookie-btn {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    color: var(--vf-muted);
    cursor: pointer;
}

.voll-footer .vf-legal .vf-cookie-btn:hover {
    color: #fff;
}

@media (max-width: 992px) {
    body:has(.mobile_menu.vm.show-menu) .voll-totop {
        display: none !important;
    }
}

@media (max-width: 600px) {
    footer.voll-footer {
        padding-bottom: 76px;
    }

    .voll-totop {
        left: 15px;
        width: 45px;
        height: 45px;
    }
}


/* ===== Contact widget 2026-11-02 =====
   Variant C of the Claude Design canvas "VOLL contact widget": round button bottom right (replaces .watsapp_btn),
   the icon cycles WhatsApp / Call / Email every 2.4 s; a click dims the page and opens the channels upwards.
   Markup and script - template-parts/contact-widget.php (included from header.php). */
.voll-contact__dim {
    position: fixed;
    inset: 0;
    z-index: 7990;
    background: rgba(27, 27, 27, 0.55);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0s linear 0.3s;
    cursor: pointer;
}

.voll-contact.is-open .voll-contact__dim {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.3s, visibility 0s;
}

.voll-contact__wrap {
    position: fixed;
    right: 60px;
    bottom: 12px;
    z-index: 8000;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 14px;
}

.voll-contact__list {
    list-style: none;
    margin: 0;
    padding: 0 2px 0 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 12px;
}

.voll-contact__item {
    margin: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px) scale(0.7);
    transform-origin: 100% 50%;
    transition: opacity 0.2s, transform 0.36s cubic-bezier(0.2, 0.9, 0.3, 1.35), visibility 0s linear 0.36s;
}

.voll-contact.is-open .voll-contact__item {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: opacity 0.2s, transform 0.36s cubic-bezier(0.2, 0.9, 0.3, 1.35), visibility 0s;
}

.voll-contact.is-open .voll-contact__item:nth-last-child(2) {
    transition-delay: 40ms;
}

.voll-contact.is-open .voll-contact__item:nth-last-child(3) {
    transition-delay: 80ms;
}

.voll-contact__link {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    color: #1B1B1B;
}

.voll-contact__link:hover {
    text-decoration: none;
    color: #1B1B1B;
}

.voll-contact__link:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 3px;
    border-radius: 30px;
}

.voll-contact__label {
    background: #ffffff;
    color: #1B1B1B;
    border-radius: 50px;
    padding: 9px 16px;
    font-family: "Inter", sans-serif;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
    transition: transform 0.2s;
}

.voll-contact__link:hover .voll-contact__label {
    transform: translateX(-4px);
}

.voll-contact__circle {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: none;
    color: #ffffff;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.22);
}

.voll-contact__circle.vc-wa {
    background: #25D366;
}

.voll-contact__circle.vc-call {
    background: #ED1F3D;
}

.voll-contact__circle.vc-mail {
    background: #1B1B1B;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.22), 0 0 0 1px rgba(255, 255, 255, 0.25);
}

.voll-contact__btn {
    position: relative;
    width: 56px;
    height: 56px;
    border: 0;
    border-radius: 50%;
    padding: 0;
    cursor: pointer;
    color: #ffffff;
    box-shadow: 0 10px 24px rgba(27, 27, 27, 0.28);
    transition: background 0.45s ease, transform 0.2s;
}

.voll-contact__btn:active {
    transform: scale(0.94);
}

.voll-contact__btn:focus {
    outline: none;
}

.voll-contact__btn:focus-visible {
    outline: 2px solid #ED1F3D;
    outline-offset: 3px;
}

.voll-contact__btn.c-wa {
    background: #25D366;
}

.voll-contact__btn.c-call {
    background: #ED1F3D;
}

.voll-contact__btn.c-mail {
    background: #1B1B1B;
}

.voll-contact__btn.c-x {
    background: #ffffff;
    color: #1B1B1B;
}

[data-theme="dark"] .voll-contact__btn.c-mail,
[data-theme="dark"] .voll-contact__circle.vc-mail,
html.voll-float-over-footer .voll-contact__btn.c-mail {
    background: #3A3A3A;
}

.voll-contact__ic {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transform: scale(0.3) rotate(-90deg);
    transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1.4), opacity 0.2s;
}

.voll-contact__ic.is-in {
    opacity: 1;
    transform: none;
    transition-delay: 0.12s;
}

.voll-contact__ic.is-out {
    opacity: 0;
    transform: scale(0.3) rotate(90deg);
}

.voll-contact__badge {
    position: absolute;
    top: -2px;
    right: -2px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #ED1F3D;
    border: 2px solid var(--background-color);
    animation: vollContactPop 2.4s ease-in-out infinite;
}

.voll-contact__btn.c-call .voll-contact__badge {
    background: #1B1B1B;
}

[data-theme="dark"] .voll-contact__btn.c-call .voll-contact__badge {
    background: #ffffff;
}

.voll-contact__btn.c-x .voll-contact__badge {
    display: none;
}

@keyframes vollContactPop {

    0%,
    70%,
    100% {
        transform: scale(1);
    }

    80% {
        transform: scale(1.35);
    }

    90% {
        transform: scale(0.9);
    }
}

@media (prefers-reduced-motion: reduce) {

    .voll-contact__ic,
    .voll-contact__item,
    .voll-contact__dim,
    .voll-contact__btn {
        transition: none;
    }

    .voll-contact__badge {
        animation: none;
    }
}

@media (max-width: 992px) {
    body:has(.mobile_menu.vm.show-menu) .voll-contact {
        display: none !important;
    }
}

@media (max-width: 600px) {
    .voll-contact__wrap {
        right: 15px;
        bottom: 12px;
    }

    .voll-contact__btn {
        width: 52px;
        height: 52px;
    }
}


/* ===== Thank you page 2026-11-02 =====
   Template page-thank-you.php (/thank-you), Claude Design canvas "VOLL thank-you page" v4.
   Light and dark theme through the site variables; the floating contact widget is not shown on this page (header.php). */
.vty {
    --vty-grey: #F9F9F9;
    --vty-chip: #F1F1F1;
    --vty-line: #EDEDED;
    --vty-muted: #5E5E5E;
    --vty-text2: #3D3D3D;
    --vty-white: #ffffff;
    --vty-green: #1FA855;
    color: var(--text-color);
    font-family: "Inter", sans-serif;
}

[data-theme="dark"] .vty {
    --vty-grey: #2c2c2c;
    --vty-chip: #3a3a3a;
    --vty-line: #3a3a3a;
    --vty-muted: #BDBDBD;
    --vty-text2: #D9D9D9;
    --vty-white: #1a1a1a;
}

.vty h1,
.vty h2,
.vty h3 {
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
    color: var(--text-color);
}

.vty-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 150px 0 56px;
    /* the site header is fixed: ~88px of the top padding sits under it */
}

.vty-hero-in {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 48px;
}

.vty-hero-text {
    flex: 1 1 520px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.vty-badge {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #E6F6EC;
    color: #137A3A;
    border-radius: 50px;
    padding: 6px 14px;
    font-size: 14px;
    font-weight: 600;
}

.vty-h1 {
    margin: 0;
}

.vty-h1-main {
    display: block;
    font-size: 64px;
    line-height: 1.05;
    letter-spacing: -1px;
}

.vty-h1-sub {
    display: block;
    margin-top: 10px;
    font-size: 30px;
    line-height: 1.25;
}

.vty-lead {
    margin: 0;
    max-width: 560px;
    font-size: 18px;
    line-height: 1.6;
    color: var(--vty-text2);
}

.vty-status {
    flex: 1 1 420px;
    min-width: 0;
    background: var(--vty-grey);
    border-radius: 24px;
    padding: 32px 32px 28px;
    box-sizing: border-box;
}

.vty-status-label {
    margin: 0 0 22px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--vty-muted);
}

.vty-steps {
    list-style: none;
    margin: 0;
    padding: 0;
}

.vty-step {
    display: flex;
    gap: 18px;
}

.vty-step-mark {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.vty-step-ico {
    position: relative;
    flex: none;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    box-sizing: border-box;
    border: 2px solid #BDBDBD;
    background: var(--vty-white);
    display: flex;
    align-items: center;
    justify-content: center;
}

.vty-step.is-done .vty-step-ico {
    border-color: var(--vty-green);
    background: var(--vty-green);
}

.vty-step.is-now .vty-step-ico {
    border-color: var(--vty-green);
}

.vty-step.is-now .vty-step-ico::after {
    content: "";
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 2px solid var(--vty-green);
    animation: vtyPing 1.8s ease-out infinite;
}

.vty-step-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--vty-green);
}

.vty-step-line {
    flex: 1 1 auto;
    width: 2px;
    min-height: 28px;
    background: #D9D9D9;
}

[data-theme="dark"] .vty-step-line {
    background: #4a4a4a;
}

.vty-step.is-done .vty-step-line {
    background: var(--vty-green);
}

.vty-step-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 4px 0 24px;
}

.vty-step:last-child .vty-step-text {
    padding-bottom: 0;
}

.vty-step-text strong {
    font-size: 17px;
    font-weight: 600;
}

.vty-step-text span {
    font-size: 14px;
    line-height: 1.5;
    color: var(--vty-muted);
}

.vty-tick {
    stroke-dasharray: 30;
    stroke-dashoffset: 30;
    animation: vtyDraw 0.5s ease-out 0.3s forwards;
}

@keyframes vtyDraw {
    to {
        stroke-dashoffset: 0;
    }
}

@keyframes vtyPing {
    0% {
        transform: scale(0.6);
        opacity: 0.9;
    }

    100% {
        transform: scale(1.5);
        opacity: 0;
    }
}

.vty-review {
    padding: 24px 0 72px;
}

.vty-h2 {
    margin: 0 0 28px;
    font-size: 30px;
    line-height: 1.25;
}

.vty-review-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    align-items: stretch;
}

.vty-details {
    flex: 2 1 560px;
    min-width: 0;
    background: var(--vty-grey);
    border-radius: 20px;
    padding: 36px;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    gap: 32px 40px;
}

.vty-details-text {
    flex: 1 1 240px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.vty-details-text h3,
.vty-card h3 {
    margin: 0;
    font-size: 22px;
    line-height: 1.3;
}

.vty-card h3 {
    font-size: 18px;
}

.vty-details-text p {
    margin: 0;
    font-size: 16px;
    line-height: 1.6;
    color: var(--vty-text2);
}

.vty-details-btns {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    margin-top: auto;
    padding-top: 12px;
}

.vty-details-btns .vty-btn {
    width: 260px;
    max-width: 100%;
}

.vty-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 48px;
    padding: 0 24px;
    border-radius: 50px;
    box-sizing: border-box;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.vty-btn:hover {
    text-decoration: none;
}

.vty-btn:focus-visible,
.vty a:focus-visible {
    outline: 2px solid #ED1F3D;
    outline-offset: 3px;
}

.vty-btn-black {
    background: var(--button-black-bg);
    color: var(--button-text);
}

.vty-btn-black:hover {
    background: #ED1F3D;
    color: #ffffff;
}

.vty-btn-line {
    background: var(--vty-white);
    border: 1px solid #d9d9d9;
    color: var(--text-color);
}

[data-theme="dark"] .vty-btn-line {
    border-color: #4a4a4a;
}

.vty-btn-line:hover {
    border-color: var(--text-color);
    color: var(--text-color);
}

.vty-details-list {
    flex: 1 1 300px;
    min-width: 0;
    list-style: none;
    margin: 0;
    padding: 4px 24px;
    background: var(--vty-white);
    border-radius: 16px;
    box-sizing: border-box;
}

.vty-details-list li {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 0;
    border-bottom: 1px solid var(--vty-chip);
    font-size: 15px;
    font-weight: 500;
}

.vty-details-list li:last-child {
    border-bottom: 0;
}

.vty-num {
    flex: none;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--vty-chip);
    color: var(--text-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
}

.vty-side {
    flex: 1 1 340px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.vty-card {
    flex: 1 1 auto;
    display: flex;
    align-items: flex-start;
    gap: 18px;
    padding: 28px 30px;
    background: var(--vty-white);
    border: 1px solid var(--vty-line);
    border-radius: 20px;
    box-sizing: border-box;
}

.vty-card-ico {
    flex: none;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: var(--vty-chip);
    color: var(--text-color);
    display: flex;
    align-items: center;
    justify-content: center;
}

.vty-card-body {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.vty-card-body p {
    margin: 0;
    font-size: 15px;
    line-height: 1.6;
    color: var(--vty-text2);
}

.vty-phone {
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--text-color);
    text-decoration: none;
    transition: color 0.2s;
}

.vty-phone:hover {
    color: #ED1F3D;
    text-decoration: none;
}

.vty-mail {
    font-size: 15px;
    color: #007BFF;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.vty-mail:hover {
    color: #f5001d;
    text-decoration: none;
}

.vty-facts {
    background: #1B1B1B;
    color: #ffffff;
    padding: 40px 0;
}

[data-theme="dark"] .vty-facts {
    background: #2c2c2c;
}

.vty-facts-in {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 24px;
    text-align: center;
}

.vty-facts-in div {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.vty-facts-in strong {
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
    font-size: 28px;
}

.vty-facts-in span,
.vty-facts-in a {
    font-size: 14px;
    color: #CFCFCF;
}

.vty-facts-in a {
    text-decoration: underline;
}

.vty-facts-in a:hover {
    color: #ffffff;
}

.vty-works {
    background: var(--vty-grey);
    padding: 72px 0;
}

.vty-works-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 28px;
}

.vty-works-head .vty-h2 {
    margin: 0;
}

.vty-kicker {
    margin: 0 0 8px;
    font-size: 14px;
    font-weight: 600;
    color: #ED1F3D;
}

.vty-works-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.vty-works-grid .our_works_block_img_cover img {
    width: 100%;
    display: block;
}

@media (min-width: 1200px) {
    .vty-h1-sub {
        white-space: nowrap;
    }
}

@media (max-width: 992px) {
    .vty-works-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .vty-hero {
        padding: 112px 0 40px;
    }

    .vty-h1-main {
        font-size: 44px;
    }

    .vty-h1-sub {
        font-size: 22px;
    }

    .vty-lead {
        font-size: 16px;
    }

    .vty-status,
    .vty-details {
        padding: 24px 20px;
    }

    .vty-card {
        padding: 22px 20px;
    }

    .vty-h2 {
        font-size: 24px;
    }

    .vty-phone {
        font-size: 22px;
    }

    .vty-works-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .vty-review {
        padding-bottom: 48px;
    }

    .vty-works {
        padding: 48px 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vty-step.is-now .vty-step-ico::after {
        animation: none;
    }

    .vty-tick {
        animation: none;
        stroke-dashoffset: 0;
    }
}

/* Section hubs - spacing fixes (2026-11-07):
   1) "Portfolio Highlights": the title sat right on the cards (title margin 5px) - gap before the cards;
   2) FAQ right after the dark portfolio block (/dev, /smm) had no gap before its title. */
.page_new_hub .new_portfolio_title {
    margin-bottom: 50px;
}

.page_new_hub .new_portfolio_subtitle+.new_portfolio_wrapper,
.page_new_hub .new_portfolio_title+.new_portfolio_wrapper {
    margin-top: 0;
}

.page_new_hub .new_portfolio+.faq_temp {
    margin-top: 100px;
}

@media (max-width: 600px) {
    .page_new_hub .new_portfolio_title {
        margin-bottom: 30px;
    }

    .page_new_hub .new_portfolio+.faq_temp {
        margin-top: 60px;
    }
}


/* ===== 404 page 2026-11-07 =====
   Template 404.php, Claude Design canvas "VOLL 404 page". Light and dark theme through the site variables. */
.v404 {
    color: var(--text-color);
    font-family: "Inter", sans-serif;
}

.v404-hero {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    min-height: calc(100vh - 90px);
    padding: 120px 0 64px;
}

.v404-in {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.v404-code {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.04em;
    font-family: "Montserrat", sans-serif;
    font-weight: 800;
    font-size: clamp(110px, 22vw, 260px);
    line-height: 1;
    letter-spacing: -0.04em;
    color: var(--text-color);
}

.v404-ring {
    position: relative;
    display: block;
    width: 0.72em;
    height: 0.72em;
    box-sizing: border-box;
    border: 0.14em solid var(--text-color);
    border-radius: 50%;
    margin: 0 0.02em;
}

.v404-orbit {
    position: absolute;
    inset: -0.14em;
    display: block;
    animation: v404-spin 4.2s linear infinite;
}

.v404-dot {
    position: absolute;
    top: 0;
    left: 50%;
    width: 0.14em;
    height: 0.14em;
    margin-left: -0.07em;
    border-radius: 50%;
    background: #ED1F3D;
    animation: v404-ping 2.1s ease-out infinite;
}

.v404 .v404-h1 {
    margin: 28px 0 0;
    font-family: "Montserrat", sans-serif;
    font-weight: 800;
    font-size: clamp(30px, 4.4vw, 52px);
    line-height: 1.1;
    letter-spacing: -0.5px;
    color: var(--text-color);
}

.v404-lead {
    max-width: 520px;
    margin: 16px 0 0;
    font-size: 18px;
    line-height: 1.55;
    color: var(--text-color);
    opacity: 0.75;
}

.v404-btns {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin-top: 32px;
}

.v404-btn {
    display: inline-flex;
    align-items: center;
    min-height: 56px;
    padding: 0 36px;
    border-radius: 30px;
    font-size: 17px;
    font-weight: 500;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.v404-btn:hover {
    transform: translateY(-2px);
    text-decoration: none;
}

.v404-btn-red {
    background: var(--button-red-bg);
    color: #fff;
}

.v404-btn-red:hover {
    color: #fff;
    box-shadow: 0 10px 20px rgba(237, 31, 61, 0.22);
}

.v404-btn-line {
    border: 1px solid #d9d9d9;
    color: var(--text-color);
}

.v404-btn-line:hover {
    color: var(--text-color);
    background-color: var(--backgound-grey-hover);
}

[data-theme="dark"] .v404-btn-line {
    border-color: #4a4a4a;
}

.v404-chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    max-width: 640px;
    margin: 40px 0 0;
    padding: 0;
    list-style: none;
}

.v404-chips a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 20px;
    border-radius: 22px;
    background: var(--backgound-grey);
    border: 1px solid rgba(128, 128, 128, 0.18);
    color: var(--text-color);
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
    transition: background-color .2s ease, color .2s ease;
}

.v404-chips a:hover {
    background: var(--button-black-bg);
    color: var(--background-color);
    text-decoration: none;
}

.v404-code,
.v404-h1,
.v404-lead,
.v404-btns,
.v404-chips {
    animation: v404-rise .8s cubic-bezier(.2, .7, .2, 1) both;
}

.v404-h1 {
    animation-delay: .12s;
}

.v404-lead,
.v404-btns {
    animation-delay: .24s;
}

.v404-chips {
    animation-delay: .36s;
}

@keyframes v404-spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes v404-ping {
    0% {
        box-shadow: 0 0 0 0 rgba(237, 31, 61, 0.5);
    }

    80%,
    100% {
        box-shadow: 0 0 0 0.14em rgba(237, 31, 61, 0);
    }
}

@keyframes v404-rise {
    from {
        opacity: 0;
        transform: translateY(16px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@media (max-width: 767px) {
    .v404-hero {
        padding: 88px 0 48px;
    }

    .v404-btn {
        min-height: 52px;
        padding: 0 28px;
    }
}

@media (prefers-reduced-motion: reduce) {

    .v404-orbit,
    .v404-dot,
    .v404-code,
    .v404-h1,
    .v404-lead,
    .v404-btns,
    .v404-chips {
        animation: none;
    }
}


/* ===== Popup form on phones 2026-11-07 =====
   The popup is position: fixed and was centred with no height limit: on a phone the form is taller than the screen,
   and when the keyboard opened the Name field stayed above the visible area and could not be scrolled to.
   Now on phones it sits at the top, is limited to the visible height (--vv-h is set from visualViewport in popup.js,
   so the keyboard is taken into account) and scrolls inside. */
@media (max-width: 767px) {
    .popupWindowNew {
        top: 8px;
        left: 8px;
        width: calc(100% - 16px);
        max-height: calc(var(--vv-h, 100dvh) - 16px);
        box-sizing: border-box;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        translate: 0 24px;
        padding-top: 52px;
        padding-bottom: 24px;
    }

    .popupWindowNew.in {
        translate: 0 0;
    }

    .popupWindowNew .popupWindow-body {
        height: auto;
    }

    .popupWindowNew input,
    .popupWindowNew textarea {
        scroll-margin: 24px 0;
    }
}


/* ===== Accessibility: contrast 2026-11-07 =====
   Lighthouse: white text on the brand red #ED1F3D is 4.32:1 (AA needs 4.5:1 for normal text), on the marquee red #E91E42 - 4.44:1.
   #E31B39 gives 4.69:1 and is visually the same red. The variable --button-red-bg is changed above; the rest of the red blocks
   that carry text get it here. The consent text under the popup forms, its link, section subtitles and the CookieYes buttons
   (CookieYes sets their colours inline, so !important; better to change them in the CookieYes dashboard too). */
.services_link,
.faqs_tab.active,
.vmm-cta,
.team_positions_btn_num,
.voll-contact__badge,
.marquee-wrapper.red {
    background-color: #E31B39;
}

.cky-btn.cky-btn-accept {
    background-color: #E31B39 !important;
    border-color: #E31B39 !important;
}

.cky-btn.cky-btn-customize,
.cky-btn.cky-btn-reject {
    color: #C4162F !important;
    border-color: #C4162F !important;
}

.popup-form .privacy-form-text,
.popup-form .privacy-form-text p {
    color: #595959;
}

.popup-form .privacy-form-text a {
    color: #0062CC;
}

/* Section subtitles and mega menu group titles were opacity .5 (about 3:1); .7 gives 6.4:1 on white, more on the dark theme. */
.our_works_subtitle,
.vmm-group-title {
    opacity: 0.7;
}

/* Step numbers in the Process block: red text 13px - #C4162F on light (5.9:1), #FF5A6E on the dark theme (5.9:1). */
.process_item_num {
    color: #C4162F;
}

[data-theme="dark"] .process_item_num {
    color: #FF5A6E;
}

/* Prices in the pricing cards: red 18px on the grey card #F9F9F9 was 4.1:1 - #C4162F gives 5.7:1, dark theme #FF5A6E on #2c2c2c 4.6:1. */
.new_pricing_item_price,
.page_new .new_pricing_item_price {
    color: #C4162F;
}

[data-theme="dark"] .new_pricing_item_price,
[data-theme="dark"] .page_new .new_pricing_item_price {
    color: #FF5A6E;
}

.process_item:hover .process_item_num {
    color: white;
}


/* ===== Blog article: comments 2026-11-07 =====
   The comments heading is h2 now (was h5 - Lighthouse heading-order); same look as the old h5.comments-title in style.css.
   The Send button: white on #ED1F3D was 4.32:1, #E31B39 gives 4.69:1 (style.css sets it with !important). */
#comments h2.comments-title {
    font-family: "Montserrat", sans-serif;
    font-size: 25px;
    font-weight: 600;
    line-height: 45px;
    letter-spacing: normal;
    text-transform: none;
    color: #282844;
    margin: 0;
    padding: 0 0 15px;
    text-align: left;
}

[data-theme="dark"] #comments h2.comments-title {
    color: var(--text-color);
}

.comments-btns input.button {
    background-color: #E31B39 !important;
}