/*
 * OGONKI.BY Modern UI — Home page
 * Version: 0.3.2
 * Date: 2026-09-28
 *
 * Scope:
 * - loaded only when Modern UI is enabled;
 * - styles only the opt-in .og-home-seo component;
 * - no external fonts, images, JS or CDN dependencies.
 */

body.ogonki-modern .og-home-seo,
body.ogonki-modern .og-home-seo * {
    box-sizing: border-box;
}

body.ogonki-modern .og-home-seo {
    width: min(1180px, calc(100vw - 40px));
    max-width: none;
    margin: 64px 0 4px 50%;
    transform: translateX(-50%);
    color: var(--og-text);
    font-family: var(--og-font) !important;
}

body.ogonki-modern .og-home-seo__surface {
    overflow: hidden;
    padding: 44px;
    border: 1px solid var(--og-line);
    border-radius: 28px;
    background:
        radial-gradient(circle at 92% 4%, rgba(103,184,62,.11), transparent 29%),
        var(--og-surface);
    box-shadow: 0 18px 54px rgba(22, 28, 35, .07);
}

body.ogonki-modern .og-home-seo__hero {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(260px, .65fr);
    gap: 34px;
    align-items: end;
    padding-bottom: 34px;
    border-bottom: 1px solid var(--og-line);
}

body.ogonki-modern .og-home-seo__eyebrow {
    margin: 0 0 10px;
    color: var(--og-accent-dark);
    font-size: 12px;
    line-height: 1.2;
    font-weight: 760;
    letter-spacing: .08em;
    text-transform: uppercase;
}

body.ogonki-modern .og-home-seo h1,
body.ogonki-modern .og-home-seo h2,
body.ogonki-modern .og-home-seo h3 {
    margin-top: 0;
    font-family: var(--og-font) !important;
    text-transform: none;
    letter-spacing: -.035em;
}

body.ogonki-modern .og-home-seo__title {
    max-width: 780px;
    margin: 0 0 16px;
    color: var(--og-text);
    font-size: clamp(34px, 4.2vw, 56px);
    line-height: 1.04;
    font-weight: 780;
}

body.ogonki-modern .og-home-seo__lead {
    max-width: 790px;
    margin: 0;
    color: var(--og-text-soft);
    font-size: 18px;
    line-height: 1.68;
}

body.ogonki-modern .og-home-seo__quick {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

body.ogonki-modern .og-home-seo__quick li {
    position: relative;
    margin: 0;
    padding: 12px 14px 12px 38px;
    border: 1px solid var(--og-line);
    border-radius: 14px;
    background: rgba(255,255,255,.72);
    color: var(--og-text-soft);
    font-size: 14px;
    line-height: 1.45;
}

body.ogonki-modern .og-home-seo__quick li::before {
    content: "";
    position: absolute;
    left: 14px;
    top: 17px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--og-accent);
    box-shadow: 0 0 0 5px var(--og-accent-soft);
}

body.ogonki-modern .og-home-seo__section {
    padding-top: 36px;
}

body.ogonki-modern .og-home-seo__section-head {
    display: flex;
    gap: 18px;
    align-items: end;
    justify-content: space-between;
    margin-bottom: 18px;
}

body.ogonki-modern .og-home-seo__section h2 {
    margin-bottom: 0;
    font-size: clamp(24px, 2.7vw, 34px);
    line-height: 1.12;
    font-weight: 760;
}

body.ogonki-modern .og-home-seo__section-note {
    max-width: 520px;
    margin: 0;
    color: var(--og-muted);
    font-size: 14px;
    line-height: 1.55;
    text-align: right;
}

body.ogonki-modern .og-home-seo__categories {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

body.ogonki-modern .og-home-seo__category {
    position: relative;
    display: flex;
    min-height: 88px;
    padding: 18px 42px 18px 18px;
    align-items: flex-end;
    overflow: hidden;
    border: 1px solid var(--og-line);
    border-radius: 17px;
    background: var(--og-surface-soft);
    color: var(--og-text) !important;
    font-size: 15px;
    line-height: 1.3;
    font-weight: 690;
    text-decoration: none !important;
    box-shadow: 0 2px 10px rgba(22,28,35,.025);
}

body.ogonki-modern .og-home-seo__category::before {
    content: "";
    position: absolute;
    width: 104px;
    height: 104px;
    right: -46px;
    top: -52px;
    border-radius: 50%;
    background: var(--og-accent-soft);
    transition: transform .2s ease, background-color .2s ease;
}

body.ogonki-modern .og-home-seo__category::after {
    content: "→";
    position: absolute;
    right: 17px;
    bottom: 17px;
    color: var(--og-accent-dark);
    font-size: 19px;
    line-height: 1;
    font-weight: 720;
}

body.ogonki-modern .og-home-seo__category:hover,
body.ogonki-modern .og-home-seo__category:focus {
    border-color: #cdd5dc;
    background: #fff;
    color: var(--og-text) !important;
    box-shadow: var(--og-shadow-sm);
    transform: translateY(-2px);
}

body.ogonki-modern .og-home-seo__category:hover::before,
body.ogonki-modern .og-home-seo__category:focus::before {
    background: #e2f3d9;
    transform: scale(1.12);
}

body.ogonki-modern .og-home-seo__two-col {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

body.ogonki-modern .og-home-seo__card {
    padding: 26px;
    border: 1px solid var(--og-line);
    border-radius: 20px;
    background: var(--og-surface-soft);
}

body.ogonki-modern .og-home-seo__card--brand {
    background: linear-gradient(135deg, #17191d 0%, #25292f 100%);
    color: #fff;
    border-color: rgba(255,255,255,.04);
}

body.ogonki-modern .og-home-seo__card h2 {
    margin: 0 0 12px;
    font-size: 25px;
    line-height: 1.15;
}

body.ogonki-modern .og-home-seo__card--brand h2 {
    color: #fff;
}

body.ogonki-modern .og-home-seo__card p {
    margin: 0;
    color: var(--og-text-soft);
    font-size: 15px;
    line-height: 1.7;
}

body.ogonki-modern .og-home-seo__card--brand p {
    color: rgba(255,255,255,.72);
}

body.ogonki-modern .og-home-seo__checklist {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 14px;
    margin: 18px 0 0;
    padding: 0;
    list-style: none;
}

body.ogonki-modern .og-home-seo__checklist li {
    position: relative;
    margin: 0;
    padding-left: 22px;
    color: var(--og-text-soft);
    font-size: 14px;
    line-height: 1.45;
}

body.ogonki-modern .og-home-seo__checklist li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: var(--og-accent-dark);
    font-weight: 800;
}

body.ogonki-modern .og-home-seo__cta {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 28px;
    align-items: center;
    margin-top: 14px;
    padding: 28px 30px;
    border-radius: 20px;
    background: var(--og-accent-soft);
}

body.ogonki-modern .og-home-seo__cta h2 {
    margin: 0 0 8px;
    font-size: 25px;
}

body.ogonki-modern .og-home-seo__cta p {
    margin: 0;
    color: var(--og-text-soft);
    font-size: 15px;
    line-height: 1.65;
}

body.ogonki-modern .og-home-seo__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    justify-content: flex-end;
}

body.ogonki-modern .og-home-seo__button {
    display: inline-flex;
    min-height: 44px;
    padding: 0 17px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--og-accent);
    border-radius: 12px;
    background: var(--og-accent);
    color: #fff !important;
    font-size: 14px;
    line-height: 1;
    font-weight: 700;
    text-decoration: none !important;
    box-shadow: 0 7px 18px rgba(103,184,62,.18);
}

body.ogonki-modern .og-home-seo__button:hover,
body.ogonki-modern .og-home-seo__button:focus {
    border-color: var(--og-accent-dark);
    background: var(--og-accent-dark);
    color: #fff !important;
    transform: translateY(-1px);
}

body.ogonki-modern .og-home-seo__button--secondary {
    border-color: var(--og-line-strong);
    background: #fff;
    color: var(--og-text) !important;
    box-shadow: none;
}

body.ogonki-modern .og-home-seo__button--secondary:hover,
body.ogonki-modern .og-home-seo__button--secondary:focus {
    border-color: #c4ccd3;
    background: #fff;
    color: var(--og-text) !important;
}

body.ogonki-modern .og-home-seo__fineprint {
    margin: 22px 0 0;
    color: var(--og-muted);
    font-size: 13px;
    line-height: 1.55;
}

@media (max-width: 991px) {
    body.ogonki-modern .og-home-seo {
        width: min(100% - 28px, 880px);
        margin-top: 44px;
    }

    body.ogonki-modern .og-home-seo__surface {
        padding: 30px;
        border-radius: 22px;
    }

    body.ogonki-modern .og-home-seo__hero {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    body.ogonki-modern .og-home-seo__quick {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    body.ogonki-modern .og-home-seo__categories {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.ogonki-modern .og-home-seo__section-head {
        display: block;
    }

    body.ogonki-modern .og-home-seo__section-note {
        max-width: 680px;
        margin-top: 8px;
        text-align: left;
    }

    body.ogonki-modern .og-home-seo__cta {
        grid-template-columns: 1fr;
    }

    body.ogonki-modern .og-home-seo__actions {
        justify-content: flex-start;
    }
}

@media (max-width: 640px) {
    body.ogonki-modern .og-home-seo {
        width: calc(100vw - 20px);
        margin-top: 34px;
    }

    body.ogonki-modern .og-home-seo__surface {
        padding: 22px 18px;
        border-radius: 18px;
    }

    body.ogonki-modern .og-home-seo__hero {
        padding-bottom: 26px;
    }

    body.ogonki-modern .og-home-seo__title {
        font-size: clamp(30px, 10vw, 39px);
    }

    body.ogonki-modern .og-home-seo__lead {
        font-size: 16px;
        line-height: 1.65;
    }

    body.ogonki-modern .og-home-seo__quick,
    body.ogonki-modern .og-home-seo__two-col,
    body.ogonki-modern .og-home-seo__categories,
    body.ogonki-modern .og-home-seo__checklist {
        grid-template-columns: 1fr;
    }

    body.ogonki-modern .og-home-seo__section {
        padding-top: 28px;
    }

    body.ogonki-modern .og-home-seo__category {
        min-height: 72px;
        padding-top: 14px;
        padding-bottom: 14px;
    }

    body.ogonki-modern .og-home-seo__card {
        padding: 21px 18px;
        border-radius: 17px;
    }

    body.ogonki-modern .og-home-seo__cta {
        padding: 22px 18px;
        border-radius: 17px;
    }

    body.ogonki-modern .og-home-seo__actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    body.ogonki-modern .og-home-seo__button {
        width: 100%;
    }
}

/* ========================================================================== 
   0.1.4 — Home catalogue sections
   --------------------------------------------------------------------------
   Enhances the existing SoloMono homepage markup without changing templates.
   Scope is limited to a Modern homepage that contains the .og-home-seo block.
   This keeps category/listing pages and Classic mode untouched.
   ========================================================================== */

/* Section rhythm. */
body.ogonki-modern:has(.og-home-seo) .ajax-module-box,
body.ogonki-modern:has(.og-home-seo) #browse_category {
    position: relative;
}

body.ogonki-modern:has(.og-home-seo) .ajax-module-box + .ajax-module-box {
    margin-top: 22px;
}

/* Existing SoloMono section titles: Recommended, Categories, etc. */
body.ogonki-modern:has(.og-home-seo) .like_h2,
body.ogonki-modern:has(.og-home-seo) .browse_category_title {
    position: relative;
    left: auto;
    display: flex;
    width: 100%;
    min-height: 44px;
    margin: 58px 0 24px;
    padding: 0 0 14px;
    align-items: flex-end;
    justify-content: space-between;
    transform: none;
    border-bottom: 1px solid var(--og-line);
    color: var(--og-text);
    font-family: var(--og-font) !important;
    font-size: clamp(24px, 2.6vw, 32px);
    line-height: 1.12;
    font-weight: 780;
    letter-spacing: -.035em;
    text-align: left;
    text-transform: none;
}

body.ogonki-modern:has(.og-home-seo) .like_h2::after,
body.ogonki-modern:has(.og-home-seo) .browse_category_title::after {
    content: "";
    position: absolute;
    left: 0;
    right: auto;
    bottom: -1px;
    width: 54px;
    height: 4px;
    border-radius: 999px;
    background: var(--og-accent);
}

body.ogonki-modern:has(.og-home-seo) .like_h2 > a {
    position: static;
    display: inline-flex;
    min-height: 34px;
    margin: 0 0 -4px 18px;
    padding: 0 12px;
    align-items: center;
    border: 1px solid var(--og-line);
    border-radius: 999px;
    background: var(--og-surface);
    color: var(--og-text-soft);
    font-size: 12px;
    line-height: 1;
    font-weight: 650;
    text-decoration: none;
}

body.ogonki-modern:has(.og-home-seo) .like_h2 > a:hover,
body.ogonki-modern:has(.og-home-seo) .like_h2 > a:focus {
    border-color: #cdd5dc;
    background: var(--og-accent-soft);
    color: var(--og-accent-dark);
}

/* Category mosaic: keep SoloMono data and links, replace only presentation. */
body.ogonki-modern:has(.og-home-seo) #browse_category {
    margin-top: 0;
}

body.ogonki-modern:has(.og-home-seo) #browse_category .subcats_imgs {
    margin-left: -7px;
    margin-right: -7px;
}

body.ogonki-modern:has(.og-home-seo) #browse_category .subcats_imgs > div {
    padding: 7px;
}

body.ogonki-modern:has(.og-home-seo) #browse_category a,
body.ogonki-modern:has(.og-home-seo) #browse_category .browse_category_item {
    position: relative;
    display: block;
    min-height: 0;
    overflow: hidden;
    border: 1px solid var(--og-line);
    border-radius: 18px;
    background: #17191d;
    box-shadow: 0 5px 20px rgba(22, 28, 35, .06);
    isolation: isolate;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

body.ogonki-modern:has(.og-home-seo) #browse_category a::after,
body.ogonki-modern:has(.og-home-seo) #browse_category .browse_category_item::after {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(8, 10, 12, 0) 38%, rgba(8, 10, 12, .56) 100%);
}

body.ogonki-modern:has(.og-home-seo) #browse_category img {
    display: block;
    width: 100%;
    aspect-ratio: 1.42 / 1;
    object-fit: cover;
    object-position: center;
    transform: scale(1.001);
    transition: transform .35s ease, filter .35s ease;
}

body.ogonki-modern:has(.og-home-seo) #browse_category .subcat_name {
    position: absolute;
    z-index: 3;
    left: 13px;
    right: 13px;
    bottom: 13px;
    width: auto;
    height: auto;
    min-height: 42px;
    margin: 0;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 12px;
    background: rgba(20, 23, 27, .72);
    color: #fff;
    font-family: var(--og-font) !important;
    font-size: 14px;
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: -.01em;
    text-align: left;
    text-transform: none;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: 0 8px 24px rgba(0,0,0,.12);
}

body.ogonki-modern:has(.og-home-seo) #browse_category .subcat_name::after {
    content: "→";
    flex: 0 0 auto;
    margin-left: 10px;
    color: #bdeca7;
    font-size: 16px;
    font-weight: 800;
}

body.ogonki-modern:has(.og-home-seo) #browse_category a:hover,
body.ogonki-modern:has(.og-home-seo) #browse_category a:focus,
body.ogonki-modern:has(.og-home-seo) #browse_category .browse_category_item:hover {
    border-color: #d9e0e5;
    box-shadow: 0 14px 34px rgba(22, 28, 35, .11);
    transform: translateY(-3px);
}

body.ogonki-modern:has(.og-home-seo) #browse_category a:hover img,
body.ogonki-modern:has(.og-home-seo) #browse_category a:focus img,
body.ogonki-modern:has(.og-home-seo) #browse_category .browse_category_item:hover img {
    transform: scale(1.045);
    filter: saturate(1.04) contrast(1.02);
}

body.ogonki-modern:has(.og-home-seo) #browse_category a:hover .subcat_name,
body.ogonki-modern:has(.og-home-seo) #browse_category a:focus .subcat_name,
body.ogonki-modern:has(.og-home-seo) #browse_category .browse_category_item:hover .subcat_name {
    background: rgba(14, 17, 20, .86);
    border-color: rgba(189,236,167,.34);
}

/* Best sellers / New tabs become a clean segmented control. */
body.ogonki-modern:has(.og-home-seo) .nav-tabs.content-tabs {
    display: flex;
    width: max-content;
    max-width: 100%;
    margin: 56px auto 24px;
    padding: 5px;
    gap: 4px;
    border: 1px solid var(--og-line);
    border-radius: 999px;
    background: var(--og-surface);
    box-shadow: var(--og-shadow-sm);
}

body.ogonki-modern:has(.og-home-seo) .nav-tabs.content-tabs > li {
    float: none;
    flex: 0 0 auto;
    margin: 0;
}

body.ogonki-modern:has(.og-home-seo) .nav-tabs.content-tabs > li > a {
    margin: 0;
    padding: 10px 16px;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent;
    color: var(--og-muted);
    font-family: var(--og-font) !important;
    font-size: 13px;
    line-height: 1.1;
    font-weight: 720;
    letter-spacing: 0;
    text-transform: none;
}

body.ogonki-modern:has(.og-home-seo) .nav-tabs.content-tabs > li > a:hover,
body.ogonki-modern:has(.og-home-seo) .nav-tabs.content-tabs > li > a:focus {
    background: var(--og-surface-soft);
    color: var(--og-text);
}

body.ogonki-modern:has(.og-home-seo) .nav-tabs.content-tabs > li.active > a,
body.ogonki-modern:has(.og-home-seo) .nav-tabs.content-tabs > li.active > a:hover,
body.ogonki-modern:has(.og-home-seo) .nav-tabs.content-tabs > li.active > a:focus {
    background: var(--og-dark);
    color: #fff;
    box-shadow: 0 5px 14px rgba(22,28,35,.16);
}

/* Slightly more breathing room around home product rails. */
body.ogonki-modern:has(.og-home-seo) .product_slider {
    margin-top: 4px;
}

body.ogonki-modern:has(.og-home-seo) .product_slider .product {
    border-radius: 18px;
}

@media (max-width: 767px) {
    body.ogonki-modern:has(.og-home-seo) .like_h2,
    body.ogonki-modern:has(.og-home-seo) .browse_category_title {
        margin-top: 40px;
        margin-bottom: 18px;
        padding-bottom: 12px;
        font-size: 24px;
    }

    body.ogonki-modern:has(.og-home-seo) #browse_category .subcats_imgs {
        margin-left: -5px;
        margin-right: -5px;
    }

    body.ogonki-modern:has(.og-home-seo) #browse_category .subcats_imgs > div {
        padding: 5px;
    }

    body.ogonki-modern:has(.og-home-seo) #browse_category a,
    body.ogonki-modern:has(.og-home-seo) #browse_category .browse_category_item {
        border-radius: 14px;
    }

    body.ogonki-modern:has(.og-home-seo) #browse_category img {
        aspect-ratio: 1.25 / 1;
    }

    body.ogonki-modern:has(.og-home-seo) #browse_category .subcat_name {
        left: 8px;
        right: 8px;
        bottom: 8px;
        min-height: 38px;
        padding: 8px 10px;
        border-radius: 10px;
        font-size: 12px;
    }

    body.ogonki-modern:has(.og-home-seo) .nav-tabs.content-tabs {
        margin-top: 42px;
        margin-bottom: 18px;
    }

    body.ogonki-modern:has(.og-home-seo) .nav-tabs.content-tabs > li > a {
        padding: 9px 13px;
        font-size: 12px;
    }
}


/* ========================================================================== 
   0.1.5 — Home rhythm, catalogue spacing, featured rail and promo banners
   --------------------------------------------------------------------------
   Feedback pass after visual review on 28.09.2026.
   Classic remains untouched; all selectors require Modern UI + home SEO block.
   ========================================================================== */

/* More air between category cards — both across columns and between rows. */
body.ogonki-modern:has(.og-home-seo) #browse_category .subcats_imgs {
    margin-left: -10px;
    margin-right: -10px;
}

body.ogonki-modern:has(.og-home-seo) #browse_category .subcats_imgs > div {
    padding: 10px;
}

/* SoloMono uses very tight 3px product gutters on the home catalogue.
   Modern UI gives every product card a real visual gutter and row rhythm. */
body.ogonki-modern:has(.og-home-seo) .row_catalog_products {
    margin-left: -10px;
    margin-right: -10px;
}

body.ogonki-modern:has(.og-home-seo) .row_catalog_products .col_product {
    padding-left: 10px !important;
    padding-right: 10px !important;
    margin-bottom: 22px;
}

/* In Owl rails a card should occupy its carousel cell instead of looking like
   a tiny Classic card floating inside a wide item. */
body.ogonki-modern:has(.og-home-seo) .product_slider .owl-item .col_product {
    width: 100% !important;
}

body.ogonki-modern:has(.og-home-seo) .product_slider .owl-item .product,
body.ogonki-modern:has(.og-home-seo) .product_slider .owl-item .p_description,
body.ogonki-modern:has(.og-home-seo) .product_slider .owl-item .p_img_href {
    width: 100% !important;
    max-width: none !important;
}

body.ogonki-modern:has(.og-home-seo) .product_slider .owl-item .p_img_href {
    display: block;
}

body.ogonki-modern:has(.og-home-seo) .product_slider .owl-item .p_img_href img {
    display: block;
    width: 100% !important;
    height: auto;
    object-fit: contain;
}

/* The pair “Новинки / Хиты” was visually dominating the whole first screen.
   Keep the same editable SoloMono banners, but present them as compact 16:9-ish
   promo cards. The main hero (.big_banner / front slider) is not affected. */
body.ogonki-modern:has(.og-home-seo) .banner_block {
    margin-top: 30px;
    margin-bottom: 24px;
}

body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner {
    height: clamp(250px, 20vw, 330px) !important;
    padding-top: 0 !important;
    margin-bottom: 20px;
    overflow: hidden;
    border-radius: 22px;
    background: #17191d;
    box-shadow: 0 10px 30px rgba(22, 28, 35, .08);
}

body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner img {
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    object-fit: cover;
    object-position: center;
    border-radius: inherit;
    transition: transform .35s ease, filter .35s ease;
}

body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner a {
    left: 0;
    width: 100%;
    border-radius: inherit;
    overflow: hidden;
}

body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner a::after {
    border-radius: inherit;
    background: linear-gradient(180deg, rgba(8,10,12,.02) 35%, rgba(8,10,12,.48) 100%);
}

body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner span {
    left: 28px;
    bottom: 24px;
    transform: none;
    max-width: calc(100% - 56px);
    color: #fff;
    font-family: var(--og-font) !important;
    font-size: clamp(20px, 1.7vw, 27px);
    line-height: 1.08;
    font-weight: 780;
    letter-spacing: .12em;
    text-align: left;
    text-transform: uppercase;
}

body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner:hover img {
    transform: scale(1.025);
    filter: saturate(1.03) contrast(1.02);
}

@media (max-width: 991px) {
    body.ogonki-modern:has(.og-home-seo) .row_catalog_products {
        margin-left: -7px;
        margin-right: -7px;
    }

    body.ogonki-modern:has(.og-home-seo) .row_catalog_products .col_product {
        padding-left: 7px !important;
        padding-right: 7px !important;
        margin-bottom: 16px;
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner {
        height: clamp(220px, 32vw, 300px) !important;
        border-radius: 18px;
    }
}

@media (max-width: 640px) {
    body.ogonki-modern:has(.og-home-seo) #browse_category .subcats_imgs {
        margin-left: -6px;
        margin-right: -6px;
    }

    body.ogonki-modern:has(.og-home-seo) #browse_category .subcats_imgs > div {
        padding: 6px;
    }

    body.ogonki-modern:has(.og-home-seo) .row_catalog_products {
        margin-left: -6px;
        margin-right: -6px;
    }

    body.ogonki-modern:has(.og-home-seo) .row_catalog_products .col_product {
        padding-left: 6px !important;
        padding-right: 6px !important;
        margin-bottom: 14px;
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block {
        margin-top: 22px;
        margin-bottom: 18px;
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner {
        height: 210px !important;
        margin-bottom: 12px;
        border-radius: 15px;
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner span {
        left: 18px;
        bottom: 17px;
        max-width: calc(100% - 36px);
        font-size: 18px;
        letter-spacing: .09em;
    }
}

/* ========================================================================== 
   0.1.6 — Home geometry cleanup
   --------------------------------------------------------------------------
   Removes the remaining Bootstrap/Owl geometry conflicts visible in 0.1.5:
   - promo pair becomes a real 2-column grid;
   - 4-item Featured rail becomes a full-width static grid;
   - categories become a true CSS grid with equal gaps in both directions;
   - product rows get calmer, consistent gutters.
   ========================================================================== */

/* Promo pair: Bootstrap columns were still dictating the visual geometry. */
body.ogonki-modern:has(.og-home-seo) .banner_block > .row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin: 0 !important;
}

body.ogonki-modern:has(.og-home-seo) .banner_block > .row > .section_banner {
    float: none !important;
    width: auto !important;
    height: 210px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Featured: with four products there is no reason to keep a 6-item Owl layout.
   JS marks this rail as .og-featured-static when it contains <= 4 real items. */
body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static {
    overflow: visible !important;
}

body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-stage-outer {
    overflow: visible !important;
}

body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-stage {
    width: 100% !important;
    transform: none !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-item {
    float: none !important;
    width: auto !important;
    margin: 0 !important;
}

body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .col_product {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .product,
body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .p_description {
    height: 100% !important;
}

body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .p_description {
    display: flex !important;
    flex-direction: column;
    padding: 12px 12px 16px;
}

body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .p_img_href {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 4 / 3;
    flex: 0 0 auto;
}

body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .p_img_href img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center;
}

body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .model_product {
    min-height: 44px;
    margin-top: 13px;
}

body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .new_old_price {
    margin-top: auto;
    padding-top: 12px;
}

body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-nav,
body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-controls {
    display: none !important;
}

/* Categories: stop fighting Bootstrap floats. One grid owns both horizontal and
   vertical spacing, so the rows cannot visually stick to each other. */
body.ogonki-modern:has(.og-home-seo) #browse_category.subcats_imgs {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    width: 100%;
    margin: 0 !important;
}

body.ogonki-modern:has(.og-home-seo) #browse_category.subcats_imgs > div {
    float: none !important;
    width: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.ogonki-modern:has(.og-home-seo) #browse_category.subcats_imgs > div > a {
    height: 100%;
}

body.ogonki-modern:has(.og-home-seo) #browse_category img {
    aspect-ratio: 1.38 / 1;
}

/* Standard product catalogue rows below the category mosaic. */
body.ogonki-modern:has(.og-home-seo) .row_catalog_products:not(:has(#featured)) {
    margin-left: -12px;
    margin-right: -12px;
}

body.ogonki-modern:has(.og-home-seo) .row_catalog_products:not(:has(#featured)) .col_product {
    padding-left: 12px !important;
    padding-right: 12px !important;
    margin-bottom: 26px;
}

/* Reduce the large dead zone between the compact Featured block and Categories. */
body.ogonki-modern:has(.og-home-seo) .row_catalog_products + .browse_category_title {
    margin-top: 46px;
}

@media (max-width: 991px) {
    body.ogonki-modern:has(.og-home-seo) .banner_block > .row > .section_banner {
        height: 190px !important;
    }

    body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-stage {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;
    }

    body.ogonki-modern:has(.og-home-seo) #browse_category.subcats_imgs {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;
    }
}

@media (max-width: 640px) {
    body.ogonki-modern:has(.og-home-seo) .banner_block > .row {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block > .row > .section_banner {
        height: 180px !important;
    }

    body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-stage {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    body.ogonki-modern:has(.og-home-seo) #browse_category.subcats_imgs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    body.ogonki-modern:has(.og-home-seo) .row_catalog_products:not(:has(#featured)) {
        margin-left: -6px;
        margin-right: -6px;
    }

    body.ogonki-modern:has(.og-home-seo) .row_catalog_products:not(:has(#featured)) .col_product {
        padding-left: 6px !important;
        padding-right: 6px !important;
        margin-bottom: 16px;
    }
}


/* ========================================================================== 
   0.1.7 — Geometry repair after real-page inspection
   --------------------------------------------------------------------------
   Fixes two Bootstrap clearfix pseudo-elements becoming grid items, makes the
   4-item Featured rail deterministic without depending on Owl internals, and
   prevents carousel cards from inheriting catalogue-row bottom margins.
   ========================================================================== */

/* Bootstrap .row adds ::before/::after. Once the row is a CSS grid those
   pseudo-elements become real grid cells and shift/hide promo cards. */
body.ogonki-modern:has(.og-home-seo) .banner_block > .row::before,
body.ogonki-modern:has(.og-home-seo) .banner_block > .row::after,
body.ogonki-modern:has(.og-home-seo) #browse_category.subcats_imgs::before,
body.ogonki-modern:has(.og-home-seo) #browse_category.subcats_imgs::after {
    content: none !important;
    display: none !important;
}

body.ogonki-modern:has(.og-home-seo) .banner_block > .row {
    align-items: stretch;
}

body.ogonki-modern:has(.og-home-seo) .banner_block > .row > .section_banner {
    display: block !important;
    min-width: 0;
}

/* Featured: JS adds this class by counting DOM items only. Hide Owl clones and
   let exactly four real recommendations occupy the full content width. */
body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static,
body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-stage-outer {
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;
}

body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-stage {
    width: 100% !important;
    height: auto !important;
    transform: none !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-item {
    float: none !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
}

body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-item.cloned {
    display: none !important;
}

body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-item .col_product {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-nav,
body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-controls,
body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-dots {
    display: none !important;
}

/* Owl rails must not inherit catalogue-row vertical margins; Owl calculates
   its own stage height and extra margins caused the following SEO section to
   visually ride over product cards. */
body.ogonki-modern:has(.og-home-seo) .product_slider .owl-item .col_product {
    margin-bottom: 0 !important;
}

/* Keep the Best sellers / New block in normal document flow. */
body.ogonki-modern:has(.og-home-seo) .sliders_tabs,
body.ogonki-modern:has(.og-home-seo) .sliders_tabs .tab-content,
body.ogonki-modern:has(.og-home-seo) .sliders_tabs .tab-pane.active {
    position: relative;
}

body.ogonki-modern:has(.og-home-seo) .sliders_tabs .tab-pane.active::after {
    content: "";
    display: table;
    clear: both;
}

body.ogonki-modern:has(.og-home-seo) .sliders_tabs {
    margin-bottom: 54px !important;
}

body.ogonki-modern:has(.og-home-seo) .og-home-seo {
    clear: both;
    position: relative;
    z-index: 1;
}

@media (max-width: 991px) {
    body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-stage {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;
    }
}

@media (max-width: 640px) {
    body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-stage {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }
}

/* ========================================================================== 
   0.3.1 — Premium home pass I
   --------------------------------------------------------------------------
   Pure presentation. Keeps SoloMono markup/data and the existing 0.3.0 tab
   behaviour intact.
   ========================================================================== */

/* A calmer, more editorial hero: one-line title on regular desktop, natural
   wrapping on smaller widths. */
@media (min-width: 1100px) {
    body.ogonki-modern .og-home-seo__hero {
        grid-template-columns: minmax(0, 1.78fr) minmax(250px, .56fr);
        gap: 42px;
    }

    body.ogonki-modern .og-home-seo__title {
        max-width: none;
        white-space: nowrap;
        font-size: clamp(38px, 3.15vw, 46px);
        line-height: 1.02;
        letter-spacing: -.045em;
    }
}

/* Premium frame: deliberately subtle so it reads as quality rather than as
   a glowing game UI. */
body.ogonki-modern .og-home-seo__surface {
    position: relative;
    isolation: isolate;
    box-shadow:
        0 28px 72px rgba(22, 28, 35, .095),
        0 2px 8px rgba(22, 28, 35, .035);
}

body.ogonki-modern .og-home-seo__surface::before {
    content: "";
    position: absolute;
    z-index: 0;
    left: 34px;
    right: 34px;
    top: 0;
    height: 1px;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(168,210,79,.72) 24%, rgba(103,184,62,.28) 58%, transparent);
}

body.ogonki-modern .og-home-seo__surface > * {
    position: relative;
    z-index: 1;
}

body.ogonki-modern .og-home-seo__eyebrow {
    letter-spacing: .105em;
}

body.ogonki-modern .og-home-seo__quick li {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding-top: 11px;
    padding-bottom: 11px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.58);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

body.ogonki-modern .og-home-seo__quick li::before {
    top: 50%;
    transform: translateY(-50%);
}

body.ogonki-modern .og-home-seo__category {
    border-radius: 18px;
    box-shadow: 0 5px 18px rgba(22,28,35,.035);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background-color .2s ease;
}

body.ogonki-modern .og-home-seo__card {
    position: relative;
    overflow: hidden;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.55);
}

body.ogonki-modern .og-home-seo__card--brand::after {
    content: "";
    position: absolute;
    right: -70px;
    top: -85px;
    width: 210px;
    height: 210px;
    border-radius: 50%;
    pointer-events: none;
    background: radial-gradient(circle, rgba(168,210,79,.17), transparent 67%);
}

body.ogonki-modern .og-home-seo__cta {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(103,184,62,.11);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.42);
}

body.ogonki-modern .og-home-seo__cta::before {
    content: "";
    position: absolute;
    right: -70px;
    top: -120px;
    width: 250px;
    height: 250px;
    border-radius: 50%;
    pointer-events: none;
    background: radial-gradient(circle, rgba(103,184,62,.13), transparent 68%);
}

body.ogonki-modern .og-home-seo__cta > * {
    position: relative;
    z-index: 1;
}

/* Refined home storefront depth. */
@media (hover: hover) and (pointer: fine) {
    body.ogonki-modern:has(.og-home-seo) .product,
    body.ogonki-modern:has(.og-home-seo) .product_slider .product,
    body.ogonki-modern:has(.og-home-seo) #featured .product {
        transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background-color .2s ease;
    }

    body.ogonki-modern:has(.og-home-seo) .product:hover,
    body.ogonki-modern:has(.og-home-seo) .product_slider .product:hover,
    body.ogonki-modern:has(.og-home-seo) #featured .product:hover {
        transform: translateY(-4px);
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner,
    body.ogonki-modern:has(.og-home-seo) #browse_category a {
        transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, filter .22s ease;
    }
}

@media (max-width: 1099px) {
    body.ogonki-modern .og-home-seo__title {
        white-space: normal;
    }
}

@media (max-width: 640px) {
    body.ogonki-modern .og-home-seo__surface::before {
        left: 18px;
        right: 18px;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.ogonki-modern .og-home-seo__quick li,
    body.ogonki-modern .og-home-seo__category,
    body.ogonki-modern:has(.og-home-seo) .product,
    body.ogonki-modern:has(.og-home-seo) .product_slider .product,
    body.ogonki-modern:has(.og-home-seo) #featured .product,
    body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner,
    body.ogonki-modern:has(.og-home-seo) #browse_category a {
        transition: none !important;
    }
}


/* ========================================================================== 
   0.3.2 — Premium home pass II
   --------------------------------------------------------------------------
   One visual system for the whole home page: framed hero, quieter promo pair,
   deeper category/product cards and a more architectural SEO surface.
   Data, links, image ratios, Owl logic and Classic remain untouched.
   ========================================================================== */

/* --- Main campaign hero -------------------------------------------------- */
body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type {
    margin-top: 26px;
    margin-bottom: 26px;
    padding: 10px !important;
    overflow: hidden;
    border: 1px solid var(--og-line);
    border-radius: 28px;
    background: var(--og-surface);
    box-shadow: 0 22px 60px rgba(22,28,35,.085);
}

body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type img {
    border-radius: 19px;
}

/* Stock slider pagination is visually heavy. Turn it into a quiet progress
   detail while leaving all existing controls/click handlers in place. */
body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type .carousel-indicators,
body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type .slick-dots,
body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type .owl-dots {
    margin-top: 10px;
}

body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type .carousel-indicators li,
body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type .slick-dots li button,
body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type .owl-dot span {
    border-radius: 999px !important;
}

/* --- Promo pair “Новинки / Хиты” --------------------------------------- */
body.ogonki-modern:has(.og-home-seo) .banner_block {
    margin-top: 28px;
    margin-bottom: 38px;
}

body.ogonki-modern:has(.og-home-seo) .banner_block > .row {
    gap: 20px;
}

body.ogonki-modern:has(.og-home-seo) .banner_block > .row > .section_banner {
    height: 190px !important;
    border: 1px solid var(--og-line);
    border-radius: 22px;
    box-shadow: 0 12px 34px rgba(22,28,35,.08);
}

body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner a::after {
    background:
        linear-gradient(180deg, rgba(8,10,12,.02) 32%, rgba(8,10,12,.12) 56%, rgba(8,10,12,.68) 100%);
}

body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner span {
    left: 22px;
    bottom: 19px;
    max-width: calc(100% - 44px);
    font-size: 18px;
    line-height: 1.1;
    letter-spacing: .105em;
    text-shadow: 0 3px 18px rgba(0,0,0,.28);
}

/* --- Section titles ----------------------------------------------------- */
body.ogonki-modern:has(.og-home-seo) .like_h2,
body.ogonki-modern:has(.og-home-seo) .browse_category_title {
    min-height: 48px;
    margin-top: 64px;
    margin-bottom: 26px;
    padding-bottom: 16px;
}

body.ogonki-modern:has(.og-home-seo) .like_h2::after,
body.ogonki-modern:has(.og-home-seo) .browse_category_title::after {
    width: 64px;
    height: 3px;
    box-shadow: 0 0 18px rgba(103,184,62,.14);
}

/* --- Category gallery --------------------------------------------------- */
body.ogonki-modern:has(.og-home-seo) #browse_category.subcats_imgs {
    gap: 20px;
}

body.ogonki-modern:has(.og-home-seo) #browse_category a,
body.ogonki-modern:has(.og-home-seo) #browse_category .browse_category_item {
    border-radius: 20px;
    box-shadow: 0 10px 28px rgba(22,28,35,.075);
}

body.ogonki-modern:has(.og-home-seo) #browse_category a::after,
body.ogonki-modern:has(.og-home-seo) #browse_category .browse_category_item::after {
    background:
        linear-gradient(180deg, rgba(7,9,12,.00) 33%, rgba(7,9,12,.10) 53%, rgba(7,9,12,.68) 100%);
}

body.ogonki-modern:has(.og-home-seo) #browse_category .subcat_name {
    left: 12px;
    right: 12px;
    bottom: 12px;
    min-height: 44px;
    padding: 10px 13px;
    border-color: rgba(255,255,255,.15);
    border-radius: 13px;
    background: linear-gradient(180deg, rgba(23,27,31,.72), rgba(14,17,20,.86));
    box-shadow: 0 8px 24px rgba(0,0,0,.15), inset 0 1px 0 rgba(255,255,255,.06);
}

/* --- Product cards ------------------------------------------------------ */
body.ogonki-modern:has(.og-home-seo) .product,
body.ogonki-modern:has(.og-home-seo) .product_slider .product,
body.ogonki-modern:has(.og-home-seo) #featured .product {
    border-radius: 21px;
}

body.ogonki-modern:has(.og-home-seo) .product .p_description,
body.ogonki-modern:has(.og-home-seo) .product_slider .product .p_description,
body.ogonki-modern:has(.og-home-seo) #featured .product .p_description {
    padding: 14px 14px 17px;
}

body.ogonki-modern:has(.og-home-seo) .product .p_img_href,
body.ogonki-modern:has(.og-home-seo) .product_slider .product .p_img_href,
body.ogonki-modern:has(.og-home-seo) #featured .product .p_img_href {
    border-radius: 15px !important;
}

body.ogonki-modern:has(.og-home-seo) .product .model_product,
body.ogonki-modern:has(.og-home-seo) .product_slider .product .model_product,
body.ogonki-modern:has(.og-home-seo) #featured .product .model_product {
    margin-top: 14px;
    font-weight: 690;
    letter-spacing: -.015em;
}

body.ogonki-modern:has(.og-home-seo) .product .price,
body.ogonki-modern:has(.og-home-seo) .product .price > span,
body.ogonki-modern:has(.og-home-seo) .product_slider .product .price,
body.ogonki-modern:has(.og-home-seo) .product_slider .product .price > span {
    font-weight: 790;
    letter-spacing: -.015em;
}

/* The sale pill should read like an inset status chip, not a sticker hanging
   on the photo radius. This wins over the older 0.3.0 optical offset. */
body.ogonki-modern:has(.og-home-seo) .row_catalog_products .product .product_label,
body.ogonki-modern:has(.og-home-seo) .product_slider .product .product_label,
body.ogonki-modern:has(.og-home-seo) .sliders_tabs .product .product_label,
body.ogonki-modern:has(.og-home-seo) #featured .product .product_label,
body.ogonki-modern:has(.og-home-seo) .product .label1.product_label,
body.ogonki-modern:has(.og-home-seo) .product .label2.product_label,
body.ogonki-modern:has(.og-home-seo) .product .label3.product_label,
body.ogonki-modern:has(.og-home-seo) .product .label4.product_label {
    top: 30px !important;
    right: 28px !important;
    padding: 7px 11px !important;
    letter-spacing: .055em !important;
}

/* --- Best sellers / New ------------------------------------------------- */
body.ogonki-modern:has(.og-home-seo) .sliders_tabs {
    margin-top: 60px !important;
    margin-bottom: 62px !important;
}

body.ogonki-modern:has(.og-home-seo) .sliders_tabs .nav-tabs {
    margin-bottom: 28px !important;
}

body.ogonki-modern:has(.og-home-seo) .sliders_tabs .nav-tabs > li > a {
    padding-left: 17px;
    padding-right: 17px;
    font-size: 13px;
    letter-spacing: .025em;
}

/* --- SEO/content architecture ------------------------------------------ */
@media (min-width: 1080px) {
    body.ogonki-modern .og-home-seo__hero {
        grid-template-columns: minmax(0, 2fr) minmax(280px, .60fr);
        gap: 38px;
    }

    body.ogonki-modern .og-home-seo__title {
        max-width: none;
        white-space: nowrap;
        font-size: clamp(33px, 2.45vw, 38px);
        line-height: 1.02;
        letter-spacing: -.044em;
    }
}

body.ogonki-modern .og-home-seo {
    margin-top: 78px;
}

body.ogonki-modern .og-home-seo__surface {
    padding: 48px;
    border-radius: 30px;
}

body.ogonki-modern .og-home-seo__hero {
    padding-bottom: 38px;
}

body.ogonki-modern .og-home-seo__lead {
    max-width: 820px;
    font-size: 17px;
}

body.ogonki-modern .og-home-seo__section {
    padding-top: 40px;
}

body.ogonki-modern .og-home-seo__categories {
    gap: 14px;
}

body.ogonki-modern .og-home-seo__category {
    min-height: 92px;
    padding: 20px 44px 20px 20px;
}

body.ogonki-modern .og-home-seo__two-col {
    gap: 16px;
}

body.ogonki-modern .og-home-seo__card {
    padding: 29px;
    border-radius: 22px;
}

body.ogonki-modern .og-home-seo__cta {
    padding: 30px 32px;
    border-radius: 22px;
}

/* --- Hover: expensive, restrained, lighting-inspired ------------------- */
@media (hover: hover) and (pointer: fine) {
    body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner:hover,
    body.ogonki-modern:has(.og-home-seo) #browse_category a:hover,
    body.ogonki-modern:has(.og-home-seo) .product:hover,
    body.ogonki-modern:has(.og-home-seo) .product_slider .product:hover {
        transform: translateY(-4px);
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner:hover img {
        transform: scale(1.035);
    }

    body.ogonki-modern .og-home-seo__quick li:hover,
    body.ogonki-modern .og-home-seo__category:hover {
        transform: translateY(-2px);
    }
}

@media (max-width: 1079px) {
    body.ogonki-modern .og-home-seo__title {
        white-space: normal;
    }
}

@media (max-width: 991px) {
    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type {
        margin-top: 18px;
        margin-bottom: 18px;
        padding: 7px !important;
        border-radius: 22px;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type img {
        border-radius: 16px;
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block > .row > .section_banner {
        height: 175px !important;
    }

    body.ogonki-modern:has(.og-home-seo) #browse_category.subcats_imgs {
        gap: 15px;
    }

    body.ogonki-modern .og-home-seo {
        margin-top: 58px;
    }

    body.ogonki-modern .og-home-seo__surface {
        padding: 32px;
        border-radius: 24px;
    }
}

@media (max-width: 640px) {
    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type {
        margin-top: 12px;
        padding: 4px !important;
        border-radius: 17px;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type img {
        border-radius: 13px;
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block > .row > .section_banner {
        height: 160px !important;
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner span {
        left: 16px;
        bottom: 15px;
        font-size: 16px;
    }

    body.ogonki-modern:has(.og-home-seo) .like_h2,
    body.ogonki-modern:has(.og-home-seo) .browse_category_title {
        margin-top: 46px;
        margin-bottom: 19px;
    }

    body.ogonki-modern:has(.og-home-seo) #browse_category.subcats_imgs {
        gap: 12px;
    }

    body.ogonki-modern:has(.og-home-seo) .row_catalog_products .product .product_label,
    body.ogonki-modern:has(.og-home-seo) .product_slider .product .product_label,
    body.ogonki-modern:has(.og-home-seo) .sliders_tabs .product .product_label,
    body.ogonki-modern:has(.og-home-seo) #featured .product .product_label,
    body.ogonki-modern:has(.og-home-seo) .product .label1.product_label,
    body.ogonki-modern:has(.og-home-seo) .product .label2.product_label,
    body.ogonki-modern:has(.og-home-seo) .product .label3.product_label,
    body.ogonki-modern:has(.og-home-seo) .product .label4.product_label {
        top: 18px !important;
        right: 17px !important;
    }

    body.ogonki-modern .og-home-seo {
        margin-top: 46px;
    }

    body.ogonki-modern .og-home-seo__surface {
        padding: 21px;
        border-radius: 20px;
    }
}


/* ========================================================================== 
   0.3.3 — Image clip, badge polish and universal carousel arrows
   --------------------------------------------------------------------------
   Modern-only final overrides. Classic markup/assets remain untouched.
   ========================================================================== */

/* One clipping surface. The image itself no longer has a second radius, so
   no dark/white corner can show between the photo and its wrapper. */
body.ogonki-modern:has(.og-home-seo) .product .p_img_href,
body.ogonki-modern:has(.og-home-seo) .product_slider .product .p_img_href,
body.ogonki-modern:has(.og-home-seo) #featured .product .p_img_href,
body.ogonki-modern:has(.og-home-seo) .sliders_tabs .product .p_img_href {
    position: relative;
    display: block !important;
    overflow: hidden !important;
    border-radius: 15px !important;
    background: transparent !important;
    line-height: 0 !important;
    isolation: isolate;
}

body.ogonki-modern:has(.og-home-seo) .product .p_img_href img,
body.ogonki-modern:has(.og-home-seo) .product_slider .product .p_img_href img,
body.ogonki-modern:has(.og-home-seo) #featured .product .p_img_href img,
body.ogonki-modern:has(.og-home-seo) .sliders_tabs .product .p_img_href img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    object-fit: cover !important;
    object-position: center center !important;
    vertical-align: top !important;
}

/* Give the sale chip a true inset from the PHOTO edge rather than the outer
   card edge. A pill works in both colour schemes and reads less like a stock
   Bootstrap label. */
body.ogonki-modern:has(.og-home-seo) .row_catalog_products .product .product_label,
body.ogonki-modern:has(.og-home-seo) .product_slider .product .product_label,
body.ogonki-modern:has(.og-home-seo) .sliders_tabs .product .product_label,
body.ogonki-modern:has(.og-home-seo) #featured .product .product_label,
body.ogonki-modern:has(.og-home-seo) .product .label1.product_label,
body.ogonki-modern:has(.og-home-seo) .product .label2.product_label,
body.ogonki-modern:has(.og-home-seo) .product .label3.product_label,
body.ogonki-modern:has(.og-home-seo) .product .label4.product_label {
    top: 34px !important;
    right: 34px !important;
    left: auto !important;
    bottom: auto !important;
    border-radius: 999px !important;
    padding: 7px 13px !important;
    line-height: 1 !important;
}

/* Owl markup differs between old SoloMono modules. Target every homepage Owl
   control inside Modern instead of relying on one historical container. */
body.ogonki-modern:has(.og-home-seo) .owl-prev,
body.ogonki-modern:has(.og-home-seo) .owl-next {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    border: 1px solid rgba(168,210,79,.48) !important;
    border-radius: 999px !important;
    background: rgba(18,24,28,.96) !important;
    background-image: none !important;
    color: #d9f67a !important;
    font: 0/0 a !important;
    text-indent: 0 !important;
    opacity: 1 !important;
    overflow: visible !important;
    box-shadow: 0 10px 28px rgba(0,0,0,.22), 0 0 18px rgba(168,210,79,.06) !important;
}

body.ogonki-modern:has(.og-home-seo) .owl-prev > *,
body.ogonki-modern:has(.og-home-seo) .owl-next > * {
    display: none !important;
}

body.ogonki-modern:has(.og-home-seo) .owl-prev::before,
body.ogonki-modern:has(.og-home-seo) .owl-next::before {
    display: block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: currentColor !important;
    box-shadow: none !important;
    font-family: Arial, sans-serif !important;
    font-size: 29px !important;
    line-height: 1 !important;
    font-weight: 400 !important;
    transform: translateY(-1px) !important;
}

body.ogonki-modern:has(.og-home-seo) .owl-prev::before { content: "‹" !important; }
body.ogonki-modern:has(.og-home-seo) .owl-next::before { content: "›" !important; }
body.ogonki-modern:has(.og-home-seo) .owl-prev::after,
body.ogonki-modern:has(.og-home-seo) .owl-next::after { content: none !important; display: none !important; }

html[data-og-theme="day"] body.ogonki-modern:has(.og-home-seo) .owl-prev,
html[data-og-theme="day"] body.ogonki-modern:has(.og-home-seo) .owl-next {
    border-color: rgba(111,142,47,.32) !important;
    background: rgba(255,255,255,.96) !important;
    color: #658633 !important;
    box-shadow: 0 9px 24px rgba(20,25,30,.12) !important;
}

@media (max-width: 767px) {
    body.ogonki-modern:has(.og-home-seo) .row_catalog_products .product .product_label,
    body.ogonki-modern:has(.og-home-seo) .product_slider .product .product_label,
    body.ogonki-modern:has(.og-home-seo) .sliders_tabs .product .product_label,
    body.ogonki-modern:has(.og-home-seo) #featured .product .product_label,
    body.ogonki-modern:has(.og-home-seo) .product .label1.product_label,
    body.ogonki-modern:has(.og-home-seo) .product .label2.product_label,
    body.ogonki-modern:has(.og-home-seo) .product .label3.product_label,
    body.ogonki-modern:has(.og-home-seo) .product .label4.product_label {
        top: 24px !important;
        right: 24px !important;
        padding: 6px 10px !important;
    }

    body.ogonki-modern:has(.og-home-seo) .owl-prev,
    body.ogonki-modern:has(.og-home-seo) .owl-next {
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
    }

    body.ogonki-modern:has(.og-home-seo) .owl-prev::before,
    body.ogonki-modern:has(.og-home-seo) .owl-next::before {
        font-size: 26px !important;
    }
}

/* ========================================================================== 
   0.3.4 — Hero clip / inner-corner cleanup
   --------------------------------------------------------------------------
   The stock Owl front slider has several nested rectangular layers. On a
   rounded Modern frame they could expose square inner corners or a neighbouring
   slide at the radius. Clip the actual slider viewport, not only the outer
   decorative container. Image ratio/data and Owl logic are unchanged.
   ========================================================================== */

body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type > .position-relative,
body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider,
body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-stage-outer {
    position: relative;
    overflow: hidden !important;
    border-radius: 19px !important;
    background: transparent !important;
    isolation: isolate;
    -webkit-clip-path: inset(0 round 19px);
    clip-path: inset(0 round 19px);
    transform: translateZ(0);
}

body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-stage-outer {
    width: 100% !important;
    max-width: 100% !important;
    contain: paint;
}

body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item,
body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item > .item,
body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item {
    overflow: hidden !important;
    border-radius: 19px !important;
    background-clip: padding-box !important;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

/* Every slide owns its full Owl cell. This prevents a rectangular neighbour
   from peeking through at the right radius during/after transitions. */
body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item > .item,
body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}

body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item > .item > a,
body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item > a {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    overflow: hidden;
}

@media (max-width: 991px) {
    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type > .position-relative,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-stage-outer,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item {
        border-radius: 16px !important;
        -webkit-clip-path: inset(0 round 16px);
        clip-path: inset(0 round 16px);
    }
}

@media (max-width: 640px) {
    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type > .position-relative,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-stage-outer,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item {
        border-radius: 12px !important;
        -webkit-clip-path: inset(0 round 12px);
        clip-path: inset(0 round 12px);
    }
}

/* ========================================================================== 
   0.3.5 — Hero frame: thin premium outline instead of a white tray
   --------------------------------------------------------------------------
   The 0.3.2 hero wrapper used padding + surface background, which became a
   large white frame in Day mode. Keep the slider geometry untouched, remove
   the tray, and leave only a thin theme-aware outline around the real viewport.
   ========================================================================== */

body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type {
    margin-top: 26px !important;
    margin-bottom: 26px !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type > .position-relative {
    border: 1px solid rgba(82, 101, 61, .24) !important;
    border-radius: 20px !important;
    background: transparent !important;
    box-shadow: 0 18px 46px rgba(22, 28, 35, .10) !important;
}

html[data-og-theme="night"] body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type > .position-relative {
    border-color: rgba(190, 235, 98, .16) !important;
    box-shadow: 0 18px 46px rgba(0, 0, 0, .20), 0 0 26px rgba(168, 210, 79, .025) !important;
}

html[data-og-theme="day"] body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type > .position-relative {
    border-color: rgba(92, 118, 52, .24) !important;
    box-shadow: 0 18px 46px rgba(22, 28, 35, .09) !important;
}

/* The slide viewport itself owns the rounded corners; avoid a second visible
   inner frame while preserving clipping of neighbouring Owl cells. */
body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider,
body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-stage-outer {
    border-radius: 19px !important;
}

@media (max-width: 991px) {
    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type {
        margin-top: 18px !important;
        margin-bottom: 18px !important;
        padding: 0 !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type > .position-relative {
        border-radius: 17px !important;
    }
}

@media (max-width: 640px) {
    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type {
        margin-top: 12px !important;
        padding: 0 !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type > .position-relative {
        border-radius: 13px !important;
    }
}

/* ========================================================================== 
   0.3.6 — Hero bottom-strip cleanup
   --------------------------------------------------------------------------
   Solo Home gives the front Owl slider its own bottom margin so stock pager
   controls can sit underneath it. Inside the new thin Modern frame that legacy
   margin becomes a visible empty strip below the hero image. Remove only that
   spacing in Modern UI; slider data, dimensions and controls stay untouched.
   ========================================================================== */

body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider {
    margin-bottom: 0 !important;
}

body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type > .position-relative {
    padding-bottom: 0 !important;
}

/* ========================================================================== 
   0.3.8 — Mobile storefront pass
   --------------------------------------------------------------------------
   The stock Solo Home front slider keeps a very wide desktop proportion on
   phones, so a 1200×600 Modern mobile banner is squeezed into a shallow strip.
   On phones the Modern hero now owns a true 2:1 viewport, tighter vertical
   rhythm and overlay pager. Promo cards are also reduced so the first screen
   reads as a storefront rather than a stack of oversized banners.
   Classic is not affected.
   ========================================================================== */

@media (max-width: 767px) {
    /* Hero: use the exact 1200×600 preparation ratio on mobile. */
    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type {
        width: auto !important;
        max-width: none !important;
        margin: 14px 12px 12px !important;
        padding: 0 !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type > .position-relative,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-stage-outer,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item > .item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item {
        border-radius: 17px !important;
        -webkit-clip-path: inset(0 round 17px);
        clip-path: inset(0 round 17px);
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type > .position-relative {
        overflow: hidden !important;
        border-width: 1px !important;
        box-shadow: 0 13px 34px rgba(13,18,22,.12) !important;
    }

    html[data-og-theme="night"] body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type > .position-relative {
        box-shadow: 0 15px 38px rgba(0,0,0,.30), 0 0 26px rgba(168,210,79,.025) !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-stage-outer,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item > .item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item > a {
        height: clamp(174px, calc((100vw - 24px) / 2), 260px) !important;
        min-height: 0 !important;
        max-height: 260px !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item {
        background-size: cover !important;
        background-position: center center !important;
    }

    /* Keep stock pagination, but make it a small overlay instead of a strip. */
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-controls,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-dots,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-pagination {
        position: absolute !important;
        right: 12px !important;
        bottom: 10px !important;
        z-index: 8 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 5px !important;
        width: auto !important;
        margin: 0 !important;
        padding: 5px 7px !important;
        border-radius: 999px !important;
        background: rgba(8,12,15,.34) !important;
        -webkit-backdrop-filter: blur(8px);
        backdrop-filter: blur(8px);
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-dot,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-page {
        margin: 0 !important;
        padding: 0 !important;
        line-height: 0 !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-dot span,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-page span {
        display: block !important;
        width: 18px !important;
        height: 3px !important;
        margin: 0 !important;
        border: 0 !important;
        border-radius: 999px !important;
        background: rgba(255,255,255,.42) !important;
        box-shadow: none !important;
        opacity: 1 !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-dot.active span,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-page.active span {
        width: 30px !important;
        background: #c6ef66 !important;
        box-shadow: 0 0 10px rgba(198,239,102,.24) !important;
    }

    /* No hero arrows on touch screens: swipe + progress is cleaner. */
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-nav,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-buttons {
        display: none !important;
    }

    /* Promo pair: shorter, denser and closer to hero. */
    body.ogonki-modern:has(.og-home-seo) .banner_block {
        margin-top: 14px !important;
        margin-bottom: 28px !important;
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block > .row {
        gap: 14px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block > .row > .section_banner {
        width: 100% !important;
        height: 164px !important;
        margin: 0 !important;
        padding: 0 !important;
        border-radius: 18px !important;
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        border-radius: inherit !important;
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block .section_banner span {
        left: 17px !important;
        right: 17px !important;
        bottom: 15px !important;
        max-width: calc(100% - 34px) !important;
        font-size: 17px !important;
        line-height: 1.08 !important;
        letter-spacing: .08em !important;
    }

    /* First section starts sooner after the promo pair. */
    body.ogonki-modern:has(.og-home-seo) .like_h2,
    body.ogonki-modern:has(.og-home-seo) .browse_category_title {
        margin-top: 30px !important;
    }
}

@media (max-width: 420px) {
    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type {
        margin-left: 10px !important;
        margin-right: 10px !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-stage-outer,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item > a {
        height: clamp(170px, calc((100vw - 20px) / 2), 218px) !important;
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block > .row > .section_banner {
        height: 154px !important;
    }
}


/* ========================================================================== 
   0.3.9 — mobile home premium pass
   --------------------------------------------------------------------------
   Goals from the review:
   - remove the giant blurred oval from the hero;
   - stack "Новинки / Хиты" into one calm editorial column;
   - move product cards to one-per-row on phones, with larger imagery and
     tighter paddings so the mobile page feels more premium.
   ========================================================================== */

@media (max-width: 767px) {
    /* The legacy Owl controls can inherit huge geometry from stock styles.
       On touch screens the cleanest fix is to remove them entirely and rely on
       swipe; this also kills the giant blurred spot seen in v0.3.8. */
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-controls,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-dots,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-pagination,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-buttons,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-nav {
        display: none !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type {
        margin-left: 14px !important;
        margin-right: 14px !important;
        border-radius: 18px !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type > .position-relative {
        border-radius: 16px !important;
        border-width: 1px !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-stage-outer,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item > .item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item > a {
        height: clamp(168px, calc((100vw - 28px) / 2), 224px) !important;
        max-height: 224px !important;
    }

    /* Promo pair: one column, slightly narrower, calmer rhythm. */
    body.ogonki-modern:has(.og-home-seo) .banner_block {
        margin-top: 16px !important;
        margin-bottom: 24px !important;
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block > .row {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block > .row > .section_banner {
        height: 148px !important;
        border-radius: 18px !important;
    }

    /* Section headings do not need huge top gaps on mobile. */
    body.ogonki-modern:has(.og-home-seo) .like_h2,
    body.ogonki-modern:has(.og-home-seo) .browse_category_title {
        margin-top: 26px !important;
        margin-bottom: 18px !important;
        padding-bottom: 12px !important;
    }

    /* Featured / recommended: one product per row, bigger visual and tighter
       internal spacing so the card reads less like a cheap grid tile. */
    body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .owl-stage {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    body.ogonki-modern:has(.og-home-seo) .row_catalog_products:not(:has(#featured)) {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body.ogonki-modern:has(.og-home-seo) .row_catalog_products:not(:has(#featured)) .col_product,
    body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .col_product {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-bottom: 14px !important;
    }

    body.ogonki-modern:has(.og-home-seo) .product,
    body.ogonki-modern:has(.og-home-seo) .product_slider .product,
    body.ogonki-modern:has(.og-home-seo) #featured .product {
        border-radius: 20px !important;
    }

    body.ogonki-modern:has(.og-home-seo) .product .p_description,
    body.ogonki-modern:has(.og-home-seo) .product_slider .product .p_description,
    body.ogonki-modern:has(.og-home-seo) #featured .product .p_description {
        padding: 10px 10px 14px !important;
    }

    body.ogonki-modern:has(.og-home-seo) .product .p_img_href,
    body.ogonki-modern:has(.og-home-seo) .product_slider .product .p_img_href,
    body.ogonki-modern:has(.og-home-seo) #featured .product .p_img_href,
    body.ogonki-modern:has(.og-home-seo) .sliders_tabs .product .p_img_href {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 1.5 / 1 !important;
        border-radius: 16px !important;
    }

    body.ogonki-modern:has(.og-home-seo) .product .p_img_href img,
    body.ogonki-modern:has(.og-home-seo) .product_slider .product .p_img_href img,
    body.ogonki-modern:has(.og-home-seo) #featured .product .p_img_href img,
    body.ogonki-modern:has(.og-home-seo) .sliders_tabs .product .p_img_href img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center !important;
    }

    body.ogonki-modern:has(.og-home-seo) .product .model_product,
    body.ogonki-modern:has(.og-home-seo) .product_slider .product .model_product,
    body.ogonki-modern:has(.og-home-seo) #featured .product .model_product {
        min-height: 0 !important;
        margin-top: 10px !important;
        font-size: 19px !important;
        line-height: 1.24 !important;
    }

    body.ogonki-modern:has(.og-home-seo) .product .price,
    body.ogonki-modern:has(.og-home-seo) .product .price > span,
    body.ogonki-modern:has(.og-home-seo) .product_slider .product .price,
    body.ogonki-modern:has(.og-home-seo) .product_slider .product .price > span {
        font-size: 16px !important;
    }
}

@media (max-width: 420px) {
    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type {
        margin-left: 12px !important;
        margin-right: 12px !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-stage-outer,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item > .item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item > a {
        height: clamp(162px, calc((100vw - 24px) / 2), 212px) !important;
    }

    body.ogonki-modern:has(.og-home-seo) .banner_block > .row > .section_banner {
        height: 142px !important;
    }
}


/* ========================================================================== 
   0.4.0 — mobile premium continuation
   --------------------------------------------------------------------------
   The first-screen fixes in 0.3.9 continue through products and the SEO block.
   Text remains intact; we only reduce visual bulk and improve hierarchy.
   ========================================================================== */

@media (max-width: 767px) {
    /* Give the phone canvas a little more air without wasting width. */
    body.ogonki-modern:has(.og-home-seo) main > .container:not(:first-of-type) {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    /* Product card typography and spacing. */
    body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .product,
    body.ogonki-modern:has(.og-home-seo) .row_catalog_products .product {
        min-height: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        box-shadow: 0 10px 28px rgba(9,13,17,.11) !important;
    }

    body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .p_description,
    body.ogonki-modern:has(.og-home-seo) .row_catalog_products .p_description {
        min-height: 0 !important;
        padding: 10px 10px 13px !important;
    }

    body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .model_product,
    body.ogonki-modern:has(.og-home-seo) .row_catalog_products .model_product {
        margin: 10px 2px 0 !important;
        font-size: 18px !important;
        line-height: 1.22 !important;
        min-height: 0 !important;
    }

    body.ogonki-modern:has(.og-home-seo) #featured.og-featured-static .new_old_price,
    body.ogonki-modern:has(.og-home-seo) .row_catalog_products .new_old_price {
        margin: 10px 2px 0 !important;
        padding-top: 0 !important;
    }

    /* Sale chip: breathe from both top and right edge on phones. */
    body.ogonki-modern:has(.og-home-seo) .row_catalog_products .product .product_label,
    body.ogonki-modern:has(.og-home-seo) .product_slider .product .product_label,
    body.ogonki-modern:has(.og-home-seo) .sliders_tabs .product .product_label,
    body.ogonki-modern:has(.og-home-seo) #featured .product .product_label,
    body.ogonki-modern:has(.og-home-seo) .product .label1.product_label,
    body.ogonki-modern:has(.og-home-seo) .product .label2.product_label,
    body.ogonki-modern:has(.og-home-seo) .product .label3.product_label,
    body.ogonki-modern:has(.og-home-seo) .product .label4.product_label {
        top: 12px !important;
        right: 12px !important;
    }

    /* Bottom editorial/SEO surface. */
    body.ogonki-modern .og-home-seo {
        width: calc(100vw - 20px) !important;
        margin-top: 38px !important;
        margin-bottom: 30px !important;
    }

    body.ogonki-modern .og-home-seo__surface {
        padding: 20px 16px !important;
        border-radius: 20px !important;
    }

    body.ogonki-modern .og-home-seo__hero {
        gap: 18px !important;
        padding-bottom: 22px !important;
    }

    body.ogonki-modern .og-home-seo__eyebrow {
        margin-bottom: 8px !important;
        font-size: 10px !important;
        letter-spacing: .13em !important;
    }

    body.ogonki-modern .og-home-seo__title {
        max-width: 100% !important;
        margin-bottom: 12px !important;
        font-size: clamp(28px, 8.2vw, 36px) !important;
        line-height: 1.02 !important;
        letter-spacing: -.045em !important;
    }

    body.ogonki-modern .og-home-seo__lead {
        font-size: 15px !important;
        line-height: 1.58 !important;
    }

    body.ogonki-modern .og-home-seo__quick {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }

    body.ogonki-modern .og-home-seo__quick li {
        min-height: 46px !important;
        padding: 11px 13px 11px 38px !important;
        border-radius: 13px !important;
        font-size: 13px !important;
    }

    body.ogonki-modern .og-home-seo__section {
        padding-top: 26px !important;
    }

    body.ogonki-modern .og-home-seo__section h2,
    body.ogonki-modern .og-home-seo__card h2,
    body.ogonki-modern .og-home-seo__cta h2 {
        font-size: 23px !important;
        line-height: 1.08 !important;
        letter-spacing: -.03em !important;
    }

    body.ogonki-modern .og-home-seo__categories {
        gap: 9px !important;
    }

    body.ogonki-modern .og-home-seo__category {
        min-height: 62px !important;
        padding: 13px 42px 13px 14px !important;
        border-radius: 14px !important;
    }

    body.ogonki-modern .og-home-seo__card {
        padding: 18px 16px !important;
        border-radius: 16px !important;
    }

    body.ogonki-modern .og-home-seo__card p,
    body.ogonki-modern .og-home-seo__checklist {
        font-size: 14px !important;
        line-height: 1.55 !important;
    }

    body.ogonki-modern .og-home-seo__cta {
        gap: 14px !important;
        padding: 18px 16px !important;
        border-radius: 16px !important;
    }

    body.ogonki-modern .og-home-seo__actions {
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
    }

    body.ogonki-modern .og-home-seo__button {
        min-width: 0 !important;
        padding: 11px 10px !important;
        font-size: 12px !important;
    }

    body.ogonki-modern .og-home-seo__fineprint {
        margin-top: 16px !important;
        font-size: 11.5px !important;
        line-height: 1.5 !important;
    }
}

@media (max-width: 380px) {
    body.ogonki-modern .og-home-seo__actions {
        grid-template-columns: 1fr !important;
    }
}

/* ========================================================================== 
   0.4.1 — phone storefront density + single-card rails
   --------------------------------------------------------------------------
   Real-device pass: New/Hit promos stack vertically, Best sellers/New render
   one product per carousel page, Featured cards use restrained typography,
   and no title is clipped by inherited SoloMono product heights.
   ========================================================================== */

@media (max-width: 767px) {
    /* New / Hit promo pair: always one card per row. */
    body.frontpage.ogonki-modern .banner_block > .row {
        display: block !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body.frontpage.ogonki-modern .banner_block > .row > .section_banner {
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 132px !important;
        margin: 0 0 12px !important;
        padding: 0 !important;
    }

    body.frontpage.ogonki-modern .banner_block > .row > .section_banner:last-child {
        margin-bottom: 0 !important;
    }

    /* Recommended/Featured: genuine one-column editorial cards. */
    body.frontpage.ogonki-modern #featured.og-featured-static .owl-stage {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 14px !important;
        width: 100% !important;
        transform: none !important;
    }

    body.frontpage.ogonki-modern #featured.og-featured-static .owl-item,
    body.frontpage.ogonki-modern #featured.og-featured-static .col_product {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        float: none !important;
    }

    /* Best sellers / New: Owl is refreshed to one item by JS. These rules are
       a safe visual fallback while/if Owl is still settling. */
    body.frontpage.ogonki-modern .sliders_tabs .owl-carousel.og-mobile-one-item .owl-stage {
        display: flex !important;
        align-items: stretch !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .owl-carousel.og-mobile-one-item .owl-item {
        min-width: 0 !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .owl-carousel.og-mobile-one-item .col_product {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    body.frontpage.ogonki-modern #featured .product,
    body.frontpage.ogonki-modern .sliders_tabs .product,
    body.frontpage.ogonki-modern .row_catalog_products .product {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: hidden !important;
    }

    body.frontpage.ogonki-modern #featured .p_description,
    body.frontpage.ogonki-modern .sliders_tabs .p_description,
    body.frontpage.ogonki-modern .row_catalog_products .p_description {
        display: flex !important;
        flex-direction: column !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 10px 12px 13px !important;
    }

    body.frontpage.ogonki-modern #featured .model_product,
    body.frontpage.ogonki-modern .sliders_tabs .model_product,
    body.frontpage.ogonki-modern .row_catalog_products .model_product {
        display: block !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 9px 0 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        white-space: normal !important;
        text-overflow: clip !important;
        font-size: 15px !important;
        line-height: 1.32 !important;
        font-weight: 680 !important;
        letter-spacing: -.012em !important;
    }

    body.frontpage.ogonki-modern #featured .new_old_price,
    body.frontpage.ogonki-modern .sliders_tabs .new_old_price,
    body.frontpage.ogonki-modern .row_catalog_products .new_old_price {
        min-height: 38px !important;
        margin: 10px 0 0 !important;
        padding: 0 !important;
        align-items: center !important;
    }

    body.frontpage.ogonki-modern #featured .price,
    body.frontpage.ogonki-modern #featured .price > span,
    body.frontpage.ogonki-modern .sliders_tabs .price,
    body.frontpage.ogonki-modern .sliders_tabs .price > span,
    body.frontpage.ogonki-modern .row_catalog_products .price,
    body.frontpage.ogonki-modern .row_catalog_products .price > span {
        font-size: 15.5px !important;
        line-height: 1.2 !important;
        font-weight: 780 !important;
    }

    body.frontpage.ogonki-modern #featured .p_img_href,
    body.frontpage.ogonki-modern .sliders_tabs .p_img_href,
    body.frontpage.ogonki-modern .row_catalog_products .p_img_href {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 16 / 10 !important;
        margin: 0 !important;
        border-radius: 15px !important;
    }

    body.frontpage.ogonki-modern #featured .p_img_href img,
    body.frontpage.ogonki-modern .sliders_tabs .p_img_href img,
    body.frontpage.ogonki-modern .row_catalog_products .p_img_href img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs {
        margin-top: 34px !important;
        margin-bottom: 38px !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .nav-tabs {
        margin-bottom: 18px !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .nav-tabs > li > a {
        padding: 8px 10px !important;
        font-size: 13px !important;
        line-height: 1.2 !important;
    }
}

@media (max-width: 420px) {
    body.frontpage.ogonki-modern .banner_block > .row > .section_banner {
        height: 124px !important;
    }

    body.frontpage.ogonki-modern #featured .model_product,
    body.frontpage.ogonki-modern .sliders_tabs .model_product,
    body.frontpage.ogonki-modern .row_catalog_products .model_product {
        font-size: 14.5px !important;
    }
}

/* ========================================================================== 
   0.5.0 — premium phone storefront rhythm
   ========================================================================== */
@media (max-width: 767px) {
    /* Smaller editorial promo cards. */
    body.frontpage.ogonki-modern .banner_block > .row > .section_banner {
        height: 116px !important;
        margin-bottom: 10px !important;
        border-radius: 17px !important;
    }

    /* Recommended: one full-width card per row, compact and readable. */
    body.frontpage.ogonki-modern #featured.og-featured-static .owl-stage {
        display: grid !important;
        grid-template-columns: minmax(0,1fr) !important;
        gap: 14px !important;
        width: 100% !important;
        transform: none !important;
    }
    body.frontpage.ogonki-modern #featured.og-featured-static .owl-item,
    body.frontpage.ogonki-modern #featured.og-featured-static .col_product {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Product cards: premium vertical single-column geometry. */
    body.frontpage.ogonki-modern #featured .product,
    body.frontpage.ogonki-modern .sliders_tabs .product,
    body.frontpage.ogonki-modern .row_catalog_products .product {
        width: 100% !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 10px !important;
        border-radius: 18px !important;
    }

    body.frontpage.ogonki-modern #featured .p_description,
    body.frontpage.ogonki-modern .sliders_tabs .p_description,
    body.frontpage.ogonki-modern .row_catalog_products .p_description {
        display: flex !important;
        flex-direction: column !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 0 !important;
        background: transparent !important;
    }

    body.frontpage.ogonki-modern #featured .p_img_href,
    body.frontpage.ogonki-modern .sliders_tabs .p_img_href,
    body.frontpage.ogonki-modern .row_catalog_products .p_img_href {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 16 / 10 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        border-radius: 14px !important;
        background: transparent !important;
    }

    body.frontpage.ogonki-modern #featured .p_img_href img,
    body.frontpage.ogonki-modern .sliders_tabs .p_img_href img,
    body.frontpage.ogonki-modern .row_catalog_products .p_img_href img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center !important;
    }

    body.frontpage.ogonki-modern #featured .model_product,
    body.frontpage.ogonki-modern .sliders_tabs .model_product,
    body.frontpage.ogonki-modern .row_catalog_products .model_product {
        min-height: 0 !important;
        height: auto !important;
        margin: 10px 2px 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        color: var(--og-text) !important;
        font-size: 15px !important;
        line-height: 1.28 !important;
        font-weight: 700 !important;
        letter-spacing: -.018em !important;
        text-overflow: clip !important;
        white-space: normal !important;
    }

    body.frontpage.ogonki-modern #featured .new_old_price,
    body.frontpage.ogonki-modern .sliders_tabs .new_old_price,
    body.frontpage.ogonki-modern .row_catalog_products .new_old_price {
        display: flex !important;
        width: 100% !important;
        min-height: 42px !important;
        margin: 9px 0 0 !important;
        padding: 0 2px !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
    }

    body.frontpage.ogonki-modern #featured .price,
    body.frontpage.ogonki-modern #featured .price > span,
    body.frontpage.ogonki-modern .sliders_tabs .price,
    body.frontpage.ogonki-modern .sliders_tabs .price > span,
    body.frontpage.ogonki-modern .row_catalog_products .price,
    body.frontpage.ogonki-modern .row_catalog_products .price > span {
        font-size: 17px !important;
        line-height: 1.15 !important;
        font-weight: 800 !important;
    }

    body.frontpage.ogonki-modern #featured button,
    body.frontpage.ogonki-modern .sliders_tabs .product button,
    body.frontpage.ogonki-modern .row_catalog_products .product button {
        min-height: 38px !important;
        padding: 0 13px !important;
        border-radius: 11px !important;
        font-size: 12px !important;
        line-height: 1 !important;
    }

    /* Sale pill: small, inset and rounded in both themes. */
    body.frontpage.ogonki-modern #featured .product_label,
    body.frontpage.ogonki-modern .sliders_tabs .product_label,
    body.frontpage.ogonki-modern .row_catalog_products .product_label {
        top: 18px !important;
        right: 18px !important;
        max-width: calc(100% - 36px) !important;
        padding: 6px 9px !important;
        border-radius: 999px !important;
        font-size: 9px !important;
        letter-spacing: .07em !important;
    }

    /* Best sellers / New remains one card at a time. */
    body.frontpage.ogonki-modern .sliders_tabs .owl-carousel.og-mobile-one-item .owl-item,
    body.frontpage.ogonki-modern .sliders_tabs .owl-carousel.og-mobile-one-item .col_product {
        width: 100% !important;
        max-width: 100% !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs {
        margin-top: 28px !important;
        margin-bottom: 26px !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .nav-tabs {
        justify-content: center !important;
        gap: 14px !important;
        margin-bottom: 16px !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .nav-tabs > li > a {
        padding: 7px 3px 9px !important;
        font-size: 12.5px !important;
        letter-spacing: .04em !important;
    }

    /* Own the carousel arrows on phones: no blank white circles. */
    body.frontpage.ogonki-modern .sliders_tabs .owl-prev,
    body.frontpage.ogonki-modern .sliders_tabs .owl-next,
    body.frontpage.ogonki-modern #featured .owl-prev,
    body.frontpage.ogonki-modern #featured .owl-next {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        min-height: 38px !important;
        border: 1px solid rgba(168,210,79,.42) !important;
        border-radius: 50% !important;
        background: rgba(15,20,24,.94) !important;
        color: #d8ef66 !important;
        box-shadow: 0 8px 22px rgba(0,0,0,.22) !important;
    }
    body.frontpage.ogonki-modern .sliders_tabs .owl-prev::before,
    body.frontpage.ogonki-modern #featured .owl-prev::before { content: "‹" !important; }
    body.frontpage.ogonki-modern .sliders_tabs .owl-next::before,
    body.frontpage.ogonki-modern #featured .owl-next::before { content: "›" !important; }
    body.frontpage.ogonki-modern .sliders_tabs .owl-prev::before,
    body.frontpage.ogonki-modern .sliders_tabs .owl-next::before,
    body.frontpage.ogonki-modern #featured .owl-prev::before,
    body.frontpage.ogonki-modern #featured .owl-next::before {
        display: block !important;
        color: #d8ef66 !important;
        font-family: Arial, sans-serif !important;
        font-size: 29px !important;
        line-height: 34px !important;
        font-weight: 400 !important;
        text-align: center !important;
    }

    /* Category mosaic stays in the successful two-column layout. */
    body.frontpage.ogonki-modern:has(.og-home-seo) #browse_category.subcats_imgs {
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;
        gap: 10px !important;
    }

    /* Remove residual dead air before the editorial block/footer. */
    body.frontpage.ogonki-modern .og-home-seo { margin-top: 28px !important; margin-bottom: 10px !important; }
}

@media (max-width: 420px) {
    body.frontpage.ogonki-modern .banner_block > .row > .section_banner { height: 108px !important; }
    body.frontpage.ogonki-modern #featured .model_product,
    body.frontpage.ogonki-modern .sliders_tabs .model_product,
    body.frontpage.ogonki-modern .row_catalog_products .model_product { font-size: 14.5px !important; }
}

/* ========================================================================== 
   0.5.1 — compact premium phone geometry
   --------------------------------------------------------------------------
   Real-device correction: reduce the “old TV” framing, tighten the hero rhythm,
   place New/Hit promos side-by-side, and use smaller radii across phone cards.
   Desktop and Classic are untouched.
   ========================================================================== */
@media (max-width: 767px) {
    /* Hero: less frame, less dead air, same 2:1 image ratio. */
    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type {
        margin: 8px 8px 7px !important;
        padding: 0 !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type > .position-relative {
        border-radius: 10px !important;
        border-width: 1px !important;
        box-shadow: 0 8px 22px rgba(8,12,16,.12) !important;
    }

    html[data-og-theme="night"] body.frontpage.ogonki-modern:has(.og-home-seo) main > .container:first-of-type > .position-relative {
        box-shadow: 0 9px 24px rgba(0,0,0,.26), 0 0 18px rgba(168,210,79,.018) !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-stage-outer,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .owl-item > .item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item,
    body.frontpage.ogonki-modern:has(.og-home-seo) #owl-frontslider .item > a {
        border-radius: 9px !important;
        -webkit-clip-path: inset(0 round 9px) !important;
        clip-path: inset(0 round 9px) !important;
    }

    /* New / Hit: one deliberate compact row, not two giant banners. */
    body.frontpage.ogonki-modern .banner_block {
        margin-top: 7px !important;
        margin-bottom: 20px !important;
    }

    body.frontpage.ogonki-modern .banner_block > .row {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        margin: 0 !important;
    }

    body.frontpage.ogonki-modern .banner_block > .row > .section_banner,
    body.frontpage.ogonki-modern .banner_block > .row > .section_banner:last-child {
        float: none !important;
        width: 100% !important;
        max-width: none !important;
        height: auto !important;
        aspect-ratio: 1.72 / 1 !important;
        margin: 0 !important;
        padding: 0 !important;
        border-radius: 10px !important;
    }

    body.frontpage.ogonki-modern .banner_block .section_banner img,
    body.frontpage.ogonki-modern .banner_block .section_banner a {
        border-radius: inherit !important;
    }

    body.frontpage.ogonki-modern .banner_block .section_banner span {
        left: 10px !important;
        right: 10px !important;
        bottom: 9px !important;
        max-width: calc(100% - 20px) !important;
        font-size: 14px !important;
        line-height: 1.05 !important;
        letter-spacing: .055em !important;
    }

    /* Product cards: modern phone geometry, not oversized rounded trays. */
    body.frontpage.ogonki-modern #featured .product,
    body.frontpage.ogonki-modern .sliders_tabs .product,
    body.frontpage.ogonki-modern .row_catalog_products .product {
        padding: 8px !important;
        border-radius: 12px !important;
    }

    body.frontpage.ogonki-modern #featured .p_img_href,
    body.frontpage.ogonki-modern .sliders_tabs .p_img_href,
    body.frontpage.ogonki-modern .row_catalog_products .p_img_href {
        border-radius: 9px !important;
    }

    body.frontpage.ogonki-modern #featured.og-featured-static .owl-stage {
        gap: 10px !important;
    }

    /* Successful two-column categories, with sharper premium corners. */
    body.frontpage.ogonki-modern:has(.og-home-seo) #browse_category.subcats_imgs {
        gap: 8px !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) #browse_category.subcats_imgs > div > a,
    body.frontpage.ogonki-modern:has(.og-home-seo) #browse_category a,
    body.frontpage.ogonki-modern:has(.og-home-seo) #browse_category .browse_category_item {
        border-radius: 10px !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) #browse_category .subcat_name {
        left: 7px !important;
        right: 7px !important;
        bottom: 7px !important;
        min-height: 34px !important;
        padding: 7px 9px !important;
        border-radius: 8px !important;
    }

    /* Lower editorial surfaces follow the same smaller-radius language. */
    body.ogonki-modern .og-home-seo__surface { border-radius: 14px !important; }
    body.ogonki-modern .og-home-seo__quick li { border-radius: 10px !important; }
    body.ogonki-modern .og-home-seo__category { border-radius: 10px !important; }
    body.ogonki-modern .og-home-seo__card,
    body.ogonki-modern .og-home-seo__cta { border-radius: 12px !important; }

    /* Bring the first content heading a little closer to the compact promo row. */
    body.frontpage.ogonki-modern:has(.og-home-seo) .like_h2,
    body.frontpage.ogonki-modern:has(.og-home-seo) .browse_category_title {
        margin-top: 20px !important;
    }
}

@media (max-width: 380px) {
    body.frontpage.ogonki-modern .banner_block > .row {
        gap: 7px !important;
    }
    body.frontpage.ogonki-modern .banner_block > .row > .section_banner,
    body.frontpage.ogonki-modern .banner_block > .row > .section_banner:last-child {
        aspect-ratio: 1.62 / 1 !important;
    }
    body.frontpage.ogonki-modern .banner_block .section_banner span {
        left: 8px !important;
        right: 8px !important;
        bottom: 8px !important;
        font-size: 12.5px !important;
    }
}

/* ========================================================================== 
   0.5.2 — compact phone storefront polish
   - reduce empty gap under "Рекомендуемые";
   - add spacing between Top sales / New cards;
   - center the price, move CTA lower, tighten typography;
   - make mobile card rhythm calmer and denser.
   ========================================================================== */
@media (max-width: 767px) {
    /* Section title rhythm: less dead air after headings. */
    body.frontpage.ogonki-modern:has(.og-home-seo) .like_h2,
    body.frontpage.ogonki-modern:has(.og-home-seo) .browse_category_title {
        margin-top: 18px !important;
        margin-bottom: 10px !important;
        padding-bottom: 10px !important;
    }

    body.frontpage.ogonki-modern:has(.og-home-seo) .like_h2 + *,
    body.frontpage.ogonki-modern:has(.og-home-seo) .browse_category_title + * {
        margin-top: 0 !important;
    }

    /* Recommended section: pull cards closer to the heading. */
    body.frontpage.ogonki-modern #featured.og-featured-static,
    body.frontpage.ogonki-modern #featured.og-featured-static .owl-wrapper-outer,
    body.frontpage.ogonki-modern #featured.og-featured-static .owl-stage-outer {
        margin-top: 0 !important;
    }

    /* Best sellers / New: real breathing room between visible cards. */
    body.frontpage.ogonki-modern .sliders_tabs {
        margin-top: 20px !important;
        margin-bottom: 22px !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .nav-tabs {
        margin-bottom: 12px !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .owl-stage {
        display: flex !important;
        align-items: stretch !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .owl-item {
        box-sizing: border-box !important;
        padding: 0 5px !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .col_product {
        width: 100% !important;
        padding: 0 !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .product {
        display: flex !important;
        flex-direction: column !important;
        height: 100% !important;
        min-height: 0 !important;
        padding: 8px !important;
        border-radius: 12px !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .p_description {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 1 auto !important;
        min-height: 0 !important;
        padding: 0 !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .model_product {
        margin: 8px 0 0 !important;
        font-size: 13.5px !important;
        line-height: 1.24 !important;
        font-weight: 700 !important;
        letter-spacing: -.01em !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .new_old_price {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 8px !important;
        width: 100% !important;
        min-height: 76px !important;
        margin: auto 0 0 !important;
        padding: 8px 2px 0 !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .price,
    body.frontpage.ogonki-modern .sliders_tabs .price > span {
        width: 100% !important;
        text-align: center !important;
        font-size: 14px !important;
        line-height: 1.18 !important;
        font-weight: 780 !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .product button,
    body.frontpage.ogonki-modern .sliders_tabs .button_buy,
    body.frontpage.ogonki-modern .sliders_tabs .buy_btn {
        align-self: center !important;
        min-width: 92px !important;
        min-height: 34px !important;
        margin-top: 0 !important;
        padding: 0 12px !important;
        font-size: 11.5px !important;
        line-height: 1 !important;
        border-radius: 10px !important;
    }

    /* Recommended cards: slightly denser mobile type. */
    body.frontpage.ogonki-modern #featured .model_product,
    body.frontpage.ogonki-modern .row_catalog_products .model_product {
        font-size: 14px !important;
        line-height: 1.26 !important;
    }

    body.frontpage.ogonki-modern #featured .new_old_price,
    body.frontpage.ogonki-modern .row_catalog_products .new_old_price {
        min-height: 40px !important;
        margin-top: 8px !important;
    }

    body.frontpage.ogonki-modern #featured .price,
    body.frontpage.ogonki-modern #featured .price > span,
    body.frontpage.ogonki-modern .row_catalog_products .price,
    body.frontpage.ogonki-modern .row_catalog_products .price > span {
        font-size: 14.5px !important;
        line-height: 1.18 !important;
    }
}

@media (max-width: 390px) {
    body.frontpage.ogonki-modern .sliders_tabs .owl-item {
        padding: 0 4px !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .model_product {
        font-size: 12.8px !important;
    }

    body.frontpage.ogonki-modern .sliders_tabs .price,
    body.frontpage.ogonki-modern .sliders_tabs .price > span {
        font-size: 13.5px !important;
    }
}