/* AJQ Care Advisory — shared stylesheet
   Handles what inline styles can't: resets, hover states, responsive
   header behaviour, focus states. All one-off layout stays inline in
   each page to match the approved design pixel-for-pixel. */

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{margin:0;background:#FFFFFF;color:#2E2E2C;font-family:Lato,sans-serif;-webkit-font-smoothing:antialiased}
a{color:#0B223C}
a:hover{color:#5B6F57}
:focus-visible{outline:2px solid #DBAD0A;outline-offset:3px}
::selection{background:#F1E074}
img{max-width:100%}

/* Hover states (inline styles can't express :hover, so !important
   is required here to win over the element's inline base colour) */
.hover-sage:hover{color:#5B6F57 !important}
.hover-gold-text:hover{color:#F1E074 !important}
.hover-btn-primary:hover{background:#DBAD0A !important;color:#0B223C !important}
.hover-btn-secondary:hover{background:#FFFBEA !important;border-color:#DBAD0A !important}
.hover-card:hover{border-color:#B9C8B5 !important;box-shadow:0 20px 40px -28px rgba(11,34,60,0.35) !important}
.hover-ddlink:hover{background:#F1F4F0 !important}
.hover-servicetile:hover{border-color:#768C72 !important;background:#F1F4F0 !important}

/* Current-page nav underline */
.nav-current{position:relative}
.nav-current::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;background:#DBAD0A;border-radius:2px}

/* Header responsive: desktop nav vs mobile menu button.
   README: "header switches to mobile layout below 1200px;
   a CSS media query is fine." */
.header-desktop-nav,.header-desktop-actions{display:flex}
.header-mobile-actions{display:none}
.header-mobile-menu{display:none}
@media (max-width:1199px){
  .header-desktop-nav,.header-desktop-actions{display:none !important}
  .header-mobile-actions{display:flex !important}
  header>div:first-child{flex-wrap:wrap}
}
.header-mobile-menu.is-open{display:flex !important}

/* Services dropdown: CSS hover for desktop mouse users, plus a
   JS-toggled .is-open class for click/keyboard access */
.dropdown-wrap{position:relative}
.dropdown-panel{display:none}
@media (min-width:1200px){
  .dropdown-wrap:hover .dropdown-panel{display:block}
}
.dropdown-panel.is-open{display:block !important}

/* Mobile menu icon swap */
.icon-hamburger{display:block}
.icon-close{display:none}
.header-mobile-toggle.is-open .icon-hamburger{display:none}
.header-mobile-toggle.is-open .icon-close{display:block}

/* Form focus states (Contact page) */
input:focus,select:focus,textarea:focus{
  outline:none;
  border-color:#0B223C !important;
  box-shadow:0 0 0 3px rgba(219,173,10,0.35);
}

/* Comparison tables: horizontal scroll under 520px handled by the
   inline overflow-x:auto wrapper already present on each table */
