/* AIZECOM · mobile nav 2026 (07.10.2026, 15:48; layout 16:05; no tab stripe 16:16)
   Port of the Arena «NAV LAB» variant №04 «FAB · вылет по дуге»: bar with a notch,
   big «+» in the centre, quick actions fan out in an arc. Phones only (<= 768px).
   Markup is built by /js/mobile-nav-2026.js. Desktop is untouched. */
.az-mnav { display: none; }

@media (max-width: 768px) {
    .az-mnav {
        --mn-a: #67e8f9;            /* accent (icons, active label, pulse rings) */
        --mn-g1: #22d3ee;           /* FAB / indicator gradient start */
        --mn-g2: #8b5cf6;           /* FAB / indicator gradient end */
        --mn-text: #ffffff;         /* «+» colour on the FAB */
        --mn-glow: rgba(129, 128, 252, 0.55);
        --mn-bar: #0e0e15;
        --mn-safe: env(safe-area-inset-bottom, 0px);
        --mn-spring-arc: cubic-bezier(.34, 1.56, .64, 1);
        --mn-spring-rot: cubic-bezier(.34, 1.45, .64, 1);
        display: block;
        position: fixed;
        inset: 0;
        z-index: 45;                /* above page + /ru/dev/ calc bar (40), below modals (50) and chats (80/1200) */
        pointer-events: none;
        font-family: "Inter", "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
        -webkit-tap-highlight-color: transparent;
    }
    @supports (transition-timing-function: linear(0, 1)) {
        .az-mnav {
            /* real springs from the Arena build: 540/21 (actions), 380/20 («+» rotation) */
            --mn-spring-arc: linear(0, 0.0302, 0.1107, 0.2263, 0.3631, 0.5087, 0.6529, 0.7874, 0.9066, 1.0066, 1.0855, 1.1431, 1.1805, 1.1997, 1.2033, 1.1943, 1.1758, 1.1509, 1.1224, 1.0926, 1.0636, 1.0369, 1.0136, 0.9943, 0.9793, 0.9686, 0.9619, 0.9589, 0.9588, 0.9612, 0.9654, 0.9707, 0.9766, 0.9826, 0.9884, 0.9937, 0.9983, 1.002, 1.0048, 1.0068, 1.008, 1.0084, 1.0083, 1.0077, 1.0068, 1.0057, 1.0045, 1.0032, 1);
            --mn-spring-rot: linear(0, 0.0293, 0.1066, 0.2164, 0.3451, 0.4812, 0.6153, 0.7404, 0.8514, 0.9454, 1.0209, 1.078, 1.1176, 1.1415, 1.152, 1.1515, 1.1426, 1.1278, 1.1091, 1.0886, 1.0678, 1.0479, 1.0299, 1.0144, 1.0016, 0.9916, 0.9844, 0.9797, 0.9772, 0.9766, 0.9774, 0.9794, 0.982, 0.985, 0.9882, 0.9914, 0.9942, 0.9968, 0.9989, 1.0007, 1.002, 1.0028, 1.0034, 1.0036, 1.0035, 1.0033, 1.0029, 1.0025, 1);
        }
    }
    .az-mnav *, .az-mnav *::before, .az-mnav *::after { box-sizing: border-box; }
    /* while the «+» is open the fan sits above everything, incl. an open chat window (z 80 / 1200) */
    .az-mnav.is-open, .az-mnav.is-leaving { z-index: 1300; }
    .az-mnav svg { display: block; flex-shrink: 0; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; }
    .az-mnav button, .az-mnav a { -webkit-appearance: none; appearance: none; margin: 0; border: 0; background: none; color: inherit; font: inherit; text-decoration: none; cursor: pointer; }

    /* backdrop: darken + blur, tap closes */
    .az-mnav-backdrop {
        position: absolute;
        inset: 0;
        z-index: 10;
        display: block;
        width: 100%;
        background: radial-gradient(130% 100% at 50% 100%, rgba(0, 0, 0, 0.78), rgba(0, 0, 0, 0.42)) !important;
        -webkit-backdrop-filter: blur(3px);
        backdrop-filter: blur(3px);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        touch-action: none;
        transition: opacity .24s ease, visibility 0s linear .24s;
    }
    .az-mnav.is-open .az-mnav-backdrop { opacity: 1; visibility: visible; pointer-events: auto; transition: opacity .24s ease, visibility 0s; }

    /* bar */
    .az-mnav-bar {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 20;
        height: calc(72px + var(--mn-safe));
        pointer-events: auto;
    }
    .az-mnav-shape { position: absolute; left: 0; top: 0; width: 100%; height: 72px; overflow: visible; }
    .az-mnav-shape path:first-child { fill: var(--mn-bar); stroke: none; }
    .az-mnav-shape path + path { fill: none; stroke: rgba(255, 255, 255, 0.08); stroke-width: 1; }
    .az-mnav-safe { position: absolute; left: 0; right: 0; top: 71px; bottom: 0; background: var(--mn-bar); }

    /* big «+» */
    .az-mnav-fab {
        position: absolute !important;
        top: -19px;
        left: 50%;
        z-index: 20;
        display: flex !important;
        width: 54px;
        height: 54px;
        padding: 0 !important;
        align-items: center;
        justify-content: center;
        border-radius: 999px !important;
        background: linear-gradient(135deg, var(--mn-g1), var(--mn-g2)) !important;
        color: var(--mn-text) !important;
        box-shadow: 0 14px 34px -8px var(--mn-glow);
        transform: translateX(-50%);
        transition: transform .18s cubic-bezier(.3, 1.4, .6, 1);
    }
    .az-mnav-fab:active { transform: translateX(-50%) scale(.88); }
    .az-mnav-fab:focus-visible { outline: 2px solid var(--mn-a); outline-offset: 3px; }
    .az-mnav-ring {
        position: absolute;
        inset: 0;
        border: 2px solid var(--mn-a);
        border-radius: 999px;
        opacity: 0;
        pointer-events: none;
        animation: az-mnav-ring 2.4s cubic-bezier(0, 0, .58, 1) infinite;
    }
    .az-mnav-ring + .az-mnav-ring { animation-delay: 1.2s; }
    .az-mnav.is-open .az-mnav-ring { display: none; }
    @keyframes az-mnav-ring { from { transform: scale(1); opacity: .5; } to { transform: scale(1.5); opacity: 0; } }
    .az-mnav-plus { display: flex; transition: transform .62s var(--mn-spring-rot); }
    .az-mnav-plus svg { width: 26px; height: 26px; stroke-width: 2.6; }
    .az-mnav.is-open .az-mnav-plus { transform: rotate(135deg); }
    .az-mnav-fab.has-here::after {   /* current page lives inside the «+» menu */
        content: "";
        position: absolute;
        top: 3px;
        right: 3px;
        width: 9px;
        height: 9px;
        border: 2px solid var(--mn-bar);
        border-radius: 999px;
        background: #fff;
    }

    /* 4 side tabs, empty middle cell */
    .az-mnav-tabs {
        position: relative;
        z-index: 10;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        height: 72px;
        padding: 8px 4px 0;
        transition: opacity .22s ease, transform .22s ease;
    }
    .az-mnav.is-open .az-mnav-tabs { opacity: .25; transform: translateY(5px); pointer-events: none; }
    .az-mnav-tab {
        position: relative;
        display: flex !important;
        height: 100%;
        min-width: 0;
        padding: 0 !important;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        color: #71717a !important;
        transition: transform .16s cubic-bezier(.3, 1.4, .6, 1);
    }
    .az-mnav-tab:active { transform: scale(.86); }
    .az-mnav-tab:focus-visible { outline: 2px solid var(--mn-a); outline-offset: -4px; border-radius: 12px; }
    .az-mnav-ico { display: flex; transition: color .2s; }
    .az-mnav-ico svg { width: 20px; height: 20px; stroke-width: 2.2; }
    .az-mnav-lbl {
        max-width: 100%;
        overflow: hidden;
        color: #52525b;
        font-size: 9px;
        font-weight: 700;
        line-height: 13.5px;
        letter-spacing: .025em;
        white-space: nowrap;
        text-overflow: ellipsis;
        transition: color .2s;
    }
    .az-mnav-tab.is-active .az-mnav-ico,
    .az-mnav-tab.is-active .az-mnav-lbl { color: var(--mn-a); }
    .az-mnav-tab.is-active .az-mnav-ico { animation: az-mnav-bounce .5s ease-out both; }
    @keyframes az-mnav-bounce {
        0% { transform: translateY(3px) scale(.92); }
        45% { transform: translateY(-4px) scale(1.1); }
        100% { transform: none; }
    }

    /* actions fanned out in an arc above the «+» */
    .az-mnav-acts {
        position: absolute;
        left: 50%;
        bottom: calc(98px + var(--mn-safe));
        z-index: 30;
        width: 0;
        height: 0;
        pointer-events: none;
    }
    .az-mnav-act {
        position: absolute;
        left: 0;
        bottom: 0;
        opacity: 0;
        visibility: hidden;
        transform: translate(-50%, 40px) scale(0) rotate(-50deg);
    }
    .az-mnav.is-open .az-mnav-act {
        opacity: 1;
        visibility: visible;
        transform: translate(calc(-50% + var(--dx) * 1px), calc(var(--dy) * 1px)) scale(1) rotate(0deg);
        transition: transform .53s var(--mn-spring-arc) calc(var(--i) * 50ms), opacity .2s ease calc(var(--i) * 50ms), visibility 0s;
    }
    .az-mnav.is-leaving .az-mnav-act {
        opacity: 0;
        visibility: visible;
        transform: translate(-50%, 40px) scale(0) rotate(30deg);
        transition: transform .16s cubic-bezier(.25, .1, .25, 1) calc((var(--n) - 1 - var(--i)) * 35ms), opacity .16s ease calc((var(--n) - 1 - var(--i)) * 35ms), visibility 0s linear .32s;
    }
    .az-mnav-act-btn {
        display: flex !important;
        width: 48px;
        height: 48px;
        padding: 0 !important;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(103, 232, 249, 0.35) !important;
        border-radius: 999px !important;
        background: #17151d !important;
        color: var(--mn-a) !important;
        box-shadow: 0 12px 30px -10px var(--mn-glow);
        pointer-events: auto;
    }
    .az-mnav-act-btn svg { width: 18px; height: 18px; stroke-width: 2.2; }
    .az-mnav-act-btn:active { transform: scale(.9); }
    .az-mnav-act-btn:focus-visible { outline: 2px solid var(--mn-a); outline-offset: 3px; }
    .az-mnav-act.is-here .az-mnav-act-btn {
        border-color: transparent !important;
        background: linear-gradient(135deg, var(--mn-g1), var(--mn-g2)) !important;
        color: #fff !important;
    }
    .az-mnav-act-lbl {
        position: absolute;
        left: 50%;
        bottom: -22px;
        padding: 3px 8px;
        border: 1px solid rgba(255, 255, 255, 0.1);
        border-radius: 999px;
        background: rgba(20, 19, 27, 0.95);
        color: #d4d4d8;
        font-size: 9px;
        font-weight: 700;
        line-height: 13.5px;
        white-space: nowrap;
        transform: translateX(-50%);
        pointer-events: none;
    }
    .az-mnav-act.is-here .az-mnav-act-lbl { color: #fff; border-color: rgba(103, 232, 249, 0.45); }
    /* «Чат» in the arc: × while the chat is open */
    .az-mnav-act-chat .is-x { display: none; }
    .az-mnav-act-chat.is-chat-open .is-chat { display: none; }
    .az-mnav-act-chat.is-chat-open .is-x { display: block; }
    /* close button added to the Arena chat panel (its floating button is hidden on phones) */
    .az-mnav-chat-x {
        position: absolute;
        top: 14px;
        right: 14px;
        z-index: 2;
        display: flex;
        width: 32px;
        height: 32px;
        padding: 0;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 10px;
        background: rgba(255, 255, 255, 0.06);
        color: #cbd5e1;
        cursor: pointer;
    }
    .az-mnav-chat-x svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
    .az-mnav-chat-x:active { transform: scale(.92); }
    div.fixed.bottom-24.right-4 > div:first-child > svg:last-child { visibility: hidden; }   /* decorative sparkle under the × */

    @media (prefers-reduced-motion: reduce) {
        .az-mnav-ring { animation: none; }
        .az-mnav-tab.is-active .az-mnav-ico { animation: none; }
        .az-mnav.is-open .az-mnav-act, .az-mnav.is-leaving .az-mnav-act { transition-duration: .01s; transition-delay: 0s; }
    }

    /* ---- page integration (only when the bar is on the page) ---- */
    html.az-mnav-on body { padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px)) !important; }
    /* header-2026: on phones keep logo + RU/EN, the sections live in the bottom bar */
    html.az-mnav-on .az-topbar .desktop-nav { display: none !important; }
    /* old home bottom nav -> replaced */
    html.az-mnav-on .bottom-nav { display: none !important; }
    /* floating chat buttons are merged into the «Чат» tab */
    html.az-mnav-on .ah-chat-fab,
    html.az-mnav-on button.fixed.bottom-6.right-6[aria-label="Открыть чат"] { display: none !important; }
    html.az-mnav-on .ah-chat {
        bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
        height: min(540px, calc(100svh - 160px - env(safe-area-inset-bottom, 0px))) !important;
    }
    html.az-mnav-on div.fixed.bottom-24.right-4 {   /* chat panel on the Arena pages */
        bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
        max-height: calc(100svh - 160px - env(safe-area-inset-bottom, 0px)) !important;
    }
    /* cookie notice sits above the bar */
    html.az-mnav-on body .az-cookie { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
    /* /ru/dev/: the calculator's own mobile summary («… ₽ / Получить расчёт») sits right above the bar */
    html.az-mnav-on body.page-devcalc #root .fixed.inset-x-0.bottom-0 { bottom: calc(72px + env(safe-area-inset-bottom, 0px)) !important; }
}