:root {
    /* Core brand palette — refined for 2026 */
    --one: #0D5D91;
    --one_light: #117BBF;
    --one_dark: #093F63;
    --two: #217DBB;
    --two_light: #3497DB;
    --two_dark: #19608F;
    --three: #935302;
    --three_light: #C56F02;
    --three_dark: #613702;
    --four: #20764D;
    --four_light: #2A9E67;
    --four_dark: #154E33;
    --five: #E38207;
    --five_light: #F99B25;
    --five_dark: #B16605;
    --pagination: #F2FBF2;
    --pagination_hover: #59D39A;
    --pagination_active: #20764D;
    --price: #E38207;
    --a_dark: #252328;
    --a_light: #ffffff;
    --background_white_transparent: rgba(255, 255, 255, 0.7);
    --background_gray_transparent: rgba(0, 0, 0, 0.15);
    --white: #ffffff;
    --gray: #c0c0c0;
    --gray_light: #DADADA;
    --gray_dark: #A6A6A6;

    /* ── 2026 Glassmorphism System (без backdrop-filter!) ── */
    /* Вместо прозрачности с blur — полупрозрачный сплошной цвет */
    --glass-bg: rgba(255, 255, 255, 0.92);
    --glass-bg-strong: #ffffff;
    --glass-border: rgba(200, 210, 220, 0.6);
    --glass-shadow: 0 4px 16px rgba(13, 93, 145, 0.08);
    --glass-shadow-hover: 0 8px 24px rgba(13, 93, 145, 0.12);

    /* ── Soft UI (Neumorphism-lite) ── */
    --soft-shadow:
            6px 6px 12px rgba(180, 190, 200, 0.3),
            -6px -6px 12px rgba(255, 255, 255, 0.9);
    --soft-shadow-inset:
            inset 3px 3px 6px rgba(180, 190, 200, 0.25),
            inset -3px -3px 6px rgba(255, 255, 255, 0.9);
    --soft-shadow-pressed:
            inset 4px 4px 8px rgba(180, 190, 200, 0.3),
            inset -4px -4px 8px rgba(255, 255, 255, 0.9);

    /* ── Gradient Surfaces ── */
    --gradient-surface: linear-gradient(135deg,
    #f8fafc 0%,
    #f0f4f8 50%,
    #e8eef4 100%);
    --gradient-card: linear-gradient(145deg,
    #ffffff 0%,
    #f5f8fc 100%);
    --gradient-accent: linear-gradient(135deg, var(--one_light) 0%, var(--two) 100%);
    --gradient-warm: linear-gradient(135deg, var(--five_light) 0%, var(--three_light) 100%);
    --gradient-success: linear-gradient(135deg, var(--four_light) 0%, var(--four) 100%);

    /* ── Bento Grid Spacing ── */
    --bento-gap: 1.25rem;
    --bento-radius: 1.5rem;
    --bento-radius-sm: 1rem;
    --bento-radius-lg: 2rem;

    /* ── Motion (только transform и opacity!) ── */
    /* transition: all УБРАН — пересчитывает ВСЕ свойства */
    --transition-smooth: transform 0.3s ease, opacity 0.3s ease, box-shadow 0.3s ease;
    --transition-bounce: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
    --transition-color: color 0.2s ease, background-color 0.2s ease;
}


/* ============================================
   BASE & TYPOGRAPHY
   ============================================ */

html, body {
    font-size: 106%;
    /* УБРАНО: background-attachment: fixed — вызывает repaint всей страницы при скролле */
    /* УБРАНО: градиент на body — тяжёлый для рендера */
    background: #f0f4f8;
    min-height: 100vh;
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

@media (max-width: 640px) {
    html, body {
        overflow-x: hidden;
    }
}

::selection {
    background: rgba(13, 93, 145, 0.15);
    color: var(--one_dark);
}

select {
    display: none;
}

.select_no_filter .bs-searchbox {
    display: none;
}

/* ── Form Inputs with Soft UI ── */
.input_double input {
    margin-bottom: -3px;
    padding-left: 6px;
    width: 48% !important;
    display: inline-block;
    background: #e8ecf1;
    border: none;
    border-radius: var(--bento-radius-sm);
    box-shadow: var(--soft-shadow-inset);
    /* УБРАНО: transition: all — заменено на конкретные свойства */
    transition: var(--transition-color), box-shadow 0.2s ease;
}
.input_double input:focus {
    box-shadow: var(--soft-shadow-pressed);
    background: #e0e6ec;
    outline: none;
}
.input_double input:nth-child(2) {
    float: right;
}

.disabled_form {
    pointer-events: none;
    opacity: 0.4;
}

/* ── Search Form: Glassmorphic Panel (без blur!) ── */
.search_form {
    position: relative;
    margin-bottom: 60px;
}
.search_form .card-body {
    padding: 20px 10px;
    /* Вместо backdrop-filter — просто полупрозрачный белый */
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    border-radius: 0 0 var(--bento-radius) var(--bento-radius);
    box-shadow: var(--glass-shadow);
}
.search_form .btn,
.search_form .form-control,
.search_form .col-form-label {
    font-size: 0.99rem;
    line-height: 1.5;
    border-radius: var(--bento-radius-sm);
}
.search_form .form-control {
    background: #f5f7fa;
    border: 1px solid #e0e4e8;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.search_form .form-control:focus {
    background: #ffffff;
    border-color: var(--one_light);
    /* УБРАНО: box-shadow с большим размытием — заменено на чёткую обводку */
    box-shadow: 0 0 0 2px rgba(13, 93, 145, 0.15);
    outline: none;
}

.search_form .expand_collapse {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    margin-top: -25px;
    background: var(--glass-bg-strong);
    border: 1px solid var(--glass-border);
    padding: 6px 16px;
    border-radius: 50px;
    cursor: pointer;
    box-shadow: var(--glass-shadow);
    /* УБРАНО: transition: all */
    transition: var(--transition-smooth);
    font-weight: 600;
    color: var(--one);
}
.search_form .expand_collapse:hover {
    /* УБРАНО: transform с translate — заменено на цвет */
    background: var(--white);
    box-shadow: var(--glass-shadow-hover);
}

.search_form label {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-weight: 500;
    color: var(--a_dark);
}
.search_form .form-check label {
    white-space: normal;
}

.search_form .menu {
    max-height: 1500px;
    transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
.search_form .menu.collapsed {
    max-height: 0;
    overflow: hidden;
}

.border_error {
    border: 2px solid #ff8a65 !important;
    box-shadow: 0 0 0 3px rgba(255, 138, 101, 0.15) !important;
    border-radius: var(--bento-radius-sm);
}

.btn, .form-check, .form-check-input, .form-check-label {
    cursor: pointer;
}

ul {
    padding: 0;
    margin: 0;
}

/* Clean focus states */
a.active.focus,
a.active:focus,
a.focus,
a:active.focus,
a:active:focus,
a:focus,
button.active.focus,
button.active:focus,
button.focus,
button:active.focus,
button:active:focus,
button:focus,
.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus {
    outline: 0!important;
    outline-color: transparent!important;
    outline-width: 0!important;
    outline-style: none!important;
}

textarea:focus,
input:focus,
.form-control:focus {
    box-shadow: 0 0 0 2px rgba(13, 93, 145, 0.12);
    outline: 0;
    border-color: var(--one_light);
}

a {
    cursor: pointer;
    transition: var(--transition-color);
}
a:hover {
    text-decoration: none;
    color: var(--one_light);
}

.dropleft .dropdown-toggle::before {
    display: none;
}


/* ============================================
   BENTO RADIUS SYSTEM (2026 Design Language)
   ============================================ */

.rounded-1 {
    border-radius: 0.5rem !important;   /* 8px */
}
.rounded-2 {
    border-radius: 1rem !important;     /* 16px */
}
.rounded-3 {
    border-radius: 1.5rem !important;   /* 24px */
}
.rounded-4 {
    border-radius: 2rem !important;     /* 32px */
}
.rounded-5 {
    border-radius: 2.5rem !important;   /* 40px */
}
.rounded-6 {
    border-radius: 3rem !important;     /* 48px */
}


/* ============================================
   LAYOUT & GRID
   ============================================ */

@media (min-width: 1250px) {
    .col-xl-3.myxl {
        max-width: 22%;
        flex: 0 0 22%;
    }
    .col-xl-6.myxl {
        max-width: 56%;
        flex: 0 0 56%;
    }
    .col-xl-9.myxl {
        max-width: 78%;
        flex: 0 0 78%;
    }
}

@media (max-width: 1909px) {
    .container {
        max-width: calc(100% - 20px);
    }
}
@media (min-width: 1910px) {
    .container {
        max-width: 1870px;
    }
}

@media (max-width: 1200px) {
    legend { font-size: calc(1.275rem + 0.3vw); }
    h1, .h1 { font-size: calc(1.375rem + 1.5vw); }
    h2, .h2 { font-size: calc(1.325rem + 0.9vw); }
    h3, .h3 { font-size: calc(1.3rem + 0.6vw); }
    h4, .h4 { font-size: calc(1.275rem + 0.3vw); }
    .display-1 { font-size: calc(1.725rem + 5.7vw); }
    .display-2 { font-size: calc(1.675rem + 5.1vw); }
    .display-3 { font-size: calc(1.575rem + 3.9vw); }
    .display-4 { font-size: calc(1.475rem + 2.7vw); }
    .close { font-size: calc(1.275rem + 0.3vw); }
}


/* ============================================
   BUTTONS — 2026 Soft Gradient Style (OPTIMIZED)
   ============================================ */

/* ── Primary (Warm Amber) ── */
.btn-primary {
    color: var(--a_light) !important;
    background: linear-gradient(135deg, var(--three_light) 0%, var(--three) 100%);
    border: none;
    border-radius: var(--bento-radius-sm);
    padding: 0.5rem 1.25rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    /* УБРАНО: многослойная тень — заменено на простую */
    box-shadow: 0 2px 8px rgba(147, 83, 2, 0.2);
    /* УБРАНО: transition: all — только transform и opacity */
    transition: var(--transition-bounce), background 0.3s ease;
    position: relative;
    overflow: hidden;
    /* УБРАНО: shimmer-эффект (::before с анимацией) — тяжёлый для GPU */
}
.btn-primary:hover {
    /* УБРАНО: transform: translateY — вызывает repaint */
    background: linear-gradient(135deg, var(--three) 0%, var(--three_dark) 100%);
    box-shadow: 0 4px 12px rgba(147, 83, 2, 0.25);
}
.btn-primary:active {
    box-shadow: 0 1px 4px rgba(147, 83, 2, 0.2);
}

.btn-outline-primary {
    color: var(--three) !important;
    background: transparent;
    border: 2px solid var(--three);
    border-radius: var(--bento-radius-sm);
    /*padding: 0.5rem 1.25rem;*/
    font-weight: 600;
    transition: var(--transition-color), box-shadow 0.3s ease;
    position: relative;
    overflow: hidden;
}
/* УБРАНО: ::before с width-анимацией — заменено на простой hover */
.btn-outline-primary:hover {
    color: var(--a_light) !important;
    background: linear-gradient(135deg, var(--three) 0%, var(--three_dark) 100%);
    border-color: var(--three_dark);
    box-shadow: 0 4px 12px rgba(147, 83, 2, 0.2);
}

/* ── Success (Emerald) ── */
.btn-success {
    color: var(--a_light) !important;
    background: var(--gradient-success);
    border: none;
    border-radius: var(--bento-radius-sm);
    padding: 0.5rem 1.25rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    box-shadow: 0 2px 8px rgba(32, 118, 77, 0.2);
    transition: var(--transition-bounce), background 0.3s ease;
    position: relative;
    overflow: hidden;
}
.btn-success:hover {
    background: linear-gradient(135deg, var(--four) 0%, var(--four_dark) 100%);
    box-shadow: 0 4px 12px rgba(32, 118, 77, 0.25);
}
.btn-success:active {
    box-shadow: 0 1px 4px rgba(32, 118, 77, 0.2);
}

.btn-outline-success {
    color: var(--four) !important;
    background: transparent;
    border: 2px solid var(--four);
    border-radius: var(--bento-radius-sm);
    padding: 0.5rem 1.25rem;
    font-weight: 600;
    transition: var(--transition-color), box-shadow 0.3s ease;
    position: relative;
    overflow: hidden;
}
.btn-outline-success:hover {
    color: var(--a_light) !important;
    background: var(--gradient-success);
    border-color: var(--four_dark);
    box-shadow: 0 4px 12px rgba(32, 118, 77, 0.2);
}

/* ── Info (Sunset Orange) ── */
.btn-info {
    color: var(--a_light) !important;
    background: linear-gradient(135deg, var(--five_light) 0%, var(--five) 100%);
    border: none;
    border-radius: var(--bento-radius-sm);
    padding: 0.5rem 1.25rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    box-shadow: 0 2px 8px rgba(227, 130, 7, 0.2);
    transition: var(--transition-bounce), background 0.3s ease;
    position: relative;
    overflow: hidden;
}
.btn-info:hover {
    background: linear-gradient(135deg, var(--five) 0%, var(--five_dark) 100%);
    box-shadow: 0 4px 12px rgba(227, 130, 7, 0.25);
}
.btn-info:active {
    box-shadow: 0 1px 4px rgba(227, 130, 7, 0.2);
}

.btn-outline-info {
    color: var(--five) !important;
    background: transparent;
    border: 2px solid var(--five);
    border-radius: var(--bento-radius-sm);
    padding: 0.5rem 1.25rem;
    font-weight: 600;
    transition: var(--transition-color), box-shadow 0.3s ease;
    position: relative;
    overflow: hidden;
}
.btn-outline-info:hover {
    color: var(--a_light) !important;
    background: linear-gradient(135deg, var(--five) 0%, var(--five_dark) 100%);
    border-color: var(--five_dark);
    box-shadow: 0 4px 12px rgba(227, 130, 7, 0.2);
}

/* ── Secondary (Soft Gray) ── */
.btn-secondary {
    color: var(--a_dark) !important;
    background: linear-gradient(135deg, var(--gray_light) 0%, var(--gray) 100%);
    border: none;
    border-radius: var(--bento-radius-sm);
    padding: 0.5rem 1.25rem;
    font-weight: 600;
    transition: var(--transition-color), box-shadow 0.3s ease;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}
.btn-secondary:hover {
    background: linear-gradient(135deg, var(--gray) 0%, var(--gray_dark) 100%);
    box-shadow: 0 4px 10px rgba(0,0,0,0.12);
}

.btn-outline-secondary {
    color: var(--gray_dark) !important;
    background: transparent;
    border: 2px solid var(--gray);
    border-radius: var(--bento-radius-sm);
    padding: 0.5rem 1.25rem;
    font-weight: 600;
    transition: var(--transition-color), box-shadow 0.3s ease;
}
.btn-outline-secondary:hover {
    color: var(--a_light) !important;
    background: linear-gradient(135deg, var(--gray) 0%, var(--gray_dark) 100%);
    border-color: var(--gray_dark);
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}


/* ============================================
   HEADINGS — 2026 Elegant Typography
   ============================================ */

h1 {
    position: relative;
    display: block;
    text-align: center;
    margin-top: 15px;
    margin-bottom: 25px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--a_dark);
}

h1:before,
h1:after {
    height: 20px;
    width: 40px;
    position: absolute;
    content: '';
    border-radius: 4px;
}
h1::before {
    margin-left: -25px;
    top: -5px;
    border-left: 4px solid var(--one);
    border-top: 4px solid var(--one);
    /* УБРАНО: box-shadow — заменено на сплошной цвет */
}
h1::after {
    margin-left: -12px;
    bottom: -18px;
    border-right: 4px solid var(--one);
    border-bottom: 4px solid var(--one);
}


/* ============================================
   INFO BOXES & BADGES
   ============================================ */

.info_box {
    display: inline-block;
    text-align: center;
    padding: 8px 16px;
    margin-top: 10px;
    /* Вместо backdrop-filter — просто полупрозрачный белый */
    background: var(--glass-bg);
    border-radius: var(--bento-radius-sm);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    font-weight: 500;
    color: var(--a_dark);
    transition: var(--transition-smooth);
}
.info_box:hover {
    box-shadow: var(--glass-shadow-hover);
    /* УБРАНО: transform — заменено на тень */
}

.box_shadow {
    border-radius: var(--bento-radius);
    box-shadow: var(--glass-shadow);
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    transition: box-shadow 0.3s ease;
}
.box_shadow:hover {
    box-shadow: var(--glass-shadow-hover);
}

.textfade {
    box-shadow: -12px 0 15px 2px rgb(255, 255, 255) inset;
    height: 20px;
    position: absolute;
    right: 10px;
    width: 25px;
}

.info_block {
    border: none;
    border-radius: var(--bento-radius);
    margin: 0 0 20px 0;
    padding: 16px;
    background: var(--gradient-card);
    box-shadow: var(--glass-shadow);
    position: relative;
    overflow: hidden;
}
.info_block::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--gradient-success);
    border-radius: var(--bento-radius) var(--bento-radius) 0 0;
}


/* ============================================
   CARDS — Bento Cards 2026 (OPTIMIZED)
   ============================================ */

.card {
    /* Вместо backdrop-filter — градиентная заливка */
    background: var(--gradient-card);
    /*border: 1px solid var(--glass-border);*/
    border: 0;
    border-radius: var(--bento-radius);
    box-shadow: var(--glass-shadow);
    /* УБРАНО: transition: all — только тень */
    transition: box-shadow 0.3s ease;
    position: relative;
}
.card:hover {
    box-shadow: var(--glass-shadow-hover);
    /* УБРАНО: transform: translateY — вызывает repaint */
}

.card.no_border {
    border: 0;
    margin-bottom: 30px;
    box-shadow: none;
    border-radius: var(--bento-radius-sm) !important;
}

/* УБРАНО: ::after с filter: blur — тяжёлый эффект */
/* Вместо размытой тени — простая цветная подложка */
.card::after {
    z-index: -1;
    position: absolute;
    right: 20px;
    left: 20px;
    content: "";
    bottom: 0;
    width: calc(100% - 40px);
    height: 20px;
    background: rgba(13, 93, 145, 0.06);
    border-radius: 50%;
    /* УБРАНО: filter: blur — GPU-зависимый */
}

/* ── Card Header — Gradient Bar ── */
.card-header {
    height: auto;
    min-height: 44px;
    line-height: 44px;
    padding: 0 12px;
    margin-bottom: 0;
    background: var(--gradient-accent);
    border-bottom: 1px solid rgba(255,255,255,0.2);
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    color: var(--white);
    font-weight: 600;
    letter-spacing: 0.02em;
    border-radius: var(--bento-radius-sm) var(--bento-radius-sm) 0 0 !important;
    position: relative;
}
.card-header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: rgba(255,255,255,0.3);
}

.card-header span.more {
    height: 32px;
    line-height: 30px;
    font-size: 75%;
    background: rgba(255,255,255,0.2);
    position: absolute;
    right: 12px;
    top: 6px;
    padding: 0 12px;
    border-radius: 50px;
    border: 1px solid rgba(255,255,255,0.3);
    font-weight: 600;
    transition: background 0.2s ease;
}
.card-header span.more:hover {
    background: rgba(255,255,255,0.35);
    /* УБРАНО: transform — заменено на цвет */
}

.card-header span.before_triangle {
    background: var(--four);
    display: inline-flex;
    align-items: center;
    height: 44px;
    padding: 0 12px 0 16px;
    color: var(--white);
    margin: 0 -12px 0 -16px;
    font-weight: 700;
    /* УБРАНО: box-shadow — заменено на сплошной цвет */
}
.card-header span.triangle {
    position: relative;
    top: -22px;
    left: -22px;
    display: inline-block;
    width: 36px;
    margin-right: -6px;
}
.card-header span.triangle::before {
    content: '';
    position: absolute;
    right: 0px;
    top: -8px;
    border-style: solid;
    border-width: 24px 0px 22px 14px;
    border-color: var(--white) var(--white) var(--white) var(--four);
    /* УБРАНО: filter: drop-shadow */
}
.card-header span.triangle::after {
    content: '';
    position: absolute;
    right: -11px;
    border-style: solid;
    border-width: 24px 0px 22px 12px;
    border-color: var(--two) var(--two) var(--two) var(--white);
    top: -8px;
}

.card-header a {
    color: var(--white);
    text-decoration: none;
    transition: opacity 0.2s ease;
}
.card-header a:hover {
    opacity: 0.85;
}

.card-header span.before_triangle i {
    transform: scale(1.2);
    /* УБРАНО: filter: drop-shadow */
}

/* ── Card Body ── */
.card-body {
    padding: 16px 20px;
    color: var(--a_dark);
}
.card-body:last-child {
    margin-bottom: 0;
}

/* ── Card Title ── */
.card-title {
    font-weight: 700;
    padding: 8px;
    margin-bottom: 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.95rem;
    color: var(--one);
}

/* ── Card Footer ── */
.card-footer {
    background: rgba(255,255,255,0.6);
    border-top: 1px solid var(--glass-border);
    padding: 12px 20px;
    border-radius: 0 0 var(--bento-radius) var(--bento-radius);
}
.card-footer:last-child {
    border-radius: 0 0 var(--bento-radius) var(--bento-radius);
}
.card-footer .btn {
    float: right;
    margin: 0;
}


/* ============================================
   BREADCRUMBS — 2026 Minimal Pill Style
   ============================================ */

.breadcrumbs {
    overflow: hidden;
    white-space: nowrap;
    margin: 4px 4px 0 4px;
}
.breadcrumbs .breadcrumb {
    margin: 0;
    background: var(--glass-bg);
    border-radius: 50px;
    padding: 0 10px 0 0;
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
}
.breadcrumb-item + .breadcrumb-item {
    padding-left: 0;
}
.breadcrumb-item + .breadcrumb-item::before {
    padding-right: 0;
    content: "";
}
.breadcrumbs > ul {
    list-style: none;
    display: inline-flex;
    padding: 0 4px;
    gap: 4px;
}
.breadcrumbs > ul > li {
    overflow: hidden;
    display: none;
}
.breadcrumbs > ul > li.show {
    display: inline-flex;
}
.breadcrumbs > ul > li.ellipsis {
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    overflow: hidden;
    direction: rtl;
}
.breadcrumbs > ul > li a {
    color: var(--one);
    margin-right: 5px;
    font-weight: 500;
    padding: 0 8px;
    border-radius: 20px;
    transition: var(--transition-color);
}
.breadcrumbs > ul > li a:hover {
    background: rgba(13, 93, 145, 0.08);
    color: var(--one_dark);
}
.breadcrumbs .divider {
    color: var(--gray);
    padding: 0 5px;
}

@media only screen and (min-width: 1024px) {
    .breadcrumbs ul li:nth-child(2n) a {
        max-width: 500px;
    }
}
@media only screen and (max-width: 1023px) {
    .breadcrumbs ul li:nth-child(2n) a {
        max-width: 300px;
    }
}
@media only screen and (max-width: 640px) {
    .breadcrumbs ul li:nth-child(2n) a {
        max-width: 250px;
    }
}
@media only screen and (max-width: 480px) {
    .breadcrumbs ul li:nth-child(2n) a {
        max-width: 110px;
    }
}


/* ============================================
   SEARCH CARD
   ============================================ */

.card.search {
    /* Inherits global .card styles */
}


/* ============================================
   PAGINATION — 2026 Soft Pills
   ============================================ */

.pagination {
    gap: 8px;
}
.pagination li.page-item {
    margin-right: 0;
}
.pagination li.page-item a {
    color: var(--a_dark);
    text-align: center;
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    border-radius: 12px;
    padding: 8px 16px;
    font-weight: 500;
    transition: var(--transition-color), box-shadow 0.2s ease;
    box-shadow: var(--glass-shadow);
    min-width: 44px;
}
.pagination li.page-item a:hover {
    color: var(--white);
    background: var(--gradient-accent);
    border-color: transparent;
    box-shadow: 0 4px 12px rgba(13, 93, 145, 0.2);
}
.pagination li.page-item.active .page-link {
    z-index: 3;
    color: var(--white);
    background: var(--gradient-success);
    border-color: transparent;
    box-shadow: 0 4px 10px rgba(32, 118, 77, 0.2);
    font-weight: 600;
}


/* ============================================
   PRICE — 2026 Gradient Text
   ============================================ */

.price {
    /* УБРАНО: background-clip: text — не поддерживается везде, может тормозить */
    color: var(--price);
    font-weight: 700;
    font-size: 1.1em;
}
.price.old {
    text-decoration: line-through;
    color: var(--gray);
    opacity: 0.6;
}


/* ============================================
   SPECS
   ============================================ */

#specs img {
    height: 100%;
    max-height: 250px;
    object-fit: cover;
    border-radius: var(--bento-radius-sm);
    box-shadow: var(--glass-shadow);
}


/* ============================================
   NEAR NAVBAR — 2026 Glass Top Bar (без blur!)
   ============================================ */

.near_navbar {
    /* Вместо backdrop-filter — сплошной цвет с небольшой прозрачностью */
    background: var(--one);
    color: var(--white);
    height: 55px;
    overflow: hidden;
    border-bottom: 1px solid var(--glass-border);
    box-shadow: 0 2px 12px rgba(13, 93, 145, 0.06);
    z-index: 102;
}
.near_navbar > div,
.near_navbar > div > div {
    height: 100% !important;
    align-items: center !important;
    overflow: hidden;
}
.near_navbar > div > div > div {
    max-height: 100%;
    text-align: center;
}
.near_navbar a {
    color: var(--white);
    font-weight: 500;
    transition: var(--transition-color);
    padding: 4px 12px;
    border-radius: 20px;
}
.near_navbar a:hover {
    background: rgba(13, 93, 145, 0.08);
}


/* ============================================
   SOCIAL BUTTONS — 2026 Soft 3D Orbs
   ============================================ */

ul.social {
    list-style: outside none none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 12px;
}
ul.social li {
    display: inline-block;
}
ul.social li a {
    text-align: center;
    background: linear-gradient(145deg, #3a3740, #262429);
    color: var(--white);
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
    /* УБРАНО: многослойная тень — заменено на простую */
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
    position: relative;
    overflow: hidden;
    transition: var(--transition-bounce), background 0.3s ease;
}
/* УБРАНО: ::before с radial-gradient — лишний слой */
ul.social li a:hover {
    /* УБРАНО: transform — заменено на цвет и тень */
    box-shadow: 0 6px 16px rgba(0,0,0,0.25);
}

/* Brand colors */
ul.social li a.whatsapp {
    background: linear-gradient(145deg, #2DBF00, #29AD00);
}
ul.social li a.whatsapp:hover {
    box-shadow: 0 6px 16px rgba(41, 173, 0, 0.3);
}
ul.social li a.telegram {
    background: linear-gradient(145deg, #3DB5F0, #2CA3E0);
    padding: 0;
}
ul.social li a.telegram:hover {
    box-shadow: 0 6px 16px rgba(44, 163, 224, 0.3);
}
ul.social li a.max {
    background: linear-gradient(145deg, #1682FC, #9443DB);
}
ul.social li a.max:hover {
    box-shadow: 0 6px 16px rgba(22, 130, 252, 0.3);
}
ul.social li a.viber {
    background: linear-gradient(145deg, #8A5DAF, #734D93);
}
ul.social li a.viber:hover {
    box-shadow: 0 6px 16px rgba(115, 77, 147, 0.3);
}
ul.social li a.vk {
    background: linear-gradient(145deg, #5A8FC2, #4F7DB2);
}
ul.social li a.vk:hover {
    box-shadow: 0 6px 16px rgba(79, 125, 178, 0.3);
}
ul.social li a.facebook {
    background: linear-gradient(145deg, #4E74BD, #4064AD);
}
ul.social li a.facebook:hover {
    box-shadow: 0 6px 16px rgba(64, 100, 173, 0.3);
}
ul.social li a.instagram {
    background: linear-gradient(145deg, #D91674, #C50364);
}
ul.social li a.instagram:hover {
    box-shadow: 0 6px 16px rgba(197, 3, 100, 0.3);
}
ul.social li a.odnoklassniki {
    background: linear-gradient(145deg, #FF9F2E, #F98B0E);
}
ul.social li a.odnoklassniki:hover {
    box-shadow: 0 6px 16px rgba(249, 139, 14, 0.3);
}
ul.social li a i {
    font-size: 22px;
    position: relative;
    z-index: 1;
    /* УБРАНО: filter: drop-shadow */
}

.fa-max {
    display: inline-block;
    width: 1em;
    height: 1em;
    background: linear-gradient(135deg, #fff, #fff);
    -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><path d="M21.47 41.88c-4.11 0-6.02-.6-9.34-3-2.1 2.7-8.75 4.81-9.04 1.2 0-2.71-.6-5-1.28-7.5C1 29.5.08 26.07.08 21.1.08 9.23 9.82.3 21.36.3c11.55 0 20.6 9.37 20.6 20.91a20.6 20.6 0 0 1-20.49 20.67Zm.17-31.32c-5.62-.29-10 3.6-10.97 9.7-.8 5.05.62 11.2 1.83 11.52.58.14 2.04-1.04 2.95-1.95a10.4 10.4 0 0 0 5.08 1.81 10.7 10.7 0 0 0 11.19-9.97 10.7 10.7 0 0 0-10.08-11.1Z"/></svg>') no-repeat center;
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><path d="M21.47 41.88c-4.11 0-6.02-.6-9.34-3-2.1 2.7-8.75 4.81-9.04 1.2 0-2.71-.6-5-1.28-7.5C1 29.5.08 26.07.08 21.1.08 9.23 9.82.3 21.36.3c11.55 0 20.6 9.37 20.6 20.91a20.6 20.6 0 0 1-20.49 20.67Zm.17-31.32c-5.62-.29-10 3.6-10.97 9.7-.8 5.05.62 11.2 1.83 11.52.58.14 2.04-1.04 2.95-1.95a10.4 10.4 0 0 0 5.08 1.81 10.7 10.7 0 0 0 11.19-9.97 10.7 10.7 0 0 0-10.08-11.1Z"/></svg>') no-repeat center;
    -webkit-mask-size: contain;
    mask-size: contain;
}


/* ============================================
   NAVBAR — 2026 Floating Navigation (без blur!)
   ============================================ */

.navbar {
    position: fixed;
    min-height: 56px;
    line-height: 40px;
    margin-top: 55px;
    z-index: 100;
    width: 100%;
    /* Вместо backdrop-filter — почти сплошной белый */
    background: rgba(255, 255, 255, 0.97);
    padding: 8px 20px;
    transition: margin-top 0.3s ease, opacity 0.3s ease;
    box-shadow: 0 2px 16px rgba(13, 93, 145, 0.08);
    border-bottom: 1px solid var(--glass-border);
    border-radius: 0 0 var(--bento-radius) var(--bento-radius);
    top: 0;
}
.navbar .navbar-collapse {
    line-height: 22px;
}
.navbar-toggler {
    padding: 4px 0 0 10px;
    border: none;
    background: transparent;
}
.navbar .navbar-nav {
    width: calc(100% - 260px);
    gap: 4px;
}
.navbar .form-inline {
    width: 260px;
}

.navbar.nav-up {
    margin-top: -80px;
    opacity: 0;
}

.navbar .dropdown-toggle::after {
    border: 0;
    margin-left: 0;
    vertical-align: -1px;
}
.navbar .dropdown-toggle i {
    position: relative;
    top: 2px;
}
.navbar li .dropdown-menu {
    margin: 0;
    /* Вместо backdrop-filter — сплошной цвет */
    background: #ffffff;
    border: 1px solid var(--glass-border);
    border-radius: var(--bento-radius-sm);
    box-shadow: var(--glass-shadow-hover);
    padding: 8px;
    min-width: 200px;
}

@media (max-width: 991px) {
    .navbar {
        position: absolute;
        border-radius: 0;
    }
    .navbar.nav-up {
        margin-top: 50px;
        opacity: 1;
    }
    .navbar .navbar-nav {
        width: 100%;
        clear: both;
    }
    .navbar .form-inline {
        width: 100%;
        clear: both;
    }
    .navbar .navbar-collapse {
        background: #ffffff;
        margin: 8px -20px 0;
        padding: 16px 24px;
        width: calc(100% + 40px);
        border-radius: var(--bento-radius-sm);
        border-top: 1px solid var(--glass-border);
    }
    .navbar .navbar-collapse.collapsing,
    .navbar .navbar-collapse.show {
        display: flex;
        flex-direction: column;
    }
}

@media (min-width: 992px) {
    .navbar {
        display: block;
    }
    #navbar.navbar li:hover > .dropdown-menu {
        display: block;
        /* УБРАНО: анимация dropdown — просто появление */
    }
    #navbar .dropdown > .dropdown-toggle:active {
        pointer-events: none;
    }
    #navbar.navbar li > .dropdown-menu {
        transition: 0.3s ease-in-out;
    }
}

.navbar li a {
    color: var(--a_dark);
    font-weight: 500;
    padding: 8px 16px;
    border-radius: 50px;
    transition: var(--transition-color);
}

.navbar ul li a:hover,
.navbar ul li.active > a,
.navbar ul li .dropdown-item.active {
    color: var(--one);
}

.navbar ul li.active > a,
.navbar ul li:hover > a {
    color: var(--white);
    background: var(--gradient-accent);
    box-shadow: 0 4px 12px rgba(13, 93, 145, 0.2);
}

.navbar ul li a.dropdown-item:hover,
.navbar ul li a.dropdown-item.active,
.navbar ul li ul.dropdown-menu > li.active > a,
.navbar ul li.active ul.dropdown-menu > a,
.navbar ul li ul.dropdown-menu a:hover,
.navbar ul li ul.dropdown-menu a.active,
.navbar ul li a.dropdown-item:active,
.navbar li a.dropdown-item.active > span:first-child,
.navbar li a.dropdown-item > span:first-child:hover {
    color: var(--white);
    background: var(--gradient-accent);
    border-radius: 8px;
}

.navbar li a.dropdown-item {
    max-width: 100%;
    padding: 8px 2px;
    border-radius: 8px;
    margin: 2px 0;
    transition: var(--transition-color);
}
.navbar li a.dropdown-item > span {
    position: relative;
    z-index: 2;
}
.navbar ul li > a > span {
    z-index: 2;
}

.navbar li a.dropdown-item > span + span {
    position: absolute;
    right: 10px;
    height: 20px;
    box-shadow: -200px 0px 150px -51px rgb(255, 255, 255) inset;
    padding-left: 10px;
    z-index: 2;
}
.navbar ul li a.dropdown-item.active > span + span,
.navbar li a.dropdown-item:hover > span + span {
    z-index: 1;
    box-shadow: unset;
}

div.dropdown-menu.animated {
    animation-duration: 0.3s;
}

.flexmenu_dropdown .nav-link {
    white-space: nowrap !important;
}


/* ============================================
   HEADER — 2026 Gradient Overlay
   ============================================ */

.header {
    height: 355px;
    background: url('../img/header.jpg') no-repeat fixed center 55px;
}
/*.header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    !* Простой градиент overlay — не тяжелее оригинала *!
    background: linear-gradient(180deg,
    rgba(13, 93, 145, 0.1) 0%,
    rgba(13, 93, 145, 0.3) 50%,
    rgba(13, 93, 145, 0.5) 100%);
    pointer-events: none;
}*/
#search_by_id {
    max-width: 160px;
}


/* ============================================
   TABS — 2026 Glass Tabs (без blur!)
   ============================================ */

.tabdrop {
    position: absolute;
    right: 0;
    background: var(--glass-bg);
    border-radius: var(--bento-radius-sm);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
}

.bootstrap-tabs .nav-tabs {
    border-bottom: 2px solid rgba(13, 93, 145, 0.1);
    margin-left: 0 !important;
    gap: 4px;
    padding: 0 4px;
}
.bootstrap-tabs .nav-tabs li {
    padding: 0 !important;
}
.bootstrap-tabs .nav-tabs li:before {
    display: none;
}
.bootstrap-tabs .nav-tabs .nav-item {
    margin-bottom: -2px;
}
.bootstrap-tabs .nav-tabs .nav-link {
    border: none;
    border-radius: var(--bento-radius-sm) var(--bento-radius-sm) 0 0;
    padding: 10px 20px;
    font-weight: 500;
    color: var(--gray_dark);
    transition: var(--transition-color);
    background: transparent;
}
.bootstrap-tabs .nav-tabs .nav-link:hover {
    color: var(--one);
    background: rgba(13, 93, 145, 0.05);
}
.bootstrap-tabs .nav-tabs .nav-link.active {
    color: var(--one);
    background: var(--glass-bg);
    border-bottom: 2px solid var(--one);
    font-weight: 600;
}

.bootstrap-tabs .tab-content {
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    border-top: 0;
    padding: 20px;
    border-radius: 0 0 var(--bento-radius) var(--bento-radius);
    box-shadow: var(--glass-shadow);
}
.bootstrap-tabs .dropdown-menu {
    padding: 8px;
    background: #ffffff;
    border: 1px solid var(--glass-border);
    border-radius: var(--bento-radius-sm);
    box-shadow: var(--glass-shadow-hover);

    left: auto !important;
    right: 0;
    top: 48px !important;
    transform: none !important;
}
.bootstrap-tabs .nav-tabs a {
    color: var(--one);
}


/* ============================================
   DATA LISTS — 2026 Soft Dotted Lines
   ============================================ */

ul.data {
    list-style: none;
    column-count: 2;
    column-width: 250px;
    column-gap: 6em;
    padding: 5px 0;
    margin-bottom: 0;
}
ul.data li {
    width: 100%;
    display: inline-block;
    padding: 2px 0;
}
ul.data li span:first-child {
    float: left;
    padding: 0 .4em 0 0;
    margin: 0 0 1px 0;
    font-weight: 600;
    color: var(--one);
}
ul.data li span + span {
    float: right;
    padding: 0 0 0 .4em;
    margin: 0 0 1px 0;
    color: var(--a_dark);
    font-weight: 500;
}
ul.data li:after {
    content: "";
    display: block;
    overflow: hidden;
    height: 1em;
    border-bottom: 1px dashed rgba(13, 93, 145, 0.2);
    padding-top: 18px;
    margin: 0 0 1px 0;
}
ul.data li:before {
    content: "" !important;
    margin-right: 0 !important;
}


/* ============================================
   SIDE MENU — 2026 Glass Sidebar (без blur!)
   ============================================ */

.card.side_menu {
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    border-radius: var(--bento-radius);
    padding: 10px;
    position: relative;
    box-shadow: var(--glass-shadow);
    transition: box-shadow 0.3s ease;
}
.card.side_menu:hover {
    box-shadow: var(--glass-shadow-hover);
}
.card.side_menu .card {
    margin-top: 10px;
    margin-bottom: 10px;
    background: rgba(255,255,255,0.7);
}

.card.side_menu .card-header {
    color: var(--four);
    font-weight: 700;
    border: 0;
    background: transparent;
    margin: 0 0 12px 0;
    padding: 0;
    font-size: 1.1rem;
    position: relative;
}
.card.side_menu .card-header::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--four_light), transparent);
    border-radius: 2px;
}
.card.side_menu .card-header h3 {
    background: transparent;
    display: inline;
    padding: 0;
    font-size: 20px;
    margin: 0;
}
.card.side_menu .card-header i {
    margin-right: 8px;
    color: var(--four);
}
.card.side_menu .card-title {
    padding-left: 0;
}
.card.side_menu .card-body {
    padding: 0;
}
.card.side_menu .card-body .card-block {
    padding: 10px;
}
.card.side_menu .card-body .card-header {
    background: transparent;
    padding: 0 10px 0 10px;
    border: 0;
    margin: 0 0 8px 1px;
}
.card.side_menu .card-body img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    object-position: 50% 50%;
    margin: 0;
    border-radius: var(--bento-radius);
}
.card.side_menu .card-body ul.menu {
    padding: 0;
    overflow: hidden;
    white-space: nowrap;
}
.card.side_menu .card-body ul.menu li {
    list-style: outside none none;
    margin: 0;
    padding: 6px 0;
    border-radius: 8px;
    transition: var(--transition-color), padding-left 0.2s ease;
}
.card.side_menu .card-body ul.menu li:hover {
    background: rgba(13, 93, 145, 0.05);
    padding-left: 8px;
}
.card.side_menu .card-body ul.menu li::before {
    content: "\f00c";
    font-family: "Font Awesome 5 Free";
    font-weight: bold;
    font-size: 13px;
    color: var(--four_light);
    position: relative;
    top: -5px;
    margin-right: 4px;
}
.card.side_menu .card-body ul.menu li div {
    width: 95%;
    display: inline-block;
}
.card.side_menu .card-body ul.menu li div a {
    color: var(--a_dark);
    text-decoration: none;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width: 89%;
    display: inline-block;
    height: 24px;
    font-weight: 500;
    transition: var(--transition-color);
}
.card.side_menu .card-body ul.menu li:hover a,
.card.side_menu .card-body ul.menu li:hover:before,
.card.side_menu .card-body ul.menu li.active a,
.card.side_menu .card-body ul.menu li.active:before {
    color: var(--one);
}
.card.side_menu .card-body ul.menu li div a span + span {
    position: absolute;
    right: 10px;
    margin-top: 2px;
    background: var(--gradient-accent);
    color: var(--white);
    display: inline-block;
    padding: 4px 8px;
    font-size: 80%;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 50px;
    box-shadow: 0 2px 6px rgba(13, 93, 145, 0.15);
    min-width: 24px;
}
.card.side_menu .card-body .card-footer {
    background: transparent;
    border-top: 0;
    border-radius: 0;
    margin-bottom: 15px;
}
.card.side_menu .card-footer {
    border-top: 0;
    border-bottom: 0;
}


/* ============================================
   ARTICLES — 2026 Bento Grid Cards
   ============================================ */

.two-col-left,
.two-col-right,
.two-col,
.three-col {
    margin-right: 0;
    margin-left: 0;
}

#art ul li,
#building ul li {
    padding: 0 0 3px 0;
    list-style: outside none none;
}
#art ul li:before,
#building ul li:before {
    content: "\f00c";
    font-family: "Font Awesome 5 Free";
    font-weight: bold;
    font-size: 0.9rem;
    margin-right: 8px;
    color: var(--four);
}

.article .card-body .preview {
    position: relative;
    float: left;
    cursor: pointer;
    border-radius: var(--bento-radius-sm);
    overflow: hidden;
    box-shadow: var(--glass-shadow);
    transition: box-shadow 0.3s ease;
}
.article .card-body .preview:hover {
    box-shadow: var(--glass-shadow-hover);
    /* УБРАНО: transform: scale — вызывает repaint */
}
.article .card-body .preview .title {
    position: absolute;
    top: 12px;
    left: 12px;
    max-width: calc(100% - 24px);
    padding: 6px 12px;
    background: rgba(255,255,255,0.95);
    border-radius: 50px;
    line-height: 1.4;
    font-size: 80%;
    font-weight: 700;
    color: var(--one);
    border: 1px solid var(--glass-border);
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.article .card-body .preview .construction {
    position: absolute;
    bottom: 12px;
    right: 12px;
    max-width: calc(100% - 24px);
    padding: 6px 12px;
    background: rgba(255,255,255,0.95);
    border-radius: 50px;
    line-height: 1.4;
    font-size: 80%;
    font-weight: 700;
    color: var(--four);
    border: 1px solid var(--glass-border);
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.article .art img, .article img {
    margin: 0 5px 5px 0;
    cursor: pointer;
    border-radius: var(--bento-radius-sm);
    transition: box-shadow 0.3s ease;
}
.article .art img {
    width: 300px;
    height: 300px;
    object-fit: cover;
    box-shadow: var(--glass-shadow);
}
.article .art img:hover {
    box-shadow: var(--glass-shadow-hover);
    /* УБРАНО: transform: scale */
}

@media (max-width: 1024px) {
    .article .card-body .preview {
        float: unset;
    }
    .article .art img {
        width: 100%;
        margin: 4px 0;
    }
    .article img {
        width: 100% !important;
        object-fit: cover;
        margin: 4px 0 4px 2px !important;
    }
}

#art.article,
#buildings .article,
#building.article {
    overflow: auto;
    padding: 20px;
    margin-bottom: 20px;
    background: var(--glass-bg);
    border-radius: var(--bento-radius);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
}

#comment {
    margin-top: 20px;
}


/* ============================================
   COMMENTS — 2026 Chat Bubbles (без blur!)
   ============================================ */

#comment .input-group-text sup {
    color: #f00;
    font-size: 15px;
    left: 6px;
    position: absolute;
    top: 14px;
}
#comment .input-group-text {
    width: 40px;
}
.comments_2 {
    margin-bottom: 20px;
    padding: 0;
}
.comments_2 li {
    list-style-type: none;
    border-bottom: 1px solid rgba(13, 93, 145, 0.1);
    padding-bottom: 10px;
    margin-bottom: 10px;
}
.comments_2 .content {
    padding: 15px 35px;
    /* Вместо backdrop-filter — просто цвет */
    background: rgba(255,255,255,0.95);
    color: var(--a_dark);
    max-width: 400px;
    display: inline-block;
    margin-bottom: -20px;
    margin-left: 20px;
    border-radius: var(--bento-radius);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    position: relative;
}
.comments_2 .content::before {
    content: '';
    position: absolute;
    left: -10px;
    top: 20px;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right: 10px solid var(--glass-border);
}
.comments_2 .avatar {
    display: inline-block;
    vertical-align: bottom;
}
.comments_2 .avatar img {
    width: 60px;
    height: auto;
    border-radius: 50%;
    display: inline-block;
    box-shadow: 0px 0px 0px 5px var(--white), 0 4px 12px rgba(0,0,0,0.08);
    transition: box-shadow 0.3s ease;
}
.comments_2 .avatar img:hover {
    /* УБРАНО: transform — заменено на тень */
    box-shadow: 0px 0px 0px 5px var(--white), 0 6px 16px rgba(0,0,0,0.12);
}
.comments_2 .info {
    display: inline-block;
    vertical-align: bottom;
    margin-left: 10px;
    margin-right: 10px;
    font-size: 0.72em;
    color: rgba(0, 0, 0, 0.3);
}
.comments_2 .comment .self {
    text-align: right;
}
.comments_2 .comment .self .content {
    background: linear-gradient(135deg, #f0f9ff 0%, #e8f4ff 100%);
    color: var(--one);
    margin-right: 20px;
    margin-left: 0px;
    border: 1px solid rgba(13, 93, 145, 0.15);
}
.comments_2 .comment .self .content::before {
    left: auto;
    right: -10px;
    border-right: none;
    border-left: 10px solid rgba(13, 93, 145, 0.15);
}


/* ============================================
   CAROUSEL — 2026 Controls (без blur!)
   ============================================ */

.carousel_objects img {
    height: 200px;
    object-fit: cover;
    border-radius: var(--bento-radius-sm);
}
.carousel_objects .item {
    position: relative;
    overflow: hidden;
    border-radius: var(--bento-radius);
}
.carousel_objects .item span {
    position: absolute;
    height: 50px;
    width: calc(100% - 20px);
    margin-top: -50px;
    background: rgba(0, 0, 0, .6);
    color: var(--white);
    overflow: hidden;
    border-radius: 0 0 var(--bento-radius-sm) var(--bento-radius-sm);
    padding: 0 16px;
    line-height: 50px;
    font-weight: 500;
}
.carousel .owl-theme .owl-nav [class*='owl-'] {
    color: var(--white);
    font-size: 14px;
    margin: 5px;
    padding: 4px 12px;
    background: var(--gradient-accent);
    display: inline-block;
    cursor: pointer;
    border-radius: var(--bento-radius-sm);
    box-shadow: 0 4px 12px rgba(13, 93, 145, 0.25);
    transition: var(--transition-color), box-shadow 0.2s ease;
}
.carousel .owl-theme .owl-nav [class*='owl-']:hover {
    background: linear-gradient(135deg, var(--five_light) 0%, var(--five) 100%);
    color: var(--white);
    text-decoration: none;
    box-shadow: 0 6px 16px rgba(227, 130, 7, 0.25);
}
.carousel .owl-theme .owl-nav {
    line-height: 1;
    text-align: center;
    -webkit-tap-highlight-color: transparent;
}
.carousel .owl-theme .owl-nav .owl-prev {
    position: absolute;
    top: 40%;
    left: -12px;
    color: var(--a_dark);
    font-size: 20px;
    padding: 14px;
    background: var(--glass-bg-strong);
    border: 1px solid var(--glass-border);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border-radius: 50%;
    height: 44px;
    width: 44px;
    box-shadow: var(--glass-shadow);
    transition: var(--transition-color), box-shadow 0.2s ease;
}
.carousel .owl-theme .owl-nav .owl-next {
    position: absolute;
    top: 40%;
    right: -12px;
    color: var(--a_dark);
    font-size: 20px;
    padding: 14px;
    background: var(--glass-bg-strong);
    border: 1px solid var(--glass-border);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border-radius: 50%;
    height: 44px;
    width: 44px;
    box-shadow: var(--glass-shadow);
    transition: var(--transition-color), box-shadow 0.2s ease;
}
.carousel .owl-theme .owl-nav .owl-prev:hover {
    background: var(--gradient-accent);
    text-decoration: none;
    color: var(--white);
    border-color: transparent;
    box-shadow: 0 8px 20px rgba(13, 93, 145, 0.25);
}
.carousel .owl-theme .owl-nav .owl-next:hover {
    background: var(--gradient-accent);
    text-decoration: none;
    color: var(--white);
    border-color: transparent;
    box-shadow: 0 8px 20px rgba(13, 93, 145, 0.25);
}
.carousel .owl-theme .owl-dots {
    display: none;
}
.carousel .owl-theme .owl-dots .owl-dot {
    display: none;
    zoom: 1;
}

@media only screen and (max-width: 768px) {
    .carousel .owl-theme .owl-nav .owl-next {
        position: initial;
    }
    .carousel .owl-theme .owl-nav .owl-prev {
        position: initial;
    }
}


/* ============================================
   OBJECTS — 2026 Bento Card Grid
   ============================================ */

.object ul, .object ol {
    padding: 10px;
}
#objects .object .box a img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

#objects .object:last-child {
    margin-bottom: 0 !important;
}

#objects .object .box {
    position: relative;
    margin-bottom: 60px;
}
#objects .object .box .preview {
    height: 280px;
    overflow: hidden;
    position: relative;
    border-radius: var(--bento-radius);
    box-shadow: var(--glass-shadow);
    transition: box-shadow 0.3s ease;
}
#objects .object .box .preview:hover {
    box-shadow: var(--glass-shadow-hover);
}
#objects .object .box .info {
    position: absolute;
    bottom: -54px;
    left: 20px;
    right: 20px;
    max-width: 380px;
    padding: 5px;
    overflow: hidden;
    /* Вместо backdrop-filter — сплошной цвет */
    background: var(--glass-bg-strong);
    border: 1px solid var(--glass-border);
    max-height: 80px;
    transition: max-height 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease;
    box-shadow: var(--glass-shadow);
    border-radius: var(--bento-radius-sm);
}
#objects .object:hover .box .info,
#objects .object.ordered .box .info {
    max-height: 230px;
    box-shadow: var(--glass-shadow-hover);
    /* УБРАНО: transform — заменено на тень */
}
#objects .object .box .info .agent {

}
#objects .object .box .info .agent .avatar {
    float: left;
}
#objects .object .box .info .agent .avatar img {
    width: 80px;
    height: 80px;
    margin: -5px 0 0 -5px;
    transition: box-shadow 0.3s ease;
    border-radius: var(--bento-radius-sm);
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}
#objects .object .box .info .agent .contact {
    float: right;
    width: calc(100% - 70px);
    margin: -5px -5px 0 0;
    padding: 5px;
    text-align: right;
}
#objects .object .box .info .agent .contact .phone {

}
#objects .object .box .info .agent .contact .fio {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    color: var(--a_dark);
}
#objects .object .box .info .tools {
    clear: both;
    display: flex;
    justify-content: space-around;
    padding-top: 8px;
    border-top: 1px solid var(--glass-border);
    margin-top: 8px;
}
#objects .object .box .info .tools a {
    position: relative;
    width: 100%;
    color: var(--one);
    padding: 8px;
    border-radius: var(--bento-radius-sm);
    transition: var(--transition-color);
}
#objects .object .box .info .tools a:hover {
    background: rgba(13, 93, 145, 0.08);
    /* УБРАНО: transform — заменено на цвет */
}
#objects .object .box .info .tools a i {
    transform: scale(1.3);
    /* УБРАНО: filter: drop-shadow */
}
#objects .object .box .info .tools a:after {
    content: "";
    position: absolute;
    top: 50%;
    right: -1px;
    transform: translateY(-50%);
    width: 1px;
    height: 40px;
    background: linear-gradient(180deg, transparent, var(--gray), transparent);
}
#objects .object .box .info .tools a:last-child:after {
    display: none;
}
@media only screen and (max-width: 1270px) and (min-width: 1200px) {
    #objects .object .box .info .agent .avatar {
        display: none;
    }
    #objects .object .box .info .agent .contact {
        width: 100%;
    }
}
#objects .object .datas {
    padding-top: 5px;
}


/* ============================================
   OBJECT — Single View
   ============================================ */

#object {

}


/* ============================================
   AGENT BLOCK — 2026 Glass Profile (без blur!)
   ============================================ */

.block_agent {
    border-radius: var(--bento-radius);
    /* Вместо backdrop-filter — просто цвет */
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    margin: 0;
    padding: 20px;
    box-shadow: var(--glass-shadow);
    transition: box-shadow 0.3s ease;
}
.block_agent:hover {
    box-shadow: var(--glass-shadow-hover);
    /* УБРАНО: transform — заменено на тень */
}
.block_agent .agent .avatar {

}
.block_agent .agent .avatar img {
    border-radius: var(--bento-radius-sm);
    box-shadow: var(--glass-shadow);
    transition: box-shadow 0.3s ease;
}
.block_agent .agent .avatar img:hover {
    /* УБРАНО: transform — заменено на тень */
    box-shadow: var(--glass-shadow-hover);
}
.block_agent .agent .info {
    padding: 0 0 0 10px;
}
.block_agent .agent .contact {

}
.block_agent .agent .contact .phone {
    font-weight: 600;
    color: var(--one);
}
.block_agent .agent .contact .fio {
    font-weight: 700;
    color: var(--a_dark);
}

@media (max-width: 991px) {
    .block_agent .col-12:first-child {

    }
    .block_agent .col-12:last-child {

    }
}


/* ============================================
   FOOTER — 2026 Dark Glass (без blur!)
   ============================================ */

footer {

}
footer .info {
    /* Вместо backdrop-filter — сплошной цвет */
    background: linear-gradient(135deg, #39363d 0%, #35323a 100%);
    color: var(--white);
    padding-top: 18px;
    padding-bottom: 18px;
    border-top: 1px solid rgba(255,255,255,0.05);
    position: relative;
}
footer .info::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--gradient-warm);
}
footer .info h3 {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 0.02em;
}
footer .main {
    background: linear-gradient(180deg, #302d34 0%, #2a272e 100%);
    padding-top: 10px;
    padding-bottom: 40px;
    color: #98969b;
    position: relative;
}
footer .main::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.08), transparent);
}
footer a {
    color: var(--a_light);
    transition: var(--transition-color);
    position: relative;
}
footer a:hover,
footer a.active {
    color: var(--five_light);
    /* УБРАНО: text-shadow — вызывает repaint */
}
footer .main ul {
    list-style: none;
    padding: 0px;
}
footer .tiny {
    background: linear-gradient(180deg, #252428 0%, #1f1d22 100%);
    color: #98969b;
    font-size: 13px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-top: 1px solid rgba(255,255,255,0.03);
}

@media only screen and (min-width: 640px) {
    footer ul.data {
        column-width: auto;
    }
}
footer ul.data li {
    display: block;
    min-width: 190px;
}
footer ul.data li:after {
    display: none;
}
footer .logo {

}
footer .title {
    color: var(--five_light);
    font-weight: bold;
    margin-bottom: 5px;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-top: 20px;
    position: relative;
    display: inline-block;
}
footer .title::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 30px;
    height: 2px;
    background: var(--gradient-warm);
    border-radius: 2px;
}
footer .contact {

}
footer .contact ul li {
    margin-bottom: 10px;
    transition: var(--transition-color);
}
footer .contact ul li:hover {
    /* УБРАНО: transform — заменено на цвет */
    color: var(--five_light);
}
footer .social {

}
footer .links {

}


/* ============================================
   MAIN BLOCKS — 2026 Bento Grid with Hover
   ============================================ */

.main_blocks {

}
.main_blocks .card-body {
    padding: 0 10px;
}
.main_blocks a.title {
    display: block;
    font-size: 18px;
    color: #3a3c41;
    height: 25px;
    margin: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    transition: var(--transition-color);
}
.main_blocks a.title:hover {
    color: var(--one);
}
.main_blocks .card-body .row div {
    padding-right: 5px;
    padding-left: 5px;
    text-align: center;
}
.main_blocks figure span {
    position: absolute;
    top: 0;
    right: 0;
    background: var(--gradient-accent);
    color: var(--white);
    font-size: 13px;
    padding: 6px 12px;
    border-radius: 0 0 0 var(--bento-radius-sm);
    z-index: 10;
    font-weight: 600;
    box-shadow: -2px 2px 8px rgba(0,0,0,0.12);
}
.main_blocks figure {
    position: relative;
    overflow: hidden;
    max-height: 220px;
    width: 100%;
    background: #c0c0c0;
    color: #ffffff;
    text-align: left;
    border-radius: var(--bento-radius);
    box-shadow: var(--glass-shadow);
    transition: box-shadow 0.3s ease;
}
.main_blocks figure:hover {
    box-shadow: var(--glass-shadow-hover);
    /* УБРАНО: transform — заменено на тень */
}
.main_blocks figure *,
.main_blocks figure *:after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.main_blocks figure img {
    max-width: 100%;
    position: relative;
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
}
.main_blocks figure figcaption {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
.main_blocks figure h3 {
    position: absolute;
    width: 100%;
    background: linear-gradient(180deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.6) 100%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    padding: 12px 20px;
    margin: 0;
    top: 50%;
    text-transform: uppercase;
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 0.05em;
}
.main_blocks figure .icons {
    padding: 5px 15px;
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    background: rgba(255,255,255,0.95);
    text-align: right;
    transform: translateY(-50%);
    transition-delay: 0.2s;
    border-top: 1px solid var(--glass-border);
    border-bottom: 1px solid var(--glass-border);
}
.main_blocks figure .icons a {
    opacity: 0;
    transform: translateY(-20px);
    transition: all 0.3s ease-in-out;
}
.main_blocks figure a {
    opacity: 0.7;
    transition-property: none;
}
.main_blocks figure a:hover {
    opacity: 1;
}
.main_blocks figure:hover img,
.main_blocks figure.hover img {
    opacity: 0.3;
    -webkit-transform: scale(1);
    transform: scale(1);
}
.main_blocks figure:hover h3,
.main_blocks figure.hover h3 {
    transform: translateY(-100%);
    transition-delay: 0.2s;
}
.main_blocks figure:hover .icons,
.main_blocks figure.hover .icons {
    transform: translateY(0);
}
.main_blocks figure:hover .icons a,
.main_blocks figure.hover .icons a {
    opacity: 1;
    transform: translateY(0);
}
.main_blocks figure:hover a:first-child,
.main_blocks figure.hover a:first-child {
    transition-delay: 0.3s;
}

.main_blocks.arts .card {
    border: 0;
    background: transparent;
    box-shadow: none;
}
.main_blocks.arts .card .card-body {
    padding: 0 !important;
}
.main_blocks.arts .card .card-img-top {
    height: 250px;
    object-fit: cover;
    border-radius: var(--bento-radius) var(--bento-radius) 0 0;
    box-shadow: var(--glass-shadow);
    transition: box-shadow 0.3s ease;
}
.main_blocks.arts .card .card-img-top:hover {
    box-shadow: var(--glass-shadow-hover);
    /* УБРАНО: transform — заменено на тень */
}
.main_blocks.arts .card .card-body p {
    display: flex;
    align-items: center;      /* Центрирует по вертикали */
    justify-content: center;  /* Центрирует по горизонтали */
    height: 100%;
    padding: 4px;
    margin: 0;
    background-color: var(--one);
    color: var(--white);
    text-align: center;
    border-radius: 0 0 var(--bento-radius) var(--bento-radius);
    box-shadow: var(--glass-shadow);
    font-weight: 600;
    letter-spacing: 0.02em;
    border: 1px solid var(--glass-border);
}


/* ============================================
   ARTICLE GENERATOR BLOCKS
   ============================================ */

.block_generator div img {
    width: 100%;
    max-height: 150px;
    object-fit: cover;
    margin: 0 !important;
    padding: 0;
    border-radius: var(--bento-radius-sm);
    box-shadow: var(--glass-shadow);
    transition: box-shadow 0.3s ease;
}
.block_generator div img:hover {
    box-shadow: var(--glass-shadow-hover);
    /* УБРАНО: transform — заменено на тень */
}
.block_generator div p.price {
    text-align: center;
    letter-spacing: -0.05rem;
    font-weight: 700;
    font-size: 1.2em;
    margin-top: 8px;
}


/* ============================================
   MAP — 2026 Glass Map Frame (без blur!)
   ============================================ */

#map, #panorama {
    width: 100%;
    height: 350px;
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    margin-bottom: 10px;
    text-align: center;
    border-radius: var(--bento-radius);
    overflow: hidden;
    transition: box-shadow 0.3s ease;
}
#map:hover, #panorama:hover {
    box-shadow: var(--glass-shadow-hover);
}

.map_link {
    border-radius: var(--bento-radius);
    margin: 0 auto 15px auto;
    position: relative;
    width: 98%;
    background: linear-gradient(135deg, #f2ece6 0%, #fff8f0 100%);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    overflow: hidden;
    transition: box-shadow 0.3s ease;
}
.map_link:hover {
    box-shadow: var(--glass-shadow-hover);
    /* УБРАНО: transform — заменено на тень */
}
.map_link:before {
    backface-visibility: hidden;
    background: linear-gradient(90deg, rgba(255, 100, 0, 0.12) 0%, rgba(255, 100, 0, 0.04) 100%);
    border-radius: var(--bento-radius) 0 0 var(--bento-radius);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: width 500ms cubic-bezier(0.34, 1.56, 0.64, 1);
    width: 82px;
}
.map_link:hover:before {
    width: 100%;
    border-radius: var(--bento-radius);
}
.map_link .left {
    float: left;
    padding: 5px 10px;
    text-align: center;
}
.map_link .left i.fa {
    color: #FF6400;
    font-size: 55px;
    width: 60px;
    /* УБРАНО: filter: drop-shadow — GPU-зависимый */
}
.map_link .right {
    overflow: hidden;
    padding: 10px 5px 10px 20px;
    color: #FF6400;
    font-size: 16px;
    font-weight: 600;
}
.map_link .right i {
    color: var(--gray);
    font-size: 13px;
}


/* ============================================
   OFFER MODAL — 2026 Glass Popup (без blur!)
   ============================================ */

#offer {
    display: none;
    left: 0;
    right: 0;
    top: 15%;
    width: 500px;
    max-height: none;
    overflow: hidden;
    /* Вместо backdrop-filter — сплошной цвет */
    background: var(--glass-bg-strong);
    position: fixed;
    margin: auto;
    max-width: 100%;
    z-index: 2147483645;
    color: #323232;
    box-shadow: 0 20px 40px rgba(0,0,0,0.2);
    border-radius: var(--bento-radius);
    border: 1px solid var(--glass-border);
}
#offer .title {
    background: var(--four);
    min-height: 40px;
    position: relative;
}
#offer .title::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: rgba(255,255,255,0.3);
}
#offer .title i {
    background: var(--white);
    color: var(--four);
    font-size: 18px;
}
#offer .title i.h3 {
    float: left;
    margin: 5px;
    padding: 6px;
    border-radius: 50%;
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
}
#offer .title h3 {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: var(--white);
    margin: 0 5px 0 0;
}
#offer .triangle {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    border-left: 245px solid transparent;
    border-right: 245px solid transparent;
    border-top: 20px solid var(--four);
    z-index: 100;
}
#offer .body {
    padding: 0 10px 5px 10px;
}
#offer #intro, #offer #form {
    overflow: hidden;
}
#offer .form-group {
    margin-bottom: 5px;
}
#offer .form-group label {
    margin-bottom: 0;
    background: var(--white);
    color: var(--gray);
    margin-left: 8px;
    font-weight: bold;
    line-height: 18px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 93%;
}
#offer .form-group input {
    margin-top: -14px;
    background: rgba(255,255,255,0.9);
    border: 1px solid var(--glass-border);
    border-radius: var(--bento-radius-sm);
    box-shadow: var(--soft-shadow-inset);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
#offer .form-group input:focus {
    box-shadow: 0 0 0 2px rgba(32, 118, 77, 0.12);
    border-color: var(--four_light);
    outline: none;
}
#offer p.privacy {
    margin: 0;
}

@media (orientation: landscape) and (max-height: 650px) {
    #offer {
        top: 280px !important;
        position: absolute !important;
    }
}
@media screen and (max-width: 500px) {
    #offer {
        width: 300px;
    }
    #offer h3 {
        font-size: 15px !important;
    }
    #offer .triangle {
        border-left: 150px solid transparent;
        border-right: 150px solid transparent;
    }
}

#offer_button {
    background: var(--gradient-success);
    border-radius: 50%;
    color: var(--white);
    font-size: 20px;
    margin: 8px 4px 6px 1px;
    padding: 3px 0 0 8px;
    position: fixed;
    top: 0;
    z-index: 2147483646;
    cursor: pointer;
    width: 44px;
    height: 44px;
    box-shadow: 0 4px 16px rgba(32, 118, 77, 0.25);
    transition: box-shadow 0.3s ease, background 0.3s ease;
    border: 2px solid rgba(255,255,255,0.3);
}
#offer_button:hover {
    /* УБРАНО: transform — заменено на тень */
    box-shadow: 0 8px 24px rgba(32, 118, 77, 0.35);
}


/* ============================================
   BASKET — 2026 Glass Floating Cart (без blur!)
   ============================================ */

#basket {
    position: fixed;
    bottom: 10px;
    right: 10px;
    width: 350px;
    max-width: 94%;
    max-height: 90vh;
    /* Вместо backdrop-filter — сплошной цвет */
    background: var(--glass-bg-strong);
    border: 1px solid var(--gray_dark);
    transition: width 500ms 0ms ease-in-out, max-height 500ms 500ms ease-in-out, box-shadow 150ms linear;
    border-radius: var(--bento-radius);
    padding: 2px 0;
    overflow: hidden;
    z-index: 10000;
    box-shadow: var(--glass-shadow-hover);
}
#basket:hover {
    box-shadow: 0 16px 48px rgba(13, 93, 145, 0.15);
}
#basket > .title {
    text-align: center;
    font-weight: bold;
    cursor: pointer;
    margin-bottom: 5px;
    padding: 8px;
    color: var(--one);
    letter-spacing: 0.02em;
}
#basket > .title:after {
    font-family: "Font Awesome 5 Free";
    content: "\f077";
    font-size: 16px;
    float: right;
    margin-right: 5px;
    margin-top: 2px;
    line-height: 23px;
    transform: rotate(0deg);
    transition: transform 550ms cubic-bezier(0.34, 1.56, 0.64, 1);
}
#basket.closed > .title:after {
    transform: rotate(-180deg);
    transition: transform 550ms cubic-bezier(0.34, 1.56, 0.64, 1);
}
#basket .html {
    display: flex;
    flex-direction: column;
    max-height: calc(80vh - 25px);
}
#basket .html .objects {
    display: block;
    height: 100%;
    overflow-x: hidden;
    padding: 0 8px;
}
#basket .form {
    max-height: calc(80vh - 25px);
    padding: 0 15px;
    overflow: auto;
}
#basket .form .privacy {
    font-size: 14px;
}
#basket .form .privacy label {
    margin-bottom: 0;
}
#basket.closed {
    width: 250px;
    max-height: 45px;
    transition: width 300ms 1100ms ease-in-out, max-height 1000ms 0ms ease-in-out, border 300ms 0ms ease-in-out, box-shadow 150ms linear;
    border: 1px solid var(--gray_dark);
}
#basket .objects,
#basket .html .info {
    opacity: 1;
    transition: opacity 1s ease-in-out;
}
#basket.closed .objects,
#basket.closed .html .info {
    opacity: 0;
    transition: opacity 1.0s ease-in-out;
}
#basket .html .info {
    padding: 0 8px;
    border-top: 1px solid var(--glass-border);
    margin-top: 8px;
    font-weight: 600;
    color: var(--one);
}
#basket .objects .object {
    border: 1px solid var(--glass-border);
    padding: 5px 5px;
    margin-bottom: 8px;
    background: rgba(255,255,255,0.7);
    border-radius: var(--bento-radius-sm);
    transition: box-shadow 0.2s ease, background 0.2s ease;
}
#basket .objects .object:hover {
    background: rgba(255,255,255,0.95);
    box-shadow: var(--glass-shadow);
    /* УБРАНО: transform — заменено на тень */
}
#basket .objects .object .title {
    float: right;
    font-weight: bold;
    text-align: right;
    width: calc(100% - 80px);
    color: var(--a_dark);
}
#basket .objects .object .image {
    float: left;
    width: 80px;
    max-height: 80px;
    overflow: hidden;
    border-radius: var(--bento-radius-sm);
}
#basket .objects .object .image img {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: var(--bento-radius-sm);
}
#basket .objects .object .price {
    float: left;
    line-height: 31px;
    font-weight: 700;
}
#basket .objects .object .tools {
    float: right;
}
#basket .objects .object .tools .ordered {
    background: #000 !important;
    color: #fff !important;
}
#basket .form-group {
    margin-bottom: 0.3rem;
}
#basket_float {
    width: 250px;
    height: 250px;
    overflow: hidden;
    border: 1px solid var(--glass-border);
    border-radius: var(--bento-radius);
    position: absolute;
    background: var(--glass-bg-strong);
    z-index: 10001;
    box-shadow: var(--glass-shadow-hover);
}
#basket_float img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/* ============================================
   WIDGET MESSAGES — 2026 Animated Orb
   ============================================ */

.widget_messages {
    width: 250px;
    height: 250px;
    margin: 0;
    position: fixed;
    bottom: -175px;
    right: -175px;
    transition: all .4s ease-out .0s;
    z-index: 1010;
}
.widget_messages.open {
    bottom: 5px;
    right: 5px;
    transition: all .4s ease-out .0s;
}
.widget_messages .menu_circle {
    width: 250px;
    height: 250px;
    opacity: 0;
    transform: scale(0);
    transition: all .4s ease-in-out;
    background: linear-gradient(135deg, rgba(23, 162, 184, 0.95) 0%, rgba(13, 93, 145, 0.95) 100%);
    /* УБРАНО: backdrop-filter — заменено на сплошной цвет */
    border: 2px solid rgba(255, 255, 255, .4);
    border-radius: 50%;
    box-shadow: 0 8px 32px rgba(13, 93, 145, 0.25);
}
.widget_messages.open .menu_circle {
    display: flex;
    justify-content: center;
    opacity: 1;
    transform: scale(1);
    transition: all .4s ease-in-out;
}
.widget_messages .menu_circle a {
    text-decoration: none;
    color: white;
    height: 44px;
    width: 44px;
    line-height: 44px;
    margin-left: -20px;
    margin-top: -20px;
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 22px;
    background: linear-gradient(145deg, #29A6CC, #1a8bb3);
    border-radius: 50%;
    text-shadow: 1px 3px #000;
    border: 1px solid var(--white);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    transition: var(--transition-color);
}
.widget_messages .menu_circle a:hover {
    color: #eef;
    /* УБРАНО: transform — заменено на цвет */
}
.widget_messages .menu_button {
    position: absolute;
    top: 0;
    left: 0;
    text-decoration: none;
    text-align: center;
    color: #444;
    border-radius: 50%;
    display: block;
    height: 44px;
    width: 44px;
    line-height: 44px;
    padding: 10px;
    transition: all 0.2s linear;
}
.widget_messages.open .menu_button {
    top: calc(50% - 20px);
    left: calc(50% - 20px);
    transition: all 0.2s linear;
}
.widget_messages .menu_button:hover {

}
.widget_messages.open .menu_circle ~ .menu_button em,
.widget_messages.open .menu_circle ~ .menu_button u {
    display: none;
}
.widget_messages .menu_button em, .widget_messages .menu_button u, .widget_messages .menu_button span {
    display: block;
    position: absolute;
    border-radius: 100%;
    transform-origin: center center;
    transition: 0.5s
}
.widget_messages .menu_button em {
    width: 80px;
    height: 80px;
    top: -10px;
    left: -10px;
    border: 2px solid #93A8B2;
    opacity: 0.5;
    background: #f00;
    animation: widget_menu_anim1 1.2s infinite ease-in-out;
}
.widget_messages .menu_button u {
    width: 48px;
    height: 48px;
    top: 6px;
    left: 6px;
    text-decoration: none;
    background: #6E9AC1;
    opacity: 0.45;
    animation: widget_menu_anim2 2.3s infinite ease-in-out;
}
.widget_messages .menu_button span {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
    top: 15px;
    left: 15px;
    background: #009DCC;
    opacity: 0.7;
    animation: widget_menu_anim3 2s infinite ease-in-out, widget_menu_bg_change 10s infinite;
    color: var(--white);
    font-size: 20px;
    cursor: pointer;
}
.widget_messages.open .menu_circle ~ .menu_button span {
    top: -6px;
    left: -6px;
    padding: 25px;
    font-size: 30px;
    animation: unset;
    border: 1px solid black;
    background: var(--gradient-accent);
    box-shadow: var(--glass-shadow);
}
.widget_messages.open .menu_circle .social_phone,
.widget_messages.open .menu_circle .social_mail {
    background: var(--gradient-accent);
}
.widget_messages.open .menu_circle .social_whatsapp {
    background: linear-gradient(145deg, #2DBF00, #29AD00);
}
.widget_messages.open .menu_circle .social_telegram {
    background: linear-gradient(145deg, #3DB5F0, #2CA3E0);
}
.widget_messages.open .menu_circle .social_max {
    background: linear-gradient(145deg, #1682FC, #9443DB);
}
.widget_messages.open .menu_circle .social_instagram {
    background: linear-gradient(145deg, #D91674, #C50364);
}
.widget_messages.open .menu_circle .social_vk {
    background: linear-gradient(145deg, #5A8FC2, #4F7DB2);
}
.widget_messages.open .menu_circle .social_facebook {
    background: linear-gradient(145deg, #4E74BD, #4064AD);
}
.widget_messages.open .menu_circle .social_odnoklassniki {
    background: linear-gradient(145deg, #FF9F2E, #F98B0E);
}
.widget_messages.open .menu_circle .social_viber {
    background: linear-gradient(145deg, #8A5DAF, #734D93);
}

@keyframes widget_menu_anim1 {
    0% {
        transform: rotate(0deg) scale(0.5) skew(1deg);
        opacity: 0.1
    }
    30% {
        transform: rotate(0deg) scale(.7) skew(1deg);
        opacity: 0.5
    }
    100% {
        transform: rotate(0deg) scale(1) skew(1deg);
        opacity: 0.1
    }
}
@keyframes widget_menu_anim2 {
    0% {
        transform: rotate(0deg) scale(0.7) skew(1deg);
        opacity: 0.2
    }
    50% {
        transform: rotate(0deg) scale(1) skew(1deg);
        opacity: 0.2
    }
    100% {
        transform: rotate(0deg) scale(0.7) skew(1deg);
        opacity: 0.2
    }
}
@keyframes widget_menu_anim3 {
    0% {
        transform: rotate(0deg) scale(1) skew(1deg);
    }
    5% {
        transform: rotate(-15deg) scale(1) skew(1deg)
    }
    10% {
        transform: rotate(15deg) scale(1) skew(1deg)
    }
    100%, 20% {
        transform: rotate(0deg) scale(1) skew(1deg)
    }
}
@keyframes widget_menu_bg_change {
    0% {
        background: #f00;
        color: #fff;
        font-size: 20px;
    }
    25% {
        background: #ff0;
        color: #f00;
        font-size: 14px;
    }
    50% {
        background: #00f;
        color: #ff0;
        font-size: 16px;
    }
    75% {
        background: #0f0;
        color: #00f;
        font-size: 18px;
    }
    100% {
        background: #fff;
        color: #000;
        font-size: 20px;
    }
}