.mo-hero { position: relative; min-height: 820px; overflow: hidden; background: #151515; }
.mo-hero__bg { position: absolute; inset: 0; overflow: hidden; }
.mo-hero__bg img {

  position: absolute; inset: 0;
  width: 100%; height: 100%; max-width: none;
  object-fit: cover; object-position: center;
}
.mo-hero__grad {
  position: absolute; left: 0; right: 0; bottom: 0; top: 51%;
  background: linear-gradient(180deg, rgba(21,21,21,0) 56.94%, #151515 97.65%);
}

.mo-hero__inner {
  position: relative; z-index: 2; min-height: 820px;
  display: flex; align-items: center;

  padding: var(--arx-header-h) 0 56px;
}
.mo-hero__caixa { width: 100%; }
.mo-hero__title {
  margin-top: 14px; max-width: 640px;
  font-size: 56px; line-height: 62px; letter-spacing: -0.68px;
  font-weight: var(--fw-regular); color: var(--arx-white);
}
.mo-hero__title b { color: var(--arx-blue); font-weight: var(--fw-extrabold); }
.mo-hero__sub {
  margin-top: 20px; max-width: 552px;
  font-size: 16px; line-height: 25px; color: var(--arx-grey-90);
}
.mo-hero__acoes { margin-top: 34px; display: flex; gap: 14px; flex-wrap: wrap; }

.mo-story { padding-top: 98px; position: relative; overflow-x: clip; }
.mo-story__head { position: relative; }
.mo-story__title { margin-top: 23px; width: 540px; font-size: 40px; line-height: 46px; font-weight: var(--fw-regular); color: var(--arx-white); }
.mo-story__nav { position: absolute; right: 0; bottom: 8px; display: flex; gap: 6px; }
.mo-navbtn {
  width: 30px; height: 28px; border-radius: 6px; cursor: pointer;
  border: 1px solid #1574ff; background: rgba(72,72,72,.2);
  display: flex; align-items: center; justify-content: center;
  transition: background .25s var(--arx-ease), box-shadow .25s var(--arx-ease), transform .25s var(--arx-ease);
}
.mo-navbtn:hover { background: rgba(21,116,255,.28); box-shadow: 0 0 14px -2px rgba(21,116,255,.6); }
.mo-navbtn--prev:hover { transform: translateX(-2px); }
.mo-navbtn--next:hover { transform: translateX(2px); }
.mo-navbtn img { width: 8px; height: 8px; max-width: none; }
.mo-navbtn--prev img { transform: scaleX(-1); }
.mo-navbtn[disabled] { opacity: .35; pointer-events: none; }
.mo-story__bleed { margin-right: calc((100% - 100vw) / 2); overflow: hidden; padding-bottom: 10px; }
.mo-story__viewport { margin-top: 60px; overflow: hidden; }
.mo-story__track {
  display: flex; width: max-content;
  transition: transform .6s var(--arx-ease);
}
.mo-scard {
  width: 335.25px; flex: none; box-sizing: border-box;
  padding: 0 33px 60px 32px;
  border-right: 1px solid #171e2c;
  opacity: 0; transform: translateY(22px);
  transition: opacity .6s var(--arx-ease), transform .6s var(--arx-ease);
  transition-delay: calc(var(--i, 0) * 110ms);
}
.mo-story__bleed.is-in .mo-scard { opacity: 1; transform: none; }
.mo-scard { transition: background-color .35s var(--arx-ease), opacity .6s var(--arx-ease), transform .6s var(--arx-ease); }
.mo-scard:hover { background: linear-gradient(180deg, rgba(21,116,255,.07), rgba(21,116,255,0)); }
.mo-scard:hover .mo-scard__title { color: #ffffff; }
.mo-scard:hover .mo-scard__num { color: var(--arx-blue); }
.mo-scard__num { font-size: 17px; line-height: 28px; letter-spacing: -0.4px; color: #eaeaea; transition: color .3s var(--arx-ease); }
.mo-scard__title { transition: color .3s var(--arx-ease); }
.mo-scard__body { margin-top: 100px; }
.mo-scard__title { font-size: 30px; line-height: 38px; letter-spacing: -0.6px; color: #eaeaea; font-weight: var(--fw-regular); }
.mo-scard__desc { margin-top: 12px; font-size: 16px; line-height: 26px; letter-spacing: -0.36px; color: #9ea6b6; }
.mo-story__rail { position: relative; height: 3px; margin-top: 17px; }
.mo-story__rail-base { position: absolute; inset: 0; background: #171e2c; border-radius: 3px; }
.mo-story__rail-fill {
  position: absolute; inset: 0; border-radius: 3px;
  background: linear-gradient(90deg, rgba(21,116,255,0), #1574ff);
}
.mo-story__rail-glow {
  position: absolute; left: 0; top: 0; height: 3px; width: 1280px; max-width: 100%;
  background: linear-gradient(90deg, rgba(21,116,255,0), #1574ff);
  filter: blur(4.35px); pointer-events: none;
}
.mo-story__dots { position: absolute; inset: 0; pointer-events: none; }
.mo-dot {
  position: absolute; top: 50%; margin-top: -9px; width: 18px; height: 18px;
  border-radius: 50%; box-sizing: border-box;
  border: 2px solid rgba(255,255,255,.45); background: rgba(255,255,255,.10);
  transition: border-color .4s var(--arx-ease), background .4s var(--arx-ease), box-shadow .4s var(--arx-ease);
}
.mo-dot.is-on {
  border-color: #ffffff; background: rgba(255,255,255,.5);
  box-shadow: 0 0 10px rgba(120,180,255,.55);
}

.mo-ask { padding-top: 107px; position: relative; overflow-x: clip; }
.mo-ask__panel {
  position: relative; height: 512px; border-radius: 20px; overflow: hidden;
  background: url("../img/missoes/chip-bg.png") 50% 0 / 126.91% 100% no-repeat;
}
.mo-ask__panel::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px;
  background: linear-gradient(107deg,
    #1a6ad8 0%, #17407e 11%, #1b2b45 24%,
    rgba(30,44,70,.55) 42%, rgba(255,255,255,.05) 72%, rgba(255,255,255,.03) 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  pointer-events: none; z-index: 3;
}
.mo-ask__panel .arx-eyebrow { position: absolute; left: 132px; top: 123px; }
.mo-ask__title {
  position: absolute; left: 132px; top: 171px; width: 421px;
  font-size: 64px; line-height: 60px; font-weight: var(--fw-regular); color: var(--arx-white);
}
.mo-ask__title b { font-weight: var(--fw-bold); color: var(--arx-blue); }
.mo-ask__sub { position: absolute; left: 132px; top: 326px; width: 435px; font-size: 20px; line-height: 22.4px; color: var(--arx-white); }
.mo-ask__media {
  position: absolute; left: 52.11%; right: 10.39%; top: 61px; height: 390px;
  border-radius: 12px;
}
.mo-ask__media::before {
  content: ""; position: absolute; inset: -14% -18%;
  background: radial-gradient(52% 55% at 50% 50%, rgba(21,116,255,.4), rgba(21,116,255,.12) 55%, transparent 78%);
  pointer-events: none;
}
.mo-ask__media img.foto {
  position: relative; width: 100%; height: 100%; object-fit: cover;
  border-radius: 12px; transform: scaleX(-1);
}
.mo-ask__3d { position: absolute; left: 994px; top: 290px; width: 181px; height: 204px; max-width: none; z-index: 2; }

.mo-sol { padding-top: 102px; }
.mo-sol .cv-head { margin-bottom: 45px; }
.mo-sol__grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 22.7px 25px; }
.mo-card {
  position: relative; width: 406px; height: 356px; border-radius: 10px; padding: 1px;
  background: linear-gradient(131.4deg, #1574ff 0%, rgba(112,112,112,.2) 24%);
  transition: transform .3s var(--arx-ease);
}
.mo-card:hover { transform: translateY(-4px); }
.mo-card__in { position: relative; height: 100%; border-radius: 10px; overflow: hidden; background: #1b1b1b; }
.mo-card__ico { position: absolute; left: 66px; top: 50px; height: 55px; max-width: none; }
.mo-card__num {
  position: absolute; right: 110px; top: 277px; transform: translate(50%, -50%);
  font-size: 128px; line-height: 128px; font-weight: var(--fw-medium);
  letter-spacing: -5px; white-space: nowrap;
  background: linear-gradient(180deg, #ffffff 13%, rgba(255,255,255,0) 87%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  opacity: .2; pointer-events: none;
}
.mo-card h3 {
  position: absolute; left: 66px; top: 129px; right: 52px;
  font-size: 32px; line-height: 28px; font-weight: var(--fw-semibold); color: var(--arx-white);
}
.mo-card p { position: absolute; left: 66px; top: 177px; width: 288px; font-size: 16px; line-height: 18px; color: rgba(255,255,255,.6); }
.mo-card p b { display: block; margin-top: 18px; font-weight: var(--fw-regular); color: var(--arx-white); }
.mo-card__more {
  position: absolute; left: 66px; top: 296px;
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 16px; line-height: 18px; color: var(--arx-blue);
}
.mo-card__more::after {
  content: ""; width: 9px; height: 9px; background: var(--arx-blue);
  -webkit-mask: url("../img/civitas/mod-arrow.svg") center / contain no-repeat;
          mask: url("../img/civitas/mod-arrow.svg") center / contain no-repeat;
  transition: transform .25s var(--arx-ease);
}
.mo-card:hover .mo-card__more::after { transform: translate(2px, -2px); }

.mo-res { padding-top: 128px; position: relative; overflow-x: clip; }
.mo-res__grid { position: relative; min-height: 523px; }
.mo-res .arx-eyebrow { position: absolute; left: 1px; top: 0; }
.mo-res__title { position: absolute; left: 0; top: 45px; font-size: 40px; line-height: 46px; font-weight: var(--fw-regular); color: var(--arx-white); }
.mo-res__txt { position: absolute; left: 1px; top: 113px; width: 435px; font-size: 20px; line-height: 22.4px; color: var(--arx-white); }
.mo-res__sign {
  display: block; margin-top: 22px;
  font-size: 24px; line-height: 22.4px;
  font-weight: var(--fw-semibold); color: var(--arx-blue);
}
.mo-res__list { position: absolute; left: 670px; top: 0; width: 598px; display: flex; flex-direction: column; gap: 17px; }
.mo-row {
  position: relative; height: 91px; border-radius: 10px; padding: 1px;
  background: linear-gradient(168.8deg, #1574ff 0%, rgba(112,112,112,.2) 24%);
  transition: transform .3s var(--arx-ease);
}
.mo-row:hover { transform: translateX(6px); }
.mo-row__in { position: relative; height: 100%; border-radius: 10px; overflow: hidden; background: #1b1b1b; display: flex; align-items: center; }
.mo-row__in img { position: absolute; left: 59px; width: 28.6px; height: 31px; max-width: none; }
.mo-row__in span { margin-left: 106px; font-size: 24px; line-height: 22.4px; color: var(--arx-white); }

.mo-next { padding-top: 163px; }
.mo-next__grid { margin-top: 60px; display: flex; justify-content: space-between; }
.mo-ncard {
  position: relative; width: 301px; height: 343px; border-radius: 10px; padding: 1px;
  background: linear-gradient(124.2deg, #1574ff 0%, rgba(112,112,112,.2) 24%);
  transition: transform .3s var(--arx-ease);
}
.mo-ncard::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px;
  background: conic-gradient(from var(--arx-beam),
    transparent 0deg, transparent 78%,
    rgba(88,150,255,.55) 88%, rgba(160,200,255,.85) 92%, rgba(88,150,255,.55) 96%,
    transparent 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  opacity: 0; transition: opacity .4s var(--arx-ease); pointer-events: none; z-index: 2;
}
.mo-ncard:hover { transform: translateY(-4px); }
.mo-ncard:hover::after { opacity: 1; animation: arx-beam-spin 3.5s linear infinite; }
.mo-ncard__ico { transition: transform .35s var(--arx-ease); }
.mo-ncard:hover .mo-ncard__ico { transform: scale(1.08); }
.mo-ncard__in { position: relative; height: 100%; border-radius: 10px; overflow: hidden; background: #1b1b1b; }
.mo-ncard__ico { position: absolute; left: 26px; top: 45px; height: 44px; max-width: none; }
.mo-ncard h3 {
  position: absolute; left: 24px; right: 24px; top: 119px;
  font-size: 24px; line-height: 28px; font-weight: var(--fw-semibold); color: var(--arx-white);
}
.mo-ncard p { position: absolute; left: 24px; right: 24px; font-size: 14px; line-height: 18px; color: rgba(255,255,255,.6); }
.mo-ncard--1l p { top: 167px; }
.mo-ncard--2l p { top: 195px; }
.mo-ncard__link {
  position: absolute; left: 25px; top: 277px;
  width: 30px; height: 28px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,.4); background: rgba(72,72,72,.2);
  display: flex; align-items: center; justify-content: center;
  transition: background .25s var(--arx-ease), border-color .25s var(--arx-ease);
}
.mo-ncard:hover .mo-ncard__link {
  background: var(--arx-blue); border-color: var(--arx-blue);
  transform: translate(2px, -2px); box-shadow: 0 4px 18px -6px rgba(21,116,255,.6);
}
.mo-ncard__link img { width: 8px; height: 8px; max-width: none; transition: transform .25s var(--arx-ease); }
.mo-ncard:hover .mo-ncard__link img { transform: translate(1px, -1px); }

@media (prefers-reduced-motion: reduce) {
  .mo-scard { opacity: 1; transform: none; transition: none; }
  .mo-ncard:hover::after { animation: none; opacity: .5; }
}

.mo-card::after, .mo-row::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px;
  background: conic-gradient(from var(--arx-beam),
    transparent 0deg, transparent 78%,
    rgba(88,150,255,.55) 88%, rgba(160,200,255,.85) 92%, rgba(88,150,255,.55) 96%,
    transparent 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  opacity: 0; transition: opacity .4s var(--arx-ease); pointer-events: none; z-index: 2;
}
.mo-card:hover::after, .mo-row:hover::after { opacity: 1; animation: arx-beam-spin 3.5s linear infinite; }
.mo-card { box-shadow: 0 0 0 0 rgba(21,116,255,0); }
.mo-card:hover { box-shadow: 0 16px 44px -22px rgba(21,116,255,.5); }
.mo-card__ico { transition: transform .35s var(--arx-ease); }
.mo-card:hover .mo-card__ico { transform: scale(1.08); }
.mo-row__in img { transition: transform .35s var(--arx-ease); }
.mo-row:hover .mo-row__in img { transform: scale(1.12); }
html.arx-anim .mo-ask__panel[data-reveal] {
  transition: opacity .7s var(--arx-ease), transform .7s var(--arx-ease), box-shadow .4s var(--arx-ease);
}
.mo-ask__panel { transition: box-shadow .4s var(--arx-ease); }
.mo-ask__panel:hover { box-shadow: 0 0 60px -20px rgba(21,116,255,.45); }

@media (prefers-reduced-motion: reduce) {
  .mo-card:hover::after, .mo-row:hover::after { animation: none; opacity: .5; }
}

.mo-dia { padding-block: 68px; position: relative; overflow-x: clip; }
.mo-dia__head { max-width: 720px; }
.mo-dia__h2 {
  font-size: 40px; line-height: 46px;
  font-weight: var(--fw-regular); color: var(--arx-white);
}
.mo-dia__sub { margin-top: 14px; font-size: 16px; line-height: 24px; color: var(--arx-grey-90); }

.mo-dia__linha {

  --vao: 32px;
  margin-top: 64px; display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--vao);
}
.mo-dia__passo {
  --recuo: 28px;
  position: relative; display: flex; flex-direction: column;
  padding: 32px var(--recuo) 34px; border-radius: 18px;
  background: rgba(255,255,255,.022);
  transition: transform .35s var(--arx-ease), border-color .35s var(--arx-ease),
              background-color .35s var(--arx-ease);
}
.mo-dia__passo:hover {
  transform: translateY(-6px); border-color: rgba(21,116,255,.55); background: rgba(21,116,255,.05);
}

.mo-dia__passo + .mo-dia__passo .mo-dia__arte::before {
  content: ""; position: absolute; top: 50%;

  left: calc(-1 * (var(--recuo) + var(--vao) / 2 + 7px));
  width: 14px; height: 14px; margin-top: -7px;
  border-top: 1.5px solid rgba(21,116,255,.5);
  border-right: 1.5px solid rgba(21,116,255,.5); transform: rotate(45deg);
}
.mo-dia__arte { position: relative; }
.mo-dia__hora {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 22px; line-height: 26px; letter-spacing: -.4px;
  font-weight: var(--fw-semibold); color: var(--arx-blue);
  font-variant-numeric: tabular-nums;
}
.mo-dia__relogio { flex: none; width: 24px; height: 24px; max-width: none; opacity: .8; }

.mo-dia__arte {
  margin: 26px 0 0; display: block;
}
.arx-ilustracao svg { display: block; width: 100%; height: auto; }

.mo-dia__cena { width: 166px; height: 116px; max-width: none; color: var(--arx-blue-border); }
.mo-dia__titulo {
  margin-top: 26px; font-size: 16px; line-height: 23px;
  font-weight: var(--fw-semibold); color: var(--arx-white);
}
.mo-dia__desc { margin-top: 10px; font-size: 14px; line-height: 21px; color: var(--arx-grey-70); }

html.arx-anim .mo-dia__passo {
  opacity: 0; transform: translateY(20px);
  transition: opacity .55s var(--arx-ease), transform .55s var(--arx-ease),
              border-color .35s var(--arx-ease), background-color .35s var(--arx-ease);
  transition-delay: calc(var(--i, 0) * 100ms);
}
html.arx-anim .mo-dia__linha.is-revealed .mo-dia__passo { opacity: 1; transform: none; }
html.arx-anim .mo-dia__linha.is-revealed .mo-dia__passo:hover { transform: translateY(-6px); }
@media (prefers-reduced-motion: reduce) {
  html.arx-anim .mo-dia__passo { opacity: 1; transform: none; transition: none; }
}

.mo-imp { padding-block: 68px; position: relative; overflow-x: clip; }
.mo-imp__head { max-width: 720px; }
.mo-imp__h2 { font-size: 40px; line-height: 46px; font-weight: var(--fw-regular); color: var(--arx-white); }
.mo-imp__sub { margin-top: 14px; font-size: 16px; line-height: 24px; color: var(--arx-grey-90); }

.mo-imp__grid {
  margin-top: 64px; display: grid; grid-template-columns: 296px 1fr; gap: 32px; align-items: stretch;
}

.mo-imp__quadro {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 34px 26px; border-radius: 18px;
  background: rgba(255,255,255,.022);
}
.mo-imp__grafico { position: relative; width: 180px; height: 180px; }
.mo-imp__rosca { width: 100%; height: 100%; max-width: none; }
.mo-imp__centro {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  text-align: center; font-size: 12px; line-height: 16px; color: var(--arx-grey-90);
}
.mo-imp__legenda { margin-top: 28px; width: 100%; list-style: none; padding: 0; }
.mo-imp__legenda li {
  display: flex; align-items: center; gap: 9px;
  font-size: 12.5px; line-height: 26px; color: var(--arx-grey-90);
}
.mo-imp__legenda b { margin-left: auto; font-weight: var(--fw-semibold); color: var(--arx-white); }
.mo-imp__legenda i { flex: none; width: 9px; height: 9px; border-radius: 50%; }

.mo-imp__cards { display: grid; grid-template-columns: repeat(5, 1fr); gap: 22px; }
.mo-imp__card {
  position: relative; display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: 34px 22px 30px; border-radius: 18px;
  background: rgba(255,255,255,.022);
  transition: transform .35s var(--arx-ease), border-color .35s var(--arx-ease),
              background-color .35s var(--arx-ease);
}
.mo-imp__card:hover { transform: translateY(-6px); border-color: rgba(21,116,255,.55); background: rgba(21,116,255,.05); }

.mo-imp__anel {
  position: relative; display: grid; place-items: center;
  width: 62px; height: 62px; border-radius: 50%;
  background:
    radial-gradient(72% 72% at 50% 18%, rgba(255,255,255,.055), transparent 62%),
    rgba(24,24,24,.2);
}
.mo-imp__anel::before {
  content: ""; position: absolute; inset: 0; border-radius: 50%; padding: 1px;
  background: linear-gradient(100deg, var(--arx-blue) 0%, var(--arx-blue) 35%,
    color-mix(in srgb, var(--arx-blue) 30%, #181818) 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none;
}

.mo-imp__ico { width: 38px; height: 38px; color: var(--arx-blue); }
.mo-imp__nome {
  margin-top: 16px; font-size: 15px; line-height: 21px;
  font-weight: var(--fw-semibold); color: var(--arx-white);
}
.mo-imp__desc { margin-top: 10px; flex: 1; font-size: 12.5px; line-height: 18px; color: var(--arx-grey-70); }
.mo-imp__pct {
  margin-top: 16px; font-size: 26px; line-height: 30px;
  font-weight: var(--fw-semibold); color: var(--arx-blue);
  font-variant-numeric: tabular-nums;
}

html.arx-anim .mo-imp__card {
  opacity: 0; transform: translateY(20px);
  transition: opacity .55s var(--arx-ease), transform .55s var(--arx-ease),
              border-color .35s var(--arx-ease), background-color .35s var(--arx-ease);
  transition-delay: calc(var(--i, 0) * 90ms);
}
html.arx-anim .mo-imp__grid.is-revealed .mo-imp__card { opacity: 1; transform: none; }
html.arx-anim .mo-imp__grid.is-revealed .mo-imp__card:hover,
html.arx-anim .mo-imp__grid.is-revealed .mo-imp__card.is-ativo { transform: translateY(-6px); }
@media (prefers-reduced-motion: reduce) {
  html.arx-anim .mo-imp__card { opacity: 1; transform: none; transition: none; }
}

.mo-como { padding-block: 68px; position: relative; overflow-x: clip; }
.mo-como__head { max-width: 720px; }
.mo-como__h2 { font-size: 40px; line-height: 46px; font-weight: var(--fw-regular); color: var(--arx-white); }
.mo-como__h2 b { color: var(--arx-blue); font-weight: var(--fw-extrabold); }
.mo-como__sub { margin-top: 14px; font-size: 16px; line-height: 24px; color: var(--arx-grey-90); }

.mo-como__grid {

  --selo: 345.8px; --vao: 18.9px;
  position: relative; margin-top: 72px;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--vao);
}

.mo-como__etapa {
  position: relative;
  display: grid; grid-template-rows: 1fr var(--selo) 1fr;
  justify-items: center; text-align: center;
}
.mo-como__texto { max-width: 306px; }
.mo-como__etapa[data-lado="cima"]  .mo-como__texto { grid-row: 1; align-self: end;   padding-bottom: 40px; }
.mo-como__etapa[data-lado="baixo"] .mo-como__texto { grid-row: 3; align-self: start; padding-top: 40px; }

.mo-como__etapa + .mo-como__etapa::before {
  content: ""; position: absolute; z-index: 0;
  left: calc(var(--vao) / -2); top: 50%;
  width: 12px; height: 12px; margin: -6px 0 0 -6px;
  border-radius: 50%; background: rgba(255,255,255,.6);
  box-shadow: 0 0 10px rgba(255,255,255,.3);
}
.mo-como__num {
  display: block; font-size: 15px; line-height: 20px; letter-spacing: .7px;
  text-transform: uppercase; font-weight: var(--fw-semibold); color: var(--arx-blue);
}
.mo-como__desc { margin-top: 14px; font-size: 15.5px; line-height: 23px; color: var(--arx-grey-70); }

.mo-como__selo { position: relative; grid-row: 2; z-index: 1; width: var(--selo); height: var(--selo); }
.mo-como__anel { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; overflow: visible; }
.mo-como__anel circle, .mo-como__anel path { fill: none; }
.mo-como__anel-base {

  stroke: rgba(255,255,255,.5); stroke-width: 2.1; stroke-linecap: round;
  stroke-dasharray: .1 33.23;
}
.mo-como__anel-arco {
  stroke: var(--arx-blue); stroke-width: 6; stroke-linecap: round;
  stroke-dasharray: 27 73; stroke-dashoffset: 13.5;
  filter: drop-shadow(0 0 10px rgba(21,116,255,.5));
}

.mo-como__etapa[data-arco="cima"]  .mo-como__anel-arco { transform: rotate(-90deg); transform-origin: 50% 50%; }
.mo-como__etapa[data-arco="baixo"] .mo-como__anel-arco { transform: rotate(90deg);  transform-origin: 50% 50%; }

.mo-como__selo::before {

  content: ""; position: absolute; z-index: 2; left: 50%; margin-left: -16.5px;
  width: 33px; height: 33px; border-radius: 50%;

  background: radial-gradient(circle,
    var(--arx-blue) 4.5px, #fff 4.7px, #fff 9.2px, var(--arx-blue) 9.4px);
  box-shadow: 0 0 0 4px #101114, 0 0 20px rgba(21,116,255,.8);
}
.mo-como__etapa[data-arco="cima"]  .mo-como__selo::before { top: -6.1px; }
.mo-como__etapa[data-arco="baixo"] .mo-como__selo::before { bottom: -6.1px; }

.mo-como__miolo {
  position: absolute; inset: 22px; border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 0 36px; text-align: center;

  background:
    radial-gradient(78% 78% at 50% 12%, rgba(255,255,255,.055), transparent 66%),
    #17181c;
}
.mo-como__ico { width: 70px; height: 70px; color: var(--arx-blue-border); }
.mo-como__marca {
  margin-top: 20px; font-size: 19px; letter-spacing: 1.8px;
  text-transform: uppercase; font-weight: var(--fw-semibold); color: var(--arx-white);
}
.mo-como__servico {
  margin-top: 9px; font-size: 15px; line-height: 20px; letter-spacing: .5px;
  text-transform: uppercase; color: var(--arx-grey-90);
}

html.arx-anim .mo-como__grid { --t: 560ms; }

html.arx-anim .mo-como__texto { opacity: 0; }
html.arx-anim .mo-como__miolo { opacity: 0; }
html.arx-anim .mo-como__anel-arco { stroke-dasharray: 0 100; stroke-dashoffset: 0; opacity: 0; }
html.arx-anim .mo-como__anel-base { opacity: 0; }
html.arx-anim .mo-como__selo::before { opacity: 0; }
html.arx-anim .mo-como__etapa + .mo-como__etapa::before { opacity: 0; }

html.arx-anim .mo-como__grid.is-revealed .mo-como__texto {
  animation: mo-txt .55s var(--arx-ease) both;
  animation-delay: calc(var(--i, 0) * var(--t));
}
html.arx-anim .mo-como__grid.is-revealed .mo-como__miolo {
  animation: mo-disco .5s var(--arx-ease) both;
  animation-delay: calc(var(--i, 0) * var(--t) + 40ms);
}
html.arx-anim .mo-como__grid.is-revealed .mo-como__anel-arco {
  animation: mo-arco .62s var(--arx-ease) both;
  animation-delay: calc(var(--i, 0) * var(--t) + 140ms);
}
html.arx-anim .mo-como__grid.is-revealed .mo-como__selo::before {
  animation: mo-conta .44s cubic-bezier(.34,1.56,.64,1) both;
  animation-delay: calc(var(--i, 0) * var(--t) + 560ms);
}
html.arx-anim .mo-como__grid.is-revealed .mo-como__anel-base {
  animation: mo-perolas .52s var(--arx-ease) both;
  animation-delay: calc(var(--i, 0) * var(--t) + 660ms);
}

html.arx-anim .mo-como__grid.is-revealed .mo-como__etapa + .mo-como__etapa::before {
  animation: mo-no .42s cubic-bezier(.34,1.56,.64,1) both;
  animation-delay: calc((var(--i, 1) - 1) * var(--t) + 1180ms);
}

@keyframes mo-txt    { from { opacity: 0; transform: translateY(18px); }
                       to   { opacity: 1; transform: none; } }
@keyframes mo-disco  { from { opacity: 0; transform: scale(.88); }
                       to   { opacity: 1; transform: none; } }
@keyframes mo-arco   { from { stroke-dasharray: 0 100;  stroke-dashoffset: 0;    opacity: 0; }
                       15%  { opacity: 1; }
                       to   { stroke-dasharray: 27 73;  stroke-dashoffset: 13.5; opacity: 1; } }
@keyframes mo-conta  { from { opacity: 0; transform: scale(0); }
                       to   { opacity: 1; transform: scale(1); } }
@keyframes mo-perolas{ from { opacity: 0; stroke-dashoffset: -33.23; }
                       to   { opacity: 1; stroke-dashoffset: 0; } }
@keyframes mo-no     { from { opacity: 0; transform: scale(0); }
                       to   { opacity: 1; transform: scale(1); } }

@media (prefers-reduced-motion: reduce) {
  html.arx-anim .mo-como__texto,
  html.arx-anim .mo-como__miolo,
  html.arx-anim .mo-como__anel-base,
  html.arx-anim .mo-como__selo::before,
  html.arx-anim .mo-como__etapa + .mo-como__etapa::before { opacity: 1; }
  html.arx-anim .mo-como__anel-arco { stroke-dasharray: 27 73; stroke-dashoffset: 13.5; opacity: 1; }
  html.arx-anim .mo-como__grid.is-revealed :is(.mo-como__texto, .mo-como__miolo,
    .mo-como__anel-arco, .mo-como__anel-base) { animation: none; }
  html.arx-anim .mo-como__grid.is-revealed .mo-como__selo::before,
  html.arx-anim .mo-como__grid.is-revealed .mo-como__etapa + .mo-como__etapa::before { animation: none; }
}

.mo-imp__fatia {
  stroke-dasharray: var(--dash) var(--vao);
  transition: opacity .3s var(--arx-ease), stroke-width .3s var(--arx-ease),
              filter .3s var(--arx-ease);
  cursor: pointer;
}
.mo-imp__rotulo {
  font-size: 8.4px; font-weight: 700; letter-spacing: -.2px;
  font-family: var(--ff-body, sans-serif); pointer-events: none;
}

html.arx-anim .mo-imp__fatia { stroke-dasharray: 0 100; }
html.arx-anim .mo-imp__rotulo { opacity: 0; }
html.arx-anim .mo-imp__grid.is-revealed .mo-imp__fatia {
  animation: mo-fatia .9s var(--arx-ease) both;
  animation-delay: calc(var(--i, 0) * 130ms);
}
html.arx-anim .mo-imp__grid.is-revealed .mo-imp__rotulo {
  animation: mo-rotulo .5s var(--arx-ease) both;
  animation-delay: calc(var(--i, 0) * 130ms + 560ms);
}
@keyframes mo-fatia { from { stroke-dasharray: 0 100; } to { stroke-dasharray: var(--dash) var(--vao); } }
@keyframes mo-rotulo { from { opacity: 0; } to { opacity: 1; } }

.mo-imp__fatia.is-apagada { opacity: .25; }
.mo-imp__fatia.is-ativa {
  opacity: 1; stroke-width: 21; filter: drop-shadow(0 0 7px rgba(21,116,255,.55));
}
.mo-imp__card.is-ativo {
  transform: translateY(-6px); border-color: rgba(21,116,255,.55); background: rgba(21,116,255,.05);
}
.mo-imp__legenda li.is-ativa { color: var(--arx-white); }

.mo-imp__legenda li[data-fatia="financeiro"] i { background: #1574ff; }
.mo-imp__legenda li[data-fatia="operacional"] i { background: #3d8bff; }
.mo-imp__legenda li[data-fatia="cliente"] i { background: #67a6ff; }
.mo-imp__legenda li[data-fatia="reputacao"] i { background: #93c1ff; }
.mo-imp__legenda li[data-fatia="compliance"] i { background: #c2ddff; }
.mo-imp__legenda li { transition: color .25s var(--arx-ease); }

@media (prefers-reduced-motion: reduce) {
  html.arx-anim .mo-imp__fatia { stroke-dasharray: var(--dash) var(--vao); }
  html.arx-anim .mo-imp__rotulo { opacity: 1; }
  html.arx-anim .mo-imp__grid.is-revealed .mo-imp__fatia,
  html.arx-anim .mo-imp__grid.is-revealed .mo-imp__rotulo { animation: none; }
}

.mo-imp__card.is-ativo::after {
  opacity: 1; animation: arx-beam-spin 3.5s linear infinite;
}

.mo-dia__frase {
  margin-top: 14px; padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.08);
  font-size: 13px; line-height: 19px; font-style: italic; color: var(--arx-blue-border);
}
.mo-dia__remate {
  margin-top: 40px; display: flex; align-items: center; justify-content: center; gap: 16px;
  padding: 26px 34px; border-radius: 18px;
  background: rgba(255,255,255,.022);
  text-align: center;
}
.mo-dia__remate-ico { flex: none; width: 34px; height: 34px; color: var(--arx-blue); }
.mo-dia__remate p { font-size: 15.5px; line-height: 23px; color: var(--arx-grey-90); }
.mo-dia__remate b { color: var(--arx-blue-border); font-weight: var(--fw-semibold); }