* { margin: 0; padding: 0; box-sizing: border-box; }
    body { font-family: 'Outfit', sans-serif; background-color: #f8fafc; color: #334155; }
    a { text-decoration: none; color: inherit; }
    .container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
    img { max-width: 100%; height: auto; display: block; }
    
    .containerfooter {
      text-align: center;
      padding: 20px 0;
    }

   .footer-logo {
      max-width: 160px;
      width: 100%;
      height: auto;
      display: block;
      margin: 0 auto 20px auto;
    }

    /* Spacing & Typography */
    .section-padding { padding: 80px 0; }
    .section-header { text-align: center; margin-bottom: 50px; }
    .section-header h2 { font-size: 2.75rem; color: #1e293b; margin-bottom: 16px; font-weight: 700; }
    .section-header p { color: #64748b; font-size: 1.125rem; max-width: 760px; margin: 0 auto; line-height: 1.6; }

    /* Grids */
    .grid-4 { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 30px; }
    .grid-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 30px; }
    .grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap: 40px; }
    
    /* Header */
    .site-header { position: absolute; top: 0; width: 100%; z-index: 100; padding: 20px 0; background: linear-gradient(to bottom, rgba(0,0,0,0.7), transparent); color: white; }
    .header-inner { display: flex; justify-content: space-between; align-items: center; max-width: 1200px; margin: 0 auto; padding: 0 20px; }
    .logo-text { font-size: 1.5rem; font-weight: 800; color: #fff; letter-spacing: 1px; display: flex; align-items: center; gap: 10px; }
    .logo-text img { max-height: 60px; width: auto; }
    .logo-text span { color: #95C11F; }
    .nav { display: flex; gap: 30px; font-weight: 500; }
    .nav a:hover { color: #95C11F; }

    /* Hero Section */
    .hero { position: relative; height: 85vh; min-height: 650px; display: flex; align-items: center; justify-content: center; overflow: hidden; background: #1e293b; }
    .hero-background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
    .hero-gradient { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(15, 23, 42, 0.4), rgba(15, 23, 42, 0.8)); z-index: 2; }
    .hero-slideshow { width: 100%; height: 100%; }
    .slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 1s ease; }
    .slide.active { opacity: 1; }
    .slide img { width: 100%; height: 100%; object-fit: cover; }
    
    /* Sleek Slideshow Navigation */
    .slideshow-nav {
      position: absolute;
      bottom: 40px;
      left: 50%;
      transform: translateX(-50%);
      display: flex;
      gap: 8px;
      z-index: 10;
    }
    .slideshow-dot {
      width: 8px;
      height: 8px;
      border-radius: 4px;
      background: rgba(255, 255, 255, 0.4);
      border: none;
      cursor: pointer;
      transition: all 0.3s ease;
      padding: 0;
    }
    .slideshow-dot.active {
      width: 28px;
      background: #95C11F;
      box-shadow: 0 0 12px rgba(149, 193, 31, 0.4);
    }
    .slideshow-arrows {
      position: absolute;
      top: 50%;
      width: 100%;
      display: flex;
      justify-content: space-between;
      padding: 0 30px;
      transform: translateY(-50%);
      z-index: 10;
      pointer-events: none;
    }
    .slideshow-arrow {
      pointer-events: auto;
      width: 44px;
      height: 44px;
      border-radius: 50%;
      background: rgba(0, 0, 0, 0.25);
      backdrop-filter: blur(6px);
      -webkit-backdrop-filter: blur(6px);
      border: 1px solid rgba(255, 255, 255, 0.2);
      color: white;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all 0.3s ease;
    }
    .slideshow-arrow svg { width: 22px; height: 22px; }
    .slideshow-arrow:hover { background: #95C11F; border-color: #95C11F; transform: scale(1.05); }

    /* Hero Content & Travel Search Box */
    .hero-content { position: relative; z-index: 5; text-align: center; color: white; width: 100%; padding: 0 20px; margin-top: -30px; }
    .hero-content h1 { font-size: 3.5rem; margin-bottom: 20px; font-weight: 800; text-shadow: 0 2px 10px rgba(0,0,0,0.3); }
    .hero-content p { font-size: 1.25rem; margin-bottom: 40px; text-shadow: 0 2px 10px rgba(0,0,0,0.3); max-width: 800px; margin-left: auto; margin-right: auto; }

    /* Professional "MakeMyTrip" Style Search Widget */
    .search-widget {
      background: white;
      padding: 10px;
      border-radius: 12px;
      display: flex;
      gap: 10px;
      max-width: 1000px;
      margin: 0 auto;
      box-shadow: 0 20px 40px rgba(0,0,0,0.2);
      flex-wrap: wrap;
      align-items: stretch;
    }
    .search-input-group {
      flex: 1;
      min-width: 150px;
      display: flex;
      flex-direction: column;
      text-align: left;
      padding: 10px 15px;
      border-right: 1px solid #e2e8f0;
    }
    .search-input-group:last-of-type { border-right: none; }
    .search-label { font-size: 0.85rem; font-weight: 600; color: #64748b; margin-bottom: 4px; text-transform: uppercase; letter-spacing: 0.5px; }
    .search-input { border: none; font-family: 'Outfit', sans-serif; font-size: 1.25rem; font-weight: 700; color: #1e293b; outline: none; width: 100%; background: transparent; }
    .search-input::placeholder { color: #94a3b8; font-weight: 500; } 
    .search-subtext { font-size: 0.8rem; color: #94a3b8; margin-top: 2px; }
    
    .btn-search {
      background: #95C11F;
      color: white;
      border: none;
      padding: 18px 40px;
      border-radius: 8px;
      font-size: 1.125rem;
      font-weight: 700;
      font-family: 'Outfit', sans-serif;
      cursor: pointer;
      transition: background 0.3s;
      height: auto;
    }
    .btn-search:hover { background: #7a9e18; }

    /* Cards Base */
    .content-card {
      background: #ffffff;
      border-radius: 24px;
      padding: 32px;
      border: 1px solid rgba(0, 0, 0, 0.05);
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
      transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .content-card:hover { transform: translateY(-10px); box-shadow: 0 30px 60px rgba(149, 193, 31, 0.15); border-color: rgba(149, 193, 31, 0.3); }
    .content-card h3 { font-size: 1.6rem; color: #0f172a; margin-bottom: 16px; font-weight: 700; letter-spacing: -0.02em; }
    .content-card p { color: #475569; line-height: 1.6; margin-bottom: 0; font-size: 1.05rem; }
    
    .service-card { border-bottom: 4px solid transparent; text-align: center; }
    .service-card:hover { border-bottom-color: #95C11F; }
    .project-card { position: relative; overflow: hidden; }
    .project-card::before { content: ''; position: absolute; top: 0; left: 0; width: 6px; height: 100%; background: linear-gradient(180deg, #95C11F 0%, #638515 100%); }
    .project-card strong { color: #1e293b; font-weight: 700; }
    .feature-card { background: #ffffff; border-top: 4px solid #95C11F; }

    /* Tag Pills */
    .tags { display: flex; gap: 8px; margin-top: 15px; flex-wrap: wrap; justify-content: center; }
    .project-card .tags, .feature-card .tags { justify-content: flex-start; }
    .tag { font-size: 0.75rem; font-weight: 600; padding: 4px 10px; border-radius: 99px; background: #f1f5f9; color: #475569; }
    .tag.highlight { background: rgba(149, 193, 31, 0.1); color: #7a9e18; }

    /* Final CTA */
    .final-cta { background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%); color: #fff; text-align: center; }
    .final-cta h2 { color: #fff; margin-bottom: 30px; }
    .btn-primary { background: #95C11F; color: white; padding: 14px 28px; border-radius: 9999px; font-weight: 600; text-decoration: none; transition: background 0.3s; display: inline-flex; align-items: center; gap: 8px; border: none; }
    .btn-primary:hover { background: #7a9e18; }
    
    footer { background: #0f172a; color: #94a3b8; font-size: 0.9rem; }

    /* ========================================= */
    /* MOBILE RESPONSIVE MEDIA QUERIES           */
    /* ========================================= */
    @media (max-width: 768px) {
      /* Header & Nav */
      .header-inner { flex-direction: column; gap: 10px; padding: 15px 20px; }
      .nav { flex-wrap: wrap; justify-content: center; gap: 10px 15px; font-size: 0.9rem; }
      
      /* Hero Container Fixes */
      .hero { 
        height: auto; 
        min-height: 100vh; 
        padding-top: 140px; 
        padding-bottom: 80px; 
        align-items: flex-start; 
      }
      .hero-content { margin-top: 0; }
      .hero-content h1 { font-size: 2.25rem; margin-bottom: 10px; line-height: 1.2; }
      .hero-content p { font-size: 1rem; margin-bottom: 25px; }
      
      .search-widget { 
        display: flex; 
        flex-direction: column; 
        padding: 15px; 
        gap: 0; 
      }
      .search-input-group { 
        border-right: none; 
        border-bottom: 1px solid #e2e8f0; 
        width: 100%; 
        padding: 12px 5px; 
      }
      .search-input-group:last-of-type { border-bottom: none; border-right: none; }
      .search-input { font-size: 1.15rem; }
      
      .btn-search { 
        width: 100%; 
        margin-top: 15px; 
        padding: 15px; 
        font-size: 1.1rem;
      }

      /* Sections & Headings */
      .section-padding { padding: 50px 0; }
      .section-header { margin-bottom: 35px; }
      .section-header h2 { font-size: 2rem; }
      .section-header p { font-size: 1rem; }

      /* Slideshow Controls */
      .slideshow-arrows { padding: 0 10px; }
      .slideshow-arrow { width: 36px; height: 36px; }
    }