/* =============================================
   RESPONSIVE - Mobile-first overrides
   All asymmetric layouts collapse to single-column
   ============================================= */

@media (max-width: 1024px) {
  .grid--4 {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Scale the floating logo a bit so it doesn't crowd the centered nav pill */
  .site-logo img {
    height: 52px;
  }

  .site-logo.scrolled img {
    height: 40px;
  }

  /* Hero visual - shrink cards so they fit narrower right column */
  .hero__visual {
    height: 540px;
  }

  .hero__shape--card {
    width: 200px;
  }

  .hero__shape--card-pro {
    width: 220px;
  }

  .hero__shape-stat {
    font-size: 2.5rem;
  }

  .hero__shape--card-pro .hero__shape-stat {
    font-size: 2rem;
  }

  /* Globe stage */
  .globe-stage {
    min-height: 400px;
  }

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

  .footer__grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-2xl);
  }

  .footer__brand {
    grid-column: 1 / -1;
  }

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

  /* Bento grid collapses */
  .grid--bento {
    grid-template-columns: 1fr 1fr;
  }

  .grid--bento > :nth-child(1),
  .grid--bento > :nth-child(2),
  .grid--bento > :nth-child(3),
  .grid--bento > :nth-child(4) {
    grid-column: span 1;
  }
}

@media (max-width: 768px) {
  /* Nav switches to hamburger */
  .navbar__links {
    display: none;
  }

  .navbar__toggle {
    display: flex;
  }

  .navbar__mobile {
    display: flex;
  }

  /* Nav pill adjustments - push to right edge so it doesn't collide with floating logo */
  .navbar {
    padding: var(--space-md) var(--space-md) 0;
  }

  .navbar__inner {
    padding: 0.4rem;
    margin-inline: auto 0;
  }

  /* Floating logo - smaller on tablet/mobile but still prominent */
  .site-logo {
    top: var(--space-md);
    left: var(--space-md);
    z-index: var(--z-modal);
  }

  .site-logo img {
    height: 44px;
  }

  .site-logo.scrolled {
    top: var(--space-sm);
  }

  .site-logo.scrolled img {
    height: 36px;
  }

  /* Splits → single column */
  .split {
    grid-template-columns: 1fr;
    gap: var(--space-2xl);
  }

  .split--reverse {
    direction: ltr;
  }

  .grid--2,
  .grid--3 {
    grid-template-columns: 1fr;
  }

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

  .grid--bento > :nth-child(1),
  .grid--bento > :nth-child(2),
  .grid--bento > :nth-child(3),
  .grid--bento > :nth-child(4) {
    grid-column: span 1;
  }

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

  .team__grid {
    grid-template-columns: 1fr;
    max-width: 420px;
  }

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

  .case-studies {
    grid-template-columns: 1fr;
  }

  .case-study--wide {
    grid-column: auto;
  }

  .case-study__list--two-col {
    grid-template-columns: 1fr;
  }

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

  /* Hero - single column, hide shapes on mobile */
  .hero__split {
    grid-template-columns: 1fr;
  }

  .hero__visual {
    display: none;
  }

  .hero__content {
    padding-top: 8rem;
    text-align: center;
  }

  .hero__subtitle {
    margin-inline: auto;
  }

  .hero__actions {
    justify-content: center;
  }

  /* Page hero */
  .page-hero {
    padding: 8rem 0 3rem;
    text-align: center;
  }

  .page-hero--cinematic {
    padding: 10rem 0 4rem;
  }

  .page-hero--split {
    padding: 9rem 0 3rem;
    min-height: 0;
  }

  /* Footer */
  .footer__grid {
    grid-template-columns: 1fr;
  }

  .footer__bottom {
    flex-direction: column;
    gap: var(--space-md);
    text-align: center;
  }

  /* Stats */
  .stats {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-md);
  }

  .stat {
    padding: var(--space-md);
  }

  .about-stats__inner {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .container {
    padding-inline: var(--space-md);
  }

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

  .hero__actions .btn {
    width: 100%;
    justify-content: center;
  }

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

  .card__inner {
    padding: var(--space-xl);
  }

  .section__header {
    margin-bottom: var(--space-2xl);
  }

  .case-study__inner {
    padding: var(--space-xl);
  }

  .case-study__head {
    margin-bottom: var(--space-md);
  }

  .logo-slider__item {
    height: 24px;
  }

  .logo-slider__track {
    gap: var(--space-2xl);
  }
}