/* Texto legível por padrão: nenhum conteúdo depende de JS para ficar visível. */
.motion-toggle {
  display:inline-flex;align-items:center;gap:7px;margin-left:16px;padding:5px 9px;
  border:1px solid #f4ddd878;border-radius:20px;background:#ffffff0c;color:inherit;
  font:inherit;font-size:9px;cursor:pointer;vertical-align:middle;white-space:nowrap;
}
.motion-toggle::before {content:'';width:6px;height:6px;border-radius:50%;background:#d6c296;box-shadow:0 0 0 3px #d6c29622;flex:none}
body.motion-active .motion-toggle::before {animation:motion-status 1.5s ease-in-out infinite}
.motion-toggle:focus-visible {outline:2px solid #fff;outline-offset:3px}
.motion-toggle[hidden] {display:none!important}
.letter-word,.word-token {display:inline-block;white-space:nowrap}
.letter-char {display:inline-block}
.letter-char,.word-token {opacity:1;transform:none;filter:none}
/* Entrada escalonada seguida de movimento contínuo, visível em todos os títulos. */
body.motion-active .letter-motion.text-entering .letter-char {
  animation-name:letter-enter,letter-dance;
  animation-duration:850ms,2.35s;
  animation-timing-function:cubic-bezier(.16,.8,.2,1),ease-in-out;
  animation-iteration-count:1,infinite;
  animation-fill-mode:both,none;
  animation-delay:var(--text-delay,0ms),calc(1250ms + var(--text-delay,0ms));
}
body.motion-active .word-motion.text-entering .word-token {
  animation:word-enter 850ms cubic-bezier(.16,.8,.2,1) both;
  animation-delay:var(--text-delay,0ms);
}
.hero h1 em {position:relative;display:inline-block}
.hero h1 em::after {
  content:'';position:absolute;left:0;right:0;bottom:-.1em;height:3px;
  background:linear-gradient(90deg,var(--gold),#d8b6a9);transform-origin:left;border-radius:3px;
}
body.motion-active .hero h1 em::after {animation:underline-breathe 2.8s ease-in-out infinite}
body.motion-active .hero-photo img {animation:hero-pan 6s ease-in-out infinite alternate}
body.motion-active .experience {animation:visible-float 2.8s ease-in-out infinite}
body.motion-active .hero:after {animation:slow-spin 12s linear infinite}
body.motion-active .hero-actions .text-link svg {animation:scroll-cue 1.4s ease-in-out infinite}
body.motion-active .hero-actions {animation:copy-arrive 1s .8s both var(--ease)}
/* Revelação também é temporária: sem classes de ocultação permanente. */
body.motion-active .reveal {opacity:1;transform:none;transition:none}
body.motion-active .reveal.is-in-view {animation:section-enter 1000ms var(--ease) both}
body.motion-active .reveal.delay-1 {animation-delay:.12s}
body.motion-active .reveal.delay-2 {animation-delay:.24s}
body.motion-active .reveal.delay-3 {animation-delay:.36s}
body.motion-active .photo-motion img {clip-path:none}
body.motion-active .photo-motion.is-photo-visible img {
  animation:photo-reveal 1.15s var(--ease) both,photo-drift 5s ease-in-out infinite alternate;
  animation-delay:var(--photo-delay,0ms),calc(1.15s + var(--photo-delay,0ms));
}
body.motion-active .hero-photo.is-photo-visible img {
  animation:photo-reveal 1.15s var(--ease) both,hero-pan 6s ease-in-out infinite alternate;
}
.button {position:relative;overflow:hidden;isolation:isolate}
.button::after {
  content:'';position:absolute;z-index:0;top:-40%;bottom:-40%;left:-80%;width:45%;
  pointer-events:none;transform:skewX(-22deg);background:linear-gradient(90deg,transparent,#ffffff66,transparent);
}
body.motion-active .button::after {animation:button-shine 3.8s ease-in-out infinite}
.button > * {position:relative;z-index:1}
body.motion-active .ribbon-track {animation:marquee 16s linear infinite}
@keyframes letter-enter {
  0% {opacity:0;transform:translate3d(0,.95em,0) rotate(9deg);filter:blur(5px)}
  65% {opacity:1;filter:blur(0)}
  100% {opacity:1;transform:translate3d(0,0,0) rotate(0);filter:blur(0)}
}
@keyframes word-enter {
  0% {opacity:0;transform:translate3d(0,24px,0);filter:blur(3px)}
  100% {opacity:1;transform:translate3d(0,0,0);filter:blur(0)}
}
@keyframes letter-dance {0%,100%{transform:translateY(0) rotate(0) scale(1)}35%{transform:translateY(-.15em) rotate(-4deg) scale(1.08)}70%{transform:translateY(.02em) rotate(1deg) scale(1)}}
@keyframes section-enter {from{opacity:.2;transform:translate3d(0,42px,0)}to{opacity:1;transform:none}}
@keyframes photo-reveal {from{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0)}}
@keyframes underline-breathe {0%,100%{transform:scaleX(.6);opacity:.45}50%{transform:scaleX(1);opacity:1}}
@keyframes visible-float {0%,100%{transform:translateY(5px) rotate(-3deg)}50%{transform:translateY(-16px) rotate(3deg)}}
@keyframes hero-pan {from{transform:scale(1.03) translateX(-1%)}to{transform:scale(1.15) translateX(1%)}}
@keyframes photo-drift {from{transform:scale(1.03) translate(-.6%,0)}to{transform:scale(1.14) translate(.7%,-1%)}}
@keyframes scroll-cue {0%,100%{transform:translateY(-3px)}50%{transform:translateY(7px)}}
@keyframes copy-arrive {from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
@keyframes button-shine {0%,15%{left:-80%}55%,100%{left:150%}}
@keyframes motion-status {0%,100%{box-shadow:0 0 0 2px #d6c29622}50%{box-shadow:0 0 0 5px #d6c29633}}
body.motion-paused *,body.motion-paused *::before,body.motion-paused *::after {animation:none!important;transition:none!important}
body.motion-paused .reveal,body.motion-paused .letter-char,body.motion-paused .word-token {opacity:1!important;transform:none!important;filter:none!important}
body.motion-paused .photo-motion img {clip-path:none!important}
body.motion-paused .hero h1 em::after {display:none}
@media(max-width:700px) {
  .demo-banner .motion-toggle {display:flex;width:max-content;margin:5px auto 0;font-size:8px;padding:4px 9px}
}
@media(prefers-reduced-motion:reduce) {
  html{scroll-behavior:auto}
  body:not(.motion-active) *,body:not(.motion-active) *::before,body:not(.motion-active) *::after {animation:none!important;transition:none!important}
}

/* v7: o título usa Web Animations, sem corrida de classes/observer. */
body.motion-active .hero h1.letter-motion .letter-char {animation:none!important;transform-origin:50% 80%;will-change:transform;backface-visibility:hidden}
.hero h1 {overflow:visible}
.hero .motion-toggle {
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:44px;margin:3px 0 20px;padding:11px 18px;
  border:1px solid var(--wine);border-radius:30px;background:var(--wine);color:#fffdf9;
  font:600 12px/1.3 Arial,Helvetica,sans-serif;cursor:pointer;box-shadow:0 5px 18px #4c293418;
}
.hero .motion-toggle::before {content:'▶';display:inline-block;width:auto;height:auto;border-radius:0;background:none;box-shadow:none;color:#ebd4b2;font-size:11px;animation:none!important}
.hero .motion-toggle:focus-visible {outline:3px solid var(--gold);outline-offset:4px}
@media(max-width:700px) {
  .hero .motion-toggle {font-size:12px;margin:6px 0 17px;padding:11px 18px}
}


/* v8: animações automáticas, contínuas e mais lentas; movimento reduzido não as desliga. */
body.motion-active .letter-motion.text-entering .letter-char {
  animation-duration:5.4s!important;
}
body.motion-active .hero-photo img {
  animation-duration:15s!important;
}
body.motion-active .photo-motion.is-photo-visible img {
  animation-duration:1.5s,12.5s!important;
}
body.motion-active .hero-photo.is-photo-visible img {
  animation-duration:1.5s,15s!important;
}
body.motion-active .ribbon-track {
  animation-duration:30s!important;
}
body.motion-active .experience {animation-duration:6.8s!important}
body.motion-active .sparkle {animation-duration:4.8s!important}
body.motion-active .review-icon {animation-duration:6.5s!important}
body.motion-active .review-status:before {animation-duration:3.8s!important}
body.motion-active .hero h1 em::after {animation-duration:5.5s!important}
@media(prefers-reduced-motion:reduce) {
  /* Respeita o pedido por movimento visível, com ciclos ainda mais suaves. */
  body.motion-active .letter-motion.text-entering .letter-char {animation-duration:7s!important}
  body.motion-active .photo-motion.is-photo-visible img {animation-duration:1.8s,16s!important}
  body.motion-active .hero-photo.is-photo-visible img {animation-duration:1.8s,18s!important}
  body.motion-active .ribbon-track {animation-duration:38s!important}
}