/* Блог Cleaning 360 — список и статья */
.blog-wrap { max-width: 1180px; margin: 0 auto; padding: 0 20px; }

/* ---- Список статей ---- */
.blog-hero { padding: 48px 0 24px; }
.blog-hero h1 { font-size: 38px; line-height: 1.2; margin: 0 0 12px; color: #232328; }
.blog-hero p { font-size: 18px; color: #6b6b72; margin: 0; max-width: 760px; }
.blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 26px; padding: 28px 0 56px; }
.blog-card { background: #fff; border: 1px solid #ece6dd; border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; transition: box-shadow .2s, transform .2s; }
.blog-card:hover { box-shadow: 0 10px 28px rgba(0,0,0,.08); transform: translateY(-2px); }
.blog-card img { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; }
.blog-card-body { padding: 20px 22px 24px; display: flex; flex-direction: column; flex: 1; }
.blog-card h2 { font-size: 21px; line-height: 1.3; margin: 0 0 10px; }
.blog-card h2 a { color: #232328; text-decoration: none; }
.blog-card h2 a:hover { color: #ee8221; }
.blog-card p { font-size: 15px; color: #6b6b72; line-height: 1.55; margin: 0 0 16px; flex: 1; }
.blog-card-meta { font-size: 13px; color: #9a9aa2; }

/* ---- Статья ---- */
.article { max-width: 820px; margin: 0 auto; padding: 40px 20px 60px; }
.article h1 { font-size: 36px; line-height: 1.22; margin: 0 0 16px; color: #232328; }
.article-meta { font-size: 14px; color: #9a9aa2; margin-bottom: 28px; padding-bottom: 20px; border-bottom: 1px solid #ece6dd; }
.article-lead { font-size: 19px; line-height: 1.6; color: #3c3c44; background: #fdf6ee; border-left: 4px solid #ee8221; padding: 18px 22px; border-radius: 0 12px 12px 0; margin-bottom: 30px; }
.article p { font-size: 17px; line-height: 1.72; color: #3c3c44; margin: 0 0 18px; }
.article h2 { font-size: 27px; line-height: 1.3; margin: 40px 0 16px; color: #232328; }
.article h3 { font-size: 21px; margin: 28px 0 12px; color: #232328; }
.article ul, .article ol { padding-left: 22px; margin: 0 0 20px; }
.article li { font-size: 17px; line-height: 1.7; color: #3c3c44; margin-bottom: 8px; }
.article a { color: #d9741a; }
.article figure { margin: 32px 0; }
.article figure img { width: 100%; height: auto; border-radius: 14px; display: block; border: 1px solid #ece6dd; }
.article figcaption { font-size: 14px; color: #9a9aa2; margin-top: 10px; text-align: center; }
.article table { width: 100%; border-collapse: collapse; margin: 0 0 24px; font-size: 16px; }
.article th, .article td { padding: 12px 14px; border-bottom: 1px solid #ece6dd; text-align: left; }
.article th { background: #f7f2ec; font-weight: 600; }
.article td:last-child, .article th:last-child { text-align: right; white-space: nowrap; }

.article-cta { background: #232328; color: #fff; border-radius: 16px; padding: 30px 32px; margin: 40px 0; }
.article-cta h3 { color: #fff; margin: 0 0 10px; font-size: 23px; }
.article-cta p { color: #c9c9d1; margin: 0 0 20px; font-size: 16px; }
.article-cta a { display: inline-block; background: #ee8221; color: #fff; padding: 13px 26px; border-radius: 10px; text-decoration: none; font-weight: 600; }
.article-cta a:hover { background: #d9741a; }

.faq-block { margin: 36px 0; }
.faq-item { border-bottom: 1px solid #ece6dd; padding: 18px 0; }
.faq-item h3 { margin: 0 0 8px; font-size: 18px; }
.faq-item p { margin: 0; font-size: 16px; }

.read-next { background: #faf7f3; border-radius: 16px; padding: 26px 28px; margin-top: 44px; }
.read-next h3 { margin: 0 0 14px; font-size: 19px; }
.read-next ul { list-style: none; padding: 0; margin: 0; }
.read-next li { margin-bottom: 10px; font-size: 16px; }
.read-next a { color: #d9741a; text-decoration: none; }
.read-next a:hover { text-decoration: underline; }

@media (max-width: 768px) {
  .article h1 { font-size: 28px; }
  .article h2 { font-size: 23px; }
  .article p, .article li { font-size: 16px; }
  .blog-hero h1 { font-size: 29px; }
}