/* ==========================================================
   DXP — product pages (Star / Britvic / Wingo Probiotic / Ghee Wingo)
   Extends wingo.css; per-page heights, heroes, palettes, section tops.
   ========================================================== */

/* ---- heroes ---- */
.page-star .w-hero { background-image: url('../images/star-hero.jpg'); }
.page-britvic .w-hero { background-image: url('../images/britvic-hero.jpg'); }
.page-prebiotic .w-hero { background-image: url('../images/prebiotic-hero.jpg'); }
.page-ghee .w-hero { background-image: url('../images/ghee-hero.jpg'); }
.page-ghee .w-hero-text h1 { color: #FEB133; }
.page-ghee .w-hero-text p { color: #fff; }
.page-star .w-hero-text p, .page-prebiotic .w-hero-text p { white-space: pre-line; }

/* ---- card palettes ---- */
.page-star .w-card { background: linear-gradient(89.795deg, #FFE6B6 0.29%, #FFF7E8 48.26%, #FFE6B6 97.16%); }
.page-star .shop-btn { background: #BAA12A; }
.page-britvic .w-card { background: linear-gradient(89.795deg, #E9FFB3 0.29%, #FFFDFB 48.26%, #E9FFB3 97.16%); }
.page-britvic .shop-btn { background: #778F3B; }
.page-prebiotic .w-card { background: linear-gradient(89.795deg, #FFD095 0.29%, #FFF4E7 48.26%, #FFD095 97.16%); }
.page-prebiotic .shop-btn { background: #D36201; }
.page-ghee .w-card { background: linear-gradient(89.795deg, #EED89B 0.29%, #FFFFFF 48.26%, #EDD591 97.16%); }
.page-ghee .shop-btn { background: #0B3515; }

/* ---- star: 3-col grid (13 cards) ---- */
.page-star .w-cards { display: grid; grid-template-columns: repeat(3, 373px); gap: 66px 39px; justify-content: center; }

/* ---- FAQ visual cans per page ---- */
.page-star .w-faq-visual .can1 { background-image: url('../images/star-can-2.png'); background-size: contain; background-position: center; }
.page-star .w-faq-visual .can2 { background-image: url('../images/star-can-3.png'); background-size: contain; background-position: center; }
.page-britvic .w-faq-visual .can1 { background-image: url('../images/britvic-can-1.png'); background-size: contain; background-position: center; }
.page-britvic .w-faq-visual .can2 { background-image: url('../images/britvic-can-2.png'); background-size: contain; background-position: center; }
.page-prebiotic .w-faq-visual .can1 { background-image: url('../images/prebiotic-can-1.png'); background-size: contain; background-position: center; }
.page-prebiotic .w-faq-visual .can2 { background-image: url('../images/prebiotic-can-2.png'); background-size: contain; background-position: center; }
.page-ghee .w-faq-visual .can1 { background-image: url('../images/ghee-can-1.png'); background-size: contain; background-position: center bottom; transform: none; left: 10px; top: 130px; width: 220px; height: 280px; animation: none; opacity: 0.9; }
.page-ghee .w-faq-visual .can2 { background-image: url('../images/ghee-can-2.png'); background-size: contain; background-position: center bottom; transform: none; left: 330px; top: 160px; width: 210px; height: 260px; animation: none; opacity: 0.9; }
.page-ghee .w-faq-visual .shadow1, .page-ghee .w-faq-visual .shadow2, .page-ghee .w-faq-visual .splash, .page-ghee .w-faq-visual .splash-blur { display: none; }

/* ---- section tops + canvas/viewport heights ---- */
/* Star: cards region 5 rows -> band offset +1738 vs wingo */
.page-star .wingo-canvas { height: 5354px; }
.page-star .w-band { top: 3879px; }
.page-star .w-band-text { top: 4003px; }
.page-star .w-faq-title { top: 4371px; }
.page-star .w-faq-list { top: 4441px; }
.page-star .w-faq-visual { top: 4403px; }
.page-star .w-footer { top: 4900px; }
.page-star .viewport.wingo-vp { height: 5354px; }

/* Britvic + Ghee: single card row -> band offset -544 */
.page-britvic .wingo-canvas, .page-ghee .wingo-canvas { height: 3072px; }
.page-britvic .w-band, .page-ghee .w-band { top: 1597px; }
.page-britvic .w-band-text, .page-ghee .w-band-text { top: 1721px; }
.page-britvic .w-faq-title, .page-ghee .w-faq-title { top: 2089px; }
.page-britvic .w-faq-list, .page-ghee .w-faq-list { top: 2159px; }
.page-britvic .w-faq-visual, .page-ghee .w-faq-visual { top: 2121px; }
.page-britvic .w-footer, .page-ghee .w-footer { top: 2650px; }
.page-britvic .viewport.wingo-vp, .page-ghee .viewport.wingo-vp { height: 3072px; }

/* Prebiotic: 2 card rows -> band offset +26 */
.page-prebiotic .wingo-canvas { height: 3642px; }
.page-prebiotic .w-band { top: 2167px; }
.page-prebiotic .w-band-text { top: 2291px; }
.page-prebiotic .w-faq-title { top: 2659px; }
.page-prebiotic .w-faq-list { top: 2729px; }
.page-prebiotic .w-faq-visual { top: 2691px; }
.page-prebiotic .w-footer { top: 3200px; }
.page-prebiotic .viewport.wingo-vp { height: 3642px; }

/* ---- scaled viewport heights per breakpoint ---- */
@media (max-width: 1439px) {
  .page-star .viewport.wingo-vp { height: 4444px; }
  .page-britvic .viewport.wingo-vp, .page-ghee .viewport.wingo-vp { height: 2550px; }
  .page-prebiotic .viewport.wingo-vp { height: 3023px; }
}
@media (max-width: 1190px) {
  .page-star .viewport.wingo-vp { height: 3748px; }
  .page-britvic .viewport.wingo-vp, .page-ghee .viewport.wingo-vp { height: 2150px; }
  .page-prebiotic .viewport.wingo-vp { height: 2549px; }
}
@media (max-width: 1023px) {
  /* mobile reflow: undo grid + fixed heights */
  .page-star .w-cards { display: flex; }
  .page-star .wingo-canvas, .page-britvic .wingo-canvas, .page-ghee .wingo-canvas, .page-prebiotic .wingo-canvas { height: auto !important; }
}

/* ghee: per-card buttons */
.page-ghee .w-card:nth-child(1) .shop-btn { background: #0B3515; }
.page-ghee .w-card:nth-child(2) .shop-btn { background: #C9992B; }
.page-ghee .w-card:nth-child(3) .shop-btn { background: #8E2418; }
/* ghee FAQ visual: Jyoti jar centered over cow + churning illustration */
.page-ghee .w-faq-visual .splash { display: block; left: 155px; top: 40px; width: 245px; height: 430px; background: url('../images/ghee-jyoti.png') center / contain no-repeat; animation: none; filter: none; }