/* Точки перелома проекта: 720px и 1100px. Тема — через data-theme, не здесь. */

@media (min-width: 720px) {
  .topbar,
  .layout {
    padding-left: var(--space-5);
    padding-right: var(--space-5);
  }

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

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

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

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

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

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

@media (min-width: 1100px) {
  .layout {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 1400px;
    margin: 0 auto;
  }

  .panel--wide {
    grid-column: 1 / -1;
  }

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

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

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

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