/*
 * Desert Horizon Freight Broker — shared visual system
 * Load this file AFTER each page's legacy inline styles.
 * It intentionally does not change page copy, SEO metadata, hero imagery or forms logic.
 */

:root {
  --navy-900: #071f2d;
  --navy-700: #0e3a52;
  --navy-500: #215670;
  --orange-500: #f5a623;
  --teal-400: #4fb3bf;
  --dh-text: #26343d;
  --bg-soft: #f3f7fb;
  --dh-white: #fff;
  --dh-radius: 8px;
  --dh-container: 1160px;
  --dh-shadow: 0 3px 18px rgba(7, 31, 45, .10);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
body,
button,
input,
select,
textarea {
  font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif !important;
}
body {
  margin: 0;
  color: var(--dh-text);
  font-size: 17px;
  line-height: 1.6;
  background: var(--dh-white);
  -webkit-font-smoothing: antialiased;
}

/* Shared containers. Legacy .wrap remains supported on static pages. */
.dh-container,
.dh-site-header .wrap,
.dh-site-footer .wrap {
  width: min(var(--dh-container), calc(100% - 40px)) !important;
  max-width: var(--dh-container) !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
}

/* Typography */
h1, h2, h3 {
  font-family: inherit !important;
  text-transform: none !important;
  letter-spacing: normal;
  text-wrap: balance;
}
h1 { font-size: clamp(42px, 4.2vw, 56px) !important; line-height: 1.1 !important; font-weight: 800 !important; }
h2 { font-size: clamp(30px, 3vw, 36px) !important; line-height: 1.2 !important; font-weight: 700 !important; }
h3 { font-size: 20px !important; line-height: 1.35 !important; font-weight: 700 !important; }
p, li { font-size: 17px; line-height: 1.6; }
.hero p { font-size: 18px !important; }
.eyebrow {
  font-size: 13px !important;
  line-height: 1.3;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* Buttons */
.dh-btn,
.btn.primary,
.dh-site-header .dh-quote-button,
button[type="submit"],
input[type="submit"] {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
  border: 1px solid var(--orange-500);
  border-radius: var(--dh-radius) !important;
  background: var(--orange-500) !important;
  color: var(--navy-900) !important;
  font: 600 15px/1 Inter, system-ui, sans-serif !important;
  text-decoration: none !important;
  cursor: pointer;
  transition: transform .2s ease, filter .2s ease, box-shadow .2s ease;
}
.dh-btn:hover,
.btn.primary:hover,
.dh-site-header .dh-quote-button:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
  color: var(--navy-900) !important;
  filter: brightness(.96);
  box-shadow: 0 8px 22px rgba(245, 166, 35, .25);
  transform: translateY(-1px);
}
.dh-btn--outline {
  border-color: rgba(255,255,255,.85) !important;
  background: transparent !important;
  color: var(--dh-white) !important;
}

/* Header */
.dh-site-header {
  height: 80px;
  position: sticky;
  inset: 0 0 auto;
  z-index: 1000;
  display: flex;
  align-items: center;
  background: var(--dh-white);
  box-shadow: var(--dh-shadow);
}
.dh-site-header .dh-header-inner {
  height: 80px;
  display: flex;
  align-items: center;
  gap: 28px;
}
.dh-brand {
  min-width: 250px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--navy-700) !important;
  text-decoration: none !important;
}
.dh-brand img {
  width: auto !important;
  height: 56px !important;
  max-width: none !important;
  object-fit: contain;
  flex: 0 0 auto;
}
.dh-brand-text {
  font-size: 13px;
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: .055em;
  text-transform: uppercase;
}
.dh-main-nav {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 8px;
}
.dh-main-nav > a,
.dh-dropdown-toggle {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  border: 0;
  background: transparent;
  color: var(--navy-700) !important;
  font: 600 15px/1 Inter, system-ui, sans-serif !important;
  text-decoration: none !important;
  white-space: nowrap;
}
.dh-main-nav > a:hover,
.dh-dropdown-toggle:hover,
.dh-main-nav [aria-current="page"] { color: var(--orange-500) !important; }
.dh-nav-dropdown { position: relative; }
.dh-dropdown-toggle::after { content: ""; width: 7px; height: 7px; margin: -4px 0 0 8px; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.dh-dropdown-menu {
  width: 250px;
  position: absolute;
  top: 100%;
  left: 0;
  visibility: hidden;
  opacity: 0;
  transform: translateY(-5px);
  padding: 8px;
  border: 1px solid rgba(14,58,82,.10);
  border-radius: var(--dh-radius);
  background: var(--dh-white);
  box-shadow: 0 16px 36px rgba(7,31,45,.15);
  transition: .2s ease;
}
.dh-nav-dropdown:hover .dh-dropdown-menu,
.dh-nav-dropdown:focus-within .dh-dropdown-menu {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}
.dh-dropdown-menu a {
  display: block;
  padding: 10px 12px;
  border-radius: 6px;
  color: var(--navy-700) !important;
  font: 600 14px/1.35 Inter, system-ui, sans-serif;
  text-decoration: none !important;
}
.dh-dropdown-menu a:hover,
.dh-dropdown-menu [aria-current="page"] { background: var(--bg-soft); color: var(--orange-500) !important; }
.dh-site-header .dh-quote-button { margin-left: 8px; padding-inline: 18px; }
.dh-menu-toggle {
  display: none;
  width: 44px;
  height: 44px;
  margin-left: auto;
  padding: 9px;
  border: 0;
  background: transparent;
  color: var(--navy-700);
}
.dh-menu-toggle span { display: block; height: 2px; margin: 5px 0; border-radius: 2px; background: currentColor; }

/* Two-column footer — visual match for the approved home-page layout */
.dh-site-footer {
  padding: 42px 0 0;
  background: var(--navy-500);
  color: var(--dh-white);
}
.dh-footer-main {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  align-items: center;
  gap: 64px;
  padding-bottom: 32px;
}
.dh-footer-logo { display: flex; justify-content: center; align-items: center; }
.dh-footer-logo img { width: auto; height: 143px; display: block; object-fit: contain; }
.dh-footer-contact { text-align: center; }
.dh-footer-contact p { margin: 0 0 6px; color: var(--dh-white); font-size: 17px; line-height: 1.35; }
.dh-footer-contact p:last-of-type { margin-bottom: 0; }
.dh-footer-contact a { color: var(--teal-400) !important; text-decoration: none; }
.dh-footer-contact a:hover { color: var(--dh-white) !important; }
.dh-social-links {
  display: flex !important;
  justify-content: center !important;
  align-items: center;
  gap: 12px;
  margin: 16px 0 0 !important;
}
.dh-social-links a {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 50%;
  color: var(--dh-white) !important;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
.dh-social-links a:hover { background: var(--dh-white); color: var(--navy-700) !important; transform: translateY(-1px); }
.dh-social-links svg { width: 19px; height: 19px; fill: currentColor; }
.dh-footer-bottom {
  border-top: 1px solid rgba(255,255,255,.15);
  padding: 18px 0 22px;
  text-align: center;
  color: rgba(255,255,255,.86);
  font-size: 14px;
}

/* Floating WhatsApp: one compact control on every page */
.dhf-whatsapp {
  width: 56px !important;
  height: 56px !important;
  min-width: 56px !important;
  position: fixed !important;
  right: 22px !important;
  bottom: 22px !important;
  z-index: 1100 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #25d366 !important;
  color: #fff !important;
  font-size: 0 !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.24) !important;
}
.dhf-whatsapp::before {
  content: "";
  width: 31px;
  height: 31px;
  background: center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.149-.67.149-.198.297-.767.966-.94 1.164-.173.198-.347.223-.644.074-.297-.149-1.255-.462-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.297-.347.446-.52.149-.174.198-.298.297-.496.099-.198.05-.372-.025-.521-.074-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.009-.372-.011-.57-.011-.198 0-.52.074-.792.372-.273.297-1.04 1.016-1.04 2.479 0 1.463 1.065 2.876 1.213 3.074.149.198 2.095 3.2 5.076 4.487.709.306 1.262.489 1.693.626.712.226 1.36.194 1.872.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 0 1-5.031-1.378l-.361-.214-3.741.981.998-3.648-.235-.374a9.86 9.86 0 0 1-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884a9.82 9.82 0 0 1 7.021 2.91 9.83 9.83 0 0 1 2.9 7.026c-.003 5.45-4.437 9.884-9.925 9.884m8.413-18.297A11.82 11.82 0 0 0 12.055 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.304-1.654a11.9 11.9 0 0 0 5.69 1.449h.005c6.557 0 11.892-5.335 11.895-11.893a11.82 11.82 0 0 0-3.487-8.413'/%3E%3C/svg%3E");
}
.dhf-whatsapp::after {
  content: "WhatsApp";
  position: absolute;
  right: calc(100% + 10px);
  width: max-content;
  padding: 7px 10px;
  border-radius: 5px;
  background: var(--navy-900);
  color: #fff;
  font-size: 12px;
  line-height: 1;
  opacity: 0;
  pointer-events: none;
  transform: translateX(4px);
  transition: .2s ease;
}
.dhf-whatsapp:hover::after,
.dhf-whatsapp:focus-visible::after { opacity: 1; transform: translateX(0); }
.sp-scroll-up { right: 29px !important; bottom: 92px !important; }

/* Existing Joomla home-page adapters: preserve functionality and current two-column footer. */
#sp-header { font-family: Inter, system-ui, sans-serif !important; }
#sp-header .sp-megamenu-parent > li > a,
#sp-header .sp-megamenu-parent > li > span { font: 600 15px/1 Inter, system-ui, sans-serif !important; }
#section-id-1755871110595 > .sppb-row-container { max-width: 1100px !important; width: calc(100% - 48px) !important; margin-inline: auto !important; }
#sppb-addon-1755871216620 { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; align-items: center !important; gap: 64px !important; }
#sppb-addon-wrapper-1755871229587,
#sppb-addon-1755871229587 .sppb-addon-content,
#sppb-addon-1755871229587 .sppb-addon-single-image-container { display: flex !important; align-items: center !important; justify-content: center !important; margin: 0 !important; }
#sppb-addon-1755871502577 .sppb-addon-content { text-align: center !important; font-family: Inter, system-ui, sans-serif !important; }
#sppb-addon-1755871502577 .sppb-addon-content p { margin: 0 0 6px !important; line-height: 1.35 !important; }
#sppb-addon-1755871502577 .dh-social-links { justify-content: center !important; }
#sp-footer .sp-copyright { display: block; text-align: center; }
/* ConvertForms: typography/skin only. Do not alter field names, DOM order or JS hooks. */
#cf1 .cf-input,
#cf1 input,
#cf1 textarea,
#cf1 select {
  font-family: Inter, system-ui, sans-serif !important;
  font-size: 16px !important;
}
#cf1 .cf-btn,
#cf1 button[type="submit"],
#cf1 input[type="submit"] {
  min-height: 48px !important;
  border-color: var(--orange-500) !important;
  border-radius: var(--dh-radius) !important;
  background: var(--orange-500) !important;
  color: var(--navy-900) !important;
  font-family: Inter, system-ui, sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
}

@media (max-width: 980px) {
  .dh-brand { min-width: auto; }
  .dh-brand-text { display: none; }
  .dh-menu-toggle { display: block; }
  .dh-site-header .dh-header-inner { position: relative; }
  .dh-main-nav {
    position: absolute;
    top: 80px;
    left: -20px;
    right: -20px;
    max-height: calc(100vh - 80px);
    display: none;
    align-items: stretch;
    flex-direction: column;
    gap: 0;
    overflow: auto;
    padding: 16px 20px 22px;
    border-top: 1px solid rgba(14,58,82,.10);
    background: #fff;
    box-shadow: 0 18px 30px rgba(7,31,45,.12);
  }
  .dh-site-header.is-open .dh-main-nav { display: flex; }
  .dh-main-nav > a,
  .dh-dropdown-toggle { width: 100%; justify-content: space-between; min-height: 48px; padding: 0 8px; }
  .dh-nav-dropdown { width: 100%; }
  .dh-dropdown-menu { width: 100%; position: static; visibility: visible; opacity: 1; transform: none; display: none; margin: 0 0 8px; border: 0; box-shadow: none; background: var(--bg-soft); }
  .dh-nav-dropdown:focus-within .dh-dropdown-menu,
  .dh-nav-dropdown:hover .dh-dropdown-menu { display: block; }
  .dh-site-header .dh-quote-button { margin: 10px 0 0; }
}

@media (max-width: 768px) {
  html { scroll-padding-top: 72px; }
  body { font-size: 16px; }
  p, li { font-size: 16px; }
  h1 { font-size: clamp(31px, 9vw, 36px) !important; }
  h2 { font-size: clamp(24px, 7vw, 26px) !important; }
  h3 { font-size: 19px !important; }
  .dh-site-header, .dh-site-header .dh-header-inner { height: 72px; }
  .dh-brand img { height: 44px !important; }
  .dh-main-nav { top: 72px; max-height: calc(100vh - 72px); }
  .dh-footer-main { grid-template-columns: 1fr; gap: 18px; padding-bottom: 26px; }
  .dh-site-footer { padding-top: 32px; }
  .dh-footer-logo img { height: 125px; }
  .dh-footer-contact p { font-size: 15px; }
  .dhf-whatsapp { width: 52px !important; height: 52px !important; min-width: 52px !important; right: 16px !important; bottom: 16px !important; }
  .dhf-whatsapp::before { width: 28px; height: 28px; }
  .sp-scroll-up { right: 22px !important; bottom: 80px !important; }
  #sppb-addon-1755871216620 { grid-template-columns: 1fr !important; gap: 18px !important; text-align: center !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

/* DH home rollout 20261105 */
#sp-header{height:80px!important;font-family:Inter,system-ui,sans-serif!important;background:var(--dh-white)!important;box-shadow:var(--dh-shadow)!important}
#sp-header .container-inner,#sp-header .row,#sp-header .logo,#sp-header .logo a{height:80px!important}
#sp-header .logo,#sp-header .logo a{display:inline-flex!important;align-items:center!important}
#sp-header .logo img.logo-image{width:auto!important;height:56px!important;max-width:none!important;object-fit:contain!important}
#sp-header .sp-megamenu-parent>li>a,#sp-header .sp-megamenu-parent>li>span{height:80px!important;padding-inline:10px!important;font:600 15px/1 Inter,system-ui,sans-serif!important}
#cf1 .cf-control-group{margin-bottom:12px!important}
#cf1 textarea{min-height:88px!important}
#cf1 .cf-btn,#cf1 button[type=submit],#cf1 input[type=submit]{min-height:48px!important;padding:0 24px!important;border-color:var(--orange-500)!important;border-radius:var(--dh-radius)!important;background:var(--orange-500)!important;color:var(--navy-900)!important;font-family:Inter,system-ui,sans-serif!important;font-size:16px!important;font-weight:600!important}
@media(max-width:768px){#sp-header,#sp-header .container-inner,#sp-header .row,#sp-header .logo,#sp-header .logo a{height:72px!important}#sp-header .logo img.logo-image{height:44px!important}#sp-header .sp-megamenu-parent>li>a,#sp-header .sp-megamenu-parent>li>span{height:48px!important}}
