main {
  display: flex;
  flex-direction: column;
  gap: 80px;
  margin-top: 80px;
  margin-bottom: 80px;
}

section#recent-posts {
  display: flex;
  gap: 40px;
}

/* Featured Post */
section#recent-posts>.featured-post article.post {
  position: relative;
  max-width: 600px;
  width: 100%;
  margin-inline: auto;
  height: fit-content;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0px;
  background: #E5F6FD;
  border-radius: 8px;
  overflow: hidden;
}

section#recent-posts>.featured-post article.post>.post-info {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 40px;
}

section#recent-posts>.featured-post article.post>.post-info .categories {
  position: absolute;
  top: 20px;
  left: 20px;
}

section#recent-posts>.featured-post article.post>.post-info .categories {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: flex-start;
}


section#recent-posts>.featured-post article.post>.post-info .categories>a {
  background-color: var(--bs-primary);
  color: var(--bs-white);
  border-radius: 4px;
  padding: 2px 8px;
  text-transform: uppercase;
}

/* Post */

section#categoires {}

section#posts {}

/* Categories */
section#categories {
  display: flex;
  gap: 28px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

section#categories .category-list {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 28px;
  max-width: 1024px;
  margin-inline: auto;
}

section#categories .category-list .category-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 2px 8px;
  border-radius: 8px;
  background-color: var(--bs-primary);
  list-style: none;
}

section#categories .category-list .category-icon a {
  color: white;
}