/* dl-hover.css: ONE hover system for the whole site (owner approved 2026-09-25).
   Brand red #C72D3A; hover red #A3202C (white on it 7.5:1; it on white 7.5:1, on cream 6.84:1).
   On dark surfaces links hover to #FF8A94 (8.03:1 on #161616). Loaded last on every page.
   Built from a live probe of 7 page types (test-series/build_scratch/hover_rollout/probe_before.json):
   in-article links went to #E8352B (4.22:1, fails AA), share buttons and library cards to #E63946
   (3.69 and 3.85:1), red buttons used three different hover reds, and several links had no hover. */

:root { --dl-hover: #a3202c; --dl-hover-tint: #fbe3e5; --dl-hover-dark: #ff8a94; --dl-hover-shadow: 0 8px 20px rgba(199, 45, 58, .32); }

/* 1. Text links on light surfaces: articles, guides, tables, bylines, back links, related items */
html body #dl-main#dl-main :is(p, li, td, th, strong, em, b, i, span, dd, blockquote, figcaption, small) > a:not([class*="btn"]):not([class*="cta"]):not(:is(.g-hero, .h2-hero, .g-nav, [class*="toc"]) a):hover,
html body .entry-content a:not([class*="btn"]):not([class*="cta"]):hover,
html body .article-hero-back:hover,
html body .byline-item a:hover,
html body .dl-eeat-cta a:hover,
html body .dl-eeat-cta:hover {
  color: var(--dl-hover) !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px !important;
}
html body #dl-main#dl-main .dl-related-item:hover, html body .dl-related-item:hover { color: var(--dl-hover) !important; }

/* 2. Cards and tiles whose hover recoloured the text to a low-contrast red */
html body .h2-guide:hover, html body .h2-tile:hover { color: var(--dl-hover) !important; }

/* 3. Solid red buttons: one hover red, a soft lift */
html body .dl-btn-primary:hover, html body a.btn.btn-primary:hover, html body button.btn.btn-primary:hover,
html body .h2-btn:hover, html body .ts-hero-cta a.p:hover, html body .g-btn.red:hover,
html body .capture-form button:hover, html body .dl-inline-newsletter-form button:hover,
html body .pk.is-best .pk-cta:hover, html body .ts-plan.is-best .ts-cta:hover {
  background-color: var(--dl-hover) !important;
  border-color: var(--dl-hover) !important;
  color: #fff !important;
  box-shadow: var(--dl-hover-shadow);
  transform: translateY(-1px);
}
html body .dl-ts-cta-link:hover { box-shadow: var(--dl-hover-shadow); transform: translateY(-1px); color: #fff !important; }

/* 4. Share buttons: red icon on a pale red tint */
html body #dl-main#dl-main .ah-share-btn:hover, html body .ah-share-btn:hover { color: var(--dl-hover) !important; background-color: var(--dl-hover-tint) !important; border-color: var(--dl-hover) !important; }

/* 5. Header: nav links darken; the theme's own underline bar (::after) is the only line, thinned to 1px.
   Search button tints and its icon follows the text colour (an older rule filled the path near-white). */
html body .dl-primary-nav-link:hover { color: #111214 !important; background-color: transparent !important; box-shadow: none !important; }
html body .dl-primary-nav-link::after { height: 1px !important; }
html body .dl-search-trigger:hover { color: var(--dl-hover) !important; background-color: var(--dl-hover-tint) !important; }
html body .dl-search-trigger:hover svg, html body .dl-search-trigger:hover svg * { fill: currentColor !important; }

/* 6. Dark surfaces: utility bar, footer, dark heroes */
html body .dl-utility-actions a:hover, html body .dl-utility-actions button:hover, html body .dl-mode-toggle:hover,
html body .dl-utility-message a:hover, html body .dl-footer a:hover, html body footer a:hover, html body #dl-main#dl-main .g-crumbs a:hover, html body .g-crumbs a:hover,
html body #dl-main#dl-main :is(.g-hero, .h2-hero) a:not([class*="btn"]):not(.ts-hero-cta a):hover, html body :is(.g-hero, .h2-hero) a:not([class*="btn"]):not(.ts-hero-cta a):hover {
  color: var(--dl-hover-dark) !important;
}

/* 7. Expanders: FAQ questions and the PYQ framework toggles */
html body details > summary:not(.dl-mcq-answer summary):hover, html body .dl-mains-framework > summary:hover, html body .dl-prelims-framework > summary:hover { color: var(--dl-hover) !important; }
html body .dl-footer-acc > summary:hover { color: var(--dl-hover-dark) !important; }

/* Motion and keyboard */
html body a, html body button, html body summary { transition: color .15s ease, background-color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
html body a:focus-visible, html body button:focus-visible, html body summary:focus-visible { outline: 2px solid #c72d3a; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { html body a:hover, html body button:hover { transform: none !important; } }