/* ==========================================================================
   0. Import Component Styles
   ========================================================================== */
/* Компоненты */
@import url('components/buttons.css?ver=1.0.4.3');

@import url('components/modal.css?ver=1.0.4.3');

/* @import url('sections/cards.css');
@import url('sections/forms.css');
@import url('sections/modals.css'); */

/* Секции */
@import url('sections/header.css?ver=1.0.4.3');
@import url('sections/hero.css?ver=1.0.4.3');
@import url('sections/breadcrumbs.css?ver=1.0.4.3');

@import url('sections/footer.css?ver=1.0.4.3');
/* @import url('sections/footer.css');
@import url('sections/sidebar.css'); */

/* Страницы */
/* @import url('pages/contacts.css'); */
/* @import url('pages/analitika.css'); */


/* @import url('pages/page.css'); */


/* @import url('pages/digest.css'); */
/* Хелперы */
/* @import url('utils/helpers.css'); */

/* Roboto Flex подключается через wp_enqueue (cleom-font-roboto-flex), не дублировать @import */

/* ==========================================================================
   1. CSS Variables (Custom Properties)
   ========================================================================== */
:root {

    --color-white: #ffffff;
    --color-black: #080624;
    --color-blue: #0066F6;
    --color-dark-blue: #221B84;
    --color-gray: #F1F1F4;
    --color-light-blue: #E0EDFE;
    --color-light-gray: #F1F1F1;

    --line-height: 1.2em;
    --letter-spacing: 0.02em;

    --transition-duration: 0.3s;
    /* --transition-timing: linear; */
    --transition-timing: ease-out;
    --transition-default: all var(--transition-duration) var(--transition-timing);

    /* Отступы контейнера */
    --container-x: 3.125rem;
    --container-y-s: 7.5rem;
    --container-y-m: 9.375rem;

    --linear: linear-gradient(231.04deg, #7E9EF2 -39.21%, #93B1FF -7.37%, #0066F6 59.46%, #1E51D5 99.57%);

    --font-family: "Roboto Flex", sans-serif;

}

/* Пустые ссылки и кнопки-заглушки: hover как у обычных, клик блокирует cleom-inert-controls.js */

/* Contact links — hover site-wide */
a[href^="tel:"],
a[href^="mailto:"] {
    transition:
        color var(--transition-duration) var(--transition-timing),
        text-decoration-color var(--transition-duration) var(--transition-timing),
        -webkit-text-fill-color var(--transition-duration) var(--transition-timing);
}

@media (hover: hover) {
    a[href^="tel:"]:hover,
    a[href^="tel:"]:focus-visible {
        color: rgba(0, 102, 246, 1);
        -webkit-text-fill-color: rgba(0, 102, 246, 1);
        background: none;
        -webkit-background-clip: border-box;
        background-clip: border-box;
    }

    a[href^="tel:"]:hover::after,
    a[href^="tel:"]:focus-visible::after {
        opacity: 0;
    }

    a[href^="mailto:"]:hover,
    a[href^="mailto:"]:focus-visible {
        color: rgba(0, 102, 246, 1);
        -webkit-text-fill-color: rgba(0, 102, 246, 1);
        text-decoration: underline;
        text-underline-offset: 0.12em;
    }
}


/* ==========================================================================
   2. Reset & Base Styles
   ========================================================================== */
* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-family: var(--font-family);
    text-rendering: geometricPrecision;
    font-style: normal;
    font-optical-sizing: none;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-smooth: never;
}

html {
    font-size: calc(100vw / 90);
    scrollbar-width: thin;
    overflow-x: hidden;
    margin-right: calc(-1 * (100vw - 100%));
}

body {
    position: relative;
    /* overflow-x: hidden; */
    background: var(--color-white);
    scroll-behavior: smooth;
    font-variation-settings: "GRAD" 0, "opsz" 16, "wdth" 100;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
}

br._mob {
    display: none !important;
}

.error404 .footer {
    display: none;
}

.error404 {
    background: #111111;
}

.not-found-page {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100dvh;
    overflow: hidden;
    padding: 5.625rem 1.25rem 2.5rem;
}

.not-found-page__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.not-found-page__bg-img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}

.not-found-page__content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 2.5rem;
    width: 100%;
    max-width: 36.375rem;
}

.not-found-page__title {
    margin: 0;
    font-family: var(--font-family);
    font-synthesis: none;
    font-weight: 400;
    font-style: normal;
    font-variation-settings:
        "wght" 400,
        "GRAD" 0,
        "slnt" 0,
        "XOPQ" 150,
        "XTRA" 505,
        "YOPQ" 105,
        "YTAS" 750,
        "YTDE" -130,
        "YTFI" 738,
        "YTLC" 510,
        "YTUC" 680,
        "wdth" 111,
        "opsz" 100;
    font-size: 18.75rem;
    line-height: 0.85;
    letter-spacing: 0.05em;
    text-align: center;
    /* padding-block: 0.08em 0.14em; */
    background: linear-gradient(290.12deg, #eff4ff 69.48%, rgba(239, 244, 255, 0.11) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    overflow: visible;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}

.not-found-page__message {
    margin: 0;
    /* max-width: 28.125rem; */
    font-family: var(--font-family);
    font-synthesis: none;
    font-weight: 300;
    font-style: normal;
    font-variation-settings:
        "wght" 300,
        "GRAD" 0,
        "slnt" 0,
        "XOPQ" 96,
        "XTRA" 468,
        "YOPQ" 79,
        "YTAS" 750,
        "YTDE" -203,
        "YTFI" 738,
        "YTLC" 514,
        "YTUC" 712,
        "wdth" 140,
        "opsz" 16;
    font-size: 1.25rem;
    line-height: 1.2;
    letter-spacing: -0.03em;
    text-align: center;
    color: #eff4ff;
}

.error404 .not-found-page .not-found-page__button {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    width: 12.375rem;
    min-height: 2.9375rem;
    padding: 0.9375rem 1.25rem;
    border: none;
    border-radius: 6.25rem;
    background: #ff383c;
    font-family: var(--font-family);
    font-synthesis: none;
    font-weight: 600;
    font-style: normal;
    font-variation-settings:
        "wght" 600,
        "GRAD" 0,
        "slnt" 0,
        "XOPQ" 96,
        "XTRA" 468,
        "YOPQ" 79,
        "YTAS" 750,
        "YTDE" -203,
        "YTFI" 738,
        "YTLC" 514,
        "YTUC" 712,
        "wdth" 140,
        "opsz" 16;
    font-size: 0.875rem;
    line-height: 1.2;
    letter-spacing: -0.03em;
    text-align: center;
    color: #eff4ff;
    white-space: nowrap;
    text-decoration: none;
    cursor: pointer;
    transition: var(--transition-default);
}

.error404 .not-found-page .not-found-page__button:hover {
    background: #ff383c;
    color: #eff4ff;
    filter: brightness(1.08);
}

.made-by {
    height: 2.375rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 1.25rem;
    background: #ffffff10;
    color: var(--color-white);
    border-radius: .3125rem;
    text-decoration: none;
    cursor: pointer;

    font-weight: 400;
    font-variation-settings: "wght" 400;
    font-size: .875rem;
    line-height: 1.2em;

}

@media screen and (max-width:47.9375rem) {
    html {
        font-size: calc(100vw / 24.375);
    }

    body {
        /* padding-bottom: 4rem; */
    }

    br._mob {
        display: block !important;
    }

    .error404 .footer {
        display: none;
    }

    .not-found-page {
        min-height: 100dvh;
        padding: 4.375rem 1.25rem 2.5rem;
    }

    .not-found-page__content {
        gap: 1.25rem;
        max-width: 20.3125rem;
    }

    .not-found-page__title {
        font-size: 9.375rem;
        line-height: 0.85;
        letter-spacing: 0.05em;
        /* padding-block: 0.08em 0.14em; */
    }

    .not-found-page__message {
        /* max-width: 18.3125rem; */
        font-size: 1rem;
        line-height: 1.2;
        letter-spacing: -0.03em;
    }

    .error404 .not-found-page .not-found-page__button {
        width: 12.375rem;
        min-height: 2.9375rem;
        padding: 0.9375rem 1.25rem;
        gap: 0.625rem;
        border-radius: 6.25rem;
        font-size: 0.875rem;
        line-height: 1.2;
        letter-spacing: -0.03em;
    }

}

@media screen and (max-height: 54.0625rem) {
    .feedback-modal,
    .modal.services-panel-modal {
        font-size: calc(100vh / 54.45);
    }
}