/*
 * Instituto Softown — camada experimental de movimento (motion-v2)
 *
 * Esta folha e opt-in. A experiencia original permanece intacta ate que o
 * documento receba, ao mesmo tempo, o atributo e a classe abaixo:
 *
 *   <html data-institute-experience="motion-v2" class="institute-motion-ready">
 *
 * Remover um dos dois sinais devolve imediatamente a apresentacao original.
 */

.diagram-signal,
.field-pointer-network,
.closing-signal {
  display: none;
}

html[data-institute-experience="motion-v2"].institute-motion-ready {
  --institute-motion-duration: 760ms;
  --institute-motion-slow: 1200ms;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .diagram-signal,
html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal {
  display: block;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .field-pointer-network {
  display: inline;
}

/* -------------------------------------------------------------------------- */
/* Abertura — tres atomos independentes em profundidade 2.5D                  */
/* -------------------------------------------------------------------------- */

html[data-institute-experience="motion-v2"].institute-motion-ready [data-hero-diagram] {
  --motion-orbit-x: 0px;
  --motion-orbit-y: 0px;
  --motion-orbit-angle: 0deg;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-hero-diagram] .diagram-orbit {
  transition: translate 700ms var(--softown-ease-out), transform 850ms var(--softown-ease-out), border-color 450ms ease;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-hero-diagram] .diagram-orbit-one {
  translate: var(--motion-orbit-x) var(--motion-orbit-y);
  transform: rotate(calc(36deg + var(--diagram-turn) + var(--motion-orbit-angle))) scaleY(.42);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-hero-diagram] .diagram-orbit-two {
  translate: calc(0px - var(--motion-orbit-x)) calc(0px - var(--motion-orbit-y));
  transform: rotate(calc(-28deg - var(--diagram-turn) - var(--motion-orbit-angle))) scaleY(.3);
}

html[data-institute-experience="motion-v2"].institute-motion-ready .diagram-signal {
  position: absolute;
  inset: 7%;
  z-index: 1;
  border-radius: 50%;
  opacity: .78;
  pointer-events: none;
  transform: translate3d(var(--motion-orbit-x), var(--motion-orbit-y), 0) rotate(var(--motion-orbit-angle));
  transition: opacity 400ms ease, transform 700ms var(--softown-ease-out);
}

html[data-institute-experience="motion-v2"].institute-motion-ready .diagram-signal::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 8px;
  height: 8px;
  border: 1px solid var(--softown-gold-light, var(--softown-gold));
  border-radius: 50%;
  background: var(--softown-brown-950);
  box-shadow: 0 0 0 7px rgb(182 155 114 / 9%), 0 0 24px rgb(182 155 114 / 32%);
  content: "";
  offset-path: ellipse(48% 42% at 50% 50%);
  offset-distance: 0%;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .diagram-signal::after {
  position: absolute;
  inset: 27%;
  border: 1px dashed rgb(182 155 114 / 20%);
  border-radius: 50%;
  content: "";
}

html[data-institute-experience="motion-v2"].institute-motion-ready .diagram-signal > i {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 7px;
  height: 7px;
  border: 1px solid rgb(182 155 114 / 46%);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-knowledge {
  --atom-spin-a: 16s;
  --atom-spin-b: 11s;
  --atom-pulse: 5.2s;
  --atom-float: 7.1s;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-structure {
  --atom-spin-a: 22s;
  --atom-spin-b: 14.5s;
  --atom-pulse: 6.4s;
  --atom-float: 8.8s;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-connection {
  --atom-spin-a: 27s;
  --atom-spin-b: 18s;
  --atom-pulse: 7.3s;
  --atom-float: 10.5s;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom,
html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-orbit,
html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-halo,
html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-nucleus {
  animation-play-state: paused;
  will-change: transform, opacity;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-balloon {
  will-change: scale, opacity;
}

@media (prefers-reduced-motion: no-preference) {
  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom {
    animation: institute-motion-atom-float var(--atom-float) ease-in-out infinite alternate;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-structure {
    animation-delay: -2.7s;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-connection {
    animation-direction: alternate-reverse;
    animation-delay: -5.4s;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-orbit-a {
    animation: institute-motion-atom-spin var(--atom-spin-a) linear infinite;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-orbit-b {
    animation: institute-motion-atom-spin var(--atom-spin-b) linear infinite reverse;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-connection .hero-atom-orbit-a {
    animation-direction: reverse;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-halo,
  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-nucleus {
    animation: institute-motion-atom-pulse var(--atom-pulse) ease-in-out infinite;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-nucleus {
    animation-delay: -2.2s;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-diagram[data-revealed="true"] .hero-atom-scene {
    animation: institute-motion-atom-arrive 980ms var(--softown-ease-out) backwards;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-diagram[data-revealed="true"] .hero-atom-structure .hero-atom-scene {
    animation-delay: 120ms;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-diagram[data-revealed="true"] .hero-atom-connection .hero-atom-scene {
    animation-delay: 240ms;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .institute-hero.is-motion-visible .hero-atom,
  html[data-institute-experience="motion-v2"].institute-motion-ready .institute-hero.is-motion-visible .hero-atom-orbit,
  html[data-institute-experience="motion-v2"].institute-motion-ready .institute-hero.is-motion-visible .hero-atom-halo,
  html[data-institute-experience="motion-v2"].institute-motion-ready .institute-hero.is-motion-visible .hero-atom-nucleus {
    animation-play-state: running;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom:is(:hover, :focus-visible, [aria-expanded="true"]) .hero-atom-orbit,
  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom:is(:hover, :focus-visible, [aria-expanded="true"]) .hero-atom-halo,
  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom:is(:hover, :focus-visible, [aria-expanded="true"]) .hero-atom-nucleus {
    animation-play-state: paused;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .institute-hero.is-motion-visible .diagram-signal::before {
    animation: institute-motion-signal-orbit 14s linear infinite;
  }

}

@keyframes institute-motion-atom-spin {
  to {
    rotate: 360deg;
  }
}

@keyframes institute-motion-atom-pulse {
  0%,
  100% {
    opacity: .56;
    scale: .9;
  }

  48% {
    opacity: 1;
    scale: 1.13;
  }
}

@keyframes institute-motion-atom-float {
  from {
    transform: translate3d(-2px, 5px, 0) rotate(-1.2deg);
  }

  to {
    transform: translate3d(4px, -5px, 24px) rotate(1.3deg);
  }
}

@keyframes institute-motion-atom-arrive {
  from {
    opacity: 0;
    scale: .62;
    translate: 0 24px;
  }

  to {
    opacity: 1;
    scale: 1;
    translate: 0;
  }
}

@keyframes institute-motion-signal-orbit {
  to {
    offset-distance: 100%;
  }
}

/* -------------------------------------------------------------------------- */
/* Abertura v3 — conceitos tratados como elétrons grandes em órbitas próprias */
/* -------------------------------------------------------------------------- */

html[data-institute-experience="motion-v2"].institute-motion-ready .hero-diagram[data-hero-style="electrons"] .diagram-signal {
  display: none;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .hero-diagram[data-hero-style="electrons"] .diagram-orbit-one {
  translate: -50% -50%;
  transform: none;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .hero-diagram[data-hero-style="electrons"] .diagram-orbit-two {
  translate: -50% -50%;
  transform: none;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .hero-diagram[data-hero-style="electrons"] .diagram-orbit-three {
  translate: -50% -50%;
  transform: rotate(0deg);
}

html[data-institute-experience="motion-v2"].institute-motion-ready .hero-diagram[data-hero-style="electrons"] .hero-atom-knowledge {
  --electron-duration: 17s;
  --electron-delay: -1.5s;
  --electron-direction: normal;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .hero-diagram[data-hero-style="electrons"] .hero-atom-structure {
  --electron-duration: 23s;
  --electron-delay: -8s;
  --electron-direction: reverse;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .hero-diagram[data-hero-style="electrons"] .hero-atom-connection {
  --electron-duration: 29s;
  --electron-delay: -17s;
  --electron-direction: normal;
}

@media (prefers-reduced-motion: no-preference) {
  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-diagram[data-hero-style="electrons"] .hero-atom {
    top: 0;
    left: 0;
    margin: 0;
    offset-anchor: center;
    offset-position: normal;
    offset-rotate: 0deg;
    translate: 0 0;
    animation-name: institute-motion-electron-orbit, institute-motion-electron-depth;
    animation-duration: var(--electron-duration), var(--electron-duration);
    animation-timing-function: linear, ease-in-out;
    animation-delay: var(--electron-delay), var(--electron-delay);
    animation-iteration-count: infinite, infinite;
    animation-direction: var(--electron-direction), var(--electron-direction);
    animation-play-state: paused, paused;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-diagram[data-hero-style="electrons"] .hero-atom-knowledge {
    offset-path: ellipse(37% 17% at 50% 50%) border-box;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-diagram[data-hero-style="electrons"] .hero-atom-structure {
    offset-path: ellipse(19% 37% at 50% 50%) border-box;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-diagram[data-hero-style="electrons"] .hero-atom-connection {
    offset-path: ellipse(32% 29% at 50% 50%) border-box;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .institute-hero.is-motion-visible .hero-diagram[data-hero-style="electrons"] .hero-atom {
    animation-play-state: running, running;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .institute-hero.is-motion-visible .hero-diagram[data-hero-style="electrons"] .hero-atom:is(:hover, :focus-visible, [aria-expanded="true"]) {
    animation-play-state: paused, paused;
  }
}

@keyframes institute-motion-electron-orbit {
  from {
    offset-distance: 0%;
  }

  to {
    offset-distance: 100%;
  }
}

@keyframes institute-motion-electron-depth {
  0%,
  100% {
    opacity: .76;
    scale: .86;
  }

  25% {
    opacity: .92;
    scale: .96;
  }

  50% {
    opacity: 1;
    scale: 1.08;
  }

  75% {
    opacity: .9;
    scale: .98;
  }
}

/* -------------------------------------------------------------------------- */
/* Manifesto — a linha progride e cada principio acende                       */
/* -------------------------------------------------------------------------- */

html[data-institute-experience="motion-v2"].institute-motion-ready .manifesto-principles {
  position: relative;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .manifesto-principles::before {
  position: absolute;
  top: 30px;
  bottom: 30px;
  left: -24px;
  width: 1px;
  background: rgb(112 91 62 / 20%);
  content: "";
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-principle] {
  position: relative;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-principle]::before {
  position: absolute;
  top: 50%;
  left: -28px;
  width: 9px;
  height: 9px;
  border: 1px solid #705b3e;
  border-radius: 50%;
  background: var(--softown-paper);
  box-shadow: 0 0 0 0 rgb(112 91 62 / 0%);
  content: "";
  transform: translate(-50%, -50%) scale(.72);
  transition: background 400ms ease, box-shadow 500ms ease, transform 600ms var(--softown-ease-out);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-principle]::after {
  position: absolute;
  top: 50%;
  left: -24px;
  width: 26px;
  height: 1px;
  background: #705b3e;
  content: "";
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 620ms var(--softown-ease-out);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-principle].is-current::before,
html[data-institute-experience="motion-v2"].institute-motion-ready #manifesto[data-motion-step="one"] [data-principle]:nth-child(1)::before,
html[data-institute-experience="motion-v2"].institute-motion-ready #manifesto[data-motion-step="two"] [data-principle]:nth-child(2)::before,
html[data-institute-experience="motion-v2"].institute-motion-ready #manifesto[data-motion-step="three"] [data-principle]:nth-child(3)::before {
  background: #705b3e;
  box-shadow: 0 0 0 7px rgb(112 91 62 / 10%);
  transform: translate(-50%, -50%) scale(1);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-principle].is-current::after,
html[data-institute-experience="motion-v2"].institute-motion-ready #manifesto[data-motion-step="one"] [data-principle]:nth-child(1)::after,
html[data-institute-experience="motion-v2"].institute-motion-ready #manifesto[data-motion-step="two"] [data-principle]:nth-child(2)::after,
html[data-institute-experience="motion-v2"].institute-motion-ready #manifesto[data-motion-step="three"] [data-principle]:nth-child(3)::after {
  transform: scaleX(1);
}

/* -------------------------------------------------------------------------- */
/* Ideias em movimento — constelacao que reorganiza os tres registros         */
/* -------------------------------------------------------------------------- */

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage] {
  --motion-cursor-x: 500px;
  --motion-cursor-y: 310px;
  --motion-network-x: 50%;
  --motion-network-y: 50%;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage]::after {
  position: absolute;
  top: var(--motion-network-y);
  left: var(--motion-network-x);
  z-index: 0;
  width: 11px;
  height: 11px;
  border: 1px solid var(--softown-gold);
  border-radius: 50%;
  background: var(--softown-brown-950);
  box-shadow: 0 0 0 12px rgb(182 155 114 / 7%), 0 0 42px rgb(182 155 114 / 22%);
  content: "";
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -50%) scale(.7);
  transition: top 180ms linear, left 180ms linear, opacity 280ms ease, transform 420ms var(--softown-ease-out);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage].is-network-active::after {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

html[data-institute-experience="motion-v2"].institute-motion-ready .field-pointer-network {
  opacity: 0;
  pointer-events: none;
  transition: opacity 300ms ease;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage].is-network-active .field-pointer-network {
  opacity: 1;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .field-pointer-network line {
  stroke: var(--softown-gold);
  stroke-dasharray: 3 8;
  stroke-width: .85;
  vector-effect: non-scaling-stroke;
  opacity: .38;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .field-pointer-network circle,
html[data-institute-experience="motion-v2"].institute-motion-ready .field-pointer-network [data-field-cursor] {
  fill: var(--softown-gold);
  stroke: var(--softown-brown-950);
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-photo] {
  --motion-field-x: 0%;
  --motion-field-y: 0%;
  opacity: 1;
  scale: 1;
  translate:
    calc(var(--field-pointer-x) + var(--motion-field-x))
    calc(var(--field-photo-shift) + var(--field-pointer-y) + var(--motion-field-y));
  transition:
    translate 760ms var(--softown-ease-out),
    scale 760ms var(--softown-ease-out),
    opacity 460ms ease,
    z-index 0s 0s;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-photo] .field-photo-shell,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-photo] figcaption {
  transition: border-color 480ms ease, box-shadow 700ms ease, opacity 420ms ease;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active] [data-field-photo] {
  opacity: .56;
  translate: var(--motion-field-x) var(--motion-field-y);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage].is-field-transitioning [data-field-photo] {
  will-change: translate, scale;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active] [data-field-photo] .field-photo-shell img,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active] [data-field-photo]:hover .field-photo-shell img {
  transform: scale(1.025);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active="one"] .field-photo-card-one,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active="two"] .field-photo-card-two,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active="three"] .field-photo-card-three {
  z-index: 6;
  opacity: 1;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active="one"] .field-photo-card-one {
  --motion-field-x: 125%;
  --motion-field-y: -5%;
  scale: 1.25;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active="one"] .field-photo-card-two {
  --motion-field-x: -100%;
  --motion-field-y: 5%;
  scale: .8;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active="one"] .field-photo-card-three {
  --motion-field-x: 0%;
  --motion-field-y: 0%;
  scale: 1;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active="two"] .field-photo-card-one {
  --motion-field-x: 0%;
  --motion-field-y: 0%;
  scale: 1;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active="two"] .field-photo-card-two {
  --motion-field-x: 0%;
  --motion-field-y: 0%;
  scale: 1;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active="two"] .field-photo-card-three {
  --motion-field-x: 0%;
  --motion-field-y: 0%;
  scale: 1;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active="three"] .field-photo-card-one {
  --motion-field-x: 0%;
  --motion-field-y: 0%;
  scale: 1;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active="three"] .field-photo-card-two {
  --motion-field-x: 100%;
  --motion-field-y: 23%;
  scale: .8;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active="three"] .field-photo-card-three {
  --motion-field-x: -125%;
  --motion-field-y: -27%;
  scale: 1.25;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active="one"] .field-photo-card-one .field-photo-shell,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active="two"] .field-photo-card-two .field-photo-shell,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active="three"] .field-photo-card-three .field-photo-shell {
  border-color: rgb(182 155 114 / 96%);
  box-shadow: 0 38px 96px rgb(0 0 0 / 38%), 0 0 0 1px rgb(182 155 114 / 15%);
}

/* -------------------------------------------------------------------------- */
/* Atuacao — cada pilar revela uma camada editorial                           */
/* -------------------------------------------------------------------------- */

html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage] .pillar-grid {
  gap: clamp(22px, 3vw, 42px);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage] .pillar-card {
  isolation: isolate;
  min-height: clamp(420px, 31vw, 500px);
  padding: clamp(34px, 4.4vw, 66px);
  background:
    linear-gradient(135deg, rgb(182 155 114 / 5%), transparent 34%),
    radial-gradient(circle at var(--pointer-x) var(--pointer-y), rgb(182 155 114 / 17%), transparent 35%),
    var(--softown-brown-900);
  opacity: 1;
  scale: 1;
  transition:
    border-color 350ms ease,
    transform 550ms var(--softown-ease-out),
    translate 550ms var(--softown-ease-out),
    scale 650ms var(--softown-ease-out),
    opacity 420ms ease,
    box-shadow 650ms ease;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage] .pillar-card::before {
  inset: 15px;
  z-index: 1;
  border: 0;
  background:
    linear-gradient(90deg, rgb(182 155 114 / 48%), rgb(182 155 114 / 48%)) left top / 42px 1px no-repeat,
    linear-gradient(180deg, rgb(182 155 114 / 48%), rgb(182 155 114 / 48%)) left top / 1px 42px no-repeat,
    linear-gradient(90deg, rgb(182 155 114 / 48%), rgb(182 155 114 / 48%)) right top / 42px 1px no-repeat,
    linear-gradient(180deg, rgb(182 155 114 / 48%), rgb(182 155 114 / 48%)) right top / 1px 42px no-repeat,
    linear-gradient(90deg, rgb(182 155 114 / 48%), rgb(182 155 114 / 48%)) left bottom / 42px 1px no-repeat,
    linear-gradient(0deg, rgb(182 155 114 / 48%), rgb(182 155 114 / 48%)) left bottom / 1px 42px no-repeat,
    linear-gradient(90deg, rgb(182 155 114 / 48%), rgb(182 155 114 / 48%)) right bottom / 42px 1px no-repeat,
    linear-gradient(0deg, rgb(182 155 114 / 48%), rgb(182 155 114 / 48%)) right bottom / 1px 42px no-repeat;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage] .pillar-card::after {
  position: absolute;
  right: clamp(24px, 3vw, 46px);
  bottom: clamp(22px, 2.5vw, 40px);
  z-index: 0;
  max-width: none;
  color: rgb(182 155 114 / 8%);
  content: attr(data-layer-word) / "";
  font-family: var(--softown-serif);
  font-size: clamp(64px, 7.5vw, 128px);
  letter-spacing: -.065em;
  line-height: .78;
  opacity: 1;
  pointer-events: none;
  transform: translate3d(10px, 12px, 0) rotate(-3deg) scale(.94);
  transform-origin: right bottom;
  transition: color 520ms ease, transform 850ms var(--softown-ease-out), -webkit-text-stroke-color 520ms ease;
  white-space: nowrap;
  -webkit-text-stroke: .7px rgb(182 155 114 / 28%);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage] .pillar-card > * {
  position: relative;
  z-index: 2;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage] .pillar-card > div {
  padding-bottom: clamp(72px, 7vw, 108px);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage][data-active] .pillar-card {
  opacity: .72;
  scale: 1;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage][data-active="one"] [data-pillar="one"],
html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage][data-active="two"] [data-pillar="two"],
html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage][data-active="three"] [data-pillar="three"],
html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage][data-active="four"] [data-pillar="four"] {
  z-index: 2;
  border-color: rgb(182 155 114 / 82%);
  opacity: 1;
  scale: 1;
  translate: 0 -7px;
  box-shadow: 0 26px 72px rgb(0 0 0 / 24%);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage][data-active="one"] [data-pillar="one"]::after,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage][data-active="two"] [data-pillar="two"]::after,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage][data-active="three"] [data-pillar="three"]::after,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage][data-active="four"] [data-pillar="four"]::after {
  color: rgb(214 190 150 / 16%);
  opacity: 1;
  transform: translate3d(0, 0, 0) rotate(-1deg) scale(1);
  -webkit-text-stroke-color: rgb(214 190 150 / 48%);
}

/* -------------------------------------------------------------------------- */
/* Infraestrutura — panorama suave, sem sacrificar enquadramento ou nitidez   */
/* -------------------------------------------------------------------------- */

html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-scene] {
  --motion-infra-x: 0px;
  --motion-infra-y: 0px;
  margin-top: clamp(112px, 11vw, 180px);
  transform: rotate(-.18deg);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-media] {
  aspect-ratio: 16 / 9;
  border-radius: clamp(76px, 8vw, 128px) clamp(76px, 8vw, 128px) 8px 8px;
  box-shadow:
    0 0 0 8px var(--softown-brown-900),
    0 0 0 9px rgb(182 155 114 / 34%),
    0 34px 90px rgb(0 0 0 / 25%);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-media]::before {
  position: absolute;
  inset: 10px;
  z-index: 2;
  border: 1px solid rgb(214 190 150 / 20%);
  border-radius: calc(clamp(76px, 8vw, 128px) - 10px) calc(clamp(76px, 8vw, 128px) - 10px) 4px 4px;
  content: "";
  pointer-events: none;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-media]::after {
  inset: 0;
  background: linear-gradient(180deg, rgb(20 17 14 / 16%), transparent 22% 76%, rgb(20 17 14 / 22%));
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-media] picture {
  position: absolute;
  inset: -7px;
  width: auto;
  height: auto;
  transform: translate3d(var(--motion-infra-x), var(--motion-infra-y), 0);
  transition: transform 420ms var(--softown-ease-out);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-media] img {
  object-position: center 46%;
  filter: saturate(.9) contrast(1.025);
  transform: scale(1.006);
  transition: filter 700ms ease, transform 900ms var(--softown-ease-out);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-scene]:hover [data-infrastructure-media] img {
  filter: saturate(.94) contrast(1.015);
  transform: scale(1.012);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-scene] figcaption {
  position: relative;
  inset: auto;
  grid-template-columns: minmax(130px, .38fr) minmax(300px, 1fr) auto;
  align-items: start;
  margin: clamp(28px, 3vw, 44px) clamp(4px, 2vw, 30px) 0;
  padding-top: clamp(20px, 2vw, 28px);
  border-top: 1px solid var(--softown-line-dark);
  color: var(--softown-sand);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-scene] figcaption strong {
  max-width: 27ch;
  color: var(--softown-ivory);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-scene] figcaption > span:last-child {
  transition: transform 420ms var(--softown-ease-out);
}

/* -------------------------------------------------------------------------- */
/* Governanca — mesa-astrolabio orientada pelos tres conselhos                 */
/* -------------------------------------------------------------------------- */

html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map][data-motion-active="one"] {
  --governance-angle: 66deg;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map][data-motion-active="two"] {
  --governance-angle: 0deg;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map][data-motion-active="three"] {
  --governance-angle: -66deg;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map] .governance-window[data-governance-node] {
  transition:
    translate 620ms var(--softown-ease-out),
    border-color 300ms ease,
    color 300ms ease,
    background 300ms ease,
    box-shadow 560ms ease;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map][data-motion-active="one"] .governance-window[data-governance-node="one"],
html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map][data-motion-active="two"] .governance-window[data-governance-node="two"],
html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map][data-motion-active="three"] .governance-window[data-governance-node="three"] {
  color: #17130f;
  border-color: #705b3e;
  background:
    linear-gradient(135deg, rgb(255 255 255 / 48%), transparent 38%),
    #e6d4b5;
  box-shadow: inset 0 0 0 5px rgb(112 91 62 / 9%), 0 24px 54px rgb(48 41 31 / 17%);
  translate: 0 -8px;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map] .governance-readout strong {
  transition: color 320ms ease, letter-spacing 520ms var(--softown-ease-out);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map][data-motion-active] .governance-readout strong {
  color: #f1ddba;
  letter-spacing: .1em;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map] .governance-astrolabe {
  transition: filter 520ms ease;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map][data-motion-active] .governance-astrolabe {
  filter: drop-shadow(0 18px 20px rgb(112 91 62 / 14%));
}

@media (prefers-reduced-motion: no-preference) {
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map].is-drawn .governance-astrolabe-track-outer {
    animation: institute-governance-orbit 42s linear infinite;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map].is-drawn .governance-astrolabe-track-inner {
    animation: institute-governance-orbit-reverse 34s linear infinite;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map].is-drawn .governance-astrolabe-orbit-one {
    animation:
      institute-governance-ellipse-one 20s linear infinite,
      institute-governance-breathe 12s ease-in-out infinite alternate;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map].is-drawn .governance-astrolabe-orbit-two {
    animation: institute-governance-ellipse-two 27s linear infinite;
  }
}

@keyframes institute-governance-orbit {
  to {
    stroke-dashoffset: -72;
    transform: rotate(360deg);
  }
}

@keyframes institute-governance-orbit-reverse {
  to {
    stroke-dashoffset: 48;
    transform: rotate(-360deg);
  }
}

@keyframes institute-governance-ellipse-one {
  from { transform: rotate(-18deg); }
  to { transform: rotate(342deg); }
}

@keyframes institute-governance-ellipse-two {
  from { transform: rotate(18deg); }
  to { transform: rotate(-342deg); }
}

@keyframes institute-governance-breathe {
  from { opacity: .28; }
  to { opacity: .58; }
}

/* -------------------------------------------------------------------------- */
/* Participacao — fichas de arquivo avancam sem alterar a semantica details   */
/* -------------------------------------------------------------------------- */

html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid] .association-card {
  opacity: 1;
  scale: 1;
  transition:
    border-color 300ms ease,
    transform 500ms var(--softown-ease-out),
    translate 620ms var(--softown-ease-out),
    scale 620ms var(--softown-ease-out),
    opacity 380ms ease,
    background 300ms ease,
    box-shadow 560ms ease;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid] .association-card summary {
  position: relative;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid] .association-card summary::before {
  position: absolute;
  top: -1px;
  right: clamp(22px, 2.5vw, 36px);
  min-width: 54px;
  padding: 5px 8px 4px;
  border: 1px solid var(--softown-line-dark);
  border-top: 0;
  color: var(--softown-gold);
  background: var(--softown-brown-900);
  content: "ficha" / "";
  font-size: 8px;
  letter-spacing: .14em;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  transform: translateY(-55%);
  transition: color 300ms ease, background 300ms ease, transform 480ms var(--softown-ease-out);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid].has-open-card .association-card {
  opacity: .58;
  scale: .98;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid].has-open-card .association-card[open],
html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid] .association-card[data-motion-active="true"] {
  z-index: 3;
  border-color: rgb(182 155 114 / 88%);
  background: var(--softown-brown-800);
  box-shadow: 0 28px 76px rgb(0 0 0 / 28%);
  opacity: 1;
  scale: 1.018;
  translate: 0 -10px;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid].has-open-card .association-card[open] summary::before,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid] .association-card[data-motion-active="true"] summary::before {
  color: var(--softown-brown-950);
  background: var(--softown-gold);
  transform: translateY(0);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid][data-motion-active] .association-card {
  opacity: .58;
  scale: .98;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid][data-motion-active="one"] .association-card-one,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid][data-motion-active="two"] .association-card-two,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid][data-motion-active="three"] .association-card-three,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid][data-motion-active="four"] .association-card-four,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid][data-motion-active="five"] .association-card-five,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid][data-motion-active="six"] .association-card-six {
  z-index: 2;
  opacity: 1;
  scale: 1.012;
}

/* -------------------------------------------------------------------------- */
/* Encerramento — placa de latao e relogio de salao                           */
/* -------------------------------------------------------------------------- */

html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] {
  --motion-closing-x: 0px;
  --motion-closing-y: 0px;
  --motion-closing-angle: 0deg;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 64px;
  border: 1px solid #705b3e;
  border-radius: 2px;
  color: #17130f;
  background:
    radial-gradient(circle at 13px 13px, #5e472a 0 1.5px, #e4ca98 2px 3.5px, transparent 4px),
    radial-gradient(circle at calc(100% - 13px) 13px, #5e472a 0 1.5px, #e4ca98 2px 3.5px, transparent 4px),
    radial-gradient(circle at 13px calc(100% - 13px), #5e472a 0 1.5px, #e4ca98 2px 3.5px, transparent 4px),
    radial-gradient(circle at calc(100% - 13px) calc(100% - 13px), #5e472a 0 1.5px, #e4ca98 2px 3.5px, transparent 4px),
    linear-gradient(112deg, #a78654, #dfc18a 26%, #b28b56 52%, #e5ca92 75%, #a78654);
  box-shadow:
    inset 0 1px rgb(255 245 211 / 58%),
    inset 0 -2px rgb(65 45 24 / 30%),
    0 15px 36px rgb(23 18 13 / 22%);
  letter-spacing: .045em;
  text-shadow: 0 1px rgb(255 245 211 / 34%);
  transition: color 320ms ease, filter 420ms ease, transform 520ms var(--softown-ease-out), box-shadow 420ms ease;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link::before {
  position: absolute;
  inset: 5px;
  z-index: 0;
  border: 1px solid rgb(56 39 22 / 38%);
  box-shadow: inset 0 0 0 1px rgb(255 244 211 / 22%);
  content: "";
  pointer-events: none;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link::after {
  position: absolute;
  top: -70%;
  bottom: -70%;
  left: -42%;
  z-index: 1;
  width: 24%;
  background: linear-gradient(90deg, transparent, rgb(255 248 221 / 54%), transparent);
  content: "";
  pointer-events: none;
  transform: translateX(-180%) skewX(-18deg);
  transition: transform 900ms var(--softown-ease-out);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link > span {
  position: relative;
  z-index: 2;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link:hover,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link:focus-visible {
  color: #17130f;
  background:
    radial-gradient(circle at 13px 13px, #5e472a 0 1.5px, #f0d9aa 2px 3.5px, transparent 4px),
    radial-gradient(circle at calc(100% - 13px) 13px, #5e472a 0 1.5px, #f0d9aa 2px 3.5px, transparent 4px),
    radial-gradient(circle at 13px calc(100% - 13px), #5e472a 0 1.5px, #f0d9aa 2px 3.5px, transparent 4px),
    radial-gradient(circle at calc(100% - 13px) calc(100% - 13px), #5e472a 0 1.5px, #f0d9aa 2px 3.5px, transparent 4px),
    linear-gradient(112deg, #b18d59, #ead09b 26%, #bd9560 52%, #edd6a4 75%, #b18d59);
  box-shadow:
    inset 0 1px rgb(255 248 221 / 68%),
    inset 0 -2px rgb(65 45 24 / 28%),
    0 19px 42px rgb(23 18 13 / 27%);
  filter: saturate(1.06);
  transform: translateY(-3px) rotate(-.25deg);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link:hover::after,
html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link:focus-visible::after {
  transform: translateX(650%) skewX(-18deg);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-emblem {
  position: absolute;
  top: 50%;
  right: clamp(-82px, -3vw, -34px);
  z-index: 0;
  width: clamp(410px, 39vw, 590px);
  aspect-ratio: 1;
  pointer-events: none;
  transform: translateY(-50%);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-orbit {
  inset: 0;
  width: 100%;
  height: 100%;
  scale: 1;
  transform: translate3d(var(--motion-closing-x), var(--motion-closing-y), 0) rotate(calc(var(--closing-turn) + var(--motion-closing-angle)));
  transition: transform 780ms var(--softown-ease-out), scale 850ms var(--softown-ease-out), border-color 420ms ease;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-brand-mark {
  top: 50%;
  right: auto;
  bottom: auto;
  left: 50%;
  z-index: 4;
  display: grid;
  width: clamp(78px, 8vw, 116px);
  height: auto;
  place-items: center;
  transform: translate(-50%, -50%);
  translate: none;
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-brand-mark img {
  display: block;
  width: 100%;
  height: auto;
  filter: sepia(.75) saturate(.72) brightness(.72) drop-shadow(0 12px 22px rgb(63 48 31 / 18%));
  opacity: .9;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal {
  position: absolute;
  inset: 12%;
  z-index: 1;
  width: auto;
  aspect-ratio: 1;
  border: 3px double rgb(112 91 62 / 40%);
  border-radius: 50%;
  background: radial-gradient(circle, rgb(112 91 62 / 6%), transparent 62%);
  box-shadow: inset 0 0 0 8px rgb(112 91 62 / 4%), 0 0 0 1px rgb(255 255 255 / 20%);
  opacity: 0;
  pointer-events: none;
  scale: .84;
  transform: translate3d(
    calc(0px - var(--motion-closing-x)),
    calc(0px - var(--motion-closing-y)),
    0
  ) rotate(calc(0deg - var(--motion-closing-angle)));
  transition: opacity 700ms ease, scale 1000ms var(--softown-ease-out), transform 800ms var(--softown-ease-out);
}

html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal::before,
html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal::after {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, #705b3e 0 76%, rgb(112 91 62 / 18%));
  box-shadow: 0 1px rgb(255 255 255 / 28%);
  content: "";
  transform-origin: 0 50%;
}

html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal::before {
  width: 38%;
  transform: translateY(-50%) rotate(-36deg);
}

html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal::after {
  width: 26%;
  height: 3px;
  transform: translateY(-50%) rotate(212deg);
}

html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal > span {
  position: absolute;
  z-index: 2;
  width: 3px;
  height: 14px;
  border-radius: 999px;
  background: #705b3e;
  box-shadow: 0 0 0 4px rgb(112 91 62 / 5%);
}

html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal > span:nth-child(1) {
  top: 5%;
  left: 50%;
  transform: translateX(-50%);
}

html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal > span:nth-child(2) {
  top: 50%;
  right: 5%;
  width: 14px;
  height: 3px;
  transform: translateY(-50%);
}

html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal > span:nth-child(3) {
  bottom: 5%;
  left: 50%;
  transform: translateX(-50%);
}

html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal > span:nth-child(4) {
  top: 50%;
  left: 5%;
  width: 14px;
  height: 3px;
  transform: translateY(-50%);
}

html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal > i {
  position: absolute;
  inset: 7%;
  border-radius: 50%;
  background: repeating-conic-gradient(from -.5deg, rgb(112 91 62 / 45%) 0 1deg, transparent 1deg 6deg);
  -webkit-mask: radial-gradient(circle, transparent 0 83%, #000 83.5% 87%, transparent 87.5%);
  mask: radial-gradient(circle, transparent 0 83%, #000 83.5% 87%, transparent 87.5%);
}

html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing].is-motion-visible .closing-signal {
  opacity: .78;
  scale: 1;
}

@media (prefers-reduced-motion: no-preference) {
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing].is-motion-visible .closing-signal::before {
    animation: institute-motion-clock-minute 24s linear infinite;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing].is-motion-visible .closing-signal::after {
    animation: institute-motion-clock-hour 144s linear infinite;
  }
}

@keyframes institute-motion-clock-minute {
  to {
    transform: translateY(-50%) rotate(324deg);
  }
}

@keyframes institute-motion-clock-hour {
  to {
    transform: translateY(-50%) rotate(572deg);
  }
}

/* -------------------------------------------------------------------------- */
/* Interacoes exclusivas para mouse/trackpad preciso                           */
/* -------------------------------------------------------------------------- */

@media (hover: hover) and (pointer: fine) {
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-photo]:hover figcaption {
    opacity: 1;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage] .pillar-card:hover::after {
    color: rgb(214 190 150 / 16%);
    opacity: 1;
    transform: translate3d(0, 0, 0) rotate(-1deg) scale(1);
    -webkit-text-stroke-color: rgb(214 190 150 / 48%);
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-scene]:hover figcaption > span:last-child {
    transform: translate(5px, -5px);
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map] .governance-window[data-governance-node]:hover {
    translate: 0 -8px;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing]:has(.closing-link:hover, .closing-link:focus-visible) .closing-orbit {
    scale: .92;
  }
}

/* -------------------------------------------------------------------------- */
/* Responsividade                                                             */
/* -------------------------------------------------------------------------- */

@media (max-width: 900px) {
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage]::after,
  html[data-institute-experience="motion-v2"].institute-motion-ready .field-pointer-network {
    display: none;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active] [data-field-photo],
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage] [data-field-photo] {
    opacity: 1;
    scale: 1;
    translate: none;
  }
}

@media (max-width: 680px) {
  html[data-institute-experience="motion-v2"].institute-motion-ready .diagram-index {
    right: 50%;
    bottom: 3%;
    width: max-content;
    justify-items: center;
    text-align: center;
    transform: translateX(50%);
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .manifesto-principles::before {
    left: -12px;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-motion-step]::before {
    left: -16px;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-motion-step]::after {
    left: -12px;
    width: 16px;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage][data-active] .pillar-card,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage] .pillar-card {
    min-height: 0;
    padding: 30px 26px;
    opacity: 1;
    scale: 1;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage] .pillar-grid {
    gap: 18px;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage] .pillar-card > div {
    padding-bottom: 74px;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage] .pillar-card::after {
    right: 22px;
    bottom: 22px;
    font-size: clamp(52px, 19vw, 92px);
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-scene] {
    margin-top: 92px;
    transform: none;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-media] {
    aspect-ratio: 4 / 3;
    border-radius: 64px 64px 6px 6px;
    box-shadow:
      0 0 0 5px var(--softown-brown-900),
      0 0 0 6px rgb(182 155 114 / 30%),
      0 22px 54px rgb(0 0 0 / 24%);
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-media]::before {
    inset: 7px;
    border-radius: 57px 57px 3px 3px;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-scene] figcaption {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px 18px;
    margin: 22px 2px 0;
    padding-top: 18px;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-scene] figcaption > span:first-child {
    grid-column: 1 / -1;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map][data-motion-active] .governance-window[data-governance-node],
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map] .governance-window[data-governance-node] {
    opacity: 1;
    scale: 1;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map][data-motion-active="one"] .governance-window[data-governance-node="one"],
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map][data-motion-active="two"] .governance-window[data-governance-node="two"],
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map][data-motion-active="three"] .governance-window[data-governance-node="three"] {
    translate: 0 -5px;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid].has-open-card .association-card {
    opacity: .7;
    scale: 1;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid].has-open-card .association-card[open] {
    opacity: 1;
    scale: 1;
    translate: 0 -4px;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-emblem {
    top: auto;
    right: -36px;
    bottom: -42px;
    width: min(310px, 86vw);
    transform: none;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-brand-mark {
    width: 68px;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link {
    width: 100%;
    min-width: 0;
    gap: 20px;
    padding-inline: 16px;
  }
}

/* -------------------------------------------------------------------------- */
/* Acessibilidade: movimento reduzido                                         */
/* -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-hero-diagram] .diagram-orbit,
  html[data-institute-experience="motion-v2"].institute-motion-ready .diagram-signal,
  html[data-institute-experience="motion-v2"].institute-motion-ready .diagram-signal::before,
  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom,
  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-scene,
  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-orbit,
  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-halo,
  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-nucleus,
  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-balloon,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-motion-step],
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-principle],
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-motion-step]::before,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-principle]::before,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-motion-step]::after,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-principle]::after,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage]::after,
  html[data-institute-experience="motion-v2"].institute-motion-ready .field-pointer-network,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-photo],
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-photo] .field-photo-shell,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage] .pillar-card,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage] .pillar-card::after,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-media] picture,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-media] img,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map] [data-governance-path],
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map] [data-governance-node],
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map] [data-governance-point],
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map] .governance-astrolabe-track,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map] .governance-astrolabe-orbit,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map] .governance-needle,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid] .association-card,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid] .association-card summary::before,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-orbit,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-window-mark,
  html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal,
  html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal::before,
  html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal::after,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link::after {
    animation: none;
    transition: none;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-diagram[data-revealed="true"] .hero-atom-scene {
    opacity: 1;
    scale: 1;
    translate: none;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage]::after,
  html[data-institute-experience="motion-v2"].institute-motion-ready .field-pointer-network,
  html[data-institute-experience="motion-v2"].institute-motion-ready .diagram-signal {
    display: none;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal {
    display: block;
    opacity: .64;
    scale: 1;
    transform: none;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link::after {
    display: none;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage][data-motion-active] [data-field-photo],
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage] [data-field-photo] {
    opacity: 1;
    scale: 1;
    translate: var(--field-pointer-x) calc(var(--field-photo-shift) + var(--field-pointer-y));
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage][data-active] .pillar-card,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage] .pillar-card,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-map][data-motion-active] .governance-window[data-governance-node],
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid].has-open-card .association-card,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid].has-open-card .association-card[open],
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid] .association-card.is-motion-active,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-association-grid][data-motion-active] .association-card {
    opacity: 1;
    scale: 1;
    translate: none;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom-photo img,
  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom:hover .hero-atom-photo img,
  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom:focus-visible .hero-atom-photo img,
  html[data-institute-experience="motion-v2"].institute-motion-ready .hero-atom[aria-expanded="true"] .hero-atom-photo img {
    transform: scale(1.025);
    transition: none;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-photo] .field-photo-shell img,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-photo]:hover .field-photo-shell img {
    transform: scale(1.035);
    transition: none;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-infrastructure-media] picture,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-orbit {
    transform: none;
  }
}

/* -------------------------------------------------------------------------- */
/* Contraste forcado                                                          */
/* -------------------------------------------------------------------------- */

@media (forced-colors: active) {
  html[data-institute-experience="motion-v2"].institute-motion-ready .diagram-signal::before,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-motion-step]::before,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage]::after,
  html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal {
    border-color: CanvasText;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .diagram-signal::before,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-motion-step]::before,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-field-stage]::after,
  html[data-institute-experience="motion-v2"].institute-motion-ready .association-card summary::before {
    color: CanvasText;
    background: Canvas;
    forced-color-adjust: auto;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal::before,
  html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal::after,
  html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal > span {
    background: CanvasText;
    box-shadow: none;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .closing-signal > i {
    border: 1px solid CanvasText;
    background: none;
    -webkit-mask: none;
    mask: none;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link:hover,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link:focus-visible {
    border-color: LinkText;
    color: LinkText;
    background: Canvas;
    box-shadow: none;
    filter: none;
    forced-color-adjust: auto;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link::before,
  html[data-institute-experience="motion-v2"].institute-motion-ready [data-closing] .closing-link::after {
    display: none;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-governance-path],
  html[data-institute-experience="motion-v2"].institute-motion-ready .governance-astrolabe-track,
  html[data-institute-experience="motion-v2"].institute-motion-ready .governance-astrolabe-orbit,
  html[data-institute-experience="motion-v2"].institute-motion-ready .governance-needle,
  html[data-institute-experience="motion-v2"].institute-motion-ready .field-pointer-network line {
    stroke: CanvasText;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready .governance-window:focus-visible {
    outline: 3px solid Highlight;
  }

  html[data-institute-experience="motion-v2"].institute-motion-ready [data-pillar-stage] .pillar-card::after {
    color: CanvasText;
  }
}