/* Test-site integration for the approved header and its dark theme. */
moeller-site-header { display:block; position:relative; z-index:1000; width:100%; min-height:247px; }
@media (max-width:949px) and (min-width:501px) { moeller-site-header { min-height:605px; } }
@media (max-width:500px) { moeller-site-header { min-height:651px; } }

/* Keep the approved full-frame banner geometry: the artwork is always visible
   edge to edge and is never cropped. */
.image-cover > picture { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:#1235cc; }
.image-cover > picture > img {
    display:block; width:100%; height:100%; min-height:100%;
    object-fit:contain; object-position:center; transition:all .5s ease-in-out;
}

/* The top accent belongs to the boxed site sheet, never to the wallpaper. */
.page.boxed { border-top: 0 !important; }
.page.boxed > .wrapper { border-top: 3px solid var(--ml-blue, #0084eb) !important; }

html.moeller-dark,
html.moeller-dark body,
html.moeller-dark .page,
html.moeller-dark .wrapper {
    background: #0d1117 !important;
    color: #d9e2ec !important;
}

@media (min-width: 1240px) {
    .page.boxed {
        background-image: url(/optimized-asset.php?f=design%2Fmoeller_2%2Fimages%2Fbg-boxed.jpg&v=20260920-r2);
        background-image: image-set(
            url(/optimized-asset.php?f=design%2Fmoeller_2%2Fimages%2Fbg-boxed.webp&v=20260920-r2) type("image/webp"),
            url(/optimized-asset.php?f=design%2Fmoeller_2%2Fimages%2Fbg-boxed.jpg&v=20260920-r2) type("image/jpeg")
        );
    }
    html.moeller-dark .page.boxed {
        background-color: #080d13 !important;
        background-image: linear-gradient(rgba(5, 11, 18, .72), rgba(5, 11, 18, .72)), url(/optimized-asset.php?f=design%2Fmoeller_2%2Fimages%2Fbg-boxed.jpg&v=20260920-r2) !important;
        background-image: linear-gradient(rgba(5, 11, 18, .72), rgba(5, 11, 18, .72)), image-set(
            url(/optimized-asset.php?f=design%2Fmoeller_2%2Fimages%2Fbg-boxed.webp&v=20260920-r2) type("image/webp"),
            url(/optimized-asset.php?f=design%2Fmoeller_2%2Fimages%2Fbg-boxed.jpg&v=20260920-r2) type("image/jpeg")
        ) !important;
        background-position: 30% 0 !important;
        background-size: cover !important;
        background-repeat: no-repeat !important;
        background-attachment: fixed !important;
    }
}

html.moeller-dark #fn_content,
html.moeller-dark .fn_content,
html.moeller-dark .container,
html.moeller-dark .content,
html.moeller-dark .product,
html.moeller-dark .product-item,
html.moeller-dark .block,
html.moeller-dark .post_aside,
html.moeller-dark footer,
html.moeller-dark #footer {
    color: #d9e2ec;
}

html.moeller-dark h1,
html.moeller-dark h2,
html.moeller-dark h3,
html.moeller-dark h4,
html.moeller-dark h5,
html.moeller-dark h6,
html.moeller-dark .title,
html.moeller-dark .name,
html.moeller-dark label {
    color: #f1f5f9 !important;
}

html.moeller-dark a:not(.button):not(.btn) { color: #79c5ff; }
html.moeller-dark input,
html.moeller-dark select,
html.moeller-dark textarea {
    color: #e8edf5 !important;
    background: #18212c !important;
    border-color: #344356 !important;
}

html.moeller-dark .product,
html.moeller-dark .product-item,
html.moeller-dark .fn_product,
html.moeller-dark .item,
html.moeller-dark .sidebar,
html.moeller-dark .post_aside {
    border-color: #2d3a49 !important;
}

html.moeller-dark .bg-white,
html.moeller-dark [class*="bg_white"] {
    background-color: #151d27 !important;
}

html.moeller-dark #promo_calc,
html.moeller-dark #our_pluses,
html.moeller-dark #items_pluses,
html.moeller-dark .breadcrumbs,
html.moeller-dark .products-toolbar,
html.moeller-dark .filter_group,
html.moeller-dark .form,
html.moeller-dark .z_day,
html.moeller-dark #footer {
    color: #d9e2ec !important;
    background: #151d27 !important;
    border-color: #2d3a49 !important;
}

html.moeller-dark #items_pluses {
    background: #111923 !important;
}

html.moeller-dark #items_pluses .title,
html.moeller-dark #items_pluses p {
    color: #d9e2ec !important;
}

html.moeller-dark .product-item .fn_variants,
html.moeller-dark .product .fn_variants,
html.moeller-dark article table thead,
html.moeller-dark .table thead,
html.moeller-dark .table-striped tbody tr:nth-of-type(odd),
html.moeller-dark .table-striped tbody tr:nth-of-type(even) {
    color: #d9e2ec !important;
    background: #151d27 !important;
    border-color: #334154 !important;
}

html.moeller-dark .table th,
html.moeller-dark .table td,
html.moeller-dark .features_inline .line {
    border-color: #334154 !important;
}

html.moeller-dark .grid-products .fn_transfer,
html.moeller-dark #posts .p-image,
html.moeller-dark .product-item .product_image > .image,
html.moeller-dark .product-item .product_images .item,
html.moeller-dark #page_cats .lev1 > div > .image,
html.moeller-dark .amount,
html.moeller-dark .image-b {
    color: #d9e2ec !important;
    background: #18212c !important;
    border-color: #334154 !important;
    box-shadow: 0 0 0 1px #334154 !important;
}

/* Quantity controls use the same dark control palette as the surrounding
   product form instead of the legacy white circular buttons. */
html.moeller-dark .amount .plus,
html.moeller-dark .amount .minus {
    color: #d9e2ec !important;
    background: #344154 !important;
    box-shadow: inset 0 0 0 1px #4a5a70;
}
html.moeller-dark .amount .plus:hover,
html.moeller-dark .amount .minus:hover {
    color: #fff !important;
    background: var(--ml-blue) !important;
}

html.moeller-dark .grid-products .product_name,
html.moeller-dark #aside_items a,
html.moeller-dark .product .annotation,
html.moeller-dark .product .variant_name,
html.moeller-dark #footer a { color: #d9e2ec !important; }

html.moeller-dark #aside_items > ul > li > a:hover,
html.moeller-dark .products-toolbar a {
    background: #202b38 !important;
    color: #79c5ff !important;
}

html.moeller-dark img { color-scheme: light; }

html.moeller-dark #ya_map .map,
html.moeller-dark #ya_map iframe {
    filter: invert(90%) hue-rotate(180deg) saturate(70%) brightness(84%) contrast(90%) !important;
}

/* Calculator: compact, square-edged and visually tied to the new header. */
#promo_calc .calc {
    align-self: stretch;
    padding: 24px 26px !important;
    background: #f3f6f9;
    border-right: 1px solid #d8e0e8;
}

#promo_calc .calc .fn_variants {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 12px;
    margin: 0;
}

#promo_calc .calc .fn_variants > [class*="col-"] {
    width: auto;
    max-width: none;
    padding-left: 0;
    padding-right: 0;
}

#promo_calc .calc .fn_variants > .col-12,
#promo_calc .calc .calc-result,
#promo_calc .calc .calc-submit { grid-column: 1 / -1; }

#promo_calc .calc .calc-result .price {
    min-height: 30px;
    padding: 4px 0 0;
    font-size: 22px;
}

#promo_calc .calc .title {
    margin: 0 0 14px !important;
    padding-left: 12px;
    border-left: 3px solid #008af5;
    line-height: 1.25;
}

#promo_calc .calc .form_group { margin: 5px 0 !important; }
#promo_calc .calc .calc-label {
    display: block;
    margin: 0 0 5px;
    color: #66758a !important;
    font-family: "Exo 2", Helvetica, Arial, sans-serif;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: .45px;
    text-transform: uppercase;
}
#promo_calc .calc select,
#promo_calc .calc input:not(.button) {
    height: 44px !important;
    border: 1px solid #d8e0e8 !important;
    border-radius: 2px !important;
    background-color: #fff !important;
    box-shadow: inset 0 1px 2px rgba(20, 41, 61, .04);
    font-family: "Exo 2", Helvetica, Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 500;
    letter-spacing: 0;
}

#promo_calc .calc select {
    -webkit-appearance: none;
    appearance: none;
    padding-right: 42px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%2366758a' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 15px center !important;
    background-size: 12px 8px !important;
}

#promo_calc .calc select:focus,
#promo_calc .calc input:not(.button):focus {
    border-color: #008af5 !important;
    box-shadow: 0 0 0 2px rgba(0, 138, 245, .12) !important;
}

#promo_calc .calc input.button {
    height: 44px !important;
    color: #fff !important;
    background: linear-gradient(180deg, #0797ff 0%, #0084eb 100%) !important;
    border: 1px solid #0076d1 !important;
    border-radius: 2px !important;
    box-shadow: 0 2px 5px rgba(0, 90, 160, .18) !important;
}

#promo_calc .calc input.button:hover {
    background: linear-gradient(180deg, #008df2 0%, #0078d7 100%) !important;
}

html.moeller-dark #promo_calc .calc {
    background: #121a24 !important;
    border-color: #2d3a49 !important;
}

html.moeller-dark #promo_calc .calc select,
html.moeller-dark #promo_calc .calc input:not(.button) {
    color: #e8edf5 !important;
    background-color: #182330 !important;
    border-color: #334154 !important;
}

html.moeller-dark #promo_calc .calc .calc-label { color: #91a0b4 !important; }

/* 05.09.2026 visual-system pass: preserve layout, remove accumulated drift. */
:root {
    --ml-blue: #0084eb;
    --ml-blue-hover: #0078d7;
    --ml-red: #ff6363;
    --ml-bg: #ffffff;
    --ml-text: #2c3e50;
    --ml-muted: #667085;
    --ml-border: #d8e0e8;
    --ml-surface: #f3f6f9;
    --ml-surface-raised: #ffffff;
    --ml-field: #ffffff;
    --ml-photo-mat: #ffffff;
    --ml-focus: rgba(0, 132, 235, .22);
}

/* 06.09.2026 polish after live visual review. */

/* Light and dark footers follow the page theme; only the top blue rule remains
   as the visual bridge from content to service information. */
html:not(.moeller-dark) #footer {
    background: #f4f7fa !important;
    color: var(--ml-muted) !important;
    border-top-color: var(--ml-blue) !important;
}
html:not(.moeller-dark) #footer .title { color: var(--ml-text) !important; }
html:not(.moeller-dark) #footer nav > ul > li { border-bottom-color: var(--ml-border); }
html:not(.moeller-dark) #footer nav > ul > li > a { color: #58687a !important; }
html:not(.moeller-dark) #footer nav > ul > li > a:hover { color: var(--ml-blue) !important; }
html:not(.moeller-dark) #footer .copyright {
    border-top-color: var(--ml-border);
    color: #748296 !important;
}

/* Benefit sections are open editorial rows, not a table of boxed cards. */
#our_pluses,
#items_pluses {
    border-top: 1px solid var(--ml-border) !important;
    background: var(--ml-surface-raised) !important;
}
#items_pluses { background: var(--ml-surface) !important; }
#our_pluses .row { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 34px; }
#items_pluses .row { grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 24px 18px; }
#our_pluses .item,
#items_pluses .row > div {
    min-height: 0;
    padding: 0 !important;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 11px;
    overflow: visible;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    text-align: center;
}
#our_pluses .item:hover,
#items_pluses .row > div:hover {
    border: 0 !important;
    box-shadow: none !important;
    transform: translateY(-2px);
}
#our_pluses .image,
#items_pluses .image,
html.moeller-dark #our_pluses .image,
html.moeller-dark #items_pluses .image {
    display: flex !important;
    width: 78px;
    height: 76px;
    min-width: 78px;
    margin: 0 !important;
    padding: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none !important;
}
#our_pluses .image img,
#items_pluses .image img {
    filter: saturate(.94) contrast(.98);
    transition: transform .18s ease, filter .18s ease;
}
#our_pluses .item:hover .image img,
#items_pluses .row > div:hover .image img { transform: scale(1.035); filter: saturate(1) contrast(1); }
html.moeller-dark #our_pluses .image img,
html.moeller-dark #items_pluses .image img { filter: saturate(.86) brightness(.92) contrast(1.02); }
#our_pluses .item > span:last-child,
#items_pluses .title {
    width: 100%;
    color: var(--ml-text) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    text-align: center !important;
}

/* Accessories are two clean tap targets with a stable rhythm. */
.catalog-aside--accessories > ul {
    display: block !important;
    margin: 0 !important;
    padding: 8px 12px 12px !important;
}
.catalog-aside--accessories > ul > li {
    display: block !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}
.catalog-aside--accessories > ul > li + li { border-top: 1px solid var(--ml-border); }
.catalog-aside--accessories > ul > li > a {
    display: flex !important;
    min-height: 42px;
    padding: 10px 24px 10px 6px !important;
    align-items: center;
    border: 0 !important;
    font-size: 14px !important;
    line-height: 1.35 !important;
}

/* Offers start without an extra rule; the blue divider belongs to the actual
   transition after News and before the editorial/benefit area. */
.special-offers-section > .container {
    position: relative;
    padding-top: 28px;
    border-top: 0;
}
.special-offers-section > .container::before {
    content: none;
    display: none;
}
.special-offers-section { margin-bottom: 0 !important; }

/* Product description headings use the same content axis as the product name
   and related-products heading; legacy p-sm added an orphan five-pixel inset. */
.ProductView .readmore_js.p-sm { padding-left:0 !important; padding-right:0 !important; }

/* Round hit/new badges remain compact; the wide sale ribbon keeps its native
   aspect ratio so its text is readable and the bitmap is not crushed. */
.grid-products .promo_img[src*="vsale"] {
    top: 8px !important;
    right: 8px !important;
    width: 160px !important;
    height: auto !important;
    max-width: calc(100% - 20px) !important;
    max-height: 42px !important;
    image-rendering: auto;
}

/* Product photos use a clean white studio mat in the light theme. */
html:not(.moeller-dark) .grid-products .preview_image,
html:not(.moeller-dark) .product-item .product_image > .image,
html:not(.moeller-dark) #page_cats .lev1 > div > .image {
    background: #fff !important;
    box-shadow: none !important;
}

/* Native callback form restyled to match the route/pass dialogs. */
#fn_callback.popup {
    width: min(430px, calc(100vw - 32px));
    padding: 24px !important;
    border: 0 !important;
    border-radius: 2px;
    background: var(--ml-surface-raised) !important;
    color: var(--ml-text) !important;
    box-shadow: 0 22px 60px rgba(18, 38, 58, .24);
}
#fn_callback .popup_heading {
    margin: 0 0 20px !important;
    padding-right: 34px;
    color: var(--ml-text) !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.25;
    text-transform: none !important;
}
#fn_callback .form_group { margin-bottom: 12px; }
#fn_callback .form_input,
#fn_callback .form_textarea {
    width: 100%;
    min-height: 46px;
    padding: 11px 13px !important;
    border: 1px solid var(--ml-border) !important;
    border-radius: 2px;
    background: var(--ml-field) !important;
    color: var(--ml-text) !important;
    font: 400 14px/1.4 "Exo 2", Arial, sans-serif;
    box-shadow: none !important;
}
#fn_callback .form_textarea { min-height: 96px; resize: vertical; }
#fn_callback .form_input:focus,
#fn_callback .form_textarea:focus {
    border-color: var(--ml-blue) !important;
    box-shadow: 0 0 0 3px var(--ml-focus) !important;
    outline: 0;
}
#fn_callback input.button {
    width: 100%;
    min-height: 46px;
    margin-top: 4px;
    border: 1px solid var(--ml-blue-hover) !important;
    border-radius: 2px;
    background: var(--ml-blue) !important;
    color: #fff !important;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
}
#fn_callback label.error {
    display: block;
    margin-top: 5px;
    color: #e55252 !important;
    font-size: 12px;
}
html.moeller-dark .fancybox-bg { background: #060a0f; }
html.moeller-dark #fn_callback.popup { box-shadow: 0 24px 70px rgba(0, 0, 0, .52); }
.fancybox-container .fancybox-close-small {
    top:12px !important;
    right:12px !important;
    width:32px;
    height:32px;
    padding:0 !important;
    background:transparent !important;
}
.fancybox-container .fancybox-close-small::after {
    content:'×';
    top:0;
    right:0;
    width:32px;
    height:32px;
    border:0 !important;
    border-radius:50%;
    background:#fff !important;
    color:#667085 !important;
    font:400 20px/32px Arial, sans-serif;
    box-shadow:0 2px 8px rgba(0,0,0,.14);
    transition:color .18s ease, transform .18s ease, background-color .18s ease;
}
.fancybox-container .fancybox-close-small:hover::after {
    background:#fff !important;
    color:#ff525d !important;
    transform:rotate(90deg);
}
html.moeller-dark body .fancybox-container .fancybox-close-small::after {
    border:0 !important;
    background:#232d3a !important;
    color:#cfd8e3 !important;
}
html.moeller-dark body .fancybox-container .fancybox-close-small:hover::after {
    background:#232d3a !important;
    color:#ff6b74 !important;
}
.fancybox-slide .popup { animation:ml-dialog-in .22s ease; }
@keyframes ml-dialog-in {
    from { opacity:0; transform:translateY(14px) scale(.985); }
    to { opacity:1; transform:none; }
}

@media (max-width: 1199px) {
    #items_pluses .row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    #our_pluses .row,
    #items_pluses .row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; }
    #our_pluses .item,
    #items_pluses .row > div { min-height: 0; }
}

body {
    font-family: "Exo 2", Helvetica, Arial, sans-serif;
    color: var(--ml-text);
}

/* One heading system for calculator, promotions and news. */
.section-heading,
#promo_calc .calc .section-heading {
    display: flex;
    min-height: 25px;
    margin: 0 0 18px !important;
    padding: 0 0 0 13px !important;
    align-items: baseline;
    gap: 12px;
    border: 0 !important;
    border-left: 3px solid var(--ml-blue) !important;
    color: var(--ml-text) !important;
    font-family: "Exo 2", Helvetica, Arial, sans-serif;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: -.015em;
    text-transform: uppercase;
}
.section-heading > span,
html.moeller-dark .section-heading > span {
    color: inherit !important;
    font: inherit;
    letter-spacing: inherit;
}
.section-heading small {
    color: var(--ml-muted) !important;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
}
.section-heading::before,
.section-heading::after {
    display: none !important;
    content: none !important;
}

/* Promotions use the same heading row, with a quiet text action on the right. */
.relative > .container:has(> .special-section-title) { position: relative; }
.special-section-title + .title_block_text {
    position: absolute;
    top: 2px;
    right: 15px;
    margin: 0 !important;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 21px;
}
.special-section-title + .title_block_text a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 0 !important;
    color: var(--ml-blue) !important;
}
.special-section-title + .title_block_text a::after {
    content: '';
    width: 6px;
    height: 6px;
    border-top: 1.5px solid currentColor;
    border-right: 1.5px solid currentColor;
    transform: rotate(45deg);
}

.page_header,
.title_block,
#posts .title,
.grid-products .product_name { letter-spacing: -.015em; }

#promo_calc .calc .title {
    padding-left: 13px;
    border-left-width: 3px;
}

/* The grid reset above removes padding from every Bootstrap column.  Restore
   the intentional gap specifically for the calculator heading. */
#promo_calc .calc .fn_variants > .title {
    padding-left: 13px !important;
}

#promo_calc .calc .calc-label { font-size: 11px; }

body:not(.MainView) #promo_calc .calc { padding: 16px 22px !important; }
body:not(.MainView) #promo_calc .calc .title {
    margin-bottom: 8px !important;
    font-size: 19px;
}
body:not(.MainView) #promo_calc .calc .form_group { margin: 3px 0 !important; }
body:not(.MainView) #promo_calc .calc select,
body:not(.MainView) #promo_calc .calc input:not(.button) { height: 40px !important; }
body:not(.MainView) #promo_calc .calc input.button { height: 40px !important; }
body:not(.MainView) #bnrs_header,
body:not(.MainView) #bnrs_header .banner-item { max-height: 272px; overflow: hidden; }
body:not(.MainView) #bnrs_header .banner-item img { min-height: 272px; object-fit: cover; }

html.moeller-dark #bnrs_header .banner-item img {
    filter: brightness(.72) saturate(.82) contrast(.94);
}

/* Product detail: clearer reading column and calmer purchase surface. */
.product-item > .row { align-items: flex-start; }
.product-item .product_details { padding-right: 24px; }
.product-item .features_inline { max-width: 100%; line-height: 1.4; }
.product-item .features_inline .name { width: 43%; }
.product-item .features_inline .value { width: 57%; }
.product-item .fn_variants {
    margin-top: 18px;
    padding: 22px;
    border-width: 1px;
    border-color: var(--ml-border);
    background: var(--ml-surface);
}
.product-item .product_image > .image { border-width: 1px; }
.product-item .price_container { letter-spacing: -.025em; }

/* Variant table: rows are scannable and actions remain subordinate to price. */
.fn_variants .table {
    border: 1px solid var(--ml-border);
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
}
.fn_variants .table thead { background: var(--ml-surface); }
.fn_variants .table th {
    padding: 10px 12px;
    color: var(--ml-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .4px;
    text-transform: uppercase;
}
.fn_variants .table td { padding: 9px 12px; vertical-align: middle; }
.fn_variants .table tr:hover { background: rgba(0,132,235,.07); }
.fn_variants .table tr:hover,
.fn_variants .table tr:hover label { color: inherit !important; }
.fn_variants .table .button.btn-sm {
    min-width: 86px;
    min-height: 38px;
    padding: 8px 12px;
    border-radius: 2px;
    font-size: 13px !important;
    line-height: 1.2;
}

/* News and blog cards share one image ratio and predictable title height. */
#posts .posts_block { gap: 0; }
#posts .posts_block > div { padding: 12px; }
#posts .p-image {
    height: 176px;
    margin: 0 0 10px;
    overflow: hidden;
    border: 1px solid var(--ml-border);
    background: var(--ml-surface);
}
#posts .p-image img {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    object-fit: cover;
    object-position: center;
}
#posts .p-date { top: 13px; left: 13px; padding: 3px 8px; }
#posts .title {
    min-height: 2.5em;
    margin: 0;
    font-size: 16px;
    line-height: 1.25;
}
#posts .title a { text-decoration: none; }
#posts .p-text { margin-top: 8px; line-height: 1.45; }

.cart-empty {
    margin: 8px 0 42px;
    padding: 32px;
    text-align: center;
    border: 1px solid var(--ml-border);
    background: var(--ml-surface);
}
.cart-empty__icon {
    width: 42px;
    height: 42px;
    margin: 0 auto 12px;
    border: 2px solid var(--ml-blue);
    border-radius: 50%;
    color: var(--ml-blue);
    font-size: 22px;
    line-height: 38px;
}
.cart-empty h2 { margin: 0 0 8px; font-size: 22px; }
.cart-empty p { margin: 0 auto 20px; max-width: 520px; color: var(--ml-muted); }
.cart-empty__action {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    color: #fff !important;
    background: var(--ml-blue) !important;
    border-color: #0076d1 !important;
}
.cart-empty__action:hover { color: #fff !important; background: var(--ml-blue-hover) !important; }

html.moeller-dark {
    --ml-bg: #0d1117;
    --ml-text: #d9e2ec;
    --ml-muted: #91a0b4;
    --ml-border: #334154;
    --ml-surface: #151d27;
    --ml-surface-raised: #18212c;
    --ml-field: #182330;
    --ml-photo-mat: #1b2633;
    --ml-focus: rgba(121, 197, 255, .28);
}
html.moeller-dark .cart-empty,
html.moeller-dark #posts .p-image { background: #151d27; border-color: #334154; }
html.moeller-dark .fn_variants .table tr:hover { background: rgba(121,197,255,.08) !important; }

/* Audit closure 05.09.2026: semantic palette and residual dark states. */
.page_header,
.title_block,
#posts > .container > .title_block,
#posts .title,
#posts .title a {
    color: var(--ml-text) !important;
}

.title_block span,
#posts > .container > .title_block span,
.price,
.fn_price { color: var(--ml-blue) !important; }

.fn_old_price,
.old_price { color: var(--ml-muted) !important; }

.button,
.btn-info {
    border-color: var(--ml-blue-hover) !important;
    border-radius: 2px !important;
}

.button:focus-visible,
.btn:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--ml-blue) !important;
    outline-offset: 2px;
    box-shadow: 0 0 0 3px var(--ml-focus) !important;
}

html.moeller-dark .content,
html.moeller-dark #fn_content,
html.moeller-dark #posts,
html.moeller-dark .products-toolbar,
html.moeller-dark .product-item,
html.moeller-dark .post_aside,
html.moeller-dark .form {
    color: var(--ml-text) !important;
    border-color: var(--ml-border) !important;
}

html.moeller-dark #posts .title,
html.moeller-dark #posts .title a,
html.moeller-dark .title_block,
html.moeller-dark .title_block span,
html.moeller-dark .page_header {
    color: #e8edf5 !important;
}

html.moeller-dark .fn_old_price,
html.moeller-dark .old_price {
    color: #aeb9c8 !important;
    text-decoration-color: #7f8da0;
}

html.moeller-dark .p-date {
    color: #ffffff !important;
    background: #006fbd !important;
}

/* Carousel controls remain visible and tappable in both themes. */
.slick-prev,
.slick-next {
    width: 38px !important;
    height: 38px !important;
    border: 1px solid var(--ml-border) !important;
    border-radius: 2px !important;
    background: var(--ml-surface-raised) !important;
    color: var(--ml-text) !important;
    opacity: .92;
}
.slick-prev:hover,
.slick-next:hover {
    border-color: var(--ml-blue) !important;
    color: var(--ml-blue) !important;
    opacity: 1;
}
.slick-prev:before,
.slick-next:before { color: currentColor !important; opacity: 1 !important; }
.slick-dots li,
.slick-dots li button { min-width: 28px; min-height: 28px; }
.slick-dots li button:before { color: var(--ml-muted) !important; opacity: .8 !important; }
.slick-dots li.slick-active button:before { color: var(--ml-blue) !important; opacity: 1 !important; }

/* Product photography uses one deliberate neutral studio mat.  This removes
   the random light rectangles caused by mixed transparent and baked assets. */
.grid-products .preview_image,
.product-item .product_image > .image {
    background: var(--ml-photo-mat) !important;
    border-color: var(--ml-border) !important;
}
html.moeller-dark .grid-products .preview_image,
html.moeller-dark .product-item .product_image > .image {
    background: var(--ml-photo-mat) !important;
    border-color: var(--ml-border) !important;
}
.grid-products .preview_image {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.grid-products .preview_image > .fn_img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

/* Contact content reads as designed UI, not raw CMS data. */
.FeedbackView .contact-content a:not(.button),
.FeedbackView #fn_content a:not(.button) {
    color: var(--ml-blue) !important;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}
.FeedbackView .form-label {
    display: block;
    margin: 0 0 6px;
    color: var(--ml-text) !important;
    font-size: 13px;
    font-weight: 600;
}
.FeedbackView .form_group { margin-bottom: 14px; }
.FeedbackView .form_input,
.FeedbackView .form_textarea {
    min-height: 42px;
    border-color: var(--ml-border) !important;
    background: var(--ml-field) !important;
}
.FeedbackView .captcha {
    display: grid;
    grid-template-columns: minmax(110px, 1fr) minmax(110px, auto);
    gap: 8px 12px;
    align-items: end;
    margin-bottom: 14px;
}
.FeedbackView .captcha .form-label { grid-column: 1 / -1; margin-bottom: -2px; }
.FeedbackView .captcha .secret_number {
    min-height: 42px;
    padding: 10px 14px;
    color: var(--ml-text) !important;
    background: var(--ml-surface) !important;
    border: 1px solid var(--ml-border) !important;
    border-radius: 2px;
    line-height: 20px;
}

html.moeller-dark .FeedbackView .contact-content a:not(.button),
html.moeller-dark .FeedbackView #fn_content a:not(.button) { color: #79c5ff !important; }
html.moeller-dark .FeedbackView .form_input,
html.moeller-dark .FeedbackView .form_textarea { background: var(--ml-field) !important; }

/* Catalog landing: keep the current information architecture, but present
   first-level categories as a coherent, commercial card grid. */
#page_cats { margin: 24px 0 36px; }
#page_cats .lev1 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    align-items: stretch;
}
#page_cats .lev1 > div {
    position: relative;
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    min-width: 0;
    min-height: 132px;
    margin: 0;
    padding: 14px;
    align-items: center;
    border: 1px solid var(--ml-border);
    background: var(--ml-surface-raised);
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
#page_cats .lev1 > div:hover {
    border-color: var(--ml-blue);
    box-shadow: 0 6px 18px rgba(21, 48, 72, .10);
    transform: translateY(-1px);
}
#page_cats .lev1 > div > .image {
    width: 112px;
    height: 96px;
    padding: 8px;
    border-color: var(--ml-border);
    border-radius: 2px;
    background: var(--ml-photo-mat);
}
#page_cats .lev1 > div > .image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
#page_cats .lev1 > div > .item_list {
    min-width: 0;
    margin: 0 0 0 14px;
}
#page_cats .lev1 > div > .item_list:not(.subcat) { padding-top: 0; }
#page_cats .lev1 > div > .item_list > .name {
    color: var(--ml-text);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
    text-decoration: none;
}
#page_cats .lev1 > div > .item_list > .name::after {
    content: "";
    position: absolute;
    inset: 0;
}
#page_cats .lev2 { position: relative; z-index: 1; }
#page_cats .lev2 .name { color: var(--ml-muted); }
html.moeller-dark #page_cats .lev1 > div { box-shadow: none; }
html.moeller-dark #page_cats .lev1 > div:hover { box-shadow: 0 8px 22px rgba(0, 0, 0, .24); }

@media (max-width: 1100px) {
    #page_cats .lev1 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
    #page_cats .lev1 { grid-template-columns: 1fr; }
}

/* Homepage news: convert the old detached image/text pairs into complete,
   scannable cards while keeping the existing content and destinations. */
.MainView #posts .news-section-title,
.FeedbackView #posts .news-section-title {
    display: flex;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 18px;
}
.MainView #posts .news-section-title small,
.FeedbackView #posts .news-section-title small {
    color: var(--ml-muted);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
}
.MainView #posts .posts_inline,
.FeedbackView #posts .posts_inline {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}
.MainView #posts .posts_inline::after,
.FeedbackView #posts .posts_inline::after { display: none; }
.MainView #posts .posts_inline > .p-item,
.FeedbackView #posts .posts_inline > .p-item {
    display: flex;
    width: auto;
    min-width: 0;
    min-height: 310px;
    margin: 0;
    padding: 0 0 14px;
    flex-direction: column;
    border: 1px solid var(--ml-border);
    background: var(--ml-surface-raised);
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.MainView #posts .posts_inline > .p-item:hover,
.FeedbackView #posts .posts_inline > .p-item:hover {
    border-color: var(--ml-blue);
    box-shadow: 0 7px 20px rgba(21, 48, 72, .10);
    transform: translateY(-1px);
}
.MainView #posts .posts_inline .p-image,
.FeedbackView #posts .posts_inline .p-image {
    width: 100%;
    min-width: 0;
    height: 168px;
    margin: 0;
    border: 0;
    border-bottom: 1px solid var(--ml-border);
}
.MainView #posts .posts_inline .p-content,
.FeedbackView #posts .posts_inline .p-content {
    margin: 0;
    padding: 14px 15px 8px;
}
.MainView #posts .posts_inline .title,
.FeedbackView #posts .posts_inline .title {
    min-height: 2.5em;
    font-size: 16px;
    line-height: 1.25;
}
.MainView #posts .posts_inline .p-text,
.FeedbackView #posts .posts_inline .p-text {
    display: -webkit-box;
    margin-top: 8px;
    overflow: hidden;
    color: var(--ml-muted);
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    mask-image: none;
}
.MainView #posts .posts_inline .p-date,
.FeedbackView #posts .posts_inline .p-date {
    top: 10px;
    left: 10px;
    z-index: 1;
}
.MainView #posts .news-card-more,
.FeedbackView #posts .news-card-more {
    margin: auto 15px 0;
    color: var(--ml-blue) !important;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
}
.MainView #posts .news-card-more::after,
.FeedbackView #posts .news-card-more::after { content: " →"; }
.MainView #posts > .container > .link-more-ico,
.FeedbackView #posts > .container > .link-more-ico {
    display: inline-flex;
    min-height: 38px;
    margin-top: 18px;
    padding: 9px 15px;
    align-items: center;
    color: #fff !important;
    background: var(--ml-blue);
    border: 1px solid var(--ml-blue-hover);
    border-radius: 2px;
    text-decoration: none;
}
html.moeller-dark .MainView #posts .posts_inline > .p-item:hover,
html.moeller-dark .FeedbackView #posts .posts_inline > .p-item:hover {
    box-shadow: 0 8px 22px rgba(0, 0, 0, .24);
}

/* Left catalogue navigation: preserve the familiar list, but group it into
   readable sales-navigation cards with consistent hit areas and states. */
.catalog-aside {
    margin-bottom: 16px !important;
    overflow: hidden;
    border: 1px solid var(--ml-border);
    background: var(--ml-surface-raised);
}
.catalog-aside > .title {
    margin: 0 !important;
    padding: 14px 15px 12px;
    border-bottom: 2px solid var(--ml-blue);
    color: var(--ml-text) !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    line-height: 1.25;
    text-transform: none !important;
}
.catalog-aside > ul { margin: 0 !important; padding: 5px 12px 8px; }
.catalog-aside > ul > li + li > a { border-top: 1px solid var(--ml-border) !important; }
.catalog-aside > ul > li > a {
    position: relative;
    min-height: 34px;
    padding: 8px 22px 8px 5px !important;
    color: var(--ml-text) !important;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    text-decoration: none !important;
    transition: color .16s ease, background .16s ease, padding-left .16s ease;
}
.catalog-aside > ul > li > a::after {
    content: '';
    position: absolute;
    top: 50%; right: 6px;
    width: 6px; height: 6px;
    border-top: 1.5px solid currentColor;
    border-right: 1.5px solid currentColor;
    opacity: .42;
    transform: translateY(-50%) rotate(45deg);
}
.catalog-aside > ul > li > a:hover {
    padding-left: 9px !important;
    background: color-mix(in srgb, var(--ml-blue) 7%, var(--ml-surface-raised)) !important;
    color: var(--ml-blue) !important;
}
.catalog-aside > ul > li > a.selected {
    padding-left: 9px !important;
    background: color-mix(in srgb, var(--ml-blue) 11%, var(--ml-surface-raised));
    color: var(--ml-blue) !important;
}
.catalog-aside--accessories > ul { padding-bottom: 9px; }

@media (max-width: 767px) {
    .special-section-title + .title_block_text {
        position: static;
        margin: -10px 0 16px 16px !important;
    }
    .MainView #posts .news-section-title,
    .FeedbackView #posts .news-section-title {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }
    .MainView #posts .posts_inline,
    .FeedbackView #posts .posts_inline { grid-template-columns: 1fr; }
}

/* Sidebar articles: a compact editorial card instead of a loose legacy list. */
#post_aside.article-aside {
    margin-top: 18px;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--ml-border);
    background: var(--ml-surface-raised);
    color: var(--ml-text);
    text-align: left;
}
#post_aside .article-aside__heading {
    padding: 15px 16px 13px;
    border-bottom: 1px solid var(--ml-border);
}
#post_aside .article-aside__heading > span {
    display: block;
    margin-bottom: 3px;
    color: var(--ml-blue);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .7px;
    text-transform: uppercase;
}
#post_aside .article-aside__heading .title {
    margin: 0;
    color: var(--ml-text);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.25;
    text-transform: none;
}
#post_aside .article-aside__list { padding: 0 16px; }
#post_aside .p-item {
    margin: 0;
    padding: 13px 0 14px;
    border-bottom: 1px solid var(--ml-border);
}
#post_aside .p-item:last-child { border-bottom: 0; }
#post_aside .p-date {
    display: block;
    position: static;
    width: auto;
    margin-bottom: 5px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent !important;
    color: var(--ml-muted) !important;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.2;
    text-align: left;
}
#post_aside .p-title {
    display: block;
    color: var(--ml-text) !important;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.35;
    text-align: left;
    text-decoration: none;
    text-transform: none;
}
#post_aside .p-title:hover { color: var(--ml-blue) !important; }
#post_aside .article-aside__more {
    display: flex;
    min-height: 40px;
    padding: 10px 16px;
    align-items: center;
    justify-content: space-between;
    color: #fff !important;
    background: var(--ml-blue);
    border-top: 1px solid var(--ml-blue-hover);
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}
#post_aside .article-aside__more:hover { background: var(--ml-blue-hover); }
#post_aside .article-aside__more::after {
    content: '';
    width: 7px;
    height: 7px;
    border-top: 1.5px solid currentColor;
    border-right: 1.5px solid currentColor;
    transform: rotate(45deg);
    transition: margin-right .18s ease;
}
#post_aside .article-aside__more:hover::after { margin-right: -2px; }

/* Footer refresh: the same restrained dark-blue system as the approved header. */
#footer {
    padding: 34px 0 20px !important;
    border-top: 3px solid var(--ml-blue);
    background: #121b26 !important;
    color: #aeb9c8 !important;
    font-size: 13px !important;
    line-height: 1.5;
}
html:not(.moeller-dark) #footer,
html.moeller-dark #footer {
    background: #121b26 !important;
    color: #aeb9c8 !important;
    border-top-color: var(--ml-blue) !important;
}
html:not(.moeller-dark) #footer .title,
html.moeller-dark #footer .title { color: #fff !important; }
html:not(.moeller-dark) #footer nav > ul > li,
html.moeller-dark #footer nav > ul > li { border-bottom-color: #2b3847 !important; }
html:not(.moeller-dark) #footer nav > ul > li > a,
html.moeller-dark #footer nav > ul > li > a { color: #b9c4d1 !important; }
html:not(.moeller-dark) #footer .copyright,
html.moeller-dark #footer .copyright {
    border-top-color: #2b3847 !important;
    color: #7f8d9e !important;
}
#footer .container {
    max-width: 1380px !important;
    padding-right: 50px !important;
    padding-left: 50px !important;
    background: transparent !important;
}
#footer .row { align-items: flex-start; }
#footer .title {
    margin-bottom: 13px !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: .03em;
    text-transform: uppercase;
}
#footer .title span { color: inherit !important; }
#footer nav > ul > li {
    min-height: 34px;
    margin: 0 !important;
    padding: 7px 0 !important;
    border-bottom: 1px solid #2b3847;
}
#footer nav > ul > li > a {
    color: #b9c4d1 !important;
    line-height: 1.25;
    transition: color .16s ease, padding-left .16s ease;
}
#footer nav > ul > li > a:hover { padding-left: 4px; color: #4fb2ff !important; }
#footer .contacts nav > ul > li { border-bottom: 0; }
#footer .contacts nav > ul > li {
    display: flex;
    min-height: 28px;
    padding: 0 !important;
    align-items: center;
    gap: 8px;
}
#footer .contacts .isvg { display: none !important; }
#footer .footer-contact-icon {
    width: 14px;
    flex: 0 0 14px;
    color: #4fb2ff;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free" !important;
    font-size: 12px;
    font-style: normal;
    font-weight: 900 !important;
    text-align: center;
}
#footer .footer-contact-icon.fa-phone::before { content: "\f095"; }
#footer .footer-contact-icon.fa-envelope::before { content: "\f0e0"; }
#footer .fn_callback.button {
    display: none !important;
}
#footer .copyright {
    margin-top: 28px;
    padding-top: 16px;
    border-top: 1px solid #2b3847;
    color: #7f8d9e !important;
    font-size: 11px;
}

/* Exact desktop/mobile footer layout from the approved test site. */
#footer .row {
    display: grid !important;
    grid-template-columns: 1.05fr 1.8fr 1.5fr;
    gap: 44px;
}
#footer .row > .col {
    width: auto !important;
    min-width: 0;
    margin: 0 !important;
    flex: none !important;
    flex-basis: auto !important;
    order: 0 !important;
}
#footer .row > .contacts { grid-column: 1; }
#footer .row > .pages { grid-column: 2; }
#footer .row > .categories { grid-column: 3; }
#footer .pages nav > ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 22px;
}
#footer .categories nav > ul { display: grid; grid-template-columns: 1fr; }

@media (max-width: 767px) {
    #footer { padding: 28px 18px 18px !important; }
    #footer .container { padding-right: 20px !important; padding-left: 20px !important; }
    #footer .row { grid-template-columns: 1fr; gap: 28px; text-align: center; }
    #footer .row > .contacts,
    #footer .row > .pages,
    #footer .row > .categories { grid-column: 1; }
    #footer .title { margin-bottom: 10px !important; }
    #footer nav > ul { display: grid !important; grid-template-columns: 1fr !important; gap: 0; }
    #footer nav > ul > li { margin-right: 0; }
    #footer .contacts nav > ul > li { display: flex; justify-content: center; align-items: center; }
    #footer .copyright { text-align: center; }
}

/* Three legacy benefit areas now share one restrained, sales-focused system. */
.MainView .brand-story {
    padding-top: 38px !important;
    padding-bottom: 34px !important;
    border-top: 3px solid var(--ml-blue);
    background: var(--ml-surface-raised) !important;
}
.MainView .brand-story article { max-width: 1180px; margin: 0 auto 28px; }
.MainView .brand-story article h1 {
    position: relative;
    margin: 0 0 15px;
    padding-bottom: 14px;
    color: var(--ml-text) !important;
    font-size: 27px;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: -.02em;
}
.MainView .brand-story article h1::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0;
    width: 52px; height: 3px;
    background: var(--ml-blue);
}
.MainView .brand-story article p {
    max-width: 1120px;
    color: var(--ml-muted) !important;
    font-size: 15px;
    line-height: 1.65;
}

#our_pluses,
#items_pluses {
    border: 0 !important;
    background: var(--ml-surface) !important;
    color: var(--ml-text) !important;
}
#our_pluses .container,
#items_pluses .container {
    padding: 42px 30px !important;
    background: transparent !important;
    box-shadow: none !important;
}
#our_pluses .h3,
#items_pluses .h3 {
    position: relative;
    margin: 0 0 24px !important;
    padding-bottom: 13px;
    color: var(--ml-text) !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    line-height: 1.25;
    text-align: left !important;
    text-transform: none !important;
}
#our_pluses .h3::after,
#items_pluses .h3::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0;
    width: 48px; height: 3px;
    background: var(--ml-blue);
}
#our_pluses .row,
#items_pluses .row {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin: 0 !important;
}
#our_pluses .row::before,
#our_pluses .row::after,
#items_pluses .row::before,
#items_pluses .row::after {
    display: none !important;
    content: none !important;
}
#our_pluses .item,
#items_pluses .row > div {
    position: relative;
    display: flex !important;
    min-width: 0;
    min-height: 112px;
    margin: 0 !important;
    padding: 20px 18px 18px 58px !important;
    align-items: flex-start;
    justify-content: flex-start;
    flex: none !important;
    border: 1px solid var(--ml-border);
    background: var(--ml-surface-raised);
    color: var(--ml-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4 !important;
    letter-spacing: 0;
    text-align: left;
    transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}
#our_pluses .item:hover,
#items_pluses .row > div:hover {
    border-color: var(--ml-blue);
    box-shadow: 0 7px 18px rgba(25, 48, 72, .09);
    transform: translateY(-1px);
}
#our_pluses .item::before,
#items_pluses .row > div::before {
    content: '✓';
    position: absolute;
    top: 19px; left: 18px;
    display: grid;
    width: 27px; height: 27px;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--ml-blue) 38%, var(--ml-border));
    background: color-mix(in srgb, var(--ml-blue) 9%, var(--ml-surface-raised));
    color: var(--ml-blue);
    font-size: 15px;
    font-weight: 800;
}
#our_pluses .image,
#items_pluses .image { display: none !important; }
#items_pluses .row > div .title {
    margin: 0 !important;
    color: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    text-align: left;
    text-transform: none !important;
}
html.moeller-dark #our_pluses .item:hover,
html.moeller-dark #items_pluses .row > div:hover { box-shadow: 0 8px 22px rgba(0, 0, 0, .22); }

@media (max-width: 991px) {
    #our_pluses .row,
    #items_pluses .row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 543px) {
    .MainView .brand-story { padding: 26px 16px !important; }
    .MainView .brand-story article h1 { font-size: 22px; }
    #our_pluses .container,
    #items_pluses .container { padding: 30px 16px !important; }
    #our_pluses .h3,
    #items_pluses .h3 { font-size: 21px !important; }
    #our_pluses .row,
    #items_pluses .row { grid-template-columns: 1fr; }
}

/* 06.09.2026 final visual cohesion pass.
   Keep the original benefit artwork, but place it in controlled icon wells so
   legacy transparent edges cannot glow against the dark theme. */
#posts.MainView.shadow-1::before,
#posts.MainView.shadow-1::after {
    display: none !important;
    content: none !important;
    box-shadow: none !important;
}
.MainView .brand-story,
#our_pluses,
#items_pluses {
    background: var(--ml-surface-raised) !important;
    border-color: var(--ml-border) !important;
}
html.moeller-dark .MainView .brand-story,
html.moeller-dark #our_pluses,
html.moeller-dark #items_pluses {
    background: var(--ml-surface-raised) !important;
}
#our_pluses .shadow-1::before,
#our_pluses .shadow-1::after,
#items_pluses .shadow-1::before,
#items_pluses .shadow-1::after {
    display: none !important;
    content: none !important;
    box-shadow: none !important;
}
#our_pluses,
#items_pluses { border-top: 0 !important; }

/* The map/footer transition uses one intentional accent, without stacked
   white/gray legacy rules. */
#ya_map {
    border-top: 3px solid var(--ml-blue) !important;
    border-bottom: 0 !important;
}

#ya_map .map--deferred {
    align-items: center;
    background:
        linear-gradient(135deg, rgba(14, 108, 170, .08), rgba(14, 108, 170, .02)),
        var(--ml-surface, #f4f6f8);
    display: flex;
    justify-content: center;
}

#ya_map .map__load {
    align-items: center;
    background: var(--ml-blue, #0e6caa);
    border: 0;
    border-radius: 3px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font: 700 15px/1.2 Arial, sans-serif;
    min-height: 48px;
    padding: 0 24px;
}

#ya_map .map__load:hover,
#ya_map .map__load:focus-visible {
    background: var(--ml-blue-dark, #095985);
    outline: 3px solid rgba(14, 108, 170, .25);
    outline-offset: 3px;
}

#ya_map .map__load:disabled {
    cursor: wait;
    opacity: .75;
}
#our_pluses .container,
#items_pluses .container { background: transparent !important; }

#our_pluses .item,
#items_pluses .row > div {
    min-height: 122px;
    padding: 16px !important;
    align-items: center;
    gap: 14px;
    overflow: hidden;
    background: var(--ml-surface) !important;
    border-color: var(--ml-border) !important;
}
#our_pluses .item::before,
#items_pluses .row > div::before { content: none !important; display: none !important; }
#our_pluses .image,
#items_pluses .image {
    display: flex !important;
    width: 74px;
    height: 72px;
    min-width: 74px;
    margin: 0 !important;
    padding: 7px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--ml-blue) 22%, var(--ml-border));
    border-radius: 3px;
    background: #eef3f7;
    box-shadow: none !important;
}
#our_pluses .image img,
#items_pluses .image img {
    display: block;
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
    margin: 0 !important;
    object-fit: contain;
    filter: saturate(.88) contrast(.96);
}
#our_pluses .item > span:last-child,
#items_pluses .title { min-width: 0; }
html.moeller-dark #our_pluses .image,
html.moeller-dark #items_pluses .image {
    background: #dce5ed;
    border-color: #405165;
}
html.moeller-dark #our_pluses .image img,
html.moeller-dark #items_pluses .image img {
    filter: saturate(.76) brightness(.9) contrast(.98);
}

/* Sidebar cards now have one outline, one gap rhythm and no orphan divider. */
.sidebar .catalog-aside,
.sidebar #post_aside.article-aside {
    margin: 0 0 16px !important;
    border: 1px solid var(--ml-border) !important;
    border-radius: 2px;
    background: var(--ml-surface-raised) !important;
    box-shadow: none !important;
}
.catalog-aside--accessories > ul { padding: 7px 12px 10px !important; }
.catalog-aside--accessories > ul > li > a { min-height: 38px; }
.sidebar > hr,
.sidebar hr.mt-2 { display: none !important; }

/* Product tiles: one restrained palette and clean edges in both themes. */
.grid-products .fn_transfer {
    position: relative;
    overflow: visible;
    border: 1px solid var(--ml-border) !important;
    background: var(--ml-surface-raised) !important;
    box-shadow: none !important;
}
.grid-products .preview_image {
    position: relative;
    overflow: visible;
    background: var(--ml-photo-mat) !important;
    border: 0 !important;
    box-shadow: none !important;
}
.grid-products .preview_form {
    border-top-color: var(--ml-blue) !important;
    background: transparent !important;
}
.grid-products .variant_select {
    color: var(--ml-text) !important;
    background-color: var(--ml-field) !important;
    border: 1px solid var(--ml-border) !important;
}
.grid-products .button { background: var(--ml-blue) !important; color: #fff !important; }
.grid-products .button:hover { background: var(--ml-blue-hover) !important; }
.grid-products .promo_img {
    top: -9px !important;
    right: -9px !important;
    z-index: 8;
    max-width: 64px !important;
    max-height: 64px !important;
    filter: none !important;
}
.grid-products,
.grid-products > .products-item,
.grid-products .product { overflow: visible !important; }
html.moeller-dark .grid-products .fn_transfer,
html.moeller-dark .grid-products .preview_image,
html.moeller-dark .grid-products .preview_form,
html.moeller-dark .grid-products .variant_select {
    box-shadow: none !important;
}

/* Promotions: compact, recognizable controls instead of the legacy slabs. */
.relative .slick-products { padding: 8px 2px 2px; }
.relative .slick-products > .slick-list { padding-top: 8px !important; margin-top: -8px; }
.relative .slick-products .slick-arrow {
    top: 50% !important;
    width: 40px !important;
    height: 40px !important;
    margin-top: -20px !important;
    border: 1px solid var(--ml-border) !important;
    border-radius: 50% !important;
    background: var(--ml-surface-raised) !important;
    color: var(--ml-text) !important;
    box-shadow: 0 4px 14px rgba(20, 42, 63, .16);
    transform: none !important;
    text-indent: 0 !important;
}
.relative .slick-products .slick-prev { left: 8px !important; }
.relative .slick-products .slick-next { right: 8px !important; }
.relative .slick-products .slick-arrow::before {
    display: grid !important;
    width: 100% !important;
    height: 100% !important;
    place-items: center;
    background: none !important;
    color: currentColor !important;
    font: 400 27px/1 Arial, sans-serif !important;
}
.relative .slick-products .slick-prev::before { content: '\2039' !important; }
.relative .slick-products .slick-next::before { content: '\203a' !important; }
.relative .slick-products .slick-arrow:hover {
    border-color: var(--ml-blue) !important;
    color: var(--ml-blue) !important;
}

/* News action uses text and a small CSS chevron, not the unrelated chain icon. */
.MainView #posts > .container > .link-more-ico::after,
.FeedbackView #posts > .container > .link-more-ico::after {
    width: 7px;
    height: 7px;
    margin-left: 9px;
    border-top: 1.5px solid currentColor;
    border-right: 1.5px solid currentColor;
    background: none !important;
    transform: rotate(45deg);
}

@media (max-width: 767px) {
    #our_pluses .item,
    #items_pluses .row > div { min-height: 102px; }
}

/* Social block from the last approved test-site contact page. */
.FeedbackView .contact-socials { margin:0 0 24px; padding:0; border:0; background:transparent; }
.FeedbackView .contact-socials__title { margin:0 0 10px; color:var(--ml-text); font-size:15px; font-weight:700; line-height:1.25; text-transform:uppercase; }
.FeedbackView .contact-socials__list { display:flex; flex-wrap:wrap; gap:10px 28px; }
.FeedbackView .contact-social { display:flex; min-width:0; padding:4px 0; align-items:center; gap:12px; border:0; background:transparent; color:var(--ml-text)!important; text-decoration:none!important; transition:color .18s; }
.FeedbackView .contact-social:hover strong { color:var(--ml-blue); }
.FeedbackView .contact-social__icon { display:grid; flex:0 0 34px; width:34px; height:34px; place-items:center; border-radius:8px; color:#fff; }
.FeedbackView .contact-social--vk .contact-social__icon { background:#2787f5; }
.FeedbackView .contact-social--rutube .contact-social__icon { background:#101820; }
.FeedbackView .contact-social__icon svg { display:block; width:22px; height:22px; max-width:22px; max-height:22px; }
.FeedbackView .contact-social strong,
.FeedbackView .contact-social small { display:block; }
.FeedbackView .contact-social strong { font-size:15px; line-height:1.25; }
.FeedbackView .contact-social small { margin-top:3px; color:var(--ml-text-muted); font-size:11px; line-height:1.3; }
@media (max-width:575px) {
    .FeedbackView .contact-socials__list { display:grid; grid-template-columns:1fr; gap:8px; }
}

/* Banner art and calculator geometry from the last approved test release.
   The responsive picture keeps the optimized source, but every wrapper uses
   the original 315 px frame so Slick cannot stretch or crop the artwork. */
#bnrs_header,
#bnrs_header .slick-list,
#bnrs_header .slick-track,
#bnrs_header .slick-slide,
#bnrs_header .banner-item,
#bnrs_header .banner-item > picture {
    height:315px !important;
    max-height:315px !important;
}
#bnrs_header .slick-slide > div,
#bnrs_header .banner-item > picture {
    display:block;
    width:100%;
    background:#fff !important;
}
#bnrs_header .banner-item > img,
#bnrs_header .banner-item > picture > img {
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    object-fit:contain !important;
    object-position:center !important;
    background:#fff !important;
}
@media (min-width:992px) {
    #promo_calc > .container > .row {
        min-height:315px;
        align-items:stretch;
    }
    #promo_calc .calc {
        height:315px !important;
        padding-top:18px !important;
        padding-bottom:18px !important;
    }
    #promo_calc .calc .calc-heading { margin-bottom:8px !important; }
    #promo_calc .calc .form_group {
        margin-top:2px !important;
        margin-bottom:2px !important;
    }
    #promo_calc .calc .calc-result:empty { display:none !important; }
}

/* A short composited curtain masks the expensive full-page repaint when the
   theme changes. It exists only during the click transition. */
.moeller-theme-curtain {
    position:fixed;
    inset:0;
    z-index:2147483646;
    display:grid;
    place-items:center;
    overflow:hidden;
    pointer-events:all;
    opacity:1;
    transform:translateZ(0);
    will-change:opacity,transform;
    background:
        radial-gradient(circle at 50% 45%, rgba(0,140,235,.18), transparent 34%),
        #f7f9fc;
}
.moeller-theme-curtain.is-dark {
    background:
        radial-gradient(circle at 50% 45%, rgba(0,140,235,.22), transparent 34%),
        #0d141d;
}
.moeller-theme-curtain__mark {
    width:42px;
    height:42px;
    border:2px solid rgba(0,140,235,.28);
    border-top-color:#008ceb;
    border-radius:50%;
    animation:moeller-theme-mark .42s cubic-bezier(.2,.7,.3,1) both;
}
.moeller-theme-curtain.is-revealing {
    opacity:0;
    transform:scale(1.012) translateZ(0);
    transition:opacity .3s ease,transform .3s ease;
}
@keyframes moeller-theme-mark {
    from { opacity:.3; transform:scale(.72) rotate(-70deg); }
    to { opacity:1; transform:scale(1) rotate(0); }
}
@media (prefers-reduced-motion:reduce) {
    .moeller-theme-curtain__mark { animation:none; }
    .moeller-theme-curtain.is-revealing { transition:none; }
}

/* Preserve the approved centred family links in the closing brand block. */
.MainView .brand-story #page_cats .lev1 > div { justify-content:center; }
.MainView .brand-story #page_cats .lev1 > div > .item_list {
    flex:0 1 auto;
    text-align:center;
}

/* The legacy "Up" control stays hidden until there is somewhere to scroll. */
.scroll_top {
    z-index:1100;
    visibility:hidden;
    pointer-events:none;
    transition:bottom .2s ease, opacity .2s ease, visibility .2s ease;
}
.scroll_top.active {
    visibility:visible;
    pointer-events:auto;
}

/* Keep section titles on one semantic color. Legacy title rules used to
   recolor only the nested NEWS span blue. */
.title_block.section-heading > span,
#posts > .container > .title_block.section-heading > span,
html.moeller-dark .title_block.section-heading > span,
html.moeller-dark #posts > .container > .title_block.section-heading > span {
    color: var(--ml-text) !important;
}

/* The legacy theme imposed a 400 px document.  Keep every structural wrapper
   inside the viewport on small phones. */
@media (max-width: 399px) {
    html,
    body,
    .page,
    .page.boxed,
    .wrapper,
    #fn_content,
    .content {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }
    body { overflow-x: hidden; }
    .FeedbackView .captcha { grid-template-columns: 1fr; }
    .FeedbackView .captcha .form-label { grid-column: auto; }
}

@media (max-width: 767px) {
    #promo_calc .calc { padding: 18px 16px !important; }
    #promo_calc .calc .fn_variants { grid-template-columns: 1fr; }
    #promo_calc .calc .fn_variants > * { grid-column: 1 !important; }
    #posts .p-image { height: 190px; }
    .cart-empty { padding: 24px 18px; }
    .product-item .product_details { padding-right: 15px; }
    .product-item .features_inline { letter-spacing: normal; }
    .product-item .features_inline .name,
    .product-item .features_inline .value {
        display: block;
        width: 100%;
        margin: 0;
        padding-left: 0;
    }
    .product-item .features_inline .line { display: none; }
    .product-item .features_inline + .features_inline { margin-top: 8px; }
    .product-item .features_inline .name {
        color: var(--ml-muted);
        font-size: 11px;
        font-weight: 600;
        letter-spacing: .35px;
        text-transform: uppercase;
    }
}

/* Final cascade lock: preserve the open, non-card composition after legacy
   responsive rules declared above. */
#our_pluses .row { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 34px !important; }
#items_pluses .row { grid-template-columns: repeat(8, minmax(0, 1fr)) !important; gap: 24px 18px !important; }
#our_pluses .item,
#items_pluses .row > div {
    min-height: 0 !important;
    padding: 0 !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 11px !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    text-align: center !important;
}
#our_pluses .image,
#items_pluses .image,
html.moeller-dark #our_pluses .image,
html.moeller-dark #items_pluses .image {
    width: 78px !important;
    height: 76px !important;
    min-width: 78px !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
#our_pluses .item > span:last-child,
#items_pluses .title { text-align: center !important; }
#our_pluses .item:first-child .image img {
    filter: grayscale(1) brightness(.68) contrast(.96) opacity(.82) !important;
}
html.moeller-dark #our_pluses .image img {
    filter: grayscale(1) brightness(0) invert(1) opacity(.78) !important;
}
html.moeller-dark #our_pluses .item:first-child .image img {
    filter: grayscale(1) brightness(0) invert(1) opacity(.68) !important;
}
html.moeller-dark #our_pluses .item:nth-child(4) .image img {
    filter: grayscale(.35) brightness(.92) contrast(1.08) !important;
}

/* Unified closing section and restrained product-family navigation. */
.MainView .brand-story { padding-left:30px !important; padding-right:30px !important; }
.MainView .brand-story h1,
.MainView #our_pluses .title_block,
.MainView #items_pluses .title_block { margin-left:0 !important; text-align:left !important; }
.MainView .brand-story #page_cats { margin:26px 0 10px; }
.MainView .brand-story #page_cats .lev1 { grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; border-block:1px solid var(--ml-border); }
.MainView .brand-story #page_cats .lev1 > div { display:flex; min-height:108px; padding:16px 20px; border:0; border-right:1px solid var(--ml-border); background:transparent; box-shadow:none; transform:none; }
.MainView .brand-story #page_cats .lev1 > div:last-child { border-right:0; }
.MainView .brand-story #page_cats .lev1 > div:hover { background:color-mix(in srgb,var(--ml-blue) 6%,transparent); box-shadow:none; transform:none; }
.MainView .brand-story #page_cats .lev1 > div > .image { width:82px; height:74px; padding:0; border:0; background:transparent; }
.MainView .brand-story #page_cats .lev1 > div > .image,
.MainView .brand-story #page_cats .lev1 > div > .image * { border:0 !important; outline:0 !important; box-shadow:none !important; }
.MainView .brand-story #page_cats .lev1 > div > .item_list { margin-left:15px; }
.MainView .brand-story #page_cats .lev1 > div > .item_list > .name { font-size:14px; line-height:1.35; }

html.moeller-dark .grid-products .fn_transfer,
html.moeller-dark .grid-products .preview_image,
html.moeller-dark .grid-products .product_content,
html.moeller-dark .grid-products .preview_form,
html.moeller-dark .grid-products .price_container { background:var(--ml-surface-raised) !important; }
html.moeller-dark .grid-products .preview_image { border-bottom:1px solid var(--ml-border); }
.grid-products .preview_image[href*="seryj-grafit-soft-"] img { transform:scale(1.065); }
.grid-products .preview_image[href*="svetlyj-dub-"] img {
    clip-path:inset(0 8px);
    transform:scale(1.045);
}

/* One heading axis and hierarchy for the three closing sales arguments. */
.MainView .brand-story > section > .container { max-width:none !important; padding-inline:0 !important; }
.MainView .brand-story article { max-width:none !important; margin:0 0 28px !important; }
.MainView .brand-story article h1,
.MainView #our_pluses .h3,
#items_pluses .h3 {
    margin:0 0 24px !important;
    padding:0 0 11px !important;
    font-size:24px !important;
    font-weight:600 !important;
    line-height:1.25 !important;
    letter-spacing:-.02em !important;
    text-align:left !important;
    border-bottom:1px solid var(--ml-border) !important;
}
.MainView .brand-story article h1::after,
.MainView #our_pluses .h3::after,
#items_pluses .h3::after {
    content:"";
    display:block;
    width:52px;
    height:2px;
    margin-top:10px;
    background:var(--ml-blue);
}

/* Equivalent “view all” links share one restrained secondary action. */
.section-more-link {
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:36px;
    padding:7px 13px !important;
    border:1px solid var(--ml-border) !important;
    border-radius:2px;
    background:transparent !important;
    color:var(--ml-blue) !important;
    font-size:13px !important;
    font-weight:700 !important;
    line-height:1.2;
    text-decoration:none !important;
    box-shadow:none !important;
}
.section-more-link::after { content:"›"; font-size:20px; font-weight:400; line-height:.8; }
.section-more-link:hover { border-color:var(--ml-blue) !important; background:color-mix(in srgb,var(--ml-blue) 7%,transparent) !important; }

/* News and promotion actions have the same meaning and therefore occupy the
   same place: below their content, aligned to the section's left edge. */
.special-offers-section .section-more-row,
#posts > .container > .section-more-row {
    position:static !important;
    display:flex;
    width:100%;
    margin:18px 0 0 !important;
    padding:0 !important;
    justify-content:flex-start;
    text-align:left !important;
    font-size:inherit !important;
    line-height:normal !important;
}
.special-offers-section .section-more-row .section-more-link,
#posts > .container > .section-more-row .section-more-link {
    width:142px;
    min-width:142px;
    min-height:38px;
    margin:0 !important;
}

/* Lock the three closing arguments to one content axis on every page where
   the reusable benefits block appears. */
#items_pluses { padding-inline:0 !important; }
.MainView .brand-story,
#our_pluses .container,
#items_pluses .container { padding-left:30px !important; padding-right:30px !important; }
.MainView .brand-story article h1,
#our_pluses .h3,
#items_pluses .h3 {
    margin-left:0 !important;
    margin-right:0 !important;
    text-align:left !important;
}

/* Real two-column phone catalogue; carousels retain their own responsive logic. */
@media (max-width:767px) {
 .content_container .grid-products:not(.slick-products),
 #fn_products_content.grid-products:not(.slick-products) {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
    margin-inline:0 !important;
 }
 .content_container .grid-products:not(.slick-products) > .products-item,
 #fn_products_content.grid-products:not(.slick-products) > .products-item {
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    margin:0 !important;
    flex:0 0 auto !important;
 }
 .content_container .grid-products:not(.slick-products) .fn_transfer,
 #fn_products_content.grid-products:not(.slick-products) .fn_transfer { padding:8px !important; }
 .content_container .grid-products:not(.slick-products) .preview_image,
 #fn_products_content.grid-products:not(.slick-products) .preview_image { height:112px !important; }
 .content_container .grid-products:not(.slick-products) .product_name,
 #fn_products_content.grid-products:not(.slick-products) .product_name { height:2.45em !important; font-size:13px !important; line-height:1.22 !important; }
 .content_container .grid-products:not(.slick-products) .product_sku,
 #fn_products_content.grid-products:not(.slick-products) .product_sku { font-size:11px !important; }
 .content_container .grid-products:not(.slick-products) .preview_form,
 #fn_products_content.grid-products:not(.slick-products) .preview_form {
    display:grid !important;
    grid-template-columns:minmax(0,1fr);
    gap:6px !important;
    align-items:center;
    min-height:0 !important;
 }
 .content_container .grid-products:not(.slick-products) .price_container,
 #fn_products_content.grid-products:not(.slick-products) .price_container {
    min-width:0;
    height:auto !important;
    min-height:34px;
    font-size:18px !important;
    flex-wrap:wrap;
    gap:1px 6px;
 }
 .content_container .grid-products:not(.slick-products) .old_price,
 #fn_products_content.grid-products:not(.slick-products) .old_price {
    display:inline-block !important;
    padding-left:0 !important;
    font-size:11px !important;
 }
 .content_container .grid-products:not(.slick-products) .old_price.hidden,
 #fn_products_content.grid-products:not(.slick-products) .old_price.hidden { display:none !important; }
 .content_container .grid-products:not(.slick-products) .button,
 #fn_products_content.grid-products:not(.slick-products) .button {
    width:100% !important;
    min-width:0 !important;
    height:36px !important;
    padding:0 8px !important;
    font-size:12px !important;
 }
 .content_container .grid-products:not(.slick-products) .button svg,
 #fn_products_content.grid-products:not(.slick-products) .button svg { width:16px !important; height:16px !important; }
 .content_container .grid-products:not(.slick-products) .variant_select,
 #fn_products_content.grid-products:not(.slick-products) .variant_select { width:100% !important; font-size:11px !important; }
 .MainView .brand-story article h1,
 #our_pluses .h3,
 #items_pluses .h3 { font-size:21px !important; margin-bottom:20px !important; }
}

html.moeller-dark .product-item .amount .minus,
html.moeller-dark .product-item .amount .plus {
    color:var(--ml-text) !important;
    background:var(--ml-field) !important;
    border:1px solid var(--ml-border) !important;
}
html.moeller-dark .product-item .amount .minus:hover,
html.moeller-dark .product-item .amount .plus:hover {
    color:#fff !important;
    background:var(--ml-blue) !important;
    border-color:var(--ml-blue) !important;
}

/* 07.09.2026 final content-system pass.
   Text pages share one readable hierarchy with the home page. */
.PageView .page_header,
.FeedbackView .page_header {
    margin: 0 0 24px !important;
    padding: 0 0 14px !important;
    color: var(--ml-text) !important;
    font-size: 28px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    letter-spacing: -.02em;
    border-bottom: 1px solid var(--ml-border);
}
.PageView article,
.FeedbackView .contact-content {
    color: var(--ml-text) !important;
    font-size: 16px !important;
    line-height: 1.72 !important;
}
.PageView article h2,
.FeedbackView .contact-content h2 {
    margin: 30px 0 12px;
    color: var(--ml-text) !important;
    font-size: 22px !important;
    font-weight: 600;
    line-height: 1.35;
}
.PageView article h3,
.FeedbackView .contact-content h3 {
    margin: 24px 0 10px;
    color: var(--ml-text) !important;
    font-size: 18px !important;
    font-weight: 600;
    line-height: 1.4;
}
.PageView article p,
.FeedbackView .contact-content p { margin: 0 0 16px; }
.PageView .links_p {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 26px;
}
.PageView .links_p a {
    min-height: 38px;
    padding: 9px 14px;
    color: var(--ml-text) !important;
    background: var(--ml-surface) !important;
    border: 1px solid var(--ml-border);
    font-size: 13px;
    font-weight: 600;
    line-height: 18px;
    text-decoration: none !important;
}
.PageView .links_p a:hover {
    color: var(--ml-blue) !important;
    border-color: var(--ml-blue);
}

/* Feedback is one calm modal-like panel, matching route/pass/callback UI. */
.FeedbackView > .row { align-items: flex-start; gap: 24px 0; }
.FeedbackView .fn_validate_feedback.form {
    position: relative;
    margin: 0 !important;
    padding: 24px !important;
    color: var(--ml-text) !important;
    background: var(--ml-surface-raised) !important;
    border: 1px solid var(--ml-border) !important;
    border-top: 3px solid var(--ml-blue) !important;
    box-shadow: 0 12px 30px rgba(18, 40, 62, .09);
}
.FeedbackView .fn_validate_feedback .h3 {
    margin: 0 0 18px !important;
    color: var(--ml-text) !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    text-transform: none !important;
}
.FeedbackView .fn_validate_feedback > .button {
    min-width: 150px;
    min-height: 42px;
}

/* Catalogue cards are a single surface: no nested button/frame effect. */
.PageView #page_cats .lev1 { gap: 14px; }
.PageView #page_cats .lev1 > div {
    grid-template-columns: 96px minmax(0, 1fr);
    min-height: 118px;
    padding: 16px;
    overflow: hidden;
    border: 0 !important;
    border-left: 3px solid transparent !important;
    background: var(--ml-surface) !important;
    box-shadow: inset 0 0 0 1px var(--ml-border) !important;
}
.PageView #page_cats .lev1 > div:hover {
    border-left-color: var(--ml-blue) !important;
    background: color-mix(in srgb, var(--ml-blue) 5%, var(--ml-surface)) !important;
    box-shadow: inset 0 0 0 1px var(--ml-border), 0 8px 22px rgba(18, 40, 62, .10) !important;
}
.PageView #page_cats .lev1 > div > .image {
    width: 96px;
    height: 82px;
    padding: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
.PageView #page_cats .lev1 > div > .item_list {
    margin-left: 14px;
    min-width: 0;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
}
.PageView #page_cats .lev1 > div > .item_list > .name {
    font-size: 13px;
    line-height: 1.35;
}

html.moeller-dark .FeedbackView textarea {
    scrollbar-color: #526277 #18212c;
}

/* 07.09.2026 pre-release corrections. */
.section-heading-row {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    margin-bottom:18px;
}
.section-heading-row .section-heading { margin-bottom:0 !important; min-width:0; }
.section-heading-row .section-more-link {
    flex:0 0 auto;
    min-height:32px;
    padding:6px 11px !important;
    border:0 !important;
    border-radius:2px;
    background:color-mix(in srgb,var(--ml-blue) 9%,transparent) !important;
}
.section-heading-row .section-more-link:hover {
    background:color-mix(in srgb,var(--ml-blue) 16%,transparent) !important;
}

/* One blue divider above the story; no competing grey rule below its title. */
.MainView .brand-story { border-top:3px solid var(--ml-blue) !important; }
.MainView .brand-story article h1 { border-bottom:0 !important; }
.MainView .brand-story article h1::after { display:none !important; }

/* Product photography: common visible scale; no per-file clipping. */
.grid-products .preview_image[href*="seryj-grafit-soft-"] img,
.grid-products .preview_image[href*="svetlyj-dub-"] img,
.grid-products .preview_image > .fn_img {
    clip-path:none !important;
    transform:scale(var(--ml-image-scale,1)) !important;
    transform-origin:center !important;
}

/* Optical normalisation: the source exports use different camera crops, so
   equal alpha bounds still do not look equally large beside Clean Touch. */
.grid-products .preview_image[href*="seryj-grafit-soft-"] > .fn_img { transform:scale(1.14) !important; }
.grid-products .preview_image[href*="yasen-arktik-"] > .fn_img { transform:scale(1.06) !important; }
.grid-products .preview_image[href*="belyj-ultramat-"] > .fn_img { transform:scale(1.06) !important; }
.grid-products .preview_image[href*="belyj-glyanets-"] > .fn_img { transform:scale(1.06) !important; }

/* Feedback form uses the same calm field system as the header dialogs. */
.FeedbackView .fn_validate_feedback.form {
    padding:24px !important;
    border:1px solid var(--ml-border) !important;
    border-top:1px solid var(--ml-border) !important;
    border-radius:2px;
    box-shadow:0 12px 30px rgba(18,40,62,.08);
}
.FeedbackView .fn_validate_feedback .h3 {
    margin:0 0 20px !important;
    padding:0 0 13px !important;
    border-bottom:1px solid var(--ml-border);
    font-size:20px !important;
    line-height:1.3 !important;
}
.FeedbackView .form_group { margin:0 0 15px !important; }
.FeedbackView .form_input,
.FeedbackView .form_textarea {
    display:block;
    width:100% !important;
    max-width:none !important;
    min-height:44px;
    margin:0 !important;
    padding:10px 12px !important;
    border:1px solid var(--ml-border) !important;
    border-radius:2px !important;
    color:var(--ml-text) !important;
    background:var(--ml-field) !important;
    font:400 14px/1.45 "Exo 2",Helvetica,Arial,sans-serif !important;
    box-sizing:border-box;
}
.FeedbackView .form_textarea { min-height:132px; resize:vertical; }
.FeedbackView .captcha {
    grid-template-columns:minmax(0,1fr) 136px;
    gap:8px 10px;
    align-items:stretch;
}
.FeedbackView .captcha .secret_number {
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:9px 10px;
    white-space:nowrap;
}
.FeedbackView .fn_validate_feedback > .button { min-height:44px; padding-inline:22px !important; }

@media (max-width:767px) {
    .section-heading-row { gap:10px; align-items:flex-start; }
    .section-heading-row .section-heading { font-size:17px !important; }
    .section-heading-row .section-heading small { display:none; }
    .section-heading-row .section-more-link { font-size:12px !important; white-space:nowrap; }
    .FeedbackView .captcha { grid-template-columns:1fr; }
}

@media (max-width: 767px) {
    .PageView .page_header,
    .FeedbackView .page_header { font-size: 23px !important; }
    .PageView article,
    .FeedbackView .contact-content { font-size: 15px !important; line-height: 1.65 !important; }
    .FeedbackView .fn_validate_feedback.form { padding: 18px !important; }
    .PageView #page_cats .lev1 > div { grid-template-columns: 78px minmax(0,1fr); }
    .PageView #page_cats .lev1 > div > .image { width: 78px; height: 70px; }
}

@media (max-width:1100px) {
 .MainView .brand-story #page_cats .lev1 { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .MainView .brand-story #page_cats .lev1 > div:nth-child(2) { border-right:0; }
 .MainView .brand-story #page_cats .lev1 > div:nth-child(-n+2) { border-bottom:1px solid var(--ml-border); }
}
@media (max-width:767px) {
 .MainView .brand-story { padding-left:16px !important; padding-right:16px !important; }
 #our_pluses .container,
 #items_pluses .container { padding-left:16px !important; padding-right:16px !important; }
 .MainView .brand-story #page_cats .lev1 { grid-template-columns:1fr; }
 .MainView .brand-story #page_cats .lev1 > div { min-height:94px; border-right:0; border-bottom:1px solid var(--ml-border); }
 .MainView .brand-story #page_cats .lev1 > div:last-child { border-bottom:0; }
}
@media (max-width: 1199px) {
    #items_pluses .row { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}
@media (max-width: 767px) {
    #our_pluses .row,
    #items_pluses .row { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 24px 16px !important; }
}