@font-face {
    font-family: 'TT Interfaces';
    src: url('/media/templates/site/yukka/fonts/tt-interfaces/TTInterfaces-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'TT Interfaces';
    src: url('/media/templates/site/yukka/fonts/tt-interfaces/TTInterfaces-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'TT Interfaces';
    src: url('/media/templates/site/yukka/fonts/tt-interfaces/TTInterfaces-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Cormorant Garamond';
    src: url('/media/templates/site/yukka/fonts/cormorant-garamond/CormorantGaramond-wght.ttf') format('truetype');
    font-weight: 300 700;
    font-style: normal;
    font-display: swap;
}

:root {
    --yukka-green: #9a9a94;
    --yukka-green-dark: #6f6f68;
    --yukka-highlight: #4a4a44;
    --yukka-orange: #ff9b00;
    --yukka-navy: #3d3d38;
    --yukka-text: #57574f;
    --yukka-bg: #f7f7f5;
    --yukka-border: #e2e2de;
    --yukka-muted: #8c8c85;
    --yukka-ink: #4a4a44;
    --yukka-tag-bg: #e6e6e1;
    --yukka-tag-text: #57574f;
    --yukka-bg-product: #fff;
    --yukka-overlay-bg: rgb(60 60 60 / 50%);
    --yukka-font-display: 'TT Interfaces', sans-serif;
    --yukka-font-body: 'TT Interfaces', sans-serif;
    --yukka-font-serif: 'Cormorant Garamond', Garamond, serif;
    --yukka-gray: #f5f5f5;
}

:root[data-yukka-theme="dark"] {
    color-scheme: dark;
    --yukka-bg: #101112;
    --yukka-bg-product: #1c1d1f;
    --yukka-text: #c7c4bd;
    --yukka-border: #35342f;
    --yukka-muted: #8f8b83;
    --yukka-ink: #d8d4cb;
    --yukka-tag-bg: #2c2a22;
    --yukka-tag-text: #bca274;
    --yukka-overlay-bg: rgb(0 0 0 / 65%);
    --body-bg: #101112;
    --body-bg-rgb: 16, 17, 18;
    --body-color: #c7c4bd;
    --body-color-rgb: 199, 196, 189;
    --border-color: #35342f;
    --border-color-translucent: rgb(255 255 255 / 15%);
    --secondary-bg: #232420;
    --secondary-bg-rgb: 35, 36, 32;
    --tertiary-bg: #1c1d1f;
    --tertiary-bg-rgb: 28, 29, 31;
    --emphasis-color: #fff;
    --emphasis-color-rgb: 255, 255, 255;
    --secondary-color: rgb(199 196 189 / 75%);
    --secondary-color-rgb: 199, 196, 189;
    --tertiary-color: rgb(199 196 189 / 50%);
    --tertiary-color-rgb: 199, 196, 189;
}
:root[data-yukka-theme="dark"] body:not(.yukka-hero-page) .navbar-brand .brand-logo img {
    filter: brightness(0) invert(1);
}
:root[data-yukka-theme="dark"] .yukka_cat_intro_logo {
    filter: brightness(0) invert(1);
}
:root[data-yukka-theme="dark"] .container-topbar,
:root[data-yukka-theme="dark"] .footer {
    background: #000;
}
:root[data-yukka-theme="dark"] .footer {
    color: rgba(255, 255, 255, 0.75);
}
:root[data-yukka-theme="dark"] .footer a {
    color: rgba(255, 255, 255, 0.75);
}
:root[data-yukka-theme="dark"] .yukka_footer_heading,
:root[data-yukka-theme="dark"] .yukka_footer_phone {
    color: #fff !important;
}
:root[data-yukka-theme="dark"] .yukka_footer_subscribe_input,
:root[data-yukka-theme="dark"] .yukka_footer_social_icon {
    background: #1a1a1a;
    border-color: rgba(255, 255, 255, 0.15);
    color: rgba(255, 255, 255, 0.75);
}
:root[data-yukka-theme="dark"] .yukka_footer_bottom {
    border-color: rgba(255, 255, 255, 0.15);
}
:root[data-yukka-theme="dark"] .yukka_footer_logo {
    filter: brightness(0) invert(1);
}
:root[data-yukka-theme="dark"] .yukka_product_title,
:root[data-yukka-theme="dark"] .yukka_product_card_name {
    color: #bca274;
}

html {
    overflow-x: hidden;
}
body {
    overflow-x: hidden;
    font-family: var(--yukka-font-body);
    color: var(--yukka-text);
  background: var(--yukka-bg-product);
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--yukka-font-display);
    color: var(--yukka-navy);
    font-weight: 400;
}
:root[data-yukka-theme="dark"] h1,
:root[data-yukka-theme="dark"] h2,
:root[data-yukka-theme="dark"] h3,
:root[data-yukka-theme="dark"] h4,
:root[data-yukka-theme="dark"] h5,
:root[data-yukka-theme="dark"] h6 {
    color: var(--yukka-ink);
}

a {
    color: var(--yukka-green-dark);
}
a:hover {
    color: var(--yukka-highlight);
}

.yukka_top_bar {
    background: var(--yukka-bg);
    border-bottom: 1px solid var(--yukka-border);
}
.yukka_top_bar_inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    max-width: 1320px;
    margin: 0 auto;
  padding: 20px 0px;
}
.yukka_top_bar_left,
.yukka_top_bar_right {
    display: flex;
    align-items: center;
    gap: 22px;
}
.yukka_top_bar a {
    font-family: var(--yukka-font-body);
  font-size: 17px;
    color: var(--yukka-text);
    text-decoration: none;
    white-space: nowrap;
}
.yukka_top_bar a:hover {
    color: var(--yukka-highlight);
}
.yukka_top_bar_phone {
    color: var(--yukka-navy) !important;

}
body.yukka-hero-page .yukka_top_bar {
    background: transparent;
    border-bottom: none;
}
body.yukka-hero-page .yukka_top_bar a {
    color: rgba(255, 255, 255, 0.75);
}
body.yukka-hero-page .yukka_top_bar a:hover {
    color: #ffffff;
}
body.yukka-hero-page .yukka_top_bar_phone {
    color: #ffffff !important;
}
body.yukka-hero-page .header.is-stuck .yukka_top_bar {
    visibility: hidden;
}
@media (max-width: 767px) {
    .yukka_top_bar_inner {
        padding: 8px 20px;
        gap: 12px;
        overflow-x: auto;
    }
    .yukka_top_bar_left,
    .yukka_top_bar_right {
        gap: 14px;
    }
}

.container-topbar {
    background: var(--yukka-navy);
}
.yukka-topbar-menu.mod-menu {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 22px;
    margin: 0;
    padding: 8px 20px;
    list-style: none;
    max-width: 1320px;
    margin-left: auto;
    margin-right: auto;
}
.yukka-topbar-menu .nav-item {
    position: relative;
}
.yukka-topbar-menu .nav-item > a {
    font-family: var(--yukka-font-body);
    font-size: 17px;    
    color: rgba(255, 255, 255, 0.75);
    text-decoration: none;
    white-space: nowrap;
}
.yukka-topbar-menu .nav-item > a:hover {
    color: #ffffff;
}
#yukka_doors_menu_trigger {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 20px;
    border-radius: 30px;
    background: #ffffff;
    color: var(--yukka-navy) !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
    text-decoration: none !important;
    transition: box-shadow .15s ease;
}
#yukka_doors_menu_trigger:hover {
    color: var(--yukka-navy) !important;
    text-decoration: none !important;
    box-shadow: none;
}
.container-header .mod-menu > li.item-doors-menu.active::after,
.container-header .mod-menu > li.item-doors-menu:hover::after {
    display: none;
}
.yukka-topbar-menu .item-collections-menu {
    position: relative;
}
.yukka-topbar-menu .item-collections-menu > a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}
.yukka-topbar-menu .item-collections-menu > a::after {
    content: '';
    width: 5px;
    height: 5px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
}
.yukka_collections_menu_dropdown {
    position: absolute;
    top: calc(100% + 18px);
    left: 50%;
    z-index: 1080;
    display: grid;
    grid-template-columns: minmax(420px, 1.2fr) minmax(360px, .95fr);
    gap: 28px;
    min-width: 860px;
    padding: 24px;
    background: color-mix(in srgb, var(--yukka-bg-product) 94%, var(--body-bg));
    border: 1px solid color-mix(in srgb, var(--yukka-green-dark) 18%, transparent);
    border-radius: 8px;
    box-shadow: 0 18px 48px rgba(4, 30, 66, 0.16);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate(-50%, 8px);
    transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s;
}
.yukka_collections_menu_dropdown::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: -20px;
    height: 20px;
}
.yukka-topbar-menu .item-collections-menu:hover .yukka_collections_menu_dropdown,
.yukka-topbar-menu .item-collections-menu:focus-within .yukka_collections_menu_dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate(-50%, 0);
    transition: opacity .18s ease, transform .18s ease;
}
.yukka_collections_menu_section {
    min-width: 0;
}
.yukka_collections_menu_section--categories {
    padding-left: 28px;
    border-left: 1px solid color-mix(in srgb, var(--yukka-green-dark) 14%, transparent);
}
.yukka_collections_menu_list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 10px;
}
.yukka_collections_menu_section--categories .yukka_collections_menu_list {
    grid-template-columns: 1fr;
}
.yukka-topbar-menu .item-collections-menu .yukka_collections_menu_dropdown a,
body.yukka-hero-page .yukka_main_nav .yukka-topbar-menu .item-collections-menu .yukka_collections_menu_dropdown a {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 34px;
    padding: 8px 0 10px;
    border-radius: 0;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.2;
    color: var(--yukka-navy) !important;
    text-decoration: none !important;
    background: transparent;
}
.yukka-topbar-menu .item-collections-menu .yukka_collections_menu_dropdown a span,
body.yukka-hero-page .yukka_main_nav .yukka-topbar-menu .item-collections-menu .yukka_collections_menu_dropdown a span {
    position: relative;
    display: inline-block;
}
.yukka-topbar-menu .item-collections-menu .yukka_collections_menu_dropdown a span::after,
body.yukka-hero-page .yukka_main_nav .yukka-topbar-menu .item-collections-menu .yukka_collections_menu_dropdown a span::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -4px;
    height: 1px;
    background: currentColor;
    opacity: 0;
    transform: scaleX(0);
    transform-origin: left center;
    transition: opacity .2s ease, transform .2s ease;
}
.yukka-topbar-menu .item-collections-menu .yukka_collections_menu_dropdown a:hover,
body.yukka-hero-page .yukka_main_nav .yukka-topbar-menu .item-collections-menu .yukka_collections_menu_dropdown a:hover {
    background: transparent;
    color: var(--yukka-green-dark) !important;
}
.yukka-topbar-menu .item-collections-menu .yukka_collections_menu_dropdown a:hover span::after,
body.yukka-hero-page .yukka_main_nav .yukka-topbar-menu .item-collections-menu .yukka_collections_menu_dropdown a:hover span::after {
    opacity: .55;
    transform: scaleX(1);
}
.yukka_collections_menu_heading,
.yukka-topbar-menu .item-collections-menu .yukka_collections_menu_dropdown .yukka_collections_menu_heading,
body.yukka-hero-page .yukka_main_nav .yukka-topbar-menu .item-collections-menu .yukka_collections_menu_dropdown .yukka_collections_menu_heading {
    display: flex;
    align-items: center;
    min-height: 36px;
    margin: 0 0 14px;
    padding: 0 0 12px;
    border-bottom: 1px solid var(--yukka-border);
    border-radius: 0 !important;
    color: var(--yukka-navy) !important;
    background: transparent !important;
    font-family: var(--yukka-font-body);
    font-weight: 500;
    line-height: 1;
    letter-spacing: .1em;
    text-transform: uppercase;
    font-size: 12px !important;
    text-decoration: none !important;
}
.yukka_catalog_burger {
    box-sizing: border-box;
    position: relative;
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
}
.yukka_catalog_burger_line {
    position: absolute;
    left: 0;
    width: 18px;
    height: 2px;
    color: currentColor;
    transition: top .25s ease, transform .25s ease, opacity .2s ease;
}
.yukka_catalog_burger_line:nth-child(1) {
    top: 3px;
}
.yukka_catalog_burger_line:nth-child(2) {
    top: 8px;
}
.yukka_catalog_burger_line:nth-child(3) {
    top: 13px;
}
#yukka_doors_menu_trigger:hover .yukka_catalog_burger_line:nth-child(1) {
    top: 8px;
    transform: rotate(45deg);
}
#yukka_doors_menu_trigger:hover .yukka_catalog_burger_line:nth-child(2) {
    opacity: 0;
}
#yukka_doors_menu_trigger:hover .yukka_catalog_burger_line:nth-child(3) {
    top: 8px;
    transform: rotate(-45deg);
}
.yukka-topbar-menu .nav-item.deeper.parent > a::after {
    content: '';
    display: inline-block;
    width: 5px;
    height: 5px;
    margin-left: 5px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
}
.yukka-topbar-menu .nav-item.deeper.parent .mod-menu__sub {
    display: block;
    position: absolute;
    top: 90%;
    left: 0;
    z-index: 40;
    margin: 2px 0 0;
    padding: 8px 0;
    min-width: 170px;
    background: var(--yukka-bg-product);
    border-radius: 6px;
    box-shadow: 0 8px 24px rgba(4, 30, 66, 0.18);
    list-style: none;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(6px);
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.yukka-topbar-menu .nav-item.deeper.parent:hover .mod-menu__sub {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}
.yukka-topbar-menu .mod-menu__sub .nav-item > a {
    display: block;
    padding: 7px 16px;
    color: var(--yukka-navy);
    font-size: 14px;
}
.yukka-topbar-menu .mod-menu__sub .nav-item > a:hover {
    color: var(--yukka-highlight);
}
@media (max-width: 767px) {
    .yukka-topbar-menu.mod-menu {
        gap: 4px 14px;
        padding: 8px 12px;
        overflow-x: auto;
        flex-wrap: nowrap;
    }
    .yukka_collections_menu_dropdown {
        display: none;
    }
}
@media (max-width: 1180px) {
    .yukka_collections_menu_dropdown {
        left: 0;
        min-width: min(860px, calc(100vw - 32px));
        transform: translate(0, 8px);
    }
    .yukka-topbar-menu .item-collections-menu:hover .yukka_collections_menu_dropdown,
    .yukka-topbar-menu .item-collections-menu:focus-within .yukka_collections_menu_dropdown {
        transform: translate(0, 0);
    }
}
@media (max-width: 900px) {
    .yukka_collections_menu_dropdown {
        grid-template-columns: 1fr;
        gap: 22px;
        min-width: min(460px, calc(100vw - 32px));
    }
    .yukka_collections_menu_section--categories {
        padding-left: 0;
        padding-top: 22px;
        border-left: 0;
        border-top: 1px solid color-mix(in srgb, var(--yukka-green-dark) 14%, transparent);
    }
}

.header {
    background: var(--yukka-bg-product);
    border-bottom: 1px solid var(--yukka-border);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 40;
    transform: translateY(0);
    transition: transform .35s ease, box-shadow .35s ease;
}
.header.is-stuck {
    transform: translateY(calc(-1 * var(--yukka-topbar-height, 84px)));
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.1);
}
.header.is-stuck .container-topbar,
.header.is-stuck .yukka_top_bar {
    visibility: hidden;
}
/* Хедер снят из потока (position: fixed) на всех страницах — этот спейсер
   резервирует под него место, чтобы контент не подпрыгивал вверх. На
   герой-страницах он не нужен (фото само начинается с самого верха, хедер
   там прозрачным оверлеем поверх него) — см. body.yukka-hero-page ниже. */
.yukka_header_spacer {
    height: var(--yukka-header-height, 0px);
}
body.yukka-hero-page .yukka_header_spacer {
    display: none;
}

body.yukka-hero-page .header {
    z-index: 20;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0) 100%);
    border-bottom: none;
}
body.yukka-hero-page .header.is-stuck {
    background: var(--yukka-bg-product);
}
body.yukka-hero-page .container-topbar {
    background: transparent;
}
body.yukka-hero-page .yukka-topbar-menu .nav-item > a {
    color: rgba(255, 255, 255, 0.85);
}
body.yukka-hero-page .yukka-topbar-menu .nav-item > a:hover {
    color: #ffffff;
}
body.yukka-hero-page .yukka-topbar-menu .mod-menu__sub .nav-item > a {
    color: var(--yukka-navy);
}
body.yukka-hero-page .site-description {
    color: rgba(255, 255, 255, 0.7);
}
body.yukka-hero-page .container-nav .nav-link, body.yukka-hero-page .container-nav .nav-item > a {
    color: #ffffff;
}
.mod-breadcrumbs__wrapper a {
    text-decoration: none;
}
body.yukka-hero-page .mod-breadcrumbs__wrapper {
    position: absolute;
    top: 565px;
    left: 0;
    right: 0;
    z-index: 15;
    background: transparent;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0px 24px;
}
body.yukka-hero-page .mod-breadcrumbs__wrapper .breadcrumb {
    background: transparent;
    font-family: var(--yukka-font-body);
    font-size: 14px;
}
body.yukka-hero-page .mod-breadcrumbs__wrapper .mod-breadcrumbs__here {
    display: none;
}
body.yukka-hero-page .mod-breadcrumbs__wrapper li, body.yukka-hero-page .mod-breadcrumbs__wrapper span, body.yukka-hero-page .mod-breadcrumbs__wrapper a {
    color: rgba(255, 255, 255, 0.8);
      font-size: 19px;
}
body.yukka-hero-page .mod-breadcrumbs__wrapper .breadcrumb-item + .breadcrumb-item::before {
    color: rgba(255, 255, 255, 0.55);
}
body.yukka-hero-page .mod-breadcrumbs__wrapper a:hover span {
    color: #ffffff;
}
body.yukka-hero-page .mod-breadcrumbs__wrapper .breadcrumb-item.active span {
    color: #ffffff;
}
@media (max-width: 767px) {
    body.yukka-hero-page .mod-breadcrumbs__wrapper {
        top: 270px;
        padding: 0 20px;
    }
}
.navbar-brand .brand-logo {
    display: inline-flex;
    align-items: center;
}
.navbar-brand .brand-logo img {
    height: 34px;
    width: auto;
}
.yukka_main_nav_row {
    display: flex;
    align-items: center;
    gap: 40px;
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
    padding: 14px 40px;
}
.yukka_main_nav_row .navbar-brand {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    height: auto;
    padding: 0;
}
.yukka_main_nav {
    flex: 1 1 auto;
    min-width: 0;
}
.yukka_main_nav .yukka-topbar-menu {
    justify-content: center;
    padding: 0;
}
.yukka_main_nav .yukka-topbar-menu .nav-item > a {
    color: var(--yukka-navy);
}
.yukka_main_nav .yukka-topbar-menu .nav-item > a:hover {
    color: var(--yukka-highlight);
}
.yukka_main_nav .item-945,
.yukka_main_nav .item-946,
.yukka_main_nav .item-947,
.yukka_main_nav .item-948,
.yukka_main_nav .item-950,
.yukka_main_nav .item-951,
.yukka_main_nav .item-957,
.yukka_main_nav .item-958 {
    display: none;
}
.yukka_main_nav_actions {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 0 0 auto;
}
.yukka_main_nav_search_btn,
.yukka_main_nav_icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: none;
    background: none;
    color: var(--yukka-navy);
    cursor: pointer;
    transition: color .15s ease;
}
.yukka_main_nav_search_btn svg,
.yukka_main_nav_icon svg {
    width: 20px;
    height: 20px;
}
.yukka_main_nav_search_btn:hover,
.yukka_main_nav_icon:hover {
    color: var(--yukka-highlight);
}
body.yukka-hero-page .yukka_main_nav .yukka-topbar-menu .nav-item > a {
    color: rgba(255, 255, 255, 0.85);
}
body.yukka-hero-page .yukka_main_nav .yukka-topbar-menu .nav-item > a:hover {
    color: #ffffff;
}
body.yukka-hero-page .yukka_main_nav_search_btn,
body.yukka-hero-page .yukka_main_nav_icon {
    color: #ffffff;
}
body.yukka-hero-page .yukka_main_nav .yukka-topbar-menu .mod-menu__sub .nav-item > a {
    color: var(--yukka-navy);
}
body.yukka-hero-page .yukka_main_nav .yukka-topbar-menu .mod-menu__sub .nav-item > a:hover {
    color: var(--yukka-highlight);
}
body.yukka-hero-page .header.is-stuck .yukka_main_nav .yukka-topbar-menu .nav-item > a {
    color: var(--yukka-ink);
}
body.yukka-hero-page .header.is-stuck .yukka_main_nav_search_btn,
body.yukka-hero-page .header.is-stuck .yukka_main_nav_icon {
    color: var(--yukka-ink);
}
@media (max-width: 991px) {
    .yukka_main_nav_row {
        flex-wrap: wrap;
        gap: 16px;
        padding: 14px 20px;
    }
}
.site-description {
    font-family: var(--yukka-font-body);
    color: var(--yukka-muted);
    font-size: 13px;
}

.container-nav .nav-link, .container-nav .nav-item > a {
    font-family: var(--yukka-font-body);
    font-weight: 600;
    color: var(--yukka-navy);
}
.container-nav .nav-link:hover, .container-nav .nav-item > a:hover {
    color: var(--yukka-highlight);
}

.breadcrumb {
    font-size: 13px;
    color: var(--yukka-muted);
}
.breadcrumb .active, .breadcrumb-item.active {
    color: var(--yukka-navy);
}

.btn-success, .btn-buy, input.btn-success {
    background-color: var(--yukka-green) !important;
    border-color: var(--yukka-green) !important;
    font-family: var(--yukka-font-body);
    font-weight: 700;
}
.btn-success:hover, .btn-buy:hover, input.btn-success:hover {
    background-color: var(--yukka-green-dark) !important;
    border-color: var(--yukka-green-dark) !important;
}
.btn-primary {
    background-color: var(--yukka-navy) !important;
    border-color: var(--yukka-navy) !important;
}
.btn-primary:hover {
    background-color: var(--yukka-green-dark) !important;
    border-color: var(--yukka-green-dark) !important;
}
.btn-secondary, .btn-wishlist {
    background: var(--yukka-bg-product) !important;
    border-color: var(--yukka-navy) !important;
    color: var(--yukka-navy) !important;
    font-weight: 700;
}
.btn-secondary:hover, .btn-wishlist:hover {
    background: var(--yukka-navy) !important;
    color: #ffffff !important;
}

.footer {
    background: #f3f1ec;
    color: var(--yukka-ink);
    margin-top: 150px;
}
.footer a:not(.btn) {
    color: var(--yukka-text);
}
.footer a:not(.btn):hover {
    color: var(--yukka-highlight);
}

.yukka_footer {
    padding: 56px 0 0;
    font-family: var(--yukka-font-body);
}
.yukka_footer_top {
    display: grid;
    grid-template-columns: 1fr 1fr 1.3fr 1fr 1.3fr;
    gap: 32px;
    padding-bottom: 40px;
}
.yukka_footer_col {
    display: flex;
    flex-direction: column;
}
.yukka_footer_heading {
    font-family: var(--yukka-font-body);
    font-size: 17px;
    font-weight: 700;
    color: var(--yukka-ink);
    margin: 0px 0px 40px 0;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.yukka_footer_col a {
  font-size: 15px;
    color: var(--yukka-text);
    text-decoration: none;
    margin-bottom: 12px;
}
.yukka_footer_col a:hover {
    color: var(--yukka-highlight);
}
.yukka_footer_phone {
    font-family: var(--yukka-font-body);
    font-size: 20px;
    font-weight: 700;
    color: var(--yukka-ink) !important;
    text-decoration: none;
    margin-bottom: 10px;
}
.yukka_footer_email {
    font-size: 14px;
    color: var(--yukka-text);
    text-decoration: none;
}
.yukka_footer_subscribe_form {
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
}
.yukka_footer_subscribe_input {
    flex: 1;
    min-width: 0;
    height: 42px;
    padding: 0 14px;
    border: 1px solid var(--yukka-border);
    border-radius: 6px;
    background: #fff;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: var(--yukka-ink);
}
.yukka_footer_subscribe_input::placeholder {
    color: var(--yukka-muted);
}
.yukka_footer_subscribe_btn {
    height: 42px;
    padding: 0 18px;
    border: none;
    border-radius: 6px;
    background: var(--yukka-green);
    color: #fff;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
}
.yukka_footer_subscribe_btn:hover {
    background: var(--yukka-green-dark);
}
.yukka_footer_subscribe_hint {
    font-size: 12px;
    line-height: 1.5;
    color: var(--yukka-muted);
    margin: 0 0 20px;
}
.yukka_footer_social_label {
    font-size: 13px;
    color: var(--yukka-ink);
    margin: 0 0 12px;
}
.yukka_footer_social {
    display: flex;
    gap: 10px;
}
.yukka_footer_social_icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid var(--yukka-border);
    border-radius: 50%;
    color: var(--yukka-ink);
    background: #fff;
    cursor: default;
}
.yukka_footer_social_icon svg {
    width: 17px;
    height: 17px;
}
.yukka_footer_social_icon:hover {
    background: var(--yukka-highlight);
    border-color: var(--yukka-highlight);
    color: #fff;
}
.yukka_footer_bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    border-top: 1px solid var(--yukka-border);
  padding: 40px 0;
    font-size: 14px;
    color: var(--yukka-muted);
}
.yukka_footer_bottom_brand {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}
.yukka_footer_logo {
  height: 40px;
  width: auto;
}
@media (max-width: 991px) {
    .yukka_footer_top {
        grid-template-columns: 1fr 1fr;
        gap: 32px;
    }
}
@media (max-width: 575px) {
    .yukka_footer_top {
        grid-template-columns: 1fr;
        gap: 28px;
    }
    .yukka_footer_bottom {
        flex-direction: column;
        align-items: flex-start;
    }
}

.yukka_price_current {
    font-family: var(--yukka-font-body);
    font-weight: 600;
    color: var(--yukka-navy);
}
.yukka_price_old {
    color: #b3b0a8;
}

[data-tooltip] {
    position: relative;
}
[data-tooltip]::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: calc(100% + 9px);
    left: 50%;
    transform: translateX(-50%) translateY(4px);
    width: max-content;
    max-width: 240px;
    background: var(--yukka-bg-product);
    color: var(--yukka-text);
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.45;
    text-align: left;
    white-space: normal;
    padding: 8px 12px;
    border-radius: 7px;
    box-shadow: 0 8px 20px rgba(4, 30, 66, 0.24);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .15s ease, transform .15s ease;
    z-index: 60;
}
[data-tooltip]::before {
    content: '';
    position: absolute;
    bottom: calc(100% + -1px);
    left: 50%;
    transform: translateX(-50%) translateY(4px);
    border: 5px solid transparent;
    border-top-color: #fff;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .15s ease, transform .15s ease;
    z-index: 60;
}
[data-tooltip][data-tooltip-pos="bottom"]::after {
    bottom: auto;
    top: calc(100% + 9px);
    transform: translateX(-50%) translateY(-4px);
}
[data-tooltip][data-tooltip-pos="bottom"]::before {
    bottom: auto;
    top: calc(100% + 3px);
    transform: translateX(-50%) translateY(-4px) rotate(180deg);
}
[data-tooltip]:hover::after, [data-tooltip]:hover::before, [data-tooltip]:focus-visible::after, [data-tooltip]:focus-visible::before {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}
[data-tooltip][data-tooltip-pos="bottom"]:hover::before, [data-tooltip][data-tooltip-pos="bottom"]:focus-visible::before {
    transform: translateX(-50%) translateY(0) rotate(180deg);
}
[data-tooltip][data-tooltip-align="right"]::after {
    left: auto;
    right: 0;
    transform: translateY(4px);
}
[data-tooltip][data-tooltip-align="right"]::before {
    left: auto;
    right: 9px;
    transform: translateY(4px);
}
[data-tooltip][data-tooltip-align="right"]:hover::after, [data-tooltip][data-tooltip-align="right"]:focus-visible::after,
[data-tooltip][data-tooltip-align="right"]:hover::before, [data-tooltip][data-tooltip-align="right"]:focus-visible::before {
    transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
    [data-tooltip]::after, [data-tooltip]::before {
        transition: none;
    }
}
.yukka_mode_option span {
    font-family: var(--yukka-font-body);
}

.yukka_cat_hero {
    position: relative;
    height: 704px;
    overflow: hidden;
    margin-bottom: 100px;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}
.yukka_cat_hero_slide {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transform: scale(1);
    transition: opacity .6s ease;
}
.yukka_cat_hero_slide.is-active {
    opacity: 1;
    animation: yukka-kenburns 7s ease-in-out forwards;
}
@keyframes yukka-kenburns {
    from {
        transform: scale(1);
    }
    to {
        transform: scale(1.04);
    }
}
.yukka_cat_hero_overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.42) 45%, rgba(0, 0, 0, 0.2) 100%);
}
.yukka_cat_hero_content {
    position: absolute;
    left: 0;
    right: 0;
top: 480px;
    transform: translateY(-50%);
    z-index: 2;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 40px;
}
.yukka_cat_hero_content .yukka_home_hero_eyebrow {
    font-family: var(--yukka-font-body);
    font-size: 21px;
    margin-bottom: 40px;
}
.yukka_cat_hero_logo {
    height: 56px;
    width: auto;
}
.yukka_cat_hero_title {
    color: #fff;
    font-family: var(--yukka-font-display);
    font-size: 64px;
    font-weight: 400;
    margin: 0;
}
.yukka_sr_only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
@media (max-width: 767px) {
    .yukka_cat_hero {
        height: 416px;
    }
    .yukka_cat_hero_content {
        padding: 0 20px;
    }
    .yukka_cat_hero_logo {
        height: 38px;
        margin-bottom: 12px;
    }
    .yukka_cat_hero_title {
        font-size: 32px;
    }
}

.yukka_cat_intro {
    display: flex;
    gap: 48px;
    align-items: stretch;
    margin: 150px 0px;
}
.yukka_category_view--root h1 {
    margin-top: 150px;
}
.yukka_category_view--root .yukka_cat_intro {
    margin-top: 24px;
}
.yukka_cat_intro_text {
    flex: 0 0 auto;
    width: 520px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.yukka_cat_intro_count {
    font-family: var(--yukka-font-display);
    font-size: 32px;
    font-weight: 400;
    color: var(--yukka-navy);
    margin: 0 0 16px;
    text-wrap: balance;
}
.yukka_cat_intro_logo {
    display: block;
    align-self: flex-start;
    height: 40px;
    width: auto;
    margin: 28px 0 32px;
}
.yukka_cat_intro_desc {
    font-family: var(--yukka-font-body);
    font-size: 15px;
    line-height: 1.7;
    color: var(--yukka-text);
}
.yukka_cat_intro_desc strong {
    color: var(--yukka-navy);
}
.yukka_cat_intro_collage {
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 16px;
    min-height: 340px;
}
.yukka_cat_intro_collage_tile {
    border-radius: 12px;
    background-size: cover;
    background-position: center;
}
.yukka_cat_intro_collage_tile_1 {
    grid-column: 1;
    grid-row: 1;
}
.yukka_cat_intro_collage_tile_2 {
    grid-column: 2;
    grid-row: 1 / span 2;
}
.yukka_cat_intro_collage_tile_3 {
    grid-column: 1;
    grid-row: 2;
}
@media (max-width: 991px) {
    .yukka_cat_intro {
        flex-direction: column;
        gap: 24px;
    }
    .yukka_cat_intro_text {
        width: auto;
    }
    .yukka_cat_intro_collage {
        min-height: 280px;
    }
}
@media (max-width: 480px) {
    .yukka_cat_intro_collage {
        grid-template-columns: 1fr;
        grid-template-rows: repeat(3, 160px);
        min-height: 0;
    }
    .yukka_cat_intro_collage_tile_1, .yukka_cat_intro_collage_tile_2, .yukka_cat_intro_collage_tile_3 {
        grid-column: 1;
    }
    .yukka_cat_intro_collage_tile_1 {
        grid-row: 1;
    }
    .yukka_cat_intro_collage_tile_2 {
        grid-row: 2;
    }
    .yukka_cat_intro_collage_tile_3 {
        grid-row: 3;
    }
}

.yukka_collections {
    margin: 8px 0 56px;
}
.yukka_collections_grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
   gap: 50px;
}
.yukka_collection_card {
    display: flex;
    flex-direction: column;
    background: var(--yukka-bg-product);
    border: 1px solid var(--yukka-border);
    border-radius: 12px;
    overflow: hidden;
    transition: box-shadow .2s ease, transform .2s ease;
}
.yukka_collection_card:hover {
    box-shadow: 0 12px 28px rgba(4, 30, 66, 0.12);
    transform: translateY(-3px);
}
.yukka_collection_card_photo {
    display: block;
    aspect-ratio: 4 / 3;
    background: #f2f2ee;
    overflow: hidden;
}
.yukka_collection_card_photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s ease;
}
.yukka_collection_card:hover .yukka_collection_card_photo img {
    transform: scale(1.05);
}
.yukka_collection_card_info {
    padding: 22px 24px 26px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    text-align: left;
}
.yukka_collection_card_name {
    text-align: left;
}
.yukka_collection_card_name a {
    font-family: var(--yukka-font-display);
    font-size: 19px;
    font-weight: 400;
    color: var(--yukka-navy);
    text-decoration: none;
}
.yukka_collection_card_name a:hover {
    color: var(--yukka-highlight);
}
.yukka_collection_card_stats {
    display: flex;
    align-items: center;
    gap: 9px;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: var(--yukka-muted);
    text-align: left;
}
.yukka_collection_card_stats_count {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}
.yukka_collection_card_stats_count svg {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
    color: var(--yukka-green);
}
.yukka_collection_card_stats_divider {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: var(--yukka-border);
    flex: 0 0 auto;
}
.yukka_collection_card_stats_price {
    white-space: nowrap;
}
.yukka_collection_card_stats_price strong {
    color: var(--yukka-navy);
    font-weight: 700;
}
.yukka_collection_card_desc {
    margin: 0;
    text-align: left;
}

.yukka_collection_card_info .collectiontest-item-logo {
    display: none;
}
.yukka_collection_card_info .catlist-description {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    line-height: 1.6;
    color: var(--yukka-text);
    text-align: left;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
@media (max-width: 1150px) {
    .yukka_collections_grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 575px) {
    .yukka_collections_grid {
        grid-template-columns: 1fr;
    }
}

.yukka_maincategory {
    padding-top: 56px;
}
.yukka_maincategory_head {
    max-width: 640px;
    margin: 0 0 40px;
}
.yukka_maincategory_grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 28px;
    margin-bottom: 64px;
}
.yukka_collection_card_photo--empty {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--yukka-bg);
    color: var(--yukka-muted);
}
.yukka_collection_card_photo--empty svg {
    width: 56px;
    height: 56px;
}
@media (max-width: 1150px) {
    .yukka_maincategory_grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 575px) {
    .yukka_maincategory_grid {
        grid-template-columns: 1fr;
    }
}

.yukka_product_grid_inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
    margin: 24px 0 40px;
}
@media (max-width: 1150px) {
    .yukka_product_grid_inner {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 800px) {
    .yukka_product_grid_inner {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 480px) {
    .yukka_product_grid_inner {
        grid-template-columns: 1fr;
    }
}

.yukka_product_card {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: var(--yukka-bg-product);
    /* border: 1px solid var(--yukka-border); */
    border-radius: 10px;
    padding: 50px;
    transition: box-shadow .2s ease, transform .2s ease;
}
.yukka_product_card:hover {
    box-shadow: 0 10px 26px rgba(4, 30, 66, 0.12);
    transform: translateY(-2px);
}
:root[data-yukka-theme="dark"] .yukka_product_card:hover {
    background: #2e2e2d;
}
.yukka_product_card_photo_wrap {
    position: relative;
}
.yukka_product_card_photo {
    position: relative;
    display: block;
    background: #f2f2ee;
    aspect-ratio: 290 / 654;
    overflow: hidden;
}

.yukka_product_card_photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1);
    transition: opacity .35s ease, transform .15s ease;
}
.yukka_product_card_photo.is-recoloring img {
    opacity: .45;
}
.yukka_product_card--pogonazh .yukka_product_card_photo {
    aspect-ratio: 1 / 1;
    background: #fff;
}
.yukka_product_card--pogonazh .yukka_product_card_photo img {
    object-fit: contain;
}
.yukka_product_card_photo img.yukka_product_card_photo_hover {
    position: absolute;
    inset: 0;
    opacity: 0;
    background: #f2f2ee;
    object-fit: contain;
    transition: opacity .4s ease;
}
.yukka_product_card_photo:hover .yukka_product_card_photo_hover {
    opacity: 1;
}
/* Металлические двери — как на заводском сайте: фото открытой двери
   выше основного, поэтому не втискиваем его в рамку карточки (никакого
   object-fit/обрезки), а даём ему выйти за пределы блока по высоте,
   сохранив пропорции. */
.yukka_product_card--metal .yukka_product_card_photo {
    overflow: visible;
    /* Реальные фото металлических дверей 290x580 (соотношение 1:2), а не
       290x654, как у остальных карточек сайта — своя пропорция рамки,
       чтобы cover не обрезал края основного фото. */
    aspect-ratio: 290 / 580;
}
.yukka_product_card--metal .yukka_product_card_photo img.yukka_product_card_photo_hover {
    inset: -4% auto auto 0;
    z-index: 2;
    left: 0px;
    top: -59px;
    height: auto;
    background: transparent;
    object-fit: unset;
}
.yukka_product_card_spinner {
    position: absolute;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 3;
}
.yukka_product_card_spinner.is-active {
    display: flex;
}
.yukka_product_card_label {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 2;
}
.yukka_product_card_label span {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 20px;
    background: var(--yukka-green);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
}
.yukka_product_card_body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-top: 14px;
    flex: 1 1 auto;
}
.yukka_product_card_name {
    font-family: var(--yukka-font-display);
    font-size: 17px;    
    color: var(--yukka-navy);
    text-decoration: none;
    line-height: 1.3;
    padding: 10px 0px;
}
.yukka_product_card_name:hover {
    color: var(--yukka-highlight);
}
.yukka_product_card_avail.is-out {
    font-size: 12px;
    font-weight: 600;
    color: #b3261e;
}
.yukka_product_card_metal_specs {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.yukka_product_card_metal_spec_label {
    display: block;
    font-family: var(--yukka-font-body);
    font-size: 12px;
    font-style: italic;
    color: var(--yukka-muted);
    margin-bottom: 2px;
}
.yukka_product_card_metal_spec_value {
    display: block;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: var(--yukka-ink);
}

.yukka_product_card_prices {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px 0;
    border-top: 1px solid #f0efe9;
    border-bottom: 1px solid #f0efe9;
}
.yukka_product_card_price_item {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}
.yukka_product_card_price_label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: var(--yukka-muted);
    white-space: nowrap;
}
.yukka_product_card_price_value {
    font-family: var(--yukka-font-display);
    font-size: 15px;    
    color: var(--yukka-navy);
    white-space: nowrap;
}
.yukka_product_card_price_item:first-child .yukka_product_card_price_value {
    font-size: 14px;
    font-weight: 700;
    color: var(--yukka-text);
}
.yukka_product_card_kit_info {
    display: inline-flex;
    width: 14px;
    height: 14px;
    color: #b7b4ab;
    cursor: help;
}
.yukka_product_card_kit_info svg {
    width: 100%;
    height: 100%;
}
.yukka_product_card_kit_info:hover {
    color: var(--yukka-highlight);
}

.yukka_product_card_colorname {
    font-size: 14px;
    color: var(--yukka-muted);
}
.yukka_product_card_colorname_value {
    color: var(--yukka-navy);
}

.yukka_product_card_colors {
    display: flex;
    gap: 5px;
    row-gap: 13px;
    flex-wrap: wrap;
}
.yukka_product_card_color_tile {
    width: 22px;
    height: 22px;
    padding: 0;
    border: 1.5px solid var(--yukka-border);
    border-radius: 5px;
    overflow: hidden;
    cursor: pointer;
    background: #f2f2f2;
    flex: 0 0 auto;
}
.yukka_product_card_color_tile img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.yukka_product_card_color_tile.is-selected {
  border-color: #9f9c9c;
   padding: 2px;
}
.yukka_product_card_code_btn {
    width: auto;
    height: 24px;
    padding: 0 12px;
    border: 1.5px solid var(--yukka-border);
    border-radius: 5px;
    background: #f0efe9;
    color: var(--yukka-navy);
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.02em;
    cursor: pointer;
    flex: 0 0 auto;
}
.yukka_product_card_code_btn:hover {
    background: var(--yukka-border);
}
.yukka_product_card_color_reset_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    border: 1.5px solid var(--yukka-border);
    border-radius: 5px;
    background: var(--yukka-bg-product);
    color: var(--yukka-muted);
    cursor: pointer;
    flex: 0 0 auto;
}
.yukka_product_card_color_reset_btn svg {
    width: 12px;
    height: 12px;
}
.yukka_product_card_color_reset_btn:hover {
    color: var(--yukka-highlight);
    border-color: var(--yukka-highlight);
}

.yukka_product_card_icon_actions {
    display: flex;
    gap: 5px;
    margin-left: auto;
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease;
}
.yukka_product_card:hover .yukka_product_card_icon_actions, .yukka_product_card:focus-within .yukka_product_card_icon_actions {
    opacity: 1;
    pointer-events: auto;
}
.yukka_product_card_icon_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    border: 1.5px solid var(--yukka-border);
    border-radius: 5px;
    background: var(--yukka-bg-product);
    color: var(--yukka-muted);
    cursor: pointer;
    flex: 0 0 auto;
    transition: color .15s ease, border-color .15s ease;
}
.yukka_product_card_icon_btn svg {
    width: 13px;
    height: 13px;
}
.yukka_product_card_icon_btn:hover {
    color: var(--yukka-highlight);
    border-color: var(--yukka-highlight);
}

.yukka_toolbar_row {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
    flex-wrap: wrap;
    margin: 0 0 20px;
}
.yukka_reset_colors_btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1.5px solid var(--yukka-border);
    border-radius: 6px;
    background: var(--yukka-bg-product);
    padding: 8px 14px;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 600;
    color: var(--yukka-text);
    cursor: pointer;
    transition: color .15s ease, border-color .15s ease;
}
.yukka_reset_colors_btn svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
}
.yukka_reset_colors_btn:hover {
    color: var(--yukka-highlight);
    border-color: var(--yukka-highlight);
}
.yukka_sort_control {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}
.yukka_sort_control label {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 700;
    color: var(--yukka-navy);
}
.yukka_sort_control select {
    appearance: none;
    -webkit-appearance: none;
    border: 1.5px solid var(--yukka-border);
    border-radius: 6px;
    padding: 8px 32px 8px 14px;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: var(--yukka-navy);
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23041e42' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") no-repeat right 10px center;
    background-size: 14px;
    cursor: pointer;
}
.yukka_sort_control select:focus {
    outline: none;
    border-color: var(--yukka-highlight);
}
.yukka_theme_toggle {
    display: flex;
    align-items: center;
    gap: 6px;
}
.yukka_theme_toggle_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1.5px solid var(--yukka-border);
    border-radius: 50%;
    background: var(--yukka-bg-product);
    color: var(--yukka-muted);
    cursor: pointer;
}
.yukka_theme_toggle_btn svg {
    width: 16px;
    height: 16px;
}
.yukka_theme_toggle_btn:hover {
    color: var(--yukka-navy);
    border-color: var(--yukka-navy);
}
.yukka_theme_toggle_btn.is-active {
    color: #fff;
    background: var(--yukka-navy);
    border-color: var(--yukka-navy);
}
#yukka_category_results {
    transition: opacity .15s ease;
}
@media (max-width: 575px) {
    .yukka_toolbar_row {
        justify-content: space-between;
    }
}

.jshop_pagination {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    margin-top: 8px;
}
.jshop_pagination .pagination {
    display: flex;
    align-items: center;
    gap: 6px;
    list-style: none;
    padding: 0;
    margin: 0;
}
.jshop_pagination .page-item .page-link {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    padding: 0 6px;
    border: 1.5px solid var(--yukka-border);
    border-radius: 8px;
    background: var(--yukka-bg-product);
    color: var(--yukka-navy);
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: border-color .15s ease, background .15s ease, color .15s ease;
}
.jshop_pagination .page-item.active .page-link {
    background: var(--yukka-highlight);
    border-color: var(--yukka-highlight);
    color: #fff;
}
.jshop_pagination .page-item:not(.active):not(.disabled) .page-link:hover {
    border-color: var(--yukka-highlight);
    color: var(--yukka-highlight);
}
.jshop_pagination .page-item.disabled .page-link {
    color: #c7c4bb;
    background: #f7f7f5;
}
.jshop_pagination .pagination_result_counter {
    font-family: var(--yukka-font-body);
    font-size: 13px;
    color: var(--yukka-muted);
}

.yukka_cat_hero_product {
    height: 704px;
    position: relative;
    overflow: hidden;
    margin-bottom: 0;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}
.yukka_cat_hero_product .yukka_cat_hero_slide {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transform: scale(1);
    transition: opacity .6s ease;
}
.yukka_cat_hero_product .yukka_cat_hero_slide.is-active {
    opacity: 1;
    animation: yukka-kenburns-product 7s ease-in-out forwards;
}
@keyframes yukka-kenburns-product {
    from {
        transform: scale(1);
    }
    to {
        transform: scale(1.04);
    }
}
.yukka_cat_hero_product .yukka_cat_hero_overlay {
    position: absolute;
    inset: 0;
    background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.5), transparent);
}
.yukka_cat_hero_product .yukka_cat_hero_content {
    position: absolute;
    left: 0;
    right: 0;
    top: 450px;
    transform: translateY(-50%);
    z-index: 2;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 40px;
}
.yukka_cat_hero_product .yukka_cat_hero_logo {
    height: 56px;
    width: auto;
}
.yukka_product_row {
    margin-top: 150px;
}
@media (max-width: 767px) {
    .yukka_cat_hero_product {
        height: 416px;
    }
    .yukka_cat_hero_product .yukka_cat_hero_content {
        padding: 0 20px;
    }
    .yukka_cat_hero_product .yukka_cat_hero_logo {
        height: 38px;
    }
    .yukka_product_row {
        margin-top: 48px;
    }
}

.yukka_about_collection {
    display: flex;
    gap: 48px;
    align-items: stretch;
    margin: 150px 0 0;
}
.yukka_about_collection_text {
    flex: 0 0 auto;
    width: 380px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.yukka_about_collection_title {
    font-family: var(--yukka-font-display);
    font-size: 27px;
    font-weight: 400;
    color: var(--yukka-navy);
    margin: 0 0 16px;
    text-wrap: balance;
}
.yukka_about_collection_desc {
    font-family: var(--yukka-font-body);
    font-size: 15px;
    line-height: 1.7;
    color: var(--yukka-text);
    margin: 0 0 22px;
}
.yukka_about_collection_link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 700;
    color: var(--yukka-navy);
    text-decoration: none;
}
.yukka_about_collection_link svg {
    width: 17px;
    height: 17px;
    transition: transform .15s ease;
}
.yukka_about_collection_link:hover {
    color: var(--yukka-highlight);
}
.yukka_about_collection_link:hover svg {
    transform: translateX(3px);
}
.yukka_about_collection_gallery {
    position: relative;
    flex: 1 1 auto;
    min-height: 380px;
    border-radius: 12px;
    overflow: hidden;
}
.yukka_about_collection_slide {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transform: scale(1);
    transition: opacity .6s ease;
}
.yukka_about_collection_slide.is-active {
    opacity: 1;
    animation: yukka-about-kenburns 7s ease-in-out forwards;
}
@keyframes yukka-about-kenburns {
    from {
        transform: scale(1);
    }
    to {
        transform: scale(1.04);
    }
}
@media (max-width: 991px) {
    .yukka_about_collection {
        flex-direction: column;
        gap: 24px;
    }
    .yukka_about_collection_text {
        width: auto;
    }
    .yukka_about_collection_gallery {
        min-height: 280px;
    }
}

.yukka_features {
    margin: 150px 0 0;
}
.yukka_features_title {
    font-family: var(--yukka-font-display);
    font-size: 25px;
    font-weight: 400;
    color: var(--yukka-navy);
    margin: 0 0 24px;
}
.yukka_features_grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}
.yukka_feature_card {
    padding: 24px;
    border: 1px solid var(--yukka-border);
    border-radius: 10px;
}
.yukka_feature_icon {
    width: 34px;
    height: 34px;
    color: var(--yukka-green);
    margin-bottom: 16px;
}
.yukka_feature_icon svg {
    width: 100%;
    height: 100%;
}
.yukka_feature_title {
    font-size: 15px;
    font-weight: 700;
    color: var(--yukka-navy);
    margin-bottom: 8px;
}
.yukka_feature_desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--yukka-text);
}
@media (max-width: 991px) {
    .yukka_features_grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 575px) {
    .yukka_features_grid {
        grid-template-columns: 1fr;
    }
}

.yukka_similar {
    margin-top: 150px;
    padding-top: 40px;
    border-top: 1px solid var(--yukka-border);
}
.yukka_similar_head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}
.yukka_similar_title {
    font-family: var(--yukka-font-display);
    font-size: 25px;
    font-weight: 400;
    color: var(--yukka-navy);
    margin: 0;
}
.yukka_similar_nav {
    display: flex;
    gap: 8px;
}
.yukka_similar_arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1.5px solid var(--yukka-border);
    border-radius: 50%;
    background: var(--yukka-bg-product);
    color: var(--yukka-navy);
    cursor: pointer;
    transition: color .15s ease, border-color .15s ease;
}
.yukka_similar_arrow svg {
    width: 18px;
    height: 18px;
}
.yukka_similar_arrow:hover {
    color: var(--yukka-highlight);
    border-color: var(--yukka-highlight);
}
.yukka_similar_arrow:disabled {
    opacity: .35;
    cursor: default;
    pointer-events: none;
}
.yukka_similar_track {
    display: flex;
    gap: 32px;
    overflow-x: auto;
    scroll-snap-type: none;
    scroll-behavior: auto;
    padding-bottom: 4px;
    -ms-overflow-style: none;
    scrollbar-width: none;
    cursor: grab;
}
.yukka_similar_track::-webkit-scrollbar {
    display: none;
}
.yukka_similar_track.is-dragging {
    cursor: grabbing;
    user-select: none;
}
/* "Другие модели этой коллекции" рендерит настоящую карточку товара
   (list_products/product.php — та же, что в сетке категории и в витринах
   "Новинки" на главной), просто в горизонтальной прокрутке вместо грида:
   растягиваем внутренний грид в один нескручивающийся ряд фиксированной
   ширины карточек вместо адаптивных колонок. */
.yukka_similar_track--cards {
    display: block;
    padding-top: 40px;
    margin-top: -40px;
}
.yukka_similar_track--cards .yukka_product_grid_inner {
    display: flex;
    grid-template-columns: none;
    gap: 25px;
    margin: 0;
    width: max-content;
}
.yukka_similar_track--cards .yukka_product_card {
    flex: 0 0 260px;
    width: 260px;
    padding: 32px;
    scroll-snap-align: start;
}
@media (max-width: 575px) {
    .yukka_similar_track--cards .yukka_product_card {
        flex-basis: 220px;
        width: 220px;
        padding: 24px;
    }
}

.yukka_metal_acoustic_story {
    margin-top: 150px;
    padding: 78px 0 0;
    border-top: 1px solid color-mix(in srgb, var(--yukka-green-dark) 18%, transparent);
}
.yukka_metal_acoustic_story_head {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    gap: 74px;
    align-items: start;
    margin-bottom: 56px;
}
.yukka_metal_acoustic_story_intro h2 {
    margin: 14px 0 24px;
    font-family: var(--yukka-font-display);
    font-size: 42px;
    font-weight: 400;
    line-height: 1.05;
    letter-spacing: 0;
    color: var(--yukka-navy);
}
.yukka_metal_acoustic_story_intro p,
.yukka_metal_acoustic_use p {
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 16px;
    line-height: 1.75;
    color: var(--yukka-text);
}
.yukka_metal_acoustic_story_intro p + p,
.yukka_metal_acoustic_use p + p {
    margin-top: 14px;
}
.yukka_metal_acoustic_reasons {
    padding: 34px 38px 36px;
    background: color-mix(in srgb, var(--yukka-bg-product) 86%, #fff);
    border: 1px solid color-mix(in srgb, var(--yukka-green-dark) 14%, transparent);
    border-radius: 8px;
}
.yukka_metal_acoustic_reasons h3,
.yukka_metal_acoustic_use h3 {
    margin: 0 0 24px;
    font-family: var(--yukka-font-display);
    font-size: 28px;
    font-weight: 400;
    line-height: 1.16;
    color: var(--yukka-navy);
}
.yukka_metal_acoustic_reasons ul {
    display: grid;
    gap: 18px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.yukka_metal_acoustic_reasons li {
    display: grid;
    grid-template-columns: 94px minmax(0, 1fr);
    gap: 18px;
    align-items: baseline;
    padding-top: 18px;
    border-top: 1px solid color-mix(in srgb, var(--yukka-green-dark) 14%, transparent);
}
.yukka_metal_acoustic_reasons li:first-child {
    padding-top: 0;
    border-top: 0;
}
.yukka_metal_acoustic_reasons strong {
    font-family: var(--yukka-font-display);
    font-size: 24px;
    font-weight: 400;
    line-height: 1;
    color: var(--yukka-green-dark);
    white-space: nowrap;
}
.yukka_metal_acoustic_reasons span {
    font-family: var(--yukka-font-body);
    font-size: 15px;
    line-height: 1.55;
    color: var(--yukka-text);
}
.yukka_metal_acoustic_gallery {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 28px;
}
.yukka_metal_acoustic_photo {
    grid-column: span 4;
    margin: 0;
    overflow: hidden;
    aspect-ratio: 4 / 2.65;
    background: var(--yukka-bg-product);
}
.yukka_metal_acoustic_photo--wide {
    grid-column: span 4;
}
.yukka_metal_acoustic_gallery_link {
    display: block;
    width: 100%;
    height: 100%;
    color: inherit;
    text-decoration: none;
    cursor: zoom-in;
}
.yukka_metal_acoustic_gallery_link img,
.yukka_metal_acoustic_photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .45s ease;
}
.yukka_metal_acoustic_photo:hover .yukka_metal_acoustic_gallery_link img,
.yukka_metal_acoustic_photo:hover img {
    transform: scale(1.035);
}
.yukka_metal_acoustic_use {
    grid-column: span 4;
    align-self: stretch;
    padding: 38px 34px;
    background: var(--yukka-bg-product);
    border-left: 3px solid var(--yukka-green-dark);
}
.yukka_metal_where_buy {
    display: grid;
    grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr);
    gap: 64px;
    align-items: end;
    margin-top: 150px;
    padding: 54px 0 0;
    border-top: 1px solid color-mix(in srgb, var(--yukka-green-dark) 18%, transparent);
}
.yukka_metal_where_buy_text h2 {
    margin: 14px 0 24px;
    font-family: var(--yukka-font-display);
    font-size: 42px;
    font-weight: 400;
    line-height: 1.05;
    letter-spacing: 0;
    color: var(--yukka-navy);
}
.yukka_metal_where_buy_text p {
    max-width: 460px;
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 16px;
    line-height: 1.75;
    color: var(--yukka-text);
}
.yukka_metal_where_buy_cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}
.yukka_metal_where_buy_card {
    min-height: 206px;
    padding: 28px 26px;
    background: var(--yukka-bg-product);
    border: 1px solid color-mix(in srgb, var(--yukka-green-dark) 12%, transparent);
    border-radius: 8px;
}
.yukka_metal_where_buy_card span {
    display: block;
    margin-bottom: 34px;
    font-family: var(--yukka-font-display);
    font-size: 26px;
    line-height: 1;
    color: var(--yukka-green-dark);
}
.yukka_metal_where_buy_card strong {
    display: block;
    margin-bottom: 12px;
    font-family: var(--yukka-font-body);
    font-size: 15px;
    line-height: 1.35;
    color: var(--yukka-navy);
}
.yukka_metal_where_buy_card p {
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    line-height: 1.6;
    color: var(--yukka-text);
}
.yukka_metal_where_buy_actions {
    grid-column: 2;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 30px;
    margin-top: 32px;
}
.yukka_metal_where_buy_link {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid color-mix(in srgb, var(--yukka-green-dark) 28%, transparent);
    font-family: var(--yukka-font-body);
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--yukka-navy);
    text-decoration: none;
    transition: color .25s ease, border-color .25s ease;
}
.yukka_metal_where_buy_link svg {
    flex: 0 0 auto;
    transition: transform .25s ease;
}
.yukka_metal_where_buy_link:hover {
    color: var(--yukka-green-dark);
    border-color: var(--yukka-green-dark);
}
.yukka_metal_where_buy_link:hover svg {
    transform: translateX(4px);
}
.yukka_metal_where_buy_phone {
    font-family: var(--yukka-font-display);
    font-size: 24px;
    line-height: 1;
    color: var(--yukka-green-dark);
    text-decoration: none;
    white-space: nowrap;
}
@media (max-width: 991px) {
    .yukka_metal_acoustic_story_head {
        grid-template-columns: 1fr;
        gap: 32px;
    }
    .yukka_metal_acoustic_photo,
    .yukka_metal_acoustic_photo--wide,
    .yukka_metal_acoustic_use {
        grid-column: span 6;
    }
    .yukka_metal_where_buy {
        grid-template-columns: 1fr;
        gap: 34px;
    }
    .yukka_metal_where_buy_actions {
        grid-column: 1;
        justify-content: flex-start;
    }
}
@media (max-width: 575px) {
    .yukka_metal_acoustic_story {
        margin-top: 72px;
        padding-top: 46px;
    }
    .yukka_metal_acoustic_story_intro h2 {
        font-size: 30px;
    }
    .yukka_metal_acoustic_reasons {
        padding: 26px 22px;
    }
    .yukka_metal_acoustic_reasons li {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .yukka_metal_acoustic_gallery {
        grid-template-columns: 1fr;
        gap: 18px;
    }
    .yukka_metal_acoustic_photo,
    .yukka_metal_acoustic_photo--wide,
    .yukka_metal_acoustic_use {
        grid-column: 1;
    }
    .yukka_metal_acoustic_use {
        padding: 28px 22px;
    }
    .yukka_metal_where_buy {
        margin-top: 72px;
        padding-top: 44px;
    }
    .yukka_metal_where_buy_text h2 {
        font-size: 30px;
    }
    .yukka_metal_where_buy_cards {
        grid-template-columns: 1fr;
    }
    .yukka_metal_where_buy_card {
        min-height: 0;
        padding: 24px 22px;
    }
    .yukka_metal_where_buy_card span {
        margin-bottom: 22px;
    }
    .yukka_metal_where_buy_actions {
        flex-direction: column;
        align-items: flex-start;
        gap: 22px;
    }
    .yukka_metal_where_buy_phone {
        font-size: 22px;
    }
}
.yukka_gallery_row {
    display: flex;
    margin-bottom: 40px;
}
.yukka_gallery_row--has-note {
    margin-bottom: 66px;
}
/* Ссылка "Галерея" не участвует в потоке (position:absolute) — не должна
   пропадать/двигаться, когда колонка миниатюр схлопывается/раскрывается.
   Место под неё резервируем padding-top на самом ряду. */
.yukka_gallery_row--has-thumbs {
    position: relative;

}
.yukka_gallery_toggle_btn {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0;
    border: 0;
    background: none;
    font-family: var(--yukka-font-body);
    font-size: 17px;
    color: var(--yukka-navy);
    cursor: pointer;
    white-space: nowrap;
}
.yukka_gallery_toggle_btn:hover {
    color: var(--yukka-highlight);
}
#yukka_gallery_toggle_btn[data-tooltip]::after {
    left: 0;
    transform: translateY(-4px);
}
#yukka_gallery_toggle_btn[data-tooltip]::before {
    left: 12px;
    transform: translateY(-4px) rotate(180deg);
}
#yukka_gallery_toggle_btn[data-tooltip]:hover::after,
#yukka_gallery_toggle_btn[data-tooltip]:focus-visible::after {
    transform: translateY(0);
}
#yukka_gallery_toggle_btn[data-tooltip]:hover::before,
#yukka_gallery_toggle_btn[data-tooltip]:focus-visible::before {
    transform: translateY(0) rotate(180deg);
}
.yukka_gallery_toggle_icon {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
  stroke: var(--yukka-muted);
}
.yukka_gallery_toggle_chevron {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
    transition: transform .25s ease;
}
.yukka_gallery_toggle_btn[aria-expanded="true"] .yukka_gallery_toggle_chevron {
    transform: rotate(180deg);
}
/* Колонка миниатюр — схлопывается по ширине, поэтому основное фото рядом
   (flex: 1 1 auto) плавно занимает освободившееся место без своего
   отдельного transition — просто следует за пересчётом flex-раскладки
   на каждом кадре анимации ширины соседа. */
.yukka_gallery_thumbs_col {
    flex: 0 0 auto;
    width: 56px;
    margin-right: 24px;
    overflow: hidden;
    opacity: 1;
    transform: translateX(0);
    transition: width .35s ease, margin-right .35s ease, opacity .18s ease, transform .18s ease;
}
.yukka_gallery_thumbs_col.is-collapsed {
    width: 0;
    margin-right: 0;
    opacity: 0;
    transform: translateX(-8px);
    pointer-events: none;
}
.yukka_gallery_thumbs {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 14px;
    width: 56px;
    margin-top: 40px;
}
.yukka_gallery_thumb {
    padding: 0;
    border: 1.5px solid var(--yukka-border);
    border-radius: 6px;
    overflow: hidden;
    background: #f7f7f5;
    cursor: pointer;
    width: 56px;
    height: 56px;
    flex: 0 0 auto;
    transition: border-color .2s ease;
}
.yukka_gallery_thumb:hover, .yukka_gallery_thumb.is-active {
    border-color: var(--yukka-highlight);
}
.yukka_gallery_thumb img, .jshop_video_thumb {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.yukka_gallery_main_wrap {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
    touch-action: pan-y;
}
.yukka_gallery_main_wrap.is-dragging {
    cursor: grabbing;
    user-select: none;
}
.yukka_gallery_main_wrap.is-dragging .yukka_gallery_main_link img {
    pointer-events: none;
}
.yukka_gallery_main {
    position: relative;
    width: 100%;
    aspect-ratio: 290 / 654;
    max-height: 640px;
    border-radius: 10px;
    overflow: hidden;
    cursor: zoom-in;
}
.yukka_gallery_main_link {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity .35s ease;
    pointer-events: none;
}
.yukka_gallery_main_link.is-active {
    opacity: 1;
    pointer-events: auto;
}
.yukka_gallery_main_link img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
.yukka_gallery_nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: none;
    background: var(--yukka-bg-product);
    box-shadow: 0 2px 12px rgba(4, 30, 66, 0.18);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    line-height: 1;
    color: var(--yukka-navy);
    cursor: pointer;
    opacity: 0;
    transition: opacity .2s ease, transform .15s ease;
    z-index: 5;
}
.yukka_gallery_main_wrap:hover .yukka_gallery_nav {
    opacity: 1;
}
.yukka_gallery_nav:hover {
    transform: translateY(-50%) scale(1.08);
}
.yukka_gallery_nav_prev {
    left: -18px;
}
.yukka_gallery_nav_next {
    right: -18px;
}
@media (max-width: 480px) {
    .yukka_gallery_nav {
        display: none;
    }
}
.yukka_gallery_colorinfo {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    margin-top: 14px;
    font-size: 17px;
    color: var(--yukka-navy);
    text-align: center;
}
.yukka_gallery_photo_note {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 8px;
    font-family: var(--yukka-font-body);
    font-size: 12.5px;
    color: var(--yukka-muted);
}
.yukka_gallery_photo_note_icon {
    display: inline-flex;
    flex: 0 0 auto;
    width: 15px;
    height: 15px;
    color: #b7b4ab;
    cursor: help;
}
.yukka_gallery_photo_note_icon svg {
    width: 100%;
    height: 100%;
}
.yukka_gallery_photo_note_icon:hover {
    color: var(--yukka-highlight);
}
.yukka_metal_about {
    margin-top: 26px;
    padding-top: 22px;
    border-top: 1px solid var(--yukka-border);
}
.yukka_metal_about_title {
    margin: 0 0 10px;
    font-family: var(--yukka-font-display);
    font-weight: 400;
    font-size: 18px;
    color: var(--yukka-navy);
}
.yukka_metal_about_text {
    margin: 0 0 16px;
    font-family: var(--yukka-font-body);
    font-size: 14.5px;
    line-height: 1.7;
    color: var(--yukka-text);
}
.yukka_metal_about_stock {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px;
    padding: 12px 16px;
    border-radius: 8px;
    background: var(--yukka-bg-product);
}
.yukka_metal_about_stock_label {
    font-family: var(--yukka-font-body);
    font-size: 12px;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--yukka-muted);
}
.yukka_metal_about_stock_value {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 700;
    color: var(--yukka-navy);
}
.yukka_price_top_row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}
.yukka_product_perks {
    display: flex;
    align-items: center;
    gap: 22px;
    flex: 0 0 auto;
}
.yukka_product_perk {
    flex: 0 0 auto;
    display: flex;
    color: var(--yukka-muted);
    transition: color .15s ease;
}
.yukka_product_perk:hover {
    color: var(--yukka-navy);
}
.yukka_product_perk svg {
    width: 26px;
    height: 26px;
    display: block;
}
@media (max-width: 480px) {
    .yukka_product_perks {
        gap: 16px;
    }
    .yukka_product_perk svg {
        width: 22px;
        height: 22px;
    }
}
.yukka_gallery_color_surcharge {
    font-weight: 700;
    color: var(--yukka-green-dark);
    margin-left: 6px;
}
.yukka_gallery_main.is-recoloring::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.55);
    z-index: 6;
    animation: yukka-recolor-pulse 1s ease-in-out infinite;
}
@keyframes yukka-recolor-pulse {
    0%, 100% {
        opacity: 0.35;
    }
    50% {
        opacity: 0.7;
    }
}
@media (max-width: 767px) {
    .yukka_gallery_row {
        flex-direction: column;
    }
    .yukka_gallery_row--has-thumbs {
        padding-top: 30px;
    }
    .yukka_gallery_thumbs_col {
        width: auto;
        max-height: 66px;
        margin-right: 0;
        margin-bottom: 24px;
        overflow-x: auto;
        overflow-y: hidden;
        transition: max-height .35s ease, margin-bottom .35s ease, opacity .25s ease;
    }
    .yukka_gallery_thumbs_col.is-collapsed {
        max-height: 0;
        margin-bottom: 0;
    }
    .yukka_gallery_thumbs {
        flex-direction: row;
    }
}

.yukka_product_title {
    font-family: var(--yukka-font-display);
    font-weight: 400;
  font-size: 50px;
    line-height: 1.2;
    color: var(--yukka-navy);
    margin: 0 0 10px;
}
.yukka_product_row .col-lg-4 {
    padding-right: 100px;
}
.yukka_product_row .col-lg-8 {
}
@media (min-width: 992px) {
    .yukka_product_row .col-lg-4 {
        width: 50%;
    }
    .yukka_product_row .col-lg-8 {
        width: 50%;
        background: var(--yukka-bg-product);        

    }
}
@media (max-width: 991px) {
    .yukka_product_row .col-lg-4, .yukka_product_row .col-lg-8 {
        padding-left: 15px;
        padding-right: 15px;
    }
}
.jshop_oiproduct {
    position: relative;
}
.yukka_meta_row {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
    margin-bottom: 12px;
    flex-wrap: wrap;
    position: absolute;
  bottom: 155px;
}
.yukka_meta_rating {
    display: flex;
    align-items: center;
    gap: 6px;
}
.yukka_star {
    fill: #e3e1da;
}
.yukka_star.is-filled {
    fill: var(--yukka-orange);
}
.yukka_meta_rating_value {
    font-size: 13px;
    font-weight: 600;
    color: var(--yukka-text);
}
.yukka_meta_reviews {
    font-size: 13px;
    color: var(--yukka-muted);
}
.yukka_meta_divider {
    height: 1px;
    background: var(--yukka-border);
    margin-bottom: 22px;
}

.yukka_price_block {
    margin: 12px 0;
}
.yukka_price_block_foot {
    margin: 20px 0 30px 0px;
    text-align: right;
}
.yukka_price_block_foot .yukka_price_top_row, .yukka_price_block_foot .yukka_price_row {
    justify-content: flex-end;
}
.yukka_price_row {
    display: flex;
    align-items: baseline;
    gap: 14px;
    flex-wrap: wrap;
}
.yukka_price_current {
    font-family: var(--yukka-font-display);
    font-size: 31px;
    font-weight: 600;
    color: var(--yukka-navy);
}
.yukka_price_old {
    font-size: 16px;
    text-decoration: line-through;
    color: #999;
}
.yukka_price_caption {
    font-size: 13px;
    color: var(--yukka-muted);
    transition: opacity .15s ease, transform .15s ease;
}
.yukka_cart_status {
    font-size: 13px;
    color: #666;
    margin-top: 6px;
    min-height: 1em;
}
.yukka_color_block {
    margin: 16px 0;
}
.yukka_enamel_block {
    margin-top: 26px;
    padding-top: 22px;
    border-top: 1px solid var(--yukka-border);
}
.yukka_color_title {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 12px;
}
.yukka_color_tiles {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.yukka_color_tiles:not(.is-expanded) .yukka_color_tile:nth-child(n+12) {
    display: none;
}
.yukka_color_tile {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    padding: 1px;
    margin: 0;
    border: 2px solid #fff;
    border-radius: 50%;
    overflow: hidden;
    cursor: pointer;    
    box-shadow: 0 0 0 1px #d1d1d1;
}
.yukka_color_tile img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 50%;
}
.yukka_color_tile.is-selected {
    border-color: #dbdbdb;
}
.yukka_color_more {
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border-radius: 8px;
    border: none;
    background: #f0efe9;
    color: var(--yukka-navy);
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.yukka_color_more:hover {
    background: var(--yukka-border);
}
.yukka_color_more.is-collapse {
    width: auto;
    height: 34px;
    padding: 0 16px;
    border-radius: 17px;
    margin: 2px 0;
}
.yukka_color_surcharge {
    margin-top: 10px;
    font-size: 13px;
    color: #666;
}
.yukka_patina_block {
    margin: 22px 0;
}
.yukka_patina_types {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.yukka_patina_type {
    padding: 8px 16px;
    border: 1.5px solid var(--yukka-border);
    border-radius: 20px;
    background: var(--yukka-bg-product);
    color: var(--yukka-text);
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
}
.yukka_patina_type.is-selected {
    border-color: var(--yukka-navy);
    background: var(--yukka-navy);
    color: #fff;
}
.yukka_patina_sides_row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 14px;
    flex-wrap: wrap;
}
.yukka_patina_sides {
    display: flex;
    gap: 8px;
}
.yukka_patina_side_btn {
    padding: 8px 16px;
    border: 1.5px solid var(--yukka-border);
    border-radius: 20px;
    background: var(--yukka-bg-product);
    color: var(--yukka-text);
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
}
.yukka_patina_side_btn.is-selected {
    border-color: var(--yukka-navy);
    background: var(--yukka-navy);
    color: #fff;
}
.yukka_patina_price {
    font-size: 14px;
    font-weight: 700;
    color: var(--yukka-green-dark);
}

.yukka_section_title {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 12px;
}
.yukka_size_block, .yukka_kit_block {
    margin: 22px 0;
}
.yukka_size_options {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.yukka_size_option {
    padding: 10px 16px;
    border-radius: 4px;
    border: 1.5px solid var(--yukka-border);
    background: var(--yukka-bg-product);
    color: var(--yukka-text);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}
.yukka_size_option.is-selected {
    border-color: var(--yukka-navy);
    background: var(--yukka-navy);
    color: #fff;
}

.yukka_kit_options {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.yukka_kit_option {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 16px;
    border-radius: 6px;
    border: 1.5px solid var(--yukka-border);
    background: var(--yukka-bg-product);
    cursor: pointer;
}
.yukka_kit_option > div:first-child {
    flex: 1 1 auto;
    min-width: 0;
}
.yukka_kit_option.is-selected {
    border-color: var(--yukka-ink);
    background: #faf9f6;
}
.yukka_kit_option::before {
    content: '';
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
    border-radius: 50%;
    border: 1.5px solid var(--yukka-border);
    background-color: var(--yukka-bg-product);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 11px;
}
.yukka_kit_option.is-selected::before {
    border-color: var(--yukka-ink);
    background-color: var(--yukka-ink);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
}
.yukka_kit_name {
    font-size: 14px;
    font-weight: 600;
}
.yukka_kit_desc {
    font-size: 14px;
    color: var(--yukka-muted);
    margin-top: 2px;
}
.yukka_kit_delta {
    font-size: 13px;
    font-weight: 700;
    color: var(--yukka-green-dark);
    white-space: nowrap;
}

.yukka_furniture_block {
    margin: 22px 0;
}
.yukka_furniture_hint {
    margin: 0 0 16px;
    font-size: 13px;
    color: var(--yukka-muted);
}
.yukka_furniture_brands {
    display: flex;
    gap: 8px;
    margin: 0 0 16px;
}
.yukka_furniture_brand_btn {
    padding: 9px 18px;
    border-radius: 999px;
    border: 1.5px solid var(--yukka-border);
    background: var(--yukka-bg-product);
    color: var(--yukka-text);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}
.yukka_furniture_brand_btn.is-active {
    border-color: var(--yukka-navy);
    background: var(--yukka-navy);
    color: #fff;
}
.yukka_furniture_select {
    display: block;
    width: 100%;
    appearance: none;
    -webkit-appearance: none;
    border: 1.5px solid var(--yukka-border);
    border-radius: 6px;
    padding: 12px 36px 12px 14px;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: var(--yukka-navy);
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23041e42' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") no-repeat right 12px center;
    background-size: 14px;
    cursor: pointer;
}
.yukka_furniture_select:focus {
    outline: none;
    border-color: var(--yukka-highlight);
}
.yukka_furniture_select[hidden] {
    display: none;
}
.yukka_furniture_total {
    margin-top: 14px;
    font-size: 14px;
    font-weight: 700;
    color: var(--yukka-green-dark);
}

.yukka_buy_row {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin-bottom: 8px;
}
.yukka_buttons--simple {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
    justify-content: flex-end;
}
.yukka_buttons--simple .prod_qty,
.yukka_buttons--simple .prod_qty_input {
    display: flex;
    align-items: center;
}
.yukka_simple_qty_label {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 600;
    color: var(--yukka-navy);
}
.yukka_simple_qty_input {
    width: 64px;
    border: 1.5px solid var(--yukka-border);
    border-radius: 6px;
    padding: 10px 12px;
    font-family: var(--yukka-font-body);
    font-size: 15px;
    color: var(--yukka-navy);
}
.yukka_buttons--simple .buttons.product-buttons {
    width: auto;
}
.yukka_buttons--simple .yukka_simple_buy_btn {
    flex: 0 0 auto;
    min-width: 200px;
}
.yukka_qty_stepper {
    flex: 0 0 auto;
    align-self: flex-start;
    display: flex;
    align-items: center;
    border: 1.5px solid var(--yukka-border);
    border-radius: 6px;
    overflow: hidden;
}
.yukka_qty_btn {
    width: 38px;
    height: 44px;
    border: none;
    background: var(--yukka-bg-product);
    font-size: 18px;
    color: var(--yukka-navy);
    cursor: pointer;
    line-height: 1;
}
.yukka_qty_btn:hover {
    background: #f7faf0;
}
.yukka_qty_value {
    width: 40px;
    height: 44px;
    border: none;
    border-left: 1.5px solid var(--yukka-border);
    border-right: 1.5px solid var(--yukka-border);
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    color: var(--yukka-navy);
    -moz-appearance: textfield;
}
.yukka_qty_value::-webkit-outer-spin-button, .yukka_qty_value::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.yukka_qty_total {
    font-size: 13px;
    color: var(--yukka-muted);
    margin-bottom: 14px;
    text-align: right;
}
.yukka_qty_total span {
    color: var(--yukka-navy);
    font-weight: 700;
}

.yukka_icon_btn {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    padding: 0;
    border: none;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.yukka_icon_btn svg {
    width: 20px;
    height: 20px;
}
.yukka_icon_btn_muted {
    background: var(--yukka-bg-product);
    border: 1.5px solid var(--yukka-border);
    color: var(--yukka-muted);
}
.yukka_icon_btn_muted:hover {
    border-color: var(--yukka-ink);
    color: var(--yukka-ink);
}
#yukka_btn_buy_now.yukka_btn_dark {
    background-color: var(--yukka-ink) !important;
    border-color: var(--yukka-ink) !important;
    color: #fff !important;
}

.product-buttons {
    display: flex !important;
    gap: 12px;
    padding-left: 0 !important;
    width: 100%;
}
.product-buttons .btn {
    flex: 1;
    padding: 16px !important;
    border-radius: 6px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.2;
}
#yukka_btn_buy_now.yukka_btn_dark:hover {
    background-color: #000 !important;
    border-color: #000 !important;
}
.yukka_wishlist_link {
    margin-top: 8px;
}
.yukka_wishlist_link .btn-link {
    padding: 0;
    font-size: 13px;
    color: var(--yukka-muted);
    text-decoration: underline;
    background: none;
    border: none;
}
.yukka_wishlist_link .btn-link:hover {
    color: var(--yukka-highlight);
}

.yukka_modal_overlay {
    position: fixed;
    inset: 0;
    background: rgba(4, 30, 66, 0.45);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.yukka_modal {
    position: relative;
    background: var(--yukka-bg-product);
    border-radius: 8px;
    padding: 28px;
    width: 100%;
    max-width: 380px;
}
.yukka_modal h3 {
    margin: 0 0 8px;
    font-size: 20px;
}
.yukka_modal_hint {
    font-size: 13px;
    color: var(--yukka-muted);
    margin: 0 0 18px;
}
.yukka_modal_label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--yukka-navy);
    margin-bottom: 12px;
}
.yukka_modal_input {
    display: block;
    width: 100%;
    margin-top: 6px;
    padding: 10px 12px;
    border: 1.5px solid var(--yukka-border);
    border-radius: 6px;
    font-size: 14px;
    font-family: var(--yukka-font-body);
}
.yukka_modal #yukka_buynow_submit {
    width: 100%;
    margin-top: 6px;
}
.yukka_modal_close {
    position: absolute;
    top: 14px;
    right: 14px;
    border: none;
    background: none;
    font-size: 22px;
    line-height: 1;
    color: var(--yukka-muted);
    cursor: pointer;
}
.yukka_modal_status {
    font-size: 13px;
    color: #666;
    margin: 10px 0 0;
    min-height: 1em;
}

.yukka_color_extra_btns {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.yukka_ral_open_btn {
    display: inline-flex;
    align-items: center;
    margin-top: 18px;
    padding: 10px 20px;
    border: 1.5px solid var(--yukka-navy);
    border-radius: 20px;
    background: var(--yukka-bg-product);
    color: var(--yukka-navy);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
}
.yukka_ral_open_btn:hover {
    background: var(--yukka-navy);
    color: #fff;
}
.yukka_ral_open_btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}
.yukka_ral_open_btn:disabled:hover {
    background: var(--yukka-bg-product);
    color: var(--yukka-navy);
}
.yukka_color_reset_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 18px;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1.5px solid var(--yukka-border);
    border-radius: 50%;
    background: var(--yukka-bg-product);
    color: var(--yukka-muted);
    cursor: pointer;
}
.yukka_color_reset_btn svg {
    width: 18px;
    height: 18px;
}
.yukka_color_reset_btn:hover {
    color: var(--yukka-highlight);
    border-color: var(--yukka-highlight);
}

.yukka_ral_modal_overlay {
    position: fixed;
    inset: 0;
    background: var(--yukka-overlay-bg);
    z-index: 1060;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.yukka_ral_modal {
    position: relative;
    background: var(--yukka-bg-product);
    border-radius: 10px;
    padding: 24px;
    width: 100%;
    max-width: 720px;
    max-height: 84vh;
    display: flex;
    flex-direction: column;
}
.yukka_ral_modal_header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.yukka_ral_search_input {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    padding: 10px 14px;
    margin-bottom: 14px;
    border: 1.5px solid var(--yukka-border);
    border-radius: 6px;
    font-size: 14px;
    font-family: var(--yukka-font-body);
    flex: 0 0 auto;
    background: var(--yukka-bg-product);
}
.yukka_ral_search_input:focus {
    outline: none;
    border-color: var(--yukka-highlight);
}
.yukka_ral_search_empty {
    text-align: center;
    color: var(--yukka-muted);
    font-size: 13px;
    padding: 20px 0;
    margin: 0;
}
.yukka_ral_modal_tile.is-search-hidden {
    display: none;
}
.yukka_ral_modal_header h3 {
    margin: 0;
    font-size: 18px;
}
.yukka_ral_modal_header .yukka_modal_close {
    position: static;
}
.yukka_ral_modal_loader {
    position: absolute;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    background: #f2f2f2;
    z-index: 5;
}
.yukka_ral_modal_loader.is-active {
    display: flex;
}
.yukka_ral_modal_grid {
    position: relative;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(84px, 1fr));
    gap: 12px;
    overflow-y: auto;
    padding-right: 4px;
    padding-top: 30px;
    margin-top: -30px;
}
.yukka_ral_modal_tile {
    position: relative;
    width: 100%;
    height: auto;
    aspect-ratio: 1/1;
    padding: 0;
    border-radius: 6px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform .15s ease, box-shadow .15s ease;
}
.yukka_ral_modal_tile img {
    flex: 1 1 auto;
    min-height: 0;
    border-radius: 5px 5px 0 0;
}
.yukka_ral_modal_tile_label {
    font-size: 9.5px;
    line-height: 1.2;
    padding: 3px 4px;
    color: var(--yukka-text);
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.yukka_ral_modal_tile.is-selected {
    border-color: var(--yukka-highlight);
    box-shadow: 0 0 0 2px rgba(104, 82, 43, 0.35);
}
.yukka_ral_modal_tile:hover, .yukka_ral_modal_tile:focus-visible {
    transform: translateY(-4px);
    z-index: 3;
    box-shadow: 0 8px 18px rgba(4, 30, 66, 0.26);
}
.yukka_ral_modal_tile::after {
    content: attr(data-name);
    position: absolute;
    left: 50%;
    bottom: 100%;
    max-width: 150px;
    margin-bottom: 8px;
    background: var(--yukka-navy);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
    padding: 6px 10px;
    border-radius: 6px;
    white-space: normal;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, 4px);
    transition: opacity .15s ease, transform .15s ease;
    z-index: 4;
    box-shadow: 0 6px 16px rgba(4, 30, 66, 0.28);
}
.yukka_ral_modal_tile:hover::after, .yukka_ral_modal_tile:focus-visible::after {
    opacity: 1;
    transform: translate(-50%, 0);
}
@media (max-width: 575px) {
    .yukka_ral_modal_grid {
        grid-template-columns: repeat(auto-fill, minmax(68px, 1fr));
    }
}

.yukka_ncs_modal {
    max-height: none;
}
.yukka_ncs_hint {
    margin: 0 0 16px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--yukka-muted);
}
.yukka_ncs_input_row {
    display: flex;
    align-items: center;
    gap: 12px;
}
.yukka_ncs_code_input {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
    margin-bottom: 0;
}
.yukka_ncs_preview_swatch {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    border-radius: 8px;
    border: 1.5px solid var(--yukka-border);
    background: #f2f2f2;
}
.yukka_ncs_status {
    min-height: 1.3em;
    margin: 10px 0 0;
    font-size: 13px;
    color: var(--yukka-muted);
}
.yukka_ncs_apply_btn {
    align-self: flex-start;
}

.yukka_offcanvas_overlay {
    position: fixed;
    inset: 0;
    z-index: 1070;
    background: var(--yukka-overlay-bg);
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease, visibility 0s linear .25s;
}
.yukka_offcanvas_overlay.is-open {
    opacity: 1;
    visibility: visible;
    transition: opacity .25s ease;
}
.yukka_offcanvas_panel {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
  max-width: 640px;
    background: var(--yukka-bg-product);
    box-shadow: -12px 0 32px rgba(4, 30, 66, 0.22);
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform .3s ease;
  padding: 30px;
}
.yukka_offcanvas_overlay.is-open .yukka_offcanvas_panel {
    transform: translateX(0);
}
.yukka_offcanvas_header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 22px 24px;
    border-bottom: 1px solid var(--yukka-border);
}
.yukka_offcanvas_title {
    font-size: 30px;    
    font-family: var(--yukka-font-body);
}
.yukka_offcanvas_header .yukka_modal_close {
    position: static;
    flex: 0 0 auto;
}
.yukka_offcanvas_body {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 24px;
}
.yukka_offcanvas_pane {
    display: none;
}
.yukka_offcanvas_pane.is-active {
    display: block;
}
body.yukka-offcanvas-locked {
    overflow: hidden;
}

.yukka_order_steps {
    display: flex;
    gap: 8px;
    margin-bottom: 24px;
}
.yukka_order_step_dot {
    flex: 1 1 auto;
    padding: 8px 4px;
    text-align: center;
    font-family: var(--yukka-font-body);
    font-size: 15px;
    color: var(--yukka-muted);
    border-bottom: 2px solid var(--yukka-border);
}
.yukka_order_step_dot.is-active {
    color: var(--yukka-navy);
    border-bottom-color: var(--yukka-green);
}
.yukka_order_step {
    display: none;
    flex-direction: column;
    gap: 40px;
    opacity: 0;
    transform: translateX(var(--yukka-step-offset, 0px));
    transition: opacity .18s ease, transform .18s ease;
}
.yukka_order_step.is-active {
    display: flex;
}
.yukka_order_step.is-active.is-visible {
    opacity: 1;
    transform: translateX(0);
}
.yukka_order_type_toggle {
    display: flex;
    gap: 8px;
}
.yukka_order_type_btn {
    flex: 1 1 auto;
    padding: 10px;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: var(--yukka-text);
    background: var(--yukka-bg);
    border: 1px solid var(--yukka-border);
    border-radius: 8px;
    cursor: pointer;
}
.yukka_order_type_btn.is-active {
    color: #fff;
    background: var(--yukka-navy);
    border-color: var(--yukka-navy);
}
.yukka_order_label {
    display: flex;
    flex-direction: column;
    gap: 20px;
    font-family: var(--yukka-font-body);
    font-size: 13px;
    color: var(--yukka-text);
}
.yukka_select {
    position: relative;
}
.yukka_select[hidden] {
    display: none;
}
.yukka_select_native {
    display: none;
}
.yukka_select_trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    padding: 12px 14px;
    text-align: left;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 400;
    color: var(--yukka-navy);
    background: var(--yukka-bg-product);
    border: 1px solid var(--yukka-border);
    border-radius: 8px;
    cursor: pointer;
}
.yukka_select_trigger_text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.yukka_select_trigger svg {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    color: var(--yukka-muted);
    transition: transform .2s ease;
}
.yukka_select.is-open .yukka_select_trigger svg {
    transform: rotate(180deg);
}
.yukka_select_dropdown {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 6px);
    z-index: 60;
    display: flex;
    flex-direction: column;
    max-height: 280px;
    overflow-y: auto;
    background: var(--yukka-bg-product);
    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(4, 30, 66, 0.24);
    opacity: 0;
    visibility: hidden;
    transform: translateY(4px);
    transition: opacity .15s ease, transform .15s ease;
}
.yukka_select.is-open .yukka_select_dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.yukka_select_option {
    padding: 10px 14px;
    text-align: left;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    line-height: 1.45;
    color: var(--yukka-text);
    background: none;
    border: none;
    border-bottom: 1px solid var(--yukka-border);
    cursor: pointer;
}
.yukka_select_option:last-child {
    border-bottom: none;
}
.yukka_select_option:hover {
    background: var(--yukka-bg);
}
.yukka_select_option.is-active {
    color: var(--yukka-navy);
    font-weight: 700;
    background: var(--yukka-tag-bg);
}
.yukka_furniture_block .yukka_select {
    width: 100%;
}
.yukka_furniture_block .yukka_select_trigger {
    min-height: 46px;
    background: #fff;
}
.yukka_furniture_block .yukka_select_dropdown {
    top: calc(100% + 2px);
    background: #fff;
    border: 1px solid var(--yukka-border);
    border-radius: 8px;
    box-shadow: 0 10px 24px rgba(4, 30, 66, 0.16);
}
.yukka_order_checkbox {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 11px 14px;
    font-family: var(--yukka-font-body);
    font-size: 13px;
    font-weight: 400;
    color: var(--yukka-text);
    background: var(--yukka-bg);
    border: 1px solid var(--yukka-border);
    border-radius: 8px;
    cursor: pointer;
}
.yukka_order_checkbox input {
    flex: 0 0 auto;
    margin-top: 2px;
}
.yukka_order_input {
    padding: 12px 14px;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 400;
    color: var(--yukka-navy);
    background: var(--yukka-bg-product);
    border: 1px solid var(--yukka-border);
    border-radius: 8px;
}
.yukka_order_model_results {
    position: relative;
    display: none;
    flex-direction: column;
    max-height: 240px;
    overflow-y: auto;
    border: 1px solid var(--yukka-border);
    border-radius: 8px;
}
.yukka_order_model_results.is-open {
    display: flex;
}
.yukka_order_model_result {
    padding: 10px 14px;
    text-align: left;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: var(--yukka-text);
    background: var(--yukka-bg-product);
    border: none;
    border-bottom: 1px solid var(--yukka-border);
    cursor: pointer;
}
.yukka_order_model_result:last-child {
    border-bottom: none;
}
.yukka_order_model_result:hover {
    background: var(--yukka-bg);
}
.yukka_order_model_empty {
    padding: 10px 14px;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: var(--yukka-muted);
}
.yukka_order_selected_model {
    padding: 12px 14px;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: var(--yukka-navy);
    background: var(--yukka-tag-bg);
    border-radius: 8px;
}
.yukka_order_step_hint {
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 13px;
    color: var(--yukka-muted);
}
.yukka_order_pogonazh_list {
    display: flex;
    flex-direction: column;
    gap: 2px;
    max-height: 320px;
    overflow-y: auto;
    border: 1px solid var(--yukka-border);
    border-radius: 8px;
}
.yukka_order_pogonazh_item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 14px;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: var(--yukka-text);
    border-bottom: 1px solid var(--yukka-border);
    cursor: pointer;
}
.yukka_order_pogonazh_item:last-child {
    border-bottom: none;
}
.yukka_order_pogonazh_item input {
    flex: 0 0 auto;
}
.yukka_order_pogonazh_item span {
    flex: 1 1 auto;
}
.yukka_order_pogonazh_item strong {
    flex: 0 0 auto;
    color: var(--yukka-navy);
    font-weight: 700;
}
.yukka_order_step_actions {
    display: flex;
    gap: 10px;
}
.yukka_order_next,
.yukka_order_submit {
    flex: 1 1 auto;
    padding: 13px;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: #fff;
    background: var(--yukka-highlight);
    border: none;
    border-radius: 8px;
    cursor: pointer;
}
.yukka_order_next:disabled {
    opacity: .5;
    cursor: not-allowed;
}
.yukka_order_next:not(:disabled):hover,
.yukka_order_submit:hover {
    background: var(--yukka-green-dark);
}
.yukka_order_back {
    flex: 0 0 auto;
    padding: 13px 18px;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: var(--yukka-text);
    background: none;
    border: 1px solid var(--yukka-border);
    border-radius: 8px;
    cursor: pointer;
}
.yukka_order_policy {
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 12px;
    line-height: 1.5;
    color: var(--yukka-muted);
}
.yukka_order_status {
    margin: 0;
    min-height: 1.3em;
    font-family: var(--yukka-font-body);
    font-size: 13px;
    font-weight: 700;
    color: var(--yukka-highlight);
}
.yukka_order_total {
    position: sticky;
    bottom: -24px;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 24px -24px -24px;
    padding: 16px 24px;
    background: var(--yukka-bg-product);
    border-top: 1px solid var(--yukka-border);
}
.yukka_order_total_label {
    font-family: var(--yukka-font-body);
    font-size: 13px;
    color: var(--yukka-text);
}
.yukka_order_total_value {
    font-family: var(--yukka-font-display);
    font-size: 22px;
    font-weight: 400;
    color: var(--yukka-navy);
}
.yukka_order_total_info {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    font-family: var(--yukka-font-body);
    font-size: 12px;
    font-weight: 700;
    color: var(--yukka-muted);
    background: var(--yukka-bg);
    border: 1px solid var(--yukka-border);
    border-radius: 50%;
    cursor: help;
}

.yukka_doors_menu_overlay {
    position: fixed;
    inset: 0;
    z-index: 1070;
    background: var(--yukka-overlay-bg);
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease, visibility 0s linear .25s;
    display: flex;
    justify-content: center;
    padding: 110px 24px 24px;
    overflow-y: auto;
}
.yukka_doors_menu_overlay.is-open {
    opacity: 1;
    visibility: visible;
    transition: opacity .25s ease;
}
.yukka_doors_menu_panel {
    position: relative;
    width: 100%;
    max-width: 1360px;
    background: var(--yukka-bg-product);
    border-radius: 8px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.3);
    display: flex;
    align-items: stretch;
    max-height: calc(100vh - 140px);
    transform: translateY(-16px);
    opacity: 0;
    transition: transform .25s ease, opacity .25s ease;
}
.yukka_doors_menu_overlay.is-open .yukka_doors_menu_panel {
    transform: translateY(0);
    opacity: 1;
}
.yukka_doors_menu_side {
    flex: 0 0 240px;
    padding: 40px 32px;
    border-right: 1px solid var(--yukka-border);
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}
.yukka_doors_menu_title {
    font-family: var(--yukka-font-display);
    font-size: 22px;
    font-weight: 400;
    color: var(--yukka-ink);
    margin: 0 0 24px;
}
.yukka_doors_menu_tabs {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 24px;
}
.yukka_doors_menu_tab {
    display: inline-flex;
    align-items: center;
    padding: 8px 18px;
    border: none;
    border-radius: 20px;
    background: none;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 600;
    color: var(--yukka-muted);
    cursor: pointer;
}
.yukka_doors_menu_tab.is-active {
    background: var(--yukka-tag-bg);
    color: var(--yukka-ink);
}
.yukka_doors_menu_side_nav {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-top: 24px;
    border-top: 1px solid var(--yukka-border);
}
.yukka_doors_menu_side_nav a,
.yukka_doors_menu_search_link {
    display: block;
    width: 100%;
    padding: 0;
    border: none;
    background: none;
    text-align: left;
    font-family: var(--yukka-font-body);
    font-size: 15px;
    font-weight: 600;
    color: var(--yukka-ink);
    text-decoration: none;
    cursor: pointer;
}
.yukka_doors_menu_side_nav a:hover,
.yukka_doors_menu_search_link:hover,
.yukka_doors_menu_search_link.is-active {
    color: var(--yukka-highlight);
}
.yukka_doors_menu_search_panel {
    display: none;
}
.yukka_doors_menu_search_panel.is-active {
    display: block;
}
.yukka_doors_menu_search_input {
    width: 100%;
    height: 56px;
    padding: 0 20px;
    border: 1px solid var(--yukka-border);
    border-radius: 8px;
    background: #fff;
    font-family: var(--yukka-font-display);
    font-size: 22px;
    color: var(--yukka-ink);
    outline: none;
}
.yukka_doors_menu_search_input:focus {
    border-color: var(--yukka-ink);
}
.yukka_doors_menu_search_input::placeholder {
    color: var(--yukka-muted);
}
.yukka_doors_menu_search_results {
    display: none;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
    margin-top: 32px;
}
.yukka_doors_menu_search_results.is-open {
    display: grid;
}
.yukka_doors_menu_search_result {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: var(--yukka-ink);
}
.yukka_doors_menu_search_result_photo {
    width: 100%;
    aspect-ratio: 3 / 4;
    border-radius: 6px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;    
    margin-bottom: 20px;
}
.yukka_doors_menu_search_result_name {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 6px;
}
.yukka_doors_menu_search_result_prices {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.yukka_doors_menu_search_result_price {
    font-size: 14px;
    color: var(--yukka-muted);
}
.yukka_doors_menu_search_result_price b {
    color: var(--yukka-ink);
    font-weight: 700;
}
.yukka_doors_menu_search_empty {
    grid-column: 1 / -1;
    font-size: 13px;
    color: var(--yukka-muted);
}
@media (max-width: 1200px) {
    .yukka_doors_menu_search_results {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 900px) {
    .yukka_doors_menu_search_results {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 575px) {
    .yukka_doors_menu_search_results {
        grid-template-columns: 1fr;
    }
}
.yukka_doors_menu_main {
    flex: 1 1 auto;
    padding: 40px 48px;
    overflow-y: auto;
    min-width: 0;
}
.yukka_doors_menu_styles {
    display: none;
    grid-template-columns: repeat(5, 1fr);
    gap: 32px;
}
.yukka_doors_menu_styles.is-active {
    display: grid;
}
.yukka_doors_menu_style_photo {
    width: 100%;
    aspect-ratio: 3 / 4;
    border-radius: 6px;
    background-size: cover;
    background-position: center;
    margin-bottom: 16px;
}
.yukka_doors_menu_style_name {
    font-family: var(--yukka-font-body);
    font-size: 15px;
    font-weight: 700;
    color: var(--yukka-ink);
    margin: 0 0 10px;
}
.yukka_doors_menu_style_desc {
    font-size: 14px;
    line-height: 1.5;
    color: var(--yukka-muted);
    margin: 0 0 18px;
}
.yukka_doors_menu_style_col a {
    display: block;
    font-size: 14px;
    color: var(--yukka-text);
    text-decoration: none;
    margin-bottom: 10px;
}
.yukka_doors_menu_style_col a:hover {
    color: var(--yukka-highlight);
}
@media (max-width: 1200px) {
    .yukka_doors_menu_styles {
        grid-template-columns: repeat(3, 1fr);
        row-gap: 32px;
    }
}
@media (max-width: 900px) {
    .yukka_doors_menu_overlay {
        padding: 90px 12px 12px;
    }
    .yukka_doors_menu_panel {
        flex-direction: column;
        max-height: calc(100vh - 100px);
    }
    .yukka_doors_menu_side {
        flex: 0 0 auto;
        border-right: none;
        border-bottom: 1px solid var(--yukka-border);
    }
    .yukka_doors_menu_tabs {
        flex-direction: row;
    }
    .yukka_doors_menu_styles {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 575px) {
    .yukka_doors_menu_styles {
        grid-template-columns: 1fr;
    }
}

.yukka_ask_form {
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.yukka_ask_input {
    width: 100%;
    padding: 14px 20px;
    border: 1.5px solid var(--yukka-border);
    border-radius: 999px;
    font-size: 14px;
    font-family: var(--yukka-font-body);
    color: var(--yukka-ink);
}
.yukka_ask_input:focus {
    outline: none;
    border-color: var(--yukka-navy);
}
.yukka_ask_input::placeholder {
    color: var(--yukka-muted);
}
.yukka_ask_checkbox {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 13px;
    line-height: 1.4;
    color: var(--yukka-text);
    cursor: pointer;
}
.yukka_ask_checkbox input {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin-top: 2px;
    accent-color: var(--yukka-navy);
    cursor: pointer;
}
.yukka_ask_submit_btn {
    width: 100%;
    padding: 16px 20px;
    border: none;
    border-radius: 999px;
    background: var(--yukka-ink);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    font-family: var(--yukka-font-body);
    cursor: pointer;
}
.yukka_ask_submit_btn:hover {
    background: var(--yukka-navy);
}

.yukka_photo_spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 8;
    display: none;
}
.yukka_photo_spinner.is-active {
    display: flex;
    align-items: center;
    justify-content: center;
}
.lds-dual-ring,
.lds-dual-ring:after {
    box-sizing: border-box;
}
.lds-dual-ring {
    display: inline-block;
    width: 80px;
    height: 80px;
}
.lds-dual-ring:after {
    content: " ";
    display: block;
    width: 64px;
    height: 64px;
    margin: 8px;
    border-radius: 50%;
    border: 6.4px solid #d9d9d9;
    border-color: #d9d9d9 transparent #d9d9d9 transparent;
    animation: lds-dual-ring 1.2s linear infinite;
}
@keyframes lds-dual-ring {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.yukka_tabs {
    margin-top: 30px;
    margin-bottom: 30px;
}
.yukka_tabs_nav {
    display: flex;
    gap: 28px;
    border-bottom: 1px solid var(--yukka-border);
    padding-bottom: 0;
    margin-bottom: 24px;
    flex-wrap: wrap;
}
.yukka_tab_btn {
    padding: 0 0 14px;
    margin-bottom: -1px;
    border: none;
    border-bottom: 1px solid transparent;
    border-radius: 0;
    background: none;
    font-size: 15px;
    color: var(--yukka-muted);
    cursor: pointer;
}
.yukka_tab_btn:hover {
    color: var(--yukka-ink);
}
.yukka_tab_btn.is-active {
    color: var(--yukka-navy);
    border-bottom-color: var(--yukka-ink);
}
.yukka_tab_panel {
    display: none;
    opacity: 0;
    transform: translateY(6px);
    transition: opacity .18s ease, transform .18s ease;
}
.yukka_tab_panel.is-active {
    display: block;
}
.yukka_prod_lead {
    margin: 0 0 22px;
    font-family: var(--yukka-font-body);
    font-size: 16px;
    line-height: 1.7;
    color: var(--yukka-text);
}
.yukka_prod_features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 0 0 22px;
    padding: 0;
    list-style: none;
}
.yukka_prod_feature {
    padding: 14px 16px;
    border: 1px solid var(--yukka-border);
    border-radius: 8px;
    background: var(--yukka-bg-product);
    font-family: var(--yukka-font-body);
    font-size: 14px;    
    line-height: 1.4;
    color: var(--yukka-navy);
}
.yukka_prod_note {
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    line-height: 1.6;
    color: var(--yukka-muted);
}
@media (max-width: 480px) {
    .yukka_prod_features {
        grid-template-columns: 1fr;
    }
}
.yukka_tab_panel.is-active.is-visible {
    opacity: 1;
    transform: translateY(0);
}
.yukka_tab_panel .yukka_color_block, .yukka_tab_panel .yukka_patina_block, .yukka_tab_panel .yukka_size_block, .yukka_tab_panel .yukka_kit_block {
    margin: 0;
}
div#yukka_enamel_block {
    margin-bottom: 20px;
}
.yukka_specs_title {
    color: var(--yukka-navy);
    margin: 0 0 30px;
}
.yukka_specs_grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 32px;
    row-gap: 10px;
}
.yukka_specs_row {
    display: flex;
    align-items: baseline;
    min-width: 0;
}
.yukka_specs_label {
    flex: 0 1 auto;
    color: var(--yukka-muted);
    font-size: 14px;
    white-space: nowrap;
}
.yukka_specs_dots {
    flex: 1 1 auto;
    border-bottom: 1px dotted #c7c4bb;
    margin: 0 6px 3px;
    min-width: 8px;
}
.yukka_specs_value {
    flex: 0 0 auto;
    font-size: 14px;
    color: var(--yukka-navy);
    white-space: nowrap;
}
@media (max-width: 480px) {
    .yukka_specs_grid {
        grid-template-columns: 1fr;
    }
}

/* Характеристики металлических дверей ("Комплектация"/"Фурнитура") — тот же
   формат "подпись … точки … значение", что у обычных коллекций, но в одну
   колонку (значения длиннее, чем "35 мм") и с переносом строки у значения,
   если оно не помещается на одной строке. */
.yukka_specs--metal .yukka_specs_grid {
    grid-template-columns: 1fr;
    row-gap: 14px;
}
.yukka_specs--metal .yukka_specs_row {
    flex-wrap: wrap;
}
.yukka_specs--metal .yukka_specs_value {
    min-width: 0;
    white-space: normal;
    text-align: right;
}

.yukka_metal_panel_list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.yukka_metal_panel_list li {
    padding: 5px 0px;    
    font-family: var(--yukka-font-body);
    font-size: 14px;
    line-height: 1.5;
    color: var(--yukka-text);
}

.image_middle {
    position: relative;
}
.image_middle .image {
    transition: opacity .2s ease;
}

body.yukka-hero-page main {
    margin-top: 0;
}
.yukka_home_hero {
    position: relative;
    height: 780px;
    overflow: hidden;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    background: #20221f;
}
.yukka_home_hero_video {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
    pointer-events: none;
}
.yukka_home_hero_video iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    width: max(100vw, 138.7vh);
    height: max(56.25vw, 78vh);
    min-width: 100%;
    min-height: 100%;
    border: 0;
    transform: translate(-50%, -50%);
}
.yukka_home_hero_slide {
    position: absolute;
    inset: 0;
    z-index: 0;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transform: scale(1);
    transition: opacity .6s ease;
}
.yukka_home_hero_slide.is-active {
    opacity: 1;
    animation: yukka-kenburns-home 7s ease-in-out forwards;
}
@keyframes yukka-kenburns-home {
    from {
        transform: scale(1);
    }
    to {
        transform: scale(1.04);
    }
}
.yukka_home_hero_overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.5) 55%, rgba(0, 0, 0, 0.25) 100%);
}
.yukka_home_hero_content {
    position: absolute;
    left: 50%;
    top: 59%;
    transform: translate(-50%, -50%);
    z-index: 2;
    width: 100%;
    max-width: 640px;
    padding: 0 40px;
    text-align: center;
}
.yukka_home_hero_eyebrow {
    font-family: var(--yukka-font-body);
    font-size: 13px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: 18px;
}
.yukka_home_hero_title {
    font-family: var(--yukka-font-display);
    font-weight: 400;
    font-size: 46px;
    line-height: 1.25;
    color: #fff;
    margin: 0 0 20px;
}
.yukka_home_hero_sub {
    font-family: var(--yukka-font-body);
    font-size: 16px;
    line-height: 1.65;
    color: rgba(255, 255, 255, 0.85);
    margin: 0 0 32px;
}
.yukka_home_hero_actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 30px;
}
.yukka_home_hero_btn {
    padding: 15px 32px !important;
    border-radius: 6px !important;
    font-size: 17px !important;    
    text-decoration: none;
    color: #fff;
}
.yukka_home_hero_btn:hover {
  color: rgba(255, 255, 255, 0.8); 
}
.yukka_home_hero_calc_btn {
    padding: 15px 28px !important;
    border: 1px solid rgba(255, 255, 255, .62) !important;
    border-radius: 6px !important;
    background: rgba(255, 255, 255, .12) !important;
    color: #fff !important;
    font-family: var(--yukka-font-body);
    font-size: 17px !important;
    text-decoration: none;
}
.yukka_home_hero_calc_btn:hover {
    background: rgba(255, 255, 255, .22) !important;
    color: #fff !important;
}
.yukka_home_hero_phone {
    font-family: var(--yukka-font-body);
    font-size: 17px;
    color: #fff;
    text-decoration: none;
}
.yukka_home_hero_phone:hover {
    color: rgba(255, 255, 255, 0.8);
}
.yukka_home_hero_stats {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 36px;
    flex-wrap: wrap;
    padding-top: 30px;
    border-top: 1px solid rgba(255, 255, 255, 0.25);
}
.yukka_home_hero_stat {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: rgba(255, 255, 255, 0.75);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}
.yukka_home_hero_stat span {
    font-family: var(--yukka-font-display);
    font-size: 26px;
    color: #fff;
}
@media (max-width: 767px) {
    .yukka_home_hero {
        height: 620px;
    }
    .yukka_home_hero_content {
        padding: 0 24px;
        max-width: 460px;
    }
    .yukka_home_hero_title {
        font-size: 32px;
    }
    .yukka_home_hero_sub {
        font-size: 14.5px;
        margin-bottom: 26px;
    }
    .yukka_home_hero_actions {
        gap: 16px;
        margin-bottom: 30px;
    }
    .yukka_home_hero_stats {
        gap: 22px;
        padding-top: 24px;
    }
    .yukka_home_hero_stat span {
        font-size: 20px;
    }
}

.yukka_home_trust {
    margin: 150px 0;
    padding: 0;
}
.yukka_home_trust_grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--yukka-green-dark) 28%, transparent);
    border-radius: 18px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .96), rgba(248, 245, 238, .9)),
        var(--yukka-bg-product);
    box-shadow: 0 22px 70px rgba(45, 40, 30, .08);
}
.yukka_home_trust_item {
    position: relative;
    min-height: 220px;
    padding: 38px 34px 34px;
    text-align: left;
    transition: background-color .2s ease, transform .2s ease;
}
.yukka_home_trust_item + .yukka_home_trust_item {
    border-left: 1px solid color-mix(in srgb, var(--yukka-green-dark) 22%, transparent);
}
.yukka_home_trust_item:hover {
    background: rgba(255, 255, 255, .55);
    transform: translateY(-2px);
}
.yukka_home_trust_icon {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    color: var(--yukka-green-dark);
    margin-bottom: 26px;
    border: 1px solid color-mix(in srgb, var(--yukka-green-dark) 42%, transparent);
    border-radius: 50%;
    background: rgba(255, 255, 255, .72);
    box-shadow: inset 0 0 0 7px color-mix(in srgb, var(--yukka-green-dark) 8%, transparent);
}
.yukka_home_trust_icon svg {
    width: 25px;
    height: 25px;
}
.yukka_home_trust_title {
    font-family: var(--yukka-font-body);
    font-size: 17px;
    line-height: 1.35;
    color: var(--yukka-navy);
    margin-bottom: 12px;
}
.yukka_home_trust_desc {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    line-height: 1.7;
    color: var(--yukka-muted);
}
@media (max-width: 991px) {
    .yukka_home_trust_grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .yukka_home_trust_item:nth-child(odd) {
        border-left: 0;
    }
    .yukka_home_trust_item:nth-child(n + 3) {
        border-top: 1px solid color-mix(in srgb, var(--yukka-green-dark) 22%, transparent);
    }
}
@media (max-width: 480px) {
    .yukka_home_trust {
        margin: 64px 0;
    }
    .yukka_home_trust_grid {
        grid-template-columns: 1fr;
        border-radius: 14px;
    }
    .yukka_home_trust_item {
        min-height: auto;
        padding: 28px 24px;
        border-left: 0 !important;
    }
    .yukka_home_trust_item + .yukka_home_trust_item {
        border-top: 1px solid color-mix(in srgb, var(--yukka-green-dark) 22%, transparent);
    }
}

.yukka_home_popular_models {
    margin: 150px 0;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    padding: 92px 0 96px;
    background: var(--yukka-gray);
}
.yukka_home_popular_inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 40px;
}
.yukka_home_popular_head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 32px;
    margin-bottom: 44px;
}
.yukka_home_popular_title {
    margin: 0;
    font-family: var(--yukka-font-display);
    font-size: 30px;
    font-weight: 400;
    line-height: .95;
    letter-spacing: 0;
    color: var(--yukka-navy);
}
.yukka_home_popular_link {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    padding: 0 0 10px;
    border-bottom: 1px solid color-mix(in srgb, var(--yukka-green-dark) 32%, transparent);
    font-family: var(--yukka-font-body);
    font-size: 11px;
    letter-spacing: .11em;
    line-height: 1.2;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--yukka-navy);
    white-space: nowrap;
    transition: color .2s ease, border-color .2s ease;
}
.yukka_home_popular_link svg {
    flex: 0 0 auto;
    transition: transform .2s ease;
}
.yukka_home_popular_link:hover {
    color: var(--yukka-green-dark);
    border-bottom-color: var(--yukka-green-dark);
}
.yukka_home_popular_link:hover svg {
    transform: translateX(4px);
}

.yukka_home_storefront {
    margin: 0px 0px 150px 0px;
    padding: 150px 0px 0px 0px;
}
.yukka_home_storefront_inner {
    box-sizing: border-box;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0;
}
.yukka_home_storefront_head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 36px;
    margin-bottom: 42px;
}
.yukka_home_storefront_head .yukka_home_popular_link {
    flex: 0 0 auto;
    margin-left: auto;
    width: max-content;
}
.yukka_home_storefront_title {
    margin: 0 0 16px;
    font-family: var(--yukka-font-display);
    font-size: 34px;
    font-weight: 400;
    line-height: 1.16;
    color: var(--yukka-navy);
}
.yukka_home_storefront_sub {
    max-width: 660px;
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 15px;
    line-height: 1.65;
    color: var(--yukka-muted);
}
@media (max-width: 820px) {
    .yukka_home_storefront_head {
        align-items: start;
        flex-direction: column;
    }
    .yukka_home_storefront_head .yukka_home_popular_link {
        margin-left: 0;
    }
}
@media (max-width: 575px) {
    .yukka_home_storefront {
        margin: 64px 0;
        padding: 56px 0 60px;
    }
    .yukka_home_storefront_inner {
        padding: 0 16px;
    }
    .yukka_home_storefront_title {
        font-size: 26px;
    }
    .yukka_home_storefront_sub {
        font-size: 14px;
    }
}

.yukka_home_popular_grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
}
.yukka_home_popular_card {
    display: block;
    min-width: 0;
    text-decoration: none;
    color: inherit;
}
.yukka_home_popular_photo {
    display: block;
    position: relative;
    overflow: hidden;
    aspect-ratio: 520 / 562;
    background: var(--yukka-bg-product);
}
.yukka_home_popular_photo::after {
    content: "";
    position: absolute;
    inset: 0;
    border: 1px solid rgba(255, 255, 255, .34);
    pointer-events: none;
}
.yukka_home_popular_photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.01);
    transition: transform .45s ease, filter .45s ease;
}
.yukka_home_popular_card:hover .yukka_home_popular_photo img {
    filter: saturate(1.03) contrast(1.02);
    transform: scale(1.045);
}
.yukka_home_popular_meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-top: 22px;
    font-family: var(--yukka-font-body);
    font-size: 12px;    
    line-height: 1.35;
    color: color-mix(in srgb, var(--yukka-navy) 66%, transparent);
}
.yukka_home_popular_meta span:last-child {
    color: var(--yukka-navy);
    white-space: nowrap;
}
.yukka_home_popular_name_row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-top: 12px;
}
.yukka_home_popular_name {
    min-width: 0;    
    font-size: 22px;
    font-weight: 400;
    line-height: .95;
    color: var(--yukka-navy);
}
.yukka_home_popular_colors {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    flex: 0 0 auto;
}
.yukka_home_popular_colors span {
    width: 11px;
    height: 11px;
    border-radius: 50%;
    border: 1px solid rgba(23, 32, 24, .18);
    background: #ece6d8;
}
.yukka_home_popular_colors span:nth-child(2) {
    background: #948571;
}
.yukka_home_popular_colors span:nth-child(3) {
    background: var(--yukka-green-dark);
}
.yukka_home_popular_rule {
    display: block;
    height: 1px;
    margin-top: 28px;
    background: color-mix(in srgb, var(--yukka-green-dark) 22%, transparent);
}
@media (max-width: 991px) {
    .yukka_home_popular_grid {
        gap: 22px;
    }
    .yukka_home_popular_title {
        font-size: clamp(38px, 7vw, 58px);
    }
}
@media (max-width: 767px) {
    .yukka_home_popular_models {
        margin: 64px 0;
        padding: 58px 0 62px;
    }
    .yukka_home_popular_inner {
        padding: 0 24px;
    }
    .yukka_home_popular_head {
        align-items: flex-start;
        margin-bottom: 30px;
    }
    .yukka_home_popular_grid {
        grid-template-columns: 1fr;
        gap: 42px;
    }
    .yukka_home_popular_photo {
        aspect-ratio: 4 / 4.45;
    }
}
@media (max-width: 575px) {
    .yukka_home_popular_head {
        display: block;
    }
    .yukka_home_popular_link {
        margin-top: 22px;
    }
    .yukka_home_popular_meta {
        font-size: 10.5px;
    }
    .yukka_home_popular_name {
        font-size: 28px;
    }
}

.yukka_home_section {
    margin: 150px 0;
}
.yukka_home_section_head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 50px;
    flex-wrap: wrap;
}
.yukka_home_section_title {
    font-family: var(--yukka-font-display);
    font-weight: 400;
    font-size: 30px;
    color: var(--yukka-navy);
  margin: 30px 0px;
}
.yukka_home_section_sub {
    font-family: var(--yukka-font-body);
    font-size: 14.5px;
    color: var(--yukka-muted);
    margin: 0;
    max-width: 520px;
}
.yukka_home_section_link {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 700;
    color: var(--yukka-navy);
    text-decoration: none;
    white-space: nowrap;
}
.yukka_home_section_link:hover {
    color: var(--yukka-highlight);
}
.yukka_link_style_2 {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    width: fit-content;
    margin-top: 22px;
    padding-bottom: 5px;
    font-family: var(--yukka-font-body);
    font-size: 15px;    
    letter-spacing: .11em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--yukka-navy);
    border-bottom: 1px solid var(--yukka-border);
    transition: color .2s ease, border-color .2s ease;
}
.yukka_link_style_2 svg {
    flex: 0 0 auto;
    transition: transform .2s ease;
}
.yukka_link_style_2:hover {
    color: var(--yukka-highlight);
    border-bottom-color: var(--yukka-highlight);
}
.yukka_link_style_2:hover svg {
    transform: translateX(3px);
}
.yukka_home_kicker {
    display: block;
    font-family: var(--yukka-font-body);
    font-size: 12px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--yukka-highlight);
    margin-bottom: 12px;
}
@media (max-width: 575px) {
    .yukka_home_section {
        margin: 64px 0;
    }
    .yukka_home_section_title {
        font-size: 24px;
    }
}

.yukka_home_calc {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 420px;
    align-items: stretch;
    gap: 40px;
    margin: 150px 0;
    padding: 42px;
    background: var(--yukka-bg-product);
    border: 1px solid var(--yukka-border);
    border-radius: 14px;
    box-shadow: 0 18px 55px rgba(40, 37, 30, .08);
}
.yukka_home_calc_text p {
    max-width: 650px;
    margin: 0 0 24px;
    font-family: var(--yukka-font-body);
    font-size: 15px;
    line-height: 1.75;
    color: var(--yukka-text);
}
.yukka_home_calc_steps {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.yukka_home_calc_steps span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid var(--yukka-border);
    border-radius: 999px;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: var(--yukka-navy);
    background: #fbfaf7;
}
.yukka_home_calc_form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    align-content: start;
}
.yukka_home_calc_form label {
    display: block;
    min-width: 0;
}
.yukka_home_calc_form label span {
    display: block;
    margin: 0 0 6px;
    font-family: var(--yukka-font-body);
    font-size: 12px;
    font-weight: 700;
    color: var(--yukka-muted);
}
.yukka_home_calc_input {
    width: 100%;
    min-height: 46px;
    padding: 11px 13px;
    border: 1.5px solid var(--yukka-border);
    border-radius: 6px;
    background: #fff;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: var(--yukka-ink);
}
.yukka_home_calc_input:focus {
    outline: none;
    border-color: var(--yukka-highlight);
}
.yukka_home_calc_form .yukka_select_trigger {
    min-height: 46px;
    border-radius: 6px;
    border-width: 1.5px;
    background: #fff;
    color: var(--yukka-ink);
}
.yukka_home_calc_submit {
    grid-column: 1 / -1;
    min-height: 50px;
    border: 0;
    border-radius: 6px;
    background: var(--yukka-ink);
    color: #fff;
    font-family: var(--yukka-font-body);
    font-size: 15px;
    font-weight: 800;
    cursor: pointer;
}
.yukka_home_calc_submit:hover {
    background: var(--yukka-highlight);
}
.yukka_home_calc_policy,
.yukka_home_calc_status {
    grid-column: 1 / -1;
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 12px;
    line-height: 1.45;
    color: var(--yukka-muted);
}
.yukka_home_calc_status {
    min-height: 18px;
    font-weight: 700;
    color: var(--yukka-highlight);
}
@media (max-width: 991px) {
    .yukka_home_calc {
        grid-template-columns: 1fr;
        margin-top: 44px;
    }
}
@media (max-width: 575px) {
    .yukka_home_calc {
        margin: 36px 0 64px;
        padding: 26px 18px;
        gap: 26px;
    }
    .yukka_home_calc_form {
        grid-template-columns: 1fr;
    }
}

.yukka_home_factory {
    display: flex;
    align-items: stretch;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    margin-top: 150px;
    margin-bottom: 150px;
    min-height: 720px;
}
.yukka_home_factory_photo {
    position: relative;
    flex: 0 0 50%;
    overflow: hidden;
    background: #20221f;
}
.yukka_home_factory_photo iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    width: max(50vw, 1280px);
    height: max(56.25vw, 720px);
    min-width: 100%;
    min-height: 100%;
    transform: translate(-50%, -50%);
    border: 0;
    pointer-events: none;
}
.yukka_home_factory_photo.is-fullscreen iframe {
    pointer-events: auto;
}
.yukka_home_factory_video_scrim {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(11, 15, 20, .08) 0%, rgba(11, 15, 20, .16) 55%, rgba(11, 15, 20, .42) 100%);
}
.yukka_home_factory_expand_btn {
    position: absolute;
    top: 24px;
    right: 24px;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    color: rgb(255, 255, 255);    
    padding: 0px;
    border-width: 1px;
    border-style: solid;
    border-color: rgba(255, 255, 255, 0.4);
    border-image: none;
    border-radius: 50%;
    background: rgba(11, 15, 20, 0.45);
    transition: background 0.2s, transform 0.2s;
}
.yukka_home_factory_expand_btn:hover {
    background: rgba(133, 181, 87, .92);
    border-color: rgba(133, 181, 87, .92);
}
.yukka_home_factory_expand_btn svg {
    width: 24px;
    height: 24px;
    margin-left: 3px;
}
.yukka_home_factory_badge {
    position: absolute;
    z-index: 2;
    left: 32px;
    bottom: 32px;
    padding: 10px 16px;
    border-radius: 999px;
    background: rgba(11, 15, 20, 0.7);
    backdrop-filter: blur(4px);
    color: #fff;
    font-family: var(--yukka-font-body);
    font-size: 11.5px;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap;
}
.yukka_home_factory_content {
    flex: 0 0 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 min(8%, 120px);
    background: var(--yukka-gray);
}
.yukka_home_factory_content .yukka_home_kicker {
    color: var(--yukka-green);
}
.yukka_home_factory_title {
    font-family: var(--yukka-font-display);
    font-weight: 400;
    font-size: 44px;
    line-height: 1.15;
    margin: 14px 0 20px;
}
.yukka_home_factory_title em {
    font-family: var(--yukka-font-display);
    font-style: italic;
    font-weight: 400;
    color: var(--yukka-green);
}
.yukka_home_factory_sub {
    font-family: var(--yukka-font-body);
    font-size: 15px;
    line-height: 1.65;
    margin: 0 0 32px;
    max-width: 420px;
}
.yukka_home_factory_btn {
    display: inline-flex;
    align-self: flex-start;
    align-items: center;
    gap: 10px;
    padding: 15px 24px;
    border-radius: 8px;
    background: #fff;
    color: var(--yukka-ink);
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    text-decoration: none;
    transition: background .2s ease;
}
.yukka_home_factory_btn:hover {
    background: var(--yukka-green);
    color: #fff;
}
.yukka_home_factory_btn svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
}
.yukka_home_factory_facts {
    display: grid;
    grid-template-columns: repeat(4, auto);
    gap: 28px 48px;
    margin-top: 48px;
    padding-top: 32px;
    border-top: 1px solid rgba(255, 255, 255, 0.16);
}
.yukka_home_factory_fact {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.yukka_home_factory_fact strong {
    font-family: var(--yukka-font-display);
    font-weight: 400;
    font-size: 26px;
}
.yukka_home_factory_fact span {
    font-family: var(--yukka-font-body);
    font-size: 11px;
    letter-spacing: .04em;
    text-transform: uppercase;
}
@media (max-width: 900px) {
    .yukka_home_factory {
        flex-direction: column;
        min-height: 0;
    }
    .yukka_home_factory_photo {
        flex-basis: auto;
        aspect-ratio: 4 / 3;
    }
    .yukka_home_factory_content {
        flex-basis: auto;
        padding: 40px 24px;
    }
    .yukka_home_factory_facts {
        grid-template-columns: repeat(2, auto);
    }
}
@media (max-width: 575px) {
    .yukka_home_factory {
        margin-top: 64px;
        margin-bottom: 64px;
    }
    .yukka_home_factory_title {
        font-size: 34px;
    }
    .yukka_home_factory_content {
        padding: 32px 20px;
    }
}

.yukka_home_process_list {
    border-top: 1px solid var(--yukka-border);
}
.yukka_home_process_row {
    display: flex;
    align-items: center;
    gap: 28px;
    padding: 30px 0;
    border-bottom: 1px solid var(--yukka-border);
    text-decoration: none;
    transition: padding-left .2s ease;
}
.yukka_home_process_row:hover {
    padding-left: 12px;
}
.yukka_home_process_num {
    flex: 0 0 auto;
    font-family: var(--yukka-font-display);
    font-size: 20px;
    color: var(--yukka-muted);
}
.yukka_home_process_body {
    flex: 1 1 auto;
    display: flex;
    align-items: baseline;
    gap: 20px;
    flex-wrap: wrap;
}
.yukka_home_process_title {
    font-family: var(--yukka-font-display);
    font-weight: 400;
    font-size: 22px;
    color: var(--yukka-navy);
}
.yukka_home_process_desc {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: var(--yukka-muted);
}
.yukka_home_process_arrow {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    color: var(--yukka-muted);
    transition: transform .2s ease, color .2s ease;
}
.yukka_home_process_row:hover .yukka_home_process_title {
    color: var(--yukka-highlight);
}
.yukka_home_process_row:hover .yukka_home_process_arrow {
    color: var(--yukka-highlight);
    transform: translateX(4px);
}
@media (max-width: 767px) {
    .yukka_home_process_body {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
    .yukka_home_process_row {
        gap: 18px;
        padding: 22px 0;
    }
    .yukka_home_process_title {
        font-size: 18px;
    }
    .yukka_home_process_desc {
        font-size: 13px;
    }
}

.yukka_home_reviews_tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 32px;
    flex-wrap: wrap;
}
.yukka_home_reviews_tab {
    padding: 11px 22px;
    border: 1px solid var(--yukka-border);
    border-radius: 999px;
    background: transparent;
    color: var(--yukka-muted);
    font-family: var(--yukka-font-body);
    font-size: 14px;
    cursor: pointer;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.yukka_home_reviews_tab:hover {
    border-color: var(--yukka-navy);
    color: var(--yukka-navy);
}
.yukka_home_reviews_tab.is-active {
    background: var(--yukka-navy);
    border-color: var(--yukka-navy);
    color: #fff;
}
.yukka_home_reviews_panel {
    display: none;
}
.yukka_home_reviews_panel.is-active {
    display: block;
}
.yukka_home_reviews_summary {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 28px;
}
.yukka_home_reviews_star {
    color: #e8a33d;
    font-size: 18px;
}
.yukka_home_reviews_score {
    font-family: var(--yukka-font-display);
    font-size: 20px;
    color: var(--yukka-navy);
}
.yukka_home_reviews_count {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: var(--yukka-muted);
    padding-right: 12px;
    border-right: 1px solid var(--yukka-border);
}
.yukka_home_reviews_link {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 700;
    color: var(--yukka-navy);
    text-decoration: none;
}
.yukka_home_reviews_link:hover {
    color: var(--yukka-highlight);
}
.yukka_home_reviews_grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}
.yukka_home_review_card {
    padding: 28px;
    border: 1px solid var(--yukka-border);
    border-radius: 10px;
    background: var(--yukka-bg-product);
}
.yukka_home_review_card_head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}
.yukka_home_review_card_name {
    font-family: var(--yukka-font-body);
    font-weight: 700;
    font-size: 14.5px;
    color: var(--yukka-navy);
}
.yukka_home_review_card_date {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: var(--yukka-muted);
    white-space: nowrap;
}
.yukka_home_review_card_stars {
    display: block;
    color: #e8a33d;
    font-size: 13px;
    letter-spacing: 2px;
    margin-bottom: 12px;
}
.yukka_home_review_card_text {
    font-family: var(--yukka-font-body);
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--yukka-text);
    margin: 0;
}
@media (max-width: 900px) {
    .yukka_home_reviews_grid {
        grid-template-columns: 1fr;
    }
    .yukka_home_reviews_summary {
        flex-wrap: wrap;
        row-gap: 10px;
    }
}

.yukka_home_promos {
    margin: -30px 0px 150px 0px;
}
.yukka_home_promos .yukka_home_section_head {
    margin-bottom: 34px;
}
.yukka_home_promos .yukka_home_section_title {
    margin-top: 0;
}
.yukka_home_promos_grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}
.yukka_home_promo_card {
    display: flex;
    flex-direction: column;
    min-height: 310px;
    padding: 32px;
    overflow: hidden;
    position: relative;
    border: 1px solid var(--yukka-border);
    border-radius: 8px;    
    background: linear-gradient(53deg, rgba(31, 33, 30, .94) 0%, rgb(31 33 30 / 36%) 55%, rgb(31 33 30 / 7%) 100%), url(/images/goods/insterios/pd/grand/grand-08-int.jpg);
    background-size: cover;
    background-position: center;
    border-color: rgba(255, 255, 255, .14);
}
.yukka_home_promo_card--dark {
    background:
        linear-gradient(135deg, rgba(31, 33, 30, .94) 0%, rgba(31, 33, 30, .84) 55%, rgba(31, 33, 30, .68) 100%),
        url('/images/goods/insterios/pd/grand/grand-08-int.jpg');
    background-size: cover;
    background-position: center;
    border-color: rgba(255, 255, 255, .14);
}
.yukka_home_promo_top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 42px;
}
.yukka_home_promo_badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 82px;
    min-height: 48px;
    padding: 8px 14px;
    border-radius: 6px;
    background: var(--btnbg);
    color: var(--btncolor);
    font-family: var(--yukka-font-display);
    font-size: 27px;
    line-height: 1;
}
.yukka_home_promo_card--dark .yukka_home_promo_badge {
    background: #85b557;
    color: #ffffff;
}
.yukka_home_promo_date {
    max-width: 160px;
    font-family: var(--yukka-font-body);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.45;
    color: var(--yukka-bg);
    text-align: right;
    text-transform: uppercase;
}
.yukka_home_promo_card--dark .yukka_home_promo_date {
    color: rgba(255, 255, 255, .72);
}
.yukka_home_promo_card h3 {
    max-width: 560px;
    margin: auto 0 16px;
    font-family: var(--yukka-font-display);
    font-size: 30px;
    font-weight: 400;
    line-height: 1.18;
    color: var(--btncolor);
}
.yukka_home_promo_card p {
    max-width: 610px;
    margin: 0 0 24px;
    font-family: var(--yukka-font-body);
    font-size: 14.5px;
    line-height: 1.65;
    color: var(--btncolor);
}
.yukka_home_promo_card--dark h3 {
    color: #fff;
}
.yukka_home_promo_card--dark p {
    color: rgba(255, 255, 255, .76);
}
.yukka_home_promo_link {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 42px;
    padding: 0 18px;
    border-radius: 6px;
    background: #fff;
    color: var(--yukka-ink);
    font-family: var(--yukka-font-body);
    font-size: 14px;
    text-decoration: none;
    transition: all .3s ease;
}
.yukka_home_promo_link:hover {
    background: var(--yukka-ink);
    color: #fff;
}
.yukka_home_promo_card--dark .yukka_home_promo_link {
    background: #85b557;
    color: #ffffff;
}
.yukka_home_promo_card--dark .yukka_home_promo_link:hover {
    background: #fff;
    color: #1f211e;
}
@media (max-width: 767px) {
    .yukka_home_promos {
        margin: 64px 0;
    }
    .yukka_home_promos_grid {
        grid-template-columns: 1fr;
    }
    .yukka_home_promo_card {
        min-height: 285px;
        padding: 24px 20px;
    }
    .yukka_home_promo_top {
        margin-bottom: 34px;
    }
    .yukka_home_promo_card h3 {
        font-size: 25px;
    }
}
@media (max-width: 420px) {
    .yukka_home_promo_top {
        display: block;
    }
    .yukka_home_promo_date {
        display: block;
        max-width: none;
        margin-top: 12px;
        text-align: left;
    }
}

.yukka_home_directions {
    margin: 96px 0;
}
.yukka_home_directions_head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 32px;
    margin-bottom: 40px;
}
.yukka_home_directions_head_left .yukka_home_kicker {
    margin-bottom: 10px;
}
.yukka_home_directions_head_left .yukka_home_section_title {
    margin: 0;
}
.yukka_home_directions_head_sub {
    max-width: 320px;
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 14.5px;
    line-height: 1.5;
    color: var(--yukka-muted);
    text-align: right;
}
.yukka_home_directions_grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 22px;
    aspect-ratio: 2 / 1;
}
.yukka_home_direction_tile {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 50px;    
    overflow: hidden;
  background-image: linear-gradient(180deg, rgba(11, 15, 20, 0) 45%, rgb(11 15 20 / 55%) 100%), var(--yukka-tile-img);
    background-size: cover;
    background-position: center;
    text-decoration: none;
    transition: transform .3s ease;
}
.yukka_home_direction_tile--main {
    grid-column: 1;
    grid-row: 1 / span 2;
}
.yukka_home_direction_tile--sub {
    grid-column: 2;
    padding: 50px;
}
.yukka_home_direction_tile:hover {
    transform: scale(1.015);
}
.image-card i {
    border: 1px solid #fff8;
    border-radius: 50%;
    place-items: center;
    width: 42px;
    height: 42px;
    display: grid;
    position: absolute;
    bottom: 24px;
    right: 23px;
    color: #fff;
    transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}
.image-card:hover i {
    background-color: rgba(255, 255, 255, .16);
    border-color: rgba(255, 255, 255, .82);
    transform: translateX(3px);
}
.image-card i svg {
    width: 16px;
    height: 16px;
}
.yukka_home_direction_title_row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    width: 100%;
    color: #fff;
}
.yukka_home_direction_title_row i {
    flex: 0 0 auto;
    border: 1px solid #fff8;
    border-radius: 50%;
    place-items: center;
    width: 42px;
    height: 42px;
    display: grid;
    color: #fff;
    transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}
.yukka_home_direction_title_row i svg {
    width: 16px;
    height: 16px;
}
.yukka_home_direction_tile:hover .yukka_home_direction_title_row i {
    background-color: rgba(255, 255, 255, .16);
    border-color: rgba(255, 255, 255, .82);
    transform: translateX(3px);
}
.yukka_home_direction_title,
.yukka_home_direction_sub {
    display: block;
    color: #fff;
}
.yukka_home_direction_sub {
    font-family: var(--yukka-font-body);
    font-size: 12px;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.78);
    margin-bottom: 6px;
}
.yukka_home_direction_title {
    font-family: var(--yukka-font-display);
    font-size: 30px;
    font-weight: 400;
    text-wrap: balance;
}
@media (max-width: 900px) {
    .yukka_home_directions_grid {
        grid-template-columns: 1fr;
        grid-template-rows: none;
        aspect-ratio: auto;
    }
    .yukka_home_direction_tile--main,
    .yukka_home_direction_tile--sub {
        grid-column: 1;
        grid-row: auto;
        aspect-ratio: 4 / 3;
    }
}
@media (max-width: 575px) {
    .yukka_home_directions {
        margin: 64px 0;
    }
    .yukka_home_directions_head {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        margin-bottom: 32px;
    }
    .yukka_home_directions_head_sub {
        max-width: none;
        text-align: left;
    }
    .yukka_home_directions_grid {
        gap: 12px;
    }
    .yukka_home_direction_tile {
        padding: 18px;
    }
    .image-card i {
        width: 38px;
        height: 38px;
        right: 16px;
        bottom: 16px;
    }
    .yukka_home_direction_title_row {
        gap: 14px;
    }
    .yukka_home_direction_title_row i {
        width: 38px;
        height: 38px;
    }
    .yukka_home_direction_title {
        font-size: 20px;
    }
    .yukka_home_direction_tile--sub .yukka_home_direction_title {
        font-size: 17px;
    }
}

.yukka_home_metal {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr);
    gap: 0;
    align-items: stretch;
    margin: 150px 0 150px;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    background: #20221f;
    color: rgba(255, 255, 255, .78);
}
.yukka_home_metal_visual {
    position: relative;
    min-height: 650px;
    overflow: hidden;
}
.yukka_home_metal_visual_main {
    position: absolute;
    background-size: cover;
    background-position: center;
}
.yukka_home_metal_visual_main {
    inset: 0;
}
.yukka_home_metal_visual_main::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(32, 34, 31, .1) 0%, rgba(32, 34, 31, .02) 54%, rgba(32, 34, 31, .34) 100%);
}
.yukka_home_metal_stock {
    position: absolute;
    right: 38px;
    top: 38px;
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: 0 16px;
    border-radius: 6px;
    background: #85b557;
    color: #ffffff;
    font-family: var(--yukka-font-body);
    font-size: 14px;
}
.yukka_home_metal_content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 620px;
    padding: 86px 40px 86px 72px;
}
.yukka_home_metal_content .yukka_home_kicker {
    color: #d8c497;
}
.yukka_home_metal_content .yukka_home_section_title {
    margin: 0 0 22px;
    color: #fff;
    font-size: 38px;
    line-height: 1.12;
}
.yukka_home_metal_intro {
    margin: 0 0 32px;
    font-family: var(--yukka-font-body);
    font-size: 16px;
    line-height: 1.75;
    color: rgba(255, 255, 255, .78);
}
.yukka_home_metal_facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    margin-bottom: 28px;
    background: rgba(255, 255, 255, .16);
}
.yukka_home_metal_facts div {
    min-height: 112px;
    padding: 20px 18px;
    background: rgba(255, 255, 255, .07);
}
.yukka_home_metal_facts strong {
    display: block;
    margin-bottom: 8px;
    font-family: var(--yukka-font-display);
    font-size: 32px;
    font-weight: 400;
    line-height: 1;
    color: #fff;
}
.yukka_home_metal_facts span {
    display: block;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    line-height: 1.45;
    color: rgba(255, 255, 255, .68);
}
.yukka_home_metal_specs {
    display: grid;
    gap: 10px;
    margin-bottom: 30px;
}
.yukka_home_metal_specs span {
    position: relative;
    padding-left: 22px;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    line-height: 1.55;
    color: rgba(255, 255, 255, .78);
}
.yukka_home_metal_specs span::before {
    content: "";
    position: absolute;
    left: 0;
    top: .62em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #d8c497;
}
.yukka_home_metal_models {
    display: grid;
    gap: 10px;
    margin-bottom: 32px;
}
.yukka_home_metal_model {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 56px;
    padding: 13px 16px;
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 6px;
    background: rgba(255, 255, 255, .06);
    color: #fff;
    font-family: var(--yukka-font-body);
    text-decoration: none;
    transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.yukka_home_metal_model:hover {
    background: rgba(255, 255, 255, .1);
    border-color: rgba(216, 196, 151, .55);
    color: #fff;
    transform: translateY(-2px);
}
.yukka_home_metal_model span {
    min-width: 0;
    font-size: 14px;
}
.yukka_home_metal_model strong {
    flex: 0 0 auto;
    font-size: 14px;
    font-weight: 400;
    color: #d8c497;
    white-space: nowrap;
}
.yukka_home_metal_actions {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}
.yukka_home_metal_btn {
    padding: 15px 24px !important;
    border-radius: 6px !important;
    background: #d8c497 !important;
    border-color: #d8c497 !important;
    color: #1f211e !important;
    font-size: 15px !important;
    text-decoration: none;
}
.yukka_home_metal_btn:hover {
    background: #fff !important;
    border-color: #fff !important;
    color: #1f211e !important;
}
.yukka_home_metal_phone {
    font-family: var(--yukka-font-body);
    font-size: 17px;
    color: #fff;
    text-decoration: none;
}
.yukka_home_metal_phone:hover {
    color: #d8c497;
}
@media (max-width: 991px) {
    .yukka_home_metal {
        grid-template-columns: 1fr;
        margin: 80px 0 96px;
    }
    .yukka_home_metal_visual {
        min-height: 520px;
    }
    .yukka_home_metal_content {
        max-width: none;
        padding: 52px 32px 60px;
    }
}
@media (max-width: 575px) {
    .yukka_home_metal {
        margin: 64px 0;
    }
    .yukka_home_metal_visual {
        min-height: 410px;
    }
    .yukka_home_metal_stock {
        left: 20px;
        top: 20px;
        max-width: calc(100% - 40px);
    }
    .yukka_home_metal_content {
        padding: 40px 20px 48px;
    }
    .yukka_home_metal_content .yukka_home_section_title {
        font-size: 28px;
    }
    .yukka_home_metal_intro {
        font-size: 14px;
    }
    .yukka_home_metal_facts {
        grid-template-columns: 1fr;
    }
    .yukka_home_metal_facts div {
        min-height: auto;
    }
    .yukka_home_metal_model {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }
}

.yukka_home_types_grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 50px 50px;
}
.yukka_home_type_card {
    position: relative;
    display: flex;
    flex-direction: column;
    text-decoration: none;
}
.yukka_home_type_card_photo {
    aspect-ratio: 4 / 3;
    border-radius: 10px;
    background-size: cover;
    background-position: center;
    box-shadow: 0 1px 2px rgb(0 0 0 / 6%);
    transition: transform .45s ease, box-shadow .45s ease;
}
.yukka_home_type_card_photo--klassicheskie-mezhkomnatnye-dveri {
  background-position: 0px 0px;
}
.yukka_home_type_card_photo--mezhkomnatnye-dveri-sovremennye-modern-khaj-tek {
    background-position: center;
}
.yukka_home_type_card_photo--dveri-v-emali {
  background-position: 410px 0px;
}
.yukka_home_type_card_photo--elitnye-mezhkomnatnye-dveri {
  background-position: -130px 0px;
}
.yukka_home_type_card_photo--mezhkomnatnye-dveri-s-patinoj {
    background-position: center;
}
.yukka_home_type_card_photo--skrytye-dveri {
    background-position: center;
}
.yukka_home_type_card_photo--dveri-pod-pokrasku {
    background-position: center;
}
.yukka_home_type_card_photo--mezhkomnatnye-dveri-s-alyuminievymi-tortsami {
    background-position: center;
}
.yukka_home_type_card:hover .yukka_home_type_card_photo {
    transform: translateY(-4px);
    box-shadow: 0 18px 32px rgb(0 0 0 / 12%);
}
.yukka_home_type_card_name {
    margin-top: 18px;
    font-family: var(--yukka-font-body);
    font-size: 16px;
    color: var(--yukka-ink);
    transition: color .3s ease;
}
.yukka_home_type_card:hover .yukka_home_type_card_name {
    color: var(--yukka-highlight);
}
@media (max-width: 991px) {
    .yukka_home_types_grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 36px 24px;
    }
}
@media (max-width: 575px) {
    .yukka_home_types_grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 28px 14px;
    }
    .yukka_home_type_card_name {
        margin-top: 12px;
        font-size: 14px;
    }
}

.yukka_home_aristo_grid .yukka_product_grid_inner {
    grid-template-columns: repeat(5, 1fr);
    margin: 0;
}
@media (max-width: 1150px) {
    .yukka_home_aristo_grid .yukka_product_grid_inner {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 800px) {
    .yukka_home_aristo_grid .yukka_product_grid_inner {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 480px) {
    .yukka_home_aristo_grid .yukka_product_grid_inner {
        grid-template-columns: 1fr;
    }
}

.yukka_home_products_grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}
.yukka_home_product_card {
    display: block;
    text-decoration: none;
}
.yukka_home_product_card_photo {
    display: block;
    aspect-ratio: 290 / 654;
    background: #f2f2ee;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 14px;
}
.yukka_home_product_card_photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s ease;
}
.yukka_home_product_card:hover .yukka_home_product_card_photo img {
    transform: scale(1.05);
}
.yukka_home_product_card_name {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 700;
    color: var(--yukka-navy);
    margin-bottom: 4px;
}
.yukka_home_product_card_price {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 700;
    color: var(--yukka-ink);
}
@media (max-width: 991px) {
    .yukka_home_products_grid {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 575px) {
    .yukka_home_products_grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }
}

.yukka_home_use_cases,
.yukka_home_materials,
.yukka_home_projects {
    margin: 150px 0;
}
.yukka_home_kit {
    margin: 150px 0;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    padding: 100px 0;
    background: #f3f3f3;
}
.yukka_home_kit_inner {
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    gap: 42px;
    align-items: start;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 40px;
}
.yukka_home_kit_head p {
    max-width: 520px;
    margin: 0 0 24px;
    font-family: var(--yukka-font-body);
    font-size: 15px;
    line-height: 1.75;
    color: var(--yukka-text);
}
.yukka_home_kit_grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
}
.yukka_home_kit_item {
    padding: 24px;
    min-height: 190px;
    border: 1px solid var(--yukka-border);
    border-radius: 8px;
    background: var(--yukka-bg-product);
}
.yukka_home_kit_item span {
    display: block;
    margin-bottom: 28px;
    font-family: var(--yukka-font-display);
    font-size: 28px;
    color: var(--yukka-green-dark);
}
.yukka_home_kit_item strong {
    display: block;
    margin-bottom: 10px;
    font-family: var(--yukka-font-body);
    font-size: 15px;
    color: var(--yukka-navy);
}
.yukka_home_kit_item p {
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    line-height: 1.6;
    color: var(--yukka-muted);
}
.yukka_home_use_cases_grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.yukka_home_use_case {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: 245px;
    padding: 24px;
    border-radius: 8px;
    color: #fff;
    text-decoration: none;
    background-repeat: no-repeat;
    background-size: cover;
}
.yukka_home_use_case--svetlyj {
    background-image:
        linear-gradient(180deg, rgba(30, 28, 24, .1) 0%, rgba(30, 28, 24, .72) 100%),
        url('/images/goods/insterios/pd/emal/emal-01-slide-01.jpg');
    background-position: center;
}
.yukka_home_use_case--klassika {
    background-image:
        linear-gradient(180deg, rgba(30, 28, 24, .1) 0%, rgba(30, 28, 24, .72) 100%),
        url('/images/goods/insterios/pd/grand/grand-08-int.jpg');
    background-position: center;
}
.yukka_home_use_case--minimalizm {
    background-image:
        linear-gradient(180deg, rgba(30, 28, 24, .1) 0%, rgba(30, 28, 24, .72) 100%),
        url('/images/goods/insterios/pd/sovremennye/sovremennye-01-slide-01.jpg');
    background-position: center;
}
.yukka_home_use_case--premium {
    background-image:
        linear-gradient(180deg, rgba(30, 28, 24, .1) 0%, rgba(30, 28, 24, .72) 100%),
        url('/images/goods/insterios/pd/elite/elite-01-slide-01.jpg');
    background-position: center;
}
.yukka_home_use_case span {
    display: block;
    margin-bottom: 10px;
    font-family: var(--yukka-font-body);
    font-size: 16px;
    font-weight: 800;
}
.yukka_home_use_case p {
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 13px;
    line-height: 1.55;
    color: rgba(255, 255, 255, .82);
}
.yukka_home_use_case:hover {
    color: #fff;
}
.yukka_home_materials_grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}
.yukka_home_material {
    padding: 22px;    
    background: #fbfaf7;
    border-top: 2px solid var(--yukka-green-dark);
}
.yukka_home_material h3 {
    margin: 0 0 12px;
    font-family: var(--yukka-font-body);
    font-size: 15px;
    color: var(--yukka-navy);
}
.yukka_home_material p {
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    line-height: 1.65;
    color: var(--yukka-muted);
}
.yukka_home_projects_grid {
    display: grid;
    grid-template-columns: 1.7fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 20px;
    height: 720px;
}
.yukka_home_projects_card {
    position: relative;
    display: block;
    grid-column: 2;
    grid-row: span 1;
    background-size: cover;
    background-position: center;
    overflow: hidden;
}
.yukka_home_projects_card--main {
    grid-column: 1;
    grid-row: 1 / span 2;
}
.yukka_home_projects_card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(11, 15, 20, 0) 55%, rgba(11, 15, 20, .72) 100%);
    transition: background .25s ease;
}
.yukka_home_projects_card:hover::before {
    background: linear-gradient(180deg, rgba(11, 15, 20, 0) 40%, rgba(11, 15, 20, .8) 100%);
}
.yukka_home_projects_card_meta {
    position: absolute;
    z-index: 1;
    left: 28px;
    right: 28px;
    bottom: 24px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.yukka_home_projects_card_kicker {
    font-family: var(--yukka-font-body);
    font-size: 11px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .78);
}
.yukka_home_projects_card_title {
    font-family: var(--yukka-font-display);
    font-weight: 400;
    font-size: 24px;
    color: #fff;
}
@media (max-width: 991px) {
    .yukka_home_kit_inner {
        grid-template-columns: 1fr;
    }
    .yukka_home_use_cases_grid,
    .yukka_home_materials_grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 900px) {
    .yukka_home_projects_grid {
        grid-template-columns: 1fr;
        grid-template-rows: none;
        height: auto;
    }
    .yukka_home_projects_card {
        grid-column: 1;
        grid-row: auto;
        aspect-ratio: 4 / 3;
    }
    .yukka_home_projects_card--main {
        grid-column: 1;
        grid-row: auto;
        aspect-ratio: 5 / 4;
    }
}
@media (max-width: 575px) {
    .yukka_home_use_cases,
    .yukka_home_materials,
    .yukka_home_projects {
        margin: 64px 0;
    }
    .yukka_home_projects_card_title {
        font-size: 20px;
    }
    .yukka_home_kit {
        margin-top: 64px;
        margin-bottom: 64px;
        padding: 40px 0;
    }
    .yukka_home_kit_inner {
        padding: 0 20px;
    }
    .yukka_home_kit_grid,
    .yukka_home_use_cases_grid,
    .yukka_home_materials_grid {
        grid-template-columns: 1fr;
    }
    .yukka_home_use_case {
        min-height: 210px;
    }
}

@media (max-width: 767px) {
}

.yukka_home_why_grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
}
.yukka_home_why_item {
    padding-top: 20px;
    border-top: 2px solid var(--yukka-navy);
}
.yukka_home_why_title {
    font-family: var(--yukka-font-body);
    font-size: 15px;
    font-weight: 700;
    color: var(--yukka-navy);
    margin-bottom: 10px;
}
.yukka_home_why_desc {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    line-height: 1.65;
    color: var(--yukka-muted);
}
@media (max-width: 991px) {
    .yukka_home_why_grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }
}
@media (max-width: 480px) {
    .yukka_home_why_grid {
        grid-template-columns: 1fr;
    }
}

.yukka_home_dealer {
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr) minmax(240px, .45fr);
    gap: 34px;
    align-items: center;
    margin: 150px 0;
    padding: 44px;
    border: 1px solid var(--yukka-border);
    border-radius: 14px;
    background: #1f211e;
}
.yukka_home_dealer_mark {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 50%;
    font-family: var(--yukka-font-display);
    font-size: 31px;
    color: #d8c497;
}
.yukka_home_dealer_text .yukka_home_section_title {
    color: #fff;
}
.yukka_home_dealer_text p {
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 15px;
    line-height: 1.75;
    color: rgba(255, 255, 255, .72);
}
.yukka_home_dealer_facts {
    display: grid;
    gap: 12px;
}
.yukka_home_dealer_facts div {
    padding: 18px 20px;
    border-left: 2px solid #d8c497;
    background: rgba(255, 255, 255, .06);
}
.yukka_home_dealer_facts strong,
.yukka_home_dealer_facts span {
    display: block;
}
.yukka_home_dealer_facts strong {
    font-family: var(--yukka-font-display);
    font-size: 27px;
    font-weight: 400;
    color: #fff;
}
.yukka_home_dealer_facts span {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: rgba(255, 255, 255, .65);
}
@media (max-width: 900px) {
    .yukka_home_dealer {
        grid-template-columns: 1fr;
    }
    .yukka_home_dealer_mark {
        width: 130px;
    }
}
@media (max-width: 575px) {
    .yukka_home_dealer {
        margin: 64px 0;
        padding: 30px 22px;
    }
}

.yukka_home_production {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    min-height: 700px;
    margin: 150px 0;
    padding: 48px 0;
    overflow: hidden;
    background: var(--yukka-ink);
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}
.yukka_home_production_inner {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 40px;
}
.yukka_home_production_video_bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
}
.yukka_home_production_video_bg iframe {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: max(100vw, 177.78vh);
    height: max(56.25vw, 100vh);
    min-width: 100%;
    min-height: 100%;
    transform: translate(-50%, -50%);
    border: 0;
    pointer-events: none;
}
.yukka_home_production.is-fullscreen .yukka_home_production_video_bg iframe {
    pointer-events: auto;
}
.yukka_home_production_scrim {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(100deg, rgba(11, 15, 20, 0.88) 0%, rgba(11, 15, 20, 0.72) 38%, rgba(11, 15, 20, 0.25) 68%, rgba(11, 15, 20, 0) 100%);
}
.yukka_home_production_expand_btn {
    position: absolute;
    top: 24px;
    right: 24px;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.4);
    border-radius: 50%;
    background: rgba(11, 15, 20, 0.45);
    color: #fff;
    cursor: pointer;
    transition: background .2s ease, transform .2s ease;
}
.yukka_home_production_expand_btn:hover {
    background: var(--yukka-green);
    border-color: var(--yukka-green);
    transform: scale(1.06);
}
.yukka_home_production_expand_btn svg {
    width: 20px;
    height: 20px;
    margin-left: 2px;
}
.yukka_home_production_text {
    max-width: 560px;
}
.yukka_home_production_text .yukka_home_section_title {
    color: #fff;
}
.yukka_home_production_text p {
    font-family: var(--yukka-font-body);
    font-size: 15px;
    line-height: 1.75;
    color: rgba(255, 255, 255, 0.82);
    margin: 0 0 16px;
}
.yukka_home_production_text p:last-child {
    margin-bottom: 0;
}
.yukka_home_production_facts {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}
.yukka_home_production_facts span {
    padding: 8px 11px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.3);
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: #fff;
    backdrop-filter: blur(4px);
}
@media (max-width: 900px) {
    .yukka_home_production {
        min-height: 620px;
        padding: 32px 0;
    }
    .yukka_home_production_inner {
        padding: 0 32px;
    }
    .yukka_home_production_text {
        max-width: none;
    }
    .yukka_home_production_scrim {
        background: linear-gradient(180deg, rgba(11, 15, 20, 0.35) 0%, rgba(11, 15, 20, 0.55) 45%, rgba(11, 15, 20, 0.92) 100%);
    }
}
@media (max-width: 575px) {
    .yukka_home_production {
        margin: 64px 0;
        padding: 24px 0;
        min-height: 520px;
    }
    .yukka_home_production_inner {
        padding: 0 20px;
    }
    .yukka_home_production_expand_btn {
        top: 16px;
        right: 16px;
        width: 44px;
        height: 44px;
    }
}

.yukka_mobile_cta {
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: 12px;
    z-index: 9998;
    display: none;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 8px;
    border: 1px solid rgba(255, 255, 255, .5);
    border-radius: 12px;
    background: rgba(31, 33, 30, .92);
    box-shadow: 0 12px 36px rgba(0, 0, 0, .24);
    backdrop-filter: blur(12px);
}
.yukka_mobile_cta a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    border-radius: 8px;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
}
.yukka_mobile_cta a:first-child {
    background: #fff;
    color: #1f211e;
}
.yukka_mobile_cta a:last-child {
    background: #d8c497;
    color: #1f211e;
}
@media (max-width: 767px) {
    body.yukka-hero-page {
        padding-bottom: 72px;
    }
    .yukka_mobile_cta {
        display: grid;
    }
}

.yukka_home_about {
    margin: 150px 0;
    padding: 56px;
    background: var(--yukka-bg-product);
    border: 1px solid var(--yukka-border);
    border-radius: 14px;
}
.yukka_home_about_text {
    max-width: 720px;
    margin: 0 auto;
    text-align: center;
}
.yukka_home_about_text p {
    font-family: var(--yukka-font-body);
    font-size: 15px;
    line-height: 1.75;
    color: var(--yukka-text);
    margin: 0 0 22px;
}
.yukka_home_about_text .yukka_home_section_title {
    text-align: center;
}
@media (max-width: 575px) {
    .yukka_home_about {
        padding: 36px 24px;
    }
}

/* Во всю ширину экрана (фото до самого края), как на референсе —
   тот же приём 100vw + отрицательные margin, что и в других full-bleed
   секциях сайта (.yukka_home_kit, .yukka_home_production и т.д.). */
.yukka_home_salon {
    display: flex;
    align-items: stretch;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    margin-top: 150px;
    margin-bottom: 150px;
    min-height: 940px;
}
.yukka_home_salon_photo {
    position: relative;
    flex: 0 0 50%;
    overflow: hidden;
    background: #20221f;
}
.yukka_home_salon_slide {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: 80% center;
    opacity: 0;
    transform: scale(1.08);
    transition: opacity 1.2s ease;
}
.yukka_home_salon_slide.is-active {
    opacity: 1;
    animation: yukka-salon-zoom-out 6.5s ease-out forwards;
}
@keyframes yukka-salon-zoom-out {
    from {
        transform: scale(1.08);
    }
    to {
        transform: scale(1);
    }
}
.yukka_home_salon_content {
    flex: 0 0 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 min(8%, 120px);
}
.yukka_home_salon_title {
    font-family: var(--yukka-font-display);
    font-weight: 400;
    font-size: 36px;
    line-height: 1.2;
    color: var(--yukka-navy);
    margin: 14px 0 16px;
}
.yukka_home_salon_title em {
    font-family: var(--yukka-font-display);
    font-style: italic;
    font-weight: 400;
    color: var(--yukka-green-dark);
}
.yukka_home_salon_sub {
    font-family: var(--yukka-font-body);
    font-size: 15px;
    line-height: 1.6;
    color: var(--yukka-muted);
    margin: 0 0 32px;
    max-width: 420px;
}
.yukka_home_salon_table {
    margin-bottom: 28px;
}
.yukka_home_salon_row {
    display: flex;
    align-items: baseline;
    gap: 24px;
    padding: 14px 0;
    border-bottom: 1px solid var(--yukka-border);
}
.yukka_home_salon_label {
    flex: 0 0 140px;
    font-family: var(--yukka-font-body);
    font-size: 14px;    
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--yukka-green-dark);
}
.yukka_home_salon_value {
    font-family: var(--yukka-font-body);
    font-size: 14.5px;
    line-height: 1.5;
    color: var(--yukka-text);
    text-decoration: none;
}
.yukka_home_salon_phone {
    font-weight: 700;
    color: var(--yukka-navy);
}
.yukka_home_salon_phone:hover {
    color: var(--yukka-highlight);
}
.yukka_home_salon_panel {
    display: none;
}
.yukka_home_salon_panel.is-active {
    display: contents;
}
.yukka_home_salon_switch {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.yukka_home_salon_switch_btn {
    padding: 6px 14px;
    border: 1px solid var(--yukka-border);
    border-radius: 999px;
    background: none;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 700;
    color: var(--yukka-muted);
    cursor: pointer;
    transition: color .2s ease, border-color .2s ease, background .2s ease;
}
.yukka_home_salon_switch_btn:hover {
    color: var(--yukka-navy);
}
.yukka_home_salon_switch_btn.is-active {
    background: var(--yukka-ink);
    border-color: var(--yukka-ink);
    color: #fff;
}
.yukka_home_salon_content .yukka_home_popular_link {
    align-self: flex-start;
}
@media (max-width: 900px) {
    .yukka_home_salon {
        flex-direction: column;
        min-height: 0;
    }
    .yukka_home_salon_photo {
        flex-basis: auto;
        aspect-ratio: 4 / 3;
    }
    .yukka_home_salon_content {
        flex-basis: auto;
        padding: 40px 24px;
    }
}
@media (max-width: 575px) {
    .yukka_home_salon {
        margin-top: 64px;
        margin-bottom: 64px;
    }
    .yukka_home_salon_content {
        padding: 32px 20px;
    }
    .yukka_home_salon_label {
        flex-basis: 110px;
    }
}

.yukka_home_cta {
    background: var(--yukka-ink);
    border-radius: 16px;
    padding: 52px 56px 32px;
    margin: 150px 0;
}
.yukka_home_cta_inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    flex-wrap: wrap;
    padding-bottom: 28px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    margin-bottom: 22px;
}
.yukka_home_cta_title {
    font-family: var(--yukka-font-display);
    font-weight: 400;
    font-size: 28px;
    color: #fff;
    margin: 0 0 8px;
}
.yukka_home_cta_text p {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    color: rgba(255, 255, 255, 0.7);
    margin: 0;
}
.yukka_home_cta_phone {
    font-family: var(--yukka-font-display);
    font-size: 30px;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
}
.yukka_home_cta_phone:hover {
    color: rgba(255, 255, 255, 0.8);
}
.yukka_home_cta_links {
    display: flex;
    gap: 28px;
    flex-wrap: wrap;
}
.yukka_home_cta_links a {
    font-family: var(--yukka-font-body);
    font-size: 14px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.65);
    text-decoration: none;
}
.yukka_home_cta_links a:hover {
    color: #fff;
}
@media (max-width: 575px) {
    .yukka_home_cta {
        padding: 36px 24px 24px;
    }
    .yukka_home_cta_title {
        font-size: 22px;
    }
    .yukka_home_cta_phone {
        font-size: 22px;
    }
}

#mxcpr {
    display: none !important;
}

.back-to-top-link {
    color: var(--yukka-ink);
    border-color: var(--yukka-ink);
}
.back-to-top-link:hover,
.back-to-top-link:focus {
    color: #fff;
    background-color: var(--yukka-highlight);
    border-color: var(--yukka-highlight);
}

.yukka_stores_city_group {
    margin-bottom: 40px;
}
.yukka_stores_city_title {
    font-family: var(--yukka-font-display);
    font-size: 24px;
    font-weight: 400;
    color: var(--yukka-navy);
    margin: 0 0 20px;
}
.yukka_stores_grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 24px;
}
.yukka_store_card {
    display: flex;
    flex-direction: column;
    background: var(--yukka-bg-product);
    border: 1px solid var(--yukka-border);
    border-radius: 12px;
    padding: 24px;
}
.yukka_store_card_name {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: var(--yukka-font-body);
    font-size: 16px;
    font-weight: 700;
    color: var(--yukka-navy);
    margin: 0 0 14px;
}
.yukka_store_card_name svg {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
    color: var(--yukka-highlight);
}
.yukka_store_card_row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 14px;
    color: var(--yukka-text);
    line-height: 1.5;
    margin-bottom: 8px;
}
.yukka_store_card_row svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    margin-top: 1px;
    color: var(--yukka-muted);
}
.yukka_store_card_row.yukka_store_card_metro,
.yukka_store_card_row.yukka_store_card_hours {
    color: var(--yukka-muted);
}
.yukka_store_card_row.yukka_store_card_hours {
    margin-bottom: 16px;
}
.yukka_store_card_actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid var(--yukka-border);
}
.yukka_store_card_phone {
    font-family: var(--yukka-font-body);
    font-weight: 700;
    font-size: 15px;
    color: var(--yukka-navy);
    text-decoration: none;
}
.yukka_store_card_phone:hover {
    color: var(--yukka-highlight);
}
.yukka_store_card_map_link {
    font-size: 13px;
    font-weight: 600;
    color: var(--yukka-muted);
    text-decoration: none;
}
.yukka_store_card_map_link:hover {
    color: var(--yukka-highlight);
}
.yukka_stores_map {
    width: 100%;
    height: 480px;
    border-radius: 12px;
    overflow: hidden;
    margin-top: 40px;
    background: var(--yukka-border);
}
a.yukka_doors_menu_search_result:hover {
    box-shadow: 0 10px 26px rgba(4, 30, 66, 0.12);
    transform: translateY(-2px);
}
a.yukka_doors_menu_search_result {
    transition: box-shadow .2s ease, transform .2s ease;
    padding: 20px;
    border-radius: 10px;
}
.container-header nav {
  margin: 0px;
}
.container-header .grid-child {
  padding: 20px 0px;
}

body.yukka-about-page {
    background: #f7f7f5;
}
body.yukka-about-page .container-sidebar-left,
body.yukka-about-page .container-sidebar-right {
    display: none;
}
body.yukka-about-page .site-grid {
    grid-template-areas:
        ". banner banner banner banner ."
        ". top-a top-a top-a top-a ."
        ". top-b top-b top-b top-b ."
        ". comp comp comp comp ."
        ". bot-a bot-a bot-a bot-a ."
        ". bot-b bot-b bot-b bot-b .";
}
body.yukka-about-page .container-component {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 40px 90px;
}
body.yukka-about-page .mod-breadcrumbs__wrapper,
body.yukka-about-page .article-info,
body.yukka-about-page .pagenavigation {
    display: none;
}
body.yukka-about-page .com-content-article {
    background: transparent;
}
body.yukka-about-page .page-header {
    display: none;
}

/* Герой — та же прозрачная шапка-оверлей, что и на страницах коллекций
   (см. $hasHero/yukka-hero-page в templates/yukka/index.php), поэтому герой
   сам начинается с самого верха страницы. */
.yukka_about_hero {
    position: relative;
    width: 100vw;
    min-height: 640px;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    display: flex;
    align-items: flex-end;
    overflow: hidden;
}
.yukka_about_hero_slide {
    position: absolute;
    inset: 0;
    background: url('/images/about/o-kompanii-hero.jpg') center / cover no-repeat;
    transform: scale(1.06);
    animation: yukka-about-hero-kenburns 7s ease-out forwards;
}
@keyframes yukka-about-hero-kenburns {
    from {
        transform: scale(1.06);
    }
    to {
        transform: scale(1);
    }
}
.yukka_about_hero_overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(16, 18, 15, .05) 0%, rgba(16, 18, 15, .18) 55%, rgba(16, 18, 15, .78) 100%);
}
.yukka_about_hero_inner {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 40px 72px;
}
.yukka_about_hero_eyebrow {
    display: block;
    margin-bottom: 18px;
    font-family: var(--yukka-font-body);
    font-size: 13px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .78);
}
.yukka_about_hero_title {
    margin: 0;
    font-family: var(--yukka-font-display);
    font-size: clamp(48px, 6vw, 60px);
    font-weight: 400;
    line-height: .96;
    color: #fff;
}

.yukka_about_intro {
    max-width: 1320px;
    margin: 0 auto;
    padding: 90px 40px 0;
}
.yukka_about_lead {
    max-width: 760px;
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 23px;
    line-height: 1.55;
    color: var(--yukka-navy);
}

.yukka_about_stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
    max-width: 1320px;
    margin: 56px auto 0;
    padding: 40px 40px;
    border-top: 1px solid var(--yukka-border);
    border-bottom: 1px solid var(--yukka-border);
}
.yukka_about_stat {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.yukka_about_stat strong {
    font-family: var(--yukka-font-display);
    font-weight: 400;
    font-size: 40px;
    color: var(--yukka-navy);
}
.yukka_about_stat span {
    font-family: var(--yukka-font-body);
    font-size: 13px;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--yukka-muted);
}

.yukka_about_section {
    display: grid;
    grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
    gap: 70px;
    align-items: start;
    max-width: 1320px;
    margin: 0 auto;
    padding: 100px 40px 0;
}
.yukka_about_section h2 {
    position: sticky;
    top: 120px;
    margin: 0;
    font-family: var(--yukka-font-display);
    font-size: clamp(30px, 3.0vw, 30px);
    font-weight: 400;
    line-height: 1.04;
    color: var(--yukka-navy);
}
.yukka_about_section p {
    grid-column: 2;
    max-width: 680px;
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 17px;
    line-height: 1.85;
    color: var(--yukka-text);
}
.yukka_about_section a {
    color: var(--yukka-green-dark);
    font-weight: 700;
    text-decoration: none;
    border-bottom: 1px solid color-mix(in srgb, var(--yukka-green-dark) 32%, transparent);
}
.yukka_about_section a:hover {
    border-bottom-color: var(--yukka-green-dark);
}

.yukka_about_advantages_grid {
    grid-column: 2;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    max-width: 680px;
}
.yukka_about_advantage {
    padding: 26px 24px;
    border: 1px solid var(--yukka-border);
    border-radius: 8px;
    background: var(--yukka-bg-product);
}
.yukka_about_advantage_num {
    display: block;
    margin-bottom: 22px;
    font-family: var(--yukka-font-display);
    font-size: 24px;
    color: var(--yukka-green-dark);
}
.yukka_about_advantage_text {
    display: block;
    font-family: var(--yukka-font-body);
    font-size: 15px;
    line-height: 1.4;
    color: var(--yukka-navy);
}

.yukka_about_network {
    display: flex;
    align-items: stretch;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    margin-top: 120px;
    min-height: 560px;
    background: var(--yukka-gray);
}
.yukka_about_network_photo {
    flex: 0 0 46%;
    background: url('/images/salon/salon-yukka-02.jpg') center / cover no-repeat;
}
.yukka_about_network_text {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 22px;
    padding: 64px min(6%, 100px);
}
.yukka_about_network_text .yukka_home_kicker {
    color: var(--yukka-green);
    margin-bottom: 0;
}
.yukka_about_network_text h2 {
    margin: 0;
    font-family: var(--yukka-font-display);
    font-size: clamp(30px, 3vw, 44px);
    font-weight: 400;
    line-height: 1.1;
    color: var(--yukka-navy);
}
.yukka_about_network_text p {
    margin: 0;
    max-width: 460px;
    font-family: var(--yukka-font-body);
    font-size: 15.5px;
    line-height: 1.75;
    color: var(--yukka-text);
}
.yukka_about_network_text .yukka_home_factory_btn {
    margin-top: 6px;
}

@media (max-width: 991px) {
    body.yukka-about-page .container-component {
        padding: 0 28px 70px;
    }
    .yukka_about_hero {
        min-height: 460px;
    }
    .yukka_about_hero_inner {
        padding: 0 28px 56px;
    }
    .yukka_about_intro {
        padding: 64px 28px 0;
    }
    .yukka_about_lead {
        font-size: 19px;
    }
    .yukka_about_stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 28px;
        padding: 32px 28px;
    }
    .yukka_about_section {
        display: block;
        padding: 72px 28px 0;
    }
    .yukka_about_section h2 {
        position: static;
        margin-bottom: 28px;
    }
    .yukka_about_section p,
    .yukka_about_advantages_grid {
        grid-column: auto;
        max-width: none;
    }
    .yukka_about_network {
        flex-direction: column;
        min-height: 0;
    }
    .yukka_about_network_photo {
        flex-basis: auto;
        aspect-ratio: 16 / 10;
    }
    .yukka_about_network_text {
        padding: 48px 28px;
    }
}
@media (max-width: 575px) {
    body.yukka-about-page .container-component {
        padding: 0 20px 56px;
    }
    .yukka_about_hero {
        min-height: 400px;
    }
    .yukka_about_hero_inner {
        padding: 0 20px 40px;
    }
    .yukka_about_intro {
        padding: 48px 20px 0;
    }
    .yukka_about_lead {
        font-size: 17px;
    }
    .yukka_about_stats {
        padding: 28px 20px;
    }
    .yukka_about_stat strong {
        font-size: 32px;
    }
    .yukka_about_section {
        padding: 56px 20px 0;
    }
    .yukka_about_advantages_grid {
        grid-template-columns: 1fr;
    }
    .yukka_about_network_text {
        padding: 40px 20px;
    }
}

/* СТРАНИЦЫ "ОПЛАТА / СОТРУДНИЧЕСТВО / ДИЛЕРАМ / СТРОИТЕЛЯМ / СЕРВИС / ПОЛЕЗНО" —
   лёгкое карточное оформление (без герой-баннера, это не коллекция), весь
   HTML — прямо внутри introtext статьи, см. body.yukka-info-page ниже. */
body.yukka-info-page {
    background: var(--yukka-bg);
}
body.yukka-info-page .container-sidebar-left,
body.yukka-info-page .container-sidebar-right {
    display: none;
}
body.yukka-info-page .container-component {
    max-width: 980px;
    margin: 0 auto;
    padding: 0 40px 110px;
}
body.yukka-info-page .page-header,
body.yukka-info-page .article-info,
body.yukka-info-page .pagenavigation {
    display: none;
}
body.yukka-info-page .com-content-article {
    background: transparent;
}

.yukka_info_header {
    max-width: 720px;
    margin: 0 0 56px;
    padding: 64px 0 0;
}
.yukka_info_eyebrow {
    display: block;
    margin-bottom: 16px;
    font-family: var(--yukka-font-body);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--yukka-green-dark);
}
.yukka_info_title {
    margin: 0 0 18px;
    font-family: var(--yukka-font-display);
    font-size: clamp(32px, 4vw, 44px);
    font-weight: 400;
    line-height: 1.05;
    color: var(--yukka-navy);
}
.yukka_info_lead {
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 18px;
    line-height: 1.7;
    color: var(--yukka-text);
}

.yukka_info_section {
    margin: 0 0 64px;
}
.yukka_info_section:last-child {
    margin-bottom: 0;
}
.yukka_info_section_title {
    margin: 0 0 20px;
    font-family: var(--yukka-font-display);
    font-size: clamp(22px, 2.4vw, 26px);
    font-weight: 400;
    color: var(--yukka-navy);
}
.yukka_info_section_text {
    margin: 0 0 20px;
    font-family: var(--yukka-font-body);
    font-size: 16px;
    line-height: 1.8;
    color: var(--yukka-text);
}
.yukka_info_section_text:last-child {
    margin-bottom: 0;
}
.yukka_info_section_text a,
.yukka_info_list a {
    color: var(--yukka-green-dark);
    font-weight: 700;
    text-decoration: none;
    border-bottom: 1px solid color-mix(in srgb, var(--yukka-green-dark) 32%, transparent);
}
.yukka_info_section_text a:hover,
.yukka_info_list a:hover {
    border-bottom-color: var(--yukka-green-dark);
}

/* Карточки-преимущества (замена голых <ul>) — переиспользуем везде: методы
   оплаты, преимущества сотрудничества, сроки и т.п. */
.yukka_info_cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin: 0 0 20px;
    padding: 0;
    list-style: none;
}
.yukka_info_card {
    padding: 24px 26px;
    border: 1px solid var(--yukka-border);
    border-radius: 10px;
    background: var(--yukka-bg-product);
}
.yukka_info_card_title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 8px;
    font-family: var(--yukka-font-body);
    font-size: 16px;
    font-weight: 700;
    color: var(--yukka-navy);
}
.yukka_info_card_title svg {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    color: var(--yukka-green-dark);
}
.yukka_info_card_text {
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    line-height: 1.65;
    color: var(--yukka-text);
}

/* Простой список с точкой-акцентом — для перечислений внутри секции, где
   карточки были бы избыточны (правила хранения, пункты гарантии и т.п.). */
.yukka_info_list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 0 0 20px;
    padding: 0;
    list-style: none;
}
.yukka_info_list li {
    position: relative;
    padding-left: 22px;
    font-family: var(--yukka-font-body);
    font-size: 16px;
    line-height: 1.7;
    color: var(--yukka-text);
}
.yukka_info_list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 10px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--yukka-green-dark);
}
.yukka_info_list li strong {
    color: var(--yukka-navy);
}

/* Выделенный блок — для рассрочки Т-Банка и других акцентных врезок. */
.yukka_info_highlight {
    display: flex;
    gap: 24px;
    align-items: flex-start;
    padding: 32px 32px;
    border-radius: 12px;
    background: var(--yukka-navy);
    color: #fff;
}
.yukka_info_highlight_icon {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .12);
}
.yukka_info_highlight_icon svg {
    width: 26px;
    height: 26px;
    color: #fff;
}
.yukka_info_highlight_title {
    margin: 0 0 8px;
    font-family: var(--yukka-font-display);
    font-size: 22px;
    font-weight: 400;
    color: #fff;
}
.yukka_info_highlight_text {
    margin: 0 0 16px;
    font-family: var(--yukka-font-body);
    font-size: 15px;
    line-height: 1.7;
    color: rgba(255, 255, 255, .82);
}
.yukka_info_highlight_terms {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin: 0;
    padding: 20px 0 0;
    border-top: 1px solid rgba(255, 255, 255, .18);
    list-style: none;
}
.yukka_info_highlight_terms li {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.yukka_info_highlight_terms strong {
    font-family: var(--yukka-font-display);
    font-size: 22px;
    font-weight: 400;
    color: #fff;
}
.yukka_info_highlight_terms span {
    font-family: var(--yukka-font-body);
    font-size: 12px;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .6);
}

/* Хаб-навигация (карточки-ссылки) — "Сотрудничество" -> Дилерам/Строителям,
   "Сервис"/"Полезно" -> подразделы. */
.yukka_info_nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin: 0 0 20px;
    padding: 0;
    list-style: none;
}
.yukka_info_nav_link {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 26px 26px;
    border: 1px solid var(--yukka-border);
    border-radius: 10px;
    background: var(--yukka-bg-product);
    text-decoration: none;
    transition: border-color .15s ease, transform .15s ease;
}
.yukka_info_nav_link:hover {
    border-color: var(--yukka-green-dark);
    transform: translateY(-2px);
}
.yukka_info_nav_link_title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: var(--yukka-font-body);
    font-size: 17px;
    font-weight: 700;
    color: var(--yukka-navy);
}
.yukka_info_nav_link_title svg {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    color: var(--yukka-muted);
    transition: transform .15s ease;
}
.yukka_info_nav_link:hover .yukka_info_nav_link_title svg {
    transform: translateX(3px);
    color: var(--yukka-green-dark);
}
.yukka_info_nav_link_text {
    margin: 0;
    font-family: var(--yukka-font-body);
    font-size: 14px;
    line-height: 1.6;
    color: var(--yukka-muted);
}

/* Оглавление "Полезно" — быстрые якорные ссылки на подразделы. */
.yukka_info_toc {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 64px;
    padding: 0;
    list-style: none;
}
.yukka_info_toc a {
    display: inline-block;
    padding: 9px 16px;
    border: 1px solid var(--yukka-border);
    border-radius: 999px;
    font-family: var(--yukka-font-body);
    font-size: 13px;
    font-weight: 600;
    color: var(--yukka-navy);
    text-decoration: none;
    transition: border-color .15s ease, background .15s ease;
}
.yukka_info_toc a:hover {
    border-color: var(--yukka-green-dark);
    background: var(--yukka-tag-bg);
}

@media (max-width: 700px) {
    body.yukka-info-page .container-component {
        padding: 0 20px 80px;
    }
    .yukka_info_header {
        padding-top: 40px;
    }
    .yukka_info_cards,
    .yukka_info_nav {
        grid-template-columns: 1fr;
    }
    .yukka_info_highlight {
        flex-direction: column;
    }
    .yukka_info_highlight_terms {
        grid-template-columns: 1fr 1fr;
    }
}