 :root {
      --main-color: #ff6600;
      --dark-bg: #000;
      --light-bg: #f2f2f2;
    }


    .hero {
      background: url('images/slider1.jpg') center center / cover no-repeat;
      height: 90vh;
      display: flex;
      align-items: center;
      justify-content: center;
      color: white;
      text-shadow: 2px 2px 4px #000;
    }

    .btn-orange {
      background-color: var(--main-color);
      border: none;
      color: white;
    }

    .btn-orange:hover {
      background-color: #e65c00;
    }

    .service-card i {
      font-size: 48px;
      color: var(--main-color);
    }

    .service-card {
      background: white;
      border: 1px solid #ddd;
      transition: transform 0.2s ease;
    }

    .service-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    }



