/* Utilities CSS */

.text-gradient-gold {
  background: linear-gradient(to right, #f59e0b, #fde68a);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

.bg-gradient-dark {
  background: linear-gradient(to bottom, #0a0a0a, #000000);
}

.safe-pb {
  padding-bottom: env(safe-area-inset-bottom);
}

/* Mobile Grid Fixes */
.grid-mobile-2col {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
}

@media (min-width: 768px) {
  .grid-mobile-2col {
    grid-template-columns: repeat(3, 1fr); /* Or 4 depending on section */
    gap: 1.5rem;
  }
}

/* Tablet-specific fixes (768px - 1023px) */
@media (min-width: 768px) and (max-width: 1023px) {
  /* 1. Fix Hero Image Size */
  .hero-image-container {
    width: 50% !important;
  }

  .hero-image-container img {
    width: 650px !important;
    max-width: 100% !important;
  }

  /* 2. Fix Navigation - Logo */
  nav img {
    height: 2rem !important; /* Reduce logo height to 32px */
  }

  /* 3. Fix Navigation - Center Menu (Pill) */
  nav .bg-\[#374916\].border {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
    gap: 0.5rem !important;
    white-space: nowrap !important;
  }

  nav a {
    font-size: 0.75rem !important; /* 12px */
  }

  /* 4. Fix Navigation - Right Button (Start Now) */
  nav a[href="#contact"].bg-\[#374916\] {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
    font-size: 0.875rem !important; /* 14px */
  }

  /* 5. Fix Hero Typography & Spacing (Scale Down for Tablet) */
  /* Target the specific spans in Hero h1 */
  .md\:grid .text-3xl.md\:text-4xl {
    font-size: 2rem !important; /* Increased to 32px */
    margin-bottom: 0.25rem !important;
  }

  .md\:grid .text-4xl.md\:text-6xl {
    font-size: 3.25rem !important; /* Increased to 52px */
    line-height: 1.1 !important;
  }

  /* Target Hero Paragraph */
  .md\:grid p {
    font-size: 1rem !important; /* 16px (was 20px) */
    margin-bottom: 1.5rem !important;
    max-width: 380px !important; /* Prevent overlapping with image */
  }

  /* Target Hero Buttons */
  .md\:grid .flex.gap-4 a {
    padding: 0.75rem 1.5rem !important;
    font-size: 1rem !important;
  }

  /* Adjust Hero Container Padding */
  section.relative.-mt-24 {
    padding-top: 8rem !important; /* Adjust top padding */
  }
}

/* Lenis Smooth Scroll */
html.lenis,
html.lenis body {
  height: auto;
}

.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

.lenis.lenis-stopped {
  overflow: hidden;
}

.lenis.lenis-scrolling iframe {
  pointer-events: none;
}

/* Custom Cursor */
#custom-cursor {
  transform: translate(-50%, -50%);
  will-change: transform;
}

#custom-cursor.hovered {
  transform: translate(-50%, -50%) scale(1.5); /* Reduced scale slightly for better UX */
  background-color: transparent;
  border: 2px solid #f97316; /* Orange-500 */
}