/* ===============================================================
   BLOG RESPONSIVE STYLES
   =============================================================== */
/* Common Responsive Font Size Overrides */
@media (max-width: 991px) {
  /* Common 16px overrides */
  .blog-title{ font-size: 16px; }
  /* Common 15px/13px overrides */
  .new-blog-overlay h3, .blog-card .blog-excerpt{ font-size: 15px; }
  .new-blog-overlay p{ font-size: 13px; }
  /* Common 10px overrides */
  .horizontal-blog-card .blog-meta > div .text-sm, .blog-card .blog-meta > div .text-sm, .horizontal-blog-card .blog-author-info{ font-size: 10px; } }
  @media (max-width: 768px) {
  /* Common 16px mobile overrides */
  .blog-title, .goz-atin-blog-title{ font-size: 16px; }
  /* Common 14px mobile overrides */
  .blog-card .blog-excerpt, .comment p{ font-size: 14px; }
  /* Common 13px mobile overrides */
  .blog-card .blog-author-info > div:first-child, .blog-author-separator, .blog-author-section p{ font-size: 13px; }
  /* Common 12px mobile overrides */
  .blog-card .blog-author-info > div:last-child{ font-size: 12px; } }
  /* ===============================================================
     TABLET & BELOW (max-width: 1199.98px)
     =============================================================== */
  @media (max-width: 1199.98px) {
  .blog-detail-left{ top: 80px; padding: 0; }
  .toc-section, .share-section{ margin-bottom: 24px; }
  /* Tablet grid - daha dar kolonlar */
  .blog-detail-grid{
    grid-template-columns: 200px 1fr 260px;
    gap: 24px;
  }
  .blog-detail-toc{
    width: 200px;
    max-width: 200px;
  }
  .blog-detail-sidebar{
    width: 260px;
    max-width: 260px;
  }
}
  /* ===============================================================
       TABLET BREAKPOINT (769px to 1025px)
       =============================================================== */
  @media (min-width: 769px) and (max-width: 1025px) {
  /* Blog Slider Tablet Styles */
  #blog-slider{ padding: 0 0 60px 0; }
  .blog-slider-container, .blog-slide.active .blog-slide-content{ gap: 20px; }
  /* Closed (Minimized) State - Tablet */
  .blog-slide:not(.active){ height: 180px; padding: 20px; flex-direction: row; align-items: center; gap: 0; }
  .blog-slide:not(.active) .blog-slide-image-wrapper{ width: calc(100% - 40px); height: 140px; border-radius: 20px; position: absolute; left: 20px; top: 20px; right: auto; }
  .blog-slide:not(.active) .blog-slide-image{ width: 100%; height: 100%; border-radius: 20px; }
  .blog-slide:not(.active) .blog-slide-overlay{ left: 25px; top: 30px; width: calc(100% - 80px); max-width: none; gap: 12px; opacity: 1; pointer-events: auto; }
  .blog-slide:not(.active) .blog-slide-overlay svg{ width: 28px; height: 28px; }
  .blog-slide:not(.active) .blog-slide-content .blog-title{ left: 32px; top: 70px;
  /* overlay top (30px) + svg height (28px) + gap (12px) */ width: calc(100% - 80px); max-width: none; font-weight: 800; font-size: 18px; line-height: 1.33; color: var(--bg-light); margin: 0; }
  .blog-slide:not(.active) .blog-slide-overlay p{ font-weight: 400; font-size: 14px; line-height: 2.00; color: var(--bg-light); margin: 0; }
  /* Open (Expanded) State - Tablet */
  .blog-slide.active{ padding: 24px; flex-direction: column; gap: 20px; align-items: start; height: fit-content; }
  .blog-slide.active .blog-slide-image-wrapper{ width: 100%; height: 280px; border-radius: 22px; }
  .blog-slide.active .blog-slide-image{ width: 100%; height: 100%; border-radius: 22px; }
  .blog-slide.active .blog-slide-header{ gap: 18px; }
  .blog-slide.active .blog-slide-content .blog-title{ font-size: 26px; }
  .blog-slide.active .blog-slide-description{ font-size: 16px; }
  .blog-slide.active .blog-slide-content .blog-slide-header > div:first-child > div{ padding: 10px; }
  .blog-slide.active .blog-slide-content .blog-slide-header > div:first-child > div .text-sm{ font-size: 12px; }
  /* Hide overlay when active */
  .blog-slide.active .blog-slide-overlay{ opacity: 0; pointer-events: none; } }
  /* ===============================================================
       TABLET & BELOW (max-width: 1025px)
       =============================================================== */
  @media (max-width: 1025px) {
  #blog-slider{ padding: 0 0 50px 0; }
  .blog-slider-container{ flex-direction: column; gap: 16px; }
  .blog-slide{ width: 100% !important; height: 280px; flex-direction: column; padding: 20px; gap: 20px; }
  .blog-slide.active .blog-slide-image-wrapper{ width: 100%; height: 200px; border-radius: 16px; }
  .blog-slide.active .blog-slide-image, .blog-slide:not(.active) .blog-slide-image-wrapper, .blog-slide:not(.active) .blog-slide-image{ border-radius: 16px; }
  .blog-slide-content{ gap: 20px; }
  .blog-slide-content .blog-title{ font-size: 24px; }
  .blog-slide-description{ font-size: 14px; }
  .blog-slide:not(.active){ padding: 12px; }
  .blog-slide-overlay{ left: 24px; top: 140px; width: calc(100% - 48px); } }
  /* ===============================================================
       TABLET & BELOW (max-width: 1024px)
       =============================================================== */
  @media (max-width: 1024px) {
  #new-blogs{ overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
  /* Firefox */ -ms-overflow-style: none;
  /* IE and Edge */ }
  #new-blogs::-webkit-scrollbar, .new-blogs-grid::-webkit-scrollbar{ display: none; }
  #new-blogs .container-xxl, #new-blogs .container-xl, #new-blogs .container{ overflow-x: visible; padding-left: 16px; padding-right: 16px; }
  .new-blogs-grid{ flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
  /* Firefox */ -ms-overflow-style: none;
  /* IE and Edge */ padding-left: 0; padding-right: 0; }
  .new-blogs-grid > *:first-child{ margin-left: 0; }
  .new-blogs-grid > *:last-child{ margin-right: 16px; } }
  /* ===============================================================
       TABLET & BELOW (max-width: 991px)
       =============================================================== */
  @media (max-width: 991px) {
  /* Blog Hero Breadcrumb */
  .blog-hero-breadcrumb{ 
    overflow-x: auto;
    overflow-y: visible;
    flex-wrap: nowrap; 
    justify-content: flex-start; 
    -webkit-overflow-scrolling: touch; 
    scrollbar-width: none;
    /* Firefox */ 
    -ms-overflow-style: none;
    /* IE and Edge */ 
    padding-bottom: 8px; 
    padding-top: 4px;
    margin-left: -16px; 
    margin-right: -16px; 
    padding-left: 16px; 
    padding-right: 16px; 
  }
  .blog-hero-breadcrumb::-webkit-scrollbar, .blog-author-separator, .toc-section, .share-section{ display: none; }
  .blog-hero-breadcrumb > a{ flex-shrink: 0; }
  
  /* Blog Category Dropdown Mobile Fixes */
  .blog-cat-dropdown{ 
    flex-shrink: 0; 
    position: static;
  }
  .blog-cat-dropdown-btn{ 
    position: relative;
    min-width: 150px; 
    padding: 0 12px; 
    white-space: nowrap;
    -webkit-tap-highlight-color: rgba(103, 0, 255, 0.1);
    user-select: none;
  }
  .blog-cat-dropdown-menu{ 
    position: fixed;
    transform: none;
    left: auto;
    min-width: 180px;
    /* Ensure dropdown appears above other content on mobile */
    z-index: 1000;
  }
  
  /* Make dropdowns clickable on mobile instead of hover-only */
  .blog-cat-dropdown.open .blog-cat-dropdown-menu{ display: flex !important; }
  
  /* Disable hover on mobile */
  @media (hover: none) {
    .blog-cat-dropdown:hover .blog-cat-dropdown-menu {
      display: none;
    }
    .blog-cat-dropdown.open .blog-cat-dropdown-menu {
      display: flex !important;
    }
  }
  /* New Blogs Section */
  #new-blogs, #horizontal-blogs{ padding: 40px 0; }
  .new-blog-card{ flex-shrink: 0; width: 258px; height: 370px; }
  .new-blog-overlay{ left: 32px; bottom: 30px; width: 194px; }
  /* Horizontal Blogs Section */
  #horizontal-blogs .section-header{ margin-bottom: 20px; }
  #horizontal-blogs .section-header h2{ font-size: 23px; line-height: 1.209em; }
  #horizontal-blogs .section-header p{ font-size: 14px; line-height: 1.16em; }
  .horizontal-blogs-grid{ grid-template-columns: 1fr; gap: 16px; }
  .horizontal-blog-card > a{ flex-direction: row; }
  .horizontal-blog-card > a > div:first-child{ width: 120px; height: 165px; flex-shrink: 0; }
  .horizontal-blog-card > a > div:first-child img{ width: 100%; height: 100%; object-fit: cover; }
  .horizontal-blog-card > a > .blog-content{ flex: 1; min-width: 0; gap: 16px; }
  /* Blog Card Titles - Common Responsive Styles */
  .blog-title{
  /* font-size moved to common responsive typography overrides */ font-weight: 800; line-height: 1.5em; }
  .horizontal-blog-card .blog-title{ color: #33353E; }
  .horizontal-blog-card .blog-author > div:first-child{ width: 25px; height: 25px; border-radius: 12.5px; }
  .horizontal-blog-card .blog-author > div:first-child img{ width: 100%; height: 100%; object-fit: cover; }
  .horizontal-blog-card .blog-author-info{ display: flex; flex-direction: column; align-items: flex-start; font-size: 10px; line-height: 2em; gap: 0; }
  .horizontal-blog-card .blog-author-info > div:first-child{ font-weight: 600; color: #465681; }
  .horizontal-blog-card .blog-meta{ gap: 10px; flex-wrap: wrap; }
  .horizontal-blog-card .blog-meta > div{ padding: 6px; gap: 5px; background: #F6F7FB; border: 1px dashed #EAEAED; border-radius: 20px; }
  .horizontal-blog-card .blog-meta > div svg{ width: 12px; height: 12px; }
  .horizontal-blog-card .blog-meta > div .text-sm{ font-size: 10px; font-weight: 600; line-height: 1.193em; color: #5F728A; }
  /* Latest Blogs Section */
  #latest{ padding: 20px 0; }
  .latest-blogs-grid{ grid-template-columns: repeat(2, 1fr); gap: 24px; align-items: stretch; }
  .blog-card, .suggested-blogs-grid .blog-card{ max-width: 100%; }
  .blog-card > a > div:first-child, .blog-card img{ height: 220px; }
  .blog-card > a > div:last-child{ padding: 18px; }
  /* Comments Section */
  #comment-section, #suggested-blogs{ padding: 32px 0; }
  #comment-section .container-xxl, #suggested-blogs .container-xxl{ gap: 24px; }
  .comment-header{ flex-direction: column; align-items: flex-start; gap: 16px; }
  .comment-header .section-header{ text-align: center; width: 100%; }
  .comment-header .btn{ width: 100%; justify-content: center; }
  .comment-form .form-row{ flex-direction: column; }
  .comment > header{ gap: 16px; }
  /* Blog Detail */
  .blog-detail-left, .blog-detail-right{ position: static !important; top: auto; max-height: none; padding: 0; }
  .mobile-character{ display: block; }
  /* Blog Author Section */
  .blog-author-section{ margin-top: 32px; padding: 16px; gap: 16px; }
  .blog-author-header{ flex-direction: column; align-items: flex-start; gap: 16px; padding-bottom: 16px; }
  .blog-author-social-icons{ align-self: flex-start; }
  /* Suggested Blogs Section */
  .suggested-blogs-grid{ flex-direction: column; gap: 16px; }
  /* Göz Atın Section */
  .goz-atin-section{ width: calc(100vw - 32px); bottom: 16px; right: 16px; padding: 16px; }
  .goz-atin-image{ height: 160px; }
  /* Newsletter Section */
  .newsletter-character{ align-self: center; }
  .newsletter-character img{ max-width: 222px; }
  .newsletter-input-row{ flex-direction: column; align-items: start; }
  .newsletter-input-row button[type="submit"]{ width: 100%; }
  .blog-author-info span{ display: none; } }
  /* ===============================================================
       MOBILE & BELOW (max-width: 768px)
       =============================================================== */
  @media (max-width: 768px) {
  /* Blog Category Dropdown Mobile-Specific */
  .blog-cat-dropdown-btn {
    height: 40px;
    font-size: 13px;
    padding: 0 10px;
    gap: 6px;
  }
  .blog-cat-dropdown-menu {
    max-height: 280px;
    min-width: 160px;
  }
  .blog-cat-dropdown-menu a {
    padding: 8px 12px;
    font-size: 13px;
  }
  
  /* Blog Slider */
  #blog-slider{ padding: 0; }
  .blog-slider-container, .blog-slide.active .blog-slide-content, .blog-slide.active .blog-slide-header, .horizontal-blogs-grid, .horizontal-blog-card > a > .blog-content{ gap: 16px; }
  .horizontal-blog-card > a > .blog-content{ gap: 0; }
  /* Closed (Minimized) State - Mobile */
  .blog-slide:not(.active){ height: 148px; padding: 16px; flex-direction: row; align-items: flex-start; gap: 0; }
  .blog-slide:not(.active) .blog-slide-image-wrapper{ width: calc(100% - 32px); height: 116px; border-radius: 20px; position: absolute; left: 16px; top: 16px; right: auto; }
  .blog-slide:not(.active) .blog-slide-image{ width: 100%; height: 100%; border-radius: 20px; }
  .blog-slide:not(.active) .blog-slide-overlay{ left: 15px; top: 30px; width: calc(100% - 64px); max-width: none; opacity: 1; pointer-events: auto; gap: 10px; }
  .blog-slide:not(.active) .blog-slide-overlay svg{ width: 25px; height: 25px; }
  .blog-slide:not(.active) .blog-slide-content .blog-title{ left: 32px; top: 65px;
  /* overlay top (18px) + svg height (25px) + gap (4px from base) */ width: calc(100% - 64px); max-width: none; font-weight: 800; font-size: 15px; line-height: 1.33; color: var(--bg-light); margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-clamp: 2; }
  .blog-slide:not(.active) .blog-slide-overlay p{ font-weight: 400; font-size: 12px; line-height: 2.00; color: var(--bg-light); margin: 0; }
  /* Open (Expanded) State - Mobile */
  .blog-slide.active{ padding: 20px; flex-direction: column; gap: 16px; height: fit-content; }
  .blog-slide.active .blog-slide-image-wrapper{ width: 100%; height: 240px; border-radius: 22px; }
  .blog-slide.active .blog-slide-image{ width: 100%; height: 100%; border-radius: 22px; }
  .blog-slide.active .blog-slide-content .blog-title{ font-size: 20px; }
  .blog-slide.active .blog-slide-description{ font-size: 16px; }
  .blog-slide.active .blog-slide-content .blog-slide-header > div:first-child > div{ padding: 10px; }
  /* Hide overlay when active */
  .blog-slide.active .blog-slide-overlay{ opacity: 0; pointer-events: none; }
  /* New Blogs Section */
  #new-blogs, #horizontal-blogs{ padding: 32px 0; }
  .new-blog-card{ height: 370px; }
  /* Horizontal Blogs Section */
  #horizontal-blogs .section-header{ margin-bottom: 20px; }
  #horizontal-blogs .section-header h2{ font-size: 23px; line-height: 1.209em; }
  #horizontal-blogs .section-header p{ font-size: 14px; line-height: 1.16em; }
  .horizontal-blog-card .blog-author-info{ display: flex; flex-direction: column; align-items: flex-start; font-size: 10px; line-height: 2em; gap: 0; }
  .blog-author-separator, .blog-author-section .blog-author-info > span:nth-child(2){ display: none; }
  .horizontal-blog-card .blog-meta{ gap: 10px; }
  .horizontal-blog-card .blog-meta > div{ padding: 6px; gap: 5px; background: #F6F7FB; border: 1px dashed #EAEAED; border-radius: 20px; }
  .horizontal-blog-card .blog-meta > div svg{ width: 12px; height: 12px; }
  .horizontal-blog-card .blog-meta > div .text-sm{ font-size: 10px; font-weight: 600; line-height: 1.193em; color: #5F728A; }
  
  /* Recommended Posts Mobile */
  .recommended-posts .horizontal-blog-card { height: auto; border: 1px solid rgba(173, 181, 189, 0.5); }
  .recommended-posts .horizontal-blog-card > a { flex-direction: column; padding: 20px; }
  .recommended-posts .horizontal-blog-card > a > div:first-child { width: 100%; height: 240px; }
  .recommended-posts .horizontal-blog-card h3 { order: 1; }
  .recommended-posts .horizontal-blog-card .blog-excerpt { display: block; font-size: 16px; line-height: 24px; color: #666F94; order: 2; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .recommended-posts .horizontal-blog-card .blog-meta { order: 0; }
  .recommended-posts .horizontal-blog-card .blog-meta > div { padding: 5px; }
  .recommended-posts .horizontal-blog-card .blog-author { order: 3; flex-direction: row; gap: 10px; }
  .recommended-posts .horizontal-blog-card .blog-author-info { flex-direction: row; gap: 8px; font-size: 14px; line-height: 20px; }
  .recommended-posts .horizontal-blog-card .blog-author-info > div:first-child { font-weight: 500; color: #33353E; }
  .recommended-posts .horizontal-blog-card .blog-author-info > span { width: 4px; height: 4px; background: #5F728A; border-radius: 2px; font-size: 0; }
  .recommended-posts .horizontal-blog-card .blog-author-info > div:last-child { color: #666F94; }
  
  /* Latest Blogs Section */
  #latest{ padding: 40px 0; }
  .latest-blogs-grid{ grid-template-columns: 1fr; gap: 20px; align-items: stretch; }
  .blog-card{ border-radius: 20px; max-width: 100%; }
  .blog-card > a > div:first-child, .blog-card img{ height: 200px; border-radius: 18px 18px 0 0; }
  .blog-card > a > .blog-content{ padding: 16px; gap: 12px; }
  .blog-card .blog-meta{ gap: 8px; }
  .blog-card .blog-meta > div{ padding: 8px; }
  .blog-card .blog-title, .blog-card .blog-excerpt{ -webkit-line-clamp: 2; line-clamp: 2; }
  .blog-card .blog-author{ gap: 6px; }
  .blog-card .blog-author > div:first-child{ width: 24px; height: 24px; border-radius: 12px; }
  /* CKEditor Content Tablet */
  .blog-detail-content .blog-content table td,
  .blog-detail-content .blog-content table th{ min-width: 150px; padding: 12px; }
  /* Comments Section */
  #comment-section, #suggested-blogs{ padding: 24px 0; }
  #comment-section .container-xxl{ gap: 20px; padding: 0; }
  .comment-form .form-group:not(.form-group-textarea){ padding: 16px; height: auto; }
  .comment-form .form-group-textarea{ padding: 12px; min-height: 120px; }
  .comment{ padding: 16px; }
  .comment > header, .blog-author-info{ gap: 0; }
  .comment p{
  /* font-size moved to common responsive typography overrides */ line-height: 1.8em; }
  /* Blog Author Section */
  .blog-author-section{ border-radius: 20px; padding: 20px; margin-top: 24px; gap: 10px; }
  .blog-author-header{ gap: 20px; padding-bottom: 20px; border-bottom: 1px solid rgba(173, 181, 189, 0.3); flex-direction: column; align-items: flex-start; }
  /* Avatar size from Figma mobile - 40px */
  .blog-author-section .blog-author > img{ width: 40px; height: 40px; border-radius: 38px; }
  /* Author info - column layout on mobile */
  .blog-author{ display: flex; align-items: center; gap: 16px; }
  /* Hide separator on mobile */
  /* Bio text from Figma */
  .blog-author-section p{
  /* font-size moved to common responsive typography overrides */ font-weight: 400; line-height: 1.857em; color: #5F728A; margin: 0; }
  /* Hide desktop social icons */
  .blog-author-section .blog-author-social-icons.desktop-only{ display: none !important; }
  /* Show mobile social icons after paragraph */
  .blog-author-section .blog-author-social-icons.mobile-only{ display: flex !important; gap: 11.31px; margin-top: 20px; }
  .blog-author-section .blog-author-social-icons.mobile-only .blog-author-social-icon{ width: 25.44px; height: 25.44px; font-size: 11px; display: flex; align-items: center; justify-content: center; }
  /* Suggested Blogs Section */
  #suggested-blogs .container-xxl{ gap: 20px; }
  .suggested-blogs-grid{ gap: 12px; } }
  /* ===============================================================
       MOBILE & BELOW (max-width: 767px)
       =============================================================== */
  @media (max-width: 767px) {
  .blog-hero-content{ gap: 16px; padding: 0; }
  .blog-hero-content h1{ font-size: 24px; }
  .blog-hero-content .blog-hero-meta{ gap: 8px; flex-wrap: wrap; }
  .blog-hero-meta > li{ padding: 8px; }
  .blog-hero-meta > li span{ font-size: 12px; }
  .blog-hero-image-wrapper{ padding: 0; height: 165px; }
  .blog-hero-image-wrapper::after, .blog-hero-image-wrapper img{ border-radius: 16px; }
  /* Blog Detail */
  .blog-detail-background{ border-radius: 16px; padding: 16px; }
  /* Mobilde grid yerine flex column */
  .blog-detail-grid{
    display: flex;
    flex-direction: column;
    gap: 24px;
  }
  .blog-detail-toc{
    display: none; /* TOC mobilde gizli, mobile-toc var */
  }
  .blog-detail-main{
    width: 100%;
    max-width: 100%;
    order: 1;
  }
  .blog-detail-sidebar{
    width: 100%;
    max-width: 100%;
    order: 2;
  }
  .blog-detail-content{ padding-left: 0; padding-right: 0; }
  .blog-detail-content > div:not(.recommended-section){ margin-bottom: 32px; }
  .blog-detail-content > div:not(.recommended-section) h2{ font-size: 22px; }
  .recommended-section, .similar-blogs-section, #comment-section, .contact-us-section-container{ padding: 0; margin-bottom: 0; }
  /* CKEditor Content Responsive */
  .blog-detail-content .blog-content h1{ font-size: 26px; }
  .blog-detail-content .blog-content h2{ font-size: 24px; }
  .blog-detail-content .blog-content h3{ font-size: 20px; }
  .blog-detail-content .blog-content h4{ font-size: 18px; }
  .blog-detail-content .blog-content h5{ font-size: 16px; }
  .blog-detail-content .blog-content h6{ font-size: 15px; }
  .blog-detail-content .blog-content p,
  .blog-detail-content .blog-content ul li,
  .blog-detail-content .blog-content ol li{ font-size: 16px; }
  .blog-detail-content .blog-content table{ font-size: 13px; }
  .blog-detail-content .blog-content tbody td,
  .blog-detail-content .blog-content thead th{ padding: 10px; font-size: 13px; min-width: 140px; }
  .blog-detail-content .blog-content blockquote p{ font-size: 16px; }
  .blog-detail-content .blog-content pre code{ font-size: 13px; }
  .blog-detail-content .blog-content .image-style-align-left,
  .blog-detail-content .blog-content .image-style-align-right{ max-width: 100%; float: none; margin-left: 0; margin-right: 0; } }
  /* ===============================================================
       SMALL MOBILE & BELOW (max-width: 480px)
       =============================================================== */
  @media (max-width: 480px) {
  /* Latest Blogs Section */
  #latest{ padding: 32px 0; }
  .blog-card{ border-radius: 18px; }
  .blog-card > a > div:first-child, .blog-card img{ height: 180px; border-radius: 16px 16px 0 0; }
  .blog-card > a > .blog-content{ padding: 14px; gap: 10px; }
  .meta-item{ padding: 6px 8px; font-size: 11px; }
  .blog-card .blog-title{ font-size: 15px; }
  .blog-card .blog-excerpt{ font-size: 13px; }
  /* Göz Atın Section */
  .goz-atin-section{ width: calc(100vw - 24px); bottom: 80px; right: 12px; padding: 12px; }
  .goz-atin-image{ height: 140px; }
  .goz-atin-title{ font-size: 18px; }
  .goz-atin-blog-title, .goz-atin-date{ font-size: 14px; }
  /* CKEditor Content Small Mobile */
  .blog-detail-content .blog-content h1{ font-size: 24px; }
  .blog-detail-content .blog-content h2{ font-size: 22px; }
  .blog-detail-content .blog-content h3{ font-size: 18px; }
  .blog-detail-content .blog-content h4{ font-size: 16px; }
  .blog-detail-content .blog-content p,
  .blog-detail-content .blog-content ul li,
  .blog-detail-content .blog-content ol li{ font-size: 15px; }
  .blog-detail-content .blog-content ul li{ padding-left: 24px; }
  .blog-detail-content .blog-content ol li{ padding-left: 32px; }
  .blog-detail-content .blog-content blockquote{ padding: 16px 18px; }
  .blog-detail-content .blog-content blockquote p{ font-size: 15px; }
  .blog-detail-content .blog-content table thead th,
  .blog-detail-content .blog-content table tbody td{ padding: 10px; font-size: 13px; }
  .blog-detail-content .blog-content pre{ padding: 16px; }
  .blog-detail-content .blog-content pre code{ font-size: 12px; } }
  /* ===============================================================
       TABLET & ABOVE (min-width: 768px)
       =============================================================== */
  @media (min-width: 768px) {
  /* Blog Hero Tablet Styles */
  .blog-hero-content h1{ font-size: 30px; }
  .blog-hero-image-wrapper{ height: 400px; }
  /* Blog Detail & Newsletter Tablet Styles */
  .blog-detail-content{ padding-left: 48px; padding-right: 48px; }
  .blog-detail-content > div:not(.recommended-section) h2{ font-size: 28px; }
  .newsletter-section{ padding: 28px; }
  .newsletter-content h2{ font-size: 32px; }
  .newsletter-character img{ max-width: 220px; } }
  /* ===============================================================
       TABLET & ABOVE (min-width: 769px)
       =============================================================== */
  @media (min-width: 769px) {
  /* Hide mobile social icons on desktop */
  .blog-author-section .blog-author-social-icons.mobile-only{ display: none !important; } }
  /* ===============================================================
       DESKTOP & ABOVE (min-width: 992px)
       =============================================================== */
  @media (min-width: 992px) {
  /* Blog Hero Desktop Styles */
  .blog-hero-content h1{ font-size: 30px; }
  /* Newsletter Desktop Styles */
  .newsletter-section{ background-image: url('../../assets/images/blog/bulten-bg.png'); padding: 32px; padding-bottom: 0; }
  .newsletter-container{ flex-direction: row; align-items: center; justify-content: flex-start; gap: 32px; }
  .newsletter-content{ order: 0; flex: 1; }
  .newsletter-content h2{ font-size: 38px; }
  .newsletter-character{ order: 0; flex-shrink: 0; align-self: flex-end; margin-top: 0; }
  .newsletter-character img{ max-width: 250px; margin-top: -80px; }
  .blog-detail-content{ padding-left: 0; padding-right: 0; }
  .newsletter-character img{ max-width: 223px; margin-top: -120px; }
  /* TOC and Form Desktop Styles */
  .mobile-toc-section{ display: none; }
  .form-row, .recommended-posts{ flex-direction: column; }
  .similar-blogs-header{ flex-direction: column; align-items: flex-start; gap: 16px; } }