:root {
    --ipr-azul:      #0A2463;
    --ipr-azul-med:  #1B3F8B;
    --ipr-rojo:      #D62828;
    --ipr-rojo-osc:  #b51f1f;
    --ipr-negro:     #0D0D0D;
    --ipr-gris-osc:  #1A1A1A;
    --ipr-gris-med:  #2a2a2a;
    --ipr-gris-bor:  rgba(255,255,255,0.08);
    --ipr-blanco:    #ffffff;
    --ipr-texto:     #e0e0e0;
    --ipr-sub-texto: #9ca3af;
}

input[type="number"] {
    -webkit-appearance: textfield !important;
    -moz-appearance:    textfield !important;
    margin: 0;
}

[data-tltip] {
    position:    relative;
    border-bottom: 1px dotted #09C;
    cursor:      pointer;
}
[data-tltip]::before {
    content:          attr(data-tltip);
    font-size:        .875rem;
    text-align:       justify;
    background-color: rgba(0,0,0,.75);
    color:            #fff;
    width:            200px;
    padding:          6px;
    border-radius:    3px;
    display:          none;
    position:         absolute;
    bottom:           25px;
    left:             calc(100% - 75%);
    pointer-events:   none;
    z-index:          99;
}
[data-tltip]::after {
    content:      "";
    height:       1px;
    width:        1px;
    border:       10px solid transparent;
    border-top-color: rgba(0,0,0,.75);
    position:     absolute;
    bottom:       5px;
    left:         40%;
    display:      none;
}
[data-tltip]:hover::before,
[data-tltip]:hover::after { display: block; }

.title_producto {
    color:       #373f50 !important;
    font-weight: 700;
    font-family: arial;
    font-size:   .88rem !important;
    padding-bottom: 1px;
}

.home-hero {
    background: #f8f9fb;
}

.hero-title {
    font-size: 2.8rem;
    line-height: 1.05;
    font-weight: 700;
    letter-spacing: -0.03em;
}

.hero-text {
    color: #6c757d;
    max-width: 620px;
}

.letter-spacing {
    letter-spacing: 0.2em;
}

.home-hero-panel {
    background: #ffffff;
}

.home-hero-card {
    background: #f7f8fb;
    border: 1px solid rgba(115, 125, 147, 0.12);
    min-height: 190px;
}

.home-category-card,
.home-brand-card {
    transition: transform .25s ease, box-shadow .25s ease;
}

.home-category-card:hover,
.home-brand-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 45px rgba(46, 61, 73, 0.08);
}

.home-service-card,
.home-hero-card {
    background: #f8f9fb;
    border: 1px solid rgba(77, 93, 114, 0.08);
}

.home-icon {
    width: 64px;
    height: 64px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    background: #eff3fb;
    color: #1f4f8b;
    font-size: 1.5rem;
}

.service-panel .home-service-card,
.feature-panel {
    background: #ffffff;
}

.feature-icon {
    width: 52px;
    height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #e8efff;
    color: #1f4f8b;
    font-size: 1.25rem;
    margin-right: 16px;
}

.feature-item {
    gap: 18px;
}

.cta-section {
    background: #1f3a72;
}

.cta-section .btn {
    min-width: 220px;
}

@media (max-width: 767.98px) {
    .hero-title {
        font-size: 2rem;
    }
    .home-icon {
        width: 52px;
        height: 52px;
        font-size: 1.25rem;
    }
}

.text-inticap,
.hero-title.text-inticap {
    color: #1f3a72 !important;
}

.btn-home-primary,
.btn-outline-home-primary {
    min-width: 220px;
}

.btn-home-primary {
    background-color: #1f3a72;
    border-color: #1f3a72;
    color: #fff;
}

.btn-home-primary:hover,
.btn-home-primary:focus {
    background-color: #152a56;
    border-color: #152a56;
}

.btn-outline-home-primary {
    color: #1f3a72;
    border-color: #1f3a72;
    background-color: transparent;
}

.btn-outline-home-primary:hover,
.btn-outline-home-primary:focus {
    color: #fff;
    background-color: rgba(31,58,114,0.1);
    border-color: #1f3a72;
}

.cta-section {
    background: #1f3a72;
}

/* ================================================================
   HEADER IPR — Tema oscuro automotriz
   ================================================================ */

/* ── Wrapper principal ── */
#ipr-header {
    background:    var(--ipr-negro);
    border-bottom: 1px solid var(--ipr-gris-bor);
    position:      sticky;
    top:           0;
    z-index:       9999;
    font-family:   inherit;
}

/* Línea decorativa roja arriba */
#ipr-header::before {
    content:    '';
    display:    block;
    height:     3px;
    background: linear-gradient(90deg, var(--ipr-rojo) 0%, var(--ipr-azul-med) 50%, var(--ipr-rojo) 100%);
}

/* ── Topbar ── */
#ipr-topbar {
    display:     flex;
    align-items: center;
    gap:         16px;
    padding:     10px 24px;
    max-width:   1320px;
    margin:      0 auto;
}

/* ── Buscador desktop ── */
#ipr-search-wrap {
    flex:      1;
    display:   flex;
    align-items: center;
    max-width: 620px;
}
#ipr-search-input {
    all:           unset;
    flex:          1;
    height:        42px;
    padding:       0 14px;
    font-size:     14px;
    color:         var(--ipr-blanco);
    background:    var(--ipr-gris-med);
    border:        1.5px solid rgba(255,255,255,0.12);
    border-right:  none;
    border-radius: 8px 0 0 8px;
    transition:    border-color .2s;
    box-sizing:    border-box;
}
#ipr-search-input::placeholder { color: var(--ipr-sub-texto); }
#ipr-search-input:focus {
    border-color: var(--ipr-rojo);
    background:   var(--ipr-gris-osc);
    outline:      none;
}
#ipr-search-btn {
    all:           unset;
    display:       flex;
    align-items:   center;
    justify-content: center;
    width:         46px;
    height:        42px;
    background:    var(--ipr-rojo);
    border-radius: 0 8px 8px 0;
    cursor:        pointer;
    transition:    background .2s;
    flex-shrink:   0;
}
#ipr-search-btn:hover { background: var(--ipr-rojo-osc); }
#ipr-search-btn i { color: #fff !important; font-size: 16px; }

/* ── Herramientas ── */
#ipr-tools {
    display:     flex;
    align-items: center;
    gap:         2px;
    margin-left: auto;
    flex-shrink: 0;
}

.ipr-tool {
    all:             unset;
    display:         flex;
    flex-direction:  column;
    align-items:     center;
    justify-content: center;
    cursor:          pointer;
    padding:         6px 10px;
    border-radius:   8px;
    color:           var(--ipr-sub-texto);
    text-decoration: none;
    box-sizing:      border-box;
    transition:      color .2s, background .2s;
    position:        relative;
}
.ipr-tool:hover {
    color:       var(--ipr-rojo);
    background:  rgba(214,40,40,0.08);
}
.ipr-tool i           { font-size: 22px; color: inherit; }
.ipr-tool-label       { font-size: 11px; color: inherit; margin-top: 1px; line-height: 1; }
.ipr-tool-text        { font-size: 13px; font-weight: 600; color: var(--ipr-blanco); line-height: 1.2; }
.ipr-tool-subtext     { font-size: 11px; color: var(--ipr-sub-texto); line-height: 1; }
.ipr-tool-inner       { display: flex; align-items: center; gap: 8px; }
.ipr-tool-wrap        { position: relative; }
.ipr-tool-wrap:hover .ipr-dropdown { display: block; }

/* Icono carrito con badge */
.ipr-cart-icon-wrap { position: relative; display: inline-block; }

/* ── Badge carrito ── */
.ipr-badge {
    position:      absolute;
    top:           -4px;
    right:         -6px;
    background:    var(--ipr-rojo);
    color:         #fff;
    font-size:     10px;
    font-weight:   700;
    min-width:     18px;
    height:        18px;
    border-radius: 9px;
    display:       flex;
    align-items:   center;
    justify-content: center;
    padding:       0 4px;
    line-height:   1;
    border:        2px solid var(--ipr-negro);
}

/* ── Navbar ── */
#ipr-navbar {
    background:   var(--ipr-gris-osc);
    border-top:   1px solid var(--ipr-gris-bor);
}
#ipr-navbar-inner {
    display:     flex;
    align-items: center;
    max-width:   1320px;
    margin:      0 auto;
    padding:     0 24px;
}

/* ── Nav lista ── */
#ipr-nav {
    all:         unset;
    display:     flex;
    align-items: center;
    list-style:  none;
    margin:      0;
    padding:     0;
}
#ipr-nav * { box-sizing: border-box; }
#ipr-nav > li,
#ipr-nav > .ipr-nav-item {
    position:   relative;
    list-style: none;
}

/* ── Links nivel 0 ── */
#ipr-nav > li > a,
#ipr-nav > li > a:link,
#ipr-nav > li > a:visited,
#ipr-nav > .ipr-nav-item > a,
#ipr-nav > .ipr-nav-item > a:link,
#ipr-nav > .ipr-nav-item > a:visited {
    all:             unset !important;
    display:         block !important;
    font-size:       13px !important;
    font-weight:     600 !important;
    color:           var(--ipr-texto) !important;
    font-family:     inherit !important;
    padding:         13px 15px !important;
    white-space:     nowrap !important;
    text-decoration: none !important;
    background:      transparent !important;
    cursor:          pointer !important;
    position:        relative !important;
    letter-spacing:  0.02em !important;
    transition:      color .2s !important;
    box-sizing:      border-box !important;
    text-transform:  uppercase !important;
}

/* Línea roja inferior animada */
#ipr-nav > li > a::after,
#ipr-nav > .ipr-nav-item > a::after {
    content:    '';
    display:    block;
    position:   absolute;
    bottom:     0; left: 15px; right: 15px;
    height:     2px;
    background: transparent;
    transition: background .2s;
}
#ipr-nav > li:hover > a::after,
#ipr-nav > .ipr-nav-item:hover > a::after {
    background: var(--ipr-rojo) !important;
}
#ipr-nav > li:hover > a,
#ipr-nav > .ipr-nav-item:hover > a {
    color: var(--ipr-blanco) !important;
}

/* ── Flecha ── */
.ipr-arrow {
    font-style:  normal !important;
    font-size:   11px !important;
    color:       rgba(255,255,255,0.3) !important;
    margin-left: 4px !important;
    transition:  color .2s !important;
}
#ipr-nav > li:hover > a .ipr-arrow,
#ipr-nav > .ipr-nav-item:hover > a .ipr-arrow {
    color: var(--ipr-rojo) !important;
}

/* ── Dropdown nivel 1 ── */
#ipr-nav > li > .ipr-submenu,
#ipr-nav > .ipr-nav-item > .ipr-submenu {
    display:       none !important;
    position:      absolute !important;
    top:           100% !important;
    left:          0 !important;
    z-index:       9999 !important;
    background:    var(--ipr-gris-osc) !important;
    border-top:    2px solid var(--ipr-rojo) !important;
    border-radius: 0 0 10px 10px !important;
    box-shadow:    0 8px 30px rgba(0,0,0,0.5) !important;
    padding:       8px 0 !important;
    min-width:     220px !important;
    list-style:    none !important;
    margin:        0 !important;
}
#ipr-nav > li:hover > .ipr-submenu,
#ipr-nav > .ipr-nav-item:hover > .ipr-submenu {
    display: block !important;
}

/* Links nivel 1 */
#ipr-nav .ipr-submenu > li > a,
#ipr-nav .ipr-submenu > li > a:link,
#ipr-nav .ipr-submenu > li > a:visited,
#ipr-nav .ipr-submenu > .ipr-sub-item > .ipr-sub-link {
    all:             unset !important;
    font-size:       13px !important;
    font-weight:     500 !important;
    color:           var(--ipr-texto) !important;
    font-family:     inherit !important;
    padding:         9px 20px !important;
    display:         flex !important;
    align-items:     center !important;
    justify-content: space-between !important;
    border-left:     3px solid transparent !important;
    background:      transparent !important;
    white-space:     nowrap !important;
    text-decoration: none !important;
    cursor:          pointer !important;
    transition:      background .15s, color .15s !important;
    width:           100% !important;
    box-sizing:      border-box !important;
}
#ipr-nav .ipr-submenu > li > a:hover,
#ipr-nav .ipr-submenu > li:hover > a,
#ipr-nav .ipr-submenu > .ipr-sub-item > .ipr-sub-link:hover,
#ipr-nav .ipr-submenu > .ipr-sub-item:hover > .ipr-sub-link {
    background:        rgba(214,40,40,0.12) !important;
    color:             var(--ipr-rojo) !important;
    border-left-color: var(--ipr-rojo) !important;
}

.ipr-sub-item { list-style: none; position: relative; }

/* ── Nivel 2 ── */
#ipr-nav .ipr-sub-item > .ipr-submenu-n2 {
    display:       none !important;
    position:      absolute !important;
    top:           0 !important;
    left:          100% !important;
    z-index:       9999 !important;
    background:    var(--ipr-gris-osc) !important;
    border-top:    2px solid var(--ipr-rojo) !important;
    border-radius: 0 10px 10px 10px !important;
    box-shadow:    0 8px 30px rgba(0,0,0,0.5) !important;
    padding:       6px 0 !important;
    min-width:     200px !important;
    list-style:    none !important;
    margin:        0 !important;
}
#ipr-nav .ipr-sub-item:hover > .ipr-submenu-n2 { display: block !important; }

#ipr-nav .ipr-submenu-n2 > li > a,
#ipr-nav .ipr-submenu-n2 > .ipr-sub-item > .ipr-sub-link {
    all:             unset !important;
    font-size:       13px !important;
    font-weight:     400 !important;
    color:           var(--ipr-sub-texto) !important;
    padding:         7px 18px !important;
    display:         flex !important;
    align-items:     center !important;
    border-left:     3px solid transparent !important;
    background:      transparent !important;
    white-space:     nowrap !important;
    text-decoration: none !important;
    cursor:          pointer !important;
    transition:      background .15s, color .15s !important;
    width:           100% !important;
    box-sizing:      border-box !important;
}
#ipr-nav .ipr-submenu-n2 > li > a:hover,
#ipr-nav .ipr-submenu-n2 > .ipr-sub-item > .ipr-sub-link:hover {
    background:        rgba(214,40,40,0.12) !important;
    color:             var(--ipr-rojo) !important;
    border-left-color: var(--ipr-rojo) !important;
}

/* ── Nivel 3 ── */
#ipr-nav .ipr-sub-item > .ipr-submenu-n3 {
    display:       none !important;
    position:      absolute !important;
    top:           0 !important;
    left:          100% !important;
    z-index:       9999 !important;
    background:    var(--ipr-gris-osc) !important;
    border-top:    2px solid var(--ipr-rojo) !important;
    border-radius: 0 10px 10px 10px !important;
    box-shadow:    0 8px 30px rgba(0,0,0,0.5) !important;
    padding:       6px 0 !important;
    min-width:     190px !important;
    list-style:    none !important;
    margin:        0 !important;
}
#ipr-nav .ipr-sub-item:hover > .ipr-submenu-n3 { display: block !important; }

/* ── Dropdown Mi Cuenta / Carrito ── */
.ipr-dropdown {
    display:       none;
    position:      absolute;
    top:           calc(100% + 6px);
    right:         0;
    left:          auto;
    z-index:       9999;
    background:    var(--ipr-gris-osc);
    border-top:    2px solid var(--ipr-rojo);
    border-radius: 0 0 10px 10px;
    box-shadow:    0 8px 30px rgba(0,0,0,0.5);
    padding:       6px 0;
    min-width:     210px;
    list-style:    none;
    margin:        0;
}
.ipr-dropdown a {
    all:             unset;
    display:         flex;
    align-items:     center;
    gap:             10px;
    font-size:       13px;
    font-weight:     400;
    color:           var(--ipr-texto);
    padding:         9px 18px;
    cursor:          pointer;
    transition:      background .15s, color .15s;
    text-decoration: none;
    white-space:     nowrap;
    box-sizing:      border-box;
    width:           100%;
}
.ipr-dropdown a:hover {
    background:      rgba(214,40,40,0.12);
    color:           var(--ipr-rojo);
    text-decoration: none;
}
.ipr-dropdown a i { font-size: 15px; opacity: 0.7; }
.ipr-dropdown-divider {
    height:     1px;
    background: var(--ipr-gris-bor);
    margin:     6px 0;
}
.ipr-dropdown-danger { color: #ff6b6b !important; }
.ipr-dropdown-danger:hover { color: var(--ipr-rojo) !important; }

/* ── Buscador móvil ── */
#ipr-search-mobile {
    display:    none;
    padding:    10px 16px;
    background: var(--ipr-gris-osc);
    border-top: 1px solid var(--ipr-gris-bor);
}
.ipr-search-wrap-m { display: flex; }
#ipr-search-mobile input {
    all:           unset;
    flex:          1;
    height:        40px;
    padding:       0 12px;
    font-size:     14px;
    color:         var(--ipr-blanco);
    background:    var(--ipr-gris-med);
    border:        1.5px solid rgba(255,255,255,0.12);
    border-right:  none;
    border-radius: 8px 0 0 8px;
    box-sizing:    border-box;
}
#ipr-search-mobile input::placeholder { color: var(--ipr-sub-texto); }
#ipr-search-mobile input:focus { border-color: var(--ipr-rojo); outline: none; }
#ipr-search-mobile button {
    all:           unset;
    display:       flex;
    align-items:   center;
    justify-content: center;
    width:         44px;
    height:        40px;
    background:    var(--ipr-rojo);
    border-radius: 0 8px 8px 0;
    cursor:        pointer;
    transition:    background .2s;
}
#ipr-search-mobile button:hover { background: var(--ipr-rojo-osc); }
#ipr-search-mobile button i { color: #fff !important; font-size: 15px; }

/* ── Hamburger ── */
#ipr-hamburger {
    all:        unset;
    display:    none;
    cursor:     pointer;
    padding:    6px 8px;
    color:      var(--ipr-texto);
    font-size:  24px;
    margin-left: auto;
    border-radius: 6px;
    transition: color .2s, background .2s;
}
#ipr-hamburger:hover {
    color:       var(--ipr-rojo);
    background:  rgba(214,40,40,0.1);
}

/* ── Submenú agrupado — título en negrita ── */
#ipr-nav .ipr-submenu > .ipr-sub-item.ipr-has-sub > .ipr-sub-link {
    font-weight:     700 !important;
    color:           var(--ipr-blanco) !important;
    font-size:       12px !important;
    text-transform:  uppercase !important;
    letter-spacing:  0.05em !important;
    padding:         10px 20px 6px 20px !important;
    border-left:     none !important;
    background:      transparent !important;
    cursor:          default !important;
    pointer-events:  none !important;
}
#ipr-nav .ipr-submenu > .ipr-sub-item.ipr-has-sub > .ipr-sub-link .ipr-arrow {
    display: none !important;
}
#ipr-nav .ipr-sub-item.ipr-has-sub > .ipr-submenu-n2 {
    display:    block !important;
    position:   static !important;
    box-shadow: none !important;
    border-top: none !important;
    border-radius: 0 !important;
    padding:    0 0 8px 0 !important;
    min-width:  0 !important;
    margin:     0 !important;
    background: transparent !important;
}
#ipr-nav .ipr-submenu > .ipr-sub-item.ipr-has-sub {
    border-top: 1px solid var(--ipr-gris-bor);
    margin-top: 4px;
}
#ipr-nav .ipr-submenu > .ipr-sub-item.ipr-has-sub:first-child {
    border-top: none;
    margin-top: 0;
}

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media (max-width: 991px) {
    #ipr-topbar       { padding: 8px 16px; gap: 10px; }
    #ipr-search-wrap  { display: none; }
    #ipr-hamburger    { display: block; }
    #ipr-navbar-inner { padding: 0; flex-direction: column; align-items: stretch; }

    #ipr-nav {
        display:        none;
        flex-direction: column;
        width:          100%;
        border-top:     1px solid var(--ipr-gris-bor);
        background:     var(--ipr-gris-osc);
        max-height:     70vh;
        overflow-y:     auto;
    }
    #ipr-nav.open { display: flex; }

    #ipr-nav > li,
    #ipr-nav > .ipr-nav-item { border-bottom: 1px solid var(--ipr-gris-bor); }

    #ipr-nav > li > a,
    #ipr-nav > .ipr-nav-item > a {
        padding:       13px 18px !important;
        text-transform: none !important;
        width:         100% !important;
    }
    #ipr-nav > li > a::after,
    #ipr-nav > .ipr-nav-item > a::after { display: none !important; }

    #ipr-nav > li > .ipr-submenu,
    #ipr-nav > .ipr-nav-item > .ipr-submenu,
    #ipr-nav .ipr-sub-item > .ipr-submenu-n2,
    #ipr-nav .ipr-sub-item > .ipr-submenu-n3 {
        display:       none !important;
        position:      static !important;
        border-top:    none !important;
        border-left:   3px solid var(--ipr-rojo) !important;
        border-radius: 0 !important;
        box-shadow:    none !important;
        margin-left:   16px !important;
        min-width:     0 !important;
        background:    transparent !important;
    }
    #ipr-nav > li.mob-open > .ipr-submenu,
    #ipr-nav > .ipr-nav-item.mob-open > .ipr-submenu,
    #ipr-nav .ipr-sub-item.mob-open > .ipr-submenu-n2,
    #ipr-nav .ipr-sub-item.mob-open > .ipr-submenu-n3 {
        display: block !important;
    }
    #ipr-nav .ipr-submenu > li > a,
    #ipr-nav .ipr-submenu > .ipr-sub-item > .ipr-sub-link {
        padding: 10px 16px !important;
    }
    .ipr-dropdown {
        position:   static !important;
        border-top: none !important;
        border-left: 3px solid var(--ipr-rojo) !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        margin-left: 16px !important;
        background: transparent !important;
    }
}

@media (min-width: 992px) {
    .d-lg-none     { display: none !important; }
    #ipr-hamburger { display: none !important; }
}

