/* Refinamento visual inspirado no layout do PDF */
:root{
  --ease-smooth:cubic-bezier(.22,1,.36,1);
}

body{
  overflow-x:hidden;
}

.hero-txt,
.p-sec-cab,
.eco-card,
.perfil,
.p-post,
.p-cta-in{
  animation: revealUp .8s var(--ease-smooth) both;
}

@keyframes revealUp{
  from{opacity:0;transform:translateY(28px)}
  to{opacity:1;transform:none}
}

/* Cards com comportamento premium */
.eco-card,
.feat-card,
.jor-card,
.p-post{
  transition:
    transform .45s var(--ease-smooth),
    box-shadow .45s var(--ease-smooth),
    border-color .3s ease;
}

.eco-card:hover,
.feat-card:hover,
.jor-card:hover,
.p-post:hover{
  transform:translateY(-8px);
  box-shadow:0 25px 55px -30px rgba(45,10,78,.35);
}

/* Perfis da jornada: expansão semelhante ao PDF */
.p-perfis{
  display:flex;
  gap:22px;
  max-width:1300px;
}

.perfil{
  flex:1;
  min-height:580px;
  transition:
    flex .7s var(--ease-smooth),
    transform .4s ease,
    box-shadow .4s ease;
}

.perfil:hover,
.perfil.ativa{
  flex:2.3;
  transform:translateY(-8px);
  box-shadow:0 35px 70px -40px rgba(20,16,36,.55);
}

.perfil:not(:hover):not(.ativa){
  flex:.8;
}

.perfil-nome{
  transition:transform .5s var(--ease-smooth);
}

.perfil:hover .perfil-nome,
.perfil.ativa .perfil-nome{
  transform:translateY(-30px);
}

/* Menus */
.mega{
  backdrop-filter:blur(18px);
}

.item>.gatilho,
.btn,
.pill,
.aba{
  transition:
    transform .25s var(--ease-smooth),
    background .25s ease,
    color .25s ease,
    box-shadow .25s ease;
}

.item>.gatilho:hover,
.btn:hover,
.pill:hover,
.aba:hover{
  transform:translateY(-2px);
}

/* Botões */
.btn--cta:hover,
.pill--solid:hover{
  box-shadow:0 18px 35px -18px var(--violeta);
}

/* Animação dos blocos que aparecem */
[data-animate]{
  opacity:0;
  transform:translateY(35px);
  transition:opacity .8s ease, transform .8s var(--ease-smooth);
}

[data-animate].visible{
  opacity:1;
  transform:none;
}

/* Timeline */
.tl-item{
  transition:transform .35s var(--ease-smooth);
}

.tl-item:hover{
  transform:translateY(-8px);
}

/* Jornada */
.jor-card.destaque{
  overflow:hidden;
}

.jor-card.destaque:hover{
  transform:scale(1.015);
}

/* CTA final */
.p-cta{
  position:relative;
  overflow:hidden;
}

.p-cta::before{
  content:"";
  position:absolute;
  width:450px;
  height:450px;
  border-radius:50%;
  background:rgba(255,255,255,.25);
  right:-150px;
  top:-150px;
  animation:pulseGlow 5s infinite;
}

@keyframes pulseGlow{
  50%{transform:scale(1.15);opacity:.5}
}

@media(max-width:900px){
 .p-perfis{
   display:grid;
   grid-template-columns:1fr;
 }
 .perfil,
 .perfil:hover,
 .perfil.ativa{
   flex:auto;
 }
}