/*
Theme Name: Graceful Omni Blog
Theme URI: https://optimathemes.com/graceful-omni-blog-theme/
Author: Aslam
Author URI: http://optimathemes.com/
Description: Graceful Omni Blog is a clean, modern, and elegant free WordPress blog theme designed for bloggers, creators, online magazines, and content-focused websites. Perfect for niches like fashion, lifestyle, travel, tech, health, beauty, food, and personal blogging, the theme features a visually appealing layout with a highlighted featured posts section, organized content areas, and a stylish sidebar for improved content discovery and reader engagement. Built with simplicity, readability, and performance in mind, Graceful Omni Blog is fully responsive, Retina-ready, lightweight, and SEO optimized, ensuring your website looks stunning and loads smoothly across all devices. The clean typography, intuitive navigation, and balanced spacing provide a seamless browsing experience for your visitors. Graceful Omni Blog is easy to customize and suitable for both beginners and experienced WordPress users. It is WooCommerce compatible, translation ready, RTL supported, and designed to work perfectly with the latest version of WordPress. Whether you are creating a personal blog, niche website, news portal, or professional online magazine, Graceful Omni Blog offers a stylish and performance-focused foundation to showcase your content beautifully.
Template: graceful
Version: 1.0.0
Requires at least: 5.3
Tested up to: 7.0
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: graceful-omni-blog
Tags: blog, one-column, two-columns, three-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-header, custom-menu, custom-logo, featured-images, footer-widgets, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, e-commerce
*/

/*
Customization of this theme starts here
*/

/* style.css */

/*--------------------------------------------------------------
Header Sections
--------------------------------------------------------------*/

.post-header {
    margin-top: 20px;
    text-align: left;
}

.site-branding a {
    font-size: 48px;
}

.post-categories {
    background: #f9f4f1;
}

.blog .post-title {
    font-size: 34px;
    line-height: 38px;
}

.blog article .post-meta {
    margin-bottom: 10px;
}

.blog .post-page-content {
    padding-top: 10px;
}

aside .graceful-widget h2, 
.graceful-widget .widget-title {
    border-bottom: 1px solid #a38b7c;
    font-weight: 600;
    padding: 9px 5px 7px;
}

aside .graceful-widget h2::after, 
.graceful-widget .widget-title::after {
    border-top: 8px solid #a38b7c;
}

#graceful-post-slider .owl-stage-outer:after {
    background-color: #f9f4f1;
}

#graceful-post-slider .owl-nav {
    background-color: #f9f4f1;
}

.post-title {
    word-wrap: break-word;
}

.graceful-slider-info {
    padding: 20px;
}

.graceful-slider-title {
    font-size: 32px;
    word-wrap: break-word;
}

#primary .continue-read a {
    border: 1px solid #111111;
    color: #000000;
    text-decoration: none;
    font-weight: bold;
    line-height: 34px;
    text-transform: capitalize;
}

#primary .continue-read a:hover {
    background: #f1f1f1;
}

@media screen and (max-width: 480px) {
    .graceful-slider-title {
        width: 300px;
    }
}

.site-images {
    min-height: 0;
}


.single .post-date {
    color: #111111 !important;
    font-family: 'Open Sans', sans-serif;
    font-size: 13px;
}

.single .post-title-author { 
    color: #111111 !important;
    display: inline-block;
    font-family: 'Open Sans', sans-serif;
    font-size: 13px;
    font-weight: normal;
}

.blog article .post-date {
    font-family: 'Open Sans', sans-serif;
    font-size: 13px;
}

.blog article .post-header .post-meta a {
    font-family: 'Open Sans', sans-serif;  
    font-size: 13px; 
}

.content-column > li {
    margin-bottom: 60px;
}

.post-footer{
    border-bottom: 1px solid #eeeeee;
}

@media screen and (max-width: 480px) {
    .content-column > li {
        width: 100%;
    }
}

/* Top Navigation
   ========================================================================== */

.grace-latest {
    text-align: center;
    background: #f9f4f1;
    padding: 7px;
    font-size: 20px;
    margin-bottom: 36px;
}

.main-navigation-sidebar {
  position: absolute;
  top: 0px;
  left: <?php echo esc_html( graceful_options( 'basic_content_padding' ) ) ?>px;
  z-index: 1;
}
            
.main-navigation-search {
  position: absolute;
  top: 0px;
  right: <?php echo esc_html( graceful_options( 'basic_content_padding' ) ) ?>px;
  z-index: 2;
}

#top-navigation {
  text-align: center;
  box-shadow: 0px 1px 5px rgba(0,0,0, 0.1);
  border-bottom: 1px solid #999999;
  background: #a38b7c;
}

#top-navigation {
    border-bottom: 1px solid #dddddd;
}

#top-menu {
  display: inline-block;
}

#top-menu a:focus {
  outline: 3px dotted #000000 !important;
}

#top-menu li {
  position: relative;
}

#top-menu li.menu-item-has-children>a:after {
    font-family: FontAwesome;
    content: "\f107";
    margin-left: 6px;
    font-size: 12px;
}

#top-menu ul li.menu-item-has-children>a:after {
    font-family: FontAwesome;
    content: "\f105";
    font-size: 14px;
    float: right;
}

#top-menu > li {
  display: inline-block;
  list-style: none;
}

#top-menu li a {
  display: block;
  position: relative;
  padding: 0 5px;
  margin-left: 5px;
}

#top-menu li a {
  color: #000000;
}

#top-menu ul li a {
  color: #000000;
}

#top-menu li a:first-child {
  margin-left: 0;
}

#top-menu > li > a {
  display: block;
  text-decoration: none;
}

#top-menu > li:first-child > a {
  padding-left: 0px;
}

#top-menu > li:last-child > a {
  padding-right: 0px;
}

#top-menu ul ul {
  top: -1px;
  left: 100%;
}

#top-menu .menu-item:hover > ul, #top-menu .menu-item:focus-within > ul {
  left: 0;
  opacity: 1;
}

#top-menu .menu-item:hover ul ul, #top-menu .menu-item:focus-within ul ul{
  left: 100%;
}

#top-menu .sub-menu {
  position: absolute;
  left: -999em;
  z-index: 1101;
  width: 170px;
  text-align: left;
  border: 1px solid #e4e4e4;
  border-width: 1px;
  opacity: 0;
}

#top-menu .sub-menu a {
  border-bottom: 1px solid #ddd;
}

#top-menu .sub-menu > li:last-of-type > a {
  border: none;
}

#top-menu .sub-menu li:first-child > .sub-menu {
  margin-top: -1px;
}

#top-menu .sub-menu > li > a {
  display: block;
  width: 100%;
  padding: 8px 15px;
  margin: 0;
}

#top-menu li a {
  font-size: 11px;
  line-height: 40px;
  letter-spacing: 1px;
  font-weight: 600;
  text-transform: uppercase;
}
#top-menu .sub-menu > li > a {
  font-size: 11px;
  line-height: 24px;
  letter-spacing: 0.5px;
  background: #ffffff;
}

#top-menu li a {
  font-size: 11px;
  line-height: 40px;
  letter-spacing: 1px;
  font-weight: 600;
}
#top-menu .sub-menu > li > a {
  font-size: 11px;
  line-height: 22px;
  letter-spacing: 0.5px;
}

#top-menu li a,
#main-menu li a {
  text-transform: uppercase;
}

#top-navigation > div {
  padding-left: 30px;
  padding-right: 30px;
}

#main-navigation {
    background: #ffffff;
    border-bottom: 1px solid #ffffff;
}

.entry-header {
    height: 150px;
    border-bottom: 1px solid #eeeeee;
}

.main-content {
    margin-top: 40px;
}

aside .wp-block-latest-posts.wp-block-latest-posts__list li {
    border-bottom: 1px solid #000000;
}

.wp-block-search__label {
    display: none;
}

/* Media Query Min 768px
   ========================================================================== */
@media screen and (min-width: 768px) {
    .blog .post-page-content p {
        padding: 0;
    }
    #main-navigation .wrapped-content {
        padding-left: 0;
    }
    .main-navigation-search {
        right: 0;
    }
    #main-navigation .navigation-socials {
        right: 35px;
    }
}


#graceful-post-slider {
    padding-left: 40px;
    padding-right: 40px;
}

#graceful-post-slider.wrapped-content {
    padding-left: 0;
    padding-right: 0;
}


#site-footer {
    border-top: 1px solid #d5cfc4;
    background: #f9f4f1;
}

.graceful-hb-col {
    position: relative;
    float: left;
    width: 100%;
}

.graceful-hb-col:first-child {
    text-align: right;
}

.graceful-hb-col:last-child {
    min-height: 500px;
}

.graceful-hb-col img {
    width: 400px;
    height: 400px;
    margin: 50px;
    text-align: right;
}

.graceful-hb-col h2 {
    font-size: 42px;
    margin-bottom: 20px;
}

.graceful-hb-col a {
    padding: 10px 20px;
    background: #333333;
    color: #ffffff !important;
    font-size: 14px;
    font-weight: bold;
}

.graceful-hb-col:first-child::after {
    content: '';
    background: #f9f4f1;
    width: 400px;
    height: 400px;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: -1;
}

.graceful-hb-col-inner {
  margin: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  margin: 0 40px;
}

@media screen and (min-width: 768px) {
    
    .wrapped-content .main-navigation-search {
        right: 0;
    }
    #main-navigation .wrapped-content .navigation-socials {
        right: 35px;
    }

    .main-navigation-search {
        right: 35px;
    }
    #main-navigation .navigation-socials {
        right: 75px;
    }
    .graceful-hb-col {
        width: 49%;
    }
}

.graceful-widget .graceful-recent-image-box a {
    font-size: 14px;
}


#graceful-post-slider .slide-item {
    background-size: cover;
    height: 420px;
}

.single .post-page-content {
    padding: 0px 0px 10px;
}

#responsive-menu .sub-menu > li {
    background: #eeeeee;
}

#responsive-menu .sub-menu > li li {
    background: #cccccc;
}

.close-graceful-search {
    background: #000000;
}

#site-menu li a {
    font-family: 'Open Sans', sans-serif;
}

aside .graceful-widget h2 {
    font-family: Open Sans, sans-serif;
}

#graceful-hero-banner-wrap {
    margin-top: 20px;
}

@media screen and (max-width: 480px) {
    .main-navigation-search {
        right: 20px;
    }
    .graceful-hb-col img {
        width: 300px;
        height: 300px;
        text-align: center;
    }
    .graceful-hb-col:last-child {
        min-height: 300px;
    }
    .graceful-hb-col:first-child::after {
        left: 0;
        width: 100%;
    }
    .graceful-hb-col:first-child {
        text-align: center;
    }
}

@media (min-width:700px) and (max-width:900px) {
    .graceful-hb-col img {
        width: 340px;
        height: 340px;
    }
    .graceful-hb-col:first-child {
        text-align: center;
    }
    .graceful-hb-col:first-child::after {
        display: none;
    }
    .graceful-hb-col:last-child {
        min-height: 200px;
        text-align: center;
    }
}

.graceful-hb-col a:focus {
    outline: 2px dotted #000000 !important;
}

.graceful-hb-col h2 {
    max-width: 504px;
}

.close-graceful-search {
    background: #dddddd;
    border: 1px solid #aaaaaa;
}

.graceful-widget h2 {
    background: #f9f4f1 !important;
}

#site-footer .graceful-widget h2 {
    padding: 3px 5px 2px;
    background: #e9e6df !important;
}


/*--------------------------------------------------------------
Omni Post Slider CSS
--------------------------------------------------------------*/
.omni-slider-container {
    margin: 0 auto;
}

.omni-slider-wrapper {
    position: relative;
}

.omni-slider-carousel {
    position: relative;
}

.omni-slide {
    position: relative;
    height: 550px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.omni-slide-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    background-position: center;
    background-color: #f5f3ef;
}

.omni-slide-bg::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.1);
}

.omni-slide-bg--placeholder {
    background: linear-gradient(135deg, #e8e4dc 0%, #f5f3ef 100%);
}

.omni-slide-card {
    position: relative;
    z-index: 2;
    background: rgba(255, 255, 255, 0.95);
    padding: 50px 60px;
    text-align: center;
    max-width: 600px;
    width: 90%;
}

.omni-slide-card::before {
    content: '';
    position: absolute;
    top: 12px;
    left: 12px;
    right: 12px;
    bottom: 12px;
    border: 1px solid #e0dbd5;
    pointer-events: none;
}

.omni-slide-category {
    display: block;
    font-size: 11px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: #666666;
    margin-bottom: 20px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
}

.omni-slide-title {
    font-family: 'Cormorant Garamond', 'Times', serif;
    font-size: 32px;
    font-weight: 400;
    line-height: 1.3;
    text-transform: uppercase;
    color: #222222;
    margin: 0 0 30px 0;
    letter-spacing: 1px;
}

.omni-slide-button {
    display: inline-block;
    padding: 8px 28px;
    border: 1px solid #333333;
    background: transparent;
    color: #333333;
    text-decoration: none;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    font-family: 'Open Sans', sans-serif;
    transition: background 0.3s ease, color 0.3s ease;
}

.omni-slide-button:hover {
    background: #333333;
    color: #ffffff !important;
}

.omni-slide-button:focus {
    outline: 2px dotted #333333;
    outline-offset: 3px;
}

/* Navigation Arrows */
.omni-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    cursor: pointer;
    font-size: 64px;
    color: #ffffff;
    line-height: 1;
    user-select: none;
    transition: color 0.3s ease;
    background: none;
    border: none;
    padding: 10px;
}

.omni-nav:hover {
    color: rgba(255, 255, 255, 0.7);
}

.omni-prev {
    left: 20px;
}

.omni-next {
    right: 20px;
}

/* Responsive */
@media (max-width: 768px) {
    .omni-slide {
        height: 450px;
    }

    .omni-slide-card {
        padding: 35px 30px;
        max-width: 85%;
    }

    .omni-slide-title {
        font-size: 24px;
    }

    .omni-nav {
        font-size: 36px;
    }

    .omni-prev {
        left: 10px;
    }

    .omni-next {
        right: 10px;
    }
}

@media (max-width: 480px) {
    .omni-slide {
        height: 380px;
    }

    .omni-slide-card {
        padding: 25px 20px;
    }

    .omni-slide-category {
        font-size: 10px;
        margin-bottom: 15px;
    }

    .omni-slide-title {
        font-size: 20px;
        margin-bottom: 20px;
    }

    .omni-slide-button {
        padding: 8px 22px;
        font-size: 10px;
    }

    .omni-nav {
        font-size: 30px;
        padding: 5px;
    }

    .omni-prev {
        left: 5px;
    }

    .omni-next {
        right: 5px;
    }
}



/*--------------------------------------------------------------
Omni Latest Post Section CSS
--------------------------------------------------------------*/
:root {
	--omni-posts-stripe: #f9f4f1;
}

.omni-posts-section {
	width: 100%;
	position: relative;
	padding: 30px 40px 80px;
	background: #ffffff;
	box-sizing: border-box;
}



/* Full width - no max-width constraint */
.omni-posts-section .omni-posts-wrapper {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	position: relative;
	z-index: 1;
}

/* Boxed width - constrained */
.omni-posts-section.wrapped-content {
	max-width: 1200px;
	margin: 0 auto;
}

.omni-posts-section.wrapped-content .omni-posts-wrapper {
	max-width: 100%;
}

.omni-posts-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

.omni-posts-card {
	position: relative;
	overflow: hidden;
	border-radius: 0;
	background: #ffffff;
}

.omni-posts-card:hover .omni-posts-card-image {
	transform: scale(1.02);
}

.omni-posts-card-link {
	display: block;
	position: relative;
	height: 420px;
	text-decoration: none;
	color: inherit;
}

.omni-posts-card-link:focus {
	outline: 3px solid #a38b7c;
	outline-offset: 2px;
}

.omni-posts-card-image {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-size: cover;
	background-position: center top;
	background-color: #f9f4f1;
	transition: transform 0.4s ease;
}

.omni-posts-thumb--placeholder {
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg, #e8e4dc 0%, #f9f4f1 100%);
}

.omni-posts-card-overlay {
	position: absolute;
	bottom: 20px;
	left: 20px;
	right: 20px;
	background: rgba(255, 255, 255, 0.9);
	padding: 24px 20px 22px;
	min-height: 110px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	text-align: left;
}

.omni-posts-kicker {
	font-size: 12px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #c9a87c;
	font-weight: 600;
	margin-bottom: 6px;
	font-family: 'Open Sans', sans-serif;
}

.omni-posts-title {
	margin: 0 0 8px 0;
	font-size: 20px;
	font-weight: 400;
	line-height: 1.35;
	color: #222222;
	font-family: 'Playfair Display', serif;
}

.omni-posts-meta {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 11px;
	color: #888888;
	font-family: 'Open Sans', sans-serif;
}

.omni-posts-author,
.omni-posts-date {
	font-size: 11px;
	color: #555555;
}

.omni-posts-separator {
	color: #cccccc;
	font-size: 10px;
}

/* Tablet - 2 columns */
@media (max-width: 1024px) {
	.omni-posts-section {
		padding: 25px 30px 70px;
	}

	.omni-posts-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}

	.omni-posts-card-link {
		height: 380px;
	}
}

/* Mobile - 2 columns smaller */
@media (max-width: 600px) {
	.omni-posts-section {
		padding: 20px 15px 60px;
	}

	.omni-posts-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 12px;
	}

	.omni-posts-card-link {
		height: 260px;
	}

	.omni-posts-card-overlay {
		padding: 16px 12px 14px;
		min-height: 80px;
	}

	.omni-posts-kicker {
		font-size: 10px;
		margin-bottom: 5px;
	}

	.omni-posts-title {
		font-size: 15px;
		line-height: 1.25;
		margin-bottom: 6px;
	}

	.omni-posts-meta {
		font-size: 9px;
		gap: 4px;
	}

	.omni-posts-author,
	.omni-posts-date {
		font-size: 9px;
	}
}

.graceful-omni-category-title {
    margin-bottom: 20px;
    background: #f9f4f1;
    border-bottom: 1px solid #a38b7c;
    display: inline-block;
    padding-bottom: 1px;
    text-align: center;
    width: 100%;
    font-size: 28px;
    padding: 2px 0 4px;
}


/*--------------------------------------------------------------
Single Post Header (Card Style)
--------------------------------------------------------------*/
.omni-single-header {
	position: relative;
	height: 450px;
	overflow: hidden;
	margin-bottom: 40px;
}

.omni-single-header-image {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-size: cover;
	background-position: center top;
	background-color: #f9f4f1;
}

.omni-single-header-placeholder {
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg, #e8e4dc 0%, #f9f4f1 100%);
}

.omni-single-header-overlay {
	position: absolute;
	bottom: 30px;
	left: 30px;
	right: 30px;
	background: rgba(255, 255, 255, 0.92);
	padding: 30px 28px 26px;
	text-align: left;
}

.omni-single-header-category {
	font-size: 12px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #c9a87c !important;
	font-weight: 600;
	margin-bottom: 8px;
	display: block;
	font-family: 'Open Sans', sans-serif;
	text-decoration: none;
}

.omni-single-header-category:hover {
	color: #a38b7c !important;
}

.omni-single-header-title {
	margin: 0 0 10px 0;
	font-size: 30px;
	font-weight: 400;
	line-height: 1.3;
	color: #222222;
	font-family: 'Playfair Display', serif;
}

.omni-single-header-meta {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	color: #888888;
	font-family: 'Open Sans', sans-serif;
}

.omni-single-header-author a {
	color: #555555;
	text-decoration: none;
}

.omni-single-header-author a:hover {
	color: #a38b7c;
}

.omni-single-header-author,
.omni-single-header-date {
	font-size: 12px;
	color: #555555;
}

.omni-single-header-separator {
	color: #cccccc;
	font-size: 10px;
}

@media (max-width: 768px) {
	.omni-single-header {
		height: 380px;
	}

	.omni-single-header-overlay {
		left: 20px;
		right: 20px;
		bottom: 20px;
		padding: 24px 20px 20px;
	}

	.omni-single-header-title {
		font-size: 24px;
	}
}

@media (max-width: 480px) {
	.omni-single-header {
		height: 320px;
	}

	.omni-single-header-overlay {
		left: 15px;
		right: 15px;
		bottom: 15px;
		padding: 20px 16px 16px;
	}

	.omni-single-header-title {
		font-size: 20px;
	}

	.omni-single-header-category {
		font-size: 10px;
	}

	.omni-single-header-meta {
		font-size: 11px;
	}
}


/*--------------------------------------------------------------
Social Media Widget CSS
--------------------------------------------------------------*/
.graceful-omni-social-media-widget {
	text-align: center;
}

.graceful-omni-social-media-links {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	justify-content: center;
	margin-top: 15px;
}

.graceful-omni-social-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background: #f5f3ef;
	color: #333333;
	border-radius: 50%;
	text-decoration: none;
	transition: all 0.3s ease;
	font-size: 18px;
}

.graceful-omni-social-link:hover {
	background: #888561;
	color: #ffffff;
	transform: translateY(-2px);
}

.graceful-omni-social-link:focus {
	outline: 2px solid #888561;
	outline-offset: 2px;
}

.graceful-omni-social-link i {
	line-height: 1;
}

.graceful-omni-x-icon {
	width: 16px;
	height: 16px;
	fill: currentColor;
}

/* Individual platform colors on hover (optional) */
.graceful-omni-social-facebook:hover {
	background: #1877f2;
}

.graceful-omni-social-twitter:hover {
	background: #000000;
}

.graceful-omni-social-instagram:hover {
	background: #e4405f;
}

.graceful-omni-social-linkedin:hover {
	background: #0077b5;
}

.graceful-omni-social-pinterest:hover {
	background: #bd081c;
}

.graceful-omni-social-youtube:hover {
	background: #ff0000;
}


/*--------------------------------------------------------------
Blog Listing 2 Column Layout
--------------------------------------------------------------*/
.blog .content-column,
.archive .content-column,
.search .content-column {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
	list-style: none;
	padding: 0;
	margin: 0;
}

.blog .content-column > li,
.archive .content-column > li,
.search .content-column > li {
	margin-bottom: 0;
	width: 100%;
}

/* Card Style */
.omni-blog-card {
	position: relative;
	overflow: hidden;
	background: #ffffff;
	height: 420px;
}

.omni-blog-card:hover .omni-blog-card-image {
	transform: scale(1.02);
}

.omni-blog-card-image {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-size: cover;
	background-position: center top;
	background-color: #f9f4f1;
	transition: transform 0.4s ease;
}

.omni-blog-card-placeholder {
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg, #e8e4dc 0%, #f9f4f1 100%);
}

.omni-blog-card-overlay {
	position: absolute;
	bottom: 20px;
	left: 20px;
	right: 20px;
	background: rgba(255, 255, 255, 0.9);
	padding: 24px 20px 22px;
	min-height: 110px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	text-align: left;
}

.omni-blog-card-category {
	font-size: 12px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #c9a87c !important;
	font-weight: 600;
	margin-bottom: 6px;
	font-family: 'Open Sans', sans-serif;
	text-decoration: none;
	display: block;
}

.omni-blog-card-category:hover {
	color: #a38b7c !important;
}

.omni-blog-card-title {
	margin: 0 0 8px 0;
	font-size: 20px;
	font-weight: 400;
	line-height: 1.35;
	color: #222222;
	font-family: 'Playfair Display', serif;
}

.omni-blog-card-title a {
	color: inherit;
	text-decoration: none;
}

.omni-blog-card-title a::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 0;
}

.omni-blog-card-title a:hover {
	color: #a38b7c;
}

.omni-blog-card-overlay a {
	position: relative;
	z-index: 1;
}

.omni-blog-card-meta {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 11px;
	color: #888888;
	font-family: 'Open Sans', sans-serif;
}

.omni-blog-card-author a {
	color: #555555;
	text-decoration: none;
}

.omni-blog-card-author a:hover {
	color: #a38b7c;
}

.omni-blog-card-author,
.omni-blog-card-date {
	font-size: 11px;
	color: #555555;
}

.omni-blog-card-separator {
	color: #cccccc;
	font-size: 10px;
}

/* Tablet - maintain 2 columns */
@media (max-width: 1024px) {
	.blog .content-column,
	.archive .content-column,
	.search .content-column {
		gap: 20px;
	}

	.omni-blog-card {
		height: 380px;
	}
}

/* Mobile - single column */
@media (max-width: 768px) {
	.blog .content-column,
	.archive .content-column,
	.search .content-column {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.omni-blog-card {
		height: 350px;
	}

	.omni-blog-card-overlay {
		padding: 18px 16px 16px;
		min-height: 90px;
	}

	.omni-blog-card-title {
		font-size: 18px;
	}
}

@media (max-width: 480px) {
	.omni-blog-card {
		height: 300px;
	}

	.omni-blog-card-overlay {
		padding: 16px 12px 14px;
		min-height: 80px;
	}

	.omni-blog-card-category {
		font-size: 10px;
		margin-bottom: 5px;
	}

	.omni-blog-card-title {
		font-size: 16px;
		line-height: 1.25;
		margin-bottom: 6px;
	}

	.omni-blog-card-meta {
		font-size: 9px;
		gap: 4px;
	}

	.omni-blog-card-author,
	.omni-blog-card-date {
		font-size: 9px;
	}
}


/*--------------------------------------------------------------
Featured Links Section CSS
--------------------------------------------------------------*/
.graceful-omni-featured-links {
	width: 100%;
	position: relative;
	padding: 70px 40px 70px;
	background: #f9f4f1;
	box-sizing: border-box;
}

.graceful-omni-featured-links.wrapped-content {
	max-width: 1200px;
	margin: 0 auto;
}

.graceful-omni-featured-links-wrapper {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	position: relative;
}

.graceful-omni-featured-links-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	justify-content: center;
}

.graceful-omni-featured-link-item {
	flex: 0 0 calc(25% - 23px);
	max-width: calc(25% - 23px);
}

.graceful-omni-featured-link-anchor {
	display: block;
	position: relative;
	height: 170px;
	text-decoration: none;
	color: inherit;
	overflow: hidden;
}

.graceful-omni-featured-link-anchor::before {
	content: '';
	position: absolute;
	top: 10px;
	left: 10px;
	right: 10px;
	bottom: 10px;
	border: 1px solid rgba(255, 255, 255, 0.8);
	z-index: 2;
	pointer-events: none;
}

.graceful-omni-featured-link-anchor:focus {
	outline: 3px solid #888561;
	outline-offset: 2px;
}

.graceful-omni-featured-link-image {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-size: cover;
	background-position: center;
	background-color: #f5f3ef;
	transition: transform 0.4s ease;
}

.graceful-omni-featured-link-image::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.1);
}

.graceful-omni-featured-link-anchor:hover .graceful-omni-featured-link-image {
	transform: scale(1.05);
}

.graceful-omni-featured-link-placeholder {
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, #e8e4dc 0%, #f5f3ef 100%);
}

.graceful-omni-featured-link-overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 3;
}

.graceful-omni-featured-link-anchor:hover .graceful-omni-featured-link-overlay {
	/* no change needed */
}

.graceful-omni-featured-link-title {
	color: #222222 !important;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 2px;
	text-transform: uppercase;
	margin: 0;
	font-family: 'Open Sans', sans-serif;
	text-align: center;
	padding: 10px 20px;
	background: rgba(255, 255, 255, 0.85);
}

/* Tablet - 2 columns */
@media (max-width: 1024px) {
	.graceful-omni-featured-links {
		padding: 30px 30px 50px;
	}

	.graceful-omni-featured-link-item {
		flex: 0 0 calc(50% - 15px);
		max-width: calc(50% - 15px);
	}

	.graceful-omni-featured-links-grid {
		gap: 25px;
	}

	.graceful-omni-featured-link-anchor {
		height: 160px;
	}
}

/* Mobile - 1 column */
@media (max-width: 768px) {
	.graceful-omni-featured-links {
		padding: 20px 15px 40px;
	}

	.graceful-omni-featured-link-item {
		flex: 0 0 100%;
		max-width: 100%;
	}

	.graceful-omni-featured-links-grid {
		gap: 20px;
	}

	.graceful-omni-featured-link-anchor {
		height: 150px;
	}

	.graceful-omni-featured-link-title {
		font-size: 16px;
		letter-spacing: 1.5px;
	}
}
