/* All Mechanical Business Solutions — shared styles */
:root{
  --orange:#FF6A00;--orange-d:#E25C00;--blue:#003478;--blue-l:#1E5BB8;
  --ink:#0E1216;--ink-2:#161C22;--ink-3:#1E262E;--steel:#2A343D;
  --line:rgba(255,255,255,.10);--txt:#E8EDF2;--txt-dim:#9DAAB6;--white:#fff;
  --disp:'Anton',sans-serif;--cond:'Barlow Condensed',sans-serif;--body:'Barlow',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--body);background:var(--ink);color:var(--txt);line-height:1.6;overflow-x:hidden}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}

.hazard{height:6px;width:100%;background:repeating-linear-gradient(45deg,var(--orange) 0 22px,var(--ink) 22px 44px)}
.topbar{background:var(--blue);color:#fff;font-family:var(--cond);font-weight:600;font-size:14px;letter-spacing:.5px;text-align:center;padding:7px 16px}
.topbar b{color:#FFD9BF}

/* nav */
.nav{position:sticky;top:0;z-index:100;background:rgba(14,18,22,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav-in{max-width:1240px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{height:46px;width:auto}
.brand-txt{font-family:var(--disp);font-size:19px;line-height:.95;letter-spacing:.5px;color:#fff}
.brand-txt span{color:var(--orange);display:block;font-size:11px;letter-spacing:2px}
.nav-links{display:flex;align-items:center;gap:26px;font-family:var(--cond);font-weight:600;font-size:16px;letter-spacing:.6px;text-transform:uppercase}
.nav-links a{color:var(--txt);transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:var(--orange)}
.nav-cta{display:flex;align-items:center;gap:14px}
.btn-call{background:var(--orange);color:#fff;font-family:var(--cond);font-weight:700;font-size:16px;letter-spacing:.5px;text-transform:uppercase;padding:11px 20px;border-radius:3px;display:inline-flex;align-items:center;gap:8px;box-shadow:0 4px 14px rgba(255,106,0,.35);transition:transform .15s,box-shadow .15s}
.btn-call:hover{transform:translateY(-2px);box-shadow:0 7px 20px rgba(255,106,0,.5)}
.hamburger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:6px}
.hamburger span{width:26px;height:3px;background:#fff;border-radius:2px;transition:.3s}
.hamburger.active span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.hamburger.active span:nth-child(2){opacity:0}
.hamburger.active span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.mobile-menu{display:none;flex-direction:column;background:var(--ink-2);border-bottom:1px solid var(--line)}
.mobile-menu.open{display:flex}
.mobile-menu a{padding:15px 24px;border-bottom:1px solid var(--line);font-family:var(--cond);font-weight:600;font-size:18px;text-transform:uppercase;letter-spacing:.6px}
.mobile-menu a:hover{background:var(--orange);color:#fff}

/* buttons */
.btn-xl{font-family:var(--cond);font-weight:700;font-size:19px;letter-spacing:.6px;text-transform:uppercase;padding:16px 30px;border-radius:3px;display:inline-flex;align-items:center;gap:10px;transition:transform .15s,box-shadow .15s}
.btn-primary{background:var(--orange);color:#fff;box-shadow:0 6px 22px rgba(255,106,0,.4)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(255,106,0,.55)}
.btn-ghost{background:rgba(255,255,255,.06);color:#fff;border:1.5px solid rgba(255,255,255,.3)}
.btn-ghost:hover{background:#fff;color:var(--ink);transform:translateY(-2px)}

/* sections */
.sec{padding:90px 24px}
.sec-in{max-width:1240px;margin:0 auto}
.eyebrow{font-family:var(--cond);font-weight:700;font-size:15px;letter-spacing:2.5px;text-transform:uppercase;color:var(--orange);margin-bottom:12px;display:flex;align-items:center;gap:10px}
.eyebrow::before{content:'';width:32px;height:3px;background:var(--orange)}
.sec-title{font-family:var(--disp);font-size:clamp(32px,4.5vw,52px);line-height:1;letter-spacing:.5px;text-transform:uppercase;color:#fff;max-width:22ch}
.sec-sub{font-size:18px;color:var(--txt-dim);max-width:62ch;margin-top:16px}

/* page hero (interior pages) */
.phero{position:relative;padding:90px 24px 70px;background:linear-gradient(180deg,rgba(14,18,22,.78),rgba(14,18,22,.92)),url('../images/shop-work.jpg');background-size:cover;background-position:center}
.phero.eng{background:linear-gradient(180deg,rgba(14,18,22,.80),rgba(14,18,22,.93)),url('../images/cat-engine.jpg');background-size:cover;background-position:center}
.phero.field{background:linear-gradient(180deg,rgba(14,18,22,.78),rgba(14,18,22,.92)),url('../images/engine-bay.jpg');background-size:cover;background-position:center}
.phero-in{max-width:1240px;margin:0 auto}
.phero h1{font-family:var(--disp);font-size:clamp(34px,5.5vw,64px);line-height:.96;text-transform:uppercase;color:#fff;max-width:18ch;text-shadow:0 3px 20px rgba(0,0,0,.5)}
.phero h1 em{color:var(--orange);font-style:normal}
.phero p{font-size:18px;color:var(--txt);max-width:56ch;margin-top:18px;font-weight:500}
.crumb{font-family:var(--cond);font-size:14px;letter-spacing:.8px;text-transform:uppercase;color:var(--txt-dim);margin-bottom:18px}
.crumb a:hover{color:var(--orange)}

/* value strip */
.strip{background:var(--blue)}
.strip-in{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr)}
.strip-item{padding:30px 24px;text-align:center;border-right:1px solid rgba(255,255,255,.13)}
.strip-item:last-child{border-right:0}
.strip-item b{font-family:var(--disp);font-size:34px;color:#fff;display:block;line-height:1}
.strip-item span{font-family:var(--cond);font-weight:600;font-size:15px;letter-spacing:.8px;text-transform:uppercase;color:#BFD2EE}

/* cards grid */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px}
.card{background:var(--ink-3);border:1px solid var(--line);border-radius:6px;padding:32px 26px;position:relative;overflow:hidden;transition:transform .2s,border-color .2s;display:block}
.card::before{content:'';position:absolute;top:0;left:0;width:100%;height:4px;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.card:hover{transform:translateY(-5px);border-color:rgba(255,106,0,.4)}
.card:hover::before{transform:scaleX(1)}
.card-ico{width:54px;height:54px;border-radius:6px;background:rgba(255,106,0,.12);border:1px solid rgba(255,106,0,.3);display:flex;align-items:center;justify-content:center;margin-bottom:18px}
.card-ico svg{width:28px;height:28px;stroke:var(--orange);fill:none;stroke-width:2}
.card h3{font-family:var(--cond);font-weight:700;font-size:23px;letter-spacing:.4px;text-transform:uppercase;color:#fff;margin-bottom:9px}
.card p{font-size:15.5px;color:var(--txt-dim)}
.card .more{display:inline-block;margin-top:14px;font-family:var(--cond);font-weight:700;font-size:15px;letter-spacing:.5px;text-transform:uppercase;color:var(--orange)}

/* prose (service + blog body) */
.prose{max-width:760px;margin:0 auto}
.prose h2{font-family:var(--disp);font-size:clamp(26px,3.4vw,38px);text-transform:uppercase;color:#fff;margin:42px 0 14px;line-height:1.05}
.prose h3{font-family:var(--cond);font-weight:700;font-size:24px;text-transform:uppercase;letter-spacing:.4px;color:#fff;margin:30px 0 10px}
.prose p{font-size:17px;color:var(--txt);margin-bottom:16px}
.prose ul{margin:0 0 18px 0;padding-left:0;list-style:none}
.prose ul li{position:relative;padding-left:30px;margin-bottom:11px;font-size:16.5px;color:var(--txt)}
.prose ul li::before{content:'';position:absolute;left:0;top:9px;width:14px;height:3px;background:var(--orange)}
.prose strong{color:#fff}
.prose .lead{font-size:20px;color:var(--txt);font-weight:500}
.callout{background:var(--ink-3);border-left:4px solid var(--orange);border-radius:0 6px 6px 0;padding:22px 26px;margin:26px 0}
.callout p{margin:0;font-size:16.5px}

/* CARB block */
.carb{background:linear-gradient(135deg,var(--blue),#00204A);position:relative;overflow:hidden}
.carb::after{content:'';position:absolute;right:-80px;top:-80px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(255,106,0,.18),transparent 70%)}
.carb-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center;position:relative;z-index:1}
.carb .sec-title,.carb .sec-sub{color:#fff}.carb .sec-sub{color:#CFE0F5}
.carb-list{margin-top:26px;display:flex;flex-direction:column;gap:14px}
.carb-list li{list-style:none;display:flex;gap:13px;align-items:flex-start;font-size:16.5px;color:#EAF1FB}
.carb-list svg{width:24px;height:24px;stroke:var(--orange);fill:none;stroke-width:2.5;flex-shrink:0;margin-top:2px}
.carb-card{background:rgba(0,0,0,.32);border:1px solid rgba(255,255,255,.16);border-radius:10px;padding:34px}
.carb-card .big{font-family:var(--disp);font-size:62px;color:var(--orange);line-height:1}
.carb-card .big small{font-size:22px;color:#fff}
.carb-card .lbl{font-family:var(--cond);font-weight:600;font-size:16px;letter-spacing:.6px;text-transform:uppercase;color:#CFE0F5;margin-top:6px}
.carb-card .div{height:1px;background:rgba(255,255,255,.16);margin:24px 0}
.carb-card p{font-size:15px;color:#CFE0F5}

/* gallery */
.gal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:46px}
.gal{position:relative;border-radius:6px;overflow:hidden;aspect-ratio:4/3;border:1px solid var(--line)}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.gal:hover img{transform:scale(1.07)}
.gal-tag{position:absolute;left:0;bottom:0;background:var(--orange);color:#fff;font-family:var(--cond);font-weight:700;font-size:13px;letter-spacing:.7px;text-transform:uppercase;padding:6px 13px}

/* brands marquee */
.brands{background:var(--ink);padding:40px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden}
.brands-track{display:flex;gap:60px;animation:scroll 26s linear infinite;white-space:nowrap;font-family:var(--disp);font-size:30px;color:var(--steel);letter-spacing:1px;text-transform:uppercase}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* why cards */
.why-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:46px}
.why-card{display:flex;gap:18px;padding:28px;background:var(--ink-3);border:1px solid var(--line);border-radius:6px;border-left:4px solid var(--orange)}
.why-num{font-family:var(--disp);font-size:34px;color:rgba(255,106,0,.4);line-height:1}
.why-card h3{font-family:var(--cond);font-weight:700;font-size:21px;text-transform:uppercase;letter-spacing:.4px;color:#fff;margin-bottom:7px}
.why-card p{font-size:15.5px;color:var(--txt-dim)}

/* area list */
.area-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:36px}
.area{background:var(--ink-3);border:1px solid var(--line);border-radius:5px;padding:15px 18px;display:flex;align-items:center;gap:10px;font-family:var(--cond);font-weight:600;font-size:16px;letter-spacing:.4px;color:var(--txt);text-transform:uppercase}
.area svg{width:18px;height:18px;stroke:var(--orange);fill:none;stroke-width:2;flex-shrink:0}

/* blog list */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
.post{background:var(--ink-3);border:1px solid var(--line);border-radius:8px;overflow:hidden;transition:transform .2s,border-color .2s;display:flex;flex-direction:column}
.post:hover{transform:translateY(-5px);border-color:rgba(255,106,0,.4)}
.post img{width:100%;height:180px;object-fit:cover}
.post-body{padding:24px;display:flex;flex-direction:column;flex:1}
.post-cat{font-family:var(--cond);font-weight:700;font-size:13px;letter-spacing:1px;text-transform:uppercase;color:var(--orange);margin-bottom:8px}
.post h3{font-family:var(--cond);font-weight:700;font-size:21px;line-height:1.1;text-transform:uppercase;color:#fff;margin-bottom:10px}
.post p{font-size:15px;color:var(--txt-dim);flex:1}
.post .more{margin-top:14px;font-family:var(--cond);font-weight:700;font-size:14px;letter-spacing:.5px;text-transform:uppercase;color:var(--orange)}

/* contact / form */
.quote-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:54px;align-items:start}
.contact-line{display:flex;align-items:center;gap:14px;margin-top:18px;padding:18px;background:var(--ink-3);border:1px solid var(--line);border-radius:6px}
.contact-line svg{width:26px;height:26px;stroke:var(--orange);fill:none;stroke-width:2;flex-shrink:0}
.contact-line b{font-family:var(--cond);font-size:22px;color:#fff;letter-spacing:.5px}
.contact-line span{font-size:13px;color:var(--txt-dim);text-transform:uppercase;letter-spacing:.6px;display:block}
form.qf{background:var(--ink-3);border:1px solid var(--line);border-radius:10px;padding:34px}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fg{margin-bottom:16px}
.fg label{font-family:var(--cond);font-weight:600;font-size:14px;letter-spacing:.6px;text-transform:uppercase;color:var(--txt);display:block;margin-bottom:7px}
.fg input,.fg select,.fg textarea{width:100%;background:var(--ink);border:1px solid var(--line);border-radius:5px;padding:13px 14px;color:#fff;font-family:var(--body);font-size:15.5px;transition:border-color .2s}
.fg input:focus,.fg select:focus,.fg textarea:focus{outline:none;border-color:var(--orange)}
.fg textarea{resize:vertical;min-height:90px}
.hp{position:absolute;left:-9999px;opacity:0}
.f-submit{width:100%;background:var(--orange);color:#fff;font-family:var(--cond);font-weight:700;font-size:20px;letter-spacing:.6px;text-transform:uppercase;border:0;border-radius:5px;padding:17px;cursor:pointer;margin-top:6px;box-shadow:0 6px 20px rgba(255,106,0,.4);transition:transform .15s,box-shadow .15s}
.f-submit:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(255,106,0,.55)}
.f-note{font-size:13px;color:var(--txt-dim);text-align:center;margin-top:14px}
#formStatus{margin-top:16px;padding:14px;border-radius:6px;font-weight:600;display:none}
#formStatus.ok{display:block;background:rgba(40,160,80,.15);border:1px solid #2EA85B;color:#7DDF9F}
#formStatus.err{display:block;background:rgba(220,60,60,.15);border:1px solid #DC3C3C;color:#F0A0A0}

/* CTA band */
.cta-band{background:linear-gradient(135deg,var(--orange),var(--orange-d));text-align:center;padding:64px 24px}
.cta-band h2{font-family:var(--disp);font-size:clamp(28px,4vw,46px);text-transform:uppercase;color:#fff;line-height:1}
.cta-band p{color:rgba(255,255,255,.9);font-size:18px;margin:14px 0 26px}
.cta-band .btn-xl{background:var(--ink);color:#fff}
.cta-band .btn-xl:hover{background:#000}

/* footer */
.footer{background:#0A0E12;border-top:1px solid var(--line);padding:54px 24px 0}
.footer-in{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px;padding-bottom:40px}
.footer-brand img{height:58px;margin-bottom:16px}
.footer-brand p{font-size:14.5px;color:var(--txt-dim);max-width:34ch}
.footer h4{font-family:var(--cond);font-weight:700;font-size:16px;letter-spacing:1px;text-transform:uppercase;color:#fff;margin-bottom:16px}
.footer ul{list-style:none}
.footer ul li{margin-bottom:10px}
.footer ul a,.footer ul span{font-size:15px;color:var(--txt-dim);transition:color .2s}
.footer ul a:hover{color:var(--orange)}
.footer-bottom{border-top:1px solid var(--line);padding:22px 0;text-align:center;font-size:13px;color:var(--txt-dim);font-family:var(--cond);letter-spacing:.5px}

.float-call{display:none;position:fixed;bottom:18px;left:18px;right:18px;z-index:90;background:var(--orange);color:#fff;font-family:var(--cond);font-weight:700;font-size:19px;letter-spacing:.6px;text-transform:uppercase;text-align:center;padding:15px;border-radius:6px;box-shadow:0 6px 22px rgba(0,0,0,.5)}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s,transform .6s}
.reveal.in{opacity:1;transform:none}

@media(max-width:980px){
  .nav-links{display:none}.hamburger{display:flex}.nav .btn-call span.lbl{display:none}
  .carb-grid,.quote-grid{grid-template-columns:1fr;gap:34px}
  .grid-3,.gal-grid,.blog-grid{grid-template-columns:repeat(2,1fr)}
  .why-grid{grid-template-columns:1fr}
  .strip-in{grid-template-columns:repeat(2,1fr)}
  .strip-item:nth-child(2){border-right:0}.strip-item{border-bottom:1px solid rgba(255,255,255,.13)}
  .area-grid{grid-template-columns:repeat(2,1fr)}
  .footer-in{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
  .sec{padding:60px 20px}
  .grid-3,.gal-grid,.blog-grid,.area-grid{grid-template-columns:1fr}
  .f-row{grid-template-columns:1fr}.footer-in{grid-template-columns:1fr}
  .float-call{display:block}body{padding-bottom:70px}
}