/*
 * Heikaya v6.19.5
 * Homepage product-card vertical alignment + collection video breathing room.
 */

/* ==========================================================
   HOMEPAGE PRODUCT CARDS
   Keep prices in the same horizontal line inside every grid row,
   regardless of whether a product title uses 1, 2, 3 or more lines.
   ========================================================== */

body.home .lumiere-featured-products__grid {
    align-items: stretch !important;
}

body.home .lumiere-featured-products__grid > .lumiere-featured-product {
    display: flex !important;
    flex-direction: column !important;
    align-self: stretch !important;
    height: 100% !important;
}

body.home .lumiere-featured-product__image {
    flex: 0 0 auto !important;
}

/* More breathing room between the product image/card and its title. */
body.home .lumiere-featured-product__body {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    width: 100% !important;
    padding-top: 22px !important;
    padding-right: 6px !important;
    padding-left: 6px !important;
    text-align: center !important;
}

body.home .lumiere-featured-product__body h3 {
    margin: 0 !important;
}

/* Push every price to the bottom of the equal-height card body.
   Padding creates a clear, consistent title-to-price gap. */
body.home .lumiere-featured-product__price {
    margin-top: auto !important;
    padding-top: 18px !important;
    min-height: 1.4em !important;
}

/* Sale prices can contain del/ins elements. Keep them together on one row. */
body.home .lumiere-featured-product__price,
body.home .lumiere-featured-product__price .price {
    white-space: normal !important;
}

body.home .lumiere-featured-product__price del,
body.home .lumiere-featured-product__price ins {
    display: inline-block !important;
}

/* The four-product showcase grids previously had very tight 12px gaps.
   Give the cards a little more visual separation while retaining four columns. */
body.home .heikaya-clear-crystal__products .lumiere-featured-products__grid,
body.home .heikaya-silver-showcase__products .lumiere-featured-products__grid,
body.home .heikaya-candle-holder-showcase__inner .lumiere-featured-products__grid {
    column-gap: 20px !important;
    row-gap: 28px !important;
}

/* ==========================================================
   COLLECTION VIDEOS
   Add clean padding around the Egermann, Bohemia and Silver
   editorial videos without altering their section proportions.
   ========================================================== */

body.home .lumiere-egermann-feature__media,
body.home .heikaya-clear-crystal__media,
body.home .heikaya-silver-showcase__media {
    box-sizing: border-box !important;
    padding: clamp(16px, 1.6vw, 26px) !important;
    background: #fffdf9 !important;
}

/* Keep the actual media neatly contained inside the new breathing room. */
body.home .lumiere-egermann-feature__media video,
body.home .lumiere-egermann-feature__media img,
body.home .heikaya-clear-crystal__media video,
body.home .heikaya-clear-crystal__media img,
body.home .heikaya-silver-showcase__media video,
body.home .heikaya-silver-showcase__media img {
    box-sizing: border-box !important;
    max-width: 100% !important;
}

/* On phones use a slightly tighter but still visible frame. */
@media (max-width: 767px) {
    body.home .lumiere-featured-product__body {
        padding-top: 16px !important;
    }

    body.home .lumiere-featured-product__price {
        padding-top: 12px !important;
    }

    body.home .heikaya-clear-crystal__products .lumiere-featured-products__grid,
    body.home .heikaya-silver-showcase__products .lumiere-featured-products__grid,
    body.home .heikaya-candle-holder-showcase__inner .lumiere-featured-products__grid {
        column-gap: 12px !important;
        row-gap: 24px !important;
    }

    body.home .lumiere-egermann-feature__media,
    body.home .heikaya-clear-crystal__media,
    body.home .heikaya-silver-showcase__media {
        padding: 14px !important;
    }
}

/* ==========================================================
   v6.19.6 — refined premium homepage rhythm
   ========================================================== */

body.home {
    --heikaya-home-section-gap: clamp(46px, 4.2vw, 70px);
    --heikaya-home-title-gap: clamp(28px, 2.4vw, 38px);
    --heikaya-home-video-frame: clamp(24px, 2.15vw, 36px);
}

/* Slightly more breathing room around the three editorial videos. */
body.home .lumiere-egermann-feature__media,
body.home .heikaya-clear-crystal__media,
body.home .heikaya-silver-showcase__media {
    padding: var(--heikaya-home-video-frame) !important;
}

/* Strong, consistent title-to-content spacing across the homepage. */
body.home .lumiere-featured-products__heading,
body.home .lumiere-categories-heading,
body.home .heikaya-clear-crystal__products .lumiere-featured-products__heading,
body.home .lumiere-home-new-arrivals .lumiere-featured-products__heading,
body.home .heikaya-silver-showcase__products .lumiere-featured-products__heading,
body.home .heikaya-candle-holder-showcase__inner .lumiere-featured-products__heading,
body.home .heikaya-subcategories-only .lumiere-collection-section__heading {
    margin-bottom: var(--heikaya-home-title-gap) !important;
}

/* Give the major title bands a little more vertical presence without
   becoming oversized. */
body.home .lumiere-featured-products__heading,
body.home .lumiere-categories-heading,
body.home .lumiere-home-new-arrivals .lumiere-featured-products__heading,
body.home .heikaya-silver-showcase__products .lumiere-featured-products__heading,
body.home .heikaya-candle-holder-showcase__inner .lumiere-featured-products__heading {
    min-height: 116px !important;
}

/* Bohemia had an older fixed height/max-height rule, so override all three. */
body.home .heikaya-clear-crystal__products .lumiere-featured-products__heading {
    height: 116px !important;
    min-height: 116px !important;
    max-height: 116px !important;
}

/* Collection/category headings also get a controlled, polished band. */
body.home .heikaya-subcategories-only .lumiere-collection-section__heading {
    min-height: 108px !important;
}

/* Add a deliberate separation after the content of each major homepage
   section so transitions no longer feel compressed. */
body.home .lumiere-featured-products {
    padding-bottom: var(--heikaya-home-section-gap) !important;
}

body.home .heikaya-clear-crystal {
    padding-bottom: var(--heikaya-home-section-gap) !important;
}

body.home .lumiere-home-new-arrivals {
    padding-bottom: var(--heikaya-home-section-gap) !important;
}

body.home .heikaya-silver-showcase {
    padding-bottom: var(--heikaya-home-section-gap) !important;
}

body.home .heikaya-candle-holder-showcase {
    padding-bottom: var(--heikaya-home-section-gap) !important;
}

/* Keep editorial media/copy blocks from touching the product grids above them. */
body.home .heikaya-clear-crystal__editorial,
body.home .heikaya-silver-showcase__editorial {
    margin-top: clamp(34px, 3vw, 50px) !important;
}

/* Egermann is an editorial section on its own; separate it cleanly from
   the next title band without creating a huge empty area. */
body.home .lumiere-egermann-feature {
    margin-bottom: clamp(22px, 2vw, 34px) !important;
}

/* The visual category grid between Silver and the wide video should feel
   like a proper section rather than a tight insert. */
body.home .heikaya-category-editorial-grid {
    margin-top: clamp(34px, 3.4vw, 52px) !important;
    margin-bottom: clamp(34px, 3.4vw, 52px) !important;
}

/* Maintain the improved product-card spacing while giving the image/title
   transition just a little more polish. */
body.home .lumiere-featured-product__body {
    padding-top: 24px !important;
}

body.home .lumiere-featured-product__price {
    padding-top: 20px !important;
}

@media (max-width: 767px) {
    body.home {
        --heikaya-home-section-gap: 38px;
        --heikaya-home-title-gap: 22px;
        --heikaya-home-video-frame: 18px;
    }

    body.home .lumiere-featured-products__heading,
    body.home .lumiere-categories-heading,
    body.home .lumiere-home-new-arrivals .lumiere-featured-products__heading,
    body.home .heikaya-silver-showcase__products .lumiere-featured-products__heading,
    body.home .heikaya-candle-holder-showcase__inner .lumiere-featured-products__heading {
        min-height: 94px !important;
    }

    body.home .heikaya-clear-crystal__products .lumiere-featured-products__heading {
        height: 94px !important;
        min-height: 94px !important;
        max-height: 94px !important;
    }

    body.home .heikaya-subcategories-only .lumiere-collection-section__heading {
        min-height: 90px !important;
    }

    body.home .lumiere-featured-product__body {
        padding-top: 18px !important;
    }

    body.home .lumiere-featured-product__price {
        padding-top: 14px !important;
    }

    body.home .heikaya-clear-crystal__editorial,
    body.home .heikaya-silver-showcase__editorial {
        margin-top: 28px !important;
    }
}


/* ==========================================================
   v6.19.7 — ONE CONSISTENT HOMEPAGE SPACING SYSTEM
   Replaces accumulated section-specific gaps from older versions.
   ========================================================== */

body.home {
    --heikaya-home-title-band-consistent: 96px;
    --heikaya-home-title-content-gap-consistent: 30px;
    --heikaya-home-content-next-title-edge: 16px;
    --heikaya-home-grid-editorial-gap-consistent: 56px;
    --heikaya-home-editorial-section-gap-consistent: 48px;
    --heikaya-home-video-frame-consistent: clamp(30px, 2.6vw, 44px);
}

/* ----------------------------------------------------------
   1. Major title bands
   Every major homepage title occupies the same vertical band.
   ---------------------------------------------------------- */
body.home .lumiere-collections > .lumiere-featured-products .lumiere-featured-products__heading,
body.home .lumiere-categories-heading,
body.home .heikaya-clear-crystal__products .lumiere-featured-products__heading,
body.home .lumiere-home-new-arrivals .lumiere-featured-products__heading,
body.home .heikaya-silver-showcase__products .lumiere-featured-products__heading,
body.home .heikaya-candle-holder-showcase__inner .lumiere-featured-products__heading {
    box-sizing: border-box !important;
    height: var(--heikaya-home-title-band-consistent) !important;
    min-height: var(--heikaya-home-title-band-consistent) !important;
    max-height: var(--heikaya-home-title-band-consistent) !important;
    margin: 0 0 var(--heikaya-home-title-content-gap-consistent) !important;
    padding: 0 16px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

/* Category/subcategory titles use the same rhythm, just without forcing
   the parent collection wrapper to inherit old padding. */
body.home .heikaya-subcategories-only .lumiere-collection-section__heading {
    box-sizing: border-box !important;
    min-height: 92px !important;
    margin: 0 0 28px !important;
    padding: 0 16px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

body.home .lumiere-categories-heading + .lumiere-stacked-collections,
body.home .heikaya-subcategories-only .lumiere-category-slider {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* ----------------------------------------------------------
   2. Browse All Categories -> Bohemia Crystal
   This was too tight. The next 96px title band starts after a
   small deliberate edge gap, putting the title at a balanced distance.
   ---------------------------------------------------------- */
body.home .lumiere-all-categories-action {
    margin: 0 0 var(--heikaya-home-content-next-title-edge) !important;
    padding-bottom: 0 !important;
}

body.home .lumiere-collections {
    padding-bottom: 0 !important;
}

body.home .heikaya-clear-crystal {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ----------------------------------------------------------
   3. Product grids -> their editorial/video blocks
   Kill old stacked padding and use one exact editorial gap.
   ---------------------------------------------------------- */
body.home .heikaya-clear-crystal__products,
body.home .heikaya-silver-showcase__products {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

body.home .heikaya-clear-crystal__editorial,
body.home .heikaya-silver-showcase__editorial {
    margin-top: var(--heikaya-home-grid-editorial-gap-consistent) !important;
}

/* ----------------------------------------------------------
   4. Section -> next titled section
   Keep only a small edge gap because the next title band itself
   supplies 48px above the centered title.
   ---------------------------------------------------------- */
body.home .heikaya-clear-crystal {
    padding-bottom: var(--heikaya-home-content-next-title-edge) !important;
}

body.home .lumiere-home-new-arrivals {
    margin: 0 !important;
    padding-top: 0 !important;
    padding-bottom: var(--heikaya-home-content-next-title-edge) !important;
}

body.home .lumiere-featured-products--new-arrivals {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border-bottom: 0 !important;
}

body.home .heikaya-silver-showcase {
    margin: 0 !important;
    padding-top: 0 !important;
    padding-bottom: var(--heikaya-home-content-next-title-edge) !important;
}

body.home .heikaya-candle-holder-showcase {
    padding-top: 0 !important;
    padding-bottom: var(--heikaya-home-content-next-title-edge) !important;
}

/* Buttons below product grids should have one controlled gap, not the
   historical 20/42/54px mixture. */
body.home .lumiere-featured-products__action,
body.home .lumiere-featured-products--new-arrivals .lumiere-featured-products__action,
body.home .heikaya-candle-holder-showcase__inner .lumiere-featured-products__action {
    margin: 0 !important;
    padding-top: 32px !important;
    padding-bottom: 0 !important;
}

/* Silver follows New Arrivals directly. No inherited 80px+ section padding. */
body.home .heikaya-silver-showcase__products {
    margin-top: 0 !important;
}

/* After the Silver editorial, use one clean transition into the
   six-category editorial grid. */
body.home .heikaya-category-editorial-grid {
    margin-top: var(--heikaya-home-editorial-section-gap-consistent) !important;
    margin-bottom: var(--heikaya-home-editorial-section-gap-consistent) !important;
}

/* Egermann's editorial block gets the same controlled transition into
   Our Categories instead of a separate oversized value. */
body.home .lumiere-egermann-feature {
    margin-bottom: var(--heikaya-home-content-next-title-edge) !important;
}

/* ----------------------------------------------------------
   5. Product-card internal rhythm remains consistent
   ---------------------------------------------------------- */
body.home .lumiere-featured-product__body {
    padding-top: 22px !important;
}

body.home .lumiere-featured-product__price {
    margin-top: auto !important;
    padding-top: 18px !important;
}

/* ----------------------------------------------------------
   6. Slightly more padding around Egermann / Bohemia / Silver videos
   ---------------------------------------------------------- */
body.home .lumiere-egermann-feature__media,
body.home .heikaya-clear-crystal__media,
body.home .heikaya-silver-showcase__media {
    box-sizing: border-box !important;
    padding: var(--heikaya-home-video-frame-consistent) !important;
    background: #fffdf9 !important;
}

body.home .lumiere-egermann-feature__media video,
body.home .lumiere-egermann-feature__media img,
body.home .heikaya-clear-crystal__media video,
body.home .heikaya-clear-crystal__media img,
body.home .heikaya-silver-showcase__media video,
body.home .heikaya-silver-showcase__media img {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* ----------------------------------------------------------
   Mobile / tablet rhythm
   ---------------------------------------------------------- */
@media (max-width: 767px) {
    body.home {
        --heikaya-home-title-band-consistent: 86px;
        --heikaya-home-title-content-gap-consistent: 22px;
        --heikaya-home-content-next-title-edge: 12px;
        --heikaya-home-grid-editorial-gap-consistent: 34px;
        --heikaya-home-editorial-section-gap-consistent: 34px;
        --heikaya-home-video-frame-consistent: 20px;
    }

    body.home .lumiere-collections > .lumiere-featured-products .lumiere-featured-products__heading,
    body.home .lumiere-categories-heading,
    body.home .heikaya-clear-crystal__products .lumiere-featured-products__heading,
    body.home .lumiere-home-new-arrivals .lumiere-featured-products__heading,
    body.home .heikaya-silver-showcase__products .lumiere-featured-products__heading,
    body.home .heikaya-candle-holder-showcase__inner .lumiere-featured-products__heading {
        height: var(--heikaya-home-title-band-consistent) !important;
        min-height: var(--heikaya-home-title-band-consistent) !important;
        max-height: var(--heikaya-home-title-band-consistent) !important;
        margin-bottom: var(--heikaya-home-title-content-gap-consistent) !important;
        padding: 0 12px !important;
    }

    body.home .heikaya-subcategories-only .lumiere-collection-section__heading {
        min-height: 82px !important;
        margin-bottom: 22px !important;
        padding: 0 12px !important;
    }

    body.home .lumiere-featured-products__action,
    body.home .lumiere-featured-products--new-arrivals .lumiere-featured-products__action,
    body.home .heikaya-candle-holder-showcase__inner .lumiere-featured-products__action {
        padding-top: 26px !important;
    }

    body.home .lumiere-featured-product__body {
        padding-top: 17px !important;
    }

    body.home .lumiere-featured-product__price {
        padding-top: 13px !important;
    }
}
