/* Direção visual exclusiva da home institucional. */
.home-evolution {
  overflow-x: clip;
}
.home-evolution .hero {
  position: relative;
  background: radial-gradient(ellipse at 75% 45%, #b99ad8 0, transparent 58%), #d4c9de;
}
.home-evolution .hero-grid {
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  padding-top: 48px;
  padding-bottom: 0;
  align-items: center;
}
.home-evolution .hero-copy {
  padding-bottom: 45px;
  position: relative;
  z-index: 2;
}
.home-evolution .hero h1 {
  font-size: clamp(52px, 4.8vw, 74px);
}
.home-evolution .hero-description {
  margin-top: 22px;
}
.home-evolution .hero-people {
  height: 760px;
  position: relative;
  align-self: end;
  isolation: isolate;
  min-width: 0;
}
.hero-cutout {
  position: absolute;
  bottom: 0;
  left: -4%;
  width: 112%;
  max-width: none;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  z-index: 2;
  filter: drop-shadow(12px 8px 22px #35136512);
}

.hero-ring {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}
.hero-ring-purple {
  width: 510px;
  height: 510px;
  border: 55px solid #732cc7;
  top: 18%;
  left: 1%;
  opacity: 0.65;
}
.hero-ring-coral {
  width: 450px;
  height: 450px;
  border: 30px solid var(--coral);
  left: 15%;
  top: 36%;
  z-index: 1;
}
.hero-people-caption {
  position: absolute;
  left: -18px;
  bottom: 80px;
  z-index: 3;
  padding: 18px 24px;
  border-left: 3px solid var(--coral);
  background: #e4daeceb;
  backdrop-filter: blur(12px);
  border-radius: 0 12px 12px 0;
  color: var(--dark);
  font-size: 14px;
  line-height: 1.7;
  box-shadow: 0 15px 40px #35136512;
}
.hero-people-caption strong {
  font-weight: 500;
  font-size: 17px;
}
.hero-orbit-dot {
  position: absolute;
  right: 3%;
  top: 23%;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--coral);
  z-index: 3;
  animation: brand-float 6s ease-in-out infinite;
}
.home-evolution .hero-strip {
  position: relative;
  z-index: 4;
  padding-block: 26px;
  border-color: #ad96c3;
}
.intro-band {
  background: #e4c9c3;
  position: relative;
}
.intro-band .intro {
  padding-block: 105px;
}
.home-evolution .team-art {
  max-width: 530px;
}
.home-evolution .team-art-circle {
  border-radius: 36% 36% 48% 48%;
}
.home-evolution .principles {
  border-color: #b58eaa;
  gap: 30px;
}
.home-evolution .principles article {
  border-left: 2px solid #bd8caa;
  padding-left: 22px;
}
.home-evolution .principles article > span {
  color: var(--dark);
}
.video-band {
  position: relative;
  background: #241039;
  color: #fff;
  overflow: hidden;
}
.video-band::before {
  content: "";
  position: absolute;
  width: 420px;
  height: 420px;
  border: 55px solid #732cc7;
  border-radius: 50%;
  left: -240px;
  bottom: -240px;
  opacity: 0.35;
}
.home-evolution .video-section {
  border: 0;
  padding-block: 95px;
  position: relative;
  gap: 70px;
}
.video-band .eyebrow {
  color: #ff9a80;
}
.video-band .video-copy > p:not(.eyebrow) {
  color: #d9cce5;
}
.video-band .text-link,
.video-band .video-external {
  color: #ffad96;
}
.video-band .video-frame {
  box-shadow: 0 24px 65px #0005;
  border: 1px solid #ffffff25;
}
.home-evolution .solutions {
  background: #c8b9d6;
  padding-block: 105px;
}
.home-evolution .solution-panel {
  box-shadow: 0 15px 35px #35136510;
}
.home-evolution .journey {
  padding-block: 105px;
}
.home-evolution .journey-grid {
  gap: 30px;
}
.journey-photo {
  aspect-ratio: 1.55;
  overflow: hidden;
  border-radius: 16px;
  margin-bottom: 30px;
  background: #c8b9d6;
}
.journey-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}
.journey-grid article:hover .journey-photo img {
  transform: scale(1.045);
}
.journey-grid article:nth-child(3) .journey-photo img {
  object-position: center;
}
.home-evolution .experience-wide {
  position: relative;
  min-height: 660px;
  isolation: isolate;
  background: #251039;
  overflow: hidden;
}
.experience-scene {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 62% center;
  max-width: none;
  z-index: -3;
}
.experience-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    #251039 0%,
    #251039f5 28%,
    #251039cb 43%,
    #25103928 67%,
    transparent 85%
  );
  z-index: -2;
}
.experience-wide-content {
  min-height: 660px;
  display: flex;
  align-items: center;
  padding-block: 80px;
  position: relative;
}
.experience-copy {
  max-width: 470px;
}
.home-evolution .experience-copy h2 {
  font-size: clamp(36px, 3.4vw, 49px);
}
.home-evolution .experience-copy > p:not(.eyebrow) {
  font-size: 15px;
  line-height: 1.85;
  margin: 25px 0 30px;
  color: #e0d3ec;
}
.experience-history {
  display: flex;
  flex-direction: column;
  border-top: 1px solid #ffffff35;
  margin-top: 40px;
  padding-top: 22px;
  gap: 4px;
}
.experience-history strong {
  font-size: 27px;
  color: #ff9a80;
  font-weight: 500;
  letter-spacing: -0.8px;
}
.experience-history span {
  font-size: 13px;
  color: #e0d3ec;
}
.home-evolution .faq {
  padding-block: 100px;
}
.home-evolution .closing {
  background: #e3b6aa;
  padding-block: 65px;
  border-radius: 24px;
}
.home-evolution .closing::after {
  opacity: 0.3;
}
.home-evolution footer {
  background: #29133f;
  color: #fff;
  border: 0;
}
.home-evolution footer p,
.home-evolution .footer-top > div > a:not(.brand),
.home-evolution .footer-bottom {
  color: #d8c9e4;
}
.home-evolution .footer-bottom {
  border-color: #ffffff25;
}
.home-evolution footer .brand {
  background: #e4daec;
  padding: 9px 12px;
  border-radius: 8px;
}
[data-motion] {
  transform: translate3d(0, var(--motion-y, 0px), 0) rotate(var(--motion-turn, 0deg))
    scale(var(--motion-scale, 1));
  transform-origin: center;
}
.experience-scene[data-motion] {
  transform: translate3d(0, var(--motion-y, 0px), 0) scale(var(--motion-scale, 1.08));
}
.motion-ready [data-reveal] {
  transition:
    opacity 0.75s ease,
    translate 0.75s cubic-bezier(0.2, 0.7, 0.2, 1);
  transition-delay: var(--reveal-delay, 0ms);
}
.motion-ready [data-reveal]:not(.in-view) {
  opacity: 0;
  translate: 0 26px;
}
.motion-ready [data-reveal].in-view {
  opacity: 1;
  translate: 0 0;
}
@keyframes brand-float {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-18px);
  }
}
@media (min-width: 1600px) {
  .home-evolution .hero-people {
    height: 790px;
  }
  .experience-wide-content,
  .home-evolution .experience-wide {
    min-height: 720px;
  }
  .experience-copy {
    max-width: 500px;
  }
}
@media (max-width: 1100px) {
  .home-evolution .hero-people {
    height: 730px;
  }
  .hero-ring-purple {
    width: 420px;
    height: 420px;
    left: -5%;
  }
  .hero-ring-coral {
    width: 380px;
    height: 380px;
    left: 8%;
  }
  .hero-people-caption {
    left: 0;
    bottom: 70px;
    padding: 14px 18px;
  }
  .hero-people-caption strong {
    font-size: 15px;
  }
  .home-evolution .hero h1 {
    font-size: 57px;
  }
  .experience-copy {
    max-width: 420px;
  }
  .experience-shade {
    background: linear-gradient(90deg, #251039 0%, #251039eb 36%, #25103970 65%, #25103910 100%);
  }
}
@media (max-width: 800px) {
  .home-evolution .hero-grid {
    grid-template-columns: 1fr;
    padding-top: 40px;
    gap: 0;
  }
  .home-evolution .hero-copy {
    max-width: 600px;
    padding-bottom: 15px;
  }
  .home-evolution .hero h1 {
    font-size: 62px;
  }
  .home-evolution .hero-people {
    height: 610px;
    width: 100%;
    max-width: 530px;
    justify-self: center;
    margin-top: 0;
  }
  .hero-cutout {
    width: 100%;
    left: 0;
  }
  .hero-ring-purple {
    width: 400px;
    height: 400px;
    left: 10%;
    top: 18%;
  }
  .hero-ring-coral {
    width: 350px;
    height: 350px;
    left: 20%;
    top: 35%;
  }
  .hero-people-caption {
    left: 0;
    bottom: 45px;
  }
  .intro-band .intro,
  .home-evolution .solutions,
  .home-evolution .journey,
  .home-evolution .faq {
    padding-block: 70px;
  }
  .home-evolution .video-section {
    padding-block: 70px;
    gap: 35px;
  }
  .home-evolution .journey-grid {
    gap: 20px;
  }
  .journey-photo {
    aspect-ratio: 1.1;
  }
  .experience-wide-content {
    min-height: 800px;
    align-items: flex-start;
    padding-top: 60px;
    padding-bottom: 310px;
  }
  .home-evolution .experience-wide {
    min-height: 800px;
  }
  .experience-copy {
    max-width: 530px;
  }
  .experience-scene {
    object-position: 68% bottom;
    height: 65%;
    top: auto;
    bottom: -15px;
  }
  .experience-shade {
    background: linear-gradient(180deg, #251039 0%, #251039 39%, #251039b0 58%, transparent 82%);
  }
  .experience-history {
    margin-top: 25px;
    padding-top: 18px;
  }
  .experience-history strong {
    font-size: 23px;
  }
}
@media (max-width: 480px) {
  .home-evolution .hero h1 {
    font-size: 51px;
  }
  .home-evolution .hero-people {
    height: 510px;
  }
  .hero-ring-purple {
    width: 300px;
    height: 300px;
    border-width: 35px;
    left: 3%;
    top: 23%;
  }
  .hero-ring-coral {
    width: 280px;
    height: 280px;
    border-width: 22px;
    left: 15%;
    top: 40%;
  }
  .hero-people-caption {
    font-size: 12px;
    bottom: 25px;
    left: 0;
    padding: 12px 15px;
  }
  .hero-people-caption strong {
    font-size: 14px;
  }
  .hero-orbit-dot {
    right: 6%;
    top: 18%;
    width: 17px;
    height: 17px;
  }
  .home-evolution .hero-strip > div {
    font-size: 13px;
  }
  .home-evolution .principles article {
    padding-left: 20px;
  }
  .home-evolution .principles article > span {
    position: static;
  }
  .home-evolution .journey-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .journey-photo {
    aspect-ratio: 1.6;
    margin-bottom: 22px;
  }
  .home-evolution .experience-wide,
  .experience-wide-content {
    min-height: 850px;
  }
  .experience-wide-content {
    padding-top: 55px;
    padding-bottom: 330px;
  }
  .experience-scene {
    height: 45%;
    object-position: 64% bottom;
  }
  .experience-shade {
    background: linear-gradient(180deg, #251039 0%, #251039 52%, #251039bb 65%, transparent 84%);
  }
  .home-evolution .experience-copy h2 {
    font-size: 36px;
  }
  .home-evolution .experience-copy > p:not(.eyebrow) {
    font-size: 14px;
  }
  .home-evolution .closing {
    padding: 35px 25px;
  }
  .hero-people-caption .dot {
    width: 5px;
    height: 5px;
  }
}
@media (prefers-reduced-motion: reduce) {
  [data-motion],
  .experience-scene[data-motion] {
    transform: none !important;
  }
  .hero-orbit-dot {
    animation: none;
  }
  .motion-ready [data-reveal] {
    opacity: 1 !important;
    translate: none !important;
    transition: none !important;
  }
  .journey-photo img {
    transition: none;
  }
}

/* Parallax local: os anéis pertencem às suas seções. */
.home-evolution .intro-band {
  overflow: hidden;
}
/* Anel coral: chega de cima, encaixa na foto e sai por baixo. */
.home-evolution .team-art::before {
  transform: translate3d(0, var(--ring-arrival-y, 0px), 0);
  will-change: transform;
}
/* Anel roxo: camada de fundo com velocidade própria durante a rolagem. */
.home-evolution .video-band::before {
  bottom: -180px;
  transform: translate3d(0, var(--background-ring-y, 0px), 0);
  will-change: transform;
  pointer-events: none;
}
.home-evolution .video-band .video-section {
  z-index: 1;
}
@media (max-width: 800px) {
  .home-evolution .video-band::before {
    width: 330px;
    height: 330px;
    left: -230px;
    bottom: -120px;
    border-width: 40px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .home-evolution .team-art::before,
  .home-evolution .video-band::before {
    transform: none !important;
    will-change: auto;
  }
}

/* Textura contínua: visível por trás da hero, do ciclo e das dúvidas.
   As faixas com fundo opaco encobrem a textura naturalmente. */
.home-evolution #conteudo {
  position: relative;
  isolation: isolate;
}
.page-brand-background {
  position: fixed;
  inset: 0 -100px 0 auto;
  width: min(850px, 72vw);
  z-index: -1;
  pointer-events: none;
  opacity: 0.18;
  background-image: url("../../assets/imgs/fundos/purple-circles.webp");
  background-size: 100% auto;
  background-repeat: repeat-y;
  background-position: center var(--page-pattern-y, 80px);
  mask-image: linear-gradient(90deg, transparent, #000 30%, #000 90%, transparent);
}
.home-evolution .hero {
  background: radial-gradient(ellipse at 75% 45%, #b99ad880 0, transparent 58%);
}
/* Evita duplicar o mesmo motivo estático na área das soluções. */
.home-evolution .solutions::before {
  display: none;
}
@media (max-width: 800px) {
  .page-brand-background {
    right: -120px;
    width: 650px;
    max-width: 110vw;
    opacity: 0.13;
  }
}
@media (prefers-reduced-motion: reduce) {
  .page-brand-background {
    background-position: center 80px !important;
  }
}
