﻿.preorder-wrap .header {
    background: linear-gradient(90deg, #EBE1D6 0%, #E2D9CA 47.5%, #E4DBCE 100%);  
}
.preorder-wrap .leadforcontent {
    background: rgba(229, 219, 206, 1);
    height: 340px;
    padding-top:20px;
    color: #000000;
}
.preorderbase .full-hero__title {
    font-size: 45px;
    font-weight: 700;
    line-height: 58.1px;
    letter-spacing: -0.02em;
    text-align: center;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
}

@media only screen and (max-width: 420px) {
    .preorderbase .full-hero__title {
    font-size:40px;
    }
    .preorderbase .full-hero__heading {
        font-size:3rem;
    }
    .preorder-wrap .header__controls > a, .preorder-wrap  .header__controls > span {
        margin-right: 4px !important;
    }

    .preorder-wrap .header__search {
        padding-right: 0px;
    }
}

.preorderbase .full-hero__text {
    color: #000000;
    padding-top:0px;
}



.preorderbase ._5050__item {
    background:none;
}
.preorderbase .section {
    margin-top:0rem;
    margin-bottom:0rem;
    padding-top:8rem;
    padding-bottom:8rem;
    background: none;
}
.preorderbase ._5050--light {
    background: rgba(244, 238, 229, 1);
}

._5050__media--background img {
object-fit:contain;
}
.preorderbase .stepping-images__container {
    padding-left: 0px;
    padding-right: 0px;
    max-width: unset;
    width: 100%;
}

.preorderbase .stepping-images__stepper {
    display: unset;

}

.stepping-images__image {
left:0;
top:0;
transform:unset;
max-height:unset;
}
.stepping-images__image img {
    width:60%;

}

.preorderbase .section--padding {
    padding-bottom: 0px;
    padding-top: 0px;
}

.preorderbase .stepping-images__heading {
display:none;
}


.preorderbase .stepping-images__image:first-of-type {
    background: rgba(171, 167, 161, 1);
}

    .preorderbase .stepping-images__image:nth-of-type(2) {
        background: rgba(203, 189, 162, 1);
    }

    .preorderbase .stepping-images__image:nth-of-type(3) {
        background: rgba(70, 82, 64, 1);
    }

    .preorderbase .stepping-images__image:nth-of-type(4) {
        background: rgba(195, 177, 164, 1);
    }

    .preorderbase .stepping-images__image:nth-of-type(5) {
        background: rgba(71, 69, 67, 1);
    }

    .preorderbase .stepping-images__image:nth-of-type(6) {
        background: linear-gradient(180deg, #A6A29C 0%, #A6A29C 100%);
    }


.stepping-images__text {
    min-height: unset;
    padding: 3.25rem 0px;
}
.overlay2 {
    width: 40%;
    position: absolute;
    top: 20%;
    right: 0;
    padding-right: 10%;
}
.preorderbase .product-grid {
padding-top:1rem;
}

.preorderbase .project-grid__items {
    display: grid;
    grid-gap: 3em 2rem;
    grid-template-columns: repeat(5, 1fr);
}

.preorderform-wrap .project-grid__items {
    display: grid;
    grid-gap: 3em 2rem;
    grid-template-columns: repeat(5, 1fr);
}


.preorderbase .product-grid__items article {
    flex-grow: unset;
    flex-shrink: unset;
    margin-bottom: unset;
    padding: unset;
    width: unset;
}

.preorderbase .archive-filter__count {
    display: none !important;
}

.preorderbase .tease-product__thumbnail img {
    scale:1;
}

.preorderbase .wysiwyg-block__content {
text-align:center;
max-width:unset;
width:100%;
}

.preorderform-wrap .header {
    background: #fff;
}

.preorderform-wrap .columns__subtitle {
font-size:20px;
max-width:82rem;
}

.preorderbase .form {
    margin-top: 0rem;
    margin-bottom: 0rem;
    padding-top: 0rem;
    padding-bottom: 0rem;
    background: none;
}

.preorderbase .form__embed {
margin:0px 0px;
}

.preorderbase .tease-product__content {
min-height:40px;
}

.preorderform-wrap .product-grid {
padding-top:10px;
}

.preorderbase .archive-filter__content {
    width: 100%;
}

.preorderbase .archive-filter--list .archive-filter__items {
    text-align: center;
}
.preorderform-wrap .archive-filter--list .archive-filter__items {
    text-align: left;
}
.preorderbase .archive-filter--list .archive-filter__content {
    grid-template-columns: auto 0rem 0;
}

.preorderbase .archive-filter--list .archive-filter-options__item {
    background: none;
    background-color: none;
    padding: 0px;
    margin: 0 1rem 1rem 0;
}

.preorderbase .archive-filter-options__name {
    display: none;
}

.preorderbase .archive-filter--list .archive-filter-options__item--icon .archive-filter-options__image {
    height: 2.8rem;
    width: 2.8rem;
}

.preorderform-wrap .form__embed, .preorderform-wrap .product-grid__container {
    max-width: 90rem;
    padding: 0px 20px;
}

.preorderform-wrap .product-grid__container {
min-height:unset !important;
}

.preorderbase .archive-filter__container {
    max-width: 90rem;
    padding: 0px 20px;
}

.preorderform-wrap .input {
    max-width:unset;
    padding:0px;
}

.preorderform-wrap .qtyfield input[type=text] {
    padding: 0px;
}

    .preorderform-wrap .form__container {
        padding-left: 0px;
        padding-right: 0px;
    }

.preorderbase .archive-filter {
    margin-top: 1rem;
    margin-bottom: 1rem;
    color: #939393;
}

.preorderbase .titlesection {
text-align:center;
padding-top:80px;
}
.preorderform-wrap .label {
    color: #939393;
}

.preorderform-wrap .tease-product__content {
    min-height:56px;
}

.preorderform-wrap .quote-request-button {
    padding: .8rem 3rem;
    font-weight:normal;
}
.preorderform-wrap .product-grid__items {
    margin-left:18px;
}
.preorderform-wrap .hs-submit {
    text-align:center;
    margin-bottom:60px;
}

.preorderform-wrap .section {
    margin-bottom:0px;
    padding-bottom:0px;
}

.preorderform-wrap .summarycontent .product-grid__items {
    justify-content:left;
    flex-direction:row;

}

    .preorderform-wrap .summarycontent .product-grid__items article {
        flex-grow: 0;
        flex-shrink: 0;
        margin-bottom: 8rem;
        padding: 0 1rem;
        width: 20%;
    }

.preorderform-wrap .form__header .columns__container {
padding-left:0px;
padding-right:0px;
max-width:90rem;
}
.preorderbase .site-wrap {
padding-top:2rem;
}

.preorderbase .archive-filter__refine--no-sorting {
    display:none;
}
.preorderbase .archive-filter--list .archive-filter__active {
    display: flex;
    color: #1a1a1a;
    padding-top: 2px;
    padding-left: 0px;
    justify-content: center;
}
.preorderform-wrap .archive-filter--list .archive-filter__active {
    display: flex;
    color: #1a1a1a;
    padding-top: 2px;
    padding-left: 10px;
    justify-content: center;
}
.preorderform-wrap .archive-filter--list .archive-filter__active {
    display:flex;
    color:#1a1a1a;
    padding-top:2px;
    padding-left:10px;
}
.preorderbase .archive-filter-options__items div {
    border: 1px solid #ffffff;
}
.preorderbase .archive-filter-options__items div.is-active {
    border: 1px solid #1a1a1a;
}

.preorderbase .archive-filter__clear {
    margin: 0px;
}

.preorderbase .archive-filter__content {
display:flex;
flex-direction:column;
justify-content:center;
}
.preorderform-wrap .archive-filter__content {
    display: flex;
    flex-direction: row;
    justify-content: left;
}
.preorderform-wrap .archive-filter__clear--all, .preorderform-wrap .archive-filter__clear:after, .preorderbase .archive-filter__clear--all, .preorderbase .archive-filter__clear:after {
    display: none;
}

.preorderform-wrap .qtycontrol {
    display:flex;
    flex-direction:row;
}
.preorderform-wrap .qty {
    padding:0px 10px;
}
.preorderform-wrap .qtyminus, .preorderform-wrap .qtyplus {
    border: 1px solid black;
    border-radius: 4px;
    padding: 4px;
    line-height: 14px;
    cursor:pointer;
}
.preorderform-wrap .removebtn {
    padding-top: 4px;
    cursor: pointer;
    width:68px;
}

.preorderbase .text > p > img {
width:222px;
height:auto;
padding-top:30px;
}

.preorderbase .titled-gallery__controls {
    right: 0vw;
    text-align: right;
    max-width:35%;
    margin-top:7vw;
    top:0px;
    padding-right:40px;
}
.preorderbase .flex-section:nth-child(4) {
height:36vw;}
.preorderbase .titled-gallery__control {
    display: flex;
    justify-content: right;
    opacity: 1;
    margin-right: 10px;
    margin-top: 20px;
    flex-direction: column;
}

    .preorderbase .titled-gallery__control:last-of-type {
        margin-right: 0px;
    }
    .preorderbase .titled-gallery__control.is-active img {
        border: 1px solid black;
        border-radius: 50px;
        max-width: 26px;
    }
.preorderbase .titled-gallery__controls img {
    width: 26px;
}
.preorderbase .titled-gallery__controls h2 {
    font-size: 4rem;
    text-align:left;
    line-height:4rem;
}
.preorderbase .titled-gallery__controls p {
    font-size: 1.4rem;
    line-height: 26px;
    text-align: left;
    padding-top: 15px;
}

    .preorderbase .swatchgrp {
        display: flex;
        flex-direction: row;
        justify-content: left;
    }

#swatch-satin .finishlabel-satin, #swatch-brass .finishlabel-brass, #swatch-olive .finishlabel-olive, #swatch-copper .finishlabel-copper
, #swatch-black .finishlabel-black, #swatch-chrome .finishlabel-chrome {
    display: none;
}

#swatch-satin.is-active .finishlabel-satin, #swatch-brass.is-active .finishlabel-brass, #swatch-olive.is-active .finishlabel-olive, #swatch-copper.is-active .finishlabel-copper, #swatch-black.is-active .finishlabel-black, #swatch-chrome.is-active .finishlabel-chrome {
    display: block;
    font-size: 14px;
    font-weight: normal;
    text-align: center;
    padding-top: 12px;
    position: absolute;
    bottom: -14px;
}

#swatch-satin .swatchtext-satin, #swatch-brass .swatchtext-brass {
    display: none;
}
#swatch-satin.is-active .swatchtext-satin {
    display:block;
    color: red;
}
#swatch-brass.is-active .swatchtext-brass {
    display: block;
    color: blue;
}
.preorderform-wrap .prodaddcheck22 {
font-weight:bold;
background-color:black;
color:white;
}

.preorderbase .tease-product__tech-sheet {
    padding:2px 0px 0px 0px;
    border:none;
    text-align:left;
    text-decoration:underline;
}
.preorderbase .titled-gallery__image img {
width:100%;
height:auto;
}


/*NEW NEW TEST*/
/* Set a CSS variable for header height. Adjust as needed. */
:root {
    --header-height: 60px;
}

/* Basic resets */
html, body {
    margin: 0;
    padding: 0;
}

/* If your header is fixed, add padding-top so content isn’t hidden underneath. */
/*body {
    padding-top: var(--header-height);
}*

/* Example fixed header styling */
.header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: var(--header-height);
    background: #333;
    display: flex;
    align-items: center;
    padding: 0 20px;
    z-index: 1000;
}

/* The scroll-section must be tall enough to “play” all 6 panels.
       Each panel scrolls for one viewport height adjusted for the header height. */
.scroll-section {
    position: relative;
    /* Multiply the available viewport height (minus header) by 6 panels */
    height: calc(6 * (100vh - var(--header-height)));
}

/* The sticky container is pinned during the scroll section.
       Its top is set below the header and its height fills the remaining viewport. */
.sticky-container {
    position: sticky;
    top: 60px; /*var(--header-height);*/
    height: calc(100vh - 60px); /*var(--header-height));*/
    overflow: hidden;
    min-height: 720px;
}

/* Each panel is positioned absolutely on top of one another.
       Only the active panel is fully opaque. */
.panel {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
    display: flex;
}

    .panel.active {
        opacity: 1;
    }

    /* Layout: image on left (65%) and text on right (35%) */
    .panel .image {
        width: 65%;
    }

        .panel .image img {
            width: 100%;
            height: auto;
            display: block;
        }

    .panel .text {
        width: 35%;
        padding: 20px 100px 20px 20px;
        color: #fff;
        display: flex;
        flex-direction: column;
        justify-content: center;
        height:100%;
        position:relative;
        font-size:18px;
        line-height:30px;

    }

        .panel .text h2 {
        font-size:40px;
        padding-bottom:30px;
        }



    /* Each panel’s text area gets its own background color */
#panel1 .text, #panel1 .image {
    background: #ABA7A1;
    color:#000000;
}
    /* Div A */
#panel2 .text, #panel2 .image {
    background: #CBBDA2;
    color: #000000;
}
    /* Div B */
#panel3 .text, #panel3 .image {
    background: #465240;
}
    /* Div C */
#panel4 .text, #panel4 .image {
    background: #C3B1A4;
    color: #000000;
}
    /* Div D */
#panel5 .text, #panel5 .image {
    background: #474543;
}
    /* Div E */
#panel6 .text, #panel6 .image {
    background: linear-gradient(180deg, #A6A29C 0%, #A6A29C 100%);
    color: #000000;
}
    /* Div F */
    #panel-0 {
        background: #ABA7A1;
    }

    #panel-1 {
        background: #CBBDA2;
    }

    #panel-2 {
        background: #465240;
    }

    #panel-3 {
        background: #C3B1A4;
    }

    #panel-4 {
        background: #474543;
    }

    #panel-5 {
        background: linear-gradient(180deg, #A6A29C 0%, #A6A29C 100%);
    }

@media only screen and (max-width: 680px) {
    .panel {
        flex-direction: column;
        justify-content: center;
    }

        .panel .image, .panel .text {
            width: 100%;
        }
    .preorderbase .full-hero__container {
        top:15rem;
    }

    .preorderbase .project-grid__items {
        grid-template-columns: repeat(2, 1fr);
    }
    .preorderbase .product-grid__items {
        margin-left:0px;
    }
}
@media only screen and (max-width: 1030px) {
    .preorderbase .titled-gallery__controls p {
        line-height:20px;
    }
}
@media only screen and (max-width: 1024px) {
    .preorderbase .titled-gallery__items {
        transform: unset;
        width: unset;
    }
}
@media only screen and (max-width: 945px) {
    .preorderbase .titled-gallery__controls {
        margin-top: 2vw;
    }
}
@media only screen and (max-width: 877px) {
    .preorderbase .titled-gallery__controls {
    padding-right:0px;

    }

    .preorderbase .flex-section:nth-child(4) {
        height: 90vw;
        object-fit: cover;
    }
    .preorderbase .titled-gallery__image img {
        display:flex;
    }

    .preorderbase .titled-gallery__controls p {
        font-size: 1.5rem;
    }
    .preorderbase .titled-gallery {
        display: flex;
        flex-direction: column;
    }
    .preorderbase .titled-gallery__controls {
        position: absolute;
        max-width: 100%;
    }


    .preorderbase .titled-gallery__container {
        width: 100%;
        background: rgba(244, 238, 229, 1);
        color: #1a1a1a !important;
        height: 28vw;
        padding-bottom: 0px;
        text-align:center;
    }
    .preorderbase .swatchgrp {
        justify-content: center;
    }

    .preorderbase .titled-gallery__controls h2 {
        text-align: center;
    }

    .preorderbase .titled-gallery__controls p {
        text-align: center;
    }
        .preorderbase .titled-gallery__container .titled-gallery__controls {
            color: #1a1a1a !important;
        }
    .titled-gallery__image--tablet {
    display:block;}
    .titled-gallery__image--desktop {
    display:none;
    }

    .titled-gallery__image--tablet img {
        width:100%;
    }

}
@media only screen and (max-width: 768px) {
    .preorderbase .archive-filter {
        background: none;
    }

    .preorderbase .archive-filter--list .archive-filter-options {
        background: none;
        left: auto;
        opacity: 1;
        padding: 0;
        position: relative;
        top: auto;
        transform: none;
        transition: none;
        visibility: visible;
        width: auto;
        z-index: auto;
    }

    .preorderbase .archive-filter__filters {
        background: unset;
        height: unset;
        left: unset;
        padding: unset;
        position: unset;
        top: unset;
        transition: unset;
        width: unset;
        z-index: unset;
    }


    .preorderbase .archive-filter__close, .preorderbase .archive-filter__trigger, .preorderbase .archive-filter-options__apply-wrap, .preorderbase .archive-filter-options__back {
        display: none;
    }

    .preorderbase .archive-filter-options__items {
        display: flex;
        flex-direction: row;
    }

    .preorderbase .archive-filter-options__item--icon .archive-filter-options__image {
        margin: 0px;
    }

    .preorderbase .archive-filter-options__item.is-active:after {
        display: none;
    }

    .preorderbase .archive-filter-options__items div.is-active {
        border-radius: 50%;
    }
    .preorderbase .archive-filter__item {
    margin:0px;
    }
    .preorderbase .archive-filter__content {
        grid-gap: 0rem;
    }
}

@media only screen and (max-width:698px) {
    .preorderbase .titled-gallery__container {
        height: 36vw;
        vertical-align:middle;
    }
}


    @media only screen and (max-width: 530px) {
        .preorderbase .titled-gallery__container {
            width: 100%;
            background: rgba(244, 238, 229, 1);
            color: #1a1a1a !important;
            height: 60vw;
            padding-bottom: 0px;
            position: relative;
        }

        .preorderbase .titled-gallery__controls {
            padding-right: 0px;
        }

        .preorderbase .swatchgrp {
            justify-content: center;
        }

        .preorderbase .titled-gallery__controls h2 {
            text-align: center;
        }

        .preorderbase .titled-gallery__controls p {
            text-align: center;
            padding-left: 10px;
            padding-right: 20px;
        }

        .preorderbase .flex-section:nth-child(4) {
            height: 128vw;
        }
    }

