/* Ajustes de dinamismo para as seções “Pra quem é” e “A Jornada” */

.audience .difference-grid>div,
.journey-track>div{
  transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

.audience .difference-grid>div:nth-child(1){background:var(--yellow);transform:rotate(-1deg)}
.audience .difference-grid>div:nth-child(2){background:var(--pink);transform:translateY(12px) rotate(.7deg)}
.audience .difference-grid>div:nth-child(3){background:var(--blue);transform:rotate(-.6deg)}
.audience .difference-grid>div:nth-child(4){background:var(--green);transform:translateY(10px) rotate(.8deg)}

.audience .difference-grid>div:nth-child(1):before{background:var(--pink)}
.audience .difference-grid>div:nth-child(2):before{background:var(--yellow)}
.audience .difference-grid>div:nth-child(3):before{background:var(--green)}
.audience .difference-grid>div:nth-child(4):before{background:var(--coral)}

.audience .difference-grid>div:hover{
  transform:translateY(-6px) rotate(0deg);
  box-shadow:8px 8px 0 var(--ink);
  filter:saturate(1.05);
}

.journey{
  position:relative;
  background:
    radial-gradient(circle at 10% 20%, rgba(255,141,179,.16) 0 90px, transparent 92px),
    radial-gradient(circle at 90% 76%, rgba(46,196,230,.13) 0 110px, transparent 112px),
    var(--cream);
}

.journey-track{
  position:relative;
  align-items:start;
}

.journey-track:before{
  content:"";
  position:absolute;
  left:2%;
  right:2%;
  top:50%;
  border-top:3px dashed var(--ink);
  z-index:0;
  opacity:.35;
}

.journey-track>div{
  position:relative;
  z-index:1;
  overflow:hidden;
}

.journey-track>div:after{
  content:"↗";
  position:absolute;
  right:12px;
  top:9px;
  font-size:1.1rem;
  font-weight:950;
  opacity:.7;
}

.journey-track>div:nth-child(1){background:var(--yellow);transform:rotate(-1deg)}
.journey-track>div:nth-child(2){background:var(--pink);transform:translateY(14px) rotate(.8deg)}
.journey-track>div:nth-child(3){background:var(--blue);transform:rotate(-.7deg)}
.journey-track>div:nth-child(4){background:var(--green);transform:translateY(14px) rotate(.8deg)}
.journey-track>div:nth-child(5){background:var(--coral);transform:rotate(-.8deg)}
.journey-track>div:nth-child(6){background:var(--lilac);transform:translateY(14px) rotate(.7deg)}

.journey-track>div:hover{
  transform:translateY(-7px) rotate(0deg) scale(1.02);
  box-shadow:8px 8px 0 var(--ink);
  z-index:3;
}

.journey-track span{
  width:max-content;
  min-width:38px;
  border:2px solid var(--ink);
  background:var(--paper);
  padding:5px 8px;
  box-shadow:2px 2px 0 var(--ink);
}

.journey-track strong{
  font-size:1.35rem;
}

@media(max-width:900px){
  .audience .difference-grid>div,
  .audience .difference-grid>div:nth-child(n),
  .journey-track>div,
  .journey-track>div:nth-child(n){
    transform:none;
  }
  .journey-track:before{display:none}
}