/* ─────────────────────────────────────────────
   Marathon Freight — shared UX enhancement layer
   Applies to all variants. Loaded after the per-variant
   <style> so a few targeted rules can override.
   ───────────────────────────────────────────── */

/* 1. Accessibility: visible focus on every interactive element */
:where(a, button, input, select, textarea, [tabindex]):focus-visible{
  outline: 2px solid var(--accent, #e39423);
  outline-offset: 3px;
  border-radius: 6px;
}

/* 2. Skip-to-content link (injected by JS) */
.mf-skip{
  position:fixed; top:8px; left:8px; z-index:1000;
  background:#0a0a0a; color:#fff; padding:10px 14px;
  font:500 13px/1 'Geist','Helvetica Neue',Arial,sans-serif;
  border-radius:6px; text-decoration:none;
  transform:translateY(-150%); transition:transform .2s;
}
.mf-skip:focus-visible{ transform:translateY(0); outline:2px solid var(--accent,#e39423); outline-offset:2px; }

/* 3. Smooth-scroll with sticky-nav offset */
html{ scroll-behavior:smooth; scroll-padding-top:80px; }

/* 4. Respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:0.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.001ms !important;
    scroll-behavior:auto !important;
  }
  .ticker-track{ animation:none !important; transform:none !important; }
  .pulse-dot,.live-dot,.dot{ animation:none !important; }
  html{ scroll-behavior:auto; }
}

/* 5. Make tap targets ≥44px on touch devices */
@media (hover:none) and (pointer:coarse){
  .btn{ min-height:44px; padding-top:12px; padding-bottom:12px; }
  .nav-links a, .foot-col a{ display:inline-block; padding:8px 0; min-height:44px; line-height:1.6; }
  .lane-item, .lane-row, .svc-row, .board-row, .driver-bullet{ min-height:44px; }
}

/* 6. Mobile hamburger button (injected by JS) */
.mf-burger{
  display:none;
  width:44px; height:44px;
  align-items:center; justify-content:center;
  background:transparent; border:1px solid currentColor;
  border-radius:8px; cursor:pointer; padding:0;
  margin-left:auto; opacity:.7; transition:opacity .15s;
  color:inherit;
}
.mf-burger:hover{ opacity:1; }
.mf-burger svg{ width:18px; height:18px; }
.mf-burger .x{ display:none; }
.mf-burger[aria-expanded="true"] .bars{ display:none; }
.mf-burger[aria-expanded="true"] .x{ display:block; }

/* 7. Mobile drawer (injected by JS) */
.mf-drawer{
  position:fixed; inset:0; z-index:90;
  background:rgba(10,10,10,0.5);
  backdrop-filter:blur(4px);
  opacity:0; pointer-events:none;
  transition:opacity .25s;
}
.mf-drawer[data-open="true"]{ opacity:1; pointer-events:auto; }
.mf-drawer-panel{
  position:absolute; top:0; right:0; bottom:0;
  width:min(86vw, 360px);
  background:var(--bg, #0a0a0a);
  color:var(--fg, #fff);
  border-left:1px solid var(--line, #222);
  padding:20px 24px 32px;
  display:flex; flex-direction:column;
  transform:translateX(100%);
  transition:transform .3s cubic-bezier(.2,.7,.2,1);
  overflow-y:auto;
}
.mf-drawer[data-open="true"] .mf-drawer-panel{ transform:translateX(0); }
.mf-drawer-head{
  display:flex; align-items:center; justify-content:space-between;
  padding-bottom:18px; margin-bottom:18px;
  border-bottom:1px solid var(--line, #222);
}
.mf-drawer-head .mf-label{
  font:500 11px/1 'Geist Mono','SF Mono',Consolas,monospace;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--fg-mute, var(--mute, #999));
}
.mf-drawer-close{
  width:36px; height:36px; border-radius:8px;
  background:transparent; border:1px solid var(--line-2, var(--line, #333));
  color:inherit; cursor:pointer;
  display:grid; place-items:center;
}
.mf-drawer-close svg{ width:14px; height:14px; }
.mf-drawer-links{
  display:flex; flex-direction:column; gap:2px;
  margin-bottom:24px;
}
.mf-drawer-links a{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 4px;
  font:500 18px/1.2 'Geist','Helvetica Neue',Arial,sans-serif;
  letter-spacing:-0.01em;
  color:var(--fg, #fff);
  text-decoration:none;
  border-bottom:1px solid var(--line, #222);
}
.mf-drawer-links a::after{
  content:"→";
  font-family:'Geist Mono','SF Mono',Consolas,monospace;
  color:var(--accent-ink, #8a5a0c);
  font-size:14px;
}
.mf-drawer-links a:hover{ color:var(--accent-ink, #8a5a0c); }
.mf-drawer-cta{ display:flex; flex-direction:column; gap:10px; margin-top:auto; }
.mf-drawer-cta .btn{ width:100%; justify-content:center; min-height:48px; }
.mf-drawer-foot{
  margin-top:24px; padding-top:18px;
  border-top:1px solid var(--line, #222);
  font:500 11px/1.4 'Geist Mono','SF Mono',Consolas,monospace;
  letter-spacing:.08em; text-transform:uppercase;
  color:var(--fg-mute, var(--mute, #888));
  display:flex; flex-direction:column; gap:6px;
}
.mf-drawer-foot a{ color:inherit; text-decoration:none; }
.mf-drawer-foot a:hover{ color:var(--accent-ink, #8a5a0c); }

/* Show hamburger only when nav-links would be hidden */
@media (max-width: 1100px){
  .mf-burger{ display:inline-flex; }
  .nav-right .label{ display:none !important; }
  /* Keep a single primary CTA visible on tablet; drawer carries the rest */
  .nav-right .btn-ghost{ display:none !important; }
}

/* 8. Quote/Apply lead-capture section styling */
.mf-form-section{
  padding:96px 0;
  border-top:1px solid var(--line, #222);
  background:var(--bg-2, var(--bg, #0a0a0a));
  position:relative;
}
.mf-form-grid{
  display:grid;
  align-items:start;
  grid-template-columns: 1fr 1fr;
  gap:32px;
  max-width:1440px;
  margin:0 auto;
  padding:0 40px;
}
.mf-form-card{
  background:var(--bg, #fff);
  border:1px solid var(--line, #e5e1d4);
  border-radius:14px;
  padding:36px 32px;
  display:flex; flex-direction:column;
  scroll-margin-top:80px;
}
.mf-form-card.dark{
  background:var(--ink-2, #161616);
  color:#fff;
  border-color:#1c1c1c;
}
.mf-form-card .mf-form-label{
  font:500 11px/1 'Geist Mono','SF Mono',Consolas,monospace;
  letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent-ink, #8a5a0c);
  margin-bottom:14px;
}
.mf-form-card h3{
  font:500 28px/1 'Geist','Helvetica Neue',Arial,sans-serif;
  letter-spacing:-0.02em;
  margin-bottom:8px;
}
.mf-form-card p.sub{
  font-size:14px; line-height:1.5;
  color:var(--fg-dim, var(--dim, #a3a3a3));
  margin-bottom:24px;
}
.mf-field{ display:flex; flex-direction:column; gap:6px; margin-bottom:14px; }
.mf-field-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.mf-field-row .mf-field{ margin-bottom:0; }
.mf-field label{
  font:500 11px/1 'Geist Mono','SF Mono',Consolas,monospace;
  letter-spacing:.08em; text-transform:uppercase;
  color:var(--fg-mute, var(--mute, #888));
}
.mf-field input,.mf-field select,.mf-field textarea{
  width:100%;
  padding:12px 14px;
  font:500 15px/1.3 'Geist','Helvetica Neue',Arial,sans-serif;
  background:transparent;
  border:1px solid var(--line-2, var(--line, #d4cfbe));
  border-radius:8px;
  color:inherit;
  min-height:44px;
}
.mf-form-card.dark .mf-field input,
.mf-form-card.dark .mf-field select,
.mf-form-card.dark .mf-field textarea{
  border-color:#2a2a2a; color:#fff;
}
.mf-field input:focus,.mf-field select:focus,.mf-field textarea:focus{
  outline:none; border-color:var(--accent, #e39423);
}
.mf-field textarea{ resize:vertical; min-height:80px; }
.mf-form-card .btn{ margin-top:8px; width:100%; justify-content:center; min-height:48px; }
.mf-next{ padding-top:28px; display:flex; flex-direction:column; gap:14px; }
.mf-next-label{ font:500 11px/1 'Geist Mono','SF Mono',Consolas,monospace; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-ink,#c8462c); }
.mf-next-row{ display:grid; grid-template-columns:28px 1fr; gap:12px; align-items:start; padding-top:14px; border-top:1px solid #1c1c1c; }
.mf-next-row .n{ font:500 11px/1.5 'Geist Mono','SF Mono',Consolas,monospace; color:#666; }
.mf-next-row p{ font-size:13px; line-height:1.5; color:#a3a3a3; text-wrap:pretty; }

.mf-success{
  display:none;
  padding:14px 16px; border-radius:8px;
  background:rgba(58,125,68,0.1);
  border:1px solid rgba(58,125,68,0.3);
  color:var(--green, #3a7d44);
  font:500 13px/1.4 'Geist','Helvetica Neue',Arial,sans-serif;
  margin-top:8px;
}
.mf-form[data-sent="true"] .mf-success{ display:block; }
.mf-form[data-sent="true"] .mf-fields{ display:none; }

@media (max-width: 980px){
  .mf-form-grid{ grid-template-columns:1fr; gap:20px; padding:0 28px; }
  .mf-form-section{ padding:64px 0; }
}
@media (max-width: 640px){
  .mf-form-grid{ padding:0 20px; }
  .mf-form-card{ padding:28px 22px; }
  .mf-form-card h3{ font-size:24px; }
  .mf-field-row{ grid-template-columns:1fr; }
}

/* 9. Targeted fixes — clipping & long word breaks */
body{ -webkit-text-size-adjust:100%; }
h1,h2,h3{ word-break:normal; overflow-wrap:break-word; text-wrap:balance; }
.h1,.section-h,.driver-h,.coverage-h{ overflow-wrap:break-word; }

/* 10. Hide hero <br> at very narrow widths so text flows naturally */
@media (max-width: 420px){
  .h1 br, .driver-h br{ display:none; }
  .h1{ line-height:1; }
}

/* 11. Prevent map labels overlap on tiny screens */
@media (max-width: 480px){
  .map svg text, .map-wrap svg text{ font-size:9px; }
}

/* Brand logo — top left of nav */
.mf-brandlogo{display:flex;align-items:center;padding:0;gap:0;}
.mf-brandlogo img{height:44px;width:auto;display:block;}
@media (max-width:1100px){.mf-brandlogo img{height:38px;}}
@media (max-width:560px){.mf-brandlogo img{height:32px;}}

/* Coverage zone — states served */
.zone-states{margin-top:30px;display:flex;flex-direction:column;gap:12px;}
.zs-label{font-family:'Geist Mono','SF Mono',Consolas,monospace;font-size:11px;letter-spacing:0.14em;color:var(--accent-ink);}
.zs-list{display:flex;flex-wrap:wrap;gap:6px;}
.zs-list span{font-family:'Geist Mono','SF Mono',Consolas,monospace;font-size:12px;letter-spacing:0.06em;padding:5px 9px;border:1px solid;border-color:color-mix(in srgb, currentColor 24%, transparent);border-radius:5px;opacity:0.8;}
.zs-list span.fl{color:var(--accent-ink);border-color:var(--accent);opacity:1;}

/* ───────── Form fields: explicit surface colors ───────── */
.mf-form-card{--fieldbg:#ffffff;--fieldfg:#0a0a0a;}
.mf-form-card.dark{--fieldbg:#161616;--fieldfg:#ffffff;color-scheme:dark;}
.mf-field select{-webkit-appearance:none;appearance:none;background-color:var(--fieldbg);color:var(--fieldfg);background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'><path d='M1 1.5L6 6.5L11 1.5' stroke='%23999999' stroke-width='1.5' stroke-linecap='round'/></svg>");background-repeat:no-repeat;background-position:right 14px center;padding-right:40px;}
.mf-field select option{background-color:var(--fieldbg);color:var(--fieldfg);}
.mf-field input[type="date"],.mf-field input[type="time"]{background-color:var(--fieldbg);color:var(--fieldfg);}
.mf-field input:disabled,.mf-field select:disabled{opacity:.4;cursor:not-allowed;}
.mf-field label .opt{text-transform:none;letter-spacing:0;font-family:'Geist','Helvetica Neue',Arial,sans-serif;font-size:11px;opacity:.7;}
.mf-dt{margin-bottom:14px;}
.mf-check{display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer;font:500 12px/1 'Geist Mono','SF Mono',Consolas,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-mute,#888);-webkit-user-select:none;user-select:none;}
.mf-check input{width:18px;height:18px;min-height:0;accent-color:var(--accent,#e39423);margin:0;flex:none;}
.mf-check:hover{color:var(--fieldfg);}
.mf-field[data-off="true"] label{opacity:.45;}

/* ───────── Custom dropdown ───────── */
.mf-sel{position:relative;}
.mf-sel select{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;min-height:0;}
.mf-sel-btn{display:flex;align-items:center;width:100%;text-align:left;min-height:44px;padding:12px 40px 12px 14px;font:500 15px/1.3 'Geist','Helvetica Neue',Arial,sans-serif;background-color:var(--fieldbg);color:var(--fieldfg);border:1px solid var(--line-2,var(--line,#d4cfbe));border-radius:8px;cursor:pointer;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'><path d='M1 1.5L6 6.5L11 1.5' stroke='%23999999' stroke-width='1.5' stroke-linecap='round'/></svg>");background-repeat:no-repeat;background-position:right 14px center;transition:border-color .15s;}
.mf-sel-btn[data-placeholder="true"]{color:#8b8b8b;}
.mf-sel-btn:focus-visible{outline:none;border-color:var(--accent,#e39423);}
.mf-sel[data-open] .mf-sel-btn{border-color:var(--accent,#e39423);}
.mf-sel-list{display:none;position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:60;background-color:var(--fieldbg);border:1px solid var(--line-2,var(--line,#d4cfbe));border-radius:10px;padding:5px;max-height:264px;overflow:auto;box-shadow:0 16px 40px rgba(0,0,0,.34);}
.mf-sel[data-open] .mf-sel-list{display:block;}
.mf-sel-opt{display:flex;align-items:center;min-height:40px;padding:9px 12px;border-radius:6px;font:500 14px/1.3 'Geist','Helvetica Neue',Arial,sans-serif;color:var(--fieldfg);cursor:pointer;}
.mf-sel-opt:hover{background:color-mix(in srgb,var(--fieldfg) 10%,transparent);}
.mf-sel-opt[aria-selected="true"]{background:color-mix(in srgb,var(--accent,#e39423) 22%,transparent);}
.mf-sel-opt[data-disabled="true"]{opacity:.45;cursor:not-allowed;}
.mf-form-card.dark .mf-sel-btn{border-color:#2a2a2a;}
.mf-form-card.dark .mf-sel-list{border-color:#2a2a2a;}

/* ───────── Light form card (driver) ───────── */
.mf-form-card.light{background:#ffffff;color:#0a0a0a;border-color:#e8e8e8;--fieldbg:#ffffff;--fieldfg:#0a0a0a;color-scheme:light;box-shadow:0 20px 56px rgba(0,0,0,.34);}
.mf-form-card.light .mf-form-label{color:#8a5a0c;}
.mf-form-card.light p.sub{color:#5a5a5a;}
.mf-form-card.light .mf-field label{color:#5f5f5f;}
.mf-form-card.light .mf-field input,.mf-form-card.light .mf-field textarea,.mf-form-card.light .mf-sel-btn,.mf-form-card.light .mf-sel-list{border-color:#d8d8d8;color:#0a0a0a;}
.mf-form-card.light .mf-check{color:#5f5f5f;}
.mf-form-card.light .mf-next-label{color:#8a5a0c;}
.mf-form-card.light .mf-next-row{border-top-color:#e8e8e8;}
.mf-form-card.light .mf-next-row .n{color:#8b8b8b;}
.mf-form-card.light .mf-next-row p{color:#5a5a5a;}