/* Our overrides — loaded LAST, after the ported live-site CSS. */

/* The live CSS sets `html,body{overflow-x:hidden}`, which disables position:sticky for
   descendants. `overflow-x:clip` prevents horizontal scroll WITHOUT breaking sticky,
   so the frozen top bar + nav (.dl-sticky-top) works. */
html, body { overflow-x: clip !important; }

/* Footer brand consistency — theme default was teal (#508991); brand guide uses Brand Red. */
.fl-page-footer-widgets a,
.fl-page-footer-widgets a *,
.fl-page-footer-widgets a.fas,
.fl-page-footer-widgets a.fab { color: var(--accent) !important; }
.fl-page-footer-widgets a:hover,
.fl-page-footer-widgets a:focus,
.fl-page-footer-widgets a:hover * { color: #1a1a2e !important; }

/* Social icon circles in brand navy with white glyph; hover -> Brand Red. */
.fl-social-icons .fa-stack .fa-circle.mono { color: #1a1a2e !important; }
.fl-social-icons a:hover .fa-circle.mono { color: var(--accent) !important; }

/* Bottom bar links (copyright row) -> brand for consistency. */
.fl-page-footer a { color: var(--accent) !important; }
.fl-page-footer a:hover { color: #1a1a2e !important; }

/* Darken footer body text — theme grey (#9b9ea1 / #747474) is too faint.
   Use brand body color for readability (links stay red via more specific rules above). */
.fl-page-footer-widgets,
.fl-page-footer-widgets * { color: #3c464e !important; }
.fl-page-footer,
.fl-page-footer .fl-page-footer-text { color: #3c464e !important; }
.dl-footer-legal a { color: #3c464e !important; }
.dl-footer-legal a:hover { color: var(--accent) !important; }

/* "We give owners their time back" comparison — re-brand from off-palette gold/#2c5282 navy.
   Before column: muted neutral. After column: Brand Red accents (it's the pitch card).
   Also fixes the corrupted '¶6' bullet glyph (was a mangled ✕). */
.dl .compare-list-before li::before { content: '\2715' !important; color: #b7bcc2 !important; font-size: 11px !important; }
.dl .compare-subtitle { color: #747474 !important; }
.dl .compare-list-after li::before { background-color: var(--accent) !important; }

/* Pricing ⓘ tooltips on mobile: desktop positions the bubble to the RIGHT of the icon,
   which runs off-screen on narrow viewports. On phones show it as a fixed bottom sheet. */
@media (max-width: 768px) {
  .dl .arp-info .arp-tooltip {
    position: fixed !important;
    left: 16px !important;
    right: 16px !important;
    bottom: 20px !important;
    top: auto !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
    font-size: 14px !important;
    padding: 14px 16px !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.35) !important;
    z-index: 9999 !important;
  }
  .dl .arp-info .arp-tooltip::before { display: none !important; } /* hide the side arrow */
}
/* Equal-height cards: stretch grid items instead of sizing to content. */
.dl .compare-grid { align-items: stretch !important; }
/* Identical card chrome on both sides (same bg, border, shadow). */
.dl .compare-card,
.dl .compare-before,
.dl .compare-after {
  background: #fff !important;
  border: 1px solid #e7e3dc !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05) !important;
}