.blog-container {
  max-width: 850px;
  margin: auto;
  padding: 20px;
  line-height: 1.7;
  color: #1b2c66;
}

.blog-container h1, .blog-container h2, .blog-container h3 {
  color: #0f1b4c;
  font-weight: 700;
  margin-top: 40px;
  margin-bottom: 16px;
}

.blog-container p {
  font-size: 17px;
  color: #4a5a88;
  margin-bottom: 16px;
}

.blog-container ul, .blog-container ol {
  padding-left: 22px;
  margin-bottom: 20px;
}

.blog-container ul li, .blog-container ol li {
  margin-bottom: 8px;
  font-size: 16px;
}

.blog-highlight-box {
  background: #f8faff;
  border-left: 5px solid #3658ff;
  padding: 14px 18px;
  border-radius: 8px;
  margin: 18px 0;
  font-size: 16px;
}

.blog-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
  margin: 15px 0;
}

.blog-table th, .blog-table td {
  border: 1px solid #d9e3ff;
  padding: 10px 12px;
}

.blog-table th {
  background: #edf2ff;
  font-weight: 600;
}

.blog-cta {
  background: #e8f5ff;
  padding: 18px;
  border-radius: 12px;
  margin-top: 30px;
  text-align: center;
  border: 1px solid #cfe3ff;
}

.blog-cta a.button {
  display: inline-block;
  background: #0cb36c;
  padding: 12px 22px;
  font-weight: 600;
  border-radius: 8px;
  color: #fff;
  text-decoration: none;
}

.blog-page {
  display: flex;
  gap: 30px;
  align-items: flex-start;
}

/* MAIN */
.blog-content {
  flex: 3;
}

/* SIDEBAR */
.blog-sidebar {
  flex: 1.2;
}

/* BLOG MAIN CONTENT */
.blog-container {
  max-width: 820px;
  line-height: 1.7;
  color: #1c244b;
  font-size: 17px;
}

.blog-container h1 {
  font-size: 32px;
  font-weight: 800;
  color: #0e1a44;
  margin-bottom: 14px;
}

.blog-container h2 {
  font-size: 24px;
  font-weight: 700;
  margin-top: 40px;
  margin-bottom: 14px;
  color: #0e1a44;
}

.blog-container p { margin-bottom: 12px; }

/* NOTES */
.blog-note, .blog-warning {
  background: #f6f9ff;
  border-left: 6px solid #3658ff;
  padding: 14px;
  border-radius: 10px;
  margin: 20px 0;
}
.blog-warning {
  background: #fff8f8;
  border-left-color: #ff4b4b;
}

/* STEPS */
.blog-steps {
  display: flex; flex-direction: column; gap: 12px;
}
.blog-step-item {
  background: #fff;
  border: 1px solid #e1e7ff;
  padding: 12px 14px;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.04);
}

/* TABLE */
.blog-table {
  width: 100%;
  border-collapse: collapse;
}
.blog-table th {
  background: #eaf1ff;
  padding: 12px;
  border: 1px solid #d4defc;
}
.blog-table td {
  border: 1px solid #d4defc;
  padding: 12px;
}

/* CTA */
.blog-cta {
  background: #f0f8ff;
  border: 1px solid #cfe6ff;
  padding: 18px;
  border-radius: 14px;
  text-align: center;
}
.cta-btn {
  display: inline-block;
  background: #0bb36b;
  padding: 11px 20px;
  color: #fff;
  border-radius: 7px;
  text-decoration: none;
  font-weight: 600;
}

/* SIDEBAR WIDGET */
.sidebar-widget {
  background: #fff;
  padding: 20px;
  border-radius: 14px;
  border: 1px solid #e4e9ff;
  margin-bottom: 22px;
  box-shadow: 0 4px 12px rgba(60, 92, 255, 0.05);
}
.sidebar-widget h3 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 14px;
  color: #0e1a44;
}

.sidebar-search input, .sidebar-search button {
  width: 100%;
  padding: 12px;
  border-radius: 10px;
  border: 1px solid #cdd6ff;
}
.sidebar-search button {
  margin-top: 8px; background: #3658ff; color: #fff; font-weight: 600;
}

/* SOCIAL */
.social-links a {
  display: block;
  padding: 10px;
  background: #f6f8ff;
  margin-bottom: 8px;
  border-radius: 10px;
  text-decoration: none;
  border: 1px solid #d9e3ff;
}
.social-links a:hover { background: #e8efff; }

/* Tags */
.tag-cloud a {
  display: inline-block;
  background: #f6f8ff;
  padding: 6px 12px;
  margin: 4px;
  border-radius: 8px;
  border: 1px solid #d9e3ff;
}
.tag-cloud a:hover { background: #3658ff; color: #fff; }
/* Layout wrapper */
.blog-wrapper {
  display: flex;
  flex-direction: column;
  gap: 25px;
}

/* Main Content */
.blog-main {
  width: 100%;
}

/* Sidebar default mobile stack */
.blog-sidebar {
  width: 100%;
}

/* Desktop layout */
@media(min-width: 992px) {
  .blog-wrapper {
    flex-direction: row;
    gap: 35px;
  }
  .blog-main {
    flex: 3;
  }
  .blog-sidebar {
    flex: 1.2;
    max-width: 320px;
  }
}

/* Blog Container */
.blog-container {
  padding: 8px;
  line-height: 1.65;
  font-size: 17px;
}

/* Responsive headings */
.blog-container h1 {
  font-size: 28px;
  font-weight: 800;
}
@media(min-width:768px){
  .blog-container h1 { font-size: 32px; }
}
.blog-container h2 {
  font-size: 21px;
  font-weight: 700;
  margin-top: 30px;
  margin-bottom: 10px;
}
@media(min-width:768px){
  .blog-container h2 { font-size: 24px; }
}

/* Notes */
.blog-note, .blog-warning {
  background: #f6f9ff;
  padding: 12px;
  border-left: 5px solid #3658ff;
  border-radius: 8px;
  margin: 18px 0;
  font-size: 15px;
}
.blog-warning { background:#fff8f7;border-left-color:#ff4b4b; }

/* Lists */
.blog-list { padding-left:18px; }
.blog-list li { margin-bottom:6px; }

/* Steps */
.blog-steps { display:flex;flex-direction:column;gap:10px; }
.blog-step-item {
  background:#fff;
  border:1px solid #e1e7ff;
  padding:10px;
  border-radius:8px;
  font-size:15px;
}

/* Table */
.blog-table {
  width:100%;
  border-collapse:collapse;
  font-size:14px;
}
.blog-table th {
  background:#eaf1ff;
  padding:10px;
  border:1px solid #d4defc;
}
.blog-table td {
  border:1px solid #d4defc;
  padding:10px;
}

/* CTA */
.blog-cta {
  background:#f0f8ff;
  padding:15px;
  text-align:center;
  border-radius:12px;
  border:1px solid #cfe6ff;
}
.cta-btn {
  background:#0bb36b;
  padding:10px 18px;
  border-radius:7px;
  color:#fff;
  font-size:15px;
  display:inline-block;
}

/* Sidebar widgets responsive */
.sidebar-widget {
  background:#fff;
  padding:18px;
  border-radius:14px;
  margin-bottom:20px;
  border:1px solid #e4e9ff;
  box-shadow:0 3px 10px rgba(60,92,255,.05);
}
.sidebar-widget h3 {
  font-size:17px;
  font-weight:700;
  margin-bottom:12px;
}

.sidebar-search input,
.sidebar-search button {
  width:100%;
  padding:12px;
  font-size:15px;
  border-radius:10px;
}
.sidebar-search button { background:#3658ff;color:#fff;font-weight:600;border:none;margin-top:8px; }

/* Social links */
.social-links a {
  display:block;
  padding:10px;
  margin-bottom:8px;
  border-radius:10px;
  background:#f6f8ff;
  border:1px solid #d9e3ff;
  font-size:15px;
}
.social-links a:hover { background:#e9efff; }

/* Tags */
.tag-cloud a {
  display:inline-block;
  padding:6px 10px;
  border-radius:8px;
  background:#f6f8ff;
  margin:4px;
  border:1px solid #d9e3ff;
  font-size:14px;
}
.tag-cloud a:hover { background:#3658ff;color:#fff; }