:root {
    --black: #050708;
    --black-2: #090d10;
    --black-3: #101519;
    --panel: #11171b;
    --panel-2: #171d21;
    --line: #293137;
    --orange: #ff5a00;
    --orange-dark: #c94000;
    --silver: #dce1e5;
    --white: #ffffff;
    --muted: #9aa4aa;
    --green: #78c800;
    --font: Arial, Helvetica, sans-serif;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    color: var(--white);
    background: var(--black);
    font-family: var(--font);
}

a {
    color: inherit;
}

button,
input,
select {
    font: inherit;
}

.mts-container {
    width: min(1500px, calc(100% - 54px));
    margin: 0 auto;
}

.mts-topbar {
    background: #020303;
    border-bottom: 1px solid #181c1f;
}

.mts-topbar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 34px;
    color: #c9ced1;
    font-size: 11px;
}

.mts-topbar-inner > span {
    color: var(--orange);
    font-weight: 900;
}

.mts-topbar-inner div {
    display: flex;
    gap: 26px;
}

.mts-topbar a {
    text-decoration: none;
}

.mts-header {
    background:
        linear-gradient(
            180deg,
            #0c0f11,
            #060809
        );
    border-bottom: 1px solid #242a2e;
}

.mts-header-main {
    display: grid;
    grid-template-columns: 270px minmax(300px, 1fr) auto;
    align-items: center;
    gap: 40px;
    min-height: 110px;
}

.mts-logo {
    display: block;
    text-decoration: none;
}

.mts-logo img {
    display: block;
    width: 235px;
    max-height: 84px;
    object-fit: contain;
}

.mts-logo-fallback {
    display: none;
}

.mts-logo-fallback strong,
.mts-logo-fallback small {
    display: block;
}

.mts-logo-fallback strong {
    font-size: 40px;
}

.mts-logo-fallback small {
    color: var(--orange);
    letter-spacing: 4px;
}

.mts-main-search {
    display: grid;
    grid-template-columns: 1fr auto;
    min-height: 54px;
    overflow: hidden;
    background: #151a1d;
    border: 1px solid #373e43;
    border-radius: 7px;
}

.mts-main-search input {
    padding: 0 19px;
    color: var(--white);
    background: transparent;
    border: 0;
    outline: none;
}

.mts-main-search button {
    padding: 0 30px;
    color: var(--white);
    cursor: pointer;
    background: var(--orange);
    border: 0;
    font-weight: 900;
}

.mts-header-actions {
    display: flex;
    gap: 28px;
}

.mts-header-actions a {
    text-decoration: none;
}

.mts-header-actions span,
.mts-header-actions strong {
    display: block;
}

.mts-header-actions span {
    color: var(--white);
    font-size: 12px;
    font-weight: 900;
}

.mts-header-actions strong {
    margin-top: 5px;
    color: var(--muted);
    font-size: 10px;
}

.mts-navigation {
    border-top: 1px solid #1d2327;
    background: #050607;
}

.mts-navigation-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 58px;
}

.mts-navigation nav {
    display: flex;
    align-items: stretch;
    min-height: 58px;
}

.mts-navigation nav > a,
.mts-category-menu > button {
    display: flex;
    align-items: center;
    padding: 0 19px;
    color: #e6eaec;
    text-decoration: none;
    background: transparent;
    border: 0;
    cursor: pointer;
    font-size: 12px;
    font-weight: 800;
}

.mts-navigation nav > a:hover,
.mts-navigation nav > a.active {
    color: var(--orange);
}

.mts-category-menu {
    position: relative;
}

.mts-category-menu > button {
    min-width: 205px;
    margin-right: 8px;
    color: var(--white);
    background: var(--orange);
    justify-content: space-between;
}

.mts-category-dropdown {
    position: absolute;
    top: 58px;
    left: 0;
    z-index: 100;
    display: none;
    width: 390px;
    grid-template-columns: repeat(2, 1fr);
    padding: 12px;
    background: #111619;
    border: 1px solid #32393e;
    box-shadow: 0 22px 70px rgba(0, 0, 0, .65);
}

.mts-category-menu:hover .mts-category-dropdown {
    display: grid;
}

.mts-category-dropdown a {
    display: flex;
    justify-content: space-between;
    padding: 12px;
    color: #d9dfe2;
    text-decoration: none;
    border-bottom: 1px solid #252c30;
    font-size: 11px;
}

.mts-category-dropdown a:hover {
    color: var(--orange);
    background: #191f23;
}

.mts-category-dropdown small {
    color: #737f86;
}

.mts-delivery-links {
    color: #c4cbd0;
    font-size: 11px;
}

.mts-mobile-menu {
    display: none;
}

.mts-hero {
    position: relative;
    min-height: 660px;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 85% 20%,
            rgba(255, 90, 0, .13),
            transparent 30%
        ),
        linear-gradient(
            115deg,
            #050607 0%,
            #101417 60%,
            #050607 100%
        );
}

.mts-hero::before {
    position: absolute;
    inset: 0;
    content: "";
    opacity: .24;
    background-image:
        linear-gradient(
            90deg,
            transparent 0 49%,
            rgba(255, 255, 255, .035) 50% 51%,
            transparent 52%
        );
    background-size: 95px 95px;
}

.mts-hero-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            rgba(0, 0, 0, .88),
            rgba(0, 0, 0, .38),
            rgba(0, 0, 0, .78)
        );
}

.mts-hero-content {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    align-items: center;
    gap: 80px;
    min-height: 660px;
}

.mts-eyebrow,
.mts-section-heading span,
.mts-trade-benefits > span,
.mts-erp-panel > span,
.mts-final-enquiry span {
    color: var(--orange);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 1.8px;
}

.mts-hero h1 {
    margin: 18px 0;
    font-size: clamp(60px, 7vw, 100px);
    line-height: .89;
    letter-spacing: -4px;
}

.mts-hero h1 strong {
    display: block;
    color: var(--orange);
}

.mts-hero-copy > p {
    max-width: 600px;
    color: #d5dadd;
    font-size: 19px;
    line-height: 1.6;
}

.mts-hero-actions {
    display: flex;
    gap: 13px;
    margin-top: 28px;
}

.mts-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 0 24px;
    color: var(--white);
    text-decoration: none;
    border-radius: 5px;
    font-size: 12px;
    font-weight: 900;
}

.mts-button-orange {
    background: var(--orange);
}

.mts-button-orange:hover {
    background: var(--orange-dark);
}

.mts-button-outline {
    border: 1px solid #dce1e5;
    background: transparent;
}

.mts-hero-search {
    display: grid;
    grid-template-columns: 180px 1fr auto;
    margin-top: 28px;
    overflow: hidden;
    background: var(--white);
    border-radius: 6px;
}

.mts-hero-search select,
.mts-hero-search input {
    min-height: 56px;
    padding: 0 16px;
    color: #343a3e;
    background: var(--white);
    border: 0;
    outline: none;
}

.mts-hero-search select {
    border-right: 1px solid #dfe4e7;
}

.mts-hero-search button {
    padding: 0 23px;
    color: var(--white);
    background: var(--orange);
    border: 0;
    cursor: pointer;
    font-weight: 900;
}

.mts-hero-brand {
    text-align: center;
}

.mts-hero-brand > img {
    width: min(100%, 650px);
    max-height: 310px;
    object-fit: contain;
}

.mts-tool-display {
    margin: 30px auto 0;
    padding: 20px;
    max-width: 430px;
    background: rgba(10, 14, 16, .85);
    border: 1px solid #343b40;
}

.mts-tool-display span,
.mts-tool-display strong,
.mts-tool-display small {
    display: block;
}

.mts-tool-display span {
    color: var(--orange);
    font-size: 9px;
    letter-spacing: 1.5px;
}

.mts-tool-display strong {
    margin-top: 7px;
    font-size: 22px;
}

.mts-tool-display small {
    margin-top: 5px;
    color: var(--muted);
}

.mts-stats {
    background: #090c0e;
    border-top: 1px solid #292f33;
    border-bottom: 1px solid #292f33;
}

.mts-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.mts-stats article {
    display: grid;
    grid-template-columns: 65px 1fr;
    align-items: center;
    min-height: 125px;
    padding: 25px;
    border-right: 1px solid #292f33;
}

.mts-stats article:last-child {
    border-right: 0;
}

.mts-stats article > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    color: var(--orange);
    border: 1px solid var(--orange);
    border-radius: 50%;
    font-weight: 900;
}

.mts-stats strong,
.mts-stats small {
    display: block;
}

.mts-stats strong {
    color: var(--orange);
    font-size: 20px;
}

.mts-stats small {
    margin-top: 6px;
    color: #c7ced2;
}

.mts-section {
    padding: 75px 0;
}

.mts-section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 30px;
}

.mts-section-heading h2 {
    margin: 8px 0 0;
    font-size: 36px;
}

.mts-section-heading a {
    color: #dce1e5;
    text-decoration: none;
    font-size: 11px;
}

.mts-categories-section {
    background: #080b0d;
}

.mts-category-image-grid {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 9px;
}

.mts-category-image-card {
    position: relative;
    min-height: 245px;
    overflow: hidden;
    color: var(--white);
    text-decoration: none;
    background:
        linear-gradient(145deg, #1b2226, #090b0d);
    border: 1px solid #2b3237;
}

.mts-category-image-card::before {
    position: absolute;
    inset: 0;
    content: "";
    opacity: .22;
    background:
        radial-gradient(
            circle at 60% 30%,
            var(--orange),
            transparent 45%
        );
}

.mts-category-image-card:hover {
    border-color: var(--orange);
}

.mts-category-darken {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            180deg,
            transparent,
            rgba(0, 0, 0, .95)
        );
}

.mts-category-image-card > div:last-child {
    position: absolute;
    right: 15px;
    bottom: 16px;
    left: 15px;
}

.mts-category-image-card span,
.mts-category-image-card strong {
    display: block;
}

.mts-category-image-card span {
    color: var(--orange);
    font-size: 8px;
    font-weight: 900;
}

.mts-category-image-card strong {
    margin-top: 7px;
    font-size: 14px;
    line-height: 1.2;
}

.mts-brands-section {
    padding: 48px 0;
    background: #0d1113;
    border-top: 1px solid #282e32;
    border-bottom: 1px solid #282e32;
}

.mts-brand-strip {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 12px;
}

.mts-brand-strip a,
.mts-brand-strip span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 80px;
    color: #d5dadd;
    text-decoration: none;
    background: #080a0b;
    border: 1px solid #252b2f;
    font-size: 20px;
    font-weight: 900;
    font-style: italic;
}

.mts-brand-strip a:hover {
    color: var(--orange);
    border-color: var(--orange);
}

.mts-products-section {
    background: #07090a;
}

.mts-product-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}

.mts-product-card {
    overflow: hidden;
    background: #111619;
    border: 1px solid #32393e;
}

.mts-product-card:hover {
    border-color: var(--orange);
}

.mts-product-image {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 260px;
    background:
        radial-gradient(
            circle at center,
            #242b30,
            #0a0d0f 70%
        );
}

.mts-product-image img {
    width: 100%;
    height: 260px;
    padding: 22px;
    object-fit: contain;
}

.mts-product-placeholder {
    text-align: center;
}

.mts-product-placeholder span,
.mts-product-placeholder strong {
    display: block;
}

.mts-product-placeholder span {
    color: var(--orange);
    font-size: 11px;
}

.mts-product-placeholder strong {
    margin-top: 8px;
    color: #e1e6e8;
}

.mts-product-card-content {
    padding: 18px;
}

.mts-stock-label {
    display: inline-block;
    padding: 4px 6px;
    color: #9be400;
    background: #101900;
    font-size: 8px;
    font-weight: 900;
}

.mts-product-brand {
    display: block;
    margin-top: 14px;
    color: var(--muted);
    font-size: 9px;
}

.mts-product-name {
    display: block;
    min-height: 44px;
    margin-top: 6px;
    color: var(--white);
    text-decoration: none;
    font-size: 14px;
    font-weight: 900;
    line-height: 1.35;
}

.mts-product-card-content > small {
    color: #78838a;
}

.mts-price-lock {
    margin-top: 16px;
    padding: 10px;
    border: 1px solid #343b3f;
    background: #0b0f11;
}

.mts-price-lock span,
.mts-price-lock strong {
    display: block;
}

.mts-price-lock span {
    color: var(--orange);
    font-size: 8px;
    font-weight: 900;
}

.mts-price-lock strong {
    margin-top: 5px;
    font-size: 11px;
}

.mts-enquiry-button {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    margin-top: 12px;
    color: var(--white);
    text-decoration: none;
    background: var(--orange);
    font-size: 11px;
    font-weight: 900;
}

.mts-trade-account {
    padding: 20px 0 65px;
    background: #07090a;
}

.mts-trade-account-grid {
    display: grid;
    grid-template-columns: 1.15fr .8fr .9fr;
    min-height: 400px;
    overflow: hidden;
    border: 1px solid var(--orange);
}

.mts-trade-benefits,
.mts-erp-panel {
    padding: 42px;
    background: #0c1012;
}

.mts-trade-benefits h2,
.mts-erp-panel h2 {
    font-size: 33px;
}

.mts-trade-benefits h2 strong {
    color: var(--orange);
}

.mts-benefits-columns {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.mts-benefits-columns ul,
.mts-erp-panel ul {
    padding: 0;
    list-style: none;
}

.mts-benefits-columns li,
.mts-erp-panel li {
    margin: 14px 0;
    color: #d8dde0;
    font-size: 12px;
}

.mts-benefits-columns li::before,
.mts-erp-panel li::before {
    margin-right: 10px;
    color: var(--orange);
    content: "✓";
    font-weight: 900;
}

.mts-trade-image {
    display: flex;
    align-items: center;
    justify-content: center;
    background:
        linear-gradient(
            145deg,
            #1c2327,
            #090c0e
        );
}

.mts-trade-image img {
    width: 80%;
}

.mts-trade-image span {
    display: block;
    margin-top: 16px;
    text-align: center;
    color: var(--orange);
    font-size: 10px;
    letter-spacing: 2px;
}

.mts-feature-strip {
    padding: 0 0 50px;
    background: #07090a;
}

.mts-feature-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border: 1px solid #30373b;
}

.mts-feature-grid article {
    min-height: 115px;
    padding: 27px;
    border-right: 1px solid #30373b;
}

.mts-feature-grid article:last-child {
    border-right: 0;
}

.mts-feature-grid strong,
.mts-feature-grid span {
    display: block;
}

.mts-feature-grid strong {
    color: var(--white);
}

.mts-feature-grid span {
    margin-top: 9px;
    color: var(--muted);
    font-size: 11px;
}

.mts-final-enquiry {
    padding: 55px 0;
    background:
        linear-gradient(
            90deg,
            #14191c,
            #07090a
        );
    border-top: 1px solid #2e3539;
}

.mts-final-enquiry-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mts-final-enquiry h2 {
    margin: 8px 0;
    font-size: 35px;
}

.mts-final-enquiry p {
    color: var(--muted);
}

.mts-footer {
    background: #050607;
    border-top: 1px solid #2a3034;
}

.mts-footer-grid {
    display: grid;
    grid-template-columns: 1.5fr repeat(4, 1fr);
    gap: 50px;
    padding-top: 60px;
    padding-bottom: 50px;
}

.mts-footer-brand img {
    width: 250px;
}

.mts-footer p {
    max-width: 330px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.7;
}

.mts-footer h3 {
    margin-top: 0;
    font-size: 12px;
    text-transform: uppercase;
}

.mts-footer a,
.mts-footer span {
    display: block;
    margin: 10px 0;
    color: var(--muted);
    text-decoration: none;
    font-size: 11px;
}

.mts-footer a:hover {
    color: var(--orange);
}

.mts-footer-brand strong {
    color: var(--orange);
    font-size: 10px;
}

.mts-footer-bottom {
    border-top: 1px solid #24292d;
}

.mts-footer-bottom > div {
    display: flex;
    justify-content: space-between;
    padding-top: 21px;
    padding-bottom: 21px;
    color: #69757c;
    font-size: 9px;
}

@media (max-width: 1200px) {
    .mts-header-main {
        grid-template-columns: 230px 1fr;
    }

    .mts-header-actions {
        display: none;
    }

    .mts-category-image-grid {
        grid-template-columns: repeat(4, 1fr);
    }

    .mts-product-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .mts-brand-strip {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 900px) {
    .mts-container {
        width: min(100% - 28px, 1500px);
    }

    .mts-topbar-inner div {
        display: none;
    }

    .mts-header-main {
        grid-template-columns: 1fr;
        gap: 17px;
        padding-top: 17px;
        padding-bottom: 17px;
    }

    .mts-navigation-inner {
        display: block;
        padding-top: 8px;
        padding-bottom: 8px;
    }

    .mts-mobile-menu {
        display: block;
        padding: 10px 14px;
        color: var(--white);
        background: var(--orange);
        border: 0;
    }

    .mts-navigation nav {
        display: none;
        height: auto;
        margin-top: 8px;
    }

    .mts-navigation nav.is-open {
        display: block;
    }

    .mts-navigation nav > a,
    .mts-category-menu > button {
        width: 100%;
        min-height: 45px;
    }

    .mts-category-dropdown {
        position: static;
        display: none;
        width: 100%;
        grid-template-columns: 1fr;
    }

    .mts-category-menu:hover .mts-category-dropdown {
        display: grid;
    }

    .mts-delivery-links {
        display: none;
    }

    .mts-hero-content {
        grid-template-columns: 1fr;
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .mts-hero-brand {
        display: none;
    }

    .mts-stats-grid,
    .mts-feature-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .mts-category-image-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .mts-trade-account-grid {
        grid-template-columns: 1fr;
    }

    .mts-footer-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 620px) {
    .mts-hero h1 {
        font-size: 54px;
    }

    .mts-hero-search {
        grid-template-columns: 1fr;
    }

    .mts-hero-search select,
    .mts-hero-search input,
    .mts-hero-search button {
        min-height: 50px;
    }

    .mts-hero-actions,
    .mts-final-enquiry-inner {
        display: block;
    }

    .mts-hero-actions .mts-button,
    .mts-final-enquiry .mts-button {
        width: 100%;
        margin-top: 10px;
    }

    .mts-stats-grid,
    .mts-category-image-grid,
    .mts-product-grid,
    .mts-brand-strip,
    .mts-feature-grid,
    .mts-footer-grid {
        grid-template-columns: 1fr;
    }

    .mts-stats article,
    .mts-feature-grid article {
        border-right: 0;
        border-bottom: 1px solid #292f33;
    }

    .mts-benefits-columns {
        grid-template-columns: 1fr;
    }

    .mts-footer-bottom > div {
        display: block;
    }
}

/* =========================================================
   METRO INDUSTRIAL PRODUCT WORKSPACE
   ========================================================= */

.metro-product-detail-section {
    padding: 42px 0 80px;
    color: var(--white);
    background: var(--black);
}

.metro-breadcrumbs {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 28px;
    color: var(--muted);
    flex-wrap: wrap;
    font-size: 11px;
}

.metro-breadcrumbs a {
    color: var(--silver);
    text-decoration: none;
}

.metro-breadcrumbs a:hover {
    color: var(--orange);
}

.metro-product-detail-grid {
    display: grid;
    grid-template-columns:
        minmax(390px, .9fr)
        minmax(0, 1.1fr);
    gap: 55px;
    align-items: start;
}

.metro-product-detail-image {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 560px;
    overflow: hidden;
    background:
        radial-gradient(
            circle at center,
            #252c31,
            #0b0e10 70%
        );
    border: 1px solid #343c41;
    border-radius: 10px;
}

.metro-product-detail-image img {
    display: block;
    width: 100%;
    height: 560px;
    padding: 35px;
    object-fit: contain;
}

.metro-product-detail-image > div {
    text-align: center;
}

.metro-product-detail-image > div span,
.metro-product-detail-image > div strong {
    display: block;
}

.metro-product-detail-image > div span {
    color: var(--orange);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 2px;
}

.metro-product-detail-image > div strong {
    margin-top: 12px;
    color: var(--silver);
    font-size: 32px;
}

.metro-product-detail-meta {
    display: flex;
    gap: 9px;
    align-items: center;
    flex-wrap: wrap;
}

.metro-product-detail-meta span,
.metro-product-detail-meta a {
    padding: 6px 10px;
    text-decoration: none;
    border-radius: 3px;
    font-size: 9px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.metro-product-detail-meta span {
    color: var(--white);
    background: var(--orange);
}

.metro-product-detail-meta a {
    color: var(--silver);
    background: #151a1d;
    border: 1px solid #343b40;
}

.metro-product-detail-content h1 {
    margin: 20px 0 13px;
    color: var(--white);
    font-size: clamp(38px, 5vw, 64px);
    line-height: 1;
    letter-spacing: -2px;
}

.metro-product-reference {
    color: var(--muted);
    font-size: 12px;
}

.metro-product-reference strong {
    color: var(--silver);
}

.metro-product-description {
    margin-top: 26px;
    color: #c2c9cd;
    font-size: 15px;
    line-height: 1.75;
}

.metro-trade-price-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 25px;
    padding: 22px;
    color: var(--white);
    background: #111619;
    border: 1px solid #353d42;
    border-left: 4px solid var(--orange);
    border-radius: 6px;
}

.metro-trade-price-panel span,
.metro-trade-price-panel strong,
.metro-trade-price-panel small {
    display: block;
}

.metro-trade-price-panel span {
    color: var(--orange);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.5px;
}

.metro-trade-price-panel strong {
    margin-top: 7px;
    font-size: 18px;
}

.metro-trade-price-panel small {
    margin-top: 5px;
    color: var(--muted);
}

.metro-trade-price-panel > a {
    padding: 12px 17px;
    color: var(--white);
    text-decoration: none;
    background: var(--orange);
    border-radius: 4px;
    white-space: nowrap;
    font-size: 11px;
    font-weight: 900;
}

.metro-availability-panel {
    margin-top: 16px;
    padding: 19px;
    background: #10180d;
    border: 1px solid #314823;
    border-radius: 6px;
}

.metro-availability-panel span,
.metro-availability-panel strong,
.metro-availability-panel small {
    display: block;
}

.metro-availability-panel span {
    color: #9be400;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.4px;
}

.metro-availability-panel strong {
    margin-top: 6px;
    color: var(--white);
}

.metro-availability-panel small {
    margin-top: 5px;
    color: var(--muted);
}

.metro-product-detail-actions {
    display: flex;
    gap: 11px;
    margin-top: 23px;
    flex-wrap: wrap;
}

.metro-product-detail-actions .metro-button-primary {
    color: var(--white);
    background: var(--orange);
}

.metro-product-detail-actions .metro-button-outline {
    color: var(--white);
    border: 1px solid #dadee1;
    background: transparent;
}

.metro-product-information-grid {
    display: grid;
    grid-template-columns: 1.45fr .7fr;
    gap: 20px;
    margin-top: 60px;
}

.metro-product-information-grid > section,
.metro-product-information-grid > aside {
    padding: 27px;
    background: #101518;
    border: 1px solid #323a3f;
    border-radius: 7px;
}

.metro-product-information-grid > aside {
    border-top: 3px solid var(--orange);
}

.metro-product-information-grid > section > span,
.metro-product-information-grid > aside > span {
    color: var(--orange);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.5px;
}

.metro-product-information-grid h2 {
    margin: 9px 0 20px;
    color: var(--white);
}

.metro-product-information-grid p {
    color: var(--muted);
    line-height: 1.65;
}

.metro-product-information-grid aside a {
    color: var(--orange);
    text-decoration: none;
    font-size: 12px;
    font-weight: 900;
}

.metro-specification-list {
    margin: 0;
}

.metro-specification-list div {
    display: grid;
    grid-template-columns: 190px 1fr;
    gap: 18px;
    padding: 13px 0;
    border-bottom: 1px solid #2b3236;
}

.metro-specification-list dt {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}

.metro-specification-list dd {
    margin: 0;
    color: var(--white);
    font-size: 12px;
}

.metro-section-muted {
    color: var(--white);
    background: #090c0e;
    border-top: 1px solid #293035;
}

.metro-section-muted .metro-section-heading h2 {
    color: var(--white);
}

.metro-section-muted .metro-product-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}

.metro-section-muted .metro-product-card {
    color: var(--white);
    background: #111619;
    border-color: #343b40;
}

.metro-section-muted .metro-product-title {
    color: var(--white);
}

.metro-section-muted .metro-product-content p,
.metro-section-muted .metro-product-code,
.metro-section-muted .metro-stock-status {
    color: var(--muted);
}

.metro-section-muted .metro-public-price-lock {
    color: var(--white);
    background: #0b0f11;
    border-color: #333b40;
}

@media (max-width: 950px) {
    .metro-product-detail-grid,
    .metro-product-information-grid {
        grid-template-columns: 1fr;
    }

    .metro-section-muted .metro-product-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 620px) {
    .metro-product-detail-image {
        min-height: 350px;
    }

    .metro-product-detail-image img {
        height: 350px;
        padding: 20px;
    }

    .metro-trade-price-panel {
        display: block;
    }

    .metro-trade-price-panel > a {
        display: inline-block;
        margin-top: 16px;
    }

    .metro-specification-list div {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .metro-section-muted .metro-product-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   PRODUCT WORKSPACE V2
   ========================================================= */

.mts-product-workspace {
    padding: 38px 0 75px;
    background: #050708;
}

.mts-product-breadcrumbs {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 27px;
    color: #7f898f;
    flex-wrap: wrap;
    font-size: 10px;
}

.mts-product-breadcrumbs a {
    color: #c5cdd1;
    text-decoration: none;
}

.mts-product-breadcrumbs a:hover {
    color: var(--orange);
}

.mts-product-main {
    display: grid;
    grid-template-columns:
        minmax(440px, .92fr)
        minmax(0, 1.08fr);
    gap: 50px;
    align-items: start;
}

.mts-product-main-image {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 620px;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #333b40;
    border-radius: 8px;
}

.mts-product-main-image img {
    display: block;
    width: 100%;
    height: 620px;
    padding: 34px;
    object-fit: contain;
}

.mts-product-image-placeholder {
    text-align: center;
}

.mts-product-image-placeholder span,
.mts-product-image-placeholder strong {
    display: block;
}

.mts-product-image-placeholder span {
    color: var(--orange);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 2px;
}

.mts-product-image-placeholder strong {
    margin-top: 12px;
    color: #30363a;
    font-size: 36px;
}

.mts-product-thumbnails {
    display: flex;
    align-items: stretch;
    gap: 10px;
    margin-top: 12px;
}

.mts-product-thumbnails button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 92px;
    height: 92px;
    padding: 5px;
    cursor: pointer;
    background: #ffffff;
    border: 2px solid var(--orange);
    border-radius: 5px;
}

.mts-product-thumbnails img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.mts-product-thumbnails button span {
    color: #23292d;
    font-size: 9px;
    font-weight: 900;
}

.mts-gallery-coming-soon {
    display: flex;
    align-items: center;
    flex: 1;
    padding: 15px;
    color: #77838a;
    background: #0e1316;
    border: 1px solid #2d353a;
    border-radius: 5px;
    font-size: 10px;
    line-height: 1.5;
}

.mts-product-tags {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.mts-product-tags a {
    padding: 7px 11px;
    color: #ffffff;
    text-decoration: none;
    background: var(--orange);
    border-radius: 3px;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.mts-product-tags a.brand {
    color: #dde3e6;
    background: #151a1d;
    border: 1px solid #394146;
}

.mts-product-summary h1 {
    margin: 20px 0 12px;
    color: #ffffff;
    font-size: clamp(45px, 5vw, 68px);
    line-height: .98;
    letter-spacing: -2px;
}

.mts-product-identifiers {
    display: flex;
    gap: 17px;
    color: #808c93;
    flex-wrap: wrap;
    font-size: 10px;
}

.mts-product-identifiers strong {
    color: #dbe1e4;
}

.mts-product-description {
    margin-top: 25px;
    color: #bcc5ca;
    font-size: 15px;
    line-height: 1.75;
}

.mts-trade-price-lock {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    margin-top: 26px;
    padding: 23px;
    background: #111619;
    border: 1px solid #353e43;
    border-left: 4px solid var(--orange);
    border-radius: 6px;
}

.mts-trade-price-lock span,
.mts-trade-price-lock strong,
.mts-trade-price-lock small {
    display: block;
}

.mts-trade-price-lock span {
    color: var(--orange);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.4px;
}

.mts-trade-price-lock strong {
    margin-top: 7px;
    color: #ffffff;
    font-size: 18px;
}

.mts-trade-price-lock small {
    margin-top: 5px;
    color: #879299;
}

.mts-trade-price-lock > a {
    padding: 13px 18px;
    color: #ffffff;
    text-decoration: none;
    white-space: nowrap;
    background: var(--orange);
    border-radius: 4px;
    font-size: 11px;
    font-weight: 900;
}

.mts-live-stock-panel {
    margin-top: 15px;
    padding: 21px;
    border-radius: 6px;
}

.mts-live-stock-panel.available {
    background: #10180d;
    border: 1px solid #365125;
}

.mts-live-stock-panel.contact {
    background: #131514;
    border: 1px solid #3a403c;
}

.mts-stock-heading {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

.mts-stock-heading span,
.mts-stock-heading strong {
    display: block;
}

.mts-stock-heading span {
    color: #9be400;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.4px;
}

.mts-stock-heading strong {
    margin-top: 6px;
    color: #ffffff;
}

.mts-stock-total {
    text-align: right;
}

.mts-stock-total strong {
    margin: 0;
    color: #9be400;
    font-size: 25px;
}

.mts-stock-total span {
    margin-top: 3px;
    color: #b2bdc2;
}

.mts-warehouse-stock-list {
    margin-top: 17px;
    border-top: 1px solid #304124;
}

.mts-warehouse-stock-list > div {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 11px 0;
    color: #aab4b9;
    border-bottom: 1px solid #25321d;
    font-size: 10px;
}

.mts-warehouse-stock-list strong.in-stock {
    color: #9be400;
}

.mts-warehouse-stock-list strong.out-of-stock {
    color: #d5dade;
}

.mts-live-stock-panel p,
.mts-live-stock-panel small {
    color: #8c979d;
    font-size: 10px;
}

.mts-product-actions {
    display: flex;
    gap: 10px;
    margin-top: 18px;
    flex-wrap: wrap;
}

.mts-product-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 20px;
    text-decoration: none;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 900;
}

.mts-action-primary {
    color: #ffffff;
    background: var(--orange);
}

.mts-action-secondary {
    color: #ffffff;
    border: 1px solid #d1d8db;
}

.mts-product-service-points {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-top: 23px;
}

.mts-product-service-points article {
    padding: 15px;
    background: #0e1214;
    border: 1px solid #2b3236;
}

.mts-product-service-points strong,
.mts-product-service-points span {
    display: block;
}

.mts-product-service-points strong {
    color: #ffffff;
    font-size: 10px;
}

.mts-product-service-points span {
    margin-top: 6px;
    color: #78858c;
    font-size: 9px;
    line-height: 1.5;
}

.mts-product-information {
    display: grid;
    grid-template-columns: 1.15fr 1fr .72fr;
    gap: 16px;
    margin-top: 55px;
}

.mts-product-information > section,
.mts-product-information > aside {
    padding: 27px;
    background: #101518;
    border: 1px solid #323a3f;
    border-radius: 7px;
}

.mts-product-information > section > span,
.mts-product-information > aside > span {
    color: var(--orange);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.5px;
}

.mts-product-information h2 {
    margin: 9px 0 20px;
    color: #ffffff;
}

.mts-product-description-card p,
.mts-product-help-card p {
    color: #9da8ae;
    font-size: 12px;
    line-height: 1.7;
}

.mts-product-applications {
    margin-top: 24px;
}

.mts-product-applications strong {
    color: #ffffff;
    font-size: 11px;
}

.mts-product-applications ul {
    padding-left: 18px;
    color: #9da8ae;
    font-size: 11px;
    line-height: 1.7;
}

.mts-product-specification-card dl {
    margin: 0;
}

.mts-product-specification-card dl > div {
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 18px;
    padding: 12px 0;
    border-bottom: 1px solid #2c3438;
}

.mts-product-specification-card dt {
    color: #7f8b91;
    font-size: 10px;
    font-weight: 800;
}

.mts-product-specification-card dd {
    margin: 0;
    color: #ffffff;
    font-size: 11px;
}

.mts-product-help-card {
    border-top: 3px solid var(--orange) !important;
}

.mts-product-help-card > a {
    color: var(--orange);
    text-decoration: none;
    font-size: 11px;
    font-weight: 900;
}

.mts-product-help-card hr {
    margin: 25px 0;
    border: 0;
    border-top: 1px solid #30383d;
}

.mts-product-help-card > strong {
    color: #ffffff;
    font-size: 12px;
}

.mts-related-products {
    padding: 65px 0 75px;
    background: #090c0e;
    border-top: 1px solid #293035;
}

.mts-related-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 25px;
    margin-bottom: 28px;
}

.mts-related-heading span {
    color: var(--orange);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.5px;
}

.mts-related-heading h2 {
    margin: 8px 0 0;
    color: #ffffff;
    font-size: 38px;
}

.mts-related-heading > a {
    color: #c6cdd1;
    text-decoration: none;
    font-size: 10px;
}

.mts-related-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 13px;
}

.mts-related-card {
    overflow: hidden;
    background: #111619;
    border: 1px solid #343c41;
}

.mts-related-card:hover {
    border-color: var(--orange);
}

.mts-related-image {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 270px;
    background: #ffffff;
}

.mts-related-image img {
    width: 100%;
    height: 270px;
    padding: 20px;
    object-fit: contain;
}

.mts-related-image > div {
    text-align: center;
}

.mts-related-image > div span,
.mts-related-image > div strong {
    display: block;
}

.mts-related-image > div span {
    color: var(--orange);
    font-size: 9px;
}

.mts-related-image > div strong {
    margin-top: 7px;
    color: #283036;
}

.mts-related-content {
    padding: 17px;
}

.mts-related-content > span {
    color: #7d8a91;
    font-size: 8px;
    font-weight: 900;
    text-transform: uppercase;
}

.mts-related-name {
    display: block;
    min-height: 45px;
    margin-top: 7px;
    color: #ffffff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 900;
    line-height: 1.3;
}

.mts-related-content > small {
    color: #748087;
    font-size: 9px;
}

.mts-related-price {
    margin-top: 15px;
    padding: 10px;
    background: #0a0e10;
    border: 1px solid #30383d;
}

.mts-related-price span,
.mts-related-price strong {
    display: block;
}

.mts-related-price span {
    color: var(--orange);
    font-size: 8px;
    font-weight: 900;
}

.mts-related-price strong {
    margin-top: 5px;
    color: #ffffff;
    font-size: 10px;
}

.mts-related-link {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    margin-top: 10px;
    color: #ffffff;
    text-decoration: none;
    background: var(--orange);
    font-size: 10px;
    font-weight: 900;
}

@media (max-width: 1050px) {
    .mts-product-main {
        grid-template-columns: 1fr;
    }

    .mts-product-information {
        grid-template-columns: 1fr 1fr;
    }

    .mts-product-help-card {
        grid-column: 1 / -1;
    }

    .mts-related-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 680px) {
    .mts-product-main-image {
        min-height: 380px;
    }

    .mts-product-main-image img {
        height: 380px;
        padding: 18px;
    }

    .mts-product-summary h1 {
        font-size: 42px;
    }

    .mts-trade-price-lock,
    .mts-stock-heading {
        display: block;
    }

    .mts-trade-price-lock > a {
        display: inline-block;
        margin-top: 16px;
    }

    .mts-stock-total {
        margin-top: 15px;
        text-align: left;
    }

    .mts-product-service-points,
    .mts-product-information,
    .mts-related-grid {
        grid-template-columns: 1fr;
    }

    .mts-product-help-card {
        grid-column: auto;
    }

    .mts-product-specification-card dl > div {
        grid-template-columns: 1fr;
        gap: 4px;
    }
}

/* =========================================================
   METRO SUPPLIER BRAND UPGRADE
   ========================================================= */

.mts-brand-hero {
    padding: 82px 0 76px;
    background:
        radial-gradient(circle at 82% 20%, rgba(255, 92, 0, .12), transparent 36%),
        linear-gradient(115deg, #071322, #083348);
    border-bottom: 1px solid #26323a;
}

.mts-brand-hero span,
.mts-brand-directory-heading span {
    color: var(--orange);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 2px;
}

.mts-brand-hero h1 {
    max-width: 900px;
    margin: 13px 0 14px;
    color: #fff;
    font-size: clamp(46px, 6vw, 78px);
    line-height: .98;
    letter-spacing: -2px;
}

.mts-brand-hero p {
    max-width: 680px;
    margin: 0;
    color: #b4c0c7;
    font-size: 15px;
    line-height: 1.7;
}

.mts-brand-directory {
    padding: 70px 0 88px;
    background: #050708;
}

.mts-brand-directory-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 31px;
}

.mts-brand-directory-heading h2 {
    margin: 8px 0 0;
    color: #fff;
    font-size: clamp(30px, 4vw, 46px);
}

.mts-brand-directory-heading p {
    max-width: 330px;
    margin: 0;
    color: #7f8a91;
    text-align: right;
    font-size: 11px;
    line-height: 1.6;
}

.mts-brand-showcase-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 17px;
}

.mts-brand-showcase-card {
    overflow: hidden;
    background: #101518;
    border: 1px solid #303940;
    border-radius: 7px;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.mts-brand-showcase-card:hover {
    transform: translateY(-4px);
    border-color: var(--orange);
    box-shadow: 0 18px 40px rgba(0, 0, 0, .28);
}

.mts-brand-logo-stage {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 235px;
    padding: 28px;
    background: radial-gradient(circle at 50% 40%, #fff, #e9eef2);
    border-bottom: 1px solid #303940;
}

.mts-brand-logo-stage img {
    display: block;
    max-width: 88%;
    max-height: 160px;
    object-fit: contain;
}

.mts-brand-wordmark {
    color: #111820;
    font-size: 34px;
    font-weight: 950;
    text-align: center;
    letter-spacing: -1px;
}

.mts-brand-card-body {
    padding: 23px;
}

.mts-brand-card-body span {
    color: var(--orange);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 1.6px;
}

.mts-brand-card-body h3 {
    margin: 7px 0 0;
    color: #fff;
    font-size: 25px;
}

.mts-brand-card-body > strong {
    display: inline-block;
    margin-top: 16px;
    padding: 6px 9px;
    color: #d8e0e4;
    background: #090d0f;
    border: 1px solid #2f383d;
    font-size: 10px;
}

.mts-brand-card-body p {
    min-height: 62px;
    margin: 16px 0 20px;
    color: #8d999f;
    font-size: 11px;
    line-height: 1.65;
}

.mts-brand-range-link {
    color: var(--orange);
    text-decoration: none;
    font-size: 11px;
    font-weight: 900;
}

.mts-home-brands {
    padding: 56px 0 62px;
    background: #0b1013;
    border-top: 1px solid #253038;
    border-bottom: 1px solid #253038;
}

.mts-home-brand-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 13px;
}

.mts-home-brand-card {
    display: grid;
    grid-template-columns: 135px 1fr auto;
    align-items: center;
    gap: 18px;
    min-height: 118px;
    padding: 15px 18px;
    color: #fff;
    text-decoration: none;
    background: #11171a;
    border: 1px solid #303a40;
    transition: transform .2s ease, border-color .2s ease;
}

.mts-home-brand-card:hover {
    transform: translateY(-3px);
    border-color: var(--orange);
}

.mts-home-brand-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 86px;
    padding: 9px;
    background: #fff;
}

.mts-home-brand-logo img {
    max-width: 100%;
    max-height: 70px;
    object-fit: contain;
}

.mts-home-brand-logo strong {
    color: #111820;
    text-align: center;
    font-size: 18px;
}

.mts-home-brand-card > div:nth-child(2) strong,
.mts-home-brand-card > div:nth-child(2) span {
    display: block;
}

.mts-home-brand-card > div:nth-child(2) strong {
    font-size: 16px;
}

.mts-home-brand-card > div:nth-child(2) span {
    margin-top: 6px;
    color: #7f8c93;
    font-size: 10px;
}

.mts-home-brand-card small {
    color: var(--orange);
    white-space: nowrap;
    font-size: 9px;
    font-weight: 900;
}

.mts-product-card,
.mts-related-card {
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.mts-product-card:hover,
.mts-related-card:hover {
    transform: translateY(-4px);
    border-color: var(--orange);
    box-shadow: 0 15px 32px rgba(0, 0, 0, .25);
}

.mts-product-card img,
.mts-related-card img {
    transition: transform .24s ease;
}

.mts-product-card:hover img,
.mts-related-card:hover img {
    transform: scale(1.035);
}

@media (min-width: 951px) {
    .mts-catalogue-sidebar,
    .metro-product-sidebar,
    .product-filter-sidebar {
        position: sticky;
        top: 135px;
        align-self: start;
        max-height: calc(100vh - 155px);
        overflow: auto;
    }
}

@media (max-width: 980px) {
    .mts-brand-showcase-grid,
    .mts-home-brand-grid {
        grid-template-columns: 1fr;
    }

    .mts-brand-directory-heading {
        display: block;
    }

    .mts-brand-directory-heading p {
        margin-top: 12px;
        text-align: left;
    }
}

@media (max-width: 620px) {
    .mts-brand-hero {
        padding: 58px 0 52px;
    }

    .mts-brand-logo-stage {
        height: 190px;
    }

    .mts-home-brand-card {
        grid-template-columns: 95px 1fr;
    }

    .mts-home-brand-card small {
        grid-column: 1 / -1;
    }
}


/* =========================================================
   METRO TRADE ACCOUNT PAGE REBUILD
   ========================================================= */

.mts-account-hero {
    padding: 72px 0 64px;
    background:
        radial-gradient(
            circle at 82% 45%,
            rgba(255, 92, 0, .08),
            transparent 35%
        ),
        linear-gradient(
            115deg,
            #07131e,
            #091219
        );
    border-bottom: 1px solid #2b3338;
}

.mts-account-eyebrow {
    display: block;
    color: var(--orange);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 2px;
}

.mts-account-hero h1 {
    max-width: 900px;
    margin: 14px 0 14px;
    color: #ffffff;
    font-size: clamp(46px, 6vw, 74px);
    line-height: .98;
    letter-spacing: -2.5px;
}

.mts-account-hero p {
    max-width: 760px;
    margin: 0;
    color: #b3bec4;
    font-size: 15px;
    line-height: 1.7;
}

.mts-account-section {
    padding: 58px 0 80px;
    background: #050708;
}

.mts-account-grid {
    display: grid;
    grid-template-columns:
        minmax(0, .95fr)
        minmax(520px, 1.05fr);
    gap: 52px;
    align-items: start;
}

.mts-account-benefits {
    padding-top: 28px;
}

.mts-account-benefits h2 {
    max-width: 520px;
    margin: 11px 0 24px;
    color: #ffffff;
    font-size: clamp(35px, 4vw, 53px);
    line-height: 1.02;
    letter-spacing: -1.6px;
}

.mts-benefit-list {
    display: grid;
    gap: 12px;
}

.mts-benefit-card {
    display: grid;
    grid-template-columns: 54px 1fr;
    gap: 17px;
    align-items: center;
    min-height: 102px;
    padding: 18px 20px;
    background:
        linear-gradient(
            135deg,
            #11171a,
            #0d1215
        );
    border: 1px solid #303a40;
    border-radius: 8px;
}

.mts-benefit-card:hover {
    border-color: var(--orange);
}

.mts-benefit-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 47px;
    height: 47px;
    color: var(--orange);
    border: 2px solid var(--orange);
    border-radius: 9px;
    font-size: 21px;
    font-weight: 900;
}

.mts-benefit-card h3 {
    margin: 0;
    color: #ffffff;
    font-size: 17px;
}

.mts-benefit-card p {
    margin: 6px 0 0;
    color: #a4afb5;
    font-size: 12px;
    line-height: 1.55;
}

.mts-account-form-card {
    padding: 31px;
    color: #111820;
    background: #ffffff;
    border: 1px solid #d5dade;
    border-radius: 12px;
    box-shadow:
        0 24px 55px
        rgba(0, 0, 0, .34);
}

.mts-account-form-header h2 {
    margin: 0;
    color: #111820;
    font-size: 35px;
    line-height: 1.05;
    letter-spacing: -1.1px;
}

.mts-account-form-header p {
    margin: 11px 0 25px;
    color: #58656d;
    font-size: 12px;
    line-height: 1.6;
}

.mts-account-form {
    color: #111820;
}

.mts-account-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 17px 16px;
}

.mts-form-field-full {
    grid-column: 1 / -1;
}

.mts-form-field label {
    display: block;
    margin-bottom: 7px;
    color: #151d22;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .25px;
    text-transform: uppercase;
}

.mts-form-field input,
.mts-form-field select {
    width: 100%;
    height: 49px;
    padding: 0 14px;
    box-sizing: border-box;
    color: #172027;
    background: #f7f9fa;
    border: 1px solid #c5cfd4;
    border-radius: 6px;
    font-family: inherit;
    font-size: 13px;
}

.mts-form-field input::placeholder {
    color: #7a858b;
}

.mts-form-field input:focus,
.mts-form-field select:focus {
    outline: none;
    background: #ffffff;
    border-color: var(--orange);
    box-shadow:
        0 0 0 3px
        rgba(255, 92, 0, .13);
}

.mts-account-security {
    display: grid;
    grid-template-columns: 50px 1fr;
    gap: 14px;
    align-items: center;
    margin-top: 22px;
    padding: 17px;
    color: #172027;
    background:
        linear-gradient(
            135deg,
            #fff5ec,
            #fff0e2
        );
    border: 1px solid #ffd2b2;
    border-radius: 8px;
}

.mts-security-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    color: var(--orange);
    border: 2px solid var(--orange);
    border-radius: 50%;
    font-size: 20px;
    font-weight: 900;
}

.mts-account-security strong,
.mts-account-security span {
    display: block;
}

.mts-account-security strong {
    color: #172027;
    font-size: 12px;
}

.mts-account-security span {
    margin-top: 4px;
    color: #5b676d;
    font-size: 10px;
    line-height: 1.5;
}

.mts-account-submit {
    width: 100%;
    min-height: 51px;
    margin-top: 14px;
    color: #ffffff;
    cursor: pointer;
    background:
        linear-gradient(
            90deg,
            #ff5a00,
            #ff6d00
        );
    border: 0;
    border-radius: 6px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 900;
}

.mts-account-submit:hover {
    filter: brightness(1.07);
}

.mts-account-secure-note {
    margin-top: 11px;
    color: #667178;
    text-align: center;
    font-size: 9px;
}

@media (max-width: 1050px) {
    .mts-account-grid {
        grid-template-columns: 1fr;
    }

    .mts-account-benefits {
        padding-top: 0;
    }
}

@media (max-width: 650px) {
    .mts-account-hero {
        padding: 54px 0 48px;
    }

    .mts-account-section {
        padding: 40px 0 60px;
    }

    .mts-account-form-card {
        padding: 21px;
    }

    .mts-account-form-grid {
        grid-template-columns: 1fr;
    }

    .mts-form-field-full {
        grid-column: auto;
    }

    .mts-benefit-card {
        grid-template-columns: 44px 1fr;
        padding: 15px;
    }

    .mts-benefit-icon {
        width: 39px;
        height: 39px;
        font-size: 17px;
    }
}


/* =========================================================
   METRO TRADE ACCOUNT PAGE FINAL CONTRAST OVERRIDES
   ========================================================= */

.mts-account-form-card,
.mts-account-form-card * {
    text-shadow: none;
}

.mts-account-form-card h1,
.mts-account-form-card h2,
.mts-account-form-card h3,
.mts-account-form-card h4 {
    color: #111820 !important;
}

.mts-account-form-card p,
.mts-account-form-card span,
.mts-account-form-card strong,
.mts-account-form-card label {
    opacity: 1;
}

.mts-account-form-card label {
    color: #151d22 !important;
}

.mts-account-form-card input,
.mts-account-form-card select {
    color: #172027 !important;
    background: #f7f9fa !important;
}

.mts-account-form-card input::placeholder {
    color: #7a858b !important;
    opacity: 1;
}

.mts-benefit-card h3 {
    color: #ffffff !important;
}

.mts-benefit-card p {
    color: #a4afb5 !important;
}


/* =========================================================
   METRO TRADE ACCOUNT FINAL POLISH
   ========================================================= */

.mts-account-hero-grid {
    display: grid;
    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(390px, .85fr);
    gap: 60px;
    align-items: center;
}

.mts-account-hero-copy {
    max-width: 760px;
}

.mts-account-hero-benefits {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.mts-account-hero-benefits article {
    display: grid;
    grid-template-columns: 37px 1fr;
    gap: 12px;
    align-items: center;
    min-height: 76px;
    padding: 14px;
    background:
        linear-gradient(
            135deg,
            rgba(18, 25, 29, .94),
            rgba(9, 13, 15, .94)
        );
    border: 1px solid #323c42;
    border-radius: 6px;
}

.mts-account-hero-benefits article > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
    color: var(--orange);
    border: 1px solid var(--orange);
    border-radius: 50%;
    font-size: 9px;
    font-weight: 900;
}

.mts-account-hero-benefits strong,
.mts-account-hero-benefits small {
    display: block;
}

.mts-account-hero-benefits strong {
    color: #ffffff;
    font-size: 11px;
}

.mts-account-hero-benefits small {
    margin-top: 5px;
    color: #89959b;
    font-size: 8px;
    line-height: 1.45;
}

.mts-benefit-card {
    position: relative;
    overflow: hidden;
    transition:
        transform .2s ease,
        border-color .2s ease,
        box-shadow .2s ease;
}

.mts-benefit-card::after {
    position: absolute;
    top: 0;
    right: -65px;
    width: 120px;
    height: 100%;
    content: "";
    opacity: 0;
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255, 92, 0, .09)
        );
    transform: skewX(-18deg);
    transition:
        opacity .2s ease,
        right .25s ease;
}

.mts-benefit-card:hover {
    transform: translateY(-3px);
    border-color: var(--orange);
    box-shadow:
        0 15px 32px
        rgba(0, 0, 0, .25);
}

.mts-benefit-card:hover::after {
    right: 0;
    opacity: 1;
}

.mts-account-form-card {
    padding: 36px;
    background:
        linear-gradient(
            155deg,
            #fbfcfd,
            #f1f4f6
        );
    border-color: #cfd6da;
}

.mts-account-form-header > span {
    display: block;
    margin-bottom: 8px;
    color: #d24b00;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.6px;
}

.mts-account-form-grid {
    gap: 21px 18px;
}

.mts-form-field input,
.mts-form-field select {
    height: 53px;
    padding: 0 15px;
    background: #ffffff !important;
}

.mts-account-security {
    margin-top: 25px;
    padding: 19px;
}

.mts-account-submit {
    min-height: 57px;
    margin-top: 17px;
    border-radius: 7px;
    box-shadow:
        0 9px 22px
        rgba(255, 92, 0, .22);
    transition:
        transform .18s ease,
        box-shadow .18s ease,
        filter .18s ease;
}

.mts-account-submit:hover {
    transform: translateY(-2px);
    filter: brightness(1.06);
    box-shadow:
        0 13px 28px
        rgba(255, 92, 0, .3);
}

.mts-account-trust-strip {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin-top: 15px;
    color: #59666d;
    flex-wrap: wrap;
    font-size: 8px;
    font-weight: 750;
}

.mts-account-trust-strip span {
    color: #59666d !important;
}

@media (max-width: 1100px) {
    .mts-account-hero-grid {
        grid-template-columns: 1fr;
    }

    .mts-account-hero-benefits {
        max-width: 760px;
    }
}

@media (max-width: 650px) {
    .mts-account-hero-benefits {
        grid-template-columns: 1fr;
    }

    .mts-account-form-card {
        padding: 22px;
    }

    .mts-account-trust-strip {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }
}

/* =========================================================
   METRO ENHANCED PRODUCT PAGES V1
   ========================================================= */

.mts-product-v3 {
    padding: 34px 0 72px;
    background: #050708;
}

.mts-product-v3-breadcrumbs {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 26px;
    color: #7e8a91;
    flex-wrap: wrap;
    font-size: 9px;
}

.mts-product-v3-breadcrumbs a {
    color: #c0c9cd;
    text-decoration: none;
}

.mts-product-v3-breadcrumbs a:hover {
    color: var(--orange);
}

.mts-product-v3-layout {
    display: grid;
    grid-template-columns:
        minmax(440px, .93fr)
        minmax(0, 1.07fr);
    gap: 50px;
    align-items: start;
}

.mts-product-v3-image-stage {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 610px;
    overflow: hidden;
    background: #fff;
    border: 1px solid #343c41;
    border-radius: 9px;
}

.mts-product-v3-image-stage img {
    width: 100%;
    height: 610px;
    padding: 30px;
    object-fit: contain;
    transition: transform .25s ease;
}

.mts-product-v3-image-stage:hover img {
    transform: scale(1.025);
}

.mts-product-v3-zoom {
    position: absolute;
    right: 13px;
    bottom: 13px;
    z-index: 2;
    padding: 10px 13px;
    color: #fff;
    cursor: pointer;
    background: rgba(9, 13, 15, .88);
    border: 1px solid #4b555a;
    border-radius: 4px;
    font-size: 9px;
    font-weight: 900;
}

.mts-product-v3-placeholder {
    text-align: center;
}

.mts-product-v3-placeholder span,
.mts-product-v3-placeholder strong,
.mts-product-v3-placeholder small {
    display: block;
}

.mts-product-v3-placeholder span {
    color: var(--orange);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.8px;
}

.mts-product-v3-placeholder strong {
    margin-top: 11px;
    color: #1b2429;
    font-size: 32px;
}

.mts-product-v3-placeholder small {
    margin-top: 9px;
    color: #667178;
}

.mts-product-v3-gallery-footer {
    display: grid;
    grid-template-columns: 92px 1fr;
    gap: 11px;
    margin-top: 11px;
}

.mts-product-v3-thumbnail {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 88px;
    padding: 5px;
    background: #fff;
    border: 2px solid var(--orange);
    border-radius: 5px;
}

.mts-product-v3-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.mts-product-v3-thumbnail span {
    color: #20292e;
    font-size: 8px;
    font-weight: 900;
}

.mts-product-v3-gallery-note {
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 15px 18px;
    background: #101518;
    border: 1px solid #303940;
    border-radius: 5px;
}

.mts-product-v3-gallery-note strong {
    color: #fff;
    font-size: 10px;
}

.mts-product-v3-gallery-note span {
    margin-top: 5px;
    color: #7f8b91;
    font-size: 9px;
    line-height: 1.5;
}

.mts-product-v3-badges {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.mts-product-v3-badges a {
    padding: 7px 10px;
    color: #fff;
    text-decoration: none;
    background: var(--orange);
    border-radius: 3px;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.mts-product-v3-badges a.supplier {
    color: #d9e0e4;
    background: #12181b;
    border: 1px solid #384146;
}

.mts-product-v3-summary h1 {
    margin: 20px 0 12px;
    color: #fff;
    font-size: clamp(43px, 5vw, 68px);
    line-height: .98;
    letter-spacing: -2px;
}

.mts-product-v3-code {
    color: #818d93;
    font-size: 10px;
}

.mts-product-v3-code strong {
    color: #dbe1e4;
}

.mts-product-v3-short-description {
    margin-top: 24px;
    color: #bbc4c9;
    font-size: 14px;
    line-height: 1.7;
}

.mts-product-v3-pricing {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 24px;
    padding: 22px;
    background: #111619;
    border: 1px solid #353e43;
    border-left: 4px solid var(--orange);
    border-radius: 6px;
}

.mts-product-v3-pricing span,
.mts-product-v3-pricing strong,
.mts-product-v3-pricing small {
    display: block;
}

.mts-product-v3-pricing span {
    color: var(--orange);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 1.4px;
}

.mts-product-v3-pricing strong {
    margin-top: 6px;
    color: #fff;
    font-size: 17px;
}

.mts-product-v3-pricing small {
    margin-top: 5px;
    color: #869198;
    font-size: 9px;
}

.mts-product-v3-pricing > a {
    padding: 13px 17px;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
    background: var(--orange);
    border-radius: 4px;
    font-size: 10px;
    font-weight: 900;
}

.mts-product-v3-stock {
    margin-top: 15px;
    padding: 21px;
    border-radius: 6px;
}

.mts-product-v3-stock.available {
    background: #10180d;
    border: 1px solid #365125;
}

.mts-product-v3-stock.contact {
    background: #121614;
    border: 1px solid #3b433e;
}

.mts-product-v3-stock-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.mts-product-v3-stock-heading span,
.mts-product-v3-stock-heading strong {
    display: block;
}

.mts-product-v3-stock-heading span {
    color: #98df15;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 1.3px;
}

.mts-product-v3-stock-heading strong {
    margin-top: 6px;
    color: #fff;
}

.mts-product-v3-stock-total {
    text-align: right;
}

.mts-product-v3-stock-total strong {
    margin: 0;
    color: #98df15;
    font-size: 24px;
}

.mts-product-v3-stock-total span {
    margin-top: 3px;
    color: #acb7bc;
}

.mts-product-v3-warehouse-list {
    margin-top: 15px;
    border-top: 1px solid #2d3d23;
}

.mts-product-v3-warehouse-list > div {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 10px 0;
    color: #a8b2b7;
    border-bottom: 1px solid #25321e;
    font-size: 9px;
}

.mts-product-v3-warehouse-list strong.available {
    color: #98df15;
}

.mts-product-v3-stock p {
    color: #8f9a9f;
    font-size: 10px;
}

.mts-product-v3-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 17px;
}

.mts-product-v3-actions a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 49px;
    padding: 0 16px;
    text-align: center;
    text-decoration: none;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 900;
}

.mts-product-v3-actions a.primary {
    color: #fff;
    background: var(--orange);
}

.mts-product-v3-actions a.secondary {
    color: #fff;
    border: 1px solid #d2d9dc;
}

.mts-product-v3-service-strip {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-top: 20px;
}

.mts-product-v3-service-strip article {
    padding: 14px;
    background: #0e1315;
    border: 1px solid #2b3338;
}

.mts-product-v3-service-strip strong,
.mts-product-v3-service-strip span {
    display: block;
}

.mts-product-v3-service-strip strong {
    color: #fff;
    font-size: 9px;
}

.mts-product-v3-service-strip span {
    margin-top: 5px;
    color: #77848a;
    font-size: 8px;
    line-height: 1.5;
}

.mts-product-v3-tabs {
    margin-top: 56px;
    overflow: hidden;
    background: #101518;
    border: 1px solid #303940;
    border-radius: 7px;
}

.mts-product-v3-tab-buttons {
    display: flex;
    overflow-x: auto;
    background: #080c0e;
    border-bottom: 1px solid #303940;
}

.mts-product-v3-tab-buttons button {
    min-height: 54px;
    padding: 0 24px;
    color: #8c989e;
    cursor: pointer;
    background: transparent;
    border: 0;
    border-bottom: 3px solid transparent;
    font-family: inherit;
    font-size: 10px;
    font-weight: 900;
}

.mts-product-v3-tab-buttons button.active {
    color: #fff;
    border-bottom-color: var(--orange);
}

.mts-product-v3-tab-panel {
    display: none;
    padding: 31px;
}

.mts-product-v3-tab-panel.active {
    display: block;
}

.mts-product-v3-panel-heading span {
    color: var(--orange);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 1.5px;
}

.mts-product-v3-panel-heading h2 {
    margin: 8px 0 20px;
    color: #fff;
    font-size: 30px;
}

.mts-product-v3-tab-panel > p {
    max-width: 930px;
    color: #9da8ae;
    font-size: 12px;
    line-height: 1.75;
}

.mts-product-v3-applications,
.mts-product-v3-support-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-top: 25px;
}

.mts-product-v3-applications article,
.mts-product-v3-support-grid article {
    padding: 19px;
    background: #0a0e10;
    border: 1px solid #2c3439;
    border-top: 3px solid var(--orange);
}

.mts-product-v3-applications strong,
.mts-product-v3-applications span {
    display: block;
}

.mts-product-v3-applications strong,
.mts-product-v3-support-grid strong {
    color: #fff;
    font-size: 11px;
}

.mts-product-v3-applications span,
.mts-product-v3-support-grid p {
    margin-top: 7px;
    color: #879399;
    font-size: 10px;
    line-height: 1.6;
}

.mts-product-v3-specifications {
    max-width: 900px;
    margin: 0;
}

.mts-product-v3-specifications > div {
    display: grid;
    grid-template-columns: 230px 1fr;
    gap: 25px;
    padding: 14px 0;
    border-bottom: 1px solid #2d353a;
}

.mts-product-v3-specifications dt {
    color: #7f8b91;
    font-size: 10px;
    font-weight: 800;
}

.mts-product-v3-specifications dd {
    margin: 0;
    color: #fff;
    font-size: 11px;
}

.mts-product-v3-downloads {
    display: grid;
    gap: 10px;
    max-width: 850px;
}

.mts-product-v3-downloads article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    padding: 18px;
    background: #0a0e10;
    border: 1px solid #2f383d;
}

.mts-product-v3-downloads strong,
.mts-product-v3-downloads span {
    display: block;
}

.mts-product-v3-downloads strong {
    color: #fff;
    font-size: 11px;
}

.mts-product-v3-downloads span {
    margin-top: 5px;
    color: #7f8b91;
    font-size: 9px;
}

.mts-product-v3-downloads button {
    padding: 9px 13px;
    color: #77838a;
    background: #141a1d;
    border: 1px solid #343d42;
    font-size: 8px;
}

.mts-product-v3-download-note {
    margin-top: 17px !important;
    color: #77848a !important;
    font-size: 9px !important;
}

.mts-product-v3-support-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 47px;
    margin-top: 20px;
    padding: 0 19px;
    color: #fff;
    text-decoration: none;
    background: var(--orange);
    border-radius: 4px;
    font-size: 10px;
    font-weight: 900;
}

.mts-product-v3-related {
    padding: 62px 0 75px;
    background: #090c0e;
    border-top: 1px solid #293035;
}

.mts-product-v3-related-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 25px;
    margin-bottom: 27px;
}

.mts-product-v3-related-heading span {
    color: var(--orange);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 1.5px;
}

.mts-product-v3-related-heading h2 {
    margin: 7px 0 0;
    color: #fff;
    font-size: 37px;
}

.mts-product-v3-related-heading > a {
    color: #c2cbd0;
    text-decoration: none;
    font-size: 9px;
}

.mts-product-v3-related-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 13px;
}

.mts-product-v3-related-card {
    overflow: hidden;
    background: #111619;
    border: 1px solid #343c41;
    transition:
        transform .18s ease,
        border-color .18s ease;
}

.mts-product-v3-related-card:hover {
    transform: translateY(-4px);
    border-color: var(--orange);
}

.mts-product-v3-related-image {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 270px;
    background: #fff;
}

.mts-product-v3-related-image img {
    width: 100%;
    height: 270px;
    padding: 20px;
    object-fit: contain;
    transition: transform .23s ease;
}

.mts-product-v3-related-card:hover img {
    transform: scale(1.035);
}

.mts-product-v3-related-image > div {
    text-align: center;
}

.mts-product-v3-related-image span,
.mts-product-v3-related-image strong {
    display: block;
}

.mts-product-v3-related-image span {
    color: var(--orange);
    font-size: 8px;
}

.mts-product-v3-related-image strong {
    margin-top: 7px;
    color: #273036;
}

.mts-product-v3-related-content {
    padding: 17px;
}

.mts-product-v3-related-content > span {
    color: #7c8990;
    font-size: 8px;
    font-weight: 900;
    text-transform: uppercase;
}

.mts-product-v3-related-content .name {
    display: block;
    min-height: 45px;
    margin-top: 7px;
    color: #fff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 900;
    line-height: 1.3;
}

.mts-product-v3-related-content > small {
    color: #748087;
    font-size: 8px;
}

.mts-product-v3-related-content .price {
    margin-top: 14px;
    padding: 10px;
    background: #090d0f;
    border: 1px solid #30383d;
}

.mts-product-v3-related-content .price span,
.mts-product-v3-related-content .price strong {
    display: block;
}

.mts-product-v3-related-content .price span {
    color: var(--orange);
    font-size: 7px;
    font-weight: 900;
}

.mts-product-v3-related-content .price strong {
    margin-top: 5px;
    color: #fff;
    font-size: 9px;
}

.mts-product-v3-related-content .view {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    margin-top: 10px;
    color: #fff;
    text-decoration: none;
    background: var(--orange);
    font-size: 9px;
    font-weight: 900;
}

.mts-product-v3-lightbox {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 35px;
    background: rgba(0, 0, 0, .92);
}

.mts-product-v3-lightbox.open {
    display: flex;
}

.mts-product-v3-lightbox img {
    max-width: 92vw;
    max-height: 88vh;
    padding: 20px;
    background: #fff;
    object-fit: contain;
}

.mts-product-v3-lightbox button {
    position: absolute;
    top: 18px;
    right: 24px;
    color: #fff;
    cursor: pointer;
    background: transparent;
    border: 0;
    font-size: 42px;
}

@media (max-width: 1050px) {
    .mts-product-v3-layout {
        grid-template-columns: 1fr;
    }

    .mts-product-v3-related-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 700px) {
    .mts-product-v3-image-stage {
        min-height: 375px;
    }

    .mts-product-v3-image-stage img {
        height: 375px;
        padding: 17px;
    }

    .mts-product-v3-summary h1 {
        font-size: 40px;
    }

    .mts-product-v3-pricing,
    .mts-product-v3-stock-heading {
        display: block;
    }

    .mts-product-v3-pricing > a {
        display: inline-block;
        margin-top: 15px;
    }

    .mts-product-v3-actions,
    .mts-product-v3-service-strip,
    .mts-product-v3-applications,
    .mts-product-v3-support-grid,
    .mts-product-v3-related-grid {
        grid-template-columns: 1fr;
    }

    .mts-product-v3-stock-total {
        margin-top: 14px;
        text-align: left;
    }

    .mts-product-v3-specifications > div {
        grid-template-columns: 1fr;
        gap: 5px;
    }

    .mts-product-v3-downloads article {
        align-items: flex-start;
        flex-direction: column;
    }

    .mts-product-v3-tab-panel {
        padding: 21px;
    }
}


/* =========================================================
   METRO DARK PAGE CONTRAST FIX
   Contact, Quote and Product Catalogue
   ========================================================= */


/* Shared internal-page hero */

.mts-standard-hero {
    padding: 74px 0 68px;
    background:
        radial-gradient(
            circle at 85% 35%,
            rgba(255, 92, 0, .08),
            transparent 34%
        ),
        linear-gradient(
            115deg,
            #071321,
            #083348
        );
    border-bottom: 1px solid #263139;
}

.mts-standard-hero span {
    color: var(--orange);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 2px;
}

.mts-standard-hero h1 {
    max-width: 950px;
    margin: 13px 0 14px;
    color: #ffffff;
    font-size: clamp(46px, 6vw, 74px);
    line-height: .98;
    letter-spacing: -2px;
}

.mts-standard-hero p {
    max-width: 720px;
    margin: 0;
    color: #b5c0c6;
    font-size: 15px;
    line-height: 1.7;
}


/* =========================================================
   CONTACT PAGE
   ========================================================= */

.mts-contact-v2 {
    padding: 68px 0 82px;
    background: #050708;
}

.mts-contact-v2-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.mts-contact-v2-card {
    min-height: 310px;
    padding: 27px;
    color: #ffffff;
    background:
        linear-gradient(
            145deg,
            #12191d,
            #0b1013
        );
    border: 1px solid #354047;
    border-top: 3px solid var(--orange);
    border-radius: 8px;
    transition:
        transform .2s ease,
        border-color .2s ease,
        box-shadow .2s ease;
}

.mts-contact-v2-card:hover {
    transform: translateY(-4px);
    border-color: var(--orange);
    box-shadow: 0 18px 38px rgba(0, 0, 0, .27);
}

.mts-contact-v2-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    margin-bottom: 22px;
    color: var(--orange);
    border: 2px solid var(--orange);
    border-radius: 10px;
    font-size: 20px;
    font-weight: 900;
}

.mts-contact-v2-card > span {
    color: var(--orange);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.5px;
}

.mts-contact-v2-card h2 {
    margin: 10px 0 14px;
    color: #ffffff !important;
    font-size: 24px;
    line-height: 1.15;
}

.mts-contact-v2-card p {
    min-height: 92px;
    margin: 0;
    color: #a5b0b6 !important;
    font-size: 12px;
    line-height: 1.7;
}

.mts-contact-v2-card a {
    display: inline-block;
    margin-top: 22px;
    color: var(--orange);
    text-decoration: none;
    font-size: 11px;
    font-weight: 900;
}

.mts-contact-v2-details {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 18px;
    border: 1px solid #303940;
}

.mts-contact-v2-details > div {
    padding: 21px;
    background: #0d1215;
    border-right: 1px solid #303940;
}

.mts-contact-v2-details > div:last-child {
    border-right: 0;
}

.mts-contact-v2-details span,
.mts-contact-v2-details strong,
.mts-contact-v2-details small {
    display: block;
}

.mts-contact-v2-details span {
    color: var(--orange);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 1.4px;
}

.mts-contact-v2-details strong {
    margin-top: 7px;
    color: #ffffff;
    font-size: 13px;
}

.mts-contact-v2-details small {
    margin-top: 5px;
    color: #7f8c92;
    font-size: 9px;
}


/* =========================================================
   QUOTE REQUEST PAGE
   ========================================================= */

.mts-quote-v2 {
    padding: 66px 0 84px;
    background: #050708;
}

.mts-quote-v2-grid {
    display: grid;
    grid-template-columns:
        minmax(0, .9fr)
        minmax(520px, 1.1fr);
    gap: 58px;
    align-items: start;
}

.mts-quote-v2-process {
    padding-top: 24px;
}

.mts-quote-v2-process > span {
    color: var(--orange);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.8px;
}

.mts-quote-v2-process > h2 {
    max-width: 520px;
    margin: 11px 0 27px;
    color: #ffffff;
    font-size: clamp(35px, 4vw, 50px);
    line-height: 1.03;
    letter-spacing: -1.3px;
}

.mts-quote-v2-process article {
    display: grid;
    grid-template-columns: 54px 1fr;
    gap: 17px;
    align-items: start;
    margin-bottom: 12px;
    padding: 18px;
    background: #101619;
    border: 1px solid #303a40;
    border-radius: 7px;
}

.mts-quote-v2-process article > strong {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 49px;
    height: 49px;
    color: #ffffff;
    background: #1677c8;
    border-radius: 7px;
    font-size: 13px;
}

.mts-quote-v2-process h3 {
    margin: 2px 0 6px;
    color: #ffffff;
    font-size: 15px;
}

.mts-quote-v2-process p {
    margin: 0;
    color: #8e9aa0;
    font-size: 10px;
    line-height: 1.6;
}

.mts-quote-v2-card {
    padding: 34px;
    color: #ffffff;
    background:
        linear-gradient(
            145deg,
            #12191d,
            #0c1114
        );
    border: 1px solid #39434a;
    border-top: 3px solid var(--orange);
    border-radius: 10px;
    box-shadow: 0 23px 50px rgba(0, 0, 0, .3);
}

.mts-quote-v2-heading > span {
    color: var(--orange);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.5px;
}

.mts-quote-v2-heading h2 {
    margin: 8px 0 9px;
    color: #ffffff;
    font-size: 32px;
}

.mts-quote-v2-heading p {
    margin: 0 0 25px;
    color: #909ca2;
    font-size: 11px;
    line-height: 1.6;
}

.mts-quote-v2-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 19px 16px;
}

.mts-quote-v2-fields .full {
    grid-column: 1 / -1;
}

.mts-quote-v2-form label {
    display: block;
    margin-bottom: 7px;
    color: #ffffff !important;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .35px;
    text-transform: uppercase;
}

.mts-quote-v2-form input,
.mts-quote-v2-form textarea {
    width: 100%;
    box-sizing: border-box;
    color: #e8edef !important;
    background: #0a0f12 !important;
    border: 1px solid #3a454c !important;
    border-radius: 6px;
    font-family: inherit;
    font-size: 12px;
}

.mts-quote-v2-form input {
    height: 50px;
    padding: 0 14px;
}

.mts-quote-v2-form textarea {
    min-height: 155px;
    padding: 14px;
    resize: vertical;
}

.mts-quote-v2-form input::placeholder,
.mts-quote-v2-form textarea::placeholder {
    color: #78858c !important;
    opacity: 1;
}

.mts-quote-v2-form input:focus,
.mts-quote-v2-form textarea:focus {
    outline: none;
    border-color: var(--orange) !important;
    box-shadow: 0 0 0 3px rgba(255, 92, 0, .13);
}

.mts-quote-v2-security {
    margin-top: 20px;
    padding: 14px 16px;
    background: #0a0e10;
    border: 1px solid #303a40;
}

.mts-quote-v2-security strong,
.mts-quote-v2-security span {
    display: block;
}

.mts-quote-v2-security strong {
    color: #ffffff;
    font-size: 10px;
}

.mts-quote-v2-security span {
    margin-top: 5px;
    color: #7f8c92;
    font-size: 9px;
}

.mts-quote-v2-form button {
    width: 100%;
    min-height: 55px;
    margin-top: 14px;
    color: #ffffff;
    cursor: pointer;
    background:
        linear-gradient(
            90deg,
            #ff5800,
            #ff6a00
        );
    border: 0;
    border-radius: 6px;
    font-family: inherit;
    font-size: 12px;
    font-weight: 900;
    box-shadow: 0 10px 23px rgba(255, 92, 0, .22);
}


/* =========================================================
   PRODUCT CATALOGUE DARK CARDS
   ========================================================= */

/*
 * The product catalogue uses several generations of class names.
 * These rules cover the current sidebar, filter panels and cards.
 */

.mts-products-page,
.mts-catalogue-page,
.metro-products-page {
    color: #dce3e6;
    background: #050708;
}

.mts-catalogue-sidebar,
.metro-product-sidebar,
.product-filter-sidebar,
.mts-products-sidebar,
.mts-filter-panel {
    color: #dce3e6 !important;
    background: #101619 !important;
    border-color: #354047 !important;
}

.mts-catalogue-sidebar *,
.metro-product-sidebar *,
.product-filter-sidebar *,
.mts-products-sidebar *,
.mts-filter-panel * {
    color: inherit;
}

.mts-catalogue-sidebar h2,
.mts-catalogue-sidebar h3,
.metro-product-sidebar h2,
.metro-product-sidebar h3,
.product-filter-sidebar h2,
.product-filter-sidebar h3 {
    color: #ffffff !important;
}

.mts-catalogue-sidebar a,
.metro-product-sidebar a,
.product-filter-sidebar a {
    color: #aab5ba !important;
}

.mts-catalogue-sidebar a:hover,
.metro-product-sidebar a:hover,
.product-filter-sidebar a:hover {
    color: var(--orange) !important;
}

.mts-product-card,
.metro-product-card,
.product-card {
    overflow: hidden;
    color: #dce3e6 !important;
    background: #11171a !important;
    border: 1px solid #354047 !important;
    border-radius: 6px;
}

.mts-product-card-content,
.metro-product-card-content,
.product-card-content {
    color: #dce3e6 !important;
    background: #11171a !important;
}

.mts-product-card-content *,
.metro-product-card-content *,
.product-card-content * {
    opacity: 1;
}

.mts-product-card .mts-product-name,
.mts-product-card h2,
.mts-product-card h3,
.metro-product-card h2,
.metro-product-card h3,
.product-card h2,
.product-card h3 {
    color: #ffffff !important;
}

.mts-product-card p,
.mts-product-card small,
.metro-product-card p,
.metro-product-card small,
.product-card p,
.product-card small {
    color: #88959b !important;
}

.mts-product-image,
.metro-product-image,
.product-card-image {
    background: #ffffff !important;
}

.mts-product-image img,
.metro-product-image img,
.product-card-image img {
    object-fit: contain;
}

.mts-product-placeholder {
    color: #ffffff !important;
    background:
        linear-gradient(
            145deg,
            #174d74,
            #0b3150
        ) !important;
}

.mts-price-lock,
.metro-price-lock,
.product-price-lock {
    color: #ffffff !important;
    background: #090d0f !important;
    border: 1px solid #344047 !important;
}

.mts-price-lock span,
.metro-price-lock span,
.product-price-lock span {
    color: var(--orange) !important;
}

.mts-price-lock strong,
.metro-price-lock strong,
.product-price-lock strong {
    color: #ffffff !important;
}

.mts-product-card a,
.metro-product-card a,
.product-card a {
    text-decoration: none;
}

.mts-product-card .mts-enquiry-button,
.metro-product-card .enquiry-button,
.product-card .enquiry-button {
    color: #ffffff !important;
    background: var(--orange) !important;
}

.mts-product-card:hover,
.metro-product-card:hover,
.product-card:hover {
    transform: translateY(-4px);
    border-color: var(--orange) !important;
    box-shadow: 0 16px 34px rgba(0, 0, 0, .28);
}


/*
 * Safety override for remaining light panels on the three affected pages.
 */

.mts-contact-v2 [style*="background: white"],
.mts-contact-v2 [style*="background:#fff"],
.mts-quote-v2 [style*="background: white"],
.mts-quote-v2 [style*="background:#fff"] {
    color: #ffffff !important;
    background: #11171a !important;
}


@media (max-width: 1000px) {
    .mts-contact-v2-grid,
    .mts-contact-v2-details {
        grid-template-columns: 1fr;
    }

    .mts-contact-v2-details > div {
        border-right: 0;
        border-bottom: 1px solid #303940;
    }

    .mts-quote-v2-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .mts-standard-hero {
        padding: 54px 0 49px;
    }

    .mts-quote-v2-card {
        padding: 22px;
    }

    .mts-quote-v2-fields {
        grid-template-columns: 1fr;
    }

    .mts-quote-v2-fields .full {
        grid-column: auto;
    }
}


/* =========================================================
   METRO PRODUCT CATALOGUE – CLEAN LIGHT CARD RESTORE
   Keeps the page dark while making products easy to scan.
   ========================================================= */

.mts-products-page,
.mts-catalogue-page,
.metro-products-page {
    color: #dce3e6;
    background: #050708;
}


/* ---------------------------------------------------------
   Catalogue layout spacing
   --------------------------------------------------------- */

.mts-products-page .mts-product-grid,
.mts-products-page .product-grid,
.mts-products-page .metro-product-grid {
    gap: 14px !important;
}


/* ---------------------------------------------------------
   Filter sidebar
   --------------------------------------------------------- */

.mts-products-page .mts-catalogue-sidebar,
.mts-products-page .metro-product-sidebar,
.mts-products-page .product-filter-sidebar,
.mts-products-page .mts-products-sidebar,
.mts-products-page .mts-filter-panel {
    color: #1c2730 !important;
    background: #f4f7f9 !important;
    border: 1px solid #d6dee3 !important;
    border-radius: 7px !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, .15);
}

.mts-products-page .mts-catalogue-sidebar *,
.mts-products-page .metro-product-sidebar *,
.mts-products-page .product-filter-sidebar *,
.mts-products-page .mts-products-sidebar *,
.mts-products-page .mts-filter-panel * {
    color: inherit;
}

.mts-products-page .mts-catalogue-sidebar h2,
.mts-products-page .mts-catalogue-sidebar h3,
.mts-products-page .metro-product-sidebar h2,
.mts-products-page .metro-product-sidebar h3,
.mts-products-page .product-filter-sidebar h2,
.mts-products-page .product-filter-sidebar h3 {
    color: #111820 !important;
}

.mts-products-page .mts-catalogue-sidebar a,
.mts-products-page .metro-product-sidebar a,
.mts-products-page .product-filter-sidebar a,
.mts-products-page .mts-products-sidebar a,
.mts-products-page .mts-filter-panel a {
    color: #42515b !important;
}

.mts-products-page .mts-catalogue-sidebar a:hover,
.mts-products-page .metro-product-sidebar a:hover,
.mts-products-page .product-filter-sidebar a:hover,
.mts-products-page .mts-products-sidebar a:hover,
.mts-products-page .mts-filter-panel a:hover {
    color: #e64f00 !important;
}

.mts-products-page .mts-catalogue-sidebar input,
.mts-products-page .mts-catalogue-sidebar select,
.mts-products-page .metro-product-sidebar input,
.mts-products-page .metro-product-sidebar select,
.mts-products-page .product-filter-sidebar input,
.mts-products-page .product-filter-sidebar select {
    color: #172027 !important;
    background: #ffffff !important;
    border: 1px solid #cbd5da !important;
}


/* ---------------------------------------------------------
   Product card shell
   --------------------------------------------------------- */

.mts-products-page .mts-product-card,
.mts-products-page .metro-product-card,
.mts-products-page .product-card {
    overflow: hidden;
    color: #172027 !important;
    background: #ffffff !important;
    border: 1px solid #d5dde2 !important;
    border-radius: 7px !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .12);
    transform: none;
    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.mts-products-page .mts-product-card:hover,
.mts-products-page .metro-product-card:hover,
.mts-products-page .product-card:hover {
    transform: translateY(-4px);
    border-color: var(--orange) !important;
    box-shadow: 0 15px 32px rgba(0, 0, 0, .22);
}


/* ---------------------------------------------------------
   Product image area
   --------------------------------------------------------- */

.mts-products-page .mts-product-image,
.mts-products-page .metro-product-image,
.mts-products-page .product-card-image {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 210px;
    overflow: hidden;
    background: #ffffff !important;
    border-bottom: 1px solid #e2e7ea;
}

.mts-products-page .mts-product-image img,
.mts-products-page .metro-product-image img,
.mts-products-page .product-card-image img {
    width: 100%;
    height: 210px;
    padding: 15px;
    object-fit: contain;
    box-sizing: border-box;
    transition: transform .22s ease;
}

.mts-products-page .mts-product-card:hover img,
.mts-products-page .metro-product-card:hover img,
.mts-products-page .product-card:hover img {
    transform: scale(1.035);
}


/* Missing-image placeholder */

.mts-products-page .mts-product-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    min-height: 210px;
    color: #ffffff !important;
    text-align: center;
    background:
        radial-gradient(
            circle at 50% 35%,
            #23638d,
            #123d5e
        ) !important;
}

.mts-products-page .mts-product-placeholder span {
    color: #ff6a00 !important;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 1.5px;
}

.mts-products-page .mts-product-placeholder strong {
    margin-top: 8px;
    color: #ffffff !important;
    font-size: 13px;
}


/* ---------------------------------------------------------
   Product card content
   --------------------------------------------------------- */

.mts-products-page .mts-product-card-content,
.mts-products-page .metro-product-card-content,
.mts-products-page .product-card-content {
    padding: 15px !important;
    color: #172027 !important;
    background: #ffffff !important;
}

.mts-products-page .mts-product-card-content *,
.mts-products-page .metro-product-card-content *,
.mts-products-page .product-card-content * {
    opacity: 1;
}


/* Supplier/category label */

.mts-products-page .mts-stock-label,
.mts-products-page .mts-product-brand,
.mts-products-page .product-brand,
.mts-products-page .product-category {
    color: #537083 !important;
}

.mts-products-page .mts-stock-label {
    font-size: 7px;
    font-weight: 900;
    letter-spacing: 1.1px;
}


/* Product title */

.mts-products-page .mts-product-name,
.mts-products-page .metro-product-name,
.mts-products-page .product-name,
.mts-products-page .mts-product-card h2,
.mts-products-page .mts-product-card h3,
.mts-products-page .metro-product-card h2,
.mts-products-page .metro-product-card h3,
.mts-products-page .product-card h2,
.mts-products-page .product-card h3 {
    color: #111820 !important;
}

.mts-products-page .mts-product-name,
.mts-products-page .metro-product-name,
.mts-products-page .product-name {
    display: block;
    min-height: 47px;
    margin-top: 7px;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.3;
}


/* Product code and supporting copy */

.mts-products-page .mts-product-card p,
.mts-products-page .mts-product-card small,
.mts-products-page .metro-product-card p,
.mts-products-page .metro-product-card small,
.mts-products-page .product-card p,
.mts-products-page .product-card small {
    color: #65747d !important;
}


/* ---------------------------------------------------------
   Trade pricing box
   --------------------------------------------------------- */

.mts-products-page .mts-price-lock,
.mts-products-page .metro-price-lock,
.mts-products-page .product-price-lock {
    margin-top: 13px;
    padding: 10px 11px !important;
    color: #173247 !important;
    background: #edf6fc !important;
    border: 1px solid #c8ddeb !important;
    border-radius: 4px;
}

.mts-products-page .mts-price-lock span,
.mts-products-page .metro-price-lock span,
.mts-products-page .product-price-lock span {
    display: block;
    color: #0874bf !important;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: 1px;
}

.mts-products-page .mts-price-lock strong,
.mts-products-page .metro-price-lock strong,
.mts-products-page .product-price-lock strong {
    display: block;
    margin-top: 4px;
    color: #173247 !important;
    font-size: 9px;
}


/* ---------------------------------------------------------
   Product actions
   --------------------------------------------------------- */

.mts-products-page .mts-enquiry-button,
.mts-products-page .enquiry-button,
.mts-products-page .product-enquiry-button {
    display: flex !important;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    margin-top: 10px;
    color: #ffffff !important;
    text-decoration: none;
    background: var(--orange) !important;
    border-radius: 3px;
    font-size: 9px;
    font-weight: 900;
}

.mts-products-page .mts-enquiry-button:hover,
.mts-products-page .enquiry-button:hover,
.mts-products-page .product-enquiry-button:hover {
    filter: brightness(1.07);
}


/* Links inside cards */

.mts-products-page .mts-product-card a,
.mts-products-page .metro-product-card a,
.mts-products-page .product-card a {
    text-decoration: none;
}


/* Supplier badge */

.mts-products-page .mts-product-card .supplier,
.mts-products-page .mts-product-card .brand-badge,
.mts-products-page .metro-product-card .supplier,
.mts-products-page .product-card .supplier {
    color: #096fae !important;
    background: #edf7fd !important;
    border: 1px solid #bcd9e9 !important;
}


/* ---------------------------------------------------------
   Catalogue toolbar and headings
   --------------------------------------------------------- */

.mts-products-page .mts-section-heading h1,
.mts-products-page .mts-section-heading h2,
.mts-products-page .catalogue-heading h1,
.mts-products-page .catalogue-heading h2,
.mts-products-page .products-heading h1,
.mts-products-page .products-heading h2 {
    color: #ffffff !important;
}

.mts-products-page .catalogue-count,
.mts-products-page .result-count,
.mts-products-page .products-count {
    color: #a5b0b6 !important;
}


/* ---------------------------------------------------------
   Responsive adjustments
   --------------------------------------------------------- */

@media (max-width: 750px) {
    .mts-products-page .mts-product-image,
    .mts-products-page .metro-product-image,
    .mts-products-page .product-card-image,
    .mts-products-page .mts-product-placeholder {
        min-height: 180px;
    }

    .mts-products-page .mts-product-image img,
    .mts-products-page .metro-product-image img,
    .mts-products-page .product-card-image img {
        height: 180px;
    }
}


/* =========================================================
   METRO CATALOGUE V2 – DARK HYBRID DESIGN
   ========================================================= */

.mts-products-page {
    color: #dce3e6;
    background: #050708;
}


/* ---------------------------------------------------------
   Catalogue visibility control
   --------------------------------------------------------- */

.mts-catalogue-visibility-control {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 18px;
    padding: 15px 18px;
    background: #101619;
    border: 1px solid #354047;
    border-left: 3px solid var(--orange);
    border-radius: 5px;
}

.mts-catalogue-visibility-control strong,
.mts-catalogue-visibility-control span {
    display: block;
}

.mts-catalogue-visibility-control strong {
    color: #ffffff;
    font-size: 11px;
}

.mts-catalogue-visibility-control span {
    margin-top: 4px;
    color: #87949a;
    font-size: 9px;
}

.mts-catalogue-visibility-control a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0 13px;
    color: #ffffff;
    text-decoration: none;
    white-space: nowrap;
    background: var(--orange);
    border-radius: 3px;
    font-size: 9px;
    font-weight: 900;
}


/* ---------------------------------------------------------
   Dark category and filter sidebar
   --------------------------------------------------------- */

.mts-products-page .mts-catalogue-sidebar,
.mts-products-page .metro-product-sidebar,
.mts-products-page .product-filter-sidebar,
.mts-products-page .mts-products-sidebar,
.mts-products-page .mts-filter-panel {
    color: #c7d0d4 !important;
    background:
        linear-gradient(
            145deg,
            #12191d,
            #0b1013
        ) !important;
    border: 1px solid #354047 !important;
    border-radius: 7px !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .2);
}

.mts-products-page .mts-catalogue-sidebar h2,
.mts-products-page .mts-catalogue-sidebar h3,
.mts-products-page .metro-product-sidebar h2,
.mts-products-page .metro-product-sidebar h3,
.mts-products-page .product-filter-sidebar h2,
.mts-products-page .product-filter-sidebar h3,
.mts-products-page .mts-products-sidebar h2,
.mts-products-page .mts-products-sidebar h3 {
    color: #ffffff !important;
}

.mts-products-page .mts-catalogue-sidebar a,
.mts-products-page .metro-product-sidebar a,
.mts-products-page .product-filter-sidebar a,
.mts-products-page .mts-products-sidebar a,
.mts-products-page .mts-filter-panel a {
    color: #aeb9be !important;
}

.mts-products-page .mts-catalogue-sidebar a:hover,
.mts-products-page .metro-product-sidebar a:hover,
.mts-products-page .product-filter-sidebar a:hover,
.mts-products-page .mts-products-sidebar a:hover,
.mts-products-page .mts-filter-panel a:hover {
    color: var(--orange) !important;
}

.mts-products-page .mts-catalogue-sidebar strong,
.mts-products-page .metro-product-sidebar strong,
.mts-products-page .product-filter-sidebar strong {
    color: #ffffff !important;
}

.mts-products-page .mts-catalogue-sidebar small,
.mts-products-page .metro-product-sidebar small,
.mts-products-page .product-filter-sidebar small {
    color: #738087 !important;
}

.mts-products-page .mts-catalogue-sidebar input,
.mts-products-page .mts-catalogue-sidebar select,
.mts-products-page .metro-product-sidebar input,
.mts-products-page .metro-product-sidebar select,
.mts-products-page .product-filter-sidebar input,
.mts-products-page .product-filter-sidebar select {
    color: #e6ecef !important;
    background: #080d0f !important;
    border: 1px solid #3b464c !important;
}


/* ---------------------------------------------------------
   Product grid
   --------------------------------------------------------- */

.mts-products-page .mts-product-grid,
.mts-products-page .metro-product-grid,
.mts-products-page .product-grid {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
    gap: 17px !important;
}


/* ---------------------------------------------------------
   Dark card with white photo stage
   --------------------------------------------------------- */

.mts-products-page .mts-product-card,
.mts-products-page .metro-product-card,
.mts-products-page .product-card {
    overflow: hidden;
    color: #dce3e6 !important;
    background:
        linear-gradient(
            145deg,
            #12191d,
            #0d1215
        ) !important;
    border: 1px solid #354047 !important;
    border-radius: 7px !important;
    box-shadow: 0 7px 20px rgba(0, 0, 0, .18);
    transition:
        transform .2s ease,
        border-color .2s ease,
        box-shadow .2s ease;
}

.mts-products-page .mts-product-card:hover,
.mts-products-page .metro-product-card:hover,
.mts-products-page .product-card:hover {
    transform: translateY(-5px);
    border-color: var(--orange) !important;
    box-shadow: 0 18px 38px rgba(0, 0, 0, .3);
}


/* Photo stage */

.mts-products-page .mts-product-image,
.mts-products-page .metro-product-image,
.mts-products-page .product-card-image {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 245px;
    overflow: hidden;
    background: #f7f8f9 !important;
    border-bottom: 1px solid #354047;
}

.mts-products-page .mts-product-image img,
.mts-products-page .metro-product-image img,
.mts-products-page .product-card-image img {
    width: 100%;
    height: 245px;
    padding: 20px;
    box-sizing: border-box;
    object-fit: contain;
    transition: transform .23s ease;
}

.mts-products-page .mts-product-card:hover img,
.mts-products-page .metro-product-card:hover img,
.mts-products-page .product-card:hover img {
    transform: scale(1.035);
}


/* Product card content */

.mts-products-page .mts-product-card-content,
.mts-products-page .metro-product-card-content,
.mts-products-page .product-card-content {
    padding: 18px !important;
    color: #dce3e6 !important;
    background: transparent !important;
}

.mts-products-page .mts-stock-label,
.mts-products-page .mts-product-brand,
.mts-products-page .product-brand,
.mts-products-page .product-category {
    color: #87969d !important;
}

.mts-products-page .mts-stock-label {
    color: var(--orange) !important;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: 1.2px;
}

.mts-products-page .mts-product-name,
.mts-products-page .metro-product-name,
.mts-products-page .product-name,
.mts-products-page .mts-product-card h2,
.mts-products-page .mts-product-card h3,
.mts-products-page .metro-product-card h2,
.mts-products-page .metro-product-card h3,
.mts-products-page .product-card h2,
.mts-products-page .product-card h3 {
    color: #ffffff !important;
}

.mts-products-page .mts-product-name,
.mts-products-page .metro-product-name,
.mts-products-page .product-name {
    display: block;
    min-height: 50px;
    margin-top: 8px;
    font-size: 14px;
    font-weight: 900;
    line-height: 1.3;
}

.mts-products-page .mts-product-card p,
.mts-products-page .mts-product-card small,
.mts-products-page .metro-product-card p,
.mts-products-page .metro-product-card small,
.mts-products-page .product-card p,
.mts-products-page .product-card small {
    color: #7f8d93 !important;
}


/* Trade pricing panel */

.mts-products-page .mts-price-lock,
.mts-products-page .metro-price-lock,
.mts-products-page .product-price-lock {
    margin-top: 14px;
    padding: 11px 12px !important;
    color: #e1e7ea !important;
    background: #080d0f !important;
    border: 1px solid #344047 !important;
    border-radius: 4px;
}

.mts-products-page .mts-price-lock span,
.mts-products-page .metro-price-lock span,
.mts-products-page .product-price-lock span {
    display: block;
    color: var(--orange) !important;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: 1px;
}

.mts-products-page .mts-price-lock strong,
.mts-products-page .metro-price-lock strong,
.mts-products-page .product-price-lock strong {
    display: block;
    margin-top: 5px;
    color: #ffffff !important;
    font-size: 9px;
}


/* Action button */

.mts-products-page .mts-enquiry-button,
.mts-products-page .enquiry-button,
.mts-products-page .product-enquiry-button {
    display: flex !important;
    align-items: center;
    justify-content: center;
    min-height: 43px;
    margin-top: 11px;
    color: #ffffff !important;
    text-decoration: none;
    background: var(--orange) !important;
    border-radius: 3px;
    font-size: 9px;
    font-weight: 900;
}

.mts-products-page .mts-enquiry-button:hover,
.mts-products-page .enquiry-button:hover,
.mts-products-page .product-enquiry-button:hover {
    filter: brightness(1.08);
}


/* ---------------------------------------------------------
   Responsive catalogue
   --------------------------------------------------------- */

@media (max-width: 1050px) {
    .mts-products-page .mts-product-grid,
    .mts-products-page .metro-product-grid,
    .mts-products-page .product-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 650px) {
    .mts-catalogue-visibility-control {
        align-items: flex-start;
        flex-direction: column;
    }

    .mts-products-page .mts-product-grid,
    .mts-products-page .metro-product-grid,
    .mts-products-page .product-grid {
        grid-template-columns: 1fr !important;
    }

    .mts-products-page .mts-product-image,
    .mts-products-page .metro-product-image,
    .mts-products-page .product-card-image {
        min-height: 225px;
    }

    .mts-products-page .mts-product-image img,
    .mts-products-page .metro-product-image img,
    .mts-products-page .product-card-image img {
        height: 225px;
    }
}


/* =========================================================
   METRO CATALOGUE V2.1 – READABILITY AND CATEGORY MENU
   ========================================================= */


/* ---------------------------------------------------------
   Product card text: brighter and easier to scan
   --------------------------------------------------------- */

.mts-products-page .mts-product-card-content,
.mts-products-page .metro-product-card-content,
.mts-products-page .product-card-content {
    color: #eef3f5 !important;
}

.mts-products-page .mts-product-card-content *,
.mts-products-page .metro-product-card-content *,
.mts-products-page .product-card-content * {
    opacity: 1 !important;
}

.mts-products-page .mts-product-brand,
.mts-products-page .product-brand,
.mts-products-page .product-category {
    color: #b7c4ca !important;
    font-size: 8px !important;
    font-weight: 800 !important;
    letter-spacing: .45px;
}

.mts-products-page .mts-stock-label {
    color: #ff6900 !important;
    font-size: 8px !important;
    font-weight: 950 !important;
    letter-spacing: 1.2px;
}

.mts-products-page .mts-product-name,
.mts-products-page .metro-product-name,
.mts-products-page .product-name,
.mts-products-page .mts-product-card h2,
.mts-products-page .mts-product-card h3,
.mts-products-page .metro-product-card h2,
.mts-products-page .metro-product-card h3,
.mts-products-page .product-card h2,
.mts-products-page .product-card h3 {
    color: #ffffff !important;
    text-shadow: none !important;
}

.mts-products-page .mts-product-name,
.mts-products-page .metro-product-name,
.mts-products-page .product-name {
    min-height: 52px;
    font-size: 15px !important;
    line-height: 1.28 !important;
}

.mts-products-page .mts-product-card p,
.mts-products-page .metro-product-card p,
.mts-products-page .product-card p {
    color: #c0cbd0 !important;
    font-size: 10px !important;
    line-height: 1.55 !important;
}

.mts-products-page .mts-product-card small,
.mts-products-page .metro-product-card small,
.mts-products-page .product-card small {
    color: #a3b0b6 !important;
    font-size: 9px !important;
}

.mts-products-page .mts-price-lock {
    background: #090e11 !important;
    border-color: #455159 !important;
}

.mts-products-page .mts-price-lock span {
    color: #ff6900 !important;
}

.mts-products-page .mts-price-lock strong {
    color: #f4f7f8 !important;
    font-size: 10px !important;
}


/* ---------------------------------------------------------
   Category/sidebar panel: full dark redesign
   --------------------------------------------------------- */

.mts-products-page .mts-catalogue-sidebar,
.mts-products-page .metro-product-sidebar,
.mts-products-page .product-filter-sidebar,
.mts-products-page .mts-products-sidebar,
.mts-products-page .mts-filter-panel {
    padding: 0 !important;
    overflow: hidden;
    color: #e8eef1 !important;
    background: #101619 !important;
    border: 1px solid #39454c !important;
    border-radius: 7px !important;
    box-shadow: 0 14px 30px rgba(0, 0, 0, .28) !important;
}


/* Sidebar headings */

.mts-products-page .mts-catalogue-sidebar > h2,
.mts-products-page .mts-catalogue-sidebar > h3,
.mts-products-page .metro-product-sidebar > h2,
.mts-products-page .metro-product-sidebar > h3,
.mts-products-page .product-filter-sidebar > h2,
.mts-products-page .product-filter-sidebar > h3,
.mts-products-page .mts-products-sidebar > h2,
.mts-products-page .mts-products-sidebar > h3,
.mts-products-page .mts-filter-panel > h2,
.mts-products-page .mts-filter-panel > h3 {
    margin: 0 !important;
    padding: 17px 18px !important;
    color: #ffffff !important;
    background: #171f23 !important;
    border-bottom: 1px solid #39454c !important;
    font-size: 11px !important;
    font-weight: 950 !important;
    letter-spacing: 1px;
    text-transform: uppercase;
}


/* General sidebar sections */

.mts-products-page .mts-catalogue-sidebar section,
.mts-products-page .metro-product-sidebar section,
.mts-products-page .product-filter-sidebar section,
.mts-products-page .mts-products-sidebar section,
.mts-products-page .mts-filter-panel section,
.mts-products-page .mts-catalogue-sidebar .filter-section,
.mts-products-page .metro-product-sidebar .filter-section,
.mts-products-page .product-filter-sidebar .filter-section {
    padding: 15px 17px !important;
    border-bottom: 1px solid #2d373c !important;
}


/* Section labels */

.mts-products-page .mts-catalogue-sidebar label,
.mts-products-page .metro-product-sidebar label,
.mts-products-page .product-filter-sidebar label,
.mts-products-page .mts-products-sidebar label,
.mts-products-page .mts-filter-panel label,
.mts-products-page .mts-catalogue-sidebar .filter-title,
.mts-products-page .metro-product-sidebar .filter-title,
.mts-products-page .product-filter-sidebar .filter-title {
    color: #ff6900 !important;
    font-size: 8px !important;
    font-weight: 950 !important;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}


/* Remove inherited pale backgrounds */

.mts-products-page .mts-catalogue-sidebar div,
.mts-products-page .metro-product-sidebar div,
.mts-products-page .product-filter-sidebar div,
.mts-products-page .mts-products-sidebar div,
.mts-products-page .mts-filter-panel div,
.mts-products-page .mts-catalogue-sidebar ul,
.mts-products-page .metro-product-sidebar ul,
.mts-products-page .product-filter-sidebar ul,
.mts-products-page .mts-products-sidebar ul,
.mts-products-page .mts-filter-panel ul {
    background-color: transparent !important;
}


/* Category lists */

.mts-products-page .mts-catalogue-sidebar ul,
.mts-products-page .metro-product-sidebar ul,
.mts-products-page .product-filter-sidebar ul,
.mts-products-page .mts-products-sidebar ul,
.mts-products-page .mts-filter-panel ul {
    margin: 0 !important;
    padding: 6px 0 !important;
    list-style: none !important;
}

.mts-products-page .mts-catalogue-sidebar li,
.mts-products-page .metro-product-sidebar li,
.mts-products-page .product-filter-sidebar li,
.mts-products-page .mts-products-sidebar li,
.mts-products-page .mts-filter-panel li {
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: 1px solid #242d31 !important;
}

.mts-products-page .mts-catalogue-sidebar li:last-child,
.mts-products-page .metro-product-sidebar li:last-child,
.mts-products-page .product-filter-sidebar li:last-child,
.mts-products-page .mts-products-sidebar li:last-child,
.mts-products-page .mts-filter-panel li:last-child {
    border-bottom: 0 !important;
}


/* Category links */

.mts-products-page .mts-catalogue-sidebar li > a,
.mts-products-page .metro-product-sidebar li > a,
.mts-products-page .product-filter-sidebar li > a,
.mts-products-page .mts-products-sidebar li > a,
.mts-products-page .mts-filter-panel li > a {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 39px;
    padding: 0 16px !important;
    color: #d8e0e4 !important;
    background: transparent !important;
    border: 0 !important;
    text-decoration: none !important;
    font-size: 10px !important;
    font-weight: 750 !important;
    line-height: 1.3;
    transition:
        color .16s ease,
        background-color .16s ease,
        padding-left .16s ease;
}

.mts-products-page .mts-catalogue-sidebar li > a:hover,
.mts-products-page .metro-product-sidebar li > a:hover,
.mts-products-page .product-filter-sidebar li > a:hover,
.mts-products-page .mts-products-sidebar li > a:hover,
.mts-products-page .mts-filter-panel li > a:hover {
    padding-left: 20px !important;
    color: #ffffff !important;
    background: #182126 !important;
}


/* Active category */

.mts-products-page .mts-catalogue-sidebar li.active > a,
.mts-products-page .metro-product-sidebar li.active > a,
.mts-products-page .product-filter-sidebar li.active > a,
.mts-products-page .mts-products-sidebar li.active > a,
.mts-products-page .mts-filter-panel li.active > a,
.mts-products-page .mts-catalogue-sidebar a.active,
.mts-products-page .metro-product-sidebar a.active,
.mts-products-page .product-filter-sidebar a.active,
.mts-products-page .mts-products-sidebar a.active,
.mts-products-page .mts-filter-panel a.active {
    color: #ffffff !important;
    background: #202a2f !important;
    border-left: 3px solid #ff6900 !important;
}


/* Category counts */

.mts-products-page .mts-catalogue-sidebar .count,
.mts-products-page .metro-product-sidebar .count,
.mts-products-page .product-filter-sidebar .count,
.mts-products-page .mts-products-sidebar .count,
.mts-products-page .mts-filter-panel .count,
.mts-products-page .mts-catalogue-sidebar small,
.mts-products-page .metro-product-sidebar small,
.mts-products-page .product-filter-sidebar small,
.mts-products-page .mts-products-sidebar small,
.mts-products-page .mts-filter-panel small {
    color: #96a4ab !important;
    font-size: 8px !important;
    font-weight: 800 !important;
}


/* Sidebar selects and inputs */

.mts-products-page .mts-catalogue-sidebar input,
.mts-products-page .mts-catalogue-sidebar select,
.mts-products-page .metro-product-sidebar input,
.mts-products-page .metro-product-sidebar select,
.mts-products-page .product-filter-sidebar input,
.mts-products-page .product-filter-sidebar select,
.mts-products-page .mts-products-sidebar input,
.mts-products-page .mts-products-sidebar select,
.mts-products-page .mts-filter-panel input,
.mts-products-page .mts-filter-panel select {
    width: 100% !important;
    min-height: 39px;
    padding: 0 11px !important;
    box-sizing: border-box;
    color: #eef3f5 !important;
    background: #080d0f !important;
    border: 1px solid #414d54 !important;
    border-radius: 4px !important;
    font-size: 10px !important;
}

.mts-products-page .mts-catalogue-sidebar input:focus,
.mts-products-page .mts-catalogue-sidebar select:focus,
.mts-products-page .metro-product-sidebar input:focus,
.mts-products-page .metro-product-sidebar select:focus,
.mts-products-page .product-filter-sidebar input:focus,
.mts-products-page .product-filter-sidebar select:focus {
    outline: none !important;
    border-color: #ff6900 !important;
}


/* Generic direct links when the template does not use a UL */

.mts-products-page .mts-catalogue-sidebar > a,
.mts-products-page .metro-product-sidebar > a,
.mts-products-page .product-filter-sidebar > a,
.mts-products-page .mts-products-sidebar > a,
.mts-products-page .mts-filter-panel > a {
    display: block;
    min-height: 37px;
    padding: 11px 16px !important;
    box-sizing: border-box;
    color: #d8e0e4 !important;
    background: transparent !important;
    border-bottom: 1px solid #263035 !important;
    font-size: 10px !important;
    font-weight: 750 !important;
}

.mts-products-page .mts-catalogue-sidebar > a:hover,
.mts-products-page .metro-product-sidebar > a:hover,
.mts-products-page .product-filter-sidebar > a:hover,
.mts-products-page .mts-products-sidebar > a:hover,
.mts-products-page .mts-filter-panel > a:hover {
    color: #ffffff !important;
    background: #182126 !important;
}


/* Clear-filter link */

.mts-products-page .clear-filters,
.mts-products-page .clear-filter,
.mts-products-page [href*="clear"] {
    color: #ff6900 !important;
    font-weight: 900 !important;
}


/* ---------------------------------------------------------
   Better spacing between sidebar and catalogue
   --------------------------------------------------------- */

.mts-products-page .mts-catalogue-layout,
.mts-products-page .products-layout,
.mts-products-page .metro-products-layout {
    column-gap: 22px !important;
}


/* ---------------------------------------------------------
   Mobile sidebar
   --------------------------------------------------------- */

@media (max-width: 850px) {
    .mts-products-page .mts-catalogue-sidebar,
    .mts-products-page .metro-product-sidebar,
    .mts-products-page .product-filter-sidebar,
    .mts-products-page .mts-products-sidebar,
    .mts-products-page .mts-filter-panel {
        position: static !important;
        max-height: none !important;
        margin-bottom: 20px;
        overflow: visible !important;
    }
}


/* =========================================================
   METRO CATEGORY SIDEBAR V3
   Exact class applied directly in products.html
   ========================================================= */

.mts-products-page .mts-catalogue-sidebar-v3 {
    position: sticky;
    top: 132px;
    align-self: start;
    width: 250px;
    max-height: calc(100vh - 155px);
    padding: 0 !important;
    overflow-x: hidden;
    overflow-y: auto;
    color: #e7edf0 !important;
    background:
        linear-gradient(
            155deg,
            #151d21,
            #0b1013
        ) !important;
    border: 1px solid #3b474e !important;
    border-radius: 8px !important;
    box-shadow:
        0 18px 38px
        rgba(0, 0, 0, .32) !important;
}


/* Reset inherited pale backgrounds */

.mts-products-page .mts-catalogue-sidebar-v3,
.mts-products-page .mts-catalogue-sidebar-v3 div,
.mts-products-page .mts-catalogue-sidebar-v3 section,
.mts-products-page .mts-catalogue-sidebar-v3 nav,
.mts-products-page .mts-catalogue-sidebar-v3 ul,
.mts-products-page .mts-catalogue-sidebar-v3 li {
    background-color: transparent !important;
}


/* Main headings: Categories / Brands */

.mts-products-page .mts-catalogue-sidebar-v3 h2,
.mts-products-page .mts-catalogue-sidebar-v3 h3,
.mts-products-page .mts-catalogue-sidebar-v3 h4 {
    margin: 0 !important;
    padding: 19px 18px 14px !important;
    color: #ffffff !important;
    background: #1a2328 !important;
    border-top: 1px solid #39454b !important;
    border-bottom: 1px solid #39454b !important;
    font-size: 14px !important;
    font-weight: 950 !important;
    line-height: 1.2 !important;
    letter-spacing: .7px !important;
    text-transform: uppercase;
}

.mts-products-page .mts-catalogue-sidebar-v3 h2:first-child,
.mts-products-page .mts-catalogue-sidebar-v3 h3:first-child {
    border-top: 0 !important;
}


/* Lists */

.mts-products-page .mts-catalogue-sidebar-v3 ul {
    margin: 0 !important;
    padding: 7px 0 !important;
    list-style: none !important;
}

.mts-products-page .mts-catalogue-sidebar-v3 li {
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: 1px solid #273136 !important;
}

.mts-products-page .mts-catalogue-sidebar-v3 li:last-child {
    border-bottom: 0 !important;
}


/* All category and brand links */

.mts-products-page .mts-catalogue-sidebar-v3 a {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 44px;
    padding: 0 17px !important;
    box-sizing: border-box;
    color: #d8e1e5 !important;
    background: transparent !important;
    border: 0 !important;
    border-left: 3px solid transparent !important;
    text-decoration: none !important;
    font-size: 11px !important;
    font-weight: 780 !important;
    line-height: 1.35 !important;
    transition:
        color .16s ease,
        background-color .16s ease,
        border-color .16s ease,
        padding-left .16s ease;
}

.mts-products-page .mts-catalogue-sidebar-v3 a:hover {
    padding-left: 21px !important;
    color: #ffffff !important;
    background: #202a2f !important;
    border-left-color: #ff6200 !important;
}


/* Active link */

.mts-products-page .mts-catalogue-sidebar-v3 a.active,
.mts-products-page .mts-catalogue-sidebar-v3 li.active > a,
.mts-products-page .mts-catalogue-sidebar-v3 a[aria-current="page"] {
    color: #ffffff !important;
    background:
        linear-gradient(
            90deg,
            rgba(255, 98, 0, .2),
            rgba(255, 98, 0, .04)
        ) !important;
    border-left-color: #ff6200 !important;
}


/* Counts */

.mts-products-page .mts-catalogue-sidebar-v3 .count,
.mts-products-page .mts-catalogue-sidebar-v3 small,
.mts-products-page .mts-catalogue-sidebar-v3 a span:last-child {
    color: #ff7a25 !important;
    font-size: 9px !important;
    font-weight: 950 !important;
    letter-spacing: .2px;
}


/* Section wrappers */

.mts-products-page .mts-catalogue-sidebar-v3 section,
.mts-products-page .mts-catalogue-sidebar-v3 .filter-section,
.mts-products-page .mts-catalogue-sidebar-v3 .sidebar-section {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}


/* Any direct links not inside a list */

.mts-products-page .mts-catalogue-sidebar-v3 > a,
.mts-products-page .mts-catalogue-sidebar-v3 > div > a {
    border-bottom: 1px solid #273136 !important;
}


/* Search/select controls if present */

.mts-products-page .mts-catalogue-sidebar-v3 input,
.mts-products-page .mts-catalogue-sidebar-v3 select {
    width: calc(100% - 30px) !important;
    min-height: 41px;
    margin: 14px 15px !important;
    padding: 0 12px !important;
    box-sizing: border-box;
    color: #eef3f5 !important;
    background: #070b0d !important;
    border: 1px solid #46535a !important;
    border-radius: 4px !important;
    font-family: inherit;
    font-size: 10px !important;
}

.mts-products-page .mts-catalogue-sidebar-v3 input:focus,
.mts-products-page .mts-catalogue-sidebar-v3 select:focus {
    outline: none !important;
    border-color: #ff6200 !important;
    box-shadow:
        0 0 0 3px
        rgba(255, 98, 0, .12) !important;
}


/* Scrollbar */

.mts-products-page .mts-catalogue-sidebar-v3 {
    scrollbar-width: thin;
    scrollbar-color: #ff6200 #11171a;
}

.mts-products-page .mts-catalogue-sidebar-v3::-webkit-scrollbar {
    width: 8px;
}

.mts-products-page .mts-catalogue-sidebar-v3::-webkit-scrollbar-track {
    background: #11171a;
}

.mts-products-page .mts-catalogue-sidebar-v3::-webkit-scrollbar-thumb {
    background: #ff6200;
    border-radius: 5px;
}


/* Mobile */

@media (max-width: 850px) {
    .mts-products-page .mts-catalogue-sidebar-v3 {
        position: static;
        width: 100%;
        max-height: none;
        margin-bottom: 22px;
        overflow: visible;
    }
}


/* =========================================================
   METRO PRODUCT CARD COLOUR FIX V20
   Brighter content and orange trade-pricing panel
   ========================================================= */


/* Card body */

.mts-products-page .mts-product-card,
.mts-products-page .metro-product-card,
.mts-products-page .product-card {
    color: #f3f6f7 !important;
    background:
        linear-gradient(
            155deg,
            #12191d,
            #0b1114
        ) !important;
    border-color: #435058 !important;
}


/* Category */

.mts-products-page .mts-product-brand,
.mts-products-page .product-brand,
.mts-products-page .product-category {
    color: #b7c4ca !important;
    font-size: 9px !important;
    font-weight: 850 !important;
    letter-spacing: .7px !important;
    text-transform: uppercase;
}


/* Brand pill */

.mts-products-page .supplier,
.mts-products-page .brand-badge,
.mts-products-page .mts-brand-badge {
    color: #123754 !important;
    background: #e5f4fc !important;
    border: 1px solid #acd7ee !important;
    font-size: 8px !important;
    font-weight: 900 !important;
}


/* Product name */

.mts-products-page .mts-product-name,
.mts-products-page .metro-product-name,
.mts-products-page .product-name,
.mts-products-page .mts-product-card h2,
.mts-products-page .mts-product-card h3,
.mts-products-page .metro-product-card h2,
.mts-products-page .metro-product-card h3,
.mts-products-page .product-card h2,
.mts-products-page .product-card h3 {
    color: #ffffff !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

.mts-products-page .mts-product-name,
.mts-products-page .metro-product-name,
.mts-products-page .product-name {
    display: block;
    min-height: 54px;
    margin-top: 9px;
    font-size: 16px !important;
    font-weight: 950 !important;
    line-height: 1.24 !important;
}


/* Product code */

.mts-products-page .mts-product-card small,
.mts-products-page .metro-product-card small,
.mts-products-page .product-card small {
    color: #d6dfe3 !important;
    font-size: 9px !important;
    font-weight: 750 !important;
    opacity: 1 !important;
}


/* Description */

.mts-products-page .mts-product-card p,
.mts-products-page .metro-product-card p,
.mts-products-page .product-card p {
    color: #c3ced3 !important;
    font-size: 10px !important;
    line-height: 1.55 !important;
    opacity: 1 !important;
}


/* =========================================================
   ORANGE TRADE PRICING PANEL
   ========================================================= */

.mts-products-page .mts-price-lock,
.mts-products-page .metro-price-lock,
.mts-products-page .product-price-lock {
    position: relative;
    margin-top: 15px;
    padding: 13px 14px !important;
    overflow: hidden;
    color: #ffffff !important;
    background:
        linear-gradient(
            110deg,
            #f05200,
            #ff6a00
        ) !important;
    border: 1px solid #ff7a22 !important;
    border-radius: 5px !important;
    box-shadow:
        0 7px 16px
        rgba(255, 91, 0, .18);
}

.mts-products-page .mts-price-lock::after,
.mts-products-page .metro-price-lock::after,
.mts-products-page .product-price-lock::after {
    position: absolute;
    top: -28px;
    right: -20px;
    width: 100px;
    height: 100px;
    content: "";
    background:
        rgba(255, 255, 255, .08);
    border-radius: 50%;
}

.mts-products-page .mts-price-lock span,
.mts-products-page .metro-price-lock span,
.mts-products-page .product-price-lock span {
    position: relative;
    z-index: 1;
    display: block;
    color: #ffffff !important;
    font-size: 8px !important;
    font-weight: 950 !important;
    letter-spacing: 1.35px !important;
    text-transform: uppercase;
}

.mts-products-page .mts-price-lock strong,
.mts-products-page .metro-price-lock strong,
.mts-products-page .product-price-lock strong {
    position: relative;
    z-index: 1;
    display: block;
    margin-top: 6px;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 900 !important;
}


/* Availability row */

.mts-products-page .mts-product-card-content > small:last-of-type,
.mts-products-page .availability,
.mts-products-page .stock-message,
.mts-products-page .product-availability {
    color: #d9e1e4 !important;
}


/* Bottom product link */

.mts-products-page .mts-product-card-content > a:not(.mts-product-name):not(.mts-enquiry-button),
.mts-products-page .view-product,
.mts-products-page .product-view-link {
    color: #36aaf4 !important;
    font-weight: 900 !important;
}


/* Stronger divider above bottom actions */

.mts-products-page .mts-product-card-content::after,
.mts-products-page .metro-product-card-content::after,
.mts-products-page .product-card-content::after {
    border-color: #68747a !important;
}


/* Card hover */

.mts-products-page .mts-product-card:hover,
.mts-products-page .metro-product-card:hover,
.mts-products-page .product-card:hover {
    border-color: #ff6500 !important;
    box-shadow:
        0 18px 38px
        rgba(0, 0, 0, .34),
        0 0 0 1px
        rgba(255, 101, 0, .12);
}


/* Mobile */

@media (max-width: 650px) {
    .mts-products-page .mts-product-name,
    .mts-products-page .metro-product-name,
    .mts-products-page .product-name {
        min-height: auto;
        font-size: 17px !important;
    }
}


/* =========================================================
   METRO STANDARD PRODUCT CARD V21
   Same card design across homepage and products catalogue
   ========================================================= */

.mts-products-page .mts-standard-product-card {
    display: flex;
    overflow: hidden;
    flex-direction: column;
    min-width: 0;
    color: #ffffff !important;
    background: #10171b !important;
    border: 1px solid #455159 !important;
    border-radius: 7px !important;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .22);
    transition:
        transform .2s ease,
        border-color .2s ease,
        box-shadow .2s ease;
}

.mts-products-page .mts-standard-product-card:hover {
    transform: translateY(-5px);
    border-color: #ff5b00 !important;
    box-shadow: 0 18px 38px rgba(0, 0, 0, .34);
}


/* Product photo */

.mts-products-page
.mts-standard-product-card
.mts-product-image {
    display: flex !important;
    align-items: center;
    justify-content: center;
    height: 275px !important;
    min-height: 275px !important;
    overflow: hidden;
    background: #ffffff !important;
    border-bottom: 1px solid #455159 !important;
}

.mts-products-page
.mts-standard-product-card
.mts-product-image img {
    width: 100% !important;
    height: 275px !important;
    padding: 22px !important;
    box-sizing: border-box;
    object-fit: contain !important;
    transition: transform .24s ease;
}

.mts-products-page
.mts-standard-product-card:hover
.mts-product-image img {
    transform: scale(1.035);
}


/* Missing photo */

.mts-products-page
.mts-standard-product-card
.mts-product-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    height: 275px;
    color: #ffffff !important;
    background:
        radial-gradient(
            circle at 50% 35%,
            #245e86,
            #102f49
        ) !important;
}

.mts-products-page
.mts-standard-product-card
.mts-product-placeholder span {
    color: #ff6500 !important;
    font-size: 9px;
    font-weight: 950;
    letter-spacing: 1.5px;
}

.mts-products-page
.mts-standard-product-card
.mts-product-placeholder strong {
    margin-top: 8px;
    color: #ffffff !important;
    font-size: 14px;
}


/* Card body */

.mts-products-page
.mts-standard-product-card
.mts-product-card-content {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 20px !important;
    color: #ffffff !important;
    background: #10171b !important;
}


/* Top row */

.mts-standard-product-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 15px;
}

.mts-products-page
.mts-standard-product-card
.mts-stock-label {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 0 9px;
    color: #b8ff00 !important;
    background: #122300 !important;
    border-radius: 2px;
    font-size: 8px !important;
    font-weight: 950 !important;
    letter-spacing: .9px;
}

.mts-standard-brand-badge {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 0 10px;
    color: #07598d !important;
    text-decoration: none;
    background: #ecf8ff !important;
    border: 1px solid #bcdff1;
    border-radius: 15px;
    font-size: 8px !important;
    font-weight: 900 !important;
}


/* Category */

.mts-products-page
.mts-standard-product-card
.mts-product-brand {
    display: block;
    color: #9eadb4 !important;
    font-size: 9px !important;
    font-weight: 850 !important;
    letter-spacing: .8px;
    text-transform: uppercase;
}


/* Product name */

.mts-products-page
.mts-standard-product-card
.mts-product-name {
    display: -webkit-box !important;
    min-height: 67px;
    margin-top: 10px;
    overflow: hidden;
    color: #ffffff !important;
    text-decoration: none;
    font-size: 17px !important;
    font-weight: 950 !important;
    line-height: 1.28 !important;
    opacity: 1 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}


/* Product code */

.mts-standard-product-code {
    margin-top: 10px;
    color: #b7c3c8 !important;
    font-size: 10px;
}

.mts-standard-product-code strong {
    color: #dce4e7 !important;
    font-weight: 850;
}


/* Description */

.mts-standard-product-description {
    display: -webkit-box;
    min-height: 48px;
    margin: 7px 0 0;
    overflow: hidden;
    color: #cbd4d8 !important;
    font-size: 10px !important;
    line-height: 1.55 !important;
    opacity: 1 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}


/* Trade price panel */

.mts-products-page
.mts-standard-product-card
.mts-price-lock {
    margin-top: auto !important;
    padding: 13px 14px !important;
    color: #ffffff !important;
    background: #080d0f !important;
    border: 1px solid #4c5960 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.mts-products-page
.mts-standard-product-card
.mts-price-lock::after {
    display: none !important;
}

.mts-products-page
.mts-standard-product-card
.mts-price-lock span {
    display: block;
    color: #ff5b00 !important;
    font-size: 8px !important;
    font-weight: 950 !important;
    letter-spacing: 1.2px;
}

.mts-products-page
.mts-standard-product-card
.mts-price-lock strong {
    display: block;
    margin-top: 5px;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 900 !important;
}


/* Add to Quote */

.mts-products-page
.mts-standard-product-card
.mts-enquiry-button {
    display: flex !important;
    align-items: center;
    justify-content: center;
    min-height: 49px;
    margin-top: 12px;
    color: #ffffff !important;
    text-decoration: none;
    background:
        linear-gradient(
            90deg,
            #ff5000,
            #ff6500
        ) !important;
    border-radius: 0 !important;
    font-size: 11px !important;
    font-weight: 950 !important;
    box-shadow: 0 8px 18px rgba(255, 85, 0, .18);
}

.mts-products-page
.mts-standard-product-card
.mts-enquiry-button:hover {
    filter: brightness(1.08);
}


/* Catalogue grid */

.mts-products-page .mts-product-grid,
.mts-products-page .metro-product-grid,
.mts-products-page .product-grid {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
    gap: 18px !important;
}


/* Responsive */

@media (max-width: 1050px) {
    .mts-products-page .mts-product-grid,
    .mts-products-page .metro-product-grid,
    .mts-products-page .product-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 650px) {
    .mts-products-page .mts-product-grid,
    .mts-products-page .metro-product-grid,
    .mts-products-page .product-grid {
        grid-template-columns: 1fr !important;
    }

    .mts-products-page
    .mts-standard-product-card
    .mts-product-image,
    .mts-products-page
    .mts-standard-product-card
    .mts-product-image img {
        height: 245px !important;
        min-height: 245px !important;
    }

    .mts-products-page
    .mts-standard-product-card
    .mts-product-name {
        min-height: auto;
    }
}


/* =========================================================
   METRO CATALOGUE FINAL POLISH V22
   ========================================================= */


/* Catalogue title */

.mts-products-page .catalogue-heading h1,
.mts-products-page .catalogue-heading h2,
.mts-products-page .products-heading h1,
.mts-products-page .products-heading h2,
.mts-products-page main > div > h1,
.mts-products-page main > div > h2 {
    color: #ffffff !important;
}


/* =========================================================
   STATISTICS AND SORTING TOOLBAR
   ========================================================= */

.mts-catalogue-toolbar {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        225px;
    gap: 14px;
    align-items: stretch;
    margin: 0 0 20px;
}

.mts-catalogue-statistics {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
    overflow: hidden;
    background: #101619;
    border: 1px solid #354047;
    border-radius: 6px;
}

.mts-catalogue-statistics article {
    padding: 15px 17px;
    border-right: 1px solid #354047;
}

.mts-catalogue-statistics article:last-child {
    border-right: 0;
}

.mts-catalogue-statistics strong,
.mts-catalogue-statistics span {
    display: block;
}

.mts-catalogue-statistics strong {
    color: #ffffff;
    font-size: 16px;
    font-weight: 950;
}

.mts-catalogue-statistics article:last-child strong {
    color: #9dff00;
}

.mts-catalogue-statistics span {
    margin-top: 5px;
    color: #849198;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: 1px;
}

.mts-catalogue-sort {
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 12px 14px;
    background: #101619;
    border: 1px solid #354047;
    border-radius: 6px;
}

.mts-catalogue-sort label {
    margin-bottom: 7px;
    color: #ff6500;
    font-size: 7px;
    font-weight: 950;
    letter-spacing: 1.1px;
}

.mts-catalogue-sort select {
    width: 100%;
    min-height: 38px;
    padding: 0 10px;
    color: #ffffff;
    cursor: pointer;
    background: #080d0f;
    border: 1px solid #455159;
    border-radius: 4px;
    font-family: inherit;
    font-size: 9px;
    font-weight: 800;
}

.mts-catalogue-sort select:focus {
    outline: none;
    border-color: #ff6500;
}


/* =========================================================
   VERIFIED TRADE PRODUCT BADGE
   ========================================================= */

.mts-products-page
.mts-standard-product-card
.mts-stock-label {
    min-height: 25px;
    padding: 0 9px;
    color: #ffffff !important;
    background: #f05a00 !important;
    border: 1px solid #ff7522 !important;
    font-size: 7px !important;
    letter-spacing: .7px !important;
}


/* =========================================================
   INTENTIONAL MISSING-IMAGE PLACEHOLDER
   ========================================================= */

.mts-products-page
.mts-standard-product-card
.mts-product-placeholder {
    position: relative;
    height: 275px;
    min-height: 275px;
    padding: 24px;
    box-sizing: border-box;
    color: #ffffff !important;
    background:
        radial-gradient(
            circle at 50% 32%,
            #225f88,
            #102e47 68%
        ) !important;
}

.mts-products-page
.mts-standard-product-card
.mts-product-placeholder::before {
    position: absolute;
    inset: 14px;
    content: "";
    border: 1px solid rgba(255, 255, 255, .14);
}

.mts-products-page
.mts-standard-product-card
.mts-product-placeholder span,
.mts-products-page
.mts-standard-product-card
.mts-product-placeholder strong,
.mts-products-page
.mts-standard-product-card
.mts-product-placeholder small,
.mts-products-page
.mts-standard-product-card
.mts-product-placeholder em {
    position: relative;
    z-index: 1;
    display: block;
    text-align: center;
}

.mts-products-page
.mts-standard-product-card
.mts-product-placeholder span {
    color: #ff6500 !important;
    font-size: 8px !important;
    font-weight: 950;
    letter-spacing: 1.4px;
}

.mts-products-page
.mts-standard-product-card
.mts-product-placeholder strong {
    margin-top: 16px;
    color: #ffffff !important;
    font-size: 19px !important;
    line-height: 1.1;
}

.mts-products-page
.mts-standard-product-card
.mts-product-placeholder small {
    margin-top: 5px;
    color: #c5d1d7 !important;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 1px;
}

.mts-products-page
.mts-standard-product-card
.mts-product-placeholder em {
    margin-top: 18px;
    color: #95a8b2 !important;
    font-size: 8px;
    font-style: normal;
}


/* =========================================================
   INFORMATION BAR REFINEMENT
   ========================================================= */

.mts-catalogue-visibility-control {
    padding: 17px 19px;
}

.mts-catalogue-visibility-control strong {
    color: #ffffff;
    font-size: 11px;
}

.mts-catalogue-visibility-control span {
    color: #9aa7ad;
    font-size: 9px;
}


/* =========================================================
   CARD IMAGE HEIGHT REFINEMENT
   ========================================================= */

.mts-products-page
.mts-standard-product-card
.mts-product-image,
.mts-products-page
.mts-standard-product-card
.mts-product-image img {
    height: 255px !important;
    min-height: 255px !important;
}

.mts-products-page
.mts-standard-product-card
.mts-product-placeholder {
    height: 255px;
    min-height: 255px;
}


/* =========================================================
   RESPONSIVE TOOLBAR
   ========================================================= */

@media (max-width: 1100px) {
    .mts-catalogue-toolbar {
        grid-template-columns: 1fr;
    }

    .mts-catalogue-sort {
        max-width: none;
    }
}

@media (max-width: 720px) {
    .mts-catalogue-statistics {
        grid-template-columns: repeat(2, 1fr);
    }

    .mts-catalogue-statistics article:nth-child(2) {
        border-right: 0;
    }

    .mts-catalogue-statistics article:nth-child(-n+2) {
        border-bottom: 1px solid #354047;
    }
}


/* =========================================================
   METRO HOMEPAGE CATEGORY PHOTO GRID V23B
   ========================================================= */

.mts-category-photo-grid {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
    gap: 15px;
}

.mts-category-photo-card {
    position: relative;
    display: block;
    min-height: 285px;
    overflow: hidden;
    color: #ffffff;
    text-decoration: none;
    background: #101619;
    border: 1px solid #354047;
    border-radius: 5px;
    box-shadow:
        0 8px 22px
        rgba(0, 0, 0, .2);
    transition:
        transform .22s ease,
        border-color .22s ease,
        box-shadow .22s ease;
}

.mts-category-photo-card:hover {
    transform: translateY(-5px);
    border-color: #ff6200;
    box-shadow:
        0 20px 42px
        rgba(0, 0, 0, .34);
}

.mts-category-photo-card > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    padding: 18px;
    box-sizing: border-box;
    background: #f7f8f9;
    object-fit: contain;
    transition:
        transform .35s ease,
        filter .35s ease;
}

.mts-category-photo-card:hover > img {
    transform: scale(1.06);
    filter: contrast(1.04);
}

.mts-category-photo-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            180deg,
            rgba(4, 8, 10, .02) 25%,
            rgba(5, 9, 11, .40) 58%,
            rgba(5, 9, 11, .97) 100%
        );
}

.mts-category-photo-content {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    padding: 21px;
}

.mts-category-photo-count {
    color: #ff6500;
    font-size: 8px;
    font-weight: 950;
    letter-spacing: 1px;
}

.mts-category-photo-content h3 {
    margin: 8px 0 0;
    color: #ffffff;
    font-size: 19px;
    font-weight: 950;
    line-height: 1.14;
}

.mts-category-photo-action {
    display: block;
    max-height: 0;
    margin-top: 0;
    overflow: hidden;
    color: #ffffff;
    opacity: 0;
    font-size: 9px;
    font-weight: 900;
    transform: translateY(8px);
    transition:
        opacity .2s ease,
        transform .2s ease,
        margin-top .2s ease,
        max-height .2s ease;
}

.mts-category-photo-card:hover
.mts-category-photo-action {
    max-height: 25px;
    margin-top: 11px;
    opacity: 1;
    transform: translateY(0);
}

.mts-category-photo-placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 25px;
    text-align: center;
    background:
        radial-gradient(
            circle at 50% 30%,
            #245f87,
            #102e47 68%
        );
}

.mts-category-photo-placeholder span {
    color: #ff6500;
    font-size: 9px;
    font-weight: 950;
    letter-spacing: 1.7px;
}

.mts-category-photo-placeholder strong {
    margin-top: 10px;
    color: #ffffff;
    font-size: 21px;
}

@media (max-width: 1150px) {
    .mts-category-photo-grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .mts-category-photo-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 540px) {
    .mts-category-photo-grid {
        grid-template-columns: 1fr;
    }

    .mts-category-photo-card {
        min-height: 245px;
    }

    .mts-category-photo-action {
        max-height: 25px;
        margin-top: 11px;
        opacity: 1;
        transform: none;
    }
}


/* =========================================================
   METRO HOMEPAGE CATEGORY TILE SIZE V24
   Keep photo tiles compact like the original layout
   ========================================================= */

.mts-category-photo-card {
    min-height: 190px !important;
}

.mts-category-photo-card > img {
    padding: 12px !important;
}

.mts-category-photo-content {
    padding: 15px !important;
}

.mts-category-photo-count {
    font-size: 7px !important;
}

.mts-category-photo-content h3 {
    margin-top: 6px !important;
    font-size: 16px !important;
    line-height: 1.12 !important;
}

.mts-category-photo-action {
    font-size: 8px !important;
}

.mts-category-photo-card:hover
.mts-category-photo-action {
    margin-top: 7px !important;
}

.mts-category-photo-placeholder {
    padding: 16px !important;
}

.mts-category-photo-placeholder strong {
    font-size: 17px !important;
}

@media (max-width: 820px) {
    .mts-category-photo-card {
        min-height: 180px !important;
    }
}

@media (max-width: 540px) {
    .mts-category-photo-card {
        min-height: 175px !important;
    }
}


/* =========================================================
   METRO QUOTE BASKET V1
   ========================================================= */

.mts-header-quote-basket #mts-header-basket-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    margin-right: 4px;
    color: #ffffff;
    background: #ff5e00;
    border-radius: 50%;
}

.mts-nav-basket-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 19px;
    height: 19px;
    margin-left: 5px;
    color: #ffffff;
    background: #ff5e00;
    border-radius: 50%;
    font-size: 8px;
}

.mts-enquiry-button,
.mts-product-v3-actions button.primary {
    width: 100%;
    cursor: pointer;
    border: 0;
    font-family: inherit;
}

.mts-add-to-quote.added {
    background: #3c8f18 !important;
}

.mts-quote-basket-toast {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 99999;
    display: grid;
    min-width: 290px;
    padding: 17px 18px;
    color: #ffffff;
    pointer-events: none;
    opacity: 0;
    background: #12191d;
    border: 1px solid #ff6500;
    border-left: 4px solid #ff6500;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .38);
    transform: translateY(20px);
    transition:
        opacity .2s ease,
        transform .2s ease;
}

.mts-quote-basket-toast.visible {
    pointer-events: auto;
    opacity: 1;
    transform: translateY(0);
}

.mts-quote-basket-toast strong,
.mts-quote-basket-toast span,
.mts-quote-basket-toast a {
    display: block;
}

.mts-quote-basket-toast span {
    margin-top: 5px;
    color: #aeb9be;
    font-size: 10px;
}

.mts-quote-basket-toast a {
    margin-top: 10px;
    color: #ff6500;
    font-size: 9px;
    font-weight: 900;
}

.mts-basket-page {
    min-height: 520px;
    padding: 62px 0 82px;
    background: #050708;
}

.mts-basket-empty {
    padding: 72px 30px;
    text-align: center;
    background: #101619;
    border: 1px solid #354047;
}

.mts-basket-empty > span {
    color: #ff6500;
    font-size: 9px;
    font-weight: 950;
    letter-spacing: 1.5px;
}

.mts-basket-empty h2 {
    margin: 11px 0;
    color: #ffffff;
    font-size: 38px;
}

.mts-basket-empty p {
    color: #99a6ac;
}

.mts-basket-empty a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    margin-top: 18px;
    padding: 0 22px;
    color: #ffffff;
    text-decoration: none;
    background: #ff5e00;
    font-weight: 900;
}

.mts-basket-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 24px;
    align-items: start;
}

.mts-basket-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

.mts-basket-heading span,
.mts-basket-summary > span {
    color: #ff6500;
    font-size: 8px;
    font-weight: 950;
    letter-spacing: 1.3px;
}

.mts-basket-heading h2,
.mts-basket-summary h2 {
    margin: 7px 0 0;
    color: #ffffff;
}

.mts-basket-heading button {
    color: #ff8050;
    cursor: pointer;
    background: transparent;
    border: 0;
    font-size: 9px;
    font-weight: 900;
}

.mts-basket-item {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr) 150px 70px;
    gap: 18px;
    align-items: center;
    margin-bottom: 11px;
    padding: 14px;
    background: #101619;
    border: 1px solid #354047;
}

.mts-basket-item-image {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 105px;
    background: #ffffff;
}

.mts-basket-item-image img {
    width: 100%;
    height: 100%;
    padding: 8px;
    box-sizing: border-box;
    object-fit: contain;
}

.mts-basket-placeholder {
    text-align: center;
}

.mts-basket-placeholder span,
.mts-basket-placeholder strong {
    display: block;
}

.mts-basket-placeholder span {
    color: #ff6500;
    font-size: 7px;
}

.mts-basket-placeholder strong {
    margin-top: 5px;
    color: #12212a;
    font-size: 10px;
}

.mts-basket-item-details > span,
.mts-basket-item-details > a,
.mts-basket-item-details > small {
    display: block;
}

.mts-basket-item-details > span {
    color: #ff6500;
    font-size: 8px;
    font-weight: 900;
}

.mts-basket-item-details > a {
    margin-top: 7px;
    color: #ffffff;
    text-decoration: none;
    font-size: 15px;
    font-weight: 900;
}

.mts-basket-item-details > small {
    margin-top: 7px;
    color: #88959b;
}

.mts-basket-quantity > span {
    display: block;
    margin-bottom: 7px;
    color: #8d9aa0;
    font-size: 7px;
    font-weight: 900;
}

.mts-basket-quantity > div {
    display: grid;
    grid-template-columns: 35px 55px 35px;
}

.mts-basket-quantity button,
.mts-basket-quantity input {
    height: 37px;
    box-sizing: border-box;
    text-align: center;
    background: #080d0f;
    border: 1px solid #455159;
}

.mts-basket-quantity button {
    color: #ffffff;
    cursor: pointer;
    font-size: 16px;
}

.mts-basket-quantity input {
    color: #ffffff;
}

.mts-basket-remove {
    color: #ff7b54;
    cursor: pointer;
    background: transparent;
    border: 0;
    font-size: 9px;
    font-weight: 900;
}

.mts-basket-summary {
    position: sticky;
    top: 135px;
    padding: 25px;
    background: #101619;
    border: 1px solid #354047;
    border-top: 3px solid #ff6500;
}

.mts-basket-summary-row {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 14px 0;
    color: #b6c0c5;
    border-bottom: 1px solid #303b40;
    font-size: 10px;
}

.mts-basket-summary-row strong {
    color: #ffffff;
}

.mts-basket-summary p {
    color: #8d9a9f;
    font-size: 10px;
    line-height: 1.65;
}

.mts-basket-submit,
.mts-basket-continue {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 49px;
    margin-top: 13px;
    text-align: center;
    text-decoration: none;
    font-size: 10px;
    font-weight: 900;
}

.mts-basket-submit {
    color: #ffffff;
    background: #ff5e00;
}

.mts-basket-continue {
    color: #ffffff;
    border: 1px solid #68747a;
}

.mts-request-basket-summary {
    margin-bottom: 24px;
    padding: 19px;
    background: #080d0f;
    border: 1px solid #3b464c;
}

.mts-request-basket-heading {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 12px;
}

.mts-request-basket-heading span {
    color: #ff6500;
    font-size: 8px;
    font-weight: 950;
}

.mts-request-basket-heading strong {
    color: #ffffff;
    font-size: 10px;
}

.mts-request-basket-item {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 10px 0;
    border-bottom: 1px solid #303a40;
}

.mts-request-basket-item strong,
.mts-request-basket-item span {
    display: block;
}

.mts-request-basket-item strong {
    color: #ffffff;
    font-size: 10px;
}

.mts-request-basket-item span {
    margin-top: 3px;
    color: #87949a;
    font-size: 8px;
}

.mts-request-basket-item b {
    color: #ff6500;
    font-size: 9px;
}

.mts-request-basket-summary > a {
    display: inline-block;
    margin-top: 13px;
    color: #ff6500;
    font-size: 9px;
    font-weight: 900;
}

.mts-request-empty {
    color: #89969c;
    font-size: 10px;
}

@media (max-width: 950px) {
    .mts-basket-layout {
        grid-template-columns: 1fr;
    }

    .mts-basket-summary {
        position: static;
    }
}

@media (max-width: 700px) {
    .mts-basket-item {
        grid-template-columns: 90px 1fr;
    }

    .mts-basket-item-image {
        width: 90px;
        height: 85px;
    }

    .mts-basket-quantity,
    .mts-basket-remove {
        grid-column: 2;
    }

    .mts-quote-basket-toast {
        right: 14px;
        bottom: 14px;
        left: 14px;
        min-width: 0;
    }
}


/* =========================================================
   MTS HOMEBRAND LOGO
   ========================================================= */

.mts-home-brand-logo img[alt="MTS Homebrand"] {
    width: 100%;
    max-width: 125px;
    height: 72px;
    padding: 8px;
    box-sizing: border-box;
    object-fit: contain;
}


/* =========================================================
   METRO TRADE LOGIN PAGE V29
   ========================================================= */

.mts-login-hero {
    padding: 70px 0;
    background:
        radial-gradient(
            circle at 82% 42%,
            rgba(255, 96, 0, .08),
            transparent 27%
        ),
        linear-gradient(
            110deg,
            #061727,
            #0a2633
        );
    border-bottom: 1px solid #29363d;
}

.mts-login-hero-grid {
    display: grid;
    grid-template-columns:
        minmax(0, 1.05fr)
        minmax(480px, .95fr);
    gap: 70px;
    align-items: center;
}

.mts-login-hero-copy > span,
.mts-login-eyebrow {
    color: #ff6500;
    font-size: 9px;
    font-weight: 950;
    letter-spacing: 1.8px;
}

.mts-login-hero-copy h1 {
    max-width: 720px;
    margin: 14px 0 18px;
    color: #ffffff;
    font-size: clamp(45px, 5vw, 72px);
    font-weight: 950;
    line-height: .98;
    letter-spacing: -2px;
}

.mts-login-hero-copy p {
    max-width: 680px;
    margin: 0;
    color: #bdc8cd;
    font-size: 16px;
    line-height: 1.65;
}

.mts-login-hero-features {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 11px;
}

.mts-login-hero-features article {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 80px;
    padding: 15px;
    background: rgba(8, 14, 17, .78);
    border: 1px solid #3a484f;
}

.mts-login-hero-features b {
    display: flex;
    flex: 0 0 38px;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: #ff6500;
    border: 1px solid #ff6500;
    border-radius: 50%;
    font-size: 8px;
}

.mts-login-hero-features strong,
.mts-login-hero-features span {
    display: block;
}

.mts-login-hero-features strong {
    color: #ffffff;
    font-size: 10px;
}

.mts-login-hero-features span {
    margin-top: 4px;
    color: #829198;
    font-size: 8px;
    line-height: 1.45;
}


/* Main login area */

.mts-login-page {
    padding: 68px 0 85px;
    background: #050708;
}

.mts-login-layout {
    display: grid;
    grid-template-columns:
        minmax(420px, .82fr)
        minmax(0, 1.18fr);
    gap: 70px;
    align-items: start;
}

.mts-login-panel {
    overflow: hidden;
    background:
        linear-gradient(
            155deg,
            #141c20,
            #0d1215
        );
    border: 1px solid #3b474e;
    border-top: 3px solid #ff6500;
    box-shadow:
        0 22px 55px
        rgba(0, 0, 0, .3);
}

.mts-login-panel-heading {
    padding: 29px 31px 22px;
    border-bottom: 1px solid #334047;
}

.mts-login-panel-heading > span {
    color: #ff6500;
    font-size: 8px;
    font-weight: 950;
    letter-spacing: 1.4px;
}

.mts-login-panel-heading h2 {
    margin: 9px 0;
    color: #ffffff;
    font-size: 31px;
    line-height: 1.08;
}

.mts-login-panel-heading p {
    margin: 0;
    color: #929fa5;
    font-size: 10px;
    line-height: 1.6;
}

.mts-login-form {
    padding: 27px 31px 30px;
}

.mts-login-field {
    margin-bottom: 18px;
}

.mts-login-field label {
    display: block;
    margin-bottom: 8px;
    color: #ffffff;
    font-size: 8px;
    font-weight: 950;
    letter-spacing: .75px;
    text-transform: uppercase;
}

.mts-login-label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.mts-login-label-row a {
    margin-bottom: 8px;
    color: #ff6500;
    text-decoration: none;
    font-size: 8px;
    font-weight: 800;
}

.mts-login-field input {
    width: 100%;
    min-height: 50px;
    padding: 0 14px;
    box-sizing: border-box;
    color: #eaf0f2;
    background: #080d0f;
    border: 1px solid #46535a;
    border-radius: 4px;
    font-family: inherit;
    font-size: 11px;
}

.mts-login-field input::placeholder {
    color: #738087;
}

.mts-login-field input:disabled {
    cursor: not-allowed;
    opacity: .7;
}

.mts-login-access-notice {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    margin: 22px 0;
    padding: 16px;
    color: #313a3f;
    background: #fff1e4;
    border: 1px solid #ffbd86;
    border-radius: 5px;
}

.mts-login-notice-icon {
    display: flex;
    flex: 0 0 35px;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
    color: #ff5d00;
    border: 1px solid #ff6500;
    border-radius: 50%;
    font-weight: 950;
}

.mts-login-access-notice strong,
.mts-login-access-notice span {
    display: block;
}

.mts-login-access-notice strong {
    color: #172027;
    font-size: 10px;
}

.mts-login-access-notice span {
    margin-top: 4px;
    color: #5f6a70;
    font-size: 8px;
    line-height: 1.5;
}

.mts-login-primary-action,
.mts-login-secondary-action {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    text-align: center;
    text-decoration: none;
    font-size: 10px;
    font-weight: 950;
}

.mts-login-primary-action {
    color: #ffffff;
    background:
        linear-gradient(
            90deg,
            #ff5000,
            #ff6700
        );
    box-shadow:
        0 9px 20px
        rgba(255, 91, 0, .2);
}

.mts-login-primary-action:hover {
    filter: brightness(1.07);
}

.mts-login-secondary-action {
    margin-top: 11px;
    color: #ffffff;
    background: transparent;
    border: 1px solid #5a676e;
}

.mts-login-secondary-action:hover {
    border-color: #ff6500;
}

.mts-login-security {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding: 15px 30px;
    background: #090d0f;
    border-top: 1px solid #334047;
}

.mts-login-security span {
    color: #728087;
    font-size: 6px;
    font-weight: 900;
    letter-spacing: .6px;
}


/* Benefits column */

.mts-login-content {
    padding-top: 6px;
}

.mts-login-content > h2 {
    max-width: 750px;
    margin: 13px 0 17px;
    color: #ffffff;
    font-size: clamp(34px, 4vw, 54px);
    font-weight: 950;
    line-height: 1.04;
    letter-spacing: -1.2px;
}

.mts-login-introduction {
    max-width: 720px;
    margin: 0 0 28px;
    color: #93a1a7;
    font-size: 12px;
    line-height: 1.7;
}

.mts-login-benefit-list {
    display: grid;
    gap: 11px;
}

.mts-login-benefit-list article {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    padding: 19px;
    background:
        linear-gradient(
            145deg,
            #131b1f,
            #0e1417
        );
    border: 1px solid #37434a;
    transition:
        border-color .18s ease,
        transform .18s ease;
}

.mts-login-benefit-list article:hover {
    transform: translateX(4px);
    border-color: #ff6500;
}

.mts-login-benefit-icon {
    display: flex;
    flex: 0 0 43px;
    align-items: center;
    justify-content: center;
    width: 43px;
    height: 43px;
    color: #ff6500;
    border: 1px solid #ff6500;
    border-radius: 5px;
    font-size: 16px;
    font-weight: 950;
}

.mts-login-benefit-list strong,
.mts-login-benefit-list p {
    display: block;
}

.mts-login-benefit-list strong {
    color: #ffffff;
    font-size: 12px;
}

.mts-login-benefit-list p {
    margin: 5px 0 0;
    color: #87959b;
    font-size: 9px;
    line-height: 1.55;
}

.mts-login-help-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    margin-top: 22px;
    padding: 22px 24px;
    background:
        linear-gradient(
            100deg,
            rgba(255, 96, 0, .13),
            rgba(255, 96, 0, .02)
        );
    border: 1px solid #6b3c22;
    border-left: 3px solid #ff6500;
}

.mts-login-help-panel span,
.mts-login-help-panel strong,
.mts-login-help-panel p {
    display: block;
}

.mts-login-help-panel span {
    color: #ff6500;
    font-size: 7px;
    font-weight: 950;
    letter-spacing: 1.1px;
}

.mts-login-help-panel strong {
    margin-top: 5px;
    color: #ffffff;
    font-size: 13px;
}

.mts-login-help-panel p {
    margin: 5px 0 0;
    color: #87949a;
    font-size: 9px;
}

.mts-login-help-panel > a {
    flex: 0 0 auto;
    color: #ffffff;
    text-decoration: none;
    font-size: 9px;
    font-weight: 950;
}


/* Responsive */

@media (max-width: 1050px) {
    .mts-login-hero-grid,
    .mts-login-layout {
        grid-template-columns: 1fr;
    }

    .mts-login-hero-grid,
    .mts-login-layout {
        gap: 38px;
    }

    .mts-login-panel {
        max-width: 650px;
    }
}

@media (max-width: 650px) {
    .mts-login-hero {
        padding: 48px 0;
    }

    .mts-login-hero-features {
        grid-template-columns: 1fr;
    }

    .mts-login-page {
        padding: 45px 0 60px;
    }

    .mts-login-panel-heading,
    .mts-login-form {
        padding-right: 20px;
        padding-left: 20px;
    }

    .mts-login-security {
        flex-direction: column;
        padding-right: 20px;
        padding-left: 20px;
    }

    .mts-login-help-panel {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* =========================================================
   ERP CATEGORY HIERARCHY
   ========================================================= */

.mts-category-tree-node {
    display: block;
    width: 100%;
}

.mts-category-tree-node > a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
}

.mts-category-tree-children {
    margin-left: 14px;
    padding-left: 12px;
    border-left: 1px solid rgba(19, 44, 72, 0.14);
}

.mts-category-level-0 > a {
    font-weight: 800;
}

.mts-category-level-1 > a {
    font-weight: 650;
}

.mts-category-level-2 > a {
    font-size: 0.92rem;
}

.mts-category-dropdown {
    max-height: 70vh;
    overflow-y: auto;
}

.mts-category-dropdown .mts-category-tree-node > a {
    padding: 10px 14px;
}

.mts-category-dropdown .mts-category-tree-children {
    margin-left: 9px;
    padding-left: 8px;
}

.mts-sidebar-category-tree {
    display: grid;
    gap: 3px;
}

.mts-sidebar-category-tree
.mts-category-tree-node > a {
    padding: 8px 10px;
    border-radius: 4px;
}

.mts-sidebar-category-tree
.mts-category-tree-node > a:hover {
    background: rgba(19, 44, 72, 0.06);
}

.mts-sidebar-category-tree
.mts-category-tree-children {
    margin-top: 2px;
    margin-bottom: 5px;
}

@media (max-width: 900px) {
    .mts-category-dropdown {
        max-height: none;
    }

    .mts-category-tree-children {
        margin-left: 8px;
        padding-left: 8px;
    }
}


/* =========================================================
   METRO CATEGORY MEGA MENU — CLEAN LAYOUT
   ========================================================= */

.mts-category-dropdown {
    width: min(1180px, calc(100vw - 48px)) !important;
    max-width: 1180px !important;
    max-height: min(72vh, 720px) !important;
    padding: 22px !important;

    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: start !important;
    gap: 18px !important;

    overflow-y: auto !important;
    overflow-x: hidden !important;

    background:
        linear-gradient(
            145deg,
            rgba(18, 27, 32, 0.99),
            rgba(11, 18, 23, 0.99)
        ) !important;

    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-top: 3px solid #ff5a00 !important;
    border-radius: 0 0 8px 8px !important;

    box-shadow:
        0 24px 70px rgba(0, 0, 0, 0.55) !important;
}


/* Each top-level ERP category becomes a clean panel. */

.mts-category-dropdown
> .mts-category-tree-node {
    min-width: 0 !important;
    padding: 0 !important;

    background: rgba(255, 255, 255, 0.018);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 6px;

    overflow: hidden;
}


/* Top-level category heading. */

.mts-category-dropdown
> .mts-category-tree-node
> a {
    min-height: 50px !important;
    padding: 14px 16px !important;

    background: rgba(255, 255, 255, 0.035);

    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.09) !important;

    color: #ffffff !important;
    font-size: 0.92rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.025em !important;
    line-height: 1.25 !important;

    text-transform: none !important;
}


/* Orange product count badges. */

.mts-category-dropdown
.mts-category-tree-node
> a
> small {
    flex: 0 0 auto;

    min-width: 30px;
    padding: 4px 8px;

    color: #ff6a16 !important;
    background: rgba(255, 90, 0, 0.11);

    border: 1px solid rgba(255, 90, 0, 0.22);
    border-radius: 999px;

    font-size: 0.71rem !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-align: center;
}


/* Remove the old long vertical line appearance. */

.mts-category-dropdown
.mts-category-tree-children {
    margin: 0 !important;
    padding: 7px !important;

    border-left: 0 !important;
}


/* Normal child category rows. */

.mts-category-dropdown
.mts-category-tree-children
.mts-category-tree-node
> a {
    min-height: 40px !important;
    padding: 9px 10px !important;

    color: rgba(255, 255, 255, 0.84) !important;
    background: transparent !important;

    border: 0 !important;
    border-radius: 4px !important;

    font-size: 0.83rem !important;
    font-weight: 650 !important;
    line-height: 1.28 !important;

    transition:
        background-color 150ms ease,
        color 150ms ease,
        transform 150ms ease;
}


.mts-category-dropdown
.mts-category-tree-children
.mts-category-tree-node
> a:hover {
    color: #ffffff !important;
    background: rgba(255, 90, 0, 0.12) !important;
    transform: translateX(2px);
}


/*
   Third-level product families, such as the individual
   Grab Rail categories, are shown in two columns.
*/

.mts-category-dropdown
.mts-category-level-1
> .mts-category-tree-children {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 3px 7px !important;

    padding:
        2px
        7px
        8px
        16px !important;
}


.mts-category-dropdown
.mts-category-level-2
> a {
    min-height: 38px !important;
    padding: 8px 9px !important;

    color: rgba(255, 255, 255, 0.72) !important;

    border-bottom:
        1px solid rgba(255, 255, 255, 0.055) !important;

    font-size: 0.79rem !important;
    font-weight: 500 !important;
}


/* Avoid extra nesting indentation. */

.mts-category-dropdown
.mts-category-level-2
.mts-category-tree-children,
.mts-category-dropdown
.mts-category-level-3
.mts-category-tree-children {
    display: block !important;

    margin: 0 !important;
    padding: 0 0 0 8px !important;
}


/* Wider important divisions. */

.mts-category-dropdown
> .mts-category-tree-node:has(
    > a[href="/categories/disability-modifications"]
) {
    grid-column: span 2;
}


/*
   Keep small categories from creating a huge empty panel.
*/

.mts-category-dropdown
> .mts-category-tree-node:not(
    :has(.mts-category-tree-children)
)
> a {
    border-bottom: 0 !important;
}


/* Custom scrollbar. */

.mts-category-dropdown {
    scrollbar-width: thin;
    scrollbar-color:
        rgba(255, 90, 0, 0.75)
        rgba(255, 255, 255, 0.04);
}


.mts-category-dropdown::-webkit-scrollbar {
    width: 9px;
}


.mts-category-dropdown::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.035);
}


.mts-category-dropdown::-webkit-scrollbar-thumb {
    background: rgba(255, 90, 0, 0.7);
    border-radius: 999px;
}


/* =========================================================
   METRO HOME BRAND — USE ACTUAL METRO LOGO
   ========================================================= */

/*
   Supports the likely brand-card structures without requiring
   the ERP brand name or product data to be changed.
*/

a[href="/brands/metro-home-brand"]
.mts-brand-logo,

a[href="/brands/metro-home-brand"]
.brand-logo,

a[href="/brands/metro-home-brand"]
[class*="brand"][class*="logo"] {
    position: relative !important;

    min-width: 150px !important;
    min-height: 92px !important;

    color: transparent !important;
    font-size: 0 !important;

    background:
        #ffffff
        url("/static/images/metro-logo.png")
        center / 86% auto
        no-repeat !important;

    overflow: hidden !important;
}


/*
   Fallback for the current card where the first panel contains
   the text-only Metro Home Brand placeholder.
*/

a[href="/brands/metro-home-brand"]
> :first-child {
    background:
        #ffffff
        url("/static/images/metro-logo.png")
        center / 86% auto
        no-repeat !important;
}


a[href="/brands/metro-home-brand"]
> :first-child
* {
    visibility: hidden !important;
}


/* Keep the product-range name visible outside the logo panel. */

a[href="/brands/metro-home-brand"] {
    border-color: rgba(255, 90, 0, 0.46) !important;
}


a[href="/brands/metro-home-brand"]:hover {
    border-color: #ff5a00 !important;
}


/* =========================================================
   RESPONSIVE CATEGORY MENU
   ========================================================= */

@media (max-width: 1100px) {

    .mts-category-dropdown {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }

    .mts-category-dropdown
    > .mts-category-tree-node:has(
        > a[href="/categories/disability-modifications"]
    ) {
        grid-column: span 2;
    }
}


@media (max-width: 720px) {

    .mts-category-dropdown {
        width: calc(100vw - 24px) !important;
        max-height: calc(100vh - 150px) !important;

        grid-template-columns: 1fr !important;
        gap: 10px !important;

        padding: 12px !important;
    }

    .mts-category-dropdown
    > .mts-category-tree-node:has(
        > a[href="/categories/disability-modifications"]
    ) {
        grid-column: auto;
    }

    .mts-category-dropdown
    .mts-category-level-1
    > .mts-category-tree-children {
        grid-template-columns: 1fr !important;
    }
}


/* =========================================================
   CATEGORY MEGA MENU OPEN / CLOSE FIX
   ========================================================= */

/*
   The menu must remain hidden unless JavaScript adds
   the mts-menu-open class.
*/

.mts-category-dropdown {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;

    transform: translateY(-6px);
    transform-origin: top left;

    transition:
        opacity 140ms ease,
        transform 140ms ease,
        visibility 140ms ease;
}


/* Open state */

.mts-category-dropdown.mts-menu-open {
    display: grid !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;

    transform: translateY(0);
}


/* Prevent an invisible menu blocking page clicks */

.mts-category-dropdown:not(.mts-menu-open) {
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    border-width: 0 !important;
}


/* Restore the designed dimensions only while open */

.mts-category-dropdown.mts-menu-open {
    height: auto !important;
    min-height: initial !important;
    max-height: min(72vh, 720px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 22px !important;
    border-width: 1px !important;
    border-top-width: 3px !important;
}


@media (max-width: 720px) {

    .mts-category-dropdown.mts-menu-open {
        max-height: calc(100vh - 150px) !important;
        padding: 12px !important;
    }
}


/* =========================================================
   PUBLIC TRADE ACCOUNT → SECURE PORTAL ENTRY
   ========================================================= */

.mts-portal-entry {
    text-align: left;
}

.mts-portal-entry-icon {
    width: 58px;
    height: 58px;
    margin-bottom: 22px;

    display: grid;
    place-items: center;

    border: 2px solid #ff5a00;
    border-radius: 999px;

    color: #ff5a00;
    font-size: 1.55rem;
    font-weight: 900;
}

.mts-portal-entry-label {
    margin: 0 0 8px;

    color: #ff5a00;
    font-size: 0.73rem;
    font-weight: 900;
    letter-spacing: 0.14em;
}

.mts-portal-entry h2 {
    margin: 0 0 14px;
}

.mts-portal-entry-copy {
    margin: 0 0 26px;

    color: #5f6973;
    font-size: 0.95rem;
    line-height: 1.65;
}

.mts-portal-entry-actions {
    display: grid;
    gap: 12px;
}

.mts-portal-entry .mts-account-submit {
    width: 100%;
    min-height: 54px;

    display: flex;
    align-items: center;
    justify-content: center;

    text-align: center;
    text-decoration: none;
}

.mts-portal-signin {
    width: 100%;
    min-height: 50px;
    padding: 13px 18px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid #cbd2d8;
    border-radius: 4px;

    background: #ffffff;
    color: #132337;

    font-size: 0.88rem;
    font-weight: 800;
    text-align: center;
    text-decoration: none;

    transition:
        border-color 150ms ease,
        color 150ms ease,
        background-color 150ms ease;
}

.mts-portal-signin:hover {
    border-color: #ff5a00;
    background: #fff7f2;
    color: #e84f00;
}
