/* =========================================================
   OPUS — Página inicial renovada (hero animado + secções)
   Carrega depois de style.css e só afeta body.home-modern.
========================================================= */
.home-modern{
  --oh-green:#006837;--oh-green-dark:#004F2A;--oh-ink:#17382a;
  --oh-orange:#F7931E;--oh-coral:#F05A24;--oh-teal:#00A99D;--oh-yellow:#FBB03B;
  --oh-cream:#F5F4EE;--oh-sand:#DBBA95;--oh-brown:#503414;
  --oh-ease:cubic-bezier(.2,.8,.2,1);
}

/* ---------- HERO ---------- */
.home-modern .opus-hero{
  position:relative;isolation:isolate;overflow:hidden;
  min-height:max(700px,100svh);
  padding:150px 0 130px;
  display:flex;align-items:center;
  background:linear-gradient(180deg,#fcf7ee 0%,#f7f3ea 55%,#f3efe6 100%);
}
.oh-bg{position:absolute;inset:0;z-index:-1;pointer-events:none}
.oh-blob{position:absolute;border-radius:58% 42% 61% 39%/45% 55% 45% 55%;filter:blur(64px);opacity:.75;will-change:transform,border-radius;
  animation:ohMorph 18s ease-in-out infinite alternate,ohDrift 26s ease-in-out infinite alternate}
.oh-blob-a{width:640px;height:640px;right:-120px;top:-60px;background:radial-gradient(circle at 30% 30%,#ffb066,#F05A24 70%);opacity:.5}
.oh-blob-b{width:560px;height:560px;left:-180px;bottom:-140px;background:radial-gradient(circle at 60% 40%,#6fe0d2,#00A99D 72%);opacity:.38;animation-delay:-6s}
.oh-blob-c{width:420px;height:420px;left:38%;top:30%;background:radial-gradient(circle,#ffe08a,#FBB03B 70%);opacity:.34;animation-delay:-11s}
.oh-confetti{position:absolute;inset:0;width:100%;height:100%;opacity:.55}
.oh-confetti circle{animation:ohTwinkle 5s ease-in-out infinite}
.oh-confetti circle:nth-child(2n){animation-delay:-1.6s}.oh-confetti circle:nth-child(3n){animation-delay:-3.1s}

.oh-inner{width:min(1240px,92%);margin:0 auto;display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:48px;align-items:center}

.oh-pill{display:inline-flex;align-items:center;gap:10px;padding:9px 16px 9px 12px;border-radius:999px;background:rgba(255,255,255,.78);
  backdrop-filter:blur(8px);border:1px solid rgba(0,104,55,.14);box-shadow:0 8px 26px rgba(80,52,20,.08);
  font:700 12px/1 "Montserrat",Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--oh-green-dark);
  opacity:0;animation:ohFade .8s .1s var(--oh-ease) forwards}
.oh-pill i{width:9px;height:9px;border-radius:50%;background:var(--oh-coral);box-shadow:0 0 0 0 rgba(240,90,36,.55);animation:ohPulse 2.2s infinite}

.oh-title{margin:22px 0 0;font:800 clamp(46px,6.1vw,96px)/.98 "Montserrat",Arial,sans-serif;letter-spacing:-.045em;color:var(--oh-ink)}
.oh-line{display:block;overflow:hidden;padding:.04em 0 .1em}
.oh-line:not(.oh-line-rot)>span:first-child{display:block;transform:translateY(112%);animation:ohRise 1s .25s var(--oh-ease) forwards}
.oh-line-rot{position:relative;display:block;overflow:visible}
.oh-rotator{position:relative;display:inline-block;height:1.12em;vertical-align:bottom;overflow:hidden;white-space:nowrap;
  transform:translateY(112%);animation:ohRise 1s .45s var(--oh-ease) forwards;transition:width .65s var(--oh-ease)}
.oh-word{position:absolute;left:0;top:0;display:block;opacity:0;transform:translateY(60%) rotate(2deg);filter:blur(6px);
  background:linear-gradient(95deg,var(--oh-coral) 0%,var(--oh-orange) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  padding-right:.06em;transition:opacity .55s var(--oh-ease),transform .7s var(--oh-ease),filter .55s var(--oh-ease)}
.oh-word:first-child{position:relative}
.oh-word.is-active{opacity:1;transform:none;filter:none}
.oh-word.is-leaving{opacity:0;transform:translateY(-60%) rotate(-2deg);filter:blur(6px)}
.oh-stroke{position:absolute;left:0;bottom:-.06em;height:.3em;width:var(--stroke-w,60%);overflow:visible;pointer-events:none;transition:width .65s var(--oh-ease)}
.oh-stroke path{fill:none;stroke:var(--oh-yellow);stroke-width:9;stroke-linecap:round;stroke-dasharray:520;stroke-dashoffset:520;opacity:.9;animation:ohDraw 1.2s 1.1s var(--oh-ease) forwards}
.oh-stroke.redraw path{animation:none;stroke-dashoffset:520}

.oh-lead{max-width:540px;margin:26px 0 0;font:500 clamp(16px,1.35vw,19px)/1.7 "Montserrat",Arial,sans-serif;color:#5b4a37;opacity:0;animation:ohFade .9s .95s var(--oh-ease) forwards}
.oh-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px;opacity:0;animation:ohFade .9s 1.1s var(--oh-ease) forwards}
.oh-btn{position:relative;display:inline-flex;align-items:center;gap:12px;padding:17px 28px;border-radius:999px;text-decoration:none;
  font:700 15px/1 "Montserrat",Arial,sans-serif;letter-spacing:.01em;transition:transform .3s var(--oh-ease),box-shadow .3s,background .3s,color .3s;overflow:hidden}
.oh-btn-primary{background:linear-gradient(110deg,var(--oh-green) 0%,var(--oh-green-dark) 100%);color:#fff;box-shadow:0 16px 34px rgba(0,79,42,.32)}
.oh-btn-primary::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);transform:translateX(-120%);animation:ohShine 4.5s 2.4s infinite}
.oh-btn-primary b{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.18);font-weight:700;transition:transform .3s var(--oh-ease)}
.oh-btn-primary:hover{transform:translateY(-3px);box-shadow:0 22px 40px rgba(0,79,42,.38)}
.oh-btn-primary:hover b{transform:translateX(4px)}
.oh-btn-ghost{background:rgba(255,255,255,.7);color:var(--oh-ink);border:2px solid rgba(23,56,42,.16);backdrop-filter:blur(6px)}
.oh-btn-ghost:hover{transform:translateY(-3px);background:#fff;border-color:var(--oh-coral);color:var(--oh-coral)}
.oh-btn:focus-visible,.oh-canvas:focus-visible,.oh-scroll:focus-visible{outline:3px solid var(--oh-orange);outline-offset:3px}

.oh-trust{list-style:none;display:flex;flex-wrap:wrap;gap:12px 22px;margin:34px 0 0;padding:0;opacity:0;animation:ohFade .9s 1.3s var(--oh-ease) forwards}
.oh-trust li{display:inline-flex;align-items:center;gap:9px;font:600 13.5px/1 "Montserrat",Arial,sans-serif;color:#5b4a37}
.oh-trust li>span:first-child{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#fff;box-shadow:0 6px 16px rgba(80,52,20,.1);font-size:16px}

/* ---------- PALCO DE TELAS ---------- */
.oh-stage{position:relative;width:100%;aspect-ratio:1/1.04;min-height:500px;max-height:720px;margin-left:auto}
.oh-ring{position:absolute;inset:7% 3%;border-radius:50%;border:2px dashed rgba(0,104,55,.28);animation:ohSpin 50s linear infinite}
.oh-ring-2{inset:20% 16%;border:2px solid rgba(240,90,36,.2);animation-duration:34s;animation-direction:reverse}
.oh-canvas{position:absolute;display:block;text-decoration:none;color:inherit;
  translate:calc(var(--px,0)*var(--d,20)*1px) calc(var(--py,0)*var(--d,20)*1px);
  animation:ohFloat 7s var(--fd,0s) ease-in-out infinite;will-change:transform,translate}
.oh-frame{position:relative;display:block;aspect-ratio:4/5;background:#fff;padding:9px;border-radius:10px;overflow:hidden;
  box-shadow:0 2px 0 rgba(255,255,255,.7) inset,0 30px 60px -18px rgba(80,52,20,.42),0 10px 22px rgba(80,52,20,.16);transition:transform .5s var(--oh-ease),box-shadow .5s;animation:ohCanvasIn 1.1s var(--in,.5s) var(--oh-ease) backwards}
.oh-frame img{display:block;width:100%;height:100%;object-fit:cover;border-radius:4px;background:linear-gradient(135deg,#f7dcc0,#e9c9a4);transition:opacity .6s var(--oh-ease),transform 1.2s var(--oh-ease),filter .6s}
.oh-frame img.is-swapping{opacity:0;transform:scale(1.08);filter:blur(8px)}
.oh-frame::after{content:"";position:absolute;inset:9px;border-radius:4px;background:linear-gradient(115deg,rgba(255,255,255,0) 40%,rgba(255,255,255,.35) 50%,rgba(255,255,255,0) 60%);transform:translateX(-120%);transition:transform .9s var(--oh-ease);pointer-events:none}
.oh-canvas:hover .oh-frame{transform:scale(1.04);box-shadow:0 40px 70px -20px rgba(80,52,20,.5),0 12px 26px rgba(80,52,20,.2)}
.oh-canvas:hover .oh-frame::after{transform:translateX(120%)}
.oh-cap{position:absolute;left:50%;bottom:-16px;transform:translate(-50%,10px);display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 16px;border-radius:14px;background:#fff;box-shadow:0 12px 28px rgba(80,52,20,.18);
  white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .3s,transform .4s var(--oh-ease);max-width:92%}
.oh-cap b{font:700 12.5px/1.2 "Montserrat",Arial,sans-serif;color:var(--oh-ink);overflow:hidden;text-overflow:ellipsis;max-width:100%}
.oh-cap em{font:700 12px/1 "Montserrat",Arial,sans-serif;color:var(--oh-coral);font-style:normal}
.oh-canvas:hover .oh-cap,.oh-canvas:focus-visible .oh-cap{opacity:1;transform:translate(-50%,0)}
.oh-cap:empty{display:none}

.oh-c2{left:25%;top:0;width:51%;rotate:3deg;--d:34;--in:.55s;--fd:.2s;z-index:3;animation-duration:8s}
.oh-c1{left:-1%;top:27%;width:41%;rotate:-9deg;--d:20;--in:.8s;--fd:1.4s;z-index:2;animation-duration:7s}
.oh-c3{right:-1%;top:35%;width:41%;rotate:8deg;--d:14;--in:1.05s;--fd:2.2s;z-index:2;animation-duration:9s}

.oh-chip{position:absolute;z-index:4;display:inline-flex;align-items:center;gap:9px;padding:11px 16px;border-radius:999px;background:rgba(255,255,255,.88);backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.9);box-shadow:0 16px 36px rgba(80,52,20,.16);font:700 12.5px/1.2 "Montserrat",Arial,sans-serif;color:var(--oh-ink);white-space:nowrap;
  translate:calc(var(--px,0)*var(--d,40)*1px) calc(var(--py,0)*var(--d,40)*1px);opacity:0;animation:ohFade .9s 1.5s var(--oh-ease) forwards,ohFloat 6s 2s ease-in-out infinite}
.oh-chip>span:first-child{font-size:18px}
.oh-chip-a{left:-2%;bottom:9%;--d:46}
.oh-chip-b{right:0;top:4%;--d:30;animation-delay:1.7s,2.4s}
.oh-palette{position:absolute;right:6%;bottom:6%;z-index:4;display:flex;gap:9px;padding:11px 14px;border-radius:999px;background:rgba(255,255,255,.88);box-shadow:0 14px 30px rgba(80,52,20,.16);
  translate:calc(var(--px,0)*var(--d,60)*1px) calc(var(--py,0)*var(--d,60)*1px);opacity:0;animation:ohFade .9s 1.9s var(--oh-ease) forwards}
.oh-palette i{width:20px;height:20px;border-radius:50%;background:var(--c);box-shadow:inset 0 -3px 0 rgba(0,0,0,.14);animation:ohBob 2.4s ease-in-out infinite}
.oh-palette i:nth-child(2){animation-delay:-.4s}.oh-palette i:nth-child(3){animation-delay:-.8s}.oh-palette i:nth-child(4){animation-delay:-1.2s}.oh-palette i:nth-child(5){animation-delay:-1.6s}

.oh-scroll{position:absolute;left:50%;bottom:78px;transform:translateX(-50%);width:26px;height:42px;border-radius:14px;border:2px solid rgba(23,56,42,.35);display:grid;justify-items:center;padding-top:8px;opacity:0;animation:ohFade 1s 2.2s forwards}
.oh-scroll span{width:4px;height:9px;border-radius:3px;background:var(--oh-coral);animation:ohScroll 1.8s ease-in-out infinite}

/* ---------- PROMOÇÕES (antigo carrossel do hero, editável no Admin) ---------- */
.home-modern .home-promo{position:relative;z-index:5;padding:0 0 26px;background:#f3efe6;margin-top:0}
.home-modern .promo-slider{position:relative;width:min(1240px,92%);height:clamp(170px,21vw,290px);margin:-62px auto 0;border-radius:30px;overflow:hidden;cursor:pointer;
  background:#e9e3d6;box-shadow:0 30px 60px -20px rgba(80,52,20,.38),0 0 0 6px rgba(255,255,255,.9);transform:translateZ(0)}
.home-modern .promo-slider .hero-slide{border-radius:inherit}
.home-modern .promo-slider .hero-arrow{width:44px;height:44px;background:rgba(255,255,255,.9);color:var(--oh-ink);border:0;border-radius:50%;box-shadow:0 8px 20px rgba(0,0,0,.18);transition:transform .25s,background .25s,color .25s}
.home-modern .promo-slider .hero-arrow:hover{background:var(--oh-coral);color:#fff;transform:translateY(-50%) scale(1.08)}
.home-modern .promo-slider .hero-prev{left:16px}.home-modern .promo-slider .hero-next{right:16px}
.home-modern .promo-slider .hero-dots{left:50%;transform:translateX(-50%);bottom:14px;gap:7px}
.home-modern .promo-slider .hero-dot{width:9px;height:9px;border-radius:999px;background:rgba(255,255,255,.85);box-shadow:0 2px 6px rgba(0,0,0,.25);transition:width .3s var(--oh-ease),background .3s}
.home-modern .promo-slider .hero-dot.active{width:28px;background:var(--oh-coral)}

/* ---------- INTRODUÇÃO ---------- */
.home-modern .intro{position:relative;background:#f3efe6;padding-top:56px;padding-bottom:68px}
.home-modern .intro h2{letter-spacing:-.03em}
.home-modern .intro .section-label{display:inline-block;padding:7px 14px;border-radius:999px;background:rgba(240,90,36,.1);color:var(--oh-coral)}

/* ---------- CARTÕES ---------- */
.home-modern .home-product-card,.home-modern .random-product-card,.home-modern .home-category-card,.home-modern .category-card{
  transition:transform .45s var(--oh-ease),box-shadow .45s var(--oh-ease)!important;border-radius:22px;overflow:hidden}
.home-modern .home-product-card:hover,.home-modern .random-product-card:hover,.home-modern .home-category-card:hover,.home-modern .category-card:hover{
  transform:translateY(-8px)!important;box-shadow:0 30px 54px -20px rgba(80,52,20,.38)!important}
.home-modern .home-product-image img,.home-modern .home-category-image img{transition:transform .9s var(--oh-ease)!important}
.home-modern .home-product-card:hover .home-product-image img,.home-modern .home-category-card:hover img,.home-modern .category-card:hover img{transform:scale(1.07)}
.home-modern .home-section-link{position:relative;transition:color .25s,transform .25s}
.home-modern .home-section-link span{display:inline-block;transition:transform .3s var(--oh-ease)}
.home-modern .home-section-link:hover span{transform:translateX(6px)}
.home-modern .section-label{letter-spacing:.2em}

/* ---------- BENEFÍCIOS / MANIFESTO ---------- */
.home-modern .benefit{transition:transform .45s var(--oh-ease),background .3s,box-shadow .45s var(--oh-ease)}
.home-modern .benefit:hover{transform:translateY(-8px)}
.home-modern .benefit-icon{animation:ohBob 3.4s ease-in-out infinite}
.home-modern .benefit:nth-child(2) .benefit-icon{animation-delay:-1.1s}.home-modern .benefit:nth-child(3) .benefit-icon{animation-delay:-2.2s}
.home-modern .manifesto{position:relative;overflow:hidden}
.home-modern .manifesto blockquote{position:relative;z-index:1}
.home-modern .manifesto::after{content:"“";position:absolute;left:50%;top:-40px;transform:translateX(-50%);font:800 360px/1 Georgia,serif;color:rgba(240,90,36,.09);pointer-events:none}

/* ---------- REVELAR AO ROLAR ---------- */
.oh-js .oh-rv{opacity:0;translate:0 34px;transition:opacity .9s var(--oh-ease),translate .9s var(--oh-ease);transition-delay:var(--rv-d,0s)}
.oh-js .oh-rv.in{opacity:1;translate:0 0}

/* ---------- KEYFRAMES ---------- */
@keyframes ohRise{to{transform:none}}
@keyframes ohFade{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes ohDraw{to{stroke-dashoffset:0}}
@keyframes ohCanvasIn{from{opacity:0;transform:translateY(70px) scale(.9) rotate(4deg)}to{opacity:1;transform:none}}
@keyframes ohFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes ohBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes ohSpin{to{transform:rotate(360deg)}}
@keyframes ohPulse{0%{box-shadow:0 0 0 0 rgba(240,90,36,.5)}70%{box-shadow:0 0 0 10px rgba(240,90,36,0)}100%{box-shadow:0 0 0 0 rgba(240,90,36,0)}}
@keyframes ohShine{0%,70%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
@keyframes ohMorph{0%{border-radius:58% 42% 61% 39%/45% 55% 45% 55%}50%{border-radius:40% 60% 44% 56%/58% 42% 58% 42%}100%{border-radius:55% 45% 38% 62%/40% 60% 40% 60%}}
@keyframes ohDrift{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(40px,30px,0) scale(1.08)}}
@keyframes ohTwinkle{0%,100%{opacity:.25;transform:scale(1)}50%{opacity:1;transform:scale(1.6)}}
@keyframes ohScroll{0%{transform:translateY(0);opacity:1}80%{transform:translateY(14px);opacity:0}100%{opacity:0}}

/* ---------- RESPONSIVO ---------- */
@media(max-width:1020px){
  .home-modern .opus-hero{padding:120px 0 110px;min-height:0}
  .oh-inner{grid-template-columns:1fr;gap:26px}
  .oh-copy{text-align:center}
  .oh-title{font-size:clamp(52px,10vw,88px)}
  .oh-lead{margin-left:auto;margin-right:auto}
  .oh-cta,.oh-trust{justify-content:center}
  .oh-stage{width:min(560px,100%);margin:0 auto;min-height:0}
  .oh-scroll{display:none}
}
@media(max-width:620px){
  .home-modern .opus-hero{padding:104px 0 96px}
  .oh-title{font-size:clamp(40px,12.5vw,58px)}
  .oh-pill{font-size:10px;letter-spacing:.1em;padding:8px 13px 8px 10px;text-align:left}
  .oh-btn{padding:15px 22px;font-size:14px;width:100%;justify-content:center}
  .oh-cta{flex-direction:column}
  .oh-trust{gap:10px 14px}.oh-trust li{font-size:12.5px}
  .oh-trust li>span:first-child{width:30px;height:30px;font-size:14px}
  .oh-stage{aspect-ratio:1/1.12}
  .oh-chip{padding:8px 12px;font-size:11px}.oh-chip>span:first-child{font-size:15px}
  .oh-chip-b{display:none}.oh-chip-a{left:0;bottom:4%}
  .oh-palette{right:2%;bottom:2%;padding:9px 11px}.oh-palette i{width:16px;height:16px}
  .home-modern .promo-slider{margin-top:-52px;height:clamp(120px,34vw,190px);border-radius:22px;box-shadow:0 24px 44px -18px rgba(80,52,20,.38),0 0 0 4px rgba(255,255,255,.9)}
  .home-modern .promo-slider .hero-arrow{width:34px;height:34px;font-size:14px}
  .home-modern .promo-slider .hero-prev{left:8px}.home-modern .promo-slider .hero-next{right:8px}
  .home-modern .manifesto::after{font-size:240px}
}
@media(prefers-reduced-motion:reduce){
  .oh-blob,.oh-ring,.oh-confetti circle,.oh-palette i,.home-modern .benefit-icon,.oh-btn-primary::after,.oh-scroll span,.oh-pill i{animation:none!important}
  .oh-canvas{animation:none!important}.oh-frame{animation:none!important}.oh-chip{animation:ohFade .01s forwards!important}
  .oh-pill,.oh-lead,.oh-cta,.oh-trust,.oh-palette,.oh-scroll{animation:ohFade .01s forwards!important}
  .oh-line:not(.oh-line-rot)>span:first-child,.oh-rotator{animation:ohRise .01s forwards!important}
  .oh-stroke path{animation:ohDraw .01s forwards!important}
  .oh-js .oh-rv{opacity:1;translate:none;transition:none}
}

/* parallax de fundo/texto (definido por js/home-motion.js) */
.oh-bg{translate:0 calc(var(--sy,0)*.16px)}
.oh-copy{translate:0 calc(var(--sy,0)*-.05px)}
.oh-line-rot{margin-top:-.14em}