@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;1,400&display=swap');

/* megamart color tokens */
:root {
    --currentBlue: #3483b8;
    --currentBlueDark: #1e6094;
    --currentDarkBlue: #3888B6;
    --currentDarkBlueHover: #2F7499;
    --currentGrey: #DCDCDC;
    --currentGreyHover: #C7C7C7;
    --currentLink: #B3AEAE;
    --currentLinkHover: #2f7aa1;
}

/* ambrella template tokens */
:root {
    /* C1–C4: повторяющиеся литералы */
    --text: #202020;
    --field-line: #bdbdbd;
    --accent: #ff5605;

    /* fluid typography */
    --fs-hero: clamp(2.25rem, 1.1rem + 3.6vw, 4rem);
    --fs-h1: clamp(1.25rem, 0.76rem + 2.17vw, 2.5rem);
    --fs-h2: clamp(1.5rem, 1.2rem + .95vw, 2rem);
    --fs-h3: clamp(1.25rem, 1.1rem + .5vw, 1.5rem);
    --fs-body: 1rem;
    --fs-small: .8125rem;

    /* where-to-buy: geo-confirm card */
    --wtb-confirm-radius: 8px;
    --wtb-confirm-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);

    --mc-ease: cubic-bezier(.22,.61,.36,1);
}

.site-header,
.page,
.site-footer,
.footer-bottom {
    box-sizing: border-box;
}

.site-header *,
.page *,
.site-footer *,
.footer-bottom * {
    box-sizing: border-box;
}

body {
    font-family: var(--font);
    color: var(--ink);
    background: var(--white);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
    margin: 0;
    padding: 0;
    min-height: 100vh;
    min-height: 100svh;
    display: flex;
    flex-direction: column;
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    display: block;
    max-width: 100%;
    height: auto;
}

svg {
    display: block;
}

/* ============================================================ CONTAINER */

.container {
    width: min(var(--col), 100%);
    margin-inline: auto;
    padding-inline: clamp(16px, 3vw, 40px);
}

@media (min-width: 1490px) {
    .container {
        padding-inline: 0;
    }
}

/* ==================================== PRODUCT CARD (bitrix:catalog.item) */

/* Единственный источник тени карточки товара — все шаблоны catalog.item
   рендерят этот класс. Контейнеры карточки не должны её обрезать. */
.product-cat-container {
    box-shadow: var(--shadow-product-card);
    box-sizing: border-box;
    overflow: hidden;
}

/* ============================================================ HEADER */

/* scroll-lock: OverlayManager вешает body.ovl-lock; scrollbar-gutter резервирует
   место скроллбара, чтобы overflow:hidden не сдвигал контент */
html { scrollbar-gutter: stable; }
body.ovl-lock { overflow: hidden; }

.site-header {
    background: var(--white);
    box-shadow: var(--shadow-sm);
    position: sticky;
    top: 0;
    z-index: var(--z-header);
}

.site-header > .container,
.hdr-bar {
    display: flex;
    align-items: center;
    height: clamp(64px, 7vw, 96px);
    gap: 0;
}

.hdr-logo img {
    height: clamp(40px, 4.5vw, 48px);
    width: auto;
    display: block;
}

.main-nav {
    display: flex;
    align-items: center;
    gap: 0;
    justify-content: space-between;
    width: 524px;
    margin-left: auto;
    flex: none;

    & .nav-menu > .nav-item > .nav-link {
        font-weight: 700;
        font-size: 20px;
        color: var(--text);
        white-space: nowrap;
        transition: color 0.15s;

        &:hover {
            color: var(--blue);
        }
    }
}

.hdr-tools {
    margin-left: auto;
    display: flex;
    align-items: center;
}

.tool {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 16px;
    color: var(--ink);
    cursor: pointer;
    transition: color 0.15s;
    white-space: nowrap;

    & + .tool {
        margin-left: 16px;
    }

    &:hover {
        color: var(--blue);
    }

    & .ico {
        width: 19px;
        height: 19px;
        flex: none;
    }
}

.hdr-icons {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-left: 17px;
}

.icon-btn {
    display: inline-flex;
    color: var(--ink);
    transition: color 0.15s;

    &:hover {
        color: var(--blue);
    }

    & .ico {
        width: 21px;
        height: 21px;
    }
}

/* c-icon-count: favourite / compare with badge */

.c-icon-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    color: var(--ink);
    transition: color 0.15s;

    & .ico {
        width: 21px;
        height: 21px;
    }

    &:hover {
        color: var(--blue);
    }

    & .rds-count-badge {
        --rds-badge-top: -18px;
        --rds-badge-right: -18px;
        pointer-events: none;
    }
}

/* ============================================================ SEARCH POPUP */

.header-search-popup-wrap {
    position: relative;
    z-index: 200;
}

.search-popup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: var(--z-panel);
    background: transparent;
}

.search-popup__backdrop {
    position: fixed;
    inset: 0;
    background: rgba(7, 22, 31, 0.6);
    z-index: 0;
}

.search-popup--top {
    height: 164px;
}

.search-popup__inner {
    background: #fff;
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    padding: 61px 20px 0;
    display: flex;
    align-items: flex-start;
    position: relative;
    z-index: 2;
    height: 164px;
}

.search-popup__form {
    max-width: 960px;
    width: 100%;
    margin: 0 auto;
    position: relative;
}


.search-popup__label {
    display: none;
}

.search-popup__input {
    display: block;
    width: 100%;
    height: 53px;
    box-sizing: border-box;
    font-family: "Open Sans", sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    padding: 14.4px 50px 14.4px 0;
    color: var(--text);
    background: no-repeat bottom, 50% calc(100% - 1px);
    background-image: linear-gradient(to top, var(--accent) 2px, rgba(255, 86, 5, 0) 2px), linear-gradient(to top, var(--field-line) 1px, rgba(189, 189, 189, 0) 1px);
    background-size: 0 100%, 100% 100%;
    border: 0;
    border-radius: 0;
    outline: 0;
    transition: background 0s ease-out;

    &::placeholder {
        color: var(--field-line);
        opacity: 1;
    }

    &:focus {
        background-size: 100% 100%, 100% 100%;
        transition-duration: 0.3s;
    }
}

.search-popup__form .bmd-form-control {
    display: block;
    width: 100%;
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 600;
    padding: 0.9rem 2.5rem 0.9rem 0;
    color: var(--text);
    background: no-repeat bottom, 50% calc(100% - 1px);
    background-image: linear-gradient(to top, var(--accent) 2px, rgba(255, 86, 5, 0) 2px), linear-gradient(to top, var(--field-line) 1px, rgba(189, 189, 189, 0) 1px);
    background-size: 0 100%, 100% 100%;
    border: 0;
    border-radius: 0;
    outline: 0;
    transition: background 0s ease-out;
}

input.search-popup__form .bmd-form-control:focus,
.search-popup__form .bmd-form-group.is-focused input.bmd-form-control {
    background-size: 100% 100%, 100% 100%;
    transition-duration: 0.3s;
}

.search-popup__form-button {
    position: absolute;
    right: 11px;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: 0;
    outline: 0;
    cursor: pointer;
    color: var(--text);
    font-size: 20px;
    width: 34px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.search-popup__close {
    position: absolute;
    right: 20px;
    top: 20px;
    color: var(--field-line);
    width: 16px;
    height: 16px;
    transition: color 0.15s;
    display: flex;
    align-items: center;
    justify-content: center;

    &:hover {
        color: var(--ink);
    }
}

.ico {
    display: flex;
    align-items: center;
    justify-content: center;
    color: currentColor;

    & svg {
        width: auto;
        height: 100%;
        fill: currentColor;
        display: block;
    }
}

/* ============================================================ PAGE SHELL */

.page {
    background: var(--bg);
    flex: 1 0 auto;
}

.page-head {
    padding-top: 22px;
    border-bottom: var(--divider);
}

.breadcrumbs {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 12px;
    line-height: 17px;
    color: var(--muted);
    margin-bottom: 0;

    & a {
        color: var(--muted);

        &:hover {
            color: var(--blue);
        }
    }

    & .sep {
        flex: none;
        color: var(--muted);

        & svg {
            display: block;
            width: 12px;
            height: auto;
            fill: none;
            stroke: currentColor;
        }
    }

    & .here {
        color: var(--ink);
    }
}

.page-title {
    font-size: var(--fs-h1);
    font-weight: 500;
    letter-spacing: -.02em;
    line-height: 1.05;
    margin: 0;
    padding: clamp(14px, 1.6vw, 21px) 0 var(--page-gap);
    text-wrap: balance;
}

/* Desktop: align .page-title vertical rhythm with megamart's "О компании" (.l-main__title) */
@media (min-width: 768px) {
    .page-title {
        padding: 4px 0 var(--page-gap);
    }
}

.page-content {
    padding: var(--page-gap) 0;
}

/* Flush: первый блок контента приносит свой верхний край (карта, hero, full-bleed подложка)
   либо page-head скрыт — контент прижат к линии. Отступ НАД линией при этом сохраняется. */
.page-flush .page-content,
.main-page-style .page-content,
.is-company-page .page-content { padding-top: 0; }

/* Главная: контент во всю ширину, hero без боковых отступов */
.main-page-style .page > .container {
    max-width: none;
    width: 100%;
    padding-inline: 0;
}

.main-page-style .page-head { display: none; }

/* catalog-page-style */
.catalog-page-style .page-head {
    display: none;
}

/* compare: page-head is the only title source on this page */
.catalog-page-style.compare-page-style .page-head {
    display: block;
}

/* catalog content-zone breadcrumbs: desktop-only (≥992px) */
.catalog-page-style .page-content .breadcrumbs { display: none; }
@media (min-width: 992px) {
    .catalog-page-style .page-content .breadcrumbs { display: flex; margin-bottom: 12px; }
}

.catalog-page-style .page-content {
    padding-top: 16px;
    padding-bottom: 24px;
}

.catalog-page-style {
    overflow-x: clip;
}

/* page-bleed: full-bleed breakout for content nested inside .container */
.page:has(.page-bleed) {
    overflow-x: clip;
}

.page-bleed {
    margin-inline: calc(-50vw + 50%);
    width: 100vw;
}

/* если последний блок контента full-bleed, нижний отступ контентной зоны схлопывается, иначе под подложкой белая полоса */
.page-content:has(> .page-bleed) { padding-bottom: 0; }

@media (max-width: 767px) {
    .main-page-style .site-header {
        position: fixed;
        inset-inline: 0;
        top: 0;
        background: rgba(255, 255, 255, .8);
        box-shadow: none;
    }

    .main-page-style .page { padding-top: clamp(64px, 7vw, 96px); }

    .page-content { padding-bottom: 24px; }
}

/* image-zoom */
.image-zoom {
    transition: transform 0.3s ease-in-out;
    cursor: pointer;
    display: block;
}

.image-zoom:hover {
    transform: scale(1.05);
}

/* ============================================================ FOOTER */

.site-footer {
    background: var(--white);
    border-top: var(--divider);
    flex-shrink: 0;
}

.site-footer > .container {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: clamp(24px, 3vw, 48px) clamp(40px, 6vw, 90px);
    padding-block: clamp(28px, 3.5vw, 40px);
}

.ft-logo {
    flex: none;

    & img {
        height: clamp(52px, 6vw, 73px);
        width: auto;
    }
}

.ft-nav {
    display: flex;
    gap: clamp(40px, 6vw, 90px);
}

.ft-col {
    display: flex;
    flex-direction: column;
    gap: 0;
    font-size: 16px;
    line-height: 1.5;

    & a:hover {
        color: var(--blue);
    }
}

.ft-right {
    margin-left: auto;
    width: 356px;
}

.ft-contacts {
    display: flex;
    flex-direction: column;
    gap: 0;
    font-size: 16px;
    line-height: 1.5;
}

.subscribe {
    margin-top: 22px;
}

.subscribe__row {
    display: flex;
    height: 38px;
    border: 1px solid var(--blue);
    border-radius: 2px;
    overflow: hidden;

    & input {
        flex: 1;
        border: 0;
        outline: 0;
        padding: 0 22px;
        font-family: var(--font);
        font-size: 16px;
        color: var(--ink);
        height: 38px;
        border-radius: 2px 0 0 2px;

        &::placeholder {
            color: var(--placeholder);
        }
    }
}

.subscribe__btn {
    width: 37px;
    background: var(--blue);
    border: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex: none;
    transition: background 0.15s;

    &:hover {
        background: var(--blue-hover);
    }

    & .ico {
        width: 24px;
        height: 24px;
        color: var(--white);
    }
}

.subscribe__note {
    font-size: 12px;
    line-height: 1;
    margin: 7px 0 0;
    max-width: 293px;
}

.footer-bottom {
    border-top: var(--divider);
    background: var(--white);
    height: 36px;
    display: flex;
    align-items: center;

    & .container {
        display: block;
        min-height: 0;
        padding-top: 0;
        padding-bottom: 0;
    }
}

.copyright {
    padding: 0;
    margin: 0;
}

.copyright,
.footer-bottom .container {
    font-size: 12px;
    line-height: 1;
    color: #7d8698;
}

.footer-up {
    display: none;
    flex: none;
}

.footer-up .ico {
    color: var(--blue);
    width: 48px;
    height: 48px;

    & svg {
        width: 48px;
        height: 48px;
    }
}

/* ============================================================ MOBILE TOOLS */

.hdr-mobile-tools {
    display: none;
    align-items: center;
    gap: 16px;
    margin-left: auto;
}

/* ============================================================ RESPONSIVE */

@media (min-width: 1280px) {
    .ft-nav {
        flex: 1;
        justify-content: center;
    }
}

@media (max-width: 1279px) {
    .main-nav,
    .hdr-tools,
    .hdr-icons {
        display: none;
    }

    .hdr-mobile-tools {
        display: flex;
    }

    .site-footer .ft-nav,
    .site-footer .subscribe {
        display: none;
    }

    .ft-logo img {
        height: 40px;
    }

    .footer-up {
        display: inline-flex;
    }

    .footer-bottom {
        height: auto;
        min-height: 36px;
        padding-block: 13px;
        background: var(--bg);
        border-top: none;
    }

    .footer-bottom .container {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        line-height: 1.5;
        color: var(--muted);
    }

    .copyright {
        display: block;
        padding-left: 12px;
        text-indent: -12px;
    }

    .footer-bottom .copyright {
        line-height: 1.5;
        color: var(--muted);
    }
}

@media (min-width: 601px) and (max-width: 1279px) {
    .site-footer .container {
        flex-wrap: nowrap;
        align-items: center;
    }

    .ft-right {
        width: auto;
    }
}

@media (max-width: 600px) {
    .hdr-logo img {
        height: 30px;
    }

    .hdr-icons {
        gap: 12px;
    }

    .site-footer > .container {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 20px;
    }

    .ft-right {
        margin-left: 0;
        width: auto;
    }

    .ft-contacts {
        align-items: center;
    }

    .copyright {
        text-align: center;
    }

    .footer-bottom .copyright {
        text-align: left;
    }
}

/* ============================================================ MOBILE NAV — Вариант C */
.mc-nav,.mc-scrim,.mc-sheet{ display:none; }
/* pixel-perfect: эталон template.html авторился под глобальный *{box-sizing:border-box};
   на сайте box-sizing — content-box, поэтому воспроизводим border-box локально для поддерева
   Варианта C (иначе .mc-minifab/.mc-catexp с рамкой выходят на 2px шире макета) */
.mc-nav,.mc-nav *,.mc-scrim,.mc-sheet,.mc-sheet *{ box-sizing:border-box; }

@media (max-width:1279px){
  /* sticky footer теперь глобальный (body/.page/.site-footer выше);
     здесь остаётся только место под мобильный FAB. box-sizing:border-box —
     чтобы FAB-padding-bottom входил в min-height */
  body{
    padding-bottom:calc(86px + env(safe-area-inset-bottom));
    box-sizing:border-box;
  }

  .mc-nav{ display:block; }

  .mc-fab{
    position:fixed; left:50%; bottom:calc(20px + env(safe-area-inset-bottom)); transform:translateX(-50%); z-index:1500;
    display:inline-flex; align-items:center; gap:10px; height:56px; padding:0 26px 0 22px;
    background:var(--blue); color:#fff; border:0; border-radius:var(--r-pill); cursor:pointer;
    box-shadow:0 8px 24px rgba(56,136,182,.42); font-family:var(--font); font-size:17px; font-weight:700; line-height:1;
    transition:transform .2s var(--mc-ease), background .15s;
  }
  .mc-fab:hover{ background:var(--blue-hover); }
  .mc-fab:active{ transform:translateX(-50%) scale(.96); }
  .mc-fab svg{ width:23px; height:23px; flex:none; }

  .mc-minifab{
    position:fixed; bottom:calc(25px + env(safe-area-inset-bottom)); z-index:1499;
    width:48px; height:48px; border-radius:var(--r-round); background:var(--white); color:var(--ink);
    border:1px solid var(--neutral-200); box-shadow:var(--shadow-card);
    display:inline-flex; align-items:center; justify-content:center; cursor:pointer;
    transition:transform .2s var(--mc-ease), border-color .15s, color .15s;
  }
  .mc-minifab:hover{ color:var(--blue); border-color:var(--blue); }
  .mc-minifab:active{ transform:scale(.92); }
  .mc-minifab svg{ width:22px; height:22px; }
  .mc-minifab--l{ left:18px; }
  .mc-minifab--r{ right:18px; }
  .mc-minifab .rds-count-badge{ --rds-badge-top:-3px; --rds-badge-right:-3px; --rds-badge-bg:var(--blue); }

  .mc-scrim{
    display:block; position:fixed; inset:0; z-index:calc(var(--z-panel) - 1); background:rgba(10,24,40,.5);
    opacity:0; visibility:hidden; transition:opacity .32s var(--mc-ease), visibility .32s;
  }
  body.mc-open .mc-scrim{ opacity:1; visibility:visible; }

  .mc-sheet{
    display:flex; flex-direction:column; position:fixed; left:0; right:0; bottom:0; z-index:var(--z-panel);
    max-height:90vh; background:var(--white); border-radius:20px 20px 0 0;
    box-shadow:0 -8px 34px rgba(0,0,0,.2);
    transform:translateY(100%); transition:transform .42s var(--mc-ease);
  }
  body.mc-open .mc-sheet{ transform:translateY(0); }

  .mc-grab{ flex:none; display:flex; justify-content:center; padding:10px 0 2px; }
  .mc-grab i{ width:40px; height:5px; border-radius:3px; background:var(--neutral-300); }
  .mc-sheet__hd{ flex:none; display:flex; align-items:center; gap:10px; padding:6px 18px 12px; }
  .mc-sheet__hd h2{ font-size:20px; font-weight:700; letter-spacing:-.01em; margin:0; color:var(--ink); }
  .mc-sheet__close{ /* pixel-perfect: verbatim из handoff, ниже 44px — не «чинить» */
    margin-left:auto; width:36px; height:36px; border-radius:var(--r-round); border:0;
    background:var(--surface-2); color:var(--ink); cursor:pointer;
    display:flex; align-items:center; justify-content:center;
  }
  .mc-sheet__close:hover{ color:var(--blue); }
  .mc-sheet__close svg{ width:15px; height:15px; }

  .mc-seg{ display:flex; gap:4px; margin:0 16px 10px; padding:4px; background:var(--surface-2); border-radius:12px; }
  .mc-seg button{ /* pixel-perfect: verbatim из handoff, ниже 44px — не «чинить» */
    flex:1; min-height:40px; border:0; background:none; font-family:var(--font);
    font-size:14px; font-weight:700; color:var(--muted); border-radius:9px; cursor:pointer;
    transition:background .18s, color .18s;
  }
  .mc-seg button.is-on{ background:var(--white); color:var(--blue-deep); box-shadow:0 2px 6px rgba(0,0,0,.12); }

  .mc-sheet__body{ flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:0 0 calc(96px + env(safe-area-inset-bottom)); }
  .mc-pane[hidden]{ display:none; }

  .mc-heading{
    display:flex; align-items:center; min-height:52px; padding:8px 18px;
    font-family:var(--font); font-size:16px; font-weight:700; color:#202020; text-decoration:none;
  }
  .mc-heading:hover{ color:var(--blue); }
  .mc-heading--cat .mc-heading__mk{
    display:inline-flex; align-items:center; width:13px; height:8px; margin-right:8px; color:#202020; flex:none;
  }
  .mc-heading--collection{ border-top:1px solid var(--neutral-200); margin-top:12px; }
  .mc-heading--collection::before{
    content:""; display:inline-block; width:8px; height:8px; margin-right:10px;
    border-radius:50%; background:#202020; flex:none;
  }
  .mc-heading--collection:hover::before{ background:var(--blue); }

  .mc-cat{ display:flex; flex-direction:column; }
  .mc-catrow{ display:flex; align-items:stretch; border-top:1px solid var(--neutral-200); }
  .mc-cat > .mc-catrow:first-child{ border-top:0; }
  .mc-catgo{
    flex:1; min-width:0; min-height:52px; display:flex; align-items:center;
    padding:8px 8px 8px 18px; font-family:var(--font); font-size:16px; font-weight:600;
    color:var(--ink); background:none; border:0; text-align:left; cursor:pointer;
  }
  .mc-catgo:hover{ color:var(--blue); }
  .mc-catexp{
    flex:none; width:56px; border:0; border-left:1px solid var(--neutral-200); background:none; cursor:pointer;
    display:flex; align-items:center; justify-content:center; color:var(--muted);
  }
  .mc-catexp:hover{ color:var(--blue); }
  .mc-catexp svg{ width:14px; height:14px; transition:transform .3s var(--mc-ease); }
  .mc-catrow.is-exp{ background:var(--surface-1); }
  .mc-catrow.is-exp .mc-catexp{ color:var(--blue-deep); }
  .mc-catrow.is-exp .mc-catexp svg{ transform:rotate(180deg); }

  .mc-subs{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .34s var(--mc-ease); background:var(--surface-1); }
  .mc-subs > div{ overflow:hidden; }
  .mc-catrow.is-exp + .mc-subs{ grid-template-rows:1fr; }
  .mc-subrow{
    display:flex; align-items:center; gap:10px; min-height:46px;
    padding:11px 18px 11px 30px; font-size:14.5px; color:var(--ink); text-decoration:none;
    border-top:1px solid var(--neutral-200);
  }
  .mc-subrow:hover{ color:var(--blue); }
  .mc-subrow .mc-dash{ width:14px; height:1px; background:var(--border); flex:none; }
  .mc-subrow--all{ font-weight:700; color:var(--blue-deep); }
  .mc-subrow--all .mc-dash{ display:none; }
  .mc-subrow--all .mc-ar{ margin-left:auto; width:15px; height:15px; color:var(--blue); }

  .mc-seclist{ display:flex; flex-direction:column; }
  .mc-seclbl{ font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--placeholder); padding:14px 18px 6px; }
  .mc-secrow{
    display:flex; align-items:center; gap:13px; min-height:52px; width:100%;
    padding:12px 18px; font-family:var(--font); font-size:15px; color:var(--ink); text-decoration:none;
    border-top:1px solid var(--neutral-200); background:none; border-left:0; border-right:0; border-bottom:0;
    text-align:left; cursor:pointer;
  }
  .mc-secrow:hover{ color:var(--blue); }
  .mc-secrow .mc-si{ flex:none; width:22px; height:22px; color:var(--ink); display:flex; align-items:center; justify-content:center; }
  .mc-secrow:hover .mc-si{ color:var(--blue); }
  .mc-secrow .mc-si svg{ width:100%; height:100%; }
  .mc-secrow .rds-count-badge{ margin-left:auto; --rds-badge-bg:var(--blue); }

  .mc-fab:focus-visible,.mc-minifab:focus-visible,.mc-sheet__close:focus-visible,
  .mc-seg button:focus-visible,.mc-catgo:focus-visible,.mc-catexp:focus-visible,
  .mc-subrow:focus-visible,.mc-secrow:focus-visible,.mc-heading:focus-visible{
    outline:2px solid var(--blue); outline-offset:2px; border-radius:6px;
  }
}

@media (prefers-reduced-motion: reduce){
  .mc-sheet,.mc-scrim,.mc-subs,.mc-catexp svg,.mc-fab,.mc-minifab{ transition:none !important; }
  .image-zoom{ transition:none !important; }
}