/* Approved photographic assets, v1.11.6. Scoped: commerce/cards stay unchanged. */
.home-page {
  --hero-scene-ratio: 2.5;
  --hero-crossfade: 600ms;
  --hero-crossfade-ease: cubic-bezier(.2, .6, .3, 1);
}

/* Two crops of ONE photograph share geometry, parallax, fade and stacking.
   No independent zoom: their matching pixels remain aligned through a change. */
.home-page .hero-slide[data-hero-slide] {
  transform: none;
  transition: opacity var(--hero-crossfade) var(--hero-crossfade-ease),
    visibility 0s var(--hero-crossfade);
}
.home-page .hero-slide[data-hero-slide].is-active { transition-delay: 0s; }
.home-page .hero-slide-pro,
.home-page .flow-bridge-photo[data-flow-layer="1"] {
  --hero-scene-ratio: 4.2;
  --hero-scene-anchor: 70%;
  --hero-scene-offset: -70%;
}
.home-page .hero-slide[data-hero-slide] .hero-scene-frame,
.home-page .flow-bridge-photo .flow-scene-frame {
  position: absolute;
  top: 50%;
  left: var(--hero-scene-anchor);
  width: max(100%, calc(var(--hero-stage-height) * var(--hero-scene-ratio)));
  height: auto;
  aspect-ratio: var(--hero-scene-ratio);
  overflow: visible;
  transform: translate3d(var(--hero-scene-offset), calc(-50% + var(--hero-parallax-y, 0px)), 0);
}
.home-page .hero-slide[data-hero-slide] .hero-media-extended,
.home-page .flow-bridge-photo .flow-scene-frame img {
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  height: auto;
  max-width: none;
  object-fit: fill;
  object-position: initial;
  filter: none;
  transform: none !important;
}
.home-page .hero-slide-pro[data-hero-slide] .hero-media-extended,
.home-page .flow-bridge-photo[data-flow-layer="1"] .flow-scene-frame img {
  transform: scaleX(-1) !important;
}
.home-page .flow-bridge-layer.flow-bridge-photo {
  z-index: 0;
  top: calc(-1 * var(--hero-stage-height));
  width: 100%;
  height: var(--hero-stage-height);
  overflow: visible;
  background: none;
  filter: none;
  transform: none;
  mask-image: none;
  -webkit-mask-image: none;
  transition: opacity var(--hero-crossfade) var(--hero-crossfade-ease);
}
.home-page .flow-bridge-layer.flow-bridge-photo.is-active { z-index: 1; }
.home-page .flow-bridge-photo .flow-scene-frame img {
  mask-image: linear-gradient(180deg, #000 0%, #000 64%, transparent 100%);
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 64%, transparent 100%);
}
.home-page .flow-bridge-photo[data-flow-layer="1"] .flow-scene-frame img {
  mask-image: linear-gradient(180deg, #000 0%, #000 72%, transparent 100%);
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 72%, transparent 100%);
}
.home-page .hero-shade {
  background:
    linear-gradient(90deg, rgba(3,10,17,.5) 0%, rgba(3,10,17,.34) 29%, rgba(3,10,17,.1) 48%, transparent 68%),
    linear-gradient(180deg, rgba(3,10,17,.16), transparent 30%, rgba(3,10,17,.12) 100%);
}
.home-page .material-flow > .flow-bridge::after {
  background:
    linear-gradient(90deg, rgba(3,10,17,.5) 0%, rgba(3,10,17,.34) 29%, rgba(3,10,17,.1) 48%, transparent 68%),
    linear-gradient(180deg, rgba(3,10,17,.12) 0%, transparent 70%);
}

/* Institutional photo and its feathered edges remain one element. */
.home-page .institutional-visual img { object-position: 66% center; }

/* Two deliberate lines on desktop; mobile wraps naturally rather than shrinking. */
.home-page .hero-slide:first-child .hero-copy { max-width: none; width: 100%; }
.home-page .hero-slide:first-child h1 {
  font-size: clamp(52px, 5.1vw, 104px);
  line-height: .98;
  text-wrap: initial;
}
.home-page .hero h1 .hero-headline-line {
  display: block;
  width: max-content;
  max-width: 100%;
  background: none;
  color: #fff;
}
.home-page .hero h1 strong {
  font-weight: inherit;
  background: var(--gradient);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
.home-page .hero-autoplay {
  position: absolute;
  z-index: 4;
  right: 24px;
  bottom: 30px;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 50%;
  background: rgba(12,20,28,.35);
  color: #fff;
  font: 650 15px/1 Manrope,sans-serif;
  backdrop-filter: blur(12px);
  cursor: pointer;
  transition: background 180ms, border-color 180ms;
}
.home-page .hero-autoplay:hover { background: rgba(12,20,28,.6); border-color: rgba(255,255,255,.6); }
.home-page .hero-autoplay:focus-visible { outline: 3px solid #7a45ff; outline-offset: 4px; }
.home-page .hero-autoplay:disabled { opacity: .55; cursor: default; }

/* Identical thin brand outline and translucent fill on both hero CTAs. */
.home-page .hero .button-ghost,
.solutions-page-v3 .solutions-specialist-button {
  position: relative;
  isolation: isolate;
  border: 1px solid transparent;
  background: rgba(12,20,28,.35);
  color: var(--blue);
  box-shadow: none;
  backdrop-filter: blur(12px);
}
.home-page .hero .button-ghost::before,
.solutions-page-v3 .solutions-specialist-button::before {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  background: var(--gradient);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  pointer-events: none;
}
.home-page .hero .button-ghost span,
.solutions-page-v3 .solutions-specialist-button span {
  background: var(--gradient);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
.home-page .hero .button-ghost:hover,
.solutions-page-v3 .solutions-specialist-button:hover { background: rgba(12,20,28,.5); }

/* Soluções: a solid, separate header, a natural photo and local text shade.
   The image continues below the hero in the same continuous scene. */
.solutions-page-v3 {
  --solutions-header-height: 106px;
  /* The approved closer view needs extra height only on ultrawide monitors. */
  --solutions-hero-height: max(calc(500px - var(--solutions-header-height)), 17vw);
}
.solutions-page-v3 .site-header,
.solutions-page-v3 .site-header.is-scrolled {
  background: #fff;
  border-bottom: 1px solid rgba(19,33,48,.08);
  box-shadow: 0 3px 18px rgba(3,10,17,.06);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.solutions-page-v3 .site-header .nav-toggle {
  color: #132130;
  background: #f1f4f8;
}
.solutions-page-v3 .solutions-hero-flow { padding-top: var(--solutions-header-height); }
.solutions-page-v3 .solutions-continuous-scene {
  --scene-hero-height: var(--solutions-hero-height);
  --scene-fade-depth: 360px;
  --scene-image-height: max(66.667vw, calc((var(--solutions-hero-height) * .5 + 362px) / .57));
  --scene-image-ratio: 1.5;
  top: var(--solutions-header-height);
  height: calc(var(--scene-hero-height) + var(--scene-fade-depth) + 2px);
  background: transparent;
  mask-image: linear-gradient(180deg, #000 0px, #000 calc(var(--scene-hero-height) - 10px), transparent calc(var(--scene-hero-height) + var(--scene-fade-depth)));
  -webkit-mask-image: linear-gradient(180deg, #000 0px, #000 calc(var(--scene-hero-height) - 10px), transparent calc(var(--scene-hero-height) + var(--scene-fade-depth)));
}
.solutions-page-v3 .solutions-continuous-scene img {
  top: calc(var(--scene-hero-height) * .5);
  right: auto;
  bottom: auto;
  left: 50%;
  width: calc(var(--scene-image-height) * var(--scene-image-ratio));
  height: auto;
  max-width: none;
  object-fit: fill;
  object-position: initial;
  transform: translate(-50%, -43%);
  filter: none;
  mask-image: none;
  -webkit-mask-image: none;
}
.solutions-page-v3 .solutions-hero-v3,
.solutions-page-v3 .solutions-hero-content { min-height: var(--solutions-hero-height); }
.solutions-page-v3 .solutions-hero-content { align-items: center; padding-top: 44px; padding-bottom: 44px; }
.solutions-page-v3 .solutions-hero-light { display: none; }
/* Shade belongs to the continuous scene, not just the upper hero rectangle:
   its lower edge must fade with the photo instead of creating a horizontal cut. */
.solutions-page-v3 .solutions-continuous-scene::after {
  display: block;
  background: linear-gradient(90deg, rgba(4,15,25,.68) 0%, rgba(4,15,25,.54) 32%, rgba(4,15,25,.22) 56%, transparent 80%);
  mask-image: none;
  -webkit-mask-image: none;
}
.solutions-page-v3 .solutions-hero-copy::before { display: none; }
.solutions-page-v3 .solutions-hero-copy h1 {
  color: #fff;
  font-weight: 800;
  text-shadow: 0 2px 18px rgba(0,0,0,.15);
}
.solutions-page-v3 .solutions-hero-copy h1 span {
  background-image: var(--gradient);
  -webkit-text-fill-color: transparent;
  text-shadow: none;
  opacity: 1;
}
.solutions-page-v3 .solutions-hero-lead {
  color: #e9eef5;
  text-shadow: 0 1px 8px rgba(0,0,0,.22);
}

@media (max-width: 1100px) {
  .solutions-page-v3 { --solutions-header-height: 76px; }
  .home-page .hero-slide:first-child h1 { font-size: clamp(47px, 5.1vw, 63px); }
  .solutions-page-v3 .solutions-continuous-scene {
    --scene-fade-depth: 260px;
    --scene-image-height: max(66.667vw, calc((var(--solutions-hero-height) * .5 + 262px) / .57));
  }
}
@media (max-width: 700px) {
  .solutions-page-v3 { --solutions-header-height: 72px; }
  .home-page .hero-slide-pro,
  .home-page .flow-bridge-photo[data-flow-layer="1"] {
    --hero-scene-anchor: 76%;
    --hero-scene-offset: -76%;
  }
  .home-page .hero-shade {
    background:
      linear-gradient(90deg, rgba(3,10,17,.92), rgba(3,10,17,.46) 65%, rgba(3,10,17,.08)),
      linear-gradient(180deg, rgba(3,10,17,.16), transparent 30%, rgba(3,10,17,.12));
  }
  .home-page .material-flow > .flow-bridge::after {
    background:
      linear-gradient(90deg, rgba(3,10,17,.92), rgba(3,10,17,.46) 65%, rgba(3,10,17,.08)),
      linear-gradient(180deg, rgba(3,10,17,.12), transparent 70%);
  }
  .home-page .institutional-visual img { object-position: 72% center; }
}
@media (max-width: 760px) {
  .solutions-page-v3 { --solutions-hero-height: calc(555px - var(--solutions-header-height)); }
  .home-page .hero-slide:first-child h1 { font-size: clamp(42px, 8vw, 58px); }
  .home-page .hero h1 .hero-headline-line { width: auto; }
  .home-page .hero-autoplay { right: 14px; bottom: 108px; }
  .solutions-page-v3 .solutions-continuous-scene {
    --scene-fade-depth: 180px;
    --scene-image-height: max(66.667vw, calc((var(--solutions-hero-height) * .5 + 182px) / .57));
  }
  .solutions-page-v3 .solutions-continuous-scene img {
    left: clamp(calc(100% - var(--scene-image-height) * var(--scene-image-ratio)), calc(65% - var(--scene-image-height) * var(--scene-image-ratio) * .79), 0px);
    transform: translateY(-43%);
  }
  .solutions-page-v3 .solutions-hero-content { padding-top: 32px; padding-bottom: 36px; }
  .solutions-page-v3 .solutions-continuous-scene::after {
    background: linear-gradient(90deg, rgba(4,15,25,.76), rgba(4,15,25,.56) 62%, rgba(4,15,25,.32));
  }
}
@media (max-width: 520px) {
  .solutions-page-v3 { --solutions-hero-height: calc(525px - var(--solutions-header-height)); }
}
@media (prefers-reduced-motion: reduce) {
  .home-page .hero-slide[data-hero-slide],
  .home-page .flow-bridge-layer.flow-bridge-photo { transition: none !important; transition-duration: 0s !important; }
  .home-page .hero-slide[data-hero-slide] .hero-scene-frame,
  .home-page .flow-bridge-photo .flow-scene-frame {
    transform: translate3d(var(--hero-scene-offset), -50%, 0) !important;
  }
}
