/* ==========================================================
   STONE GALLERIA
   GRANITE PRICE EXPERIENCE V2
   Page-specific only.
   Pricing, AJAX and filtering behaviour remain untouched.
   ========================================================== */

.granite-price-main {
    --gp-ink: #171717;
    --gp-muted: #66615b;
    --gp-soft: #f6f3ee;
    --gp-paper: #ffffff;
    --gp-line: #e7e1d8;
    --gp-accent: #8b6f4e;
    --gp-accent-dark: #6e563c;
    --gp-chip: #f8f6f2;

    background:
        radial-gradient(circle at 50% 0%, rgba(139,111,78,.055), transparent 34%),
        #fbfaf8;

    padding: 48px 0 72px !important;
}


/* ==========================================================
   PAGE TITLE
   ========================================================== */

/* ==========================================================
   INTRO / HERO ANSWER
   ========================================================== */

.granite-price-main .sub-heading {
    margin-bottom: 36px;
}

.granite-price-main .sub-heading > h2 {
    max-width: 900px;
    margin: 0 auto 12px;
    color: var(--gp-ink);
    font-size: clamp(27px, 3.3vw, 39px);
    line-height: 1.16;
    font-weight: 500;
    letter-spacing: -.025em;
}

.granite-price-main .price-hero-lede {
    max-width: 720px;
    margin: 0 auto !important;
    color: var(--gp-muted) !important;
    font-size: clamp(15px, 1.5vw, 17px) !important;
    line-height: 1.7 !important;
}


/* ==========================================================
   COLOUR PRICE GUIDE
   ========================================================== */

.granite-price-main > .container > h2 {
    margin: 12px 0 8px;
    color: var(--gp-ink);
    font-size: clamp(23px, 2.4vw, 30px);
    font-weight: 500;
    letter-spacing: -.015em;
}

.granite-price-main > .container > h2 + p {
    max-width: 760px;
    margin-bottom: 20px;
    color: var(--gp-muted);
    line-height: 1.65;
}

.granite-price-main .colour-price-list {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;

    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 42px !important;
}

.granite-price-main .colour-price-list li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    min-width: 0;
}

.granite-price-main .colour-price-list li::before {
    display: none !important;
}

.granite-price-main .colour-price-list a {
    position: relative;

    display: flex;
    align-items: center;

    min-height: 82px;
    height: 100%;

    padding: 16px 42px 16px 17px;

    background: rgba(255,255,255,.88);
    border: 1px solid var(--gp-line);
    border-radius: 13px;

    color: #292724;
    text-decoration: none !important;

    font-size: 14px;
    font-weight: 500;
    line-height: 1.45;

    box-shadow: 0 1px 2px rgba(0,0,0,.025);

    transition:
        border-color .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

.granite-price-main .colour-price-list a::after {
    content: "→";

    position: absolute;
    inset-inline-end: 15px;
    top: 50%;

    transform: translateY(-50%);

    color: var(--gp-accent);
    font-size: 17px;
    font-weight: 400;

    transition: transform .2s ease;
}

.granite-price-main .colour-price-list a:hover {
    color: #111;
    border-color: #cfc4b5;
    transform: translateY(-2px);
    box-shadow: 0 7px 22px rgba(51,42,32,.07);
}

.granite-price-main .colour-price-list a:hover::after {
    transform: translate(3px, -50%);
}


/* ==========================================================
   REMOVE OLD INNER SPACING
   ========================================================== */

.granite-price-main .content-inner-all {
    padding: 0 !important;
}

.granite-price-main .price-list-layout {
    display: grid !important;
    grid-template-columns: minmax(270px, 300px) minmax(0, 1fr);

    gap: 28px !important;
    align-items: start !important;

    width: 100%;
    margin-top: 4px;
    padding: 0 !important;
}


/* ==========================================================
   PRICE EXPLORER SHELL
   ========================================================== */

.granite-price-main .price-filter-shell {
    position: sticky;
    top: 92px;

    min-width: 0;
    width: 100%;
}

.granite-price-main .price-filter-details {
    width: 100%;

    background: var(--gp-paper);
    border: 1px solid var(--gp-line);
    border-radius: 17px;

    box-shadow:
        0 1px 2px rgba(0,0,0,.025),
        0 10px 35px rgba(47,39,30,.045);
}

.granite-price-main .price-filter-body {
    max-height: calc(100vh - 115px);
    overflow-y: auto;
    overscroll-behavior: contain;

    padding: 17px;
}

.granite-price-main .price-filter-body::-webkit-scrollbar {
    width: 5px;
}

.granite-price-main .price-filter-body::-webkit-scrollbar-thumb {
    background: #d8d1c7;
    border-radius: 10px;
}


/* ==========================================================
   SEARCH
   ========================================================== */

.granite-price-main .price-list-search {
    display: block !important;
    width: 100% !important;
    margin: 0 0 18px;
}

.granite-price-main .price-list-search .widget_search {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

.granite-price-main .price-list-search .search-form {
    position: relative;
    display: block;
    width: 100%;
}

.granite-price-main .price-list-search .search-field {
    width: 100%;
    height: 46px;

    padding: 0 45px 0 14px;

    background: #faf9f7;
    border: 1px solid #ddd7ce;
    border-radius: 10px;

    color: #222;
    font-size: 14px;

    outline: none;

    transition:
        border-color .18s ease,
        background .18s ease,
        box-shadow .18s ease;
}

[dir="rtl"] .granite-price-main .price-list-search .search-field {
    padding: 0 14px 0 45px;
}

.granite-price-main .price-list-search .search-field:focus {
    background: #fff;
    border-color: #b9aa98;
    box-shadow: 0 0 0 3px rgba(139,111,78,.08);
}

.granite-price-main .price-list-search .search-submit {
    position: absolute;

    inset-inline-end: 4px;
    top: 4px;

    width: 38px;
    height: 38px;

    display: inline-flex;
    justify-content: center;
    align-items: center;

    padding: 0;

    background: transparent;
    border: 0;
    border-radius: 8px;

    color: var(--gp-accent);
}


/* ==========================================================
   FILTER PANEL
   ========================================================== */

.granite-price-main .price-list-sidebar,
.granite-price-main .price-list-layout .blog-srch {
    width: 100% !important;
    max-width: none !important;
    flex: none !important;

    margin: 0 !important;
    padding: 0 !important;
}

.granite-price-main .price-filter {
    display: block !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent;
}

.granite-price-main .price-filter-group {
    display: block !important;

    min-width: 0;

    margin: 0 !important;
    padding: 16px 0 17px !important;

    border: 0 !important;
    border-bottom: 1px solid #eee9e2 !important;
}

.granite-price-main .price-filter-group:first-child {
    padding-top: 2px !important;
}

.granite-price-main .price-filter-title {
    float: none !important;
    width: auto !important;

    display: block;

    margin: 0 0 10px !important;
    padding: 0 !important;

    color: #4d4944 !important;

    font-size: 11px !important;
    font-weight: 700 !important;

    line-height: 1.3;

    text-transform: uppercase;
    letter-spacing: .095em;
}


/* ==========================================================
   FILTER CHIPS
   ========================================================== */

.granite-price-main .price-filter-options,
.granite-price-main .price-filter-options.finish-options,
.granite-price-main .price-filter-options.thickness-options,
.granite-price-main .price-filter-options.option-grid {
    display: flex !important;
    flex-flow: row wrap !important;

    align-items: center !important;
    justify-content: flex-start !important;

    gap: 7px !important;

    width: 100%;
}

.granite-price-main .price-filter-option,
.granite-price-main .price-filter-options.finish-options .price-filter-option,
.granite-price-main .price-filter-options.thickness-options .price-filter-option,
.granite-price-main .price-filter-options.option-grid .price-filter-option {
    position: relative;

    display: inline-flex !important;

    flex: 0 0 auto !important;

    width: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    cursor: pointer;
}

.granite-price-main .price-filter-radio {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;

    overflow: hidden;
    pointer-events: none;
}

.granite-price-main .price-filter-option > span {
    display: inline-flex;
    justify-content: center;
    align-items: center;

    min-height: 35px;

    padding: 7px 11px;

    border: 1px solid #ddd7cf;
    border-radius: 9px;

    background: var(--gp-chip);

    color: #4c4843;

    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.2;

    text-align: center;
    white-space: normal;

    transition:
        background .15s ease,
        border-color .15s ease,
        color .15s ease,
        transform .15s ease;
}

.granite-price-main .price-filter-option:hover > span {
    background: #fff;
    border-color: #bfb4a7;
}

.granite-price-main .price-filter-radio:checked + span {
    background: var(--gp-ink);
    border-color: var(--gp-ink);

    color: #fff;
}

.granite-price-main .price-filter-radio:focus-visible + span {
    outline: 3px solid rgba(139,111,78,.18);
    outline-offset: 2px;
}

.granite-price-main .price-filter-radio:disabled + span {
    opacity: .34;
    cursor: not-allowed;
}


/* ==========================================================
   CURRENCY
   ========================================================== */

.granite-price-main .currency-toggle-options {
    display: inline-flex !important;

    gap: 4px !important;

    padding: 4px;

    background: #f3f0eb;
    border: 1px solid #e1dbd2;
    border-radius: 11px;
}

.granite-price-main .currency-btn {
    width: 43px !important;
    height: 34px !important;

    min-height: 34px !important;

    display: inline-flex !important;
    justify-content: center;
    align-items: center;

    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 8px !important;

    color: #5c5751 !important;

    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1 !important;

    box-shadow: none !important;
}

.granite-price-main .currency-btn:hover {
    background: rgba(255,255,255,.7) !important;
}

.granite-price-main .currency-btn.active {
    background: #fff !important;

    color: #151515 !important;

    box-shadow:
        0 1px 2px rgba(0,0,0,.06),
        0 2px 8px rgba(0,0,0,.035) !important;
}


/* ==========================================================
   PRICE RANGE DISABLED STATE
   ========================================================== */

.granite-price-main .price-range-group.is-disabled {
    opacity: .46;
}

.granite-price-main .price-range-group.is-disabled .price-filter-option {
    cursor: not-allowed;
}


/* ==========================================================
   CLEAR FILTERS
   ========================================================== */

.granite-price-main .price-clear-link {
    width: 100% !important;

    margin: 16px 0 6px !important;
    padding: 10px 12px !important;

    background: transparent !important;
    border: 1px solid #d9d2c9 !important;
    border-radius: 9px !important;

    color: #655e56 !important;

    font-size: 12.5px !important;
    font-weight: 600 !important;

    text-decoration: none !important;

    transition:
        background .15s ease,
        border-color .15s ease,
        color .15s ease;
}

.granite-price-main .price-clear-link:hover {
    background: #f7f4ef !important;
    border-color: #beb3a5 !important;
    color: #111 !important;
}


/* ==========================================================
   PRODUCT CATALOGUE
   ========================================================== */

.granite-price-main #filtered-products {
    display: grid !important;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 18px !important;

    width: 100% !important;
    max-width: none !important;

    min-width: 0;
}

.granite-price-main .price-product-card {
    display: flex !important;
    flex-direction: column !important;

    width: 100% !important;
    max-width: none !important;

    min-width: 0;

    margin: 0 !important;

    overflow: hidden;

    background: #fff;

    border: 1px solid #e8e3dc;
    border-radius: 15px !important;

    box-shadow:
        0 1px 2px rgba(0,0,0,.025),
        0 6px 22px rgba(52,43,33,.035) !important;

    transform: none !important;

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        transform .2s ease !important;
}

.granite-price-main .price-product-card:hover {
    transform: translateY(-2px) !important;

    border-color: #d5cabd;

    box-shadow:
        0 2px 4px rgba(0,0,0,.03),
        0 12px 30px rgba(53,43,32,.07) !important;
}

.granite-price-main .price-product-card > .col-md-4 {
    width: 100% !important;
    max-width: 100% !important;

    flex: none !important;

    height: 230px;

    overflow: hidden;
}

.granite-price-main .price-product-image {
    display: block;

    width: 100% !important;
    height: 230px !important;

    object-fit: cover !important;

    border-radius: 0 !important;

    transition: transform .45s ease;
}

.granite-price-main .price-product-card:hover .price-product-image {
    transform: scale(1.018);
}

.granite-price-main .price-product-content {
    width: 100% !important;
    max-width: 100% !important;

    flex: 1 1 auto !important;

    display: flex;
    flex-direction: column;

    padding: 18px 18px 19px !important;
}

.granite-price-main .price-product-title {
    margin: 0 0 8px !important;

    color: #191919;

    font-size: clamp(18px, 1.55vw, 21px) !important;
    font-weight: 600 !important;
    line-height: 1.25;

    letter-spacing: -.015em;
}

.granite-price-main .price-product-description {
    margin-bottom: 12px;
}

.granite-price-main .price-product-description .desc {
    display: -webkit-box !important;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2 !important;

    overflow: hidden;

    color: #706a64;

    font-size: 13.5px;
    line-height: 1.55;
}

.granite-price-main .price-product-description .desc p {
    margin: 0 !important;
}

.granite-price-main .price-product-spec {
    display: flex;
    flex-wrap: wrap;
    gap: 5px !important;
    margin: 0 0 14px !important;
    line-height: 1;
}

.granite-price-main .price-product-spec-item {
    display: inline-block;

    padding: 5px 8px !important;

    background: #f7f5f1 !important;
    border: 1px solid #e6e0d8 !important;
    border-radius: 999px !important;

    color: #625c55 !important;

    font-size: 10.5px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;

    letter-spacing: .02em;
    white-space: normal;
}

.granite-price-main .price-product-basis {
    margin-top: 7px;

    color: #777 !important;

    font-size: 11px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    letter-spacing: 0 !important;
}

.granite-price-main .price-product-basis-secondary {
    margin-top: 2px;

    color: #999 !important;

    font-size: 10.5px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    letter-spacing: 0 !important;
}

.granite-price-main .price-product-price {
    margin-top: auto !important;
    padding-top: 3px;

    color: #111 !important;
}

.granite-price-main .price-display-line {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;

    gap: 5px;

    margin-bottom: 15px;
}

.granite-price-main .price-value {
    color: #111;

    font-size: clamp(21px, 2vw, 25px);
    font-weight: 650;
    line-height: 1.05;

    letter-spacing: -.025em;
}

.granite-price-main .price-product-price .per-unit,
.granite-price-main .price-display-line .per-unit {
    color: #77716a !important;

    font-size: 12.5px !important;
    font-weight: 500 !important;
}


/* ==========================================================
   PRODUCT CTA
   ========================================================== */

.granite-price-main .price-product-card .btn-six {
    position: relative;

    display: inline-flex;
    justify-content: center;
    align-items: center;

    width: 100%;

    min-height: 42px;

    margin-top: 2px;
    padding: 10px 16px;

    overflow: hidden;

    background: #1b1b1b !important;
    border: 1px solid #1b1b1b !important;
    border-radius: 9px !important;

    color: #fff !important;

    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.2;

    letter-spacing: .045em;
    text-decoration: none !important;
    text-transform: uppercase;

    box-shadow: none !important;

    transition:
        background .18s ease,
        border-color .18s ease,
        transform .18s ease;
}

.granite-price-main .price-product-card .btn-six::before {
    display: none !important;
}

.granite-price-main .price-product-card .btn-six:hover {
    background: var(--gp-accent-dark) !important;
    border-color: var(--gp-accent-dark) !important;

    color: #fff !important;

    transform: translateY(-1px);
}


/* ==========================================================
   EMPTY / LOADING
   ========================================================== */

.granite-price-main .price-empty,
.granite-price-main .price-loading {
    grid-column: 1 / -1;

    padding: 38px 20px !important;

    background: #fff;

    border: 1px solid var(--gp-line);
    border-radius: 14px;

    color: var(--gp-muted);
}


/* ==========================================================
   PAGINATION
   ========================================================== */

.granite-price-main .pagination-wrapper {
    grid-column: 1 / -1;

    width: 100%;

    margin-top: 14px;
    padding-top: 10px;
}

.granite-price-main .pagination {
    gap: 5px;

    justify-content: center;
}

.granite-price-main .pagination .page-item {
    margin: 0 !important;
}

.granite-price-main .pagination .page-link {
    min-width: 38px;
    height: 38px;

    display: inline-flex;
    justify-content: center;
    align-items: center;

    padding: 0 10px;

    background: #fff;
    border: 1px solid #e1dbd3;
    border-radius: 8px !important;

    color: #4d4842;

    font-size: 13px;

    box-shadow: none !important;
}

.granite-price-main .pagination .page-item.active .page-link {
    background: #1b1b1b;
    border-color: #1b1b1b;

    color: #fff;
}


/* ==========================================================
   MOBILE FILTER SUMMARY
   ========================================================== */

@media (min-width: 992px) {
    .granite-price-main .price-filter-summary {
        display: none !important;
    }
}


/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 1199px) {

    .granite-price-main .colour-price-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .granite-price-main .price-list-layout {
        grid-template-columns: 260px minmax(0, 1fr);
        gap: 20px !important;
    }

    .granite-price-main #filtered-products {
        grid-template-columns: 1fr;
    }

    .granite-price-main .price-product-card > .col-md-4,
    .granite-price-main .price-product-image {
        height: 260px !important;
    }
}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 991px) {

    .granite-price-main {
        padding: 34px 0 54px !important;
    }

    .granite-price-main .price-list-layout {
        display: block !important;
    }

    .granite-price-main .price-filter-shell {
        position: static;

        width: 100%;

        margin-bottom: 22px;
    }

    .granite-price-main .price-filter-details {
        overflow: hidden;
        border-radius: 14px;
    }

    .granite-price-main .price-filter-summary {
        display: flex !important;

        justify-content: space-between;
        align-items: center;

        width: 100%;

        margin: 0 !important;
        padding: 15px 17px !important;

        background: #fff !important;
        border: 0 !important;
        border-radius: 0 !important;

        color: #292622 !important;

        font-size: 13.5px !important;
        font-weight: 650 !important;

        list-style: none;
    }

    .granite-price-main .price-filter-details[open] .price-filter-summary {
        border-bottom: 1px solid #eee8e0 !important;
    }

    .granite-price-main .price-filter-body {
        max-height: none;
        overflow: visible;

        padding: 16px;
    }

    .granite-price-main #filtered-products {
        grid-template-columns: 1fr;
        gap: 16px !important;
    }

    .granite-price-main .price-product-card > .col-md-4,
    .granite-price-main .price-product-image {
        height: clamp(220px, 62vw, 340px) !important;
    }
}


/* ==========================================================
   SMALL MOBILE
   ========================================================== */

@media (max-width: 575px) {

    .granite-price-main .sub-heading {
        margin-bottom: 28px;
    }

    .granite-price-main > .container > h2 {
        margin-top: 5px;
    }

    .granite-price-main .colour-price-list {
        grid-template-columns: 1fr;

        gap: 8px;

        margin-bottom: 30px !important;
    }

    .granite-price-main .colour-price-list a {
        min-height: 62px;

        padding-top: 12px;
        padding-bottom: 12px;
    }

    .granite-price-main .price-filter-body {
        padding: 14px;
    }

    .granite-price-main .price-filter-group {
        padding: 14px 0 !important;
    }

    .granite-price-main .price-filter-option > span {
        min-height: 34px;

        padding: 7px 10px;

        font-size: 12px;
    }

    .granite-price-main .price-product-content {
        padding: 16px !important;
    }

    .granite-price-main .price-product-title {
        font-size: 18px !important;
    }
}


/* ==========================================================
   ACCESSIBILITY
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

    .granite-price-main *,
    .granite-price-main *::before,
    .granite-price-main *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* V2 search button: neutralise legacy global centering transform */
.granite-price-main .price-list-search .search-submit {
    transform: none !important;
}

/* ==========================================================
   Granite price product image sharpness fix
   Keep existing source images, avoid enlarging 350px assets.
   ========================================================== */

.granite-price-main .price-product-card > .col-md-4.price-product-media {
    width: 100% !important;
    max-width: 100% !important;

    height: auto !important;
    min-height: 350px;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    overflow: hidden;
    background: #f7f7f7;
}

.granite-price-main .price-product-image-link {
    width: 100% !important;
    height: 350px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    overflow: hidden;
}

.granite-price-main .price-product-image {
    display: block !important;

    width: auto !important;
    max-width: 350px !important;

    height: auto !important;
    max-height: 350px !important;

    object-fit: contain !important;

    border-radius: 0 !important;

    transform: none !important;
}

/* Do not enlarge the image on card hover */
.granite-price-main .price-product-card:hover .price-product-image {
    transform: none !important;
}

@media (max-width: 575px) {
    .granite-price-main .price-product-card > .col-md-4.price-product-media {
        min-height: 300px;
    }

    .granite-price-main .price-product-image-link {
        height: 300px !important;
    }

    .granite-price-main .price-product-image {
        max-width: 300px !important;
        max-height: 300px !important;
    }
}

/* ==========================================================
   GRANITE PRICE SORT
   ========================================================== */

.granite-price-main .price-sort-toolbar {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin: 0 0 16px;
}

.granite-price-main .price-sort-label {
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #666;
    white-space: nowrap;
}

.granite-price-main .price-sort-select {
    min-width: 220px;
    height: 40px;
    padding: 0 34px 0 12px;
    border: 1px solid #d8d8d8;
    border-radius: 3px;
    background: #fff;
    color: #333;
    font: inherit;
    font-size: 13px;
    cursor: pointer;
}

.granite-price-main .price-sort-select:focus {
    outline: 1px solid #777;
    outline-offset: 1px;
}

@media (max-width: 575px) {
    .granite-price-main .price-sort-toolbar {
        justify-content: space-between;
        gap: 8px;
    }

    .granite-price-main .price-sort-select {
        flex: 1 1 auto;
        min-width: 0;
        max-width: 230px;
    }
}

/* ==========================================================
   GRANITE PRICE SORT - FINAL LAYOUT OVERRIDE
   ========================================================== */

.granite-price-main #filtered-products > .price-sort-toolbar {
    grid-column: 1 / -1 !important;

    width: 100% !important;
    min-height: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    gap: 10px !important;

    margin: 0 0 18px !important;
    padding: 0 !important;
}

.granite-price-main #filtered-products > .price-sort-toolbar .price-sort-label {
    margin: 0 !important;

    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 1 !important;

    letter-spacing: .08em !important;
    text-transform: uppercase !important;

    color: #706b66 !important;
    white-space: nowrap !important;
}

.granite-price-main #filtered-products > .price-sort-toolbar .price-sort-select {
    width: 220px !important;
    min-width: 220px !important;
    height: 42px !important;

    margin: 0 !important;
    padding: 0 38px 0 13px !important;

    border: 1px solid #ddd6cc !important;
    border-radius: 8px !important;

    background-color: #fff !important;
    color: #272421 !important;

    font-size: 13px !important;
    font-weight: 500 !important;

    box-shadow: none !important;
    cursor: pointer !important;
}

.granite-price-main #filtered-products > .price-sort-toolbar .price-sort-select:focus {
    border-color: #9d8d78 !important;
    outline: none !important;
}

@media (max-width: 767px) {
    .granite-price-main #filtered-products > .price-sort-toolbar {
        justify-content: space-between !important;
        margin-bottom: 14px !important;
    }

    .granite-price-main #filtered-products > .price-sort-toolbar .price-sort-select {
        width: min(220px, 70vw) !important;
        min-width: 0 !important;
    }
}


/* ==========================================================
   GRANITE PRICE SORT - REFINED
   ========================================================== */

.granite-price-main #filtered-products > .price-sort-toolbar {
    grid-column: 1 / -1 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    width: 100% !important;
    min-height: 0 !important;

    gap: 9px !important;

    margin: 0 0 18px !important;
    padding: 0 !important;
}

.granite-price-main #filtered-products > .price-sort-toolbar .price-sort-label {
    margin: 0 !important;

    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 1 !important;

    letter-spacing: .07em !important;
    text-transform: uppercase !important;

    color: #6f6963 !important;
    white-space: nowrap !important;
}

.granite-price-main #filtered-products > .price-sort-toolbar .price-sort-select {
    width: 210px !important;
    min-width: 210px !important;
    height: 40px !important;

    margin: 0 !important;
    padding: 0 36px 0 12px !important;

    border: 1px solid #ddd6cc !important;
    border-radius: 6px !important;

    background-color: #fff !important;
    color: #2c2926 !important;

    font-size: 13px !important;
    font-weight: 500 !important;

    box-shadow: none !important;

    cursor: pointer !important;
}

.granite-price-main #filtered-products > .price-sort-toolbar .price-sort-select:hover {
    border-color: #b9aa98 !important;
}

.granite-price-main #filtered-products > .price-sort-toolbar .price-sort-select:focus {
    border-color: #8f7d67 !important;
    outline: none !important;
}

@media (max-width: 575px) {
    .granite-price-main #filtered-products > .price-sort-toolbar {
        justify-content: space-between !important;
        margin-bottom: 14px !important;
    }

    .granite-price-main #filtered-products > .price-sort-toolbar .price-sort-select {
        width: 205px !important;
        min-width: 0 !important;
        max-width: 68vw !important;
    }
}

/* ==========================================================
   GRANITE PRICE SOURCE NOTE
   ========================================================== */

.granite-price-main .price-source-note {
    margin: 24px 0 28px;
    padding: 18px 20px;

    border: 1px solid #e7e0d7;
    border-left: 3px solid #9a8064;
    border-radius: 6px;

    background: #faf9f7;
}

.granite-price-main .price-source-note h3 {
    margin: 0 0 8px;

    font-size: 18px;
    font-weight: 600;
    line-height: 1.35;

    color: #292622;
}

.granite-price-main .price-source-note p {
    margin: 0;

    font-size: 14px;
    line-height: 1.65;

    color: #625d57;
}

.granite-price-main .price-source-note .price-source-cta {
    margin-top: 7px;

    font-weight: 600;

    color: #403b36;
}

@media (max-width: 575px) {
    .granite-price-main .price-source-note {
        margin: 20px 0 24px;
        padding: 15px 16px;
    }

    .granite-price-main .price-source-note h3 {
        font-size: 16px;
    }

    .granite-price-main .price-source-note p {
        font-size: 13px;
    }
}


/* ==========================================================
   RELATED GRANITE COLOUR PRICE CLUSTER
   ========================================================== */

.granite-price-main .price-colour-cluster {
    clear: both;
    margin: 42px 0 8px;
    padding-top: 30px;
    border-top: 1px solid #e7e0d7;
}

.granite-price-main .price-colour-cluster h2 {
    margin: 0 0 8px;
    font-size: 26px;
    line-height: 1.25;
    font-weight: 600;
}

.granite-price-main .price-colour-cluster-intro {
    margin: 0 0 20px;
    color: #666;
    line-height: 1.6;
}

.granite-price-main .price-colour-cluster .colour-price-list {
    margin-top: 0;
}

@media (max-width: 767px) {
    .granite-price-main .price-colour-cluster {
        margin-top: 30px;
        padding-top: 24px;
    }

    .granite-price-main .price-colour-cluster h2 {
        font-size: 22px;
    }
}


/* ==========================================================
   COLOUR PRICE PAGE WHITE CANVAS
   ========================================================== */

.granite-price-main.colour-price-module,
.granite-price-main.colour-price-module .price-list-layout,
.granite-price-main.colour-price-module .price-filter-shell,
.granite-price-main.colour-price-module .price-filter-details,
.granite-price-main.colour-price-module #filtered-products {
    background: #fff !important;
}

.granite-price-main.colour-price-module .price-filter-summary {
    display: none;
}

@media (max-width: 991px) {
    .granite-price-main.colour-price-module
    .price-filter-details > .price-filter-body {
        display: none;
    }

    .granite-price-main.colour-price-module
    .price-filter-details[open] > .price-filter-body {
        display: block;
    }

    .granite-price-main.colour-price-module
    .price-filter-summary {
        display: block;
    }
}

/* ==========================================================
   RELATED COLOUR PRICE CLUSTER
   ========================================================== */

.granite-price-main .price-colour-cluster {
    clear: both;
    margin: 42px 0 0;
    padding: 32px 0 4px;
    border-top: 1px solid #ece8e2;
    background: #fff;
}

.granite-price-main .price-colour-cluster > h2 {
    margin: 0 0 8px;
}

.granite-price-main .price-colour-cluster > p {
    margin: 0 0 24px;
}

.granite-price-main .price-colour-cluster .colour-price-list {
    margin-top: 0;
    margin-bottom: 0;
}

@media (max-width: 767px) {
    .granite-price-main .price-colour-cluster {
        margin-top: 30px;
        padding-top: 24px;
    }
}


/* ==========================================================
   REGIONAL PRICE PAGE WHITE CANVAS
   ========================================================== */

.granite-price-main.regional-price-module,
.granite-price-main.regional-price-module .price-list-layout,
.granite-price-main.regional-price-module .price-filter-shell,
.granite-price-main.regional-price-module .price-filter-details,
.granite-price-main.regional-price-module #filtered-products {
    background: #fff !important;
}

.granite-price-main.regional-price-module .price-filter-summary {
    display: none;
}

@media (max-width: 991px) {
    .granite-price-main.regional-price-module
    .price-filter-details > .price-filter-body {
        display: none;
    }

    .granite-price-main.regional-price-module
    .price-filter-details[open] > .price-filter-body {
        display: block;
    }

    .granite-price-main.regional-price-module
    .price-filter-summary {
        display: block;
    }
}

/* ==========================================================
   PRICE FILTER STATIC FLOW
   Centralizes former inline layout overrides.
   ========================================================== */

.granite-price-main .price-filter-shell.price-filter-flow {
    position: static !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

.granite-price-main
.price-filter-shell.price-filter-flow
.price-filter-details {
    position: static !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

.granite-price-main
.price-filter-shell.price-filter-flow
.price-filter-body {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    overflow-y: visible !important;
}

.granite-price-main
.price-filter-shell.price-filter-flow
.price-list-sidebar {
    position: static !important;
    top: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    overflow-x: visible !important;
}

/* ==========================================================
   MASTER PRICE NOTE AND FAQ
   Former inline presentation rules.
   ========================================================== */

.price-note-alert {
    background-color: #fff8e1 !important;
    border-left: 5px solid #ffb300 !important;
    padding: 20px !important;
    margin-top: 30px !important;
}

.price-note-title {
    margin-bottom: 12px !important;
    color: #9e6c00 !important;
    font-size: 18px !important;
}

.price-note-icon {
    margin-right: 8px !important;
}

.price-note-list {
    list-style-type: disc !important;
    padding-left: 20px !important;
    margin-bottom: 12px !important;
}

.price-note-cta {
    margin-bottom: 0 !important;
}

.price-faq-heading {
    padding: 0 !important;
}

/* ==========================================================
   MASTER PRICE FILTER RESPONSIVE
   Former master-only inline responsive behaviour.
   ========================================================== */

.granite-price-main.master-price-module
.price-filter-summary {
    cursor: pointer;
}

@media (max-width: 991px) {

    .granite-price-main.master-price-module
    .price-filter-details > .price-filter-body {
        display: none;
    }

    .granite-price-main.master-price-module
    .price-filter-details[open] > .price-filter-body {
        display: block;
    }

    .granite-price-main.master-price-module
    .price-filter-summary::-webkit-details-marker {
        display: none;
    }

    .granite-price-main.master-price-module
    .price-filter-summary::after {
        content: '\002B';
        float: right;
        font-weight: 400;
    }

    .granite-price-main.master-price-module
    .price-filter-details[open]
    .price-filter-summary::after {
        content: '\2212';
    }
}


/* ==========================================================
   FOREIGN CURRENCY PRICE UNIT
   INR remains permanently per sq. ft.
   ========================================================== */

.granite-price-main .price-area-unit-container[hidden] {
    display: none !important;
}

.granite-price-main .price-area-unit-options {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.granite-price-main .price-area-unit-btn {
    min-height: 34px;
    padding: 6px 14px;
    border: 1px solid #d4d7dd;
    border-radius: 8px;
    background: #fff;
    color: #1a1a1a;
    font-size: .88rem;
    font-weight: 500;
    line-height: 1.2;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition:
        background .18s,
        border-color .18s,
        color .18s;
}

.granite-price-main .price-area-unit-btn:hover {
    background: #f4f5f7;
    border-color: #c8ccd3;
}

.granite-price-main .price-area-unit-btn.active {
    background: #ebeef2;
    border-color: #c8ccd3;
    color: #111;
    box-shadow: none;
}

/* ==========================================================
   MASTER INFINITE COLOUR RAIL
   Seamless colour-price explorer for /granite-price/.
   ========================================================== */

.granite-price-main.master-price-module
.price-colour-loop-shell {
    position: relative;

    width: 100%;
    margin: 0 0 28px;
}

.granite-price-main.master-price-module
.price-colour-loop-stage {
    position: relative;

    width: 100%;
    overflow: hidden;
}


/* Soft edge fade makes continuation immediately obvious */

.granite-price-main.master-price-module
.price-colour-loop-stage::before,
.granite-price-main.master-price-module
.price-colour-loop-stage::after {
    content: "";

    position: absolute;
    z-index: 3;

    top: 0;
    bottom: 0;

    width: 38px;

    pointer-events: none;
}

.granite-price-main.master-price-module
.price-colour-loop-stage::before {
    left: 0;

    background:
        linear-gradient(
            90deg,
            #fff 0%,
            rgba(255,255,255,.78) 34%,
            rgba(255,255,255,0) 100%
        );
}

.granite-price-main.master-price-module
.price-colour-loop-stage::after {
    right: 0;

    background:
        linear-gradient(
            270deg,
            #fff 0%,
            rgba(255,255,255,.78) 34%,
            rgba(255,255,255,0) 100%
        );
}


/* Horizontal viewport */

.granite-price-main.master-price-module
.price-colour-loop-viewport {
    width: 100%;

    overflow-x: auto;
    overflow-y: hidden;

    padding: 2px 31px 5px;

    cursor: grab;

    overscroll-behavior-x: contain;

    -webkit-overflow-scrolling: touch;

    scrollbar-width: none;
}

.granite-price-main.master-price-module
.price-colour-loop-viewport::-webkit-scrollbar {
    display: none;
}

.granite-price-main.master-price-module
.price-colour-loop-viewport.is-dragging {
    cursor: grabbing;
}


/* Convert old 4-column grid to one continuous strip */

.granite-price-main.master-price-module
.master-colour-price-loop {
    display: flex !important;

    grid-template-columns: none !important;

    gap: 9px !important;

    width: max-content;
    min-width: max-content;

    margin: 0 !important;
    padding: 0 !important;

    user-select: none;
    -webkit-user-select: none;
}

.granite-price-main.master-price-module
.master-colour-price-loop > li {
    flex: 0 0 clamp(176px, 17vw, 208px);

    min-width: 0;
}


/* Compact stone-price cards */

.granite-price-main.master-price-module
.master-colour-price-loop a {
    min-height: 60px;
    height: 60px;

    padding: 10px 32px 10px 13px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.99),
            rgba(248,246,242,.97)
        );

    border: 1px solid #e4ddd4;
    border-radius: 10px;

    color: #2d2925;

    font-size: 12.75px;
    font-weight: 520;
    line-height: 1.38;

    box-shadow:
        0 1px 2px rgba(38,31,24,.025),
        0 5px 16px rgba(38,31,24,.028);

    transform: none;

    transition:
        border-color .18s ease,
        box-shadow .18s ease,
        transform .18s ease;
}

.granite-price-main.master-price-module
.master-colour-price-loop a::after {
    inset-inline-end: 11px;

    color: var(--gp-accent);

    font-size: 14px;
}

.granite-price-main.master-price-module
.master-colour-price-loop a:hover {
    background: #fff;

    border-color: #c9bcab;

    transform: translateY(-1px);

    box-shadow:
        0 3px 14px rgba(38,31,24,.06);
}


/* RTL copy remains RTL while loop geometry stays predictable */

html[dir="rtl"]
.granite-price-main.master-price-module
.master-colour-price-loop a {
    direction: rtl;
    text-align: right;
}


/* Tiny interaction cue */

.granite-price-main.master-price-module
.price-colour-loop-cue {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 6px;

    margin-top: 5px;
    padding-inline-end: 3px;

    color: #898076;

    font-size: 9px;
    font-weight: 550;
    letter-spacing: .045em;
    line-height: 1;

    text-transform: uppercase;
}

.granite-price-main.master-price-module
.price-colour-loop-cue-icon {
    color: var(--gp-accent);

    font-size: 13px;
    font-weight: 400;
}


/* Mobile remains a horizontal rail, never a 2-column grid */

@media (max-width: 767px) {

    .granite-price-main.master-price-module
    .price-colour-loop-shell {
        margin-bottom: 24px;
    }

    .granite-price-main.master-price-module
    .price-colour-loop-stage::before,
    .granite-price-main.master-price-module
    .price-colour-loop-stage::after {
        width: 23px;
    }

    .granite-price-main.master-price-module
    .price-colour-loop-viewport {
        padding-inline: 19px;
    }

    .granite-price-main.master-price-module
    .master-colour-price-loop {
        gap: 8px !important;
    }

    .granite-price-main.master-price-module
    .master-colour-price-loop > li {
        flex: 0 0 min(48vw, 172px);
    }

    .granite-price-main.master-price-module
    .master-colour-price-loop a {
        min-height: 56px;
        height: 56px;

        padding: 9px 29px 9px 11px;

        border-radius: 9px;

        font-size: 11.75px;
    }

    .granite-price-main.master-price-module
    .price-colour-loop-cue {
        margin-top: 4px;

        font-size: 8px;
    }

}


/* Respect operating-system reduced-motion preference */

@media (prefers-reduced-motion: reduce) {

    .granite-price-main.master-price-module
    .master-colour-price-loop a {
        transition: none;
    }

}