* { box-sizing: border-box; }

body {
  margin: 0;
  background: #FFFCF6;
  font-family: 'Work Sans', system-ui, -apple-system, sans-serif;
  color: #171310;
}

h1, h2 { font-family: 'Space Grotesk', system-ui, sans-serif; font-weight: 700; margin: 0; }
h3 { font-family: 'Work Sans', sans-serif; font-weight: 700; margin: 0; }
p { margin: 0; }
img, svg { max-width: 100%; }

a { color: #E8231C; text-decoration: none; }
a:hover { color: #171310; }

.container { max-width: 1180px; margin: 0 auto; padding: 0 40px; }

/* Soft elevation used on cards, buttons, badges and chips */
.pop {
  box-shadow: 0 20px 40px -20px rgba(23,19,16,0.28);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.pop:hover {
  transform: translateY(-3px);
  box-shadow: 0 26px 48px -18px rgba(23,19,16,0.34);
}

/* Nav */
.site-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1180px;
  margin: 0 auto;
  padding: 20px 40px;
}
.nav-links { display: flex; align-items: center; gap: 28px; }
.nav-link { color: #171310; font-size: 15px; font-weight: 600; }
.nav-link:hover, .nav-link.active { color: #E8231C; }

/* Buttons */
.btn { display: inline-block; padding: 15px 30px; border-radius: 999px; font-size: 16px; font-weight: 700; }
.btn-dark { background: #171310; color: #FFFFFF; }
.btn-dark:hover { color: #FFFFFF; }
.btn-light { background: #FFFFFF; color: #171310; }
.btn-light:hover { color: #171310; }
.btn-red { background: #E8231C; color: #FFFFFF; }
.btn-red:hover { color: #FFFFFF; }
.btn-sm { padding: 11px 22px; font-size: 15px; }

/* Page header banner used on every page except Home */
.page-hero {
  background: linear-gradient(to bottom, #D62A0F 0%, #E8401C 22%, #F7931E 55%, #FFD200 100%);
  padding: 56px 40px 64px;
  text-align: center;
}
.page-hero .eyebrow {
  font-size: 13px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase;
  color: #171310; opacity: 0.7; margin-bottom: 10px;
}
.page-hero h1 { font-size: 38px; color: #171310; line-height: 1.2; }
.page-hero p { font-size: 16px; color: #171310; opacity: 0.85; max-width: 560px; margin: 14px auto 0; line-height: 1.6; }

/* Footer */
.social-link:hover { transform: translateY(-2px); }

/* Homepage photo reel — CSS-only crossfade, no JS required */
.photo-reel {
  position: relative;
  width: 100%;
  aspect-ratio: 6 / 5;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 30px 60px -20px rgba(23,19,16,0.35);
  background: #FFFFFF;
}
.photo-reel img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  animation: reel-fade 30s infinite;
}
.photo-reel img:nth-child(1)  { animation-delay: 0s; }
.photo-reel img:nth-child(2)  { animation-delay: 3s; }
.photo-reel img:nth-child(3)  { animation-delay: 6s; }
.photo-reel img:nth-child(4)  { animation-delay: 9s; }
.photo-reel img:nth-child(5)  { animation-delay: 12s; }
.photo-reel img:nth-child(6)  { animation-delay: 15s; }
.photo-reel img:nth-child(7)  { animation-delay: 18s; }
.photo-reel img:nth-child(8)  { animation-delay: 21s; }
.photo-reel img:nth-child(9)  { animation-delay: 24s; }
.photo-reel img:nth-child(10) { animation-delay: 27s; }

@keyframes reel-fade {
  0%   { opacity: 0; }
  1%   { opacity: 1; }
  9%   { opacity: 1; }
  10%  { opacity: 0; }
  100% { opacity: 0; }
}

/* Forms */
.field { margin-bottom: 18px; }
.field label {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: #171310;
  margin-bottom: 6px;
}
.field input,
.field textarea {
  width: 100%;
  padding: 13px 14px;
  border: 1.5px solid rgba(23,19,16,0.14);
  border-radius: 10px;
  font-family: 'Work Sans', sans-serif;
  font-size: 14.5px;
  color: #171310;
  background: #FFFCF6;
}
.field input:focus,
.field textarea:focus {
  outline: none;
  border-color: #E8231C;
}
.field textarea { resize: vertical; min-height: 130px; }
.form-btn {
  border: none;
  cursor: pointer;
  font-family: inherit;
}

@media (max-width: 860px) {
  .contact-grid { grid-template-columns: 1fr !important; }
  .hero-grid { grid-template-columns: 1fr !important; }
  .hero-copy { padding-right: 0 !important; }
  .stats-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .projects-grid { grid-template-columns: 1fr !important; }
  .about-grid { grid-template-columns: 1fr !important; }
  .team-grid { grid-template-columns: repeat(2,1fr) !important; }
  .involved-grid { grid-template-columns: 1fr !important; }
  .fleet-grid { grid-template-columns: 1fr !important; }
  .footer-grid { grid-template-columns: 1fr !important; gap: 32px !important; }
  .nav-links { display: none !important; }
  .h1-hero { font-size: 38px !important; }
  .section-pad { padding-left: 24px !important; padding-right: 24px !important; }
  .page-hero h1 { font-size: 30px !important; }
}