/* ==========================================================================
   Soroush Mandegar — Responsive enhancements (mobile-first base in style.css)
   ========================================================================== */

/* Tablet and up */
@media (min-width: 48rem) {
  :root {
    --gutter: 1.5rem;
  }

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

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

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

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

  .statement-grid,
  .expertise-grid,
  .stack-grid,
  .compare-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .service-detail__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .case-study {
    grid-template-columns: 0.95fr 1.05fr;
    align-items: stretch;
    gap: 2rem;
    padding: 1.75rem;
  }

  .case-study__media {
    min-height: 100%;
  }

  .case-study__meta {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .case-study-teaser {
    grid-template-columns: 1.1fr 0.9fr;
    align-items: center;
  }

  .project-overview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem 1.75rem;
  }

  .project-overview__item {
    padding-bottom: 0;
    border-bottom: 0;
  }

  .project-overview__item--wide {
    grid-column: 1 / -1;
  }

  .tech-impl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tech-impl__item--wide {
    grid-column: 1 / -1;
  }

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

  .project-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hero--project .hero__layout {
    grid-template-columns: 1.15fr 0.85fr;
  }

  .featured-article {
    grid-template-columns: 1.05fr 0.95fr;
    align-items: stretch;
    gap: 2rem;
    padding: 1.75rem;
  }

  .featured-article__media {
    min-height: 100%;
  }

  .newsletter {
    grid-template-columns: 1.2fr 0.8fr;
    align-items: center;
    gap: 2rem;
    padding: 2rem;
  }

  .client-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .profile {
    grid-template-columns: 0.85fr 1.15fr;
    align-items: stretch;
    gap: 2rem;
    padding: 1.75rem;
  }

  .profile__media {
    min-height: 100%;
  }

  .hero--with-media .hero__layout {
    grid-template-columns: 1.15fr 0.85fr;
    gap: 2.5rem;
  }

  .reason-list {
    gap: 1rem;
  }

  .split {
    grid-template-columns: 1.05fr 0.95fr;
    gap: 3rem;
  }

  .split--reverse .split__media {
    order: 2;
  }

  .split--reverse .split__content {
    order: 1;
  }

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

  .contact-layout {
    grid-template-columns: 1.2fr 0.8fr;
    align-items: start;
  }

  .contact-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .footer-grid {
    grid-template-columns: 1.4fr repeat(3, 1fr);
    gap: 2.5rem;
  }

  .cta__inner {
    grid-template-columns: 1.4fr auto;
    justify-content: space-between;
  }
}

/* Desktop navigation */
@media (min-width: 64rem) {
  .nav-toggle {
    display: none;
  }

  .site-nav {
    position: static;
    inset: auto;
    display: block;
    padding: 0;
    background: transparent;
    border: 0;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
  }

  .site-nav__list {
    flex-direction: row;
    align-items: center;
    gap: 0.2rem;
  }

  .site-nav__link {
    padding: 0.55rem 0.75rem;
  }

  .site-nav__link.is-active {
    background: transparent;
    box-shadow: inset 0 -2px 0 var(--color-secondary);
  }

  .site-nav__cta {
    margin-top: 0;
    margin-inline-start: var(--space-3);
  }

  .site-nav__cta .btn {
    width: auto;
    min-height: var(--btn-height-sm);
    padding: 0.45rem 1rem;
  }

  .card-grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .feature-grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .process {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.25rem;
  }

  .process--five {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .process__step {
    min-height: 100%;
  }

  .hero__inner {
    max-width: 48rem;
  }

  html[dir="rtl"] .hero__inner {
    max-width: 54rem;
  }
}

/* Large desktop */
@media (min-width: 80rem) {
  :root {
    --gutter: 2rem;
  }

  .process--five {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .process--six {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .client-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .contact-card-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* Small phones */
@media (max-width: 22.5rem) {
  .brand__tag {
    display: none;
  }

  .btn-group {
    flex-direction: column;
    align-items: stretch;
  }

  .filter-bar {
    flex-wrap: nowrap;
  }

  .filter-bar__btn {
    flex: 0 0 auto;
  }

  .hero__brand,
  .hero__title {
    overflow-wrap: break-word;
  }
}