/*
 * Legacy AUTOCENTER archive/blog/category styles copied from the pre-Blocksy
 * theme-level Additional CSS baseline. Kept isolated so they can be reviewed
 * and gradually rewritten against Blocksy markup.
 */
body.archive main,
body.blog main,
body.category main,
body.archive .site-main,
body.blog .site-main,
body.category .site-main {
  max-width: 1280px;
  margin: 0 auto;
  padding: 24px 16px 56px;
}

body.archive h1,
body.blog h1,
body.category h1,
body.archive .page-title,
body.blog .page-title,
body.category .page-title {
  margin: 0 0 24px !important;
  font-size: clamp(30px, 4vw, 48px) !important;
  line-height: 1.12 !important;
  font-weight: 800 !important;
  color: #252525 !important;
}

body.archive .site-main,
body.blog .site-main,
body.category .site-main,
body.archive .content-area,
body.blog .content-area,
body.category .content-area {
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
}

body.archive article,
body.blog article,
body.category article {
  background: #fff !important;
  border: 1px solid rgba(35,35,35,.10) !important;
  border-radius: 22px !important;
  padding: 24px 22px 20px !important;
  box-shadow: 0 14px 32px rgba(0,0,0,.055) !important;
  transition: all .25s ease !important;
  overflow: hidden !important;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

body.archive article:hover,
body.blog article:hover,
body.category article:hover {
  transform: translateY(-4px);
  border-color: rgba(215,25,32,.22) !important;
  box-shadow: 0 20px 44px rgba(0,0,0,.085) !important;
}

body.archive article h2,
body.blog article h2,
body.category article h2,
body.archive .entry-title,
body.blog .entry-title,
body.category .entry-title {
  margin: 0 0 10px !important;
  font-size: clamp(24px, 2.2vw, 32px) !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
}

body.archive article h2 a,
body.blog article h2 a,
body.category article h2 a,
body.archive .entry-title a,
body.blog .entry-title a,
body.category .entry-title a {
  color: #252525 !important;
  text-decoration: none !important;
  transition: color .2s ease;
}

body.archive article h2 a:hover,
body.blog article h2 a:hover,
body.category article h2 a:hover,
body.archive .entry-title a:hover,
body.blog .entry-title a:hover,
body.category .entry-title a:hover {
  color: #d71920 !important;
}

body.archive .entry-meta,
body.blog .entry-meta,
body.category .entry-meta,
body.archive .post-meta,
body.blog .post-meta,
body.category .post-meta {
  margin: 0 0 14px !important;
  font-size: 14px !important;
  color: #7a7a7a !important;
}

body.archive article .entry-content,
body.blog article .entry-content,
body.category article .entry-content,
body.archive article .entry-summary,
body.blog article .entry-summary,
body.category article .entry-summary,
body.archive article p,
body.blog article p,
body.category article p {
  color: #2f2f2f !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
}

body.archive article .entry-content,
body.blog article .entry-content,
body.category article .entry-content,
body.archive article .entry-summary,
body.blog article .entry-summary,
body.category article .entry-summary {
  display: -webkit-box !important;
  -webkit-line-clamp: 4 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  max-height: 7.2em !important;
  margin-bottom: 18px !important;
}

body.archive article p,
body.blog article p,
body.category article p {
  display: -webkit-box !important;
  -webkit-line-clamp: 4 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  margin-bottom: 18px !important;
}

body.archive .entry-footer,
body.blog .entry-footer,
body.category .entry-footer {
  margin-top: 16px !important;
  padding-top: 14px !important;
  border-top: 1px solid #f0f0f0 !important;
  font-size: 14px !important;
  color: #777 !important;
}

body.archive .entry-footer a,
body.blog .entry-footer a,
body.category .entry-footer a {
  color: #d71920 !important;
  text-decoration: none !important;
}

body.archive .more-link,
body.blog .more-link,
body.category .more-link,
body.archive .read-more,
body.blog .read-more,
body.category .read-more,
body.archive article a.button,
body.blog article a.button,
body.category article a.button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 0 22px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #262626 0%, #111 100%) !important;
  color: #fff !important;
  text-decoration: none !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: .02em !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.16) !important;
  transition: all .22s ease !important;
  position: relative !important;
  overflow: hidden !important;
}

body.archive .more-link::before,
body.blog .more-link::before,
body.category .more-link::before,
body.archive .read-more::before,
body.blog .read-more::before,
body.category .read-more::before,
body.archive article a.button::before,
body.blog article a.button::before,
body.category article a.button::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 5px !important;
  height: 100% !important;
  background: #d71920 !important;
  border-radius: 999px 0 0 999px !important;
}

body.archive .more-link:hover,
body.blog .more-link:hover,
body.category .more-link:hover,
body.archive .read-more:hover,
body.blog .read-more:hover,
body.category .read-more:hover,
body.archive article a.button:hover,
body.blog article a.button:hover,
body.category article a.button:hover {
  transform: translateY(-2px) !important;
  background: linear-gradient(135deg, #d71920 0%, #9f1015 100%) !important;
  color: #fff !important;
  box-shadow: 0 12px 26px rgba(215,25,32,.26) !important;
}

body.archive .more-link *,
body.blog .more-link *,
body.category .more-link *,
body.archive .read-more *,
body.blog .read-more *,
body.category .read-more * {
  color: #fff !important;
}

@media (max-width: 680px) {
  body.archive main,
  body.blog main,
  body.category main {
    padding: 18px 12px 40px !important;
  }

  body.archive article,
  body.blog article,
  body.category article {
    padding: 18px 16px !important;
    border-radius: 18px !important;
  }

  body.archive article h2,
  body.blog article h2,
  body.category article h2,
  body.archive .entry-title,
  body.blog .entry-title,
  body.category .entry-title {
    font-size: 22px !important;
  }

  body.archive article p,
  body.blog article p,
  body.category article p {
    font-size: 15px !important;
  }

  body.archive .more-link,
  body.blog .more-link,
  body.category .more-link,
  body.archive .read-more,
  body.blog .read-more,
  body.category .read-more,
  body.archive article a.button,
  body.blog article a.button,
  body.category article a.button {
    min-height: 42px !important;
    padding: 0 18px !important;
    font-size: 14px !important;
  }
}