* {
    border: none;
    margin: 0;
    padding: 0
}

*,
:before,
:after {
    box-sizing: border-box
}

a,
a:link,
a:visited,
a:hover {
    text-decoration: none
}

aside,
nav,
footer,
header,
section,
main {
    display: block
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    font-size: inherit;
    font-weight: inherit
}

ul,
ul li {
    list-style: none
}

img {
    vertical-align: top
}

img,
svg {
    max-width: 100%;
    height: auto
}

address {
    font-style: normal
}

input,
textarea,
button,
select {
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    background-color: #0000
}

input::-ms-clear {
    display: none
}

button,
input[type=submit] {
    cursor: pointer;
    box-shadow: none;
    background: 0 0;
    display: inline-block
}

input:focus,
input:active,
button:focus,
button:active {
    outline: none
}

button::-moz-focus-inner {
    border: 0;
    padding: 0
}

label {
    cursor: pointer
}

legend {
    display: block
}

* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

:root {
    --animation-duration: .3s;
    --footer-height: 0px;
    --header-height: 83px;
    --content-width: 81.4rem;
    --tabbar-height: 110px;
    interpolate-size: allow-keywords;
    --orbit: #1a1a1a8c;
    --orbit-strong: #fff;
    --dot: #ffffff8c;
    --dot-passive: #ffffff40;
    --center: #ff2a2a;
    --pill: #ffffff1a;
    --pill-border: #ffffff24;
    --pill-text: #ffffffd9;
    --pill-active: #c61b1b
}

* {
    font-family: Montserrat, sans-serif
}

main {
    min-height: calc(100vh - var(--footer-height) - var(--header-height))
}

body {
    background: #f2f2f2
}

i[data-icon] {
    height: fit-content
}

::selection {
    color: #fff;
    background: #b2000080
}

@view-transition {
    navigation: auto
}

.visually-hidden {
    display: none
}

.btn {
    color: #fff;
    background: #f2f2f2;
    justify-content: center;
    align-items: center;
    gap: .625rem;
    width: 18.75rem;
    height: 6.25rem;
    padding: 1.25rem 1.875rem;
    display: flex;
    position: relative;
    overflow: hidden
}

.btn.black {
    color: #fff;
    background: #000
}

.btn.gray {
    background: #333
}

.btn.white {
    background: #f2f2f2
}

.btn i {
    z-index: 2;
    width: 2rem;
    display: flex;
    position: relative
}

.btn span {
    z-index: 2;
    color: inherit;
    font-family: Montserrat, sans-serif;
    font-size: 1.125rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    position: relative
}

.btn:hover:after {
    background: #b20000;
    border-radius: 0%;
    width: 20rem;
    height: 10rem
}

.btn:after {
    z-index: 1;
    aspect-ratio: 1;
    content: "";
    background: 0 0;
    border-radius: 100%;
    width: 1rem;
    height: 1rem;
    transition: width .6s cubic-bezier(.2, 1.2, .3, 1), height .5s cubic-bezier(.34, 1.56, .64, 1), background .36s cubic-bezier(.55, 0, .1, 1), border-radius .5s ease-in-out, transform .7s cubic-bezier(.175, .885, .32, 1.275);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

section header.title-label {
    grid-template-columns: auto 60vw;
    justify-content: space-between;
    gap: 2rem;
    display: grid
}

@media (max-width:768px) {
    section header.title-label {
        grid-template-columns: 1fr;
        gap: 1.88rem
    }
}

section .section-title {
    text-transform: uppercase;
    white-space: nowrap;
    font-family: Montserrat, sans-serif;
    font-size: max(.55rem, min(1vw, .9375rem));
    font-style: normal;
    font-weight: 400
}

@media (max-width:768px) {
    section .section-title {
        font-size: .9375rem
    }
}

section .section-title.dark {
    color: #000
}

section .section-label {
    max-width: 60vw;
    font-family: Montserrat, sans-serif;
    font-size: var(--font-size);
    font-style: normal;
    font-weight: 600;
    line-height: calc(var(--font-size) * 1.18);
    --font-size: clamp(1rem, 4vw, 3.4375rem)
}

@media (max-width:768px) {
    section .section-label {
        --font-size: 2.25rem;
        max-width: 100%;
        line-height: 2.875rem
    }
}

.main-layout {
    padding: max(12.5rem, min(20vh, 18.75rem)) 2.5rem max(3.75rem, min(10vh, 8.75rem))
}

.main-layout.dark-bg {
    color: #fff;
    background: #000
}

@media (max-width:768px) {
    .main-layout {
        padding: 12.5rem 1.25rem 3.75rem
    }
}

@media (max-width:1200px) and (min-width:768px) {
    .main-layout {
        padding-left: 1.25rem;
        padding-right: 1.25rem
    }
}

.per-section-layout>section {
    padding: 8.75rem 2.5rem 6.25rem
}

.per-section-layout>section:first-of-type {
    padding-top: max(10rem, min(15vh, 18.75rem))
}

.per-section-layout>section:last-of-type {
    padding-bottom: max(3.75rem, min(10vh, 8.75rem))
}

@media (max-width:768px) {
    .per-section-layout>section {
        padding: 6.25rem 1.25rem 3.75rem
    }

    .per-section-layout>section:first-of-type {
        padding-top: 8rem
    }

    .per-section-layout>section:last-of-type {
        padding-bottom: 3.75rem
    }
}

header.website-header {
    z-index: 100;
    color: #fff;
    mix-blend-mode: difference;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 2.5rem;
    display: flex;
    position: fixed
}

@media (max-width:768px) {
    header.website-header {
        padding: 1.25rem
    }
}

header.website-header .logo {
    color: inherit;
    mix-blend-mode: difference
}

header.website-header .logo .copyright-symbol {
    width: .6rem;
    height: .6rem;
    display: flex;
    position: absolute;
    top: -1rem;
    right: -1rem
}

@media (max-width:768px) {
    header.website-header .logo #animated-logo {
        width: fit-content;
        max-height: 3.75rem
    }
}

header.website-header .menu {
    color: inherit;
    mix-blend-mode: difference
}

header.website-header .menu .burger-symbol {
    align-items: center;
    min-height: 3.13rem;
    display: flex
}

@media (max-width:768px) {
    header.website-header .menu .burger-symbol {
        max-width: 2.1875rem;
        min-height: 2.1875rem
    }
}

footer {
    background: #000;
    flex-direction: column;
    align-items: center;
    gap: 3.75rem;
    padding: 8.75rem 2.5rem 3.75rem;
    display: flex
}

@media (max-width:768px) {
    footer {
        gap: 2.5rem;
        padding: 3.75rem 1.25rem 2.5rem
    }
}

footer .tagline {
    color: #f2f2f2;
    text-align: center;
    text-transform: uppercase;
    font-family: Montserrat, sans-serif;
    font-size: 2.125rem;
    font-weight: 500;
    line-height: 2.75rem
}

@media (max-width:768px) {
    footer .tagline {
        text-align: left;
        font-size: 1.25rem;
        line-height: 1.6rem
    }

    footer .tagline br {
        display: none
    }
}

footer .main-content {
    flex-direction: column;
    gap: 3.75rem;
    width: 100%;
    display: flex
}

@media (max-width:768px) {
    footer .main-content {
        gap: 2.5rem
    }
}

footer .main-content .columns {
    border-top: 1px solid #fff3;
    border-bottom: 1px solid #fff3;
    grid-template-columns: 1fr 2fr;
    display: grid
}

@media (max-width:768px) {
    footer .main-content .columns {
        border-bottom: none;
        grid-template-columns: 1fr
    }
}

footer .main-content .columns .column {
    flex-direction: column;
    justify-content: space-between;
    min-height: 43.75rem;
    padding: 2.5rem;
    display: flex
}

@media (max-width:768px) {
    footer .main-content .columns .column {
        border-bottom: 1px solid #fff3;
        gap: 2.5rem;
        min-height: auto;
        padding: 1.875rem 0
    }
}

footer .main-content .columns .column.left {
    border-right: 1px solid #fff3
}

@media (max-width:768px) {
    footer .main-content .columns .column.left {
        border-right: none
    }
}

footer .main-content .columns .column.right {
    border-right: 1px solid #fff3
}

@media (max-width:768px) {
    footer .main-content .columns .column.right {
        border-right: none
    }
}

footer .main-content .columns .column .body {
    flex-direction: column;
    gap: 5rem;
    display: flex
}

@media (max-width:768px) {
    footer .main-content .columns .column .body {
        gap: 2.5rem
    }
}

footer .main-content .columns .column .group {
    flex-direction: column;
    gap: 1.25rem;
    display: flex
}

@media (max-width:768px) {
    footer .main-content .columns .column .group {
        gap: 1rem
    }
}

footer .main-content .columns .column .group .label {
    color: #f2f2f280;
    font-family: Montserrat, sans-serif;
    font-size: max(.6rem, min(1.4vw, 1rem));
    font-weight: 400;
    line-height: 1
}

@media (max-width:768px) {
    footer .main-content .columns .column .group .label {
        font-size: .875rem
    }
}

footer .main-content .columns .column .group .list {
    flex-direction: column;
    gap: .625rem;
    display: flex
}

@media (max-width:768px) {
    footer .main-content .columns .column .group .list {
        gap: .75rem
    }
}

footer .main-content .columns .column .group .list.contacts {
    gap: .75rem
}

footer .main-content .columns .column .group .list.contacts>span {
    color: #f2f2f2;
    font-family: Montserrat, sans-serif;
    font-size: max(.65rem, min(1.3vw, 1.1875rem));
    font-weight: 400
}

@media (max-width:768px) {
    footer .main-content .columns .column .group .list.contacts>span {
        font-size: 1rem
    }
}

footer .main-content .columns .column .group .list .link {
    align-items: center;
    gap: .25rem;
    padding-bottom: .25rem;
    text-decoration: none;
    transition: opacity .15s ease-in-out;
    display: flex
}

footer .main-content .columns .column .group .list .link span {
    color: #fff;
    font-family: Montserrat, sans-serif;
    font-size: max(.65rem, min(1.3vw, 1.1875rem));
    font-weight: 400
}

@media (max-width:768px) {
    footer .main-content .columns .column .group .list .link span {
        font-size: 1rem
    }
}

footer .main-content .columns .column .group .list .link i[data-icon] {
    color: #fff;
    width: 1.5625rem;
    display: flex
}

@media (max-width:768px) {
    footer .main-content .columns .column .group .list .link i[data-icon] {
        width: 1.25rem
    }
}

footer .main-content .columns .column .group .list .link:hover {
    opacity: .7
}

footer .main-content .columns .column .group .nav-links {
    justify-content: space-between;
    gap: 2rem;
    display: flex
}

@media (max-width:768px) {
    footer .main-content .columns .column .group .nav-links {
        flex-direction: column;
        gap: 1rem
    }
}

footer .main-content .columns .column .group .nav-links a {
    color: #f2f2f2;
    white-space: nowrap;
    font-family: Montserrat, sans-serif;
    font-size: max(1.7rem, min(2vw, 3.125rem));
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    transition: opacity .15s ease-in-out
}

@media (max-width:768px) {
    footer .main-content .columns .column .group .nav-links a {
        font-size: 1.75rem
    }
}

footer .main-content .columns .column .group .nav-links a:hover {
    opacity: .7
}

footer .main-content .columns .column .group .rules {
    flex-direction: column;
    gap: .75rem;
    display: flex
}

footer .main-content .columns .column .group .rules a {
    color: #f2f2f2fc;
    font-family: Montserrat, sans-serif;
    font-size: max(.7rem, min(1.3vw, 1.25rem));
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    transition: opacity .15s ease-in-out
}

@media (max-width:768px) {
    footer .main-content .columns .column .group .rules a {
        font-size: 1rem;
        line-height: 1.4
    }
}

footer .main-content .columns .column .group .rules a:hover {
    opacity: .7
}

footer .main-content .columns .column .copyright {
    color: #f2f2f280;
    font-family: Montserrat, sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1rem
}

@media (max-width:768px) {
    footer .main-content .columns .column .copyright {
        font-size: .875rem
    }
}

footer .main-content .brand-large {
    align-items: center;
    gap: 1.625rem;
    display: flex
}

@media (max-width:768px) {
    footer .main-content .brand-large {
        gap: .5rem
    }
}

footer .main-content .brand-large .company-name {
    color: #fff;
    flex: 1;
    height: 16.7875rem;
    display: flex
}

@media (max-width:1200px) and (min-width:768px) {
    footer .main-content .brand-large .company-name {
        height: auto
    }
}

@media (max-width:768px) {
    footer .main-content .brand-large .company-name {
        height: 3.125rem
    }
}

footer .main-content .brand-large .company-name svg {
    width: auto;
    height: 100%
}

#animated-logo {
    cursor: pointer;
    overflow: visible
}

#animated-logo * {
    transform-box: fill-box
}

#animated-logo #body {
    transform-origin: 50%;
    transition: clip-path .3s cubic-bezier(.65, 0, .35, 1)
}

#animated-logo #i-button,
#animated-logo #o-button {
    transition: transform .6s cubic-bezier(.65, 0, .35, 1)
}

#animated-logo.is-switched {
    color: #fff
}

#animated-logo.is-switched #i-button {
    transform: skew(-16deg)translate(6px, -15px)
}

#animated-logo.is-switched #o-button {
    transform: skew(-17.5deg)translate(-6px, -14px)
}

#animated-logo.is-masked #body {
    clip-path: polygon(78% 0%, 100% 0%, 100% 100%, 78% 100%)
}

#animated-logo:not(.is-masked) #body {
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)
}

.loading-screen {
    z-index: 10000;
    color: #fff;
    background: #000;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100vh;
    transition: background .3s ease-in-out;
    display: flex;
    position: fixed;
    top: 0;
    left: 0
}

@media (max-width:768px) {
    .loading-screen {
        padding-left: 1.5rem;
        padding-right: 1.5rem
    }
}

.loading-screen .content {
    align-items: center;
    gap: 1rem;
    max-width: max-content;
    transition: all .3s ease-in-out;
    display: flex;
    overflow: hidden
}

@media (max-width:768px) {
    .loading-screen .content {
        flex-direction: column
    }
}

.loading-screen .content #animated-logo {
    opacity: 1;
    will-change: transform;
    background: #000;
    max-width: max-content;
    transition: opacity .3s ease-in-out, transform .3s ease-in-out, background .3s ease-in-out;
    transform: translate(0)
}

@media (max-width:768px) {
    .loading-screen .content #animated-logo {
        height: 3rem
    }
}

.loading-screen .content .company-name {
    --shared-gap: .24rem;
    gap: var(--shared-gap);
    height: 3rem;
    transition: all .3s ease-in-out, opacity .6s ease-in-out;
    display: flex
}

.loading-screen .content .company-name .group {
    gap: var(--shared-gap);
    transition: all .3s ease-in-out;
    display: flex
}

.loading-screen .content .company-name .group svg {
    width: fit-content
}

.loading-screen .debug {
    z-index: 9999;
    gap: 1rem;
    display: flex;
    position: absolute;
    bottom: 2rem;
    left: 2rem
}

.loading-screen .debug button {
    color: #000;
    background: #fff;
    justify-content: center;
    align-items: center;
    width: 3rem;
    height: 3rem;
    font-size: 2rem;
    display: flex
}

.loading-screen[data-step="1"] .content {
    max-width: 4.625rem
}

.loading-screen[data-step="4"] #animated-logo,
.loading-screen[data-step="5"] #animated-logo {
    height: 5.8125rem;
    position: fixed;
    top: 2.5rem;
    left: 2.5rem
}

@media (max-width:768px) {

    .loading-screen[data-step="4"] #animated-logo,
    .loading-screen[data-step="5"] #animated-logo {
        height: 3rem;
        top: 1.25rem;
        left: 1.25rem
    }
}

.loading-screen[data-step="4"] .content,
.loading-screen[data-step="5"] .content {
    gap: 0;
    width: 100%;
    max-width: 100%;
    padding-left: 2.5rem;
    padding-right: 2.5rem
}

@media (max-width:768px) {

    .loading-screen[data-step="4"] .content,
    .loading-screen[data-step="5"] .content {
        padding-left: 1.25rem;
        padding-right: 1.25rem
    }
}

.loading-screen[data-step="4"] .company-name,
.loading-screen[data-step="5"] .company-name {
    justify-content: space-between;
    gap: 10rem;
    width: 100%;
    height: 12.23rem
}

@media (max-width:768px) {

    .loading-screen[data-step="4"] .company-name,
    .loading-screen[data-step="5"] .company-name {
        flex-direction: column;
        justify-content: center;
        gap: 1.25rem;
        height: auto
    }
}

.loading-screen[data-step="4"] .company-name .group,
.loading-screen[data-step="5"] .company-name .group {
    gap: 1.44rem;
    display: flex
}

@media (max-width:768px) {

    .loading-screen[data-step="4"] .company-name .group,
    .loading-screen[data-step="5"] .company-name .group {
        width: 100%
    }

    .loading-screen[data-step="4"] .company-name .group svg,
    .loading-screen[data-step="5"] .company-name .group svg {
        width: 100%;
        max-width: 25rem;
        height: auto
    }
}

.loading-screen[data-step="5"] {
    pointer-events: none;
    background: 0 0
}

.loading-screen[data-step="5"] #animated-logo {
    opacity: 0;
    background: 0 0
}

.loading-screen[data-step="5"] .company-name {
    opacity: 0
}

.cookie-popup-updated {
    z-index: 1000;
    opacity: 1;
    background: #fff;
    justify-content: space-between;
    align-items: center;
    transition: opacity .3s, transform .3s;
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    transform: translateY(0)
}

@media (max-width:768px) {
    .cookie-popup-updated {
        flex-direction: column;
        gap: 1.56rem;
        padding: 1.88rem 1.25rem
    }
}

.cookie-popup-updated.hidden {
    pointer-events: none;
    opacity: 0;
    transform: translateY(100%)
}

.cookie-popup-updated .text {
    flex: 1;
    align-items: center;
    padding: 1.25rem 2.5rem;
    display: flex
}

@media (max-width:768px) {
    .cookie-popup-updated .text {
        padding: 0
    }
}

.cookie-popup-updated .text p {
    color: #000;
    max-width: 38.125rem;
    font-family: Montserrat, sans-serif;
    font-size: .9375rem;
    font-weight: 400;
    line-height: 1.25rem
}

.cookie-popup-updated .buttons {
    grid-template-columns: repeat(3, 15vw);
    min-height: 5rem;
    display: grid
}

@media (min-width:768px) and (max-width:1200px) {
    .cookie-popup-updated .buttons {
        grid-template-columns: repeat(3, 1fr);
        width: 100%
    }
}

@media (max-width:768px) {
    .cookie-popup-updated .buttons {
        grid-template-columns: 1fr;
        gap: .5rem;
        width: 100%;
        min-height: fit-content
    }
}

.cookie-popup-updated .buttons button {
    color: #000;
    cursor: pointer;
    background: #fff;
    border: none;
    flex-shrink: 0;
    min-height: 100%;
    padding: 1.25rem 1.875rem;
    font-family: Montserrat, sans-serif;
    font-size: 1.0625rem;
    font-weight: 400;
    transition: background .2s
}

@media (max-width:768px) {
    .cookie-popup-updated .buttons button {
        background: #fff;
        border: 1px solid #00000080;
        width: 100%
    }

    .cookie-popup-updated .buttons button.accept-all {
        color: #fff;
        background: #000
    }
}

.cookie-popup-updated .buttons button:hover {
    background: #0000000d
}

.cookie-popup-updated .buttons button.accept-all {
    border-left: 1px solid #00000080;
    border-right: 1px solid #00000080
}

.cookie-popup-updated .buttons button.customize {
    border-left: 1px solid #00000080
}

@media (max-width:1200px) and (min-width:768px) {
    .cookie-popup-updated {
        flex-direction: column
    }

    .cookie-popup-updated .text {
        padding: 1.25rem
    }

    .cookie-popup-updated .text p {
        max-width: 100%
    }

    .cookie-popup-updated .buttons {
        border-top: 1px solid #0000001a;
        width: 100%
    }

    .cookie-popup-updated .buttons button {
        flex: 1;
        width: auto;
        height: 3.75rem;
        font-size: .875rem
    }

    .cookie-popup-updated .buttons button.accept-all {
        border-left: none
    }
}

.fullscreen-menu {
    z-index: 9999;
    visibility: hidden;
    pointer-events: none;
    position: fixed;
    inset: 0
}

.fullscreen-menu.is-open {
    visibility: visible;
    pointer-events: auto
}

.fullscreen-menu.is-open .menu-mask {
    clip-path: circle(150% at var(--origin-x, 100%) var(--origin-y, 0%))
}

.fullscreen-menu.is-open .menu-content {
    opacity: 1;
    transition-delay: .3s
}

.fullscreen-menu.is-closing {
    pointer-events: none
}

.fullscreen-menu.is-closing .menu-mask {
    clip-path: circle(0% at var(--origin-x, 100%) var(--origin-y, 0%))
}

.fullscreen-menu.is-closing .menu-content {
    opacity: 0;
    transition-delay: 0s
}

.fullscreen-menu .menu-mask {
    clip-path: circle(0% at var(--origin-x, 100%) var(--origin-y, 0%));
    background: #000;
    transition: clip-path .8s cubic-bezier(.77, 0, .175, 1);
    position: absolute;
    inset: 0
}

.fullscreen-menu .menu-content {
    opacity: 0;
    flex-direction: column;
    transition: opacity .3s;
    display: flex;
    position: absolute;
    inset: 0
}

.fullscreen-menu .menu-header {
    justify-content: space-between;
    align-items: center;
    padding: 2.5rem;
    display: flex
}

@media (max-width:768px) {
    .fullscreen-menu .menu-header {
        border-bottom: 1px solid #fff;
        padding: 1.25rem
    }
}

.fullscreen-menu .menu-header .logo {
    color: #fff
}

.fullscreen-menu .menu-header .logo .company-name {
    width: 11.7rem;
    display: flex
}

.fullscreen-menu .menu-header .close-button {
    cursor: pointer;
    background: 0 0;
    border: none;
    justify-content: center;
    align-items: center;
    width: 3.125rem;
    height: 3.125rem;
    padding: 0;
    display: flex
}

@media (max-width:768px) {
    .fullscreen-menu .menu-header .close-button {
        width: 2.1875rem;
        height: 2.1875rem
    }
}

.fullscreen-menu .menu-header .close-button i[data-icon] {
    color: #fff;
    width: 2.5rem;
    height: 2.5rem;
    display: flex
}

@media (max-width:768px) {
    .fullscreen-menu .menu-header .close-button i[data-icon] {
        width: 1.75rem;
        height: 1.75rem
    }
}

.fullscreen-menu .menu-divider {
    background: #ffffff1a
}

.fullscreen-menu .menu-divider.horizontal {
    width: 100%;
    height: 1px
}

@media (max-width:768px) {
    .fullscreen-menu .menu-divider.horizontal {
        display: none
    }
}

.fullscreen-menu .menu-divider.vertical {
    width: 1px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0
}

.fullscreen-menu .menu-body {
    flex: 1;
    grid-template-columns: 1fr 1fr;
    display: grid;
    overflow: hidden
}

@media (max-width:768px) {
    .fullscreen-menu .menu-body {
        flex-direction: column;
        grid-template-columns: 1fr;
        display: flex
    }
}

.fullscreen-menu .menu-left {
    flex-direction: column;
    justify-content: space-between;
    padding: 0 2.5rem 2.5rem;
    display: flex;
    position: relative
}

@media (max-width:768px) {
    .fullscreen-menu .menu-left {
        display: none
    }
}

.fullscreen-menu .recent-case {
    flex-direction: column;
    gap: 1.875rem;
    display: flex
}

.fullscreen-menu .recent-case .image-wrapper {
    aspect-ratio: 890/500;
    width: 100%;
    max-width: 55.625rem;
    overflow: hidden
}

.fullscreen-menu .recent-case .image-wrapper img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.fullscreen-menu .recent-case .case-info {
    gap: 8.75rem;
    display: flex
}

.fullscreen-menu .recent-case .case-info .info-block {
    flex-direction: column;
    gap: 1rem;
    display: flex
}

.fullscreen-menu .recent-case .case-info .info-block .label {
    color: #f2f2f280;
    font-family: Montserrat, sans-serif;
    font-size: 1rem;
    font-weight: 400
}

.fullscreen-menu .recent-case .case-info .info-block .link {
    color: #fff;
    border-bottom: 1px solid #b20000;
    align-items: center;
    gap: .25rem;
    padding-bottom: .25rem;
    text-decoration: none;
    display: flex
}

.fullscreen-menu .recent-case .case-info .info-block .link span {
    font-family: Montserrat, sans-serif;
    font-size: 1.1875rem;
    font-weight: 400
}

.fullscreen-menu .recent-case .case-info .info-block .link i[data-icon] {
    width: 1.5625rem;
    height: 1.5625rem;
    display: flex
}

.fullscreen-menu .recent-case .case-info .info-block .work-list {
    flex-direction: column;
    gap: .625rem;
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex
}

.fullscreen-menu .recent-case .case-info .info-block .work-list li {
    color: #fff;
    font-family: Montserrat, sans-serif;
    font-size: 1.1875rem;
    font-weight: 400;
    line-height: 1.1875rem
}

.fullscreen-menu .menu-footer {
    justify-content: space-between;
    align-items: flex-end;
    display: flex
}

@media (max-width:768px) {
    .fullscreen-menu .menu-footer.desktop-only {
        display: none
    }
}

.fullscreen-menu .menu-footer.mobile-only {
    display: none
}

@media (max-width:768px) {
    .fullscreen-menu .menu-footer.mobile-only {
        background: #000;
        border-top: 1px solid #ffffff1a;
        flex-shrink: 0;
        align-items: center;
        padding: 1.875rem 1.25rem;
        display: flex
    }
}

.fullscreen-menu .menu-footer .footer-left {
    flex-direction: column;
    gap: 1.875rem;
    display: flex
}

@media (max-width:768px) {
    .fullscreen-menu .menu-footer .footer-left {
        gap: 0
    }
}

.fullscreen-menu .menu-footer .footer-left .social-icons {
    gap: 1.25rem;
    display: flex
}

.fullscreen-menu .menu-footer .footer-left .social-icons .social-link {
    color: #fff
}

.fullscreen-menu .menu-footer .footer-left .social-icons .social-link i[data-icon] {
    width: 1.75rem;
    height: 1.75rem;
    display: flex
}

.fullscreen-menu .menu-footer .footer-left .social-icons .social-link:hover {
    opacity: .7
}

.fullscreen-menu .menu-footer .footer-left .footer-text {
    flex-direction: column;
    gap: .75rem;
    display: flex
}

@media (max-width:768px) {
    .fullscreen-menu .menu-footer .footer-left .footer-text {
        display: none
    }
}

.fullscreen-menu .menu-footer .footer-left .footer-text .cta {
    color: #fff;
    font-family: Montserrat, sans-serif;
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.125rem
}

.fullscreen-menu .menu-footer .footer-left .footer-text .copyright {
    color: #f2f2f280;
    font-family: Montserrat, sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1rem
}

.fullscreen-menu .menu-footer .language-selector {
    gap: .75rem;
    display: flex
}

.fullscreen-menu .menu-footer .language-selector .lang-button {
    color: #f2f2f2;
    cursor: pointer;
    background: 0 0;
    border: 1px solid #f2f2f21a;
    border-radius: 3.125rem;
    width: 3.125rem;
    height: 3.125rem;
    font-family: Montserrat, sans-serif;
    font-size: .9375rem;
    font-weight: 400;
    transition: all .2s
}

.fullscreen-menu .menu-footer .language-selector .lang-button.active {
    border-color: #f2f2f2
}

.fullscreen-menu .menu-footer .language-selector .lang-button:hover:not(.active) {
    border-color: #f2f2f24d
}

.fullscreen-menu .menu-nav {
    flex-direction: column;
    display: flex;
    overflow: hidden
}

@media (max-width:768px) {
    .fullscreen-menu .menu-nav {
        flex: 1;
        overflow-y: auto
    }
}

.fullscreen-menu .menu-nav .nav-item {
    border-bottom: 1px solid #ffffff1a;
    align-items: center;
    padding: 2.5rem 6.25rem;
    text-decoration: none;
    transition: background .3s;
    display: flex;
    overflow: hidden
}

@media (max-width:768px) {
    .fullscreen-menu .menu-nav .nav-item {
        justify-content: flex-start;
        height: 8.65rem;
        padding: 2.5rem 1.25rem
    }
}

.fullscreen-menu .menu-nav .nav-item:first-child {
    border-top: none
}

.fullscreen-menu .menu-nav .nav-item:hover {
    background: #ffffff08
}

.fullscreen-menu .menu-nav .nav-item:hover .nav-text {
    transform: translate(1rem)
}

.fullscreen-menu .menu-nav .nav-item .nav-text {
    color: #f2f2f2;
    text-transform: uppercase;
    font-family: Mulish, sans-serif;
    font-size: 6.875rem;
    font-weight: 900;
    line-height: 1;
    transition: transform .3s
}

@media (max-width:768px) {
    .fullscreen-menu .menu-nav .nav-item .nav-text {
        font-size: 2.8125rem
    }
}

.custom-right-menu {
    z-index: 10000;
    pointer-events: none;
    opacity: 0;
    -webkit-backdrop-filter: blur(.7rem);
    backdrop-filter: blur(.7rem);
    transform-origin: 0 0;
    background: #14141496;
    border: 1px solid #ffffff1a;
    border-radius: .75rem;
    min-width: 12.5rem;
    padding: .5rem 0;
    transition: opacity .15s ease-out, transform .15s ease-out;
    position: fixed;
    transform: scale(.95)translateY(-.5rem);
    box-shadow: 0 .5rem 2rem #0006, inset 0 0 0 1px #ffffff0d
}

.custom-right-menu.visible {
    pointer-events: auto;
    opacity: 1;
    transform: scale(1)translateY(0)
}

.custom-right-menu .menu-list {
    margin: 0;
    padding: 0;
    list-style: none
}

.custom-right-menu .menu-item {
    color: #ffffffd9;
    cursor: pointer;
    align-items: center;
    gap: .75rem;
    padding: .625rem 1rem;
    font-size: .875rem;
    font-weight: 400;
    transition: background .1s;
    display: flex
}

.custom-right-menu .menu-item:hover {
    background: #b2000033
}

.custom-right-menu .menu-item:active {
    background: #b2000066
}

.custom-right-menu .menu-item i {
    opacity: .7;
    flex-shrink: 0;
    width: 1rem;
    height: 1rem
}

.custom-right-menu .menu-item i svg {
    width: 100%;
    height: 100%
}

.custom-right-menu .menu-item span {
    white-space: nowrap;
    flex: 1
}

.custom-right-menu .divider {
    background: #ffffff1a;
    height: 1px;
    margin: .5rem 0
}

.pixel-trail-canvas {
    z-index: 2;
    pointer-events: none;
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0
}

div.mb-categories {
    flex-wrap: wrap;
    align-content: flex-start;
    align-items: flex-start;
    gap: 1rem .625rem;
    display: flex
}

div.mb-categories.max-width {
    max-width: 43.75rem
}

@media (max-width:768px) {
    div.mb-categories.max-width {
        max-width: 100%
    }
}

div.mb-categories span.category {
    color: inherit;
    border: 1px solid #0003;
    border-radius: 3.125rem;
    justify-content: center;
    align-items: center;
    gap: .625rem;
    padding: .5rem 1.25rem;
    font-size: .9375rem;
    font-weight: 400;
    display: flex
}

.case-card {
    flex-direction: column;
    gap: 1.25rem;
    display: flex
}

.case-card .image-wrapper {
    width: 100%
}

.case-card .image-wrapper img {
    width: 100%;
    max-width: 100%
}

.case-card .text {
    flex-direction: column;
    gap: .38rem;
    display: flex
}

.case-card .text h3 {
    color: inherit;
    font-size: 1.375rem;
    font-weight: 500;
    line-height: 100%
}

@media (max-width:768px) {
    .case-card .text h3 {
        font-size: 1.25rem
    }
}

.case-card .text p {
    text-overflow: ellipsis;
    color: #0006;
    white-space: nowrap;
    max-width: 100%;
    font-size: 1.0625rem;
    font-weight: 400;
    line-height: 100%;
    display: block;
    overflow: hidden
}

@media (max-width:768px) {
    .case-card .text p {
        font-size: 1rem
    }
}

.member-card {
    aspect-ratio: 38/45;
    border-radius: 1.875rem;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 9.375rem;
    display: flex;
    overflow: hidden
}

.member-card:hover .image-wrapper img {
    filter: none
}

.member-card .image-wrapper {
    aspect-ratio: 38/45;
    position: relative;
    overflow: hidden
}

.member-card .image-wrapper img {
    object-fit: cover;
    filter: grayscale(100);
    width: 100%;
    height: 100%;
    transition: filter .15s ease-in-out
}

.member-card .image-wrapper .overlay {
    z-index: 3;
    background: linear-gradient(#0000, #00000080);
    flex-direction: column;
    justify-content: end;
    width: 100%;
    height: 100%;
    padding: max(1.58rem, min(2vw, 2.5rem));
    display: flex;
    position: absolute;
    top: 0;
    left: 0
}

.member-card .image-wrapper .overlay .name {
    color: #fff;
    text-transform: capitalize;
    font-family: Montserrat, sans-serif;
    font-size: 1.625rem;
    font-style: normal;
    font-weight: 600;
    line-height: 1.625rem
}

.member-card .image-wrapper .overlay .position {
    color: #ffffff80;
    margin-top: 1rem;
    font-family: Montserrat, sans-serif;
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.25rem
}

.chat-popup-backdrop {
    z-index: 9998;
    pointer-events: none;
    opacity: 0;
    -webkit-backdrop-filter: blur();
    backdrop-filter: blur();
    background: #00000080;
    transition: opacity .4s cubic-bezier(.4, 0, .2, 1), -webkit-backdrop-filter .4s cubic-bezier(.4, 0, .2, 1), backdrop-filter .4s cubic-bezier(.4, 0, .2, 1);
    position: fixed;
    inset: 0
}

.chat-popup-backdrop.active {
    pointer-events: auto;
    opacity: 1;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px)
}

.contact-popup,
.chat-popup {
    z-index: 9999;
    pointer-events: none;
    opacity: 0;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 40rem;
    max-height: 90vh;
    transition: opacity .4s cubic-bezier(.4, 0, .2, 1), transform .4s cubic-bezier(.4, 0, .2, 1);
    display: flex;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)scale(.9)
}

.active.contact-popup,
.active.chat-popup {
    pointer-events: auto;
    opacity: 1;
    transform: translate(-50%, -50%)scale(1)
}

.chat-popup__container {
    background: #f2f2f2;
    border-radius: 1.875rem;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    max-height: 90vh;
    padding: 2.5rem;
    display: flex;
    overflow: hidden;
    box-shadow: 0 25px 50px -12px #00000040
}

.chat-popup__upper {
    flex-direction: column;
    gap: 1.875rem;
    margin-bottom: 2.5rem;
    display: flex
}

.chat-popup__close-wrapper {
    justify-content: flex-end;
    display: flex
}

.chat-popup__close {
    cursor: pointer;
    background: 0 0;
    border: none;
    justify-content: center;
    align-items: center;
    width: 1.875rem;
    height: 1.875rem;
    padding: 0;
    transition: transform .2s, opacity .2s;
    display: flex
}

.chat-popup__close i,
.chat-popup__close svg {
    color: #000;
    width: 100%;
    height: 100%
}

.chat-popup__close:hover {
    opacity: .7;
    transform: rotate(90deg)
}

.chat-popup__text {
    flex-direction: column;
    gap: 1.25rem;
    display: flex
}

.chat-popup__title {
    color: #000;
    margin: 0;
    font-family: Montserrat, sans-serif;
    font-size: 1.875rem;
    font-weight: 600;
    line-height: 2.375rem
}

.chat-popup__subtitle {
    color: #0006;
    margin: 0;
    font-family: Montserrat, sans-serif;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1rem
}

.chat-popup__lower {
    flex-direction: column;
    gap: 2.5rem;
    display: flex
}

.chat-popup__quick-access {
    gap: 1rem;
    display: flex
}

.chat-popup__quick-btn {
    color: #fff;
    background: #000;
    border-radius: 3.125rem;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 3.625rem;
    padding: .875rem 1.875rem;
    text-decoration: none;
    transition: background .3s, transform .2s;
    display: flex
}

.chat-popup__quick-btn i,
.chat-popup__quick-btn svg {
    width: 1.875rem;
    height: 1.875rem
}

.chat-popup__quick-btn:hover {
    background: #b20000
}

.chat-popup__quick-btn--mail svg {
    width: 2.25rem;
    height: 2.25rem
}

.chat-popup__divider {
    align-items: center;
    gap: 1.25rem;
    display: flex
}

.chat-popup__divider-line {
    background: #0000001a;
    flex: 1;
    height: 1px
}

.chat-popup__divider-text {
    color: #0000001a;
    text-transform: uppercase;
    font-family: Montserrat, sans-serif;
    font-size: .9375rem;
    font-weight: 600
}

.chat-popup__chat {
    border: 1px solid #0000001a;
    border-radius: 1.875rem;
    flex-direction: column;
    justify-content: space-between;
    height: 23.5625rem;
    padding: 1.625rem;
    display: flex;
    overflow: hidden
}

.chat-popup__messages {
    scrollbar-color: #0003 transparent;
    scrollbar-width: thin;
    flex-direction: column;
    gap: .875rem;
    display: flex;
    overflow-y: auto
}

.chat-popup__messages::-webkit-scrollbar {
    width: 4px
}

.chat-popup__messages::-webkit-scrollbar-track {
    background: 0 0
}

.chat-popup__messages::-webkit-scrollbar-thumb {
    background: #0003;
    border-radius: 4px
}

.chat-popup__message {
    max-width: 80%;
    animation: .3s forwards message-slide-in;
    display: flex
}

.chat-popup__message--bot {
    align-self: flex-start
}

.chat-popup__message--user {
    align-self: flex-end
}

.chat-popup__message--user .bubble {
    color: #fff;
    background: #000
}

.chat-popup__bubble {
    background: #fff;
    border-radius: 1rem;
    padding: .75rem .875rem;
    position: relative
}

.chat-popup__bubble:before {
    content: "";
    background: inherit;
    clip-path: polygon(100% 0, 100% 100%, 0 100%);
    border-radius: 0 0 0 .5rem;
    width: 1rem;
    height: .875rem;
    position: absolute;
    bottom: 0;
    left: -.3125rem
}

.chat-popup__bubble p {
    color: inherit;
    margin: 0;
    font-family: Montserrat, sans-serif;
    font-size: 1.0625rem;
    font-weight: 400;
    line-height: 1.4375rem
}

.chat-popup__message--user .chat-popup__bubble:before {
    clip-path: polygon(0 0, 100% 100%, 0 100%);
    border-radius: 0 0 .5rem;
    left: auto;
    right: -.3125rem
}

.chat-popup__input-form {
    flex-shrink: 0;
    margin-top: 1rem
}

.chat-popup__input-wrapper {
    background: #ededed;
    border: 1px solid #0000001a;
    border-radius: 1rem;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    padding: .75rem 1rem;
    transition: border-color .2s, box-shadow .2s;
    display: flex
}

.chat-popup__input-wrapper:focus-within {
    border-color: #0000004d;
    box-shadow: 0 0 0 3px #0000000d
}

.chat-popup__input {
    color: #000;
    caret-color: #b20000;
    background: 0 0;
    border: none;
    outline: none;
    flex: 1;
    min-width: 0;
    padding: 0;
    font-family: Montserrat, sans-serif;
    font-size: 1.0625rem;
    font-weight: 400;
    line-height: 1.375rem
}

.chat-popup__input::placeholder {
    color: #00000080
}

.chat-popup__input-buttons {
    flex-shrink: 0;
    align-items: center;
    display: flex
}

.chat-popup__send-btn {
    cursor: pointer;
    background: 0 0;
    border: none;
    justify-content: center;
    align-items: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    transition: opacity .2s, transform .2s;
    display: flex
}

.chat-popup__send-btn svg {
    color: #000;
    width: 100%;
    height: 100%
}

.chat-popup__send-btn:hover {
    opacity: .7
}

.chat-popup__privacy {
    justify-content: center;
    display: flex
}

.chat-popup__privacy-link {
    color: #0006;
    text-transform: uppercase;
    padding-bottom: .25rem;
    font-family: Montserrat, sans-serif;
    font-size: .75rem;
    font-weight: 600;
    text-decoration: none;
    transition: color .2s
}

.chat-popup__privacy-link:hover {
    color: #000
}

.chat-popup__typing .bubble {
    padding: .75rem 1rem
}

.chat-popup__typing .bubble p {
    align-items: center;
    gap: .25rem;
    display: flex
}

.chat-popup__typing-dot {
    background: #0006;
    border-radius: 50%;
    width: .5rem;
    height: .5rem;
    animation: 1.4s ease-in-out infinite typing-bounce;
    display: inline-block
}

.chat-popup__typing-dot:first-child {
    animation-delay: 0s
}

.chat-popup__typing-dot:nth-child(2) {
    animation-delay: .2s
}

.chat-popup__typing-dot:nth-child(3) {
    animation-delay: .4s
}

@keyframes typing-bounce {

    0%,
    60%,
    to {
        opacity: .4;
        transform: translateY(0)
    }

    30% {
        opacity: 1;
        transform: translateY(-.25rem)
    }
}

@keyframes message-slide-in {
    0% {
        opacity: 0;
        transform: translateY(10px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes popup-fade-in {
    0% {
        opacity: 0;
        transform: translate(-50%, -50%)scale(.9)
    }

    to {
        opacity: 1;
        transform: translate(-50%, -50%)scale(1)
    }
}

@keyframes backdrop-fade-in {
    0% {
        opacity: 0;
        -webkit-backdrop-filter: blur();
        backdrop-filter: blur()
    }

    to {
        opacity: 1;
        -webkit-backdrop-filter: blur(8px);
        backdrop-filter: blur(8px)
    }
}

@media (max-width:768px) {
    .chat-popup {
        max-width: calc(100% - 2rem)
    }

    .chat-popup__container {
        padding: 1.5rem
    }

    .chat-popup__title {
        font-size: 1.5rem;
        line-height: 1.875rem
    }

    .chat-popup__quick-access {
        flex-wrap: wrap
    }

    .chat-popup__quick-btn {
        flex: 1;
        min-width: 5rem
    }

    .chat-popup__chat {
        height: 18rem
    }
}

@media (max-width:480px) {
    .chat-popup__upper {
        gap: 1rem;
        margin-bottom: 1.5rem
    }

    .chat-popup__lower {
        gap: 1.5rem
    }

    .chat-popup__title {
        font-size: 1.25rem;
        line-height: 1.5rem
    }

    .chat-popup__subtitle {
        font-size: .875rem
    }

    .chat-popup__quick-btn {
        width: auto;
        min-width: 4rem;
        height: 3rem;
        padding: .75rem 1rem
    }

    .chat-popup__chat {
        height: 15rem;
        padding: 1rem
    }

    .chat-popup__bubble p {
        font-size: .9375rem;
        line-height: 1.25rem
    }
}

.main-page .wrapper-side-btn {
    z-index: 9997;
    mix-blend-mode: difference;
    width: fit-content;
    position: fixed;
    top: 65%;
    right: -5rem
}

@media (max-width:1000px) {
    .main-page .wrapper-side-btn {
        display: none
    }
}

.main-page .wrapper-side-btn .side.btn {
    mix-blend-mode: difference;
    width: fit-content;
    transform: rotate(-90deg)
}

.main-page .wrapper-side-btn .side.btn span,
.main-page .wrapper-side-btn .side.btn i[data-icon] {
    mix-blend-mode: difference
}

.main-page .hero {
    z-index: 1;
    justify-content: start;
    align-items: end;
    height: 100vh;
    padding: 3.75rem 2.5rem;
    display: flex;
    position: relative
}

.main-page .hero .model-viewer {
    z-index: 10;
    pointer-events: none;
    place-items: center;
    display: grid;
    position: absolute;
    inset: 0
}

.main-page .hero .model-viewer .viewport {
    aspect-ratio: 1;
    pointer-events: auto;
    cursor: grab;
    width: max(20rem, min(40vw, 70rem))
}

.main-page .hero .model-viewer .viewport:active {
    cursor: grabbing
}

.main-page .hero .model-viewer .viewport canvas {
    width: 100%;
    display: block
}

.main-page .hero .company-name {
    z-index: 5;
    justify-content: space-between;
    align-items: center;
    gap: 10rem;
    width: 100%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    display: flex;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%)
}

.main-page .hero .company-name .group {
    gap: 1.44rem;
    display: flex
}

.main-page .hero .slogan {
    z-index: 1;
    max-width: 48.2rem
}

.main-page .hero .slogan p {
    text-transform: uppercase;
    font-family: Montserrat, sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.75rem
}

.main-page .hero .slogan p span {
    margin-right: 3rem;
    font-size: .9375rem;
    font-weight: 400
}

@media (max-width:768px) {
    .main-page .hero {
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        padding: 6rem 1.25rem 1.875rem
    }

    .main-page .hero .model-viewer {
        z-index: 10;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)scale(1.5)
    }

    .main-page .hero .model-viewer .viewport {
        aspect-ratio: auto;
        width: 12.75rem;
        height: 16.25rem
    }

    .main-page .hero .hero-logo {
        order: 1;
        display: block
    }

    .main-page .hero .hero-logo .company-name {
        z-index: 5;
        flex-direction: column;
        gap: 1.25rem;
        width: auto;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        display: flex
    }

    .main-page .hero .hero-logo .company-name .group {
        width: 100%
    }

    .main-page .hero .hero-logo .company-name .group svg {
        width: 100%;
        max-width: 25rem;
        height: auto
    }

    .main-page .hero .slogan {
        order: 2
    }

    .main-page .hero .slogan p {
        text-transform: uppercase;
        font-size: .9375rem;
        font-weight: 600;
        line-height: 1.4375rem
    }

    .main-page .hero .slogan p br {
        display: none
    }

    .main-page .hero .slogan p span {
        color: #00000080;
        margin-bottom: .5rem;
        margin-right: 2.6rem;
        font-size: .875rem;
        font-weight: 400
    }
}

.main-page section.our-approach {
    color: #fff;
    background: #000;
    flex-direction: column;
    gap: 6.25rem;
    min-height: 100vh;
    padding: 8.75rem 2.5rem;
    display: flex
}

@media (max-width:768px) {
    .main-page section.our-approach {
        gap: 3.75rem;
        min-height: auto;
        padding: 6.25rem 1.25rem 3.75rem
    }
}

.main-page section.our-approach header .text-columns {
    flex-direction: column;
    gap: max(1rem, min(4vw, 3.75rem));
    max-width: 97rem;
    display: flex
}

@media (max-width:768px) {
    .main-page section.our-approach header .text-columns {
        gap: 1.875rem
    }
}

.main-page section.our-approach header .text-columns .columns {
    grid-template-columns: 1fr 1fr 1fr;
    gap: max(1rem, min(4vw, 3.12rem));
    display: grid
}

@media (max-width:768px) {
    .main-page section.our-approach header .text-columns .columns {
        grid-template-columns: 1fr;
        gap: 1.5rem
    }
}

.main-page section.our-approach header .text-columns .columns p {
    font-family: Montserrat, sans-serif;
    font-size: var(--font-size);
    font-style: normal;
    font-weight: 400;
    line-height: calc(var(--font-size) * 1.53);
    opacity: .5;
    --font-size: clamp(.6rem, 1vw, 1.0625rem)
}

@media (max-width:768px) {
    .main-page section.our-approach header .text-columns .columns p {
        --font-size: 1.0625rem;
        line-height: 1.625rem
    }
}

.main-page section.our-approach .orbit-wrapper {
    flex: 1;
    width: 100%;
    min-height: 600px;
    position: relative
}

@media (max-width:768px) {
    .main-page section.our-approach .orbit-wrapper {
        border-top: 1px solid #ffffff1a;
        border-bottom: 1px solid #ffffff1a;
        width: calc(100% + 2.5rem);
        min-height: 40.625rem;
        margin-left: -1.25rem;
        margin-right: -1.25rem
    }
}

.main-page section.our-approach .orbit-wrapper .stage {
    position: absolute;
    inset: 0
}

.main-page section.our-approach .orbit-wrapper .stage svg {
    width: 100%;
    height: 100%;
    display: block;
    overflow: visible
}

.main-page section.our-approach .orbit-wrapper .stage svg .orbit-path {
    opacity: .65;
    transition: stroke .3s, stroke-width .3s
}

.main-page section.our-approach .orbit-wrapper .stage svg .orbit-path.active {
    opacity: 1;
    stroke: var(--orbit-strong);
    stroke-width: 1.3px
}

.main-page section.our-approach .orbit-wrapper .stage svg .orbit-node {
    opacity: .85
}

.main-page section.our-approach .orbit-wrapper .stage svg .nexus-dot {
    opacity: 0;
    transition: opacity .25s
}

.main-page section.our-approach .orbit-wrapper .stage svg .nexus-dot.active {
    opacity: 1
}

.main-page section.our-approach .orbit-wrapper .stage .pill {
    color: var(--pill-text);
    white-space: nowrap;
    pointer-events: auto;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    background: var(--pill);
    border: 1px solid var(--pill-border);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    border-radius: 999px;
    padding: 6px 14px;
    font: 500 13px/1.2 system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, Arial, sans-serif;
    transition: background .3s, border-color .3s;
    position: absolute;
    transform: translate(-50%, -50%)
}

.main-page section.our-approach .orbit-wrapper .stage .pill.active {
    color: #fff;
    background: var(--pill-active);
    border-color: #ffffff1f
}

@media (max-width:768px) {
    .main-page section.our-approach .orbit-wrapper .stage .pill {
        padding: .75rem 1rem;
        font-size: 1rem
    }

    .main-page section.our-approach .orbit-wrapper .orbit-caption {
        color: #ffffff80;
        font-family: Montserrat, sans-serif;
        font-size: 1rem;
        font-weight: 400;
        line-height: 1.5rem;
        position: absolute;
        bottom: 2.5rem;
        left: 1.25rem;
        right: 1.25rem
    }
}

.main-page section.our-services {
    background: #000;
    flex-direction: column;
    gap: 3.75rem;
    min-height: 100vh;
    padding: 8.75rem 2.5rem;
    display: flex
}

@media (max-width:768px) {
    .main-page section.our-services {
        gap: 1.875rem;
        min-height: 0;
        padding: 3.75rem 1.25rem
    }
}

.main-page section.our-services h2 {
    color: #f2f2f2;
    text-transform: uppercase;
    font-family: Mulish, sans-serif;
    font-size: max(6rem, min(7vw, 9.375rem));
    font-weight: 900
}

@media (max-width:768px) {
    .main-page section.our-services h2 {
        font-size: 3rem;
        line-height: 1
    }
}

.main-page section.our-services .grid {
    border-radius: var(--radius, 6px);
    background: #ffffff0f;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    padding: 1px;
    display: grid;
    overflow: hidden
}

@media (max-width:768px) {
    .main-page section.our-services .grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

.main-page section.our-services .grid .service-image {
    grid-template-rows: 1fr 1fr;
    grid-template-columns: 1fr;
    display: grid
}

@media (max-width:768px) {
    .main-page section.our-services .grid .service-image {
        grid-column: span 2;
        grid-template-rows: 1fr;
        grid-template-columns: 1fr 1fr
    }

    .main-page section.our-services .grid .service-image.main {
        height: 14rem
    }

    .main-page section.our-services .grid .service-image.main .service {
        aspect-ratio: 0;
        grid-column: span 2;
        height: 14rem
    }

    .main-page section.our-services .grid .service-image.main .image-wrapper {
        display: none
    }
}

.main-page section.our-services .grid .service-image .image-wrapper {
    aspect-ratio: 1;
    background-color: #000;
    width: 100%;
    overflow: hidden
}

.main-page section.our-services .grid .service-image .image-wrapper img {
    object-fit: cover;
    min-width: 100%;
    height: 100%
}

.main-page section.our-services .grid .service-image .service {
    background: #000;
    flex-direction: column;
    justify-content: space-between;
    align-items: start;
    padding: max(1rem, min(2vw, 2.5rem));
    transition: background .3s;
    display: flex
}

.main-page section.our-services .grid .service-image .service:not(.no-hover):hover {
    background: #f2f2f21a
}

.main-page section.our-services .grid .service-image .service:not(.no-hover):hover .number {
    color: #f2f2f2
}

.main-page section.our-services .grid .service-image .service:not(.no-hover):hover i[data-icon] {
    color: #b20000
}

@media (max-width:768px) {
    .main-page section.our-services .grid .service-image .service {
        aspect-ratio: 1;
        padding: 1.25rem
    }
}

.main-page section.our-services .grid .service-image .service .company-name {
    color: #fff;
    max-height: 2.5rem;
    display: flex
}

.main-page section.our-services .grid .service-image .service .company-name svg {
    width: fit-content;
    max-height: 2.5rem
}

@media (max-width:768px) {
    .main-page section.our-services .grid .service-image .service .company-name {
        max-height: 1.5rem
    }

    .main-page section.our-services .grid .service-image .service .company-name svg {
        width: fit-content;
        max-height: 1.5rem
    }
}

.main-page section.our-services .grid .service-image .service .label-muted {
    color: #f2f2f280;
    font-family: Montserrat, sans-serif;
    font-size: max(.6rem, min(1vw, 1.25rem));
    font-weight: 400;
    line-height: calc(1.4*max(.6rem, min(1vw, 1.25rem)));
    transition: color .3s ease-in-out
}

.main-page section.our-services .grid .service-image .service .label-muted .break {
    display: inline-block
}

@media (max-width:768px) {
    .main-page section.our-services .grid .service-image .service .label-muted {
        font-size: .8125rem;
        line-height: 1.4
    }
}

.main-page section.our-services .grid .service-image .service .number {
    color: #f2f2f21a;
    text-transform: uppercase;
    font-family: Montserrat, sans-serif;
    font-size: max(6rem, min(7vw, 9.375rem));
    font-weight: 700;
    transition: color .3s ease-in-out
}

@media (max-width:768px) {
    .main-page section.our-services .grid .service-image .service .number {
        font-size: 4.125rem;
        line-height: 3rem
    }
}

.main-page section.our-services .grid .service-image .service .label {
    align-items: end;
    gap: 1.88rem;
    display: flex
}

@media (max-width:768px) {
    .main-page section.our-services .grid .service-image .service .label {
        gap: .625rem
    }
}

.main-page section.our-services .grid .service-image .service .label .text {
    flex-direction: column;
    gap: max(.2rem, min(1vw, .88rem));
    display: flex
}

@media (max-width:768px) {
    .main-page section.our-services .grid .service-image .service .label .text {
        gap: .1rem
    }
}

.main-page section.our-services .grid .service-image .service .label .text .title {
    color: #f2f2f2;
    font-family: Montserrat, sans-serif;
    font-size: max(.6rem, min(1vw, 1.75rem));
    font-weight: 600
}

@media (max-width:768px) {
    .main-page section.our-services .grid .service-image .service .label .text .title {
        font-size: 1.25rem
    }
}

.main-page section.our-services .grid .service-image .service .label .text .title br {
    display: none
}

@media (max-width:768px) {
    .main-page section.our-services .grid .service-image .service .label .text .title br {
        display: inline-block
    }
}

.main-page section.our-services .grid .service-image .service .label .text .description {
    font-family: Montserrat, sans-serif;
    font-size: var(--font-size);
    font-weight: 400;
    line-height: calc(var(--font-size) * 1.4);
    color: #f2f2f2;
    --font-size: clamp(.6rem, 1vw, 1.25rem)
}

@media (max-width:768px) {
    .main-page section.our-services .grid .service-image .service .label .text .description {
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        align-self: stretch;
        font-size: .75rem;
        line-height: 1.5;
        display: -webkit-box;
        overflow: hidden
    }
}

.main-page section.our-services .grid .service-image .service .label i[data-icon] {
    color: #f2f2f2;
    min-width: max(1.75rem, min(3vw, 3.125rem));
    transition: color .3s ease-in-out;
    display: flex
}

@media (max-width:768px) {
    .main-page section.our-services .grid .service-image .service .label i[data-icon] {
        display: none
    }
}

.main-page section.our-cases {
    background: #fff;
    flex-direction: column;
    gap: 6.25rem;
    padding: 8.75rem 2.5rem;
    display: flex
}

@media (max-width:768px) {
    .main-page section.our-cases {
        gap: 3.75rem;
        padding: 6.25rem 1.25rem
    }
}

.main-page section.our-cases header {
    color: #000
}

@media (max-width:768px) {
    .main-page section.our-cases header .section-title {
        font-size: .9375rem
    }

    .main-page section.our-cases header .section-label {
        font-size: 2.625rem;
        line-height: 1.2
    }
}

.main-page section.our-cases header .title-tabs .tabs {
    flex-wrap: wrap;
    gap: 1rem .625rem;
    margin-top: max(1rem, min(3vw, 3.12rem));
    display: flex
}

@media (max-width:768px) {
    .main-page section.our-cases header .title-tabs .tabs {
        gap: .625rem;
        margin-top: 3.75rem
    }
}

.main-page section.our-cases header .title-tabs .tabs .tab {
    cursor: pointer;
    background: 0 0;
    border: 1px solid #0003;
    border-radius: 3.125rem;
    padding: .5rem 1.25rem;
    font-family: Montserrat, sans-serif;
    font-size: .9375rem;
    font-weight: 400;
    transition: all .2s
}

@media (max-width:768px) {
    .main-page section.our-cases header .title-tabs .tabs .tab {
        padding: .625rem 1rem;
        font-size: .875rem
    }
}

.main-page section.our-cases header .title-tabs .tabs .tab:hover {
    border-color: #00000080
}

.main-page section.our-cases .cases-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 1.875rem;
    display: grid
}

@media (max-width:768px) {
    .main-page section.our-cases .cases-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem
    }
}

.main-page section.our-cases .cases-grid .column {
    flex-direction: column;
    gap: 3.125rem;
    display: flex
}

@media (max-width:768px) {
    .main-page section.our-cases .cases-grid .column {
        gap: 1.25rem
    }
}

.main-page section.our-cases .cases-grid .column .case {
    flex-direction: column;
    gap: 1.25rem;
    text-decoration: none;
    display: flex
}

.main-page section.our-cases .cases-grid .column .case .image-wrapper {
    aspect-ratio: 821/1080;
    background: #e5e5e5;
    width: 100%;
    overflow: hidden
}

@media (max-width:768px) {
    .main-page section.our-cases .cases-grid .column .case .image-wrapper {
        aspect-ratio: 400/526 !important
    }
}

.main-page section.our-cases .cases-grid .column .case .image-wrapper img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    transition: transform .3s
}

.main-page section.our-cases .cases-grid .column .case:nth-child(2) .image-wrapper {
    aspect-ratio: 821/600
}

.main-page section.our-cases .cases-grid .column .case:nth-child(3) .image-wrapper {
    aspect-ratio: 821/800
}

.main-page section.our-cases .cases-grid .column .case .text {
    flex-direction: column;
    gap: .375rem;
    display: flex
}

@media (max-width:768px) {
    .main-page section.our-cases .cases-grid .column .case .text {
        gap: .5rem
    }
}

.main-page section.our-cases .cases-grid .column .case .text .name {
    color: #000;
    font-family: Montserrat, sans-serif;
    font-size: 1.375rem;
    font-weight: 600
}

@media (max-width:768px) {
    .main-page section.our-cases .cases-grid .column .case .text .name {
        font-size: 1.25rem
    }
}

.main-page section.our-cases .cases-grid .column .case .text .category {
    color: #00000080;
    font-family: Montserrat, sans-serif;
    font-size: 1.0625rem;
    font-weight: 400
}

@media (max-width:768px) {
    .main-page section.our-cases .cases-grid .column .case .text .category {
        font-size: 1rem
    }
}

.main-page section.our-cases .cases-grid .column .case:hover .image-wrapper img {
    transform: scale(1.02)
}

.main-page section.our-cases .cases-grid .column:nth-child(2) .case:first-child .image-wrapper {
    aspect-ratio: 821/600
}

.main-page section.our-cases .cases-grid .column:nth-child(2) .case:nth-child(2) .image-wrapper {
    aspect-ratio: 821/800
}

.main-page section.our-cases .cases-grid .column:nth-child(2) .case:nth-child(3) .image-wrapper {
    aspect-ratio: 821/1080
}

.main-page section.our-cases .cases-grid .column:nth-child(3) .case:first-child .image-wrapper {
    aspect-ratio: 821/800
}

.main-page section.our-cases .cases-grid .column:nth-child(3) .case:nth-child(2) .image-wrapper {
    aspect-ratio: 821/1080
}

.main-page section.our-cases .cases-grid .column:nth-child(3) .case:nth-child(3) .image-wrapper {
    aspect-ratio: 821/600
}

.main-page section.our-cases .all-cases {
    justify-content: center;
    align-items: center;
    gap: .25rem;
    padding-bottom: .25rem;
    text-decoration: none;
    display: flex
}

.main-page section.our-cases .all-cases span {
    color: #000;
    font-family: Montserrat, sans-serif;
    font-size: .9375rem;
    font-weight: 500
}

.main-page section.our-cases .all-cases i[data-icon] {
    color: #000;
    width: 1.25rem;
    display: flex
}

.main-page section.our-cases .all-cases:hover {
    opacity: .7
}

.main-page section.articles-about-us {
    background: #fff;
    border-top: 1px solid #0000001a;
    flex-direction: column;
    gap: 6.25rem;
    padding: 6.25rem 2.5rem 8.75rem;
    display: flex
}

@media (max-width:768px) {
    .main-page section.articles-about-us {
        gap: 2.5rem;
        padding: 3.75rem 1.25rem
    }
}

.main-page section.articles-about-us .articles-grid {
    grid-template-columns: .9fr 1fr 1fr .9fr;
    display: grid
}

@media (max-width:768px) {
    .main-page section.articles-about-us .articles-grid {
        grid-template-columns: 1fr;
        gap: 1.875rem
    }
}

.main-page section.articles-about-us .articles-grid .article-wrapper {
    border-bottom: none;
    margin-top: 0;
    padding-bottom: 0
}

@media (max-width:768px) {
    .main-page section.articles-about-us .articles-grid .article-wrapper {
        border-bottom: none;
        margin-top: 0;
        padding-bottom: 0
    }
}

.main-page section.articles-about-us .articles-grid .article-wrapper:nth-child(4n+1) .article {
    padding-left: 0
}

.main-page section.articles-about-us .articles-grid .article-wrapper:nth-child(4n+2) .article,
.main-page section.articles-about-us .articles-grid .article-wrapper:nth-child(4n+3) .article,
.main-page section.articles-about-us .articles-grid .article-wrapper:nth-child(4n+4) .article {
    padding-left: 2.5rem
}

@media (max-width:768px) {

    .main-page section.articles-about-us .articles-grid .article-wrapper:nth-child(4n+2) .article,
    .main-page section.articles-about-us .articles-grid .article-wrapper:nth-child(4n+3) .article,
    .main-page section.articles-about-us .articles-grid .article-wrapper:nth-child(4n+4) .article {
        padding-left: 0
    }
}

.main-page section.articles-about-us .articles-grid .article-wrapper:nth-child(-n+4) .article {
    border-top: none;
    margin-top: 0;
    padding-top: 0
}

.main-page section.articles-about-us .articles-grid .article-wrapper:nth-child(n+5) .article {
    border-top: 1px solid #0000001a;
    margin-top: 3.12rem;
    padding-top: 3.12rem
}

@media (max-width:768px) {
    .main-page section.articles-about-us .articles-grid .article-wrapper:nth-child(n+5) .article {
        border-top: none;
        margin-top: 0;
        padding-top: 0
    }
}

.main-page section.articles-about-us .articles-grid .article-wrapper:nth-child(4n) .article {
    border-right: none;
    margin-right: 0;
    padding-right: 0
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article {
    border-right: 1px solid #0000001a;
    flex-direction: column;
    gap: max(.9rem, min(1vw, 1.625rem));
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    text-decoration: none;
    display: flex;
    overflow: hidden
}

@media (max-width:768px) {
    .main-page section.articles-about-us .articles-grid .article-wrapper .article {
        border-right: none;
        gap: 1rem;
        padding-left: 0;
        padding-right: 0
    }
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article:hover .image-wrapper img {
    transform: scale(1.05)
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article:hover .content .link i[data-icon] svg {
    scale: 110%
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article .image-wrapper {
    aspect-ratio: 571/321;
    width: 100%;
    position: relative;
    overflow: hidden
}

@media (max-width:768px) {
    .main-page section.articles-about-us .articles-grid .article-wrapper .article .image-wrapper {
        aspect-ratio: 400/225
    }
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article .image-wrapper img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    transition: transform .3s
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article .image-wrapper .shadow {
    background: linear-gradient(#0000 50%, #000c 100%);
    align-items: flex-end;
    padding: 1.25rem;
    display: flex;
    position: absolute;
    inset: 0
}

@media (max-width:768px) {
    .main-page section.articles-about-us .articles-grid .article-wrapper .article .image-wrapper .shadow {
        padding: 1rem
    }
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article .image-wrapper .shadow .logos {
    gap: .75rem;
    display: flex
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article .image-wrapper .shadow .logos i[data-icon] {
    color: #fff;
    height: 1.875rem;
    display: flex
}

@media (max-width:768px) {
    .main-page section.articles-about-us .articles-grid .article-wrapper .article .image-wrapper .shadow .logos i[data-icon] {
        height: 1.5rem
    }
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article .image-wrapper .shadow .logos i[data-icon] svg {
    width: auto;
    height: 100%
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article .content {
    flex-direction: column;
    justify-content: space-between;
    gap: 3.125rem;
    margin-top: auto;
    display: flex
}

@media (max-width:768px) {
    .main-page section.articles-about-us .articles-grid .article-wrapper .article .content {
        gap: 1rem
    }
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article .content .text {
    flex-direction: column;
    gap: .625rem;
    display: flex
}

@media (max-width:768px) {
    .main-page section.articles-about-us .articles-grid .article-wrapper .article .content .text {
        gap: .5rem
    }
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article .content .text .heading {
    --font-size: clamp(.9rem, 1vw, 1.375rem);
    font-family: Montserrat, sans-serif;
    font-size: var(--font-size);
    font-weight: 600;
    line-height: calc(var(--font-size) * 1.2727);
    color: #000
}

@media (max-width:768px) {
    .main-page section.articles-about-us .articles-grid .article-wrapper .article .content .text .heading {
        font-size: 1.125rem;
        line-height: 1.4
    }
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article .content .text .description {
    --font-size: clamp(.7rem, 1vw, 1rem);
    -webkit-line-clamp: 4;
    line-clamp: 4;
    font-family: Montserrat, sans-serif;
    font-size: var(--font-size);
    font-weight: 400;
    line-height: calc(var(--font-size) * 1.5);
    color: #0009;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden
}

@media (max-width:768px) {
    .main-page section.articles-about-us .articles-grid .article-wrapper .article .content .text .description {
        -webkit-line-clamp: 3;
        line-clamp: 3;
        font-size: .875rem;
        line-height: 1.5
    }
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article .content .link {
    align-items: center;
    gap: .25rem;
    padding-bottom: .25rem;
    display: flex
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article .content .link span {
    color: #000;
    font-family: Montserrat, sans-serif;
    font-size: 1.1875rem;
    font-weight: 500
}

@media (max-width:768px) {
    .main-page section.articles-about-us .articles-grid .article-wrapper .article .content .link span {
        font-size: 1rem
    }
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article .content .link i[data-icon] {
    color: #000;
    width: 1.5625rem;
    max-height: 1.5625rem;
    display: flex
}

@media (max-width:768px) {
    .main-page section.articles-about-us .articles-grid .article-wrapper .article .content .link i[data-icon] {
        width: 1.25rem;
        max-height: 1.25rem
    }
}

.main-page section.articles-about-us .articles-grid .article-wrapper .article .content .link i[data-icon] svg {
    transition: scale .3s ease-in-out
}

.main-page section.company-today {
    background: #000;
    flex-direction: column;
    gap: 6.25rem;
    padding: 8.75rem 2.5rem;
    display: flex
}

@media (max-width:768px) {
    .main-page section.company-today {
        gap: 2.5rem;
        padding: 3.75rem 1.25rem
    }
}

@media (max-width:1200px) and (not (max-width:768px)) {
    .main-page section.company-today {
        gap: 4rem;
        padding-top: 4rem
    }
}

.main-page section.company-today .header {
    justify-content: space-between;
    gap: 2rem;
    display: flex
}

@media (max-width:768px) {
    .main-page section.company-today .header {
        flex-direction: column;
        gap: 1.5rem
    }
}

.main-page section.company-today .header .brand {
    align-items: center;
    gap: 4.375rem;
    display: flex
}

@media (max-width:768px) {
    .main-page section.company-today .header .brand {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem
    }
}

@media (max-width:1200px) and (not (max-width:768px)) {
    .main-page section.company-today .header .brand {
        gap: 1rem
    }
}

.main-page section.company-today .header .brand .company-brand {
    position: relative
}

.main-page section.company-today .header .brand .company-brand .company-name {
    color: #fff;
    gap: .33rem;
    display: flex
}

.main-page section.company-today .header .brand .company-brand .company-name svg {
    width: auto;
    height: 100%;
    min-height: calc(max(6rem, min(7vw, 9.375rem))/1.49254);
    max-height: 6.5rem
}

@media (max-width:768px) {
    .main-page section.company-today .header .brand .company-brand .company-name svg {
        min-height: 2.5rem
    }
}

.main-page section.company-today .header .brand .company-brand i[data-icon=copyright] {
    color: #fff;
    position: absolute;
    top: -1rem;
    right: -1rem
}

@media (max-width:768px) {
    .main-page section.company-today .header .brand .company-brand i[data-icon=copyright] {
        width: .75rem;
        height: .75rem;
        top: -.5rem;
        right: -.5rem
    }
}

.main-page section.company-today .header .brand .today {
    color: #f2f2f2;
    text-transform: uppercase;
    font-family: Mulish, sans-serif;
    font-size: max(2rem, min(5.6vw, 9.375rem));
    font-weight: 900;
    line-height: 1
}

@media (max-width:768px) {
    .main-page section.company-today .header .brand .today {
        font-size: 3rem
    }
}

.main-page section.company-today .header .description {
    --font-size: clamp(.6rem, .9vw, 1.0625rem);
    max-width: 26.5625rem;
    font-family: Montserrat, sans-serif;
    font-size: var(--font-size);
    font-weight: 400;
    line-height: calc(var(--font-size) * 1.53);
    color: #f2f2f280
}

@media (max-width:768px) {
    .main-page section.company-today .header .description {
        max-width: 100%;
        font-size: 1rem;
        line-height: 1.5
    }
}

.main-page section.company-today .stats {
    grid-template-columns: repeat(4, 1fr);
    display: grid;
    position: relative
}

@media (max-width:768px) {
    .main-page section.company-today .stats {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.25rem
    }
}

.main-page section.company-today .stats .lines {
    pointer-events: none;
    position: absolute;
    inset: 0
}

@media (max-width:768px) {
    .main-page section.company-today .stats .lines {
        display: none
    }
}

.main-page section.company-today .stats .lines img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.main-page section.company-today .stats .stat {
    aspect-ratio: 1;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: max(.7rem, min(1vw, 1.1875rem));
    display: flex;
    position: relative
}

@media (max-width:768px) {
    .main-page section.company-today .stats .stat {
        aspect-ratio: auto;
        border: 1px solid #ffffff1a;
        gap: .625rem;
        padding: 1.25rem
    }
}

.main-page section.company-today .stats .stat .value {
    align-items: flex-start;
    gap: .25rem;
    display: flex
}

.main-page section.company-today .stats .stat .value .number {
    color: #f2f2f2;
    text-transform: uppercase;
    font-family: Montserrat, sans-serif;
    font-size: max(5rem, min(8vw, 8.75rem));
    font-weight: 500;
    line-height: 1
}

@media (max-width:768px) {
    .main-page section.company-today .stats .stat .value .number {
        font-size: 3.75rem
    }
}

.main-page section.company-today .stats .stat .value .suffix {
    color: #b20000;
    font-family: Montserrat, sans-serif;
    font-size: max(1.25rem, min(4vw, 3.75rem));
    font-weight: 600;
    line-height: 1
}

@media (max-width:768px) {
    .main-page section.company-today .stats .stat .value .suffix {
        font-size: 1.5rem
    }
}

.main-page section.company-today .stats .stat .value .suffix-text {
    color: #f2f2f2;
    text-transform: uppercase;
    align-self: flex-end;
    margin-bottom: .5rem;
    font-family: Montserrat, sans-serif;
    font-size: max(2rem, min(4vw, 4.375rem));
    font-weight: 600;
    line-height: 1
}

@media (max-width:768px) {
    .main-page section.company-today .stats .stat .value .suffix-text {
        margin-bottom: .25rem;
        font-size: 1.5rem
    }
}

.main-page section.company-today .stats .stat .label {
    max-width: 20vw;
    font-family: Montserrat, sans-serif;
    font-size: var(--font-size);
    font-weight: 400;
    line-height: calc(var(--font-size) * 1.05263);
    color: #f2f2f299;
    text-align: center;
    --font-size: clamp(.7rem, 1vw, 1.1875rem)
}

@media (max-width:768px) {
    .main-page section.company-today .stats .stat .label {
        max-width: 100%;
        font-size: .875rem;
        line-height: 1.4
    }
}

.services-page {
    background: #fff
}

.services-page .services-hero {
    background: #000;
    padding: 16.25rem 2.5rem 8.75rem;
    position: relative
}

@media (max-width:768px) {
    .services-page .services-hero {
        padding: 7.5rem 1.25rem 3.75rem
    }
}

.services-page .services-hero .background {
    pointer-events: none;
    height: 100%;
    position: absolute;
    top: 0;
    left: 2.5rem;
    right: 2.5rem;
    overflow: hidden
}

@media (max-width:768px) {
    .services-page .services-hero .background {
        left: 1.25rem;
        right: 1.25rem
    }
}

.services-page .services-hero .background img {
    object-fit: cover;
    width: 100%;
    height: auto
}

.services-page .services-hero .inner {
    z-index: 1;
    gap: 7.5rem;
    margin: 0 auto;
    display: grid;
    position: relative
}

@media (max-width:768px) {
    .services-page .services-hero .inner {
        gap: 3.75rem
    }
}

.services-page .services-hero .title {
    gap: 1.25rem;
    display: grid
}

.services-page .services-hero .title .heading {
    max-width: 73rem
}

.services-page .services-hero .title .heading img {
    width: 100%;
    height: auto
}

@media (max-width:768px) {
    .services-page .services-hero .title .heading {
        max-width: 100%
    }
}

.services-page .services-hero .title .subtitle {
    color: #ffffff80;
    max-width: 59.5625rem;
    font-family: Montserrat, sans-serif;
    font-size: 1.0625rem;
    font-weight: 400;
    line-height: 1.625rem
}

@media (max-width:768px) {
    .services-page .services-hero .title .subtitle {
        max-width: 100%;
        font-size: .875rem;
        line-height: 1.375rem
    }
}

.services-page .services-hero .services-list {
    display: grid
}

.services-page .services-hero .service-block {
    border-top: 1px solid #ffffff1a;
    border-bottom: 1px solid #ffffff1a;
    grid-template-columns: .38fr .55fr .22fr;
    padding: 3.75rem 0;
    display: grid;
    position: relative;
    overflow: hidden
}

.services-page .services-hero .service-block:hover .service-header .name i[data-icon] {
    opacity: 1
}

@media (max-width:768px) {
    .services-page .services-hero .service-block {
        grid-template-columns: 1fr;
        gap: 2rem;
        padding: 2rem 0
    }
}

.services-page .services-hero .service-block .service-header {
    gap: 1.25rem;
    display: flex
}

@media (max-width:768px) {
    .services-page .services-hero .service-block .service-header {
        flex-direction: column;
        align-items: flex-start;
        gap: .5rem
    }
}

.services-page .services-hero .service-block .service-header .number {
    color: #f2f2f233;
    text-transform: uppercase;
    align-items: center;
    width: 4rem;
    height: 3.75rem;
    font-family: Montserrat, sans-serif;
    font-size: 1.875rem;
    font-weight: 400;
    display: flex
}

@media (max-width:768px) {
    .services-page .services-hero .service-block .service-header .number {
        width: auto;
        height: auto;
        font-size: 1.25rem
    }
}

.services-page .services-hero .service-block .service-header .name {
    color: #f2f2f2;
    align-items: end;
    height: fit-content;
    font-family: Montserrat, sans-serif;
    font-size: 3.125rem;
    font-weight: 500;
    display: flex
}

.services-page .services-hero .service-block .service-header .name i[data-icon] {
    color: #b20000;
    opacity: 0;
    transition: opacity .3s ease-in-out;
    display: flex
}

@media (max-width:768px) {
    .services-page .services-hero .service-block .service-header .name {
        font-size: 1.75rem
    }
}

.services-page .services-hero .service-block .service-info {
    gap: 2.5rem;
    max-width: 70%;
    display: grid
}

@media (max-width:768px) {
    .services-page .services-hero .service-block .service-info {
        gap: 1.5rem;
        max-width: 100%
    }
}

.services-page .services-hero .service-block .service-info .description {
    color: #f2f2f2;
    font-family: Montserrat, sans-serif;
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.75rem
}

@media (max-width:768px) {
    .services-page .services-hero .service-block .service-info .description {
        font-size: 1rem;
        line-height: 1.5rem
    }
}

.services-page .services-hero .service-block .service-info .tags {
    flex-wrap: wrap;
    gap: 1rem .625rem;
    display: flex
}

.services-page .services-hero .service-block .service-info .tags .tag {
    color: #fff;
    border: 1px solid #ffffff80;
    border-radius: 3.125rem;
    padding: .625rem .875rem;
    font-family: Montserrat, sans-serif;
    font-size: 1rem;
    font-weight: 400
}

@media (max-width:768px) {
    .services-page .services-hero .service-block .service-info .tags .tag {
        padding: .5rem .75rem;
        font-size: .875rem
    }
}

.services-page .services-hero .service-block .service-images {
    aspect-ratio: 3/4;
    border-left: 1px solid #ffffff1a;
    width: 100%;
    max-width: 30rem;
    position: absolute;
    top: 50%;
    right: 0;
    overflow: hidden;
    transform: translateY(-50%)
}

@media (max-width:768px) {
    .services-page .services-hero .service-block .service-images {
        display: none
    }
}

.services-page .services-hero .service-block .service-images img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.services-page .how-we-work {
    padding: 8.75rem 2.5rem 6.25rem
}

@media (max-width:768px) {
    .services-page .how-we-work {
        padding: 3.75rem 1.25rem 2.5rem
    }
}

.services-page .how-we-work .inner {
    justify-items: center;
    gap: 6.25rem;
    display: grid
}

@media (max-width:768px) {
    .services-page .how-we-work .inner {
        gap: 3rem
    }
}

.services-page .how-we-work header {
    width: 100%
}

.services-page .how-we-work header .title-columns {
    gap: 3.125rem;
    width: 100%;
    display: grid
}

@media (max-width:768px) {
    .services-page .how-we-work header .title-columns {
        gap: 1.5rem
    }
}

.services-page .how-we-work header .title-columns .columns {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 3.125rem;
    display: grid
}

@media (max-width:768px) {
    .services-page .how-we-work header .title-columns .columns {
        grid-template-columns: 1fr;
        gap: 1rem;
        max-width: 100%;
        margin-left: 0
    }
}

.services-page .how-we-work header .title-columns .columns p {
    color: #00000080;
    max-width: 28.18rem;
    font-family: Montserrat, sans-serif;
    font-size: 1.0625rem;
    font-weight: 400;
    line-height: 1.625rem
}

@media (max-width:768px) {
    .services-page .how-we-work header .title-columns .columns p {
        font-size: .875rem;
        line-height: 1.375rem
    }
}

.services-page .how-we-work .steps-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 1.875rem;
    width: 100%;
    display: grid
}

@media (max-width:768px) {
    .services-page .how-we-work .steps-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem
    }
}

.services-page .how-we-work .step-card {
    border: 1px solid #0000001a;
    border-radius: 1.875rem;
    flex-direction: column;
    gap: 9.375rem;
    height: 100%;
    padding: 2.5rem;
    display: flex
}

@media (max-width:768px) {
    .services-page .how-we-work .step-card {
        gap: 2rem;
        padding: 1.5rem
    }
}

.services-page .how-we-work .step-card .card-header {
    justify-content: space-between;
    align-items: flex-start;
    display: flex
}

.services-page .how-we-work .step-card .card-header .icon {
    width: 7.5rem;
    height: 7.5rem
}

@media (max-width:768px) {
    .services-page .how-we-work .step-card .card-header .icon {
        width: 4rem;
        height: 4rem
    }
}

.services-page .how-we-work .step-card .card-header .icon img {
    object-fit: contain;
    width: 100%;
    height: 100%
}

.services-page .how-we-work .step-card .card-header .step-number {
    color: #0000001a;
    text-transform: uppercase;
    font-family: Montserrat, sans-serif;
    font-size: 1.875rem;
    font-weight: 400;
    line-height: 1.875rem
}

@media (max-width:768px) {
    .services-page .how-we-work .step-card .card-header .step-number {
        font-size: 1.25rem;
        line-height: 1.25rem
    }
}

.services-page .how-we-work .step-card .card-content {
    align-content: end;
    gap: 1.625rem;
    display: grid
}

@media (max-width:768px) {
    .services-page .how-we-work .step-card .card-content {
        gap: 1rem
    }
}

.services-page .how-we-work .step-card .card-content .step-title {
    color: #000;
    text-transform: uppercase;
    border-bottom: 1px solid #0000001a;
    padding-bottom: 1rem;
    font-family: Montserrat, sans-serif;
    font-size: 1.375rem;
    font-weight: 600;
    line-height: 2rem
}

@media (max-width:768px) {
    .services-page .how-we-work .step-card .card-content .step-title {
        padding-bottom: .75rem;
        font-size: 1.125rem;
        line-height: 1.5rem
    }
}

.services-page .how-we-work .step-card .card-content .step-description {
    color: #0006;
    font-family: Montserrat, sans-serif;
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.75rem
}

@media (max-width:768px) {
    .services-page .how-we-work .step-card .card-content .step-description {
        font-size: .9375rem;
        line-height: 1.5rem
    }
}

.services-page .how-we-work .cta-button {
    mix-blend-mode: difference;
    background: #fff;
    justify-content: center;
    align-items: center;
    gap: .625rem;
    width: 25rem;
    height: 5rem;
    padding: 1.25rem 1.875rem;
    text-decoration: none;
    transition: opacity .3s;
    display: flex
}

@media (max-width:768px) {
    .services-page .how-we-work .cta-button {
        width: 100%;
        height: 3.5rem;
        padding: 1rem 1.5rem
    }
}

.services-page .how-we-work .cta-button:hover {
    opacity: .8
}

.services-page .how-we-work .cta-button span {
    color: #000;
    font-family: Montserrat, sans-serif;
    font-size: 1.125rem;
    font-weight: 400
}

@media (max-width:768px) {
    .services-page .how-we-work .cta-button span {
        font-size: 1rem
    }
}

.services-page .how-we-work .cta-button i {
    color: #000;
    width: 1.5rem;
    height: 1.5rem
}

.cases-page,
.cases-page section.header {
    flex-direction: column;
    gap: 6.25rem;
    display: flex
}

.cases-page section.header .title-cta {
    grid-template-columns: 1fr auto;
    display: grid
}

.cases-page section.header .title-cta .title-description {
    flex-direction: column;
    gap: 3.84rem;
    display: flex
}

.cases-page section.header .title-cta .title-description .description {
    color: #00000080;
    font-size: 1.0625rem;
    font-weight: 400;
    line-height: 1.625rem
}

.services-category-page {
    color: #000
}

.services-category-page .media-hero {
    color: #f2f2f2;
    background: #000;
    position: relative;
    overflow: hidden
}

.services-category-page .media-hero .background {
    pointer-events: none;
    position: absolute;
    inset: 0 2.5rem
}

@media (max-width:768px) {
    .services-category-page .media-hero .background {
        left: 1.25rem;
        right: 1.25rem
    }
}

.services-category-page .media-hero .background .line {
    background: #ffffff1a;
    position: absolute
}

.services-category-page .media-hero .background .vertical {
    width: 1px;
    height: 100%;
    top: 0
}

.services-category-page .media-hero .background .left {
    left: 0
}

.services-category-page .media-hero .background .middle {
    left: 83.125rem
}

@media (max-width:768px) {
    .services-category-page .media-hero .background .middle {
        display: none
    }
}

.services-category-page .media-hero .background .right {
    right: 0
}

.services-category-page .media-hero .background .horizontal {
    width: 100%;
    height: 1px;
    left: 0
}

.services-category-page .media-hero .background .top {
    top: 8.75rem
}

.services-category-page .media-hero .background .bottom {
    top: 91.25rem
}

@media (max-width:768px) {
    .services-category-page .media-hero .background .bottom {
        display: none
    }
}

.services-category-page .media-hero .content {
    z-index: 1;
    position: relative
}

.services-category-page .media-hero .title {
    max-height: 90vh;
    grid-template-columns: 1fr 1fr;
    justify-content: space-between;
    align-items: start;
    max-height: 90dvh;
    display: grid
}

@media (max-width:768px) {
    .services-category-page .media-hero .title {
        grid-template-columns: 1fr;
        gap: 5rem;
        max-height: none
    }
}

.services-category-page .media-hero .title .left {
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    display: flex
}

@media (max-width:768px) {
    .services-category-page .media-hero .title .left {
        gap: 5rem;
        min-height: auto
    }
}

.services-category-page .media-hero .title .left .text {
    gap: max(1rem, min(4vh, 3.75rem));
    display: grid
}

@media (max-width:768px) {
    .services-category-page .media-hero .title .left .text {
        gap: 1.62rem
    }
}

.services-category-page .media-hero .title .left .text h1 {
    color: #f2f2f2;
    text-transform: uppercase;
    gap: .625rem;
    display: grid
}

.services-category-page .media-hero .title .left .text h1 .intro {
    white-space: nowrap;
    font-family: Mulish, sans-serif;
    font-size: max(2rem, min(3vw, 5rem));
    font-style: italic;
    font-weight: 200;
    line-height: 101%
}

@media (max-width:768px) {
    .services-category-page .media-hero .title .left .text h1 .intro {
        white-space: normal;
        font-size: 3rem;
        line-height: 3.25rem
    }
}

.services-category-page .media-hero .title .left .text h1 .main {
    white-space: nowrap;
    font-family: Mulish, sans-serif;
    font-size: max(4rem, min(5vw, 9.375rem));
    font-weight: 900;
    line-height: 100%
}

@media (max-width:768px) {
    .services-category-page .media-hero .title .left .text h1 .main {
        white-space: normal;
        font-size: 4.5rem;
        line-height: 4.75rem
    }
}

.services-category-page .media-hero .title .left .text .description {
    color: #f2f2f280;
    max-width: 44rem;
    font-family: Montserrat, sans-serif;
    font-size: max(1rem, min(1vw, 1.25rem));
    font-weight: 400;
    line-height: 140%
}

@media (max-width:768px) {
    .services-category-page .media-hero .title .left .text .description {
        max-width: 100%;
        font-size: 1rem;
        line-height: 1.5rem
    }
}

.services-category-page .media-hero .title .left .cta-button {
    color: #000;
    mix-blend-mode: difference;
    background: #fff;
    grid-auto-flow: column;
    justify-content: center;
    align-items: center;
    gap: .625rem;
    width: 25rem;
    height: 5rem;
    padding: 1.25rem 1.875rem;
    text-decoration: none;
    transition: opacity .2s;
    display: grid
}

.services-category-page .media-hero .title .left .cta-button:hover {
    opacity: .8
}

.services-category-page .media-hero .title .left .cta-button span {
    font-family: Montserrat, sans-serif;
    font-size: 1.125rem;
    font-weight: 400
}

.services-category-page .media-hero .title .left .cta-button i {
    color: #000;
    width: 1.5rem;
    height: 1.5rem
}

@media (max-width:768px) {
    .services-category-page .media-hero .title .left .cta-button {
        width: 100%;
        height: 3.75rem
    }
}

.services-category-page .media-hero .title .right {
    flex-direction: column;
    justify-self: end;
    gap: max(.5rem, min(1vh, 2.5rem));
    max-width: max(40rem, min(50vw, 71rem));
    display: flex
}

@media (max-width:768px) {
    .services-category-page .media-hero .title .right {
        gap: 1.5rem;
        max-width: 100%
    }
}

.services-category-page .media-hero .title .right .image-wrapper {
    aspect-ratio: 70/40;
    background: #141414;
    width: 100%;
    height: max(10rem, min(20vw, 40rem));
    overflow: hidden
}

.services-category-page .media-hero .title .right .image-wrapper img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.services-category-page .media-hero .title .right .list {
    gap: max(0rem, min(.6vh, 1.625rem));
    display: grid
}

@media (max-width:768px) {
    .services-category-page .media-hero .title .right .list {
        order: -1;
        gap: 1rem
    }
}

.services-category-page .media-hero .title .right .list .type {
    border-bottom: 1px solid #ffffff1a;
    grid-template-columns: 1fr auto;
    align-items: center;
    padding: max(.25rem, min(1vh, .75rem)) 0;
    transition: border .3s ease-in-out;
    display: grid
}

@media (max-width:768px) {
    .services-category-page .media-hero .title .right .list .type {
        padding-top: 1rem;
        padding-bottom: 1rem
    }
}

.services-category-page .media-hero .title .right .list .type:hover {
    border-bottom: 1px solid #b20000
}

.services-category-page .media-hero .title .right .list .type .label {
    text-transform: uppercase;
    align-items: start;
    gap: .375rem;
    font-family: Montserrat, sans-serif;
    font-size: 1.375rem;
    font-weight: 500;
    line-height: 140%;
    display: flex
}

@media (max-width:768px) {
    .services-category-page .media-hero .title .right .list .type .label {
        font-size: 1rem;
        font-weight: 400;
        line-height: 1.625rem
    }
}

.services-category-page .media-hero .title .right .list .type .number {
    color: #ffffff4d;
    flex-shrink: 0;
    width: 2.1875rem;
    font-weight: 400
}

@media (max-width:768px) {
    .services-category-page .media-hero .title .right .list .type .number {
        width: 1.75rem
    }
}

.services-category-page .media-hero .title .right .list .type .name {
    color: #fff
}

.services-category-page .media-hero .title .right .list .type .icon {
    place-items: center;
    width: 3.5156rem;
    height: 3.5156rem;
    display: grid
}

.services-category-page .media-hero .title .right .list .type .icon i {
    color: #fff;
    width: 1.5rem;
    height: 1.5rem
}

@media (max-width:768px) {
    .services-category-page .media-hero .title .right .list .type .icon i {
        color: #b20000
    }

    .services-category-page .media-hero .title .right .list .type .icon {
        width: 1.9rem;
        height: 1.9rem
    }
}

.services-category-page .media-hero .trusted {
    border-top: 1px solid #ffffff1a;
    gap: 3.125rem;
    margin-top: 3.75rem;
    padding-top: 3.75rem;
    display: grid
}

@media (max-width:768px) {
    .services-category-page .media-hero .trusted {
        display: none
    }
}

.services-category-page .media-hero .trusted .label {
    color: #fff;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-family: Montserrat, sans-serif;
    font-size: .9375rem
}

.services-category-page .media-hero .trusted .logos {
    align-items: center;
    gap: 7.5rem;
    padding: 1rem 0;
    display: flex;
    position: relative
}

@media (max-width:768px) {
    .services-category-page .media-hero .trusted .logos {
        scrollbar-width: none;
        gap: 2.5rem;
        overflow-x: auto
    }

    .services-category-page .media-hero .trusted .logos::-webkit-scrollbar {
        display: none
    }
}

.services-category-page .media-hero .trusted .logos:before,
.services-category-page .media-hero .trusted .logos:after {
    z-index: 1;
    pointer-events: none;
    content: "";
    width: 25rem;
    position: absolute;
    top: 0;
    bottom: 0
}

.services-category-page .media-hero .trusted .logos:before {
    background: linear-gradient(90deg, #000, #0000);
    left: 0
}

.services-category-page .media-hero .trusted .logos:after {
    background: linear-gradient(270deg, #000, #0000);
    right: 0
}

.services-category-page .media-hero .trusted .logos .logo {
    color: #fff;
    flex-shrink: 0;
    align-items: center;
    height: 2.5rem;
    display: flex
}

.services-category-page .media-hero .trusted .logos .logo i {
    width: auto;
    height: 100%;
    display: block
}

.services-category-page .case-gallery {
    gap: 3.75rem;
    display: grid
}

.services-category-page .case-gallery .section-header {
    gap: .75rem;
    display: grid
}

.services-category-page .case-gallery .section-header h2 {
    color: #000;
    letter-spacing: -.01em;
    font-family: Montserrat, sans-serif;
    font-size: 2.625rem;
    font-weight: 600;
    line-height: 3rem
}

.services-category-page .case-gallery .cases-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.875rem;
    display: grid
}

@media (max-width:768px) {
    .services-category-page .case-gallery .cases-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem
    }
}

.services-category-page .case-gallery .cases-grid .column {
    gap: 1.875rem;
    display: grid
}

@media (max-width:768px) {
    .services-category-page .case-gallery .cases-grid .column {
        gap: 1rem
    }
}

.services-category-page .case-gallery .cases-grid .column .case-card {
    color: inherit;
    gap: 1rem;
    text-decoration: none;
    display: grid
}

.services-category-page .case-gallery .cases-grid .column .case-card .image-wrapper {
    aspect-ratio: var(--ratio, 821/665);
    background: #e8e8e8;
    border-radius: 1.25rem;
    overflow: hidden
}

.services-category-page .case-gallery .cases-grid .column .case-card .image-wrapper img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.services-category-page .case-gallery .cases-grid .column .case-card .text {
    gap: .375rem;
    display: grid
}

.services-category-page .case-gallery .cases-grid .column .case-card .text h3 {
    color: #000;
    font-family: Montserrat, sans-serif;
    font-size: 1.375rem;
    font-weight: 600
}

.services-category-page .case-gallery .cases-grid .column .case-card .text p {
    color: #00000080;
    font-family: Montserrat, sans-serif;
    font-size: 1.0625rem;
    font-weight: 400
}

.services-category-page .case-gallery .cases-grid .column .case-card.portrait {
    --ratio: 821 / 1080
}

.services-category-page .case-gallery .cases-grid .column .case-card.wide {
    --ratio: 821 / 600
}

.services-category-page .case-gallery .cases-grid .column .case-card.tall {
    --ratio: 821 / 1145
}

.services-category-page .case-gallery .more-link {
    color: #000;
    border-bottom: 1px solid #00000040;
    grid-auto-flow: column;
    align-items: center;
    gap: .75rem;
    width: fit-content;
    margin: 0 auto;
    padding: .75rem 1.25rem;
    text-decoration: none;
    display: inline-grid
}

.services-category-page .case-gallery .more-link span {
    font-family: Montserrat, sans-serif;
    font-size: 1.0625rem;
    font-weight: 500
}

.services-category-page .case-gallery .more-link i {
    color: #000;
    width: 1.25rem;
    height: 1.25rem
}

.services-subcategory-page header div.title {
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
    position: relative
}

.services-subcategory-page header div.title h1 {
    z-index: 2;
    color: #f2f2f2;
    text-align: center;
    text-transform: uppercase;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
    font-family: Mulish, sans-serif;
    font-size: 7.5rem;
    font-style: normal;
    font-weight: 800;
    line-height: 120%;
    position: relative
}

@media (max-width:768px) {
    .services-subcategory-page header div.title h1 {
        font-size: 3.25rem
    }

    .services-subcategory-page header div.title h1:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        text-align: left
    }

    .services-subcategory-page header div.title h1:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        text-align: right
    }
}

.services-subcategory-page header div.title i {
    z-index: 1;
    color: #b30000;
    display: flex;
    position: absolute;
    top: 0;
    right: -2rem
}

@media (max-width:768px) {
    .services-subcategory-page header div.title i {
        top: -.7rem;
        right: -.7rem
    }
}

.services-subcategory-page header div.title i svg {
    width: 3.9393rem;
    height: 3.75rem
}

@media (max-width:768px) {
    .services-subcategory-page header div.title i svg {
        width: 2.6263rem;
        height: 2.5rem
    }
}

.services-subcategory-page section:first-of-type {
    margin-top: 12.5rem
}

@media (max-width:768px) {
    .services-subcategory-page section:first-of-type {
        margin-top: 5rem
    }
}

.services-subcategory-page section.type-1 header h2 {
    color: #fff;
    font-family: Montserrat, sans-serif;
    font-size: 2.25rem;
    font-style: normal;
    font-weight: 500;
    line-height: 122%
}

@media (max-width:768px) {
    .services-subcategory-page section.type-1 header h2 {
        font-size: 1.3125rem;
        line-height: 152%
    }
}

.services-subcategory-page section.type-1 header h2 span {
    color: #ffffff4d;
    text-transform: uppercase;
    margin-right: 10rem;
    font-family: Montserrat, sans-serif;
    font-size: 1rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal
}

@media (max-width:768px) {
    .services-subcategory-page section.type-1 header h2 span {
        margin-right: 2rem
    }
}

.services-subcategory-page section.type-1 .content {
    flex-direction: column;
    gap: 9.75rem;
    margin-top: 5.25rem;
    display: flex
}

.services-subcategory-page section.type-1 .content .lead-preview {
    grid-template-columns: .7fr 1fr .4fr;
    display: grid
}

@media (max-width:768px) {
    .services-subcategory-page section.type-1 .content .lead-preview {
        grid-template-columns: 1fr;
        gap: 3.12rem
    }
}

.services-subcategory-page section.type-1 .content .lead-preview .lead {
    padding-right: 15.62rem
}

@media (max-width:768px) {
    .services-subcategory-page section.type-1 .content .lead-preview .lead {
        padding-right: 0
    }
}

.services-subcategory-page section.type-1 .content .lead-preview .lead .text {
    flex-direction: column;
    gap: 1.88rem;
    display: flex
}

.services-subcategory-page section.type-1 .content .lead-preview .lead .text p {
    color: #f2f2f2cc;
    font-family: Montserrat, sans-serif;
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 400;
    line-height: 140%
}

@media (max-width:768px) {
    .services-subcategory-page section.type-1 .content .lead-preview .lead .text p {
        font-size: 1.1875rem
    }
}

.services-subcategory-page section.type-1 .content .lead-preview .lead>a {
    width: 27.125rem;
    height: auto;
    margin-top: 3.75rem;
    padding: 1.25rem 1.875rem
}

@media (max-width:768px) {
    .services-subcategory-page section.type-1 .content .lead-preview .lead>a {
        width: 100%;
        margin-top: 3.12rem
    }
}

.services-subcategory-page section.type-1 .content .lead-preview .preview {
    min-width: 21.25rem
}

@media (max-width:768px) {
    .services-subcategory-page section.type-1 .content .lead-preview .preview {
        order: -1;
        min-width: 0
    }
}

.services-subcategory-page section.type-1 .content .lead-preview .preview .image-list {
    aspect-ratio: 21.25/27.95;
    width: 100%;
    overflow: hidden
}

.services-subcategory-page section.type-1 .content .lead-preview .preview .image-list img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    display: none
}

.services-subcategory-page section.type-1 .content .lead-preview .preview .image-list img.is-showing {
    display: block
}

.services-subcategory-page section.type-1 .content .lead-preview .preview .controls {
    justify-content: space-between;
    margin-top: 1.25rem;
    display: flex
}

.services-subcategory-page section.type-1 .content .lead-preview .preview .controls span {
    color: #ffffff4d;
    font-family: Montserrat, sans-serif;
    font-size: 1.0625rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.625rem
}

.services-subcategory-page section.type-1 .content .lead-preview .preview .controls .buttons {
    align-items: center;
    gap: .75rem;
    display: flex
}

.services-subcategory-page section.type-1 .content .lead-preview .preview .controls .buttons button {
    justify-content: center;
    align-items: center;
    width: 1.375rem;
    height: 1.375rem;
    display: flex
}

.services-subcategory-page section.type-1 .content .lead-preview .preview .controls .buttons button i {
    display: flex
}

.services-subcategory-page section.type-1 .content .lead-preview .preview .controls .buttons button:disabled {
    opacity: .2
}

.services-subcategory-page section.type-1 .content .lead-preview .preview .controls .buttons .next svg {
    transform: rotate(180deg)
}

.services-subcategory-page section.type-2 {
    grid-template-columns: repeat(3, 1fr);
    justify-content: space-between;
    gap: 2rem;
    margin-top: 12.5rem;
    display: grid
}

@media (max-width:768px) {
    .services-subcategory-page section.type-2 {
        grid-template-columns: 1fr;
        gap: 3.75rem;
        margin-top: 7.5rem
    }
}

.services-subcategory-page section.type-2 .step {
    flex-direction: column;
    max-width: 36.875rem;
    display: flex
}

.services-subcategory-page section.type-2 .step .number {
    color: #ffffff4d;
    text-transform: uppercase;
    margin-bottom: 1.25rem;
    font-family: Montserrat, sans-serif;
    font-size: 1.375rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal
}

@media (max-width:768px) {
    .services-subcategory-page section.type-2 .step .number {
        margin-bottom: 1.88rem
    }
}

.services-subcategory-page section.type-2 .step h2 {
    color: #fff;
    font-family: Montserrat, sans-serif;
    font-size: 2.25rem;
    font-style: normal;
    font-weight: 600;
    line-height: 2.75rem
}

@media (max-width:768px) {
    .services-subcategory-page section.type-2 .step h2 {
        font-size: 1.625rem;
        line-height: 100%
    }
}

.services-subcategory-page section.type-2 .step p {
    color: #ffffff80;
    margin-top: .25rem;
    font-family: Montserrat, sans-serif;
    font-size: 1.375rem;
    font-style: normal;
    font-weight: 500;
    line-height: 1.875rem
}

@media (max-width:768px) {
    .services-subcategory-page section.type-2 .step p {
        margin-top: .75rem;
        font-size: 1.125rem;
        font-weight: 400;
        line-height: 150%
    }
}

.services-subcategory-page section.type-3 {
    grid-template-columns: repeat(3, 1fr);
    justify-content: space-between;
    gap: 2rem;
    margin-top: 6.25rem;
    display: grid
}

@media (max-width:768px) {
    .services-subcategory-page section.type-3 {
        grid-template-columns: 1fr;
        margin-top: 5rem
    }
}

.services-subcategory-page section.type-3 .content {
    flex-direction: column;
    gap: 1.88rem;
    display: flex
}

.services-subcategory-page section.type-3 .content p {
    color: #f2f2f2cc;
    font-family: Montserrat, sans-serif;
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 400;
    line-height: 140%
}

@media (max-width:768px) {
    .services-subcategory-page section.type-3 .content p {
        font-size: 1.1875rem
    }
}

.services-subcategory-page section.type-4 {
    margin-top: 12.5rem
}

@media (max-width:768px) {
    .services-subcategory-page section.type-4 {
        margin-top: 7.5rem
    }
}

.services-subcategory-page section.type-4 header h2 {
    color: #fff;
    font-family: Montserrat, sans-serif;
    font-size: 2.25rem;
    font-style: normal;
    font-weight: 500;
    line-height: 122%
}

@media (max-width:768px) {
    .services-subcategory-page section.type-4 header h2 {
        font-size: 1.3125rem;
        line-height: 152%
    }
}

.services-subcategory-page section.type-4 header h2 span {
    color: #ffffff4d;
    text-transform: uppercase;
    margin-right: 10rem;
    font-family: Montserrat, sans-serif;
    font-size: 1rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal
}

@media (max-width:768px) {
    .services-subcategory-page section.type-4 header h2 span {
        margin-right: 2rem
    }
}

.services-subcategory-page section.type-4 .content {
    grid-template-columns: repeat(3, 1fr);
    margin-top: 3.75rem;
    display: grid
}

@media (max-width:768px) {
    .services-subcategory-page section.type-4 .content {
        grid-template-columns: 1fr;
        margin-top: 5rem
    }
}

.services-subcategory-page section.type-4 .content .steps {
    flex-direction: column;
    gap: 3.12rem;
    display: flex
}

.services-subcategory-page section.type-4 .content .steps .number {
    color: #ffffff4d;
    text-transform: uppercase;
    font-family: Montserrat, sans-serif;
    font-size: 1.375rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal
}

.services-subcategory-page section.type-4 .content .steps .title {
    color: #fff;
    margin-top: 1.25rem;
    font-family: Montserrat, sans-serif;
    font-size: 2.25rem;
    font-style: normal;
    font-weight: 600;
    line-height: 2.75rem
}

@media (max-width:768px) {
    .services-subcategory-page section.type-4 .content .steps .title {
        font-size: 1.625rem;
        line-height: 2.25rem
    }
}

.services-subcategory-page section.type-4 .content .steps .title .duration {
    color: #ffffff4d;
    font-family: Montserrat, sans-serif;
    font-size: 1.375rem;
    font-style: italic;
    font-weight: 400;
    line-height: 1.375rem
}

.services-subcategory-page section.type-4 .content .steps .description {
    color: #ffffff80;
    margin-top: .25rem;
    font-family: Montserrat, sans-serif;
    font-size: 1.375rem;
    font-style: normal;
    font-weight: 500;
    line-height: 1.875rem
}

@media (max-width:768px) {
    .services-subcategory-page section.type-4 .content .steps .description {
        font-size: 1.125rem;
        line-height: 2.25rem
    }
}

.services-subcategory-page section.faq {
    grid-template-columns: repeat(3, 1fr);
    margin-top: 12.5rem;
    display: grid;
    position: relative
}

@media (max-width:768px) {
    .services-subcategory-page section.faq {
        grid-template-columns: 1fr;
        margin-top: 7.5rem;
        padding-top: 4rem
    }
}

.services-subcategory-page section.faq .title {
    color: #ffffff4d;
    text-transform: uppercase;
    font-family: Montserrat, sans-serif;
    font-size: 1rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    position: absolute;
    top: 0;
    left: 0
}

.services-subcategory-page section.faq .faqs {
    flex-direction: column;
    gap: 1rem;
    display: flex
}

.services-subcategory-page section.faq .faqs .faq {
    background: #0d0d0d;
    border-radius: 3.125rem;
    flex-direction: column;
    width: 100%;
    height: fit-content;
    padding: .75rem .75rem .75rem 1.625rem;
    transition: all .15s ease-out, border-radius .6s;
    display: flex;
    overflow: hidden
}

.services-subcategory-page section.faq .faqs .faq::details-content {
    color: #f2f2f2cc;
    transition-behavior: allow-discrete;
    height: 0;
    font-family: Montserrat, sans-serif;
    font-size: 1.125rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.625rem;
    transition: height .3s, content-visibility .3s, margin .3s;
    overflow: hidden
}

.services-subcategory-page section.faq .faqs .faq[open],
.services-subcategory-page section.faq .faqs .faq:hover {
    background: #141414
}

.services-subcategory-page section.faq .faqs .faq[open] i,
.services-subcategory-page section.faq .faqs .faq:hover i {
    background: #b20000
}

.services-subcategory-page section.faq .faqs .faq[open] {
    border-radius: 2.25rem;
    padding-bottom: 1.625rem
}

.services-subcategory-page section.faq .faqs .faq[open]::details-content {
    height: auto;
    margin-top: .63rem
}

.services-subcategory-page section.faq .faqs .faq[open] i svg #plus-vert {
    transform: rotate(90deg)
}

.services-subcategory-page section.faq .faqs .faq summary {
    cursor: pointer;
    justify-content: space-between;
    align-items: center;
    list-style: none;
    display: flex
}

.services-subcategory-page section.faq .faqs .faq summary p {
    color: #f2f2f2;
    font-family: Montserrat, sans-serif;
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 500;
    line-height: 140%
}

.services-subcategory-page section.faq .faqs .faq summary i {
    background: #000;
    border-radius: 3.125rem;
    justify-content: center;
    align-items: center;
    min-width: 3.125rem;
    height: 3.125rem;
    transition: background .15s ease-out;
    display: inline-flex
}

.services-subcategory-page section.faq .faqs .faq summary i svg {
    width: 1rem
}

.services-subcategory-page section.faq .faqs .faq summary i svg path {
    transform-origin: 50%;
    transition: transform .15s ease-in-out
}

.contacts-page .title {
    margin-bottom: 9rem
}

@media (max-width:768px) {
    .contacts-page .title {
        margin-bottom: 5rem
    }

    .contacts-page .title .desktop {
        display: none
    }
}

@media (min-width:768px) {
    .contacts-page .title .mobile {
        display: none
    }
}

.contacts-page .grid {
    background: #0000001a;
    grid-template-rows: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    gap: 1px;
    padding: 1px;
    display: grid
}

@media (max-width:768px) {
    .contacts-page .grid {
        flex-direction: column;
        display: flex
    }
}

.contacts-page .grid>div {
    background: #f2f2f2;
    flex-direction: column;
    justify-content: space-between;
    min-height: 27rem;
    padding: 2.5rem;
    display: flex
}

@media (max-width:768px) {
    .contacts-page .grid>div {
        min-height: 17rem;
        padding: 1.56rem
    }
}

.contacts-page .grid>div.map {
    grid-template-columns: .8fr 1fr;
    padding: 0;
    display: grid
}

@media (max-width:768px) {
    .contacts-page .grid>div.map {
        grid-template-columns: 1fr
    }
}

.contacts-page .grid>div.map .address {
    flex-direction: column;
    justify-content: space-between;
    padding: 2.5rem;
    display: flex
}

@media (max-width:768px) {
    .contacts-page .grid>div.map .address {
        padding: 1.56rem
    }

    .contacts-page .grid>div.map .ymap {
        min-height: 20rem
    }
}

.contacts-page .grid>div .contacts-info {
    flex-direction: column;
    gap: 1.25rem;
    display: flex
}

.contacts-page .grid>div .contacts-info a {
    color: #000;
    gap: .64rem;
    font-family: Montserrat, sans-serif;
    font-size: 1.375rem;
    font-style: normal;
    font-weight: 500;
    line-height: 1.375rem;
    display: flex
}

.contacts-page .grid>div .socials {
    gap: 1.25rem;
    display: flex
}

.contacts-page .grid>div .socials a {
    color: #000;
    transition: color .15s ease-in-out
}

.contacts-page .grid>div .socials a:hover {
    color: #b20000
}

.contacts-page .grid>div .socials i {
    max-width: 2.25rem;
    display: flex
}

.contacts-page .grid>div .socials i svg {
    width: 2.25rem
}

.contacts-page .grid>div.project {
    justify-content: end;
    gap: 1.87rem
}

.contacts-page .grid>div .title {
    color: #00000080;
    font-family: Montserrat, sans-serif;
    font-size: 1rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1rem
}

.contacts-page .grid>div .text {
    color: #000;
    font-family: Montserrat, sans-serif;
    font-size: 1.375rem;
    font-style: normal;
    font-weight: 500;
    line-height: 150%
}

@media (max-width:768px) {
    .contacts-page .grid>div .text {
        font-size: 1.0625rem
    }
}

.about-page header {
    justify-content: space-between;
    display: flex
}

@media (max-width:768px) {
    .about-page header {
        flex-direction: column;
        gap: 3.12rem
    }

    .about-page header .title .desktop {
        display: none
    }
}

@media (min-width:768px) {
    .about-page header .title .mobile {
        display: none
    }
}

.about-page header .description {
    flex-direction: column;
    gap: 1.56rem;
    max-width: 35rem;
    display: flex
}

.about-page header .description p {
    color: #000;
    font-family: Montserrat, sans-serif;
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 400;
    line-height: 140%
}

.about-page section.company-description {
    margin-top: 5rem
}

@media (max-width:768px) {
    .about-page section.company-description {
        margin-top: 3.75rem
    }
}

.about-page section.company-description .hero-image-wrapper {
    position: relative;
    overflow: hidden
}

.about-page section.company-description .hero-image-wrapper img.hero {
    vertical-align: top;
    object-fit: cover;
    filter: grayscale();
    width: 100%;
    height: 100%
}

.about-page section.company-description .hero-image-wrapper .mask {
    pointer-events: none;
    object-fit: cover;
    filter: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-mask-image: none;
    mask-image: none
}

.about-page section.company-description .description-articles {
    grid-template-columns: 2fr 1.4fr;
    gap: 5rem;
    margin-top: 5rem;
    display: grid
}

@media (max-width:768px) {
    .about-page section.company-description .description-articles {
        grid-template-columns: 1fr
    }
}

.about-page section.company-description .description-articles .description {
    flex-direction: column;
    justify-content: space-between;
    gap: 3rem;
    display: flex
}

@media (max-width:768px) {
    .about-page section.company-description .description-articles .description {
        gap: 5rem
    }
}

.about-page section.company-description .description-articles .description h2 {
    color: #000;
    font-family: Montserrat, sans-serif;
    font-size: 2rem;
    font-style: normal;
    font-weight: 500;
    line-height: 131%
}

@media (max-width:768px) {
    .about-page section.company-description .description-articles .description h2 {
        font-size: 1.3125rem;
        line-height: 2rem
    }
}

.about-page section.company-description .description-articles .description h2 span {
    color: #0000004d;
    text-transform: uppercase;
    font-family: Montserrat, sans-serif;
    font-size: 1rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal
}

@media (max-width:768px) {
    .about-page section.company-description .description-articles .description h2 span {
        font-size: .875rem;
        font-weight: 400
    }
}

.about-page section.company-description .description-articles .description div.columns {
    grid-template-columns: repeat(3, 1fr);
    justify-content: space-between;
    gap: 1rem;
    display: grid
}

@media (max-width:768px) {
    .about-page section.company-description .description-articles .description div.columns {
        grid-template-columns: 1fr;
        gap: 3.12rem
    }
}

.about-page section.company-description .description-articles .description div.columns .column {
    flex-direction: column;
    gap: 1rem;
    display: flex
}

@media (max-width:768px) {
    .about-page section.company-description .description-articles .description div.columns .column {
        gap: .5rem
    }
}

.about-page section.company-description .description-articles .description div.columns .column h4 {
    color: #000;
    font-family: Montserrat, sans-serif;
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 600
}

.about-page section.company-description .description-articles .description div.columns .column p {
    color: #00000080;
    font-family: Montserrat, sans-serif;
    font-size: 1rem;
    font-style: normal;
    font-weight: 400;
    line-height: 137.5%
}

.about-page section.company-description .description-articles .articles .image-list a {
    display: none
}

.about-page section.company-description .description-articles .articles .image-list a.is-showing {
    display: block
}

.about-page section.company-description .description-articles .articles .image-list a .image-wrapper {
    aspect-ratio: 16/9;
    width: 100%;
    position: relative;
    overflow: hidden
}

.about-page section.company-description .description-articles .articles .image-list a .image-wrapper .overlay {
    background: linear-gradient(#0000, #000);
    flex-direction: column;
    justify-content: end;
    width: 100%;
    height: 100%;
    padding: 1.78rem;
    display: flex;
    position: absolute;
    top: 0;
    left: 0
}

@media (max-width:768px) {
    .about-page section.company-description .description-articles .articles .image-list a .image-wrapper .overlay {
        padding: .97rem
    }
}

.about-page section.company-description .description-articles .articles .image-list a .image-wrapper .overlay h4 {
    color: #fff;
    font-family: Montserrat, sans-serif;
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 600;
    line-height: 133.3%
}

@media (max-width:768px) {
    .about-page section.company-description .description-articles .articles .image-list a .image-wrapper .overlay h4 {
        font-size: 1.25rem
    }
}

.about-page section.company-description .description-articles .articles .image-list a .image-wrapper img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.about-page section.company-description .description-articles .articles .controls {
    justify-content: space-between;
    margin-top: 1.25rem;
    display: flex
}

.about-page section.company-description .description-articles .articles .controls span {
    color: #0000004d;
    font-family: Montserrat, sans-serif;
    font-size: 1.0625rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.625rem
}

.about-page section.company-description .description-articles .articles .controls .buttons {
    align-items: center;
    gap: .75rem;
    display: flex
}

.about-page section.company-description .description-articles .articles .controls .buttons button {
    justify-content: center;
    align-items: center;
    width: 1.375rem;
    height: 1.375rem;
    display: flex
}

.about-page section.company-description .description-articles .articles .controls .buttons button i {
    display: flex
}

.about-page section.company-description .description-articles .articles .controls .buttons button:disabled {
    opacity: .2
}

.about-page section.company-description .description-articles .articles .controls .buttons .next svg {
    transform: rotate(180deg)
}

.about-page section.company-team {
    margin-top: 6.25rem
}

@media (max-width:768px) {
    .about-page section.company-team {
        margin-top: 9rem
    }
}

.about-page section.company-team header {
    grid-template-columns: 1fr 2fr;
    gap: 20rem;
    display: grid
}

@media (max-width:768px) {
    .about-page section.company-team header {
        grid-template-columns: 1fr;
        gap: 1.88rem
    }
}

.about-page section.company-team header .title {
    color: #000;
    text-transform: uppercase;
    font-family: Montserrat, sans-serif;
    font-size: .9375rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal
}

.about-page section.company-team header h2 {
    color: #000;
    font-family: Montserrat, sans-serif;
    font-size: 3.4375rem;
    font-style: normal;
    font-weight: 600;
    line-height: 120%
}

@media (max-width:768px) {
    .about-page section.company-team header h2 {
        font-size: 2.25rem;
        line-height: 2.85rem
    }
}

.about-page section.company-team .team {
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 1.88rem;
    margin-top: 5rem;
    display: grid
}

@media (max-width:768px) {
    .about-page section.company-team .team {
        gap: .78rem;
        margin-top: 3.75rem
    }
}

.about-page section.company-team .team .add-member,
.about-page section.company-team .team .label-card {
    aspect-ratio: 38/45;
    border-radius: 1.875rem;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 9.375rem;
    display: flex;
    overflow: hidden
}

@media (max-width:768px) {

    .about-page section.company-team .team .add-member,
    .about-page section.company-team .team .label-card {
        aspect-ratio: 25/10;
        height: auto
    }
}

.about-page section.company-team .team .add-member {
    background: #e6e6e6;
    justify-content: center;
    align-items: center;
    transition: background .15s ease-in-out
}

.about-page section.company-team .team .add-member:hover {
    background: #0d0d0d
}

.about-page section.company-team .team .add-member:hover span {
    background: #1a1a1a
}

.about-page section.company-team .team .add-member span {
    color: #fff;
    background: #ccc;
    border-radius: 3.125rem;
    flex-direction: column;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    gap: .625rem;
    width: 6.25rem;
    height: 6.25rem;
    transition: background .15s ease-in-out;
    display: flex
}

.about-page section.company-team .team .add-member span i,
.about-page section.company-team .team .add-member span i svg {
    min-width: 2.125rem
}

.about-page section.company-team .team .label-card {
    padding: 2.5rem
}

@media (max-width:768px) {
    .about-page section.company-team .team .label-card {
        aspect-ratio: 0;
        padding: 1.25rem 0;
        overflow: auto
    }
}

.about-page section.company-team .team .label-card p {
    color: #000;
    text-align: right;
    font-family: Montserrat, sans-serif;
    font-size: 1.0625rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.625rem
}

.terms-page {
    flex-direction: column;
    align-items: flex-start;
    gap: 6.25rem;
    display: flex
}

.terms-page h1 {
    color: #000;
    text-transform: uppercase;
    font-family: Mulish, sans-serif;
    font-size: max(4rem, min(5vw, 9.375rem));
    font-style: normal;
    font-weight: 900;
    line-height: 100%
}

.terms-page div.columns {
    grid-template-columns: .4fr 1fr;
    display: grid
}

.terms-page div.columns:not(:first-of-type) {
    margin-top: 6.25rem
}

.terms-page div.columns span {
    color: #0000004d;
    text-transform: uppercase;
    font-family: Montserrat, sans-serif;
    font-size: 1rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal
}

.terms-page div.columns .content h2 {
    color: #000;
    margin-bottom: 3.75rem;
    font-family: Montserrat, sans-serif;
    font-size: 2.25rem;
    font-style: normal;
    font-weight: 500;
    line-height: 2.75rem
}

.terms-page div.columns .content p {
    color: #000c;
    font-family: Montserrat, sans-serif;
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.75rem
}

.terms-page div.columns .content p:not(:last-of-type) {
    margin-bottom: 1.88rem
}

.terms-page div.columns .content ol {
    counter-reset: step-counter;
    flex-direction: column;
    gap: 3.12rem;
    margin-top: 4.38rem;
    list-style-type: none;
    display: flex
}

.terms-page div.columns .content ol li {
    counter-increment: step-counter;
    padding-top: 3rem;
    position: relative
}

.terms-page div.columns .content ol li:before {
    color: #0000004d;
    text-transform: uppercase;
    content: "(" counter(step-counter) ")";
    font-family: Montserrat, sans-serif;
    font-size: 1.375rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    position: absolute;
    top: 0;
    left: 0
}

.terms-page div.columns .content ol li h3 {
    color: #000;
    font-family: Montserrat, sans-serif;
    font-size: 1.625rem;
    font-style: normal;
    font-weight: 500;
    line-height: 1.625rem
}

.terms-page div.columns .content ol li p {
    color: #00000080;
    margin-top: .5rem;
    font-family: Montserrat, sans-serif;
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.75rem
}