/* ===========================================================
   MADDOG HAULERS — Hoja de estilos global
   Reglas que no pueden ir inline (resets, fuentes, animaciones,
   media queries). Los estilos visuales de cada elemento siguen
   inline en index.html para que el diseño sea idéntico y fácil
   de ajustar bloque por bloque.
   =========================================================== */

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Black Ops One',system-ui,sans-serif;
  color:#1A1E12;
  background:#F4EFE3;
  -webkit-font-smoothing:antialiased;
  line-height:1.5;
  letter-spacing:.01em;
}
a{color:inherit;text-decoration:none}

/* Black Ops One es una tipografía display pesada — damos aire al texto corrido */
p{line-height:1.8!important;letter-spacing:0!important;font-weight:400}
input,select,textarea,option{letter-spacing:.01em!important}
textarea::placeholder,input::placeholder{letter-spacing:.01em}

/* Oculta elementos con el atributo hidden aunque tengan display inline */
[hidden]{display:none!important}

/* ---------- Animaciones ---------- */
@keyframes mh-fade{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes mh-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- Nav dropdown de servicios ----------
   Mantiene el menú compacto (un solo "Services ▾") sin importar
   cuántas páginas de servicio existan; no hay que achicar la letra. */
.mh-dropdown{position:relative;display:inline-flex}
.mh-dropdown > a{display:inline-flex;align-items:center;gap:6px}
.mh-dropdown-panel{
  position:absolute;top:100%;left:0;min-width:238px;
  background:#F4EFE3;border:2px solid #1A1E12;
  box-shadow:6px 6px 0 rgba(26,30,18,.22);
  display:none;flex-direction:column;z-index:60;
}
.mh-dropdown-panel a{
  padding:13px 18px;border-bottom:1px solid #e3dcc8;
  white-space:nowrap;color:#1A1E12;font-size:14px;letter-spacing:.03em;
  transition:background .12s,color .12s;
}
.mh-dropdown-panel a:last-child{border-bottom:none}
.mh-dropdown-panel a:hover,.mh-dropdown-panel a[aria-current="page"]{background:#CBB088;color:#1A1E12}
.mh-dropdown:hover .mh-dropdown-panel,.mh-dropdown:focus-within .mh-dropdown-panel{display:flex}

/* ---------- Responsive ---------- */
@media(max-width:860px){
  [data-mh-desktopnav]{display:none!important}
  [data-mh-burger]{display:grid!important}
  [data-mh-trustgrid]{grid-template-columns:1fr 1fr!important}
  [data-mh-process]{grid-template-columns:1fr!important}
  [data-mh-work]{grid-template-columns:1fr!important}
  [data-mh-why]{grid-template-columns:1fr!important;gap:36px!important}
  [data-mh-reviews]{grid-template-columns:1fr!important}
  [data-mh-quote]{grid-template-columns:1fr!important;gap:40px!important}
  [data-mh-footer]{grid-template-columns:1fr!important;gap:30px!important}
}
@media(max-width:1024px){
  [data-mh-svcgrid]{grid-template-columns:repeat(2,1fr)!important}
}
@media(max-width:560px){
  [data-mh-svcgrid]{grid-template-columns:1fr!important}
}
@media(max-width:520px){
  [data-mh-trustgrid]{grid-template-columns:1fr 1fr!important}
}
