/* ==========================================================================
   SHIVARADHYA ENRICHING LIFE — RESPONSIVE MEDIA QUERIES (RESPONSIVE.CSS)
   ========================================================================== */

/* Laptop / Desktop Small (Under 1024px) */
@media (max-width: 1024px) {
  :root {
    --section-padding: 70px;
  }

  .site-container {
    width: calc(100% - 40px);
  }

  .mega-dropdown {
    width: 740px;
    padding: 24px;
    gap: 16px;
  }

  .cards-grid-3 {
    grid-template-columns: repeat(2, 1fr);
  }

  .cards-grid-4 {
    grid-template-columns: repeat(2, 1fr);
  }

  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 30px;
  }

  .detail-content-grid,
  .detail-content-grid.reverse {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .process-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
  }
}

/* Mobile & Tablet (Under 880px) */
@media (max-width: 880px) {
  :root {
    --section-padding: 55px;
  }

  .site-header {
    height: 75px;
  }

  .logo-wrapper img {
    max-width: 120px;
    max-height: 48px;
  }

  .mobile-nav-toggle {
    display: block;
  }

  .main-nav {
    position: fixed;
    top: 75px;
    left: 0;
    width: 100%;
    height: calc(100vh - 75px);
    background: #080808;
    flex-direction: column;
    align-items: flex-start;
    padding: 30px 24px 60px 24px;
    overflow-y: auto;
    transform: translateX(-100%);
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    gap: 20px;
    border-top: 1px solid var(--gold-border);
  }

  .main-nav.active {
    transform: translateX(0);
  }

  .nav-list {
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: 0;
  }

  .nav-item {
    width: 100%;
    border-bottom: 1px solid rgba(200, 155, 60, 0.12);
  }

  .nav-link {
    width: 100%;
    justify-content: space-between;
    padding: 16px 0;
    font-size: 1rem;
  }

  /* Accordion for Mobile Mega Menu */
  .mega-dropdown {
    position: static;
    transform: none !important;
    width: 100%;
    box-shadow: none;
    background: #0f0f0f;
    border: none;
    border-radius: 8px;
    padding: 15px;
    grid-template-columns: 1fr;
    display: none;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    margin-bottom: 15px;
  }

  .nav-item.mobile-dropdown-open .mega-dropdown {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .mega-footer-link {
    grid-column: span 1;
    text-align: left;
  }

  .btn-header-cta {
    width: 100%;
    margin-top: 15px;
  }

  .subpage-hero {
    padding-block: 70px 45px;
  }

  .cards-grid-3,
  .cards-grid-2,
  .cards-grid-4 {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .process-grid {
    grid-template-columns: 1fr;
    gap: 35px;
  }

  .footer-grid {
    grid-template-columns: 1fr;
  }

  .section-title-wrap {
    margin-bottom: 35px;
  }
}

/* Small Mobile (Under 480px) */
@media (max-width: 480px) {
  .site-container {
    width: calc(100% - 32px);
  }

  .btn-primary-gold,
  .btn-secondary-outline {
    width: 100%;
    padding: 12px 20px;
    font-size: 0.86rem;
  }

  .media-frame {
    border-radius: 12px;
  }

  .premium-card {
    padding: 24px 20px;
  }
}
