@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500;600;700&family=Inter:wght@400;500;600&display=swap');

:root{
  --orange:#ff6a21;
  --orange-dark:#e65c14;
  --black:#0c0c0c;
  --charcoal:#181818;
  --charcoal-light:#222;
  --steel:#8a8f98;
}

*{margin:0;padding:0;box-sizing:border-box}

body{font-family:'Inter',Arial,sans-serif;background:var(--black);color:#fff;line-height:1.6}

h1,h2,h3{font-family:'Oswald',Arial,sans-serif;text-transform:uppercase;letter-spacing:.5px}

/* Hazard-stripe divider - nods to the construction/hauling industry */
.stripe-divider{height:10px;background:repeating-linear-gradient(45deg,var(--orange) 0 20px,var(--black) 20px 40px)}

nav{display:flex;justify-content:space-between;align-items:center;padding:20px 8%;position:relative;z-index:2}
.nav-links{display:flex;align-items:center;gap:30px}
.nav-links a{color:#fff;text-decoration:none;font-weight:600;font-family:'Oswald',Arial,sans-serif;letter-spacing:.5px;position:relative;padding-bottom:4px}
.nav-links a:not(.btn)::after{content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background:var(--orange);transition:width .25s ease}
.nav-links a:not(.btn):hover::after{width:100%}
.nav-links a:hover{color:var(--orange)}
.logo{height:70px}

.hero{min-height:90vh;position:relative;background:linear-gradient(rgba(0,0,0,.75),rgba(0,0,0,.8)),url("images/hero.jpg") center/cover}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:10px;background:repeating-linear-gradient(45deg,var(--orange) 0 20px,transparent 20px 40px)}
.overlay{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;height:75vh;padding:20px;animation:fadeUp .9s ease both}
h1{font-size:3.2rem;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.tagline{color:var(--orange);font-weight:600;letter-spacing:1px;margin-top:14px;font-size:1.1rem}
h2{color:var(--orange);margin-bottom:20px}
.eyebrow{display:block;color:var(--steel);font-family:'Inter',Arial,sans-serif;text-transform:uppercase;letter-spacing:2px;font-size:.8rem;margin-bottom:8px}

section{padding:70px 10%;background:var(--charcoal)}
section:nth-of-type(even){background:var(--black)}

/* Trust bar - real, verifiable facts only */
.trust-bar{background:var(--black);padding:50px 8%;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:30px;text-align:center;border-top:1px solid #262626;border-bottom:1px solid #262626}
.trust-item{display:flex;flex-direction:column;align-items:center;gap:10px}
.trust-item svg{height:34px;width:34px;fill:var(--orange)}
.trust-item strong{font-family:'Oswald',Arial,sans-serif;font-size:1.05rem;letter-spacing:.5px}
.trust-item span{color:var(--steel);font-size:.85rem}

.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:25px}
.cards div{background:var(--charcoal-light);padding:30px;border-top:5px solid var(--orange);border-radius:8px;transition:transform .25s ease, box-shadow .25s ease}
.cards div:hover{transform:translateY(-6px);box-shadow:0 12px 24px rgba(0,0,0,.4)}
.cards svg{height:38px;width:38px;fill:var(--orange);margin-bottom:14px}

.btn{background:var(--orange);color:#fff;padding:14px 28px;text-decoration:none;border-radius:6px;font-weight:bold;display:inline-block;margin-top:20px;transition:background .2s ease, transform .2s ease}
.btn:hover{background:var(--orange-dark);transform:translateY(-2px)}

footer{text-align:center;padding:70px 20px 40px;background:var(--black)}
.footer-address{color:var(--steel);margin-top:10px;font-size:.95rem}
.footer-meta{margin-top:30px;padding-top:25px;border-top:1px solid #262626;color:#555;font-size:.8rem;letter-spacing:.5px}

@keyframes fadeUp{
  from{opacity:0;transform:translateY(16px)}
  to{opacity:1;transform:translateY(0)}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}

/* Contact page */
.contact-page{min-height:auto}
.contact-wrap{max-width:700px;margin:0 auto;text-align:center}
.contact-info{background:var(--charcoal-light);padding:40px;border-top:5px solid var(--orange);border-radius:8px;margin-top:30px}
.contact-info p{margin:12px 0;font-size:1.1rem}
.contact-info a{color:var(--orange);text-decoration:none;font-weight:bold}
.contact-info a:hover{text-decoration:underline}
.btn-fb{background:#1877f2;display:inline-flex;align-items:center;gap:10px}
.btn-fb:hover{background:#1461c9}
.btn-fb svg{height:20px;width:20px;fill:#fff}
.map-wrap{margin-top:35px;border-radius:8px;overflow:hidden;border-top:5px solid var(--orange);filter:grayscale(.3) contrast(1.1)}
.map-wrap iframe{display:block;width:100%;height:320px;border:0}
