
.blog-content-template-4 {
  --green-50: #f0fdf4 !important;
  --green-100: #dcfce7 !important;
  --green-500: #22c55e !important;
  --green-600: #16a34a !important;
  --green-700: #15803d !important;
  --green-800: #166534 !important;
  --green-dark: #46634F !important;
  --green-900: #307D4B !important;
  --green-main: #46CC6A !important;
  --green-link: #30CB65 !important;
  --brand-900: var(--green-900) !important;
  --text: #1f2937 !important;
  --text-muted: #6b7280 !important;
  --border: #e5e7eb !important;
  --red-500: #ef4444 !important;
  --radius: 8px !important;
  --radius-sm: 6px !important;
}
.blog-content-template-4 * { box-sizing: border-box !important; }
.blog-content-template-4 {
  margin: 0 !important;

  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.6 !important;
  color: var(--text) !important;
  background: #fff !important;
}
.blog-content-template-4 .main-content {

  margin: 0 auto !important;
  padding: 0 !important;
  width: 100% !important;
  background: #fff !important;
}
.blog-content-template-4 .article-inner {
  max-width: 100% !important;
}
.blog-content-template-4 .article-inner h1 {
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  margin: 0 0 0.25rem !important;
  line-height: 1.35 !important;
  color: var(--text) !important;
}
.blog-content-template-4 .article-meta {
  font-size: 0.875rem !important;
  color: var(--text-muted) !important;
  margin: 0 0 1rem !important;
}
.blog-content-template-4 .article-meta span + span::before {
  content: ' · ' !important;
}
.blog-content-template-4 .quick-answer {
  border: 1px solid #EDEDED !important;
  padding: 16px !important;
  border-radius: 8px !important;
  margin: 0 0 1rem !important;
  color: var(--text) !important;
}
.blog-content-template-4 .article-inner h2 {
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  margin: 2.5rem 0 1rem !important;
  color: var(--text) !important;
}
.blog-content-template-4 .article-inner h3 { font-size: 1.125rem !important; font-weight: 600 !important; margin: 1.5rem 0 0.5rem !important; }
.blog-content-template-4 .article-inner p { margin: 0 0 1rem !important; color: var(--text) !important; }
.blog-content-template-4 .article-inner a { color: #2563eb !important; text-decoration: none !important; }
.blog-content-template-4 .article-inner a:hover { color: #1d4ed8 !important; text-decoration: underline !important; }
/* Màu primary (xanh lá): thêm class link-primary vào thẻ a khi cần */
.blog-content-template-4 .article-inner a.link-primary,
.blog-content-template-4 a.link-primary { color: var(--green-700) !important; }
.blog-content-template-4 .article-inner a.link-primary:hover,
.blog-content-template-4 a.link-primary:hover { color: var(--green-800) !important; }
/* Table of Contents - giống index.html / index2.html */
.blog-content-template-4 .toc {
  background: var(--green-50) !important;
  border: 1px solid var(--green-100) !important;
  border-bottom: 2px solid var(--green-500) !important;
  border-radius: var(--radius) !important;
  padding: 1.25rem 1.5rem !important;
  margin: 2rem 0 !important;
}
.blog-content-template-4 .toc .toc-title {
  font-size: 32px !important;
  font-weight: 700 !important;
  margin: 0 0 20px !important;
  color: #000 !important;
}
.blog-content-template-4 .toc > ul {
  list-style: none !important;
  padding: 20px 0 0 !important;
  margin: 0 !important;
  border-top: 1px solid #333 !important;
}
.blog-content-template-4 .toc ul ul {
  list-style: none !important;
  padding: 0.25rem 0 0 1rem !important;
  margin: 0 !important;
}
.blog-content-template-4 .toc li {
  position: relative !important;
  padding-left: 1.25rem !important;
  margin-bottom: 0.5rem !important;
}
.blog-content-template-4 .toc > ul > li::before, .blog-content-template-4 .toc ul ul li::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  top: 0.5em !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #6EB474 !important;
}
.blog-content-template-4 .toc > ul > li > a {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #000 !important;
}
.blog-content-template-4 .toc ul ul li a {
  font-size: 16px !important;
  font-weight: 400 !important;
  color: #555555 !important;
}
.blog-content-template-4 .toc a:hover { color: var(--green-700) !important; }
/* Why you can trust - accordion với nội dung 2 cột 6:4 */
.blog-content-template-4 .trust-accordion .accordion-body-inner {
  display: flex !important;
  gap: 2rem !important;
  align-items: flex-start !important;
  padding-top: 0.75rem !important;
}
.blog-content-template-4 .trust-accordion .accordion-body-inner .trust-text {
  flex: 6 !important;
  min-width: 0 !important;
}
.blog-content-template-4 .trust-accordion .accordion-body-inner .trust-text p {
  margin: 0 !important;
}
.blog-content-template-4 .trust-accordion .accordion-body-inner .trust-list-wrap {
  flex: 4 !important;
  min-width: 0 !important;
}
.blog-content-template-4 .trust-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.blog-content-template-4 .trust-list li {
  position: relative !important;
  padding-left: 2rem !important;
  margin-bottom: 0.5rem !important;
}
.blog-content-template-4 .trust-list li::before {
  content: '✓' !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  background: #46CC6A !important;
  color: #fff !important;
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
/* Best companies list */
.blog-content-template-4 .best-list { list-style: none !important; padding: 0 !important; margin: 1rem 0 !important; }
.blog-content-template-4 .best-list li {
  position: relative !important;
  padding-left: 1.25rem !important;
  margin-bottom: 0.4rem !important;
  color: #307D4B !important;
  font-weight: 700 !important;
}
.blog-content-template-4 .best-list li::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  top: 0.5em !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #BBFBD1 !important;
}
/* 3-column highlight cards */
.blog-content-template-4 .highlight-cards {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 1.5rem !important;
  margin: 2rem 0 !important;
}
.blog-content-template-4 .highlight-card {
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  padding: 1.25rem !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.75rem !important;
}
.blog-content-template-4 .highlight-card .card-icon {
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  background: var(--green-800) !important;
  color: #fff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
}
.blog-content-template-4 .highlight-card h3 { margin: 0 !important; font-size: 1.125rem !important; }
.blog-content-template-4 .highlight-card .rating-bar {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.35rem !important;
  background: rgba(70, 204, 106, 0.2) !important;
  color: var(--green-800) !important;
  font-weight: 600 !important;
  font-size: 0.8rem !important;
  padding: 0.25rem 0.5rem !important;
  border-radius: var(--radius-sm) !important;
  width: fit-content !important;
}
.blog-content-template-4 .highlight-card .card-checklist { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.blog-content-template-4 .highlight-card .card-checklist li {
  position: relative !important;
  padding-left: 1.5rem !important;
  margin-bottom: 0.35rem !important;
  font-size: 0.9rem !important;
}
.blog-content-template-4 .highlight-card .card-checklist li::before {
  content: '✓' !important;
  position: absolute !important;
  left: 0 !important;
  color: #46CC6A !important;
  font-weight: 700 !important;
}
.blog-content-template-4 .highlight-card .more-details { font-size: 0.85rem !important; color: var(--text-muted) !important; }
/* Compare tables with check/cross */
.blog-content-template-4 .article-inner .compare-section-title, .blog-content-template-4 h3.compare-section-title {
  color: #307D4B !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  margin: 0 0 0.5rem !important;
}
.blog-content-template-4 .compare-stats-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 1rem !important;
}
.blog-content-template-4 .compare-stats-list li {
  position: relative !important;
  padding-left: 1.25rem !important;
  margin-bottom: 0.5rem !important;
}
.blog-content-template-4 .compare-stats-list li::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  top: 0.6em !important;
  width: 5px !important;
  height: 5px !important;
  border-radius: 50% !important;
  background: #000 !important;
}
.blog-content-template-4 .compare-table .cell-yes { color: #10B201 !important; font-weight: 600 !important; }
.blog-content-template-4 .compare-table .cell-no { color: #EE6A6A !important; font-weight: 600 !important; }
.blog-content-template-4 .compare-table td:first-child, .blog-content-template-4 .compare-table th:first-child { text-align: left !important; }
.blog-content-template-4 .compare-table td:not(:first-child), .blog-content-template-4 .compare-table th:not(:first-child) { text-align: center !important; }
.blog-content-template-4 .compare-table .cell-yes, .blog-content-template-4 .compare-table .cell-no {
  font-size: 0 !important;
  text-align: center !important;
}
.blog-content-template-4 .compare-table .cell-yes::before {
  content: '✔' !important;
  font-size: 11px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 17px !important;
  height: 17px !important;
  border-radius: 50% !important;
  background: #46CC6A !important;
  color: #fff !important;
  font-weight: 700 !important;
}
.blog-content-template-4 .compare-table .cell-no::before {
  content: '✖' !important;
  font-size: 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 17px !important;
  height: 17px !important;
  border-radius: 50% !important;
  background: #F04438 !important;
  color: #fff !important;
  font-weight: 700 !important;
}
/* 3-column company cards (from index2) */
.blog-content-template-4 .company-cards-grid {
  display: flex !important;
  gap: 1.5rem !important;
  margin: 2rem 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  scroll-snap-type: x mandatory !important;
  padding-bottom: 0 !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}
.blog-content-template-4 .company-cards-grid::-webkit-scrollbar {
  display: none !important;
}
.blog-content-template-4 .company-card-box {
  flex: 0 0 317.67px !important;
  width: 317.67px !important;
  min-width: 317.67px !important;
  scroll-snap-align: start !important;
  border: 1px solid #E9EBEA !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
  background: #fff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
  display: flex !important;
  flex-direction: column !important;
}
.blog-content-template-4 .company-card-box .card-header {
  background: var(--green-main) !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 0.875rem !important;
  padding: 0.75rem 1rem !important;
  text-align: center !important;
}
.blog-content-template-4 .company-card-box .card-body {
  padding: 1.25rem !important;
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
}
.blog-content-template-4 .company-card-box .card-logo {
  width: 80px !important;
  height: 80px !important;
  border-radius: 10px !important;
  object-fit: cover !important;
  background: var(--border) !important;
  margin: 0 0 0.75rem !important;
  display: block !important;
}
.blog-content-template-4 .company-card-box .card-name {
  font-weight: 700 !important;
  font-size: 1.125rem !important;
  text-align: left !important;
  margin: 0 0 0.5rem !important;
}
.blog-content-template-4 .company-card-box .card-rating {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  margin: 0 0 0.35rem !important;
  flex-wrap: wrap !important;
}
.blog-content-template-4 .company-card-box .card-rating-score {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.35rem !important;
  background: var(--green-main) !important;
  color: #fff !important;
  font-weight: 600 !important;
  font-size: 0.8rem !important;
  padding: 0.25rem 0.5rem !important;
  border-radius: var(--radius-sm) !important;
}
.blog-content-template-4 .company-card-box .card-rating-score .icon-star {
  width: 12px !important;
  height: 12px !important;
  fill: currentColor !important;
}
.blog-content-template-4 .company-card-box .card-rating-reviews {
  font-size: 0.8rem !important;
  color: var(--text-muted) !important;
}
.blog-content-template-4 .company-card-box .card-website {
  font-size: 0.8rem !important;
  color: #30CB65 !important;
  text-decoration: underline !important;
  text-align: left !important;
  margin: 0 0 0.35rem !important;
  display: inline-block !important;
}
.blog-content-template-4 .company-card-box .card-website:hover {
  color: #28b858 !important;
  text-decoration: underline !important;
}
.blog-content-template-4 .company-card-box .card-features {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 1rem !important;
  flex: 1 !important;
}
.blog-content-template-4 .company-card-box .card-features li {
  position: relative !important;
  padding-left: 1.75rem !important;
  margin-bottom: 0.4rem !important;
  font-size: 0.9rem !important;
  color: #46634F !important;
}
.blog-content-template-4 .company-card-box .card-features li::before {
  content: '✓' !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  background: #46634F !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 0.75rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.blog-content-template-4 .company-card-box .btn-quote {
  display: block !important;
  text-align: center !important;
  background: var(--green-main) !important;
  color: #fff !important;
  font-weight: 600 !important;
  font-size: 0.875rem !important;
  padding: 0.6rem 1rem !important;
  border-radius: var(--radius-sm) !important;
  border: none !important;
  cursor: pointer !important;
  text-decoration: none !important;
  width: 100% !important;
  margin-top: auto !important;
}
.blog-content-template-4 .company-card-box .btn-quote:hover {
  background: #3ab85d !important;
  color: #fff !important;
  text-decoration: none !important;
}
/* Compare table - dark green header */
.blog-content-template-4 .compare-table {
  width: 100% !important;
  border-collapse: collapse !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
  margin: 0 !important;
  table-layout: fixed !important;
}
.blog-content-template-4 .compare-table th, .blog-content-template-4 .compare-table td {

  box-sizing: border-box !important;
}
.blog-content-template-4 .compare-table th {
  background: #307D4B !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 0.75rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
  padding: 0.875rem 1rem !important;
  text-align: left !important;
  border: 1px solid rgba(255,255,255,0.4) !important;
}
.blog-content-template-4 .compare-table td {
  padding: 0.875rem 1rem !important;
  border: 1px solid #E9EBEA !important;
  vertical-align: middle !important;
}
.blog-content-template-4 .compare-table tbody tr:nth-child(even) { background: var(--green-50) !important; }
.blog-content-template-4 .compare-table tbody tr:nth-child(odd) { background: #fff !important; }
.blog-content-template-4 .company-cell {
  display: flex !important;
  align-items: center !important;
  gap: 0.75rem !important;
}
.blog-content-template-4 .company-cell .logo {
  width: 48px !important;
  height: 48px !important;
  border-radius: var(--radius-sm) !important;
  object-fit: cover !important;
  background: var(--border) !important;
}
.blog-content-template-4 .company-cell .name { font-weight: 700 !important; margin: 0 0 0.2rem !important; }
.blog-content-template-4 .company-cell .rating-text { font-size: 0.8rem !important; color: var(--text-muted) !important; }
.blog-content-template-4 .company-cell .stars { color: #eab308 !important; }
.blog-content-template-4 .rating-cell .company-rating, .blog-content-template-4 .company-info .company-rating {
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  font-size: 0.875rem !important;
  margin: 0 !important;
  flex-wrap: wrap !important;
}
.blog-content-template-4 .rating-cell .company-rating-badge, .blog-content-template-4 .company-info .company-rating-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.35rem !important;
  background: #46CC6A !important;
  color: #fff !important;
  font-weight: 600 !important;
  padding: 0.25rem 0.5rem !important;
  border-radius: var(--radius-sm) !important;
}
.blog-content-template-4 .rating-cell .company-rating-badge .icon-star, .blog-content-template-4 .company-info .company-rating-badge .icon-star {
  width: 14px !important;
  height: 14px !important;
  flex-shrink: 0 !important;
  fill: currentColor !important;
}
.blog-content-template-4 .rating-cell .company-rating-reviews, .blog-content-template-4 .company-info .company-rating-reviews {
  color: #718076 !important;
}
.blog-content-template-4 .rating-cell .rating-image {
  display: block !important;
  max-width: 100% !important;
  width: 84px !important;
  height: auto !important;
  border-radius: var(--radius-sm) !important;
  margin-bottom: 0.5rem !important;
  object-fit: cover !important;
}
.blog-content-template-4 .btn-quote {
  display: inline-block !important;
  max-width: 150px !important;
  background: var(--green-main) !important;
  color: #fff !important;
  font-weight: 600 !important;
  font-size: 0.8rem !important;
  padding: 0.5rem 0.85rem !important;
  border-radius: var(--radius-sm) !important;
  text-decoration: none !important;
  text-align: center !important;
  box-sizing: border-box !important;
}
.blog-content-template-4 .btn-quote:hover { background: #3ab85d !important; color: #fff !important; text-decoration: none !important; }
/* Company review block */
.blog-content-template-4 .company-review-block { margin: 3rem 0 !important; }
.blog-content-template-4 .company-review-block h2 { margin: 0 0 1rem !important; }
.blog-content-template-4 .company-review-divider { height: 1px !important; background: var(--border) !important; margin: 2rem 0 !important; }
.blog-content-template-4 .company-intro-block {
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  padding: 1.25rem 1.5rem !important;
  margin-bottom: 1rem !important;
}
.blog-content-template-4 .company-intro-image {
  max-width: 206px !important;
  width: auto !important;
  max-height: 60px !important;
  height: auto !important;
  flex-shrink: 0 !important;
  border-radius: var(--radius-sm) !important;
  object-fit: cover !important;
}
.blog-content-template-4 .company-card {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  flex-wrap: wrap !important;
}
.blog-content-template-4 .company-card-main {
  display: flex !important;
  align-items: flex-start !important;
  gap: 1rem !important;
}
.blog-content-template-4 .company-logo {
  width: 56px !important;
  height: 56px !important;
  border-radius: var(--radius-sm) !important;
  object-fit: cover !important;
  background: var(--border) !important;
}
.blog-content-template-4 .company-info h3 { margin: 0 0 0.25rem !important; font-size: 1.5rem !important; font-weight: 700 !important; }
.blog-content-template-4 .company-rating { margin: 0 !important; }
.blog-content-template-4 .company-intro-block .company-info .company-website { margin-bottom: 20px !important; }
.blog-content-template-4 .company-intro-block .company-info .company-rating { margin-top: 20px !important; }
.blog-content-template-4 .company-intro-block > p { margin-top: 20px !important; }
.blog-content-template-4 .btn-phone {
  display: inline-block !important;
  margin-left: 0.75rem !important;
  font-size: 0.9rem !important;
  background: #F5FFF9 !important;
  color: #3AAF5A !important;
  padding: 0.4rem 0.75rem !important;
  border-radius: var(--radius-sm) !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}
.blog-content-template-4 .btn-phone:hover {
  background: #e8f9ef !important;
  color: #2d8f48 !important;
}
.blog-content-template-4 .company-meta-cards {
  display: flex !important;
  gap: 0.75rem !important;
  margin-top: 1rem !important;
}
.blog-content-template-4 .company-meta-cards .meta-card {
  flex: 0 0 125px !important;
  width: 125px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm, 4px) !important;
  padding: 10px !important;
  background: #fff !important;
}
.blog-content-template-4 .company-meta-cards .meta-card-label {
  font-size: 12px !important;
  color: var(--text-muted, #718076) !important;
  font-weight: 400 !important;
  margin: 0 0 0.2rem !important;
}
.blog-content-template-4 .company-meta-cards .meta-card-value {
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  color: var(--text, #1a1a1a) !important;
  margin: 0 !important;
}
/* Accordion */
.blog-content-template-4 .accordion {
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
  margin-bottom: 0.5rem !important;
}
.blog-content-template-4 .accordion summary {
  list-style: none !important;
  padding: 1rem 1.25rem !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  background: #fff !important;
  user-select: none !important;
}
.blog-content-template-4 .accordion summary::-webkit-details-marker { display: none !important; }
.blog-content-template-4 .accordion summary::after {
  content: '' !important;
  width: 0 !important;
  height: 0 !important;
  border-left: 5px solid transparent !important;
  border-right: 5px solid transparent !important;
  border-top: 6px solid var(--green-600) !important;
  transition: transform 0.2s !important;
}
.blog-content-template-4 .accordion[open] summary::after { transform: rotate(180deg) !important; }
.blog-content-template-4 .accordion summary .trust-summary-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
}
.blog-content-template-4 .accordion summary .trust-summary-logo {
  width: 24px !important;
  height: 24px !important;
  object-fit: contain !important;
  flex-shrink: 0 !important;
}
.blog-content-template-4 .accordion .accordion-body {
  padding: 0 1.25rem 1.25rem !important;
  border-top: 1px solid var(--border) !important;
}
.blog-content-template-4 .accordion .accordion-body p { margin: 0.75rem 0 0 !important; }
.blog-content-template-4 .accordion .accordion-body .learn-more { margin: 0.75rem 0 0 !important; }
.blog-content-template-4 .accordion .accordion-body .link-brand-900 { color: var(--brand-900) !important; font-weight: 500 !important; }
.blog-content-template-4 .accordion .accordion-body .link-brand-900:hover { text-decoration: underline !important; }
/* Consumer Sentiment Index - 3 phần: trên (gauge + insights), giữa (biểu đồ ngang), dưới (tóm tắt) */
.blog-content-template-4 .sentiment-index { padding: 0 !important; }
.blog-content-template-4 .sentiment-index .sentiment-top {
  display: flex !important;
  gap: 0 !important;
  align-items: stretch !important;
  margin-bottom: 1rem !important;
}
.blog-content-template-4 .sentiment-index .sentiment-score-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0.35rem !important;
  padding-right: 1.5rem !important;
  border-right: 1px solid var(--border) !important;
}
.blog-content-template-4 .sentiment-index .sentiment-gauge-wrap {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0.25rem !important;
}
.blog-content-template-4 .sentiment-index .sentiment-gauge {
  position: relative !important;
  width: 120px !important;
  height: 80px !important;
  flex-shrink: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-end !important;
}
.blog-content-template-4 .sentiment-index .sentiment-gauge svg {
  display: block !important;
  width: 100% !important;
  height: 52px !important;
  margin-bottom: 2px !important;
}
.blog-content-template-4 .sentiment-index .sentiment-gauge-dot {
  fill: var(--green-800) !important;
}
.blog-content-template-4 .sentiment-index .sentiment-gauge .sentiment-score-value {
  font-size: 36px !important;
  font-weight: 700 !important;
  fill: var(--text) !important;
  font-family: inherit !important;
}
.blog-content-template-4 .sentiment-index .sentiment-gauge-info {
  position: absolute !important;
  top: 18px !important;
  right: 0 !important;
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  border: 1px solid var(--border) !important;
  background: #fff !important;
  color: var(--text-muted) !important;
  font-size: 0.7rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
}
.blog-content-template-4 .sentiment-index .sentiment-score-label, .blog-content-template-4 .sentiment-index .sentiment-insights-label {
  font-size: 0.8rem !important;
  color: var(--text-muted) !important;
}
.blog-content-template-4 .sentiment-index .sentiment-insights-wrap {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.25rem !important;
  padding-left: 1.5rem !important;
  justify-content: center !important;
}
.blog-content-template-4 .sentiment-index .sentiment-insights-row {
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
}
.blog-content-template-4 .sentiment-index .sentiment-insights-value {
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  color: var(--text) !important;
  line-height: 1.2 !important;
}
.blog-content-template-4 .sentiment-index .sentiment-insights-icon {
  width: 28px !important;
  height: 28px !important;
  flex-shrink: 0 !important;
  color: var(--green-600) !important;
}
.blog-content-template-4 .sentiment-index .sentiment-divider {
  height: 1px !important;
  background: var(--border) !important;
  margin: 1rem 0 !important;
}
.blog-content-template-4 .sentiment-index .sentiment-mid-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--text) !important;
  margin: 0 0 0.75rem !important;
}
.blog-content-template-4 .sentiment-index .sentiment-category {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
  margin-bottom: 0 !important;
  padding: 6px 0 !important;
}
.blog-content-template-4 .sentiment-index .sentiment-category:last-of-type { margin-bottom: 0 !important; }
.blog-content-template-4 .sentiment-index .sentiment-category-label {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  width: 223px !important;
  flex-shrink: 0 !important;
}
.blog-content-template-4 .sentiment-index .sentiment-category-name {
  font-size: 0.875rem !important;
  font-weight: 700 !important;
  color: var(--text) !important;
  margin: 0 !important;
}
.blog-content-template-4 .sentiment-index .sentiment-category-info {
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  border: 1px solid var(--border) !important;
  background: #fff !important;
  color: var(--text-muted) !important;
  font-size: 0.7rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
  flex-shrink: 0 !important;
}
.blog-content-template-4 .sentiment-index .sentiment-bar {
  display: flex !important;
  flex: 1 !important;
  min-width: 0 !important;
  height: 16px !important;
  border-radius: 4px !important;
  overflow: hidden !important;
  background: var(--border) !important;
}
.blog-content-template-4 .sentiment-index .sentiment-bar-seg {
  height: 100% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  min-width: 0 !important;
}
.blog-content-template-4 .sentiment-index .sentiment-bar-seg.positive { background: #46CC6A !important; flex: 0 0 84% !important; }
.blog-content-template-4 .sentiment-index .sentiment-bar-seg.neutral { background: #FDB022 !important; flex: 0 0 6% !important; }
.blog-content-template-4 .sentiment-index .sentiment-bar-seg.negative { background: #D92D20 !important; flex: 0 0 10% !important; }
.blog-content-template-4 .sentiment-index .sentiment-summary {
  font-size: 0.9rem !important;
  color: var(--text) !important;
  margin: 1rem 0 0 !important;
  line-height: 1.5 !important;
}
/* Pros & Cons */
.blog-content-template-4 .pros-cons { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 1.5rem !important; margin-top: 0.75rem !important; }
.blog-content-template-4 .pros-list, .blog-content-template-4 .cons-list { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.blog-content-template-4 .pros-list li, .blog-content-template-4 .cons-list li {
  padding-left: 28px !important;
  margin-bottom: 0.5rem !important;
  position: relative !important;
}
.blog-content-template-4 .pros-list li::before, .blog-content-template-4 .cons-list li::before {
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0.65rem !important;
  font-weight: 700 !important;
}
.blog-content-template-4 .pros-list li::before {
  content: '✓' !important;
  color: #10B201 !important;
  background: rgba(16, 178, 1, 0.2) !important;
}
.blog-content-template-4 .cons-list li::before {
  content: '✕' !important;
  color: #EE6A6A !important;
  background: rgba(238, 104, 104, 0.2) !important;
}
/* Tables - green header */
.blog-content-template-4 .cost-table, .blog-content-template-4 .price-table {
  width: 100% !important;
  border-collapse: collapse !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
  margin: 1.5rem 0 !important;
  box-shadow: 0 0 0 1px #E9EBEA, 0 1px 3px rgba(0,0,0,0.06) !important;
}
.blog-content-template-4 .cost-table th, .blog-content-template-4 .price-table th {
  background: #307D4B !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 0.75rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
  padding: 0.875rem 1rem !important;
  text-align: center !important;
  border: 1px solid rgba(255,255,255,0.4) !important;
}
.blog-content-template-4 .cost-table.cost-table-dark-header th { background: #307D4B !important; }
.blog-content-template-4 .cost-table-3cols { table-layout: fixed !important; }
.blog-content-template-4 .cost-table-3cols th, .blog-content-template-4 .cost-table-3cols td { width: 33.33% !important; box-sizing: border-box !important; }
.blog-content-template-4 .cost-table td, .blog-content-template-4 .price-table td {
  padding: 0.875rem 1rem !important;
  border: 1px solid #E9EBEA !important;
  text-align: center !important;
}
.blog-content-template-4 .cost-table tbody tr:nth-child(even), .blog-content-template-4 .price-table tbody tr:nth-child(even) { background: var(--green-50) !important; }
.blog-content-template-4 .cost-table tbody tr:nth-child(odd), .blog-content-template-4 .price-table tbody tr:nth-child(odd) { background: #fff !important; }
/* Costs and Services (Figma) */
.blog-content-template-4 .costs-services-header {
  background: var(--green-800) !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 0.75rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
  padding: 0.875rem 1rem !important;
  margin: 12px 0 0 !important;
  border-radius: var(--radius) var(--radius) 0 0 !important;
}
.blog-content-template-4 .costs-services-table {
  width: 100% !important;
  border-collapse: collapse !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
  margin: 12px 0 0 !important;
  box-shadow: 0 0 0 1px #E9EBEA, 0 1px 3px rgba(0,0,0,0.06) !important;
  table-layout: fixed !important;
}
.blog-content-template-4 .costs-services-table th {
  background: #46CC6A !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 0.75rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
  padding: 0.875rem 1rem !important;
  text-align: center !important;
  border: 1px solid rgba(255,255,255,0.4) !important;
}
.blog-content-template-4 .costs-services-table td {
  width: 50% !important;
  padding: 0.875rem 1rem !important;
  border: 1px solid #E9EBEA !important;
  vertical-align: middle !important;
  text-align: center !important;
}
.blog-content-template-4 .costs-services-table tbody tr:nth-child(even) { background: var(--green-50) !important; }
.blog-content-template-4 .costs-services-table tbody tr:nth-child(odd) { background: #fff !important; }
.blog-content-template-4 .costs-services-intro {
  margin: 24px 0 !important;
  font-size: 0.9rem !important;
  color: var(--text) !important;
}
.blog-content-template-4 .services-checklist { list-style: none !important; padding: 0 !important; margin: 12px 0 0 !important; }
.blog-content-template-4 .services-checklist li {
  position: relative !important;
  padding-left: 28px !important;
  margin-bottom: 0.5rem !important;
}
.blog-content-template-4 .services-checklist li::before {
  content: '✓' !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0.65rem !important;
  font-weight: 700 !important;
  color: #10B201 !important;
  background: rgba(16, 178, 1, 0.2) !important;
}
/* Numbered list - green square */
.blog-content-template-4 .numbered-list { list-style: none !important; padding: 0 !important; margin: 1rem 0 !important; }
.blog-content-template-4 .numbered-list li {
  position: relative !important;
  padding-left: 36px !important;
  margin-bottom: 1rem !important;
}
.blog-content-template-4 .numbered-list .num {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 28px !important;
  height: 28px !important;
  font-size: 0.85rem !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--text) !important;
}
.blog-content-template-4 .numbered-list strong { display: inline !important; font-weight: 700 !important; }
/* Bullet list - green dash */
.blog-content-template-4 .bullet-list { list-style: none !important; padding: 0 !important; margin: 1rem 0 !important; }
.blog-content-template-4 .bullet-list li {
  position: relative !important;
  padding-left: 1.5rem !important;
  margin-bottom: 0.5rem !important;
}
.blog-content-template-4 .bullet-list li::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  top: 0.6em !important;
  width: 8px !important;
  height: 2px !important;
  background: var(--green-dark) !important;
}
/* FAQ */
.blog-content-template-4 .faq-item {
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
  margin-bottom: 0.5rem !important;
}
.blog-content-template-4 .faq-item summary {
  list-style: none !important;
  padding: 1rem 1.25rem !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  background: #fff !important;
}
.blog-content-template-4 .faq-item summary::-webkit-details-marker { display: none !important; }
.blog-content-template-4 .faq-item summary::after {
  content: '' !important;
  width: 0 !important;
  height: 0 !important;
  border-left: 5px solid transparent !important;
  border-right: 5px solid transparent !important;
  border-top: 6px solid var(--green-600) !important;
  transition: transform 0.2s !important;
}
.blog-content-template-4 .faq-item[open] summary::after { transform: rotate(180deg) !important; }
.blog-content-template-4 .faq-item .faq-answer { padding: 0 1.25rem 1.25rem !important; border-top: 1px solid var(--border) !important; }
.blog-content-template-4 .faq-item .faq-answer p { margin: 0.75rem 0 0 !important; }
.blog-content-template-4 .table-responsive {
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
  margin: 1.5rem 0 !important;
  border: 1px solid #E9EBEA !important;
  border-radius: var(--radius) !important;
}
.blog-content-template-4 .table-responsive table {
  margin: 0 !important;
  width: max-content !important;
  min-width: 100% !important;
}
.blog-content-template-4 .table-responsive .compare-table, .blog-content-template-4 .table-responsive .price-table, .blog-content-template-4 .table-responsive .cost-table { margin: 0 !important; }
.blog-content-template-4 .section-divider {
  height: 4px !important;
  background: #307D4B !important;
  margin: 48px 0 !important;
}
@media (max-width: 640px) {

.blog-content-template-4 {
    padding: 40px 8px 80px !important;
  }
.blog-content-template-4 .sentiment-index .sentiment-top {
    flex-direction: column !important;
    align-items: stretch !important;
  }
.blog-content-template-4 .sentiment-index .sentiment-score-wrap {
    align-items: flex-start !important;
    border-right: none !important;
    padding-right: 0 !important;
    padding-bottom: 1rem !important;
    margin-bottom: 0 !important;
    border-bottom: 1px solid var(--border) !important;
  }
.blog-content-template-4 .sentiment-index .sentiment-gauge-wrap {
    align-items: flex-start !important;
  }
.blog-content-template-4 .sentiment-index .sentiment-insights-wrap {
    padding-left: 0 !important;
    margin: 20px 0 !important;
  }
.blog-content-template-4 .sentiment-index .sentiment-category {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0.5rem !important;
  }
.blog-content-template-4 .sentiment-index .sentiment-category-label {
    width: auto !important;
  }
.blog-content-template-4 .sentiment-index .sentiment-bar {
    width: 100% !important;
  }
.blog-content-template-4 .pros-cons {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
.blog-content-template-4 .table-responsive {
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }
.blog-content-template-4 .table-responsive::-webkit-scrollbar {
    display: none !important;
  }
.blog-content-template-4 .trust-list li {
    font-size: 16px !important;
  }
.blog-content-template-4 .company-meta-cards {
    flex-wrap: wrap !important;
  }
.blog-content-template-4 .company-meta-cards .meta-card {
    flex: 0 1 auto !important;
    width: fit-content !important;
    min-width: 0 !important;
  }
.blog-content-template-4 .highlight-cards {
    grid-template-columns: 1fr !important;
  }
.blog-content-template-4 .company-card-box {
    flex: 0 0 280px !important;
    width: 280px !important;
    min-width: 280px !important;
  }
}