/*
 * R13 final polish pass
 * - Swap decorative leaf system to a premium transparent red maple leaf.
 * - Fix accordion-title rotation bug.
 * - Replace awkward dual-section center imagery with better date-based packs.
 * - Strengthen contrast and copy protection across homepage/cards/panels.
 */
:root{
  --mhf-leaf-image:url('../decor/maple-leaf-premium.svg');
  --mhf-copy-panel:rgba(255,250,241,.88);
  --mhf-copy-panel-dark:rgba(6,27,20,.58);
  --mhf-copy-border:rgba(9,36,27,.08);
}

/* Use the new client-requested maple leaf style site-wide. */
.mhf-leaf-drift span,
.page-hero:before,
.page-hero:after,
.page-hero-visual:after,
.v4-hero:before,
.v4-world:before,
.v4-closing-panel:before,
.product-card:after,
.faq-item:after,
.contact-info:after,
.form-aside:after,
.application-step:after,
.wholesale-product-tile:after,
.fulfilment-item:after,
.scope-item:after,
.vision-cell:after,
.name-row:after,
.shipping-notice:after,
.newsletter-inner:after,
.role-row:after,
.product-purchase-card:after,
.product-details-card:after,
.product-help-card:before,
.product-help-card:after,
.product-main-media-v10:after,
.v4-brand-story:after,
.site-footer:before,
.site-footer:after,
.section-green:after{
  -webkit-mask:none!important;
  mask:none!important;
  background:transparent center/contain no-repeat var(--mhf-leaf-image)!important;
}
.mhf-leaf-drift{z-index:0!important}
.mhf-leaf-drift .leaf-a{opacity:.12!important}
.mhf-leaf-drift .leaf-b{opacity:.1!important}
.mhf-leaf-drift .leaf-c{opacity:.08!important}
.mhf-leaf-drift .leaf-d{opacity:.08!important}
.mhf-leaf-drift .leaf-e{opacity:.07!important}
.mhf-leaf-drift .leaf-f{opacity:.06!important}

/* Category cards and closing panels get an actual readable copy panel. */
.v4-world-copy,
.v4-closing-panel>div{
  position:relative!important;
  z-index:14!important;
  padding:20px 22px!important;
  border-radius:22px!important;
  backdrop-filter:blur(8px)!important;
  border:1px solid var(--mhf-copy-border)!important;
  box-shadow:0 16px 36px rgba(9,36,27,.08)!important;
}
.v4-world-maamoul .v4-world-copy,
.v4-world-pantry .v4-world-copy,
.v4-store-panel>div{
  background:var(--mhf-copy-panel)!important;
}
.v4-world-fun .v4-world-copy,
.v4-private-panel>div{
  background:var(--mhf-copy-panel-dark)!important;
  border-color:rgba(255,255,255,.14)!important;
  box-shadow:0 22px 44px rgba(0,0,0,.18)!important;
}
.v4-world-copy small,
.v4-world-copy h3,
.v4-world-copy>span,
.v4-closing-panel span,
.v4-closing-panel h2,
.v4-closing-panel p,
.v4-closing-panel b{opacity:1!important}
.v4-world-copy h3{font-size:clamp(28px,2.3vw,36px)!important;line-height:1.06!important}
.v4-world-copy>span,
.v4-closing-panel b{display:inline-flex!important;align-items:center!important;gap:6px!important;padding:11px 15px!important;border-radius:999px!important;font-size:12px!important;font-weight:700!important;letter-spacing:.01em!important}
.v4-world-maamoul .v4-world-copy>span,
.v4-world-pantry .v4-world-copy>span,
.v4-store-panel b{background:#fff!important;color:var(--green)!important;border:1px solid rgba(9,36,27,.1)!important}
.v4-world-fun .v4-world-copy>span,
.v4-private-panel b{background:rgba(255,255,255,.12)!important;color:#fff!important;border:1px solid rgba(255,255,255,.2)!important}
.v4-world-maamoul:after,
.v4-world-pantry:after,
.v4-world-fun:after,
.v4-store-panel:before,
.v4-private-panel:before{background:linear-gradient(90deg,rgba(255,250,241,.92) 0%,rgba(255,250,241,.82) 34%,rgba(255,250,241,0) 70%)!important;z-index:7!important}
.v4-world-fun:after,
.v4-private-panel:before{background:linear-gradient(90deg,rgba(5,21,16,.86) 0%,rgba(5,21,16,.74) 34%,rgba(5,21,16,0) 72%)!important}
.v4-world img{z-index:4!important}
.v4-closing-panel img{z-index:4!important}

/* Retail/wholesale bridge section redesign */
.v4-dual-wrap{align-items:stretch!important;gap:18px!important}
.v4-dual-copy{box-shadow:0 20px 44px rgba(9,36,27,.08)!important}
.v4-dual-center{background:linear-gradient(180deg,#f8f1e2 0%,#efe3c5 44%,#0a231b 44%,#0f3127 100%)!important;border-radius:32px!important;min-height:520px!important;overflow:hidden!important;box-shadow:0 20px 46px rgba(9,36,27,.12)!important}
.v4-dual-center:before{left:50%!important;top:12%!important;bottom:12%!important;width:1px!important;height:auto!important;background:rgba(246,212,129,.45)!important}
.v4-dual-center:after{content:'';position:absolute;inset:auto 50% 28px auto;width:180px;height:180px;background:transparent center/contain no-repeat var(--mhf-leaf-image);opacity:.08;transform:translateX(50%) rotate(-10deg)}
.v4-dual-center img{filter:drop-shadow(0 28px 36px rgba(0,0,0,.22))!important}
.dual-date-primary{width:332px!important;left:50%!important;top:12%!important;transform:translateX(-50%) rotate(-4deg)!important}
.dual-date-secondary{width:286px!important;left:50%!important;bottom:9%!important;transform:translateX(-50%) rotate(4deg)!important}

/* Product details accordion bug: icon should rotate, not the question text. */
.accordion-item.open .accordion-q span,
.faq-item.open .faq-q span:first-child{transform:none!important}
.product-accordion-v10 .accordion-q b,
.faq-q span:last-child,
.faq-q > span:only-child{transition:transform .22s ease,background .22s ease,color .22s ease!important}
.product-accordion-v10 .accordion-item.open .accordion-q b{transform:rotate(45deg)!important}
.faq-item.open .faq-q span:last-child,
.faq-item.open .faq-q > span:only-child{transform:rotate(45deg)!important}

/* Strengthen supporting contrast more. */
.v4-store-panel h2,.v4-store-panel b{color:var(--green)!important}
.v4-store-panel p,.v4-world-maamoul .v4-world-copy small,.v4-world-pantry .v4-world-copy small{color:#4b5d54!important}
.v4-private-panel p,.v4-world-fun .v4-world-copy p{color:rgba(255,255,255,.88)!important}
.v4-brand-copy p,.v4-business-side p,.v4-retail-side p,.v4-hero-copy>p,.v4-hero-meta span{opacity:1!important}
.product-details-card,.product-help-card,.product-purchase-card{box-shadow:0 18px 42px rgba(9,36,27,.07)!important}
.product-details-card .accordion-a{color:#4f5f56!important}

/* Shop/product cards a bit more premium and contained. */
.product-card,.product-detail-v10 .product-fact,.product-assurance-item,.faq-item,.contact-info,.form-aside,.application-step,.fulfilment-item,.scope-item,.role-row,.shipping-notice{border-color:rgba(9,36,27,.09)!important}
.product-card .product-media{padding:20px!important}
.product-card .product-body{padding-top:4px!important}
.product-card .product-title{font-size:22px!important;line-height:1.16!important}

/* Mobile cleanup for the bridge section and copy readability. */
@media (max-width:960px){
  .v4-world-copy,
  .v4-closing-panel>div{padding:18px 18px!important;border-radius:18px!important}
  .v4-world-copy h3{font-size:28px!important}
  .v4-dual-wrap{grid-template-columns:1fr!important}
  .v4-dual-center{order:2;min-height:280px!important;background:linear-gradient(90deg,#f8f1e2 0%,#efe3c5 46%,#0a231b 46%,#0f3127 100%)!important}
  .v4-dual-center:before{top:12%!important;bottom:12%!important;left:50%!important;right:auto!important;width:1px!important;height:auto!important}
  .dual-date-primary{width:240px!important;top:18px!important;left:50%!important;transform:translateX(-50%) rotate(-3deg)!important}
  .dual-date-secondary{width:200px!important;bottom:14px!important;left:50%!important;transform:translateX(-50%) rotate(3deg)!important}
}
@media (max-width:640px){
  .v4-world{min-height:460px!important}
  .v4-world-pantry,.v4-world-fun{min-height:420px!important}
  .v4-world-copy{left:18px!important;right:18px!important;top:18px!important;max-width:calc(100% - 36px)!important}
  .v4-closing-panel{min-height:420px!important;padding:22px!important}
  .v4-closing-panel>div{max-width:calc(100% - 20px)!important}
  .v4-store-panel img{width:70%!important;right:-8%!important;bottom:-6%!important}
  .v4-private-panel img{width:78%!important;right:-13%!important;bottom:-7%!important}
  .v4-dual-center{min-height:220px!important;border-radius:22px!important}
  .v4-dual-center:after{display:none!important}
  .dual-date-primary{width:172px!important;top:16px!important}
  .dual-date-secondary{width:146px!important;bottom:12px!important}
  .mhf-leaf-drift .leaf-a,.mhf-leaf-drift .leaf-b,.mhf-leaf-drift .leaf-c,.mhf-leaf-drift .leaf-d,.mhf-leaf-drift .leaf-e,.mhf-leaf-drift .leaf-f{opacity:.045!important}
}
@media (prefers-reduced-motion:reduce){
  .dual-date-primary,.dual-date-secondary{animation:none!important}
}