/* Shared vector arrow system. No Unicode glyphs: stable in Safari and iOS. */
.codara-arrow-svg {
  width: 17px;
  height: 17px;
  display: block;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.codara-arrow-icon,
.codara-inline-arrow {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  font-style: normal;
  line-height: 0;
}

.codara-inline-arrow .codara-arrow-svg {
  width: 15px;
  height: 15px;
}

.codara-data-arrow {
  display: inline-grid;
  place-items: center;
  width: 1em;
  height: 1em;
  margin-inline: 0.16em;
  vertical-align: -0.12em;
  color: currentColor;
}

.codara-data-arrow .codara-arrow-svg {
  width: 1em;
  height: 1em;
}

/* Homepage navigation: replace generated font glyphs with explicit vectors. */
body.cdx2-body .cdx2-menu-nav a::after,
body.cdx2-body .cdx2-menu-meta a::after {
  content: none !important;
  display: none !important;
}

body.cdx2-body .cdx2-menu-nav a > .codara-arrow-icon {
  width: 30px;
  height: 30px;
  color: #60407e;
  opacity: .72;
  transition: color .28s ease, opacity .28s ease, transform .38s cubic-bezier(.16, 1, .3, 1);
}

body.cdx2-body .cdx2-menu-meta a > .codara-arrow-icon {
  width: 36px;
  height: 36px;
  color: #fff;
  background: #3f176f;
  border-radius: 50%;
}

/* Editorial challenge rows. */
body.cdx2-body .cdx2-challenge::after {
  content: none !important;
  display: none !important;
}

body.cdx2-body .cdx2-challenge-arrow {
  grid-column: 4;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  color: #190733;
  background: #f0e6ff;
  border-radius: 50%;
  font-style: normal;
  transition: color .32s ease, background-color .32s ease, transform .42s cubic-bezier(.16, 1, .3, 1);
}

/* Existing round CTA shells keep their geometry; only the icon becomes stable. */
body.cdx2-body :is(.cdx2-text-link > span, .cdx2-faq-note i) .codara-arrow-svg {
  width: 17px;
  height: 17px;
}

.contact-popup-item-arrow {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  color: #55338a;
  background: rgba(255, 255, 255, .82);
  border: 1px solid rgba(85, 51, 138, .12);
  border-radius: 50%;
  line-height: 0;
}

.contact-popup-item-arrow .codara-arrow-svg {
  width: 15px;
  height: 15px;
}

/* Normalize existing inline SVG arrows on inner pages. */
.ct-card-arrow svg,
#site-menu a svg,
.home-cta-icon-wrap svg {
  overflow: visible;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@media (hover: hover) and (pointer: fine) {
  body.cdx2-body .cdx2-menu-nav a:hover > .codara-arrow-icon {
    color: #832eff;
    opacity: 1;
    transform: translate(2px, -2px);
  }

  body.cdx2-body .cdx2-menu-meta a:hover > .codara-arrow-icon {
    color: #832eff;
    background: #fff;
    transform: translate(2px, -2px);
  }

  body.cdx2-body .cdx2-challenge:hover .cdx2-challenge-arrow {
    color: #fff;
    background: #832eff;
    transform: translate(2px, -2px);
  }

  .contact-popup-item:hover .contact-popup-item-arrow {
    color: #fff;
    background: #832eff;
    border-color: #832eff;
    transform: translateX(3px);
  }
}

@media (max-width: 1023px) {
  body.cdx2-body .cdx2-challenge-arrow {
    display: none;
  }
}

@media (max-width: 767px) {
  body.cdx2-body .cdx2-menu-nav a > .codara-arrow-icon {
    width: 28px;
    height: 28px;
    opacity: .82;
  }

  body.cdx2-body .cdx2-menu-meta a > .codara-arrow-icon {
    width: 34px;
    height: 34px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .codara-arrow-icon,
  .codara-inline-arrow,
  .cdx2-challenge-arrow,
  .contact-popup-item-arrow {
    transition: none !important;
  }
}
