@import "tailwindcss";
@custom-variant hover (&:hover);
@custom-variant focus (&:focus);
@import url("https://fonts.googleapis.com/css2?family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap");

.font-serif {
  font-family: "PT Serif", serif;
}

.nav-link.active {
  color: #f58f29;
}

html {
  scroll-behavior: smooth;
}
@media (max-width: 929px) {
  header {
    padding-left: 2rem !important; /* px-8 */
    padding-right: 2rem !important;
  }
}

/*  ANIMATION FROM RIGHT */
@layer utilities {
  @keyframes slideInRight {
    from {
      transform: translateX(100px);
      opacity: 0;
    }
    to {
      transform: translateX(0);
      opacity: 1;
    }
  }

  .animate-slide-in-right {
    animation: slideInRight 0.8s ease-out forwards;
  }
}

/*  ANIMATION FROM LEFT */
@layer utilities {
  @keyframes slideInLeft {
    from {
      transform: translateX(-100px);
      opacity: 0;
    }
    to {
      transform: translateX(0);
      opacity: 1;
    }
  }

  .animate-slide-in-left {
    animation: slideInLeft 0.8s ease-out forwards;
  }
}

/* SCROLLBAR IN NEWS AND POST SECTION */
.custom-scrollbar::-webkit-scrollbar {
  width: 8px;
}

.custom-scrollbar::-webkit-scrollbar-track {
  background: #f1f5f9;
  border-radius: 20px;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #f58f29, #f07a00);
  border-radius: 20px;
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #f07a00, #d96300);
}

/* Firefox */
.custom-scrollbar {
  scrollbar-width: thin;
  scrollbar-color: #f58f29 #f1f5f9;
}

/* demo */

@layer utilities {
  details > summary::-webkit-details-marker {
    display: none;
  }

  .accordion-content {
    @apply overflow-hidden transition-all duration-500 ease-in-out;
    height: 0;
  }

  .vertical-line {
    @apply transition-all duration-300 origin-center;
  }
}
/* LINE IN CARDS */
/* default line (gray) */
.line-bar {
  width: 3px;
  height: 56px;
  border-radius: 9999px;
  background: linear-gradient(to bottom, #6b7280, #d1d5db); /* gray gradient */
  transition: background 0.3s ease;
  flex-shrink: 0;
}
/* ------------------------------------------------------------------ */
/* hover gradient (orange) */
.group:hover .line-bar {
  background: linear-gradient(to bottom, #f07a00, #fefefe);
}

/* hover effect on btn */
.magic-btn {
  position: relative;
  padding: 14px 34px;
  font-weight: 100;
  color: #fff;
  background: #0b1e3b;
  border-radius: 9999px;
  overflow: hidden;
  transition:
    transform 0.25s ease,
    background-color 0.4s ease;
}

.magic-btn::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    transparent,
    rgba(255, 255, 255, 0.4),
    transparent
  );
  transform: translateX(-100%);
  transition: transform 0.6s ease;
}

.magic-btn:hover::before {
  transform: translateX(100%);
}

.magic-btn:hover {
  background-color: #f77d23;
  color: white; /* 🔥 hover color */
  transform: scale(1.05);
}

/* WHATAPP BTN */
/* Base */
.whatsapp-btn {
  position: relative;
  overflow: hidden;
}

/* Shine sweep */
.whatsapp-btn::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    transparent,
    rgba(255, 255, 255, 0.35),
    transparent
  );
  transform: translateX(-120%);
  transition: transform 0.6s ease;
}

.whatsapp-btn:hover::before {
  transform: translateX(120%);
}

/* Glow ring */
.whatsapp-btn::after {
  content: "";
  position: absolute;
  inset: -4px;
  border-radius: 8px;
  border: 2px solid rgba(255, 255, 255, 0.4);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.whatsapp-btn:hover::after {
  opacity: 1;
}

/* Icon micro interaction */
.whatsapp-btn i {
  transition: transform 0.3s ease;
}

.whatsapp-btn:hover i {
  transform: rotate(-10deg) scale(1.15);
}

/* Arrow slide */
.whatsapp-btn svg {
  transition: transform 0.3s ease;
}

.whatsapp-btn:hover svg {
  transform: translateX(4px) translateY(-2px);
}

/* NEWS/POST SECTION hover effect of right section */

.flex.flex-col.sm\:flex-row {
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.flex.flex-col.sm\:flex-row:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.08);
}

/* for img */
/* .flex.flex-col.sm\:flex-row img {
  transition:
    transform 0.5s ease,
    filter 0.5s ease;
}

.flex.flex-col.sm\:flex-row:hover img {
  transform: scale(1.08);
  filter: brightness(0.95);
} */

/* for btn */
.flex.flex-col.sm\:flex-row button.group {
  position: relative;
  overflow: hidden;
  transition: transform 0.25s ease;
}

/* Shine overlay */
.flex.flex-col.sm\:flex-row button.group::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    transparent,
    rgba(255, 255, 255, 0.4),
    transparent
  );
  transform: translateX(-120%);
  transition: transform 0.6s ease;
}

.flex.flex-col.sm\:flex-row:hover button.group::before {
  transform: translateX(120%);
}

/* Button lift */
.flex.flex-col.sm\:flex-row:hover button.group {
  transform: translateY(-2px);
}

/* Arrow slide (override bounce) */
.flex.flex-col.sm\:flex-row button.group svg {
  transition: transform 0.3s ease;
}

.flex.flex-col.sm\:flex-row:hover button.group svg {
  transform: translateX(4px) translateY(-2px);
}

/*CTA-BTN  */
/* Base button enhancement */
button.group {
  position: relative;
  overflow: hidden;
}

/* Shine sweep */
button.group::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    transparent,
    rgba(255, 255, 255, 0.45),
    transparent
  );
  transform: translateX(-120%);
  transition: transform 0.6s ease;
}

button.group:hover::before {
  transform: translateX(120%);
}

/* Button lift */
button.group:hover {
  transform: translateY(-2px);
}

/* Arrow micro-move (override bounce) */
button.group svg {
  transition: transform 0.3s ease;
}

button.group:hover svg {
  transform: translateX(4px) translateY(-2px);
}

/* ------------------------------------------------------ */

/* default (desktop & above 425px) */
.banner-bg {
  background-image: url("./images/banner.webp");
  background-size: cover;
  background-position: center;
}
.banner-txt {
  padding-top: 100px;
}
@media (min-width: 1440px) and (max-width: 2000px) {
  .banner-txt {
    min-height: 70vh;
    display: flex;
    align-items: center;
  }
}
/* mobile only */
@media (max-width: 768px) {
  .banner-bg {
    background-image: url("./images/mob-banner.webp");
    background-position: left center; /* adjust as needed */
  }
}

/* GALLARY-IMG SECTION */
/* Correct media query for 768px to 1024px */
@media (min-width: 426px) and (max-width: 768px) {
  img.custom-img {
    width: 350px !important;
    height: 300px !important;
  }
}
/* @media (max-width:425px){
  img.custom-img{
    width: 350px !important;
  }
} */
/* Increase image size only between 375px–425px */
@media (min-width: 376px) and (max-width: 425px) {
  .img.custom-img {
    width: 70% !important;
    height: 320px !important;
  }
}
@media (min-width: 950px) and (max-width: 1024px) {
  .img.custom-img {
    width: 40% !important;
    height: px !important;
  }
}

/* VIDEO SECTION */
@media (min-width: 375px) and (max-width: 425px) {
  .video-txt {
    position: absolute;
    left: 20%;
  }
}

@media (min-width: 375px) and (max-width: 425px) {
  .video-text {
    position: absolute;
    left: 10%;
  }
}

/* FOR FIXED THE SECTIONS - NEWS/POST */
body.freeze {
  position: fixed;
  width: 100%;
  overflow: hidden;
}

#blogs.fixed {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 100vh;
  z-index: 999;
  background: white;
}

/* SMOOTHLY SLIDE IMG CARDS */
#sliderTrack {
  will-change: transform;
  position: relative;
  z-index: 1;
}

/* DEMO */