/*
 * Site-wide fixes layered on top of the cloned Divi CSS.
 * Linked last in <head> of every page by scripts/postprocess.mjs.
 */

/* ── Accessibility: skip link ─────────────────────────────────────────── */
.skul-skip-link {
  position: absolute;
  left: 8px;
  top: -200px;
  z-index: 1000001;
  padding: 10px 16px;
  background: #0f1134;
  color: #fff !important;
  font: 600 15px/1.2 Montserrat, Helvetica, Arial, sans-serif;
  text-decoration: underline;
  border-radius: 0 0 4px 4px;
}
.skul-skip-link:focus { top: 0; }
#main-content:focus { outline: none; }

/* ── Accessibility: visible keyboard focus (Divi sets outline:0 on links) ── */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible,
.mobile_menu_bar_toggle:focus-visible {
  outline: 3px solid #2a7abb !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 5px #fff !important;
}
#top-menu a:focus-visible { outline-offset: -3px !important; }

/* ── Accessibility: links inside running text are underlined, not colour-only ── */
.et_pb_text_inner p a:not(.et_pb_button),
.et_pb_text_inner li a:not(.et_pb_button),
.et_pb_blurb_description p a:not(.et_pb_button),
.et_pb_team_member_description p a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ── Accessibility: contrast (axe color-contrast) ──────────────────────── */
/* Divi's default link blue #2ea3f2 on white = 2.7:1 → #1f72b0 = 5.1:1. Zero-specificity so it
   only replaces the theme default, never a module's own link colour. */
:where(.et_pb_text_inner, .et_pb_blurb_description) a:where(:not(.et_pb_button)) { color: #1f72b0; }
/* Team member role on About Us: #aaa on #f7f8fc = 2.2:1 → #666 = 5.4:1 */
body .et_pb_team_member .et_pb_member_position { color: #666 !important; }

/* ── Footer address → real link to Google Maps (was a JS-only click target) ── */
a.skul-address-link { display: block; color: inherit; text-decoration: none; }
a.skul-address-link:hover h6 span { text-decoration: underline; }

/* Footer email: let it wrap after the @ (a <wbr> is inserted) instead of mid-word */
a[href^="mailto:"] { overflow-wrap: normal; word-break: normal; }

/* ── Desktop nav: keep the menu on one line between 981px and 1099px ────────
   (Divi's JS pads #et-top-navigation by the logo width and the 5 items wrap at ~1024px) */
@media (min-width: 981px) and (max-width: 1099px) {
  #et-top-navigation { padding-left: 0 !important; }
  #top-menu { white-space: nowrap; }
  #top-menu li { padding-right: 16px; }
  #top-menu > li > a { font-size: 14px !important; }
}

/* ── Card headings: no mid-word breaks ("Certificat e", "Motorcyc le") at phone widths ── */
@media (max-width: 767px) {
  .et_pb_blurb .et_pb_module_header,
  .et_pb_blurb .et_pb_module_header a,
  .et_pb_blurb h4 {
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: manual !important;
  }
}

/* Footer section moved from the page body into <footer id="main-footer"> (landmark);
   neutralise Divi's #main-footer chrome so it renders exactly as before. */
#main-footer.skul-footer { background-color: #fff; }

/* The Divi nav hover shape (#top-menu a:before, content:"") names font-family futura-pt but renders
   no text; without this, desktop browsers still fetch the futura-pt (Jost) file on every page. */
#top-menu a:before { font-family: inherit !important; }

/* ── Customer Service "Here to Help" cards on phones ─────────────────────────
   Divi Toolbox's phone-two-cols squeezed 3 cards into a 2-up grid (titles ~87px wide,
   "of"/"a" orphaned, last card alone; same at tablet widths). Stack them as horizontal cards. */
@media (max-width: 980px) {
  .page-id-1361 .et_pb_row.phone-two-cols:has(.et_pb_blurb) {
    display: flex !important;
    flex-direction: column;
    gap: 16px;
  }
  .page-id-1361 .et_pb_row.phone-two-cols:has(.et_pb_blurb) > .et_pb_column {
    width: 100% !important;
    margin: 0 !important;
    float: none !important;
  }
  .page-id-1361 .et_pb_row.phone-two-cols .et_pb_blurb {
    margin: 0 !important;
    padding: 16px 20px !important;
  }
  .page-id-1361 .et_pb_row.phone-two-cols .et_pb_blurb_content {
    display: flex;
    align-items: center;
    gap: 18px;
    max-width: none;
    margin: 0;
    text-align: left;
  }
  .page-id-1361 .et_pb_row.phone-two-cols .et_pb_main_blurb_image {
    flex: 0 0 60px;
    width: 60px;
    margin: 0 !important;
  }
  .page-id-1361 .et_pb_row.phone-two-cols .et_pb_main_blurb_image img { width: 60px; height: auto; }
  .page-id-1361 .et_pb_row.phone-two-cols .et_pb_blurb_container { flex: 1; padding: 0; }
  .page-id-1361 .et_pb_row.phone-two-cols .et_pb_module_header {
    padding: 0 !important;
    margin: 0;
    text-align: left;
    font-size: 18px;
    line-height: 1.3;
  }
}
