.redcat-blog-featured {
   position: relative;
}
.blog-featured-container {
   display: grid;
   gap: 2rem;
   align-items: start;
}
.redcat-blog-featured.layout-left .blog-featured-container {
   grid-template-columns: 1.5fr 1fr;
   grid-template-areas: "featured sidebar";
}
.redcat-blog-featured.layout-right .blog-featured-container {
   grid-template-columns: 1fr 1.5fr;
   grid-template-areas: "sidebar featured";
}
.redcat-blog-featured.layout-left .blog-featured-main {
   grid-area: featured;
}
.redcat-blog-featured.layout-right .blog-featured-main {
   grid-area: featured;
}
.blog-featured-sidebar {
   grid-area: sidebar;
}

/* ===== FEATURED POST STYLES ===== */
.blog-featured-post {
   overflow: hidden;
   height: 100%;
   display: flex;
   flex-direction: column;
}
.blog-featured-image {
   position: relative;
   overflow: hidden;
   margin: 0 0 var(--wp--preset--spacing--20) 0;
}
.blog-featured-image a {
   display: block;
}
.featured-thumbnail {
   width: 100%;
   aspect-ratio: 16/11;
   object-fit: cover;
   display: block;
}
.blog-featured-content {
   flex-grow: 1;
   display: flex;
   flex-direction: column;
}
.blog-featured-title {
   font-size: var(--wp--preset--font-size--heading-2);
   font-weight: 400;
   text-transform: uppercase;
   margin: 0 0 var(--wp--preset--spacing--20) 0;
}
.blog-featured-title a {
   color: var(--wp--preset--color--black);
   display: inline-block;
   text-decoration: none;
}
.blog-featured-title a:hover {
   color: var(--wp--preset--color--primary);
}
.blog-featured-excerpt {
   color: var(--wp--preset--color--black);
}
.blog-featured-link {
   display: none;
}

/* ===== SIDEBAR POSTS STYLES ===== */
.blog-sidebar-posts {
   display: flex;
   flex-direction: column;
   gap: 2rem;
}
.blog-sidebar-item {
   overflow: hidden;
   display: flex;
}
.blog-sidebar-image {
   width: 120px;
   flex: 0 0 auto;
   overflow: hidden;
}
.blog-sidebar-image a {
   display: block;
   height: 100%;
}
.sidebar-thumbnail {
   width: 100%;
   height: 100%;
   aspect-ratio: 1/1;
   object-fit: cover;
   display: block;
}
.blog-sidebar-content {
   flex-grow: 1;
   padding-left: 1rem;
   min-height: 80px;
}
.blog-sidebar-title {
   font-size: 18px;
   font-weight: 400;
   text-transform: uppercase;
   margin: 0 0 0.8rem 0;
}
.blog-sidebar-title a {
   color: var(--wp--preset--color--black);
   display: inline-block;
   text-decoration: none;
}
.blog-sidebar-title a:hover {
   color: var(--wp--preset--color--primary);
}
.blog-sidebar-excerpt {
   font-size: 16px;
   overflow: hidden;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
}
.blog-featured-empty {
   text-align: center;
   padding: 3rem;
   color: #666;
   font-style: italic;
}

@media (max-width: 1199px) {
   .blog-featured-container {
      display: flex;
      flex-wrap: wrap;
   }
   .blog-featured-sidebar {
      margin-top: 2rem;
      width: 100%;
   }
   .blog-sidebar-posts {
      display: grid;
      grid-template-columns: 1fr 1fr;
   }
}
@media (max-width: 991px) {
   .blog-sidebar-item {
      flex-direction: column;
   }
   .blog-sidebar-image {
      width: 100%;
   }
   .blog-sidebar-content {
      padding: 1.4rem 0 0 0;
   }
   .sidebar-thumbnail {
      aspect-ratio: 16/9;
   }
}
@media (max-width: 767px) {
   .blog-featured-sidebar {
      margin-top: 1rem;
   }
   .blog-sidebar-posts {
      grid-template-columns: 1fr;
      gap: 1.5rem;
   }
}

/* Wide and Full Width Support */
.wp-block-redcat-blog-featured.alignwide {
   max-width: 1200px;
   margin-left: auto;
   margin-right: auto;
}

.wp-block-redcat-blog-featured.alignfull {
   max-width: none;
   width: 100vw;
   margin-left: calc(50% - 50vw);
   margin-right: calc(50% - 50vw);
}

.wp-block-redcat-blog-featured.alignfull .blog-featured-container {
   max-width: 1200px;
   margin-left: auto;
   margin-right: auto;
   padding: 0 2rem;
}

/* Dark Background Support */
.redcat-blog-featured.has-background {
   padding: 2rem;
   border-radius: 8px;
}

.redcat-blog-featured.has-dark-background .blog-featured-title a,
.redcat-blog-featured.has-dark-background .blog-sidebar-title a {
   color: white;
}

.redcat-blog-featured.has-dark-background .blog-featured-excerpt {
   color: rgba(255, 255, 255, 0.8);
}

.redcat-blog-featured.has-dark-background .blog-featured-date,
.redcat-blog-featured.has-dark-background .blog-sidebar-date {
   color: rgba(255, 255, 255, 0.7);
}



/* Loading States */
.blog-featured-loading {
   opacity: 0.6;
   pointer-events: none;
}