/* Raopime additions; the original template remains in style.css. */
html { scroll-behavior: smooth !important; }
[id] { scroll-margin-top: 100px; }
a:focus-visible, button:focus-visible {
  outline: 3px solid #00d1ab;
  outline-offset: 5px;
}
.skip-link {
  position: fixed;
  top: -100px;
  left: 16px;
  z-index: 1050;
  padding: 10px 20px;
  color: #1e1660;
  background: #fff;
  border-radius: 6px;
}
.skip-link:focus { top: 12px; }
.raopime-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font: 800 38px/1.2 'Dosis', sans-serif;
  letter-spacing: -.6px;
}
.raopime-brand i { color: #00d1ab; font-size: 40px; line-height: 1; }
.raopime-brand:hover { color: #fff; }
.navbar.fixed-top .raopime-brand { color: #1e1660; }
.hero-secondary {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-weight: 500;
  padding: 12px 5px;
}
.hero-secondary:hover { color: #fff; text-decoration: underline; }
.feature-item { height: calc(100% - 25px); }
.service-item { height: calc(100% - 25px); display: flex; flex-direction: column; }
.service-arrow { margin-top: auto; padding-top: 16px; }
.footer-logo { margin-bottom: 20px; }
.contact-email { margin-top: 16px; }
.contact-email a { color: #fff; }
.contact-email a:hover { color: #00d1ab; }
.footer-contact a { color: #fff; }
.footer-contact a:hover { color: #00d1ab; }
#scroll-top { visibility: hidden; opacity: 0; transition: opacity .2s; }
#scroll-top.is-visible { visibility: visible; opacity: 1; }
@media (max-width: 991px) {
  .navbar .raopime-brand { padding-left: 0; font-size: 32px; }
  .raopime-brand i { font-size: 34px; }
  .navbar-collapse { border-radius: 8px; }
  .navbar .nav-item .nav-link { padding: 12px 0; }
  .faq-left { margin-bottom: 40px; }
}
@media (max-width: 767px) {
  .hero-wrapper .hero-sub-title { font-size: 18px; }
  .hero-wrapper .hero-btn { flex-wrap: wrap; gap: 12px; }
  .hero-wrapper .hero-img { margin-top: 35px; }
  .cta-content h2 { font-size: 34px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
  }
}
