* {
  box-sizing: border-box;
}

.container {
  display: grid;
  grid-template-rows: 1fr 8fr 1.15fr;
  min-height: 100vh;
}

.header {
  background-color: red;
}

.main {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) 5fr;
}

.aside {
  background-color: yellow;
}

.section {
  background-color: green;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(284px, 1fr));
  padding: 25px;
  padding-inline: clamp(20px, 6vw, 160px);
  gap: 15px;
}

.article {
  background-color: orange;
  min-height: 300px;
}

.footer {
  background-color: blue;
}

@media (width <= 1200px) {
  .main {
    grid-template-columns: minmax(250px, 1fr) 5fr;
  }
}
@media (width <= 992px) {
  .container {
    grid-template-rows: 0.8fr 8.4fr 0.9fr;
  }
}

@media (width <= 768px) {
  .aside {
    display: none;
  }
  .main {
    grid-template-columns: 1fr;
  }
}

@media (width <= 576px){
    .container {
    grid-template-rows: 0.5fr 8.6fr 0.9fr;
  }
}

@media (width <= 375px) {
  .container {
    grid-template-rows: 0.4fr 9fr 0.6fr;
  }

  .section {
    gap: 20px;
  }
}