/* ==========================================================================
   World Of Orient — WooCommerce single product + product cards.
   Layout follows the Webflow "ecommerce-3" template: thumbnails + framed main
   image beside label, title, price, description and add-to-cart; product cards
   (framed image, name, price) for "you may also like" and the home courses
   section. Restyled to the WOF brand.
   ========================================================================== */
.wof-product-page,
.wof-pgrid{
  --wof-gold:#C9A964; --wof-gold-dark:#b0903f; --wof-gold-soft:#efe5cf; --wof-dark:#101010; --wof-frame:#f3eee4;
  --wof-line:rgba(16,16,16,.10); --wof-muted:rgba(16,16,16,.58); --wof-ease:cubic-bezier(.625,.05,0,1);
  font-family:"Nunito",Arial,sans-serif;
}
.wof-product-page *,
.wof-pgrid *{box-sizing:border-box}
.wof-product-page{background:#fff;color:var(--wof-dark)}

/* the page clears the fixed header itself (notices print above the hero); default.css pads #content */
.main-contain #content.wof-product-page,
.single-product .footer-bottom-gaps .main-contain #content.wof-product-page{
  padding-top:calc(var(--wof-hh,124px) + clamp(28px,4vw,56px)) !important;padding-bottom:0 !important}

.wof-product-page .woocommerce-notices-wrapper{max-width:1200px;margin:0 auto;padding:0 clamp(16px,3vw,32px)}
.wof-product-page .woocommerce-notices-wrapper:not(:empty){margin-bottom:24px}
.wof-product-page .woocommerce-message,
.wof-product-page .woocommerce-info,
.wof-product-page .woocommerce-error{margin:0;border-radius:7px}

/* hero: gallery + summary */
.wof-product-hero{padding:0 clamp(16px,3vw,32px) clamp(64px,8vw,112px)}
.wof-product-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:start}

.wof-product-media{display:flex;gap:16px;min-width:0}
.wof-product-thumbs{display:flex;flex-direction:column;gap:12px;flex:none}
.wof-product-thumb{display:block;width:80px;height:80px;margin:0;padding:8px;border:1px solid var(--wof-line);border-radius:16px;background:var(--wof-frame);cursor:pointer;transition:border-color .2s ease}
.wof-product-thumb img{display:block;width:100%;height:100%;object-fit:contain;border-radius:6px}
.wof-product-thumb:hover,
.wof-product-thumb.is-active{border-color:var(--wof-dark)}
.wof-product-main{flex:1;min-width:0;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;
  padding:clamp(28px,5vw,64px);border-radius:28px;background:var(--wof-frame)}
.wof-product-main .wof-product-photo{display:block;width:auto;height:auto;max-width:100%;max-height:100%;border-radius:12px;box-shadow:0 28px 50px -24px rgba(16,16,16,.4)}

.wof-product-summary{display:flex;flex-direction:column;align-items:flex-start;min-width:0;max-width:520px;padding-top:clamp(0px,2vw,24px)}
.wof-product-label{display:flex;align-items:center;gap:9px;margin:0 0 18px;font-size:13px;font-weight:800;line-height:1;letter-spacing:2px;text-transform:uppercase;color:var(--wof-gold-dark)}
.wof-product-reveal{overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.wof-product-page .wof-product-title{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:clamp(44px,5.4vw,76px);line-height:1;letter-spacing:-.5px;
  color:var(--wof-dark);margin:0;padding:0;text-wrap:balance;animation:wof-rise .9s cubic-bezier(.22,1,.36,1) both}
@keyframes wof-rise{from{transform:translateY(105%)}to{transform:none}}

.wof-product-price{margin:24px 0;font-size:24px;font-weight:700;line-height:1.2;color:var(--wof-dark)}
.wof-product-price .amount{color:inherit}
.wof-product-price del{margin-right:8px;font-weight:600;opacity:.45}
.wof-product-price ins{text-decoration:none}

.wof-product-desc{font-size:16.5px;line-height:1.75;color:#3a3a3a}
.wof-product-desc p{margin:0 0 1em;font-size:inherit;line-height:inherit}
.wof-product-desc > :last-child{margin-bottom:0}
.wof-product-desc ul,
.wof-product-desc ol{margin:0 0 1em;padding-left:1.3em}
.wof-product-desc li{margin-bottom:.35em}

/* add to cart + plugin output (PayPal) */
.wof-product-cart{width:100%;margin-top:32px}
/* theme gives form.cart a bottom margin, padding and border line */
/* spacing via margin, not gap: plugins inject hidden elements into form.cart */
.wof-product-page .wof-product-cart form.cart{display:flex;align-items:stretch;margin:0 !important;padding:0 !important;border:0 !important}
.wof-product-page .wof-product-cart form.cart::before,
.wof-product-page .wof-product-cart form.cart::after{content:none}
.wof-product-page .wof-product-cart form.cart .quantity{flex:none;margin:0 12px 0 0}
.wof-product-page .wof-product-cart form.cart .quantity.hidden{display:none} /* sold individually: hidden qty input still submits */
.wof-product-page .wof-product-cart form.cart .single_add_to_cart_button{flex:1 1 auto;width:100%;float:none;margin:0}
.wof-product-cart .ppc-button-wrapper{margin-top:12px}

/* you may also like */
.wof-product-related{padding:0 clamp(16px,3vw,32px) clamp(80px,10vw,150px)}
.wof-product-related-inner{max-width:1200px;margin:0 auto;padding-top:clamp(56px,7vw,96px);border-top:1px solid var(--wof-line)}
.wof-product-page .wof-product-related-title{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:clamp(34px,4vw,56px);line-height:1.05;letter-spacing:-.5px;
  text-align:center;color:var(--wof-dark);margin:0 0 clamp(36px,5vw,64px)}

/* shop + product category archives (woocommerce/archive-product.php) */
.wof-shop.wof-block{padding:clamp(56px,7vw,96px) 0 clamp(72px,10vw,140px)}
.wof-shop__filters{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0 0 clamp(40px,5vw,64px)}
.wof-shop__empty{margin:0;text-align:center;font-size:17px;color:rgba(16,16,16,.6)}
.wof-shop .woocommerce-notices-wrapper:not(:empty){margin:0 0 32px}

/* product cards */
.wof-pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 24px}
/* a single product (e.g. the English shop: only the e-book) sits centered */
.wof-pgrid:has(> .wof-pcard:only-child){grid-template-columns:minmax(0,440px);justify-content:center}
.wof-pcard,
.wof-pcard:hover,
.wof-pcard:focus{display:flex;flex-direction:column;gap:18px;color:var(--wof-dark);text-decoration:none}
.wof-pcard-img{display:flex;align-items:center;justify-content:center;height:clamp(300px,29vw,420px);padding:clamp(28px,4vw,56px);border-radius:28px;background:var(--wof-frame);
  transition:background-color .25s ease,transform .45s var(--wof-ease)}
.wof-pcard:hover .wof-pcard-img{background:var(--wof-gold-soft);transform:scale(1.03)}
.wof-pcard-img .wof-pcard-photo{display:block;width:auto;height:auto;max-width:100%;max-height:100%;border-radius:10px;box-shadow:0 20px 40px -20px rgba(16,16,16,.4)}
.wof-pcard-info{display:flex;flex-direction:column;gap:4px}
.wof-pgrid .wof-pcard-name{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:clamp(22px,2vw,26px);line-height:1.2;letter-spacing:-.2px;color:var(--wof-dark);margin:0 !important}
.wof-pcard-price{font-size:15px;font-weight:700;color:var(--wof-muted)}
.wof-pcard-price .amount{color:inherit}
.wof-pcard-price del{margin-right:6px;opacity:.6}
.wof-pcard-price ins{text-decoration:none}

@media (max-width:991px){
  .wof-product-grid{grid-template-columns:1fr}
  .wof-product-summary{max-width:none}
  .wof-pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:767px){
  .wof-pgrid{grid-template-columns:1fr}
}
@media (max-width:479px){
  .wof-product-media{flex-direction:column-reverse}
  .wof-product-thumbs{flex-direction:row;flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){
  .wof-product-page .wof-product-title{animation:none}
  .wof-pcard-img{transition:none}
}