/* MOZACA GROUP V6 — finishing details; preserve the approved desktop/mobile hero illustration. */
html{scroll-behavior:smooth}
button,a{-webkit-tap-highlight-color:transparent}
/* Real visible switch of the prominent product: the original image stays fully visible for Prosmaz. */
.visual-hero .hero-feature{
  display:block!important;z-index:6;left:44.0%;top:12%;width:28%;height:68%;
  opacity:1;visibility:visible;transform:translateY(0);
  transition:opacity .42s ease,visibility .42s ease,transform .52s cubic-bezier(.2,.8,.2,1)
}
.visual-hero .hero-feature[data-current="prosmaz"]{opacity:0;visibility:hidden;transform:translateY(10px)}
.visual-hero .hero-feature:before{
  content:"";position:absolute;inset:-1% -3%;border-radius:46%;
  backdrop-filter:blur(29px);-webkit-backdrop-filter:blur(29px);
  background:radial-gradient(ellipse at center,rgba(235,249,226,.97) 0%,rgba(237,249,228,.96) 43%,rgba(230,246,218,.79) 62%,rgba(220,242,210,.3) 83%,transparent 100%);
  -webkit-mask-image:radial-gradient(ellipse at center,black 0 51%,transparent 100%);
  mask-image:radial-gradient(ellipse at center,black 0 51%,transparent 100%);
}
.visual-hero .hero-feature-panel{position:relative;opacity:1!important;visibility:visible!important;transform:none!important;background:none!important;justify-content:center;gap:0}
.visual-hero .hero-feature-panel img{height:87%;width:87%;object-fit:contain;animation:mozacaFloating 5.8s ease-in-out infinite;filter:drop-shadow(9px 16px 14px rgba(39,64,26,.3))}
.visual-hero .feature-text{position:absolute;bottom:2.5%;max-width:82%;padding:8px 18px;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);border:1px solid #d7eacb;box-shadow:0 8px 20px #335b2933;border-radius:13px;transform:none}
.visual-hero .feature-text span{color:#507450;font-size:clamp(7px,.65vw,10px)}
.visual-hero .feature-text strong{color:#214c33;font-size:clamp(10px,1.2vw,17px)}
.hero-view-featured{position:absolute;z-index:10;top:78%;left:50%;transform:translateX(-50%);background:#1c652a;color:white;border:1px solid #e0f1ce;border-radius:50px;padding:10px 15px;display:flex;gap:8px;align-items:center;justify-content:center;font-size:clamp(9px,.89vw,13px);font-weight:800;box-shadow:0 9px 24px #102e2345;cursor:pointer;white-space:nowrap;line-height:1.15;transition:background .2s,transform .2s}
.hero-view-featured:hover{background:#174720;transform:translateX(-50%) translateY(-2px)}
.hero-view-featured[hidden]{display:none!important}
.hero-view-featured .ico{height:16px;width:16px}
/* The approved hero includes embedded navigation. Place the distributor access in open scenery, above product cards. */
.hero-distributor-cta{position:absolute;z-index:9;top:10.75%;left:81.4%;width:16.8%;min-height:4.4%;display:flex;align-items:center;justify-content:center;gap:6px;line-height:1.2;text-align:center;text-decoration:none;font-size:clamp(9px,.92vw,15px);font-weight:800;color:#1f632d;border-radius:32px;border:1px solid #b9de9d;background:rgba(251,255,245,.94);box-shadow:0 3px 20px #1f512e25;transition:transform .22s,background .22s}
.hero-distributor-cta:hover{background:white;transform:translateY(-2px)}
.hero-distributor-cta .ico{height:16px;width:16px;flex-shrink:0}
/* Selections highlighted without hiding labels of the reference artwork. */
.visual-hero .hero-pick.is-active{box-shadow:inset 0 0 0 2px #69b02f,0 0 18px rgba(81,153,40,.23);border-color:transparent;border-radius:16px}
.visual-hero .hero-pick:focus-visible{outline:3px solid #226d35;outline-offset:3px}
/* Natural light, floating leaves and unobtrusive shimmer. */
.hero-light-sweep{position:absolute;z-index:3;left:42%;top:9%;width:39%;height:70%;pointer-events:none;opacity:.4;mix-blend-mode:screen;background:radial-gradient(ellipse at 50% 50%,#fffaad75 0%,transparent 65%);animation:mozacaGlow 8s ease-in-out infinite}
.hero-shine{z-index:4;transform:translate(var(--shine-x,0),var(--shine-y,0));will-change:transform}
.visual-hero .particle-a{left:40%;top:13%;font-size:28px}
.visual-hero .particle-b{left:95%;top:75%;font-size:26px}
.visual-hero .particle-c{left:72%;top:61%;font-size:19px}
.visual-hero .particle-d{left:73%;top:16%;font-size:31px;opacity:.5;animation-delay:-4s}
.visual-hero .particle-e{left:88%;top:80%;font-size:22px;color:#fffcd6;animation-delay:-1s}
@keyframes mozacaGlow{0%,100%{opacity:.15;transform:scale(.98)}50%{opacity:.53;transform:scale(1.06)}}
@keyframes mozacaFloating{0%,100%{transform:translateY(3px) rotate(-.35deg)}50%{transform:translateY(-8px) rotate(.5deg)}}
/* Clear but subtle distributor route under the hero (easy to find on mobile). */
.distributor-strip{background:#edf7e5;border-bottom:1px solid #d5e5cb}
.distributor-strip-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:11px 0;line-height:1.4}
.distributor-strip-inner span{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:750;color:#396840}
.distributor-strip-inner a{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:800;color:#246b2c;text-underline-offset:4px}
.distributor-strip-inner .ico{width:16px;height:16px}
/* Links in sticky menu and mobile menu. */
.header .desktop-nav .nav-distributor{font-weight:800;color:#27743f;display:flex;gap:3px;align-items:center;white-space:nowrap}
.header .desktop-nav .nav-distributor .ico{width:14px;height:14px}
.header .desktop-nav{gap:clamp(8px,1.35vw,19px)}
.header .desktop-nav a{font-size:clamp(10px,.95vw,13px)}
.mobile-nav a:last-child{color:#2a8133;font-weight:800}
.hero-menu-panel .hero-menu-distributor{color:#277834!important}
/* Cards gently respond to hover; details and add buttons stay accessible. */
.product-card{transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s ease}
@media(hover:hover) and (pointer:fine){.product-card:hover{transform:translateY(-5px);box-shadow:0 22px 42px #173f191a}.product-card .product-image img{transition:transform .45s ease}.product-card:hover .product-image img{transform:scale(1.045)}}
/* Pixel consent is hidden until the merchant configures a real Pixel ID. */
.pixel-consent[hidden]{display:none!important}
.pixel-consent{position:fixed;z-index:1000;bottom:18px;left:50%;transform:translateX(-50%);width:min(650px,calc(100% - 32px));background:white;border:1px solid #d9e7d1;border-radius:18px;padding:17px 20px;box-shadow:0 12px 48px #0b301c55;display:flex;align-items:center;justify-content:space-between;gap:16px;line-height:1.45}
.pixel-consent strong{font-size:14px;color:#214d30}.pixel-consent p{margin:3px 0 0;font-size:12px;color:#4e6657}
.pixel-consent-actions{display:flex;gap:8px;flex-shrink:0}.pixel-consent-actions button{border-radius:11px;border:1px solid #d4e0d0;background:#f4f8f1;padding:9px 13px;color:#245b35;font-weight:700;cursor:pointer}.pixel-consent-actions #pixelAccept{background:#246d34;color:white}
@media(max-width:1150px){.header .desktop-nav{gap:8px}.header .desktop-nav a{font-size:11px}.nav-right .nav-contact{display:none}}
@media(max-width:850px) and (min-width:701px){.header .desktop-nav .nav-distributor{font-size:10px}.hero-distributor-cta{font-size:9px}.hero-distributor-cta .ico{display:none}}
@media(max-width:700px){
  .visual-hero .hero-feature{left:30%;top:36.4%;width:45%;height:35.4%}
  .visual-hero .hero-feature:before{inset:-3% -8%;background:radial-gradient(ellipse at center,rgba(234,249,224,.98) 0%,rgba(237,248,226,.96) 50%,rgba(230,246,213,.67) 76%,transparent 100%)}
  .visual-hero .hero-feature-panel img{height:90%;width:90%;filter:drop-shadow(4px 8px 8px #213b2750)}
  .visual-hero .feature-text{bottom:0%;padding:3px 10px;max-width:90%;border-radius:8px}
  .visual-hero .feature-text span{font-size:6px}
  .visual-hero .feature-text strong{font-size:10px}
  .hero-view-featured{top:71%;left:51%;padding:6px 11px;font-size:10px;box-shadow:0 4px 9px #21512544}
  .hero-view-featured .ico{width:12px;height:12px}
  .hero-distributor-cta{display:none}
  .visual-hero .hero-pick.is-active{border-radius:12px;box-shadow:inset 0 0 0 2px #68ac30,0 0 12px #3b812943}
  .visual-hero .particle-a{left:74%;top:39%;font-size:18px}
  .visual-hero .particle-b{left:7%;top:63%;font-size:18px}
  .visual-hero .particle-d{left:72%;top:66%;font-size:16px}
  .visual-hero .particle-e{left:18%;top:84%;font-size:15px}
  .hero-light-sweep{left:14%;top:38%;width:70%;height:38%}
  .distributor-strip-inner{padding:11px 0;flex-direction:column;align-items:center;gap:5px;text-align:center}
  .distributor-strip-inner span{font-size:11px}.distributor-strip-inner a{font-size:12px}
  .pixel-consent{bottom:75px;display:block}.pixel-consent-actions{margin-top:11px;justify-content:flex-end}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}.visual-hero .hero-feature-panel img,.visual-hero .hero-light-sweep,.visual-hero .leaf-particle,.visual-hero .hero-shine{animation:none!important}.visual-hero .hero-feature,.product-card{transition:none!important}}

/* The bag count baked into the reference artwork is covered by a live accessible count. */
.hero-live-count{position:absolute;z-index:10;left:93.8%;top:4.9%;width:clamp(15px,1.9vw,26px);height:clamp(15px,1.9vw,26px);display:grid;place-items:center;transform:translate(-50%,-50%);border-radius:50%;background:#318800;color:#fff;font-weight:800;font-size:clamp(10px,.94vw,13px);line-height:1;box-shadow:0 1px 5px #164c2055;pointer-events:none}
@media(max-width:700px){.hero-live-count{left:77.6%;top:2.17%;width:clamp(13px,3.6vw,19px);height:clamp(13px,3.6vw,19px);font-size:11px}}
/* Some decorative original V5 sections extend a few pixels beyond their container. */
html,body{overflow-x:clip}
