/* Benefícios dos três banners da Home — 01/10/2026. */
html[data-page="index"] .hero .ri-hero-features {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px 24px;
  width: 100%;
  max-width: 595px;
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
}
html[data-page="index"] .hero .ri-hero-features .ri-hero-feature {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  min-height: 48px;
  margin: 0;
  padding: 0;
  color: #f4f9ff;
  font-size: 20px;
  font-weight: 450;
  line-height: 1.35;
  letter-spacing: 0;
  white-space: normal;
}
html[data-page="index"] .hero .ri-hero-feature::before { display: none; content: none; }
html[data-page="index"] .hero .ri-feature-icon {
  display: grid;
  place-items: center;
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  color: var(--ri-feature-color);
  background: var(--ri-feature-bg);
  box-shadow: inset 0 1px 0 #ffffff14;
}
html[data-page="index"] .hero .ri-feature-icon svg { width: 29px; height: 29px; overflow: visible; }
html[data-page="index"] .hero .ri-icon-fill { fill: currentColor; fill-opacity: .16; stroke: none; }
html[data-page="index"] .hero .ri-feature-blue { --ri-feature-color: #6bc7ff; --ri-feature-bg: #153955; }
html[data-page="index"] .hero .ri-feature-green { --ri-feature-color: #4ae2ba; --ri-feature-bg: #103e3f; }
html[data-page="index"] .hero .ri-feature-amber { --ri-feature-color: #ffd079; --ri-feature-bg: #453820; }
html[data-page="index"] .hero .ri-feature-purple { --ri-feature-color: #c3adff; --ri-feature-bg: #322e55; }
html[data-page="index"] .hero .ri-feature-text { display: block; min-width: 0; }
html[data-page="index"] .hero .ri-feature-secondary { display: block; margin-top: 3px; color: #c5d7e4; font-size: 14px; font-weight: 450; line-height: 1.35; }
html[data-page="index"] .hero .ri-dashboard-features { max-width: 550px; }

/* O movimento fica restrito ao ícone e acompanha a pausa do carrossel. */
html[data-page="index"] .hero-slide.is-active .ri-feature-icon svg { animation: ri-feature-float 3.6s ease-in-out infinite; }
html[data-page="index"] .hero-slide.is-active .ri-hero-feature:nth-child(2) svg { animation-delay: -.7s; }
html[data-page="index"] .hero-slide.is-active .ri-hero-feature:nth-child(3) svg { animation-delay: -1.4s; }
html[data-page="index"] .hero-slide.is-active .ri-hero-feature:nth-child(4) svg { animation-delay: -2.1s; }
html[data-page="index"] .hero-slide.is-active .ri-icon-trace { stroke-dasharray: 48; animation: ri-feature-trace 3.6s ease-in-out infinite; }
html[data-page="index"] .hero.is-paused .ri-feature-icon svg,
html[data-page="index"] .hero.is-paused .ri-icon-trace { animation-play-state: paused; }
html[data-page="index"] .hero.is-paused .ri-icon-trace { animation: none; stroke-dashoffset: 0; }
@keyframes ri-feature-float { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-3px) rotate(-3deg); } }
@keyframes ri-feature-trace { 0%, 12% { stroke-dashoffset: 48; } 52%, 100% { stroke-dashoffset: 0; } }

@media (min-width: 981px) and (max-width: 1120px) {
  html[data-page="index"] .hero .ri-hero-features { max-width: 540px; gap: 18px 20px; }
  html[data-page="index"] .hero .ri-hero-features .ri-hero-feature { font-size: 20px; }
}
@media (max-width: 980px) {
  html[data-page="index"] .hero .ri-hero-features { max-width: 640px; margin-top: 24px; gap: 20px 24px; }
}
@media (max-width: 560px) {
  html[data-page="index"] .hero .ri-hero-features { grid-template-columns: 1fr; gap: 16px; margin-top: 24px; }
  html[data-page="index"] .hero .ri-hero-features .ri-hero-feature { min-height: 42px; gap: 12px; font-size: 20px; }
  html[data-page="index"] .hero .ri-feature-icon { flex-basis: 42px; width: 42px; height: 42px; border-radius: 12px; }
  html[data-page="index"] .hero .ri-feature-icon svg { width: 26px; height: 26px; }
  html[data-page="index"] .hero .ri-feature-secondary { font-size: 13px; margin-top: 2px; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-page="index"] .hero .ri-feature-icon svg,
  html[data-page="index"] .hero .ri-icon-trace { animation: none !important; transform: none !important; stroke-dashoffset: 0; }
}
