/* =========================================================
   SANTTY — Efeitos especiais premium (landing page)
   Discretos, performáticos e respeitam prefers-reduced-motion.
   ========================================================= */

:root{
  --fx-mx:50vw;
  --fx-my:24vh;
  --fx-green:32,240,68;
  --fx-gold:216,184,117;
}

/* Luz ambiente que acompanha o ponteiro no desktop */
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:0;
  background:
    radial-gradient(520px circle at var(--fx-mx) var(--fx-my),rgba(var(--fx-green),.055),transparent 48%),
    radial-gradient(320px circle at calc(var(--fx-mx) + 80px) calc(var(--fx-my) - 70px),rgba(var(--fx-gold),.028),transparent 58%);
  transition:opacity .35s ease;
}
html.fx-pointer body::before{opacity:1}
body>header,body>main,body>footer,body>.mobile-bottom,body>.wa-drag-float,body>.toast{position:relative;z-index:1}

/* Linha de progresso de leitura */
.fx-scroll-progress{
  position:fixed;
  z-index:9990;
  left:0;top:0;
  width:100%;height:2px;
  pointer-events:none;
  background:rgba(255,255,255,.025);
}
.fx-scroll-progress>i{
  display:block;height:100%;width:100%;
  transform:scaleX(0);transform-origin:0 50%;
  background:linear-gradient(90deg,#0ba52a,#2cf14d 62%,#d8b875);
  box-shadow:0 0 12px rgba(32,240,68,.5);
  will-change:transform;
}

/* Header com reflexo muito sutil */
.site-header{overflow:visible}
.site-header::after{
  content:"";
  position:absolute;
  left:-30%;bottom:-1px;
  width:28%;height:1px;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(32,240,68,.75),rgba(216,184,117,.5),transparent);
  filter:blur(.15px);
  animation:fxHeaderSweep 9s ease-in-out infinite;
}
@keyframes fxHeaderSweep{0%,18%{left:-30%;opacity:0}28%{opacity:.8}55%{opacity:.45}70%,100%{left:105%;opacity:0}}

/* Marca com brilho orgânico, sem exagero */
.brand-official .brand-crown-original,
.brand-official .brand-wordmark-original>img{
  transition:filter .45s ease,transform .45s cubic-bezier(.2,.8,.2,1);
}
.brand-official:hover .brand-crown-original{
  transform:translateY(-1px) rotate(-2deg) scale(1.035);
  filter:drop-shadow(0 0 14px rgba(32,240,68,.22));
}
.brand-official:hover .brand-wordmark-original>img{
  transform:translateX(2px);
  filter:drop-shadow(0 0 12px rgba(32,240,68,.16));
}

/* Hero: halo vivo + brilho percorrendo a foto */
.hero{isolation:isolate}
.hero::before{
  content:"";
  position:absolute;
  z-index:-1;
  width:720px;height:720px;
  right:-300px;top:-250px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(32,240,68,.075),rgba(32,240,68,.018) 38%,transparent 68%);
  animation:fxHeroAura 9s ease-in-out infinite alternate;
  pointer-events:none;
}
@keyframes fxHeroAura{from{transform:translate3d(-18px,-8px,0) scale(.95);opacity:.62}to{transform:translate3d(22px,18px,0) scale(1.08);opacity:1}}
.hero-leaf{will-change:transform;animation:fxLeafDrift 11s ease-in-out infinite alternate}
.hero-leaf-b{animation-duration:14s;animation-direction:alternate-reverse}
@keyframes fxLeafDrift{from{translate:0 0;scale:.96}to{translate:18px -14px;scale:1.04}}

.hero-photo{
  isolation:isolate;
  transform:translateZ(0);
  box-shadow:0 32px 90px rgba(0,0,0,.38),0 0 0 1px rgba(255,255,255,.018);
}
.hero-photo::before{
  content:"";
  position:absolute;inset:0;z-index:2;
  pointer-events:none;
  background:linear-gradient(110deg,transparent 22%,rgba(255,255,255,.045) 42%,rgba(216,184,117,.08) 49%,transparent 60%);
  transform:translateX(-135%);
  animation:fxPhotoSheen 8.5s cubic-bezier(.3,.1,.2,1) infinite;
  mix-blend-mode:screen;
}
.hero-photo::after{
  content:"";
  position:absolute;inset:0;z-index:3;
  pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(216,184,117,.13),inset 0 -90px 100px rgba(1,8,3,.18);
}
@keyframes fxPhotoSheen{0%,62%{transform:translateX(-135%)}78%{transform:translateX(135%)}100%{transform:translateX(135%)}}
.hero-photo>img{
  transform:scale(1.025) translate3d(var(--hero-x,0px),var(--hero-y,0px),0);
  transition:transform .45s cubic-bezier(.2,.8,.2,1);
  will-change:transform;
}
.hero h1 em{
  text-shadow:0 0 0 rgba(32,240,68,0);
  animation:fxGreenBreath 5.2s ease-in-out infinite;
}
@keyframes fxGreenBreath{0%,100%{text-shadow:0 0 0 rgba(32,240,68,0)}50%{text-shadow:0 0 24px rgba(32,240,68,.11)}}

/* Partículas elegantes do hero */
.fx-particles{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.fx-particles i{
  position:absolute;
  width:3px;height:3px;border-radius:50%;
  background:rgba(216,184,117,.62);
  box-shadow:0 0 10px rgba(32,240,68,.35);
  opacity:0;
  animation:fxParticleFloat var(--dur,8s) ease-in-out var(--delay,0s) infinite;
}
.fx-particles i:nth-child(even){background:rgba(32,240,68,.52)}
@keyframes fxParticleFloat{
  0%{transform:translate3d(0,22px,0) scale(.55);opacity:0}
  22%{opacity:.7}
  68%{opacity:.35}
  100%{transform:translate3d(var(--drift,18px),-88px,0) scale(1.1);opacity:0}
}

/* Revelação real no scroll */
html.fx-ready .fx-reveal-item{
  opacity:0;
  transform:translate3d(0,24px,0) scale(.992);
  filter:blur(4px);
  transition:
    opacity .75s cubic-bezier(.2,.75,.2,1),
    transform .75s cubic-bezier(.2,.75,.2,1),
    filter .65s ease;
  transition-delay:var(--fx-delay,0ms);
}
html.fx-ready .fx-reveal-item.fx-inview{
  opacity:1;
  transform:none;
  filter:blur(0);
}

/* Títulos: linha de ouro/verde que nasce ao entrar */
.section-heading h2,.google-proof-copy h2,.about-copy h2,.cta-inner h2{
  position:relative;
}
.section-heading h2::after,.google-proof-copy h2::after,.about-copy h2::after{
  content:"";
  display:block;
  width:48px;height:1px;
  margin-top:13px;
  background:linear-gradient(90deg,#d8b875,#20f044,transparent);
  transform:scaleX(.08);transform-origin:left;
  opacity:.28;
  transition:transform .9s cubic-bezier(.2,.8,.2,1),opacity .7s ease;
}
.fx-inview .section-heading h2::after,
.google-proof-copy.fx-inview h2::after,
.about-copy.fx-inview h2::after{transform:scaleX(1);opacity:.78}

/* Botões: reflexo premium */
.btn-primary,.promotion-public-footer a,.product-add,.bottom-book{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.btn-primary::after,.promotion-public-footer a::after,.product-add::after{
  content:"";
  position:absolute;z-index:-1;
  top:-30%;bottom:-30%;left:-45%;width:26%;
  transform:skewX(-18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.26),transparent);
  opacity:0;
}
.btn-primary:hover::after,.promotion-public-footer a:hover::after,.product-add:hover::after{
  animation:fxButtonSweep .78s ease;
}
@keyframes fxButtonSweep{0%{left:-45%;opacity:0}15%{opacity:.5}100%{left:125%;opacity:0}}

/* Cartões com luz interna e tilt controlado via JS */
.service-card,.catalog-service-card,.product-card,.before-after-card,.real-review-card,
.google-rating-card,.availability-card,.promotion-public-card,.contact-card{
  --fx-rx:0deg;--fx-ry:0deg;--fx-lx:50%;--fx-ly:50%;
  transform-style:preserve-3d;
}
[data-fx-tilt]{
  transform:perspective(900px) rotateX(var(--fx-rx)) rotateY(var(--fx-ry)) translateY(var(--fx-lift,0px));
  transition:transform .22s ease,border-color .3s ease,box-shadow .3s ease;
  will-change:transform;
}
[data-fx-tilt]::before{
  content:"";
  position:absolute;inset:0;z-index:4;
  pointer-events:none;border-radius:inherit;
  background:radial-gradient(240px circle at var(--fx-lx) var(--fx-ly),rgba(255,255,255,.06),rgba(32,240,68,.022) 35%,transparent 67%);
  opacity:0;transition:opacity .25s ease;
}
[data-fx-tilt]:hover::before{opacity:1}
.service-card[data-fx-tilt]:hover,.product-card[data-fx-tilt]:hover,.promotion-public-card[data-fx-tilt]:hover{--fx-lift:-4px}

/* Antes/depois: divisor com pulso discreto */
.before-after-card [class*="handle"],.before-after-card [class*="divider"]{
  filter:drop-shadow(0 0 8px rgba(32,240,68,.18));
}

/* Prova social e números ganham contraste quando entram */
.hero-highlights>div,.authority-proof-grid>*{
  transition:border-color .35s ease,background .35s ease,transform .35s ease;
}
.hero-highlights>div:hover,.authority-proof-grid>*:hover{
  transform:translateY(-2px);
  border-color:rgba(216,184,117,.28);
  background-color:rgba(32,240,68,.025);
}

/* CTA final com onda de luz lenta */
.cta-band{position:relative;overflow:hidden;isolation:isolate}
.cta-band::before{
  content:"";position:absolute;inset:-80% -25%;z-index:-1;pointer-events:none;
  background:conic-gradient(from 100deg,transparent,rgba(32,240,68,.07),transparent 28%,rgba(216,184,117,.045),transparent 56%);
  animation:fxCtaOrbit 18s linear infinite;
}
@keyframes fxCtaOrbit{to{transform:rotate(1turn)}}

/* Desktop */
@media (hover:hover) and (pointer:fine) and (min-width:901px){
  .hero-visual{transform:translate3d(var(--hero-box-x,0px),var(--hero-box-y,0px),0);transition:transform .5s cubic-bezier(.2,.8,.2,1);will-change:transform}
}

/* Mobile: efeitos bonitos mas leves */
@media(max-width:900px){
  body::before{display:none}
  .site-header::after{animation-duration:12s}
  .hero::before{width:430px;height:430px;right:-245px;top:-120px;opacity:.62}
  .hero-leaf{animation-duration:15s}
  html.fx-ready .fx-reveal-item{transform:translate3d(0,15px,0);filter:none;transition-duration:.58s}
  [data-fx-tilt]{transform:none!important}
  [data-fx-tilt]::before{display:none}
  .cta-band::before{animation-duration:24s}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}
  html.fx-ready .fx-reveal-item{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}
  .hero-photo>img,.hero-visual,[data-fx-tilt]{transform:none!important;transition:none!important}
  .fx-scroll-progress{display:none}
}


/* =========================================================
   ENTRADA PROFISSIONAL — PRELOADER SANTTY
   Usa a marca oficial e some assim que a página está pronta.
   ========================================================= */
body.site-is-loading{overflow:hidden}
.site-loader{
  position:fixed;inset:0;z-index:100000;
  display:grid;place-items:center;
  background:
    radial-gradient(700px circle at 50% 42%,rgba(32,240,68,.075),transparent 53%),
    radial-gradient(520px circle at 50% 58%,rgba(216,184,117,.045),transparent 62%),
    #020503;
  opacity:1;visibility:visible;
  transition:opacity .7s cubic-bezier(.22,.8,.24,1),visibility .7s step-end;
  overflow:hidden;
  animation:siteLoaderFailsafe .01s linear 6s forwards;
}
.site-loader::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.26;
  background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.014) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(circle at center,#000 0%,transparent 72%);mask-image:radial-gradient(circle at center,#000 0%,transparent 72%);
}
.site-loader.is-leaving{opacity:0;visibility:hidden;pointer-events:none}
.site-loader-center{position:relative;z-index:2;width:min(82vw,360px);display:flex;flex-direction:column;align-items:center;text-align:center;transform:translateY(-2vh)}
.site-loader-brand{display:flex;align-items:center;justify-content:center;gap:13px;min-height:86px;animation:siteLoaderBrandIn .95s cubic-bezier(.16,.8,.24,1) both}
.site-loader-crown{width:75px;height:66px;object-fit:contain;filter:drop-shadow(0 0 20px rgba(32,240,68,.18));animation:siteLoaderCrown 2.6s ease-in-out infinite}
.site-loader-word{width:176px;height:58px;object-fit:contain;filter:drop-shadow(0 0 16px rgba(32,240,68,.12))}
.site-loader-copy{display:flex;flex-direction:column;align-items:center;gap:5px;margin-top:17px;animation:siteLoaderCopyIn .9s .18s cubic-bezier(.2,.8,.2,1) both}
.site-loader-copy strong{font-family:Georgia,serif;font-size:18px;font-weight:500;letter-spacing:.02em;color:#eef4ee}
.site-loader-copy span{font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.22em;color:#829087}
.site-loader-line{position:relative;width:100%;height:2px;margin-top:24px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.055);box-shadow:inset 0 0 0 1px rgba(255,255,255,.012)}
.site-loader-line i{position:absolute;inset:0;width:42%;border-radius:inherit;background:linear-gradient(90deg,transparent,#1bd83c 38%,#69f47d 66%,#d8b875 88%,transparent);box-shadow:0 0 14px rgba(32,240,68,.38);animation:siteLoaderLine 1.35s cubic-bezier(.45,0,.2,1) infinite}
.site-loader-dots{display:flex;gap:7px;margin-top:17px}
.site-loader-dots i{width:4px;height:4px;border-radius:50%;background:#20f044;box-shadow:0 0 8px rgba(32,240,68,.42);opacity:.22;animation:siteLoaderDot 1.05s ease-in-out infinite}
.site-loader-dots i:nth-child(2){animation-delay:.14s}.site-loader-dots i:nth-child(3){animation-delay:.28s}
.site-loader-ambient{position:absolute;width:min(94vw,560px);aspect-ratio:1;left:50%;top:50%;translate:-50% -50%;pointer-events:none}
.site-loader-ambient i{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(32,240,68,.06);animation:siteLoaderRing 3.8s ease-out infinite}
.site-loader-ambient i:nth-child(2){inset:13%;animation-delay:1.05s;border-color:rgba(216,184,117,.055)}
.site-loader-ambient i:nth-child(3){inset:26%;animation-delay:2.1s}
@keyframes siteLoaderBrandIn{from{opacity:0;transform:translateY(15px) scale(.97);filter:blur(5px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes siteLoaderCopyIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes siteLoaderCrown{0%,100%{transform:translateY(0);filter:drop-shadow(0 0 12px rgba(32,240,68,.12))}50%{transform:translateY(-3px);filter:drop-shadow(0 0 25px rgba(32,240,68,.24))}}
@keyframes siteLoaderLine{0%{transform:translateX(-115%)}65%,100%{transform:translateX(270%)}}
@keyframes siteLoaderDot{0%,100%{opacity:.18;transform:scale(.75)}50%{opacity:.95;transform:scale(1.15)}}
@keyframes siteLoaderRing{0%{opacity:0;transform:scale(.72)}34%{opacity:.6}100%{opacity:0;transform:scale(1.08)}}
@keyframes siteLoaderFailsafe{to{opacity:0;visibility:hidden;pointer-events:none}}
@media(max-width:760px){
  .site-loader-center{width:min(78vw,315px);transform:translateY(-4vh)}
  .site-loader-brand{gap:9px;min-height:72px}.site-loader-crown{width:62px;height:55px}.site-loader-word{width:150px;height:50px}
  .site-loader-copy{margin-top:14px}.site-loader-copy strong{font-size:16px}.site-loader-copy span{font-size:8px;letter-spacing:.18em}
  .site-loader-line{margin-top:21px}.site-loader-ambient{width:118vw}
}
@media(prefers-reduced-motion:reduce){
  .site-loader,.site-loader *{animation:none!important}
  .site-loader{transition:opacity .18s ease,visibility .18s step-end}
  .site-loader-line i{width:100%;transform:none;background:linear-gradient(90deg,#20f044,#d8b875)}
}
