/* Import Fonts */
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&family=Fredoka+One&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Manrope:wght@400;500;600&family=Dancing+Script:wght@500&display=swap");

html {
  scroll-behavior: smooth;
}

/* Importing Fonts */

/* Global Font Setup */
body {
  font-family: "Manrope", sans-serif;
  font-weight: 500;
  color: #222;
  background-color: #fdfdfd;
  line-height: 1.7;
  letter-spacing: 0.3px;
  transition: color 0.3s ease, background 0.3s ease;
}

/* Headings */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Bebas Neue", sans-serif;
  font-weight: 600;
  color: #1c1c1c;
  letter-spacing: 1px;
  text-transform: uppercase;
  line-height: 1.1;
  transition: color 0.3s ease;
}

/* Heading hover accent */
h1:hover,
h2:hover,
h3:hover {
  color: #00b894;
  /* Subtle organic accent */
}

/* Paragraphs, Links, Lists */
p,
a,
li,
span {
  font-family: "Manrope", sans-serif;
  font-weight: 400;
  color: #333;
}

/* Highlighted quotes or taglines */
blockquote,
.tagline {
  font-family: "Dancing Script", cursive;
  font-size: 1.5rem;
  color: #2d3436;
  text-align: center;
  margin: 30px 0;
  opacity: 0.9;
}

/* Link Styling */
a {
  text-decoration: none;
  color: #00695c;
  transition: color 0.3s ease;
}

a:hover {
  color: #00b894;
}

/* Responsive Typography */
@media (max-width: 768px) {
  h1 {
    font-size: 2rem;
  }

  h2 {
    font-size: 1.6rem;
  }

  p {
    font-size: 1rem;
  }
}
.agri-heading {
  font-family: "Fredoka One", cursive;
  font-weight: 500; /* softer than bold */
  font-size: 2.2rem;
  letter-spacing: 1.2px;
  color: #145a32; /* fallback color */
  text-transform: none;
  transition: all 0.5s ease-in-out;
  display: inline-block; /* required for gradient clip */
}

/* Gradient hover effect with full compatibility */
.agri-heading:hover {
  background: linear-gradient(90deg, #04382e, #7a67ce, #1fa187);
  background-clip: text; /* Standard property */
  -webkit-background-clip: text; /* Chrome, Safari */
  color: transparent;
  -webkit-text-fill-color: transparent; /* Needed for Safari/WebKit */
  transform: translateY(-2px);
}

/* Navbar */
.navbar {
  background: #c4e3cb;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.navbar .webT {
  font-size: 22px;
  color: #2b3a33;
  font-family: "Fredoka One", cursive;
  font-weight: 500;
  letter-spacing: 1px;
}

.navbar-nav li a {
  color: #2e473b !important;
  transition: 0.3s ease;
  font-weight: 500;
}

.navbar-nav li a:hover {
  color: #000 !important;
  transform: scale(1.05);
}

/* Slider */
/* .carousel-item {
	position: relative;
	height: 500px;
} */
.carousel-subtext {
  color: #ffffff; /* pure white */
}

.crs-img-1 {
  background: url("../img/slider-img1.jpg");
}

.crs-img-2 {
  background: url("../img/slider-img2.jpg");
}

.crs-img-3 {
  background: url("../img/slider-img3.jpg");
}

.crs-img-4 {
  background: url("../img/slider-img4.jpg");
  background-size: cover;
  background-position: center;
  width: 100%;
}

.carousel-item {
  height: 65vh; /* full viewport height */
  min-height: 500px; /* optional minimum */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Optional: remove any padding/margin that shrinks image */
.carousel-item .container {
  height: 100%;
  display: flex;
  align-items: center; /* vertically center text */
}

/* Optional: dark overlay for better text readability */
.carousel-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.35);
  /* dark overlay */
  z-index: 1;
}

/* Make text appear above overlay */
.carousel-caption {
  position: relative;
  z-index: 2;
  color: #fff;
}

/* Optional: make text fully visible on smaller screens */
.carousel-caption h2 {
  text-shadow: 2px 2px 4px rgba(9, 210, 229, 0.6);
  color: #fff;
}

/* Showcase */
#showcase .fas {
  font-size: 35px;
  color: #6fae95;
}

/* Get Started Section */
#get-started {
  background: url("../img/showcase2.jpg") center/cover no-repeat;
  min-height: 30vh;
  position: relative;
  z-index: 1;
  color: #000;
}

#get-started .inner-overlay {
  background: rgba(243, 243, 243, 0.5);
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 1;
}

#get-started .container {
  position: relative;
  z-index: 2;
  padding-top: 60px;
  padding-bottom: 60px;
}

.gC h3 {
  font-size: 1.8rem;
  font-weight: 600;
}

.gC p {
  font-size: 1rem;
  margin-bottom: 0;
}

/* Info Section */
#info {
  position: relative;
  z-index: 2;
  background: #fff;
}

#info h3 {
  font-size: 26px;
  font-weight: 600;
}

#info p {
  font-size: 16px;
  line-height: 1.6;
}

/* ✅ Mobile Optimization */
@media (max-width: 667px) {
  /* Fix overlap and increase height for visibility */
  #get-started {
    min-height: 60vh; /* taller for mobile */
  }

  #get-started .inner-overlay {
    padding: 80px 20px; /* more breathing space */
  }

  #get-started .gC {
    margin-top: 0 !important;
  }

  #get-started .gC h3 {
    font-size: 1.5rem;
  }

  #get-started .gC p {
    font-size: 0.95rem;
  }

  /* Info Section adjustments */
  #info {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  #info h3 {
    font-size: 22px;
  }

  #info p {
    font-size: 15px;
  }
}

/* Video */
#video {
  position: relative;
  background: url("../img/video.jpg") center/cover no-repeat;
  background-attachment: fixed;
  min-height: 300px;
}

#video .video-overlay {
  position: absolute;
  min-height: 300px;
  top: 0;
  left: 0;
  width: 100%;
  background: rgba(228, 239, 229, 0.8);
}

#video .fas {
  color: #6fae95;
  font-size: 50px;
}

/* Gallery */
#gallery {
  background-color: #f8f9fa;
}

#gallery h2 {
  color: #1a1a1a;
  letter-spacing: 1px;
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  grid-auto-rows: auto;
  gap: 20px;
}

/* Image Card Styling */
.gallery-item {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  display: block;
  background: #fff;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.gallery-item:hover {
  transform: scale(1.03);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}

/* Image Responsiveness */
.gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* Fills entire area without distortion */
  display: block;
  transition: transform 0.4s ease;
}

/* Subtle hover zoom effect */
.gallery-item:hover img {
  transform: scale(1.08);
}

/* About Page */
#about {
  background: url("../img/about/back.jpg") center/cover no-repeat fixed;
  min-height: 300px;
  position: relative;
}

#about .inner-overlay,
#services .inner-overlay,
#blog .inner-overlay,
#contact .inner-overlay {
  background: rgba(240, 247, 240, 0.7);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  min-height: 300px;
}

#about-services .fas {
  font-size: 50px;
  color: #6fae95;
}

/* Services Section */
#services {
  background: url("../img/slider-img4.jpg") center/cover no-repeat fixed;
  min-height: 300px;
  position: relative;
}

#services-faq {
  height: 400px;
}

#services-faq .card {
  cursor: pointer;
  background: #f9fff9;
  border: 1px solid #d4e8d6;
  border-radius: 8px;
  transition: 0.3s ease;
}

#services-faq .card:hover {
  background: #eaf7ea;
  transform: translateY(-4px);
}

/* Blog Section */
#blog {
  background: url("../img/video.jpg") center/cover no-repeat fixed;
  min-height: 300px;
  position: relative;
}

#blog-post img {
  height: 200px;
  width: 100%;
  border-radius: 5px;
}

#contact {
  background: url("../img/gallery7.jpg") center/cover no-repeat fixed;
  min-height: 300px;
  position: relative;
}

/* Responsive Adjustments */
@media (max-width: 991px) {
  #info .infoS {
    margin-top: 0;
  }

  #gallery img {
    height: 120px;
  }
}

@media (max-width: 420px) {
  .navbar .navbar-brand {
    width: 75%;
  }

  /* #myCarousel .display-4 {
		font-size: 42px !important;
		color: #fff !important	;
	} */

  #gallery .col-lg-4.col-md-4.col-sm-4 {
    width: 100%;
    height: 200px;
    margin: 5px auto;
  }
}

/* Vision & Mission Section */
section.vision-mission {
  background: linear-gradient(135deg, #e8f5e9, #f1f8e9, #e0f7fa);
  color: #333;
  padding: 80px 0;
  position: relative;
  overflow: hidden;
  border-top: 4px solid #a8e6cf;
  border-bottom: 4px solid #a8e6cf;
  transition: background 0.5s ease;
}

/* Soft gradient motion on hover */
section.vision-mission:hover {
  background: linear-gradient(135deg, #e0f7fa, #f1f8e9, #fff0f6);
}

/* Subtle floating pattern overlay */
section.vision-mission::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(
      circle at 10% 20%,
      rgba(255, 255, 255, 0.2) 0%,
      transparent 80%
    ),
    radial-gradient(
      circle at 90% 80%,
      rgba(255, 255, 255, 0.15) 0%,
      transparent 80%
    );
  opacity: 0.5;
  z-index: 0;
}

/* Container Styling */
section.vision-mission .container {
  position: relative;
  z-index: 1;
  text-align: center;
}

/* Headings */
section.vision-mission h2 {
  font-size: 2.5rem;
  font-weight: 700;
  letter-spacing: 1px;
  color: #2e2e2e;
  text-transform: uppercase;
  margin-bottom: 20px;
  background: linear-gradient(90deg, #00b894, #0984e3);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: fadeUp 1s ease forwards;
}

/* Paragraph Styling */
section.vision-mission p.lead {
  font-size: 1.1rem;
  max-width: 800px;
  margin: 0 auto;
  color: #444;
  line-height: 1.8;
  font-weight: 400;
  animation: fadeUp 1.5s ease forwards;
}

/* Decorative Floating Circles */
section.vision-mission::after {
  content: "";
  position: absolute;
  bottom: -100px;
  right: -100px;
  width: 300px;
  height: 300px;
  background: rgba(174, 214, 241, 0.4);
  border-radius: 50%;
  animation: floatUp 8s ease-in-out infinite alternate;
  z-index: 0;
}

/* Animations */
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(40px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes floatUp {
  from {
    transform: translateY(0);
  }

  to {
    transform: translateY(-30px);
  }
}

/* Button (optional if you add one) */
section.vision-mission .btn-outline-success {
  border-color: #00b894;
  color: #00b894;
  font-weight: 600;
  transition: all 0.3s ease;
}

section.vision-mission .btn-outline-success:hover {
  background: #00b894;
  color: #fff;
}

/* Responsive */
@media (max-width: 768px) {
  section.vision-mission {
    padding: 60px 20px;
  }

  section.vision-mission h2 {
    font-size: 2rem;
  }

  section.vision-mission p.lead {
    font-size: 1rem;
  }
}

/* Pastel Theme + Hover Animation */
.service-card {
  border: none;
  border-radius: 20px;
  transition: all 0.3s ease-in-out;
  padding: 20px;
}

.service-card i {
  font-size: 40px;
  color: #333;
  transition: transform 0.3s ease;
}

.service-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

.service-card:hover i {
  transform: scale(1.2);
}

/* Pastel color blocks */
.pastel-green {
  background: #c6f6d5;
}

.pastel-pink {
  background: #fcd5ce;
}

.pastel-blue {
  background: #d0ebff;
}

.pastel-yellow {
  background: #fff3bf;
}

.pastel-teal {
  background: #c3fae8;
}

.pastel-lavender {
  background: #e5d9f2;
}

/* Font and feel */
#about-services h4 {
  color: #2c2c2c;
  font-family: "Poppins", sans-serif;
}

#about-services p {
  color: #555;
}

/* About Section */
.about-section {
  background: linear-gradient(145deg, #f6f9f6, #e9f5e9);
  color: #222;
  position: relative;
  overflow: hidden;
  border-top: 3px solid #b4e197;
  border-bottom: 3px solid #b4e197;
}

/* Soft Overlay */
.about-section .inner-overlay {
  background: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(8px);
  padding: 60px 0;
  border-radius: 20px;
}

/* Title Styling */
.about-section .section-title {
  font-family: "Bebas Neue", sans-serif;
  font-size: 3rem;
  color: #243b2f;
  letter-spacing: 1px;
  text-transform: uppercase;
  transition: all 0.3s ease-in-out;
}

.about-section .section-title:hover {
  color: #4e9f3d;
  transform: scale(1.05);
}

/* Paragraph Text */
.about-section .section-text {
  font-family: "Manrope", sans-serif;
  font-size: 1.1rem;
  line-height: 1.8;
  color: #333;
}

.about-section .highlight {
  color: #4e9f3d;
  font-weight: 600;
}

/* Animation on scroll */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(220px);
    /* Increased from 80px to 120px */
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.about-section .section-title,
.about-section .section-text {
  animation: fadeInUp 1s ease forwards;
}

/* Responsive */
@media (max-width: 768px) {
  .about-section .section-title {
    font-size: 2.2rem;
  }

  .about-section .section-text {
    font-size: 1rem;
    padding: 0 15px;
  }
}
/* Footer background */
#footer {
  background: #e6f4ea; /* Soft pastel green */
  color: #333;
  font-family: "Manrope", sans-serif;
  border-top: 2px solid #b8e6c1;
}

/* Footer heading */
#footer h2 {
  font-family: "Bebas Neue", sans-serif; /* Apply Bebas Neue */
  font-weight: 400; /* Bebas Neue has only 400 weight */
  font-size: 2.2rem;
  background: linear-gradient(
    45deg,
    #10ac56,
    #81fbb8
  ); /* pastel green gradient */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: 1px;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.05);
  transition: all 0.4s ease;
}

#footer h2:hover {
  transform: scale(1.05);
}

/* Social icons container */
.social-icons {
  margin-top: 15px;
  gap: 15px;
}

/* Social buttons style */
.social-btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  color: white;
  font-size: 1.4rem;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Pastel green base colors */
.social-btn.fb {
  background: #28463b;
}
.social-btn.li {
  background: #85d5a4;
}
.social-btn.ig {
  background: #b3d323;
}

/* Hover effect: gradient + scale + glow */
.social-btn:hover {
  transform: scale(1.3);
  background: linear-gradient(135deg, #81fbb8, #28c76f);
  box-shadow: 0 6px 15px rgba(40, 199, 111, 0.5);
}

/* Footer bottom text */
#footer .row:last-child .col {
  margin-top: 15px;
  font-size: 0.9rem;
  background: linear-gradient(90deg, #1e2b26, #28c76f);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: 0.5px;
}

/* Floating animation on hover */
@keyframes float {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
  100% {
    transform: translateY(0);
  }
}

.social-btn:hover {
  animation: float 1.1s ease-in-out infinite;
}