/* Candy Cloud v7 — production desktop + mobile polish.
   Loaded last so it intentionally wins over older responsive experiments. */

/* ------------------------------
   Global layout guardrails
------------------------------ */
html, body { max-width: 100%; overflow-x: hidden; }
.cc-container { width: min(calc(100% - 40px), 1280px); }
.cc-page-main { overflow: clip; }
.cc-site-header { box-shadow: 0 1px 0 rgba(33,22,35,.04); }

/* Keep all commercial cards predictable. */
.cc-product-card,
.woocommerce ul.products li.product.cc-product-card {
  min-width: 0;
  height: 100%;
}
.cc-product-image-link,
.woocommerce ul.products li.product.cc-product-card > a:first-of-type {
  overflow: hidden;
  background: #fff;
}
.cc-product-image-link img,
.woocommerce ul.products li.product.cc-product-card a img {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: center !important;
}

/* ------------------------------
   Desktop homepage
------------------------------ */
@media (min-width: 1025px) {
  .home .cc-section { padding-block: 58px; }
  .cc-hero-viewport { height: clamp(560px, 39vw, 640px) !important; }
  .cc-hero-copy { width: min(650px, 54%) !important; }
  .cc-hero-title { font-size: clamp(58px, 5.9vw, 88px) !important; }

  .cc-home-best-sellers .cc-product-grid {
    grid-template-columns: repeat(4, minmax(0,1fr)) !important;
    gap: 18px !important;
  }

  /* Compact Deals: copy + exactly three compact cards. */
  .cc-deals-panel {
    display: grid !important;
    grid-template-columns: minmax(250px, .65fr) minmax(0, 1.55fr) !important;
    align-items: center !important;
    gap: 24px !important;
    margin-top: 26px !important;
    padding: 24px !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    background: radial-gradient(circle at 10% 10%, rgba(229,51,156,.08), transparent 30%), #fff !important;
  }
  .cc-deals-copy { padding: 6px !important; }
  .cc-deals-copy h3 { font-size: clamp(32px,3vw,42px) !important; line-height: 1 !important; }
  .cc-deals-copy p { margin: 10px 0 18px !important; font-size: 14px !important; }
  .cc-deals-products {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    align-items: stretch !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }
  .cc-deals-products::before,
  .cc-deals-products::after { display: none !important; }
  .cc-deals-products li.product.cc-product-card {
    width: auto !important;
    margin: 0 !important;
    float: none !important;
  }
  .cc-deals-products .cc-product-content { padding: 11px !important; gap: 5px !important; }
  .cc-deals-products .cc-product-title { font-size: 14px !important; }
  .cc-deals-products .cc-product-rating { font-size: 10px !important; }
  .cc-deals-products .cc-strengths { display: none !important; }
  .cc-deals-products .cc-product-price .price,
  .cc-deals-products .cc-product-price .woocommerce-Price-amount { font-size: 17px !important; }
  .cc-deals-products .cc-product-add.button { min-height: 29px !important; padding: 5px 9px !important; font-size: 10px !important; }

  .cc-home-categories .cc-category-grid { grid-template-columns: repeat(3, minmax(0,1fr)) !important; gap: 16px !important; }
  .cc-home-categories .cc-category-image { height: 190px !important; }
  .cc-home-brands .cc-brand-grid { grid-template-columns: repeat(4,minmax(0,1fr)) !important; }
  .cc-home-blog .cc-blog-grid { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
}

/* ------------------------------
   Header — tablet and phone
------------------------------ */
@media (max-width: 1024px) {
  .cc-container { width: min(calc(100% - 28px), 1280px); }
  .cc-utility, .cc-nav-wrap { display: none !important; }
  .cc-main-header {
    position: relative;
    display: grid !important;
    grid-template-columns: 46px minmax(0,1fr) 50px;
    align-items: center;
    gap: 10px !important;
    min-height: 76px !important;
    padding-block: 9px !important;
  }
  .cc-mobile-toggle {
    display: grid !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 12px !important;
  }
  .cc-logo-link { justify-self: center; min-width: 0; }
  .cc-logo-link img, .cc-logo-link .custom-logo {
    width: auto !important;
    height: 58px !important;
    max-width: 142px !important;
  }
  .cc-main-header > .cc-product-search { display: none !important; }
  .cc-cart-link {
    justify-self: end;
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 !important;
    border-radius: 12px !important;
  }
  .cc-cart-link .cc-icon { width: 20px; height: 20px; }
  .cc-cart-subtotal { display: none !important; }
  .cc-cart-count { left: -6px !important; top: -6px !important; }

  .cc-mobile-menu {
    padding: 12px 14px 18px !important;
    background: rgba(252,247,251,.98) !important;
    box-shadow: 0 14px 35px rgba(33,22,35,.12);
  }
  .cc-mobile-menu .cc-product-search { display: block !important; }
  .cc-mobile-menu .cc-product-search input[type="search"] { min-height: 44px; }
  .cc-mobile-links { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 4px 8px; }
  .cc-mobile-links a { padding: 10px 11px !important; }
  .cc-mobile-category a { font-size: 13px !important; }
}

/* ------------------------------
   Homepage — tablet
------------------------------ */
@media (min-width: 769px) and (max-width: 1024px) {
  .home .cc-section { padding-block: 48px !important; }
  .cc-hero-viewport { height: 540px !important; }
  .cc-hero-copy { width: min(610px, 72%) !important; }
  .cc-hero-title { font-size: clamp(54px,7vw,68px) !important; }
  .cc-home-best-sellers .cc-product-grid { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }

  .cc-deals-panel {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    padding: 22px !important;
  }
  .cc-deals-products {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .cc-home-categories .cc-category-grid { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
}

/* ------------------------------
   Phone homepage
------------------------------ */
@media (max-width: 768px) {
  .cc-container { width: min(calc(100% - 24px), 1280px); }
  .cc-announcement { min-height: 38px; display: flex; align-items: center; justify-content: center; padding: 7px 42px 7px 14px !important; font-size: 11px !important; line-height: 1.3; }

  .home .cc-section { padding-block: 38px !important; }
  .home .cc-section + .cc-section { padding-top: 0 !important; }
  .home .cc-section-heading { align-items: flex-end !important; gap: 8px 10px !important; }
  .home .cc-section-heading h2 { font-size: clamp(29px,8vw,36px) !important; }
  .cc-section-kicker { font-size: 9px !important; margin-bottom: 4px !important; }
  .home .cc-section-link { font-size: 11px !important; white-space: nowrap; }

  /* Hero tuned for an actual mobile viewport, not a shrunk desktop banner. */
  .cc-hero-viewport { height: 450px !important; }
  .cc-hero-image { object-position: 64% center !important; }
  .cc-hero-scrim {
    width: 100% !important;
    background: linear-gradient(90deg,#fff 0%,rgba(255,255,255,.98) 38%,rgba(255,255,255,.82) 61%,rgba(255,255,255,.26) 100%) !important;
  }
  .cc-hero-content { align-items: center !important; }
  .cc-hero-copy { width: min(91%, 470px) !important; padding-right: 24px; }
  .cc-hero-eyebrow { padding: 5px 10px !important; font-size: 9px !important; }
  .cc-hero-title { margin-top: 12px !important; font-size: clamp(39px,11vw,51px) !important; line-height: .91 !important; }
  .cc-hero-desc { max-width: 340px !important; margin-top: 12px !important; font-size: 13px !important; line-height: 1.42 !important; }
  .cc-hero-actions { display: flex !important; flex-wrap: wrap !important; gap: 7px !important; margin-top: 17px !important; }
  .cc-hero-actions .cc-btn { min-height: 39px !important; padding: 0 14px !important; font-size: 11px !important; }
  .cc-hero-arrow { display: none !important; }
  .cc-hero-progress { gap: 5px !important; padding-bottom: 13px !important; }
  .cc-progress-btn { height: 4px !important; }

  /* Benefits as three compact rows. */
  .cc-benefit-grid { padding-block: 5px !important; }
  .cc-benefit { gap: 11px !important; padding: 12px 0 !important; }
  .cc-benefit-icon { flex: 0 0 38px !important; width: 38px !important; height: 38px !important; }
  .cc-benefit-value { font-size: 20px !important; }
  .cc-benefit-label { font-size: 9px !important; }

  /* Best sellers: deliberate horizontal merchandising carousel. */
  .cc-home-best-sellers .cc-product-grid {
    display: flex !important;
    gap: 11px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    margin-top: 20px !important;
    padding: 1px 2px 10px !important;
  }
  .cc-home-best-sellers .cc-product-grid::-webkit-scrollbar { display: none; }
  .cc-home-best-sellers .cc-product-grid li.product.cc-product-card {
    flex: 0 0 min(68vw, 245px) !important;
    width: min(68vw, 245px) !important;
    scroll-snap-align: start;
  }

  /* Deals: never a giant vertical section again. */
  .cc-home-deals { padding-bottom: 38px !important; }
  .cc-deals-panel {
    display: block !important;
    margin-top: 18px !important;
    padding: 17px !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    background: radial-gradient(circle at 12% 8%,rgba(229,51,156,.08),transparent 28%),#fff !important;
  }
  .cc-deals-copy { padding: 1px !important; }
  .cc-deals-copy h3 { margin-top: 7px !important; font-size: clamp(28px,8vw,36px) !important; }
  .cc-deals-copy p { margin: 8px 0 15px !important; font-size: 12px !important; line-height: 1.45; }
  .cc-deals-copy .cc-btn { min-height: 39px !important; padding-inline: 15px !important; font-size: 11px !important; }
  .cc-deals-products {
    display: flex !important;
    gap: 10px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    margin: 17px 0 0 !important;
    padding: 1px 1px 8px !important;
    list-style: none !important;
  }
  .cc-deals-products::-webkit-scrollbar { display: none; }
  .cc-deals-products::before,
  .cc-deals-products::after { display: none !important; }
  .cc-deals-products li.product.cc-product-card {
    flex: 0 0 min(64vw, 220px) !important;
    width: min(64vw, 220px) !important;
    margin: 0 !important;
    float: none !important;
    scroll-snap-align: start;
  }
  .cc-deals-products .cc-product-content { padding: 10px !important; gap: 5px !important; }
  .cc-deals-products .cc-product-title { font-size: 13px !important; }
  .cc-deals-products .cc-product-brand { font-size: 9px !important; }
  .cc-deals-products .cc-strengths { display: none !important; }
  .cc-deals-products .cc-product-price .price,
  .cc-deals-products .cc-product-price .woocommerce-Price-amount { font-size: 16px !important; }

  /* Categories: fast visual scanning. */
  .cc-home-categories .cc-category-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 9px !important; margin-top: 18px !important; }
  .cc-home-categories .cc-category-image { height: 118px !important; }
  .cc-home-categories .cc-category-copy { min-height: 74px; padding: 10px 7px !important; }
  .cc-home-categories .cc-category-copy h3 { font-size: 16px !important; }
  .cc-home-categories .cc-category-copy p { margin-top: 3px !important; font-size: 10px !important; line-height: 1.3; }

  /* Brands deliberately compact. */
  .cc-home-brands .cc-brand-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 9px !important; margin-top: 18px !important; }
  .cc-home-brands .cc-brand-card { min-height: 72px !important; padding: 9px !important; }
  .cc-home-brands .cc-brand-logo { max-height: 40px !important; max-width: 120px !important; }

  /* Blog: one strong story per row. */
  .cc-home-blog .cc-blog-grid { grid-template-columns: 1fr !important; gap: 13px !important; margin-top: 18px !important; }
  .cc-home-blog .cc-blog-card { display: grid; grid-template-columns: 120px minmax(0,1fr); border-radius: 16px; }
  .cc-home-blog .cc-blog-card-image { aspect-ratio: auto !important; min-height: 128px; height: 100%; }
  .cc-home-blog .cc-blog-card-content { padding: 13px !important; }
  .cc-home-blog .cc-blog-card h3 { margin: 5px 0; font-size: 18px !important; }
  .cc-home-blog .cc-blog-card p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-bottom: 7px; font-size: 11px !important; }

  .cc-home-guide .cc-guide-card { padding: 21px !important; border-radius: 19px !important; }
  .cc-home-guide .cc-guide-card h2 { font-size: 28px !important; }
  .cc-home-guide .cc-guide-card p { font-size: 13px !important; }
  .cc-home-guide .cc-guide-actions { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .cc-home-guide .cc-guide-actions .cc-btn { width: 100%; min-height: 39px; padding-inline: 10px; font-size: 11px; }

  /* Seasonal/holiday section remains off by default and behaves like a campaign card on mobile. */
  .cc-seasonal-wrap { padding: 26px 0 4px !important; }
  .cc-seasonal { grid-template-columns: 1fr !important; min-height: 0 !important; border-radius: 20px !important; }
  .cc-seasonal-media { order: -1; min-height: 0 !important; aspect-ratio: 16 / 9 !important; }
  .cc-seasonal-copy { padding: 20px !important; }
  .cc-seasonal h2 { font-size: clamp(30px,8vw,39px) !important; }
  .cc-seasonal p { margin: 10px 0 16px !important; font-size: 12px !important; }

  /* Footer: useful rather than excessively tall. */
  .cc-footer { margin-top: 54px !important; }
  .cc-footer-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 26px 18px !important;
    padding: 36px 0 !important;
  }
  .cc-footer-grid > div:first-child,
  .cc-footer-newsletter { grid-column: 1 / -1; }
  .cc-footer-logo { width: 64px !important; height: 64px !important; }
  .cc-footer-desc { max-width: 420px; font-size: 12px !important; }
  .cc-footer-links, .cc-footer-contact { font-size: 12px !important; gap: 6px !important; }
  .cc-newsletter-form { max-width: 440px; flex-direction: row !important; }
  .cc-newsletter-form button { width: auto !important; }
}

@media (max-width: 480px) {
  .cc-main-header { grid-template-columns: 44px minmax(0,1fr) 46px; min-height: 70px !important; }
  .cc-logo-link img, .cc-logo-link .custom-logo { height: 54px !important; max-width: 130px !important; }
  .cc-mobile-links { grid-template-columns: 1fr 1fr; }

  .cc-hero-viewport { height: 430px !important; }
  .cc-hero-copy { width: 92% !important; padding-right: 16px; }
  .cc-hero-title { font-size: clamp(36px,11vw,44px) !important; }
  .cc-hero-actions { display: grid !important; grid-template-columns: 1fr 1fr !important; width: min(100%,300px); }
  .cc-hero-actions .cc-btn { padding-inline: 9px !important; }

  .cc-home-best-sellers .cc-product-grid li.product.cc-product-card { flex-basis: min(72vw,235px) !important; width: min(72vw,235px) !important; }
  .cc-deals-products li.product.cc-product-card { flex-basis: min(68vw,210px) !important; width: min(68vw,210px) !important; }
  .cc-home-blog .cc-blog-card { grid-template-columns: 104px minmax(0,1fr); }
  .cc-home-blog .cc-blog-card-image { min-height: 116px; }
  .cc-home-guide .cc-guide-actions { grid-template-columns: 1fr !important; }
  .cc-footer-grid { grid-template-columns: 1fr 1fr !important; }
  .cc-footer-grid > div:first-child,
  .cc-footer-newsletter { grid-column: 1 / -1; }
}

@media (max-width: 370px) {
  .cc-hero-viewport { height: 410px !important; }
  .cc-hero-title { font-size: 35px !important; }
  .cc-home-categories .cc-category-image { height: 104px !important; }
  .cc-home-blog .cc-blog-card { grid-template-columns: 92px minmax(0,1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .cc-hero-track,
  .cc-hero-image,
  .cc-product-card,
  .cc-category-card,
  .cc-blog-card { transition: none !important; animation: none !important; }
}

/* =========================================================
   V8 — event campaign directly under hero
   ========================================================= */
.cc-seasonal-wrap { display:none !important; }
.cc-event-section { padding: 24px 0 16px; }
.cc-event-shell { overflow:hidden; border-radius:26px; }
.cc-event-banner { position:relative; min-height:360px; overflow:hidden; background:var(--cc-surface); }
.cc-event-banner picture,
.cc-event-banner img { display:block; width:100%; height:100%; }
.cc-event-banner img { position:absolute; inset:0; object-fit:cover; object-position:center; }
.cc-event-overlay { position:absolute; inset:0; background:linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.94) 34%,rgba(255,255,255,.55) 58%,rgba(255,255,255,.06) 82%); }
.cc-event-copy { position:relative; z-index:2; display:flex; min-height:360px; width:min(610px,58%); flex-direction:column; align-items:flex-start; justify-content:center; padding:42px; }
.cc-event-eyebrow { display:inline-flex; padding:7px 13px; border-radius:999px; background:var(--cc-gradient); color:#fff; font-size:11px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.cc-event-copy h2 { margin:13px 0 0; font-size:clamp(38px,4vw,58px); font-weight:800; }
.cc-event-copy p { margin:12px 0 22px; max-width:540px; color:var(--cc-muted); font-size:16px; }
.cc-event-products-wrap { padding:22px; border-top:1px solid var(--cc-border); background:#fff; }
.cc-event-products-heading { display:flex; align-items:end; justify-content:space-between; gap:12px; margin-bottom:14px; }
.cc-event-products-heading h3 { margin:0; font-size:26px; }
.cc-event-products-heading span { color:var(--cc-muted); font-size:12px; }
.cc-event-products { display:grid !important; grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:12px !important; margin:0 !important; padding:0 !important; list-style:none; }
.cc-event-products li.product.cc-product-card { width:auto !important; margin:0 !important; }

.cc-event-halloween .cc-event-eyebrow { background:linear-gradient(100deg,#ff6a00,#7b2cff); }
.cc-event-christmas .cc-event-eyebrow { background:linear-gradient(100deg,#c8102e,#0b7a3d); }
.cc-event-black-friday .cc-event-eyebrow { background:linear-gradient(100deg,#111,#853dc2); }
.cc-event-new-year .cc-event-eyebrow { background:linear-gradient(100deg,#853dc2,#0089ed); }
.cc-event-easter .cc-event-eyebrow { background:linear-gradient(100deg,#e5339c,#72c7ff); }

@media (max-width:1024px) {
  .cc-event-products { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
  .cc-event-copy { width:68%; padding:34px; }
}
@media (max-width:768px) {
  .cc-event-section { padding:14px 0 10px; }
  .cc-event-shell { border-radius:20px; }
  .cc-event-banner { min-height:0; display:grid; background:#fff; }
  .cc-event-banner picture { position:relative; aspect-ratio:4/5; grid-area:1/1; }
  .cc-event-banner img { position:absolute; inset:0; }
  .cc-event-overlay { background:linear-gradient(0deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.9) 30%,rgba(255,255,255,.12) 62%,rgba(255,255,255,0) 100%); }
  .cc-event-copy { width:100%; min-height:0; align-self:end; padding:22px; padding-top:48%; }
  .cc-event-copy h2 { font-size:clamp(32px,9vw,44px); }
  .cc-event-copy p { font-size:14px; margin-bottom:17px; }
  .cc-event-copy .cc-btn { width:100%; }
  .cc-event-products-wrap { padding:16px; }
  .cc-event-products-heading { align-items:flex-start; flex-direction:column; margin-bottom:10px; }
  .cc-event-products {
    display:flex !important;
    gap:12px !important;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
    padding-bottom:8px !important;
  }
  .cc-event-products::-webkit-scrollbar { display:none; }
  .cc-event-products li.product.cc-product-card {
    flex:0 0 min(72vw,245px) !important;
    width:min(72vw,245px) !important;
    scroll-snap-align:start;
  }
}
@media (max-width:480px) {
  .cc-event-banner picture { aspect-ratio:4/5; }
  .cc-event-copy { padding:18px; padding-top:52%; }
  .cc-event-products li.product.cc-product-card { flex-basis:min(78vw,250px) !important; width:min(78vw,250px) !important; }
}