/* DXP — Wingo product page (uses style.css for shared header/footer/faq/band) */
.wingo-canvas { height: 3616px; }
.viewport.wingo-vp { height: 3616px; }
@media (max-width: 1439px) { .viewport.wingo-vp { height: 3002px; } }
@media (max-width: 1190px) { .viewport.wingo-vp { height: 2532px; } }
@media (max-width: 1000px) { .viewport.wingo-vp { height: 1917px; } }
@media (max-width: 760px)  { .viewport.wingo-vp { height: 1266px; } }
@media (max-width: 500px)  { .viewport.wingo-vp { height: 941px; } }

/* hero */
.w-hero { position: absolute; left: 0; top: 0; width: 1440px; height: 750px; background: url('../images/wingo-hero.jpg') center / cover no-repeat; }
.w-hero::after { content: ""; position: absolute; inset: 0; background: rgba(255,255,255,0.10); }
.w-hero-text { position: absolute; left: 332px; top: 145px; width: 777px; display: flex; flex-direction: column; gap: 50px; align-items: center; z-index: 2; }
.w-hero-text h1 { font-family: 'Covered By Your Grace', cursive; font-weight: 400; font-size: 110px; line-height: 64px; text-align: center; color: #F13B31; }
.w-hero-text p { font-size: 19px; line-height: 24px; text-align: center; color: #000; }

/* collection heading */
.w-head { position: absolute; left: 332px; top: 826px; width: 777px; display: flex; flex-direction: column; gap: 7px; align-items: center; }
.w-head h2 { font-family: 'Catamaran', sans-serif; font-weight: 700; font-size: 40px; line-height: 46px; text-align: center; color: #000; white-space: nowrap; }
.w-head p { font-size: 18px; line-height: 24px; text-align: center; color: #000; }

/* product cards — 373×504, rows of 3 + 2 */
.w-cards { position: absolute; left: 123px; top: 990px; width: 1194px; display: flex; flex-flow: row wrap; column-gap: 37px; row-gap: 40px; justify-content: center; }
.w-card { width: 373px; height: 504px; border-radius: 20px; background: linear-gradient(89.795deg, #C1E7CA 0.29%, #EBFFEF 48.26%, #C5E9CD 97.16%); display: flex; justify-content: center; align-items: flex-start; padding: 0 60px 19px; box-sizing: border-box; transition: transform 0.25s ease, box-shadow 0.25s ease; align-items: center;}
.w-card:hover { transform: translateY(-8px); box-shadow: 0 14px 28px rgba(4,85,36,0.18); }
.w-card .inner { width: 250px; display: flex; flex-direction: column; gap: 6px; align-items: center; }
.w-card .imgbox {  align-self: stretch; display: flex; justify-content: center; align-items: center; padding: 16px 11px 6px 10px; box-sizing: border-box; margin-bottom: 13px; }
.w-card .img { width: 151px !important; height: 250px !important; background-position: center; background-size: contain; background-repeat: no-repeat; }
.w-card h3 { font-family: 'Catamaran', sans-serif; font-weight: 700; font-size: 25px; line-height: 36px; text-align: center; color: #222; white-space: pre; width: max-content; max-width: 350px; }
.w-card .shop-btn { width: 112px; background: #045524; }

/* splashes */
.w-splash-r { position: absolute; left: 0; top: 0; transform: matrix(0.857,-0.516,0.516,0.857,1181,883.665); transform-origin: 0 0; width: 358px; height: 599px; background: url('../images/opt-15bd97ae.png') 100% 0% / 208.117% 124.378% no-repeat; }
.w-splash-l { position: absolute; left: 0; top: 0; transform: matrix(0.966,0.260,-0.260,0.966,-139.049,1592); transform-origin: 0 0; width: 308px; height: 516px; background: url('../images/opt-15bd97ae.png') 100% 0% / 208.117% 124.378% no-repeat; }

/* yellow band (reuses .band styles from style.css, repositioned) */
.w-band { top: 2141px; left: -94px; }
.w-band-text { top: 2265px; }

/* FAQ (reuses .faq-* from style.css, repositioned) */
.w-faq-title { top: 2633px; }
.w-faq-list { top: 2703px; }
.w-faq-visual { top: 2665px; }

/* footer reposition */
.w-footer { top: 3170px; height: 494px; padding-top: 58px; }

.w-card:nth-child(2) { background: linear-gradient(89.795deg, #F8E88F 0.29%, #FFFBD6 48.26%, #F8E88F 97.16%); }
.w-card:nth-child(2) .shop-btn { background: #7F770D; }
.w-card:nth-child(3) { background: linear-gradient(89.795deg, #F8B9C0 0.29%, #FFE9EB 48.26%, #F8B9C0 97.16%); }
.w-card:nth-child(3) .shop-btn { background: #8E1420; }
.w-card:nth-child(4) { background: linear-gradient(89.795deg, #D9D9D9 0.29%, #F7F7F7 48.26%, #D9D9D9 97.16%); }
.w-card:nth-child(4) .shop-btn { background: #262626; }
.w-card:nth-child(5) { background: linear-gradient(89.795deg, #F3D9A4 0.29%, #FFF4DC 48.26%, #F3D9A4 97.16%); }
.w-card:nth-child(5) .shop-btn { background: #7A5A16; }

/* price above Shop Now (fig: 19px Montserrat 500, #858585) */
.w-card .price { font-family: 'Montserrat', sans-serif; font-weight: 500; font-size: 19px; line-height: 38px; color: #858585; text-align: center; }
.w-card .inner { gap: 0; }
.w-card .imgbox { margin-bottom: 4px; }
.w-card h3 { margin-bottom: 0; }
.w-card .price + .shop-btn { margin-top: 5px; }
/* band descriptions wrap on product pages */
.w-band + .band-text p, .band-text.w-band-text p { white-space: normal; }
.band-text.w-band-text h2 { white-space: pre-line; }