/* ==========================================================================
   Home page sections — floating actions, home collections, products carousel
   ========================================================================== */

/* --- Swiper (minimal) --- */
.swiper {
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    padding: 0;
    position: relative;
    z-index: 1
}

.swiper-wrapper {
    box-sizing: content-box;
    display: flex;
    height: 100%;
    position: relative;
    transition-property: transform;
    width: 100%;
    z-index: 1
}

.swiper-wrapper {
    transform: translateZ(0)
}

.swiper-slide {
    display: block;
    flex-shrink: 0;
    height: 100%;
    position: relative;
    transition-property: transform;
    width: 100%
}

/* --- c-button (shared) --- */
.c-button,
.c-button__action,
.c-button__arrow,
.c-button__icon,
.c-button__icon--primary,
.c-button__icon--secondary,
.c-button__outline,
.c-button__outline--berries,
.c-button__solid,
.c-button__solid--berries,
.c-button__solid--black,
.c-button__solid--blood,
.c-button__solid--fire,
.c-button__solid--forest,
.c-button__solid--white {
    align-items: center;
    border-radius: 10rem;
    cursor: pointer;
    display: inline-flex;
    font-family: PPNeueMontreal-Bold;
    font-size: 1.4rem;
    gap: .6rem;
    isolation: isolate;
    letter-spacing: -.014rem;
    line-height: 1.58rem;
    position: relative;
    text-transform: uppercase
}

.c-button span,
.c-button svg,
.c-button__action span,
.c-button__action svg,
.c-button__arrow span,
.c-button__arrow svg,
.c-button__icon span,
.c-button__icon svg,
.c-button__icon--primary span,
.c-button__icon--primary svg,
.c-button__icon--secondary span,
.c-button__icon--secondary svg,
.c-button__outline span,
.c-button__outline svg,
.c-button__outline--berries span,
.c-button__outline--berries svg,
.c-button__solid span,
.c-button__solid svg,
.c-button__solid--berries span,
.c-button__solid--berries svg,
.c-button__solid--black span,
.c-button__solid--black svg,
.c-button__solid--blood span,
.c-button__solid--blood svg,
.c-button__solid--fire span,
.c-button__solid--fire svg,
.c-button__solid--forest span,
.c-button__solid--forest svg,
.c-button__solid--white span,
.c-button__solid--white svg {
    z-index: 2
}

.c-button svg,
.c-button__action svg,
.c-button__arrow svg,
.c-button__icon svg,
.c-button__icon--primary svg,
.c-button__icon--secondary svg,
.c-button__outline svg,
.c-button__outline--berries svg,
.c-button__solid svg,
.c-button__solid--berries svg,
.c-button__solid--black svg,
.c-button__solid--blood svg,
.c-button__solid--fire svg,
.c-button__solid--forest svg,
.c-button__solid--white svg {
    max-width: 2rem;
    width: 100%
}

/* --- c-button__icon--secondary --- */
.c-button__icon,
.c-button__icon--primary,
.c-button__icon--secondary {
    background-color: #fbf6ed;
    border: 2px solid transparent;
    gap: 0;
    justify-content: center;
    transition: transform .4s cubic-bezier(.165, .84, .44, 1)
}

.c-button__icon svg,
.c-button__icon--primary svg,
.c-button__icon--secondary svg {
    z-index: 2
}

.c-button__icon--primary:before,
.c-button__icon--secondary:before,
.c-button__icon:before {
    border-radius: 10rem;
    content: "";
    left: 50%;
    position: absolute;
    top: 50%;
    inset: -.2rem;
    transform: translate(-50%, -50%);
    transform: scale(0);
    transition: transform .4s cubic-bezier(.165, .84, .44, 1)
}

.c-button__icon--primary:hover,
.c-button__icon--secondary:hover,
.c-button__icon:hover {
    color: #fbf6ed;
    transform: translateY(-.3rem) scale(1.1)
}

.c-button__icon--primary:hover:before,
.c-button__icon--secondary:hover:before,
.c-button__icon:hover:before {
    transform: scale(1)
}

.c-button__icon--secondary {
    border-color: #fe431a;
    color: #fe431a
}

.c-button__icon--secondary:before {
    background-color: #fe431a
}

/* --- c-button__action --- */
.c-button__action {
    background-color: #fbf6ed;
    border: 1px solid #2f1948;
    border-radius: 7rem;
    color: #2f1948;
    font-size: 1.2rem;
    gap: .9rem;
    letter-spacing: -.024rem;
    line-height: 1.2rem;
    padding: .7rem 1.3rem
}

.c-button__action:hover {
    color: #fbf6ed
}

.c-button__action:hover .c-button__action-count {
    background: #fbf6ed;
    border-color: #2f1948;
    color: #2f1948
}

.c-button__action:hover:before {
    transform: scale(1)
}

.c-button__action:before {
    background-color: #2f1948;
    border-radius: 7rem;
    content: "";
    left: 50%;
    position: absolute;
    top: 50%;
    inset: -.2rem;
    transform: translate(-50%, -50%);
    transform: scale(0);
    transition: transform .4s cubic-bezier(.165, .84, .44, 1)
}

.c-button__action svg {
    height: 1.6rem;
    width: 1.6rem
}

.c-button__action-count {
    align-items: center;
    background: #2f1948;
    border: 1px solid #fbf6ed;
    border-radius: 50%;
    color: #fbf6ed;
    display: inline-flex;
    font-size: .8rem;
    height: 1.2rem;
    justify-content: center;
    letter-spacing: -.0016rem;
    opacity: 0;
    position: absolute;
    right: .5rem;
    top: .4rem;
    transition: .4s cubic-bezier(.645, .045, .355, 1);
    width: 1.2rem;
    z-index: 3 !important
}

.c-button__action-count.active {
    opacity: 1
}

/* --- c-cta --- */
.c-cta,
.c-cta--primary,
.c-cta--secondary,
.c-cta--tertiary {
    --label-width: 12.3rem;
    --size: 5rem;
    --sweep: 50%;
    display: inline-flex;
    isolation: isolate;
    text-decoration: none
}

.c-cta__label {
    align-items: center;
    display: inline-flex;
    font-size: 1.4rem;
    font-weight: 700;
    justify-content: center;
    letter-spacing: -.056rem;
    line-height: 1.4rem;
    min-width: var(--label-width);
    z-index: 2
}

.c-cta__arrows,
.c-cta__label {
    border: 2px solid transparent;
    border-radius: 10rem;
    height: var(--size);
    transition: transform .4s cubic-bezier(.34, 1.6, .64, 1)
}

.c-cta__arrows {
    position: relative;
    width: var(--size)
}

.c-cta__arrows svg {
    height: 2rem;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 2rem;
    z-index: 2
}

.c-cta__arrows svg:first-child {
    transition: transform .3s cubic-bezier(.55, .055, .675, .19), opacity .3s cubic-bezier(.55, .055, .675, .19)
}

.c-cta__arrows svg:last-child {
    color: #fbf6ed;
    opacity: 0;
    transform: translate(calc(-50% - var(--sweep)), calc(-50% + var(--sweep)));
    transition: transform .4s cubic-bezier(.215, .61, .355, 1), opacity .4s cubic-bezier(.215, .61, .355, 1)
}

.c-cta__arrows:before {
    border-radius: 10rem;
    content: "";
    left: 50%;
    position: absolute;
    top: 50%;
    inset: -.2rem;
    transform: translate(-50%, -50%);
    transform: translate(-50%, -50%) scale(0);
    transition: transform .2s cubic-bezier(.165, .84, .44, 1)
}

.c-cta--primary>* {
    border-color: #2f1948;
    color: #2f1948
}

.c-cta--primary>:before {
    background-color: #2f1948
}

.c-cta--secondary>* {
    border-color: #fe431a;
    color: #fe431a
}

.c-cta--secondary>:before {
    background-color: #fe431a
}

.c-cta--tertiary>* {
    border-color: #9a1902;
    color: #9a1902
}

.c-cta--tertiary>:before {
    background-color: #9a1902
}

.c-cta--primary:hover,
.c-cta--secondary:hover,
.c-cta--tertiary:hover,
.c-cta:hover {
    cursor: pointer
}

.c-cta--primary:hover .c-cta__label,
.c-cta--secondary:hover .c-cta__label,
.c-cta--tertiary:hover .c-cta__label,
.c-cta:hover .c-cta__label {
    transform: translateX(var(--size))
}

.c-cta--primary:hover .c-cta__arrows,
.c-cta--secondary:hover .c-cta__arrows,
.c-cta--tertiary:hover .c-cta__arrows,
.c-cta:hover .c-cta__arrows {
    transform: translateX(calc(var(--label-width)*-1))
}

.c-cta--primary:hover .c-cta__arrows svg:first-child,
.c-cta--secondary:hover .c-cta__arrows svg:first-child,
.c-cta--tertiary:hover .c-cta__arrows svg:first-child,
.c-cta:hover .c-cta__arrows svg:first-child {
    opacity: 0;
    transform: translate(calc(-50% + var(--sweep)), calc(-50% - var(--sweep)))
}

.c-cta--primary:hover .c-cta__arrows svg:last-child,
.c-cta--secondary:hover .c-cta__arrows svg:last-child,
.c-cta--tertiary:hover .c-cta__arrows svg:last-child,
.c-cta:hover .c-cta__arrows svg:last-child {
    opacity: 1;
    transform: translate(-50%, -50%)
}

.c-cta--primary:hover .c-cta__arrows:before,
.c-cta--secondary:hover .c-cta__arrows:before,
.c-cta--tertiary:hover .c-cta__arrows:before,
.c-cta:hover .c-cta__arrows:before {
    transform: scale(1);
    transition: transform .4s cubic-bezier(.165, .84, .44, 1)
}

/* --- c-arrow-nav --- */
.c-arrow-nav,
.c-arrow-nav__icon {
    display: flex;
    justify-content: center
}

.c-arrow-nav__icon.swiper-button-lock,
.c-arrow-nav__icon[disabled],
.c-arrow-nav__icon.swiper-button-disabled {
    display: flex !important;
    opacity: 1 !important
}

.c-arrow-nav {
    gap: 1rem
}

.c-arrow-nav__icon {
    align-items: center;
    background-color: #fbf6ed;
    border: 2px solid #2f1948;
    border-radius: 10rem;
    color: #2f1948;
    min-height: 4rem;
    min-width: 4rem;
    transition: transform .4s cubic-bezier(.215, .61, .355, 1);
    will-change: transform
}

@media(min-width:576px) {
    .c-arrow-nav__icon {
        min-height: 5.2rem;
        min-width: 5.2rem
    }
}

.c-arrow-nav__icon:before {
    background-color: #2f1948;
    border-radius: 10rem;
    content: "";
    left: 50%;
    position: absolute;
    top: 50%;
    inset: -.2rem;
    transform: translate(-50%, -50%);
    transform: scale(0);
    transition: transform .2s cubic-bezier(.165, .84, .44, 1)
}

.c-arrow-nav__icon svg {
    height: 1.7rem;
    width: 1.7rem;
    z-index: 2
}

@media(min-width:576px) {
    .c-arrow-nav__icon svg {
        height: 2.2rem;
        width: 2.2rem
    }
}

.c-arrow-nav__icon--prev {
    transform-origin: right center
}

.c-arrow-nav__icon--next {
    transform-origin: left center
}

.c-arrow-nav__icon:hover {
    color: #fbf6ed;
    cursor: pointer;
    transform: scale(1.1)
}

.c-arrow-nav__icon:hover:before {
    transform: scale(1);
    transition: transform .4s cubic-bezier(.165, .84, .44, 1)
}

/* --- b-floating-actions --- */
.b-floating-actions {
    bottom: 2rem;
    display: flex;
    gap: .5rem;
    position: fixed;
    right: 2rem;
    z-index: 10
}

.b-floating-actions button {
    height: 5rem;
    width: 5rem
}

.b-floating-actions button:last-child svg {
    max-width: 2.4rem
}

.b-floating-actions button svg {
    z-index: 11
}

.b-floating-actions button:hover .c-button__action-count {
    background-color: #fbf6ed;
    border-color: #fe431a;
    color: #fe431a
}

.b-floating-actions button .c-button__action-count {
    background-color: #fe431a;
    top: 1.1rem;
    z-index: 12 !important
}

@media(max-width:575.98px) {
    .b-floating-actions button[data-cart=button] {
        display: none
    }
}

/* --- b-home-collection --- */
.b-home-collection {
    position: relative;
    z-index: 1
}

/* Elementor widget — break out of the boxed container to full viewport
   width, same technique as the Hero/Nav widgets (tolerates container padding) */
.b-home-collection.el-collection {
    left: 50%;
    margin-inline-start: 0;
    max-width: 100vw;
    transform: translateX(-50%);
    width: 100vw
}

@media(max-width:575.98px) {
    .b-home-collection .c-announc {
        margin-bottom: 1.4rem
    }
}

.b-home-collection .wrapper {
    padding: 8rem 0 1.6rem;
    position: relative;
    /* per-device nudges from the widget's Content offset controls */
    transform: translate(var(--coll-off-x, 0rem), calc(var(--coll-off-y, 0rem) * -1))
}

@media(max-width:575.98px) {
    .b-home-collection .wrapper {
        padding: 3rem 0 1.6rem
    }
}

.b-home-collection__heading {
    font-size: 2.8rem;
    letter-spacing: -.112rem;
    line-height: 2.576rem;
    margin-bottom: 2.4rem
}

@media(min-width:576px) {
    .b-home-collection__heading {
        font-size: 4rem;
        letter-spacing: -.16rem;
        line-height: 3.68rem;
        margin-bottom: 0
    }
}

.b-home-collection__toolbar {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 1.6rem 3rem;
    justify-content: center;
    position: relative
}

@media(min-width:576px) {
    .b-home-collection__toolbar {
        margin-top: 2.8rem
    }

    .b-home-collection__toolbar .c-arrow-nav {
        position: absolute;
        right: 5rem;
        top: 50%;
        transform: translateY(-50%)
    }
}

.b-home-collection__tabs {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .8rem 3.2rem;
    justify-content: center;
    list-style: none;
    margin: 0;
    padding: 0
}

.b-home-collection__tab {
    background: none;
    border: 0;
    color: #1a2139;
    cursor: pointer;
    font-size: 1.4rem;
    letter-spacing: .02rem;
    line-height: 1.6rem;
    padding: .8rem 1.6rem;
    transition: color .3s ease
}

.b-home-collection__tab.is-active {
    background-color: #294a9f;
    border-radius: 10rem;
    color: #fbf6ed
}

.b-home-collection__tab:not(.is-active):hover {
    color: #294a9f
}

.b-home-collection__products {
    padding: 0 2rem 4rem
}

@media(min-width:576px) {
    .b-home-collection__products {
        padding: 0 1rem 4rem
    }
}

/* Extra space below the second (blends) product section */
.b-home-collection + .b-home-collection {
    padding-bottom: 4rem
}

@media(min-width:576px) {
    .b-home-collection + .b-home-collection {
        padding-bottom: 8rem
    }
}

.b-home-collection__products .swiper-slide {
    display: flex;
    width: 48%
}

.b-home-collection__products .c-product {
    border-radius: 0;
    gap: 1.6rem;
    height: 100%;
    justify-content: flex-start;
    padding: .4rem 0 0;
    position: relative;
    width: 100%
}

.c-product__badge {
    background-color: #fbf6ed;
    border-radius: .4rem;
    font-size: 1.1rem;
    left: 50%;
    letter-spacing: .04em;
    padding: .4rem .8rem;
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    z-index: 2
}

.b-home-collection__products .c-product__pattern {
    background-color: #294a9f
}

.b-home-collection__products .c-product__tile {
    aspect-ratio: 4/5;
    background-color: #294a9f;
    margin-top: 4rem;
    overflow: hidden;
    position: relative;
    width: 60%
}

/* Fill image for image-backed cards (Elementor collection widget) */
.b-home-collection .c-product__fill-img {
    display: block;
    height: 100%;
    inset: 0;
    object-fit: cover;
    position: absolute;
    width: 100%
}

.b-home-collection__products .c-product__title {
    margin-bottom: 0;
    margin-top: 4rem;
    max-width: 90%;
    min-height: 5.76rem;
    width: auto
}

.b-home-collection__products .c-product__cta {
    margin-top: auto
}

@media(max-width:575.98px) {
    .b-home-collection__products .swiper-slide.c-product {
        height: auto
    }

    .b-home-collection__products .c-product {
        gap: 1.2rem;
        padding-top: 0
    }

    /* Mobile card = the image block itself, no pattern layer behind it */
    .b-home-collection__products .c-product__pattern {
        display: none
    }

    .b-home-collection__products .c-product__tile {
        border-radius: 1.6rem;
        margin-top: 0;
        width: 100%
    }

    .b-home-collection__products .c-product__title {
        margin-top: 0
    }

    /* Tabs take a full centered row; arrows drop to their own right-aligned row */
    .b-home-collection__tabs {
        width: 100%
    }

    .b-home-collection__toolbar .c-arrow-nav {
        margin-left: auto;
        margin-right: 2rem
    }

    .b-home-collection.no-mobile-arrows .c-arrow-nav {
        display: none
    }

    /* Cards link via their title — no "+" button on mobile */
    .b-home-collection .c-product__mobile-link {
        display: none
    }
}

/* Swiper pagination dots under the carousel */
.b-home-collection .swiper-pagination {
    bottom: auto;
    display: flex;
    gap: .8rem;
    justify-content: center;
    margin-top: 2.4rem;
    position: static
}

.b-home-collection .swiper-pagination-bullet {
    background: #294a9f;
    border-radius: 10rem;
    height: .8rem;
    margin: 0;
    opacity: .25;
    width: .8rem
}

.b-home-collection .swiper-pagination-bullet-active {
    opacity: 1
}

@media(min-width:576px) {
    .b-home-collection__products .swiper-slide {
        width: 25%
    }

    /* Pattern already covers mobile; keep it off on desktop tiles */
    .b-home-collection__products .c-product__pattern {
        display: none
    }
}

.b-home-collection__view-all {
    padding: 0 2rem 4rem
}

@media(min-width:576px) {
    .b-home-collection__view-all {
        padding-bottom: 0rem
    }
}

/* --- c-product__shape --- */
.c-product__shape {
    color: var(--p-bg-color);
    inset: 0;
    left: 50%;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%) scale(0);
    transform-origin: center;
    transition: transform .3s cubic-bezier(.645, .045, .355, 1);
    width: 100%;
    z-index: -1
}

@media(max-width:575.98px) {
    .c-product__shape {
        display: none
    }
}

.c-product__shape svg {
    height: 100%;
    width: 100%;
    fill: currentColor;
    display: block
}

@media(min-width:576px) {
    .c-product__image--link:hover .c-product__shape {
        transform: translate(-50%, -50%) scale(0.9) rotate(5.69deg)
    }
}

/* --- c-product__mobile-link --- */
.c-product__mobile-link {
    border-color: var(--p-border-color);
    color: var(--p-border-color);
    height: 4rem;
    position: absolute;
    right: 1.3rem;
    top: 1.1rem;
    width: 4rem;
    z-index: 3
}

.c-product__mobile-link svg {
    width: 1.3rem
}

@media(min-width:576px) {
    .c-product__mobile-link {
        display: none
    }
}

/* --- c-product__title --- */
.c-product__title {
    font-size: 2.4rem;
    letter-spacing: -.024rem;
    line-height: 2.28rem;
    width: min-content;
    z-index: 3
}

@media(max-width:575.98px) {
    .c-product__title {
        color: var(--p-color) !important
    }
}

@media(min-width:576px) {
    .c-product__title {
        font-size: 2.4rem;
        letter-spacing: -.096rem;
        line-height: 2.88rem;
        margin-bottom: .4rem
    }
}

/* ==========================================================================
   c-button__solid--blood (color variant)
   ========================================================================== */
.c-button__solid--blood {
    background: #9a1902;
    color: #fff
}

.c-button__solid--blood:hover {
    border-color: #9a1902;
    color: #9a1902
}

/* ==========================================================================
   c-input (base form input)
   ========================================================================== */
.c-input {
    cursor: pointer
}

.c-input input,
.c-input textarea {
    background-color: hsla(39, 64%, 96%, .06);
    border: .2rem solid hsla(39, 64%, 96%, .1);
    border-radius: 3.6rem;
    color: #fe431a;
    font-family: PPNeueMontreal-Bold;
    font-size: 1.4rem;
    letter-spacing: -.014rem;
    line-height: 1.58rem;
    padding: 1.2rem 1.6rem;
    text-transform: uppercase;
    transition: .4s ease
}

.c-input input::placeholder,
.c-input textarea::placeholder {
    color: rgba(254, 67, 26, .4)
}

.c-input input:focus,
.c-input textarea:focus {
    outline: none
}

/* ==========================================================================
   b-bundle — Bundle & SAVE section
   ========================================================================== */
.b-bundle {
    padding: 8rem 0 8rem;
    position: relative;
    z-index: 1
}

.b-bundle.bg-fire-fruit {
    background-color: #294A9F !important
}

@media(min-width:576px) {
    .b-bundle {
        padding-bottom: 14rem
    }
}

.b-bundle__heading {
    font-size: 3.7rem;
    letter-spacing: -.148rem;
    line-height: 3.47rem;
    margin-bottom: 5.2rem
}

@media(min-width:576px) {
    .b-bundle__heading {
        font-size: 9rem;
        letter-spacing: -.36rem;
        line-height: 8.1rem
    }
}

.b-bundle__subhead {
    font-size: 1.4rem;
    letter-spacing: -.014rem;
    line-height: 1.72rem;
    margin-bottom: 8.4rem; /* <-- Reduced gap here */
    white-space: pre-wrap;
}

.b-bundle__content {
    font-size: 3.7rem;
    letter-spacing: -.148rem;
    line-height: 3.47rem;
    margin-bottom: 3.2rem;
    white-space: pre-wrap
}

.b-bundle__cta {
    flex: 1;
    text-align: center
}

.b-bundle__holder {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 6rem;
    justify-content: center;
    width: 100%
}

@media(min-width:576px) {
    .b-bundle__holder {
        flex-direction: row;
        gap: 4rem;
        align-items: flex-start;
    }
}

.b-bundle__images {
    isolation: isolate;
    overflow: visible;
    position: relative;
    width: 100%
}

.b-bundle__image {
    opacity: 1;
    will-change: transform, opacity
}

.b-bundle__images--cans {
    max-width: 40%
}

@media(min-width:576px) {
    .b-bundle__images--cans {
        max-width: 26%;
        transform: translateX(3.5rem)
    }

    .b-bundle__images--cans .b-bundle__image--float {
        right: 0
    }

    .b-bundle__images--cans .b-bundle__image {
        max-width: 88%
    }
}

.b-bundle__images--cans .b-bundle__image:first-child {
    z-index: 3
}

@media(min-width:576px) {
    .b-bundle__images--cans .b-bundle__image:first-child {
        margin-left: auto
    }
}

.b-bundle__images--cans .b-bundle__image:nth-child(2) {
    z-index: 2
}

.b-bundle__images--cans .b-bundle__image:last-child {
    z-index: 1
}

.b-bundle__images--gummies {
    max-width: 48%
}

@media(min-width:576px) {
    .b-bundle__images--gummies {
        max-width: 26%;
        transform: translateX(-3.5rem)
    }

    .b-bundle__images--gummies .b-bundle__image {
        max-width: 100%
    }
}

.b-bundle__images--gummies .b-bundle__image:first-child {
    z-index: 3
}

.b-bundle__images--gummies .b-bundle__image:nth-child(2) {
    z-index: 2
}

.b-bundle__images--gummies .b-bundle__image:last-child {
    z-index: 1
}

.b-bundle__image--anchor {
    position: relative
}

.b-bundle__image--float {
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.b-bundle__deals {
    gap: 2.4rem
}

.b-bundle__deal,
.b-bundle__deals {
    align-items: center;
    display: flex;
    flex-direction: column
}

.b-bundle__deal__icon {
    align-items: center;
    border: 2px solid #fbf6ed;
    border-radius: 50%;
    display: flex;
    height: 4.5rem;
    justify-content: center;
    margin-bottom: 1rem;
    width: 4.5rem
}

.b-bundle__deal__icon svg {
    height: auto;
    width: 55%
}

.b-bundle__deal__spend {
    margin-bottom: .2rem
}

.b-bundle__deal__save,
.b-bundle__deal__spend {
    font-size: 1.2rem;
    letter-spacing: -.012rem;
    line-height: 1.44rem
}

.b-bundle__deal__save {
    border-radius: 10rem;
    padding: .6rem .8rem
}

/* ==========================================================================
   footer
   ========================================================================== */
.footer {
    overflow-x: clip;
    position: relative;
    z-index: 3
}

/* Elementor widget — same full-bleed breakout as Hero/Nav/Collection/About/Instagram */
.footer.el-footer {
    left: 50%;
    margin-inline-start: 0;
    max-width: 100vw;
    transform: translateX(-50%);
    width: 100vw
}

/* Social links row */
.footer__social {
    display: flex;
    gap: 1.6rem;
    justify-content: center;
    list-style: none;
    margin: 0 0 3.2rem;
    padding: 0
}

.footer__social a {
    align-items: center;
    color: #294a9f;
    display: flex;
    height: 3.6rem;
    justify-content: center;
    transition: opacity .3s ease;
    width: 3.6rem
}

.footer__social a:hover {
    opacity: .7
}

.footer__social svg {
    height: 2rem;
    width: 2rem
}

.footer .wrapper {
    padding: 18rem 0 2rem
}

@media(min-width:576px) {
    .footer .wrapper {
        padding: 10rem 0 2rem
    }
}

.footer__polygon {
    bottom: calc(100% - 1px);
    color: #f8f8f2;
    /* color: #ff9dd3; */
    left: 0;
    pointer-events: none;
    position: absolute;
    width: 100%;
    z-index: 4
}

.footer__cloud {
    position: absolute;
    width: 15rem;
    z-index: 2
}

@media(min-width:576px) {
    .footer__cloud {
        width: 24rem
    }
}

.footer__cloud--left {
    left: 2rem;
    top: 4.15rem;
    transform: rotate(-15.88deg)
}

@media(min-width:576px) {
    .footer__cloud--left {
        left: 5.5%;
        top: 11%
    }
}

.footer__cloud--right {
    right: 2rem;
    top: 2.3rem;
    transform: rotate(5.14deg)
}

@media(min-width:576px) {
    .footer__cloud--right {
        right: 2%;
        top: 0
    }
}

.footer__logo {
    bottom: calc(100% - 6rem);
    left: 50%;
    max-width: 4%;
    position: absolute;
    transform: translateX(-50%);
    width: 100%;
    z-index: 5
}

.footer__logo img {
    width: 100%;
    height: auto;
    display: block
}

@media(max-width:575.98px) {
    .footer__logo {
        display: none
    }
}

.footer__center {
    margin-bottom: 4.8rem;
    position: relative
}

.footer__heading {
    font-family: Fedro-Semibold;
    font-size: 6.1rem;
    letter-spacing: -.305rem;
    line-height: 4.88rem;
    margin-bottom: 2rem
}

@media(min-width:576px) {
    .footer__heading {
        font-size: 20rem;
        letter-spacing: -1rem;
        line-height: 16rem;
        margin-bottom: 1.6rem
    }
}

.footer__form {
    background-color: #fbf6ed;
    border: .3rem solid #294A9F;
    border-radius: .8rem;
    display: flex;
    padding: .8rem;
    width: 100%
}

@media(min-width:576px) {
    .footer__form {
        left: 50%;
        max-width: 35%;
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%) rotate(-2.64deg)
    }
}

.footer__form__input {
    flex-grow: 1
}

.footer__form__submit {
    white-space: nowrap
}

.footer__form .c-input {
    background-color: #fbf6ed;
    border: none;
    color: #294A9F
}

.footer__form .c-input input {
    background-color: transparent;
    border: none;
    color: #294A9F
}

.footer__form .c-input input::placeholder {
    color: #294A9F
}

.footer__bottom {
    border-bottom: 1px solid rgba(154, 25, 2, .2);
    padding-bottom: 2rem
}

@media(min-width:576px) {
    .footer__bottom {
        margin-bottom: 0
    }
}

.footer__bottom,
.footer__disclaimer {
    color: #294A9F;
    font-family: PPNeueMontreal-Bold;
    font-size: 1.4rem;
    letter-spacing: -.014rem;
    line-height: 1.58rem;
    text-align: center;
    text-transform: uppercase
}

.footer__menu__list {
    display: flex;
    flex-wrap: wrap;
    gap: 4.8rem 4rem;
    justify-content: space-between;
    margin-bottom: 8rem
}

@media(min-width:576px) {
    .footer__menu__list {
        gap: 0;
        margin: 0 auto 17rem;
        max-width: 85.7%
    }
}

@media(max-width:575.98px) {
    .footer__menu__li {
        flex: 0 0 calc(50% - 2rem)
    }
}

.footer__menu__link {
    color: #294A9F;
    font-family: Fedro-Semibold;
    font-size: 1.6rem;
    letter-spacing: -.016rem;
    line-height: 1.92rem;
    margin-bottom: 1.6rem;
    overflow: hidden;
    pointer-events: none;
    text-transform: uppercase
}

.footer__menu__link svg {
    display: none
}

.footer__menu__dropdown__li {
    color: #294A9F;
    font-family: PPNeueMontreal-Bold;
    font-size: 1.4rem;
    letter-spacing: -.014rem;
    line-height: 1.96rem;
    line-height: 1.8rem;
    text-transform: uppercase
}

@media(min-width:576px) {
    .footer__menu__dropdown__li {
        font-size: 1.6rem;
        letter-spacing: -.016rem;
        line-height: 2.24rem;
        line-height: 1.8rem
    }
}

.footer__disclaimer {
    font-size: 1.2rem;
    letter-spacing: -.012rem;
    line-height: 1.44rem;
    margin-top: 2rem
}

@media(max-width:575.98px) {
    .footer__disclaimer br {
        display: none
    }
}

/* ==========================================================================
   b-statement-timeline — Statement with timeline blocks animation
   ========================================================================== */
.b-statement-timeline {
    background: #fbf6ed;
    overflow: visible;
    position: relative
}

.b-statement-timeline__container {
    align-items: center;
    display: flex;
    justify-content: center;
    padding: 12rem 0 8rem
}

@media(min-width:576px) {
    .b-statement-timeline__container {
        height: 100svh;
        padding: 4rem 0
    }
}

.b-statement-timeline__statement {
    position: relative
}

.b-statement-timeline__heading {
    margin: 0;
    max-width: 30ch;
    text-align: center;
    font-size: 3rem;
    letter-spacing: -.12rem;
    line-height: 3.6rem
}

@media(min-width:576px) {
    .b-statement-timeline__heading {
        font-size: clamp(3rem, 5vw, 5.5rem);
        letter-spacing: -.2rem;
        line-height: 5.5rem
    }
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0
}

.st-block-slot {
    display: inline-block;
    height: 1em;
    width: 1em;
    margin: .1em .15em -.15em .15em;
    position: relative;
    vertical-align: middle
}

@media(min-width:576px) {
    .st-block-slot {
        height: 1.15em;
        width: 1.15em;
        margin: -.05em .2em -.2em .2em
    }
}

/* --- Timeline --- */
.b-statement-timeline__timeline {
    align-items: center;
    display: flex;
    justify-content: center;
    padding: 4rem 0 12rem;
    z-index: 1
}

@media(min-width:576px) {
    .b-statement-timeline__timeline {
        height: 100svh;
        padding: 4rem 0
    }
}

.b-statement-timeline__timeline-inner {
    position: relative;
    width: 100%;
    max-width: 120rem;
    aspect-ratio: 1372/408;
    display: flex;
    align-items: flex-end;
    padding: 0 2rem
}

.b-statement-timeline__timeline-blocks {
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 72%;
    padding: 1.5%
}

.b-statement-timeline__block-wrapper {
    position: relative;
    max-height: 100%;
    aspect-ratio: 1
}

.b-statement-timeline__block {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    will-change: transform, opacity;
    z-index: 10
}

.b-statement-timeline__block img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 18%;
    display: block
}

@media(max-width:575.98px) {
    .b-statement-timeline__timeline-inner {
        aspect-ratio: auto;
        padding: 0 1rem
    }

    .b-statement-timeline__timeline-blocks {
        height: auto;
        gap: 1rem
    }

    .b-statement-timeline__block-wrapper {
        width: calc(50% - .5rem);
        max-height: none;
        aspect-ratio: 1
    }
}

/* ==========================================================================
   b-home-about — About section
   ========================================================================== */
.b-home-about {
    padding: 6rem 0 4rem;
    position: relative;
    z-index: 1
}

/* Elementor widget — same full-bleed breakout as Hero/Nav/Collection */
.b-home-about.el-about {
    left: 50%;
    margin-inline-start: 0;
    max-width: 100vw;
    transform: translateX(-50%);
    width: 100vw
}

.b-home-about__media {
    overflow: hidden;
    position: relative
}

@media(min-width:576px) {
    .b-home-about {
        padding: 10rem 0 8rem
    }
}

.b-home-about__heading {
    font-size: 2.8rem;
    letter-spacing: -.112rem;
    line-height: 2.576rem;
    margin-bottom: 3.2rem
}

@media(min-width:576px) {
    .b-home-about__heading {
        font-size: 4rem;
        letter-spacing: -.16rem;
        line-height: 3.68rem;
        margin-bottom: 5.6rem
    }
}

.b-home-about__holder {
    display: grid;
    gap: 3.2rem
}

@media(min-width:576px) {
    .b-home-about__holder {
        align-items: center;
        gap: 8rem;
        grid-template-columns: 2fr 3fr
    }
}

.b-home-about__media {
    aspect-ratio: 5/5;
    background-color: #294a9f;
    /* border-radius: 2.4rem; */
    width: 100%
}

.b-home-about__content {
    display: flex;
    flex-direction: column
}

.b-home-about__desc {
    font-size: 1.4rem;
    letter-spacing: -.014rem;
    line-height: 1.72rem;
    margin-top: 1rem;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height .4s ease, opacity .4s ease
}

.b-home-about__li:first-child .b-home-about__desc,
.b-home-about__li:hover .b-home-about__desc,
.b-home-about__li.is-open .b-home-about__desc {
    max-height: 20rem;
    opacity: 1
}

.b-home-about__list:hover .b-home-about__li:first-child:not(:hover) .b-home-about__desc,
.b-home-about__list.has-tapped .b-home-about__li:first-child:not(.is-open) .b-home-about__desc {
    max-height: 0;
    opacity: 0
}

/* Widget toggle — "Hover-reveal descriptions" off: show every description always */
.b-home-about__list.no-hover-reveal .b-home-about__desc {
    max-height: 20rem;
    opacity: 1
}

.b-home-about__list {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    list-style: none;
    margin: 0;
    padding: 0
}

button.b-home-about__link {
    background: none;
    border: 0;
    cursor: pointer;
    font-family: inherit;
    padding: 0;
    text-align: left
}

.b-home-about__link {
    color: #1a2139;
    font-size: 2.4rem;
    letter-spacing: -.096rem;
    line-height: 2.4rem;
    text-decoration: none;
    transition: color .3s ease
}

@media(min-width:576px) {
    .b-home-about__link {
        font-size: 3.2rem;
        letter-spacing: -.128rem;
        line-height: 3.2rem
    }
}

.b-home-about__link:hover {
    color: #294a9f
}

.b-home-about__cta {
    align-items: center;
    align-self: flex-end;
    background-color: #294a9f;
    border-radius: 10rem;
    color: #fbf6ed;
    display: inline-flex;
    font-size: 1.4rem;
    gap: 1rem;
    line-height: 1.4rem;
    margin-top: 3.2rem;
    padding: 1.4rem 2.4rem;
    text-decoration: none;
    transition: background-color .3s ease
}

.b-home-about__cta svg {
    height: 1.6rem;
    width: 1.6rem
}

.b-home-about__cta:hover {
    background-color: #1a2139
}

/* ==========================================================================
   b-insta — Instagram card wheel (scroll-driven)
   ========================================================================== */
.b-insta {
    --card-width: max(12rem, 12vw);
    --card-height: calc(var(--card-width) * 6 / 4);
    /* radii large enough so cards don't overlap — wider than the
       viewport so the arch runs off both screen edges. ry < rx
       makes the circle a slight oval (flatter top) */
    --radius-x: max(calc(var(--card-width) * var(--cards) / (2 * 2.1416)), 60vw);
    --radius-y: calc(var(--radius-x) * 0.6);

    height: calc(var(--card-height) + 34rem);
    clip-path: inset(0);
    overflow: hidden;
    position: relative;
    z-index: 1
}

/* Elementor widget — same full-bleed breakout as Hero/Nav/Collection/About */
.b-insta.el-instagram {
    left: 50%;
    margin-inline-start: 0;
    max-width: 100vw;
    transform: translateX(-50%);
    width: 100vw
}

/* circle container — its top edge sits at the section bottom,
   so only the upper arc of cards is visible */
.b-insta__wheel {
    height: calc(var(--radius-y) * 2);
    left: 50%;
    position: absolute;
    top: calc(100% - 20rem);
    transform: translateX(-50%);
    transform-origin: center;
    width: calc(var(--radius-x) * 2)
}

/* cards travel along the fixed ellipse — the arch itself doesn't move */
.b-insta__card {
    animation: b-insta-move var(--insta-speed, 40s) linear infinite reverse;
    aspect-ratio: 4/6;
    background-color: #294a9f;
    display: block;
    offset-anchor: 50% 100%;
    offset-distance: calc((var(--card-i) - 1) / var(--cards) * 100%);
    offset-path: ellipse(var(--radius-x) var(--radius-y) at 50% 50%);
    offset-rotate: auto;
    overflow: hidden;
    position: absolute;
    width: var(--card-width)
}

/* when a card has a real link (editable Instagram wheel) */
a.b-insta__card {
    color: inherit;
    text-decoration: none
}

/* media fills the whole card — beats Elementor's global img reset */
.b-insta__card .c-fill-img {
    height: 100%;
    inset: 0;
    object-fit: cover;
    position: absolute;
    width: 100%
}

@keyframes b-insta-move {
    to { offset-distance: calc((var(--card-i) - 1) / var(--cards) * 100% + 100%) }
}

@media (prefers-reduced-motion: reduce) {
    .b-insta__card {
        animation: none
    }
}

/* fallback: plain centered row when offset-path isn't supported */
@supports not (offset-path: ellipse(10rem 8rem)) {
    .b-insta {
        height: auto;
        padding: 6rem 2rem
    }

    .b-insta__wheel {
        display: flex;
        flex-wrap: wrap;
        gap: 2rem;
        height: auto;
        justify-content: center;
        position: static;
        transform: none;
        width: auto
    }

    .b-insta__card {
        position: static;
        width: min(20rem, 40vw)
    }
}