/* Shared presentation behavior for the five public SEO pages only. */
main.seo-page .seo-hover-card {
  transition: transform 200ms ease, border-color 200ms ease, box-shadow 200ms ease;
  cursor: auto;
}

main.seo-page .block a:not(.btn) {
  color: #5B21B6;
  font-weight: 600;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color 180ms ease, text-decoration-color 180ms ease;
}

main.seo-page .block a:not(.btn):hover {
  color: #6D28D9;
  text-decoration-thickness: 2px;
}

main.seo-page .btn {
  transition: transform 170ms ease, box-shadow 170ms ease, background-color 170ms ease;
}

main.seo-page .cta {
  box-shadow: 0 6px 24px rgba(124,58,237,.05);
  transition: border-color 200ms ease, box-shadow 200ms ease;
}

main.seo-page .faq details {
  transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease;
}

main.seo-page .faq details[open] {
  border-color: #D8B4FE;
  background: #FCFAFF;
}

main.seo-page .faq details:focus-within {
  box-shadow: 0 0 0 3px rgba(124,58,237,.15);
}

main.seo-page .faq summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  list-style: none;
}

main.seo-page .faq summary::-webkit-details-marker { display: none; }

main.seo-page .faq summary::after {
  content: "";
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-right: 2px solid var(--brand);
  border-bottom: 2px solid var(--brand);
  transform: rotate(45deg);
  transition: transform 200ms ease;
}

main.seo-page .faq details[open] summary::after { transform: rotate(225deg); }

@media (hover: hover) and (pointer: fine) {
  main.seo-page .seo-hover-card:hover {
    transform: translateY(-2px);
    border-color: rgba(124,58,237,.35);
    box-shadow: 0 8px 30px rgba(124,58,237,.06);
  }

  main.seo-page .btn:hover {
    transform: translateY(-1px);
    background-color: #1B2740;
    box-shadow: 0 7px 18px rgba(14,23,38,.18);
  }

  main.seo-page .cta:hover {
    border-color: #D8B4FE;
    box-shadow: 0 10px 28px rgba(124,58,237,.08);
  }

  main.seo-page .faq details:hover {
    border-color: #D8B4FE;
    background: #FCFAFF;
  }
}

@media (prefers-reduced-motion: reduce) {
  main.seo-page .seo-hover-card,
  main.seo-page .btn,
  main.seo-page .cta,
  main.seo-page .block a:not(.btn),
  main.seo-page .faq details,
  main.seo-page .faq summary::after { transition: none; }

  main.seo-page .seo-hover-card:hover,
  main.seo-page .btn:hover { transform: none; }
}
