/*
Theme Name: astra_2
Version: 4.3
Description: A child theme of Astra
Template: astra
Author: Administrator
*/

/* Parent theme styles are enqueued via functions.php — never @import them here. */

/* ============================================================
   1. DESIGN TOKENS
   ============================================================ */
:root{
  --ink:#0f1115; --ink-soft:#1b1f26; --text:#4b525c; --muted:#8b929c;
  --line:#e6e8ec; --surface:#f6f7f9; --white:#ffffff;
  --accent:#ff5a1f; --accent-dark:#e04a12; --accent-soft:rgba(255,90,31,.10);
  --success:#1f9d55; --radius-sm:6px; --radius:12px; --radius-lg:20px;
  --shadow-sm:0 2px 8px rgba(15,17,21,.06); --shadow:0 10px 30px rgba(15,17,21,.08);
  --shadow-lg:0 24px 60px rgba(15,17,21,.14); --container:1200px; --space: 10px;
  --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --ease:.28s cubic-bezier(.4,0,.2,1);
}

/* ============================================================
   2. BASE / RESET
   ============================================================ */
*, *::before, *::after{ box-sizing:border-box; }
body{ font-family:var(--font); color:var(--text); background:var(--white); line-height:1.7; font-size:1rem; -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4,h5,h6{ color:var(--ink); line-height:1.2; font-weight:800; margin:0 0 .5em; letter-spacing:-.02em; }
p{ margin:0 0 1.2em; }
a{ color:inherit; text-decoration:none; transition:color var(--ease); }
img{ max-width:100%; display:block; }
ul{ margin:0; padding:0; list-style:none; }
:focus-visible{ outline:3px solid var(--accent); outline-offset:3px; border-radius:4px; }

/* ============================================================
   3. LAYOUT UTILITIES
   ============================================================ */
.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:24px; }
.section{ padding-block: var(--space); margin: 0 !important; }
.section-alt{ background:var(--surface); margin-inline:0; border-radius:0; }
.section-dark{ background:var(--ink); margin-inline:0; border-radius:0; }
.shortcode-area{ margin-bottom:8px; }
.section-foot{ margin-top:48px; text-align:center; }

/* ============================================================
   4. SECTION HEADINGS
   ============================================================ */
.eyebrow{ display:inline-block; font-size:.78rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--accent); margin-bottom:14px; }
.eyebrow-light{ color:var(--accent); }
.section-head{ max-width:680px; margin:0 auto 40px; text-align:center; }
.section-title{ font-size: clamp(1.2rem, 2.5vw, 1.9rem); margin-bottom:16px; }
.section-sub{ font-size:1.08rem; color:var(--muted); margin:0; }
.section-head-light .section-title{ color:var(--white); }
.section-head-light .section-sub{ color:rgba(255,255,255,.65); }

/* ============================================================
   5. BUTTONS (UNIFIED ORANGE-RED)
   ============================================================ */
.btn, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce ul.products li.product .button, .woocommerce ul.products li.product .add_to_cart_button {
    display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
    padding: 13px 30px !important; background: var(--accent) !important; color: #ffffff !important;
    border: 2px solid var(--accent) !important; border-radius: var(--radius-sm) !important;
    font-family: var(--font) !important; font-size: 0.92rem !important; font-weight: 700 !important;
    letter-spacing: 0.06em !important; text-transform: uppercase !important; cursor: pointer !important;
    text-decoration: none !important; transition: all var(--ease) !important;
}
.btn:hover, .woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover, .woocommerce ul.products li.product .button:hover, .woocommerce ul.products li.product .add_to_cart_button:hover {
    background: var(--accent-dark) !important; border-color: var(--accent-dark) !important; color: #ffffff !important;
    transform: translateY(-2px) !important; box-shadow: 0 12px 26px rgba(255,90,31,.32) !important;
}
.btn-lg { padding: 16px 38px !important; font-size: 1rem !important; }
.btn-ghost, .btn-outline { background: transparent !important; color: var(--accent) !important; border-color: var(--accent) !important; }
.btn-ghost:hover, .btn-outline:hover { background: var(--accent) !important; color: #ffffff !important; }

/* ============================================================
   6. HERO
   ============================================================ */
.hero{ position: relative; isolation: isolate; min-height: 320px; display: flex; align-items: center; justify-content: center; padding: 20px 10px !important; overflow: hidden; background: #0a0c10; margin: 0 !important; }
.hero-overlay{ position: absolute; inset: 0; background: linear-gradient(135deg, rgba(10,12,16,0.92) 0%, rgba(10,12,16,0.85) 50%, rgba(10,12,16,0.9) 100%); z-index: 1; }
.hero-inner{ position: relative; z-index: 2; text-align: center; max-width: 1000px; margin: 0 auto; width: 100%; }
.hero-content{ animation: fadeInUp .8s ease-out; }
@keyframes fadeInUp{ from{ opacity: 0; transform: translateY(20px); } to{ opacity: 1; transform: translateY(0); } }
.hero-eyebrow{ display: inline-flex; align-items: center; gap: 8px; padding: 6px 16px; border: 1px solid rgba(255,90,31,.4); background: rgba(255,90,31,.08); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-radius: 100px; color: #ffb596; font-size: .7rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 12px; box-shadow: 0 4px 20px rgba(255,90,31,.15); }
.eyebrow-dot{ width: 6px; height: 6px; border-radius: 50%; background: #ff5a1f; box-shadow: 0 0 10px #ff5a1f; animation: pulse 2s ease-in-out infinite; }
@keyframes pulse{ 0%,100%{ opacity: 1; transform: scale(1); } 50%{ opacity: .6; transform: scale(1.1); } }
.hero-title{ font-size: clamp(1.2rem, 2.5vw, 1.9rem); line-height: 1.15; color: #ffffff; margin-bottom: 12px; margin-top: 20px; font-weight: 900; letter-spacing: -.03em; }
.hero-title-accent{ display: inline-block; background: linear-gradient(135deg,#ff5a1f 0%,#ff9a3c 50%,#ffb596 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; position: relative; }
.hero-title-accent::after{ content: ""; position: absolute; bottom: -4px; left: 0; right: 0; background: linear-gradient(90deg,#ff5a1f,#ff9a3c); opacity: .8; }
.hero-sub{ max-width: 1200px; margin: 0 auto 16px; font-size: clamp(0.9rem, 1.6vw, 1.05rem); line-height: 1.5; color: rgba(255,255,255,.8); }
.hero-actions{ display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-bottom: 10px; }
.hero-actions .btn{ min-width: 180px; padding: 5px 24px; font-weight: 700; }
.hero-trust{ display:flex; flex-wrap:nowrap; gap:35px; justify-content:center; padding:35px 45px; background:rgba(255,255,255,.04); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border:1px solid rgba(255,255,255,.1); border-radius:16px; max-width:950px; margin:0 auto; }
.hero-trust li{ display:flex; align-items:center; gap:12px; font-size:.95rem; color:rgba(255,255,255,.85); font-weight:500; white-space:nowrap; }
.tick{ display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:#1f9d55; color:#fff; flex-shrink:0; box-shadow:0 2px 10px rgba(31,157,85,.4); }

/* ============================================================
   7. CERTIFICATION STRIP
   ============================================================ */
.cert-strip{ background:var(--white); border-bottom:1px solid var(--line); padding: 20px 0; margin: 0 !important; }
.cert-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:28px; text-align:center; }
.cert-item{ display:flex; flex-direction:column; align-items:center; gap:8px; }
.cert-mark{ font-size:1.35rem; font-weight:900; letter-spacing:.08em; color:var(--ink); }
.cert-text{ font-size:.83rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }

/* ============================================================
   8. WOOCOMMERCE PRODUCT & CATEGORY GRIDS (UNIFIED DESIGN)
   ============================================================ */
.woocommerce ul.products, ul.products {
    display: grid !important; grid-template-columns: repeat(auto-fill, minmax(258px, 1fr)) !important;
    gap: 28px !important; width: 100% !important; margin: 0 !important; padding: 0 !important; list-style: none !important;
}

.woocommerce ul.products li.product, .woocommerce ul.products li.product-category,
ul.products li.product, ul.products li.product-category {
    display: flex !important; flex-direction: column !important; align-items: center !important; text-align: center !important;
    width: 100% !important; margin: 0 !important; padding: 0 !important; background: transparent !important;
    border: none !important; border-radius: 0 !important; overflow: visible !important; position: relative !important; transition: transform var(--ease) !important;
}

.woocommerce ul.products li.product:hover, .woocommerce ul.products li.product-category:hover,
ul.products li.product:hover, ul.products li.product-category:hover { transform: translateY(-6px) !important; }

/* The White Box: Wraps content for BOTH products and categories */
.woocommerce ul.products li.product > a.woocommerce-LoopProduct-link,
.woocommerce ul.products li.product > a:first-child,
.woocommerce ul.products li.product-category > a,
ul.products li.product > a.woocommerce-LoopProduct-link,
ul.products li.product > a:first-child,
ul.products li.product-category > a {
    display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: flex-start !important;
    width: 100% !important; background: #ffffff !important; border-radius: 12px !important; padding: 20px !important;
    box-sizing: border-box !important; text-decoration: none !important; box-shadow: var(--shadow-sm) !important;
    transition: box-shadow var(--ease) !important; height: 100% !important;
}

.woocommerce ul.products li.product:hover > a.woocommerce-LoopProduct-link,
.woocommerce ul.products li.product:hover > a:first-child,
.woocommerce ul.products li.product-category:hover > a,
ul.products li.product:hover > a.woocommerce-LoopProduct-link,
ul.products li.product:hover > a:first-child,
ul.products li.product-category:hover > a { box-shadow: var(--shadow) !important; }

/* Images for both */
.woocommerce ul.products li.product img, .woocommerce ul.products li.product-category img,
ul.products li.product img, ul.products li.product-category img {
    max-height: 150px !important; width: auto !important; object-fit: contain !important;
    display: block !important; margin: 0 auto 15px auto !important; transition: transform .5s cubic-bezier(.4,0,.2,1) !important;
}
.woocommerce ul.products li.product:hover img, .woocommerce ul.products li.product-category:hover img,
ul.products li.product:hover img, ul.products li.product-category:hover img { transform: scale(1.05) !important; }

/* Titles for both */
.woocommerce ul.products li.product .woocommerce-loop-product__title, .woocommerce ul.products li.product h2, .woocommerce ul.products li.product h3,
.woocommerce ul.products li.product-category h2, .woocommerce ul.products li.product-category h2 a,
ul.products li.product .woocommerce-loop-product__title, ul.products li.product h2, ul.products li.product h3,
ul.products li.product-category h2, ul.products li.product-category h2 a {
    font-size: 15px !important; font-weight: 600 !important; color: var(--ink) !important; margin: 0 !important;
    line-height: 1.3 !important; padding: 0 !important; display: block !important; width: 100% !important; text-decoration: none !important;
}

/* Price (Products) and Count (Categories) */
.woocommerce ul.products li.product .price, .woocommerce ul.products li.product-category .count,
ul.products li.product .price, ul.products li.product-category .count {
    font-size: 15px !important; font-weight: 700 !important; color: var(--accent) !important;
    margin: 5px 0 0 !important; display: block !important; width: 100% !important; padding: 0 !important;
}
.woocommerce ul.products li.product-category .count, ul.products li.product-category .count {
    font-size: 13px !important; font-weight: 500 !important; color: var(--muted) !important;
    text-transform: uppercase !important; letter-spacing: 0.05em !important;
}

/* Star Rating */
.woocommerce ul.products li.product .star-rating, ul.products li.product .star-rating {
    float: none !important; margin: 0 auto 10px !important; font-size: .85em !important; color: #f5a623 !important;
}

/* Hide default Add to Cart */
.woocommerce ul.products li.product .button, .woocommerce ul.products li.product .add_to_cart_button,
ul.products li.product .button, ul.products li.product .add_to_cart_button { display: none !important; }

/* Sale Badge */
.woocommerce span.onsale, span.onsale {
    position: absolute; top: 14px; left: 14px; z-index: 3; min-width: 0 !important; min-height: 0 !important;
    line-height: 1 !important; padding: 7px 14px !important; margin: 0 !important; background: var(--accent) !important;
    color: #ffffff !important; border-radius: 100px !important; font-size: .72rem !important; font-weight: 800 !important;
    letter-spacing: .08em !important; text-transform: uppercase !important;
}

/* Dark Section Text Overrides */
.hero-attached-dark .woocommerce ul.products li.product .woocommerce-loop-product__title,
.hero-attached-dark .woocommerce ul.products li.product h2, .hero-attached-dark .woocommerce ul.products li.product h3,
.hero-attached-dark .woocommerce ul.products li.product-category h2, .hero-attached-dark .woocommerce ul.products li.product-category h2 a { color: #ffffff !important; }
.hero-attached-dark .woocommerce ul.products li.product-category .count { color: rgba(255,255,255,0.7) !important; }

/* ============================================================
   9. SPLIT / BRAND STORY
   ============================================================ */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,80px); align-items:center; }
.split-media{ position:relative; }
.split-image{ width: 100% !important; aspect-ratio: 4/5 !important; border-radius: var(--radius-lg) !important; box-shadow: var(--shadow-lg) !important; background-color: #1a1f2a !important; background-position: center !important; background-size: cover !important; background-repeat: no-repeat !important; }
.home-page .split-image { background-image: url('https://steroidslabs.com/wp-content/uploads/2026/10/home-split-image.jpg') !important; }
.about-page .split-image { background-image: url('https://steroidslabs.com/wp-content/uploads/2026/10/split-image.webp') !important; }
.split-badge{ position:absolute; bottom:-26px; right:-16px; display:flex; align-items:center; gap:14px; padding:20px 26px; background:var(--accent); color:var(--white); border-radius:var(--radius); box-shadow:0 14px 34px rgba(255,90,31,.35); }
.split-badge-num{ font-size:2.1rem; font-weight:900; line-height:1; }
.split-badge-label{ font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; line-height:1.4; }
.split-title{ font-size: clamp(1.2rem, 2.5vw, 1.9rem); margin-bottom:20px; }
.split-lead{ font-size:1.08rem; color:var(--text); margin-bottom:32px; }
.check-list{ margin-bottom:36px; }
.check-list li{ display:flex; gap:16px; margin-bottom:22px; }
.check{ flex-shrink:0; display:grid; place-items:center; width:28px; height:28px; margin-top:3px; border-radius:50%; background:var(--success); color:#fff; font-size:.8rem; font-weight:900; }
.about-page .check-list .check { background: var(--accent); font-size: 0.9rem; }
.check-list h4{ font-size:1.05rem; margin-bottom:4px; }
.check-list p{ margin:0; font-size:.94rem; color:var(--muted); }

/* ============================================================
   10. VALUE CARDS
   ============================================================ */
.value-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:26px; }
.value-card{ padding:38px 30px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); transition:transform var(--ease), box-shadow var(--ease), border-color var(--ease); }
.value-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow); border-color:transparent; }
.value-icon{ display:grid; place-items:center; width:62px; height:62px; margin-bottom:22px; border-radius:16px; background:var(--accent-soft); font-size:1.7rem; }
.value-card h3{ font-size:1.18rem; margin-bottom:10px; }
.value-card p{ margin:0; font-size:.95rem; color:var(--muted); }

/* ============================================================
   11. TESTIMONIALS
   ============================================================ */
.quote-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:26px; }
.quote-card{ margin:0; padding:36px 32px; background:var(--ink-soft); border:1px solid rgba(255,255,255,.08); border-radius:var(--radius); transition:transform var(--ease), border-color var(--ease); }
.quote-card:hover{ transform:translateY(-6px); border-color:rgba(255,90,31,.4); }
.quote-featured{ background:linear-gradient(150deg,#22272f,#171b21); border-color:rgba(255,90,31,.45); }
.quote-stars{ color:#f5a623; font-size:1rem; letter-spacing:2px; margin-bottom:18px; }
.quote-card blockquote{ margin:0 0 26px; font-size:1rem; line-height:1.75; color:rgba(255,255,255,.82); }
.quote-card figcaption{ display:flex; align-items:center; gap:14px; }
.quote-avatar{ display:grid; place-items:center; width:46px; height:46px; border-radius:50%; background:var(--accent); color:#fff; font-size:.85rem; font-weight:800; flex-shrink:0; }
.quote-card figcaption strong{ display:block; color:var(--white); font-size:.98rem; }
.quote-card figcaption span{ font-size:.82rem; color:rgba(255,255,255,.5); }

/* ============================================================
   12. FINAL CTA BANNER
   ============================================================ */
.cta-banner{ margin:0 !important; padding: 40px 0 !important; border-radius:0; background: radial-gradient(700px 320px at 15% 20%, rgba(255,90,31,.28), transparent 65%), linear-gradient(120deg,#ff5a1f 0%,#e04a12 100%); color:var(--white); }
.cta-inner{ display:flex; align-items:center; justify-content:space-between; gap:40px; flex-wrap:wrap; }
.cta-title{ font-size: clamp(1.2rem, 2.5vw, 1.9rem); color:var(--white); margin-bottom:10px; }
.cta-text{ margin:0; font-size:1.05rem; color:rgba(255,255,255,.85); max-width:520px; }
.cta-actions{ display:flex; gap:14px; flex-wrap:wrap; }
.cta-banner .btn-accent{ background:var(--white); color:var(--accent-dark); }
.cta-banner .btn-accent:hover{ background:var(--ink); color:var(--white); box-shadow:none; }
.cta-banner .btn-ghost{ border-color:rgba(255,255,255,.55); }
.cta-banner .btn-ghost:hover{ background:var(--white); color:var(--accent-dark); }

/* ============================================================
   13. RESPONSIVE
   ============================================================ */
@media (max-width:1024px){ .hero-trust{ flex-wrap:wrap; gap:25px; padding:30px 35px; } .hero-trust li{ font-size:.88rem; } }
@media (max-width:992px){ .split{ grid-template-columns:1fr; } .split-image{ aspect-ratio:16/10; } .split-badge{ right:16px; bottom:-22px; } }
@media (max-width:768px){
  .hero{ min-height:auto; padding: 40px 0 !important; } .hero-actions .btn, .cta-actions .btn{ width:100%; } .hero-actions, .cta-actions{ flex-direction:column; }
  .hero-trust{ flex-direction:column; align-items:flex-start; gap:15px; padding:25px; } .hero-trust li{ font-size:.85rem; width:100%; justify-content:center; }
  .cta-inner{ flex-direction:column; text-align:center; } .section-alt, .section-dark, .cta-banner{ margin-inline:0; border-radius:0; }
  .woocommerce ul.products, ul.products{ grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:18px !important; }
}
@media (max-width:520px){
  .woocommerce ul.products, ul.products{ grid-template-columns:1fr; } .cert-grid{ grid-template-columns:1fr 1fr; }
  .split-badge{ position:static; margin-top:16px; width:fit-content; } .hero-title{ font-size:2.4rem; }
}

/* ============================================================
   14. ACCESSIBILITY — REDUCED MOTION
   ============================================================ */
@media (prefers-reduced-motion:reduce){
  *, *::before, *::after{ animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
  .btn:hover, .value-card:hover, .quote-card:hover, .woocommerce ul.products li.product:hover{ transform:none !important; }
}

/* ============================================================
   15. PROFESSIONAL CUSTOM FOOTER
   ============================================================ */
.custom-professional-footer { background-color: var(--ink); color: var(--muted); padding-top: 40px; font-size: 0.95rem; line-height: 1.6; }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: 40px; padding-bottom: 40px; border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
.footer-logo { font-size: 1.8rem; font-weight: 900; color: var(--white); margin-bottom: 16px; letter-spacing: -0.02em; }
.text-accent { color: var(--accent); }
.footer-desc { margin-bottom: 24px; max-width: 300px; }
.footer-social { display: flex; gap: 16px; }
.footer-social a { display: grid; place-items: center; width: 40px; height: 40px; background: rgba(255, 255, 255, 0.05); border-radius: 50%; color: var(--white); transition: all var(--ease); }
.footer-social a:hover { background: var(--accent); color: var(--white); transform: translateY(-3px); }
.footer-heading { font-size: 1.1rem; font-weight: 700; color: var(--white); margin-bottom: 20px; text-transform: uppercase; letter-spacing: 0.05em; }
.footer-links { list-style: none; padding: 0; margin: 0; }
.footer-links li { margin-bottom: 12px; }
.footer-links a { color: var(--muted); text-decoration: none; transition: color var(--ease), padding-left var(--ease); }
.footer-links a:hover { color: var(--accent); padding-left: 5px; }
.footer-disclaimer { margin-top: 24px; padding: 16px; background: rgba(255, 255, 255, 0.03); border-radius: var(--radius-sm); border-left: 3px solid var(--accent); }
.footer-disclaimer p { margin: 0; font-size: 0.8rem; color: var(--muted); line-height: 1.5; }
.footer-bottom { padding: 24px 0; background-color: var(--ink-soft); }
.footer-bottom-inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px; }
.copyright { margin: 0; font-size: 0.9rem; color: var(--muted); }
.payment-methods { display: flex; gap: 12px; }
.payment-methods span { display: inline-flex; align-items: center; justify-content: center; padding: 6px 14px; background: var(--white); color: var(--ink); border-radius: 4px; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.02em; }
@media (max-width: 992px) { .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; } .footer-brand { grid-column: 1 / -1; } }
@media (max-width: 600px) { .footer-grid { grid-template-columns: 1fr; text-align: center; } .footer-desc { margin: 0 auto 24px; } .footer-social { justify-content: center; } .footer-links a:hover { padding-left: 0; } .footer-bottom-inner { flex-direction: column; text-align: center; } .footer-disclaimer { text-align: left; } }

/* ============================================================
   16. ASTRA SPECIFIC OVERRIDES & SINGLE PRODUCT FIX
   ============================================================ */
.ast-page-title-wrap, .entry-header, .page-header, .ast-single-post .entry-header { display: none !important; height: 0 !important; margin: 0 !important; padding: 0 !important; border: none !important; }
.site-content, #content, .content-area, .ast-container, .site-main { padding-top: 0 !important; margin-top: 0 !important; }
.hero, .about-hero, .contact-hero, .privacy-hero { margin-top: -100px !important; padding-top: 30px !important; position: relative; z-index: 10; }
body.home .site-content, body.home #content, body.home .content-container, body.home .site-main { padding-top: 0 !important; margin-top: 0 !important; }
.home-page { overflow-x: visible !important; width: 100% !important; max-width: 100% !important; margin-top: 0 !important; padding-top: 0 !important; }
.single-product .site-content, .single-product #content, .single-product .content-area, .single-product .site-main { padding-top: 10px !important; }
@media (max-width: 768px) { .single-product .site-content, .single-product #content { padding-top: 50px !important; } }
.single-product .ast-primary-header-bar, .single-product #ast-desktop-header, .single-product .site-header { background-color: #000000 !important; position: relative !important; }

/* ============================================================
   17. ABOUT PAGE SPECIFIC STYLES
   ============================================================ */
.about-hero { background: linear-gradient(135deg, rgba(15,17,21,0.92) 0%, rgba(27,31,38,0.85) 100%), url('https://steroidslabs.com/wp-content/uploads/2026/10/about-hero-image.webp') center/cover no-repeat; color: #ffffff; padding: 65px 0 !important; text-align: center; position: relative; overflow: hidden; margin: 0 !important; }
.about-hero::before { content: ""; position: absolute; top: -50%; left: 50%; transform: translateX(-50%); width: 800px; height: 800px; background: radial-gradient(circle, rgba(255,90,31,0.15) 0%, transparent 70%); z-index: 0; pointer-events: none; }
.about-hero .container { position: relative; z-index: 1; }
.about-hero-title { font-size: clamp(1.2rem, 2.5vw, 1.9rem); line-height: 1.1; color: #ffffff; margin-bottom: 24px; font-weight: 900; letter-spacing: -0.02em; }
.about-hero-sub { max-width: 1000px; margin: 0 auto; font-size: clamp(1rem, 2vw, 1.2rem); line-height: 1.7; color: rgba(255, 255, 255, 0.8); }

/* ============================================================
   18. CONTACT & PRIVACY PAGE SPECIFIC STYLES
   ============================================================ */
.contact-hero, .privacy-hero { background: linear-gradient(135deg, rgba(15,17,21,0.95) 0%, rgba(27,31,38,0.9) 100%), url('https://steroidslabs.com/wp-content/uploads/2026/10/privacy-hero-image.webp') center/cover no-repeat; color: #ffffff; padding: 65px 0 !important; text-align: center; position: relative; margin: 0 !important; }
.privacy-hero { background-image: linear-gradient(135deg, rgba(15,17,21,0.95) 0%, rgba(27,31,38,0.9) 100%), url('https://steroidslabs.com/wp-content/uploads/2026/10/privacy-hero-image.webp'); }
.page-hero-title { font-size: clamp(1.4rem, 3.5vw, 2.4rem); line-height: 1.1; color: #ffffff; margin-bottom: 16px; font-weight: 900; letter-spacing: -0.02em; }
.page-hero-sub { max-width: 1000px; margin: 0 auto; font-size: clamp(1rem, 2vw, 1.15rem); line-height: 1.6; color: rgba(255, 255, 255, 0.8); }
.contact-info-grid { display: flex; flex-direction: column; gap: 24px; }
.contact-info-card { display: flex; align-items: flex-start; gap: 20px; padding: 24px; background: var(--surface); border-radius: var(--radius); border: 1px solid var(--line); transition: transform var(--ease), box-shadow var(--ease); }
.contact-info-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.contact-icon { display: grid; place-items: center; width: 48px; height: 48px; background: var(--accent-soft); color: var(--accent); border-radius: 12px; font-size: 1.4rem; flex-shrink: 0; }
.contact-details h4 { font-size: 1.1rem; margin-bottom: 6px; color: var(--ink); }
.contact-details p, .contact-details a { margin: 0; color: var(--text); font-size: 0.95rem; line-height: 1.6; }
.contact-details a:hover { color: var(--accent); }
.contact-form-wrapper { background: var(--white); padding: 40px; border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); border: 1px solid var(--line); }
.contact-form-wrapper h3 { font-size: 1.5rem; margin-bottom: 8px; }
.contact-form-wrapper > p { color: var(--muted); margin-bottom: 30px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; }
.form-group { display: flex; flex-direction: column; margin-bottom: 20px; }
.form-group label { font-size: 0.9rem; font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.form-control { width: 100%; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--radius-sm); font-family: var(--font); font-size: 1rem; color: var(--ink); background: var(--white); transition: border-color var(--ease), box-shadow var(--ease); }
.form-control:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
textarea.form-control { resize: vertical; min-height: 140px; }
.privacy-content { max-width: 800px; margin: 0 auto; color: var(--text); line-height: 1.8; }
.privacy-content h2 { font-size: clamp(1.2rem, 2.5vw, 1.9rem); color: var(--ink); margin-top: 50px; margin-bottom: 20px; padding-bottom: 10px; border-bottom: 2px solid var(--line); }
.privacy-content h2:first-child { margin-top: 0; }
.privacy-content h3 { font-size: 1.3rem; color: var(--ink); margin-top: 30px; margin-bottom: 15px; }
.privacy-content p { margin-bottom: 20px; }
.privacy-content ul, .privacy-content ol { margin-bottom: 20px; padding-left: 24px; }
.privacy-content li { margin-bottom: 10px; list-style-type: disc; }
.privacy-content ol li { list-style-type: decimal; }
.privacy-content a { color: var(--accent); text-decoration: underline; }

/* ============================================================
   19. HERO TRUST STRIP ALIGNMENT FIX
   ============================================================ */
.hero-trust-strip { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; align-items: center !important; gap: 30px !important; margin: 20px auto 0 !important; padding: 15px 20px !important; background: rgba(255, 255, 255, 0.03) !important; border-radius: 12px !important; max-width: 900px !important; }
.hero-trust-item { display: flex !important; align-items: center !important; gap: 10px !important; font-size: 15px !important; font-weight: 600 !important; color: #dddddd !important; line-height: 1.2 !important; white-space: nowrap !important; }
.hero-trust-icon { display: inline-flex !important; justify-content: center !important; align-items: center !important; width: 28px !important; height: 28px !important; font-size: 16px !important; flex-shrink: 0 !important; line-height: 1 !important; }
@media (max-width: 768px) { .hero-trust-strip { gap: 15px !important; padding: 12px 15px !important; } .hero-trust-item { font-size: 13px !important; } .hero-trust-icon { width: 24px !important; height: 24px !important; font-size: 14px !important; } }

/* ============================================================
   20. SHOP PAGE TOP CATEGORY BAR
   ============================================================ */
.shop-category-bar { display: flex; align-items: center; gap: 15px; padding: 15px 20px; background: var(--surface); border-radius: var(--radius); margin-bottom: 40px; overflow-x: auto; white-space: nowrap; border: 1px solid var(--line); }
.shop-cat-label { font-weight: 700; color: var(--ink); font-size: 0.9rem; margin-right: 10px; }
.shop-category-bar a { text-decoration: none; color: var(--text); font-size: 0.9rem; font-weight: 600; padding: 6px 16px; border-radius: 100px; transition: all var(--ease); border: 1px solid transparent; }
.shop-category-bar a:hover, .shop-category-bar a.active { background: var(--accent); color: var(--white); }
@media (max-width: 600px) { .shop-category-bar { padding: 12px 15px; gap: 10px; } .shop-category-bar a { font-size: 0.85rem; padding: 5px 12px; } }

/* ============================================================
   21. PRODUCT IMAGE QUALITY & SIZING TWEAKS
   ============================================================ */
.woocommerce ul.products li.product img, ul.products li.product img, .woocommerce div.product div.images img { filter: brightness(1.08) contrast(1.02); object-fit: contain !important; width: 100% !important; max-height: 180px !important; height: auto !important; margin: 0 auto !important; display: block !important; }
.woocommerce ul.products li.product, ul.products li.product { padding-top: 10px !important; }
ul.products li.product .woocommerce-loop-product__title, .woocommerce ul.products li.product .astra-shop-summary-wrap h2 { font-size: 14px !important; line-height: 1.3 !important; }

/* ============================================================
   22. FORCE HEADER SEARCH BAR HEIGHT DOWN
   ============================================================ */
.site-header .search-form, .site-header .woocommerce-product-search, .site-header .ast-search-menu-icon .search-form { height: 32px !important; min-height: 32px !important; max-height: 32px !important; display: flex !important; align-items: center !important; margin: 0 !important; padding: 0 !important; }
.site-header input[type="search"], .site-header .search-field, .site-header .woocommerce-product-search input[type="search"], .site-header .ast-search-menu-icon .search-field { height: 32px !important; min-height: 32px !important; max-height: 32px !important; line-height: 32px !important; padding: 0 15px !important; font-size: 13px !important; box-sizing: border-box !important; border-radius: 100px 0 0 100px !important; margin: 0 !important; }
.site-header button[type="submit"], .site-header .search-submit, .site-header .woocommerce-product-search button, .site-header .ast-search-menu-icon .search-submit { height: 32px !important; min-height: 32px !important; max-height: 32px !important; width: 32px !important; min-width: 32px !important; max-width: 32px !important; padding: 0 !important; line-height: 1 !important; box-sizing: border-box !important; border-radius: 0 100px 100px 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; margin: 0 !important; }
.site-header .search-submit svg, .site-header button[type="submit"] svg { width: 14px !important; height: 14px !important; }

/* ============================================================
   23. PREMIUM PROFESSIONAL HEADER STYLES
   ============================================================ */
.site-header { transition: background-color 0.4s ease, box-shadow 0.4s ease, padding 0.4s ease !important; z-index: 999 !important; margin-bottom: 0 !important; }
.site-header .ast-main-header-wrap, .site-header .ast-primary-header-bar, .site-header .main-header-bar { padding-top: 4px !important; padding-bottom: 4px !important; margin-bottom: 0 !important; min-height: auto !important; }
body.home .site-header { background: transparent !important; box-shadow: none !important; }
.site-header.ast-header-sticky, .site-header.is-sticky { background: rgba(15, 17, 21, 0.95) !important; backdrop-filter: blur(12px) !important; -webkit-backdrop-filter: blur(12px) !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important; border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important; }
#site-navigation .main-navigation > ul > li > a, .main-header-menu > li > a { font-family: var(--font) !important; font-size: 0.85rem !important; font-weight: 600 !important; letter-spacing: 0.05em !important; text-transform: uppercase !important; color: rgba(255, 255, 255, 0.9) !important; transition: color 0.3s ease !important; padding-top: 6px !important; padding-bottom: 1px !important; line-height: 1.2 !important; }
#site-navigation .main-navigation > ul > li > a:hover, #site-navigation .main-navigation > ul > li.current-menu-item > a { color: var(--accent) !important; }
.header-button .btn { padding: 6px 18px !important; font-size: 0.8rem !important; border-radius: var(--radius-sm) !important; }
.ast-site-identity .site-logo-img img, .custom-logo-link img { max-height: 36px !important; width: auto !important; }
.ast-mobile-menu-buttons .ast-menu-toggle { color: var(--white) !important; padding: 4px !important; }
.ast-mobile-popup-drawer.active .ast-mobile-popup-inner { background: var(--ink) !important; }
.ast-mobile-popup-drawer.active .main-header-menu a { color: var(--white) !important; font-weight: 600 !important; border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important; }
.ast-mobile-popup-drawer.active .main-header-menu a:hover { color: var(--accent) !important; padding-left: 10px !important; }
.site-header, .ast-main-header-wrap, .ast-primary-header-bar, .main-header-bar, .main-header-bar-wrap { width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; border-radius: 0 !important; }
.site-header .ast-container { max-width: 100% !important; padding-left: 24px !important; padding-right: 24px !important; }

/* ============================================================
   24. FORCE HERO & CTA SECTIONS TO STRETCH 100% EDGE-TO-EDGE
   ============================================================ */
.hero, .hero-attached-dark, .cta-banner, .section-dark, .about-hero, .contact-hero, .privacy-hero, .cert-strip { width: 100vw !important; max-width: 100vw !important; position: relative !important; left: 50% !important; margin-left: -50vw !important; margin-right: -50vw !important; box-sizing: border-box !important; margin-bottom: 0 !important; }
body { overflow-x: hidden !important; }

/* ============================================================
   25. UNIFORM BLOCK SPACING OVERRIDE
   ============================================================ */
.site-main > *, .entry-content > *, .wp-block-group, .wp-block-columns, .wp-block-cover, .ast-row, .ast-container > *:not(:last-child) { margin-bottom: 0 !important; }

/* ============================================================
   26. PAGE-SPECIFIC CTA TO FOOTER GAP FIX
   ============================================================ */
body.home .cta-banner { margin-bottom: -30px !important; }
body.home .site-footer, body.home .ast-footer { margin-top: -40px !important; }
.page-about-us .cta-banner, body.page-template-about .cta-banner, body.page-id-33 .cta-banner { margin-bottom: -110px !important; }
.page-about-us .site-footer, .page-about-us .ast-footer, body.page-template-about .site-footer, body.page-id-33 .site-footer, body.page-id-33 .ast-footer { margin-top: -80px !important; }
.site-footer .ast-container { padding-top: 0 !important; margin-top: 0 !important; }
.custom-professional-footer { margin-top: 0 !important; padding-top: 20px !important; }

/* ============================================================
   27. WOOCOMMERCE EXTRAS & PLUGIN OVERRIDES
   ============================================================ */
.woocommerce nav.woocommerce-pagination ul li a:focus, .woocommerce nav.woocommerce-pagination ul li a:hover, .woocommerce nav.woocommerce-pagination ul li span.current { background: #E56749; color: #ffffff; border-color: #E56749 !important; }
.woocommerce-js div.product div.summary .single-product-category { display: none; }

/* ============================================================
   28. SECTION 2: CAROUSEL SLIDER & FEATURED PRODUCTS
   ============================================================ */
.section-heading-dark { font-size: 20px !important; font-weight: 800 !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; color: #ffffff !important; margin-bottom: 25px !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 10px !important; }
.custom-carousel-section { width: 1200px; max-width: 100%; margin: 0 auto 50px; }
.carousel-wrapper { display: flex; align-items: center; position: relative; width: 100%; }

/* CAROUSEL TRACK - FORCES HORIZONTAL SCROLL */
.carousel-track-container { 
    overflow-x: auto !important; scroll-snap-type: x mandatory !important; display: flex !important; 
    width: 100% !important; padding: 10px 0 !important; scrollbar-width: none !important; 
}
.carousel-track-container::-webkit-scrollbar { display: none !important; }

/* FORCE CAROUSEL TO BE FLEX ROW (HIGHEST SPECIFICITY TO BEAT SECTION 8) */
.hero-attached-dark .carousel-track-container ul.products { 
    display: flex !important; flex-wrap: nowrap !important; margin: 0 !important; padding: 0 !important; 
    width: max-content !important; list-style: none !important; grid-template-columns: unset !important; 
}

/* FORCE EXACTLY 4 ITEMS TO SHOW */
.hero-attached-dark .carousel-track-container ul.products li.product-category { 
    flex: 0 0 280px !important; width: 280px !important; max-width: 280px !important; 
    margin: 0 10px !important; scroll-snap-align: start !important;
}

/* CAROUSEL ARROW BUTTONS */
.carousel-btn { 
    background: rgba(255, 255, 255, 0.1) !important; color: #ffffff !important; border: 1px solid rgba(255, 255, 255, 0.2) !important; 
    width: 40px !important; height: 40px !important; border-radius: 50% !important; font-size: 24px !important; cursor: pointer !important; 
    display: flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; 
    position: absolute !important; top: 50% !important; transform: translateY(-50%) !important; z-index: 10 !important; transition: background 0.3s ease !important; 
}
.carousel-btn.prev-btn { left: -50px !important; }
.carousel-btn.next-btn { right: -50px !important; }
.carousel-btn:hover { background: var(--accent) !important; border-color: var(--accent) !important; }

/* FEATURED PRODUCTS SECTION */
.featured-section { width: 1200px; max-width: 100%; margin: 0 auto; }
.featured-grid ul.products { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 20px !important; margin: 0 !important; padding: 0 !important; width: 100% !important; list-style: none !important; }
.featured-grid ul.products li.product { background: transparent !important; margin: 0 !important; padding: 0 !important; display: flex !important; flex-direction: column !important; align-items: center !important; text-align: center !important; }

/* MOBILE RESPONSIVENESS */
@media (max-width: 992px) {
  .carousel-btn.prev-btn { left: -20px !important; } .carousel-btn.next-btn { right: -20px !important; }
  .hero-attached-dark .carousel-track-container ul.products li.product-category { flex: 0 0 calc(50% - 10px) !important; width: calc(50% - 10px) !important; max-width: calc(50% - 10px) !important; }
  .featured-grid ul.products { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 600px) {
  .hero-attached-dark .carousel-track-container ul.products li.product-category { flex: 0 0 100% !important; width: 100% !important; max-width: 100% !important; }
  .featured-grid ul.products { grid-template-columns: 1fr !important; }
}

/* ============================================================
   FORCE QUICK VIEW PLUGIN TO MATCH THEME ORANGE-RED
   ============================================================ */
a.woosq-btn, button.woosq-btn, .woosq-btn, .woosq-button {
    background: var(--accent) !important; color: #ffffff !important; border: none !important;
    border-radius: var(--radius-sm) !important; font-family: var(--font) !important; font-size: 13px !important;
    font-weight: 700 !important; letter-spacing: 0.06em !important; text-transform: uppercase !important;
    padding: 10px 24px !important; text-decoration: none !important; transition: all var(--ease) !important;
}
a.woosq-btn:hover, button.woosq-btn:hover, .woosq-btn:hover, .woosq-button:hover {
    background: var(--accent-dark) !important; color: #ffffff !important; transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(255,90,31,.32) !important;
}


/* ============================================================
   CATEGORY CAROUSEL WITH MARQUEE SCROLL
   ============================================================ */

/* 1. The Container */
.hero-attached-dark ul.products li.product-category {
    width: 258px !important;
    max-width: 258px !important;
    margin: 0 10px !important;
    display: flex !important;
    flex-direction: column !important;
    flex-shrink: 0 !important;
}

/* 2. The White Box - Center everything inside */
.hero-attached-dark ul.products li.product-category > a {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 280px !important;
    background: #ffffff !important;
    border-radius: 12px !important;
    padding: 20px !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
    overflow: hidden !important;
}

/* 3. The Image */
.hero-attached-dark ul.products li.product-category > a img {
    max-height: 150px !important;
    width: auto !important;
    object-fit: contain !important;
    margin-bottom: 15px !important;
}

/* 4. The Category Title - Centered inside the box */
.hero-attached-dark ul.products li.product-category > a .woocommerce-loop-category__title {
    color: #000000 !important;
    background: transparent !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-align: center !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    line-height: 1.3 !important;
    text-transform: uppercase !important;
}

/* 5. Hide the count */
.hero-attached-dark ul.products li.product-category > a .woocommerce-loop-category__title .count {
    display: none !important;
}

/* 6. Marquee Animation */
@keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.carousel-track-container {
    overflow: hidden !important;
}

.carousel-track-container ul.products {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: max-content !important;
    animation: marquee 30s linear infinite !important;
    padding-left: 0 !important;
}

.carousel-track-container ul.products:hover {
    animation-play-state: paused !important;
}

/* Ensure carousel items are visible */
.carousel-track-container ul.products li.product-category {
    opacity: 1 !important;
    visibility: visible !important;
}


/* ============================================================
   FIX: RESTORE CTA BUTTON CONTRAST ON ORANGE BACKGROUND
   ============================================================ */

/* 1. Make "Start Shopping" White with Orange Text */
.cta-banner .btn-accent {
    background: #ffffff !important;
    color: var(--accent) !important;
    border-color: #ffffff !important;
}

.cta-banner .btn-accent:hover {
    background: var(--ink) !important;
    color: #ffffff !important;
    border-color: var(--ink) !important;
}

/* 2. Make "Talk to an Expert" a White Outline with White Text */
.cta-banner .btn-ghost {
    background: transparent !important;
    color: #ffffff !important;
    border: 2px solid #ffffff !important;
}

.cta-banner .btn-ghost:hover {
    background: #ffffff !important;
    color: var(--accent) !important;
    border-color: #ffffff !important;
}


/* ============================================================
   FIX: FLUSH NON-HOMEPAGE HEROES TO NAVBAR
   ============================================================ */

/* 1. Target all content wrappers on non-home pages and remove spacing */
body:not(.home) .site-content,
body:not(.home) #content,
body:not(.home) .content-area,
body:not(.home) .site-main,
body:not(.home) .ast-container,
body:not(.home) .ast-separate-container .site-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* 2. Ensure the page title wrap is completely gone */
body:not(.home) .ast-page-title-wrap,
body:not(.home) .entry-header,
body:not(.home) .page-header {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 3. Pull the heroes up aggressively */
body:not(.home) .hero,
body:not(.home) .about-hero,
body:not(.home) .contact-hero,
body:not(.home) .privacy-hero {
    margin-top: -110px !important;
    padding-top: 40px !important;
    position: relative;
    z-index: 10;
}


/* ============================================================
   MOBILE OPTIMIZATIONS (FINAL CORRECTED)
   ============================================================ */

@media (max-width: 768px) {
  
  /* 1. Homepage Hero - Better content spacing */
  body.home .hero .hero-title {
    font-size: 1.6rem !important;
    line-height: 1.3 !important;
    padding: 0 20px !important;
  }
  
  body.home .hero .hero-sub {
    font-size: 1rem !important;
    line-height: 1.6 !important;
    padding: 0 20px !important;
  }
  
  body.home .hero-actions {
    padding: 0 20px !important;
  }
  
  body.home .hero-trust {
    margin: 20px 15px 0 !important;
    padding: 25px 20px !important;
  }
  
        
  /* 5. Non-homepage heroes - Move downward */
  body:not(.home) .hero,
  body:not(.home) .about-hero,
  body:not(.home) .contact-hero,
  body:not(.home) .privacy-hero {
    margin-top: -60px !important;
    padding-top: 100px !important;
  }
  
  /* 6. Container padding */
  .container {
    padding-inline: 20px !important;
  }
  
  /* 7. CTA section */
  .cta-banner {
    padding: 40px 20px !important;
  }
  
  .cta-title {
    font-size: 1.5rem !important;
    padding: 0 10px !important;
  }
  
  .cta-text {
    padding: 0 10px !important;
  }
  
  /* 8. Category carousel - Fix sizing & visibility */
  .hero-attached-dark ul.products li.product-category {
    width: 220px !important;
    max-width: 220px !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
  
  .hero-attached-dark ul.products li.product-category > a {
    height: 240px !important;
    padding: 15px !important;
  }
  
  .hero-attached-dark ul.products li.product-category > a .woocommerce-loop-category__title {
    font-size: 12px !important;
  }
}

/* Smaller mobile devices */
@media (max-width: 480px) {
  body.home .hero .hero-title {
    font-size: 1.4rem !important;
  }
  
  body.home .hero .hero-sub {
    font-size: 0.95rem !important;
  }
  
  .hero-attached-dark ul.products li.product-category {
    width: 180px !important;
    max-width: 180px !important;
  }
  
  .hero-attached-dark ul.products li.product-category > a {
    height: 220px !important;
  }
}

.woocommerce .woocommerce-pagination ul.page-numbers, .woocommerce-page .woocommerce-pagination ul.page-numbers {
	zoom: 1;
	padding-top: 50px;
	text-align: center;
	}



/* ============================================================
   MOBILE CAROUSEL FIX - MUST BE AT END OF FILE
   ============================================================ */

@media (max-width: 768px) {
  
  /* Force carousel track to show all items */
  .hero-attached-dark .carousel-track-container ul.products {
    width: max-content !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    animation: marquee 40s linear infinite !important;
  }
  
  /* Force each item to maintain size */
  .hero-attached-dark .carousel-track-container ul.products li.product-category {
    width: 220px !important;
    max-width: 220px !important;
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    margin: 0 10px !important;
  }
  
  /* Force white box to render */
  .hero-attached-dark .carousel-track-container ul.products li.product-category > a {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 240px !important;
    background: #ffffff !important;
    border-radius: 12px !important;
    padding: 15px !important;
    box-sizing: border-box !important;
  }
  
  /* Force image to display */
  .hero-attached-dark .carousel-track-container ul.products li.product-category > a img {
    max-height: 150px !important;
    width: auto !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 auto 15px auto !important;
  }
  
  /* Force title to display */
  .hero-attached-dark .carousel-track-container ul.products li.product-category > a .woocommerce-loop-category__title {
    color: #000000 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-align: center !important;
    display: block !important;
    width: 100% !important;
  }
}