
@media (max-width: 1100px) {
  .cc-card-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

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

@media (max-width: 860px) {
  .menu-toggle {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
  }

  .site-navigation {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: none;
    background: var(--cc-ink);
    border-top: 1px solid rgba(255,255,255,0.08);
  }

  .site-navigation.is-open {
    display: block;
  }

  .primary-menu {
    display: block;
    width: min(calc(100% - 2rem), var(--cc-content));
    margin-inline: auto;
    padding: 0.75rem 0 1rem;
  }

  .primary-menu a {
    padding: 0.85rem 0;
  }

  .primary-menu a::after {
    display: none;
  }

  .cc-building__layout,
  .cc-story__layout,
  .cc-ecosystem__layout {
    grid-template-columns: 1fr;
  }

  .cc-story__photo {
    max-width: 500px;
    width: 88%;
    min-height: 300px;
    margin-inline: auto;
  }

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

@media (max-width: 640px) {
  :root {
    --cc-gutter: 1rem;
  }

  .site-header__inner {
    min-height: 64px;
  }

  .site-title {
    font-size: 1.05rem;
  }

  .site-tagline {
    font-size: 0.55rem;
  }

  .cc-hero {
    min-height: auto;
    background:
      linear-gradient(0deg, rgba(12,14,12,0.97) 0%, rgba(12,14,12,0.84) 65%, rgba(12,14,12,0.38) 100%),
      url("../images/hero-placeholder.jpg") 68% center/cover no-repeat,
      #1a1c18;
  }

  .cc-hero__content {
    padding: 7rem 0 3.5rem;
  }

  .cc-hero h1 {
    font-size: clamp(3rem, 15vw, 4.8rem);
  }

  .cc-hero__actions {
    display: grid;
  }

  .cc-button {
    width: 100%;
  }

  .cc-card-grid,
  .cc-project-grid,
  .cc-post-grid {
    grid-template-columns: 1fr;
  }

  .cc-area-card {
    display: grid;
    grid-template-columns: 38% 1fr;
    text-align: left;
  }

  .cc-area-card__image {
    height: 100%;
    aspect-ratio: auto;
  }

  .cc-area-card__body {
    padding: 1.15rem;
  }

  .cc-building-item {
    grid-template-columns: 1fr;
    gap: 0.45rem;
  }

  .cc-status {
    justify-self: start;
  }

  .cc-network {
    min-height: 420px;
  }

  .cc-network::after {
    width: 290px;
    height: 290px;
  }

  .cc-network__label:nth-of-type(2) { top: 9%; left: 0; }
  .cc-network__label:nth-of-type(3) { top: 15%; right: 0; }
  .cc-network__label:nth-of-type(4) { bottom: 14%; left: 0; }
  .cc-network__label:nth-of-type(5) { bottom: 8%; right: 0; }

  .site-footer__layout {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
