/* Squadra Brasil — Estandes */

.page-estandes { background: var(--paper); }

.stands-gallery {
  position: relative;
  overflow: hidden;
  color: #292a32;
  background-color: var(--paper);
  background-image: url("../images/events/events-halftone.svg");
  background-position: center top;
  background-repeat: repeat;
  background-size: 100% auto;
}

.stands-gallery__inner {
  position: relative;
  z-index: 2;
  width: min(1160px, calc(100% - 48px));
  padding: clamp(66px, 4.7vw, 90px) 0 clamp(118px, 8vw, 154px);
  margin-inline: auto;
}

.stands-gallery__header {
  display: grid;
  grid-template-columns: 68px auto 68px;
  align-items: center;
  justify-content: center;
  gap: clamp(32px, 4.2vw, 80px);
  margin-bottom: clamp(70px, 5.7vw, 110px);
}

.stands-gallery__header h2 {
  margin: 0;
  color: var(--blue);
  font-size: clamp(1.05rem, 1.35vw, 1.55rem);
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
}

.stands-confetti {
  display: flex;
  width: 68px;
  height: 44px;
  gap: 7px;
  align-items: flex-start;
  justify-content: center;
  pointer-events: none;
  animation: stands-confetti-float 5.8s ease-in-out infinite alternate;
}

.stands-confetti--reverse { animation-direction: alternate-reverse; }

.stands-confetti__column {
  --stands-dot: var(--pink);
  display: flex;
  flex: 0 0 clamp(6px, .42vw, 8px);
  flex-direction: column;
  justify-content: space-between;
  animation: stands-confetti-column 3.8s ease-in-out infinite alternate;
}

.stands-confetti__column:nth-child(even) { translate: 0 28%; }
.stands-confetti__column:nth-child(2) { animation-delay: -950ms; }
.stands-confetti__column:nth-child(3) { animation-delay: -1.9s; }
.stands-confetti__column:nth-child(4) { animation-delay: -2.85s; }
.stands-confetti__column--pink { --stands-dot: var(--pink); }
.stands-confetti__column--yellow { --stands-dot: #f3d915; }
.stands-confetti__column--cyan { --stands-dot: var(--cyan); }
.stands-confetti__column--purple { --stands-dot: #8f00ff; }

.stands-confetti__column i {
  width: 100%;
  flex: 0 0 auto;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--stands-dot);
  animation: stands-dot-pulse 1.7s ease-in-out infinite both;
}

.stands-confetti__column i:nth-child(2) { animation-delay: 100ms; }
.stands-confetti__column i:nth-child(3) { animation-delay: 200ms; }
.stands-confetti__column i:nth-child(4) { animation-delay: 300ms; }

.stand-project {
  position: relative;
  width: 100%;
  margin: 0 auto clamp(92px, 6.2vw, 120px);
}

.stand-project h3 {
  margin: 0 0 15px;
  font-size: clamp(1rem, 1.15vw, 1.32rem);
  font-weight: 400;
  line-height: 1.25;
  text-align: center;
}

.stand-project h3 strong { font-weight: 800; }

.stand-mosaic { position: relative; margin-inline: auto; }

.stand-media {
  position: relative;
  min-width: 0;
  min-height: 0;
  margin: 0;
  overflow: hidden;
  background: #ececf1;
  border-radius: 15px;
  box-shadow: 0 14px 30px rgba(24, 24, 70, .09);
}

.stand-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--media-hover-duration, 620ms) var(--media-hover-ease, cubic-bezier(.22, 1, .36, 1));
}

@media (hover: hover) and (pointer: fine) {
  .stand-media:hover img { transform: scale(var(--media-hover-scale, 1.018)); }
}

.stand-mosaic--brain {
  width: min(980px, 100%);
  height: 360px;
}

.stand-media--brain-main {
  position: absolute;
  inset: 0 26% 0 0;
}

.stand-media--brain-detail-a,
.stand-media--brain-detail-b {
  position: absolute;
  right: 0;
  width: 34%;
  height: 46%;
}

.stand-media--brain-detail-a { top: 4%; }
.stand-media--brain-detail-b { bottom: 4%; }
.stand-media--brain-detail-b img { object-position: 72% center; }

.stand-mosaic--gerd {
  display: grid;
  width: min(930px, 100%);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.stand-mosaic--gerd .stand-media { aspect-ratio: .75 / 1; }

.stand-mosaic--condor {
  width: min(1030px, 100%);
  height: 420px;
}

.stand-media--condor-main {
  position: absolute;
  z-index: 2;
  inset: 0 14%;
}

.stand-media--condor-left,
.stand-media--condor-right {
  position: absolute;
  z-index: 3;
  top: 95px;
  width: 29%;
  height: 210px;
}

.stand-media--condor-left { left: 0; }
.stand-media--condor-right { right: 0; }

.stands-rings {
  position: absolute;
  left: -42px;
  bottom: -72px;
  width: 118px;
  opacity: .9;
  rotate: 90deg;
  animation: stands-rings-float 6.8s ease-in-out infinite alternate;
}

.stands-rings > i { border-color: var(--blue); }

.stands-rings::after {
  content: "";
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  width: 16%;
  aspect-ratio: 1;
  background: var(--pink);
  border-radius: 50%;
  translate: -50% -50%;
}

.stands-confetti--project {
  position: absolute;
  right: -22px;
  bottom: -42px;
  width: 48px;
  height: 31px;
  gap: 4px;
  animation-delay: -2.1s;
}

.stands-confetti--project .stands-confetti__column { flex-basis: 5px; }

.stand-mosaic--ollie {
  display: grid;
  width: min(900px, 100%);
  height: 430px;
  grid-template-columns: 1.45fr .72fr;
  gap: 18px;
}

.stand-media--ollie-wide img { object-position: center; }
.stand-media--ollie-portrait img { object-position: center; }

.stands-duo {
  display: grid;
  width: min(980px, 100%);
  grid-template-columns: .84fr 1.16fr;
  align-items: start;
  gap: clamp(34px, 4vw, 64px);
  margin: 0 auto clamp(92px, 6.2vw, 120px);
}

.stands-duo .stand-project { margin-bottom: 0; }
.stands-duo__stack { display: grid; gap: 58px; }
.stand-media--portrait { aspect-ratio: .58 / 1; }
.stand-media--landscape { aspect-ratio: 1.32 / 1; }
.stand-media--square { aspect-ratio: 1 / .94; }

.stand-mosaic--nauterra {
  width: min(930px, 100%);
  height: 410px;
}

.stand-media--nauterra-main {
  position: absolute;
  inset: 0 13% 0 0;
}

.stand-media--nauterra-detail {
  position: absolute;
  z-index: 3;
  right: 0;
  bottom: 32px;
  width: 38%;
  height: 178px;
}

.stands-dot-band {
  position: absolute;
  right: -12px;
  bottom: -48px;
  display: grid;
  width: 190px;
  grid-template-columns: repeat(7, 9px);
  gap: 8px 0;
  justify-content: space-between;
  pointer-events: none;
  animation: stands-dot-band-drift 6.2s ease-in-out infinite alternate;
}

.stands-dot-band i {
  width: 9px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #8f00ff;
  animation: stands-dot-pulse 1.7s ease-in-out infinite both;
}

.stands-dot-band i:nth-child(2n) { animation-delay: 140ms; }
.stands-dot-band i:nth-child(3n) { animation-delay: 280ms; }
.stands-dot-band i:nth-child(7n + 2),
.stands-dot-band i:nth-child(7n + 6) { translate: 0 -4px; }
.stands-dot-band i:nth-child(7n + 3),
.stands-dot-band i:nth-child(7n + 5) { translate: 0 -7px; }
.stands-dot-band i:nth-child(7n + 4) { translate: 0 -10px; }

.stand-mosaic--jti {
  display: grid;
  width: min(900px, 100%);
  height: 510px;
  grid-template-columns: 1.28fr .78fr;
  gap: 18px;
}

.stand-media--jti-render img { object-position: center; }
.stand-media--jti-live img { object-position: center; }

.stands-bottom-duo {
  display: grid;
  width: min(920px, 100%);
  grid-template-columns: .7fr 1.3fr;
  align-items: start;
  gap: clamp(30px, 4vw, 64px);
  margin: 0 auto clamp(92px, 6.2vw, 120px);
}

.stands-bottom-duo .stand-project { margin-bottom: 0; }
.stand-media--leograf { aspect-ratio: 1.55 / 1; }

.stands-chevron {
  position: absolute;
  right: 12px;
  width: 90px;
  animation: stands-chevron-drift 5.3s ease-in-out infinite alternate;
}

.stands-chevron--top { bottom: -62px; }
.stands-chevron--bottom {
  bottom: -84px;
  animation-delay: -2.65s;
  animation-direction: alternate-reverse;
}

.stands-chevron .decor-loader__track i { background: var(--blue); }

.stand-project--santillana { margin-bottom: 0; }

.stand-mosaic--santillana {
  width: min(900px, 100%);
  height: 420px;
}

.stand-media--santillana-main {
  position: absolute;
  inset: 0 0 0 29%;
}

.stand-media--santillana-a,
.stand-media--santillana-b {
  position: absolute;
  z-index: 3;
  left: 0;
  width: 38%;
  height: 45%;
}

.stand-media--santillana-a { top: 3%; }
.stand-media--santillana-b { bottom: 3%; }

@keyframes stands-confetti-float {
  from { transform: translate3d(-4px, -4px, 0); }
  to { transform: translate3d(6px, 8px, 0); }
}

@keyframes stands-confetti-column {
  from { transform: translate3d(0, -3px, 0); }
  to { transform: translate3d(0, 5px, 0); }
}

@keyframes stands-dot-pulse {
  0%, 68%, 100% { opacity: .35; scale: .78; }
  30%, 44% { opacity: 1; scale: 1; }
}

@keyframes stands-rings-float {
  from { transform: translate3d(-4px, -6px, 0) rotate(-2deg); }
  to { transform: translate3d(7px, 9px, 0) rotate(3deg); }
}

@keyframes stands-dot-band-drift {
  from { transform: translate3d(-7px, -3px, 0); }
  to { transform: translate3d(8px, 5px, 0); }
}

@keyframes stands-chevron-drift {
  from { transform: translate3d(-8px, 0, 0); }
  to { transform: translate3d(8px, 5px, 0); }
}

@media (max-width: 900px) {
  .stands-gallery {
    background-image: url("../images/events/events-halftone-mobile.svg");
    background-size: 100% auto;
  }

  .stand-mosaic--brain { height: 320px; }
  .stand-mosaic--condor { height: 360px; }
  .stand-media--condor-left,
  .stand-media--condor-right { top: 82px; height: 180px; }
  .stand-mosaic--ollie { height: 370px; }
  .stand-mosaic--nauterra { height: 360px; }
  .stand-mosaic--jti { height: 440px; }
  .stand-mosaic--santillana { height: 370px; }
}

@media (max-width: 680px) {
  .stands-gallery__inner { width: min(100% - 36px, 560px); padding-top: 54px; }

  .stands-gallery__header {
    grid-template-columns: 42px minmax(0, 1fr) 42px;
    gap: 10px;
    margin-bottom: 68px;
  }

  .stands-gallery__header h2 { font-size: .88rem; }
  .stands-confetti { width: 42px; height: 31px; gap: 4px; }
  .stands-confetti__column { flex-basis: 5px; }
  .stand-project { margin-bottom: 78px; }
  .stand-project h3 { margin-bottom: 12px; font-size: .95rem; }

  .stand-mosaic--brain,
  .stand-mosaic--condor,
  .stand-mosaic--nauterra,
  .stand-mosaic--santillana {
    display: grid;
    height: auto;
    gap: 12px;
  }

  .stand-media--brain-main,
  .stand-media--brain-detail-a,
  .stand-media--brain-detail-b,
  .stand-media--condor-main,
  .stand-media--condor-left,
  .stand-media--condor-right,
  .stand-media--nauterra-main,
  .stand-media--nauterra-detail,
  .stand-media--santillana-main,
  .stand-media--santillana-a,
  .stand-media--santillana-b {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto;
  }

  .stand-media--brain-main,
  .stand-media--brain-detail-a,
  .stand-media--brain-detail-b,
  .stand-media--condor-main,
  .stand-media--condor-left,
  .stand-media--condor-right,
  .stand-media--nauterra-main,
  .stand-media--nauterra-detail,
  .stand-media--santillana-main,
  .stand-media--santillana-a,
  .stand-media--santillana-b { aspect-ratio: 1.45 / 1; }

  .stand-mosaic--gerd { grid-template-columns: 1fr; width: min(100%, 390px); gap: 14px; }
  .stand-mosaic--gerd .stand-media { aspect-ratio: .78 / 1; }

  .stands-rings { left: -28px; bottom: -58px; scale: .72; }
  .stands-confetti--project { right: -2px; bottom: -48px; }

  .stand-mosaic--ollie,
  .stand-mosaic--jti {
    grid-template-columns: 1fr;
    height: auto;
    gap: 14px;
  }

  .stand-media--ollie-wide { aspect-ratio: 1.3 / 1; }
  .stand-media--ollie-portrait { aspect-ratio: .72 / 1; }
  .stand-media--jti-render { aspect-ratio: 1.2 / 1; }
  .stand-media--jti-live { aspect-ratio: .72 / 1; }

  .stands-duo,
  .stands-bottom-duo {
    grid-template-columns: 1fr;
    width: min(100%, 430px);
    gap: 78px;
    margin-bottom: 78px;
  }

  .stands-duo__stack { gap: 78px; }
  .stand-media--portrait { aspect-ratio: .68 / 1; }
  .stands-dot-band { right: 8px; bottom: -42px; width: 160px; grid-template-columns: repeat(7, 7px); }
  .stands-dot-band i { width: 7px; }
  .stands-chevron { right: 5px; width: 74px; }
  .stands-chevron--top { bottom: -48px; }
  .stands-chevron--bottom { bottom: -68px; }
}

@media (prefers-reduced-motion: reduce) {
  .stands-confetti,
  .stands-confetti__column,
  .stands-confetti__column i,
  .stands-rings,
  .stands-rings > i,
  .stands-dot-band,
  .stands-dot-band i,
  .stands-chevron,
  .stands-chevron i,
  .stand-media img { animation: none; transition: none; }

  .stand-media:hover img { transform: none !important; }
}