/* Tokens */
:root {
    --font-family: "Montserrat", sans-serif;
    --second-family: "Poppins", sans-serif;
    --third-family: "Gilroy", "Montserrat", sans-serif;
    --color-bg: #ebeae9;
    --color-text: #111;
    --color-muted: #666;
    --color-footer-bg: #2d2d2d;
    --color-footer-text: #fff;
    --color-footer-muted: #a2a2a2;
    --color-accent: #ff5b1a;
    --header-height: 64px;
    /* mobile: боковые 16px, сверху 0 */
    --page-pad-top: 0;
    --page-pad-x: 16px;
    --page-pad-bottom: 0px;
    --site-max: 1920px;
    --container-max: 1300px;
}

/* Breakpoints: mobile (default) / 1024 / 1920 */
@media (min-width: 1024px) {
    :root {
        --page-pad-top: 30px;
        --page-pad-x: 30px;
        --page-pad-bottom: 30px;
        --header-height: 72px;
    }
}

@media (min-width: 1920px) {
    :root {
        --page-pad-top: 30px;
        --page-pad-x: 30px;
        --page-pad-bottom: 30px;
        --header-height: 80px;
    }
}

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

html {
    height: 100%;
    background: var(--color-bg);
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--page-pad-top) + 96px);
}

body {
    min-height: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    max-width: var(--site-max);
    font-family: var(--font-family);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: var(--color-text);
    background: var(--color-bg);
    line-height: 1.5;
}

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

a {
    color: inherit;
    text-decoration: none;
}

button {
    font: inherit;
    color: inherit;
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.container {
    width: 100%;
    max-width: var(--container-max);
    margin: 0 auto;
}

.page {
    flex: 1 0 auto;
    padding: var(--page-pad-top) var(--page-pad-x) var(--page-pad-bottom);
}

.header {
    position: fixed;
    z-index: 100;
    top: 14px;
    left: calc(max(0px, (100vw - var(--site-max)) / 2) + var(--page-pad-x));
    right: calc(max(0px, (100vw - var(--site-max)) / 2) + var(--page-pad-x));
    pointer-events: none;
}

.header.is-open {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 14px var(--page-pad-x);
    box-sizing: border-box;
    background: #fff;
    pointer-events: auto;
    overflow: auto;
}

.header__bar {
    position: relative;
    pointer-events: auto;
    width: 100%;
    min-height: 64px;
    padding: 16px;
    border-radius: 16px;
    background: rgb(255 255 255 / 7%);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-sizing: border-box;
}

.header.is-open .header__bar {
    min-height: 0;
    padding: 0;
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-radius: 0;
}

.header__inner {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

.header__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 32px;
}

.header.is-open .header__top {
    min-height: 32px;
    padding: 8px 16px;
    border-radius: 16px;
    background: rgb(255 255 255 / 7%);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-sizing: border-box;
}

.header__logo {
    display: inline-flex;
    flex: 0 0 auto;
    line-height: 0;
}

.header__logo-img {
    display: block;
    width: auto;
    height: 32px;
}

.header__logo-img--dark {
    display: none;
}

.header.is-open .header__logo-img--light {
    display: none;
}

.header.is-open .header__logo-img--dark {
    display: block;
}

.header__toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    flex: 0 0 auto;
    color: #fff;
    background: transparent;
    border: 0;
    cursor: pointer;
}

.header__toggle-icon {
    display: block;
    width: 24px;
    height: 24px;
}

.header__toggle-icon--close {
    display: none;
}

.header__toggle-icon--menu-dark {
    display: none;
}

.header.is-scrolled:not(.is-open) .header__toggle-icon--menu {
    display: none;
}

.header.is-scrolled:not(.is-open) .header__toggle-icon--menu-dark {
    display: block;
}

.header.is-open .header__toggle-icon--menu,
.header.is-open .header__toggle-icon--menu-dark {
    display: none;
}

.header.is-open .header__toggle-icon--close {
    display: block;
}

.header.is-scrolled:not(.is-open) .header__bar {
    background: rgb(255 255 255 / 80%);
}

.header.is-scrolled:not(.is-open) .header__logo-img--light {
    display: none;
}

.header.is-scrolled:not(.is-open) .header__logo-img--dark {
    display: block;
}

.header.is-scrolled:not(.is-open) .header__link {
    color: #212121;
}

.header.is-scrolled:not(.is-open) .header__link:hover {
    color: var(--color-accent);
}

.header__nav {
    display: none;
}

.header.is-open .header__nav {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 48px;
    width: 100%;
    margin-top: 48px;
    padding: 0;
    background: transparent;
    pointer-events: auto;
}

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

.header.is-open .header__list {
    gap: 32px;
}

.header__link {
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    color: #fff;
    text-decoration: none;
}

.header.is-open .header__link {
    font-size: 20px;
    color: #212121;
}

.header__link:hover {
    color: var(--color-accent);
}

.header__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    min-height: 35px;
    padding: 12px 16px;
    border-radius: 16px;
    background: #212121;
    color: #fff;
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    text-decoration: none;
}

.header.is-open .header__cta {
    align-self: stretch;
    width: 100%;
    min-height: 45px;
    padding: 16px;
    font-size: 18px;
}

.header__cta:hover,
.header__cta:focus-visible {
    background: var(--color-accent);
    color: #fff;
}

body.is-nav-open {
    overflow: hidden;
}

@media (min-width: 1024px) {
    .header,
    .header.is-open {
        top: calc(var(--page-pad-top) + 16px);
        right: calc(max(0px, (100vw - var(--site-max)) / 2) + var(--page-pad-x) + 16px);
        bottom: auto;
        left: calc(max(0px, (100vw - var(--site-max)) / 2) + var(--page-pad-x) + 16px);
        display: block;
        min-height: 0;
        padding: 0;
        border-radius: 0;
        background: transparent;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        overflow: visible;
        pointer-events: none;
    }

    .header__bar,
    .header.is-open .header__bar {
        display: flex;
        align-items: center;
        min-height: 72px;
        padding: 16px 0;
        border-radius: 16px;
        background: rgb(255 255 255 / 7%);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        pointer-events: auto;
    }

    .header__inner,
    .header.is-open .header__inner {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
        max-width: var(--container-max);
        margin-left: auto;
        margin-right: auto;
        padding: 0;
    }

    .header__top,
    .header.is-open .header__top {
        display: contents;
    }

    .header__logo-img {
        height: 40px;
    }

    .header__logo-img--light {
        display: block;
    }

    .header__logo-img--dark {
        display: none;
    }

    .header.is-scrolled:not(.is-open) .header__logo-img--light {
        display: none;
    }

    .header.is-scrolled:not(.is-open) .header__logo-img--dark {
        display: block;
    }

    .header.is-open .header__logo-img--light {
        display: block;
    }

    .header.is-open .header__logo-img--dark {
        display: none;
    }

    .header__toggle {
        display: none;
    }

    .header__nav,
    .header.is-open .header__nav {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 20px;
        flex: 0 0 auto;
        width: auto;
        margin-top: 0;
        padding: 0;
        background: transparent;
    }

    .header__list,
    .header.is-open .header__list {
        flex-direction: row;
        align-items: center;
        gap: 20px;
    }

    .header.is-open .header__link {
        font-size: 16px;
        color: #fff;
    }

    .header.is-scrolled:not(.is-open) .header__link {
        color: #212121;
    }

    .header.is-open .header__cta {
        align-self: flex-start;
        width: auto;
        min-height: 35px;
        padding: 12px 16px;
        font-size: 16px;
    }

    .header.is-scrolled:not(.is-open) .header__bar {
        background: rgb(255 255 255 / 80%);
    }

    body.is-nav-open {
        overflow: auto;
    }
}

/* Laptop < 1440 — inset по макету Frame 1380 */
@media (min-width: 1024px) and (max-width: 1439px) {
    .header,
    .header.is-open {
        left: calc(max(0px, (100vw - var(--site-max)) / 2) + var(--page-pad-x) + 32px);
        right: calc(max(0px, (100vw - var(--site-max)) / 2) + var(--page-pad-x) + 32px);
    }

    .header__bar,
    .header.is-open .header__bar {
        padding: 0 30px;
    }
}

/* Hero — text: Frame 332 (desktop 1693:22797 / mobile 1803:6014) */
.block.hero {
    padding: 0;
    margin-left: calc(var(--page-pad-x) * -1);
    margin-right: calc(var(--page-pad-x) * -1);
    width: calc(100% + var(--page-pad-x) * 2);
}

.hero__panel {
    position: relative;
    overflow: hidden;
    width: 100%;
    min-height: 583px;
    border-radius: 0 0 16px 16px;
    background-color: var(--color-footer-bg);
    background-image: url('../img/hero-panel-decor.png');
    background-repeat: no-repeat;
    background-position: -179px 253px;
    background-size: 1073px auto;
    color: #fff;
}

.hero__inner {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: inherit;
    padding: 118px var(--page-pad-x) 48px;
}

.hero__copy {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 64px;
    width: 100%;
    max-width: 827px;
    min-height: 417px;
}

.hero__texts {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 827px;
}

.hero__title {
    margin: 0;
    font-family: var(--third-family);
    font-size: 36px;
    font-weight: 300;
    line-height: 0.9;
    letter-spacing: -0.05em;
    color: #fff;
}

.hero__text {
    margin: 0;
    max-width: 574px;
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.3;
    color: #fff;
}

.hero__text-accent {
    color: var(--color-accent);
}

.hero__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: stretch;
    min-height: 50px;
    padding: 16px 24px;
    border-radius: 16px;
    background: var(--color-accent);
    border: 1px solid var(--color-accent);
    color: #fff;
    font-family: var(--font-family);
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    text-align: center;
    box-sizing: border-box;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.hero__button:hover,
.hero__button:focus-visible {
    background: var(--color-accent);
    color: #fff;
}

.hero__visual {
    display: none;
}

@media (min-width: 1024px) {
    .block.hero {
        margin-left: 0;
        margin-right: 0;
        width: 100%;
    }

    .hero__panel {
        min-height: 585px;
        border-radius: 24px;
        background-image: url('../img/hero-panel-decor.png');
        background-repeat: no-repeat;
        background-position: right bottom;
        background-size: 1020px auto;
    }

    .hero__inner {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 24px;
        overflow: visible;
        padding: 124px 0 44px;
    }

    .hero__copy {
        position: relative;
        z-index: 1;
        flex: 0 1 827px;
        justify-content: space-between;
    }

    .hero__title {
        font-size: 56px;
    }

    .hero__button {
        align-self: flex-start;
        width: auto;
        background: transparent;
        border: 1px dashed var(--color-accent);
    }

    .hero__button:hover,
    .hero__button:focus-visible {
        background: var(--color-accent);
        color: #fff;
    }

    .hero__visual {
        display: block;
        position: relative;
        z-index: 0;
        flex: 0 0 500px;
        width: 500px;
        height: 420px;
        overflow: visible;
    }

    .hero__illustration {
        position: absolute;
        top: 50%;
        left: 50%;
        display: block;
        width: 978px;
        height: 554px;
        max-width: none;
        flex-shrink: 0;
        transform: translate(-50%, -50%);
        pointer-events: none;
        margin-top: 45px;
        margin-left: 5px;
    }

    .hero__dot {
        position: absolute;
        z-index: 1;
        padding: 0;
        border: 0;
        background: transparent;
        cursor: pointer;
        pointer-events: auto;
        animation: hero-dot-pulse 2s ease-in-out infinite;
    }

    .hero__dot img {
        display: block;
    }

    .hero__dot[aria-expanded="true"] {
        animation: none;
        opacity: 1;
    }

    .hero__widget {
        position: absolute;
        z-index: 2;
    }

    .hero__widget[hidden] {
        display: none;
    }

    .hero__widget img {
        display: block;
    }

    .hero__widget--1 {
        left: 343px;
        top: 128px;
        width: 174px;
        height: 146px;
    }

    .hero__widget--1 img {
        width: 174px;
        height: 146px;
    }

    .hero__widget--2 {
        left: 135px;
        top: 312px;
        width: 228px;
        height: 80px;
    }

    .hero__widget--2 img {
        width: 228px;
        height: 80px;
    }

    .hero__widget--3 {
        left: 236px;
        top: 190px;
        width: 177px;
        height: 101px;
    }

    .hero__widget--3 img {
        width: 177px;
        height: 101px;
    }

    @keyframes hero-dot-pulse {
        0%,
        100% {
            opacity: 1;
        }

        50% {
            opacity: 0.5;
        }
    }

    .hero__dot--1 {
        left: 343.3px;
        top: 64.37px;
    }

    .hero__dot--2 {
        left: 135.56px;
        top: 248.7px;
    }

    .hero__dot--3 {
        left: 232.12px;
        top: 132.64px;
    }

    @media (prefers-reduced-motion: reduce) {
        .hero__dot {
            animation: none;
        }
    }
}

/* Laptop < 1440 — hero overrides after desktop rules */
@media (min-width: 1024px) and (max-width: 1439px) {
    .hero__panel {
        background-position: right -120px bottom -90px;
    }

    .hero__inner {
        padding: 124px 40px 44px 0;
    }

    .hero__copy {
        flex: 0 1 560px;
        max-width: 560px;
        padding-left: 30px;
    }

    .hero__title {
        font-size: 52px;
    }
}

/* Footer — mobile 375 (Frame «Футер» 343×543), desktop from 1024 */
.footer {
    margin-top: auto;
    padding: 0 var(--page-pad-x) var(--page-pad-bottom);
}

.footer__panel {
    background: var(--color-footer-bg);
    color: var(--color-footer-text);
    border-radius: 16px;
    padding: 16px;
}

.footer__grid {
    display: flex;
    flex-direction: column;
}

.footer__col {
    display: contents;
}

.footer__brand {
    order: 1;
}

.footer__contacts {
    order: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 32px;
}

.footer__aside {
    order: 3;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
    margin-top: 64px;
}

.footer__legal {
    order: 4;
    margin-top: 32px;
    font-family: var(--font-family);
    font-size: 14px;
    line-height: 1.45;
    color: var(--color-footer-muted);
}

.footer__logo {
    display: inline-flex;
    color: var(--color-footer-text);
}

.footer__logo img {
    width: 169px;
    height: 32px;
    display: block;
}

.footer__credit {
    margin: 8px 0 0;
    font-family: var(--font-family);
    font-size: 14px;
    line-height: 1;
    color: var(--color-footer-text);
}

.footer__credit-link {
    color: var(--color-accent);
    font-weight: 500;
}

.footer__email {
    font-family: var(--second-family);
    font-size: 28px;
    font-weight: 300;
    letter-spacing: -0.03em;
    line-height: 32px;
    color: var(--color-footer-text);
}

.footer__social {
    display: inline-flex;
    flex-shrink: 0;
}

.footer__social img {
    width: 48px;
    height: 48px;
}

.footer__legal p {
    margin: 0;
}

.footer__legal .footer__copy {
    margin-top: 16px;
    display: inline-block;
}

.footer__skolkovo {
    width: 198px;
    height: 31px;
}

.footer__nav {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    font-family: var(--font-family);
    font-size: 14px;
    line-height: 1;
    color: var(--color-footer-text);
}

.footer__nav a:hover,
.footer__credit-link:hover {
    color: var(--color-accent);
}

.footer__email:hover,
.footer__logo:hover {
    opacity: 0.85;
}

/* Footer — laptop 1440 (Frame 363, 1380×329, inset 32) */
@media (min-width: 1024px) {
    .footer__panel {
        border-radius: 24px;
        min-height: 329px;
        padding: 32px;
    }

    .footer__grid {
        flex-direction: row;
        justify-content: space-between;
        gap: 40px;
        align-items: stretch;
        min-height: calc(329px - 64px);
    }

    .footer__col {
        display: flex;
        flex-direction: column;
    }

    .footer__col--left {
        gap: 70px;
        max-width: 420px;
    }

    .footer__col--right {
        align-items: flex-end;
        justify-content: space-between;
        text-align: right;
    }

    .footer__brand,
    .footer__contacts,
    .footer__aside,
    .footer__legal {
        order: unset;
        margin-top: 0;
    }

    .footer__logo img {
        width: 290px;
        height: 57px;
    }

    .footer__contacts {
        justify-content: flex-start;
        gap: 58px;
    }

    .footer__email {
        font-size: 46px;
        line-height: 1;
    }

    .footer__social img {
        width: 40px;
        height: 40px;
    }

    .footer__aside {
        align-items: flex-end;
        gap: 38px;
    }

    .footer__skolkovo {
        width: 267px;
        height: 42px;
    }

    .footer__nav {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-end;
        align-items: unset;
        gap: 8px 24px;
    }
}

/* Footer — desktop ≥1440 */
@media (min-width: 1440px) {
    .footer__panel {
        padding: 40px;
    }
}

/* Footer — desktop 1920 (Frame 363, 1868×345) */
@media (min-width: 1920px) {
    .footer__panel {
        min-height: 345px;
    }

    .footer__grid {
        min-height: calc(345px - 80px);
    }
}

.block {
    padding: 40px 0;
}

@media (min-width: 1024px) {
    .block {
        padding: 64px 0;
    }
}

@media (min-width: 1920px) {
    .block {
        padding: 80px 0;
    }
}

.block-text__title {
    margin: 0 0 16px;
    font-size: 28px;
    line-height: 1.2;
    letter-spacing: -0.03em;
}

@media (min-width: 1024px) {
    .block-text__title {
        font-size: 36px;
    }
}

.block-text__content > *:first-child {
    margin-top: 0;
}

.block-text__content > *:last-child {
    margin-bottom: 0;
}

.consultation__panel {
    border-radius: 16px;
    background: var(--color-footer-bg);
    color: #fff;
    padding: 16px;
}

.consultation__grid {
    display: grid;
    gap: 48px;
}

.consultation__content {
    max-width: none;
}

.consultation__title {
    margin: 0;
    font-family: var(--third-family);
    font-size: 32px;
    font-weight: 300;
    line-height: 1;
    letter-spacing: -0.05em;
    color: #fff;
}

.consultation__text {
    margin: 16px 0 0;
    max-width: none;
    font-size: 16px;
    line-height: 1.3;
    color: #fff;
}

.consultation__form {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.consultation__fields {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.consultation__field {
    position: relative;
    height: 50px;
    border-bottom: 1px solid var(--color-footer-muted);
    transition: border-color 0.2s ease;
}

.consultation__input {
    display: block;
    width: 100%;
    height: 100%;
    padding: 22px 16px 8px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #fff;
    caret-color: #fff;
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.1;
    letter-spacing: 0;
    outline: none;
}

.consultation__input::placeholder {
    color: transparent;
    opacity: 1;
}

.consultation__label {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    margin: 0;
    pointer-events: none;
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.1;
    color: var(--color-footer-muted);
    transition: top 0.2s ease, transform 0.2s ease, font-size 0.2s ease, color 0.2s ease;
}

.consultation__label-error {
    display: none;
}

.consultation__field:hover {
    border-bottom-color: #fff;
}

.consultation__field:hover .consultation__label {
    color: #fff;
}

.consultation__field:focus-within {
    border-bottom-color: #fff;
}

.consultation__input:focus ~ .consultation__label,
.consultation__input:not(:placeholder-shown) ~ .consultation__label {
    top: 8px;
    transform: none;
    font-size: 12px;
    color: var(--color-footer-muted);
}

.consultation__field:hover .consultation__input:not(:focus):placeholder-shown ~ .consultation__label {
    color: #fff;
}

.consultation__field--error {
    border-bottom-color: #ff2c55;
}

.consultation__field--error .consultation__label {
    top: 8px;
    transform: none;
    font-size: 12px;
    color: #ff2c55;
}

.consultation__field--error .consultation__label-text {
    display: none;
}

.consultation__field--error .consultation__label-error {
    display: inline;
}

.consultation__field--error:hover,
.consultation__field--error:focus-within {
    border-bottom-color: #ff2c55;
}

.consultation__agreement {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 48px;
    font-family: var(--font-family);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.1;
    color: #fff;
    cursor: pointer;
}

.consultation__agreement.is-invalid {
    color: #ff2c55;
}

.consultation__agreement-link {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.consultation__checkbox {
    appearance: none;
    box-sizing: border-box;
    margin: 0;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    padding: 0;
    border: 2.5px solid transparent;
    border-radius: 4.5px;
    background-color: transparent;
    background-clip: padding-box;
    box-shadow: inset 0 0 0 1px var(--color-footer-muted);
    cursor: pointer;
}

.consultation__agreement.is-invalid .consultation__checkbox {
    box-shadow: inset 0 0 0 1px #ff2c55;
}

.consultation__checkbox:checked {
    box-shadow: none;
    background-color: var(--color-accent);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8' fill='none'%3E%3Cpath d='M1 3.5L3.8 6.5L9 1' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 8.33px 5px;
}

.consultation__agreement.is-invalid .consultation__checkbox:checked {
    box-shadow: none;
    background-color: var(--color-accent);
}

.consultation__button {
    margin-top: 48px;
    height: 50px;
    min-height: 50px;
    width: 100%;
    padding: 16px 24px;
    border: 1px dashed var(--color-accent);
    border-radius: 16px;
    background: var(--color-accent);
    font-family: var(--font-family);
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
    color: #fff;
    cursor: pointer;
    transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
}

.consultation__button:hover,
.consultation__button:focus-visible {
    background: var(--color-accent);
    color: #fff;
}

.consultation__button-text--desktop {
    display: none;
}

@media (min-width: 1024px) {
    .consultation__panel {
        border-radius: 24px;
        padding: 32px;
    }

    .consultation__grid {
        grid-template-columns: minmax(0, 552px) minmax(0, 526px);
        justify-content: space-between;
        align-items: start;
        gap: 48px;
        min-height: 338px;
    }

    .consultation__content {
        max-width: 552px;
    }

    .consultation__title {
        font-size: 48px;
    }

    .consultation__text {
        margin-top: 32px;
        max-width: 552px;
        font-size: 18px;
    }

    .consultation__form {
        max-width: 526px;
    }

    .consultation__fields {
        gap: 8px;
    }

    .consultation__agreement {
        margin-top: 32px;
    }

    .consultation__button {
        margin-top: 60px;
        background: transparent;
    }

    .consultation__button:hover,
    .consultation__button:focus-visible {
        background: var(--color-accent);
        color: #fff;
    }

    .consultation__button-text--mobile {
        display: none;
    }

    .consultation__button-text--desktop {
        display: inline;
    }
}

@media (min-width: 1440px) {
    .consultation__panel {
        padding: 40px;
    }
}

/* Levels / Frame 358 — mobile 1808:7206, desktop 1693:23001 */
.levels__stack {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.levels__panel {
    overflow: hidden;
    border-radius: 16px;
    background: #fff;
    padding: 16px;
}

.levels__panel--intro {
    position: relative;
    overflow: hidden;
    min-height: 300px;
    height: 300px;
    background: var(--color-footer-bg);
    color: #fff;
}

.levels__intro {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 0;
}

.levels__intro-copy {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 709px;
}

.levels__intro-title {
    margin: 0;
    font-family: var(--third-family);
    font-size: 32px;
    font-weight: 300;
    line-height: 0.9;
    letter-spacing: -0.05em;
    color: #fff;
}

.levels__intro-text {
    margin: 0;
    max-width: 401px;
    font-family: var(--font-family);
    font-size: 18px;
    font-weight: 400;
    line-height: 1.3;
    color: #fff;
}

.levels__diagram {
    position: absolute;
    right: 0;
    bottom: 0;
    left: auto;
    top: auto;
    width: 280px;
    height: 280px;
    max-width: none;
    margin: 0;
    overflow: hidden;
    pointer-events: none;
}

.levels__diagram-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: bottom right;
}

.levels__diagram-image--desktop {
    display: none;
}

.levels__employees,
.levels__media {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.levels__employees {
    gap: 32px;
}

.levels__panel-title {
    margin: 0;
    font-family: var(--third-family);
    font-size: 24px;
    font-weight: 300;
    line-height: 0.9;
    letter-spacing: -0.05em;
    color: #212121;
}

.levels__columns {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
}

.levels__column {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

.levels__column:nth-child(2) {
    gap: 21px;
}

.levels__column-text {
    margin: 0;
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.3;
    color: #212121;
}

.levels__column-lead {
    display: block;
    font-weight: 600;
    color: var(--color-accent);
}

.levels__column-body {
    display: block;
}

.levels__employees .levels__column:first-child .levels__chip {
    padding: 8px 16px;
}

.levels__media-copy {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

.levels__media-text {
    margin: 0;
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.3;
    color: #212121;
}

.levels__media-visual {
    position: relative;
    width: 100%;
    aspect-ratio: 311 / 155;
    flex-shrink: 0;
    overflow: hidden;
    border-radius: 8px;
}

.levels__media-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}

.levels__chips {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.levels__chip {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    padding: 8px;
    border: 1px solid var(--color-accent);
    border-radius: 33px;
    font-family: var(--font-family);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.3;
    color: #212121;
}

@media (min-width: 1024px) {
    .levels__panel {
        border-radius: 24px;
        padding: 32px;
    }

    .levels__panel--intro {
        height: auto;
        min-height: 364px;
    }

    .levels__intro {
        position: relative;
        flex-direction: row;
        justify-content: space-between;
        align-items: stretch;
        gap: 40px;
        min-height: 300px;
    }

    .levels__intro-title {
        font-size: 48px;
    }

    .levels__diagram {
        left: auto;
        top: -32px;
        right: 0;
        bottom: -32px;
        width: min(762px, 60%);
        max-width: 764px;
        height: auto;
    }

    .levels__diagram-image {
        object-fit: cover;
        object-position: top right;
    }

    .levels__diagram-image--mobile {
        display: none;
    }

    .levels__diagram-image--desktop {
        display: block;
    }

    .levels__employees {
        gap: 48px;
        min-height: 300px;
        justify-content: space-between;
    }

    .levels__panel-title {
        font-size: 48px;
    }

    .levels__columns {
        grid-template-columns: repeat(2, minmax(0, 600px));
        justify-content: space-between;
        gap: 16px;
    }

    .levels__column:nth-child(2) {
        gap: 16px;
    }

    .levels__column-text {
        font-size: 18px;
    }

    .levels__employees .levels__column:first-child .levels__chip {
        padding: 8px 16px;
    }

    .levels__media {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        min-height: 300px;
    }

    .levels__media-copy {
        flex: 1 1 700px;
        max-width: 700px;
        min-height: 300px;
        justify-content: space-between;
    }

    .levels__media-text {
        font-size: 18px;
    }

    .levels__media-visual {
        flex: 0 0 600px;
        width: 600px;
        height: 300px;
        aspect-ratio: auto;
    }

    .levels__chip {
        padding: 8px 16px;
    }
}

@media (min-width: 1440px) {
    .levels__panel {
        padding: 40px;
    }

    .levels__diagram {
        top: -40px;
        bottom: -40px;
    }
}

/* How / Frame 334 desktop + Frame 349 mobile — Swiper */
.how__inner {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 32px;
}

.how__eyebrow {
    margin: 0;
    max-width: 235px;
    font-family: var(--third-family);
    font-size: 20px;
    font-weight: 300;
    line-height: 0.9;
    letter-spacing: -0.05em;
    color: #212121;
}

.how__eyebrow-bracket {
    color: var(--color-accent);
}

.how__title {
    margin: 0;
    max-width: none;
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.3;
    color: #212121;
}

.how__slider-wrap {
    width: 100%;
    min-width: 0;
    overflow: hidden;
}

.how__slider {
    overflow: visible;
}

.how__slider .swiper-slide {
    height: auto;
    box-sizing: border-box;
    width: min(319px, 100%);
}

.how__card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 10px;
    height: 100%;
    min-height: 492px;
    padding: 20px;
    border-radius: 16px;
    background: #fff;
    box-sizing: border-box;
}

.how__card--number-wide {
    justify-content: flex-start;
    gap: 16px;
}

.how__card-top {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.how__card-badge {
    display: flex;
    gap: 4px;
    align-items: stretch;
    min-height: 64px;
}

.how__card-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 64px;
    width: 64px;
    min-height: 64px;
    border-radius: 4px;
    box-sizing: border-box;
    font-family: var(--font-family);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3;
}

.how__card-badge--split .how__card-number {
    background: transparent;
    border: 1px dashed var(--color-accent);
    color: #212121;
}

.how__card-badge--split .how__card-bar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 1 1 auto;
    min-width: 0;
    border-radius: 4px;
    box-sizing: border-box;
    background: transparent;
    border: 1px dashed var(--color-accent);
    color: var(--color-accent);
}

.how__card-arrow {
    display: block;
    width: min(99px, 70%);
    height: auto;
    max-width: 98px;
}

.how__card--number-wide .how__card-badge,
.how__card-badge--wide {
    gap: 0;
}

.how__card-badge--wide .how__card-number,
.how__card--number-wide .how__card-number {
    flex: 1 1 auto;
    width: 100%;
    background: var(--color-accent);
    border: 0;
    color: #fff;
}

.how__card-text {
    margin: 0;
    font-family: var(--font-family);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3;
    color: #212121;
}

.how__card-visual {
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 8px;
    overflow: hidden;
    flex: 0 0 auto;
}

.how__card-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.how__pagination {
    position: static;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    height: 8px;
    margin-top: 16px;
}

.how__pagination .swiper-pagination-bullet {
    display: block;
    width: 8px;
    height: 8px;
    margin: 0 !important;
    border-radius: 20px;
    background: #a2a2a2;
    opacity: 1;
}

.how__pagination .swiper-pagination-bullet-active {
    width: 24px;
    background: var(--color-accent);
}

@media (min-width: 1024px) {
    .how__title {
        max-width: 526px;
        font-size: 18px;
    }

    .how__slider .swiper-slide {
        width: auto;
    }

    .how__card {
        min-height: 484px;
        padding: 16px;
    }

    .how__pagination {
        display: none;
    }
}

/* Tech / Frame 338 + mobile Frame 334 */
.tech__inner {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.tech__copy {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
}

.tech__head {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.tech__eyebrow {
    margin: 0;
    font-family: var(--third-family);
    font-size: 20px;
    font-weight: 300;
    line-height: 0.9;
    letter-spacing: -0.05em;
    color: #212121;
}

.tech__eyebrow-bracket {
    color: var(--color-accent);
}

.tech__title {
    margin: 0;
    font-family: var(--third-family);
    font-size: 32px;
    font-weight: 300;
    line-height: 0.9;
    letter-spacing: -0.05em;
    color: #212121;
}

.tech__text {
    margin: 0;
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.3;
    color: #212121;
}

.tech__text-accent {
    color: var(--color-accent);
}

.tech__features {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

.tech__feature {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.tech__icon {
    display: block;
    flex: 0 0 auto;
    width: 64px;
    height: 64px;
}

.tech__feature-text {
    margin: 0;
    flex: 1 1 auto;
    min-width: 0;
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.3;
    color: #212121;
}

.tech__feature-lead {
    font-weight: 600;
}

@media (min-width: 1024px) {
    .tech__inner {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
        gap: 48px;
    }

    .tech__copy {
        max-width: 646px;
        flex: 1 1 646px;
    }

    .tech__title {
        font-size: 48px;
    }

    .tech__text {
        font-size: 18px;
    }

    .tech__features {
        max-width: 526px;
        flex: 0 1 526px;
    }

    .tech__feature {
        align-items: center;
    }

    .tech__icon {
        width: 100px;
        height: 100px;
    }
}

/* Demo panel / Frame 2147237192 */
.demo__inner {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.demo__title {
    margin: 0;
    font-family: var(--third-family);
    font-size: 20px;
    font-weight: 300;
    line-height: 0.9;
    letter-spacing: -0.05em;
    color: #212121;
}

.demo__title-bracket {
    color: var(--color-accent);
}

.demo__panel {
    overflow: hidden;
    border: 1px solid #212121;
    border-radius: 16px;
    background: #2d2d2d;
}

.demo__panel--embed {
    aspect-ratio: 1300 / 720;
    min-height: 420px;
}

.demo__image {
    display: block;
    width: 100%;
    height: auto;
}

.demo__frame {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    background: #173343;
}

@media (min-width: 1024px) {
    .demo__panel {
        border-radius: 24px;
    }

    .demo__panel--embed {
        min-height: 640px;
    }
}

/* Track / Frame 2147237194 */
.track__inner {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.track__title {
    margin: 0;
    font-family: var(--third-family);
    font-size: 20px;
    font-weight: 300;
    line-height: 0.9;
    letter-spacing: -0.05em;
    color: #212121;
}

.track__title-bracket {
    color: var(--color-accent);
}

.track__grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 8px;
    grid-template-columns: 1fr;
}

.track__card {
    display: flex;
    align-items: center;
    min-height: 78px;
    padding: 16px;
    border-radius: 16px;
    box-sizing: border-box;
}

.track__card--accent {
    background: var(--color-accent);
}

.track__card--dark {
    background: var(--color-footer-bg);
}

.track__card--outline {
    background: transparent;
    border: 1px dashed var(--color-accent);
}

.track__card-text {
    margin: 0;
    font-family: var(--font-family);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3;
}

.track__card-accent {
    color: var(--color-accent);
}

.track__card--ink-light .track__card-text {
    color: #fff;
}

.track__card--ink-dark .track__card-text {
    color: #2d2d2d;
}

@media (min-width: 1024px) {
    .track__grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .track__card {
        padding: 20px 16px;
    }
}

/* About / Frame 368 */
.about__grid {
    display: grid;
    gap: 32px;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
        "title"
        "logo"
        "button"
        "info";
}

.about__title {
    grid-area: title;
    margin: 0;
    font-family: var(--third-family);
    font-size: 20px;
    font-weight: 300;
    line-height: 0.9;
    letter-spacing: -0.05em;
    color: #212121;
}

.about__title-bracket {
    color: var(--color-accent);
}

.about__logo {
    grid-area: logo;
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
}

.about__button {
    grid-area: button;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    height: 50px;
    min-height: 50px;
    padding: 0 24px;
    border: 1px dashed var(--color-accent);
    border-radius: 16px;
    background: transparent;
    font-family: var(--font-family);
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    color: #212121;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.about__button:hover,
.about__button:focus-visible {
    background: var(--color-accent);
    color: #212121;
}

.about__info {
    grid-area: info;
    display: flex;
    flex-direction: column;
    gap: 32px;
    margin-top: 16px; /* 32 grid + 16 = 48 from button */
}

.about__text {
    margin: 0;
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.3;
    color: #212121;
}

.about__text-accent {
    color: var(--color-accent);
}

.about__metrics {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
    justify-items: center;
}

.about__metric {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
    max-width: 210px;
    min-width: 0;
}

.about__metric-value {
    font-family: var(--third-family);
    font-size: 80px;
    font-weight: 700;
    line-height: 84px;
    letter-spacing: -0.05em;
    color: rgba(0, 0, 0, 0.8);
}

.about__metric-label {
    font-family: var(--second-family);
    font-size: 21px;
    font-weight: 400;
    line-height: 31px;
    color: rgba(0, 0, 0, 0.8);
}

@media (min-width: 1024px) {
    .about__grid {
        grid-template-columns: minmax(0, 526px) minmax(0, 657px);
        grid-template-areas:
            "title info"
            "logo  info"
            "button info";
        justify-content: space-between;
        align-items: start;
        column-gap: 117px;
        row-gap: 64px;
    }

    .about__info {
        align-self: end;
        margin-top: 0;
        gap: 32px;
        max-width: 657px;
    }

    .about__logo {
        max-width: 526px;
    }

    .about__text {
        font-size: 21px;
        line-height: 31px;
    }

    .about__metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 17px;
        justify-items: stretch;
    }

    .about__metric {
        max-width: none;
    }
}


/* Network / Frame 361 */
.network__panel {
    border-radius: 16px;
    background: var(--color-accent);
    color: #fff;
    padding: 16px;
}

.network__grid {
    display: grid;
    gap: 32px;
}

.network__title {
    margin: 0;
    font-family: var(--third-family);
    font-size: 32px;
    font-weight: 300;
    line-height: 1;
    letter-spacing: -0.05em;
    color: #fff;
}

.network__text {
    margin: 16px 0 0;
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.3;
    color: #fff;
}

.network__metrics {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    column-gap: 8px;
    row-gap: 8px;
    width: 100%;
}

.network__metric {
    display: contents;
}

.network__metric-value,
.network__metric-label {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 55px;
    padding: 0 10px;
    border-radius: 8px;
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.3;
    color: #fff;
}

.network__metric-value {
    background: #212121;
    border: 1px dashed #212121;
    text-align: center;
    white-space: nowrap;
}

.network__metric-label {
    min-width: 0;
    background: transparent;
    border: 1px dashed #fff;
    text-align: left;
    white-space: pre-line;
}

@media (min-width: 1024px) {
    .network__panel {
        border-radius: 24px;
        padding: 32px;
    }

    .network__grid {
        grid-template-columns: minmax(0, 552px) minmax(0, 526px);
        justify-content: space-between;
        align-items: start;
        gap: 48px;
    }

    .network__title {
        font-size: 48px;
    }

    .network__text {
        max-width: 410px;
        font-size: 18px;
    }

    .network__metrics {
        max-width: 526px;
        grid-template-columns: 200px minmax(0, 1fr);
    }

    .network__metric-label {
        justify-content: center;
        text-align: center;
        white-space: normal;
    }
}

@media (min-width: 1440px) {
    .network__panel {
        padding: 40px;
    }
}

/* FAQ / Frame 362 */
.faq__panel {
    border-radius: 16px;
    background: #fff;
    padding: 16px;
}

.faq__inner {
    display: grid;
    gap: 32px;
}

.faq__title {
    margin: 0;
    font-family: var(--third-family);
    font-size: 20px;
    font-weight: 300;
    line-height: 0.9;
    letter-spacing: -0.05em;
    color: #212121;
}

.faq__title-bracket {
    color: var(--color-accent);
}

.faq__list {
    display: grid;
    gap: 8px;
}

.faq__item {
    display: grid;
    gap: 16px;
    padding: 4px;
    border-radius: 8px;
    background: #f5f5f5;
    transition: background-color 0.2s ease;
}

.faq__item:hover,
.faq__item:focus-within {
    background: #d7d7d7;
}

.faq__trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    min-height: 48px;
    padding: 12px;
    text-align: left;
    border-radius: 0;
    background: transparent;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.faq__question {
    flex: 1 1 auto;
    min-width: 0;
    font-family: var(--font-family);
    font-size: 18px;
    font-weight: 400;
    line-height: 1.1;
    color: #212121;
}

.faq__icon {
    position: relative;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
}

.faq__icon::before,
.faq__icon::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    background: #212121;
    transform: translate(-50%, -50%);
}

.faq__icon::before {
    width: 14px;
    height: 2.8px;
}

.faq__icon::after {
    width: 2.8px;
    height: 14px;
    transition: opacity 0.2s ease;
}

.faq__item.is-open .faq__icon::after {
    opacity: 0;
}

.faq__answer {
    min-width: 0;
}

.faq__answer-inner {
    padding: 8px;
    border-radius: 8px;
    background: #fff;
}

.faq__answer-text {
    margin: 0;
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.2;
    color: #303030;
}

@media (min-width: 1024px) {
    .faq__panel {
        border-radius: 24px;
        padding: 32px;
    }

    .faq__answer-inner {
        padding: 16px;
    }

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

@media (min-width: 1440px) {
    .faq__panel {
        padding: 40px;
    }
}

/* Market / Frame 360 */
.market {
    overflow: visible;
}

.market__inner {
    position: relative;
    display: grid;
    gap: 32px;
}

.market__bg {
    display: none;
    position: absolute;
    top: -109px;
    left: 42.076923%;
    width: 56.461538%;
    height: auto;
    max-width: none;
    pointer-events: none;
    user-select: none;
    z-index: 0;
}

.market__title,
.market__grid {
    position: relative;
    z-index: 1;
}

.market__title {
    margin: 0;
    font-family: var(--third-family);
    font-size: 20px;
    font-weight: 300;
    line-height: 0.9;
    letter-spacing: -0.05em;
    color: #212121;
}

.market__title-bracket {
    color: var(--color-accent);
}

.market__grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 8px;
    grid-template-columns: 1fr;
}

.market__card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 16px;
    min-height: 0;
    padding: 16px;
    border-radius: 16px;
    border: 1px solid transparent;
}

.market__card--accent {
    background: var(--color-accent);
    color: #fff;
}

.market__card--dark {
    background: #2d2d2d;
    color: #fff;
}

.market__card--outline {
    background: transparent;
    border: 1px dashed var(--color-accent);
    color: #2d2d2d;
}

.market__text {
    margin: 0;
    font-family: var(--font-family);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3;
}

.market__source {
    display: inline-block;
    font-family: var(--font-family);
    font-size: 18px;
    font-weight: 600;
    line-height: 23px;
    text-decoration: underline;
    text-underline-offset: 2px;
    color: inherit;
}

.market__card--accent .market__source {
    color: #fff;
}

.market__card--dark .market__source {
    color: #a2a2a2;
}

.market__card--outline .market__source {
    color: rgba(0, 0, 0, 0.8);
}

.market__card--extra {
    display: none;
}

.market.is-expanded .market__card--extra {
    display: flex;
}

.market__more {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 45px;
    padding: 12px 16px;
    border-radius: 16px;
    background: #212121;
    color: #fff;
    font-family: var(--font-family);
    font-size: 18px;
    font-weight: 400;
    line-height: 1;
    text-align: center;
}

.market.is-expanded .market__more {
    display: none;
}

@media (min-width: 1024px) {
    .market__bg {
        display: block;
    }

    .market__grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .market__card {
        min-height: 163px;
        gap: 32px;
    }

    .market__card--extra {
        display: flex;
    }

    .market__card--wide {
        grid-column: span 2;
    }

    .market__more {
        display: none;
    }

    .market__card--accent:hover,
    .market__card--dark:hover {
        border-color: var(--color-accent);
        border-style: dashed;
    }
}

/* Cookies */
.cookies {
    position: fixed;
    z-index: 100;
    top: auto;
    right: var(--page-pad-x);
    bottom: 16px;
    left: var(--page-pad-x);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 32px;
    width: auto;
    max-width: none;
    margin: 0;
    padding: 16px;
    border: 1px solid var(--color-footer-muted);
    border-radius: 8px;
    background: #fff;
}

.cookies[hidden] {
    display: none !important;
}

.cookies__text {
    margin: 0;
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.1;
    color: #212121;
}

.cookies__link {
    color: var(--color-accent);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.cookies__accept {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 100%;
    height: 48px;
    min-height: 48px;
    padding: 0 24px;
    border: 1px dashed var(--color-accent);
    border-radius: 16px;
    background: transparent;
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    color: #212121;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.cookies__accept:hover,
.cookies__accept:focus-visible {
    background: var(--color-accent);
    color: #212121;
}

@media (min-width: 1024px) {
    .cookies {
        right: auto;
        bottom: max(16px, var(--page-pad-bottom));
        flex-direction: row;
        align-items: center;
        width: 722px;
        max-width: 722px;
    }

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

    .cookies__accept {
        width: auto;
        min-width: 192px;
    }
}

/* Metrics / Frame 2147237193 */
.metrics__inner {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.metrics__title {
    margin: 0;
    font-family: var(--third-family);
    font-size: 20px;
    font-weight: 300;
    line-height: 0.9;
    letter-spacing: -0.05em;
    color: #212121;
}

.metrics__title-bracket {
    color: var(--color-accent);
}

.metrics__desktop {
    display: none;
}

.metrics__mobile {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

.metrics__slider-wrap {
    width: calc(100% + var(--page-pad-x));
    margin-right: calc(var(--page-pad-x) * -1);
    min-width: 0;
    overflow: hidden;
}

.metrics__slider {
    overflow: visible;
}

.metrics__slider .swiper-slide {
    width: min(322px, 100%);
    height: auto;
}

.metrics__card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    box-sizing: border-box;
    min-height: 570px;
    height: 100%;
    padding: 8px;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 4px 100px rgba(0, 0, 0, 0.1);
}

.metrics__card-head {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 10px;
    padding: 16px 8px 16px 16px;
    border-radius: 16px;
    background: #212121;
    color: #fff;
}

.metrics__card-title {
    margin: 0;
    font-family: var(--font-family);
    font-size: 24px;
    font-weight: 600;
    line-height: 1.3;
}

.metrics__card-text {
    margin: 0;
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.3;
}

.metrics__timer {
    position: relative;
    display: block;
    width: 100%;
    height: 5px;
    overflow: hidden;
    border-radius: 20px;
    opacity: 0.8;
}

.metrics__timer-track,
.metrics__timer-fill {
    position: absolute;
    border-radius: 20px;
}

.metrics__timer-track {
    inset: 0;
    background: #dfdede;
}

.metrics__timer-fill {
    top: 0;
    bottom: 0;
    left: 0;
    width: calc(100% * var(--metrics-progress, 0));
    background: var(--color-accent);
}

.metrics__card-visual {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    background: #212121;
}

.metrics__card-image {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
}

.metrics__pagination {
    position: static;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    width: 100%;
    height: 8px;
    margin: 0;
}

.metrics__pagination .swiper-pagination-bullet {
    display: block;
    width: 8px;
    height: 8px;
    margin: 0 !important;
    border-radius: 20px;
    background: #a2a2a2;
    opacity: 1;
}

.metrics__pagination .swiper-pagination-bullet-active {
    width: 24px;
    background: var(--color-accent);
}

@media (min-width: 1024px) {
    .metrics__mobile {
        display: none;
    }

    .metrics__desktop {
        display: flex;
        align-items: stretch;
        gap: 10px;
        min-height: 382px;
    }

    .metrics__tabs {
        display: flex;
        flex-direction: column;
        flex: 0 0 315px;
        width: 315px;
        gap: 8px;
    }

    .metrics__tab {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        box-sizing: border-box;
        width: 100%;
        min-height: 115px;
        margin: 0;
        padding: 16px 8px 16px 16px;
        border: 0;
        border-radius: 16px;
        background: #fff;
        color: #212121;
        text-align: left;
        cursor: pointer;
        transition: background-color 0.2s ease, color 0.2s ease;
    }

    .metrics__tab:hover,
    .metrics__tab:focus-visible {
        background: #a2a2a2;
        outline: none;
    }

    .metrics__tab.is-active {
        background: #212121;
        color: #fff;
    }

    .metrics__tab.is-active:hover,
    .metrics__tab.is-active:focus-visible {
        background: #212121;
    }

    .metrics__tab-copy {
        display: flex;
        flex: 1 1 auto;
        flex-direction: column;
        gap: 10px;
        min-width: 0;
    }

    .metrics__tab-title {
        font-family: var(--font-family);
        font-size: 24px;
        font-weight: 600;
        line-height: 1.3;
    }

    .metrics__tab-text {
        font-family: var(--font-family);
        font-size: 16px;
        font-weight: 400;
        line-height: 1.3;
    }

    .metrics__timer {
        position: relative;
        flex: 0 0 5px;
        width: 5px;
        height: 99px;
        margin-top: -8px;
        overflow: hidden;
        border-radius: 20px;
        opacity: 0.8;
    }

    .metrics__timer-track,
    .metrics__timer-fill {
        position: absolute;
        left: 0;
        width: 100%;
        border-radius: 20px;
    }

    .metrics__timer-track {
        inset: 0;
        background: rgba(162, 162, 162, 0.2);
    }

    .metrics__tab.is-active .metrics__timer-track,
    .metrics__tab:hover .metrics__timer-track {
        background: #dfdede;
    }

    .metrics__timer-fill {
        top: 0;
        right: auto;
        bottom: auto;
        width: 100%;
        height: calc(100% * var(--metrics-progress, 0));
        background: var(--color-accent);
    }

    .metrics__stage {
        flex: 1 1 auto;
        min-width: 0;
        overflow: hidden;
        border-radius: 16px;
        background: #212121;
    }

    .metrics__stage .swiper-slide {
        height: auto;
    }

    .metrics__panel {
        box-sizing: border-box;
    }

    .metrics__image {
        display: block;
        width: 100%;
        height: auto;
    }
}