body, html {
  margin: 0;
  padding: 0;
  height: 100%;
  font-family: sans-serif;
  scroll-behavior: smooth;
}
  .banner {
  	position: relative;
  	height: 100vh;
  	overflow: hidden;
  }
  .banner img {
  	position: absolute;
  	width: 100%;
  	height: 100%;
  	object-fit: cover;
  	opacity: 0;
  	transition: opacity 1s ease-in-out;
  }
  .banner img.active {
  	opacity: 1;
  }
  .banner::after {
  	content: '';
  	position: absolute;
  	top: 0;
  	left: 0;
  	width: 100%;
  	height: 100%;
  	background: rgba(0, 0, 0, 0.4);
  	z-index: 1;
  }
  .banner-content {
  	position: absolute;
  	top: 50%;
  	left: 50%;
  	transform: translate(-50%, -50%);
  	color: white;
  	text-align: center;
  	z-index: 2;
  	padding: 0 20px;
  }
  .banner-content h1 {
  	font-size: 3em;
  	margin: 0;
  }
  .banner-content p {
  	font-size: 1.2em;
  	margin: 15px 0;
  }
  .banner-content a.button {
  	display: inline-block;
  	padding: 12px 30px;
  	background: #ff6600;
  	color: white;
  	text-decoration: none;
  	border-radius: 25px;
  	font-weight: bold;
  	transition: background 0.3s;
  	font-size: 1em;
  }
  .banner-content a.button:hover {
  	background: #e05500;
  }
  /* ✅ Responsive for smaller screens */
  @media (max-width: 768px) {
  	.banner-content h1 {
  		font-size: 2em;
  	}
  	.banner-content p {
  		font-size: 1em;
  	}
  	.banner-content a.button {
  		padding: 10px 25px;
  		font-size: 0.95em;
  	}
  }
  @media (max-width: 480px) {
  	.banner-content h1 {
  		font-size: 1.5em;
  	}
  	.banner-content p {
  		font-size: 0.9em;
  	}
  	.banner-content a.button {
  		padding: 8px 20px;
  		font-size: 0.9em;
  	}
  }
  @keyframes fadeInUp {
  	0% {
  		opacity: 0;
  		transform: translateY(30px);
  	}
  	100% {
  		opacity: 1;
  		transform: translateY(0);
  	}
  }
  .animate-fadeInUp {
  	animation: fadeInUp 0.8s ease-in-out both;
  }

  /* Hide scrollbar */
  .no-scrollbar::-webkit-scrollbar {
    display: none;
  }
  .no-scrollbar {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
  }

  /* Scroll animation */
  @keyframes scrollHorizontal {
    0% {
      transform: translateX(0);
    }
    100% {
      transform: translateX(-50%);
    }
  }

  .animate-scrollHorizontal {
    animation: scrollHorizontal 20s linear infinite;
  }

  /* Pause animation on hover */
  .animate-scrollHorizontal:hover {
    animation-play-state: paused;
  }