:root{
      --green:#083f2d;
      --green-2:#0a573b;
      --green-3:#0ec46b;
      --orange:#ff7a1a;
      --orange-2:#ff9b35;
      --cream:#f7fbf4;
      --mint:#e9fff3;
      --text:#17221d;
      --muted:#64746d;
      --white:#ffffff;
      --border:rgba(8,63,45,.12);
      --shadow:0 24px 70px rgba(8,63,45,.16);
      --shadow-soft:0 14px 35px rgba(8,63,45,.10);
      --radius:26px;
    }

    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
   body {
  margin: 0;
  font-family: 'Poppins', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--text);
  background: linear-gradient(180deg, #f6fff9 0%, #ffffff 38%, #f8fbf7 100%);
  overflow-x: hidden;
}

    a{text-decoration:none;color:inherit}
    img{max-width:100%;display:block}
    .container{width:min(1180px,92%);margin-inline:auto}

    .top-strip{
      background:linear-gradient(90deg,#062817,#0a573b,#062817);
      color:#fff;
      text-align:center;
      font-size:14px;
      font-weight:800;
      letter-spacing:.2px;
      padding:12px 18px;
      position:relative;
      z-index:20;
    }
    .top-strip span{color:#ffb14a}

    .navbar{
      position:sticky;
      top:0;
      z-index:50;
      background:rgba(255,255,255,.88);
      backdrop-filter:blur(18px);
      border-bottom:1px solid var(--border);
    }
    .nav-inner{
      min-height:78px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:18px;
    }
    .brand{
      display:flex;
      align-items:center;
      gap:12px;
    }
    .logo{
      width:52px;
      height:52px;
      border-radius:16px;
      background:linear-gradient(145deg,#08a85a,#0d6a44);
      color:#fff;
      display:grid;
      place-items:center;
      font-weight:900;
      letter-spacing:-1px;
      box-shadow:0 12px 28px rgba(14,196,107,.28);
    }
    .brand h3{margin:0;font-size:19px;line-height:1.1;font-weight:900;color:#0c3124}
  .brand p {
    margin: 5px 0 0;
    font-size: 12px;
    color: var(--muted);
    font-weight: 400;
} .nav-actions{display:flex;gap:10px;align-items:center}
    .btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:9px;
      padding:15px 21px;
      border-radius:999px;
      font-size:14px;
    
      border:1px solid transparent;
      transition:.25s ease;
      cursor:pointer;
      white-space:nowrap;
    }
    .btn-primary{
      color:#fff;
      background:linear-gradient(135deg,var(--orange),var(--orange-2));
      box-shadow:0 16px 34px rgba(255,122,26,.32);
    }
    .btn-primary:hover{transform:translateY(-2px);box-shadow:0 18px 42px rgba(255,122,26,.42)}
    .btn-dark{
      color:#fff;
      background:linear-gradient(135deg,#0d4a34,#062817);
      box-shadow:0 14px 32px rgba(8,63,45,.25);
    }
    .btn-outline{
      color:var(--green);
      background:#fff;
      border-color:rgba(8,63,45,.18);
      box-shadow:0 10px 25px rgba(8,63,45,.08);
    }
    .btn-outline:hover{background:#effaf3}

.hero {
    position: relative;
    padding: 74px 0 55px;
    overflow: hidden;
    background: linear-gradient(90deg, #062817, #0a573b, #062817);
}
    .hero::before{
      content:"";
      position:absolute;
      inset:-260px -220px auto auto;
      width:560px;
      height:560px;
      border-radius:50%;
      background:radial-gradient(circle,rgba(14,196,107,.22),transparent 64%);
      pointer-events:none;
    }
    .hero::after{
      content:"";
      position:absolute;
      left:-180px;
      bottom:-220px;
      width:520px;
      height:520px;
      border-radius:50%;
      background:radial-gradient(circle,rgba(255,122,26,.13),transparent 64%);
      pointer-events:none;
    }
    .hero-grid{
      position:relative;
      z-index:1;
      display:grid;
      grid-template-columns:1.05fr .95fr;
      gap:38px;
      align-items:center;
    }
 .eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #074725;
    border: 1px solid rgba(14, 196, 107, .24);
    color: #139f52;
    border-radius: 999px;
    padding: 9px 14px;
    font-size: 13px;
    
    margin-bottom: 18px;
}
h1 {
    margin: 0;
    font-size: 40px;
    line-height: .98;
    letter-spacing: 1.2px;
    /* font-weight: 950; */
    color: #092b20;
}
    h1 span{color:var(--green-3)}
.hero-copy {
    margin: 22px 0 28px;
    font-size: 15px;
    line-height: 1.75;
    color: white;
    /* max-width: 640px; */
}
    .hero-actions{display:flex;gap:13px;flex-wrap:wrap;align-items:center}
    .micro-trust{
      margin-top:25px;
      display:flex;
      gap:12px;
      flex-wrap:wrap;
    }
    .micro-trust span{
      display:inline-flex;
      gap:7px;
      align-items:center;
      padding:10px 13px;
      border-radius:999px;
      background:#fff;
      border:1px solid var(--border);
      color:#315244;
      font-size:13px;
      font-weight:800;
      box-shadow:0 8px 22px rgba(8,63,45,.06);
    }

    .hero-card{
      position:relative;
      border-radius:34px;
      background:linear-gradient(160deg,#052416 0%,#073923 48%,#0d5e3d 100%);
      padding:26px;
      min-height:570px;
      box-shadow:var(--shadow);
      overflow:hidden;
      color:#fff;
    }
    .hero-card::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        radial-gradient(circle at 25% 20%,rgba(14,196,107,.30),transparent 28%),
        radial-gradient(circle at 86% 82%,rgba(255,122,26,.30),transparent 27%),
        linear-gradient(135deg,rgba(255,255,255,.05),transparent);
      pointer-events:none;
    }
    .car-visual{
      position:absolute;
      right:-55px;
      bottom:98px;
      width:92%;
      height:250px;
      border-radius:42px;
      background:
        linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.03)),
        linear-gradient(135deg,#eaf8ef,#9dbbb0);
      transform:skewX(-9deg);
      filter:drop-shadow(0 25px 45px rgba(0,0,0,.28));
    }
    .car-visual::before{
      content:"";
      position:absolute;
      left:60px;
      top:58px;
      width:230px;
      height:92px;
      border-radius:90px 90px 18px 18px;
      background:linear-gradient(135deg,#12392b,#061d13);
      opacity:.92;
    }
    .car-visual::after{
      content:"";
      position:absolute;
      left:64px;
      bottom:-22px;
      width:70%;
      height:44px;
      border-radius:50%;
      background:rgba(0,0,0,.22);
      filter:blur(8px);
    }
    .wheel{position:absolute;bottom:72px;width:78px;height:78px;border-radius:50%;background:#061d13;border:13px solid #fff;box-shadow:0 8px 22px rgba(0,0,0,.3)}
    .wheel.one{left:90px}.wheel.two{right:80px}
    .cylinder{
      position:absolute;
      right:34px;
      top:30px;
      width:170px;
      height:62px;
      border-radius:999px;
      background:linear-gradient(90deg,#0ec46b,#0a7d50);
      border:8px solid rgba(255,255,255,.18);
      box-shadow:0 18px 45px rgba(14,196,107,.25);
    }
    .cylinder::after{content:"CNG";position:absolute;inset:0;display:grid;place-items:center;font-size:24px;font-weight:950;letter-spacing:1px;color:#fff}
    .hero-card-content{position:relative;z-index:2;max-width:360px;padding:10px}
    .hero-card h2{font-size:38px;line-height:1.02;letter-spacing:-1.5px;margin:18px 0 15px;font-weight:950}
    .hero-card h2 span{color:#24e986}
    .hero-card p{color:rgba(255,255,255,.76);line-height:1.75;font-size:15px;margin:0 0 20px}
    .booking-box{
      position:absolute;
      left:26px;
      right:26px;
      bottom:24px;
      z-index:3;
      display:grid;
      grid-template-columns:1fr 1fr 1fr;
      gap:12px;
      padding:16px;
      background:rgba(255,255,255,.96);
      border-radius:24px;
      color:#102c22;
      box-shadow:0 20px 50px rgba(0,0,0,.22);
    }
    .booking-box div{padding:10px 8px;border-right:1px solid rgba(8,63,45,.12)}
    .booking-box div:last-child{border-right:0}
    .booking-box strong{display:block;font-size:16px;font-weight:950;color:#0d7a4a}
    .booking-box small{display:block;margin-top:5px;color:#6a7772;font-weight:700}

   .section {
    padding: 50px 0;
}
    .section-head{text-align:center;margin:0 auto 38px}
    .section-label{
      display:inline-block;
      color:#0b8e53;
      font-size:12px;
      
      letter-spacing:1.4px;
      text-transform:uppercase;
      margin-bottom:12px;
    }
.section h2 {
    margin: 0;
    font-size: 25px;
    /* line-height: 1.05; */
    letter-spacing: normal;
    color: #0c3124;
}

.section-head p {
    font-size: 15px;
    color: black;
    line-height: normal;
    margin: 8px 0px;
}
    .lead-section{
      padding:34px 0 76px;
    }
    .lead-grid{
      display:grid;
      grid-template-columns:.95fr 1.05fr;
      gap:26px;
      align-items:stretch;
    }
    .form-card{
      background:#fff;
      border-radius:32px;
      padding:30px;
      border:1px solid var(--border);
      box-shadow:var(--shadow-soft);
    }
   .form-card h2 {
    font-size: 25px;
    line-height: 1.15;
    letter-spacing: 0;
    margin: 0 0 10px;
    color: #0c3124;
}
    .form-card p {
    color: var(--muted);
    line-height: 1.65;
    margin: 0 0 22px;
    font-size: 15px;
}
    form{display:grid;gap:13px}
    .field{display:grid;gap:7px}
   label {
    font-size: 12px;
    font-weight: 600;
    color: #39564a;
    text-transform: uppercase;
    letter-spacing: .6px;
}
    input,select,textarea{
      width:100%;
      border:1px solid rgba(8,63,45,.15);
      border-radius:16px;
      padding:15px 15px;
      font:inherit;
      color:#19382d;
      background:#fbfffc;
      outline:none;
      transition:.2s;
    }
    input:focus,select:focus,textarea:focus{border-color:#10b466;box-shadow:0 0 0 4px rgba(16,180,102,.10);background:#fff}
    .privacy{font-size:13px;color:#708078;font-weight:700;text-align:center;margin-top:3px}

    .saving-card{
      position:relative;
      border-radius:32px;
      overflow:hidden;
      background:linear-gradient(145deg,#07301f,#0a6a43);
      padding:34px;
      color:#fff;
      box-shadow:var(--shadow);
      min-height:100%;
    }
    .saving-card::before{
      content:"";
      position:absolute;
      inset:0;
      background:radial-gradient(circle at top right,rgba(255,122,26,.28),transparent 35%),radial-gradient(circle at bottom left,rgba(14,196,107,.22),transparent 35%);
    }
    .saving-inner{position:relative;z-index:1}
    .saving-card h3{margin:0;font-size:36px;line-height:1.08;letter-spacing:-1px;font-weight:950}
    .saving-card p{color:rgba(255,255,255,.78);line-height:1.75;font-size:16px;max-width:550px}
    .saving-list{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:28px}
    .saving-item{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14);border-radius:20px;padding:18px;backdrop-filter:blur(10px)}
    .saving-item strong{display:block;font-size:22px;color:#27ed8a;margin-bottom:5px}
    .saving-item span{color:rgba(255,255,255,.76);font-weight:700;font-size:14px}

    .trust-bar{
      margin-top:0;
      transform:translateY(0);
    }
    .trust-grid{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:16px;
    }
    .trust-card{
      background:#fff;
      border:1px solid var(--border);
      border-radius:24px;
      padding:24px;
      box-shadow:0 12px 30px rgba(8,63,45,.08);
      min-height:170px;
    }
    .icon{
      width:50px;height:50px;border-radius:16px;display:grid;place-items:center;background:#ecfff4;color:#0b8e53;font-size:24px;margin-bottom:16px;
    }
    .trust-card h3,.service-card h3,.step h3{margin:0 0 9px;color:#102f24;font-size:20px;}
    .trust-card p,.service-card p,.step p{margin:0;color:var(--muted);line-height:1.55;font-size:15px}

  .services {
    background: #e6f7ef;
}
    .service-grid{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:18px;
    }
    .service-card{
      position:relative;
      background:#fff;
      border:1px solid var(--border);
      border-radius:26px;
      padding:26px;
      overflow:hidden;
      min-height:250px;
      box-shadow:0 16px 36px rgba(8,63,45,.08);
      transition:.25s ease;
    }
    .service-card:hover{transform:translateY(-6px);box-shadow:0 24px 55px rgba(8,63,45,.13)}
    .service-card::after{
      content:"";
      position:absolute;
      right:-40px;
      bottom:-50px;
      width:130px;
      height:130px;
      border-radius:50%;
      background:rgba(14,196,107,.08);
    }
    .service-card .icon{background:linear-gradient(135deg,#ecfff4,#fff1e6);color:#ff7a1a}

    .stats-wrap{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:26px;
      align-items:center;
    }
    .stats-card{
      background:linear-gradient(145deg,#061f15,#0a5036);
      border-radius:34px;
      padding:26px;
      color:#fff;
      box-shadow:var(--shadow);
    }
    .stats-grid{
      display:grid;
      grid-template-columns:repeat(2,1fr);
      gap:14px;
    }
    .stat{
      background:rgba(255,255,255,.09);
      border:1px solid rgba(255,255,255,.14);
      border-radius:24px;
      padding:32px 22px;
      min-height:155px;
      display:flex;
      flex-direction:column;
      justify-content:center;
    }
    .stat strong {
    font-size: 25px;
    letter-spacing: -1.8px;
    color: #24e986;
    /* font-weight: 950; */
    line-height: 1;
}
.stat span {
    margin-top: 12px;
    color: rgba(255, 255, 255, .72);
    font-weight: normal;
}
    .stats-copy h2{text-align:left}
    .stats-copy p
    {
      text-align:left;   font-size: 15px;
    color: black;
    line-height: normal;
    margin: 8px 0px;
    }

   .process {
    background: #e6f7ef;
}
    .steps{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:18px;
      counter-reset:steps;
    }
    .step{
      counter-increment:steps;
      position:relative;
      padding:28px;
      background:linear-gradient(180deg,#fff,#f7fff9);
      border:1px solid var(--border);
      border-radius:26px;
      box-shadow:0 14px 34px rgba(8,63,45,.08);
  
    }
    .step::before{
      content:"0"counter(steps);
      display:inline-grid;
      place-items:center;
      width:50px;
      height:50px;
      border-radius:16px;
      background:linear-gradient(135deg,var(--green-3),#08864e);
      color:#fff;
      font-weight:950;
      margin-bottom:22px;
      box-shadow:0 14px 25px rgba(14,196,107,.25);
    }

   .reviews {
    background: white;
}
    .review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .review-card{
      background:#fff;
      border:1px solid var(--border);
      border-radius:28px;
      padding:28px;

    }
    .stars{color:#ffc107;font-size:20px;letter-spacing:2px;margin-bottom:18px}
    .review-card p{color:#43564f;line-height:1.75;margin:0 0 22px;font-size:15px}
    .person{display:flex;align-items:center;gap:12px}
    .avatar{width:44px;height:44px;border-radius:50%;background:#ecfff4;color:#0d7a4a;display:grid;place-items:center;font-weight:950}
    .person strong{display:block;font-size:14px;color:#102f24}
    .person span{display:block;margin-top:2px;font-size:12px;color:#718078;font-weight:700}

    .faq-grid{
      max-width:920px;
      margin:0 auto;
      display:grid;
      gap:12px;
    }
    details{
      background:#fff;
      border:1px solid var(--border);
      border-radius:20px;
      padding:0;
      box-shadow:0 10px 25px rgba(8,63,45,.06);
      overflow:hidden;
    }
summary {
    list-style: none;
    cursor: pointer;
    padding: 21px 24px;
    color: #102f24;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    font-weight: 700;
}
    summary::-webkit-details-marker{display:none}
    summary::after{content:"+";font-size:22px;color:#0b8e53}
    details[open] summary::after{content:"−"}
    details p {
    padding: 0 24px 22px;
    margin: 0;
    color: black;
    line-height: 1.65;
}

    .map-cta{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:24px;
      align-items:stretch;
    }
    .map-card,.final-cta{
      border-radius:32px;
      overflow:hidden;
      box-shadow:var(--shadow-soft);
      border:1px solid var(--border);
      background:#fff;
    }
    .map-placeholder{
      min-height:380px;
      background:
        linear-gradient(135deg,rgba(8,63,45,.88),rgba(7,85,54,.76)),
        repeating-linear-gradient(45deg,rgba(255,255,255,.08) 0 2px,transparent 2px 18px);
      color:#fff;
      display:grid;
      place-items:center;
      text-align:center;
      padding:34px;
    }
   .map-placeholder h3 {
    font-size: 25px;
    line-height: normal;
    margin: 0;
    /* font-weight: 950; */
}
   .map-placeholder p {
  
    font-size: 15px;
    color: white;
    line-height: normal;
    margin: 8px 0px 18px;
}
    .final-cta{
      background:linear-gradient(145deg,#062817,#0c5b3d);
      color:#fff;
      padding:42px;
      display:flex;
      flex-direction:column;
      justify-content:center;
      position:relative;
      overflow:hidden;
    }
    .final-cta::after{content:"";position:absolute;right:-120px;bottom:-130px;width:330px;height:330px;border-radius:50%;background:rgba(255,122,26,.22)}
    .final-cta > *{position:relative;z-index:1}
    .final-cta h2 {
    color: #fff;
    font-size: 25px;
    line-height: normal;
    margin: 0;
}
    .final-cta p{  font-size: 15px;
    color: white;
    line-height: normal;
    margin: 8px 0px 18px;}

  footer {
    padding: 20px 0 20px;
    background: #061f15;
    color: #fff;
}
    .footer-grid{
      display:grid;
      grid-template-columns:1.2fr .8fr .8fr;
      gap:30px;
    }
footer h3 {
    margin: 0;
    font-size: 25px;
    font-weight: 200;
}
    footer p,footer li{color:white;line-height:1.8;font-size:14px}
    footer ul{list-style:none;margin:0;padding:0}
    .copyright {
    border-top: 1px solid rgba(255, 255, 255, .10);
    margin-top: 28px;
    padding-top: 20px;
    color: white;
    font-size: 13px;
}
    .floating-call{
      position:fixed;
      right:22px;
      bottom:22px;
      z-index:60;
      display:flex;
      align-items:center;
      gap:10px;
      background:linear-gradient(135deg,var(--orange),var(--orange-2));
      color:#fff;
      padding:16px 20px;
      border-radius:999px;
    
      box-shadow:0 18px 45px rgba(255,122,26,.42);
    }

    @media(max-width:980px){
      .hero-grid,.lead-grid,.stats-wrap,.map-cta{grid-template-columns:1fr}
      .trust-grid,.service-grid,.steps{grid-template-columns:repeat(2,1fr)}
      .review-grid{grid-template-columns:1fr}
      .hero-card{min-height:520px}
     
      .footer-grid{grid-template-columns:1fr}
    }
    @media(max-width:640px){
      .top-strip{font-size:12px;line-height:1.5}
      .nav-inner{min-height:72px}
         .logo {
        width: 52px;
        height: 40px;
        border-radius: 14px;
        font-weight: 100;
    }
        .brand h3 {
        font-size: 14px;
    }
        .nav-actions .btn-primary {
        padding: 13px 15px;
        font-size: 13px;
        display: none;
    }
        .hero {
        padding: 30px 0 30px;
    }
       .hero-copy {
        font-size: 14px;
        text-align: center;
        line-height: normal;
    }
      .hero-actions .btn{width:100%}
      .hero-card{min-height:560px;padding:20px;border-radius:28px}
      .hero-card h2{font-size:32px}
      .booking-box{grid-template-columns:1fr;left:18px;right:18px;bottom:18px}
      .booking-box div{border-right:0;border-bottom:1px solid rgba(8,63,45,.12)}
      .booking-box div:last-child{border-bottom:0}
      .car-visual{width:110%;right:-110px;bottom:188px;height:205px}
      .wheel{bottom:174px;width:60px;height:60px;border-width:10px}.wheel.one{left:58px}.wheel.two{right:42px}
      .cylinder{right:20px;top:20px;width:135px;height:52px}
         .section {
        padding: 30px 0;
    }
      .trust-grid,.service-grid,.steps,.saving-list,.stats-grid{grid-template-columns:1fr}
      .form-card,.saving-card{padding:24px;border-radius:26px}
      .stat{min-height:128px}.stat strong{font-size:38px}
      .floating-call{left:16px;right:16px;justify-content:center;bottom:16px}
    }
    .container.hero-grid h1 {
    color: white;
}
.faqs {
    background: #e6f7ef;
}


.process-premium {
  padding: 90px 0;
  background:
    radial-gradient(circle at top left, rgba(14, 196, 107, 0.14), transparent 32%),
    linear-gradient(180deg, #ffffff 0%, #f2fbf6 100%);
  position: relative;
  overflow: hidden;
}

.process-premium::before {
  content: "";
  position: absolute;
  right: -180px;
  top: 60px;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 122, 26, 0.15), transparent 65%);
}

.process-head {
  max-width: 760px;
  margin: 0 auto 50px;
  text-align: center;
  position: relative;
  z-index: 2;
}

.section-label {
  display: inline-block;
  color: #0b8e53;
  font-size: 12px;
  
  letter-spacing: 1.4px;
  text-transform: uppercase;
  margin-bottom: 12px;
}

.process-head h2 {
    margin: 0;
    color: #092b20;
    font-size: 25px;
}
.process-head p {
      font-size: 15px;
    color: black;
    line-height: normal;
    margin: 8px 0px;
}
.process-premium-grid {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 42px;
  align-items: center;
  position: relative;
  z-index: 2;
}
.process-timeline {
  position: relative;
  display: grid;
  gap: 18px;
}

.process-timeline::before {
  content: "";
  position: absolute;
  left: 31px;
  top: 32px;
  bottom: 32px;
  width: 2px;
  background: linear-gradient(180deg, #0ec46b, rgba(14, 196, 107, 0.08));
}

.process-step {
  position: relative;
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 18px;
  align-items: stretch;
}

.step-number {
  width: 64px;
  height: 64px;
  border-radius: 20px;
  background: #ffffff;
  border: 1px solid rgba(8, 63, 45, 0.12);
  display: grid;
  place-items: center;
  color: #0b8e53;
  
  font-size: 17px;
  box-shadow: 0 14px 34px rgba(8, 63, 45, 0.10);
  position: relative;
  z-index: 2;
}

.process-step.active .step-number {
  background: linear-gradient(135deg, #0ec46b, #087f4d);
  color: #ffffff;
  box-shadow: 0 18px 38px rgba(14, 196, 107, 0.32);
}

.step-content {
  background: rgba(255, 255, 255, 0.86);
  border: 1px solid rgba(8, 63, 45, 0.10);
  border-radius: 24px;
  padding: 22px 24px;
  box-shadow: 0 16px 42px rgba(8, 63, 45, 0.08);
  transition: 0.25s ease;
}

.step-content:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 55px rgba(8, 63, 45, 0.13);
}

.step-content span {
  display: inline-block;
  font-size: 12px;
  color: #ff7a1a;
  
  text-transform: uppercase;
  letter-spacing: 0.8px;
  margin-bottom: 7px;
}

.step-content h3 {
  margin: 0 0 8px;
  font-size: 20px;
  color: #102f24;
  
}

.step-content p {
    font-size: 15px;
    color: black;
    line-height: normal;
    margin: 8px 0px;
}

.process-phone-wrap {
  display: flex;
  justify-content: center;
}

.phone-card {
  width: min(100%, 390px);
  border-radius: 38px;
  padding: 14px;
  background: linear-gradient(145deg, #061f15, #0b573a);
  box-shadow: 0 28px 75px rgba(8, 63, 45, 0.28);
  position: relative;
}

.phone-card::before {
  content: "";
  position: absolute;
  inset: -18px;
  border-radius: 46px;
  background: linear-gradient(135deg, rgba(14, 196, 107, 0.18), rgba(255, 122, 26, 0.14));
  z-index: -1;
  filter: blur(10px);
}

.phone-top {
  height: 42px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 18px;
}

.phone-top span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.35);
}

.phone-screen {
  min-height: 500px;
  border-radius: 28px;
  padding: 28px;
  background:
    radial-gradient(circle at top right, rgba(14, 196, 107, 0.18), transparent 35%),
    linear-gradient(180deg, #ffffff 0%, #f2fff7 100%);
}

.phone-badge {
  display: inline-flex;
  padding: 8px 12px;
  border-radius: 999px;
  background: #e9fff3;
  color: #0b8e53;
  font-size: 12px;
  
  margin-bottom: 18px;
}

.phone-screen h3 {
  margin: 0;
  font-size: 25px;
  
  color: #092b20;
  
}

.phone-screen p {
     font-size: 15px;
    color: black;
    line-height: normal;
    margin: 8px 0px;
}

.mini-steps {
  display: grid;
  gap: 13px;
  margin-bottom: 24px;
}

.mini-steps div {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
  background: #ffffff;
  border: 1px solid rgba(8, 63, 45, 0.10);
  box-shadow: 0 10px 24px rgba(8, 63, 45, 0.06);
}

.mini-steps b {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: linear-gradient(135deg, #0ec46b, #087f4d);
  color: #ffffff;
  display: grid;
  place-items: center;
  font-size: 14px;
}

.mini-steps span {
  font-size: 14px;
  color: #263c33;
  font-weight: 800;
}

.process-btn {
  width: 100%;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 16px 20px;
  border-radius: 999px;
  background: linear-gradient(135deg, #ff7a1a, #ff9b35);
  color: #ffffff;
  font-size: 15px;
  
  box-shadow: 0 16px 34px rgba(255, 122, 26, 0.32);
}

@media (max-width: 900px) {
  .process-premium-grid {
    grid-template-columns: 1fr;
  }

  .process-phone-wrap {
    order: -1;
  }
}

@media (max-width: 600px) {
     .process-premium {
        padding: 30px 0 !important;
    }
  .process-premium-grid {
    gap: 30px;
  }

  .process-step {
    grid-template-columns: 54px 1fr;
    gap: 14px;
  }

  .process-timeline::before {
    left: 26px;
  }

  .step-number {
    width: 54px;
    height: 54px;
    border-radius: 17px;
    font-size: 15px;
  }

  .step-content {
    padding: 19px;
    border-radius: 20px;
  }

  .phone-screen {
    min-height: auto;
    padding: 24px;
  }

    .phone-screen h3 {
        font-size: 20px;
    }
}
section#how-it-works {
    background: #e6f7ef;
    padding-top: 50px;
    padding-bottom: 50px;
}


@media only screen and (max-width:767px)
{

  .step-content h3 {

    font-size: 15px;
}
details p {
    line-height: normal;
    font-size: 15px;
}


    h1 {
        font-size: 20px;
        line-height: normal;
    }
.eyebrow {
    margin: 0 auto;
    display: block;
    text-align: center;
    margin-bottom: 18px;
    width: max-content;
}
.container.hero-grid h1 {
     text-align: center;
}
    .micro-trust span {
        padding: 7px 5px;
        font-size: 9px;
        font-weight: normal;
        font-size: 10px;
    }
.micro-trust {
    margin-top: 13px;
    gap: 3px;
}
.hero-copy {
    margin: 15px 0 15px;
    font-size: 15px;
   
    /* max-width: 640px; */
}
input, select, textarea { 
    padding: 8px 15px;
    font-size: 13px;
}
.nav-actions a {
    padding: 7px 10px;
}
.form-card h2 {
        font-size: 20px;
    }
.brand p {
    font-size: 9px;
}
    .form-card p {
        line-height: normal;
        font-size: 15px;
    }
.section h2 {
    font-size: 20px;
    line-height: normal;
}
.service-card {
  min-height: auto;
}
.map-placeholder h3 {
    font-size: 20px;
    line-height: normal;
}
.map-placeholder {
    min-height: auto;
}
.final-cta {
    padding: 19px;
}
.footer-grid {
    gap: 6px;
}

.hero-actions .btn-primary {
    display: none;
}

}

.trust-strip-section {
  padding: 70px 0;
  background: #ffffff;
}

.trust-strip-card {
  margin: 0 auto;
  background: #e9f8ef;
  border-radius: 0;
  overflow: hidden;
  box-shadow: 0 18px 45px rgba(8, 63, 45, 0.10);
}

.trust-top-bar,
.trust-bottom-bar {
  height: 62px;
  background: linear-gradient(90deg, #052817 0%, #0a4b31 50%, #052817 100%);
}

.trust-bottom-bar {
  height: 7px;
  background: #00a85a;
}

.trust-strip-content {
  padding: 44px 58px 40px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 60px;
  row-gap: 38px;
  align-items: center;
}

.trust-item {
    display: flex;
    gap: 18px;
    justify-content: center;
}

.trust-center {
  grid-column: 1 / -1;
  justify-content: center;
  max-width: 360px;
  margin: 0 auto;
}

.trust-emoji {
  font-size: 31px;
  line-height: 1;
  min-width: 40px;
  text-align: center;
}

.trust-item h3 {
  margin: 0 0 8px;
  font-family: 'Poppins', sans-serif;
  font-size: 25px;
  line-height: 1.1;
  color: #0d2018;
}

.trust-item p {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  font-size: 15px;
  line-height: 1.45;
  color: #6b7f73;
  font-weight: 400;
}
@media (max-width: 768px) {
  .trust-strip-section {
    padding: 45px 0;
    background: #ffffff;
  }

  .trust-strip-card {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    border-radius: 0;
  }

  .trust-top-bar {
    height: 45px;
  }

  .trust-bottom-bar {
    height: 6px;
  }
    .trust-strip-content {
        padding: 14px;
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 18px;
        row-gap: 17px;
        align-items: center;
    }
  .trust-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
  }

  .trust-center {
    grid-column: 1 / -1;
    justify-content: center;
    max-width: 280px;
    margin: 0 auto;
  }

  .trust-emoji {
    font-size: 24px;
    min-width: 28px;
  }

     .trust-item h3 {
        font-size: 15px;
        line-height: 1.15;
        margin: 0 0 5px;
        font-weight: 800;
    }
.trust-card h3, .service-card h3, .step h3 {

    font-size: 15px;
}
  .trust-item p {
    font-size: 13px;
    line-height: 1.4;
    margin: 0;
  }
}
.review-carousel .owl-stage {
  display: flex;
}

.review-carousel .owl-item {
  display: flex;
}

.review-carousel .review-card {
  height: 100%;
  width: 100%;
}

.review-carousel .owl-dots {
  margin-top: 28px !important;
}

.review-carousel .owl-dot span {
  width: 10px !important;
  height: 10px !important;
  background: rgba(8, 63, 45, 0.22) !important;
}

.review-carousel .owl-dot.active span {
  width: 28px !important;
  background: #0ec46b !important;
}

.review-carousel .owl-nav {
  margin-top: 24px;
}

.review-carousel .owl-nav button {
  width: 46px;
  height: 46px;
  border-radius: 50% !important;
  background: #ffffff !important;
  color: #083f2d !important;
  border: 1px solid rgba(8, 63, 45, 0.12) !important;
  box-shadow: 0 12px 28px rgba(8, 63, 45, 0.10);
  font-size: 28px !important;
  line-height: 1 !important;
}

.review-carousel .owl-nav button:hover {
  background: linear-gradient(135deg,var(--orange),var(--orange-2)) !important;
  color: #ffffff !important;
}
.compact-footer {
    padding: 0px 0px 0px;
    background: #ffffff;
    display: flex;
    justify-content: center;
}
.compact-footer-card {
  width: 100%;
  background:
    radial-gradient(circle at top left, rgba(14, 196, 107, 0.22), transparent 34%),
    radial-gradient(circle at bottom right, rgba(255, 122, 26, 0.18), transparent 36%),
    linear-gradient(180deg, #062817 0%, #041b11 100%);
  border-radius: 0;
  overflow: hidden;
  color: #ffffff;
  box-shadow: 0 22px 55px rgba(8, 63, 45, 0.22);
}

.footer-cta {
  padding: 34px 26px 28px;
  text-align: center;
}

.footer-cta h2 {
    margin: 0 0 14px;
    /* font-family: 'Poppins', sans-serif; */
    font-size: 24px;
    line-height: 1.12;
    /* font-weight: 900; */
    text-transform: uppercase;
    /* letter-spacing: 0.3px; */
    color: #ffffff;
}

.footer-cta h2 span {
  color: #22e983;
}

.footer-cta p {
 
  margin: 0 auto 22px;
  font-family: 'Poppins', sans-serif;
  font-size: 12px;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.72);
}

.footer-buttons {
  display: grid;
  gap: 10px;
  justify-content: center;
}

.footer-main-btn,
.footer-whatsapp-btn {
  min-width: 250px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 18px;
  border-radius: 8px;
  font-family: 'Poppins', sans-serif;
  font-size: 13px;
  text-decoration: none;
  transition: 0.25s ease;
}

.footer-main-btn {
  background: linear-gradient(135deg, #ff7a1a, #ff9b35);
  color: #ffffff;
  box-shadow: 0 12px 28px rgba(255, 122, 26, 0.32);
}

.footer-whatsapp-btn {
  background: #0ec46b;
  color: #ffffff;
  box-shadow: 0 12px 28px rgba(14, 196, 107, 0.25);
}

.footer-main-btn:hover,
.footer-whatsapp-btn:hover {
  transform: translateY(-2px);
}

.footer-info {
  padding: 16px 22px 18px;
  background: rgba(0, 0, 0, 0.18);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  text-align: center;
}

.footer-info p {
  margin: 0 0 10px;
  font-family: 'Poppins', sans-serif;
  font-size: 10px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.62);
}

.footer-details {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 6px 12px;
}

.footer-details span {
  font-family: 'Poppins', sans-serif;
  font-size: 10px;
  color: rgba(255, 255, 255, 0.68);
  white-space: nowrap;
}

@media (max-width: 480px) {

  .compact-footer-card {
    max-width: 100%;
  }

  .footer-cta {
    padding: 30px 20px 24px;
  }
    .footer-cta h2 {
        font-size: 20px;
    }
  .footer-main-btn,
  .footer-whatsapp-btn {
    min-width: 100%;
  }
}
@media (max-width: 600px) {
  .carsfitted .stats-wrap {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .carsfitted .stats-copy {
    text-align: center !important;
  }

  .carsfitted .stats-copy h2,
  .carsfitted .stats-copy p {
    text-align: center !important;
  }

  .carsfitted .stats-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px;
  }

  .carsfitted .stats-card {
    padding: 18px;
    border-radius: 26px;
  }

  .carsfitted .stat {
    min-height: 120px;
    padding: 22px 12px;
    text-align: center;
    border-radius: 20px;
  }

     .carsfitted .stat strong {
        font-size: 20px;
        line-height: 1;
        letter-spacing: 0;
    }

  .carsfitted .stat span {
    font-size: 12px;
    margin-top: 8px;
  }
  .process-head h2 {
    font-size: 20px;
}
}