/* Scroll reveal animation (add .animate-on-scroll to elements) */
.animate-on-scroll {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.animate-on-scroll.in-view {
    opacity: 1;
    transform: translateY(0);
}

.animate-on-scroll.animate-on-scroll--delay-1 { transition-delay: 0.1s; }
.animate-on-scroll.animate-on-scroll--delay-2 { transition-delay: 0.2s; }
.animate-on-scroll.animate-on-scroll--delay-3 { transition-delay: 0.3s; }

/* Single project preloader + image skeletons */
.ds-preloader{
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: grid;
    place-items: center;
    padding: 24px;
    background: rgba(241, 245, 248, 1);
    opacity: 1;
    pointer-events: auto;
    transition: opacity 0.25s ease;
}
.ds-preloader.is-hidden{
    opacity: 0;
    pointer-events: none;
}
.ds-preloader__inner{
    display: grid;
    justify-items: center;
    gap: 14px;
}
.ds-preloader__spinner{
    width: 46px;
    height: 46px;
    border-radius: 999px;
    border: 3px solid rgba(0, 130, 250, 0.18);
    border-top-color: rgba(0, 130, 250, 1);
    animation: dsSpin 0.9s linear infinite;
}
.ds-preloader__text{
    font-family: Delight;
    font-weight: 600;
    font-size: 14px;
    line-height: 120%;
    color: rgba(32, 38, 45, 1);
    text-align: center;
}
@keyframes dsSpin{ to{ transform: rotate(360deg); } }

.ds-skeleton{
    position: relative;
    overflow: hidden;
    background: rgba(241, 245, 248, 1);
    /*border-radius: 18px;*/
    margin-bottom: -1px;
}
.ds-skeleton::before{
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
        rgba(241, 245, 248, 1) 0%,
        rgba(224, 231, 238, 1) 50%,
        rgba(241, 245, 248, 1) 100%);
    transform: translateX(-60%);
    animation: dsShimmer 1.15s ease-in-out infinite;
}
.ds-skeleton img{
    opacity: 0;
    transition: opacity 0.25s ease;
}
.ds-skeleton.is-loaded{
    background: transparent;
}
.ds-skeleton.is-loaded::before{
    display: none;
}
.ds-skeleton.is-loaded img{
    opacity: 1;
}
@keyframes dsShimmer{
    0%{ transform: translateX(-60%); }
    100%{ transform: translateX(60%); }
}

body {
    margin: 0;

    font-size: 18px;
    color: rgba(32, 38, 45, 1);
    -webkit-font-smoothing: antialiased;

    background-color: rgba(241, 245, 248, 1);
}

main {
    padding-top: 68px;
    background-image: url('img/hero/clouds.png');
    background-position: top center;
    background-repeat: no-repeat;
    background-size: 100% auto;
}

.page-main {
    padding-top: 68px;
    background-image: none;
}

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

img {
    user-select: none;
    -webkit-user-drag: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
}

p {
    margin: 0 0 10px;
}

a, button {
    all: unset;
    cursor: pointer;
}

/* Container
===================*/

.container__header {
    width: 100%;
    /*max-width: 1438px;*/
    margin: 0 auto;
    padding: 0 24px;
}

.container {
    width: 100%;
    max-width: 1210px;
    margin: 0 auto;
    padding: 0 15px;
}

/* Широкий контейнер для блока с карточками: 1440px, отступы по 8px */
.container--wide {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 8px;
}

/* Header
===================*/

header {
    height: 60px;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    background: rgba(255, 255, 255, 1);
    display: flex;
    align-items: center;
}

.header__nav-link {
    font-family: Delight;
    font-weight: 500;
    font-style: Semi Bold;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;

}

.header__inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
}

.header__nav {
    display: flex;
    gap: 80px;
    position: relative;
    right: -15px;
}

.header__nav-link {
    position: relative;
    display: inline-block;
}

.header__nav-link::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -4px;
    height: 2px;
    width: 0%;
    background: currentColor;
    transition: width 0.3s ease;
}

.header__nav-link:hover::after {
    width: 100%;
}

.header__btn {
    padding: 14px 25px;
    background: rgba(0, 130, 250, 1);
    border-radius: 100px;
    color: rgba(255, 255, 255, 1);
    font-family: 'Delight', sans-serif;
    font-weight: 600;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;    
    transition: all 0.3s ease;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

.header__btn img {
    transition: filter 0.3s ease;
}

.header__btn:hover {
    background: rgba(18, 23, 30, 1);
    color: rgba(255, 255, 255, 1);
}

.header__btn:hover img {
    /*filter: brightness(0);*/
}

.header__logo img {
    height: 22px;
    display: flex;
}

.header__burger {
    display: none;
    width: 50px;
    height: 26px;
    padding: 0;
    border-radius: 999px;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.header__burger-line {
    width: 50px;
    height: 2px;
    background: rgba(18, 23, 30, 1);
    border-radius: 999px;
    transition: transform 0.25s ease, opacity 0.25s ease;
}

.header__burger--active .header__burger-line:nth-child(1) {
    transform: translateY(5px) rotate(15deg);
}

.header__burger--active .header__burger-line:nth-child(2) {
    transform: translateY(-5px) rotate(-15deg);
}

.header-menu {
    position: fixed;
    left: 0;
    top: 68px;
    width: 100%;
    height: 0;
    background: rgba(255, 255, 255, 1);
    z-index: 99;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease, height 0.25s ease;
}

.header-menu__inner {
    position: relative;
    max-width: 1438px;
    margin: 0 auto;
    padding: 0px 20px;
    height: 100%;
    box-sizing: border-box;
}

.header-menu__nav {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    /* padding-left: 20px */
}

.header-menu__link {
    font-family: Delight;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 34px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;
    text-transform: uppercase;
    color: rgba(18, 23, 30, 1);
    position: relative;
    display: inline-block;
    cursor: pointer;
}

.header-menu__link::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -4px;
    height: 2px;
    width: 0;
    background: currentColor;
    transition: width 0.3s ease;
}

.header-menu__link:hover::after {
    width: 100%;
}

.header-menu__bottom {
    position: absolute;
    left: 24px;
    right: 24px;
    bottom: 30px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.header-menu__socials {
    display: flex;
    align-items: center;
    gap: 16px;
}

.header-menu__socials a img {
    filter: invert(1);
}

.header-menu__legal {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 14px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(18, 23, 30, 1);
    justify-content: space-between;
}

.header-menu__year {
    margin-right: 56px;
}

.header-menu__legal a {
    position: relative;
    display: inline-block;
    width: fit-content;
}

.header-menu__legal a::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -4px;
    height: 2px;
    width: 0;
    background: currentColor;
    transition: width 0.3s ease;
}

.header-menu__legal a:hover::after {
    width: 100%;
}

.header-menu--open {
    height: calc(100svh - 68px);
    opacity: 1;
    pointer-events: auto;
}

body.menu-open {
    overflow: hidden;
}

/* Hero
===================*/

.hero {
    /* padding-bottom: 48px; */
}

.hero__inner {
    text-align: center;
    margin-top: 22px;
    position: relative;
}

/* Сцена: старт от hero description, полоска и подписи */
.hero__stage {
    position: relative;
    min-height: 655px;
    margin-top: -25px;
}

/* Блок-тень за полоской: фон + filter blur, z-index под полоской */
.hero__bar-blur {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    width: 150px;
    height: 655px;
    z-index: -1;
    background: rgba(144, 202, 255, 1);
    filter: blur(177.4px);
    -webkit-filter: blur(177.4px);
}

/* Центральная полоса: как было, 150×655 по центру */
.hero__bar {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    width: 150px;
    height: 655px;
    z-index: 1;
    background: linear-gradient(180deg,
        rgba(40, 170, 255, 0) 0%,
        rgba(15, 145, 252, 1) 25%,
        rgba(0, 92, 250, 0.91) 50%,
        rgba(11, 141, 251, 1) 75%,
        rgba(40, 170, 255, 0) 100%);
    border-radius: 2px;
}

.hero__bar-arrow {
    position: absolute;
    left: 50%;
    bottom: 140px;
    transform: translateX(-50%);
    width: 58px;
    height: 31px;
    object-fit: contain;
    animation: bounce-arrow 2s infinite ease-in-out;
    cursor: pointer;
}

@keyframes bounce-arrow {
    0%, 100% {
        transform: translate(-50%, 0);
    }
    50% {
        transform: translate(-50%, 15px);
    }
}


.hero__mobile-arrow {
    display: none;
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
}

/* Подписи: цвет текста = градиент (background-clip: text) */
.hero__tag {
    position: absolute;
    display: inline-block;
    font-family: 'Delight', sans-serif;
    font-weight: 700;
    font-size: 51px;
    line-height: 100%;
    letter-spacing: 0;
    text-transform: uppercase;
    vertical-align: middle;
    white-space: nowrap;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.hero__tag--left {
    text-align: right;
    background-image: linear-gradient(90deg, #0082FA 0%, #90CAFF 100%);
}

.hero__tag--right {
    text-align: left;
    background-image: linear-gradient(90deg, #90CAFF 0%, #0082FA 100%);
}

/* Позиции под 1440px (X +2.5%). Слева: Strategy, AI-driven. Справа: Web Dev, Branding, Design */
.hero__tag--1 { right: 66.8%;  top: 13.68%; }   /* Strategy */
.hero__tag--2 { left: 70.41%;  top: 14.58%; }   /* Web Dev */
.hero__tag--3 { left: 62.05%;  top: 34.87%; }   /* Branding */
.hero__tag--4 { left: 81.41%;  top: 55.16%; }   /* Design */
.hero__tag--5 { right: 60.02%; top: 50.24%; }   /* AI-driven */

.hero__tag-short {
    display: none;
}

/* Кнопка: 70px под стрелкой (margin-top: 0, position + top: 70px) */
.hero__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 0;
    position: relative;
    top: -70px;
    padding: 16.5px 58px;
    background: rgba(0, 130, 250, 1);
    color: #fff;
    font-family: 'Delight', sans-serif;
    font-weight: 600;
    font-size: 16px;
    border-radius: 100px;
    cursor: pointer;
    transition: background 0.3s ease, color 0.3s ease;
    position: relative;
    z-index: 1;
}

.hero__btn:hover {
    background: rgba(32, 38, 45, 1);
    color: rgba(255, 255, 255, 1);
}

.hero__title {
    font-family: Delight;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 72px;
    leading-trim: CAP_HEIGHT;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: center;
    vertical-align: middle;
    text-transform: uppercase;
    max-width: 985px;
    padding: 0 20px;
    margin: 0 auto;
    color: rgba(34, 74, 141, 1)
}

.hero__description {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 25px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: center;
    vertical-align: middle;
    color: rgba(0, 130, 250, 1);
    margin-top: 24px;    
}

.hero__title-accent {
    font-family: 'Delight', sans-serif;
    font-weight: 600;
    font-size: 48px;
    leading-trim: cap;
    line-height: 100%;
    letter-spacing: 0;
    text-align: center;
    vertical-align: middle;
    text-transform: lowercase;
}

/* Referral hero (partnership intro)
===================*/

.referral-hero {
    padding-top: 24px;
    padding-bottom: 170px;
    overflow: hidden;
}

.referral-hero__card {
    background: rgba(255, 255, 255, 1);
    border-radius: 48px 0px 0px 48px;
    padding: 48px 0px 56px 56px;
    max-width: 100%;
    position: relative;
}

.referral-hero__card::after {
    content: '';
    position: absolute;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 1);
    border-radius: 0;
}

.referral-hero__meta {
    display: flex;
    align-items: center;
    gap: 20px;
    padding-bottom: 10px;
    padding-left: 12px;
    padding-right: 12px;
    position: relative
}

.referral-hero__meta::after {
    content: '';
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 0;
    height: 2px;
    background-image: url(img/referral/line.png);
    border-radius: 0;
}

.referral-hero__meta-line {
    display: block;
    width: 100%;
    max-width: 80px;
    height: 3px;
    background: rgba(0, 130, 250, 0.5);
    border-radius: 2px;
    flex-shrink: 0;
}

.referral-hero__meta-title {
    font-family: 'Delight', sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    color: rgba(32, 38, 45, 1);
}

.referral-hero__meta-year {
    margin-left: auto;
    font-family: 'Delight', sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    color: rgba(32, 38, 45, 1);
}

.referral-hero__title {
    font-family: Delight;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 84px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    
    max-width: 855px;
    margin-top: 77px;
    margin-bottom: 98px;
}

.referral-hero__title-accent {
    color: rgba(0, 130, 250, 1);
}

.referral-hero__text {
    font-family: Delight;
    font-weight: 400;
    font-style: Regular;
    font-size: 18px;
    leading-trim: NONE;
    line-height: 130%;
    letter-spacing: 0%;
    vertical-align: middle;
    
    margin: 0 0 127px;
    max-width: 560px;
}

.referral-hero__btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 24px;
    padding: 14px 25px;
    background: rgba(0, 130, 250, 1);
    border-radius: 100px;
    color: rgba(255, 255, 255, 1);
    font-family: 'Delight', sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 100%;
    transition: background 0.3s ease, color 0.3s ease;
    cursor: pointer;
}

.referral-hero__btn:hover {
    background: rgba(32, 38, 45, 1);
    color: rgba(255, 255, 255, 1);
}

.referral-hero__mobile-extra {
    display: none;
}

.referral-hero__btn img {
    width: 14px;
    height: auto;
    object-fit: contain;
}

.referral-hero__btn:hover img {
    filter: brightness(0) invert(1);
}

.about {
    padding-top: 200px;
    padding-bottom: 120px;
}

.about__inner {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 148px;
}

.about__action {
    display: flex;
    gap: 9px;
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    
}

.about__action img {
    display: flex;
}

.about__content {
    max-width: 830px;
    text-align: left;
}

.about__content img {
    height: 20px;
}

.about__content h2 {
    font-family: Delight;
    font-weight: 700;
    font-style: Bold;
    font-size: 56px;
    leading-trim: CAP_HEIGHT;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    margin-bottom: 30px;
    margin-top: 20px;;
}

.about__content p {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(32, 38, 45, 1);
    max-width: 600px;
}

/* Why us – scroll stack (from why-us.html)
===================*/

.why-us {
    position: relative;
    /* padding-top: 160px; */
    background: linear-gradient(180deg, #F1F5F8 0%, rgba(255, 255, 255, 0.972285) 61.83%, rgba(241, 245, 248, 0.960784) 100%);
    overflow: visible;
}

.why-us .container {
    display: block;
    max-width: inherit;
    padding: 0;
}

.why-us__pin {
    position: sticky;
    top: 80px;
    z-index: 3;
    min-height: 100vh;
    box-sizing: border-box;
}

.why-us__pin::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 120px;
    transform: translateX(-50%);
    width: 150px;
    height: 450px;
    /* min-height: 600px; */
    background: rgba(0, 130, 250, 1);
    filter: blur(177.4px);
    -webkit-filter: blur(177.4px);
    z-index: 0;
    pointer-events: none;
}

.why-us__pin::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 76px;
    transform: translateX(-50%);
    width: 150px;
    height: 600px;
    min-height: 600px;
    background: linear-gradient(
        180deg,
        rgba(40, 170, 255, 0) 0%,
        rgba(15, 145, 252, 1) 25%,
        rgba(0, 92, 250, 0.91) 50%,
        rgba(11, 141, 251, 1) 75%,
        rgba(40, 170, 255, 0) 100%
    );
    border-radius: 2px;
    z-index: 1;
    opacity: .5;
    pointer-events: none;
}

.why-us__bg {
    position: absolute;
    inset: 0;
    background-image: url(img/cta/clouds.png);
    background-size: cover;
    background-position: 0px -150px;
    background-repeat: no-repeat;
    z-index: 2;
    pointer-events: none;
    -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 55%, rgba(0, 0, 0, 0) 100%);
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 55%, rgba(0, 0, 0, 0) 100%);
}

.why-us__inner {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 63px;
    position: relative;
    z-index: 3;
    max-width: 1210px;
    margin: 0 auto;
}

.why-us__content img {
    height: 20px;
}

.why-us__action {
    display: flex;
    gap: 9px;
    font-family: Delight, inherit;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
}

.why-us__action img {
    display: flex;
}

.why-us__content {
    max-width: 845px;
    text-align: left;
}

.why-us__content h2 {
    font-family: Delight, inherit;
    font-weight: 700;
    font-size: 72px;
    line-height: 100%;
    margin: 20px 0 30px;
}

.why-us__content p {
    font-family: Delight, inherit;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    color: rgba(32, 38, 45, 1);
}

.why-us__slider-wrap {
    position: relative;
}

.why-us__pagination {
    display: none;
}

.why-us__stack {
    position: relative;
    z-index: 5;
    width: 564px;
    max-width: 100%;
    margin: 150px auto 0;
    display: flex;
    flex-direction: column;
    gap: 75vh;
    padding-bottom: 150px;
}

.why-us__card {
    position: sticky;
    top: 520px;
    width: 564px;
    max-width: 100%;
    margin: 0 auto;
    padding: 35px;
    box-sizing: border-box;
    border-radius: 23.12px;
    background: linear-gradient(135deg, rgba(0, 130, 250, 0.35), rgba(0, 130, 250, 0.1));
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.25);
    transform-origin: center bottom;
    will-change: transform;
}

.why-us__card h3 {
    font-family: Delight, inherit;
    font-weight: 600;
    font-size: 30px;
    line-height: 120%;
    margin: 0 0 16px;
}

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

.why-us__card li {
    position: relative;
    padding-left: 24px;
    font-family: Delight, inherit;
    font-weight: 500;
    font-size: 18px;
    line-height: 140%;
}

.why-us__card li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.5em;
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: rgba(18, 23, 30, 1)
}

.why-us__stat-header {
    display: flex;
    flex-direction: row;
    gap: 25px;
    margin-bottom: 40px;
    align-items: center;
}

.why-us__stat-value {
    font-family: Delight;
    font-weight: 400;
    font-style: Regular;
    font-size: 76.78px;
    leading-trim: CAP_HEIGHT;
    line-height: 120%;
    letter-spacing: 0%;
    vertical-align: bottom;
    text-transform: uppercase;
}

.why-us__stat-title {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 31.48px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: bottom;
    
}

.why-us__card--stat {
    padding: 38px 20px 35px 35px;
}

.why-us__card--stat .why-us__stat-header {
    margin-bottom: 20px;
}

.why-us__stat-title span {
    font-family: Delight, inherit;
    font-weight: 500;
    font-size: 23.62px;
    line-height: 100%;
    margin-bottom: 30px;
}

.why-us__stat-bar {
    position: relative;
    width: 100%;
    height: 70px;
    border-radius: 999px;
    background: rgba(232, 246, 255, 1);
    overflow: hidden;
}

.why-us__stat-bar-fill {
    height: 100%;
    width: 100%;
    border-radius: 999px;
    background: rgba(0, 130, 250, 1);
}

.why-us__stat-bar-stripes {
    width: 100%;
    height: 100%;
    background-image: repeating-linear-gradient(-45deg, rgba(232, 246, 255, 1) 0, rgba(232, 246, 255, 1) 20px, transparent 20px, transparent 25px);
}

.about__cards {
    padding-bottom: 200px;
}

.about__cards-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 4px;
}

.about__card {
    flex: 1;
    padding: 28px 30px;
    display: flex;
    flex-direction: column;
    gap: 30px;
    border-radius: 18px;
    background: rgba(0, 130, 250, 0.4);
    border: 1px solid rgba(153, 205, 253, 1);
    transform: translateY(40px);
    transition: transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.about__card.is-visible {
    transform: translateY(0);
}

.about__card-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.about__card-top-content {
    margin-right: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 3px;
}

.about__card-top-content span {
    width: 8px;
    height: 8px;
    border-radius: 100%;
    background: rgba(255, 255, 255, 1);
}

.about__card-top-content span.active {
    background: rgba(32, 38, 45, 1);
}

.about__card-top-number {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 12px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: -0.5px;
    vertical-align: middle;
}

.about__card-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

.about__card-bottom-title {
    display: flex;
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 18px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
}

.about__card-bottom-icon {
    width: 51px;
    height: 51px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 7px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.1));
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.4);
    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.1);
}

.about__card-bottom-icon img {
    width: 24px;
    height: 24px;
    object-fit: contain;
}
.services {
    padding: 70px 120px;
    background: rgba(20, 34, 54, 1);
    color: rgba(255, 255, 255, 1);
    border-radius: 25px;
    margin: 0 8px;
    margin-bottom: 200px;
}

.services--referral {
    background: rgba(50, 88, 143, 1);
}

.services--referral .services__header--left {
    visibility: hidden;
}

.services--referral .services__list {
    padding-bottom: 0;
    position: relative;
}

.services--referral .services__action {
    display: none;
}

.services__header {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    align-items: flex-start;
    margin-bottom: 100px;
}

.services__header--left {
    display: flex;
    gap: 9px;
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
}

.services__header--left img {
    display: flex;
}

.services__header--left-mobile {
    display: none;
}

.services__header--right h2 {
    font-family: Delight;
    font-weight: 700;
    font-style: Bold;
    font-size: 120px;
    leading-trim: CAP_HEIGHT;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    margin-bottom: 30px;    
}

.services__header--right p {
    font-family: Delight;
    font-weight: 500;
    font-style: Semi Bold;
    font-size: 20px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    max-width: 544px;    
}

.services__list {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding-bottom: 50px;
}

.services__item {
    padding: 20px 0px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 40px;
    align-items: start;
    cursor: pointer;
    position: relative;
    border-bottom: 1px solid rgba(255, 255, 255, 1);
    transition: grid-template-columns 0.4s ease, padding 0.35s ease;
    min-width: 0;
    max-width: 100%;
}

.services__item.active {
    grid-template-columns: auto minmax(0, 13.2%) minmax(0, 30.8%) minmax(0, 33%) auto;
    padding-bottom: 70px;
}

.services__item-body {
    display: contents;
}

.services__item::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 83px;
    height: 1px;
    background: rgba(20, 34, 54, 1);
    transition: width 0.35s ease;
}

.services--referral .services__item::before {
    background: rgba(50, 88, 143, 1);
}

.services__item.active::before {
    width: 0px;
}

.services__item-number {
    margin-right: 26px;
    margin-top: 0px;
    width: 43px;
    height: 100%;
    display: flex;
    align-items: center;
    transition: margin-top 0.3s ease, align-items 0.3s ease;
}

.services__item.active .services__item-number {
    margin-top: 20px;
    align-items: flex-start;
}

.services__item-img {
    display: none;
}

.services__item.active .services__item-img {
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 0;
}

.services__item-img img {
    width: 80px;
    height: 80px;
    position: relative;
    opacity: 0;
}

.services__item-img img:nth-child(1) {
    right: -40px;
    z-index: 1;
}

.services__item-img img:nth-child(2) {
    z-index: 2;
}

.services__item-img img:nth-child(3) {
    right: 40px;
    z-index: 2;
}

.services__item.active .services__item-img img {
    animation: servicesSimpleFadeIn 0.5s ease 0.15s forwards;
}

.services__item-title {
    margin-bottom: 0px;
    font-family: Delight;
    transition: margin-bottom 0.3s ease;
    font-weight: 500;
    font-style: Medium;
    font-size: 24px;
    leading-trim: NONE;
    line-height: 120%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(241, 245, 248, 1);
}

.services__item.active .services__item-title {
    margin-bottom: 20px;
}

.services__item-content {
    height: 100%;
    display: flex;
    align-items: center;
    min-width: 0;
}

.services__item.active .services__item-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.services__item .services__item-content .services__item-description {
    display: none;
}

.services__item-description {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(165, 165, 165, 1);
    transition: opacity 0.35s ease;
}

.services__item.active .services__item-content .services__item-description {
    display: block;
    opacity: 0;
    transform: translateY(10px);
    animation: servicesDescIn 0.5s ease 0.15s forwards;
}

.services__item .services__item-skills {
    display: none;
}

.services__item.active .services__item-skills {
    display: block;
    min-width: 0;
}

.services__item-skills-title {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 12px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    margin-bottom: 18px;
    color: rgba(165, 165, 165, 1);
}

.services__item-skills-list {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.services__item-skills-list span {
    padding: 8px 12px;
    color: rgba(32, 38, 45, 1);
    background: rgba(241, 245, 248, 1);
    border-radius: 100px;
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 11px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    opacity: 0;
}

.services__item.active .services__item-skills-list span {
    animation: servicesSimpleFadeIn 0.5s ease 0.15s forwards;
}

.service__item-btn {
    width: 46px;
    height: 46px;
    border-radius: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 1);
    transition: transform 0.35s ease, box-shadow 0.3s ease;
}

.services__item.active .service__item-btn {
    transform: scale(1.08);
}

.service__item-btn span {
    width: 16px;
    height: 2px;
    background: rgba(255, 255, 255, 1);
    display: flex;
    position: absolute;
    transition: transform 0.35s ease;
}

.service__item-btn span:last-child {
    transform: rotate(90deg);
}

.services__item.active .service__item-btn span:last-child {
    transform: rotate(0deg);
}

.services__action-btn {
    padding: 16.5px 48px;
    background: rgba(255, 255, 255, 1);
    font-family: Delight;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 20px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(18, 23, 30, 1);
    border-radius: 50px;
    transition: background 0.3s ease, color 0.3s ease;
    display: flex;
    align-items: center;
    width: fit-content;
    justify-content: center;
    margin: 0 auto;
}

.services__action-btn:hover {
    background: rgba(0, 130, 250, 1);
    color: rgba(255, 255, 255, 1);
}

@keyframes servicesSimpleFadeIn {
    to {
        opacity: 1;
    }
}

@keyframes servicesDescIn {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* Projects
===================*/

.projects {
    margin-bottom: 200px;
    margin-top: 100px;
}

.projects__title {
    margin-bottom: 120px;
    font-family: Delight;
    font-weight: 700;
    font-style: Bold;
    font-size: 72px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(18, 23, 30, 1);
}

.projects__inner {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px 24px;
}

.projects__header {
    padding: 16.5px 24px;
    background: rgba(255, 255, 255, 1);
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 18px;
    margin-bottom: 8px;
}

.projects__header div {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 20px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;

}

.projects__header span {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 12px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: -0.5px;
    text-align: right;
    vertical-align: middle;
    margin-left: 6px;
}

.projects__cover {
    max-height: 480px;
    overflow: hidden;
    border-radius: 18px;
}

.projects__cover img {
    object-fit: cover;
    height: 100%;
    display: flex;
    width: 100%;
    transition: transform 0.4s ease;
    transform: scale(1.02);
}

.projects__block:hover .projects__cover img {
    transform: scale(1.06);
}

.projects__all-btn-wrap {
    display: none;
}

/* Partners
===================*/

.partners_header--left {
    display: flex;
    gap: 9px;
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    align-items: center;
}
.partners_header--left img {
    display: flex;
}

.partners_header {
    display: flex;
    gap: 122px;
    margin-bottom: 120px;
}

.partners_opinions {
    margin-bottom: 150px;
}

.partners_opinions__title {
    font-family: Delight;
    font-weight: 700;
    font-style: Bold;
    font-size: 72px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
}

.partners_opinions__inner {
    display: flex;
    gap: 4px;
    align-items: stretch;
}

.partners_opinions__item {
    width: 338px;
}

.partners_opinions__card {
    padding: 30px;
    background: rgba(255, 255, 255, 1);
    border-radius: 18px;
    display: flex;
    flex-direction: column;
    gap: 67px;
    height: 100%;
    justify-content: space-between;
}

.partners_opinions__rate {
    display: flex;
    gap: 26px;


}

.partners_opinions__rate-text {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(165, 165, 165, 1)
}

.partners_opinions__rate-item {
    font-family: "Google Sans", sans-serif;
    font-weight: 600;
    font-style: Medium;
    font-size: 56px;
    leading-trim: CAP_HEIGHT;
    line-height: 80%;
    letter-spacing: -3px;
    vertical-align: middle;

}

.partners_opinions__rate-item span {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(125, 125, 125, 1);
    position: relative;
    top: 7px;
}

.partners_opinions__rate_footer {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.partners_opinions__rate_footer-img {
    margin-bottom: 22px;
    display: flex;
    height: 22px;
}

.partners_opinions__rate_footer-stars {
    margin-bottom: 6px;
}

.partners_opinions__rate_footer span {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 12px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(125, 125, 125, 1)
}

.partners_review_header {
    padding: 30px;
    background: rgba(255, 255, 255, 1);
    border-radius: 18px;
    display: flex;
    justify-content: space-between;
    gap: 16px;
}

.partners_review_header-logo {
    width: 46px;
    height: 46px;
    display: flex;
    border-radius: 7px;
    object-fit: cover;
}

.partners_review_header {
    padding: 30px;
    background: rgba(255, 255, 255, 1);
    border-radius: 18px;
    display: flex;
    justify-content: flex-start;
    gap: 16px;
    align-items: center;
}

.partners_review_header div { 
    font-family: Delight;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 18px;
    leading-trim: NONE;
    line-height: 120%;
    letter-spacing: 0px;
    vertical-align: middle;
    
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    gap: 2px;
}

.partners_review_header span { 
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 12px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(125, 125, 125, 1)
}

.partners_review_header-stars {
    display: none;
    flex-shrink: 0;
    object-fit: contain;
}

.partners_review_text {
    padding: 30px;
    background: rgba(255, 255, 255, 1);
    border-radius: 18px;
    margin-top: 4px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
}

.partners_review_text span {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 24px;
    leading-trim: NONE;
    line-height: 120%;
    letter-spacing: 0px;
    vertical-align: middle;

}

.partners_opinion_stats {
    padding: 40px;
    background-color: rgba(255, 255, 255, 1);
    border-radius: 18px;

    display: flex;
    flex-direction: column;
    gap: 24px;
    justify-content: center;
    align-items: center;
}


.partners_opinion_stats-circle {
    width: 108px;
    height: 108px;
    border-radius: 100%;
    background-color: rgb(255, 255, 255);
    border: 16px solid rgba(0, 130, 250, 1);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 24px;
    leading-trim: NONE;
    line-height: 120%;
    letter-spacing: 0px;
    text-align: center;
    vertical-align: middle;
    
}


.partners_opinion_stats_text {
    max-width: 214px;
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 18px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: center;
    vertical-align: middle;

}

.partners_opinion_stats_text span {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 12px;
    leading-trim: NONE;
    line-height: 120%;
    letter-spacing: 0px;
    text-align: center;
    vertical-align: middle;
    color: rgba(125, 125, 125, 1);
    margin-top: 8px;
    display: flex;
}

/* CTA
===================*/

.cta {
    position: relative;
    padding-top: 169px;
    padding-bottom: 293px;

    background: linear-gradient(180deg, #F1F5F8 0%, rgba(255, 255, 255, 0.972285) 61.83%, rgba(241, 245, 248, 0.960784) 100%);
}

/* Тень (блюр) за центральной полосой */
.cta::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 96px;
    transform: translateX(-50%);
    width: 150px;
    height: 333px;
    background: rgba(0, 130, 250, 1);
    filter: blur(177.4px);
    -webkit-filter: blur(177.4px);
    z-index: 0; /* самый задний слой после фона секции */
}

/* Центральная вертикальная полоса */
.cta::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 96px;
    transform: translateX(-50%);
    width: 150px;
    height: 500px;
    background: linear-gradient(
        180deg,
        rgba(40, 170, 255, 0) 6.73%,
        #0F91FC 35.37%,
        rgba(0, 92, 250, 0.91) 50.48%,
        #0B8DFB 66.07%,
        rgba(40, 170, 255, 0) 100%
    );
    border-radius: 2px;
    z-index: 1; 
    opacity: .5;
}

/* Слой с облаками над полосой, но под контентом */
.cta__bg {
    position: absolute;
    inset: 0;
    background-image: url('../assets/img/cta/clouds.png');
    background-size: cover;
    background-position: bottom;
    background-repeat: no-repeat;
    z-index: 2;
    pointer-events: none;
    -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 95%, rgba(0, 0, 0, 0) 100%);
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 95%, rgba(0, 0, 0, 0) 100%);
}

.cta__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 3; /* контент над облаками */
}

.cta__inner h2 {
    font-family: Delight;
    font-weight: 700;
    font-style: Bold;
    font-size: 56px;
    leading-trim: CAP_HEIGHT;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: center;
    vertical-align: middle;
    color: rgba(18, 23, 30, 1);
    margin-bottom: 20px;
}

.cta__inner p {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 24px;
    leading-trim: NONE;
    line-height: 120%;
    letter-spacing: 0px;
    text-align: center;
    vertical-align: middle;
    margin-bottom: 30px;
    max-width: 700px;
}

.cta__inner a {
    padding: 16.5px 58px;
    background: rgba(255, 255, 255, 1);
    font-family: Delight;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 20px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(18, 23, 30, 1);
    border-radius: 100px;
    transition: all 0.3s ease;
}

.cta__inner a:hover {
    background: rgba(0, 130, 250, 1);   /* фон при ховере */
    color: rgba(255, 255, 255, 1);     /* текст при ховере */
}

/* Form
===================*/

.form__inner {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 4px;
}

.form {
    padding: 80px 0px;
    background: #F1F5F8;
}

.page-main .form {
    padding-top: 0;
}

.form_left {
    display: flex;
    flex-direction: column;
    gap: 56px;
    padding: 40px;
    background: rgba(0, 130, 250, 1);
    flex: 0 0 42.45%;
    max-width: 42.45%;
    border-radius: 18px;
    justify-content: space-between;
}

.form_right {
    flex: 0 0 57.55%;
    max-width: 57.55%;
}

.digitall-setter-founder {
    display: flex;
    gap: 26px
}

.digitall-setter-founder img {
    width: 58px;
    height: 58px;
    object-fit: cover;
    border-radius: 100%;
}

.digitall-setter-founder-content {
    display: flex;
    flex-direction: column;
    gap: 4px;
    justify-content: center;
}

.digitall-setter-founder-name {
    font-family: Delight;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 28px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(255, 255, 255, 1);
}

.digitall-setter-founder-position {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 18px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(255, 255, 255, 1);
}

.digitall-setter-founder-quote {
    font-family: Delight;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 30px;
    leading-trim: CAP_HEIGHT;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(241, 245, 248, 1);
}

.digitall-setter-founder-quote-text {
    display: flex;
    flex-direction: column;
    gap: 14px;
    color: rgba(241, 245, 248, 1);
}

.digitall-setter-founder-quote-text-quote {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 25px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;

}

.digitall-setter-founder-quote-text-author {
    font-family: Delight;
    font-weight: 400;
    font-style: Regular;
    font-size: 18px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;

}

.digitall-setter-founder-contact-title {
    margin-bottom: 4px;
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 14px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(241, 245, 248, 1);
}

.digitall-setter-founder-contact {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.digitall-setter-founder-contact-item {
    padding: 10px 16px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 100px;
    display: flex;
    align-items: center;
    position: relative;
    gap: 10px;
    color: rgba(241, 245, 248, 1);
}

.digitall-setter-founder-contact-button {
    position: absolute;
    right: 16px;
    display: flex;
}

.form_right {
    padding: 40px;
    background: rgba(255, 255, 255, 1);
    border-radius: 18px;
    overflow: hidden;
}

.form_right-logo {
    height: 20px;
    margin-bottom: 12px;
}

.ds-form-panels {
    position: relative;
    /*min-height: 520px;*/
    /*margin-top: 38px;*/
}

.ds-form-panel {
    transition: opacity 0.45s ease, transform 0.45s ease, visibility 0.45s ease;
}

.ds-form-panel--form {
    opacity: 1;
    transform: translateY(0);
}

.ds-form-panel--success {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    opacity: 0;
    transform: translateY(24px);
    visibility: hidden;
    pointer-events: none;
}

.form_right--success .ds-form-panel--form {
    opacity: 0;
    transform: translateY(-28px);
    visibility: hidden;
    pointer-events: none;
}

.form_right--success .ds-form-panel--success {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
    pointer-events: auto;
    transition-delay: 0.08s;
    margin-top: 38px;
}

.ds-form-success-text {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 25px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    max-width: 410px;
}

.ds-form-success-footer {
    margin-top: auto;
}

.ds-form-success-caption {
    margin-left: 12px;
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 25px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    margin-bottom: 24px;
}

.ds-form-success-btn {
    max-width: 420px;
    width: 100%;
    background: rgba(0, 130, 250, 1);
}

.ds-form-success-btn:hover {
    background: rgba(32, 38, 45, 1);
}

.form_right h2.title-main {
    font-family: Delight;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 30px;
    leading-trim: CAP_HEIGHT;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;

    margin-bottom: 30px;
}

.ds-form-panel h2 {
    font-weight: 400;
    font-style: Medium;
    font-size: 56px;
    leading-trim: CAP_HEIGHT;
    line-height: 100%;
    letter-spacing: -3px;
    vertical-align: middle;
    margin-bottom: 30px;

}

.form_right-inner {
    display: flex;
    gap: 20px;
}

.form_right-inner-item {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.form_right-inner-item label {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 14px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    margin-bottom: 12px;
    display: flex;
}

.form_right-inner-item input:not([type="checkbox"]),
.form_right-inner-item textarea {
    all: unset;
    padding: 17.5px 16px;
    background: rgba(241, 245, 248, 1);
    border-radius: 10px;
    margin-bottom: 20px;
}

.form_right-inner-item textarea {
    display: block;
    height: auto;
    resize: none;
    overflow-y: hidden;
    box-sizing: border-box;
    min-height: 58px;
}

.form_right-inner-btn {
    padding: 19px;
    width: -webkit-fill-available;
    background: rgba(32, 38, 45, 1);
    color: rgba(255, 255, 255, 1);
    border-radius: 100px;
    transition: background 0.25s ease, color 0.25s ease;
    font-family: Delight;
    text-align: center;
    font-weight: 500;
    font-style: Semi Bold;
    font-size: 20px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
}

.form_right-inner-btn:hover {
    background: rgba(0, 130, 250, 1);
    color: rgba(241, 245, 248, 1);
}

.ds-form-success-footer .form_right-inner-btn {
    all: unset;
    cursor: pointer;
    padding: 16.5px 110px;
    background: rgba(0, 130, 250, 1);
    color: rgba(241, 245, 248, 1);
    font-family: Delight;
    display: flex;
    font-weight: 600;
    width: fit-content;
    font-style: Semi Bold;
    font-size: 20px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    border-radius: 50px;
    justify-content: flex-start;
    align-items: flex-start;
}

.ds-form-success-footer .form_right-inner-btn:hover {
    background: rgba(32, 38, 45, 1);
    color: #fff;
}

.form_right-inner-item-checkbox {
    margin-top: 31px;
    display: flex;
    gap: 12px;
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 14px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(125, 125, 125, 1);
    align-items: center;
}

.form_right-inner-item-checkbox a {
    color: rgba(32, 38, 45, 1);

}

.form_right-inner-item-checkbox {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 12px;           /* расстояние между квадратом и текстом */
}

.form_right-inner-item-checkbox input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.form_right-inner-item-checkbox label {
  position: relative;
  /*display: flex;*/
  align-items: center;
  padding-left: 36px;     /* место под квадрат 24px + 12px gap */
  min-height: 24px;
  line-height: 1.5;
  cursor: pointer;
  user-select: none;
  font-size: 16px;        /* подгони под свой дизайн */
}

/* Квадрат (фон + бордер) */
.form_right-inner-item-checkbox label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  border-radius: 4px;
  border: 1.5px solid #0082fa;
  background: #f1f5f8;
  transition: 
    background 0.28s ease,
    border-color 0.28s ease,
    box-shadow 0.28s ease;
}

/* Ховер */
.form_right-inner-item-checkbox label:hover::before {
  border-color: #006edc;
  background: #e8f1ff;
}

/* Фокус (доступность) */
.form_right-inner-item-checkbox input:focus-visible + label::before {
  outline: 2px solid #0082fa;
  outline-offset: 2px;
}

/* Checked — заполняем фон плавно */
.form_right-inner-item-checkbox input:checked + label::before {
  background: #0082fa;
  border-color: #0082fa;
  animation: bgFill 0.35s ease-out forwards;
}

/* SVG галочка */
.form_right-inner-item-checkbox .checkmark {
  position: absolute;
  left: 6px;               /* центрируем внутри квадрата 24×24 */
  top: 50%;
  transform: translateY(-50%);
  width: 14px;             /* чуть больше, чтобы линия была выразительнее */
  height: 11px;
  opacity: 0;
  transition: opacity 0.1s ease;
}

.form_right-inner-item-checkbox input:checked + label .checkmark {
  opacity: 1;
}

.form_right-inner-item-checkbox .checkmark path {
    fill: none;
    stroke: white;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 16;
    stroke-dashoffset: 16;
    transition: stroke-dashoffset 0.48s cubic-bezier(0.65, 0.0, 0.45, 1) 0.12s;
}

.form_right-inner-item-checkbox input:checked + label .checkmark path {
    stroke-dashoffset: 0;
}

/* Ключевые кадры для фона (можно и без @keyframes, просто transition) */
@keyframes bgFill {
  from { background: #f1f5f8; }
  to   { background: #0082fa; }
}
.toast {
    position: fixed;
    left: 50%;
    bottom: 32px;
    transform: translateX(-50%) translateY(20px);
    padding: 12px 20px;
    background: rgba(32, 38, 45, 0.95);
    color: rgba(241, 245, 248, 1);
    border-radius: 999px;
    font-family: Delight;
    font-size: 14px;
    line-height: 1.2;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease, transform 0.25s ease;
    z-index: 9999;
}

.toast--visible {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.ds-cookie-consent[hidden] {
    display: none !important;
}

.ds-cookie-consent {
    position: fixed;
    inset: 0;
    z-index: 10001;
}

.ds-cookie-consent__overlay {
    position: absolute;
    inset: 0;
    background: rgba(18, 23, 30, 0.32);
}

.ds-cookie-consent__panel {
    position: absolute;
    left: 50%;
    bottom: 20px;
    transform: translateX(-50%);
    width: min(100% - 24px, 760px);
    border-radius: 20px;
    padding: 24px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}

.ds-cookie-consent__kicker {
    margin: 0 0 10px;
    font-family: Delight;
    font-weight: 500;
    font-size: 13px;
    line-height: 1.2;
    color: rgba(0, 130, 250, 1);
    text-transform: uppercase;
}

.ds-cookie-consent__title {
    margin: 0 0 8px;
    font-family: Delight;
    font-weight: 700;
    font-size: 28px;
    line-height: 1;
    color: rgba(18, 23, 30, 1);
}

.ds-cookie-consent__text {
    margin: 0 0 10px;
    font-family: Delight;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.4;
    color: rgba(32, 38, 45, 1);
}

.ds-cookie-consent__links {
    margin-bottom: 14px;
}

.ds-cookie-consent__links a {
    font-family: Delight;
    font-weight: 600;
    font-size: 14px;
    line-height: 1.2;
    color: rgba(0, 130, 250, 1);
    text-decoration: underline;
}

.ds-cookie-consent__categories {
    border: 1px solid rgba(220, 228, 237, 1);
    border-radius: 14px;
    padding: 12px;
    display: grid;
    gap: 10px;
    margin-bottom: 14px;
}

.ds-cookie-consent__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.ds-cookie-consent__row-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ds-cookie-consent__row-title {
    font-family: Delight;
    font-weight: 600;
    font-size: 15px;
    line-height: 1.3;
    color: rgba(18, 23, 30, 1);
}

.ds-cookie-consent__row-desc {
    font-family: Delight;
    font-weight: 500;
    font-size: 13px;
    line-height: 1.35;
    color: rgba(125, 125, 125, 1);
}

.ds-cookie-consent__row input[type="checkbox"] {
    width: 20px;
    height: 20px;
    accent-color: rgba(0, 130, 250, 1);
    flex-shrink: 0;
}

.ds-cookie-consent__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ds-cookie-consent__btn {
    all: unset;
    box-sizing: border-box;
    cursor: pointer;
    border-radius: 999px;
    padding: 11px 16px;
    font-family: Delight;
    font-weight: 600;
    font-size: 14px;
    line-height: 1;
}

.ds-cookie-consent__btn--ghost {
    border: 1px solid rgba(0, 130, 250, 0.35);
    color: rgba(32, 38, 45, 1);
}

.ds-cookie-consent__btn--primary {
    background: rgba(0, 130, 250, 1);
    color: rgba(255, 255, 255, 1);
}

.ds-cookie-consent__btn--primary:hover {
    background: rgba(32, 38, 45, 1);
}

body.ds-cookie-consent-open {
    overflow: hidden;
}

/* Footer
===================*/

footer {
    padding-top: 330px;
    padding-bottom: 125px;
    position: relative;
    background: url('../assets/img/footer/bg.png') no-repeat center center;
    background-size: cover;
}

.footer-center {
    display: none;
}

footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100px;
    filter: blur(-2px);
    background: rgba(241, 245, 248, 1);
    mask-image: linear-gradient(to bottom, black 0%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, black 0%, transparent 100%);
    mask-size: 100% 100%;
    -webkit-mask-size: 100% 100%;
    mask-position: 50% 0;
    -webkit-mask-position: 50% 0;
}

.footer_top {
    display: flex;
    gap: 79px;
    justify-content: space-between;
    align-items: flex-start;
}

.footer_top .footer_word {
    flex: 1 1 0;
    min-width: 0;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

.footer_top-content {
    display: flex;
    gap: 0px;
    justify-content: space-between;

}

.footer_top-content-item {
    display: flex;
    flex-direction: column;
    color: rgba(255, 255, 255, 1);
    gap: 15px;
    width: 212px;
}

.footer_top-content-item-title {
    font-family: Delight;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 18px;
    leading-trim: NONE;
    line-height: 120%;
    letter-spacing: 0px;
    vertical-align: middle;
    margin-bottom: 15px;
}

.footer_word {
    width: 100%;
}

.footer_bottom-content {
    display: flex;
    flex-direction: column;
    gap: 29px;
}

.footer_bottom-content-item {
    display: flex;
    gap: 8px;
    align-items: center;
    color: rgba(255, 255, 255, 1);
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 14px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: center;
    vertical-align: middle;
}

.footer_bottom-content-item-year {
    margin-right: 56px;
}

.footer_bottom {
    display: flex;
    align-items: flex-end;
    gap: 70px;
    margin-top: -50px;
}

.footer_bottom-setter {
    flex: 1 1 0;
    min-width: 0;
    max-width: 100%;
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* Подчёркивание при наведении как в хедере — только у текстовых ссылок, не у соцсетей */
.footer_top-content-item a,
.footer_bottom-content-item a {
    position: relative;
    display: inline-block;
    width: fit-content;
}

.footer_top-content-item a::after,
.footer_bottom-content-item a::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -4px;
    height: 2px;
    width: 0;
    background: currentColor;
    transition: width 0.3s ease;
}

.footer_top-content-item a:hover::after,
.footer_bottom-content-item a:hover::after {
    width: 100%;
}

.footer_bottom-content-links {
    display: flex;
    align-items: center;
    gap: 16px;
}

.footer_bottom-content-links img {
    display: flex;
}


/* Legal pages (Impressum, Datenschutz, etc.)
===================*/

.legal-main {
    padding-top: 120px;
    background: #F1F5F8;
}

.legal-hero {
    /*padding-top: 80px;*/
    padding-bottom: 80px;
}

.legal-hero__title {
    font-family: Delight;
    font-weight: 700;
    font-style: Bold;
    font-size: 56px;
    leading-trim: CAP_HEIGHT;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    
}

.legal-content {
    padding-bottom: 190px;
}

.legal-content__inner {

}

.legal-content__block {
    color: rgba(32, 38, 45, 1);
}

.legal-content__block p {
    margin: 0 0 20px;
}


.legal-content__block a {
    color: rgba(0, 130, 250, 1);
}

.legal-content__block p {
    margin: 0 0 20px;
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 130%;
    letter-spacing: 0px;
    vertical-align: middle;
}

.legal-content__block strong {
    font-weight: 700;
}

.legal-section-title {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 40px;
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 24px;
    leading-trim: CAP_HEIGHT;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    text-transform: uppercase;
}

.legal-section-title::before {
    content: '';
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(32, 38, 45, 1);
    flex-shrink: 0;
}

p.legal-subheading {
    font-family: Delight;
    font-weight: 700;
    font-style: Bold;
    font-size: 16px;
    leading-trim: CAP_HEIGHT;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    margin-bottom: 16px;
}

p.legal-subheading--mb40 {
    margin-bottom: 40px;
}

.legal-subheading + p {
    margin-bottom: 40px;
}

p.legal-section-title {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 24px;
    leading-trim: CAP_HEIGHT;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    text-transform: uppercase;

}

.projects__title_text {
    display: flex;
    flex-direction: row;
    gap: 16px;
    margin-bottom: 120px;
    justify-content: space-between;
}

.projects__title_text-title {
    font-family: Delight;
    font-weight: 700;
    font-style: Bold;
    font-size: 120px;
    leading-trim: CAP_HEIGHT;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    
}

.projects__title_text-subtitle {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    max-width: 394px;
    margin-right: 64px;
    gap: 20px;
    margin-bottom: 15px;
}

.projects__title_text-subtitle-year {
    font-family: Delight;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;

}

.projects__title_text-subtitle-text {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
}

.project__inner {
    padding-top: 80px;   
}

.project__back-to-projects {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 20px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    display: flex;
    gap: 9px;
    align-items: center;
    width: fit-content;
    padding-bottom: 4px;
    border-bottom: 1px solid rgba(32, 38, 45, 1);
}

.project__title {

    font-family: Delight;
    font-weight: 700;
    font-style: Bold;
    font-size: 120px;
    leading-trim: CAP_HEIGHT;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    /*margin-bottom: 120px;*/
}

.project__introduction {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 120px;
}

.project__introduction div {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 20px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    max-width: 579px;    
}

.project__introduction span {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 20px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

.project__introduction span::before {
    content: '';
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(32, 38, 45, 1);
    flex-shrink: 0;
}

.project__info {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-bottom: 120px;
}

.project__info-item {
    border-top: 1px solid rgba(132, 132, 132, 1);
    display: flex;
    justify-content: flex-end;
}

.project__info-item-title {
    padding: 13px 0px;
    max-width: 571px;
    display: flex;
    justify-content: space-between;
    width: 100%;
    gap: 20px;

    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 20px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: right;
    vertical-align: middle;

}

.project__images {
    display: flex;
    gap: 24px;
}

.project__images-item {
    height: 480px;
    flex: 1;
    width: 100%;
    border-radius: 25px;
    overflow: hidden;
}

.project__images-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.project__images {
    margin-bottom: 120px;
}

.project__problem {
    display: flex;
    justify-content: space-between;
    gap: 24px;
}

.project__problem-item span {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 24px;
    leading-trim: NONE;
    line-height: 120%;
    letter-spacing: 0px;
    vertical-align: middle;
    margin-bottom: 32px;
    display: block;
}

.project__problem-item p { 
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 120%;
    letter-spacing: 0px;
    vertical-align: middle;
    
}

.project__images-2 {
    border-radius: 25px;
    overflow: hidden;
    margin: 0px 45px;
    margin-top: 120px;
    margin-bottom: 120px;
}

.project__images-2 img {
    width: 100%;
    display: flex;
    height: 100%;
    margin-top: -1px;
}

.next-project__logo {

}

.next-project__title-text {
    font-family: Delight;
    font-weight: 700;
    font-style: Bold;
    font-size: 120px;
    leading-trim: CAP_HEIGHT;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    margin-top: 20px;
    margin-bottom: 120px;
}

.next-project {
    margin-bottom: 190px;
}

.next-project__logo {
    height: 22px;
}

.next-project__title-text {
    font-family: Delight;
    font-weight: 700;
    font-style: Bold;
    font-size: 62px;
    leading-trim: CAP_HEIGHT;
    line-height: 60px;
    letter-spacing: 0px;
    vertical-align: middle;
    margin-top: 18px;
    margin-bottom: 36px;
}

.next-project {
    margin-bottom: 50px;
}

.strategy .container {
    max-width: 1030px;
}

.strategy__logo {
    height: 20px;
}

.strategy__title {
    font-family: Delight;
    font-weight: 700;
    font-style: Bold;
    font-size: 72px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;

    margin-top: 20px;
    margin-bottom: 120px;
}

.strategy__item {
    display: flex;
    align-items: flex-start;
    gap: 45px;
    padding-bottom: 24px;
    border-bottom: 1px solid rgba(0, 130, 250, 1);
    margin-bottom: 24px;
}

.strategy__item-head {
    flex: 0 0 30%;
    max-width: 30%;
    display: flex;
    align-items: center;
    gap: 40px;
    min-width: 0;
}

.strategy__item-icon {
    width: 51px;
    height: 51px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 7px;
    background: linear-gradient(135deg, rgba(0, 130, 250, 0.35), rgba(0, 130, 250, 0.1));
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.4);
    margin-left: 40px;
    position: relative;

}

.strategy__item-icon::before {
    content: '';
    width: 2px;
    height: 100%;
    background: rgba(0, 130, 250, 1);
    position: absolute;
    top: 0;
    left: -40px;
}

.strategy__item-title {
    font-family: Delight;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 26px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;

}

.strategy__item-content {
    flex: 1 1 auto;
    min-width: 0;
    font-family: Delight;
    font-weight: 400;
    font-style: Regular;
    font-size: 18px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;
}

.strategy__list .strategy__item:last-child {
    border-bottom: none;
}

.strategy__list {
    margin-bottom: 300px;
}

.true-value__title {
    margin-bottom: 120px;
    font-family: Delight;
    font-weight: 700;
    font-style: Bold;
    font-size: 72px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: center;
    vertical-align: middle;

}

.true-value__list {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 300px;
}

.true-value__item {
    flex: 1 1 auto;
    min-width: 0;
}

.true-value__item-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 30px;
    gap: 20px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 1);
}

.true-value__item-label {
    display: flex;
    align-items: center;
    gap: 12px;
}

.true-value__item-number {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 46px;
    height: 46px;
    border-radius: 7px;
    background-color: rgba(0, 130, 250, 0.25);
    font-family: "Delight", sans-serif;
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    line-height: 1;
    letter-spacing: -0.5px;
    
  }

  .true-value__item-dot {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 3px;
  }

.true-value__item-dot span {
    width: 8px;
    height: 8px;
    border-radius: 100%;
    background: rgba(165, 165, 165, 1);
}

.true-value__item-dot span.active {
    background: rgba(18, 23, 30, 1);
}

.true-value__item-content {
    padding: 30px;
    background: rgba(255, 255, 255, 1);
    border-radius: 18px;
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 24px;
    leading-trim: NONE;
    line-height: 120%;
    letter-spacing: 0px;
    vertical-align: middle;

}

.true-value__item-tags {
    padding: 30px 15px 30px 30px;
    background: rgba(255, 255, 255, 1);
    border-radius: 18px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    flex-wrap: wrap;
}

.true-value__item-tags span {
    padding: 8px 12px;
    border-radius: 100px;
    background-color: rgba(0, 130, 250, 0.1);
    font-family: "Delight", sans-serif;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    line-height: 1;
    vertical-align: middle;
}

/* How it works
===================*/

.how-works {
    padding-bottom: 150px;
}

.how-works__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 40px;
    max-width: 1030px;
    margin: 0 auto;
    margin-bottom: 120px;
}


.how-works__title {
    font-family: Delight;
    font-weight: 700;
    font-style: Bold;
    font-size: 72px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    
}

.how-works__subtitle {
    font-family: Delight;
    font-weight: 400;
    font-style: Regular;
    font-size: 18px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;
    margin-top: 20px;    
}

.how-works__benefits {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.how-works__benefits li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    
    color: rgba(32, 38, 45, 1);
}

.how-works__benefits-icon {
    width: auto;
    height: 18px;
    flex-shrink: 0;
    display: block;
}

.how-works__steps {
    display: flex;
    gap: 0;
    justify-content: space-between;
    align-items: stretch;
    position: relative;
}

.how-works__step {
    flex: 1 1 0;
    max-width: calc((100% - 80px) / 3);
    min-width: 0;
    border-radius: 18px;
    overflow: hidden;
    position: relative;
    background: linear-gradient(180deg, #12294B 0%, #12294B 25.24%, #A0C0EF 100%);

}

.how-works__connector {
    flex: 0 0 73px;
    margin: 30px 7px 0;
    width: 73px;
    height: 2px;
    background: rgba(18, 23, 30, 1);
    align-self: flex-start;
}

.how-works__step-head {
    color: #fff;
    font-family: Delight;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 20px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    text-transform: uppercase;
    text-align: center;
    padding: 18px;
    background: ;
    
}

.how-works__step-body {
    padding: 24px 24px 39px;
    padding-bottom: 19px;
    height: 100%;
    border-radius: 18px;
    
    /* Цвет фона 40% синего #0082FA с градиентом */
    background: linear-gradient(135deg, rgba(0, 130, 250, 0.4), rgba(0, 130, 250, 0.2));
    
    /* Эффект размытия (Frost/Refraction) */
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    
    /* Белая обводка (Light) */
    border: 1px solid rgba(255, 255, 255, 0.3);
    
    /* Внутреннее свечение (Depth) и внешняя мягкая тень */
    box-shadow: 
      inset 0 1px 1px rgba(255, 255, 255, 0.3), 
      0 8px 32px 0 rgba(0, 0, 0, 0.15);
    
    /* Чтобы контент не вылезал за скругления */
    overflow: hidden;
  }
.how-works__step-num {
    font-family: Delight;
    font-weight: 500;
    font-style: Medium;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(224, 241, 255, 1);
    margin-bottom: 16px;
    display: flex;    
}

.how-works__step-title {
    font-family: Delight;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 20px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: center;
    vertical-align: middle;
    color: rgba(241, 245, 248, 1);
    padding-bottom: 6px;    
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    margin-bottom: 6px;
}

.how-works__step-text {
    font-family: Delight;
    font-weight: 300;
    font-style: Regular;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 150%;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
    text-align: center;
    color: rgba(241, 245, 248, 1); 
    margin-bottom: 0;;   
}

.how-works__cta {
    margin-top: 48px;
    text-align: left;
}

.how-works__btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 25px;
    background: rgba(0, 130, 250, 1);
    border-radius: 100px;
    color: #fff;
    font-family: 'Delight', sans-serif;
    font-weight: 600;
    font-size: 16px;
    transition: background 0.3s ease, color 0.3s ease;
    cursor: pointer;
}

.how-works__btn:hover {
    background: rgba(32, 38, 45, 1);
}

.services--referral {
    position: relative;
}

.services--referral-push-up {
    position: absolute;
    left: 0;
    bottom: 0;
    transform: translateY(calc(50% + 120px));
    display: flex;
    flex-direction: column;
    gap: 18px;
    max-width: 535px;
    padding: 16px 50px 16px 16px;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(0, 130, 250, 0.4), rgba(0, 130, 250, 0.1));
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.3), 0 20px 40px rgba(0, 0, 0, 0.1);
    opacity: 0;
    transition: opacity 0.5s ease;
}

.services--referral-push-up.is-visible {
    opacity: 1;
}

.services--referral-push-up-item-img {
    width: 58px;
    height: 58px;
    border-radius: 100%;
    object-fit: cover;
}

.services--referral-push-up-item-text {
    font-family: Delight;
    font-weight: 400;
    font-style: Medium;
    font-size: 20px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(255, 255, 255, 1);
}

.services--referral-push-up-item {
    display: flex;
    gap: 19px;
    align-items: center;
}

.services--referral-push-up-item {
    margin-bottom: 18px;;
}

.services--referral-push-up-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16.5px 53.5px;
    background: rgba(0, 130, 250, 1);
    border-radius: 50px;
    color: rgba(255, 255, 255, 1);
    font-family: Delight, sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    transition: background 0.3s ease;
    cursor: pointer;
    align-self: flex-start;
}

.services--referral-push-up-btn:hover {
    background: rgba(32, 38, 45, 1);
    color: rgba(255, 255, 255, 1);
}

.services--referral-push-up-btn img {
    width: 14px;
    height: auto;
    object-fit: contain;
}

.project__title_col {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 60px;
        margin-top: 40px;
}

.project__title {
    width: 50%;
}

.project_title_img_cont {
    width: 50%;
    height: 320px;  
}

.project_title_img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 25px;
}

/* Сам кейфрейм на opacity */
@keyframes fadeInOpacity {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

/* Класс, который мы повесили на кнопки */
.instant-fade-in {
    opacity: 0; /* Прячем до начала анимации */
    animation: fadeInOpacity 0.6s ease-in-out forwards; 
    /* forwards означает, что элемент останется видимым после конца анимации */
}