:root {
    --black: #111111;
    --white: #ffffff;
    --cream: #f8f7f4;
    --gray: #686868;
    --line: #e8e6e2;
    --pink: #f18da3;
    --pink-soft: #fff0f3;

    /* PAGE TRANSITION */
    --transition-image: url('../images/transition.jpg');
}


/* =========================================================
   RESET
========================================================= */

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    overflow-x: hidden;
    width: 100%;
}

body {
    margin: 0;
    padding: 0;

    width: 100%;
    max-width: 100%;

    background: var(--white);
    color: var(--black);

    font-family: 'DM Sans', Arial, sans-serif;
    font-weight: 400;

    overflow-x: hidden;
}

.lux-page {
    width: 100%;
    max-width: 100%;

    min-height: 100vh;

    overflow-x: hidden;

    position: relative;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

a,
button,
input {
    font-family: inherit;
}

button {
    -webkit-tap-highlight-color: transparent;
}

a {
    -webkit-tap-highlight-color: transparent;
}


/* =========================================================
   PAGE LOADER
========================================================= */

.lux-page-loader {
    position: fixed;

    inset: 0;

    width: 100vw;
    height: 100vh;
    height: 100dvh;

    background: #ffffff;

    z-index: 99999;

    display: grid;
    place-items: center;

    opacity: 1;
    visibility: visible;

    transition:
        opacity .5s ease,
        visibility .5s ease;
}

.lux-page-loader span {
    width: 32px;
    height: 32px;

    border: 1px solid #111111;
    border-top-color: transparent;

    border-radius: 50%;

    animation: luxSpin .8s linear infinite;
}

.lux-page-loader.done {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

@keyframes luxSpin {
    to {
        transform: rotate(360deg);
    }
}

/* =====================================================
   LUXURY CARD PAGE TRANSITION
====================================================== */

.lux-page-transition {
    position: fixed;
    inset: 0;
    z-index: 9999999;

    pointer-events: none;

    overflow: hidden;

    visibility: hidden;
}


/* =====================================================
   TRANSITION CARD
====================================================== */

.lux-page-transition-card {

    position: absolute;

    left: -6%;
    right: -6%;

    bottom: -110%;

    height: 125%;

    background: #1d1714;

    border-radius: 50% 50% 0 0 / 8% 8% 0 0;

    overflow: hidden;

    transform: translateY(0);

    transition:
        bottom .65s cubic-bezier(.76, 0, .24, 1),
        transform .7s cubic-bezier(.76, 0, .24, 1);
}


/* =====================================================
   SHOW TRANSITION
====================================================== */

.lux-page-transition.is-open {

    visibility: visible;
}

.lux-page-transition.is-open
.lux-page-transition-card {

    bottom: -5%;
}


/* =====================================================
   IMAGE
====================================================== */

.lux-page-transition-image {

    position: absolute;

    inset: 0;

    background-image:
        url('/themes/luxury_theme/assets/images/header/03.jpg');

    background-size: cover;

    background-position: center;

    opacity: .88;

    transform: scale(1.08);

    transition:
        transform 1s cubic-bezier(.2, .8, .2, 1);
}


.lux-page-transition.is-open
.lux-page-transition-image {

    transform: scale(1);
}


/* =====================================================
   DARK LUXURY OVERLAY
====================================================== */

.lux-page-transition-card::after {

    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            to bottom,
            rgba(0,0,0,.08),
            rgba(0,0,0,.45)
        );

    pointer-events: none;
}


/* =====================================================
   CENTER CONTENT
====================================================== */

.lux-page-transition-content {

    position: absolute;

    left: 50%;
    top: 50%;

    z-index: 2;

    transform:
        translate(-50%, -50%);

    display: flex;

    align-items: center;

    gap: 18px;

    opacity: 0;

    transition:
        opacity .35s ease .15s;
}


.lux-page-transition.is-open
.lux-page-transition-content {

    opacity: 1;
}


/* =====================================================
   LABEL
====================================================== */

.lux-page-transition-label {

    color: #fff;

    font-family:
        "Playfair Display",
        Georgia,
        serif;

    font-size: 20px;

    font-weight: 500;

    letter-spacing: 5px;

    white-space: nowrap;
}


/* =====================================================
   LINES
====================================================== */

.lux-page-transition-line {

    width: 55px;

    height: 1px;

    background: rgba(255,255,255,.65);
}


/* =====================================================
   CARD LEAVES
====================================================== */

.lux-page-transition.is-closing
.lux-page-transition-card {

    bottom: 110%;

    transform:
        translateY(-4%);
}


/* =====================================================
   CONTENT DISAPPEARS
====================================================== */

.lux-page-transition.is-closing
.lux-page-transition-content {

    opacity: 0;

    transition:
        opacity .2s ease;
}


/* =====================================================
   PREVENT SCROLL DURING TRANSITION
====================================================== */

body.lux-transition-running {

    overflow: hidden !important;
}


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

@media (max-width: 991px) {

    .lux-page-transition-card {

        left: -12%;
        right: -12%;

        height: 120%;

        border-radius:
            50% 50% 0 0 /
            6% 6% 0 0;
    }

}


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

@media (max-width: 575px) {

    .lux-page-transition-card {

        left: -25%;
        right: -25%;

        height: 118%;

        bottom: -115%;

        border-radius:
            50% 50% 0 0 /
            5% 5% 0 0;
    }


    .lux-page-transition.is-open
    .lux-page-transition-card {

        bottom: -3%;
    }


    .lux-page-transition-label {

        font-size: 15px;

        letter-spacing: 4px;
    }


    .lux-page-transition-line {

        width: 35px;
    }

}


/* =====================================================
   REDUCED MOTION
====================================================== */

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

    .lux-page-transition-card,
    .lux-page-transition-image,
    .lux-page-transition-content {

        transition: none !important;
    }

}
/* =========================================================
   FULL SCREEN PAGE TRANSITION
========================================================= */

.lux-page-transition {
    position: fixed;

    inset: 0;

    width: 100vw;
    height: 100vh;
    height: 100dvh;

    z-index: 999999;

    pointer-events: none;

    overflow: hidden;

    visibility: hidden;

    opacity: 0;

    background: #111111;

    contain: strict;

    transform: translateZ(0);

    isolation: isolate;

    will-change: opacity;
}


/* =========================================================
   TRANSITION IMAGE
========================================================= */

.lux-page-transition::before {
    content: "";

    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    background-image: var(--transition-image);

    background-position: center center;
    background-repeat: no-repeat;

    background-size: contain;

    background-color: #111111;

    transform: scale(1.08);

    opacity: 0;

    will-change:
        transform,
        opacity;

    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}


/* =========================================================
   TRANSITION DARK LAYER
========================================================= */

.lux-page-transition::after {
    content: "";

    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    background:
        linear-gradient(
            180deg,
            rgba(0, 0, 0, .10),
            rgba(0, 0, 0, .42)
        );

    opacity: 0;

    pointer-events: none;

    z-index: 2;
}


/* =========================================================
   TRANSITION ENTER
========================================================= */

.lux-page-transition.is-entering {
    visibility: visible;
    opacity: 1;
}

.lux-page-transition.is-entering::before {
    opacity: 1;

    animation:
        luxTransitionImageIn
        .9s
        cubic-bezier(.77, 0, .175, 1)
        forwards;
}

.lux-page-transition.is-entering::after {
    opacity: 1;

    animation:
        luxTransitionShadeIn
        .55s
        ease
        forwards;
}


/* =========================================================
   TRANSITION LEAVE
========================================================= */

.lux-page-transition.is-leaving {
    visibility: visible;
    opacity: 1;
}

.lux-page-transition.is-leaving::before {
    opacity: 1;

    animation:
        luxTransitionImageOut
        .8s
        cubic-bezier(.77, 0, .175, 1)
        forwards;
}

.lux-page-transition.is-leaving::after {
    opacity: 1;

    animation:
        luxTransitionShadeOut
        .55s
        ease
        forwards;
}


/* =========================================================
   TRANSITION ANIMATIONS
========================================================= */

@keyframes luxTransitionImageIn {

    0% {
        opacity: 1;
        transform: scale(1.08);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes luxTransitionImageOut {

    0% {
        opacity: 1;
        transform: scale(1);
    }

    100% {
        opacity: 1;
        transform: scale(1.08);
    }
}

@keyframes luxTransitionShadeIn {

    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes luxTransitionShadeOut {

    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}


/* =========================================================
   TRANSITION TEXT
========================================================= */

.lux-transition-content {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    z-index: 3;

    display: flex;

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

    text-align: center;

    color: #ffffff;

    pointer-events: none;

    padding: 30px;
}

.lux-transition-content-inner {
    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    max-width: 90%;

    opacity: 0;

    transform: translateY(20px);

    will-change:
        opacity,
        transform;
}

.lux-page-transition.is-leaving
.lux-transition-content-inner {
    animation:
        luxTransitionTextIn
        .5s
        .12s
        ease
        forwards;
}

@keyframes luxTransitionTextIn {

    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.lux-transition-kicker {
    font-size: 10px;

    font-weight: 600;

    letter-spacing: 4px;

    text-transform: uppercase;

    margin-bottom: 14px;
}

.lux-transition-title {
    margin: 0;

    font-family:
        'Playfair Display',
        Georgia,
        serif;

    font-size:
        clamp(
            42px,
            7vw,
            92px
        );

    font-weight: 400;

    line-height: 1;

    letter-spacing: -2px;
}


/* =========================================================
   TRANSITION PROGRESS LINE
========================================================= */

.lux-transition-line {
    position: absolute;

    left: 50%;
    bottom: 10%;

    width: 100px;
    height: 1px;

    background:
        rgba(255,255,255,.35);

    transform:
        translateX(-50%)
        scaleX(0);

    transform-origin: left;

    z-index: 4;
}

.lux-page-transition.is-leaving
.lux-transition-line {
    animation:
        luxTransitionLine
        .75s
        ease
        forwards;
}

@keyframes luxTransitionLine {

    0% {
        transform:
            translateX(-50%)
            scaleX(0);
    }

    100% {
        transform:
            translateX(-50%)
            scaleX(1);
    }
}


/* =========================================================
   FULL SCREEN SCROLL SECTIONS
========================================================= */

.lux-fullscreen-section {
    position: relative;

    width: 100%;

    min-height: 100vh;
    min-height: 100dvh;

    overflow: hidden;

    scroll-snap-align: start;

    scroll-snap-stop: always;
}

.lux-page.lux-scroll-snap {
    scroll-snap-type: y mandatory;
}


/* =========================================================
   FULL SCREEN SECTION INNER
========================================================= */

.lux-fullscreen-section-inner {
    width: 100%;
    height: 100%;

    min-height: 100vh;
    min-height: 100dvh;

    position: relative;

    display: flex;

    align-items: center;
    justify-content: center;
}


/* =========================================================
   SECTION TRANSITION STATE
========================================================= */

.lux-fullscreen-section.is-scroll-enter {
    animation:
        luxSectionEnter
        .8s
        cubic-bezier(.2,.8,.2,1)
        both;
}

.lux-fullscreen-section.is-scroll-leave {
    animation:
        luxSectionLeave
        .8s
        cubic-bezier(.2,.8,.2,1)
        both;
}

@keyframes luxSectionEnter {

    from {
        opacity: .65;
        transform: scale(.985);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes luxSectionLeave {

    from {
        opacity: 1;
        transform: scale(1);
    }

    to {
        opacity: .65;
        transform: scale(.985);
    }
}


/* =========================================================
   TOP PROMO BAR
========================================================= */

.lux-promo-bar {
    position: relative;

    width: 100%;

    overflow: hidden;

    background: #e60000;

    color: #ffffff;
}

.lux-promo-track {
    display: flex;

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

    gap: 18px;

    width: 100%;

    transform: none !important;
    animation: none !important;
    transition: none !important;

    white-space: nowrap;
}

.lux-promo-track span {
    flex: 0 0 auto;

    color: #ffffff;

    transform: none !important;
    animation: none !important;
    transition: none !important;
}


/* =========================================================
   MAIN HEADER
========================================================= */

.lux-header {
    position: relative;

    z-index: 1000;

    width: 100%;
}

.lux-main-nav {
    width: 100%;

    min-height: 78px;
    height: auto;

    background:
        rgba(255,255,255,.97);

    border-bottom:
        1px solid var(--line);

    position: sticky;

    top: 0;

    z-index: 1040;

    transition:
        min-height .35s ease,
        box-shadow .35s ease,
        background .35s ease;
}

.lux-main-nav.scrolled {
    min-height: 62px;

    box-shadow:
        0 8px 30px rgba(0,0,0,.07);

    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);

    background:
        rgba(255,255,255,.94);
}


/* =========================================================
   NAV INNER
========================================================= */

.lux-nav-inner {
    width:
        min(
            1420px,
            calc(100% - 48px)
        );

    height: 78px;

    margin: 0 auto;

    display: grid;

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

    align-items: center;
}

.lux-main-nav.scrolled
.lux-nav-inner {
    height: 62px;
}


/* =========================================================
   DESKTOP LINKS
========================================================= */

.lux-desktop-links {
    display: flex;

    align-items: center;

    gap: 27px;

    min-width: 0;

    overflow: hidden;
}

.lux-nav-link {
    position: relative;

    text-decoration: none;

    color: #222222;

    font-size: 10px;

    text-transform: uppercase;

    letter-spacing: 1.1px;

    padding: 8px 0;

    white-space: nowrap;
}

.lux-nav-link::after {
    content: "";

    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    height: 1px;

    background: #111111;

    transform:
        scaleX(0);

    transform-origin: right;

    transition:
        transform .4s
        cubic-bezier(.2,.8,.2,1);
}

.lux-nav-link:hover::after,
.lux-nav-link.is-active::after {
    transform:
        scaleX(1);

    transform-origin: left;
}


/* =========================================================
   LOGO
========================================================= */

.lux-brand {
    justify-self: center;

    display: flex;

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

    text-decoration: none;

    color: #111111;

    line-height: 1;

    min-width: 0;

    overflow: hidden;
}

.lux-brand img {
    display: block;

    width: auto;

    max-width: 155px;
    max-height: 50px;

    object-fit: contain;

    transition:
        transform .35s ease;
}

.lux-brand:hover img {
    transform:
        scale(1.035);
}

.lux-brand span {
    font-family:
        'Playfair Display',
        serif;

    font-size: 25px;

    font-weight: 400;

    letter-spacing: 3px;

    white-space: nowrap;
}


/* =========================================================
   ACTIONS
========================================================= */

.lux-actions {
    justify-self: end;

    display: flex;

    align-items: center;

    gap: 2px;

    min-width: 0;
}

.lux-action {
    width: 40px;
    height: 40px;

    flex: 0 0 40px;

    border: 0;

    background: transparent;

    color: #111111;

    display: grid;

    place-items: center;

    text-decoration: none;

    position: relative;

    font-size: 17px;

    cursor: pointer;

    transition:
        transform .25s ease,
        background .25s ease;
}

.lux-action:hover {
    background:
        #f5f5f3;

    transform:
        translateY(-2px);
}


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

.lux-search-trigger {
    height: 40px;

    min-width: 40px;

    border: 0;

    background: transparent;

    color: #111111;

    display: flex;

    align-items: center;

    gap: 8px;

    padding: 0 10px;

    cursor: pointer;

    font-size: 10px;

    font-weight: 500;

    letter-spacing: 1px;

    text-transform: uppercase;

    transition:
        background .25s ease,
        transform .25s ease;
}

.lux-search-trigger:hover {
    background:
        #f5f5f3;

    transform:
        translateY(-2px);
}

.lux-search-trigger i {
    font-size: 16px;
}


/* =========================================================
   CART
========================================================= */

.lux-bag em {
    position: absolute;

    right: 2px;
    top: 1px;

    min-width: 15px;
    height: 15px;

    padding: 0 3px;

    border-radius: 50%;

    background:
        #111111;

    color:
        #ffffff;

    font-size: 8px;

    font-style: normal;

    display: grid;

    place-items: center;
}


/* =========================================================
   DESKTOP MENU ACTION
========================================================= */

.lux-mobile-action {
    width: 40px;
    height: 40px;

    border: 0;

    background: transparent;

    color: #111111;

    display: grid;

    place-items: center;

    font-size: 22px;

    cursor: pointer;

    transition:
        background .25s ease,
        transform .25s ease;
}

.lux-mobile-action:hover {
    background:
        #f5f5f3;

    transform:
        translateY(-2px);
}


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

.lux-mobile-menu-btn {
    display: none;

    width: 40px;
    height: 40px;

    padding: 0;

    border: 0;

    background: transparent;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    gap: 4px;

    cursor: pointer;
}

.lux-mobile-menu-btn span {
    display: block;

    width: 19px;
    height: 1px;

    background:
        #111111;

    transition:
        transform .3s ease,
        opacity .3s ease;
}

.lux-mobile-menu-btn.active
span:nth-child(1) {
    transform:
        translateY(5px)
        rotate(45deg);
}

.lux-mobile-menu-btn.active
span:nth-child(2) {
    opacity: 0;
}

.lux-mobile-menu-btn.active
span:nth-child(3) {
    transform:
        translateY(-5px)
        rotate(-45deg);
}


/* =========================================================
   OVERLAY
========================================================= */

.lux-overlay {
    position: fixed;

    inset: 0;

    width: 100vw;
    height: 100vh;
    height: 100dvh;

    background:
        rgba(0,0,0,.35);

    opacity: 0;

    visibility: hidden;

    pointer-events: none;

    z-index: 1050;

    transition:
        opacity .4s ease,
        visibility .4s ease;
}

.lux-overlay.open {
    opacity: 1;

    visibility: visible;

    pointer-events: auto;
}


/* =========================================================
   DRAWERS
========================================================= */

.lux-drawer {
    position: fixed;

    top: 0;
    bottom: 0;

    width:
        min(
            460px,
            90vw
        );

    max-width: 100%;

    background:
        #ffffff;

    z-index: 1060;

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

    -webkit-overflow-scrolling: touch;

    transition:
        transform .6s
        cubic-bezier(.2,.8,.2,1);
}

.lux-menu-drawer {
    left: 0;

    transform:
        translateX(-100%);
}

.lux-account-drawer {
    right: 0;

    transform:
        translateX(100%);
}

.lux-drawer.open {
    transform:
        translateX(0);
}

.lux-drawer-head {
    height: 78px;

    padding:
        0 30px;

    border-bottom:
        1px solid var(--line);

    display: flex;

    align-items: center;

    justify-content: space-between;

    font-size: 10px;

    font-weight: 600;

    letter-spacing: 1.5px;
}

.lux-close {
    width: 40px;
    height: 40px;

    flex: 0 0 40px;

    border: 0;

    background:
        transparent;

    font-size: 29px;

    line-height: 1;

    cursor: pointer;

    transition:
        transform .3s ease;
}

.lux-close:hover {
    transform:
        rotate(90deg);
}


/* =========================================================
   MENU DRAWER BODY
========================================================= */

.lux-drawer-body {
    padding:
        40px 36px;
}

.lux-drawer-body > small {
    display: block;

    font-size: 9px;

    letter-spacing: 2px;

    color:
        #999999;

    margin-bottom: 12px;
}

.lux-drawer-link {
    display: flex;

    justify-content: space-between;

    align-items: center;

    gap: 15px;

    padding:
        15px 0;

    border-bottom:
        1px solid var(--line);

    text-decoration: none;

    color:
        #111111;

    font-family:
        'Playfair Display',
        serif;

    font-size: 27px;

    font-weight: 400;

    transition:
        padding .3s ease,
        color .3s ease;
}

.lux-drawer-link:hover {
    color:
        #d45e78;

    padding-left:
        8px;
}

.lux-drawer-link-text {
    font-family:
        'Playfair Display',
        serif;
}

.lux-drawer-arrow {
    font-family:
        Arial,
        sans-serif;

    font-size: 17px;

    opacity: 0;

    transform:
        translateX(-8px);

    transition:
        opacity .3s ease,
        transform .3s ease;
}

.lux-drawer-link:hover
.lux-drawer-arrow {
    opacity: 1;

    transform:
        translateX(0);
}

.lux-drawer-rule {
    height: 1px;

    background:
        var(--line);

    margin:
        35px 0;
}


/* =========================================================
   DRAWER CONTACT
========================================================= */

.lux-drawer-contact {
    display: flex;

    align-items: center;

    gap: 10px;

    margin-top:
        14px;

    text-decoration: none;

    color:
        #222222;

    font-size: 13px;

    overflow-wrap: anywhere;

    transition:
        color .25s ease;
}

.lux-drawer-contact:hover {
    color:
        #d45e78;
}


/* =========================================================
   SOCIAL ICONS
========================================================= */

.lux-social-row {
    display: flex;

    flex-wrap: wrap;

    gap: 9px;

    margin-top:
        28px;
}

.lux-social-row a {
    width: 35px;
    height: 35px;

    flex: 0 0 35px;

    border:
        1px solid #dddddd;

    display: grid;

    place-items: center;

    color:
        #111111;

    text-decoration: none;

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

.lux-social-row a:hover {
    background:
        #111111;

    color:
        #ffffff;

    border-color:
        #111111;
}


/* =========================================================
   ACCOUNT DRAWER
========================================================= */

.lux-account-body {
    padding:
        70px 40px;
}

.lux-round-icon {
    width: 54px;
    height: 54px;

    border:
        1px solid #dddddd;

    display: grid;

    place-items: center;

    font-size: 20px;

    margin-bottom:
        30px;
}

.lux-account-body h2 {
    font-family:
        'Playfair Display',
        serif;

    font-weight: 400;

    font-size: 37px;

    line-height: 1.12;

    margin: 0;
}

.lux-account-body h2 i {
    font-weight: 400;
}

.lux-account-body p {
    color:
        #777777;

    font-size: 13px;

    line-height: 1.8;

    margin:
        22px 0 30px;
}


/* =========================================================
   BUTTONS
========================================================= */

.lux-btn {
    min-height: 52px;

    display: flex;

    align-items: center;

    justify-content: center;

    text-decoration: none;

    font-size: 10px;

    font-weight: 600;

    letter-spacing: 1px;

    text-align: center;

    padding: 10px 18px;

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

.lux-btn-dark {
    background:
        #111111;

    color:
        #ffffff;
}

.lux-btn-dark:hover {
    background:
        #333333;

    color:
        #ffffff;

    transform:
        translateY(-1px);
}

.lux-btn-light {
    border:
        1px solid #111111;

    color:
        #111111;

    margin-top:
        10px;
}

.lux-btn-light:hover {
    background:
        #111111;

    color:
        #ffffff;
}


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

.lux-search {
    position: fixed;

    left: 0;
    right: 0;

    top: 78px;

    background:
        #ffffff;

    border-bottom:
        1px solid var(--line);

    z-index: 1035;

    transform:
        translateY(-110%);

    opacity: 0;

    visibility: hidden;

    pointer-events: none;

    transition:
        transform .5s
        cubic-bezier(.2,.8,.2,1),
        opacity .3s ease,
        visibility .3s ease;
}

.lux-search.open {
    transform:
        translateY(0);

    opacity: 1;

    visibility: visible;

    pointer-events: auto;
}

.lux-search-inner {
    width:
        min(
            1000px,
            calc(100% - 40px)
        );

    margin: 0 auto;

    padding:
        28px 0 38px;
}

.lux-search-head {
    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 15px;

    font-size: 10px;

    font-weight: 600;

    letter-spacing: 1.5px;
}

.lux-search-form {
    display: flex;

    min-width: 0;

    border-bottom:
        1px solid #111111;

    margin-top:
        20px;
}

.lux-search-form input {
    flex: 1;

    min-width: 0;

    border: 0;

    outline: 0;

    background:
        transparent;

    padding:
        14px 0;

    font-family:
        inherit;

    font-size: 18px;

    color:
        #111111;
}

.lux-search-form input::placeholder {
    color:
        #999999;
}

.lux-search-form button {
    width: 45px;

    flex: 0 0 45px;

    border: 0;

    background:
        transparent;

    color:
        #111111;

    font-size: 18px;

    cursor: pointer;
}


/* =========================================================
   IMAGE HERO
========================================================= */

.lux-image-hero {
    width: 100%;

    position: relative;

    overflow: hidden;

    background:
        #111111;
}

.lux-image-slider {
    position: relative;

    width: 100%;

    height:
        min(
            78vh,
            820px
        );

    min-height: 520px;

    overflow: hidden;
}


/* =========================================================
   HERO SLIDES
========================================================= */

.lux-slide {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    background-position:
        center center;

    background-repeat:
        no-repeat;

    background-size:
        cover;

    opacity: 0;

    transform:
        scale(1.08);

    filter:
        brightness(.92);

    pointer-events: none;

    z-index: 0;

    transition:
        opacity 1.2s
        cubic-bezier(.22,.61,.36,1),

        transform 5.5s
        cubic-bezier(.2,.8,.2,1),

        filter 1.2s ease;

    will-change:
        opacity,
        transform;
}

.lux-slide.is-active {
    opacity: 1;

    transform:
        scale(1);

    filter:
        brightness(1);

    z-index: 1;

    pointer-events: auto;
}

.lux-slide.is-prev {
    opacity: 0;

    transform:
        scale(1.03);

    z-index: 1;
}

.lux-slide.is-next {
    opacity: 0;

    transform:
        scale(1.08);

    z-index: 2;
}


/* =========================================================
   IMAGE OVERLAY
========================================================= */

.lux-slide-overlay {
    position: absolute;

    inset: 0;

    z-index: 2;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            rgba(0,0,0,.58) 0%,
            rgba(0,0,0,.25) 40%,
            rgba(0,0,0,.05) 75%,
            rgba(0,0,0,.15) 100%
        );
}


/* =========================================================
   HERO CONTENT
========================================================= */

.lux-hero-content {
    position: absolute;

    z-index: 3;

    left: 8%;

    top: 50%;

    transform:
        translateY(-50%);

    width: calc(100% - 16%);

    max-width: 600px;

    color:
        #ffffff;
}

.lux-hero-eyebrow {
    display: block;

    margin-bottom:
        18px;

    font-size: 12px;

    letter-spacing:
        4px;

    font-weight: 600;

    color:
        #f3d49a;
}

.lux-hero-content h1 {
    margin: 0;

    font-size:
        clamp(
            42px,
            5vw,
            76px
        );

    line-height:
        1.02;

    font-weight:
        500;

    letter-spacing:
        -2px;

    color:
        #ffffff;

    overflow-wrap: anywhere;
}

.lux-hero-content h1 i {
    font-family:
        Georgia,
        serif;

    font-weight:
        400;
}

.lux-hero-content p {
    max-width:
        470px;

    margin:
        25px 0 32px;

    font-size:
        16px;

    line-height:
        1.7;

    color:
        rgba(
            255,
            255,
            255,
            .88
        );
}


/* =========================================================
   HERO BUTTON
========================================================= */

.lux-hero-button {
    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        50px;

    max-width: 100%;

    padding:
        0 30px;

    border:
        1px solid
        rgba(255,255,255,.8);

    background:
        #ffffff;

    color:
        #111111;

    font-size:
        11px;

    font-weight:
        700;

    letter-spacing:
        2px;

    text-decoration:
        none;

    text-align: center;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease;
}

.lux-hero-button:hover {
    background:
        transparent;

    color:
        #ffffff;

    transform:
        translateY(-2px);
}


/* =========================================================
   SLIDER DOTS
========================================================= */

.lux-slider-dots {
    position:
        absolute;

    z-index:
        5;

    bottom:
        28px;

    left:
        50%;

    transform:
        translateX(-50%);

    display:
        flex;

    align-items:
        center;

    gap:
        8px;

    max-width: calc(100% - 30px);
}

.lux-slider-dot {
    width:
        8px;

    height:
        8px;

    padding:
        0;

    border:
        0;

    border-radius:
        50%;

    background:
        rgba(255,255,255,.45);

    cursor:
        pointer;

    transition:
        width .3s ease,
        background .3s ease;
}

.lux-slider-dot.active {
    width:
        28px;

    border-radius:
        10px;

    background:
        #ffffff;
}


/* =========================================================
   INTRO
========================================================= */

.lux-intro {
    padding:
        120px 20px 110px;

    text-align:
        center;
}

.lux-kicker {
    font-size:
        9px;

    font-weight:
        600;

    letter-spacing:
        2px;

    color:
        #999999;

    text-transform:
        uppercase;
}

.lux-intro h2,
.lux-section-head h2,
.lux-story-copy h2,
.lux-contact h2 {

    font-family:
        'Playfair Display',
        serif;

    font-weight:
        400;

    font-size:
        clamp(
            40px,
            5vw,
            65px
        );

    line-height:
        1.02;

    margin:
        20px 0;
}

.lux-intro p {
    color:
        #777777;

    max-width:
        440px;

    margin:
        auto;

    font-size:
        13px;

    line-height:
        1.8;
}


/* =========================================================
   SECTION
========================================================= */

.lux-section {
    width:
        min(
            1420px,
            calc(100% - 48px)
        );

    margin:
        0 auto;

    padding:
        90px 0;
}

.lux-section-head {
    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        space-between;

    gap:
        30px;

    margin-bottom:
        40px;
}

.lux-section-head h2 {
    font-size:
        52px;

    margin:
        14px 0 0;
}

.lux-section-head > a {
    flex-shrink:
        0;

    font-size:
        10px;

    color:
        #111111;

    text-decoration:
        none;

    border-bottom:
        1px solid #111111;

    padding-bottom:
        7px;

    letter-spacing:
        1px;
}


/* =========================================================
   CATEGORY GRID
========================================================= */

.lux-category-grid {
    display:
        grid;

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

    gap:
        16px;

    width: 100%;
}

.lux-category {
    text-decoration:
        none;

    color:
        #111111;

    overflow:
        hidden;

    min-width: 0;
}

.lux-category-image {
    width: 100%;

    aspect-ratio:
        3 / 4;

    background:
        #eeeeee
        center / cover
        no-repeat;

    transition:
        transform .65s
        cubic-bezier(.2,.8,.2,1);
}

.lux-category:hover
.lux-category-image {
    transform:
        scale(1.04);
}

.lux-category > div:last-child {
    padding:
        15px 0;

    display:
        flex;

    justify-content:
        space-between;

    gap:
        10px;

    min-width: 0;
}

.lux-category strong {
    font-family:
        'Playfair Display',
        serif;

    font-size:
        18px;

    font-weight:
        400;

    overflow-wrap: anywhere;
}

.lux-category span {
    font-size:
        8px;

    letter-spacing:
        1px;

    align-self:
        flex-end;

    flex-shrink: 0;
}


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

.lux-product {
    min-width:
        0;
}

.lux-product-media {
    position:
        relative;

    display:
        block;

    overflow:
        hidden;

    background:
        #f4f3f0;

    aspect-ratio:
        1 / 1.15;
}

.lux-product-media img {
    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    transition:
        transform .7s
        cubic-bezier(.2,.8,.2,1);
}

.lux-product:hover img {
    transform:
        scale(1.06);
}

.lux-product-badge {
    position:
        absolute;

    left:
        10px;

    top:
        10px;

    z-index:
        2;

    background:
        #ffffff;

    padding:
        6px 8px;

    font-size:
        8px;

    letter-spacing:
        1px;
}

.lux-quick {
    position:
        absolute;

    left:
        12px;

    right:
        12px;

    bottom:
        12px;

    height:
        40px;

    background:
        #ffffff;

    color:
        #111111;

    display:
        grid;

    place-items:
        center;

    font-size:
        9px;

    letter-spacing:
        1px;

    transform:
        translateY(55px);

    transition:
        transform .4s
        cubic-bezier(.2,.8,.2,1);
}

.lux-product:hover
.lux-quick {
    transform:
        translateY(0);
}

.lux-product-info {
    display:
        flex;

    justify-content:
        space-between;

    align-items: flex-start;

    gap:
        12px;

    padding:
        14px 0;
}

.lux-product-info h3 {
    font-family:
        'Playfair Display',
        serif;

    font-size:
        17px;

    font-weight:
        400;

    margin:
        0;

    overflow-wrap:
        anywhere;
}

.lux-product-info p {
    font-size:
        10px;

    color:
        #888888;

    margin:
        5px 0 0;
}

.lux-product-info strong {
    font-size:
        12px;

    font-weight:
        500;

    white-space:
        nowrap;

    flex-shrink:
        0;
}


/* =========================================================
   OFFER
========================================================= */

.lux-offer {
    display:
        grid;

    grid-template-columns:
        1fr 1fr;

    background:
        var(--pink-soft);

    min-height:
        560px;

    width: 100%;
}

.lux-offer-image {
    min-width: 0;

    background:
        url('../images/offer.jpg')
        center / cover
        no-repeat;
}

.lux-offer-copy {
    display:
        flex;

    flex-direction:
        column;

    justify-content:
        center;

    padding:
        80px 9vw;

    min-width: 0;
}

.lux-offer-copy h2 {
    font-family:
        'Playfair Display',
        serif;

    font-size:
        58px;

    font-weight:
        400;

    line-height:
        1.02;

    margin:
        20px 0;

    overflow-wrap:
        anywhere;
}

.lux-offer-copy p {
    color:
        #777777;

    line-height:
        1.8;

    font-size:
        13px;

    max-width:
        380px;

    margin-bottom:
        28px;
}

.lux-offer-copy .lux-btn {
    width:
        210px;

    max-width:
        100%;
}


/* =========================================================
   SERVICES
========================================================= */

.lux-services {
    background:
        #ffffff !important;
}

.lux-service {
    padding:
        30px 40px;

    border-left:
        1px solid var(--line);

    min-height:
        190px;

    min-width:
        0;
}

.lux-service:first-child {
    border-left:
        0;
}

.lux-service span {
    font-size:
        10px;

    color:
        #aaaaaa;
}

.lux-service h3 {
    font-family:
        'Playfair Display',
        serif;

    font-weight:
        400;

    font-size:
        27px;

    margin:
        22px 0 10px;

    overflow-wrap:
        anywhere;
}

.lux-service p {
    font-size:
        12px;

    line-height:
        1.8;

    color:
        #777777;

    max-width:
        280px;
}


/* =========================================================
   STORY
========================================================= */

.lux-story {
    display:
        grid;

    grid-template-columns:
        1fr 1fr;

    min-height:
        650px;

    background:
        var(--cream);

    width: 100%;
}

.lux-story-image {
    min-width: 0;

    background:
        url('../images/story.jpg')
        center / cover
        no-repeat;
}

.lux-story-copy {
    display:
        flex;

    flex-direction:
        column;

    justify-content:
        center;

    padding:
        80px 10vw;

    min-width:
        0;
}

.lux-story-copy h2 {
    font-size:
        55px;

    overflow-wrap:
        anywhere;
}

.lux-story-copy p {
    max-width:
        430px;

    color:
        #777777;

    font-size:
        13px;

    line-height:
        1.9;
}

.lux-text-link {
    color:
        #111111;

    text-decoration:
        none;

    font-size:
        10px;

    letter-spacing:
        1px;

    border-bottom:
        1px solid #111111;

    width:
        max-content;

    max-width: 100%;

    padding-bottom:
        7px;

    margin-top:
        20px;
}


/* =========================================================
   GALLERY
========================================================= */

.lux-gallery {
    background:
        #ffffff !important;
}

.lux-gallery h2 {
    font-family:
        'Playfair Display',
        serif;

    font-weight:
        400;

    font-size:
        52px;

    margin:
        15px 0 40px;

    overflow-wrap:
        anywhere;
}

.lux-gallery-grid {
    display:
        grid;

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

    gap:
        12px;

    width: 100%;
}

.lux-gallery-item {
    aspect-ratio:
        1 / 1.15;

    overflow:
        hidden;

    min-width:
        0;
}

.lux-gallery-item img {
    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    transition:
        transform .8s ease;
}

.lux-gallery-item:hover img {
    transform:
        scale(1.06);
}


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

.lux-contact {
    padding:
        120px 20px;

    text-align:
        center;

    background:
        var(--cream);
}

.lux-contact .lux-btn {
    width:
        190px;

    max-width:
        100%;

    margin:
        30px auto 0;
}


/* =========================================================
   FOOTER
========================================================= */

.lux-footer {
    width: 100%;

    background:
        #111111;

    color:
        #ffffff;

    padding:
        80px 0 25px;

    overflow:
        hidden;
}

.lux-footer-grid {
    width:
        min(
            1420px,
            calc(100% - 48px)
        );

    margin:
        0 auto;

    display:
        grid;

    grid-template-columns:
        2fr 1fr 1fr 1fr;

    gap:
        50px;

    min-width:
        0;
}

.lux-footer-grid > div {
    min-width:
        0;
}

.lux-footer-brand {
    font-family:
        'Playfair Display',
        serif;

    font-size:
        30px;

    line-height:
        1.2;

    overflow-wrap:
        anywhere;
}

.lux-footer p {
    color:
        #aaaaaa;

    font-size:
        12px;

    line-height:
        1.8;

    max-width:
        320px;

    margin:
        12px 0 0;
}

.lux-footer h6 {
    font-size:
        9px;

    letter-spacing:
        2px;

    margin-top:
        0;

    margin-bottom:
        22px;
}

.lux-footer-grid > a,
.lux-footer-grid > div > a {
    display:
        block;

    color:
        #aaaaaa;

    text-decoration:
        none;

    font-size:
        11px;

    margin:
        10px 0;

    transition:
        color .25s ease;

    overflow-wrap:
        anywhere;
}

.lux-footer-grid > a:hover,
.lux-footer-grid > div > a:hover {
    color:
        #ffffff;
}

.lux-footer .lux-social-row {
    margin-top:
        0;

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        9px;
}

.lux-footer .lux-social-row a {
    display:
        grid !important;

    color:
        #aaaaaa;

    margin:
        0;

    width:
        35px;

    height:
        35px;
}

.lux-footer-bottom {
    width:
        min(
            1420px,
            calc(100% - 48px)
        );

    margin:
        55px auto 0;

    border-top:
        1px solid #333333;

    padding-top:
        20px;

    display:
        flex;

    justify-content:
        space-between;

    align-items:
        center;

    gap:
        20px;

    color:
        #777777;

    font-size:
        9px;

    min-width:
        0;
}

.lux-footer-bottom span {
    min-width:
        0;

    overflow-wrap:
        anywhere;
}


/* =========================================================
   REVEAL ANIMATION
========================================================= */

.lux-reveal {
    opacity:
        0;

    transform:
        translateY(28px);

    transition:
        opacity .8s ease,
        transform .8s
        cubic-bezier(.2,.8,.2,1);
}

.lux-reveal.is-visible {
    opacity:
        1;

    transform:
        none;
}


/* =========================================================
   OLD PAGE LEAVE
========================================================= */

.lux-page-leaving {
    animation:
        none !important;

    opacity:
        1 !important;

    transform:
        none !important;
}


/* =========================================================
   VIDEO BACKGROUND
========================================================= */

.lux-hero-video {
    position:
        absolute;

    inset:
        0;

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    z-index:
        0;

    will-change:
        transform;
}

.lux-hero-video + .lux-hero-shade {
    z-index:
        1;
}


/* =========================================================
   RESPONSIVE LARGE
========================================================= */

@media (max-width: 1200px) {

    .lux-desktop-links {
        gap:
            18px;
    }

    .lux-nav-inner {
        width:
            min(
                1120px,
                calc(100% - 32px)
            );
    }

    .lux-section,
    .lux-footer-grid,
    .lux-footer-bottom {
        width:
            calc(100% - 40px);
    }

    .lux-offer-copy {
        padding:
            70px 6vw;
    }

    .lux-story-copy {
        padding:
            70px 7vw;
    }
}


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

@media (max-width: 991px) {

    .lux-main-nav {
        min-height:
            64px;
    }

    .lux-nav-inner {
        width:
            calc(100% - 20px);

        height:
            64px;

        grid-template-columns:
            40px
            minmax(0,1fr)
            auto;
    }

    .lux-main-nav.scrolled
    .lux-nav-inner {
        height:
            58px;
    }

    .lux-mobile-menu-btn {
        display:
            flex;
    }

    .lux-desktop-links {
        display:
            none;
    }

    .lux-mobile-action {
        display:
            none;
    }

    .lux-brand {
        justify-self:
            center;

        max-width:
            180px;
    }

    .lux-brand img {
        max-width:
            115px;

        max-height:
            42px;
    }

    .lux-brand span {
        font-size:
            19px;
    }

    .lux-action {
        width:
            37px;

        height:
            37px;

        flex-basis:
            37px;
    }

    .lux-search-trigger {
        width:
            37px;

        min-width:
            37px;

        padding:
            0;

        justify-content:
            center;
    }

    .lux-search-trigger span {
        display:
            none;
    }


    /* CATEGORY */

    .lux-category-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }


    /* GALLERY */

    .lux-gallery-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }


    /* OFFER / STORY */

    .lux-offer,
    .lux-story {
        grid-template-columns:
            1fr;
    }

    .lux-offer-image {
        min-height:
            430px;
    }

    .lux-story-image {
        min-height:
            500px;
    }


    /* FOOTER */

    .lux-footer-grid {
        grid-template-columns:
            1fr 1fr;

        gap:
            40px 35px;
    }


    /* SEARCH */

    .lux-search {
        top:
            64px;
    }


    /* DRAWER */

    .lux-drawer {
        width:
            min(
                460px,
                90vw
            );
    }


    /* SECTIONS */

    .lux-section {
        width:
            calc(100% - 32px);
    }

    .lux-footer-grid,
    .lux-footer-bottom {
        width:
            calc(100% - 32px);
    }

    .lux-service {
        padding:
            30px;
    }


    /* HERO */

    .lux-image-slider {
        width:
            100%;

        height:
            calc(100vh - 64px);

        height:
            calc(100dvh - 64px);

        min-height:
            560px;
    }

    .lux-slide {
        background-size:
            contain;

        background-position:
            center center;

        background-color:
            #111111;
    }

    .lux-hero-content {
        left:
            7%;

        right:
            7%;

        width:
            auto;

        max-width:
            600px;
    }

    .lux-hero-content h1 {
        font-size:
            clamp(
                38px,
                8vw,
                64px
            );
    }

    .lux-hero-content p {
        font-size:
            14px;

        max-width:
            400px;
    }


    /* FULLSCREEN TRANSITION */

    .lux-page-transition {
        width:
            100vw;

        height:
            100vh;

        height:
            100dvh;

        inset:
            0;
    }

    .lux-page-transition::before {
        width:
            100%;

        height:
            100%;

        background-size:
            contain;

        background-position:
            center center;

        background-repeat:
            no-repeat;
    }

    .lux-transition-title {
        font-size:
            clamp(
                40px,
                11vw,
                75px
            );
    }
}


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

@media (max-width: 575px) {

    .lux-promo-bar {
        height:
            30px;

        min-height:
            30px;

        display:
            flex;

        align-items:
            center;

        font-size:
            8px;
    }

    .lux-promo-track {
        gap:
            10px;

        min-width:
            max-content;

        padding:
            0 8px;
    }


    /* NAVIGATION */

    .lux-main-nav {
        min-height:
            64px;
    }

    .lux-nav-inner {
        width:
            calc(100% - 14px);

        height:
            64px;

        grid-template-columns:
            40px
            minmax(0,1fr)
            auto;
    }

    .lux-main-nav.scrolled
    .lux-nav-inner {
        height:
            58px;
    }

    .lux-brand {
        justify-self:
            center;

        min-width:
            0;

        max-width:
            150px;

        padding:
            0 5px;
    }

    .lux-brand img {
        max-width:
            105px;

        max-height:
            38px;
    }

    .lux-brand span {
        font-size:
            17px;

        letter-spacing:
            2px;
    }

    .lux-actions {
        gap:
            0;
    }

    .lux-actions .lux-account {
        display:
            none;
    }

    .lux-action {
        width:
            36px;

        height:
            36px;

        flex-basis:
            36px;

        font-size:
            16px;
    }

    .lux-search-trigger {
        width:
            36px;

        min-width:
            36px;

        height:
            36px;
    }


    /* INTRO */

    .lux-intro {
        padding:
            75px 20px 70px;
    }

    .lux-intro h2,
    .lux-contact h2 {
        font-size:
            clamp(
                34px,
                10vw,
                48px
            );

        line-height:
            1.08;
    }

    .lux-intro p {
        font-size:
            12px;

        line-height:
            1.75;
    }


    /* SECTIONS */

    .lux-section {
        width:
            calc(100% - 28px);

        padding:
            60px 0;
    }

    .lux-section-head {
        align-items:
            flex-end;

        gap:
            15px;

        margin-bottom:
            28px;
    }

    .lux-section-head h2 {
        font-size:
            39px;

        line-height:
            1.05;

        min-width:
            0;
    }

    .lux-section-head > a {
        font-size:
            8px;

        white-space:
            nowrap;

        padding-bottom:
            5px;
    }


    /* CATEGORIES */

    .lux-category-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );

        gap:
            10px;
    }

    .lux-category > div:last-child {
        display:
            block;

        padding:
            11px 0;
    }

    .lux-category strong {
        display:
            block;

        font-size:
            16px;

        line-height:
            1.25;
    }

    .lux-category span {
        display:
            block;

        margin-top:
            5px;

        font-size:
            7px;
    }


    /* PRODUCT */

    .lux-product-info {
        gap:
            8px;

        padding:
            11px 0;
    }

    .lux-product-info h3 {
        font-size:
            15px;
    }

    .lux-product-info p {
        font-size:
            9px;
    }

    .lux-product-info strong {
        font-size:
            11px;
    }

    .lux-product-badge {
        left:
            7px;

        top:
            7px;

        padding:
            5px 6px;

        font-size:
            7px;
    }

    .lux-quick {
        left:
            8px;

        right:
            8px;

        bottom:
            8px;

        height:
            38px;

        transform:
            translateY(0);

        font-size:
            8px;
    }


    /* OFFER */

    .lux-offer {
        min-height:
            auto;
    }

    .lux-offer-image {
        min-height:
            340px;

        height:
            340px;
    }

    .lux-offer-copy {
        padding:
            60px 28px;
    }

    .lux-offer-copy h2,
    .lux-story-copy h2 {
        font-size:
            43px;

        line-height:
            1.04;
    }

    .lux-offer-copy p {
        font-size:
            12px;

        line-height:
            1.75;
    }

    .lux-offer-copy .lux-btn {
        width:
            210px;

        max-width:
            100%;
    }


    /* STORY */

    .lux-story {
        min-height:
            auto;
    }

    .lux-story-image {
        min-height:
            420px;

        height:
            420px;
    }

    .lux-story-copy {
        padding:
            60px 28px;
    }

    .lux-story-copy p {
        font-size:
            12px;

        line-height:
            1.8;
    }


    /* SERVICES */

    .lux-service {
        padding:
            25px 0;

        border-left:
            0;

        border-bottom:
            1px solid var(--line);

        min-height:
            auto;
    }

    .lux-service:last-child {
        border-bottom:
            0;
    }

    .lux-service h3 {
        font-size:
            24px;

        margin:
            14px 0 8px;
    }

    .lux-service p {
        font-size:
            11px;

        line-height:
            1.7;
    }


    /* GALLERY */

    .lux-gallery h2 {
        font-size:
            40px;

        margin:
            10px 0 28px;
    }

    .lux-gallery-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );

        gap:
            8px;
    }


    /* CONTACT */

    .lux-contact {
        padding:
            75px 20px;
    }

    .lux-contact .lux-btn {
        width:
            190px;

        max-width:
            100%;
    }


    /* FOOTER */

    .lux-footer {
        padding:
            55px 0 20px;

        width:
            100%;
    }

    .lux-footer-grid {
        width:
            calc(100% - 28px);

        max-width:
            100%;

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

        gap:
            30px 22px;
    }

    .lux-footer-grid > div {
        min-width:
            0;
    }

    .lux-footer-grid > div:first-child {
        grid-column:
            1 / -1;

        width:
            100%;
    }

    .lux-footer-brand {
        font-size:
            27px;

        line-height:
            1.15;
    }

    .lux-footer p {
        font-size:
            11px;

        line-height:
            1.7;

        max-width:
            100%;

        margin-top:
            10px;
    }

    .lux-footer h6 {
        font-size:
            8px;

        letter-spacing:
            1.5px;

        margin-bottom:
            16px;
    }

    .lux-footer-grid > div > a {
        font-size:
            10px;

        margin:
            8px 0;

        line-height:
            1.5;
    }

    .lux-footer .lux-social-row {
        gap:
            7px;

        margin-top:
            0;
    }

    .lux-footer .lux-social-row a {
        width:
            34px;

        height:
            34px;

        flex:
            0 0 34px;
    }

    .lux-footer-bottom {
        width:
            calc(100% - 28px);

        max-width:
            100%;

        display:
            flex;

        flex-direction:
            column;

        align-items:
            flex-start;

        justify-content:
            flex-start;

        gap:
            4px;

        margin:
            35px auto 0;

        padding-top:
            17px;

        line-height:
            1.7;
    }

    .lux-footer-bottom span {
        display:
            block;

        width:
            100%;

        overflow-wrap:
            anywhere;
    }


    /* DRAWER */

    .lux-drawer {
        width:
            92vw;

        max-width:
            92vw;
    }

    .lux-drawer-head {
        height:
            64px;

        padding:
            0 20px;
    }

    .lux-drawer-body {
        padding:
            32px 25px;
    }

    .lux-drawer-link {
        font-size:
            24px;

        padding:
            13px 0;
    }

    .lux-account-body {
        padding:
            55px 28px;
    }

    .lux-account-body h2 {
        font-size:
            32px;
    }


    /* SEARCH */

    .lux-search-inner {
        width:
            calc(100% - 30px);

        padding:
            22px 0 28px;
    }

    .lux-search {
        /*
           Promo bar 30px
           Navbar 64px
        */
        top:
            94px;
    }

    .lux-search-form input {
        font-size:
            16px;
    }


    /* HERO MOBILE */

    .lux-image-slider {
        width:
            100%;

        height:
            calc(100vh - 94px);

        height:
            calc(100dvh - 94px);

        min-height:
            0;

        background:
            #111111;
    }

    .lux-slide {
        width:
            100%;

        height:
            100%;

        background-size:
            contain;

        background-position:
            center center;

        background-repeat:
            no-repeat;

        background-color:
            #111111;

        transform:
            scale(1.02);
    }

    .lux-slide.is-active {
        transform:
            scale(1);
    }


    /* MOBILE HERO OVERLAY */

    .lux-slide-overlay {
        background:
            linear-gradient(
                180deg,
                rgba(0,0,0,.08) 0%,
                rgba(0,0,0,.18) 45%,
                rgba(0,0,0,.60) 100%
            );
    }


    /* MOBILE HERO CONTENT */

    .lux-hero-content {
        left:
            22px;

        right:
            22px;

        top:
            auto;

        bottom:
            75px;

        transform:
            none;

        width:
            auto;

        max-width:
            none;
    }

    .lux-hero-eyebrow {
        font-size:
            10px;

        letter-spacing:
            3px;

        margin-bottom:
            14px;
    }

    .lux-hero-content h1 {
        font-size:
            40px;

        line-height:
            1.02;

        letter-spacing:
            -1px;
    }

    .lux-hero-content p {
        margin:
            16px 0 22px;

        font-size:
            13px;

        line-height:
            1.7;

        max-width:
            380px;
    }

    .lux-hero-button {
        min-height:
            46px;

        padding:
            0 22px;

        font-size:
            10px;
    }

    .lux-slider-dots {
        bottom:
            25px;
    }


    /* =====================================================
       FULL SCREEN TRANSITION � MOBILE
    ===================================================== */

    .lux-page-transition {
        position:
            fixed;

        inset:
            0;

        width:
            100vw;

        height:
            100vh;

        height:
            100dvh;

        z-index:
            999999;

        overflow:
            hidden;

        pointer-events:
            none;

        background:
            #111111;
    }

    .lux-page-transition::before {
        width:
            100%;

        height:
            100%;

        background-size:
            contain;

        background-position:
            center center;

        background-repeat:
            no-repeat;

        background-color:
            #111111;
    }

    .lux-page-transition::after {
        position:
            absolute;

        inset:
            0;

        width:
            100%;

        height:
            100%;
    }


    /* TRANSITION CONTENT */

    .lux-transition-content {
        width:
            100%;

        height:
            100%;

        padding:
            0 25px;
    }

    .lux-transition-content-inner {
        max-width:
            100%;
    }

    .lux-transition-title {
        font-size:
            clamp(
                38px,
                13vw,
                62px
            );

        letter-spacing:
            -1px;

        max-width:
            100%;

        overflow-wrap:
            anywhere;
    }

    .lux-transition-kicker {
        font-size:
            8px;

        letter-spacing:
            3px;

        text-align:
            center;
    }

    .lux-transition-line {
        bottom:
            9%;

        width:
            75px;
    }


    /* FULLSCREEN SECTIONS */

    .lux-fullscreen-section {
        min-height:
            100vh;

        min-height:
            100dvh;
    }

    .lux-fullscreen-section-inner {
        min-height:
            100vh;

        min-height:
            100dvh;
    }
}


/* =========================================================
   VERY SMALL DEVICES
========================================================= */

@media (max-width: 380px) {

    .lux-brand img {
        max-width:
            95px;
    }

    .lux-brand span {
        font-size:
            16px;
    }

    .lux-action,
    .lux-search-trigger,
    .lux-mobile-menu-btn {
        width:
            34px;

        min-width:
            34px;

        height:
            34px;
    }

    .lux-actions {
        gap:
            0;
    }

    .lux-hero-content h1 {
        font-size:
            36px;
    }

    .lux-hero-content p {
        font-size:
            12px;
    }

    .lux-section-head {
        gap:
            12px;
    }

    .lux-section-head h2 {
        font-size:
            34px;
    }

    .lux-offer-copy,
    .lux-story-copy {
        padding-left:
            22px;

        padding-right:
            22px;
    }

    .lux-image-slider {
        min-height:
            0;

        height:
            calc(100vh - 94px);

        height:
            calc(100dvh - 94px);
    }

    .lux-hero-content {
        left:
            18px;

        right:
            18px;

        bottom:
            70px;
    }

    .lux-slider-dots {
        bottom:
            20px;
    }

    .lux-transition-title {
        font-size:
            36px;
    }

    .lux-transition-kicker {
        font-size:
            7px;

        letter-spacing:
            2.5px;
    }

    /* SMALL FOOTER */

    .lux-footer-grid {
        width:
            calc(100% - 24px);

        grid-template-columns:
            1fr 1fr;

        gap:
            28px 16px;
    }

    .lux-footer-brand {
        font-size:
            24px;
    }

    .lux-footer p {
        font-size:
            10px;
    }

    .lux-footer-grid > div > a {
        font-size:
            9px;
    }

    .lux-footer-bottom {
        width:
            calc(100% - 24px);

        font-size:
            8px;
    }
}


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

@media (max-width: 767px) and (orientation: landscape) {

    .lux-image-slider {
        height:
            calc(100vh - 64px);

        height:
            calc(100dvh - 64px);

        min-height:
            0;
    }

    .lux-hero-content {
        bottom:
            55px;

        max-width:
            70%;
    }

    .lux-hero-content h1 {
        font-size:
            32px;
    }

    .lux-hero-content p {
        margin:
            10px 0 15px;

        font-size:
            11px;
    }

    .lux-hero-eyebrow {
        margin-bottom:
            8px;

        font-size:
            8px;
    }

    .lux-hero-button {
        min-height:
            40px;
    }

    .lux-slider-dots {
        bottom:
            12px;
    }

    .lux-fullscreen-section {
        min-height:
            100vh;

        min-height:
            100dvh;
    }

    .lux-fullscreen-section-inner {
        min-height:
            100vh;

        min-height:
            100dvh;
    }


    /* =====================================================
       MOBILE LANDSCAPE FOOTER
    ===================================================== */

    .lux-footer {
        width:
            100%;

        padding:
            50px 0 20px;

        overflow-x:
            hidden;
    }

    .lux-footer-grid {
        width:
            calc(100% - 28px);

        max-width:
            100%;

        margin:
            0 auto;

        display:
            grid;

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

        gap:
            30px 22px;
    }

    .lux-footer-grid > div {
        min-width:
            0;

        width:
            100%;
    }

    /* BRAND / ABOUT SECTION */

    .lux-footer-grid > div:first-child {
        grid-column:
            1 / -1;

        width:
            100%;
    }

    .lux-footer-brand {
        font-size:
            27px;

        line-height:
            1.15;

        overflow-wrap:
            anywhere;

        word-break:
            break-word;
    }

    .lux-footer p {
        font-size:
            11px;

        line-height:
            1.7;

        max-width:
            100%;

        margin:
            10px 0 0;

        overflow-wrap:
            anywhere;

        word-break:
            break-word;
    }

    /* FOOTER HEADINGS */

    .lux-footer h6 {
        font-size:
            8px;

        letter-spacing:
            1.5px;

        margin:
            0 0 16px;
    }

    /* FOOTER LINKS */

    .lux-footer-grid > div > a,
    .lux-footer-grid > a {
        display:
            block;

        width:
            100%;

        max-width:
            100%;

        font-size:
            10px;

        line-height:
            1.5;

        margin:
            8px 0;

        overflow-wrap:
            anywhere;

        word-break:
            break-word;
    }

    /* SOCIAL ICONS */

    .lux-footer .lux-social-row {
        display:
            flex;

        flex-wrap:
            wrap;

        gap:
            7px;

        margin:
            0;

        max-width:
            100%;
    }

    .lux-footer .lux-social-row a {
        width:
            34px;

        height:
            34px;

        min-width:
            34px;

        max-width:
            34px;

        flex:
            0 0 34px;

        margin:
            0;

        display:
            grid !important;

        place-items:
            center;
    }

    /* BOTTOM COPYRIGHT */

    .lux-footer-bottom {
        width:
            calc(100% - 28px);

        max-width:
            100%;

        margin:
            35px auto 0;

        padding:
            17px 0 0;

        display:
            flex;

        flex-direction:
            column;

        align-items:
            flex-start;

        justify-content:
            flex-start;

        gap:
            4px;

        font-size:
            8px;

        line-height:
            1.7;

        min-width:
            0;
    }

    .lux-footer-bottom span {
        display:
            block;

        width:
            100%;

        max-width:
            100%;

        min-width:
            0;

        overflow-wrap:
            anywhere;

        word-break:
            break-word;
    }
}
/* =========================================================
   TOUCH DEVICES
========================================================= */

@media (hover: none) and (pointer: coarse) {

    .lux-category:hover
    .lux-category-image {
        transform:
            none;
    }

    .lux-product:hover img {
        transform:
            none;
    }

    .lux-gallery-item:hover img {
        transform:
            none;
    }

    .lux-quick {
        transform:
            translateY(0);
    }

    .lux-action:hover,
    .lux-search-trigger:hover,
    .lux-mobile-action:hover {
        transform:
            none;

        background:
            transparent;
    }

    .lux-drawer-link:hover {
        padding-left:
            0;

        color:
            #111111;
    }

    .lux-drawer-link:hover
    .lux-drawer-arrow {
        opacity:
            0;
    }

    .lux-social-row a:hover {
        background:
            transparent;

        color:
            #111111;

        border-color:
            #dddddd;
    }

    .lux-footer .lux-social-row a:hover {
        background:
            transparent;

        color:
            #aaaaaa;

        border-color:
            #dddddd;
    }
}


/* =========================================================
   REDUCED MOTION
========================================================= */

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

    html {
        scroll-behavior:
            auto;
    }

    * {
        animation-duration:
            .01ms !important;

        animation-iteration-count:
            1 !important;

        transition-duration:
            .01ms !important;
    }

    .lux-promo-track {
        animation:
            none !important;
    }

    .lux-slide {
        transition:
            opacity .01ms linear !important;

        transform:
            none !important;
    }

    .lux-page-transition {
        display:
            none !important;
    }

    .lux-page.lux-scroll-snap {
        scroll-snap-type:
            none;
    }

    .lux-fullscreen-section {
        scroll-snap-align:
            none;
    }
}