/*
 * Busca na Rede — estilos base dos widgets Elementor, no padrão visual
 * do catálogo buscanarede.com.br (temas claro e escuro).
 * Tudo escopado em .bnr-* e sem !important: os controles de estilo do
 * Elementor sempre têm prioridade sobre estes valores. A paleta e as áreas
 * dos containers ficam fora de camada; o restante fica na camada
 * "busca-na-rede", protegida dos estilos globais pelo isolamento abaixo.
 */

/*
 * Paleta escolhida em Configurações → Busca na Rede → Aparência do
 * catálogo. Declarada no body para que modelos, containers e widgets
 * possam usar var(--bnr-*). --bnr-brand (cor da empresa obtida da API)
 * é injetada inline pelo plugin quando configurada.
 */
body {
    --bnr-primary: var(--bnr-brand, var(--e-global-color-primary, #005caa));
    --bnr-on-primary: var(--bnr-brand-text, #ffffff);
    --bnr-page: #f7f8fa;
    --bnr-surface: #ffffff;
    --bnr-card-bg: #ffffff;
    --bnr-media-bg: #ffffff;
    --bnr-input-bg: #ffffff;
    --bnr-soft: #f7f8fa;
    --bnr-hover: #f1f5f9;
    --bnr-text: #303030;
    --bnr-heading: #212121;
    --bnr-muted-text: #64748b;
    --bnr-apps-text: #303030;
    --bnr-border: #e2e8f0;
    --bnr-card-border: #e6e6e6;
    --bnr-divider: #eeeeee;
    --bnr-dash: #e8e8e8;
    --bnr-row-border: #cccccc;
    --bnr-tab-border: #dcdcdc;
    --bnr-breadcrumb: #999999;
    --bnr-success: #00a650;
    --bnr-sku-bg: #ffffff;
    --bnr-sku-text: #171717;
    --bnr-chip-brand-bg: #ededed;
    --bnr-chip-brand-text: #656565;
    --bnr-chip-code-bg: #f8f9fa;
    --bnr-chip-code-text: #000000;
    --bnr-chip-code-border: #dee2e6;
    --bnr-shadow: 0 1px 2px rgb(15 23 42 / 4%);
    --bnr-menu-shadow: 0 10px 30px rgb(15 23 42 / 12%);
    --bnr-danger: #ce3447;
    --bnr-warning-bg: #fff4d6;
    --bnr-warning-text: #7a5200;
    --bnr-info-bg: #eef4ff;
    --bnr-info-text: #1d3f72;
    --bnr-overlay: rgba(15, 23, 42, 0.6);
    --bnr-radius: 8px;
    --bnr-gap: 16px;
}

body.bnr-scheme-dark {
    --bnr-page: #171717;
    --bnr-surface: #202124;
    --bnr-card-bg: #171717;
    --bnr-media-bg: #202324;
    --bnr-input-bg: #171717;
    --bnr-soft: #171717;
    --bnr-hover: #2d2d2d;
    --bnr-text: #efefef;
    --bnr-heading: #ffffff;
    --bnr-muted-text: #bdc1c6;
    --bnr-apps-text: #b8bcc1;
    --bnr-border: #3c4043;
    --bnr-card-border: rgb(63 63 63);
    --bnr-divider: #3f3f3f;
    --bnr-dash: #2d2d2d;
    --bnr-row-border: #3c4043;
    --bnr-tab-border: #3c4043;
    --bnr-sku-bg: #ffffff;
    --bnr-sku-text: #000000;
    --bnr-chip-brand-bg: #303030;
    --bnr-chip-brand-text: #ffffff;
    --bnr-chip-code-bg: transparent;
    --bnr-chip-code-text: #efefef;
    --bnr-chip-code-border: #5f6368;
    --bnr-shadow: 0 1px 2px rgb(0 0 0 / 28%);
    --bnr-menu-shadow: 0 10px 30px rgb(0 0 0 / 45%);
    --bnr-danger: #ff8a80;
    --bnr-warning-bg: #3a2e12;
    --bnr-warning-text: #f5d38a;
    --bnr-info-bg: #13233d;
    --bnr-info-text: #a9c8ff;
    --bnr-overlay: rgba(0, 0, 0, 0.75);
    color-scheme: dark;
}

body.bnr-page {
    background-color: var(--bnr-page);
    color: var(--bnr-text);
}

body.bnr-page.bnr-scheme-dark .elementor-widget-heading .elementor-heading-title {
    color: var(--bnr-heading);
}

/*
 * Isolamento dos widgets: os estilos globais do kit do Elementor e do tema
 * (".elementor-kit-N button", "input:not(...)", "h3", "a"...) venceriam as
 * classes do plugin. Dentro de .bnr-element (wrapper de todo widget do
 * plugin) essas declarações são desfeitas e passam a valer as regras da
 * camada "busca-na-rede". As especificidades ficam acima das do kit
 * (botões/links 0,2,1; campos 0,3,1; foco 0,4,1) e, fora do foco, abaixo
 * dos controles de estilo do Elementor ({{WRAPPER}} .classe = 0,4,0); no
 * foco, os controles de campo (inputControls) também miram ":focus" (0,5,0).
 * Containers e widgets nativos de um modelo dentro do widget (cartão
 * personalizado) ficam de fora; widgets do plugin nesse modelo, não.
 * Também ficam de fora as ferramentas que o editor insere no wrapper
 * (barra editar/duplicar/excluir, alças de redimensionar, ícone de vazio)
 * e os ícones escolhidos na biblioteca do Elementor, que trazem o próprio CSS.
 */
html body .bnr-element :not(:where(.bnr-element .elementor, .bnr-element .elementor *, .elementor-element-overlay, .elementor-element-overlay *, .ui-resizable-handle, .elementor-widget-empty-icon, .bnr-list-access__icon *), .bnr-sr-only),
html body :where(.bnr-element .elementor) .bnr-element :not(:where(.bnr-element .elementor .bnr-element .elementor, .bnr-element .elementor .bnr-element .elementor *, .elementor-element-overlay, .elementor-element-overlay *, .ui-resizable-handle, .elementor-widget-empty-icon, .bnr-list-access__icon *), .bnr-sr-only),
html body .bnr-element input:not([type="radio"]):not([type="checkbox"]):not(:where(.bnr-element .elementor *)),
html body :where(.bnr-element .elementor) .bnr-element input:not([type="radio"]):not([type="checkbox"]):not(:where(.bnr-element .elementor .bnr-element .elementor *)) {
    all: revert-layer;
}

html body .bnr-element input:focus:not([type="radio"]):not([type="checkbox"]):not(:where(.bnr-element .elementor *)),
html body :where(.bnr-element .elementor) .bnr-element input:focus:not([type="radio"]):not([type="checkbox"]):not(:where(.bnr-element .elementor .bnr-element .elementor *)) {
    color: revert-layer;
    border: revert-layer;
    border-radius: revert-layer;
}

/* Caixas da lista de categorias: desenhadas pelo plugin, fora da exceção
 * acima (o kit as deixaria só com a borda de baixo). 0,3,3 > kit 0,3,1. */
html body .bnr-element .bnr-filters__check input[type="checkbox"] {
    all: revert-layer;
}

/* Partes internas do Select2: no editor o WooCommerce e o Elementor
 * carregam o próprio select2.css (".select2-container--default …", até
 * 0,4,1), que deixaria o texto cinza. A caixa (.select2-selection) fica de
 * fora: é ela que os controles de estilo do widget de filtros estilizam. */
html body .bnr-element .select2-container .select2-selection--single :is(.select2-selection__rendered, .select2-selection__placeholder, .select2-selection__clear, .select2-selection__arrow, .select2-selection__arrow b),
html body .bnr-element .select2-container :is(.select2-dropdown, .select2-search--dropdown, .select2-search__field, .select2-results, .select2-results__options, .select2-results__option) {
    all: revert-layer;
}

.bnr-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.elementor-widget:has(> .elementor-widget-container > .bnr-is-idle),
.elementor-widget:has(> .bnr-is-idle) {
    display: none;
}

/* Áreas dos layouts padrão (classes CSS dos containers) */

.bnr-topbar {
    border-bottom: 1px solid var(--bnr-border);
    background-color: var(--bnr-surface);
}

/* Barra de progresso da busca, filtros e placa (criada pelo JS). Cor, altura
 * e duração vêm do widget de busca (--bnr-progress-*). */
.bnr-topbar:has(> .bnr-progress) {
    position: relative;
}

.bnr-progress {
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    z-index: 50;
    height: var(--bnr-progress-height, 3px);
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease 0.25s;
}

.bnr-progress--fixed {
    position: fixed;
    top: 0;
    bottom: auto;
    z-index: 99999;
}

.bnr-progress__bar {
    display: block;
    width: 100%;
    height: 100%;
    background-color: var(--bnr-progress-color, var(--bnr-primary));
    transform: scaleX(0);
    transform-origin: left center;
}

.bnr-progress.is-active {
    opacity: 1;
    transition: none;
}

.bnr-progress.is-active .bnr-progress__bar {
    transform: scaleX(0.9);
    transition: transform var(--bnr-progress-duration, 8s) cubic-bezier(0.1, 0.65, 0.3, 1);
}

.bnr-progress.is-active.is-done {
    opacity: 0;
    transition: opacity 0.3s ease 0.25s;
}

.bnr-progress.is-done .bnr-progress__bar {
    transform: scaleX(1);
    transition: transform 0.2s ease-out;
}

@media (prefers-reduced-motion: reduce) {
    .bnr-progress.is-active .bnr-progress__bar {
        transform: scaleX(1);
        transition: none;
        animation: bnr-progress-pulse 1.2s ease-in-out infinite;
    }

    @keyframes bnr-progress-pulse {
        50% {
            opacity: 0.4;
        }
    }
}

.bnr-sidebar {
    flex-shrink: 0;
    border-right: 1px solid var(--bnr-border);
    background-color: var(--bnr-soft);
}

.bnr-main {
    min-width: 0;
}

.bnr-panel,
.bnr-card-surface {
    border: 1px solid var(--bnr-border);
    border-radius: var(--bnr-radius);
    background-color: var(--bnr-surface);
    box-shadow: var(--bnr-shadow);
}

@media (max-width: 1024px) {
    .bnr-sidebar {
        border-right: 0;
        border-bottom: 1px solid var(--bnr-border);
    }
}

/* Filtro lateral em gaveta (tablet/celular). Basta o widget "Botão de
 * filtros" estar na página: o CSS já tira a coluna bnr-sidebar do fluxo
 * (sem piscar até o JS carregar), e o JS só abre e fecha. Largura, fundo,
 * escurecido e duração vêm do widget (--bnr-drawer-*). Camada no topo
 * para ficar sobre botões flutuantes (WhatsApp, chat). Especificidade
 * 0,2,2+, acima das regras do container do Elementor (.e-con 0,1,0), que
 * só definem variáveis por elemento. */
@media (min-width: 1025px) {
    body:not(.bnr-layout-site-compacto) .elementor-widget:has(> .elementor-widget-container > .bnr-filter-toggle),
    body:not(.bnr-layout-site-compacto) .elementor-widget:has(> .bnr-filter-toggle) {
        display: none;
    }

    body:not(.bnr-layout-site-compacto) .bnr-drawer__head,
    body:not(.bnr-layout-site-compacto) .bnr-drawer-overlay {
        display: none;
    }
}

.bnr-drawer-overlay {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    background-color: var(--bnr-drawer-overlay, rgb(0 0 0 / 50%));
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--bnr-drawer-speed, 300ms) ease, visibility 0s linear var(--bnr-drawer-speed, 300ms);
}

.bnr-drawer-overlay.is-open {
    opacity: 1;
    visibility: visible;
    transition: opacity var(--bnr-drawer-speed, 300ms) ease;
}

body.bnr-drawer-lock {
    overflow: hidden;
}

@media (max-width: 1024px) {
    html body .bnr-topbar:has(.bnr-filter-toggle) {
        flex-wrap: wrap;
    }

    html body .bnr-topbar .elementor-widget:has(.bnr-filter-toggle) {
        width: 100%;
        max-width: 100%;
    }

    html body:has(.bnr-filter-toggle) .bnr-sidebar {
        --width: var(--bnr-drawer-width, min(340px, 88vw));
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        z-index: 2147483001;
        width: var(--bnr-drawer-width, min(340px, 88vw));
        max-width: 100vw;
        height: auto;
        min-height: 0;
        flex-wrap: nowrap;
        margin: 0;
        overflow-y: auto;
        overflow-anchor: none;
        overscroll-behavior: contain;
        border: 0;
        background-color: var(--bnr-drawer-bg, var(--bnr-soft));
        box-shadow: 0 0 40px rgb(0 0 0 / 30%);
        transform: translateX(-100%);
        visibility: hidden;
        transition: transform var(--bnr-drawer-speed, 300ms) ease, visibility 0s linear var(--bnr-drawer-speed, 300ms);
    }

    html body:has([data-bnr-drawer-side="right"]) .bnr-sidebar {
        right: 0;
        left: auto;
        transform: translateX(100%);
    }

    html body:has(.bnr-filter-toggle) .bnr-sidebar.is-open {
        transform: none;
        visibility: visible;
        transition: transform var(--bnr-drawer-speed, 300ms) ease;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body:has(.bnr-filter-toggle) .bnr-sidebar,
    html body:has(.bnr-filter-toggle) .bnr-sidebar.is-open,
    .bnr-drawer-overlay,
    .bnr-drawer-overlay.is-open {
        transition: none;
    }
}

/* Filtro em modal aberto: a página atrás não rola. */
html:has(dialog.bnr-modal:modal) {
    overflow: hidden;
}

/* Layout Loja virtual (Configurações › Busca na Rede): só muda o visual
 * das áreas da página; a estrutura editada no Elementor continua a mesma.
 * No computador a coluna de filtros vira um cartão largo acima da lista;
 * em tablet/celular segue a gaveta. */
body.bnr-layout-loja-virtual {
    --bnr-store-radius: 16px;
    --bnr-store-gap: 20px;
}

body.bnr-layout-loja-virtual .bnr-topbar {
    border-bottom: 0;
    background-color: transparent;
}

body.bnr-layout-loja-virtual .bnr-panel,
body.bnr-layout-loja-virtual .bnr-card-surface {
    border-radius: 18px;
}

@media (min-width: 1025px) {
    /* Container: o próprio .bnr-shell é o flex. Seção (sites sem
     * containers): o flex é o .elementor-container e as colunas têm largura
     * do Elementor ("{{WRAPPER}}" 0,3,0), por isso o 0,4,1 abaixo. */
    body.bnr-layout-loja-virtual .bnr-shell,
    body.bnr-layout-loja-virtual .bnr-shell > .elementor-container {
        flex-direction: column;
        gap: var(--bnr-store-gap);
    }

    body.bnr-layout-loja-virtual .bnr-shell > .elementor-container > .elementor-column {
        width: 100%;
    }

    body.bnr-layout-loja-virtual .bnr-sidebar {
        width: 100%;
        max-width: 100%;
        border: 1px solid var(--bnr-border);
        border-radius: 18px;
        background-color: var(--bnr-surface);
    }
}

/* Layout padrão em seções (sites sem containers): numa coluna o Elementor
 * empilha os widgets com 100% de largura; na barra do topo e na barra da
 * listagem (total, grade/lista, ordenação) eles ficam lado a lado, como na
 * versão em containers. 0,2,1: acima do padrão do Elementor (0,2,0) e
 * abaixo da largura escolhida no widget ({{WRAPPER}} 0,3,0). */
:where(.bnr-topbar > .elementor-container > .elementor-column, .elementor-inner-section:has(.elementor-widget-bnr-result-count) .elementor-column) > .elementor-widget-wrap.elementor-element-populated {
    flex-wrap: nowrap;
    align-items: center;
    gap: 12px;
}

:where(.bnr-topbar > .elementor-container > .elementor-column > .elementor-widget-wrap, .elementor-inner-section:has(.elementor-widget-bnr-result-count) .elementor-column > .elementor-widget-wrap) > div.elementor-element.elementor-widget {
    flex: 0 0 auto;
    width: auto;
    margin-block-end: 0;
}

:where(.bnr-topbar > .elementor-container > .elementor-column > .elementor-widget-wrap) > div.elementor-element:is(.elementor-widget-bnr-search, .elementor-widget-bnr-plate-search) {
    flex: 1 1 auto;
    min-width: 0;
}

.elementor-inner-section:has(.elementor-widget-bnr-result-count) > .elementor-container {
    align-items: center;
}

:where(.elementor-inner-section) .elementor-column:has(.elementor-widget-bnr-sort) > .elementor-widget-wrap {
    justify-content: flex-end;
}

/* Espaçamentos internos iguais aos dos containers (barra do topo e filtros). */
.bnr-topbar > .elementor-container > .elementor-column > .elementor-widget-wrap.elementor-element-populated {
    padding-block: 10px;
}

.elementor-column.bnr-sidebar > .elementor-widget-wrap.elementor-element-populated {
    padding: 12px;
}

@media (max-width: 767px) {
    :where(.bnr-topbar > .elementor-container > .elementor-column) > .elementor-widget-wrap.elementor-element-populated {
        flex-wrap: wrap;
    }

    /* A grade de cartões loja/compacto avança metade do espaço entre eles
     * para fora (margem negativa); a coluna em seção não tem espaçamento
     * interno e a página rolava para o lado. 0,4,0: o do editor vence. */
    .elementor-column.bnr-main > .elementor-widget-wrap.elementor-element-populated,
    .bnr-topbar > .elementor-container > .elementor-column > .elementor-widget-wrap {
        padding-inline: 10px;
    }

    :where(.bnr-topbar > .elementor-container > .elementor-column > .elementor-widget-wrap) > div.elementor-element:not(.elementor-widget-bnr-list-access, .elementor-widget-bnr-filter-toggle) {
        flex: 1 1 100%;
    }
}

/* Layout Site compacto: a barra do topo fica numa linha (busca, placa,
 * botão de filtros, Minha lista) e, com o widget "Botão de filtros" na
 * página, a coluna bnr-sidebar vira um modal centralizado com rolagem em
 * qualquer tela (abre e fecha pelo mesmo JS da gaveta). A ordem usa
 * --order com especificidade 0,2,0: a "Ordem" do Elementor (0,3,0) vence. */
:where(body.bnr-layout-site-compacto .bnr-topbar) .elementor-widget:has(.bnr-filter-toggle) {
    --order: 1;
}

:where(body.bnr-layout-site-compacto .bnr-topbar) .elementor-widget:has(.bnr-list-access) {
    --order: 2;
}

html body.bnr-layout-site-compacto:has(.bnr-filter-toggle) .bnr-sidebar {
    --width: min(var(--bnr-drawer-width, 480px), calc(100vw - 32px));
    position: fixed;
    top: 50%;
    right: auto;
    bottom: auto;
    left: 50%;
    z-index: 2147483001;
    width: min(var(--bnr-drawer-width, 480px), calc(100vw - 32px));
    max-width: calc(100vw - 32px);
    height: auto;
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    min-height: 0;
    flex-wrap: nowrap;
    margin: 0;
    overflow-y: auto;
    overflow-anchor: none;
    overscroll-behavior: contain;
    border: 1px solid var(--bnr-border);
    border-radius: 14px;
    background-color: var(--bnr-drawer-bg, var(--bnr-surface));
    box-shadow: 0 24px 60px rgb(0 0 0 / 30%);
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.97);
    visibility: hidden;
    transition:
        opacity var(--bnr-drawer-speed, 200ms) ease,
        transform var(--bnr-drawer-speed, 200ms) ease,
        visibility 0s linear var(--bnr-drawer-speed, 200ms);
}

html body.bnr-layout-site-compacto:has(.bnr-filter-toggle) .bnr-sidebar.is-open {
    opacity: 1;
    transform: translate(-50%, -50%);
    visibility: visible;
    transition:
        opacity var(--bnr-drawer-speed, 200ms) ease,
        transform var(--bnr-drawer-speed, 200ms) ease;
}

body.bnr-layout-site-compacto .bnr-panel,
body.bnr-layout-site-compacto .bnr-card-surface {
    border-radius: 12px;
}

@media (prefers-reduced-motion: reduce) {
    html body.bnr-layout-site-compacto:has(.bnr-filter-toggle) .bnr-sidebar,
    html body.bnr-layout-site-compacto:has(.bnr-filter-toggle) .bnr-sidebar.is-open {
        transform: translate(-50%, -50%);
        transition: none;
    }
}

@layer busca-na-rede {
    /* Colunas 22/78 do layout padrão em seções: o Elementor não tem essas
     * classes e páginas geradas antes vieram sem _inline_size. */
    @media (min-width: 768px) {
        .elementor-column.elementor-col-22 {
            width: 22%;
        }

        .elementor-column.elementor-col-78 {
            width: 78%;
        }
    }

    /* Base */

    .bnr-widget {
        box-sizing: border-box;
        color: var(--bnr-text);
    }

    .bnr-widget *,
    .bnr-widget *::before,
    .bnr-widget *::after {
        box-sizing: inherit;
    }

    :where(.bnr-element) {
        color: var(--bnr-text);
    }

    :where(.bnr-element) :where(*, *::before, *::after) {
        box-sizing: border-box;
    }

    :where(.bnr-element) :where(button, input, select, textarea) {
        font: inherit;
        color: inherit;
        letter-spacing: inherit;
    }

    :where(.bnr-element) :where(h1, h2, h3, h4, h5, h6) {
        margin: 0;
        color: var(--bnr-heading);
        font-weight: 700;
        line-height: 1.2;
    }

    :where(.bnr-element) :where(a) {
        color: inherit;
        text-decoration: none;
    }

    :where(.bnr-element) :where(img) {
        max-width: 100%;
        height: auto;
        border: 0;
    }

    :where(.bnr-element) :where(figure) {
        margin: 0;
    }

    .bnr-widget [hidden],
    .bnr-widget.bnr-is-idle {
        display: none;
    }

    .bnr-widget svg {
        width: 1.1em;
        height: 1.1em;
        flex: none;
        vertical-align: middle;
    }

    .bnr-widget :focus-visible {
        outline: 2px solid var(--bnr-primary);
        outline-offset: 2px;
    }

    /* Botões */

    .bnr-button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        min-height: 38px;
        padding: 8px 18px;
        border: 1px solid var(--bnr-primary);
        border-radius: var(--bnr-radius);
        background: var(--bnr-primary);
        color: var(--bnr-on-primary);
        font: inherit;
        font-size: 13px;
        font-weight: 600;
        line-height: 1.2;
        text-decoration: none;
        cursor: pointer;
        transition: background-color 0.18s ease, color 0.18s ease, opacity 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
    }

    .bnr-button:hover,
    .bnr-button:focus-visible {
        opacity: 0.9;
        color: var(--bnr-on-primary);
    }

    .bnr-button--outline {
        background: transparent;
        color: var(--bnr-primary);
    }

    .bnr-button--outline:hover,
    .bnr-button--outline:focus-visible {
        opacity: 1;
        background: var(--bnr-primary);
        color: var(--bnr-on-primary);
    }

    .bnr-button--block {
        width: 100%;
    }

    .bnr-button[disabled],
    .bnr-button[aria-disabled="true"] {
        opacity: 0.5;
        cursor: not-allowed;
        pointer-events: none;
    }

    .bnr-button.busca-add-to-list.is-in-list {
        background: var(--bnr-primary);
        color: var(--bnr-on-primary);
    }

    .bnr-icon-button,
    .bnr-link-button {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 0;
        border: 0;
        background: none;
        font: inherit;
        line-height: 1;
        text-decoration: none;
        cursor: pointer;
        transition: color 0.18s ease;
    }

    .bnr-icon-button {
        justify-content: center;
        padding: 5px;
        color: var(--bnr-text);
    }

    .bnr-icon-button svg {
        width: 15px;
        height: 15px;
    }

    .bnr-link-button {
        color: var(--bnr-primary);
        font-size: 12px;
        font-weight: 500;
        letter-spacing: 0.4px;
    }

    .bnr-actions .bnr-link-button {
        gap: 8px;
    }

    .bnr-actions .bnr-link-button svg {
        width: 20px;
        height: 20px;
    }

    .bnr-share {
        position: relative;
    }

    .bnr-share > summary {
        display: flex;
        list-style: none;
    }

    .bnr-share > summary::-webkit-details-marker {
        display: none;
    }

    .bnr-share__menu {
        position: absolute;
        top: calc(100% + 8px);
        left: 0;
        z-index: 30;
        min-width: 200px;
        margin: 0;
        padding: 6px;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background: var(--bnr-surface);
        box-shadow: var(--bnr-menu-shadow);
        list-style: none;
    }

    .bnr-share__item {
        display: flex;
        align-items: center;
        gap: 10px;
        width: 100%;
        padding: 8px 10px;
        border: 0;
        border-radius: 6px;
        background: none;
        color: var(--bnr-text);
        font: inherit;
        font-size: 12px;
        line-height: 1.2;
        text-align: left;
        text-decoration: none;
        cursor: pointer;
    }

    .bnr-share__item:hover,
    .bnr-share__item:focus-visible {
        background: var(--bnr-hover);
        color: var(--bnr-text);
    }

    .bnr-share__item svg {
        flex: none;
        width: 16px;
        height: 16px;
    }

    .bnr-share__item.is-done {
        color: var(--bnr-primary);
    }

    .bnr-icon-button:hover,
    .bnr-icon-button:focus-visible,
    .bnr-icon-button.is-in-list {
        color: var(--bnr-primary);
    }

    .bnr-link-button:hover,
    .bnr-link-button:focus-visible {
        opacity: 0.8;
    }

    .busca-add-to-list.is-in-list svg {
        fill: currentColor;
    }

    /* Busca e placa */

    .bnr-search__row {
        display: flex;
        gap: 8px;
    }

    .bnr-search--inside .bnr-search__row {
        position: relative;
        flex-direction: row;
    }

    .bnr-search__label,
    .bnr-sort__label {
        display: block;
        margin-bottom: 6px;
        font-weight: 600;
    }

    .bnr-search__input,
    .bnr-dialog input[type="text"],
    .bnr-dialog textarea {
        width: 100%;
        min-height: 38px;
        padding: 6px 12px;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background: var(--bnr-input-bg);
        color: var(--bnr-text);
        font: inherit;
        font-size: 13px;
        box-shadow: var(--bnr-shadow);
        transition: border-color 0.18s ease, box-shadow 0.18s ease;
    }

    .bnr-search__input:focus,
    .bnr-filters__select:focus,
    .bnr-filters__input:focus,
    .bnr-sort__select:focus {
        border-color: var(--bnr-primary);
        outline: none;
        box-shadow: 0 0 0 3px color-mix(in srgb, var(--bnr-primary) 16%, transparent);
    }

    .bnr-search__input::placeholder,
    .bnr-filters__input::placeholder {
        color: var(--bnr-muted-text);
        opacity: 1;
    }

    .bnr-search--inside .bnr-search__input {
        padding-right: 46px;
    }

    .bnr-search--inside .bnr-search__button {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        min-height: 0;
        padding: 0 14px;
        border-color: transparent;
        background: transparent;
        color: var(--bnr-muted-text);
    }

    .bnr-search--inside .bnr-search__button:hover,
    .bnr-search--inside .bnr-search__button:focus-visible {
        opacity: 1;
        color: var(--bnr-primary);
    }

    .bnr-search__input--plate {
        text-transform: uppercase;
        letter-spacing: 0.08em;
    }

    .bnr-search__input--plate::placeholder {
        text-transform: none;
        letter-spacing: 0.02em;
    }

    .bnr-search__help {
        margin: 6px 0 0;
        font-size: 11px;
        color: var(--bnr-muted-text);
    }

    .bnr-search__notice {
        margin: 6px 0 0;
        font-size: 12px;
        line-height: 1.35;
        color: var(--bnr-danger);
    }

    /* Filtro lateral */

    .bnr-filters {
        display: flex;
        flex-direction: column;
    }

    .bnr-filters__fields {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        gap: 10px;
    }

    .bnr-filters__field {
        flex: 1 1 auto;
        min-width: min(100%, 180px);
    }

    .bnr-filters__label {
        display: block;
        margin: 0 0 5px;
        padding: 0;
        color: var(--bnr-muted-text);
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    .bnr-filters__select,
    .bnr-filters__input {
        width: 100%;
        height: 34px;
        min-height: 34px;
        padding: 0 10px;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background-color: var(--bnr-surface);
        color: var(--bnr-text);
        font: inherit;
        font-size: 12px;
        box-shadow: var(--bnr-shadow);
        transition: border-color 0.18s ease, box-shadow 0.18s ease;
    }

    .bnr-filters__select:disabled {
        opacity: 0.6;
        cursor: not-allowed;
    }

    /* Select2 nos filtros (a base fica na subcamada busca-na-rede.vendor, sempre abaixo destas regras) */

    .bnr-filters__field:has(.select2-container) {
        position: relative;
    }

    .bnr-filters .select2-container {
        display: block;
        font-size: 12px;
        text-align: left;
    }

    .bnr-filters .select2-container .select2-selection--single {
        display: flex;
        align-items: center;
        height: 34px;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background-color: var(--bnr-surface);
        color: var(--bnr-text);
        box-shadow: var(--bnr-shadow);
        outline: none;
        transition: border-color 0.18s ease, box-shadow 0.18s ease;
    }

    .bnr-filters .select2-container .select2-selection--single .select2-selection__rendered {
        flex: 1 1 auto;
        padding: 0 28px 0 10px;
        color: inherit;
        line-height: 1.2;
    }

    .bnr-filters .select2-container .select2-selection--single .select2-selection__arrow {
        top: 0;
        right: 4px;
        height: 100%;
    }

    .bnr-filters .select2-container .select2-selection__arrow b {
        border-color: var(--bnr-muted-text) transparent transparent;
    }

    .bnr-filters .select2-container--open .select2-selection__arrow b {
        border-color: transparent transparent var(--bnr-muted-text);
    }

    .bnr-filters .select2-container--focus .select2-selection--single,
    .bnr-filters .select2-container--open .select2-selection--single {
        border-color: var(--bnr-primary);
        box-shadow: 0 0 0 3px color-mix(in srgb, var(--bnr-primary) 16%, transparent);
    }

    .bnr-filters .select2-container--disabled .select2-selection--single {
        background-color: var(--bnr-surface);
        opacity: 0.6;
        cursor: not-allowed;
    }

    .bnr-filters .select2-dropdown,
    .bnr-filters .select2-container--open .select2-dropdown--below,
    .bnr-filters .select2-container--open .select2-dropdown--above {
        overflow: hidden;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background: var(--bnr-surface);
        color: var(--bnr-text);
        box-shadow: var(--bnr-menu-shadow);
    }

    .bnr-filters .select2-container--open .select2-dropdown--below {
        margin-top: 4px;
    }

    .bnr-filters .select2-container--open .select2-dropdown--above {
        margin-top: -4px;
    }

    .bnr-filters .select2-search--dropdown {
        padding: 6px;
    }

    .bnr-filters .select2-search--dropdown .select2-search__field {
        width: 100%;
        height: 30px;
        padding: 0 8px;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background: var(--bnr-input-bg);
        color: var(--bnr-text);
        font: inherit;
        outline: none;
    }

    .bnr-filters .select2-search--dropdown .select2-search__field:focus {
        border-color: var(--bnr-primary);
    }

    .bnr-filters .select2-results > .select2-results__options {
        max-height: 260px;
    }

    .bnr-filters .select2-results__option {
        padding: 7px 10px;
        line-height: 1.3;
    }

    .bnr-filters .select2-results__option--selected {
        background: var(--bnr-hover);
        font-weight: 700;
    }

    .bnr-filters .select2-results__option--highlighted.select2-results__option--selectable {
        background: var(--bnr-primary);
        color: var(--bnr-on-primary);
    }

    .bnr-filters .select2-results__message {
        color: var(--bnr-muted-text);
    }

    .bnr-filters__tabs {
        display: flex;
        gap: 4px;
        margin-bottom: 8px;
        padding: 3px;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background: var(--bnr-surface);
        box-shadow: var(--bnr-shadow);
    }

    .bnr-filters__tab {
        display: flex;
        flex: 1 1 0;
        min-width: 0;
        cursor: pointer;
    }

    .bnr-filters__tab:last-child {
        flex: 1.85 1 0;
    }

    .bnr-filters__tab span {
        display: flex;
        flex: 1 1 auto;
        align-items: center;
        justify-content: center;
        min-height: 32px;
        padding: 5px 3px;
        border-radius: 7px;
        color: var(--bnr-muted-text);
        font-size: 10px;
        font-weight: 700;
        line-height: 1.15;
        text-align: center;
        text-transform: uppercase;
        transition: background-color 0.18s ease, color 0.18s ease;
    }

    .bnr-filters__tab:hover span {
        background: var(--bnr-hover);
        color: var(--bnr-text);
    }

    .bnr-filters__tab input:checked + span {
        background: var(--bnr-primary);
        color: var(--bnr-on-primary);
    }

    .bnr-filters__tab input:focus-visible + span {
        outline: 2px solid var(--bnr-primary);
        outline-offset: 1px;
    }

    .bnr-filters__code {
        position: relative;
    }

    .bnr-filters__input {
        padding-right: 34px;
        text-transform: uppercase;
    }

    .bnr-filters__input::placeholder {
        text-transform: none;
    }

    .bnr-filters__code-submit {
        position: absolute;
        top: 0;
        right: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 34px;
        height: 34px;
        padding: 0;
        border: 0;
        background: transparent;
        color: var(--bnr-muted-text);
        cursor: pointer;
    }

    .bnr-filters__code-submit:hover,
    .bnr-filters__code-submit:focus-visible {
        color: var(--bnr-primary);
    }

    .bnr-filters__field--checklist {
        margin: 0;
        padding: 0;
        border: 0;
    }

    .bnr-filters__checklist {
        max-height: 360px;
        margin: 0;
        padding: 6px;
        overflow-y: auto;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background: var(--bnr-surface);
        list-style: none;
        scrollbar-width: thin;
        scrollbar-color: var(--bnr-border) transparent;
    }

    .bnr-filters__all {
        margin-bottom: 4px;
        padding-bottom: 4px;
        border-bottom: 1px solid var(--bnr-border);
    }

    .bnr-filters__check {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 6px 8px;
        border-radius: 4px;
        font-size: 12px;
        font-weight: 600;
        line-height: 1.3;
        cursor: pointer;
        transition: background-color 0.15s ease;
    }

    .bnr-filters__check:hover {
        background: var(--bnr-hover);
    }

    /* Caixa de seleção própria: igual no claro/escuro e em todo navegador */
    .bnr-filters__check input {
        display: grid;
        flex: none;
        place-content: center;
        width: 16px;
        height: 16px;
        margin: 0;
        border: 1.5px solid var(--bnr-muted-text);
        border-radius: 4px;
        background: var(--bnr-input-bg);
        cursor: pointer;
        appearance: none;
        transition: background-color 0.15s ease, border-color 0.15s ease;
    }

    .bnr-filters__check input::before {
        width: 10px;
        height: 10px;
        background: var(--bnr-on-primary);
        content: "";
        clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0, 43% 62%);
        transform: scale(0);
        transition: transform 0.12s ease;
    }

    .bnr-filters__check input:checked {
        border-color: var(--bnr-primary);
        background: var(--bnr-primary);
    }

    .bnr-filters__check input:checked::before {
        transform: scale(1);
    }

    .bnr-filters__check input:focus-visible {
        outline: 2px solid var(--bnr-primary);
        outline-offset: 2px;
    }

    .bnr-filters__check:has(input:checked) {
        color: var(--bnr-heading);
    }

    /* Item com pastinha à direita; a sublista ocupa a linha de baixo */
    .bnr-filters__checklist li {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }

    .bnr-filters__checklist li > .bnr-filters__check {
        flex: 1 1 0;
        min-width: 0;
    }

    .bnr-filters__toggle {
        display: grid;
        flex: none;
        place-items: center;
        width: 28px;
        height: 28px;
        margin: 0;
        padding: 0;
        border: 0;
        border-radius: 4px;
        background: transparent;
        color: var(--bnr-muted-text);
        font-size: 16px;
        cursor: pointer;
        transition: background-color 0.15s ease, color 0.15s ease;
    }

    .bnr-filters__toggle:hover,
    .bnr-filters__toggle[aria-expanded="true"] {
        color: var(--bnr-primary);
    }

    .bnr-filters__toggle:hover {
        background: var(--bnr-hover);
    }

    .bnr-filters__toggle:focus-visible {
        outline: 2px solid var(--bnr-primary);
        outline-offset: -2px;
    }

    .bnr-filters__toggle[aria-expanded="true"] .bnr-filters__folder,
    .bnr-filters__toggle[aria-expanded="false"] .bnr-filters__folder-open {
        display: none;
    }

    .bnr-filters__checklist li > .bnr-filters__children {
        flex-basis: 100%;
    }

    .bnr-filters__children[hidden] {
        display: none;
    }

    .bnr-filters__links {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .bnr-filters__link {
        display: block;
        padding: 5px 0;
        color: inherit;
        font-size: 12px;
        text-decoration: none;
    }

    .bnr-filters__link:hover,
    .bnr-filters__link.is-active {
        color: var(--bnr-primary);
    }

    .bnr-filters__link.is-active {
        font-weight: 600;
    }

    /* Subcategorias (listas aninhadas) */

    .bnr-filters__children {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .bnr-filters__checklist .bnr-filters__children {
        margin-left: 15px;
        padding-left: 8px;
        border-left: 1px solid var(--bnr-border);
    }

    .bnr-filters__children .bnr-filters__check {
        font-weight: 500;
    }

    .bnr-filters__links .bnr-filters__children {
        margin-left: 4px;
        padding-left: 12px;
        border-left: 1px solid var(--bnr-border);
    }

    .bnr-filters__submit {
        width: 100%;
        margin-top: 14px;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.03em;
        text-transform: uppercase;
    }

    .bnr-filters__submit:hover {
        transform: translateY(-1px);
        box-shadow: 0 6px 16px color-mix(in srgb, var(--bnr-primary) 22%, transparent);
    }

    .bnr-filters__advanced {
        margin-top: 8px;
    }

    .bnr-filters__advanced > summary {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        padding: 6px 0;
        color: var(--bnr-muted-text);
        font-size: 11px;
        font-weight: 600;
        list-style: none;
        cursor: pointer;
    }

    .bnr-filters__advanced > summary::-webkit-details-marker {
        display: none;
    }

    .bnr-filters__advanced > summary:hover,
    .bnr-filters__advanced[open] > summary {
        color: var(--bnr-primary);
    }

    .bnr-filters__advanced > .bnr-filters__fields {
        margin-top: 6px;
    }

    .bnr-filters__active {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
        margin-bottom: 12px;
        font-size: 11px;
    }

    .bnr-filters__active-label {
        color: var(--bnr-muted-text);
        font-weight: 700;
        text-transform: uppercase;
    }

    .bnr-chips {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .bnr-chip {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 3px 8px;
        border: 1px solid var(--bnr-border);
        border-radius: 999px;
        background: var(--bnr-surface);
        color: inherit;
        font-size: 11px;
        text-decoration: none;
    }

    .bnr-chip:hover {
        border-color: var(--bnr-primary);
        color: var(--bnr-primary);
    }

    .bnr-filters__clear {
        color: var(--bnr-primary);
        font-size: 11px;
    }

    /* Contagem, alternância e ordenação */

    .bnr-count {
        margin: 0;
        font-size: 12px;
    }

    .bnr-count strong {
        color: var(--bnr-heading);
        font-weight: 700;
    }

    .bnr-view-toggle {
        display: inline-flex;
        align-items: center;
        gap: 2px;
        height: 32px;
        padding: 2px;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background: var(--bnr-surface);
        box-shadow: var(--bnr-shadow);
    }

    .bnr-view-toggle__button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        min-width: 28px;
        height: 26px;
        padding: 0 6px;
        border: 0;
        border-radius: 6px;
        background: transparent;
        color: var(--bnr-muted-text);
        font: inherit;
        font-size: 12px;
        cursor: pointer;
        transition: background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
    }

    .bnr-view-toggle__button:hover {
        background: var(--bnr-hover);
        color: var(--bnr-text);
    }

    .bnr-view-toggle__button[aria-pressed="true"] {
        background: var(--bnr-primary);
        color: var(--bnr-on-primary);
        box-shadow: 0 4px 12px color-mix(in srgb, var(--bnr-primary) 28%, transparent);
    }

    .bnr-sort {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 8px;
    }

    .bnr-sort__select {
        width: auto;
        height: 32px;
        min-height: 32px;
        padding: 0 8px;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background-color: var(--bnr-surface);
        color: var(--bnr-text);
        font: inherit;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        box-shadow: var(--bnr-shadow);
    }

    .bnr-sort-menu {
        position: relative;
        display: inline-block;
    }

    .bnr-sort-menu__toggle {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        height: 32px;
        padding: 0 12px;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background: var(--bnr-surface);
        color: var(--bnr-text);
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.03em;
        text-transform: uppercase;
        list-style: none;
        box-shadow: var(--bnr-shadow);
        cursor: pointer;
        user-select: none;
    }

    .bnr-sort-menu__toggle::-webkit-details-marker {
        display: none;
    }

    .bnr-sort-menu__toggle:hover {
        background: var(--bnr-hover);
    }

    .bnr-sort-menu__toggle svg {
        width: 14px;
        height: 14px;
        transition: transform 0.18s ease;
    }

    .bnr-sort-menu[open] .bnr-sort-menu__toggle svg {
        transform: rotate(180deg);
    }

    .bnr-sort-menu__list {
        position: absolute;
        top: calc(100% + 6px);
        right: 0;
        z-index: 30;
        min-width: 210px;
        margin: 0;
        padding: 6px;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background: var(--bnr-surface);
        box-shadow: var(--bnr-menu-shadow);
        list-style: none;
    }

    .bnr-sort-menu__heading {
        padding: 6px 10px;
        color: var(--bnr-muted-text);
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    .bnr-sort-menu__item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        padding: 7px 10px;
        border-radius: 6px;
        color: var(--bnr-text);
        font-size: 12px;
        text-decoration: none;
    }

    .bnr-sort-menu__item:hover {
        background: var(--bnr-hover);
        color: var(--bnr-text);
    }

    .bnr-sort-menu__item.is-active {
        color: var(--bnr-primary);
        font-weight: 600;
    }

    /* Veículo selecionado */

    .bnr-vehicle {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 12px 14px;
        border: 1px solid var(--bnr-border);
        border-left: 3px solid var(--bnr-primary);
        border-radius: var(--bnr-radius);
        background: var(--bnr-surface);
        box-shadow: var(--bnr-shadow);
    }

    .bnr-vehicle__icon {
        display: inline-flex;
        flex: none;
        align-items: center;
        justify-content: center;
        width: 38px;
        height: 38px;
        border-radius: 50%;
        background: color-mix(in srgb, var(--bnr-primary) 14%, transparent);
        color: var(--bnr-primary);
    }

    .bnr-vehicle__icon svg {
        width: 20px;
        height: 20px;
    }

    .bnr-vehicle__body {
        display: flex;
        flex: 1 1 auto;
        flex-direction: column;
        gap: 2px;
        min-width: 0;
    }

    .bnr-vehicle__title {
        margin: 0;
        color: var(--bnr-muted-text);
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.06em;
        line-height: 1.3;
        text-transform: uppercase;
    }

    .bnr-vehicle__value {
        margin: 0;
        color: var(--bnr-heading);
        font-size: 14px;
        font-weight: 700;
        line-height: 1.3;
        overflow-wrap: anywhere;
    }

    .bnr-vehicle__value--empty {
        color: var(--bnr-muted-text);
        font-size: 12px;
        font-weight: 400;
    }

    .bnr-vehicle__plate {
        font-size: 12px;
        font-weight: 400;
    }

    .bnr-vehicle__plate strong {
        font-family: monospace;
        letter-spacing: 0.08em;
    }

    .bnr-vehicle__clear {
        display: inline-flex;
        align-items: center;
        align-self: flex-start;
        gap: 4px;
        margin-top: 4px;
        color: var(--bnr-primary);
        font-size: 12px;
        font-weight: 600;
        line-height: 1.3;
        text-decoration: none;
    }

    .bnr-vehicle__clear:hover {
        text-decoration: underline;
    }

    .bnr-vehicle__clear svg {
        width: 12px;
        height: 12px;
    }

    /* Listagem: grade sem espaçamento e bordas colapsadas, como no catálogo */

    .bnr-products {
        --bnr-columns: 3;
        --bnr-card-min: 0px;
    }

    .bnr-products__items {
        display: grid;
        grid-template-columns: repeat(var(--bnr-columns), minmax(min(100%, var(--bnr-card-min)), 1fr));
        gap: 0;
        margin: 0;
        padding: 1px 0 0 1px;
        list-style: none;
    }

    .bnr-products[data-bnr-view="list"] .bnr-products__items {
        grid-template-columns: minmax(0, 1fr);
    }

    .bnr-products__item {
        display: flex;
        min-width: 0;
        margin: -1px 0 0 -1px;
    }

    .bnr-products__item > * {
        flex: 1 1 auto;
        min-width: 0;
    }

    .bnr-products__item:hover,
    .bnr-products__item:focus-within {
        position: relative;
        z-index: 3;
    }

    .bnr-products__more {
        display: flex;
        justify-content: center;
        margin-top: 24px;
    }

    .bnr-demo-badge {
        display: inline-block;
        margin: 0 0 12px;
        padding: 4px 10px;
        border-radius: 999px;
        background: var(--bnr-warning-bg);
        color: var(--bnr-warning-text);
        font-size: 11px;
        font-weight: 600;
    }

    /* Cartão padrão */

    .bnr-card {
        position: relative;
        display: flex;
        flex-direction: column;
        height: 100%;
        border: 1px solid var(--bnr-card-border);
        background: var(--bnr-card-bg);
        color: var(--bnr-text);
        font-size: 0.8rem;
        letter-spacing: 0.6px;
        /* "Sim" do controle de efeito quando a empresa não tem neon na API
         * (com neon, o valor dela é impresso por cima, fora da camada). */
        --bnr-card-neon:
            0 0 0 1px var(--bnr-hover-outline, var(--bnr-primary)),
            0 0 12px color-mix(in srgb, var(--bnr-hover-outline, var(--bnr-primary)) 60%, transparent);
    }

    /* Efeito da empresa no Busca na Rede (--bnr-card-hover, impresso pelo
     * plugin a partir da folha de estilo da empresa: contorno, ou neon
     * quando ativo); sem ele, o mesmo contorno padrão do catálogo. */
    .bnr-card:hover,
    .bnr-card:focus-within {
        box-shadow: var(
            --bnr-card-hover,
            0 0 0 1px var(--bnr-hover-outline, var(--bnr-primary)),
            0 0 1px var(--bnr-hover-outline, var(--bnr-primary)),
            0 0 1px color-mix(in srgb, var(--bnr-hover-outline, var(--bnr-primary)) 70%, transparent)
        );
    }

    .bnr-card__head {
        position: relative;
        flex: none;
    }

    .bnr-card__sku {
        position: absolute;
        top: 10px;
        left: 10px;
        z-index: 2;
        display: inline-flex;
        align-items: center;
        gap: 4px;
        max-width: calc(100% - 20px);
        padding: 2px;
        border-radius: 4px;
        background: var(--bnr-sku-bg);
        color: var(--bnr-sku-text);
        font-size: 12px;
        line-height: 1.2;
        letter-spacing: 0;
        white-space: nowrap;
    }

    .bnr-card__sku svg {
        width: 13px;
        height: 13px;
    }

    .bnr-card__launch {
        position: absolute;
        top: 10px;
        right: 10px;
        z-index: 2;
        display: inline-flex;
        align-items: center;
        gap: 3px;
        padding: 2px;
        border-radius: 4px;
        background: var(--bnr-sku-bg);
        color: var(--bnr-sku-text);
        font-size: 12px;
        line-height: 1.2;
        letter-spacing: 0;
        white-space: nowrap;
    }

    .bnr-card__launch svg {
        width: 11px;
        height: 11px;
        fill: currentColor;
    }

    .bnr-card__media {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 255px;
        overflow: hidden;
        background: #ffffff;
    }

    .bnr-card__media img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        user-select: none;
    }

    .bnr-card__placeholder {
        padding: 16px;
        color: var(--bnr-muted-text);
        font-size: 11px;
        text-align: center;
    }

    .bnr-card__body {
        display: flex;
        flex: 1 1 auto;
        flex-direction: column;
        padding: 5px 20px 6px;
    }

    .bnr-card__title {
        margin: 4px 0 0;
        padding: 0 0 2px;
        border-bottom: 1px solid var(--bnr-divider);
        font-size: 0.7rem;
        font-weight: 500;
        line-height: 1.35;
        letter-spacing: 0.3px;
        text-transform: uppercase;
    }

    .bnr-card__title a {
        display: -webkit-box;
        min-height: calc(3 * 1.35em);
        padding-left: 5px;
        overflow: hidden;
        border-left: 3px solid var(--bnr-primary);
        color: var(--bnr-heading);
        text-decoration: none;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        line-clamp: 3;
    }

    .bnr-card__apps {
        min-height: 55px;
        max-height: 55px;
        margin: 0;
        padding: 4px 0 0;
        overflow: hidden;
        color: var(--bnr-apps-text);
        font-size: 0.6rem;
        list-style: none;
    }

    .bnr-card__apps li {
        display: flex;
        justify-content: space-between;
        gap: 8px;
        padding: 0.1rem;
        border-bottom: 1px dashed var(--bnr-dash);
        line-height: 1.45;
        text-transform: uppercase;
        white-space: nowrap;
    }

    .bnr-card__app {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .bnr-card__years {
        flex: none;
    }

    .bnr-card__footer {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        margin-top: auto;
        padding: 2px 20px 10px 18px;
    }

    .bnr-card__tools {
        display: flex;
        align-items: center;
    }

    .bnr-card__details {
        padding-right: 6px;
        border-right: 3px solid var(--bnr-primary);
        color: var(--bnr-primary);
        font-size: 10px;
        font-weight: 500;
        line-height: 1.4;
        text-transform: uppercase;
        text-decoration: none;
    }

    .bnr-card__details:hover {
        opacity: 0.8;
    }

    /* Cartão em modo lista: imagem à esquerda, conteúdo à direita */

    .bnr-products[data-bnr-view="list"] .bnr-card {
        display: grid;
        grid-template-columns: 255px minmax(0, 1fr);
        grid-template-rows: minmax(0, 1fr) auto;
    }

    .bnr-products[data-bnr-view="list"] .bnr-card__head {
        grid-row: 1 / span 2;
        border-right: 1px solid var(--bnr-divider);
    }

    .bnr-products[data-bnr-view="list"] .bnr-card__title {
        margin: 0;
        padding: 9px 0;
        border-bottom-color: var(--bnr-row-border);
        font-size: 0.8rem;
    }

    .bnr-products[data-bnr-view="list"] .bnr-card__title a {
        min-height: 0;
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }

    .bnr-products[data-bnr-view="list"] .bnr-card__apps {
        min-height: 0;
        max-height: none;
        font-size: 0.7rem;
    }

    .bnr-products[data-bnr-view="list"] .bnr-card__apps li {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 25%;
    }

    /* Paginação */

    .bnr-pagination {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 6px;
        margin-top: 24px;
    }

    .bnr-pagination__link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 32px;
        min-height: 32px;
        padding: 0 10px;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background: var(--bnr-surface);
        color: var(--bnr-text);
        font-size: 12px;
        text-decoration: none;
    }

    .bnr-pagination__link:hover {
        border-color: var(--bnr-primary);
        color: var(--bnr-primary);
    }

    .bnr-pagination__link[aria-current="page"] {
        border-color: var(--bnr-primary);
        background: var(--bnr-primary);
        color: var(--bnr-on-primary);
    }

    .bnr-pagination__gap {
        align-self: center;
        padding: 0 4px;
    }

    /* Rodapé da listagem: "Tecnologia Busca na Rede" à esquerda e a
     * paginação à direita, na mesma linha. */
    .bnr-products__foot {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 12px 24px;
        margin-top: 24px;
    }

    .bnr-products__foot .bnr-pagination {
        justify-content: flex-end;
        margin: 0 0 0 auto;
    }

    .bnr-products__credit {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        margin: 0;
        color: var(--bnr-muted-text);
        font-size: 0.8rem;
        font-weight: 600;
        line-height: 1.3;
        text-decoration: none;
        transition: color 0.18s ease;
    }

    a.bnr-products__credit:hover {
        color: var(--bnr-primary);
    }

    .bnr-products__credit img {
        flex: none;
        width: 28px;
        height: 28px;
        object-fit: contain;
    }

    /* Estados e mensagens */

    .bnr-state,
    .bnr-message {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
        padding: 32px 20px;
        border: 1px dashed var(--bnr-border);
        border-radius: var(--bnr-radius);
        background: var(--bnr-surface);
        text-align: center;
    }

    .bnr-state__icon,
    .bnr-message__icon {
        display: inline-flex;
        font-size: 32px;
        color: var(--bnr-primary);
    }

    .bnr-state__title,
    .bnr-message__title {
        margin: 0;
        font-size: 1rem;
    }

    .bnr-state__text,
    .bnr-message__text {
        margin: 0;
        color: var(--bnr-muted-text);
    }

    .bnr-state__contacts {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .bnr-state__contacts a {
        color: var(--bnr-primary);
    }

    .bnr-editor-notice {
        margin: 0 0 8px;
        padding: 6px 10px;
        border-radius: 6px;
        background: var(--bnr-info-bg);
        color: var(--bnr-info-text);
        font-size: 12px;
    }

    /* Produto: título, campos, navegação, identificação, descrição */

    .bnr-product-title {
        margin: 0;
        color: var(--bnr-heading);
        font-size: 1rem;
        font-weight: 600;
        line-height: 1.35;
        letter-spacing: 0.3px;
        text-transform: uppercase;
    }

    .bnr-product-title a {
        color: inherit;
        text-decoration: none;
    }

    .bnr-field {
        margin: 0;
    }

    .bnr-breadcrumb ol {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
        margin: 0;
        padding: 0;
        list-style: none;
        font-size: 11px;
        letter-spacing: 0.6px;
    }

    .bnr-breadcrumb a {
        color: var(--bnr-primary);
        text-decoration: none;
    }

    .bnr-breadcrumb__sep {
        color: var(--bnr-breadcrumb);
    }

    .bnr-breadcrumb--back {
        color: var(--bnr-breadcrumb);
        text-transform: uppercase;
    }

    .bnr-breadcrumb--back a {
        color: inherit;
    }

    .bnr-breadcrumb--back a:hover {
        color: var(--bnr-primary);
    }

    .bnr-breadcrumb__back {
        display: inline-flex;
        align-items: center;
        gap: 4px;
    }

    .bnr-ids {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        margin: 0;
    }

    .bnr-ids--stacked {
        flex-direction: column;
    }

    .bnr-ids__item {
        display: flex;
        gap: 6px;
        margin: 0;
    }

    .bnr-ids--cards .bnr-ids__item {
        flex: 1 1 120px;
        flex-direction: column;
        gap: 2px;
        padding: 12px;
        border-radius: var(--bnr-radius);
        background: var(--bnr-soft);
    }

    .bnr-ids__label {
        margin: 0;
        color: var(--bnr-muted-text);
        font-size: 11px;
    }

    .bnr-ids__value {
        margin: 0;
        font-weight: 600;
    }

    .bnr-ids--chips {
        gap: 0;
    }

    .bnr-ids__chip {
        display: inline-block;
        padding: 0.25rem 0.5rem;
        background: var(--bnr-chip-code-bg);
        color: var(--bnr-chip-code-text);
        font-size: 0.75rem;
        line-height: 1.5;
    }

    .bnr-ids__chip:first-child {
        border-radius: 0.2rem 0 0 0.2rem;
    }

    .bnr-ids__chip:not(:has(+ .bnr-ids__chip)) {
        border-radius: 0 0.2rem 0.2rem 0;
    }

    .bnr-ids__chip:first-child:not(:has(+ .bnr-ids__chip)) {
        border-radius: 0.2rem;
    }

    .bnr-ids__chip--code {
        box-shadow: inset 0 0 0 1px var(--bnr-chip-code-border);
    }

    .bnr-ids__chip--brand {
        background: var(--bnr-chip-brand-bg);
        color: var(--bnr-chip-brand-text);
    }

    .bnr-ids__pieces {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        margin-left: auto;
        color: var(--bnr-heading);
        font-size: 0.75rem;
        font-weight: 600;
    }

    .bnr-ids__pieces svg {
        width: 16px;
        height: 16px;
    }

    /* "POSIÇÃO traseiro": rótulo em destaque, valor como vem da API */
    .bnr-ids--attributes {
        flex-direction: column;
        gap: 2px;
        font-size: 0.75rem;
        line-height: 1.35;
    }

    .bnr-ids--attributes .bnr-ids__label {
        color: var(--bnr-heading);
        font-size: inherit;
        font-weight: 700;
        text-transform: uppercase;
    }

    .bnr-ids--attributes .bnr-ids__value {
        font-weight: 400;
    }

    .bnr-description {
        font-size: 0.8rem;
        line-height: 1.45;
    }

    .bnr-description__heading {
        margin: 0 0 8px;
    }

    .bnr-description__body > :last-child {
        margin-bottom: 0;
    }

    .bnr-description--clamp .bnr-description__body {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }

    .bnr-description--clamp .bnr-description__body p {
        margin: 0;
    }

    .bnr-description__more {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        margin-top: 2px;
        padding: 0;
        border: 0;
        background: none;
        color: var(--bnr-primary);
        font: inherit;
        cursor: pointer;
    }

    .bnr-description__more:hover {
        text-decoration: underline;
    }

    /* Ações do produto */

    .bnr-actions {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }

    .bnr-actions__links {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 16px;
    }

    .bnr-actions__cta {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-end;
        gap: 8px;
        margin-left: auto;
    }

    .bnr-button.bnr-actions__whatsapp {
        min-height: 34px;
        min-width: 34px;
        padding: 6px;
        border-color: var(--bnr-success);
        border-radius: 4px;
        background: var(--bnr-success);
        color: #ffffff;
        font-size: 14px;
    }

    .bnr-actions__whatsapp svg {
        width: 22px;
        height: 22px;
    }

    .bnr-buy {
        position: relative;
    }

    .bnr-buy > summary {
        list-style: none;
    }

    .bnr-buy > summary::-webkit-details-marker {
        display: none;
    }

    .bnr-button.bnr-actions__buy {
        min-height: 34px;
        padding: 6px 14px;
        border-color: var(--bnr-primary);
        border-radius: 4px;
        background: var(--bnr-primary);
        color: var(--bnr-on-primary);
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    .bnr-button.bnr-actions__buy:hover,
    .bnr-button.bnr-actions__buy:focus-visible {
        color: var(--bnr-on-primary);
    }

    .bnr-actions__buy svg {
        width: 18px;
        height: 18px;
    }

    .bnr-buy__menu {
        position: absolute;
        top: calc(100% + 8px);
        right: 0;
        z-index: 30;
        min-width: 220px;
        margin: 0;
        padding: 6px;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background: var(--bnr-surface);
        box-shadow: var(--bnr-menu-shadow);
        list-style: none;
    }

    .bnr-buy__item {
        display: flex;
        align-items: center;
        gap: 10px;
        width: 100%;
        padding: 8px 10px;
        border: 0;
        border-radius: 6px;
        background: none;
        color: var(--bnr-text);
        font: inherit;
        font-size: 12px;
        line-height: 1.2;
        text-align: left;
        text-decoration: none;
        cursor: pointer;
    }

    .bnr-buy__item:hover,
    .bnr-buy__item:focus-visible {
        background: var(--bnr-hover);
        color: var(--bnr-text);
    }

    .bnr-buy__item svg {
        flex: none;
        width: 16px;
        height: 16px;
    }

    /* Galeria */

    /* Miniaturas abaixo (padrão sem Elementor) ou ao lado, conforme o
     * controle "Posição das miniaturas" (--bnr-gallery-direction). */
    .bnr-gallery {
        display: flex;
        flex-direction: var(--bnr-gallery-direction, column);
        align-items: flex-start;
        gap: 8px;
    }

    .bnr-gallery__main {
        display: flex;
        flex: 1 1 auto;
        align-items: center;
        justify-content: center;
        width: 100%;
        min-width: 0;
        aspect-ratio: 1 / 1;
        padding: 0;
        overflow: hidden;
        border: 1px solid var(--bnr-divider);
        border-radius: 4px;
        background: var(--bnr-media-bg);
    }

    button.bnr-gallery__main {
        cursor: zoom-in;
    }

    .bnr-gallery__main img {
        width: 100%;
        height: 100%;
        border-radius: 4px;
        object-fit: contain;
        transition: filter 0.2s ease;
    }

    body.bnr-scheme-dark .bnr-gallery__main img {
        filter: grayscale(1);
    }

    body.bnr-scheme-dark .bnr-gallery__main:hover img,
    body.bnr-scheme-dark .bnr-gallery__main:focus-visible img {
        filter: none;
    }

    .bnr-gallery__main--empty {
        color: var(--bnr-muted-text);
        font-size: 11px;
    }

    .bnr-gallery__thumbs {
        display: flex;
        flex-direction: var(--bnr-thumbs-direction, row);
        flex-shrink: 0;
        flex-wrap: wrap;
        gap: 6px;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .bnr-gallery__thumb {
        width: 60px;
        height: 60px;
        padding: 2px;
        border: 1px solid var(--bnr-divider);
        border-radius: 4px;
        background: var(--bnr-media-bg);
        cursor: pointer;
    }

    .bnr-gallery__thumb[aria-current="true"] {
        border-color: var(--bnr-text);
    }

    .bnr-gallery__thumb img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    .bnr-zoom {
        max-width: min(92vw, 1100px);
        max-height: 92vh;
        padding: 12px;
        border: 0;
        border-radius: var(--bnr-radius);
        background: var(--bnr-surface);
        color: var(--bnr-text);
    }

    .bnr-zoom::backdrop,
    .bnr-dialog::backdrop {
        background: var(--bnr-overlay);
    }

    .bnr-zoom img {
        display: block;
        max-width: 100%;
        max-height: calc(92vh - 70px);
        margin: 0 auto;
        object-fit: contain;
    }

    .bnr-zoom__close {
        display: block;
        margin: 0 0 8px auto;
        padding: 6px 12px;
        border: 1px solid var(--bnr-border);
        border-radius: 6px;
        background: var(--bnr-surface);
        color: inherit;
        cursor: pointer;
    }

    /* Abas das informações técnicas */

    .bnr-specs__heading {
        margin: 0 0 12px;
        font-size: 0.9rem;
        text-transform: uppercase;
    }

    .bnr-specs__tablist {
        display: flex;
        flex-wrap: wrap;
        margin: 0 0 8px;
    }

    .bnr-specs__tab {
        padding: 6px 12px;
        border: 0;
        border-bottom: 3px solid var(--bnr-tab-border);
        background: none;
        color: var(--bnr-text);
        font: inherit;
        font-size: 0.75rem;
        font-weight: 600;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        cursor: pointer;
        transition: color 0.18s ease, border-color 0.18s ease;
    }

    .bnr-specs__tab:hover {
        color: var(--bnr-primary);
    }

    .bnr-specs__tab[aria-selected="true"] {
        border-color: var(--bnr-primary);
        color: var(--bnr-primary);
    }

    .bnr-specs__panel,
    .bnr-specs__box {
        padding: 25px 20px;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background: var(--bnr-surface);
        box-shadow: var(--bnr-shadow);
        font-size: 0.8rem;
    }

    /* Descrição com tópicos: uma caixa por bloco em vez da caixa do painel */
    .bnr-specs__panel:has(> .bnr-specs__boxes) {
        padding: 0;
        border: 0;
        background: none;
        box-shadow: none;
    }

    .bnr-specs__boxes {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .bnr-specs__topic {
        margin: 0 0 8px;
        padding-bottom: 4px;
        border-bottom: 1px solid var(--bnr-primary);
        color: var(--bnr-primary);
        font-size: 0.75rem;
        font-weight: 700;
        text-transform: uppercase;
    }

    .bnr-specs--stacked .bnr-specs__panel + .bnr-specs__panel {
        margin-top: 16px;
    }

    .bnr-specs__codes,
    .bnr-specs__optionals,
    .bnr-specs__docs,
    .bnr-specs__related,
    .bnr-specs__videos {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .bnr-specs__codes {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
    }

    .bnr-specs__codes li {
        padding: 3px 10px;
        border: 1px solid var(--bnr-border);
        border-radius: 6px;
        background: var(--bnr-soft);
        font-family: monospace;
    }

    .bnr-specs__videos a {
        color: var(--bnr-primary);
    }

    /* Manual técnico: um cartão por PDF com "abrir" e "baixar" */
    .bnr-specs__docs {
        display: grid;
        gap: 10px;
    }

    .bnr-specs__doc {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 12px 14px;
        padding: 12px 14px;
        border: 1px solid var(--bnr-border);
        border-radius: 10px;
        background: var(--bnr-surface);
    }

    .bnr-specs__doc-icon {
        display: inline-flex;
        flex: none;
        align-items: center;
        justify-content: center;
        width: 42px;
        height: 42px;
        border-radius: 8px;
        background: color-mix(in srgb, var(--bnr-primary) 12%, transparent);
        color: var(--bnr-primary);
        font-size: 1.35rem;
    }

    .bnr-specs__doc-info {
        display: flex;
        flex: 1 1 180px;
        flex-direction: column;
        gap: 2px;
        min-width: 0;
    }

    .bnr-specs__doc-title {
        color: var(--bnr-heading);
        font-weight: 700;
        line-height: 1.3;
        overflow-wrap: anywhere;
    }

    .bnr-specs__doc-meta {
        color: var(--bnr-muted-text);
        font-size: 0.72rem;
        font-weight: 700;
        letter-spacing: 0.04em;
    }

    .bnr-specs__doc-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .bnr-specs__doc-action {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 7px 12px;
        border: 1px solid var(--bnr-primary);
        border-radius: 8px;
        color: var(--bnr-primary);
        font-size: 0.8rem;
        font-weight: 700;
        line-height: 1.2;
        text-decoration: none;
    }

    .bnr-specs__doc-download {
        background: var(--bnr-primary);
        color: var(--bnr-on-primary);
    }

    .bnr-specs__doc-action:hover {
        filter: brightness(0.92);
        text-decoration: none;
    }

    /* Relacionados: vínculo feito pela empresa (campo "relacionados") */
    .bnr-specs__related {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
        gap: 10px;
    }

    .bnr-specs__related-item {
        display: flex;
        align-items: center;
        gap: 12px;
        height: 100%;
        padding: 8px;
        border: 1px solid var(--bnr-border);
        border-radius: 10px;
        background: var(--bnr-surface);
        color: var(--bnr-heading);
        text-decoration: none;
    }

    .bnr-specs__related-item:hover {
        border-color: var(--bnr-primary);
        text-decoration: none;
    }

    .bnr-specs__related-media {
        display: inline-flex;
        flex: none;
        align-items: center;
        justify-content: center;
        width: 64px;
        height: 64px;
        padding: 4px;
        border-radius: 8px;
        background: #fff;
        color: var(--bnr-muted-text);
        font-size: 1.5rem;
    }

    .bnr-specs__related-media img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    .bnr-specs__related-info {
        display: flex;
        flex-direction: column;
        gap: 2px;
        min-width: 0;
    }

    .bnr-specs__related-code {
        color: var(--bnr-primary);
        font-size: 0.78rem;
        font-weight: 800;
    }

    .bnr-specs__related-title {
        display: -webkit-box;
        overflow: hidden;
        font-size: 0.85rem;
        font-weight: 600;
        line-height: 1.3;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .bnr-specs__related-item:hover .bnr-specs__related-title {
        color: var(--bnr-primary);
    }

    .bnr-specs__optional {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 16px;
        padding: 10px 40px 10px 6px;
        border-bottom: 1px solid var(--bnr-border);
        color: var(--bnr-heading);
        font-weight: 400;
        line-height: 1.35;
        text-decoration: none;
        text-transform: uppercase;
    }

    .bnr-specs__optional-code {
        flex: none;
    }

    .bnr-specs__optional:hover span {
        color: var(--bnr-primary);
    }

    .bnr-specs__videos {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
        gap: 16px;
    }

    .bnr-specs__videos iframe {
        width: 100%;
        aspect-ratio: 16 / 9;
        border: 0;
    }

    /* Adicionais: "MEDIDAS ……… M52X1,50MM" em colunas de cima para baixo */
    .bnr-specs__extras {
        display: grid;
        grid-template-rows: repeat(var(--bnr-extras-rows, 6), auto);
        grid-template-columns: repeat(var(--bnr-extras-columns, 2), minmax(0, 1fr));
        grid-auto-flow: column;
        align-content: start;
        column-gap: 20px;
        margin: 0;
    }

    .bnr-specs__extra {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 12px;
        padding: 6px 0;
        border-bottom: 1px dashed var(--bnr-border);
        line-height: 1.35;
    }

    .bnr-specs__extra dt {
        margin: 0;
        font-weight: 400;
        text-transform: uppercase;
    }

    .bnr-specs__extra dd {
        margin: 0;
        color: var(--bnr-heading);
        font-weight: 700;
        text-align: right;
        text-transform: uppercase;
    }

    .bnr-specs__extra dd > * {
        margin: 0;
    }

    @media (max-width: 767px) {
        .bnr-specs__extras {
            grid-template-rows: none;
            grid-template-columns: minmax(0, 1fr);
            grid-auto-flow: row;
        }
    }

    /* Aplicações: montadora na cor da empresa e uma linha por veículo */

    .bnr-apps__heading {
        margin: 0 0 12px;
    }

    .bnr-apps {
        display: flex;
        flex-direction: column;
        gap: 18px;
    }

    .bnr-apps__list,
    .bnr-apps__summary {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .bnr-apps__head {
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        gap: 12px;
        padding: 0 0.1rem 4px;
        border-bottom: 1px solid var(--bnr-primary);
        color: var(--bnr-primary);
        text-transform: uppercase;
    }

    .bnr-apps .bnr-apps__automaker {
        margin: 0;
        color: inherit;
        font-size: 0.9rem;
        font-weight: 500;
        line-height: 1.1;
    }

    .bnr-apps__kind {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 0.75rem;
        font-weight: 300;
    }

    .bnr-apps__kind svg {
        width: 16px;
        height: 16px;
    }

    .bnr-apps__row {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 6px 0.1rem;
        border-bottom: 1px solid var(--bnr-row-border);
        color: var(--bnr-apps-text);
        font-size: 0.75rem;
        text-transform: uppercase;
    }

    .bnr-apps__row:hover {
        background: var(--bnr-hover);
    }

    .bnr-apps__photo,
    .bnr-apps__related {
        display: inline-flex;
        flex: none;
        align-items: center;
        justify-content: center;
        color: inherit;
    }

    button.bnr-apps__photo {
        margin: 0;
        padding: 0;
        border: 0;
        background: none;
        font: inherit;
        line-height: 0;
        cursor: pointer;
    }

    .bnr-apps__photo svg,
    .bnr-apps__related svg {
        width: 16px;
        height: 16px;
    }

    .bnr-apps__photo:hover,
    .bnr-apps__related:hover {
        color: var(--bnr-primary);
    }

    .bnr-apps__model {
        flex: 1 1 auto;
        min-width: 0;
    }

    .bnr-apps__model b {
        color: var(--bnr-heading);
        font-weight: 700;
    }

    /* Versão em etiquetas ("1.0|1.6" → [1.0] [1.6]), só nas aplicações da ficha;
     * nos cartões a versão é texto ("1.0, 1.6"). */
    .bnr-apps__model info.bnr-version {
        display: inline;
    }

    .bnr-apps__model info.bnr-version > span.label {
        display: inline-block;
        margin-right: 2px;
        padding: 0 5px 2px;
        border: 1px solid var(--bnr-version-border, #3c4043);
        border-radius: 4px;
        line-height: normal;
        opacity: 0.8;
    }

    .bnr-apps__years {
        flex: 0 0 160px;
        text-align: right;
    }

    .bnr-apps__summary li {
        color: var(--bnr-muted-text);
        font-size: 0.75rem;
    }

    /* Relacionados */

    .bnr-related__head {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 12px;
    }

    .bnr-related__heading {
        margin: 0;
        font-size: 0.9rem;
        text-transform: uppercase;
    }

    .bnr-related__all {
        color: var(--bnr-primary);
        font-size: 12px;
    }

    /* Carrossel de produtos. Antes do Swiper (ou sem ele) é uma linha com
       rolagem horizontal; a base do Swiper fica aqui porque o CSS dele, fora
       da camada, seria anulado pelo isolamento do .bnr-element. */

    .bnr-slider-widget[hidden] {
        display: none;
    }

    .bnr-slider {
        --bnr-slides: 4;
        --bnr-peek: 0;
        --bnr-slide-gap: 16px;
        --bnr-arrow-offset: 8px;
        --bnr-dot-size: 8px;
        --bnr-dot-color: var(--bnr-border);
        --bnr-dot-active: var(--bnr-primary);
        position: relative;
    }

    .bnr-slider__head {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 12px;
    }

    .bnr-slider__heading {
        margin: 0;
        font-size: 0.9rem;
        text-transform: uppercase;
    }

    .bnr-slider__all {
        color: var(--bnr-primary);
        font-size: 12px;
    }

    .bnr-slider__frame {
        position: relative;
    }

    /* Sobra em volta dos itens para o contorno/neon do hover (sombra por
     * fora do cartão) não ser cortado pelo overflow; a margem negativa
     * mantém os itens alinhados com o título. O Swiper desconta o padding
     * na largura dos slides. */
    .bnr-slider__viewport {
        position: relative;
        margin: calc(var(--bnr-slider-bleed, 12px) * -1);
        padding: var(--bnr-slider-bleed, 12px);
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scroll-padding-inline: var(--bnr-slider-bleed, 12px);
        scroll-snap-type: x mandatory;
        scrollbar-width: thin;
    }

    .bnr-slider__viewport.swiper-initialized {
        overflow: hidden;
        scroll-snap-type: none;
        touch-action: pan-y;
    }

    .bnr-slider__track {
        display: flex;
        gap: var(--bnr-slide-gap);
        margin: 0;
        padding: 0;
        list-style: none;
        box-sizing: content-box;
        transition-property: transform;
    }

    .swiper-initialized .bnr-slider__track {
        gap: 0;
    }

    /* border-box de volta: o trilho é content-box (Swiper) e o conteúdo
     * herdaria isso, estourando cartões com padding e height: 100%. */
    .bnr-slider__slide {
        box-sizing: border-box;
        display: flex;
        flex: 0 0 calc((100% - (var(--bnr-slides) + var(--bnr-peek) - 1) * var(--bnr-slide-gap)) / (var(--bnr-slides) + var(--bnr-peek)));
        min-width: 0;
        height: auto;
        scroll-snap-align: start;
    }

    .swiper-initialized .bnr-slider__slide {
        flex: 0 0 auto;
    }

    .bnr-slider__slide > * {
        flex: 1 1 auto;
        min-width: 0;
    }

    .bnr-slider__arrow {
        position: absolute;
        top: 50%;
        z-index: 4;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        padding: 0;
        border: 1px solid var(--bnr-border);
        border-radius: 50%;
        background: var(--bnr-input-bg);
        color: var(--bnr-primary);
        cursor: pointer;
        transform: translateY(-50%);
        transition: opacity 0.2s ease, background-color 0.2s ease, color 0.2s ease;
    }

    .bnr-slider__arrow svg {
        width: 18px;
        height: 18px;
    }

    .bnr-slider__arrow--prev {
        left: var(--bnr-arrow-offset);
    }

    .bnr-slider__arrow--next {
        right: var(--bnr-arrow-offset);
    }

    .bnr-slider:not(.is-ready) .bnr-slider__arrow,
    .bnr-slider__arrow.is-locked,
    .bnr-slider__dots.is-locked {
        display: none;
    }

    .bnr-slider__arrow.is-disabled {
        opacity: 0.35;
        cursor: default;
    }

    .bnr-slider__dots {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 8px;
        margin-top: 16px;
    }

    .bnr-slider:not(.is-ready) .bnr-slider__dots {
        display: none;
    }

    .bnr-slider__dot {
        width: var(--bnr-dot-size);
        height: var(--bnr-dot-size);
        padding: 0;
        border: 0;
        border-radius: 50%;
        background: var(--bnr-dot-color);
        cursor: pointer;
        transition: background-color 0.2s ease, transform 0.2s ease;
    }

    .bnr-slider__dot.is-active {
        background: var(--bnr-dot-active);
        transform: scale(1.25);
    }

    .bnr-slider__dots--fraction {
        color: var(--bnr-muted-text);
        font-size: 12px;
    }

    .bnr-slider__dots--progressbar {
        position: relative;
        display: block;
        height: max(2px, calc(var(--bnr-dot-size) / 2));
        overflow: hidden;
        border-radius: 999px;
        background: var(--bnr-dot-color);
    }

    .bnr-slider__progress {
        position: absolute;
        inset: 0;
        background: var(--bnr-dot-active);
        transform-origin: left top;
        transform: scale(0);
    }

    @media (prefers-reduced-motion: reduce) {
        .bnr-slider__arrow,
        .bnr-slider__dot {
            transition: none;
        }
    }

    /* Categorias (grade e carrossel) */

    .bnr-categories {
        --bnr-category-columns: 4;
        display: grid;
        grid-template-columns: repeat(var(--bnr-category-columns), minmax(0, 1fr));
        gap: 16px;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    /* Padrão do controle "Colunas" (o CSS gerado pelo Elementor prevalece). */
    @media (max-width: 1024px) {
        .bnr-categories {
            --bnr-category-columns: 3;
        }
    }

    @media (max-width: 767px) {
        .bnr-categories {
            --bnr-category-columns: 2;
        }
    }

    .bnr-categories__item {
        display: flex;
        min-width: 0;
    }

    .bnr-categories__item > *,
    .bnr-slider__slide > .bnr-category {
        flex: 1 1 auto;
        min-width: 0;
    }

    .bnr-category {
        display: flex;
        flex-direction: column;
        height: 100%;
        overflow: hidden;
        border: 1px solid var(--bnr-card-border);
        background: var(--bnr-card-bg);
        color: var(--bnr-text);
        text-decoration: none;
        transition: box-shadow 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
    }

    .bnr-category:hover,
    .bnr-category:focus-visible {
        box-shadow:
            0 0 0 1px var(--bnr-hover-outline, var(--bnr-primary)),
            0 0 1px var(--bnr-hover-outline, var(--bnr-primary));
    }

    .bnr-category__media {
        display: flex;
        flex: none;
        align-items: center;
        justify-content: center;
        height: 180px;
        overflow: hidden;
        background: #ffffff;
    }

    .bnr-category__media img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        transition: transform 0.3s ease;
        user-select: none;
    }

    .bnr-category__placeholder {
        padding: 16px;
        color: var(--bnr-muted-text);
        font-size: 11px;
        text-align: center;
    }

    .bnr-category__body {
        display: flex;
        flex: 1 1 auto;
        flex-direction: column;
        align-items: center;
        gap: 4px;
        padding: 12px 16px 14px;
        text-align: center;
    }

    .bnr-category__name {
        margin: 0;
        color: var(--bnr-heading);
        font-size: 0.85rem;
        font-weight: 700;
        letter-spacing: 0.6px;
        line-height: 1.3;
        text-transform: uppercase;
        overflow-wrap: break-word;
    }

    .bnr-category:hover .bnr-category__name {
        color: var(--bnr-primary);
    }

    .bnr-category__count {
        color: var(--bnr-muted-text);
        font-size: 12px;
    }

    .bnr-category__button {
        margin-top: auto;
        padding: 6px 14px;
        border: 1px solid var(--bnr-primary);
        color: var(--bnr-primary);
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        transition: background-color 0.2s ease, color 0.2s ease;
    }

    .bnr-category:hover .bnr-category__button {
        background: var(--bnr-primary);
        color: var(--bnr-brand-text, #ffffff);
    }

    @media (prefers-reduced-motion: reduce) {
        .bnr-category,
        .bnr-category__media img {
            transition: none;
        }
    }

    /* Minha lista */

    .bnr-mylist__title {
        margin: 0 0 16px;
    }

    .bnr-mylist__items {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .busca-list__row {
        display: grid;
        grid-template-columns: 96px minmax(0, 1fr) auto;
        align-items: center;
        gap: 16px;
        padding: 12px;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background: var(--bnr-surface);
    }

    .busca-list__media {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 96px;
        height: 96px;
        border-radius: var(--bnr-radius);
        background: var(--bnr-media-bg);
    }

    .busca-list__media img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

    .busca-list__info h3 {
        margin: 0 0 4px;
        font-size: 0.85rem;
        text-transform: uppercase;
    }

    .busca-list__info h3 a {
        color: inherit;
        text-decoration: none;
    }

    .busca-list__category,
    .busca-list__code,
    .busca-list__apps,
    .busca-list__qty-label {
        margin: 0;
        font-size: 12px;
        color: var(--bnr-muted-text);
    }

    .busca-list__controls {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 6px;
    }

    .busca-list__qty {
        display: inline-flex;
        align-items: center;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
    }

    .busca-list__qty button {
        width: 34px;
        height: 34px;
        border: 0;
        background: none;
        color: inherit;
        cursor: pointer;
    }

    .busca-list__qty input {
        width: 46px;
        height: 34px;
        border: 0;
        background: none;
        color: inherit;
        text-align: center;
        font: inherit;
    }

    .busca-list__remove {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        padding: 0;
        border: 0;
        background: none;
        color: var(--bnr-danger);
        font: inherit;
        font-size: 12px;
        cursor: pointer;
    }

    .busca-list__remove svg {
        width: 16px;
        height: 16px;
    }

    .busca-list__honeypot {
        position: absolute;
        left: -9999px;
        width: 1px;
        height: 1px;
        overflow: hidden;
    }

    .bnr-list-actions {
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding: 20px;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background: var(--bnr-surface);
    }

    .bnr-list-actions__title,
    .bnr-list-actions__text,
    .bnr-list-actions__total {
        margin: 0;
    }

    .bnr-list-actions__buttons {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .bnr-list-actions__back {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        color: var(--bnr-primary);
        text-decoration: none;
    }

    .bnr-list-access-wrap {
        display: flex;
    }

    .bnr-list-access {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        color: inherit;
        line-height: 1;
        text-decoration: none;
    }

    .bnr-list-access--button {
        min-height: 38px;
        padding: 6px 14px;
        border: 1px solid var(--bnr-border);
        border-radius: var(--bnr-radius);
        background: var(--bnr-input-bg);
        color: var(--bnr-text);
        font-size: 13px;
        font-weight: 700;
        white-space: nowrap;
        box-shadow: var(--bnr-shadow);
        transition: border-color 0.18s ease, color 0.18s ease;
    }

    .bnr-list-access--button:hover,
    .bnr-list-access--button:focus-visible {
        border-color: var(--bnr-primary);
        color: var(--bnr-primary);
    }

    .bnr-list-access__icon {
        display: inline-flex;
        flex-shrink: 0;
        align-items: center;
        justify-content: center;
        font-size: 16px;
        line-height: 1;
    }

    .bnr-list-access__icon svg {
        display: block;
        width: 1em;
        height: 1em;
    }

    .bnr-list-access__icon .e-font-icon-svg {
        fill: currentColor;
    }

    .bnr-list-access__count {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 20px;
        height: 20px;
        padding: 0 6px;
        border-radius: 999px;
        background: var(--bnr-primary);
        color: var(--bnr-on-primary);
        font-size: 12px;
        font-weight: 700;
    }

    .bnr-list-access__count[hidden] {
        display: none;
    }

    .bnr-list-button {
        display: flex;
    }

    .bnr-product-link {
        display: flex;
    }

    /* Diálogo de consulta por e-mail */

    .bnr-dialog {
        width: min(92vw, 480px);
        padding: 0;
        border: 0;
        border-radius: var(--bnr-radius);
        background: var(--bnr-surface);
        color: var(--bnr-text);
    }

    .bnr-dialog__form {
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding: 20px;
    }

    .bnr-dialog__form label {
        display: flex;
        flex-direction: column;
        gap: 4px;
        font-weight: 600;
    }

    .bnr-dialog__head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }

    .bnr-dialog__head h2 {
        margin: 0;
        font-size: 1.1em;
    }

    .bnr-dialog__close {
        padding: 6px;
        border: 0;
        background: none;
        color: inherit;
        cursor: pointer;
    }

    .bnr-dialog__form .bnr-dialog__consent {
        flex-direction: row;
        align-items: flex-start;
        gap: 8px;
        font-weight: 400;
    }

    .bnr-dialog__status {
        margin: 0;
        min-height: 1.2em;
    }

    /* Botão de filtros e cabeçalho da gaveta (tablet/celular) */

    .bnr-filter-toggle__button {
        gap: 8px;
        min-height: 40px;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

    .bnr-filter-toggle__button svg {
        width: 18px;
        height: 18px;
        flex-shrink: 0;
    }

    .bnr-filter-toggle__count {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 20px;
        height: 20px;
        padding: 0 6px;
        border-radius: 999px;
        background-color: var(--bnr-on-primary);
        color: var(--bnr-primary);
        font-size: 11px;
        font-weight: 700;
        line-height: 1;
    }

    .bnr-drawer__head {
        position: sticky;
        top: calc(var(--padding-top, 0px) * -1);
        z-index: 2;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin: calc(var(--padding-top, 0px) * -1) calc(var(--padding-right, 0px) * -1) 0 calc(var(--padding-left, 0px) * -1);
        padding: 14px var(--padding-right, 16px) 14px var(--padding-left, 16px);
        border-bottom: 1px solid var(--bnr-border);
        background-color: var(--bnr-drawer-bg, var(--bnr-soft));
    }

    .bnr-drawer__title {
        color: var(--bnr-heading);
        font-size: 14px;
        font-weight: 700;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    .bnr-drawer__close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        padding: 0;
        border: 0;
        border-radius: 50%;
        background: none;
        color: var(--bnr-text);
        cursor: pointer;
    }

    .bnr-drawer__close:hover,
    .bnr-drawer__close:focus-visible {
        background-color: var(--bnr-hover);
    }

    .bnr-drawer__close svg {
        width: 20px;
        height: 20px;
    }

    /* Filtro em modal */

    .bnr-filter-modal {
        display: flex;
        flex-wrap: wrap;
    }

    .bnr-filter-modal__trigger {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        cursor: pointer;
    }

    .bnr-filter-modal__trigger--button {
        min-height: 40px;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

    .bnr-filter-modal__trigger--link {
        padding: 0;
        border: 0;
        background: none;
        color: var(--bnr-primary);
        font: inherit;
        font-weight: 600;
        line-height: 1.3;
        text-decoration: underline;
        text-underline-offset: 3px;
    }

    .bnr-filter-modal__trigger--link:hover,
    .bnr-filter-modal__trigger--link:focus-visible {
        text-decoration-thickness: 2px;
    }

    .bnr-filter-modal__icon {
        display: inline-flex;
        flex-shrink: 0;
        align-items: center;
        justify-content: center;
        font-size: 18px;
        line-height: 1;
    }

    .bnr-filter-modal__icon svg {
        display: block;
        width: 1em;
        height: 1em;
    }

    .bnr-filter-modal__icon .e-font-icon-svg {
        fill: currentColor;
    }

    .bnr-filter-modal__count {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 20px;
        height: 20px;
        padding: 0 6px;
        border-radius: 999px;
        background-color: var(--bnr-on-primary);
        color: var(--bnr-primary);
        font-size: 11px;
        font-weight: 700;
        line-height: 1;
        text-decoration: none;
    }

    .bnr-filter-modal__trigger--link .bnr-filter-modal__count {
        background-color: var(--bnr-primary);
        color: var(--bnr-on-primary);
    }

    .bnr-modal {
        --bnr-modal-width: 560px;
        --bnr-modal-max-height: 85vh;
        --bnr-modal-speed: 200ms;
        flex-direction: column;
        width: min(var(--bnr-modal-width), calc(100vw - 32px));
        max-width: calc(100vw - 32px);
        max-height: min(var(--bnr-modal-max-height), calc(100vh - 32px));
        max-height: min(var(--bnr-modal-max-height), calc(100dvh - 32px));
        margin: auto;
        padding: 0;
        overflow: hidden;
        border: 0;
        border-radius: var(--bnr-radius);
        background-color: var(--bnr-surface);
        color: var(--bnr-text);
        box-shadow: 0 20px 60px rgb(0 0 0 / 35%);
    }

    .bnr-modal[open] {
        display: flex;
        transition: opacity var(--bnr-modal-speed) ease, transform var(--bnr-modal-speed) ease;
    }

    .bnr-modal::backdrop {
        background-color: var(--bnr-overlay, rgb(15 23 42 / 60%));
    }

    .bnr-modal[open]::backdrop {
        transition: opacity var(--bnr-modal-speed) ease;
    }

    @starting-style {
        .bnr-modal--zoom[open] {
            opacity: 0;
            transform: scale(0.95);
        }

        .bnr-modal--fade[open] {
            opacity: 0;
        }

        .bnr-modal--slide[open] {
            opacity: 0;
            transform: translateY(24px);
        }

        .bnr-modal[open]::backdrop {
            opacity: 0;
        }
    }

    .bnr-modal--none[open],
    .bnr-modal--none[open]::backdrop {
        transition: none;
    }

    /* "Mostrar o modal aberto no editor": no fluxo, abaixo do botão. */
    .bnr-modal.is-preview[open] {
        position: relative;
        inset: auto;
        flex: 0 0 auto;
        width: min(var(--bnr-modal-width), 100%);
        margin: 12px 0 0;
        transition: none;
    }

    .bnr-modal__head {
        display: flex;
        flex: none;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 14px 16px 14px 20px;
        border-bottom: 1px solid var(--bnr-border);
    }

    .bnr-modal__title {
        margin: 0;
        color: var(--bnr-heading);
        font-size: 15px;
        font-weight: 700;
        letter-spacing: 0.04em;
        line-height: 1.3;
        text-transform: uppercase;
    }

    .bnr-modal__close {
        display: inline-flex;
        flex-shrink: 0;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        margin-left: auto;
        padding: 0;
        border: 0;
        border-radius: 50%;
        background: none;
        color: var(--bnr-text);
        cursor: pointer;
    }

    .bnr-modal__close:hover,
    .bnr-modal__close:focus-visible {
        background-color: var(--bnr-hover);
    }

    .bnr-modal__close svg {
        width: 20px;
        height: 20px;
    }

    .bnr-modal__body {
        flex: 1 1 auto;
        min-height: 0;
        padding: 20px;
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    .bnr-modal__foot {
        display: flex;
        flex: none;
        justify-content: flex-end;
        padding: 12px 20px;
        border-top: 1px solid var(--bnr-border);
    }

    @media (prefers-reduced-motion: reduce) {
        .bnr-modal[open],
        .bnr-modal[open]::backdrop {
            transition: none;
        }
    }

    /* Cartão Loja virtual (Layout do cartão, ou o do site) */

    .bnr-card--store {
        gap: 4px;
        padding: 12px 12px 14px;
        border-radius: var(--bnr-store-radius, 16px);
        box-shadow: var(--bnr-store-shadow, 0 12px 28px rgb(7 20 34 / 5%));
        font-size: 0.875rem;
        letter-spacing: normal;
    }

    .bnr-card--store .bnr-card__media {
        flex: none;
        height: auto;
        aspect-ratio: 1 / 1;
        margin-bottom: 6px;
        border-radius: 12px;
    }

    .bnr-card--store .bnr-card__category {
        margin: 0;
        overflow: hidden;
        color: var(--bnr-primary);
        font-size: 0.72rem;
        font-weight: 700;
        line-height: 1.3;
        letter-spacing: 0.04em;
        text-overflow: ellipsis;
        text-transform: uppercase;
        white-space: nowrap;
    }

    .bnr-card--store .bnr-card__title {
        margin: 0;
        padding: 0;
        border: 0;
        font-size: 0.85rem;
        font-weight: 700;
        line-height: 1.2;
        letter-spacing: normal;
    }

    .bnr-card--store .bnr-card__title a {
        min-height: calc(2 * 1.2em);
        padding: 0;
        border: 0;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        transition: color 0.18s ease;
    }

    .bnr-card--store .bnr-card__title a:hover {
        color: var(--bnr-primary);
    }

    .bnr-card--store .bnr-card__head {
        margin-bottom: 6px;
    }

    .bnr-card--store .bnr-card__head .bnr-card__media {
        margin: 0;
    }

    .bnr-card--store .bnr-card__sku,
    .bnr-card--store .bnr-card__launch {
        top: 8px;
        padding: 3px 8px;
        border-radius: 999px;
        font-size: 11px;
        font-weight: 700;
    }

    .bnr-card--store .bnr-card__sku {
        left: 8px;
        max-width: calc(100% - 16px);
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .bnr-card--store .bnr-card__launch {
        right: 8px;
    }

    /* Sem imagem: os selos ficam em linha, no fluxo. */
    .bnr-card--store .bnr-card__head:not(:has(.bnr-card__media)) {
        display: flex;
        justify-content: space-between;
        gap: 8px;
    }

    .bnr-card--store .bnr-card__head:not(:has(.bnr-card__media)) > * {
        position: static;
    }

    .bnr-card--store .bnr-card__apps {
        display: flex;
        flex-direction: column;
        gap: 1px;
        min-height: 0;
        max-height: none;
        margin: 4px 0 0;
        padding: 7px 0 0;
        border-top: 1px solid var(--bnr-divider);
        color: var(--bnr-muted-text);
        font-size: 0.6rem;
        font-weight: 400;
        line-height: 1.45;
        letter-spacing: 0.5px;
    }

    .bnr-card--store .bnr-card__app {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 8px;
        margin: 0;
    }

    .bnr-card--store .bnr-card__years {
        flex: none;
        margin-left: auto;
        font-weight: 600;
    }

    .bnr-card--store .bnr-card__app-vehicle {
        flex: 1 1 auto;
        min-width: 0;
        margin: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .bnr-card--store .bnr-card__app-vehicle b {
        color: var(--bnr-heading);
        font-weight: 700;
    }

    .bnr-card--store .bnr-card__apps-more {
        margin: 2px 0 0;
        color: var(--bnr-primary);
        font-weight: 700;
    }

    .bnr-card--store .bnr-card__footer {
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 6px 16px;
        padding: 8px 0 0;
    }

    .bnr-card--store .bnr-card__details {
        padding: 0;
        border: 0;
        font-size: 0.85rem;
        font-weight: 700;
        line-height: 1.3;
        text-transform: none;
    }

    .bnr-card--store .bnr-card__save {
        font-size: 0.85rem;
        font-weight: 700;
        letter-spacing: normal;
    }

    .bnr-card--store .bnr-card__save svg {
        width: 16px;
        height: 16px;
    }

    /* Cartões separados (Loja virtual e Site compacto): espaço por item,
     * porque o "Espaçamento entre cartões" do widget (padrão 0) é aplicado
     * pelo Elementor e venceria um gap aqui. Um valor nesse controle soma
     * a este. */
    .bnr-products__items:has(> .bnr-products__item > .bnr-card--store) {
        --bnr-card-space: var(--bnr-store-gap, 20px);
    }

    .bnr-products__items:has(> .bnr-products__item > .bnr-card--compact) {
        --bnr-card-space: 12px;
    }

    .bnr-products__items:has(> .bnr-products__item > :is(.bnr-card--store, .bnr-card--compact)) {
        margin: calc(var(--bnr-card-space) / -2);
        padding: 0;
    }

    .bnr-products__item:has(> :is(.bnr-card--store, .bnr-card--compact)) {
        margin: 0;
        padding: calc(var(--bnr-card-space) / 2);
    }

    .bnr-products[data-bnr-view="list"] .bnr-card--store {
        grid-template-columns: 180px minmax(0, 1fr);
        grid-template-rows: none;
        grid-auto-rows: min-content;
        align-content: start;
        column-gap: 20px;
    }

    .bnr-products[data-bnr-view="list"] .bnr-card--store .bnr-card__head:has(.bnr-card__media) {
        grid-row: 1 / span 6;
        margin: 0;
        border-right: 0;
    }

    .bnr-products[data-bnr-view="list"] .bnr-card--store > :not(.bnr-card__head:has(.bnr-card__media)) {
        grid-column: 2;
    }

    .bnr-products[data-bnr-view="list"] .bnr-card--store .bnr-card__title {
        padding: 0;
        font-size: 0.85rem;
    }

    .bnr-products[data-bnr-view="list"] .bnr-card--store .bnr-card__apps {
        min-height: 0;
    }

    /* Carrossel: sem a sombra de repouso do cartão loja; ela espalha mais que
     * a sobra do viewport e era cortada em linha reta nas bordas. */
    .bnr-slider {
        --bnr-store-shadow: none;
    }

    .bnr-slider:has(.bnr-card--store) .bnr-slider__arrow {
        border-color: transparent;
        background: var(--bnr-surface);
        box-shadow: 0 8px 20px rgb(7 20 34 / 14%);
    }

    /* Cartão Site compacto (Layout do cartão, ou o do site) */

    .bnr-card--compact {
        flex-direction: row;
        gap: 16px;
        padding: 14px;
        border-radius: var(--bnr-compact-radius, 14px);
        letter-spacing: normal;
    }

    .bnr-card--compact .bnr-card__aside {
        display: flex;
        flex: none;
        flex-direction: column;
        gap: 8px;
        width: 104px;
    }

    .bnr-card--compact .bnr-card__media {
        box-sizing: border-box;
        width: 100%;
        height: auto;
        aspect-ratio: 1;
        padding: 6px;
        border: 1px solid var(--bnr-divider);
        border-radius: 10px;
    }

    .bnr-card--compact .bnr-card__sku {
        position: static;
        display: block;
        max-width: none;
        margin: 0;
        padding: 4px 6px;
        border-radius: 8px;
        background: color-mix(in srgb, var(--bnr-primary) 12%, transparent);
        color: var(--bnr-heading);
        font-size: 0.75rem;
        font-weight: 800;
        line-height: 1.3;
        letter-spacing: 0;
        text-align: center;
        overflow-wrap: anywhere;
    }

    .bnr-card--compact .bnr-card__body {
        min-width: 0;
        gap: 6px;
        padding: 0;
    }

    .bnr-card--compact .bnr-card__category {
        display: flex;
        gap: 6px;
        min-width: 0;
        margin: 0;
        overflow: hidden;
        color: var(--bnr-primary);
        font-size: 0.68rem;
        font-weight: 700;
        line-height: 1.3;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        white-space: nowrap;
        mask-image: linear-gradient(to right, #000 calc(100% - 32px), transparent);
    }

    .bnr-card--compact .bnr-card__category span + span::before {
        content: "›";
        margin-right: 6px;
        opacity: 0.6;
    }

    .bnr-card--compact .bnr-card__title {
        margin: 0;
        padding: 0;
        border: 0;
        font-size: 0.9rem;
        font-weight: 700;
        line-height: 1.35;
        letter-spacing: normal;
    }

    .bnr-card--compact .bnr-card__title a {
        min-height: 0;
        padding: 0;
        border: 0;
        color: var(--bnr-heading);
        -webkit-line-clamp: 2;
        line-clamp: 2;
        transition: color 0.18s ease;
    }

    .bnr-card--compact .bnr-card__title a:hover {
        color: var(--bnr-primary);
    }

    .bnr-card--compact .bnr-card__apps {
        min-height: 0;
        max-height: none;
        padding: 0;
        overflow: hidden;
        color: var(--bnr-muted-text);
        font-size: 0.75rem;
        line-height: 1.4;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .bnr-card--compact .bnr-card__footer {
        flex-wrap: wrap;
        gap: 4px 12px;
        padding: 10px 0 0;
        border-top: 1px solid var(--bnr-divider);
    }

    .bnr-card--compact .bnr-card__details {
        margin-left: auto;
        padding: 0;
        border: 0;
        font-size: 0.8rem;
        font-weight: 700;
        line-height: 1.3;
        text-transform: none;
        white-space: nowrap;
    }

    .bnr-card--compact .bnr-card__save {
        font-size: 0.8rem;
        font-weight: 600;
        letter-spacing: normal;
        white-space: nowrap;
    }

    .bnr-card--compact .bnr-card__save svg {
        width: 15px;
        height: 15px;
    }

    /* Colunas "auto" do widget definem --bnr-card-min (240px) e números
     * fixos o deixam em 0: o cartão horizontal dobra o mínimo só no auto. */
    .bnr-products:not([data-bnr-view="list"]) .bnr-products__items:has(> .bnr-products__item > .bnr-card--compact) {
        grid-template-columns: repeat(var(--bnr-columns), minmax(min(100%, calc(var(--bnr-card-min) * 2)), 1fr));
    }

    .bnr-products[data-bnr-view="list"] .bnr-card--compact {
        display: flex;
    }

    .bnr-products[data-bnr-view="list"] .bnr-card--compact .bnr-card__title {
        padding: 0;
        font-size: 0.9rem;
    }

    .bnr-products[data-bnr-view="list"] .bnr-card--compact .bnr-card__apps {
        font-size: 0.75rem;
    }

    /* Layout Loja virtual: interior dos widgets */

    .bnr-layout-loja-virtual .bnr-count {
        font-size: 0.95rem;
    }

    .bnr-layout-loja-virtual .bnr-count strong {
        font-size: 1.5rem;
        font-weight: 800;
    }

    .bnr-layout-loja-virtual .bnr-pagination__link {
        min-width: 36px;
        min-height: 36px;
        border-radius: 999px;
        font-weight: 700;
    }

    /* Filtros numa linha (computador): código, listas e "Filtrar" lado a
     * lado, alinhados pela base; filtros ativos e avançados em linha própria. */
    @media (min-width: 1025px) {
        .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters {
            flex-direction: row;
            flex-wrap: wrap;
            align-items: flex-end;
            gap: 12px;
        }

        .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters__fields {
            display: grid;
            flex: 1 1 640px;
            grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
            align-items: end;
            gap: 12px;
        }

        .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters__fields:has(> .bnr-filters__codes) {
            grid-template-columns: minmax(220px, 1.4fr) repeat(auto-fit, minmax(150px, 1fr));
        }

        .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters__active,
        .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters__advanced {
            flex: 1 1 100%;
        }

        .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters__advanced {
            order: 1;
        }

        .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters__submit {
            width: auto;
            min-width: 140px;
            height: 42px;
            margin: 0;
            border-radius: 10px;
        }
    }

    .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters__select,
    .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters__input,
    .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters .select2-container .select2-selection--single {
        height: 42px;
        min-height: 42px;
        border-radius: 10px;
    }

    .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters__code-submit {
        width: 42px;
        height: 42px;
    }

    /* Tipo de código (SKU, OEM, Ref. cruzada) como rótulos clicáveis, no
     * tamanho dos rótulos dos outros campos; o marcado na cor da empresa. */
    .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters__tabs {
        gap: 14px;
        margin: 0 0 5px;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: none;
        box-shadow: none;
    }

    .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters__tab,
    .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters__tab:last-child {
        flex: none;
    }

    .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters__tab span {
        min-height: 0;
        padding: 0;
        border-radius: 0;
        background: none;
        color: var(--bnr-muted-text);
        font-size: 11px;
        font-weight: 700;
        line-height: inherit;
        letter-spacing: 0.04em;
    }

    .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters__tab:hover span {
        background: none;
        color: var(--bnr-text);
    }

    .bnr-layout-loja-virtual .bnr-sidebar .bnr-filters__tab input:checked + span {
        background: none;
        color: var(--bnr-primary);
    }

    .bnr-layout-loja-virtual .bnr-product-title {
        font-size: 1.75rem;
        font-weight: 800;
        line-height: 1.15;
        letter-spacing: normal;
        text-transform: none;
    }

    .bnr-layout-loja-virtual .bnr-gallery__main {
        border: 0;
        border-radius: 12px;
    }

    .bnr-layout-loja-virtual .bnr-actions .bnr-button {
        min-height: 44px;
        padding-inline: 20px;
        border-radius: 999px;
    }

    .bnr-layout-loja-virtual .bnr-specs--tabs {
        overflow: hidden;
        border: 1px solid var(--bnr-border);
        border-radius: 18px;
        background: var(--bnr-surface);
        box-shadow: var(--bnr-store-panel-shadow);
    }

    .bnr-layout-loja-virtual .bnr-specs__tablist {
        margin: 0;
        padding: 0 10px;
        border-bottom: 1px solid var(--bnr-border);
    }

    .bnr-layout-loja-virtual .bnr-specs__tab {
        margin-bottom: -1px;
        padding: 14px 14px 11px;
        border-bottom-color: transparent;
        color: var(--bnr-muted-text);
        font-size: 0.72rem;
        font-weight: 800;
        letter-spacing: 0.08em;
    }

    .bnr-layout-loja-virtual .bnr-specs__tab[aria-selected="true"] {
        border-color: var(--bnr-heading);
        color: var(--bnr-heading);
    }

    .bnr-layout-loja-virtual .bnr-specs--tabs > .bnr-specs__panel {
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .bnr-layout-loja-virtual .bnr-apps__head {
        border-bottom-width: 2px;
    }

    .bnr-layout-loja-virtual .bnr-apps .bnr-apps__automaker {
        font-weight: 800;
        letter-spacing: 0.06em;
    }

    .bnr-layout-loja-virtual .bnr-apps__row {
        padding-block: 9px;
        font-size: 0.8rem;
    }

    /* Carregamento */

    .bnr-widget.is-loading,
    .bnr-widget[aria-busy="true"] {
        opacity: 0.55;
        transition: opacity 0.15s ease;
        pointer-events: none;
    }

    a.is-loading[data-bnr-load-more] {
        opacity: 0.6;
        pointer-events: none;
    }

    @media (prefers-reduced-motion: reduce) {
        .bnr-widget,
        .bnr-button,
        .bnr-card,
        .bnr-filters__submit:hover {
            transition: none;
            transform: none;
        }
    }

    @media (max-width: 767px) {
        .bnr-search__row {
            flex-direction: column;
        }

        .bnr-products[data-bnr-view="list"] .bnr-card {
            grid-template-columns: minmax(0, 1fr);
            grid-template-rows: auto;
        }

        .bnr-products[data-bnr-view="list"] .bnr-card__head {
            grid-row: auto;
            border-right: 0;
        }

        .bnr-products[data-bnr-view="list"] .bnr-card--store {
            grid-template-columns: 110px minmax(0, 1fr);
            column-gap: 12px;
        }

        .bnr-card--store .bnr-card__title {
            font-size: 0.82rem;
        }

        .bnr-card--compact {
            gap: 12px;
            padding: 12px;
        }

        .bnr-card--compact .bnr-card__aside {
            width: 84px;
        }

        .bnr-products__foot {
            flex-direction: column-reverse;
        }

        .bnr-products__foot .bnr-pagination {
            justify-content: center;
            margin: 0;
        }

        .bnr-card--compact .bnr-card__title {
            font-size: 0.85rem;
        }

        .bnr-apps__years {
            flex-basis: auto;
        }

        .busca-list__row {
            grid-template-columns: 72px minmax(0, 1fr);
        }

        .busca-list__media {
            width: 72px;
            height: 72px;
        }

        .busca-list__controls {
            grid-column: 1 / -1;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
        }
    }
}

/*
 * Modal de fotos do veículo + lightbox (criados no body, fora de .bnr-element).
 * Fora da camada para não perder para estilos globais do tema.
 * Os dois usam <dialog> (top layer): o lightbox abre depois e fica acima.
 * z-index só como reserva se o navegador não empilhar no top layer.
 */
.bnr-vehicle-photos.bnr-modal {
    --bnr-modal-width: min(720px, calc(100vw - 32px));
    z-index: 100000;
    flex-direction: column;
    width: min(var(--bnr-modal-width), calc(100vw - 32px));
    max-width: calc(100vw - 32px);
    max-height: min(85vh, calc(100dvh - 32px));
    margin: auto;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: var(--bnr-radius, 8px);
    background-color: var(--bnr-surface, #fff);
    color: var(--bnr-text, #303030);
    box-shadow: 0 20px 60px rgb(0 0 0 / 35%);
}

.bnr-vehicle-photos.bnr-modal[open] {
    display: flex;
}

.bnr-vehicle-photos.bnr-modal::backdrop {
    background-color: var(--bnr-overlay, rgb(15 23 42 / 60%));
}

.bnr-vehicle-photos .bnr-modal__head {
    display: flex;
    flex: none;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px 14px 20px;
    border-bottom: 1px solid var(--bnr-border, #e2e8f0);
}

.bnr-vehicle-photos .bnr-modal__title {
    margin: 0;
    color: var(--bnr-heading, #212121);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1.3;
    text-transform: uppercase;
}

.bnr-vehicle-photos .bnr-modal__close {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: inherit;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
}

.bnr-vehicle-photos .bnr-modal__body {
    flex: 1 1 auto;
    min-height: 0;
    padding: 20px;
    overflow-y: auto;
}

.bnr-vehicle-photos__body {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.bnr-vehicle-photos__status {
    margin: 0;
    color: var(--bnr-apps-text, var(--bnr-text));
    font-size: 0.9rem;
}

.bnr-vehicle-photos__status.is-error {
    color: var(--bnr-heading);
}

.bnr-vehicle-photos__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

/* Quadro fixo 4:3: a foto preenche o quadro (cover); a borda contorna
 * o quadro, não um fundo colorido ao redor da imagem. */
.bnr-vehicle-photos .bnr-vehicle-photos__shot,
.bnr-vehicle-photos a.bnr-vehicle-photos__shot,
.bnr-vehicle-photos button.bnr-vehicle-photos__shot {
    box-sizing: border-box;
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--bnr-border, #e2e8f0);
    border-radius: 6px;
    background-color: transparent;
    background-image: none;
    color: inherit;
    font: inherit;
    line-height: 0;
    text-decoration: none;
    cursor: zoom-in;
    aspect-ratio: 4 / 3;
    box-shadow: none;
}

.bnr-vehicle-photos .bnr-vehicle-photos__shot--skeleton {
    cursor: default;
    border-color: var(--bnr-border, #e2e8f0);
    background-color: var(--bnr-soft, #f1f5f9);
    background-image: linear-gradient(
        90deg,
        transparent 0%,
        rgb(255 255 255 / 35%) 50%,
        transparent 100%
    );
    background-size: 200% 100%;
    animation: bnr-vehicle-photos-pulse 1.1s ease-in-out infinite;
}

body.bnr-scheme-dark .bnr-vehicle-photos .bnr-vehicle-photos__shot--skeleton {
    background-color: #1f2937;
    background-image: linear-gradient(
        90deg,
        transparent 0%,
        rgb(255 255 255 / 8%) 50%,
        transparent 100%
    );
    background-size: 200% 100%;
}

@keyframes bnr-vehicle-photos-pulse {
    0% { background-position: 100% 0; }
    100% { background-position: -100% 0; }
}

.bnr-vehicle-photos .bnr-vehicle-photos__shot img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    object-fit: cover;
    object-position: center;
    vertical-align: top;
}

@media (max-width: 600px) {
    .bnr-vehicle-photos__grid {
        grid-template-columns: 1fr;
    }
}