 .blog_inner {
     font-size: 15px;
     color: #333;
     background: #fff;
     min-height: 100vh;
 }

 /* ── Layout ── */
 .blog_inner .bi-container {
     max-width: 1400px;
     margin: 0 auto;
     padding: 30px 20px;
     display: grid;
     grid-template-columns: 360px minmax(0, 1fr);
     align-items: start;
     gap: 36px;
 }

 /* ── SIDEBAR ── */
 .blog_inner .bi-sidebar {
     width: 100%;
 }

 .blog_inner .bi-sidebar-section {
     margin-bottom: 32px;
 }

 .blog_inner .bi-sidebar-title {
     font-size: 24px;
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: 0.08em;
     color: #111;
     margin-bottom: 14px;
     padding-bottom: 8px;
     border-bottom: 2px solid #e8e8e8;
 }

 /* Recent Posts */
 .blog_inner .bi-recent-post {
     display: flex;
     gap: 10px;
     align-items: flex-start;
     margin-bottom: 14px;
     text-decoration: none;
 }

 .blog_inner .bi-recent-post img {
     width: 60px;
     height: 56px;
     object-fit: cover;
     border-radius: 3px;
     flex-shrink: 0;
 }

 .blog_inner .bi-recent-post-info h4 {
     font-size: 14px;
     font-weight: 400;
     line-height: 1.4;
     color: #1a1a1a;
     margin-bottom: 3px;
 }

 .blog_inner .bi-recent-post-info span {
     font-size: 12px;
     color: #999;
 }

 /* Tags */
 .blog_inner .bi-tags {
     display: flex;
     flex-wrap: wrap;
     gap: 6px;
 }

 .blog_inner .bi-tag {
     font-size: 13.13px;
     color: #555;
     background: #f4f4f4;
     border: 1px solid #e0e0e0;
     border-radius: 40px;
     padding: 4px 10px;
     text-decoration: none;
     transition: background 0.2s;
 }

 .blog_inner .bi-tag:hover {
     background: #e8e8e8;
 }

 /* Categories */
 .blog_inner .bi-categories ul {
     list-style: none;
 }

 .blog_inner .bi-categories li {
     padding: 5px 0;
     border-bottom: 1px solid #f0f0f0;
     font-size: 14px;
     color: #555;
 }

 .blog_inner .bi-categories li a {
     color: #555;
     text-decoration: none;
     transition: color 0.2s;
 }

 .blog_inner .bi-categories li a:hover {
     color: #c8873f;
 }

 /* ── MAIN CONTENT ── */
 .blog_inner .bi-main {
     flex: 1;
     min-width: 0;
 }

 /* Hero Image */
 .blog_inner .bi-hero-img {
     width: 100%;
     height: 660px;
     object-fit: cover;
     border-radius: 4px;
     display: block;
     margin-bottom: 22px;
 }

 /* Post Meta */
 .blog_inner .bi-meta {
     display: flex;
     align-items: center;
     gap: 14px;
     margin-bottom: 12px;
 }

 .blog_inner .bi-author {
     display: flex;
     align-items: center;
     gap: 7px;
 }

 .blog_inner .bi-author img {
     width: 28px;
     height: 28px;
     border-radius: 50%;
     object-fit: cover;
 }

 .blog_inner .bi-author-name {
     font-size: 12.5px;
     font-weight: 600;
     color: #333;
 }

 .blog_inner .bi-meta-divider {
     width: 1px;
     height: 14px;
     background: #ccc;
 }

 .blog_inner .bi-meta span {
     font-size: 16px;
     color: #999;
 }

 .blog_inner .bi-meta-badge {
     font-size: 11px;
     font-weight: 600; 
     color: #fff;
     padding: 3px 10px;
     border-radius: 2px;
     text-transform: uppercase;
     letter-spacing: 0.04em;
 }

 /* Post Title */
 .blog_inner .bi-post-title {

     font-size: 32px;
     font-weight: 700;
     line-height: 1.25;
     color: #1a1a1a;
     margin-bottom: 16px;
 }

 /* Post Body */
 .blog_inner .bi-post-body p {
     font-size: 15.51px;
     line-height: 1.75;
     color: #555;
     margin-bottom: 14px;
 }

 /* ── Related Posts Grid ── */
 .blog_inner .bi-related {
     margin-top: 36px;
 }

 .blog_inner .bi-related--full {
     grid-column: 1 / -1;
     margin-top: 12px;
 }

 .blog_inner .bi-related-title {
     font-size: 26px;
     font-weight: 700;
     line-height: 1.2;
     color: #1a1a1a;
     margin-bottom: 18px;
 }

 .blog_inner .bi-related-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 20px;
 }

 .blog_inner .bi-related-card img {
     width: 100%;
     height: 280px;
     object-fit: cover;
     border-radius: 4px;
     display: block;
     margin-bottom: 10px;
 }

 .blog_inner .bi-related-card h3 {

     font-size: 14px;
     font-weight: 700;
     line-height: 1.4;
     color: #1a1a1a;
     margin-bottom: 6px;
 }

 .blog_inner .bi-related-card p {
     font-size: 12px;
     line-height: 1.6;
     color: #888;
     margin-bottom: 8px;
     display: -webkit-box;
     -webkit-line-clamp: 3;
     -webkit-box-orient: vertical;
     overflow: hidden;
 }

 .blog_inner .bi-read-more {
     font-size: 12px;
     font-weight: 600;
     color: #c8873f;
     text-decoration: none;
     letter-spacing: 0.02em;
 }

 .blog_inner .bi-read-more:hover {
     text-decoration: underline;
 }

 .bi-categories ul {
     padding-left: 0px;
 }

 .bi-tags::before, .bi-tag::before, .bi-meta::before {
     display: none;
 }

 /* ══ RESPONSIVE ══ */
 @media (max-width: 860px) {
     .blog_inner .bi-container {
         grid-template-columns: 1fr;
     }

     .blog_inner .bi-sidebar {
         width: 100%;
         display: grid;
         grid-template-columns: repeat(2, 1fr);
         gap: 24px;
     }

     .blog_inner .bi-sidebar-section {
         margin-bottom: 0;
     }
 }

 @media (max-width: 600px) {
     .blog_inner .bi-sidebar {
         grid-template-columns: 1fr;
     }

     .blog_inner .bi-hero-img {
         height: 200px;
     }

     .blog_inner .bi-post-title {
         font-size: 22px;
     }

     .blog_inner .bi-related-grid {
         grid-template-columns: 1fr;
     }
 }

 @media (max-width: 420px) {
     .blog_inner .bi-related-grid {
         grid-template-columns: 1fr;
     }
 }
