/*
Theme Name: MotoWrap Custom Theme
Author: Manus
Version: 1.0
Description: Cleaned and structured WordPress theme for MotoWrap.
*/

:root {
  --blue: #1E7FC2;
  --blue-light: #3A9FE8;
  --blue-dark: #155A8A;
  --orange: #F5A623;
  --orange-light: #FFBF4D;
  --orange-dark: #C07A0A;
  --black: #070A0F;
  --dark: #0C1018;
  --dark2: #111520;
  --dark3: #181D2A;
  --white: #F0F4FA;
  --grey: #7A8499;
  --grey-light: #A8B3C8;
  --nav-h: 76px;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--black);color:var(--white);font-family:'Inter',sans-serif;overflow-x:hidden;}
::-webkit-scrollbar{width:4px;}
::-webkit-scrollbar-track{background:var(--black);}
::-webkit-scrollbar-thumb{background:var(--blue);border-radius:2px;}
a{text-decoration:none;color:inherit;}

/* ===================== HEADER / NAV ===================== */
.site-header {
  position: fixed; top: 0; left: 0; right: 0;
  z-index: 1000;
  height: var(--nav-h);
  background: rgba(7,10,15,0.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(30,127,194,0.15);
  display: flex; align-items: center;
  padding: 0 48px;
  justify-content: space-between;
  transition: background 0.3s;
}
.site-header.scrolled {
  background: rgba(7,10,15,0.98);
  border-bottom-color: rgba(30,127,194,0.3);
}

/* Logo */
.header-logo {
  display: flex; align-items: center; gap: 10px; flex-shrink: 0;
}
.logo-svg { height: 44px; width: auto; }
.logo-text-group { display: flex; flex-direction: column; line-height: 1; }
.logo-main {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 26px; letter-spacing: 3px;
}
.logo-main .l-blue { color: var(--blue-light); }
.logo-main .l-orange { color: var(--orange); }
.logo-sub {
  font-family: 'Rajdhani', sans-serif;
  font-size: 9px; font-weight: 700;
  letter-spacing: 3.5px; text-transform: uppercase;
  color: var(--grey-light); margin-top: 2px;
}

/* Nav links */
.header-nav { display: flex; align-items: center; gap: 4px; }
.nav-link {
  font-family: 'Rajdhani', sans-serif;
  font-size: 13px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  color: var(--grey-light);
  padding: 10px 16px;
  border-radius: 2px;
  transition: color 0.25s;
  position: relative;
  cursor: pointer;
}
.nav-link:hover, .nav-link.active { color: var(--white); }
.nav-link::after {
  content: ''; position: absolute; bottom: 4px; left: 16px; right: 16px;
  height: 1px; background: var(--orange);
  transform: scaleX(0); transform-origin: left;
  transition: transform 0.3s;
}
.nav-link:hover::after, .nav-link.active::after { transform: scaleX(1); }

/* Services dropdown */
.nav-dropdown { position: relative; }
.nav-dropdown > .nav-link { display: flex; align-items: center; gap: 6px; }
.nav-dropdown > .nav-link .chevron {
  font-size: 8px; transition: transform 0.25s;
  color: var(--orange);
}
.nav-dropdown:hover > .nav-link .chevron { transform: rotate(180deg); }

.dropdown-menu {
  position: absolute; top: calc(100% + 8px); left: 50%;
  transform: translateX(-50%) translateY(-8px);
  background: var(--dark2);
  border: 1px solid rgba(30,127,194,0.2);
  min-width: 220px;
  opacity: 0; pointer-events: none;
  transition: opacity 0.25s, transform 0.25s;
  transform-origin: top center;
}
.nav-dropdown:hover .dropdown-menu {
  opacity: 1; pointer-events: all;
  transform: translateX(-50%) translateY(0);
}
.dropdown-item {
  font-family: 'Rajdhani', sans-serif;
  font-size: 13px; font-weight: 600;
  letter-spacing: 1.5px; text-transform: uppercase;
  color: var(--grey-light);
  padding: 14px 20px;
  display: flex; align-items: center; gap: 10px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  transition: background 0.2s, color 0.2s, padding-left 0.2s;
  cursor: pointer;
}
.dropdown-item:last-child { border-bottom: none; }
.dropdown-item:hover { background: rgba(30,127,194,0.08); color: var(--white); padding-left: 26px; }
.dropdown-item .di-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--orange); flex-shrink: 0; }

/* Header CTA */
.header-cta {
  display: flex; align-items: center; gap: 12px; flex-shrink: 0;
}
.btn-nav-cta {
  font-family: 'Rajdhani', sans-serif;
  font-size: 12px; font-weight: 700;
  letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--white);
  background: var(--blue);
  padding: 11px 24px; border: none; cursor: pointer;
  clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 0 100%);
  transition: background 0.25s, transform 0.2s;
}
.btn-nav-cta:hover { background: var(--blue-light); transform: translateY(-1px); }
.btn-nav-phone {
  font-family: 'Rajdhani', sans-serif;
  font-size: 12px; font-weight: 700;
  letter-spacing: 1px;
  color: var(--orange-light);
  display: flex; align-items: center; gap: 6px;
}
.btn-nav-phone:hover { color: var(--orange); }

/* Hamburger */
.hamburger {
  display: none; flex-direction: column; gap: 5px;
  cursor: pointer; padding: 8px; background: none; border: none;
}
.hamburger span {
  display: block; width: 24px; height: 2px;
  background: var(--white); border-radius: 2px;
  transition: all 0.3s;
}
.hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Mobile nav drawer */
.mobile-nav {
  position: fixed; top: var(--nav-h); left: 0; right: 0;
  background: rgba(7,10,15,0.98);
  border-bottom: 1px solid rgba(30,127,194,0.2);
  padding: 0 24px 24px;
  transform: translateY(-110%);
  transition: transform 0.35s cubic-bezier(0.4,0,0.2,1);
  z-index: 999;
  max-height: calc(100vh - var(--nav-h));
  overflow-y: auto;
}
.mobile-nav.open { transform: translateY(0); }

.mobile-nav-link {
  font-family: 'Rajdhani', sans-serif;
  font-size: 18px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  color: var(--grey-light);
  padding: 16px 0;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  display: block; cursor: pointer;
  transition: color 0.2s, padding-left 0.2s;
}
.mobile-nav-link:hover { color: var(--white); padding-left: 8px; }

.mobile-services-toggle {
  display: flex; justify-content: space-between; align-items: center;
}
.mobile-services-toggle .chevron { color: var(--orange); font-size: 10px; transition: transform 0.3s; }
.mobile-services-toggle.open .chevron { transform: rotate(180deg); }

.mobile-sub-menu {
  padding-left: 16px;
  max-height: 0; overflow: hidden;
  transition: max-height 0.3s;
}
.mobile-sub-menu.open { max-height: 300px; }
.mobile-sub-link {
  font-family: 'Rajdhani', sans-serif;
  font-size: 14px; font-weight: 600;
  letter-spacing: 1.5px; text-transform: uppercase;
  color: var(--grey);
  padding: 12px 0;
  border-bottom: 1px solid rgba(255,255,255,0.03);
  display: flex; align-items: center; gap: 8px;
  cursor: pointer; transition: color 0.2s;
}
.mobile-sub-link:hover { color: var(--orange); }
.mobile-sub-link .dot { width: 4px; height: 4px; border-radius: 50%; background: var(--orange); }
.mobile-cta-row { display: flex; gap: 12px; margin-top: 20px; flex-wrap: wrap; }
.mobile-cta-row button { flex: 1; min-width: 140px; }

/* ===================== HERO ===================== */
.hero {
  position: relative; height: 100vh; min-height: 700px;
  display: flex; align-items: center; overflow: hidden;
  padding-top: var(--nav-h);
}
.hero-bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at 70% 50%, rgba(30,127,194,0.10) 0%, transparent 60%),
    radial-gradient(ellipse at 20% 80%, rgba(245,166,35,0.06) 0%, transparent 50%),
    linear-gradient(135deg, #070A0F 0%, #0C1018 100%);
}
.hero-grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(30,127,194,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(30,127,194,0.05) 1px, transparent 1px);
  background-size: 60px 60px;
  animation: gridMove 20s linear infinite;
}
@keyframes gridMove {
  0%{transform:translateY(0);}100%{transform:translateY(60px);}
}
.hero-car-bg {
  position: absolute; right: -5%; top: 50%;
  transform: translateY(-50%);
  width: 65%; height: 85%;
  background: url('https://images.unsplash.com/photo-1544636331-e26879cd4d9b?w=1200&q=80') center/cover no-repeat;
  mask-image: linear-gradient(to left, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.35) 50%, transparent 100%);
  -webkit-mask-image: linear-gradient(to left, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.35) 50%, transparent 100%);
  animation: heroFloat 6s ease-in-out infinite;
}
@keyframes heroFloat {
  0%,100%{transform:translateY(-50%) translateX(0);}
  50%{transform:translateY(-52%) translateX(8px);}
}
.hero-content {
  position: relative; z-index: 2;
  padding-left: 80px; padding-right: 40px;
  max-width: 680px;
}
.hero-tag {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: 'Rajdhani', sans-serif;
  font-size: 11px; font-weight: 700;
  letter-spacing: 4px; text-transform: uppercase;
  color: var(--orange); margin-bottom: 24px;
  animation: fadeInUp 0.8s ease both;
}
.hero-tag::before{content:'';width:32px;height:1px;background:var(--orange);}
.hero-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(64px, 8vw, 110px);
  line-height: 0.92; letter-spacing: 2px;
  animation: fadeInUp 0.8s 0.15s ease both;
}
.hero-title .accent-blue{color:var(--blue-light);}
.hero-title .accent-orange{color:var(--orange);}
.hero-title .stroke{-webkit-text-stroke:1px rgba(30,127,194,0.5);color:transparent;}
.hero-sub {
  font-size: 15px; font-weight: 300;
  color: var(--grey-light); line-height: 1.7;
  max-width: 440px; margin: 28px 0 44px;
  animation: fadeInUp 0.8s 0.3s ease both;
}
.hero-btns {
  display: flex; gap: 16px; flex-wrap: wrap;
  animation: fadeInUp 0.8s 0.45s ease both;
}
.btn-primary {
  background: var(--blue); color: var(--white);
  font-family: 'Rajdhani', sans-serif;
  font-size: 13px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase;
  padding: 16px 36px; border: none; cursor: pointer;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
  transition: all 0.3s;
}
.btn-primary:hover{background:var(--blue-light);transform:translateY(-2px);}
.btn-secondary {
  background: transparent;
  border: 1px solid rgba(245,166,35,0.5);
  color: var(--orange-light);
  font-family: 'Rajdhani', sans-serif;
  font-size: 13px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase;
  padding: 16px 36px; cursor: pointer; transition: all 0.3s;
}
.btn-secondary:hover{border-color:var(--orange);color:var(--orange);background:rgba(245,166,35,0.08);transform:translateY(-2px);}
.hero-stats {
  position: absolute; bottom: 60px; left: 80px;
  display: flex; gap: 52px; z-index: 2;
  animation: fadeInUp 0.8s 0.6s ease both;
}
.stat-num{font-family:'Bebas Neue',sans-serif;font-size:42px;color:var(--blue-light);line-height:1;}
.stat-label{font-family:'Rajdhani',sans-serif;font-size:11px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--grey);margin-top:4px;}
.hero-scroll {
  position: absolute; right: 40px; bottom: 60px; z-index: 2;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  font-family: 'Rajdhani', sans-serif; font-size: 10px;
  letter-spacing: 3px; text-transform: uppercase;
  color: var(--grey); writing-mode: vertical-lr;
}
.scroll-line {
  width: 1px; height: 60px;
  background: linear-gradient(to bottom, var(--blue), transparent);
  animation: scrollPulse 2s ease-in-out infinite;
}
@keyframes scrollPulse{0%,100%{opacity:1;}50%{opacity:0.3;}}
@keyframes fadeInUp{from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:translateY(0);}}

/* ===================== MARQUEE ===================== */
.marquee-wrap{background:var(--blue);padding:14px 0;overflow:hidden;}
.marquee-track{display:flex;animation:marqueeScroll 25s linear infinite;white-space:nowrap;}
.marquee-item{font-family:'Rajdhani',sans-serif;font-size:13px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:#fff;padding:0 40px;flex-shrink:0;}
.marquee-dot{color:rgba(255,255,255,0.4);}
@keyframes marqueeScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}

/* ===================== SECTION COMMON ===================== */
.section{padding:120px 80px;}
.section-label{font-family:'Rajdhani',sans-serif;font-size:11px;font-weight:700;letter-spacing:4px;text-transform:uppercase;color:var(--orange);margin-bottom:16px;display:flex;align-items:center;gap:12px;}
.section-label::before{content:'//';opacity:0.5;}
.section-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(42px,5vw,70px);line-height:1;letter-spacing:1px;}
.section-title .blue{color:var(--blue-light);}
.section-title .orange{color:var(--orange);}

/* ===================== SERVICES ===================== */
.services{background:var(--dark);}
.services-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:72px;flex-wrap:wrap;gap:24px;}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;}
.service-card{position:relative;overflow:hidden;aspect-ratio:4/5;cursor:pointer;background:var(--dark2);}
.service-card img{width:100%;height:100%;object-fit:cover;transition:transform 0.6s ease;filter:brightness(0.5) saturate(0.7);}
.service-card:hover img{transform:scale(1.06);filter:brightness(0.35) saturate(0.6);}
.service-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(7,10,15,0.95) 0%,transparent 55%);padding:32px;display:flex;flex-direction:column;justify-content:flex-end;}
.service-num{font-family:'Bebas Neue',sans-serif;font-size:13px;letter-spacing:3px;color:var(--orange);margin-bottom:8px;}
.service-name{font-family:'Bebas Neue',sans-serif;font-size:28px;letter-spacing:1px;margin-bottom:10px;}
.service-desc{font-size:13px;color:var(--grey-light);line-height:1.6;max-height:0;overflow:hidden;transition:max-height 0.4s ease,opacity 0.4s ease;opacity:0;}
.service-card:hover .service-desc{max-height:80px;opacity:1;}
.service-arrow{position:absolute;top:24px;right:24px;width:36px;height:36px;border:1px solid rgba(30,127,194,0.4);display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--blue-light);transform:rotate(-45deg);transition:all 0.3s;}
.service-card:hover .service-arrow{background:var(--orange);border-color:var(--orange);color:#fff;transform:rotate(0deg);}

/* ===================== WHY US ===================== */
.why-us{background:var(--black);}
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;margin-top:72px;}
.why-img-wrap{position:relative;}
.why-img-main{width:100%;aspect-ratio:4/5;object-fit:cover;filter:brightness(0.85);}
.why-img-badge{position:absolute;bottom:-24px;right:-24px;background:var(--blue);color:var(--white);padding:28px 32px;text-align:center;}
.badge-num{font-family:'Bebas Neue',sans-serif;font-size:52px;line-height:1;}
.badge-text{font-family:'Rajdhani',sans-serif;font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,0.8);margin-top:4px;}

.why-features{display:flex;flex-direction:column;gap:0;}
.why-feature{padding:28px 0;border-bottom:1px solid rgba(255,255,255,0.06);display:flex;gap:24px;align-items:flex-start;transition:padding-left 0.3s;cursor:default;}
.why-feature:hover{padding-left:12px;}
.feature-icon{width:44px;height:44px;flex-shrink:0;border:1px solid rgba(30,127,194,0.35);display:flex;align-items:center;justify-content:center;font-size:18px;transition:background 0.3s,border-color 0.3s;}
.why-feature:hover .feature-icon{background:var(--blue);border-color:var(--blue);}
.feature-title{font-family:'Rajdhani',sans-serif;font-size:17px;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-bottom:6px;}
.feature-desc{font-size:13px;color:var(--grey);line-height:1.6;}

/* ===================== PROCESS ===================== */
.process{background:var(--dark2);}
.process-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:72px;position:relative;}
.process-steps::before{content:'';position:absolute;top:52px;left:10%;right:10%;height:1px;background:linear-gradient(to right,transparent,var(--blue-dark),var(--blue),var(--blue-dark),transparent);z-index:0;}
.process-step{padding:0 32px 40px;text-align:center;position:relative;z-index:1;}
.step-num-wrap{width:104px;height:104px;margin:0 auto 28px;position:relative;}
.step-num-bg{position:absolute;inset:0;border:1px solid rgba(30,127,194,0.35);transform:rotate(45deg);transition:background 0.4s;}
.process-step:hover .step-num-bg{background:rgba(30,127,194,0.12);}
.step-num{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:'Bebas Neue',sans-serif;font-size:38px;color:var(--blue-light);}
.step-title{font-family:'Rajdhani',sans-serif;font-size:15px;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-bottom:12px;}
.step-desc{font-size:13px;color:var(--grey);line-height:1.7;}

/* ===================== GALLERY ===================== */
.gallery{background:var(--black);}
.gallery-header{margin-bottom:56px;}
.gallery-grid{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:260px 260px;gap:4px;}
.gallery-item{overflow:hidden;position:relative;cursor:pointer;background:var(--dark3);}
.gallery-item.tall{grid-row:span 2;}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform 0.5s ease,filter 0.5s;filter:brightness(0.75) saturate(0.85);}
.gallery-item:hover img{transform:scale(1.05);filter:brightness(0.55) saturate(1.1);}
.gallery-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity 0.3s;background:rgba(30,127,194,0.15);}
.gallery-item:hover .gallery-overlay{opacity:1;}
.gallery-overlay-text{font-family:'Rajdhani',sans-serif;font-size:12px;font-weight:700;letter-spacing:4px;text-transform:uppercase;color:var(--orange-light);text-align:center;border:1px solid rgba(245,166,35,0.5);padding:10px 18px;}

/* ===================== TESTIMONIALS ===================== */
.testimonials{background:var(--dark);}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:60px;}
.testi-card{background:var(--dark2);border:1px solid rgba(30,127,194,0.1);padding:40px 36px;position:relative;transition:border-color 0.3s,transform 0.3s;}
.testi-card:hover{border-color:rgba(30,127,194,0.35);transform:translateY(-6px);}
.testi-card::before{content:'"';font-family:'Bebas Neue',sans-serif;font-size:120px;line-height:0.7;color:rgba(30,127,194,0.07);position:absolute;top:20px;right:20px;}
.stars{color:var(--orange);font-size:14px;letter-spacing:2px;margin-bottom:18px;}
.testi-text{font-size:14px;color:var(--grey-light);line-height:1.8;margin-bottom:28px;font-style:italic;}
.testi-author{display:flex;align-items:center;gap:14px;}
.author-avatar{width:44px;height:44px;border-radius:50%;background:var(--dark3);border:2px solid rgba(30,127,194,0.4);display:flex;align-items:center;justify-content:center;font-family:'Bebas Neue',sans-serif;font-size:18px;color:var(--blue-light);}
.author-name{font-family:'Rajdhani',sans-serif;font-size:14px;font-weight:700;letter-spacing:1px;text-transform:uppercase;}
.author-car{font-size:12px;color:var(--grey);margin-top:2px;}

/* ===================== CONTACT / LOCATION ===================== */
.location-section{background:var(--black);}
.location-inner{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start;margin-top:60px;}
.location-map{width:100%;height:420px;border:0;filter:invert(0.9) hue-rotate(180deg) saturate(0.6) brightness(0.7);}
.location-info{padding-top:12px;}
.info-item{display:flex;gap:20px;align-items:flex-start;padding:20px 0;border-bottom:1px solid rgba(255,255,255,0.06);}
.info-icon{width:40px;height:40px;flex-shrink:0;background:rgba(30,127,194,0.1);border:1px solid rgba(30,127,194,0.35);display:flex;align-items:center;justify-content:center;font-size:16px;}
.info-label{font-family:'Rajdhani',sans-serif;font-size:11px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--orange);margin-bottom:4px;}
.info-value{font-size:15px;color:var(--white);}

/* ===================== CTA BANNER ===================== */
.cta-banner{padding:100px 80px;background:linear-gradient(135deg,#0C1018 0%,#111520 50%,#0C1018 100%);border-top:1px solid rgba(30,127,194,0.2);border-bottom:1px solid rgba(30,127,194,0.2);position:relative;overflow:hidden;text-align:center;}
.cta-banner::before{content:'MOTOWRAP';font-family:'Bebas Neue',sans-serif;font-size:260px;letter-spacing:10px;color:rgba(30,127,194,0.03);position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);white-space:nowrap;pointer-events:none;}
.cta-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(42px,5vw,68px);line-height:1;letter-spacing:2px;margin-bottom:20px;}
.cta-sub{font-size:15px;color:var(--grey-light);margin-bottom:44px;max-width:500px;margin-left:auto;margin-right:auto;line-height:1.7;}
.cta-phone{font-family:'Bebas Neue',sans-serif;font-size:42px;color:var(--blue-light);letter-spacing:3px;margin-bottom:36px;display:block;text-decoration:none;transition:color 0.3s;}
.cta-phone:hover{color:var(--orange);}
.cta-btn-row{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}

/* ===================== FOOTER ===================== */
.site-footer {
  background: var(--dark);
  border-top: 1px solid rgba(30,127,194,0.12);
  padding: 80px 80px 0;
}
.footer-top {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr;
  gap: 60px;
  padding-bottom: 60px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.footer-brand {}
.footer-logo-row {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 20px;
}
.footer-brand-desc {
  font-size: 14px; color: var(--grey);
  line-height: 1.8; margin-bottom: 28px;
  max-width: 300px;
}
.footer-social { display: flex; gap: 10px; }
.social-btn {
  width: 38px; height: 38px;
  border: 1px solid rgba(30,127,194,0.3);
  display: flex; align-items: center; justify-content: center;
  font-size: 15px; color: var(--grey-light);
  cursor: pointer; transition: all 0.25s;
}
.social-btn:hover { background: var(--blue); border-color: var(--blue); color: #fff; }

.footer-col-title {
  font-family: 'Rajdhani', sans-serif;
  font-size: 11px; font-weight: 700;
  letter-spacing: 4px; text-transform: uppercase;
  color: var(--orange); margin-bottom: 24px;
  display: flex; align-items: center; gap: 10px;
}
.footer-col-title::before { content: '//'; opacity: 0.5; }

.footer-links { list-style: none; display: flex; flex-direction: column; gap: 0; }
.footer-links li a {
  font-family: 'Rajdhani', sans-serif;
  font-size: 14px; font-weight: 600;
  letter-spacing: 1px; text-transform: uppercase;
  color: var(--grey-light);
  padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  display: flex; align-items: center; gap: 8px;
  transition: color 0.2s, padding-left 0.2s;
}
.footer-links li:last-child a { border-bottom: none; }
.footer-links li a:hover { color: var(--white); padding-left: 6px; }
.footer-links li a::before { content: '→'; font-size: 11px; color: var(--orange); opacity: 0.6; }

.footer-contact-item {
  display: flex; gap: 14px; align-items: flex-start;
  padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,0.04);
}
.footer-contact-item:last-child { border-bottom: none; }
.fc-icon { font-size: 16px; flex-shrink: 0; margin-top: 2px; }
.fc-label { font-family: 'Rajdhani', sans-serif; font-size: 10px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--orange); }
.fc-value { font-size: 13px; color: var(--grey-light); margin-top: 2px; line-height: 1.5; }

.footer-bottom {
  padding: 24px 0;
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 16px;
}
.footer-copyright {
  font-family: 'Rajdhani', sans-serif;
  font-size: 12px; color: var(--grey);
  letter-spacing: 1px;
}
.footer-legal {
  display: flex; gap: 24px;
}
.footer-legal a {
  font-family: 'Rajdhani', sans-serif;
  font-size: 12px; color: var(--grey);
  letter-spacing: 1px; text-transform: uppercase;
  transition: color 0.2s;
}
.footer-legal a:hover { color: var(--white); }

/* Accent bottom gradient strip */
.accent-divider {
  height: 4px;
  background: linear-gradient(90deg, var(--blue) 0%, var(--orange) 100%);
}

/* ===================== WHATSAPP BUTTON ===================== */
.whatsapp-btn {
  position: fixed; bottom: 28px; right: 28px; z-index: 9999;
  width: 58px; height: 58px; background: #25D366; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 24px rgba(37,211,102,0.4);
  animation: waPulse 2.5s ease-in-out infinite;
  cursor: pointer; text-decoration: none; transition: transform 0.3s;
}
.whatsapp-btn:hover{transform:scale(1.1);}
.whatsapp-btn svg{width:30px;height:30px;fill:white;}
@keyframes waPulse{
  0%,100%{box-shadow:0 4px 24px rgba(37,211,102,0.4),0 0 0 0 rgba(37,211,102,0.3);}
  50%{box-shadow:0 4px 24px rgba(37,211,102,0.4),0 0 0 14px rgba(37,211,102,0);}
}
.wa-tooltip{position:absolute;right:68px;top:50%;transform:translateY(-50%);background:var(--dark);border:1px solid rgba(37,211,102,0.3);color:var(--white);font-family:'Rajdhani',sans-serif;font-size:12px;font-weight:600;letter-spacing:1px;padding:8px 14px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity 0.3s;}
.wa-tooltip::after{content:'';position:absolute;right:-6px;top:50%;transform:translateY(-50%) rotate(45deg);width:10px;height:10px;background:var(--dark);border-right:1px solid rgba(37,211,102,0.3);border-top:1px solid rgba(37,211,102,0.3);}
.whatsapp-btn:hover .wa-tooltip{opacity:1;}

/* ===================== SCROLL ANIMATIONS ===================== */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.6s ease, transform 0.6s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }

/* ===================== RESPONSIVE ===================== */
@media (max-width: 1024px) {
  .site-header { padding: 0 32px; }
  .section { padding: 100px 48px; }
  .hero-content { padding-left: 48px; }
  .hero-stats { left: 48px; }
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .process-steps { grid-template-columns: repeat(2, 1fr); }
  .process-steps::before { display: none; }
  .why-grid { gap: 48px; }
  .footer-top { grid-template-columns: 1fr 1fr; gap: 40px; }
  .testi-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
  .header-nav, .header-cta { display: none; }
  .hamburger { display: flex; }
  .site-header { padding: 0 24px; }
}

@media (max-width: 768px) {
  .hero-content { padding-left: 24px; padding-right: 24px; }
  .hero-stats { left: 24px; gap: 28px; bottom: 40px; }
  .hero-car-bg { width: 100%; opacity: 0.25; right: 0; }
  .hero-scroll { display: none; }
  .section { padding: 72px 24px; }
  .services-header { flex-direction: column; gap: 20px; align-items: flex-start; }
  .services-grid { grid-template-columns: 1fr; }
  .service-card { aspect-ratio: 3/2; }
  .why-grid { grid-template-columns: 1fr; gap: 56px; }
  .why-img-badge { right: 0; bottom: -16px; }
  .process-steps { grid-template-columns: 1fr 1fr; }
  .gallery-grid { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
  .gallery-item.tall { grid-row: span 1; }
  .gallery-grid .gallery-item { min-height: 180px; }
  .testi-grid { grid-template-columns: 1fr; }
  .location-inner { grid-template-columns: 1fr; gap: 36px; }
  .cta-banner { padding: 72px 24px; }
  .hero-btns { flex-direction: column; }
  .hero-btns button { width: 100%; max-width: 320px; }
  .stat-num { font-size: 32px; }
  .footer-top { grid-template-columns: 1fr; gap: 36px; }
  .site-footer { padding: 60px 24px 0; }
  .footer-bottom { flex-direction: column; text-align: center; }
  .footer-legal { justify-content: center; }
}

@media (max-width: 480px) {
  .hero { min-height: 600px; }
  .hero-title { font-size: clamp(52px, 14vw, 80px); }
  .process-steps { grid-template-columns: 1fr; }
  .hero-stats { gap: 20px; flex-wrap: wrap; }
  .gallery-grid { grid-template-columns: 1fr; grid-template-rows: auto; }
  .services-grid { grid-template-columns: 1fr; }
  .section { padding: 60px 20px; }
  .why-img-badge { position: static; margin-top: 12px; display: inline-block; }
  .testi-grid { grid-template-columns: 1fr; }
  .site-footer { padding: 48px 20px 0; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

.site-header{
    height:80px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    overflow:visible;
}

.header-logo{
    height:80px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.header-logo-img{
    height:250px;
    width:auto;
    display:block;
    position:relative;
    top:10px; /* 15px, 20px, 25px adjust karke dekho */
}

/* Tablet */
@media (max-width:991px){
    .header-logo-img{
        height:150px;
        max-width:180px;
    }
}

/* Mobile */
@media (max-width:768px){
    .site-header{
        height:70px;
        padding:0 15px;
    }

    .header-logo{
        height:70px;
    }

    .header-logo-img{
        height:150px;
        max-width:150px;
    }
}

/* Footer Logo */

.footer-logo-row{
    display:flex;
    align-items:center;
    margin-bottom:20px;
}

.footer-logo-link{
    display:inline-block;
}

.footer-logo-img{
    display:block;
    height:350px; /* logo size */
    width:auto;
    max-width:100%;
    object-fit:contain;
}

/* Tablet */
@media (max-width:768px){
    .footer-logo-img{
        height:110px;
    }
}

/* Mobile */
@media (max-width:480px){
    .footer-logo-img{
        height:85px;
    }
}
.header-logo-img,
.footer-logo-img{
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
    transform: translateZ(0);
    backface-visibility: hidden;
}