/* Header Fix v1 - MarTé Electricidad (responsive) */
:root{
  --nav-bg:#1b2a35;
  --nav-border:rgba(255,255,255,.08);
  --accent:#f5a414;
  --text:#e6edf5;
}
/* hide any legacy fixed bars overlapping (best effort) */
.navbar, .topbar, .header-sticky, .fixed-header, .legacy-header{
  z-index: 8;
}
/* our new header sits on top */
#mt-header{
  position:sticky; top:0; left:0; right:0; z-index: 9999;
  background:var(--nav-bg);
  border-bottom:1px solid var(--nav-border);
  box-shadow:0 2px 14px rgba(0,0,0,.25);
}
#mt-bar{ display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:12px 18px; max-width:1200px; margin:0 auto; }
#mt-brand{ display:flex; align-items:center; gap:12px; text-decoration:none; }
#mt-logo{ width:44px; height:44px; border-radius:10px; background:#0f1c25; display:grid; place-items:center; }
#mt-logo img{ width:30px; height:30px; display:block; }
#mt-title{ color:var(--text); font-weight:700; letter-spacing:.2px; font-size:18px; }
#mt-nav{ display:flex; align-items:center; gap:18px; }
#mt-nav a{ color:var(--text); text-decoration:none; font-weight:600; opacity:.92; padding:8px 10px; border-radius:10px; }
#mt-nav a:hover{ background:rgba(255,255,255,.06); }
/* phone/cta */
#mt-cta{ display:flex; align-items:center; gap:10px; }
#mt-cta .btn{ padding:10px 14px; border-radius:12px; border:1px solid var(--nav-border); display:inline-flex; align-items:center; gap:10px; min-height:40px; }
#mt-cta .btn.primary{ background:linear-gradient(135deg,var(--accent),#ffd266); color:#0b1320; border:0; box-shadow:0 8px 18px rgba(245,164,20,.25) }
#mt-cta .btn.ghost{ background:transparent; color:var(--text) }
/* burger */
#mt-burger{ display:none; width:42px; height:42px; border:1px solid var(--nav-border); border-radius:12px; background:transparent; color:var(--text); }
#mt-burger svg{ width:20px; height:20px; }
/* drawer */
#mt-drawer{ position:fixed; inset:0; z-index:9998; display:none; }
#mt-drawer.open{ display:block; }
#mt-mask{ position:absolute; inset:0; background:rgba(0,0,0,.55); backdrop-filter:saturate(120%) blur(2px); }
#mt-panel{ position:absolute; right:0; top:0; bottom:0; width:78vw; max-width:360px; background:var(--nav-bg);
  border-left:1px solid var(--nav-border); box-shadow: -12px 0 30px rgba(0,0,0,.35); display:flex; flex-direction:column; }
#mt-panel header{ display:flex; align-items:center; justify-content:space-between; padding:14px 16px; border-bottom:1px solid var(--nav-border); }
#mt-panel header .brand{ display:flex; align-items:center; gap:10px; color:var(--text); font-weight:700;}
#mt-close{ width:40px; height:40px; border-radius:10px; background:transparent; border:1px solid var(--nav-border); color:var(--text); }
#mt-panel nav{ padding:10px 10px 14px; display:grid; gap:6px; }
#mt-panel nav a{ color:var(--text); text-decoration:none; padding:12px 12px; border-radius:10px; }
#mt-panel nav a:hover{ background:rgba(255,255,255,.06); }
#mt-panel .cta{ margin:6px 10px 16px; display:grid; gap:10px; }
/* responsive */
@media (max-width: 1023.98px){
  #mt-nav, #mt-cta{ display:none; }
  #mt-burger{ display:inline-grid; place-items:center; }
}
/* avoid main hero getting under header when bars overlap */
body{ scroll-margin-top: 80px; }