@font-face {
    font-family: 'Tungsten Compressed Book';
    src: url('../fonts/TungstenCompressed-Book.woff2') format('woff2'), url('../fonts/TungstenCompressed-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Compressed';
    src: url('../fonts/TungstenCompressed-Medium.woff2') format('woff2'), url('../fonts/TungstenCompressed-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Condensed';
    src: url('../fonts/TungstenCondensed-Bold.woff2') format('woff2'), url('../fonts/TungstenCondensed-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Quadon';
    src: url('../fonts/Quadon-Regular.woff2') format('woff2'), url('../fonts/Quadon-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Condensed';
    src: url('../fonts/TungstenCondensed-Medium.woff2') format('woff2'), url('../fonts/TungstenCondensed-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Narrow Book';
    src: url('../fonts/TungstenNarrow-Book.woff2') format('woff2'), url('../fonts/TungstenNarrow-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Narrow';
    src: url('../fonts/TungstenNarrow-Light.woff2') format('woff2'), url('../fonts/TungstenNarrow-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Condensed';
    src: url('../fonts/TungstenCondensed-Black.woff2') format('woff2'), url('../fonts/TungstenCondensed-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Quadon';
    src: url('../fonts/Quadon-Medium.woff2') format('woff2'), url('../fonts/Quadon-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten';
    src: url('../fonts/Tungsten-Bold.woff2') format('woff2'), url('../fonts/Tungsten-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Compressed';
    src: url('../fonts/TungstenCompressed-Bold.woff2') format('woff2'), url('../fonts/TungstenCompressed-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Quadon';
    src: url('../fonts/Quadon-UltraBold.woff2') format('woff2'), url('../fonts/Quadon-UltraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Condensed';
    src: url('../fonts/TungstenCondensed-Semibold.woff2') format('woff2'), url('../fonts/TungstenCondensed-Semibold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Narrow';
    src: url('../fonts/TungstenNarrow-Black.woff2') format('woff2'), url('../fonts/TungstenNarrow-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten';
    src: url('../fonts/Tungsten-Black.woff2') format('woff2'), url('../fonts/Tungsten-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Narrow';
    src: url('../fonts/TungstenNarrow-Medium.woff2') format('woff2'), url('../fonts/TungstenNarrow-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Quadon';
    src: url('../fonts/Quadon-UltraBold.woff2') format('woff2'), url('../fonts/Quadon-UltraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Condensed';
    src: url('../fonts/TungstenCondensed-Light.woff2') format('woff2'), url('../fonts/TungstenCondensed-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Book';
    src: url('../fonts/Tungsten-Book.woff2') format('woff2'), url('../fonts/Tungsten-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Condensed';
    src: url('../fonts/TungstenCondensed-Bold.woff2') format('woff2'), url('../fonts/TungstenCondensed-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten';
    src: url('../fonts/Tungsten-Semibold.woff2') format('woff2'), url('../fonts/Tungsten-Semibold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Compressed';
    src: url('../fonts/TungstenCompressed-Light.woff2') format('woff2'), url('../fonts/TungstenCompressed-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Narrow';
    src: url('../fonts/TungstenNarrow-Semibold.woff2') format('woff2'), url('../fonts/TungstenNarrow-Semibold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Condensed';
    src: url('fonts/TungstenCondensed-Thin.woff2') format('woff2'), url('fonts/TungstenCondensed-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Book';
    src: url('../fonts/Tungsten-Book.woff2') format('woff2'), url('../fonts/Tungsten-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Compressed Semibld';
    src: url('../fonts/TungstenCompressed-Semibld.woff2') format('woff2'), url('../fonts/TungstenCompressed-Semibld.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten';
    src: url('../fonts/Tungsten-Thin.woff2') format('woff2'), url('../fonts/Tungsten-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten';
    src: url('../fonts/Tungsten-Black.woff2') format('woff2'), url('../fonts/Tungsten-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten';
    src: url('../fonts/Tungsten-Bold.woff2') format('woff2'), url('../fonts/Tungsten-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Compressed';
    src: url('../fonts/TungstenCompressed-Thin.woff2') format('woff2'), url('../fonts/TungstenCompressed-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten';
    src: url('../fonts/Tungsten-Medium.woff2') format('woff2'), url('../fonts/Tungsten-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Condensed XLight';
    src: url('../fonts/TungstenCondensed-XLight.woff2') format('woff2'), url('../fonts/TungstenCondensed-XLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Compressed XLight';
    src: url('../fonts/TungstenCompressed-XLight.woff2') format('woff2'), url('../fonts/TungstenCompressed-XLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Narrow';
    src: url('../fonts/TungstenNarrow-Thin.woff2') format('woff2'), url('../fonts/TungstenNarrow-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Narrow Extra';
    src: url('../fonts/TungstenNarrow-ExtraLight.woff2') format('woff2'), url('../fonts/TungstenNarrow-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Compressed';
    src: url('../fonts/TungstenCompressed-Black.woff2') format('woff2'), url('../fonts/TungstenCompressed-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Condensed Book';
    src: url('../fonts/TungstenCondensed-Book.woff2') format('woff2'), url('../fonts/TungstenCondensed-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten';
    src: url('../fonts/Tungsten-Light.woff2') format('woff2'), url('../fonts/Tungsten-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Narrow';
    src: url('../fonts/TungstenNarrow-Bold.woff2') format('woff2'), url('../fonts/TungstenNarrow-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Tungsten Extra';
    src: url('../fonts/Tungsten-ExtraLight.woff2') format('woff2'), url('../fonts/Tungsten-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
}


header {
    background-color: #ff0303 !important;
}

.header-upper {
    border-bottom: none !important; 
}
.header-menu {
    border-bottom: none !important;
    border-top: none !important;
}
.navbar-expand-lg .navbar-nav li {
    border-left: none !important;
    padding: 0 2px !important;
}

.navbar-expand-lg .navbar-nav .nav-link {
    padding: 0 4px !important;
    line-height: 1 !important;
}

#menu a.nav-link {
    font-family: 'Tungsten' !important;
    color: white;
}

ul.dropdown-menu.sub-menusublist.first-level {
    background: #ff0303;
}

.dropdown-men .nav-link:hover {
    background-color: #ff0303 !important;
}

ul.navbar-nav .nav-item a {
    color: white !important;
    font-size: 32px !important;
    text-transform: uppercase;
}

/* Keep top-level menu on one line on laptop / smaller desktops */
@media (min-width: 992px) {
    #menu > .navbar-nav {
        flex-wrap: nowrap !important;
        justify-content: center !important;
        column-gap: 12px !important;
    }

    #menu > .navbar-nav > .nav-item {
        padding: 0 !important;
        margin: 0 !important;
        white-space: nowrap !important;
    }

    #menu > .navbar-nav > .nav-item > .nav-link {
        padding: 0 4px !important;
        font-size: 30px !important;
        white-space: nowrap !important;
    }
}

@media (min-width: 1200px) {
    #menu > .navbar-nav {
        column-gap: 18px !important;
    }

    #menu > .navbar-nav > .nav-item > .nav-link {
        padding: 0 6px !important;
        font-size: 32px !important;
    }
}

.header-links-wrapper {
    padding: 0 !important;
}

nav.header-links a,
.header-links span,
.header-links a {
    line-height: 22px !important;
}

.header-lower {
    padding: 0 !important;
    margin-top: 0 !important;
}

.header-menu {
    padding: 8px 0 0 0 !important;
    margin-top: 10px !important;
    margin-bottom: 0 !important;
}

header,
header .container,
header .header-upper,
header .header-lower {
    overflow: visible !important;
}

.search-box {
    padding: 0 !important;
}

.btn-videos-nav {
    background: #ff0303;
    border: 1px solid #ea1010 !important;
}

.btn-videos-nav {
    background: #ff0303;
    border: 1px solid #ea1010 !important;
}

    .btn-videos-nav:hover {
        background: #ea1010 !important;
    }

.btn-downloads-nav:hover {
    background: #ea1010 !important;
}

nav.header-links a {
    color: white;
}

.search-box .search-box-button:hover {
    background-color: #ea1010 !important;
}

.btn-primary.search-box-button {
    background: #ea1010 !important;
    border: 1px solid #ea1010 !important;
}

a.btn.btn-info.btn-downloads-nav {
    background: #ea1010 !important;
    border: 1px solid #ea1010 !important;
}

.btn-primary.btn-videos-nav {
    border: 1px solid #ea1010 !important;
    background: #ea1010 !important;
}

.search-box .search-box-button:hover {
    background-color: #ea1010 !important;
}

input#small-searchterms {
    background: #ea1010 !important;
    border: 1px solid #ea1010 !important;
    color: darkred !important;
    border-solid: 1px solid #ea1010 !important;
}


#topcartlink {
    background-color: transparent !important;
}

input#small-searchterms::placeholder {
    color: darkred !important;
}

ul.dropdown-menu.sub-menusublist.first-level a {
    font-family: 'Tungsten' !important;
    font-size: 24px !important;
    padding: 6px 18px 6px 18px !important;
    white-space: nowrap !important;
    line-height: 1.2 !important;
}

ul.dropdown-menu.sub-menusublist.first-level li.nav-item.dropdown {
    list-style: none !important;
    list-style-type: none !important;
}


ul.dropdown-menu.sub-menusublist li.nav-item.dropdown {
    list-style: none !important;
list-style-type: none !important;
}

ul.dropdown-menu.sub-menusublist, .dropdown-menu {
    list-style: none !important;
list-style-type: none !important;
}

ul.dropdown-menu.sub-menusublist.first-level li {
   list-style: none !important;
list-style-type: none !important;
}

ul.dropdown-menu.sub-menusublist.first-level a {
   font-family: 'Tungsten' !important;
   font-size: 24px !important;
   padding: 6px 18px 6px 18px !important;
   white-space: nowrap !important;
   line-height: 1.2 !important;
}

.navbar-expand-lg .navbar-nav ul.dropdown-menu {
    list-style-type: none !important;
}

.navbar-expand-lg .navbar-nav ul.dropdown-menu li {
        list-style-type: none !important;
}

.navbar-expand-lg .navbar-nav ul.dropdown-menu {
    list-style-type: none !important;
    padding-left: 0 !important;
}

    .navbar-expand-lg .navbar-nav ul.dropdown-menu li {
        list-style-type: none !important;
        padding-left: 0 !important;
        margin-left: 0 !important;
    }

        .navbar-expand-lg .navbar-nav ul.dropdown-menu li a {
            padding-left: 0 !important;
        }


.sub-header {
    background: black !important;
    padding-top: 20px;
    padding-bottom: 20px;
}

.sub-header .home-page-category-grid .item-box {
    background: black !important;
}

.sub-header img.card-img-top {
    max-height: 220px !important;
    width: auto !important;
}

footer.footer {
    background: red !important;
    border-top: 2px solid white;
}

.footer-block .title strong {
    color: white !important;
}
.navbar-expand-lg .navbar-nav ul.dropdown-menu.sub-menusublist.first-level li a:before {
    content: "";
    position: absolute;
    top: 14px;
    left: 8px;
    width: 5px;
    height: 5px;
    background-color: #ea1010 !important;
}

.navbar-expand-lg .navbar-nav ul.dropdown-menu.sub-menusublist.first-level li a {
    font-family: 'Tungsten' !important;
    font-size: 24px !important;
    padding: 6px 18px 6px 18px !important;
    white-space: nowrap !important;
    line-height: 1.2 !important;
}

.navbar-expand-lg .navbar-nav ul.dropdown-menu.sub-menusublist.first-level li {
    margin-bottom: 2px !important;
}
.navbar-expand-lg .navbar-nav ul.dropdown-menu.sub-menusublist.first-level li:hover > a {
    background-color: #ea1010 !important;
    border-radius: .25rem;
}

.master-wrapper-content {
    background: black !important;
}

.center-1 {
    margin: 0px !important;
}

header {
    background-color: #ff0303 !important;
    border-bottom: 2px solid white;
}

.page-intro-title {
    text-align: center;
    color: white;
}

h2.page-intro-title-light {
    color: white !important;
    font-family: 'Tungsten';
    font-weight: 300;
    font-size: 56px !important;
}

h2.page-intro-title-light {
    color: white !important;
    font-family: 'Tungsten';
    font-weight: 300;
    font-size: 56px !important;
    margin-bottom: 0px !important;
    padding-bottom: 0px;
    line-height: 30px;
}
.category-grid.home-page-category-grid .picture {
    height: auto;
    aspect-ratio: 1 / 1;
    background-position: center center;
    background-color: #111;
    background-size: cover;
    background-position: center;
}

.sub-category-grid .sub-category-item {
    position: relative;
}

.sub-category-grid .sub-category-item > a {
    display: block;
    position: relative;
}

.sub-category-grid .picture {
    height: auto;
    aspect-ratio: 1 / 1;
    background-position: center center;
    background-color: #111;
    background-size: cover;
    background-position: center;
}


/* All category grid overlay titles match home page */
.category-grid h2.title,
.home-page-category-grid h2.title,
.sub-category-grid h2.title,
.category-grid.home-page-category-grid .picture h2.title {
    font-family: 'Tungsten' !important;
    font-weight: 600 !important;
    font-size: 40px !important;
    text-transform: uppercase !important;
    color: white !important;
    text-align: center !important;
    text-shadow: 1px 1px 10px black !important;
}

h2.page-intro-title-heavy {
    font-family: 'Tungsten';
    color: white;
    font-size: 56px;
    font-weight: 700;
}

.footer-lower {
    background: black !important;
    padding: 5px !important;
    border: 0px !important;
}

.footer-upper {
    padding: 10px 0px 0px 0px !important;
    border-bottom: 0px !important;
}

.footer-lower a {
    color: rgb(119,119,119) !important;
}
.footer-upper a.nav-link {
    color: white !important;
    line-height: 10px !important;
}
.footer-upper a.nav-link:hover {
    color: black !important;
    line-height: 10px !important;
}

.page.home-page h3 {
    color: red !important;
    text-align: left !important;
    font-weight: 700 !important;
}

.picture-overlay {
    background: rgba(255,0,0,.5);
    position: absolute;
    top: 0px;
    bottom: 0px;
    z-index: 1;
    height: 280px;
    width: 92%;
    display:none;
}

.home-page-category-grid .category-item {
    position: relative;
}

.home-page-category-grid .category-item > a {
    display: block;
    position: relative;
}

.home-page-category-grid .picture-overlay {
    height: 100%;
    width: 100%;
}

.sub-category-grid .picture-overlay {
    height: 100%;
    width: 100%;
}

.home-page-category-grid h2.title,
.sub-category-grid h2.title {
    position: absolute;
    z-index: 100;
    top: 41%;
    width: 92%;
    margin: 0;
    padding: 0;
}

.home-page-category-grid a:hover .picture-overlay, .sub-category-grid a:hover .picture-overlay {
    display: block;
}

.page-title h1 {
    font-family: 'Tungsten';
    font-weight: 600 !important;
    color: #FFF !important;
    text-transform: uppercase;
    font-size: 54px !important;
}


.sub-category-grid .item-box {
    background: black;
}

.page-title {
    border-bottom: none !important;
}

.form-fields {
    /* background: #111; */
}

.login-page .returning-wrapper .buttons {
    background-color: #111;
    padding: 30px 0;
}

.text {
    background: #111111 !important;
    border: none !important;
}

.login-page .title {
    color: #fff !important;
}

.login-page .returning-wrapper .buttons {
    background-color: #000 !important;
    padding: 30px 0;
}

.registration-page .button-1, .registration-result-page .button-1, .login-page .button-1, .password-recovery-page .button-1, .account-page .button-1, .return-request-page .button-1 { 
    background:red !important;
}



ul.breadcrumb {
    background: black !important;
}

li.breadcrumb-item a:hover {
    color: grey !important;
}

.master-wrapper-page {
    background: black;
}

.page-title {
    min-height: 50px;
    margin: 0 0 25px;
    border-bottom: 0px solid #ddd;
}
 .page-title h1 {
        font-size: 54px !important;
        margin: 0px !important;
}

.page-title {
    min-height: auto !IMPORTANT;
    margin: 0px !important;
    border-bottom: 0px solid #ddd;
    padding: 8px 10px 9px 10px;
}

.product-selectors {
    margin: 0 0 20px;
    border-top: 1px solid #ddd;
    border-bottom: 0px !important;
    padding: 10px 0 !important;
}

.product-filters {
    border-bottom: 1px solid #000 !important;
}

h2.product-title a {
    color: #111820 !important;
}

.product-name.card-header h1 {
    color: white !important;
}

.overview .product-name {
    margin: 0 0 5px !important;
    border-bottom: none !important;
    padding: 0 0 10px;
}

.product-details-page .overview .short-description {
    display: block !important;
    color: #fff !important;
    font-size: 1.35rem !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
    margin-top: 20px !important;
    margin-bottom: 0 !important;
}

/* Top row: gallery | summary — kill legacy float layout */
.product-details-page .product-details-top-row .gallery,
.product-details-page .product-details-top-row .overview {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* Product details top row: white panel, black text */
.product-details-page .product-details-top-row {
    background-color: #fff !important;
    padding: 20px 15px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.product-details-page .product-details-top-row .overview,
.product-details-page .product-details-top-row .product-name,
.product-details-page .product-details-top-row .product-name.card-header,
.product-details-page .product-details-top-row .product-name h1,
.product-details-page .product-details-top-row .short-description,
.product-details-page .product-details-top-row .additional-details,
.product-details-page .product-details-top-row .additional-details .label,
.product-details-page .product-details-top-row .additional-details .value,
.product-details-page .product-details-top-row .sku {
    color: #000 !important;
    background-color: transparent !important;
}

.product-details-page .product-details-top-row .overview .short-description {
    color: #000 !important;
}

.product-details-page .product-details-top-row .product-name.card-header {
    background: transparent !important;
    border: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Keep manufacturer block styling (red link) unchanged */
.product-details-page .product-details-top-row .manufacturers .value a {
    color: red !important;
}

.product-details-page .product-details-top-row .manufacturers .value a:hover {
    color: grey !important;
}

.product-details-page .product-details-summary-col .overview .additional-details {
    margin-top: 16px;
}

/* Full description: own full-width row under gallery + summary */
.product-details-page .product-details-description-row {
    clear: both;
    margin-top: 28px;
    width: 100%;
}

.product-details-page .product-details-description-row > [class*="col-"] {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100%;
}

.product-details-page .product-details-description-row .full-description {
    float: none !important;
    clear: both;
    display: block;
    margin-top: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

.html-product-details-page .tier-prices,
.html-product-details-page .customer-entered-price {
    display: none !important;
}

.product-essential {
    margin: 0px !important;
    border-bottom: 0px !important;
    padding: 0 0 10px;
}


.gallery {
    margin: 0px !important;
}

.product-essential .gallery {
    width: 100% !important;
    text-align: center !important;
}

.product-essential .gallery .picture {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.product-essential .gallery .picture a {
    display: block;
    width: 100%;
}

.product-essential .gallery .picture img {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translate(-50%, -50%) !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
    margin: 0 !important;
}

.gallery .picture:before {
    padding-top: 71% !important;
}

nav.header-links a:hover {
    color: black !important;
}


@media (min-width: 1001px) {
    .gallery, .overview {
        width: 100% !important;
    }
}


.item-box .picture {
    background-color: #111 !important;
}

.form-fields {
    /* background: #111111 !important; */
}

div#eu-cookie-bar-notification {
    background: #111111 !important;
}

.eu-cookie-bar-notification button, .eu-cookie-bar-notification button:hover {
    background-color: red !important;
}

a:hover {
    color: grey !important;
}

a {
    color: red !important;
}

.social ul {
    border: none !important;
}

.footer-block .title {
    margin: 0px !important;
}

.footer-block .title {
    margin: 0px !important;
    font-size: 16px !important;
    font-weight: bold !important;
    margin-bottom: 5px !important;
}

.footer-upper {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

.topic-page .page-body {
    padding-bottom: 20px !important;
}

.product-rating-box {
    display: none !important;
}

.prices {
    display: none !important;
}

a.btn.btn-primary {
    background-color: red !important;
    border-color: darkred !important;
}

a.btn.btn-primary:hover {
    background-color: darkred !important;
}

.item-box .buttons {
    text-align: center !important;
}

.pager li span {
    border-color: transparent;
    background-color: #111111;
    color: #fff;
}
.pager li a:hover {
    border-color: transparent;
    background-color: #333 !important;
    color:white;
}


li.next-page a {
    background-color: #333 !important;
    border-color: #222 !important;
}

.buttons a {
    color: white !important;
}

.pager li span {
    border-color: transparent;
    background-color: #333 !important;
    color: #fff;
}

.pager li a {
    color: #fff !important;
    background: #555;
    border-color: #444;
}

li.current-page span {
    color: black !important;
    background: #222 !important;
}

li.current-page {
    background: #111 !important;
}

ul.nav.navbar-right a {
    color: white !important;
}

a.btn.btn-info.btn-downloads-nav.float-right.d-none.d-md-block {
    color: white !important;
    border: 1px solid red !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    position: relative;
    top: -1px !important;
}

a.btn.btn-primary.btn-videos-nav.float-right.d-none.d-md-block {
    color: white !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    border: 0px !important;
    background: #ea1010 !important;
}

.dropdown-menu {
    min-width: 320px !important;
}

ul.dropdown-menu.sub-menusublist.first-level {
    min-width: 320px !important;
}

ul.dropdown-menu li a span {
    padding-left: 4px !important;
}

.page {
    padding-bottom: 20px !important;
}

.btn-primary:hover, .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle
{
    background-color: red !important;
    border-color: red  !important;
}

.contact-page input, .contact-page textarea {
    background: #333 !important;
    border-color: #222 !important;
    color: white !important;
}

input.button-1.btn.btn-primary.contact-us-button {
    background: red !important;
}

@media (max-width: 768px) {

    /* Adjust page intro title fonts */
    h2.page-intro-title-light {
        font-size: 26px !important;
        line-height: 1.2 !important;
        /* Adjusted line-height to match smaller font */
    }

    h2.page-intro-title-heavy {
        font-size: 28px !important;
        margin-bottom: 10px !important;
    }

    /* Decrease vertical height of header-links items */
    nav.header-links a {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        line-height: 1.2 !important;
    }

    /* Make page-body columns stack vertically */
    .topic-page .page-body .col-4,
    .topic-page .page-body .col-8 {
        -ms-flex: 0 0 100%;
        /* IE 10 */
        flex: 0 0 100%;
        /* Modern browsers */
        max-width: 100%;
        /* Bootstrap override */
        width: 100% !important;
    }

}
nav.header-links .wishlist-link {
    display: none !important;
}
#topcartlink {
    display: none !important;
}
a.ico-wishlist.d-inline-block {
    display: none !important;
}
.html-home-page .theme-custom {
    margin:0px !important;
}
.cash-price-display.cash-price-ver-20251013-02 {
    margin-bottom: 5px !important;
    margin-top: 5px !important;
    padding-bottom: 14px !important;
}
.cash-price-tooltip {
    margin-top: 0px !important;
}

/* Full-width layout with responsive side gutters. */
:root {
    --johnbean-layout-gutter: 32px;
}

.master-wrapper-content,
.master-column-wrapper,
.center-1,
.center-2,
.side-2,
.page,
.theme-custom,
.container,
.container-fluid {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box;
}

@media (min-width: 1001px) {
    .master-wrapper-content.container,
    header > .container,
    footer.footer > .container {
        max-width: 85% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* Home page content sits inside master-wrapper-content — avoid double 85% shrink */
    .html-home-page .sub-header > .container,
    .html-home-page .sub-header .container {
        max-width: 100% !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Category, Cart, and Quotation pages: full-width master-wrapper-content so backgrounds span 100% */
    .html-category-page .master-wrapper-content.container,
    .html-category-page .master-wrapper-content,
    .html-shopping-cart-page .master-wrapper-content.container,
    .html-shopping-cart-page .master-wrapper-content,
    .html-quotation-request-page .master-wrapper-content.container,
    .html-quotation-request-page .master-wrapper-content,
    .html-quotation-confirmation-page .master-wrapper-content.container,
    .html-quotation-confirmation-page .master-wrapper-content {
        max-width: 100% !important;
        width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        background-color: #ffffff !important;
        background: #ffffff !important;
    }
}

/* Category, Cart, and Quotation Pages Full-Width White Background & Layout */
.html-category-page,
.html-category-page body,
.html-category-page .master-wrapper-page,
.html-category-page section,
.html-shopping-cart-page,
.html-shopping-cart-page body,
.html-shopping-cart-page .master-wrapper-page,
.html-shopping-cart-page section,
.html-quotation-request-page,
.html-quotation-request-page body,
.html-quotation-request-page .master-wrapper-page,
.html-quotation-request-page section,
.html-quotation-confirmation-page,
.html-quotation-confirmation-page body,
.html-quotation-confirmation-page .master-wrapper-page,
.html-quotation-confirmation-page section {
    background-color: #ffffff !important;
    background: #ffffff !important;
}

.html-category-page .master-wrapper-content,
.html-shopping-cart-page .master-wrapper-content,
.html-quotation-request-page .master-wrapper-content,
.html-quotation-confirmation-page .master-wrapper-content {
    background-color: #ffffff !important;
    background: #ffffff !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.html-category-page .master-column-wrapper,
.html-category-page .center-1,
.html-shopping-cart-page .master-column-wrapper,
.html-shopping-cart-page .center-1,
.html-shopping-cart-page .page,
.html-shopping-cart-page .page-body,
.html-quotation-request-page .master-column-wrapper,
.html-quotation-request-page .center-1,
.html-quotation-request-page .page,
.html-quotation-request-page .page-body,
.html-quotation-confirmation-page .master-column-wrapper,
.html-quotation-confirmation-page .center-1,
.html-quotation-confirmation-page .page,
.html-quotation-confirmation-page .page-body {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background-color: #ffffff !important;
}

/* Eliminate gap between recommendations and footer */
.html-shopping-cart-page footer.footer {
    border-top: none !important;
    margin-top: 0 !important;
}

.master-wrapper-content,
.header-upper,
.header-lower,
.header-menu,
.footer-upper,
.footer-lower {
    padding-left: var(--johnbean-layout-gutter) !important;
    padding-right: var(--johnbean-layout-gutter) !important;
    box-sizing: border-box;
}

.master-wrapper-content {
    margin-left: auto !important;
    margin-right: auto !important;
}

@media (max-width: 1000px) {
    :root {
        --johnbean-layout-gutter: 24px;
    }

    .header-menu {
        width: 100% !important;
        max-width: none !important;
    }
}

@media (max-width: 768px) {
    :root {
        --johnbean-layout-gutter: 16px;
    }
}

/* Product detail full description */
.product-essential .full-description {
    margin-top: 12px !important;
    padding-top: 0 !important;
    font-size: 18px !important;
    line-height: 1.6 !important;
}

.product-essential .overview {
    margin-bottom: 0 !important;
}

/* Product detail Key Features list styling */
.product-essential .full-description ul.list-group {
    padding-left: 0 !important;
    margin-left: 0 !important;
}

.product-essential .full-description .list-group {
    background-color: #000 !important;
    border: none !important;
    padding-left: 0 !important;
}

.product-essential .full-description .list-group-item {
    background-color: #000 !important;
    color: #fff !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 1px solid #808080 !important;
    padding-left: 12px !important;
}

.product-essential .full-description .list-group-item:first-child {
    border-top: none !important;
}

.product-essential .full-description .list-group-item:last-child {
    border-bottom: none !important;
}

.product-essential .full-description .list-group-item.active,
.product-essential .full-description .list-group-item:hover,
.product-essential .full-description .list-group-item:focus {
    background-color: #000 !important;
    color: #fff !important;
    border-left: none !important;
    border-right: none !important;
    border-top: none !important;
    border-bottom-color: #808080 !important;
}

.product-essential .full-description .list-group-item:last-child.active,
.product-essential .full-description .list-group-item:last-child:hover,
.product-essential .full-description .list-group-item:last-child:focus {
    border-bottom: none !important;
}

/* Sidebar navigation (all two-column pages) */
.side-2 .block .title {
    border-bottom: none !important;
}

.side-2 .block-category-navigation .list,
.side-2 .block-category-navigation .sublist,
.side-2 .block-manufacturer-navigation .list,
.side-2 .block-vendor-navigation .list {
    list-style: none !important;
    padding-left: 0 !important;
    margin: 0 !important;
}

.side-2 .block-category-navigation .list li,
.side-2 .block-category-navigation .sublist li,
.side-2 .block-manufacturer-navigation .list li,
.side-2 .block-vendor-navigation .list li {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.side-2 .block-category-navigation .list a,
.side-2 .block-category-navigation .sublist a,
.side-2 .block-manufacturer-navigation .list a,
.side-2 .block-vendor-navigation .list a {
    display: block !important;
    position: relative;
    padding: 8px 12px !important;
    margin: 0 !important;
    border: none !important;
    background-color: #000 !important;
    color: #fff !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
    text-decoration: none !important;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.side-2 .block-category-navigation .list a:before,
.side-2 .block-category-navigation .sublist a:before,
.side-2 .block-manufacturer-navigation .list a:before,
.side-2 .block-vendor-navigation .list a:before {
    display: none !important;
    content: none !important;
}

.side-2 .block-category-navigation .list > li > a:hover,
.side-2 .block-manufacturer-navigation .list > li > a:hover,
.side-2 .block-vendor-navigation .list > li > a:hover,
.side-2 .block-category-navigation .list > li.active > a,
.side-2 .block-manufacturer-navigation .list > li.active > a,
.side-2 .block-vendor-navigation .list > li.active > a {
    background-color: #ff0303 !important;
    color: #fff !important;
}

.side-2 .block-category-navigation .sublist {
    margin-top: 0 !important;
    padding-left: 16px !important;
}

.side-2 .block-category-navigation .sublist a:hover,
.side-2 .block-category-navigation .sublist li.active > a {
    background-color: #990000 !important;
    color: #fff !important;
}

.side-2 .block-category-navigation .view-all,
.side-2 .block-manufacturer-navigation .view-all,
.side-2 .block-vendor-navigation .view-all,
.side-2 .block-popular-tags .view-all {
    margin: 8px 0 0 !important;
}

.side-2 .block-category-navigation .view-all a,
.side-2 .block-manufacturer-navigation .view-all a,
.side-2 .block-vendor-navigation .view-all a,
.side-2 .block-popular-tags .view-all a {
    display: inline-block !important;
    background-color: #ff0303 !important;
    color: #fff !important;
    font-size: 12px !important;
    padding: 4px 10px !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
}

.side-2 .block-category-navigation .view-all a:hover,
.side-2 .block-manufacturer-navigation .view-all a:hover,
.side-2 .block-vendor-navigation .view-all a:hover,
.side-2 .block-popular-tags .view-all a:hover {
    background-color: #990000 !important;
    color: #fff !important;
    text-decoration: none !important;
}

/* Manufacturer list grid — match category item presentation */
.manufacturer-grid .manufacturer-item {
    position: relative;
}

.manufacturer-grid .manufacturer-item > a {
    display: block;
    position: relative;
}

.manufacturer-grid .picture {
    height: auto;
    aspect-ratio: 1 / 1;
    background-color: #111;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    border: none !important;
}

.manufacturer-grid .picture-overlay {
    height: 100%;
    width: 100%;
}

.manufacturer-grid h2.title {
    display: none;
}

.manufacturer-grid a:hover .picture-overlay {
    display: block;
}

.manufacturer-grid .item-box {
    background: black;
}

@media (max-width: 1000px) {
    .header-menu {
        margin-bottom: 0 !important;
    }

    .product-essential .gallery .picture:before {
        padding-top: 71% !important;
    }

    .product-essential .gallery .picture img {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: 100% !important;
        height: 100% !important;
        max-width: 100% !important;
        max-height: 100% !important;
        object-fit: contain !important;
        object-position: center center !important;
    }
}

/* Mobile footer: stacked menu, always expanded */
@media (max-width: 768px) {
    .footer-upper {
        background: red !important;
    }

    .footer-block {
        background: red !important;
    }

    .footer-block .title,
    .footer-block .social .title {
        background: red !important;
        background-image: none !important;
        color: #fff !important;
        cursor: default !important;
        margin: 0 0 8px !important;
        padding: 10px 15px !important;
    }

    .footer-block .title strong,
    .footer-block .social .title strong {
        color: #fff !important;
    }

    .footer-block .list {
        display: block !important;
        background-color: red !important;
        margin: 0 0 16px !important;
        padding: 0 15px 8px !important;
    }

    .footer-block .list li {
        list-style: none !important;
        padding: 4px 0 !important;
    }

    .footer-block .list a,
    .footer-block .list .nav-link {
        display: block !important;
        color: #fff !important;
        padding: 4px 0 !important;
        line-height: 1.4 !important;
    }

    .footer-block .list a:hover,
    .footer-block .list .nav-link:hover {
        color: #fff !important;
        opacity: 0.85;
    }

    .footer-block.follow-us .social {
        background: red !important;
    }
}

/* Category page layout and controls */
.html-category-page .breadcrumb {
    margin-bottom: 8px !important;
}

.html-category-page .page.category-page .page-title {
    margin-top: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 8px !important;
}

.html-category-page .category-description {
    border-bottom: none !important;
    margin-bottom: 15px !important;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-size: 18px !important;
    line-height: 1.6 !important;
}

.html-category-page .category-description p {
    text-align: center !important;
}

.html-category-page .product-selectors {
    border-top: none !important;
}

.html-category-page .product-selectors .product-span span,
.html-category-page .product-selectors span {
    color: #fff !important;
}

.html-category-page .product-selectors select,
.html-category-page .product-selectors #products-orderby,
.html-category-page .product-selectors #products-pagesize,
.html-category-page .product-selectors .dropdown-filter {
    color: #fff !important;
    border: 1px solid #808080 !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    background: #000 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23ffffff' d='M2 4l4 4 4-4z'/%3E%3C/svg%3E") no-repeat right 10px center / 12px auto !important;
    padding-right: 30px !important;
}

.html-category-page .product-selectors select option {
    background-color: #000;
    color: #fff;
}

/* Manufacturer page sort / page-size selects */
.html-manufacturer-page .product-selectors {
    border-top: none !important;
}

.html-manufacturer-page .product-selectors .product-span span,
.html-manufacturer-page .product-selectors span {
    color: #fff !important;
}

.html-manufacturer-page .product-selectors select,
.html-manufacturer-page .product-selectors #products-orderby,
.html-manufacturer-page .product-selectors #products-pagesize,
.html-manufacturer-page .product-selectors .dropdown-filter {
    color: #fff !important;
    border: 1px solid #fff !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    background: #000 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23ffffff' d='M2 4l4 4 4-4z'/%3E%3C/svg%3E") no-repeat right 10px center / 12px auto !important;
    padding-right: 30px !important;
}

.html-manufacturer-page .product-selectors select option {
    background-color: #000;
    color: #fff;
}

@media (max-width: 768px) {
    .html-category-page .category-description {
        max-width: 100%;
    }
}

/* Body text size */
body {
    font-size: 16px !important;
    line-height: 1.6 !important;
}

input, textarea, select {
    font-size: 16px !important;
}

/* Header logo overlaps top menu; bottom aligns with search row */
header .header-lower .header-logo {
    margin-bottom: 0 !important;
}

header .header-lower .header-logo a img {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    object-fit: contain;
}

@media (min-width: 992px) {
    header .header-lower {
        display: block !important;
    }

    header .header-lower > .row {
        display: flex !important;
        align-items: flex-end;
        width: 100%;
    }

    header .header-upper {
        position: relative;
        z-index: 1;
    }

    header .header-lower .logo {
        display: block !important;
        position: relative;
        top: auto;
        z-index: 10;
        float: none !important;
    }

    header .header-lower .header-logo {
        display: block !important;
        position: relative;
        top: auto;
        margin-top: -55px !important;
        margin-bottom: 0 !important;
        text-align: left;
    }

    header .header-lower .search-box,
    header .header-lower .s-box {
        display: block !important;
        position: relative;
        z-index: 2;
    }

    header .header-lower .header-logo a img {
        width: auto !important;
        height: auto !important;
        max-width: 100% !important;
        max-height: none !important;
        object-fit: contain;
        display: block;
    }

    .navbar ul.navbar-nav > li.nav-item.dropdown > ul.dropdown-menu.sub-menusublist.first-level > li.nav-item.dropdown > ul.dropdown-menu.sub-menusublist.first-level,
    .navbar ul.navbar-nav > li.nav-item.dropdown > ul.dropdown-menu.sub-menusublist.first-level > li.nav-item.dropdown > ul.dropdown-menu.sub-menusublist.first-level > li.nav-item.dropdown > ul.dropdown-menu.sub-menusublist.first-level,
    .navbar ul.navbar-nav > li.nav-item.dropdown > ul.dropdown-menu.sub-menusublist.first-level > li.nav-item.dropdown > ul.dropdown-menu.sub-menusublist.first-level > li.nav-item.dropdown > ul.dropdown-menu.sub-menusublist.first-level > li.nav-item.dropdown > ul.dropdown-menu.sub-menusublist.first-level {
        min-width: 320px !important;
    }
}

/* Home page: flush banner against header */
.html-home-page .master-wrapper-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.html-home-page .sub-header {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.html-home-page .center-1 {
    margin-top: 0 !important;
}

.html-home-page .theme-custom {
    margin-top: 0 !important;
}

.html-home-page section {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* Home page category grid: 3 items per row on desktop */
@media (min-width: 992px) {
    .home-page-category-grid .item-grid > .row {
        justify-content: flex-start;
    }

    .home-page-category-grid .item-box {
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
}

/* Footer: black Facebook icon with Phosphor/FontAwesome icon */
.follow-us .social .facebook a {
    background: #000000 !important;
    background-image: none !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    color: #ffffff !important;
    font-size: 20px !important;
    line-height: 1 !important;
    text-decoration: none !important;
    filter: none !important;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.follow-us .social .facebook a:hover {
    opacity: 0.85;
    color: #ffffff !important;
    text-decoration: none !important;
}

.follow-us .social .facebook a i {
    font-size: 20px !important;
    color: #ffffff !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    vertical-align: middle !important;
}

/* ==========================================================================
   Category Page - Dark Hero Section (Full Viewport Width)
   ========================================================================== */

.html-category-page section {
    background-color: #ffffff !important;
    background: #ffffff !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.html-category-page .master-wrapper-content.container,
.html-category-page .master-wrapper-content {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background-color: #ffffff !important;
    background: #ffffff !important;
}

.html-category-page .master-column-wrapper,
.html-category-page .center-1 {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background-color: #ffffff !important;
    background: #ffffff !important;
}

.html-category-page .jb-category-wrapper {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background-color: #ffffff !important;
    background: #ffffff !important;
}

.jb-category-hero {
    background-color: #151b1f !important;
    background: #151b1f !important;
    color: #ffffff !important;
    padding: 24px 0 36px 0 !important;
    width: 100% !important;
    position: relative !important;
    left: 0 !important;
    right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

@media (min-width: 1001px) {
    .html-category-page .jb-category-hero .container,
    .html-category-page .jb-category-hero .jb-container,
    .html-category-page .jb-category-hero__inner,
    .html-category-page .jb-catalog-content .container,
    .html-category-page .jb-catalog-content .jb-container {
        max-width: 85% !important;
        width: 85% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box !important;
    }
}

@media (max-width: 1000px) {
    .html-category-page .jb-category-hero .container,
    .html-category-page .jb-category-hero .jb-container,
    .html-category-page .jb-category-hero__inner,
    .html-category-page .jb-catalog-content .container,
    .html-category-page .jb-catalog-content .jb-container {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
        box-sizing: border-box !important;
    }
}

.jb-category-hero .jb-breadcrumb {
    margin-bottom: 24px !important;
    font-size: 13px !important;
    color: #c3c8cd !important;
    line-height: 1.4 !important;
}

.jb-category-hero .jb-breadcrumb a {
    color: var(--jb-red, #ff0912) !important;
    text-decoration: none !important;
}

.jb-category-hero .jb-breadcrumb a:hover {
    text-decoration: underline !important;
}

.jb-category-hero .jb-breadcrumb .delimiter {
    margin: 0 8px !important;
    color: #67727e !important;
}

.jb-category-hero .jb-breadcrumb .current-item {
    color: #d0d5da !important;
    font-weight: normal !important;
}

.jb-category-hero h1,
.jb-category-hero .jb-category-title {
    font-size: 38px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    line-height: 1.15 !important;
    margin: 0 0 10px 0 !important;
}

@media (max-width: 991px) {
    .jb-category-hero h1,
    .jb-category-hero .jb-category-title {
        font-size: 34px !important;
    }
}

@media (max-width: 576px) {
    .jb-category-hero h1,
    .jb-category-hero .jb-category-title {
        font-size: 30px !important;
    }
}

.jb-category-hero__description,
.jb-category-hero .jb-category-description {
    font-size: 16px !important;
    line-height: 1.5 !important;
    color: #d0d5da !important;
    max-width: 950px !important;
    margin-bottom: 0 !important;
    text-align: left !important;
}

@media (max-width: 576px) {
    .jb-category-hero__description,
    .jb-category-hero .jb-category-description {
        font-size: 15px !important;
    }
}

.jb-category-hero__description p,
.jb-category-hero .jb-category-description p {
    margin: 0 0 10px 0;
    line-height: 1.5;
    color: #d0d5da;
}

.jb-category-hero__description p:last-child,
.jb-category-hero .jb-category-description p:last-child {
    margin-bottom: 0;
}

.jb-category-hero__description a,
.jb-category-hero .jb-category-description a {
    color: var(--jb-red, #ff0912) !important;
    text-decoration: underline !important;
    font-weight: 600;
}

.jb-category-hero__description a:hover,
.jb-category-hero .jb-category-description a:hover {
    color: #ffffff !important;
    text-decoration: underline !important;
}

.jb-category-hero__description strong,
.jb-category-hero__description b,
.jb-category-hero .jb-category-description strong,
.jb-category-hero .jb-category-description b {
    color: #ffffff !important;
    font-weight: 700;
}

/* White Product Listing Section */
.jb-catalog-content {
    background-color: #ffffff !important;
    background: #ffffff !important;
    width: 100% !important;
    padding: 0 0 50px 0 !important;
    box-sizing: border-box !important;
}

/* ==========================================================================
   Parent Category - White Subcategories Section & Cards
   ========================================================================== */

.jb-subcategories {
    background-color: #ffffff;
    padding: 32px 0 24px 0;
    width: 100%;
    box-sizing: border-box;
}

.jb-subcategories__header {
    margin-bottom: 24px;
}

.jb-subcategories__heading {
    font-size: 28px;
    font-weight: 700;
    color: #171b20;
    line-height: 1.2;
    margin: 0 0 6px 0;
}

@media (max-width: 768px) {
    .jb-subcategories__heading {
        font-size: 24px;
    }
}

.jb-subcategories__subtitle {
    font-size: 16px;
    color: #67727e;
    margin: 0;
    line-height: 1.45;
}

@media (max-width: 768px) {
    .jb-subcategories__subtitle {
        font-size: 15px;
    }
}

/* 3-Column Responsive Grid with Equal Height Cards */
.jb-subcategories__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-bottom: 24px;
}

@media (max-width: 991px) {
    .jb-subcategories__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
}

@media (max-width: 600px) {
    .jb-subcategories__grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

/* Subcategory Card */
.jb-subcategory-card-wrap {
    display: flex;
    height: 100%;
}

.jb-subcategory-card {
    background: #ffffff;
    border: 1px solid #dee4ea;
    border-radius: 6px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    text-decoration: none !important;
    color: inherit;
    box-sizing: border-box;
    position: relative;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

@media (max-width: 991px) {
    .jb-subcategory-card {
        padding: 20px;
    }
}

@media (max-width: 600px) {
    .jb-subcategory-card {
        padding: 18px;
    }
}

.jb-subcategory-card:hover {
    border-color: #c2ccd6;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
    transform: translateY(-2px);
    text-decoration: none !important;
    color: inherit;
}

/* Card Image Area */
.jb-subcategory-card__image-wrap {
    height: 280px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    overflow: hidden;
    background: transparent;
    padding: 10px;
    box-sizing: border-box;
}

@media (max-width: 991px) {
    .jb-subcategory-card__image-wrap {
        height: 250px;
    }
}

@media (max-width: 600px) {
    .jb-subcategory-card__image-wrap {
        height: 220px;
    }
}

.jb-subcategory-card__image {
    max-height: 100%;
    max-width: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
    margin: 0 auto;
    transition: transform 0.2s ease;
}

/* Product Card Picture Container (Subcategory Product Grid) */
.jb-product-card .card-picture-container {
    height: 280px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    overflow: hidden;
    position: relative;
    background: transparent;
    padding: 10px;
    box-sizing: border-box;
}

@media (max-width: 991px) {
    .jb-product-card .card-picture-container {
        height: 250px;
    }
}

@media (max-width: 600px) {
    .jb-product-card .card-picture-container {
        height: 220px;
    }
}

.jb-product-card .card-picture-container a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    max-height: 100% !important;
    max-width: 100% !important;
    position: relative !important;
    overflow: hidden !important;
    text-decoration: none !important;
}

.jb-product-card .card-picture-container a:before,
.jb-product-card .card-picture-container.picture a:before,
.item-box .card-picture-container.picture a:before,
.product-item .card-picture-container.picture a:before {
    display: none !important;
    content: none !important;
    padding-top: 0 !important;
    height: 0 !important;
    width: 0 !important;
}

.jb-product-card .card-picture-container img,
.jb-product-card .card-picture-container a img,
.item-box .card-picture-container.picture a img,
.product-item .card-picture-container.picture a img {
    max-height: 100% !important;
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    position: static !important;
    margin: 0 auto !important;
    display: block !important;
    transition: transform 0.2s ease;
}

.jb-product-card:hover .card-picture-container img,
.jb-product-card:hover .card-picture-container a img {
    transform: scale(1.02);
}

/* Do not enlarge the product image significantly on hover */
.jb-subcategory-card:hover .jb-subcategory-card__image {
    transform: scale(1.015);
}

/* Card Body */
.jb-subcategory-card__body {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.jb-subcategory-card__title {
    font-size: 20px;
    font-weight: 700;
    color: #171b20;
    line-height: 1.25;
    margin: 0 0 10px 0;
    transition: color 0.2s ease;
}

.jb-subcategory-card:hover .jb-subcategory-card__title {
    color: var(--jb-red, #ff0912);
}

.jb-subcategory-card__description {
    font-size: 15px;
    line-height: 1.45;
    color: #67727e;
    margin: 0 0 20px 0;
    flex-grow: 1;
}

/* View Category Button */
.jb-subcategory-card__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 46px;
    min-height: 46px;
    padding: 0 24px;
    background-color: var(--jb-red, #ff0912);
    color: #ffffff !important;
    font-size: 15px;
    font-weight: 600;
    border-radius: 6px;
    width: fit-content;
    align-self: flex-start;
    margin-top: auto;
    border: none;
    cursor: pointer;
    text-decoration: none !important;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
    box-sizing: border-box;
}

.jb-subcategory-card__button i {
    font-size: 14px;
    color: #ffffff;
    transition: transform 0.2s ease;
}

.jb-subcategory-card:hover .jb-subcategory-card__button {
    background-color: #d80008;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(255, 9, 18, 0.25);
}

.jb-subcategory-card:hover .jb-subcategory-card__button i {
    transform: translateX(3px);
}

@media (max-width: 600px) {
    .jb-subcategory-card__button {
        width: 100%;
        align-self: stretch;
    }
}

/* Pale-Blue Information Notice */
.jb-subcategories__notice {
    background-color: #ebf3f8;
    border: 1px solid #d2e4f0;
    border-radius: 6px;
    padding: 14px 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #2c3e50;
    font-size: 14px;
    line-height: 1.4;
    margin-top: 24px;
}

.jb-subcategories__notice i {
    font-size: 18px;
    color: #1f567a;
    flex-shrink: 0;
}

/* ==========================================================================
   Product Details Page - Full-Width Edge-to-Edge White Hero & Dark Features (85% Boxed Content)
   ========================================================================== */
.html-product-details-page section {
    background-color: transparent !important;
    background: transparent !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

.html-product-details-page section > div,
.html-product-details-page .master-wrapper-content.container,
.html-product-details-page .master-wrapper-content,
.html-product-details-page .master-column-wrapper,
.html-product-details-page .center-1,
.html-product-details-page .center-2,
.html-product-details-page .page,
.html-product-details-page .page-body,
.html-product-details-page .jb-product-details-wrapper {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background-color: transparent !important;
    background: transparent !important;
}

/* White Hero Section: 100% Full-Width Edge-to-Edge */
.jb-product-details-hero {
    background-color: #ffffff !important;
    background: #ffffff !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 24px 0 50px 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* White Hero Inner Content: Centered at 85% */
@media (min-width: 1001px) {
    .jb-product-details-hero > .container,
    .jb-product-details-hero > .jb-container,
    .jb-product-details-hero .jb-container {
        max-width: 85% !important;
        width: 85% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box !important;
    }
}

@media (max-width: 1000px) {
    .jb-product-details-hero > .container,
    .jb-product-details-hero > .jb-container,
    .jb-product-details-hero .jb-container {
        max-width: 100% !important;
        width: 100% !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
        box-sizing: border-box !important;
    }
}

/* Dark PDP Details Section: 100% Full-Width Edge-to-Edge Dark Background */
.jb-pdp-dark-details {
    background-color: var(--jb-header-dark, #11161b) !important;
    background: var(--jb-header-dark, #11161b) !important;
    color: #ffffff !important;
    padding: 50px 0 60px 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* Key Features Inner Content: Centered at 85% */
@media (min-width: 1001px) {
    .jb-pdp-dark-details > .container,
    .jb-pdp-dark-details > .jb-container,
    .jb-pdp-dark-details .jb-container {
        max-width: 85% !important;
        width: 85% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box !important;
    }
}

@media (max-width: 1000px) {
    .jb-pdp-dark-details > .container,
    .jb-pdp-dark-details > .jb-container,
    .jb-pdp-dark-details .jb-container {
        max-width: 100% !important;
        width: 100% !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
        box-sizing: border-box !important;
    }
}

/* ==========================================================================
   Contact Page - JohnBean Hero & Modern Form Styling
   ========================================================================== */

/* Full Viewport Width Reset for Contact Page */
#contact-page .master-wrapper-page > section,
.html-contact-page .master-wrapper-page > section,
body:has(.contact-form-page) .master-wrapper-page > section,
body:has(.jb-contact-page) .master-wrapper-page > section,
body:has(.johnbean-contact-page) .master-wrapper-page > section {
    background-color: transparent !important;
    background: transparent !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

#contact-page section > div,
.html-contact-page section > div,
body:has(.contact-form-page) section > div,
body:has(.jb-contact-page) section > div,
#contact-page .master-wrapper-content,
.html-contact-page .master-wrapper-content,
body:has(.contact-form-page) .master-wrapper-content,
body:has(.jb-contact-page) .master-wrapper-content,
#contact-page .master-column-wrapper,
.html-contact-page .master-column-wrapper,
body:has(.contact-form-page) .master-column-wrapper,
body:has(.jb-contact-page) .master-column-wrapper,
#contact-page .center-1,
.html-contact-page .center-1,
body:has(.contact-form-page) .center-1,
body:has(.jb-contact-page) .center-1 {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background-color: transparent !important;
    background: transparent !important;
}

/* Dark Contact Hero Section */
.jb-contact-hero {
    background-color: #171c20 !important;
    background: #171c20 !important;
    background-image: none !important;
    color: #ffffff !important;
    padding: 28px 0 36px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.jb-contact-hero__inner {
    max-width: 1240px !important;
    margin: 0 auto !important;
    padding: 0 24px !important;
    box-sizing: border-box !important;
}

/* Heading */
.jb-contact-title {
    font-family: 'Tungsten', 'Tungsten Condensed', 'Arial Narrow', sans-serif !important;
    font-size: 42px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    color: #ffffff !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin: 0 0 12px !important;
}

.jb-contact-title::after {
    content: "" !important;
    display: block !important;
    width: 48px !important;
    height: 4px !important;
    background: #ff0a12 !important;
    margin-top: 14px !important;
}

/* Contact Information Layout (2 columns, 2 rows) */
.jb-contact-info {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 60px !important;
    row-gap: 30px !important;
    margin-top: 24px !important;
}

.jb-contact-info__item {
    color: #d0d5da !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
}

.jb-contact-info__name {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    margin-bottom: 6px !important;
    line-height: 1.4 !important;
}

.jb-contact-info__address {
    font-size: 15px !important;
    line-height: 1.5 !important;
    color: #d0d5da !important;
    margin-bottom: 4px !important;
}

.jb-contact-info__detail {
    font-size: 15px !important;
    line-height: 1.5 !important;
    color: #d0d5da !important;
    margin-bottom: 2px !important;
}

.jb-contact-info__detail strong {
    font-weight: 700 !important;
    color: #ffffff !important;
    margin-right: 4px !important;
}

.jb-contact-info__detail span {
    color: #d0d5da !important;
}

.jb-contact-info__detail a {
    color: #d0d5da !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.jb-contact-info__detail a:hover {
    color: #ff0a12 !important;
    text-decoration: underline !important;
}

/* White Contact Form Section */
.jb-contact-section {
    background-color: #ffffff !important;
    background: #ffffff !important;
    padding: 24px 0 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.jb-contact-section__inner {
    max-width: 1240px !important;
    margin: 0 auto !important;
    padding: 0 24px !important;
    box-sizing: border-box !important;
}

/* Form Container Card */
.jb-contact-form,
#contact-page .contact-form,
.contact-form-page .contact-form {
    background: #ffffff !important;
    border: 1px solid #dde3e9 !important;
    border-radius: 6px !important;
    padding: 26px 30px 16px !important;
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    box-shadow: none !important;
}

/* Form Transparent Background Reset */
.jb-contact-form .fieldset,
#contact-page .fieldset,
.contact-form-page .fieldset,
.jb-contact-form .form-fields,
.jb-contact-form__grid,
#contact-page .form-fields,
.contact-form-page .form-fields,
.jb-contact-form .inputs,
#contact-page .inputs,
.contact-form-page .inputs {
    background: transparent !important;
    background-color: transparent !important;
}

/* Form Grid */
.jb-contact-form__grid,
#contact-page .form-fields,
.contact-form-page .form-fields {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 20px !important;
    row-gap: 16px !important;
}

.jb-contact-form__field,
#contact-page .inputs,
.contact-form-page .inputs {
    display: flex !important;
    flex-direction: column !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    position: relative !important;
}

.jb-contact-form__field--full {
    grid-column: 1 / -1 !important;
}

/* Labels */
.jb-contact-form label,
#contact-page .contact-form label,
.contact-form-page .contact-form label {
    display: block !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1b2025 !important;
    margin-bottom: 6px !important;
    text-align: left !important;
}

/* Required Indicator in JohnBean Red */
.jb-contact-form label.required-label::after,
.jb-contact-form .required-label::after,
#contact-page label.required-label::after,
.contact-form-page label.required-label::after,
.jb-contact-form nop-required,
.jb-contact-form .required-star {
    content: " *" !important;
    color: #ff0a12 !important;
    font-weight: 700 !important;
}

/* Form Controls */
.jb-contact-form input[type="text"],
.jb-contact-form input[type="email"],
.jb-contact-form input[type="tel"],
.jb-contact-form select,
.jb-contact-form textarea,
#contact-page .contact-form input,
#contact-page .contact-form select,
#contact-page .contact-form textarea,
.contact-form-page .contact-form input,
.contact-form-page .contact-form select,
.contact-form-page .contact-form textarea {
    width: 100% !important;
    border: 1px solid #ccd4dc !important;
    border-radius: 4px !important;
    background: #ffffff !important;
    color: #171c20 !important;
    font-size: 15px !important;
    padding: 10px 12px !important;
    box-sizing: border-box !important;
    box-shadow: none !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.jb-contact-form input[type="text"],
.jb-contact-form input[type="email"],
.jb-contact-form input[type="tel"],
.jb-contact-form select,
#contact-page .contact-form input,
#contact-page .contact-form select,
.contact-form-page .contact-form input,
.contact-form-page .contact-form select {
    min-height: 42px !important;
    height: 42px !important;
}

/* Dropdown styling */
.jb-contact-form select,
#contact-page .contact-form select,
.contact-form-page .contact-form select {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23171c20' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: 16px 16px !important;
    padding-right: 36px !important;
    cursor: pointer !important;
}

/* Textarea styling */
.jb-contact-form textarea,
#contact-page .contact-form textarea,
.contact-form-page .contact-form textarea {
    min-height: 95px !important;
    line-height: 1.5 !important;
    resize: vertical !important;
}

/* Placeholder */
.jb-contact-form input::placeholder,
.jb-contact-form textarea::placeholder,
#contact-page .contact-form input::placeholder,
#contact-page .contact-form textarea::placeholder,
.contact-form-page .contact-form input::placeholder,
.contact-form-page .contact-form textarea::placeholder {
    color: #7a8590 !important;
    opacity: 1 !important;
}

/* Focus state */
.jb-contact-form input:focus,
.jb-contact-form select:focus,
.jb-contact-form textarea:focus,
#contact-page .contact-form input:focus,
#contact-page .contact-form select:focus,
#contact-page .contact-form textarea:focus,
.contact-form-page .contact-form input:focus,
.contact-form-page .contact-form select:focus,
.contact-form-page .contact-form textarea:focus {
    outline: none !important;
    border-color: #ff0a12 !important;
    box-shadow: 0 0 0 3px rgba(255, 10, 18, 0.08) !important;
}

/* Validation */
.jb-contact-form input.input-validation-error,
.jb-contact-form select.input-validation-error,
.jb-contact-form textarea.input-validation-error,
#contact-page .contact-form input.input-validation-error,
#contact-page .contact-form select.input-validation-error,
#contact-page .contact-form textarea.input-validation-error {
    border-color: #ff0a12 !important;
}

.jb-contact-form .field-validation-error,
#contact-page .contact-form .field-validation-error,
.contact-form-page .contact-form .field-validation-error {
    color: #ff0a12 !important;
    font-size: 13px !important;
    margin-top: 4px !important;
    display: block !important;
    text-align: left !important;
}

/* Send Button */
.jb-contact-form__actions,
#contact-page .contact-form .buttons,
.contact-form-page .contact-form .buttons {
    display: flex !important;
    justify-content: flex-end !important;
    margin-top: 12px !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    width: 100% !important;
}

.jb-contact-form__submit,
#contact-page .contact-form #submitButton,
#contact-page .contact-form .contact-us-button,
.contact-form-page .contact-form #submitButton,
.contact-form-page .contact-form .contact-us-button {
    background-color: #ff0a12 !important;
    background: #ff0a12 !important;
    color: #ffffff !important;
    border: 1px solid #ff0a12 !important;
    border-radius: 4px !important;
    min-width: 100px !important;
    height: 42px !important;
    padding: 0 24px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: background 0.2s ease, border-color 0.2s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    box-shadow: none !important;
    float: none !important;
}

.jb-contact-form__submit:hover,
#contact-page .contact-form #submitButton:hover,
#contact-page .contact-form .contact-us-button:hover,
.contact-form-page .contact-form #submitButton:hover,
.contact-form-page .contact-form .contact-us-button:hover {
    background-color: #cf0810 !important;
    background: #cf0810 !important;
    border-color: #cf0810 !important;
    color: #ffffff !important;
}

.jb-contact-form__submit:disabled,
#contact-page .contact-form #submitButton:disabled,
.contact-form-page .contact-form #submitButton:disabled {
    background-color: #6c757d !important;
    background: #6c757d !important;
    border-color: #6c757d !important;
    cursor: not-allowed !important;
}

/* Fallback styling for unenhanced plugin output */
.contact-form-page:not(.jb-contact-page) {
    background: #171c20 !important;
    color: #ffffff !important;
    padding: 28px 0 36px !important;
}

.contact-form-page:not(.jb-contact-page) .page-title h1 {
    font-family: 'Tungsten', 'Tungsten Condensed', sans-serif !important;
    font-size: 42px !important;
    color: #ffffff !important;
    text-transform: uppercase !important;
}

.contact-form-page:not(.jb-contact-page) table {
    width: 100% !important;
    max-width: 1240px !important;
    margin: 20px auto !important;
    border-collapse: collapse !important;
}

.contact-form-page:not(.jb-contact-page) table td {
    color: #d0d5da !important;
    padding: 6px 12px !important;
}

.contact-form-page:not(.jb-contact-page) table strong {
    color: #ffffff !important;
}

/* Responsive adjustments */
@media (max-width: 767px) {
    .jb-contact-title,
    .contact-form-page .page-title h1 {
        font-size: 32px !important;
    }

    .jb-contact-info,
    .jb-contact-form__grid,
    #contact-page .form-fields,
    .contact-form-page .form-fields {
        grid-template-columns: 1fr !important;
    }

    .jb-contact-hero__inner {
        padding: 0 16px !important;
    }

    .jb-contact-section__inner {
        padding: 0 16px !important;
    }

    .jb-contact-form,
    #contact-page .contact-form,
    .contact-form-page .contact-form {
        padding: 20px 16px !important;
    }
}

/* ==========================================================================
   Authorised Dealers Page - Edge-to-Edge Breakout & Directory Styling
   ========================================================================== */

/* Ensure nopCommerce wrapper doesn't restrict full-width sections */
body.html-dealers-page > .master-wrapper-page > section,
body:has(.jb-dealers-page) > .master-wrapper-page > section,
.html-dealers-page .master-wrapper-page > section,
body:has(.jb-dealers-page) .master-wrapper-page > section {
    background-color: transparent !important;
    background: transparent !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

.html-dealers-page .master-wrapper-page > section > div,
body:has(.jb-dealers-page) .master-wrapper-page > section > div,
.html-dealers-page .master-wrapper-content.container,
.html-dealers-page .master-wrapper-content,
body:has(.jb-dealers-page) .master-wrapper-content,
.html-dealers-page .master-column-wrapper,
body:has(.jb-dealers-page) .master-column-wrapper,
.html-dealers-page .center-1,
body:has(.jb-dealers-page) .center-1,
.html-dealers-page .page,
body:has(.jb-dealers-page) .page,
.html-dealers-page .page-body,
body:has(.jb-dealers-page) .page-body {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
}

/* Hide redundant standard nopCommerce topic title */
.html-dealers-page #ph-title,
body:has(.jb-dealers-page) #ph-title,
.page:has(.jb-dealers-page) > .page-title {
    display: none !important;
}

/* Main Dealers Page Wrapper */
.jb-dealers-page {
    --jb-red: #ff0000;
    --jb-red-hover: #d80000;
    --jb-dark-band: #1b1d21;
    --jb-white: #ffffff;
    --jb-soft-grey: #f4f5f6;
    --jb-charcoal: #1b1d21;
    --jb-text-muted: #6b7079;
    --jb-border-normal-top: #8b9098;
    --jb-border-fine: #e3e5e8;
    --jb-text-dark-sub: #d5d8dc;

    font-family: "Segoe UI", Roboto, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif !important;
    color: #1b1d21;
    line-height: 1.5;
    width: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    background-color: #ffffff !important;
}

.jb-dealers-page *,
.jb-dealers-page *::before,
.jb-dealers-page *::after {
    box-sizing: border-box;
}

/* Boxed Container Alignment (85% width desktop) */
@media (min-width: 1001px) {
    .jb-dealers-page .container,
    .jb-dealers-page .jb-container {
        max-width: 85% !important;
        width: 85% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box !important;
    }
}

@media (max-width: 1000px) {
    .jb-dealers-page .container,
    .jb-dealers-page .jb-container {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
        box-sizing: border-box !important;
    }
}

@media (max-width: 600px) {
    .jb-dealers-page .container,
    .jb-dealers-page .jb-container {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}

/* Keyframe Animations */
@keyframes jbFadeInUp {
    from {
        opacity: 0;
        transform: translateY(18px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ==========================================================================
   Section 1: Dark Header Band (100% Full Width, #1B1D21 Background)
   ========================================================================== */
.jb-dealers-page section.jb-dealers-hero,
.jb-dealers-hero {
    background-color: #1b1d21 !important;
    background: #1b1d21 !important;
    color: #ffffff !important;
    padding: 44px 0 !important;
    border-bottom: 4px solid #ff0000 !important;
    width: 100% !important;
    display: block !important;
}

.jb-dealers-hero__eyebrow {
    color: #ff0000 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    margin: 0 0 10px 0 !important;
    line-height: 1.2 !important;
    animation: jbFadeInUp 0.6s ease-out 0.05s both;
}

.jb-dealers-hero__title {
    font-family: "Segoe UI", Roboto, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif !important;
    font-size: clamp(32px, 4.2vw, 42px) !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    line-height: 1.12 !important;
    letter-spacing: 0.01em !important;
    color: #ffffff !important;
    margin: 0 0 12px 0 !important;
    animation: jbFadeInUp 0.65s ease-out 0.1s both;
}

.jb-dealers-hero__intro {
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 25px !important;
    color: #d5d8dc !important;
    margin: 0 !important;
    max-width: 100% !important;
    animation: jbFadeInUp 0.7s ease-out 0.15s both;
}

/* ==========================================================================
   Section 2: Dealer Directory Grid & Contact Cards
   ========================================================================== */
.jb-dealers-page section.jb-dealers-directory,
.jb-dealers-directory {
    background-color: #ffffff !important;
    background: #ffffff !important;
    padding: 38px 0 44px 0 !important;
    width: 100% !important;
    display: block !important;
}

.jb-dealers-directory__title {
    font-family: "Segoe UI", Roboto, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    color: #1b1d21 !important;
    margin: 0 0 24px 0 !important;
    line-height: 1.2 !important;
}

.jb-dealers-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 22px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

@media (max-width: 1024px) {
    .jb-dealers-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 20px !important;
    }
}

@media (max-width: 600px) {
    .jb-dealers-grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }
}

/* Dealer Card Structure */
.jb-dealer-card {
    background-color: #ffffff !important;
    background: #ffffff !important;
    border: 1px solid #e3e5e8 !important;
    border-top: 2px solid #8b9098 !important;
    padding: 24px 22px !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    border-radius: 0 !important;
    box-sizing: border-box !important;
    animation: jbFadeInUp 0.6s ease-out both;
}

.jb-dealer-card:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
}

/* Highlighted / Featured Card Treatment (Card 1: Neville Stevenson) */
.jb-dealer-card--featured {
    background-color: #f4f5f6 !important;
    background: #f4f5f6 !important;
    border: 1px solid #e3e5e8 !important;
    border-top: 6px solid #ff0000 !important;
}

/* Staggered card animation entrance */
.jb-dealer-card:nth-child(1) { animation-delay: 0.04s; }
.jb-dealer-card:nth-child(2) { animation-delay: 0.08s; }
.jb-dealer-card:nth-child(3) { animation-delay: 0.12s; }
.jb-dealer-card:nth-child(4) { animation-delay: 0.16s; }
.jb-dealer-card:nth-child(5) { animation-delay: 0.20s; }
.jb-dealer-card:nth-child(6) { animation-delay: 0.24s; }
.jb-dealer-card:nth-child(7) { animation-delay: 0.28s; }
.jb-dealer-card:nth-child(8) { animation-delay: 0.32s; }

/* Card Internal Typography */
.jb-dealer-card__region {
    font-size: 13.5px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    color: #ff0000 !important;
    margin: 0 0 10px 0 !important;
    line-height: 1.3 !important;
}

.jb-dealer-card--featured .jb-dealer-card__region {
    color: #000000 !important;
}

.jb-dealer-card__name {
    font-family: inherit !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    line-height: 1.25 !important;
    color: #1b1d21 !important;
    margin: 0 0 6px 0 !important;
    letter-spacing: 0.01em !important;
}

.jb-dealer-card--featured .jb-dealer-card__name {
    color: #000000 !important;
}

.jb-dealer-card__person {
    font-size: 15.5px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    color: #495057 !important;
    margin: 0 0 20px 0 !important;
}

.jb-dealer-card--featured .jb-dealer-card__person {
    color: #000000 !important;
}

/* Contact Rows (Definition List) */
.jb-dealer-contacts {
    margin: auto 0 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
    border-top: 1px solid #e3e5e8 !important;
    width: 100% !important;
}

.jb-dealer-contact-row {
    display: flex !important;
    align-items: flex-start !important;
    padding: 12px 0 !important;
    border-bottom: 1px solid #e3e5e8 !important;
    font-size: 15.5px !important;
    line-height: 22px !important;
}

.jb-dealer-contact-row:last-child {
    border-bottom: none !important;
}

.jb-dealer-contact-row dt {
    flex: 0 0 56px !important;
    width: 56px !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 12.5px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    color: #555b62 !important;
    letter-spacing: 0.06em !important;
    line-height: 22px !important;
}

.jb-dealer-card--featured .jb-dealer-contact-row dt {
    color: #000000 !important;
}

.jb-dealer-contact-row dd {
    flex: 1 1 auto !important;
    margin: 0 0 0 10px !important;
    padding: 0 !important;
    color: #111418 !important;
    font-weight: 600 !important;
    line-height: 22px !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
}

.jb-dealer-card--featured .jb-dealer-contact-row dd {
    color: #000000 !important;
}

/* Links inside regular cards - explicitly override theme red links */
.jb-dealer-contact-row dd a,
.jb-dealer-card a {
    color: #1b1d21 !important;
    font-size: 15.5px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: color 0.2s ease;
}

.jb-dealer-contact-row dd a:hover,
.jb-dealer-card a:hover {
    color: #ff0000 !important;
    text-decoration: underline !important;
}

/* Featured card: ALL text, labels, and links strictly black */
.jb-dealer-card--featured,
.jb-dealer-card--featured *,
.jb-dealer-card--featured .jb-dealer-contact-row dd,
.jb-dealer-card--featured .jb-dealer-contact-row dd a,
.jb-dealer-card--featured a {
    color: #000000 !important;
}

.jb-dealer-card--featured .jb-dealer-contact-row dd a:hover,
.jb-dealer-card--featured a:hover {
    color: #000000 !important;
    text-decoration: underline !important;
}

/* ==========================================================================
   Section 3: Finance Strip (Light Grey Panel with 4px Red Left Border)
   ========================================================================== */
.jb-dealers-finance {
    background-color: #f4f5f6 !important;
    background: #f4f5f6 !important;
    border: none !important;
    border-left: 4px solid #ff0000 !important;
    padding: 24px 28px !important;
    margin-top: 30px !important;
    display: flex !important;
    align-items: center !important;
    gap: 24px !important;
    box-sizing: border-box !important;
    animation: jbFadeInUp 0.65s ease-out 0.35s both;
}

.jb-dealers-finance__heading {
    flex: 0 0 160px !important;
    max-width: 180px !important;
    color: #ff0000 !important;
    font-family: "Segoe UI", Roboto, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif !important;
    font-size: 26px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    line-height: 1.05 !important;
    letter-spacing: 0.02em !important;
    margin: 0 !important;
}

.jb-dealers-finance__text {
    flex: 1 1 auto !important;
    color: #1b1d21 !important;
    font-size: 16px !important;
    line-height: 24px !important;
    margin: 0 !important;
}

.jb-dealers-finance__text strong {
    font-weight: 700 !important;
    color: #1b1d21 !important;
}

@media (max-width: 680px) {
    .jb-dealers-finance {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 12px !important;
        padding: 20px 18px !important;
    }

    .jb-dealers-finance__heading {
        flex: none !important;
        max-width: none !important;
    }
}

/* ==========================================================================
   Section 4: Dark Contact Band (100% Full Width, #1B1D21 Background)
   ========================================================================== */
.jb-dealers-page section.jb-dealers-contact,
.jb-dealers-contact {
    background-color: #1b1d21 !important;
    background: #1b1d21 !important;
    color: #ffffff !important;
    padding: 38px 0 !important;
    width: 100% !important;
    text-align: center !important;
    box-sizing: border-box !important;
    display: block !important;
}

.jb-dealers-contact .jb-container {
    animation: jbFadeInUp 0.65s ease-out 0.4s both;
}

.jb-dealers-contact__title {
    font-family: "Segoe UI", Roboto, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif !important;
    color: #ffffff !important;
    font-size: 24px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    margin: 0 0 8px 0 !important;
    line-height: 1.2 !important;
}

.jb-dealers-contact__text {
    color: #d5d8dc !important;
    font-size: 15.5px !important;
    line-height: 1.5 !important;
    margin: 0 auto 20px auto !important;
    max-width: 640px !important;
}

.jb-dealers-contact__btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: #ff0000 !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    min-height: 46px !important;
    padding: 0 28px !important;
    border-radius: 3px !important;
    text-decoration: none !important;
    border: none !important;
    transition: background-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
    box-shadow: 0 4px 12px rgba(255, 0, 0, 0.25);
}

.jb-dealers-contact__btn:hover {
    background-color: #d80000 !important;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(255, 0, 0, 0.4);
    text-decoration: none !important;
}

/* ==========================================================================
   JohnBean Contact Page - Edge-to-Edge Breakout & Form Styling
   ========================================================================== */

body.html-contact-page > .master-wrapper-page > section,
body:has(.johnbean-contact-page) > .master-wrapper-page > section,
.html-contact-page .master-wrapper-page > section,
body:has(.johnbean-contact-page) .master-wrapper-page > section {
    background-color: transparent !important;
    background: transparent !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

.html-contact-page .master-wrapper-page > section > div,
body:has(.johnbean-contact-page) .master-wrapper-page > section > div,
.html-contact-page .master-wrapper-content.container,
.html-contact-page .master-wrapper-content,
body:has(.johnbean-contact-page) .master-wrapper-content,
.html-contact-page .master-column-wrapper,
body:has(.johnbean-contact-page) .master-column-wrapper,
.html-contact-page .center-1,
body:has(.johnbean-contact-page) .center-1,
.html-contact-page .page,
body:has(.johnbean-contact-page) .page,
.html-contact-page .page-body,
body:has(.johnbean-contact-page) .page-body,
.contact-form-page {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
}

.contact-form-page > .page-title,
.html-contact-page #ph-title {
    display: none !important;
}

.johnbean-contact-page .jb-container,
.johnbean-contact-page .container {
    width: 85% !important;
    max-width: 1440px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    box-sizing: border-box !important;
}

.johnbean-contact-page {
    --jb-red: #FF0000;
    --jb-red-hover: #D00000;
    --jb-charcoal: #1B1D20;
    --jb-white: #FFFFFF;
    --jb-light-grey: #F4F5F6;
    --jb-text-main: #202226;
    --jb-text-muted: #60666D;
    --jb-border: #D9DDE1;

    width: 100%;
    color: var(--jb-text-main);
    font-family: inherit;
}

.jb-contact-section-title {
    font-family: inherit !important;
    font-size: 24px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.02em !important;
    color: var(--jb-text-main) !important;
    margin: 0 0 10px 0 !important;
    line-height: 1.2 !important;
}

.jb-contact-title-underline {
    width: 55px;
    height: 3px;
    background-color: var(--jb-red);
    margin: 0 0 24px 0;
    border-radius: 2px;
}

.jb-contact-title-band {
    background-color: var(--jb-charcoal) !important;
    border-bottom: 2px solid var(--jb-red) !important;
    padding: 40px 0 !important;
    width: 100% !important;
}

.jb-contact-eyebrow {
    color: var(--jb-red) !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    margin: 0 0 10px 0 !important;
    line-height: 1.2 !important;
}

.jb-contact-title {
    font-family: inherit !important;
    font-size: clamp(30px, 3.8vw, 36px) !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    color: var(--jb-white) !important;
    margin: 0 0 10px 0 !important;
    line-height: 1.15 !important;
}

.jb-contact-intro {
    font-size: 16px !important;
    font-weight: 400 !important;
    color: #D5D8DC !important;
    margin: 0 !important;
    line-height: 1.5 !important;
}

.jb-contact-cards-section {
    background-color: var(--jb-white) !important;
    padding: 34px 0 40px 0 !important;
    width: 100% !important;
}

.jb-contact-cards-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.jb-contact-card {
    background-color: var(--jb-white) !important;
    border: 1px solid var(--jb-border) !important;
    border-top: 2px solid #8B9098 !important;
    border-radius: 2px !important;
    padding: 22px 20px !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    box-sizing: border-box !important;
    transition: box-shadow 0.2s ease;
}

.jb-contact-card:hover {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.05);
}

.jb-contact-card--featured {
    background-color: var(--jb-light-grey) !important;
    border-top: 3px solid var(--jb-red) !important;
}

.jb-contact-card__name {
    font-family: inherit !important;
    font-size: 17.5px !important;
    font-weight: 700 !important;
    color: var(--jb-text-main) !important;
    margin: 0 0 8px 0 !important;
    line-height: 1.3 !important;
}

.jb-contact-card__desc {
    font-size: 14.5px !important;
    line-height: 1.45 !important;
    color: var(--jb-text-muted) !important;
    margin: 0 0 18px 0 !important;
    flex-grow: 1 !important;
}

.jb-contact-card__contacts {
    margin-top: auto !important;
    border-top: 1px solid var(--jb-border) !important;
    padding-top: 4px !important;
}

.jb-contact-card__row {
    display: flex !important;
    align-items: center !important;
    padding: 10px 0 !important;
    border-bottom: 1px solid var(--jb-border) !important;
    font-size: 14.5px !important;
    line-height: 1.4 !important;
}

.jb-contact-card__row:last-child {
    border-bottom: none !important;
}

.jb-contact-card__icon {
    color: var(--jb-red) !important;
    flex-shrink: 0 !important;
    margin-right: 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.jb-contact-card__value {
    color: var(--jb-text-main) !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
    transition: color 0.2s ease;
}

.jb-contact-card__value:hover {
    color: var(--jb-red) !important;
    text-decoration: underline !important;
}

.jb-contact-form-section {
    background-color: var(--jb-light-grey) !important;
    padding: 38px 0 46px 0 !important;
    width: 100% !important;
}

.jb-contact-form-intro {
    font-size: 15px !important;
    color: var(--jb-text-muted) !important;
    margin: 0 0 26px 0 !important;
    line-height: 1.5 !important;
}

.jb-contact-alert {
    padding: 16px 20px;
    margin-bottom: 24px;
    border-radius: 2px;
    font-size: 15px;
    line-height: 1.5;
}

.jb-contact-alert--success {
    background-color: #d4edda;
    border: 1px solid #c3e6cb;
    color: #155724;
}

.jb-contact-alert--error {
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
    color: #721c24;
}

.jb-form-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    column-gap: 24px !important;
    row-gap: 18px !important;
    width: 100% !important;
}

.jb-form-field {
    display: flex !important;
    flex-direction: column !important;
}

.jb-form-field--full {
    grid-column: 1 / -1 !important;
}

.jb-form-field label {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--jb-text-main) !important;
    margin: 0 0 7px 0 !important;
    line-height: 1.2 !important;
}

.jb-form-field label .req {
    color: var(--jb-red) !important;
    font-weight: 700 !important;
    margin-left: 2px !important;
}

.jb-form-control {
    height: 46px !important;
    background-color: var(--jb-white) !important;
    border: 1px solid var(--jb-border) !important;
    border-radius: 2px !important;
    padding: 0 14px !important;
    font-size: 15px !important;
    color: var(--jb-text-main) !important;
    outline: none !important;
    box-sizing: border-box !important;
    width: 100% !important;
    font-family: inherit !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.jb-form-control::placeholder {
    color: #8E959D !important;
    opacity: 1 !important;
}

.jb-form-control:focus {
    border-color: var(--jb-text-main) !important;
    box-shadow: 0 0 0 2px rgba(32, 34, 38, 0.12) !important;
}

select.jb-form-control {
    appearance: none !important;
    -webkit-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 256 256'%3E%3Cpath fill='%2360666D' d='M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80A8,8,0,0,1,53.66,90.34L128,164.69l74.34-74.35a8,8,0,0,1,11.32,11.32Z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    padding-right: 36px !important;
    cursor: pointer !important;
}

textarea.jb-form-control {
    height: 130px !important;
    min-height: 110px !important;
    padding: 12px 14px !important;
    resize: vertical !important;
    line-height: 1.45 !important;
}

.field-validation-error {
    color: var(--jb-red) !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    margin-top: 5px !important;
    display: block !important;
}

.jb-form-actions {
    grid-column: 1 / -1 !important;
    display: flex !important;
    justify-content: flex-end !important;
    margin-top: 8px !important;
}

.jb-btn-submit {
    height: 48px !important;
    background-color: var(--jb-red) !important;
    color: var(--jb-white) !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    border: none !important;
    border-radius: 2px !important;
    padding: 0 26px !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    transition: background-color 0.2s ease, transform 0.1s ease !important;
}

.jb-btn-submit:hover {
    background-color: var(--jb-red-hover) !important;
}

.jb-btn-submit:active {
    transform: translateY(1px) !important;
}

.jb-btn-submit[disabled],
.jb-btn-submit.disabled {
    opacity: 0.65 !important;
    cursor: not-allowed !important;
}

.jb-btn-submit svg {
    flex-shrink: 0;
}

@media (max-width: 1024px) {
    .jb-contact-cards-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 18px !important;
    }
    .johnbean-contact-page .jb-container,
    .johnbean-contact-page .container {
        width: 90% !important;
    }
}

@media (max-width: 768px) {
    .jb-form-grid {
        grid-template-columns: 1fr !important;
        row-gap: 16px !important;
    }
    .jb-form-actions {
        justify-content: stretch !important;
    }
    .jb-btn-submit {
        width: 100% !important;
    }
    .jb-contact-title {
        font-size: 28px !important;
    }
}

@media (max-width: 600px) {
    .jb-contact-cards-grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }
    .johnbean-contact-page .jb-container,
    .johnbean-contact-page .container {
        width: 92% !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    .jb-contact-title-band {
        padding: 32px 0 !important;
    }
    .jb-contact-cards-section,
    .jb-contact-form-section {
        padding: 28px 0 34px 0 !important;
    }
}