/* =========================================================
   AR CABLES — PRODUCT DETAILS PROFESSIONAL OVERRIDE
   Load AFTER style.css, responsive.css and product-details.css
   ========================================================= */

html{
    overflow-x:hidden;
}

body{
    overflow-x:hidden;
    background:#f6f7f9;
    padding-top:76px;
}

.header{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    height:76px !important;
    min-height:76px !important;
    z-index:999999 !important;
    background:rgba(7,10,14,.98) !important;
    box-shadow:0 8px 30px rgba(0,0,0,.18) !important;
}

.header > .container{
    height:100% !important;
    display:flex !important;
    align-items:center !important;
}

.header .logo img{
    width:58px !important;
    height:58px !important;
    object-fit:contain !important;
}

.mobile-menu-btn{
    display:none !important;
}

/* HERO */
.page-banner{
    position:relative !important;
    isolation:isolate !important;
    overflow:hidden !important;
    min-height:300px !important;
    display:flex !important;
    align-items:center !important;
    background:
        radial-gradient(circle at 82% 40%,rgba(255,91,31,.16),transparent 28%),
        linear-gradient(120deg,#080a0d,#161a20 58%,#0b0e12) !important;
}

.page-banner::before{
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    pointer-events:none !important;
    background:
        linear-gradient(90deg,rgba(0,0,0,.62),transparent 70%),
        repeating-linear-gradient(
            125deg,
            transparent 0,
            transparent 72px,
            rgba(255,255,255,.025) 73px,
            transparent 74px
        ) !important;
}

.page-banner .container{
    position:relative !important;
    z-index:2 !important;
}

.details-eyebrow{
    display:inline-flex !important;
    padding:7px 13px !important;
    border:1px solid rgba(255,98,44,.35) !important;
    border-radius:999px !important;
    background:rgba(255,90,31,.08) !important;
    color:#ff7748 !important;
    font-size:11px !important;
    font-weight:800 !important;
    letter-spacing:2px !important;
}

.page-banner h1{
    margin:13px 0 7px !important;
    text-shadow:0 8px 30px rgba(0,0,0,.35) !important;
}

/* PRODUCT AREA */
.product-details{
    padding:70px 0 80px !important;
}

.product-layout{
    display:grid !important;
    grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr) !important;
    gap:46px !important;
    align-items:start !important;
}

/* IMAGE PANEL */
.product-left{
    position:sticky !important;
    top:98px !important;
}

.main-image{
    position:relative !important;
    min-height:510px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    overflow:hidden !important;
    padding:35px !important;
    border:1px solid #e5e8ed !important;
    border-radius:24px !important;
    background:
        radial-gradient(circle at 50% 48%,rgba(255,255,255,.98),rgba(244,246,248,.98)) !important;
    box-shadow:0 22px 55px rgba(15,23,42,.09) !important;
}

.main-image::after{
    content:"" !important;
    position:absolute !important;
    inset:auto 12% 8% !important;
    height:30px !important;
    border-radius:50% !important;
    background:rgba(0,0,0,.08) !important;
    filter:blur(18px) !important;
}

.main-image img{
    position:relative !important;
    z-index:2 !important;
    max-width:92% !important;
    max-height:430px !important;
    object-fit:contain !important;
    transition:transform .35s ease !important;
}

.main-image:hover img{
    transform:scale(1.035) !important;
}

.image-badge{
    position:absolute !important;
    top:18px !important;
    left:18px !important;
    z-index:4 !important;
    display:inline-flex !important;
    align-items:center !important;
    gap:7px !important;
    padding:8px 11px !important;
    border:1px solid #e5e8ed !important;
    border-radius:999px !important;
    background:rgba(255,255,255,.90) !important;
    color:#343a41 !important;
    font-size:10px !important;
    font-weight:700 !important;
    box-shadow:0 8px 20px rgba(0,0,0,.06) !important;
}

.image-badge i{
    color:#f45b27 !important;
}

.thumb-gallery{
    display:flex !important;
    gap:10px !important;
    margin-top:14px !important;
}

.thumb-wrap{
    width:82px !important;
    height:74px !important;
    padding:7px !important;
    border:1px solid #e2e5e9 !important;
    border-radius:12px !important;
    background:#fff !important;
    cursor:pointer !important;
    transition:.22s ease !important;
}

.thumb-wrap:hover,
.thumb-wrap.active{
    border-color:#ff6631 !important;
    box-shadow:0 7px 18px rgba(255,90,31,.13) !important;
}

.thumb{
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
}

.image-note{
    margin-top:9px !important;
    color:#8a919a !important;
    font-size:10px !important;
}

/* PRODUCT INFO */
.product-right{
    min-width:0 !important;
    padding:28px !important;
    border:1px solid #e5e8ed !important;
    border-radius:22px !important;
    background:#fff !important;
    box-shadow:0 18px 48px rgba(15,23,42,.075) !important;
}

.product-brand{
    display:inline-block !important;
    margin-bottom:10px !important;
    color:#f15b29 !important;
    font-size:11px !important;
    font-weight:800 !important;
    letter-spacing:1.7px !important;
}

.product-right h2{
    margin:0 !important;
    color:#15191e !important;
    font-size:27px !important;
    line-height:1.3 !important;
}

.product-rating{
    display:flex !important;
    align-items:center !important;
    gap:9px !important;
    margin:12px 0 18px !important;
    color:#7a8189 !important;
    font-size:12px !important;
}

.stars{
    color:#f5a623 !important;
    letter-spacing:1px !important;
}

.price-box{
    padding:15px 0 !important;
    border-top:1px solid #edf0f3 !important;
    border-bottom:1px solid #edf0f3 !important;
}

.current-price{
    display:flex !important;
    align-items:center !important;
    flex-wrap:wrap !important;
    gap:10px !important;
}

#productPrice{
    color:#f05a27 !important;
    font-size:29px !important;
    font-weight:800 !important;
}

.discount-badge{
    padding:5px 8px !important;
    border-radius:6px !important;
    background:#fff0eb !important;
    color:#e84f1c !important;
    font-size:9px !important;
    font-weight:800 !important;
}

.old-price{
    margin-top:3px !important;
    color:#989ea5 !important;
    font-size:12px !important;
}

.product-status{
    display:grid !important;
    grid-template-columns:repeat(3,1fr) !important;
    gap:8px !important;
    margin:17px 0 !important;
}

.status-item{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:7px !important;
    min-height:42px !important;
    padding:7px !important;
    border:1px solid #e8ebee !important;
    border-radius:10px !important;
    background:#fafbfc !important;
    color:#4e555d !important;
    font-size:9px !important;
    font-weight:700 !important;
    text-align:center !important;
}

.status-item i{
    color:#f15a27 !important;
}

.details-divider{
    height:1px !important;
    margin:18px 0 !important;
    background:#eceff2 !important;
}

.option-group h4,
.product-right > h4{
    margin:0 0 9px !important;
    color:#22272d !important;
    font-size:12px !important;
    font-weight:800 !important;
}

.colour-box{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
}

.colour{
    position:relative !important;
    width:31px !important;
    height:31px !important;
    padding:0 !important;
    border:2px solid #fff !important;
    border-radius:50% !important;
    box-shadow:0 0 0 1px #d8dce0,0 4px 10px rgba(0,0,0,.10) !important;
    cursor:pointer !important;
}

.colour.active{
    box-shadow:0 0 0 2px #ff6330,0 4px 12px rgba(255,99,48,.22) !important;
}

.colour.red{background:#d52b2b !important}
.colour.black{background:#17191c !important}
.colour.blue{background:#176bd0 !important}
.colour.green{background:#2d9a50 !important}
.colour.yellow{background:#f1c928 !important}
.colour.white{background:#fff !important}

#coilLength{
    width:100% !important;
    height:44px !important;
    padding:0 12px !important;
    border:1px solid #dfe3e7 !important;
    border-radius:10px !important;
    background:#fff !important;
    outline:none !important;
}

.quantity{
    display:grid !important;
    grid-template-columns:44px minmax(70px,1fr) 44px !important;
    max-width:190px !important;
    height:44px !important;
    border:1px solid #dfe3e7 !important;
    border-radius:10px !important;
    overflow:hidden !important;
}

.quantity button{
    border:0 !important;
    background:#f5f6f7 !important;
    color:#20252a !important;
    font-size:18px !important;
    font-weight:700 !important;
    cursor:pointer !important;
}

.quantity input{
    width:100% !important;
    min-width:0 !important;
    border:0 !important;
    border-left:1px solid #e5e8eb !important;
    border-right:1px solid #e5e8eb !important;
    text-align:center !important;
    outline:none !important;
}

#meterInput{
    width:100% !important;
    height:44px !important;
    box-sizing:border-box !important;
    padding:0 12px !important;
    border:1px solid #dfe3e7 !important;
    border-radius:10px !important;
}

/* BUTTONS */
.product-buttons{
    display:grid !important;
    grid-template-columns:repeat(3,1fr) !important;
    gap:9px !important;
    margin-top:22px !important;
}

.product-buttons button{
    min-height:48px !important;
    border:0 !important;
    border-radius:11px !important;
    color:#fff !important;
    font-size:10px !important;
    font-weight:800 !important;
    cursor:pointer !important;
    transition:transform .2s ease,box-shadow .2s ease,filter .2s ease !important;
}

.product-buttons button:hover{
    transform:translateY(-2px) !important;
    filter:brightness(1.04) !important;
}

.buy-now{
    background:linear-gradient(135deg,#15191e,#30363d) !important;
    box-shadow:0 9px 22px rgba(20,24,29,.14) !important;
}

.add-cart{
    background:linear-gradient(135deg,#ff6b35,#ed4d18) !important;
    box-shadow:0 9px 22px rgba(239,79,25,.22) !important;
}

.whatsapp-order{
    background:#20a95b !important;
    box-shadow:0 9px 22px rgba(32,169,91,.18) !important;
}

.trust-badges{
    display:grid !important;
    grid-template-columns:repeat(3,1fr) !important;
    gap:8px !important;
    margin-top:16px !important;
}

.badge{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:6px !important;
    min-height:39px !important;
    padding:6px !important;
    border:1px solid #e8ebee !important;
    border-radius:9px !important;
    background:#fafbfc !important;
    color:#626970 !important;
    font-size:8px !important;
    font-weight:700 !important;
    text-align:center !important;
}

.badge i{
    color:#f15a27 !important;
}

.secure-payment{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:7px !important;
    margin-top:13px !important;
    padding-top:13px !important;
    border-top:1px solid #eceff2 !important;
    color:#7c838b !important;
    font-size:9px !important;
}

.secure-payment i{
    color:#36a15a !important;
}

/* TRUST SECTION */
.customer-trust{
    padding:85px 0 !important;
    background:#fff !important;
}

.trust-heading{
    max-width:650px !important;
    margin:0 auto 35px !important;
    text-align:center !important;
}

.trust-heading > span{
    color:#f15a27 !important;
    font-size:10px !important;
    font-weight:800 !important;
    letter-spacing:2px !important;
}

.trust-heading h2{
    margin:7px 0 !important;
    color:#171b20 !important;
}

.trust-heading p{
    color:#747b83 !important;
}

.trust-grid{
    display:grid !important;
    grid-template-columns:repeat(3,1fr) !important;
    gap:18px !important;
}

.trust-card{
    padding:28px 20px !important;
    border:1px solid #e6e9ed !important;
    border-radius:18px !important;
    background:#fff !important;
    box-shadow:0 12px 32px rgba(15,23,42,.06) !important;
    text-align:center !important;
    transition:.25s ease !important;
}

.trust-card:hover{
    transform:translateY(-5px) !important;
    box-shadow:0 18px 38px rgba(15,23,42,.10) !important;
}

.trust-card > i{
    display:inline-flex !important;
    width:52px !important;
    height:52px !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:14px !important;
    background:#fff0eb !important;
    color:#f15a27 !important;
    font-size:21px !important;
}

.trust-card h3{
    margin:14px 0 7px !important;
    font-size:15px !important;
}

.trust-card p{
    margin:0 !important;
    color:#747b83 !important;
    font-size:11px !important;
    line-height:1.7 !important;
}

/* MOBILE */
@media(max-width:760px){

    body{
        padding-top:66px !important;
    }

    .header{
        height:66px !important;
        min-height:66px !important;
    }

    .header > .container{
        width:calc(100% - 12px) !important;
        height:66px !important;
        min-height:66px !important;
        display:grid !important;
        grid-template-columns:minmax(0,1fr) 40px 40px auto !important;
        align-items:center !important;
        gap:6px !important;
    }

    .header .logo img{
        width:51px !important;
        height:51px !important;
    }

    .mobile-menu-btn{
        display:flex !important;
        width:40px !important;
        height:40px !important;
        min-width:40px !important;
        min-height:40px !important;
        padding:0 !important;
        align-items:center !important;
        justify-content:center !important;
        flex-direction:column !important;
        gap:5px !important;
        border:1px solid rgba(255,255,255,.14) !important;
        border-radius:10px !important;
        background:rgba(255,255,255,.07) !important;
        cursor:pointer !important;
        z-index:1000000 !important;
    }

    .mobile-menu-btn span{
        width:19px !important;
        height:2px !important;
        background:#fff !important;
        border-radius:20px !important;
        transition:.2s ease !important;
    }

    .mobile-menu-btn.is-open span:nth-child(1){
        transform:translateY(7px) rotate(45deg) !important;
    }

    .mobile-menu-btn.is-open span:nth-child(2){
        opacity:0 !important;
    }

    .mobile-menu-btn.is-open span:nth-child(3){
        transform:translateY(-7px) rotate(-45deg) !important;
    }

    .header .header-cart{
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        margin:0 !important;
    }

    .header-cart a{
        position:relative !important;
        width:38px !important;
        height:38px !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        color:#fff !important;
        text-decoration:none !important;
        border-radius:10px !important;
        background:rgba(255,255,255,.07) !important;
    }

    #cartCount{
        position:absolute !important;
        top:-3px !important;
        right:-3px !important;
        min-width:16px !important;
        height:16px !important;
        padding:0 3px !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        border-radius:999px !important;
        background:#ff5a1f !important;
        color:#fff !important;
        font-size:8px !important;
        font-weight:800 !important;
    }

    .header .quote-btn{
        min-width:78px !important;
        width:78px !important;
        height:39px !important;
        min-height:39px !important;
        padding:0 7px !important;
        font-size:9px !important;
        white-space:nowrap !important;
    }

    .header .navbar{
        position:absolute !important;
        top:calc(100% + 8px) !important;
        left:6px !important;
        right:6px !important;
        width:auto !important;
        margin:0 !important;
        padding:8px !important;
        display:block !important;
        visibility:hidden !important;
        opacity:0 !important;
        pointer-events:none !important;
        transform:translateY(-8px) !important;
        border:1px solid rgba(255,255,255,.10) !important;
        border-radius:14px !important;
        background:rgba(7,10,14,.99) !important;
        box-shadow:0 22px 55px rgba(0,0,0,.40) !important;
        transition:.22s ease !important;
        z-index:999999 !important;
    }

    .header .navbar.mobile-open{
        visibility:visible !important;
        opacity:1 !important;
        pointer-events:auto !important;
        transform:translateY(0) !important;
    }

    .header .navbar ul{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:2px !important;
        margin:0 !important;
        padding:0 !important;
    }

    .header .navbar a{
        width:100% !important;
        min-height:42px !important;
        display:flex !important;
        align-items:center !important;
        justify-content:flex-start !important;
        padding:10px 12px !important;
        box-sizing:border-box !important;
        border-radius:8px !important;
    }

    .page-banner{
        min-height:250px !important;
        padding:40px 0 !important;
    }

    .product-details{
        padding:35px 0 55px !important;
    }

    .product-layout{
        grid-template-columns:1fr !important;
        gap:20px !important;
    }

    .product-left{
        position:relative !important;
        top:auto !important;
    }

    .main-image{
        min-height:330px !important;
        padding:25px !important;
        border-radius:18px !important;
    }

    .main-image img{
        max-height:275px !important;
    }

    .image-badge{
        top:12px !important;
        left:12px !important;
        font-size:8px !important;
    }

    .thumb-wrap{
        width:70px !important;
        height:62px !important;
    }

    .product-right{
        padding:19px !important;
        border-radius:18px !important;
    }

    .product-right h2{
        font-size:21px !important;
    }

    #productPrice{
        font-size:24px !important;
    }

    .product-status{
        grid-template-columns:1fr !important;
    }

    .status-item{
        justify-content:flex-start !important;
        padding-left:12px !important;
    }

    .product-buttons{
        grid-template-columns:1fr !important;
        gap:8px !important;
    }

    .product-buttons button{
        min-height:47px !important;
    }

    .trust-badges{
        grid-template-columns:1fr !important;
    }

    .badge{
        justify-content:flex-start !important;
        padding-left:12px !important;
    }

    .customer-trust{
        padding:60px 0 !important;
    }

    .trust-grid{
        grid-template-columns:1fr !important;
        gap:12px !important;
    }

}

@media(max-width:430px){

    body{
        padding-top:62px !important;
    }

    .header{
        height:62px !important;
        min-height:62px !important;
    }

    .header > .container{
        height:62px !important;
        min-height:62px !important;
        width:calc(100% - 8px) !important;
        grid-template-columns:minmax(0,1fr) 38px 38px 74px !important;
        gap:4px !important;
    }

    .header .logo img{
        width:47px !important;
        height:47px !important;
    }

    .mobile-menu-btn{
        width:38px !important;
        height:38px !important;
        min-width:38px !important;
        min-height:38px !important;
    }

    .header-cart a{
        width:36px !important;
        height:36px !important;
    }

    .header .quote-btn{
        width:74px !important;
        min-width:74px !important;
        height:37px !important;
        min-height:37px !important;
        font-size:8px !important;
    }

    .main-image{
        min-height:285px !important;
    }

    .main-image img{
        max-height:235px !important;
    }

    .product-right{
        padding:16px !important;
    }

    .colour{
        width:28px !important;
        height:28px !important;
    }

}


/* =========================================================
   AR CABLES — FINAL MOBILE PRODUCT DETAIL FIX
   Header + product actions only. Desktop remains unchanged.
   ========================================================= */
@media (max-width:760px){
    .header .container{
        width:calc(100% - 16px) !important;
        height:68px !important;
        min-height:68px !important;
        display:grid !important;
        grid-template-columns:minmax(0,1fr) 40px 82px 40px !important;
        gap:6px !important;
        align-items:center !important;
        position:relative !important;
    }

    .header .logo{
        grid-column:1 !important;
        grid-row:1 !important;
        min-width:0 !important;
    }

    .header .logo img{
        width:53px !important;
        height:53px !important;
        object-fit:contain !important;
    }

    .header .navbar{
        grid-column:1 / -1 !important;
        grid-row:2 !important;
    }

    .header .header-cart{
        grid-column:2 !important;
        grid-row:1 !important;
        justify-self:center !important;
        display:flex !important;
        width:40px !important;
        height:40px !important;
        margin:0 !important;
    }

    .header .header-cart a{
        width:40px !important;
        height:40px !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        position:relative !important;
        border-radius:10px !important;
        background:rgba(255,255,255,.07) !important;
    }

    .header #cartCount{
        position:absolute !important;
        top:-4px !important;
        right:-4px !important;
        min-width:16px !important;
        height:16px !important;
        padding:0 3px !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        border-radius:999px !important;
        background:#ff5a1f !important;
        color:#fff !important;
        font-size:8px !important;
        font-weight:800 !important;
        line-height:1 !important;
    }

    .header .quote-btn{
        grid-column:3 !important;
        grid-row:1 !important;
        justify-self:stretch !important;
        width:82px !important;
        min-width:82px !important;
        height:40px !important;
        min-height:40px !important;
        padding:0 7px !important;
        margin:0 !important;
        border-radius:10px !important;
        font-size:9px !important;
        white-space:nowrap !important;
        box-sizing:border-box !important;
    }

    .mobile-menu-btn{
        grid-column:4 !important;
        grid-row:1 !important;
        justify-self:end !important;
        display:flex !important;
        width:40px !important;
        height:40px !important;
        min-width:40px !important;
        min-height:40px !important;
        margin:0 !important;
        padding:0 !important;
        align-items:center !important;
        justify-content:center !important;
        flex-direction:column !important;
        gap:5px !important;
        border:1px solid rgba(255,255,255,.14) !important;
        border-radius:10px !important;
        background:rgba(255,255,255,.07) !important;
        z-index:1000000 !important;
    }

    .mobile-menu-btn span{
        display:block !important;
        width:19px !important;
        height:2px !important;
        margin:0 !important;
        background:#fff !important;
        border-radius:999px !important;
        transition:.2s ease !important;
    }

    .header .navbar{
        top:calc(100% + 8px) !important;
        left:6px !important;
        right:6px !important;
        width:auto !important;
        padding:8px !important;
        border:1px solid rgba(255,255,255,.10) !important;
        border-radius:14px !important;
        background:rgba(7,10,14,.99) !important;
        box-shadow:0 22px 55px rgba(0,0,0,.40) !important;
        visibility:hidden !important;
        opacity:0 !important;
        pointer-events:none !important;
        transform:translateY(-8px) !important;
        z-index:999999 !important;
    }

    /* Product action buttons: no overlap, no clipped Add To Cart. */
    .product-buttons{
        width:100% !important;
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:9px !important;
        margin-top:20px !important;
    }

    .product-buttons button{
        width:100% !important;
        min-width:0 !important;
        min-height:48px !important;
        height:48px !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        gap:8px !important;
        padding:0 14px !important;
        box-sizing:border-box !important;
        overflow:visible !important;
        white-space:nowrap !important;
        font-size:11px !important;
        line-height:1 !important;
    }

    .product-buttons .add-cart{
        order:2 !important;
        visibility:visible !important;
        opacity:1 !important;
    }

    .product-buttons .buy-now{
        order:1 !important;
    }

    .product-buttons .whatsapp-order{
        order:3 !important;
    }

    .product-buttons button i{
        flex:0 0 auto !important;
        margin:0 !important;
    }
}

@media (max-width:430px){
    .header .container{
        width:calc(100% - 12px) !important;
        grid-template-columns:minmax(0,1fr) 38px 76px 38px !important;
        gap:5px !important;
    }

    .header .logo img{
        width:49px !important;
        height:49px !important;
    }

    .header .header-cart,
    .header .header-cart a,
    .mobile-menu-btn{
        width:38px !important;
        height:38px !important;
        min-width:38px !important;
        min-height:38px !important;
    }

    .header .quote-btn{
        width:76px !important;
        min-width:76px !important;
        height:38px !important;
        min-height:38px !important;
        font-size:8.5px !important;
    }

    .product-buttons button{
        min-height:47px !important;
        height:47px !important;
        font-size:10.5px !important;
    }
}

/* ===== Extracted from product-housewire.html — inline style block 1 ===== */
/* =========================================================
   AR CABLES — HOUSE WIRE PAGE
   Premium layout + responsive mobile system
   ========================================================= */

body{
    overflow-x:hidden;
    background:#f7f8fa;
}

.header{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    z-index:99999 !important;
    background:rgba(8,11,15,.97) !important;
    box-shadow:0 8px 28px rgba(0,0,0,.16) !important;
}

body{
    padding-top:76px !important;
}

/* HERO */
.page-banner{
    position:relative !important;
    isolation:isolate !important;
    overflow:hidden !important;
    min-height:340px !important;
    display:flex !important;
    align-items:center !important;
    background:
        radial-gradient(circle at 80% 40%,rgba(255,90,31,.16),transparent 30%),
        linear-gradient(120deg,#080a0d 0%,#12161b 58%,#0a0d11 100%) !important;
}

.page-banner::before{
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    background:
        linear-gradient(90deg,rgba(0,0,0,.62),transparent 68%),
        repeating-linear-gradient(
            125deg,
            transparent 0,
            transparent 70px,
            rgba(255,255,255,.025) 71px,
            transparent 72px
        ) !important;
    pointer-events:none !important;
}

.page-banner h5{
    display:inline-flex !important;
    align-items:center !important;
    gap:8px !important;
    margin-bottom:12px !important;
    padding:7px 12px !important;
    border:1px solid rgba(255,99,45,.30) !important;
    border-radius:999px !important;
    background:rgba(255,90,31,.08) !important;
    color:#ff7847 !important;
    letter-spacing:2px !important;
}

.page-banner h1{
    max-width:800px !important;
    text-shadow:0 8px 30px rgba(0,0,0,.32) !important;
}

.page-banner p{
    max-width:700px !important;
    color:rgba(255,255,255,.75) !important;
}

/* FILTER */
.wire-filter{
    position:relative !important;
    z-index:10 !important;
    margin-top:-38px !important;
    padding:0 0 18px !important;
}

.filter-wrapper{
    display:grid !important;
    grid-template-columns:1.5fr repeat(3,1fr) auto !important;
    gap:12px !important;
    padding:18px !important;
    border:1px solid #e5e8ed !important;
    border-radius:18px !important;
    background:rgba(255,255,255,.96) !important;
    box-shadow:0 18px 45px rgba(15,23,42,.10) !important;
}

.filter-item{
    min-width:0 !important;
}

.filter-item label{
    display:block !important;
    margin-bottom:7px !important;
    color:#59616d !important;
    font-size:11px !important;
    font-weight:700 !important;
}

.filter-item input,
.filter-item select{
    width:100% !important;
    height:44px !important;
    padding:0 12px !important;
    border:1px solid #e1e5ea !important;
    border-radius:10px !important;
    background:#15191e !important;
    color:#fff !important;
    outline:none !important;
    box-sizing:border-box !important;
}

.filter-item input:focus,
.filter-item select:focus{
    border-color:#ff6530 !important;
    box-shadow:0 0 0 3px rgba(255,101,48,.10) !important;
}

.filter-item:last-child{
    display:flex !important;
    align-items:end !important;
}

.filter-btn{
    height:44px !important;
    padding:0 17px !important;
    border:0 !important;
    border-radius:10px !important;
    background:linear-gradient(135deg,#171b20,#30363d) !important;
    color:#fff !important;
    font-weight:700 !important;
    cursor:pointer !important;
    white-space:nowrap !important;
}

/* PRODUCTS */
.building-products{
    padding:78px 0 90px !important;
}

.wire-grid{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:20px !important;
}

.bw-card{
    position:relative !important;
    overflow:hidden !important;
    display:flex !important;
    flex-direction:column !important;
    min-width:0 !important;
    border:1px solid #e7e9ed !important;
    border-radius:18px !important;
    background:#fff !important;
    box-shadow:0 10px 30px rgba(15,23,42,.07) !important;
    transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease !important;
}

.bw-card:hover{
    transform:translateY(-6px) !important;
    border-color:rgba(255,90,31,.25) !important;
    box-shadow:0 18px 42px rgba(15,23,42,.12) !important;
}

.bw-image{
    height:205px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:22px !important;
    background:linear-gradient(180deg,#fafbfc,#f3f5f7) !important;
}

.bw-image img{
    max-width:100% !important;
    max-height:100% !important;
    object-fit:contain !important;
    transition:transform .3s ease !important;
}

.bw-card:hover .bw-image img{
    transform:scale(1.045) !important;
}

.bw-content{
    flex:1 !important;
    display:flex !important;
    flex-direction:column !important;
    padding:17px !important;
}

.bw-rating{
    display:flex !important;
    align-items:center !important;
    gap:2px !important;
    margin-bottom:8px !important;
    font-size:11px !important;
}

.bw-rating span{
    margin-left:5px !important;
    color:#7a818a !important;
}

.bw-content h3{
    min-height:52px !important;
    margin:0 0 10px !important;
    color:#171a1e !important;
    font-size:15px !important;
    line-height:1.45 !important;
}

.bw-price{
    display:flex !important;
    align-items:baseline !important;
    flex-wrap:wrap !important;
    gap:8px !important;
}

.bw-new-price{
    color:#f15a24 !important;
    font-size:16px !important;
    font-weight:800 !important;
}

.bw-old-price{
    color:#999 !important;
    font-size:11px !important;
    text-decoration:line-through !important;
}

.bw-stock{
    display:flex !important;
    align-items:center !important;
    gap:7px !important;
    margin:9px 0 14px !important;
    color:#31834b !important;
    font-size:11px !important;
    font-weight:700 !important;
}

.bw-stock-dot{
    width:7px !important;
    height:7px !important;
    border-radius:50% !important;
    background:#36a65a !important;
    box-shadow:0 0 8px rgba(54,166,90,.35) !important;
}

.bw-buttons{
    display:grid !important;
    grid-template-columns:1fr 44px !important;
    gap:8px !important;
    margin-top:auto !important;
}

.bw-details{
    min-height:42px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:10px !important;
    background:#15191e !important;
    color:#fff !important;
    text-decoration:none !important;
    font-size:11px !important;
    font-weight:700 !important;
    transition:.25s ease !important;
}

.bw-details:hover{
    background:#ff5a1f !important;
    transform:translateY(-2px) !important;
}

.bw-cart{
    min-height:42px !important;
    border:1px solid #e1e4e8 !important;
    border-radius:10px !important;
    background:#fff !important;
    color:#20252b !important;
    cursor:pointer !important;
    transition:.25s ease !important;
}

.bw-cart:hover{
    color:#fff !important;
    border-color:#ff5a1f !important;
    background:#ff5a1f !important;
}

.bw-wishlist{
    position:absolute !important;
    top:12px !important;
    right:12px !important;
    z-index:3 !important;
    width:34px !important;
    height:34px !important;
    border:1px solid rgba(255,255,255,.65) !important;
    border-radius:50% !important;
    background:rgba(255,255,255,.92) !important;
    cursor:pointer !important;
}

/* CERTIFICATIONS */
.certification-grid{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:16px !important;
}

.certificate-card{
    padding:24px 18px !important;
    border:1px solid #e7e9ed !important;
    border-radius:16px !important;
    background:#fff !important;
    box-shadow:0 10px 28px rgba(15,23,42,.06) !important;
}

/* CTA */
.cta-box{
    border-radius:22px !important;
    overflow:hidden !important;
}

/* MOBILE HEADER */
.mobile-menu-btn{
    display:none !important;
}

@media(max-width:760px){

    .header .container{
        height:66px !important;
        min-height:66px !important;
        width:calc(100% - 12px) !important;
        display:grid !important;
        grid-template-columns:minmax(0,1fr) 40px 40px auto !important;
        gap:6px !important;
        align-items:center !important;
    }

    .header .logo img{
        width:52px !important;
        height:52px !important;
        object-fit:contain !important;
    }

    .mobile-menu-btn{
        display:flex !important;
        width:40px !important;
        height:40px !important;
        min-width:40px !important;
        min-height:40px !important;
        padding:0 !important;
        border:1px solid rgba(255,255,255,.14) !important;
        border-radius:10px !important;
        background:rgba(255,255,255,.07) !important;
        flex-direction:column !important;
        align-items:center !important;
        justify-content:center !important;
        gap:5px !important;
        cursor:pointer !important;
        z-index:1000000 !important;
    }

    .mobile-menu-btn span{
        display:block !important;
        width:19px !important;
        height:2px !important;
        background:#fff !important;
        border-radius:10px !important;
        transition:.2s ease !important;
    }

    .header .quote-btn{
        min-width:82px !important;
        height:40px !important;
        min-height:40px !important;
        padding:0 9px !important;
        font-size:9px !important;
        white-space:nowrap !important;
    }

    .header .navbar{
        position:absolute !important;
        top:calc(100% + 8px) !important;
        left:6px !important;
        right:6px !important;
        width:auto !important;
        margin:0 !important;
        padding:8px !important;
        display:block !important;
        visibility:hidden !important;
        opacity:0 !important;
        pointer-events:none !important;
        transform:translateY(-8px) !important;
        border:1px solid rgba(255,255,255,.09) !important;
        border-radius:14px !important;
        background:rgba(8,11,15,.99) !important;
        box-shadow:0 20px 50px rgba(0,0,0,.35) !important;
        transition:.22s ease !important;
    }

    .header .navbar ul{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:2px !important;
    }

    .header .navbar a{
        width:100% !important;
        min-height:42px !important;
        justify-content:flex-start !important;
        padding:10px 12px !important;
        border-radius:8px !important;
        box-sizing:border-box !important;
    }

    /* FILTER MOBILE */
    .wire-filter{
        margin-top:-20px !important;
        padding-bottom:8px !important;
    }

    .filter-wrapper{
        grid-template-columns:1fr 1fr !important;
        gap:10px !important;
        padding:12px !important;
        border-radius:15px !important;
    }

    .filter-item:first-child{
        grid-column:1 / -1 !important;
    }

    .filter-item:last-child{
        grid-column:1 / -1 !important;
    }

    .filter-btn{
        width:100% !important;
    }

    /* PRODUCT GRID */
    .building-products{
        padding:55px 0 65px !important;
    }

    .wire-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:12px !important;
    }

    .bw-image{
        height:155px !important;
        padding:12px !important;
    }

    .bw-content{
        padding:12px !important;
    }

    .bw-content h3{
        min-height:62px !important;
        font-size:12px !important;
    }

    .bw-new-price{
        font-size:13px !important;
    }

    .bw-buttons{
        grid-template-columns:1fr 38px !important;
        gap:6px !important;
    }

    .bw-details,
    .bw-cart{
        min-height:38px !important;
    }

    .certification-grid{
        grid-template-columns:1fr 1fr !important;
        gap:10px !important;
    }

    .certificate-card{
        padding:18px 12px !important;
    }

    .cta-buttons{
        flex-wrap:wrap !important;
    }

}

@media(max-width:430px){

    .header .container{
        height:62px !important;
        min-height:62px !important;
        grid-template-columns:minmax(0,1fr) 38px 76px !important;
    }

    .header .logo img{
        width:48px !important;
        height:48px !important;
    }

    .header .quote-btn{
        min-width:76px !important;
        height:38px !important;
        min-height:38px !important;
        font-size:9px !important;
    }

    .wire-grid{
        grid-template-columns:1fr !important;
        max-width:390px !important;
        margin:0 auto !important;
    }

    .bw-image{
        height:210px !important;
    }

    .bw-content h3{
        min-height:auto !important;
        font-size:14px !important;
    }

    .filter-wrapper{
        grid-template-columns:1fr !important;
    }

    .filter-item:first-child,
    .filter-item:last-child{
        grid-column:auto !important;
    }

    .certification-grid{
        grid-template-columns:1fr !important;
    }

}

/* =========================================================
   SINGLE CORE CART BUTTON — MATCH OTHER CORE PRODUCT CARDS
   ========================================================= */

.wire-grid .bw-buttons{
    display:flex !important;
    align-items:center !important;
    gap:12px !important;
    margin-top:20px !important;
}

.wire-grid .bw-buttons .bw-details{
    flex:1 !important;
    height:52px !important;
    min-height:52px !important;
}

.wire-grid .bw-buttons .bw-cart{
    width:52px !important;
    min-width:52px !important;
    height:52px !important;
    min-height:52px !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex-shrink:0 !important;

    background:#ff5a1f !important;
    border:none !important;
    border-radius:12px !important;
    color:#fff !important;
    opacity:1 !important;
    visibility:visible !important;
    cursor:pointer !important;
}

.wire-grid .bw-buttons .bw-cart:hover{
    background:#ff5a1f !important;
    color:#fff !important;
    border:none !important;
    transform:none !important;
}

.wire-grid .bw-buttons .bw-cart.added{
    background:#ff5a1f !important;
    color:#fff !important;
}

.wire-grid .bw-buttons .bw-cart i{
    color:#fff !important;
    font-size:18px !important;
    margin:0 !important;
}

/* ===== Extracted from product-doublecore.html — inline style block 1 ===== */
/* AR DOUBLE CORE MOBILE BANNER FIX */
.page-banner{
    background-image:url("assets/images/housewire.jpg") !important;
    background-position:center !important;
    background-size:cover !important;
}

/* ===== Extracted from product-fourcore.html — inline style block 1 ===== */
/* AR FOUR CORE MOBILE BANNER FIX */
.page-banner{
    background-image:url("assets/images/housewire.jpg") !important;
    background-position:center !important;
    background-size:cover !important;
}

/* ===== Extracted from product-threecore.html — inline style block 1 ===== */
/* AR THREE CORE MOBILE BANNER FIX */
.page-banner{
    background-image:url("assets/images/housewire.jpg") !important;
    background-position:center !important;
    background-size:cover !important;
}