/* ==========================================================================
   SODION — Components
   Reusable UI components: product card, marquee, mineral strip, steps,
   benefits, team tabs, FAQ accordion, product gallery, cart, buttons.
   ========================================================================== */

/* Marquee scroll */
.marquee-wrap{background:#0a0a0a;overflow:hidden;padding:28px 0;border-top:1px solid #1a1a1a;border-bottom:1px solid #1a1a1a;}
.marquee-track{display:flex;width:max-content;white-space:nowrap;}
.marquee-content{display:flex;align-items:center;flex-shrink:0;}
.marquee-content span{font-family:var(--font-main);font-weight:700;text-transform:uppercase;font-size:48px;letter-spacing:0.02em;margin-right:40px;}
.marquee-content span.fill{color:#ffffff;}
.marquee-content span.outline{color:transparent;-webkit-text-stroke:1px rgba(255, 255, 255, 0.5);}
.marquee-content span.dash{color:#ffffff;font-weight:400;}

/* Product cards */
.home-product-cards{display:flex;}
.product-card{display:flex;flex-direction:column;background:#000;padding:40px 24px;max-width:400px;border:2px solid #18181B;margin-top:40px;flex:1;}
.product-card__top{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px;}
.product-card__label{font-size:13px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;}
.product-card__weight{color:#58585D;font-size:13px;letter-spacing:0.05em;}
.product-card__image{display:flex;justify-content:center;margin-bottom:32px;}
.product-card__image img{width:100%;max-width:220px;height:auto;}
.product-card__body{display:flex;flex-direction:column;margin-bottom:24px;}
.product-card__title{color:#fff;font-size:28px;font-weight:800;text-transform:uppercase;letter-spacing:-0.01em;margin:0 0 8px 0;}
.product-card__flavor{font-size:13px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;margin:0 0 16px 0;font-family:var(--menu-font);}
.product-card__desc{color:#58585D;font-size:15px;line-height:1.6;margin:0;}
.product-card__specs{display:flex;flex-direction:column;margin-bottom:24px;}
.spec-row{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid #262626;}
.spec-row:first-child{border-top:1px solid #262626;font-family:var(--menu-font);}
.spec-label{color:#58585D;font-size:14px;letter-spacing:0.05em;text-transform:uppercase;}
.spec-value{color:#fff;font-size:14px;letter-spacing:0.03em;text-transform:uppercase;}
.product-card__cta{background:transparent;border:1px solid #fff;color:#fff;padding:18px 24px;font-size:14px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;cursor:pointer;transition:background 0.2s ease, color 0.2s ease;}
.product-card__cta:hover{background:#fff;color:#000;}

/* Mineral strip */
.mineral-strip{display:flex;border-top:1px solid #333;border-bottom:2px solid #18181B;background:#000;margin-top:50px;}
.mineral-item{flex:1;display:flex;flex-direction:column;padding:40px 48px;border-left:2px solid #18181B;}
.mineral-item:first-child{border-left:none;}
.mineral-symbol{color:#fff;font-size:56px;font-weight:800;text-transform:uppercase;line-height:1;margin-bottom:24px;font-family:var(--heading-font);position:relative;align-self:flex-start;}
.mineral-symbol sup{color:#e8302a;font-size:24px;font-weight:400;font-family:var(--heading-font);position:absolute;top:0;left:100%;}
.mineral-desc{color:#C9C8C4;font-size:18px;font-weight:800;line-height:1.3;margin:0;text-transform:uppercase;font-family:var(--heading-font);}
.mineral-desc strong{color:#fff;}
.section-devider{width:100%;height:1px;background:#58585D;display:block;}

/* Steps list */
.steps-list{display:flex;flex-direction:column;max-width:700px;}
.step-row{display:flex;gap:40px;padding:24px 0;border-bottom:1px solid #C9C8C4;}
.step-number{flex-shrink:0;width:100px;color:var(--primary-color);font-family:var(--menu-font);font-size:16px;letter-spacing:0.05em;text-transform:uppercase;padding-top:6px;}
.step-content{display:flex;flex-direction:column;}
.step-title{color:var(--black-color);font-size:28px;font-weight:800;text-transform:uppercase;margin:0;font-family:var(--heading-font);}
.step-desc{color:#58585D;font-size:17px;line-height:1.6;margin:0;max-width:480px;}

/* Benefit strip */
.benefit-strip{display:flex;border:1px solid #C9C8C4;margin-top:64px;}
.benefit-item{flex:1;display:flex;flex-direction:column;padding:24px 16px;border-left:1px solid #C9C8C4;}
.benefit-item:first-child{border-left:none;}
.benefit-icon{color:#e8302a;font-size:32px;margin-bottom:20px;}
.benefit-title{color:var(--black-color);font-size:20px;font-weight:800;text-transform:uppercase;line-height:1.3;margin:0 0 12px 0;font-family:var(--heading-font);}
.benefit-desc{color:#58585D;font-size:16px;line-height:1.6;margin:0;}
.benefit-item img{height:50px;width:auto;align-self:flex-start;margin-bottom:8px;}

/* Team tabs */
.team-tabs{display:flex;flex-direction:column;margin-top:60px;}
.team-tabs__images{display:flex;gap:4px;margin-bottom:24px;}
.team-tabs__image{flex:1;cursor:pointer;overflow:hidden;opacity:0.5;transition:opacity 0.3s ease;}
.team-tabs__image.active{opacity:1;}
.team-tabs__image:hover{opacity:0.8;}
.team-tabs__image img{width:100%;display:block;}
.team-tabs__content{position:relative;}
.team-tabs__panel{display:none;flex-direction:column;}
.team-tabs__panel .section-devider{background-color:#C9C8C4;margin-block:16px;margin-top:24px;}
.team-tabs__panel.active{display:flex;}
.team-tabs__quote{color:#C9C8C4;font-size:24px;line-height:1.7;}
.team-tabs__name{color:var(--white-color);font-size:28px;font-weight:800;text-transform:uppercase;font-family:var(--heading-font);}
.team-tabs__role{color:var(--primary-color);font-size:16px;text-transform:uppercase;font-family:var(--menu-font);}
.team-tabs__quote+.team-tabs__quote{margin-top:16px;}

/* FAQ accordion */
.faq-list{display:flex;flex-direction:column;background:#000;border-top:1px solid #333;margin-top:40px;}
.faq-item{border-bottom:1px solid #333;}
.faq-question{display:flex;justify-content:space-between;align-items:center;padding:20px 0;cursor:pointer;}
.faq-question h3{color:#fff;font-size:28px;font-weight:800;text-transform:uppercase;margin:0;}
.faq-icon{color:var(--primary-color);font-size:24px;font-weight:700;flex-shrink:0;margin-left:24px;font-family:var(--heading-font);}
.faq-answer{max-height:0;overflow:hidden;transition:max-height 0.35s ease;}
.faq-answer p{color:#C9C8C4;font-size:16px;line-height:1.7;padding-bottom: 16px;}
.faq-item.active .faq-answer{max-height:initial;}
.faq-answer img{max-width: 300px;}

/* Main CTA */
.main-cta-wrap{background:#18181B;padding:100px;margin-top:60px;}
.main-cta-wrap .section-head{flex-direction:column;gap:0;}
.main-cta-wrap .section-head .site-head-desc{max-width:630px;margin:auto;font-size:24px;margin-block:30px;}
.site-btn-group{display:flex;gap:16px;justify-content:center;}
.site-btn-group a{padding:16px 36px;font-size:16px;font-weight:700;font-family:var(--menu-font);transition:all .3s;}
.btn-solid{background:var(--white-color);color:var(--black-color);}
.btn-solid:hover{background:var(--primary-color);color:var(--white-color);}
.btn-outline{border:2px solid var(--white-color);color:var(--white-color);}
.btn-outline:hover{background:var(--white-color);color:var(--black-color);}

/* Product gallery (Swiper) */
.product-gallery{display:flex;flex-direction:column;gap:16px;max-width:480px;}
.product-gallery__main{width:100%;background:#000;}
.product-gallery__main .swiper-slide{display:flex;justify-content:center;align-items:center;}
.product-gallery__main img{width:100%;height:auto;object-fit:contain;}
.product-gallery__thumbs{width:100%;}
.product-gallery__thumbs .swiper-slide{width:90px;opacity:0.5;cursor:pointer;transition:opacity 0.25s ease, border-color 0.25s ease;border:1px solid transparent;}
.product-gallery__thumbs .swiper-slide-thumb-active{opacity:1;border-color:transparent;}
.product-gallery__thumbs img{width:100%;height:100%;object-fit:cover;display:block;}

/* Product detail page */
.product-detail-wrap{display:flex;gap:60px;}
.product-detail-wrap .faq-list{margin-top:0;}
.product-details .section-head{flex-direction:column;gap:10px;}
.product-details h2{font-size:100px;}
.product-details h3{font-size:44px;}
.product-details h2,.product-details h3{font-family:var(--heading-font);text-transform:uppercase;line-height:1;font-weight:800;}
.product-details .body-text{color:#C9C8C4;font-size:16px;margin-top:30px;}
.product-caption{font-size:16px;color:#58585D;font-family:var(--menu-font);margin-top:10px;margin-bottom:40px;}
.price-qty-row{display:flex;align-items:center;gap:40px;margin-block:16px;}
.price{color:var(--white-color);font-size:64px;font-weight:800;line-height:1;font-family:var(--heading-font);}
.qty-selector{display:flex;align-items:center;justify-content:space-between;gap:24px;border:1px solid #444;padding:12px 20px;min-width:150px;}
.qty-btn{background:transparent;border:none;color:var(--white-color);font-size:20px;cursor:pointer;padding:0;line-height:1;}
.qty-value{color:var(--white-color);font-size:18px;font-family:var(--menu-font);}
.product-details .faq-item h3{font-size:28px;}
.spec-grid{display:flex;flex-wrap:wrap;background:#000;border-top:1px solid #18181B;border-left:1px solid #18181B;margin-top:60px;}
.spec-cell{display:flex;flex-direction:column;width:33.333%;padding:16px 24px;border-right:1px solid #18181B;border-bottom:1px solid #18181B;box-sizing:border-box;}
.spec-cell__label{color:#58585D;font-size:16px;font-family:var(--menu-font);letter-spacing:0.05em;text-transform:uppercase;}
.spec-cell__value{color:#fff;font-size:28px;font-weight:800;text-transform:uppercase;font-family:var(--heading-font);}
.product-full-media{width:100%;display:block;margin-top:60px;}

/* Cart page */
.cart-page{display:flex;gap:40px;padding:40px 0;align-items:flex-start;}
.cart-items{display:flex;flex-direction:column;flex:1.6;}
.order-summary{display:flex;flex-direction:column;flex:1;border:1px solid #58585D;padding:32px;position:sticky;top:40px;background:#18181B80;}
.cart-item{display:flex;gap:30px;padding:28px 30px;border-left:3px solid var(--primary-color);}
.cart-item__image{flex-shrink:0;width:85px;}
.cart-item__details{display:flex;flex-direction:column;flex:1;gap:6px;}
.cart-item__edition{color:var(--primary-color);font-size:12px;letter-spacing:0.08em;text-transform:uppercase;font-family:var(--menu-font);}
.cart-item__title{color:#fff;font-size:24px;font-weight:800;text-transform:uppercase;margin:0;}
.cart-item__meta{color:#58585D;font-size:16px;margin:0 0 8px 0;}
.cart-item__controls{display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
.cart-item__variant{display:flex;align-items:center;gap:8px;background:#151515;border:1px solid #58585D;padding:12px 16px;color:#fff;font-size:13px;letter-spacing:0.03em;cursor:pointer;}
/* NOTE: .qty-selector/.qty-btn/.qty-value are intentionally redefined here,
   unscoped, matching the static build's single-stylesheet cascade — this
   second definition overrides the PDP one earlier in this file on every
   page since both rules are global. Preserved as-is; do not scope without
   confirming the PDP is supposed to look different from this. */
.qty-selector{display:flex;align-items:center;gap:16px;background:#151515;border:1px solid #58585D;padding:10px 18px;}
.qty-btn{background:transparent;border:none;color:#fff;font-size:16px;cursor:pointer;}
.qty-value{color:#fff;font-size:14px;font-family:var(--menu-font);}
.cart-item__controls .qty-selector{min-width:110px;}
.cart-item__remove{background:transparent;border:none;color:#666;font-size:12px !important;text-transform:uppercase;cursor:pointer;font-family: var(--menu-font);}
.woocommerce a.remove{font-weight: 400;color: #58585D !important; width: initial;}
.woocommerce a.remove:hover{background: transparent;}
.cart-item__price{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex-shrink:0;}
.price-main{color:#fff;font-size:26px;font-weight:800;}
.price-sub{color:#666;font-size:13px;}

.shipping-progress{display:flex;flex-direction:column;gap:16px;border:1px solid #58585D;padding:32px;margin-top:32px;display: none;}
.shipping-progress__row{display:flex;justify-content:space-between;color:#888;font-size:14px;letter-spacing:0.03em;text-transform:uppercase;font-family:var(--menu-font);}
.shipping-progress__status{color:#fff;}
.shipping-progress__bar{width:100%;height:4px;background:#58585D;}
.shipping-progress__fill{height:100%;background:#2ecc71;}

.add-another{display:flex;flex-direction:column;gap:20px;margin-top:48px;}
.add-another__title{color:#fff;font-size:26px;font-weight:800;text-transform:uppercase;margin:0;padding-bottom:20px;border-bottom:1px solid #58585D;}
.add-another__item{display:flex;gap:30px;}
.add-another__image{flex-shrink:0;width:85px;}
.add-another__details{display:flex;flex-direction:column;gap:4px;}
.add-to-cart-link{background:transparent;border:none;border-bottom:1px solid #e8302a;color:#e8302a;font-size:13px;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;padding:0 0 4px 0;margin-top:8px;cursor:pointer;width:fit-content;}

.order-summary__title{color:#fff;font-size:26px;font-weight:800;text-transform:uppercase;margin:0 0 24px 0;padding-bottom:20px;border-bottom:1px solid #58585D;}
.order-summary__row{display:flex;justify-content:space-between;color:#999;font-size:14px;text-transform:uppercase;padding:14px 0;font-family:var(--menu-font);}
.order-summary__row span:last-child{color:#fff;}

.promo-row{display:flex;gap:12px;margin:20px 0 !important; padding: 0 !important;}
.promo-input{flex:1;background:var(--black-color);border:1px solid #18181B;color:#fff;padding:16px;font-size:13px;letter-spacing:0.05em;text-transform:uppercase;}
.promo-input::placeholder{color:#666;}
.promo-apply{background:#fff;border:none;color:#000;padding:16px 24px;font-size:13px;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;cursor:pointer;}

.order-summary__total{display:flex;flex-direction:column;gap:8px;padding:20px 0;border-top:1px solid #58585D;margin-bottom:24px;font-family:var(--menu-font);}
.order-summary__total-row{display:flex;justify-content:space-between;color:#fff;font-size:14px;text-transform:uppercase;}
.order-summary__total-row span+span{font-weight:800;font-size:22px;font-family:var(--heading-font);}
.order-summary__note{color:#666;font-size:12px;letter-spacing:0.03em;text-transform:uppercase;margin:0;}

.btn-primary{background:#fff;border:none;color:#000;padding:20px;font-size:15px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;cursor:pointer;margin-bottom:12px;}
.btn-outline{background:transparent;border:1px solid #fff;color:#fff;padding:20px;font-size:15px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;cursor:pointer;}

.order-summary__trust{display:flex;flex-direction:column;gap:16px;margin-top:28px;padding-top:24px;border-top:1px solid #58585D;}
.order-summary__trust p{color:#58585D;text-transform:uppercase;margin:0;font-family:var(--menu-font);font-size:14px;}

.postid-25 .faq-icon{color: var(--yellow-color);}
.postid-24 .faq-icon{color: var(--secondary-color);}

/* ============ Component responsive rules ============ */
@media screen and (max-width:1000px){
.benefit-strip{margin-top:0;flex-wrap:wrap;}
.benefit-item{flex:0 0 50%;border:none;}
.home-product-cards,.mineral-strip{flex-direction:column;align-items:center;}
}

@media screen and (max-width:767px){
.home-product-cards,.mineral-strip{flex-direction:column;}
.product-card{margin-top:0;}
.mineral-item{border-top:2px solid #18181B;border-left:none;padding:24px 32px;}
.mineral-item:first-child{border-top:none;}
.mineral-symbol{font-size:35px;}
.mineral-symbol sup{font-size:18px;}
.mineral-desc{font-size:14px;}
.marquee-content span{font-size:24px;}
.marquee-wrap{padding:16px 0;}
.step-row,.benefit-strip{gap:0;flex-direction:column;}
.step-title{font-size:20px;}
.step-desc,.benefit-desc{font-size:14px;line-height:1.4;}
.benefit-strip{margin-top:34px;}
.benefit-item{border-top:1px solid #C9C8C4;border-left:none;}
.benefit-item:first-child{border-top:none;}
.step-number{padding:0;}
.benefit-title br{display:none;}
.team-tabs__quote,.main-cta-wrap .section-head .site-head-desc{font-size:16px;line-height: 1.5;}
.team-tabs__name{font-size:20px;}
.team-tabs__role{font-size:14px;}
.faq-question h3{font-size:18px;}
.main-cta-wrap{padding:40px 20px;margin-top:30px;}
.main-cta-wrap .section-head .site-head-desc{margin-block:20px;}
.site-btn-group{flex-direction:column;width:100%;}
.site-btn-group a{text-align:center;padding:10px 20px;font-size:16px;}
.product-details h2{font-size:65px;}
.product-details h3{font-size:20px;}
.product-details h3 br{display:none;}
.product-details .head-caption{font-size:12px;}
.product-details .site-btn{width:100%;text-align:center;padding:12px;}
.price{font-size:40px;}
.qty-selector{padding:10px 15px;}
.price-qty-row{width:100%;justify-content:space-between;}
.product-details .faq-item h3,.spec-cell__value{font-size:20px;}
.faq-answer p{font-size:14px;}
.spec-cell{flex:0 0 50%;padding:12px;}
.spec-cell__label{font-size:12px;}
.product-gallery{max-width:280px;width:100%;}
.cart-item__image,.add-another__image{width:52px;}
.price-qty-row{gap: 20px;}
.product-caption{font-size: 14px;}
.site-nav{z-index: 9;background: #000 !important;}
.spec-value{font-size: 12px;}
.product-card{padding: 20px 16px;}
.footer-top .flex.justify-between{flex-wrap: wrap;gap: 30px;}
.product-details .body-text{margin-top: 10px;}
.site-section:has(.product-detail-wrap){padding-top: 0;}
}

@media (max-width:900px){
.cart-page{flex-direction:column;}
.order-summary{position:static;width:100%;}
.cart-item{flex-wrap:wrap;padding:16px;}
.cart-item__price{align-items:flex-start;width:100%;flex-direction:row;justify-content:space-between;margin-top:12px;}
}

@media (max-width:600px){
.cart-item__controls{flex-direction:column;align-items:stretch;}
}