/* ════════════════════════════════════════════════
   GearDock Garage — Premium Dark Theme Stylesheet
   ════════════════════════════════════════════════ */

/* ─── Reset & Base ──────────────────────────────── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:80px; }
body {
  font-family:'Inter', system-ui, -apple-system, sans-serif;
  background:#0a0a0f;
  color:#c8c8d0;
  line-height:1.7;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
a { color:inherit; text-decoration:none; transition:color .25s; }
a:hover { color:#e8363c; }
ul { list-style:none; }
img { max-width:100%; display:block; }
button { cursor:pointer; border:none; background:none; font-family:inherit; }
input, textarea, select { font-family:inherit; }

/* ─── Utility ───────────────────────────────────── */
.container { max-width:1200px; margin:0 auto; padding:0 24px; }
.text-accent { color:#e8363c; }

/* ─── Buttons ───────────────────────────────────── */
.btn {
  display:inline-flex; align-items:center; gap:8px;
  font-weight:600; font-size:.9rem;
  border-radius:10px; padding:12px 28px;
  transition:all .3s ease; cursor:pointer; border:none;
  text-transform:uppercase; letter-spacing:.6px;
}
.btn-primary {
  background:linear-gradient(135deg,#e8363c,#c0282e);
  color:#fff; box-shadow:0 4px 20px rgba(232,54,60,.35);
}
.btn-primary:hover { background:linear-gradient(135deg,#ff4a50,#e8363c); transform:translateY(-2px); box-shadow:0 8px 30px rgba(232,54,60,.45); color:#fff; }
.btn-outline {
  background:transparent; border:2px solid rgba(232,54,60,.5);
  color:#e8363c;
}
.btn-outline:hover { background:rgba(232,54,60,.1); border-color:#e8363c; color:#fff; }
.btn-accent { background:#e8363c; color:#fff; padding:8px 18px; font-size:.8rem; border-radius:8px; }
.btn-accent:hover { background:#ff4a50; color:#fff; }
.btn-sm { padding:8px 18px; font-size:.8rem; }
.btn-lg { padding:14px 34px; font-size:.95rem; }
.btn-full { width:100%; justify-content:center; }

/* ─── Loader ────────────────────────────────────── */
.loader {
  position:fixed; inset:0; z-index:9999;
  background:#0a0a0f;
  display:flex; align-items:center; justify-content:center;
  transition:opacity .5s, visibility .5s;
}
.loader.hidden { opacity:0; visibility:hidden; pointer-events:none; }
.loader-gear { animation:spin 1.5s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }

/* ─── Header ────────────────────────────────────── */
.header {
  position:fixed; top:0; left:0; width:100%; z-index:1000;
  background:rgba(10,10,15,.7);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(255,255,255,.05);
  transition:background .3s, box-shadow .3s;
}
.header.scrolled { background:rgba(10,10,15,.95); box-shadow:0 4px 30px rgba(0,0,0,.5); }
.header-inner { display:flex; align-items:center; justify-content:space-between; height:72px; }

/* Logo */
.logo { display:flex; align-items:center; gap:10px; }
.logo-icon { flex-shrink:0; }
.logo-text { display:flex; flex-direction:column; line-height:1.1; }
.logo-name { font-family:'Outfit',sans-serif; font-weight:800; font-size:1.35rem; color:#fff; letter-spacing:1px; }
.logo-sub { font-size:.6rem; font-weight:600; color:#e8363c; letter-spacing:4px; text-transform:uppercase; }

/* Nav */
.nav { display:flex; gap:6px; }
.nav-link {
  padding:8px 16px; border-radius:8px;
  font-size:.85rem; font-weight:500; color:#9e9eaa;
  transition:all .25s;
}
.nav-link:hover, .nav-link.active { color:#fff; background:rgba(255,255,255,.06); }

/* Header actions */
.header-actions { display:flex; align-items:center; gap:12px; }
.header-cta { font-size:.8rem; }

/* Hamburger */
.hamburger { display:none; flex-direction:column; gap:5px; padding:8px; }
.hamburger span { display:block; width:24px; height:2px; background:#fff; border-radius:2px; transition:all .3s; }
.hamburger.active span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.hamburger.active span:nth-child(2) { opacity:0; }
.hamburger.active span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

/* ─── Hero ──────────────────────────────────────── */
.hero {
  position:relative; min-height:100vh;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden; padding:120px 0 80px;
}
.hero-bg-overlay {
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse at 20% 50%, rgba(232,54,60,.12) 0%, transparent 60%),
    radial-gradient(ellipse at 80% 20%, rgba(100,50,200,.08) 0%, transparent 50%),
    linear-gradient(180deg, #0a0a0f 0%, #12121a 100%);
}
.hero-particles {
  position:absolute; inset:0; pointer-events:none;
}
.hero-content { position:relative; text-align:center; max-width:820px; z-index:2; }
.hero-badge {
  display:inline-block;
  padding:8px 24px; border-radius:40px;
  background:rgba(232,54,60,.1); border:1px solid rgba(232,54,60,.25);
  color:#e8363c; font-size:.8rem; font-weight:600; letter-spacing:1px;
  margin-bottom:28px; text-transform:uppercase;
}
.hero-title {
  font-family:'Outfit',sans-serif; font-size:clamp(2.4rem, 5vw, 4rem);
  font-weight:800; color:#fff; line-height:1.15; margin-bottom:20px;
}
.hero-subtitle { font-size:1.15rem; color:#9e9eaa; max-width:600px; margin:0 auto 36px; }
.hero-buttons { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin-bottom:56px; }
.hero-stats { display:flex; justify-content:center; gap:48px; flex-wrap:wrap; }
.hero-stat { text-align:center; }
.hero-stat-number { font-family:'Outfit',sans-serif; font-size:2.2rem; font-weight:800; color:#fff; }
.hero-stat-label { display:block; font-size:.78rem; color:#7a7a88; margin-top:2px; text-transform:uppercase; letter-spacing:1px; }
.hero-scroll {
  position:absolute; bottom:32px; left:50%; transform:translateX(-50%);
  animation:bounce 2s infinite;
}
.hero-scroll a { color:#e8363c; }
@keyframes bounce { 0%,100%{ transform:translateX(-50%) translateY(0); } 50%{ transform:translateX(-50%) translateY(10px); } }

/* ─── Vehicle Fitment Selector ─────────────────── */
.fitment-section { position:relative; z-index:10; margin-top:-60px; padding-bottom:50px; }
.fitment-wrapper {
  background:#12121a; border:1px solid rgba(255,255,255,.07);
  box-shadow:0 20px 50px rgba(0,0,0,.4), 0 0 0 1px rgba(232,54,60,.15);
  border-radius:20px; padding:32px 40px;
}
.fitment-header { display:flex; align-items:center; gap:12px; margin-bottom:20px; }
.fitment-header h3 { font-family:'Outfit',sans-serif; font-size:1.25rem; font-weight:700; color:#fff; }
.fitment-form { display:grid; grid-template-columns:1fr auto; gap:20px; align-items:center; }
.fitment-selects { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.fitment-form select {
  width:100%; padding:14px 18px; border-radius:10px;
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08);
  color:#fff; font-size:.9rem; outline:none; transition:border-color .3s;
  cursor:pointer; appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e8363c' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; background-size:16px;
  padding-right:40px;
}
.fitment-form select:disabled { opacity:.4; cursor:not-allowed; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); }
.fitment-form select:focus { border-color:#e8363c; }
.fitment-result { margin-top:16px; font-size:.92rem; font-weight:600; text-align:center; transition:opacity .3s; }
.fitment-result.success { color:#22c55e; }
.fitment-result.error { color:#ef4444; }

/* ─── Promo Banner ─────────────────────────────── */
.promo-banner-section { padding:40px 0; }
.promo-banner {
  background:linear-gradient(135deg, rgba(232,54,60,.12) 0%, rgba(10,10,15,0) 100%), #12121a;
  border:1px solid rgba(232,54,60,.2); border-radius:20px;
  padding:40px; display:flex; align-items:center; justify-content:space-between; gap:30px;
}
.promo-content .promo-tag {
  display:inline-block; padding:4px 12px; background:rgba(232,54,60,.15);
  color:#e8363c; border-radius:6px; font-size:.72rem; font-weight:700;
  text-transform:uppercase; margin-bottom:12px; letter-spacing:.5px;
}
.promo-content h2 { font-family:'Outfit',sans-serif; font-size:1.6rem; font-weight:800; color:#fff; margin-bottom:8px; }
.promo-content p { color:#9e9eaa; font-size:.95rem; }

/* ─── Section Commons ──────────────────────────── */
.section { padding:100px 0; position:relative; }
.section:nth-child(even) { background:rgba(255,255,255,.015); }
.section-header { text-align:center; max-width:640px; margin:0 auto 60px; }
.section-tag {
  display:inline-block;
  font-size:.75rem; font-weight:700; letter-spacing:2.5px;
  text-transform:uppercase; color:#e8363c;
  margin-bottom:12px;
}
.section-title {
  font-family:'Outfit',sans-serif; font-size:clamp(1.8rem,3.5vw,2.6rem);
  font-weight:800; color:#fff; margin-bottom:16px; line-height:1.2;
}
.section-desc { color:#9e9eaa; font-size:1.02rem; }

/* ─── About Grid ────────────────────────────────── */
.about-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.about-card {
  background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06);
  border-radius:16px; padding:36px 28px; text-align:center;
  transition:transform .35s, border-color .35s, box-shadow .35s;
}
.about-card:hover { transform:translateY(-6px); border-color:rgba(232,54,60,.3); box-shadow:0 12px 40px rgba(232,54,60,.08); }
.about-card-icon { margin-bottom:20px; }
.about-card h3 { font-family:'Outfit',sans-serif; font-size:1.15rem; font-weight:700; color:#fff; margin-bottom:10px; }
.about-card p { font-size:.9rem; color:#8e8e9a; }

/* ─── Services Grid ─────────────────────────────── */
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.service-card {
  background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06);
  border-radius:16px; padding:40px 30px; text-align:center;
  transition:transform .35s, border-color .35s;
  position:relative; overflow:hidden;
}
.service-card::before {
  content:''; position:absolute; top:0; left:50%; transform:translateX(-50%);
  width:60px; height:3px; background:#e8363c; border-radius:0 0 4px 4px;
  opacity:0; transition:opacity .3s;
}
.service-card:hover { transform:translateY(-6px); border-color:rgba(232,54,60,.3); }
.service-card:hover::before { opacity:1; }
.service-icon { margin-bottom:20px; color:#e8363c; }
.service-card h3 { font-family:'Outfit',sans-serif; font-size:1.15rem; font-weight:700; color:#fff; margin-bottom:10px; }
.service-card p { font-size:.88rem; color:#8e8e9a; }

/* ─── Certifications ────────────────────────────── */
.certifications-section { padding:40px 0; background:rgba(232,54,60,.03); border-top:1px solid rgba(255,255,255,.03); border-bottom:1px solid rgba(255,255,255,.03); }
.certs-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:30px; }
.cert-item { display:flex; align-items:center; gap:16px; }
.cert-icon { font-size:2rem; }
.cert-item h4 { font-family:'Outfit',sans-serif; font-size:.95rem; font-weight:700; color:#fff; margin-bottom:2px; }
.cert-item p { font-size:.8rem; color:#8e8e9a; }

/* ─── Products Grid ─────────────────────────────── */
.products-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.product-card {
  background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06);
  border-radius:16px; overflow:hidden;
  transition:transform .35s, border-color .35s;
}
.product-card:hover { transform:translateY(-6px); border-color:rgba(232,54,60,.3); }
.product-image {
  position:relative; height:180px;
  background:linear-gradient(135deg,rgba(232,54,60,.08),rgba(30,30,45,.6));
  display:flex; align-items:center; justify-content:center;
}
.product-placeholder { opacity:.6; }
.product-badge {
  position:absolute; top:12px; left:12px;
  background:#e8363c; color:#fff; font-size:.7rem; font-weight:700;
  padding:4px 12px; border-radius:6px; text-transform:uppercase; letter-spacing:.5px;
}
.product-info { padding:20px; }
.product-info h3 { font-family:'Outfit',sans-serif; font-size:1.05rem; font-weight:700; color:#fff; margin-bottom:8px; }
.product-info p { font-size:.85rem; color:#8e8e9a; margin-bottom:14px; }
.product-meta { display:flex; align-items:center; justify-content:space-between; }
.product-price { font-weight:700; color:#e8363c; font-size:.95rem; }

/* ─── Why Us Grid ───────────────────────────────── */
.why-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.why-card {
  background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06);
  border-radius:16px; padding:36px 28px;
  transition:transform .35s, border-color .35s;
}
.why-card:hover { transform:translateY(-6px); border-color:rgba(232,54,60,.3); }
.why-number { font-family:'Outfit',sans-serif; font-size:2.2rem; font-weight:800; color:rgba(232,54,60,.2); margin-bottom:12px; }
.why-card h3 { font-family:'Outfit',sans-serif; font-size:1.1rem; font-weight:700; color:#fff; margin-bottom:8px; }
.why-card p { font-size:.88rem; color:#8e8e9a; }

/* ─── FAQ Accordions ────────────────────────────── */
.faq-accordion-wrap { max-width:800px; margin:0 auto; display:flex; flex-direction:column; gap:16px; }
.faq-item {
  background:rgba(255,255,255,.02); border:1px solid rgba(255,255,255,.06);
  border-radius:12px; overflow:hidden; transition:all .3s;
}
.faq-item:hover { border-color:rgba(232,54,60,.25); }
.faq-trigger {
  width:100%; display:flex; align-items:center; justify-content:space-between;
  padding:20px 28px; text-align:left; font-family:'Outfit',sans-serif;
  font-size:1.05rem; font-weight:600; color:#fff; background:transparent;
}
.faq-icon-state {
  width:24px; height:24px; position:relative; flex-shrink:0; margin-left:12px;
}
.faq-icon-state::before,
.faq-icon-state::after {
  content:''; position:absolute; background:#e8363c; transition:transform .3s;
}
.faq-icon-state::before { top:11px; left:4px; width:16px; height:2px; }
.faq-icon-state::after { top:4px; left:11px; width:2px; height:16px; }
.faq-item.active .faq-icon-state::after { transform:rotate(90deg); opacity:0; }
.faq-item.active .faq-icon-state::before { transform:rotate(180deg); }
.faq-content { max-height:0; overflow:hidden; transition:max-height .3s ease-out; }
.faq-content p { padding:0 28px 24px; font-size:.9rem; color:#9e9eaa; line-height:1.7; }

/* ─── Testimonials ──────────────────────────────── */
.testimonials-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.testimonial-card {
  background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06);
  border-radius:16px; padding:36px 28px;
  transition:transform .35s, border-color .35s;
}
.testimonial-card:hover { transform:translateY(-6px); border-color:rgba(232,54,60,.3); }
.testimonial-stars { color:#f5a623; font-size:1.1rem; margin-bottom:16px; letter-spacing:2px; }
.testimonial-card > p { font-size:.92rem; color:#b0b0b8; font-style:italic; margin-bottom:20px; line-height:1.7; }
.testimonial-author { display:flex; align-items:center; gap:12px; }
.testimonial-avatar {
  width:44px; height:44px; border-radius:50%;
  background:linear-gradient(135deg,#e8363c,#c0282e);
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-weight:700; font-size:.85rem; flex-shrink:0;
}
.testimonial-author strong { color:#fff; font-size:.9rem; display:block; }
.testimonial-author span { color:#7a7a88; font-size:.78rem; }

/* ─── Brands Marquee ────────────────────────────── */
.brands { padding:60px 0; }
.brands-marquee { overflow:hidden; position:relative; }
.brands-marquee::before,
.brands-marquee::after {
  content:''; position:absolute; top:0; bottom:0; width:100px; z-index:2;
}
.brands-marquee::before { left:0; background:linear-gradient(90deg,#0a0a0f,transparent); }
.brands-marquee::after { right:0; background:linear-gradient(270deg,#0a0a0f,transparent); }
.brands-track {
  display:flex; gap:48px; width:max-content;
  animation:marquee 30s linear infinite;
}
.brand-item {
  font-family:'Outfit',sans-serif; font-size:1.3rem; font-weight:700;
  color:rgba(255,255,255,.15); white-space:nowrap;
  text-transform:uppercase; letter-spacing:3px;
}
@keyframes marquee { 0%{ transform:translateX(0); } 100%{ transform:translateX(-50%); } }

/* ─── Contact ───────────────────────────────────── */
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start; }
.contact-form-wrap {
  background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06);
  border-radius:16px; padding:40px;
}
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-group { margin-bottom:18px; }
.form-group label { display:block; font-size:.82rem; font-weight:600; color:#d0d0d8; margin-bottom:6px; }
.form-group input,
.form-group textarea,
.form-group select {
  width:100%; padding:12px 16px; border-radius:10px;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1);
  color:#fff; font-size:.9rem; outline:none;
  transition:border-color .3s, box-shadow .3s;
}
.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
  border-color:#e8363c; box-shadow:0 0 0 3px rgba(232,54,60,.15);
}
.form-group select { appearance:none; cursor:pointer; }
.form-group textarea { resize:vertical; min-height:100px; }
.form-status { margin-top:16px; text-align:center; font-size:.9rem; font-weight:500; }
.form-status.success { color:#22c55e; }
.form-status.error { color:#ef4444; }

/* Contact Info */
.contact-info-cards { display:flex; flex-direction:column; gap:16px; margin-bottom:24px; }
.contact-info-card {
  display:flex; align-items:flex-start; gap:14px;
  background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06);
  border-radius:12px; padding:18px 20px;
}
.contact-info-icon { flex-shrink:0; margin-top:2px; }
.contact-info-card strong { color:#fff; font-size:.88rem; display:block; margin-bottom:4px; }
.contact-info-card p { font-size:.85rem; color:#9e9eaa; line-height:1.6; }
.contact-info-card a { color:#e8363c; }
.contact-info-card a:hover { text-decoration:underline; }

.map-wrap { border-radius:12px; overflow:hidden; border:1px solid rgba(255,255,255,.06); }

/* ─── Footer ────────────────────────────────────── */
.footer {
  background:#060609; border-top:1px solid rgba(255,255,255,.05);
  padding:80px 0 0;
}
.footer-row {
  display:flex; gap:40px; justify-content:space-between;
  padding-bottom:50px; border-bottom:1px solid rgba(255,255,255,.06);
  margin-bottom:50px;
}

/* Footer Row 1: Brand details and Newsletter */
.footer-row-main { align-items:center; }
.footer-brand-summary { max-width:480px; }
.footer-brand-summary .footer-logo { margin-bottom:18px; }
.footer-brand-summary .brand-desc { font-size:.88rem; color:#7a7a88; line-height:1.75; }

.footer-newsletter { max-width:440px; width:100%; }
.footer-newsletter h4 { font-family:'Outfit',sans-serif; font-size:1.1rem; color:#fff; margin-bottom:8px; }
.footer-newsletter p { font-size:.85rem; color:#7a7a88; margin-bottom:16px; }
.newsletter-form { display:flex; gap:10px; width:100%; }
.newsletter-form input {
  flex:1; padding:12px 18px; border-radius:10px;
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08);
  color:#fff; font-size:.88rem; outline:none; transition:border-color .3s;
}
.newsletter-form input:focus { border-color:#e8363c; }
.newsletter-status { margin-top:8px; font-size:.8rem; }
.newsletter-status.success { color:#22c55e; }
.newsletter-status.error { color:#ef4444; }

/* Footer Row 2: Links grid */
.footer-row-links { border-bottom:1px solid rgba(255,255,255,.04); }
.footer-col { flex:1; min-width:180px; }
.footer-col-contact { flex:1.2; min-width:240px; }
.footer-col h4 {
  font-family:'Outfit',sans-serif; font-size:.92rem; font-weight:700;
  color:#fff; margin-bottom:20px; text-transform:uppercase; letter-spacing:1px;
}
.footer-col ul li { margin-bottom:12px; }
.footer-col ul a { font-size:.88rem; color:#7a7a88; transition:color .25s; }
.footer-col ul a:hover { color:#e8363c; }

.footer-hours-list li {
  display:flex; justify-content:space-between; font-size:.85rem;
  color:#7a7a88; border-bottom:1px dashed rgba(255,255,255,.04);
  padding-bottom:8px;
}
.footer-contact-list li {
  display:flex; align-items:flex-start; gap:10px;
  font-size:.88rem; color:#7a7a88; line-height:1.5;
}
.footer-contact-list li svg { flex-shrink:0; margin-top:3px; }
.footer-contact-list a:hover { color:#e8363c; }

/* Footer Row 3: Bottom Copyright & Socials */
.footer-row-bottom {
  border-bottom:none; margin-bottom:0; padding:24px 0 32px;
  flex-direction:row; align-items:center;
}
.footer-socials { display:flex; gap:10px; }
.social-link {
  width:38px; height:38px; border-radius:10px;
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.07);
  display:flex; align-items:center; justify-content:center;
  color:#9e9eaa; transition:all .3s;
}
.social-link:hover { background:rgba(232,54,60,.12); border-color:#e8363c; color:#e8363c; }
.copyright-text { font-size:.82rem; color:#55555f; text-align:right; }
.copyright-text a { color:#e8363c; }

/* ─── Back to Top ───────────────────────────────── */
.back-to-top {
  position:fixed; bottom:28px; right:28px;
  width:46px; height:46px; border-radius:12px;
  background:linear-gradient(135deg,#e8363c,#c0282e);
  color:#fff; display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 20px rgba(232,54,60,.35);
  opacity:0; visibility:hidden; transform:translateY(16px);
  transition:all .35s; z-index:100;
}
.back-to-top.visible { opacity:1; visibility:visible; transform:translateY(0); }
.back-to-top:hover { transform:translateY(-3px); box-shadow:0 8px 30px rgba(232,54,60,.5); }

/* ─── Scroll Animations ────────────────────────── */
.js-enabled [data-animate] { opacity:0; transform:translateY(30px); transition:opacity .6s ease, transform .6s ease; }
[data-animate].animated { opacity:1; transform:translateY(0); }

/* ─── Responsive ────────────────────────────────── */
@media(max-width:1024px) {
  .about-grid { grid-template-columns:repeat(2,1fr); }
  .services-grid { grid-template-columns:repeat(2,1fr); }
  .products-grid { grid-template-columns:repeat(2,1fr); }
  .why-grid { grid-template-columns:repeat(2,1fr); }
  .testimonials-grid { grid-template-columns:repeat(2,1fr); }
  .testimonials-grid .testimonial-card:last-child { grid-column:span 2; }
  .certs-grid { grid-template-columns:repeat(2,1fr); gap:20px; }
}

@media(max-width:900px) {
  .fitment-form { grid-template-columns:1fr; }
  .fitment-selects { grid-template-columns:repeat(2,1fr); }
  .promo-banner { flex-direction:column; text-align:center; }
  .footer-row-main { flex-direction:column; align-items:stretch; gap:32px; }
  .footer-brand-summary { max-width:100%; }
  .footer-newsletter { max-width:100%; }
}

@media(max-width:768px) {
  .nav { display:none; position:absolute; top:72px; left:0; width:100%; flex-direction:column; background:rgba(10,10,15,.98); padding:16px 24px; border-bottom:1px solid rgba(255,255,255,.06); }
  .nav.open { display:flex; }
  .nav-link { padding:12px 0; }
  .hamburger { display:flex; }
  .header-cta { display:none; }
  .contact-grid { grid-template-columns:1fr; }
  .form-row { grid-template-columns:1fr; }
  .footer-row-links { flex-direction:column; gap:32px; }
  .footer-row-bottom { flex-direction:column-reverse; gap:20px; align-items:center; }
  .copyright-text { text-align:center; }
  .hero-stats { gap:28px; }
  .about-grid { grid-template-columns:1fr; }
  .services-grid { grid-template-columns:1fr; }
  .products-grid { grid-template-columns:1fr; }
  .why-grid { grid-template-columns:1fr; }
  .testimonials-grid { grid-template-columns:1fr; }
  .testimonials-grid .testimonial-card:last-child { grid-column:span 1; }
  .certs-grid { grid-template-columns:1fr; }
  .fitment-selects { grid-template-columns:1fr; }
}