:root {
    /* Identidad de Marca Berbentana Motors — Industrial Forest & Precisión */
    --color-primary-rgb: 28 102 53;        /* Verde Bosque Institucional #1C6635 */
    --color-on-primary-rgb: 255 255 255;   /* Blanco puro */
    --color-surface-rgb: 255 255 255;      /* Blanco puro */
    --color-background-rgb: 255 255 255;

    /* Tipografía en Grafito Bosque Profundo y Gris Acero Forestal */
    --color-on-surface-rgb: 20 26 22;      /* Grafito Bosque #141A16 */
    --color-on-background-rgb: 20 26 22;   /* Grafito Bosque #141A16 */
    --color-secondary-rgb: 74 90 80;       /* Gris Acero Forestal #4A5A50 */
    --color-on-surface-variant-rgb: 74 90 80;

    /* Superficies y Contenedores en Tintes Salvia Institucionales */
    --color-surface-container-lowest-rgb: 255 255 255;
    --color-surface-container-low-rgb: 246 250 247;     /* #F6FAF7 */
    --color-surface-container-rgb: 236 245 238;         /* #ECF5EE */
    --color-surface-container-high-rgb: 213 238 221;    /* Salvia oficial #D5EEDD */
    --color-surface-container-highest-rgb: 194 228 205; /* #C2E4CD */
    --color-outline-rgb: 148 178 158;                   /* #94B29E */
    --color-outline-variant-rgb: 213 238 221;           /* #D5EEDD */

    /* Acentos de Marca Berbentana (Extraídos del Logo) */
    --color-bm-leaf-rgb: 60 180 72;        /* Verde Hoja Vibrante #3CB448 */
    --color-bm-forest-rgb: 24 100 52;      /* Verde Pino #186434 */
    --color-bm-sage-rgb: 213 238 221;      /* Salvia Institucional #D5EEDD */

    /* Tokens de Header */
    --color-header-bar-bg-rgb: 28 102 53;  /* Barra superior Verde Bosque #1C6635 */
    --color-header-bar-text-rgb: 255 255 255;
    --color-header-icon-rgb: 20 26 22;
    --color-header-icon-hover-rgb: 28 102 53;

    /* Geometría Técnica Robusta (8px - 16px) */
    --radius-badge: 0.375rem;  /* 6px */
    --radius-btn: 0.5rem;      /* 8px */
    --radius-default: 0.5rem;  /* 8px */
    --radius-lg: 0.75rem;      /* 12px */
    --radius-xl: 1rem;         /* 16px */
}

/* Grillas de productos en portada */
.gs-product-grid-wrapper ul.products {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin: 0;
    padding: 0;
    list-style: none;
}
@media (min-width: 768px) {
    .gs-product-grid-wrapper ul.products {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 1.5rem;
    }
}
@media (min-width: 1024px) {
    .gs-product-grid-wrapper ul.products {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 2rem;
    }
}
.gs-product-grid-wrapper ul.products li.product {
    width: 100% !important;
    margin: 0 !important;
    clear: none !important;
}

/* Botones de compra en tarjetas de producto (Visibles en Home y Tienda para compra rápida de repuestos) */
.woocommerce-loop-btn-wrapper .button {
    border-radius: var(--radius-btn, 0.5rem) !important;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    font-weight: 700;
}

/* Geometría del Hero Panorámico */
.sw-hero__media,
.bm-hero__media {
    aspect-ratio: 3/4;
    max-height: 88svh;
}
@media (min-width: 768px) {
    .sw-hero__media,
    .bm-hero__media {
        aspect-ratio: auto;
        height: 380px;
        max-height: 380px;
        min-height: 340px;
    }
}

.bm-hero__fallback {
    background: linear-gradient(125deg, #f6faf7 0%, #e4f3e8 50%, #d5eedd 100%);
    border-bottom: 1px solid rgba(28, 102, 53, 0.16);
}

.bm-hero__emblem {
    position: absolute;
    right: 2rem;
    top: 50%;
    transform: translateY(-50%);
    width: 220px;
    height: auto;
    opacity: 0.15;
    object-fit: contain;
    pointer-events: none;
    user-select: none;
}
@media (min-width: 768px) {
    .bm-hero__emblem {
        right: 4rem;
        width: 310px;
        opacity: 0.88;
        filter: drop-shadow(0 12px 24px rgba(28, 102, 53, 0.14));
    }
}

.bm-hero__content {
    display: flex;
    align-items: center;
    top: 0;
    bottom: 0;
    padding: 2rem 1.5rem;
}
@media (min-width: 768px) {
    .bm-hero__content {
        padding: 2.5rem 4rem;
    }
}
@media (min-width: 1024px) {
    .bm-hero__content {
        padding: 3rem 5rem;
    }
}

/* Geometría y Fondos de Portales Duales */
.sw-hero-split,
.bm-hero-split {
    min-height: 380px;
}
@media (min-width: 768px) {
    .sw-hero-split,
    .bm-hero-split {
        height: 440px;
        min-height: 400px;
        max-height: 440px;
    }
}

.bm-portal--primary {
    background: linear-gradient(135deg, #237a40 0%, #1c6635 100%);
}
.bm-portal--secondary {
    background: linear-gradient(135deg, #f6faf7 0%, #e2f2e7 55%, #d5eedd 100%);
    border: 1px solid rgba(28, 102, 53, 0.22);
}

/* Geometría del Spotlight Técnico */
.sw-spotlight-img,
.bm-spotlight-img {
    min-height: 360px;
}
@media (min-width: 768px) {
    .sw-spotlight-img,
    .bm-spotlight-img {
        min-height: 500px;
    }
}

/* ==========================================================================
   BUSCADOR DRILL-DOWN DE REPUESTOS Y MAQUINARIAS (.bm-finder & .sys-*)
   ========================================================================== */
.bm-finder-section {
    background-color: rgb(var(--color-surface-container-low-rgb));
    border-bottom: 1px solid rgba(28, 102, 53, 0.15);
}

.bm-finder-card {
    background-color: #ffffff;
    border: 1px solid rgba(28, 102, 53, 0.22);
    border-radius: var(--radius-xl);
    box-shadow: 0 10px 28px -6px rgba(20, 26, 22, 0.08);
    padding: 1.25rem;
}
@media (min-width: 768px) {
    .bm-finder-card {
        padding: 1.5rem 2rem;
    }
}

.sys-buscador-contenedor,
.bm-finder-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
    align-items: stretch;
}
@media (min-width: 768px) {
    .sys-buscador-contenedor,
    .bm-finder-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1rem;
    }
}
@media (min-width: 1024px) {
    .sys-buscador-contenedor.bm-finder-grid--with-search {
        grid-template-columns: 1.1fr 1.1fr 1.1fr 1.2fr auto;
    }
    .sys-buscador-contenedor:not(.bm-finder-grid--with-search) {
        grid-template-columns: 1fr 1fr 1fr auto;
    }
}

.bm-finder-field {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.bm-finder-label {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: rgb(var(--color-secondary-rgb));
}

.sys-select,
.bm-finder-input {
    width: 100%;
    min-height: 46px;
    padding: 0.625rem 0.875rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: rgb(var(--color-on-surface-rgb));
    background-color: rgb(var(--color-surface-container-low-rgb));
    border: 1.5px solid rgb(var(--color-outline-rgb));
    border-radius: var(--radius-btn);
    transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.sys-select:focus,
.bm-finder-input:focus {
    outline: none;
    border-color: rgb(var(--color-primary-rgb));
    background-color: #ffffff;
    box-shadow: 0 0 0 3px rgba(28, 102, 53, 0.15);
}

.sys-select:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    background-color: rgb(var(--color-surface-container-rgb));
}

.sys-btn {
    min-height: 46px;
    padding: 0.625rem 1.5rem;
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #ffffff;
    background-color: rgb(var(--color-primary-rgb));
    border: none;
    border-radius: var(--radius-btn);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    white-space: nowrap;
    transition: background-color 0.2s ease, opacity 0.2s ease, transform 0.15s ease;
    align-self: end;
}

.sys-btn:hover:not(:disabled) {
    background-color: rgb(var(--color-bm-forest-rgb));
}

.sys-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    background-color: rgb(var(--color-secondary-rgb));
}

/* ==========================================================================
   GRILLA DE MARCAS OFICIALES (.bm-brands-grid)
   ========================================================================== */
.bm-brands-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}
@media (min-width: 640px) {
    .bm-brands-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 1rem;
    }
}
@media (min-width: 1024px) {
    .bm-brands-grid {
        grid-template-columns: repeat(8, minmax(0, 1fr));
        gap: 1rem;
    }
}

.bm-brand-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0.875rem;
    background-color: #ffffff;
    border: 1px solid rgb(var(--color-surface-container-high-rgb));
    border-radius: var(--radius-lg);
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
    text-decoration: none;
}

.bm-brand-card:hover {
    transform: translateY(-2px);
    border-color: rgb(var(--color-primary-rgb));
    box-shadow: 0 6px 16px -4px rgba(28, 102, 53, 0.14);
}

.bm-brand-card img {
    height: 48px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
}

/* ==========================================================================
   CAJA DE COMPATIBILIDAD Y CONSULTA TÉCNICA EN PDP (.bm-compat-box)
   ========================================================================== */
.bm-compat-box {
    background-color: rgb(var(--color-surface-container-low-rgb));
    border: 1px solid rgb(var(--color-surface-container-high-rgb));
    border-left: 4px solid rgb(var(--color-primary-rgb));
    border-radius: var(--radius-lg);
    padding: 0.875rem 1rem;
}

.bm-compat-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.6rem;
    font-size: 11px;
    font-weight: 700;
    color: rgb(var(--color-primary-rgb));
    background-color: rgb(var(--color-surface-container-high-rgb));
    border-radius: var(--radius-badge);
    text-decoration: none;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.bm-compat-chip:hover {
    background-color: rgb(var(--color-primary-rgb));
    color: #ffffff;
}

/* Armonización de Checkout y Carrito */
.woocommerce-checkout button#place_order {
    background-color: rgb(var(--color-primary-rgb)) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px 0 rgba(var(--color-primary-rgb), 0.3) !important;
    opacity: 1 !important;
}
.woocommerce-checkout button#place_order:hover {
    opacity: 0.92 !important;
}