/* ===== Mizell's Towing — static export stylesheet ===== */
:root{
  --bg:#100D14; --bg2:#1A161F; --bg3:#231E2B; --line:rgba(255,255,255,.10); --line2:rgba(255,255,255,.17);
  --text:#F3F1F6; --muted:#BBB5C6; --header:rgba(16,13,20,.72); --panel:#17131D; --shadow:rgba(0,0,0,.55);
  --ease:cubic-bezier(.22,1,.36,1);
}
[data-theme="light"]{
  --bg:#EEEBE7; --bg2:#FFFFFF; --bg3:#F6F3EF; --line:rgba(34,28,40,.12); --line2:rgba(34,28,40,.22);
  --text:#211C28; --muted:#4C4654; --header:rgba(255,255,255,.82); --panel:#FFFFFF; --shadow:rgba(60,55,62,.16);
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;background:var(--bg);}
body{overflow-x:hidden;color:var(--text);font-family:Geist,system-ui,sans-serif;font-size:18px;line-height:1.6;}
img{display:block;}
a{color:inherit;}
*{cursor:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPSczMCcgaGVpZ2h0PSczMCcgdmlld0JveD0nMCAwIDI0IDI0Jz48ZyB0cmFuc2Zvcm09J3RyYW5zbGF0ZSgyNCwwKSBzY2FsZSgtMSwxKSc+PHBhdGggZD0nTTE0LjcgNi4zYTEgMSAwIDAgMCAwIDEuNGwxLjYgMS42YTEgMSAwIDAgMCAxLjQgMGwzLjc3LTMuNzdhNiA2IDAgMCAxLTcuOTQgNy45NGwtNi45MSA2LjkxYTIuMTIgMi4xMiAwIDAgMS0zLTNsNi45MS02LjkxYTYgNiAwIDAgMSA3Ljk0LTcuOTRsLTMuNzYgMy43NnonIGZpbGw9JyNjZmQzZDgnIHN0cm9rZT0nIzViNjA2OCcgc3Ryb2tlLXdpZHRoPScxLjEnIHN0cm9rZS1saW5lam9pbj0ncm91bmQnLz48L2c+PC9zdmc+") 4 4, auto !important;}
input,textarea,[contenteditable]{cursor:text !important;}
::selection{background:#8DD60A;color:#0B1400;}
html.dyslexic, html.dyslexic *{font-family:'Lexend',sans-serif !important;letter-spacing:0 !important;}

@keyframes mzKenburns{0%{transform:scale(1.02)}100%{transform:scale(1.16)}}
@keyframes mzSpin{to{transform:rotate(360deg)}}
@keyframes mzGrain{0%{transform:translate(0,0)}10%{transform:translate(-3%,-2%)}20%{transform:translate(2%,3%)}30%{transform:translate(-2%,2%)}40%{transform:translate(3%,-3%)}50%{transform:translate(-3%,2%)}60%{transform:translate(2%,-2%)}70%{transform:translate(-2%,-3%)}80%{transform:translate(3%,2%)}90%{transform:translate(-3%,-2%)}100%{transform:translate(0,0)}}
@keyframes mzPulse{0%,100%{opacity:.5;transform:scale(.94)}50%{opacity:1;transform:scale(1.04)}}
@keyframes mzFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes mzRoad{to{background-position:-220px 0}}

/* layout helpers */
.mz-two{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,80px);align-items:center;}
.mz-svc{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.mz-areas{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.mz-foot{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:clamp(32px,4vw,56px);}
.mz-navd{display:flex;align-items:center;gap:6px;}
.mz-burger{display:none;}
.mz-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2.5vw,32px);}
.mz-grain{position:fixed;inset:-50%;z-index:9;pointer-events:none;opacity:.05;background-image:url('data:image/svg+xml;utf8,<svg xmlns=%22http://www.w3.org/2000/svg%22 width=%22160%22 height=%22160%22><filter id=%22n%22><feTurbulence type=%22fractalNoise%22 baseFrequency=%220.85%22 numOctaves=%222%22 stitchTiles=%22stitch%22/></filter><rect width=%22100%25%22 height=%22100%25%22 filter=%22url(%23n)%22/></svg>');background-size:160px 160px;mix-blend-mode:overlay;animation:mzGrain 8s steps(10) infinite;}

/* reveal */
[data-reveal]{opacity:0;transform:translateY(28px);}
[data-reveal].mz-in{opacity:1;transform:none;}

/* nav links */
.nv{text-decoration:none;color:var(--muted);font-weight:500;font-size:15px;padding:8px 4px;margin:0 13px;position:relative;background-image:linear-gradient(#8DD60A,#8DD60A);background-repeat:no-repeat;background-position:0 100%;background-size:0% 2px;transition:color .3s var(--ease),background-size .35s var(--ease),transform .3s var(--ease);}
.nv:hover{color:var(--text);background-size:100% 2px;transform:translateY(-1px);}
.nv-underline{position:absolute;left:0;right:0;bottom:-1px;height:2px;border-radius:2px;background:#8DD60A;transform:scaleX(0);transform-origin:left center;transition:transform .35s var(--ease);}
body[data-page="home"] .nv[data-nav="home"],
body[data-page="about"] .nv[data-nav="about"],
body[data-page="services"] .nv[data-nav="services"],
body[data-page="contact"] .nv[data-nav="contact"]{color:#8DD60A;font-weight:600;}
body[data-page="home"] .nv[data-nav="home"] .nv-underline,
body[data-page="about"] .nv[data-nav="about"] .nv-underline,
body[data-page="services"] .nv[data-nav="services"] .nv-underline,
body[data-page="contact"] .nv[data-nav="contact"] .nv-underline{transform:scaleX(1);}

/* header buttons / pills */
.cpill{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--text);background:transparent;border:1px solid var(--line);padding:8px 13px;border-radius:99px 0 0 99px;font-weight:600;font-size:14px;white-space:nowrap;transition:border-color .25s var(--ease),background .25s var(--ease);}
.cpill:hover{border-color:rgba(141,214,10,.6);background:var(--bg3);}
.ccaret{background:transparent;border:1px solid var(--line);border-left:none;padding:8px 9px;border-radius:0 99px 99px 0;cursor:pointer;color:var(--muted);display:flex;align-items:center;transition:color .25s var(--ease),background .25s var(--ease);}
.ccaret:hover{color:#8DD60A;background:var(--bg3);}
.cdrop{display:flex;align-items:center;gap:11px;padding:10px 11px;border-radius:9px;text-decoration:none;color:var(--text);font-size:14.5px;transition:background .2s var(--ease);}
.cdrop:hover{background:var(--bg3);}
.iconbtn{width:40px;height:40px;border-radius:10px;border:none;background:transparent;color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .25s var(--ease),color .25s var(--ease);}
.iconbtn:hover{background:rgba(141,214,10,.12);color:#8DD60A;}
.callnow{display:inline-flex;align-items:center;gap:8px;background:#8DD60A;color:#0B1400;font-weight:700;font-size:14.5px;padding:11px 20px;border-radius:99px;text-decoration:none;white-space:nowrap;box-shadow:0 4px 14px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.35);transition:transform .25s var(--ease),box-shadow .25s var(--ease);}
.callnow:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.35);}

/* buttons */
.btn-flat{display:inline-flex;align-items:center;gap:9px;background:#8DD60A;color:#0B1400;font-weight:700;font-size:1.05rem;padding:15px 28px;border-radius:99px;text-decoration:none;box-shadow:none;transition:transform .25s var(--ease);}
.btn-flat:hover{transform:translateY(-2px);}
.btn-ghost{display:inline-flex;align-items:center;gap:9px;color:#fff;font-weight:600;font-size:1.05rem;padding:16px 24px;border-radius:99px;text-decoration:none;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.06);backdrop-filter:blur(6px);transition:background .3s var(--ease),border-color .3s var(--ease);}
.btn-ghost:hover{background:rgba(255,255,255,.14);border-color:#fff;}
.btn-primary{display:inline-flex;align-items:center;gap:11px;background:#8DD60A;color:#0B1400;font-weight:800;padding:16px 28px;border-radius:99px;text-decoration:none;box-shadow:0 6px 18px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.35);transition:transform .3s var(--ease),box-shadow .3s var(--ease);}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.35);}
.btn-area{display:inline-flex;align-items:center;gap:11px;background:#8DD60A;color:#0B1400;font-weight:800;padding:15px 26px;border-radius:99px;text-decoration:none;transition:transform .3s var(--ease);}
.btn-area:hover{transform:translateY(-3px);}
.btn-cta{display:inline-flex;align-items:center;gap:11px;background:#8DD60A;color:#0B1400;font-weight:700;font-size:1.2rem;padding:20px 38px;border-radius:99px;text-decoration:none;white-space:nowrap;box-shadow:0 10px 28px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.4);transition:transform .3s var(--ease),box-shadow .3s var(--ease);}
.btn-cta:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 18px 40px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.4);}
.btn-soft{display:inline-flex;align-items:center;gap:11px;background:var(--bg3);border:1px solid var(--line);color:var(--text);font-weight:600;padding:14px 22px;border-radius:99px;text-decoration:none;transition:border-color .3s var(--ease),transform .3s var(--ease);}
.btn-soft:hover{border-color:#8DD60A;transform:translateY(-2px);}

/* service cards (home) */
.svc-card{text-decoration:none;color:inherit;display:flex;flex-direction:column;background:var(--bg3);border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease);}
.svc-card:hover{transform:translateY(-6px);box-shadow:0 24px 50px var(--shadow);border-color:#8DD60A;}
.svc-card .svc-img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease);}
.svc-card:hover .svc-img{transform:scale(1.07);}

/* area rows */
.area-row{display:flex;align-items:center;gap:14px;padding:15px 22px;border-top:1px solid var(--line);transition:background .25s var(--ease);}
.area-row:hover{background:rgba(141,214,10,.06);}

/* contact cards */
.contact-card{display:flex;align-items:center;gap:16px;padding:22px 24px;border-radius:16px;background:var(--bg3);border:1px solid var(--line);text-decoration:none;color:var(--text);transition:border-color .3s var(--ease),transform .3s var(--ease);}
a.contact-card:hover{border-color:#8DD60A;transform:translateY(-2px);}

/* footer */
.foot-link{text-decoration:none;color:var(--text);font-size:1rem;width:fit-content;position:relative;background-image:linear-gradient(#8DD60A,#8DD60A);background-size:0% 2px;background-position:0 100%;background-repeat:no-repeat;padding-bottom:3px;transition:background-size .35s var(--ease);}
.foot-link:hover{background-size:100% 2px;}
.foot-email{text-decoration:none;color:var(--muted);font-size:.95rem;word-break:break-all;transition:color .25s var(--ease);}
.foot-email:hover{color:#8DD60A;}
.yelp{display:inline-flex;align-items:center;gap:9px;width:auto;padding:11px 16px;border-radius:12px;background:var(--bg3);border:1px solid var(--line);text-decoration:none;color:var(--text);font-weight:600;font-size:14px;transition:border-color .3s var(--ease),box-shadow .3s var(--ease);}
.yelp:hover{border-color:#FF1A1A;box-shadow:0 0 0 3px rgba(255,26,26,.15);}

/* mobile drawer + panels */
.mdrawer-link{text-decoration:none;color:var(--muted);font-weight:500;font-size:1.4rem;padding:14px 12px;border-radius:12px;transition:background .25s var(--ease);}
.mdrawer-link:hover{background:var(--bg3);}
body[data-page="home"] .mdrawer-link[data-nav="home"],
body[data-page="about"] .mdrawer-link[data-nav="about"],
body[data-page="services"] .mdrawer-link[data-nav="services"],
body[data-page="contact"] .mdrawer-link[data-nav="contact"]{color:#8DD60A;font-weight:600;}
.sresult{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 14px;border-radius:12px;text-decoration:none;color:var(--text);transition:background .2s var(--ease);}
.sresult:hover{background:var(--bg3);}
.panelclose{width:40px;height:40px;border-radius:10px;border:1px solid var(--line);background:var(--bg3);color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center;}
[hidden]{display:none !important;}

@media(max-width:960px){.mz-navd{display:none !important}.mz-burger{display:inline-flex !important}}
@media(max-width:1040px){.mz-svc{grid-template-columns:repeat(2,1fr)}.mz-areas{grid-template-columns:repeat(3,1fr)}}
@media(max-width:860px){.mz-two{grid-template-columns:1fr}.mz-stats{grid-template-columns:repeat(2,1fr)}.mz-areas{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.mz-svc{grid-template-columns:1fr}.mz-areas{grid-template-columns:1fr}}
@media(max-width:680px){.mz-foot{grid-template-columns:1fr}.mz-phonetext{display:none !important}}
@media(prefers-reduced-motion:reduce){*{animation:none !important;transition-duration:.001ms !important;scroll-behavior:auto !important}[data-reveal]{opacity:1 !important;transform:none !important}}
