/* Shared page geometry. Inner grids keep their authored proportions. */
:root { --lo-content-width:1920px; --lo-gutter:clamp(20px,2.5vw,48px); --lo-rail-fade:clamp(72px,9vw,200px);
 /* The inset the feature cards use inside their own edge. The footer
    follows it so its content lines up with the copy in the blocks above. */
 --lo-card-inset:96px; }
/* Below 1024 the footer wrapper already carries Bricks' own 24px, which is
   what the cards use there too, so the token stands down. */
@media(max-width:1023px){ :root { --lo-card-inset:0px; } }
@media(max-width:600px){ :root { --lo-rail-fade:0px; } }
body.bricks-is-frontend #brx-content > .brxe-section,
body.bricks-is-frontend #brx-header > .brxe-section,
body.bricks-is-frontend #brx-footer > .brxe-section {
 width:100%; max-width:none; padding-inline:max(var(--lo-gutter),calc((100% - var(--lo-content-width))/2)); margin-inline:auto;
}
body.bricks-is-frontend #brx-content > .brxe-section > .brxe-container,
body.bricks-is-frontend #brx-header > .brxe-section > .brxe-container,
body.bricks-is-frontend #brx-footer > .brxe-section > .brxe-container {
 width:100%; max-width:var(--lo-content-width); margin-inline:auto;
}
body.bricks-is-frontend #brx-content > .lo-slider-wrap {
 width:100%; max-width:none; padding-inline:max(var(--lo-gutter),calc((100% - var(--lo-content-width))/2));
}
body.bricks-is-frontend .lo-account-design { padding-inline:var(--lo-gutter); }
body.bricks-is-frontend .lo-account-design > .brxe-container { width:100%; max-width:var(--lo-content-width); }
body.bricks-is-frontend:not(.logged-in) #brx-content > #brxe-cgnzpe { padding-inline:0; }
body.bricks-is-frontend:not(.logged-in) #brx-content > #brxe-cgnzpe > #brxe-bdwnvk { max-width:none; }
body.bricks-is-frontend #brxe-ldvzkz { width:100%; max-width:none; padding-inline:0; }
body.bricks-is-frontend.logged-in #brx-content > #brxe-cgnzpe > #brxe-bdwnvk { padding-inline:0; }
/* Remove duplicate page gutters, retaining intentional padding inside feature cards. */
body.bricks-is-frontend #brx-content > .brxe-section > .split-container { padding-inline:0; }

body.bricks-is-frontend #brx-content > .brxe-container:not(.lo-slider-wrap) { width:calc(100% - 2 * var(--lo-gutter)); max-width:var(--lo-content-width); margin-inline:auto; }
body.bricks-is-frontend #brx-footer #brxe-uyyibn { width:100%; max-width:var(--lo-content-width); }
/* The section owns page gutters; header and footer wrappers must not add another set. */
body.bricks-is-frontend #brx-header > .brxe-section > .site-header { padding-inline:0; }
body.bricks-is-frontend #brx-footer > .brxe-section > .brxe-container { padding-inline:var(--lo-card-inset); }
body.bricks-is-frontend #brx-footer #brxe-uyyibn { padding-block:clamp(56px,5vw,96px) 32px; row-gap:56px; }
body.bricks-is-frontend #brx-footer .footer-nav-group { display:grid; grid-template-columns:minmax(0,1.2fr) repeat(3,minmax(0,1fr)); gap:40px; align-items:start; }
body.bricks-is-frontend #brx-footer .footer-nav-group > .brxe-container { width:100%; min-width:0; }
body.bricks-is-frontend #brx-footer #brxe-fzbjps { padding-top:24px; border-top:1px solid #fff7e82b; gap:24px; align-items:center; }
body.bricks-is-frontend #brx-footer #brxe-nicxfw { flex-wrap:wrap; gap:8px 24px; justify-content:flex-end; }
@media(max-width:767px){
 body.bricks-is-frontend #brx-footer .footer-nav-group { grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px 24px; }
 body.bricks-is-frontend #brx-footer #brxe-kwrvex { grid-column:1/-1; }
 body.bricks-is-frontend #brx-footer #brxe-uyyibn { row-gap:36px; }
 body.bricks-is-frontend #brx-footer #brxe-fzbjps { flex-direction:column; align-items:flex-start; gap:16px; }
 body.bricks-is-frontend #brx-footer #brxe-fzbjps > .brxe-container { width:100%; }
 body.bricks-is-frontend #brx-footer #brxe-nicxfw { justify-content:flex-start; flex-direction:column; align-items:flex-start; }
}
/* Product copy follows the image width, with one consistent inset. */
body.bricks-is-frontend .lo-product-card .lo-product-card__info {
 width:100%; max-width:none; margin-inline:0; padding:16px 18px 20px; gap:8px;
}
body.bricks-is-frontend .lo-product-card__info .brxe-container {
 width:100%; max-width:none; min-width:0; margin-inline:0; padding-inline:0;
}
body.bricks-is-frontend .lo-product-card__info > .brxe-container:first-child {
 display:flex; flex-direction:row; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:6px 16px;
}
body.bricks-is-frontend .lo-product-card__info .lo-product-card__title { width:auto; min-width:0; flex:1 1 180px; text-align:left; }
body.bricks-is-frontend .lo-product-card__info > .brxe-container:first-child > .brxe-text-basic { width:auto; flex:0 1 auto; text-align:left; }
body.bricks-is-frontend .lo-product-card__info > .brxe-container:not(:first-child) .brxe-text-basic { width:100%; max-width:none; text-align:left; }
/* Scroll tracks reach the viewport edges; the first card follows the page gutter. */
body.bricks-is-frontend.home #brx-content .lo-edge-track {
 --rail-inset:max(var(--lo-gutter),calc((100vw - var(--lo-content-width))/2));
 width:100vw; max-width:none; margin-inline:calc(50% - 50vw);
 padding-inline:var(--rail-inset); display:flex; flex-direction:row; flex-wrap:nowrap;
 gap:24px; overflow-x:auto; overflow-y:hidden; scroll-padding-inline:var(--rail-inset);
 scroll-snap-type:x proximity; overscroll-behavior-x:contain; scrollbar-width:none;
}
body.bricks-is-frontend.home #brx-content .lo-edge-track::-webkit-scrollbar { display:none; }
body.bricks-is-frontend.home #brx-content .lo-edge-track > * { flex-shrink:0; scroll-snap-align:start; }
body.bricks-is-frontend.home #brx-content .lo-edge-track > .lo-product-card { flex-basis:clamp(280px,27vw,384px); width:clamp(280px,27vw,384px); }
body.bricks-is-frontend.home #brx-content .lo-edge-track > .product-card-container { flex-basis:clamp(250px,25vw,360px); width:clamp(250px,25vw,360px); }
body.bricks-is-frontend.home #brx-content .lo-edge-track:focus-visible { outline:2px solid #526641; outline-offset:-2px; }
@media(max-width:767px){
 body.bricks-is-frontend .lo-product-card .lo-product-card__info { padding:14px 12px 16px; }
 body.bricks-is-frontend.home #brx-content .lo-edge-track { gap:16px; }
 body.bricks-is-frontend.home #brx-content .lo-edge-track > .lo-product-card,
 body.bricks-is-frontend.home #brx-content .lo-edge-track > .product-card-container { flex-basis:min(78vw,340px); width:min(78vw,340px); }
 body.bricks-is-frontend.home #brx-content .lo-edge-track > .testimonial-card { flex-basis:min(84vw,440px); width:min(84vw,440px); }
}
@media(prefers-reduced-motion:reduce){body.bricks-is-frontend.home #brx-content .lo-edge-track{scroll-behavior:auto;}}

/* Keep the shared Bricks circle-to-pill CTA centred in every parent layout. */
body.bricks-is-frontend .lo-cta {
 flex-direction:row; align-items:center; min-height:56px;
}
body.bricks-is-frontend .lo-cta .lo-cta__text {
 top:0; margin-block:0; align-self:center;
}
/* Leave room for hover shadows and keyboard focus inside each scroll viewport. */
body.bricks-is-frontend.home #brx-content .lo-edge-track {
 padding-block:24px 32px; align-items:stretch; cursor:grab;
}
body.bricks-is-frontend.home #brx-content .lo-edge-track > .lo-product-card,
body.bricks-is-frontend.home #brx-content .lo-edge-track > .testimonial-card { height:auto; }
body.bricks-is-frontend.home #brx-content .lo-edge-track .lo-product-card__info { flex-grow:1; }
body.bricks-is-frontend.home #brx-content .lo-edge-track.is-dragging {
 cursor:grabbing; scroll-snap-type:none; scroll-behavior:auto; user-select:none;
}
body.bricks-is-frontend.home #brx-content .lo-edge-track.is-dragging * { user-select:none; }
body.home .lo-slider-arrow--prev[aria-disabled="true"],
body.home .lo-slider-arrow--next[aria-disabled="true"] { opacity:.35; cursor:default; }
/* Category rail: stop the last card short of the right fade so it stays readable. */
body.bricks-is-frontend.home #brx-content #brxe-oztwyi {
 padding-inline-end:calc(var(--rail-inset) + var(--lo-rail-fade));
 scroll-padding-inline-end:calc(var(--rail-inset) + var(--lo-rail-fade));
}
/* The membership steps block settles at its own size rather than stretching
   across a wide screen, which left the steps adrift and their lines running
   past a hundred characters. The copy still fills its column; it is the
   container that stops growing. */
@media(min-width:1024px){
 body.bricks-is-frontend #brx-content > .lo-offer-details > .brxe-container {
  max-width:1360px; margin-inline:auto;
 }
}

/* Shop by benefit. One even row on wide screens; below that the links become a
   stretched grid so every row is full, rather than wrapping into ragged gaps.
   The links keep their own 56px height and circle-to-pill hover. */
body.bricks-is-frontend #brx-content .lo-benefit-grid {
 display:grid; grid-template-columns:minmax(0,1fr); gap:12px; overflow:visible;
}
body.bricks-is-frontend #brx-content .lo-benefit-grid > .benefit-cta {
 width:100%; max-width:none; justify-self:stretch; align-self:stretch;
 /* Bricks containers inherit a column direction, so state the row explicitly
    before aligning. Stretched links keep the label beside its own circle. */
 flex-direction:row; align-items:center; justify-content:flex-start;
}
body.bricks-is-frontend #brx-content .lo-benefit-grid > .benefit-cta .benefit-cta__text {
 width:auto; flex:0 0 auto; text-align:left;
}
@media(min-width:600px){
 body.bricks-is-frontend #brx-content .lo-benefit-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
}
@media(min-width:1024px){
 body.bricks-is-frontend #brx-content .lo-benefit-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
}
/* Six links at their natural widths need about 1230px plus gaps and gutters. */
@media(min-width:1400px){
 body.bricks-is-frontend #brx-content .lo-benefit-grid {
  display:flex; flex-direction:row; flex-wrap:nowrap; justify-content:space-between; gap:24px;
 }
 body.bricks-is-frontend #brx-content .lo-benefit-grid > .benefit-cta { width:max-content; flex:0 0 auto; }
}

/* Shared spacing for the homepage and membership layouts. */
:root { --lo-page-inset:clamp(24px,4vw,64px); --lo-page-gap:clamp(32px,4vw,64px); --lo-section-space:clamp(56px,6vw,96px); }
@media(max-width:767px){:root { --lo-page-inset:24px; --lo-page-gap:32px; --lo-section-space:56px; }}
@media(max-width:359px){:root { --lo-page-inset:20px; }}