/**
 * responsive.css
 * Master mobile-first breakpoint overrides.
 *
 * @package Srushti_Theme
 */

/* Breakpoint mappings:
   --bp-xs:  480px   (small mobile)
   --bp-sm:  640px   (mobile landscape)
   --bp-md:  768px   (tablet portrait)
   --bp-lg:  1024px  (tablet landscape / small desktop)
   --bp-xl:  1280px  (desktop)
   --bp-2xl: 1536px  (large desktop)
*/

@media (max-width: 1023px) {
  /* Hide desktop-only elements */
  .cursor-glow {
    display: none !important;
  }

  /* Grid collapses for tablet portrait and mobile */
  .grid-12 {
    grid-template-columns: 1fr !important;
    gap: var(--space-8) !important;
  }

  .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, 
  .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {
    grid-column: span 1 !important;
  }

  /* Services Split Layout Collapse */
  .services-split-layout {
    display: flex !important;
    flex-direction: column !important;
    gap: var(--space-8) !important;
  }

  .services-sticky-sidebar {
    position: static !important;
    padding-bottom: 0 !important;
    width: 100% !important;
  }

  .services-scroll-content {
    width: 100% !important;
  }
}

@media (max-width: 768px) {
  /* Hero typography */
  .hero-headline {
    font-size: clamp(32px, 8vw, 44px) !important;
  }



  .container {
    padding: 0 var(--space-4) !important;
  }

  /* Stats elements collapses */
  .stats-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: var(--space-4) !important;
  }

  .stat-item::after {
    display: none !important;
  }

  .stat-number {
    font-size: 38px !important;
  }

  .hero-stats {
    flex-wrap: wrap !important;
    gap: var(--space-6) !important;
  }
}

@media (max-width: 480px) {
  .stats-grid {
    grid-template-columns: 1fr !important;
    gap: var(--space-6) !important;
  }

  .hero-ctas {
    flex-direction: column !important;
    align-items: center !important;
  }
}

/* Touch targets — all interactive elements minimum 44px on mobile portrait/landscape */
@media (max-width: 1023px) {
  .btn-primary, .btn-secondary, .btn-cta {
    min-height: 48px;
  }

  .nav-link {
    min-height: 44px;
    padding: 12px 16px;
  }

  .footer-link {
    padding: 4px 0;
    min-height: 36px;
    display: flex;
    align-items: center;
  }

  /* Why Choose Srushti Tablet Adjustments */
  .why-img-element {
    min-height: 320px !important;
  }

  /* VDarshan 360 Tablet Preview Card Alignment */
  .vdarshan-preview-card {
    margin: 0 auto !important;
    max-width: 480px !important;
  }
}

@media (max-width: 768px) {
  /* Why Choose Srushti Mobile Layout */
  .why-img-element {
    min-height: 220px !important;
  }

  .why-card {
    padding: var(--space-5) !important;
  }

  /* Testimonials Mobile Padding */
  .testimonial-card {
    padding: var(--space-5) !important;
  }

  .vdarshan-preview-card {
    max-width: 100% !important;
  }
}