/* LPI mobile / contrast fixes (Nov 13, 2026). Rollback: deactivate LPI SEO Fixes or restore the plugin. */

:root {
  --lpi-accent: #C24600;
  --lpi-accent-dark: #A83C00;
  --accent: #C24600;
  --accent-dark: #A83C00;
  --wp--preset--color--secondary: #C24600;
}

.has-secondary-color,
.has-secondary-color a,
p.eyebrow,
.eyebrow {
  color: #C24600 !important;
}

/* In-content, footer, and cookie links were the failing contrast set.
   Header nav links stay slate gray. */
.wp-block-post-content a,
.entry-content a,
.wp-block-paragraph a,
.site-footer a,
.wp-block-group.site-footer a,
#lpi-cookie-banner a {
  color: #C24600;
}
.wp-block-post-content a:hover,
.entry-content a:hover,
.wp-block-paragraph a:hover,
.site-footer a:hover,
#lpi-cookie-banner a:hover {
  color: #A83C00;
}

#lpi-cookie-accept,
.wpcf7 input[type="submit"],
.wpcf7-submit {
  background: #C24600 !important;
  color: #ffffff !important;
}
#lpi-cookie-accept {
  min-height: 48px;
  min-width: 88px;
  padding: 12px 20px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
  border-radius: 8px;
}

/* Filled brand buttons: white on #ff6500 was under 3:1. Same deeper orange. */
.btn,
a.btn,
.wp-block-navigation .btn,
.wp-block-navigation .btn .wp-block-navigation-item__content,
.wp-block-navigation .btn .wp-block-navigation-item__label,
.has-secondary-background-color {
  background-color: #C24600 !important;
  color: #ffffff !important;
}
.btn:hover,
a.btn:hover,
.wp-block-navigation .btn:hover {
  background-color: #A83C00 !important;
  color: #ffffff !important;
}

/* Cookie banner: on small screens pin to the top and push the page down
   so it cannot cover Request a Quote or other mid-viewport CTAs. */
#lpi-cookie-banner .lpi-cookie-inner {
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
@media (max-width: 781px) {
  /* Pin a compact banner to the top and reserve its height in CSS from
     the first paint (avoids CLS). Padding pushes CTAs below the banner
     so they are not covered. */
  #lpi-cookie-banner {
    top: 0 !important;
    bottom: auto !important;
    border-top: 0 !important;
    border-bottom: 1px solid #e2e8f0 !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06) !important;
    padding: 8px 16px !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
  }
  #lpi-cookie-banner .lpi-cookie-inner {
    gap: 10px !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
  }
  #lpi-cookie-banner p {
    margin: 0 !important;
    flex: 1 1 auto;
  }
  html:not(.lpi-cookie-dismissed) body {
    padding-top: 108px !important;
    padding-bottom: 0 !important;
  }
  html:not(.lpi-cookie-dismissed) #lpi-cookie-banner {
    display: block !important;
  }
  html.lpi-cookie-dismissed body {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  html.lpi-cookie-dismissed #lpi-cookie-banner {
    display: none !important;
  }
}

/* Sharper logo, keep 180px display width */
.custom-logo-link .custom-logo,
img.custom-logo {
  width: 180px;
  height: auto;
  max-height: 61px;
}

/* ---- Mobile navigation: 48px targets, no wrapping ----
   Do not force display here — that leaked the hamburger and close
   control onto desktop. Display is set only inside the 781px query. */
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
  min-width: 48px !important;
  min-height: 48px !important;
  width: 48px !important;
  height: 48px !important;
  padding: 0 !important;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
.wp-block-navigation__responsive-container-open svg,
.wp-block-navigation__responsive-container-close svg {
  width: 28px;
  height: 28px;
}

/* WP's overlay "mobile" breakpoint is 600px; extend to 781px so the
   header never wraps Contact between 600 and ~780. */
@media (max-width: 781px) {
  .site-header .container.nav {
    flex-wrap: nowrap !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }
  .wp-block-navigation .wp-block-navigation__responsive-container-open:not(.always-shown) {
    display: flex !important;
  }
  .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
    display: flex !important;
  }
  .wp-block-navigation .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: none !important;
  }
  /* Sticky header is a containing block for position:fixed, which boxed
     the overlay to the header. Unstick it while the modal is open. */
  html.has-modal-open .site-header,
  html.has-modal-open header.site-header {
    position: static !important;
  }
  html.has-modal-open #lpi-cookie-banner {
    z-index: 99990 !important;
    display: none !important;
  }
  html.has-modal-open body.lpi-cookie-visible,
  html.has-modal-open body {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open {
    display: flex !important;
    flex-direction: column;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    transform: none !important;
    z-index: 100000 !important;
    background: #ffffff !important;
    overflow: auto !important;
    padding: 16px 20px 32px;
    box-sizing: border-box;
  }
  .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
  .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
  .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }
  .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
    width: 100%;
  }
  .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 12px 8px;
    font-size: 1.05rem;
  }
  .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu {
    flex-wrap: wrap;
  }
  .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle,
  .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon {
    min-width: 48px !important;
    min-height: 48px !important;
    width: 48px !important;
    height: 48px !important;
    margin-left: auto;
  }
  .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
    position: static !important;
    width: 100% !important;
    box-shadow: none !important;
    padding-left: 12px;
    background: #f8fafc;
  }
  .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation .btn,
  .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open li.btn {
    margin-top: 12px;
  }
  .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open li.btn .wp-block-navigation-item__content {
    justify-content: center;
    border-radius: 999px;
    background: #C24600 !important;
    color: #ffffff !important;
  }
}

@media (min-width: 782px) {
  /* Desktop nav stays a horizontal bar. Hide overlay chrome that leaked
     when the 48px open/close rules were global. */
  .wp-block-navigation .wp-block-navigation__responsive-container-open:not(.always-shown),
  .wp-block-navigation .wp-block-navigation__responsive-container-close {
    display: none !important;
  }
  .wp-block-navigation .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: block !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    padding: 0 !important;
    background: transparent !important;
    inset: auto !important;
  }
  .wp-block-navigation-submenu__toggle {
    min-width: 24px;
    min-height: 24px;
  }
}
