/* ==========================================================================
   PIXAL GROWTH - RESPONSIVE STYLESHEET
   ========================================================================== */

/* Large Desktop Adjustments (1440px+) */
@media (min-width: 1440px) {
  .container {
    width: min(100% - 60px, 1280px);
  }
}

/* Tablet & Laptop Below 1024px */
@media (max-width: 1024px) {
  .services-grid {
    grid-template-columns: repeat(2, 1fr);
  }

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

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

  .hero-grid {
    grid-template-columns: 1fr;
    gap: 48px;
    text-align: center;
  }

  .hero-content {
    max-width: 100%;
    margin: 0 auto;
  }

  .hero-actions {
    justify-content: center;
  }

  .hero-trust-bar {
    justify-content: center;
  }

  .split-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .inquiry-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

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

/* Mobile & Small Tablet Below 768px */
@media (max-width: 768px) {
  /* Navigation */
  .main-navigation,
  .header-cta {
    display: none;
  }

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

  .header-container {
    height: 70px;
  }

  /* Grid Stackings */
  .services-grid {
    grid-template-columns: 1fr;
  }

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

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

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

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

  .footer-bottom {
    flex-direction: column;
    text-align: center;
    gap: 16px;
  }

  /* Form Layout */
  .form-grid {
    grid-template-columns: 1fr;
  }

  .form-group.full-width {
    grid-column: span 1;
  }

  /* Hero Visual Stack */
  .hero-card-stack {
    max-width: 100%;
  }

  .hero-floating-badge {
    top: -10px;
    right: 0px;
    padding: 10px 14px;
  }

  /* Section Padding */
  .section-padding {
    padding-block: 50px;
  }
}

/* Small Mobile Screens Below 480px */
@media (max-width: 480px) {
  .container {
    width: min(100% - 32px, 100%);
  }

  .hero-actions {
    flex-direction: column;
    width: 100%;
  }

  .hero-actions .btn {
    width: 100%;
  }

  .btn {
    padding: 12px 20px;
    font-size: 15px;
  }

  .hero-badge {
    font-size: 13px;
    padding: 6px 14px;
  }

  .hero-trust-bar {
    flex-direction: column;
    gap: 16px;
    align-items: center;
  }

  .inquiry-section {
    padding: 32px 16px;
    border-radius: var(--radius-md);
  }

  .inquiry-form-wrapper {
    padding: 24px 16px;
  }

  .faq-trigger {
    padding: 16px 20px;
    font-size: 16px;
  }

  .faq-content-inner {
    padding: 0 20px 20px;
    font-size: 15px;
  }
}

/* Extra Small Phones 320px */
@media (max-width: 340px) {
  .site-logo-text {
    font-size: 20px;
  }

  .site-logo-icon {
    width: 30px;
    height: 30px;
    font-size: 15px;
  }
}
