/*
Theme Name: Graceful Spark Blog
Theme URI: https://optimathemes.com/graceful-spark-blog-theme/
Author: Aslam
Author URI: http://optimathemes.com/
Description: Graceful Spark Blog is a free, versatile WordPress theme designed for bloggers, creators, and storytellers. Whether you are sharing content about lifestyle, fashion, travel, beauty, food, fitness, health, tech, or news, this theme adapts beautifully to any niche. With a clean, modern, and minimal design, it ensures your content stands out across all devices—thanks to its fully responsive and Retina-ready layout. Built with performance and accessibility in mind, Graceful Spark Blog is SEO-friendly, WooCommerce compatible, translation-ready, and supports RTL languages. Whether you are launching a personal blog or building a professional online presence, this theme combines elegant aesthetics with powerful features to help you grow with confidence.
Template: graceful
Version: 1.0.0
Requires at least: 5.3
Tested up to: 6.8
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-spark-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;
}

.post-categories {
    background: #f1f1f1;
}

.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 {
    background: #eeeeee;
    background-image: linear-gradient(90deg,#5686FF 0%,#FF5671 100%) !important;
    color: #ffffff !important;
    font-weight: 700;    
}

aside .graceful-widget h2::after, 
.graceful-widget .widget-title::after {
    border-top: none;
}



.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: 'Mulish', sans-serif;
    font-size: 13px;
}

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

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

.blog article .post-header .post-meta a {
    font-family: 'Mulish', 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%;
    }
}

.graceful-spark-category-title {
    background: #5d84fa;
    background-image: linear-gradient(90deg,#5686FF 0%,#FF5671 100%) !important;
    color: #ffffff !important;
    margin-bottom: 20px;
    display: inline-block;
    padding: 2px 40px 5px;
}

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

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

.main-navigation-sidebar {
  position: absolute;
  top: 0px;
  left: 40px;
  z-index: 1;
}
            
.main-navigation-search {
  position: absolute;
  top: 0px;
  right: 40px;
  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: none;
  background-image: linear-gradient(90deg,#5686FF 0%,#FF5671 100%) !important;
}

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

#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: #ffffff;
}

#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;
  background: #ffffff;
}

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

#top-menu .sub-menu a:hover {
  background: #fafafa;
}

#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 .sub-menu > li > a {
  font-size: 11px;
  line-height: 24px;
  letter-spacing: 0.5px;
}

#top-menu li a {
  font-size: 11px;
  line-height: 40px;
  letter-spacing: 1px;
  font-weight: 700;
  text-transform: uppercase;
}
#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 #e1e1e1;
}

.entry-header {
    border-bottom: 1px solid #e1e1e1;
}

.main-content {
    margin-top: 40px;
    padding-left: 0;
    padding-right: 0;
}

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 24px;
    }
    #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 #cccccc;
}


.graceful-hero-banner {
    min-height: 500px;
    display: flex;
    align-items: center;
}

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

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

.graceful-hb-col img {
    width: 450px;
    height: 450px;
    margin: 50px;
}

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

.graceful-hb-col a {
    padding: 6px 20px;
    background: #333333;
    color: #ffffff !important;
    font-size: 14px;
    font-weight: bold;
    float: left;
    border-radius: 5px;
}



@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-post-slider   -wrap {
    margin-top: 20px;
}


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


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

#site-footer {
    background: #f7f7f7;
}

#site-footer .graceful-widget h2 {
    padding: 3px 5px 2px;
    background: #aaaaaa !important;
    background-image: linear-gradient(90deg, #5686FF 0%, #FF5671 100%) !important;
    color: #ffffff !important;
}

.intro-text form {
    margin-top: 35px;
}


#primary .continue-read a {
    font-family: Open Sans, sans-serif;
    font-size: 14px;
    font-weight: 300;
    background: #fafafa;
}

.blog .post-header {
    width: 80%;
    text-align: left;
    margin: 40px 10% 0;
}

.blog .post-page-content {
    width: 80%;
    text-align: left;
    margin: 0px 10%;
}

.blog .post-page-content p {
    padding: 0;
    margin: 0;
}

.blog .post-footer {
    width: 80%;
    text-align: left;
    margin: 0px 10%;
    padding: 3px 3px 3px 0 !important;
}

.blog .continue-read {
    text-align: left;
}

.post-categories {
    background: #f5f5f5;
    border: 1px solid #d3d3d3;
}

.site-images img {
    border-radius: 12px;
}

.site-images a::before {
    position: absolute;
    top: 0;
    left: -75%;
    z-index: 2;
    display: block;
    content: '';
    width: 50%;
    height: 100%;
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
    -webkit-transform: skewX(-25deg);
    transform: skewX(-25deg);
}
.site-images a:hover::before {
    -webkit-animation: shine .75s;
    animation: shine .75s;
}
@-webkit-keyframes shine {
    100% {
        left: 125%;
    }
}
@keyframes shine {
    100% {
        left: 125%;
    }
}

/* Hero Banner Image Animation Effect */
.graceful-hero-banner img {
    -webkit-animation: morph 15s ease-in-out infinite;
    animation: morph 15s ease-in-out infinite
}

@-webkit-keyframes morph {
    0% {
        border-radius: 60% 40% 30% 70%/60% 30% 70% 40%
    }

    50% {
        border-radius: 30% 60% 70% 40%/50% 60% 30% 60%
    }

    to {
        border-radius: 60% 40% 30% 70%/60% 30% 70% 40%
    }
}

@keyframes morph {
    0% {
        border-radius: 60% 40% 30% 70%/60% 30% 70% 40%
    }

    50% {
        border-radius: 30% 60% 70% 40%/50% 60% 30% 60%
    }

    to {
        border-radius: 60% 40% 30% 70%/60% 30% 70% 40%
    }
}


.graceful-hero-banner .graceful-hb-col .navigation-socials a {
    padding: 2px;
    background: transparent;
    color: #ff6481;
    font-size: 18px;
    font-weight: bold;
}


/*--------------------------------------------------------------
Featured Boxes Sections
--------------------------------------------------------------*/

#featured-boxes {
  border-bottom: 1px solid #eee;
  background: #fff;
  margin-top: 40px;
}

#featured-boxes .wrapped-content {
  font-size: 0;
  text-align: center;
}

#featured-boxes .featured-box {
  position: relative;
  float: left;
}

#featured-boxes a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#featured-boxes .featured-box img {
    border-radius: 12px;
}

#featured-boxes .graceful-wrap-outer {
  padding: 12px;
}

#featured-boxes h4 {
  display: inline-block;
  padding: 11px 20px;
  font-family: 'Lato', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  background-color: rgba(0,0,0,0.50);
  color: #ffffff !important;
}

#featured-boxes .featured-box {
    width: calc((100% - 50px ) /3);
    width: -webkit-calc((100% - 70px ) /3);
    margin-right: 34px;
}

#featured-boxes .featured-box:last-child {
    margin-right: 0;
}


@media screen and (max-width: 768px) {
    .featured-box {
        display: block;
    }
    .main-navigation-search {
        right: 20px;
        top: 7px !important;
    }
}


@media screen and (max-width: 480px) {
    #featured-boxes .featured-box {
        width: 100%;
        margin-bottom: 34px;
    }
    
    #featured-boxes {
      padding: 20px !important;
    }

    .main-navigation-search {
        top: 0 !important;
    }
}


/* Media Queries */
@media screen and (max-width: 480px) {
    .graceful-hero-banner {
        flex-direction: column;
        align-items: flex-start; /* Adjust as needed */
        flex-direction: column-reverse;

    }
    .graceful-hb-col a {
        float: unset;
        padding: 8px 20px;
    }
    .main-navigation-search {
        right: 20px;
    }
    .graceful-hb-col img {
        width: 100%;
        height: 100%;
        text-align: center; 
        margin: 20px 0px 30px;
    }
    .graceful-hb-col h2 {
        font-size: 28px;
        margin-bottom: 20px;
    }
    .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;
    }
}

.site-menu-wrapper {
    margin-right: 0px;
    text-align: center;
}


/**
 * Spark Post Slider
 */
/* === Gracemax Custom Carousel Styles === */
.gracespark-carousel-section {
  max-width: 1300px;
  margin: 0 auto;
  padding: 60px 0px 20px;
  position: relative;
  box-sizing: border-box;
}

.gracespark-carousel .item {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: start;
}

.gracespark-carousel .gracespark-carousel-image {
  position: relative;
  overflow: hidden;
  height: 400px; /* Fixed height for all images */
}

.gracespark-carousel .gracespark-carousel-image img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 12px;
}

/* Text section */
.gracespark-carousel-text {
  font-family: "Inter", sans-serif;
  padding-top: 1px; 
}
.gracespark-carousel-category {
  font-size: 14px;
  font-weight: bold;
  text-transform: uppercase;
  color: #ff4d00;
  background: #fff1ea;
  padding: 6px 14px;
  border-radius: 20px;
  display: inline-block;
  margin-bottom: 12px;
}
.gracespark-carousel-title {
  font-size: 36px;
  font-weight: bold;
  margin-bottom: 20px;
  line-height: 1.2;
}
.gracespark-carousel-excerpt {
  font-size: 18px;
  color: #666;
}

/* Nav arrows - UPDATED FOR BIGGER ARROWS */
.gracespark-carousel .owl-nav {
  position: absolute;
  bottom: -50px;
  left: 30px;
  right: 30px;
  display: flex;
  justify-content: space-between;
  pointer-events: none;
}

.gracespark-carousel .owl-nav button {
  background: none;
  border: none;
  pointer-events: all;
  transition: transform 0.3s, opacity 0.3s;
  opacity: 0.8;
  padding: 0 !important;
}

.gracespark-carousel .owl-nav button:hover {
  transform: scale(1.1);
  opacity: 1;
}

.gracespark-carousel .owl-nav button svg {
  width: 36px;  /* Increased SVG size from 24px */
  height: 36px; /* Increased SVG size from 24px */
  fill: #ff4d00;
}

/* Pagination dots */
.gracespark-carousel .owl-dots {
  position: absolute;
  bottom: -37px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 10px;
}
.gracespark-carousel .owl-dot span {
  display: inline-block;
  width: 40px;
  height: 3px;
  background: #ccc;
  border-radius: 3px;
  transition: background 0.3s;
}
.gracespark-carousel .owl-dot.active span {
  background: #ff4d00;
}

.gracespark-carousel-title a {
  color: #000;
  text-decoration: none;
  transition: color 0.3s;
}

.gracespark-carousel-title a:hover {
  color: #ff4d00;
}

/* Responsive */
@media (min-width: 1080px) {
    .gracespark-carousel .owl-nav {
        bottom: 0px;
      left: unset;
      right: 30px;
      width: 46%;
    }
    .gracespark-carousel .owl-dots {
      bottom: 14px;
      left: unset;
      right: 13%;

    }
}

@media (max-width: 768px) {
  .gracespark-carousel .item {
    grid-template-columns: 1fr;
  }
  .gracespark-carousel-title {
    font-size: 28px;
  }
  
  .gracespark-carousel .gracespark-carousel-image {
    height: 300px; /* Smaller height for mobile */
  }
  
  .gracespark-carousel .owl-nav button svg {
    width: 30px; /* Slightly smaller on mobile */
    height: 30px;
  }
  .gracespark-carousel-section {
      padding: 60px 20px;
    }
}

@media (max-width: 1080px) {
    .gracespark-carousel-section {
      padding: 60px 20px;
    }
}


/**
 * Favorite Categories Styles
 */
.favorite-categories-container {
    margin: 2.5rem auto;
    padding: 0 15px;
}

.max-width-container {
    max-width: 1200px;
}

.favorite-categories-title {
    font-size: 28px;
}

.favorite-categories-header {
    margin-bottom: 0.5rem;
}

.favorite-categories-divider {
    border: 0;
    border-top: 1px solid #eee;
    margin: 10px 0 20px;
}

/* Base grid layout */
.favorite-categories-grid {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(4, 1fr);
}

/* Adjust grid based on number of categories */
.favorite-categories-grid.items-1 {
    grid-template-columns: 1fr;
    max-width: 300px;
    margin: 0 auto;
}

.favorite-categories-grid.items-2 {
    grid-template-columns: repeat(2, 1fr);
    max-width: 620px;
    margin: 0 auto;
}

.favorite-categories-grid.items-3 {
    grid-template-columns: repeat(3, 1fr);
}

/* Responsive adjustments */
@media (max-width: 992px) {
    .favorite-categories-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    /* Center single column on tablet */
    .favorite-categories-grid.items-1 {
        max-width: 300px;
        margin: 0 auto;
    }
}

@media (max-width: 576px) {
    .favorite-categories-grid {
        grid-template-columns: 1fr;
        max-width: 300px;
        margin: 0 auto;
    }
}

.favorite-category-item {
    overflow: hidden;
    border-radius: 10px;
    transition: transform 0.2s ease;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.favorite-category-item:hover {
    transform: translateY(-5px);
}

.favorite-category-link {
    display: block;
    text-decoration: none;
}

.favorite-category-image-container {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    height: 300px;
}

/* Grey background for when no image is set */
.favorite-category-image-container.no-image {
    background-color: #f2f2f2;
}

.favorite-category-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}

.favorite-category-label {
    position: absolute;
    bottom: 228px;
    left: 25%;
    transform: translateX(-50%);
    background-color: rgba(0, 0, 0, 0.5);
    background-image: linear-gradient(90deg,#5686FF 0%,#FF5671 100%) !important;
    color: #ffffff;
    padding: 8px 20px;
    font-weight: bold;
    font-size: 24px;
    letter-spacing: 3px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
    min-width: 500px;
    transform: rotate(-90deg);
}


/**
 * Spark Post Slider
 */
/* === Gracemax Custom Carousel Styles === */

#gracefulspark-blog-carousel-section {
    position: relative;
    padding: 40px 0;
    overflow: hidden;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
    min-height: 500px;
}

.gracefulspark-carousel-container {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.gracefulspark-blog-carousel-title {
    text-align: center;
    color: #ffffff;
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 50px;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.gracefulspark-blog-post-card {
    background: #ffffff;
    border-radius: 20px;
    /*box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);*/
    margin: 15px;
    overflow: hidden;
    transition: all 0.3s ease;
    height: 420px;
    display: flex;
    flex-direction: column;
}

.gracefulspark-blog-post-card:hover {
    transform: translateY(-10px);
    
}

.gracefulspark-card-image {
    position: relative;
    height: 200px;
    overflow: hidden;
}

.gracefulspark-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.gracefulspark-blog-post-card:hover .gracefulspark-card-image img {
    transform: scale(1.05);
}

.gracefulspark-category-badge {
    position: absolute;
    top: 15px;
    left: 15px;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #ffffff;
    z-index: 3;
}

.gracefulspark-category-training {
    background: linear-gradient(45deg, #667eea, #764ba2);
}

.gracefulspark-category-workout {
    background: linear-gradient(45deg, #00c9ff, #92fe9d);
}

.gracefulspark-category-nutrition {
    background: linear-gradient(45deg, #fc466b, #3f5efb);
}

.gracefulspark-category-default {
    background: linear-gradient(45deg, #667eea, #764ba2);
}

.gracefulspark-card-content {
    padding: 25px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.gracefulspark-card-title {
  font-size: 1.350rem;
  font-weight: 600;
  color: #1F2937;
  line-height: 1.4;
  margin-bottom: 24px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  position: relative;
  padding-bottom: 30px;
}

.gracefulspark-card-title a {
    color: inherit;
    text-decoration: none;
    transition: color 0.3s ease;
}

.gracefulspark-card-title a:hover,
.gracefulspark-card-title a:focus {
    color: #667eea;
    outline: 2px solid #667eea;
    outline-offset: 2px;
}

.gracefulspark-author-info {
    display: flex;
    align-items: center;
    margin-top: auto;
    position: relative;
  padding-top: 24px;
}

.gracefulspark-author-info::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: linear-gradient(to right, RGBA(173,75,248,1) 0%,RGBA(255,255,255,1) 100%);
  border-radius: 2px;
}

#gracefulspark-blog-carousel-section .gracefulspark-author-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-right: 12px;
    border: 2px solid #e2e8f0;
}

.gracefulspark-author-details {
    flex-grow: 1;
}

.gracefulspark-author-label {
    font-size: 12px;
    color: #a0aec0;
    margin-bottom: 2px;
}

.gracefulspark-author-name {
    font-size: 14px;
    font-weight: 600;
    color: #4a5568;
}

/* Default placeholder image */
.gracefulspark-placeholder-image {
    background: linear-gradient(45deg, #f7fafc, #edf2f7);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #a0aec0;
    font-size: 14px;
    width: 100%;
    height: 100%;
}

/* Owl Carousel Custom Styles */
.gracefulspark-blog-posts-carousel .owl-nav {
    position: absolute;
    top: 40%;
    transform: translateY(-50%);
    width: 100%;
    margin: 0;
}

.gracefulspark-blog-posts-carousel .owl-nav button.owl-prev,
.gracefulspark-blog-posts-carousel .owl-nav button.owl-next {
    position: absolute;
    background: rgba(255, 255, 255, 0.9) !important;
    color: #667eea !important;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    font-size: 24px;
    margin: 0;
    border: none;
    outline: none;
    transition: all 0.3s ease;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.gracefulspark-blog-posts-carousel .owl-nav button.owl-prev {
    left: -50px;
}

.gracefulspark-blog-posts-carousel .owl-nav button.owl-next {
    right: -50px;
}

.gracefulspark-blog-posts-carousel .owl-nav button:hover,
.gracefulspark-blog-posts-carousel .owl-nav button:focus {
    background: #ffffff !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
    transform: scale(1.05);
    outline: 2px solid #667eea;
    outline-offset: 2px;
}

.gracefulspark-blog-posts-carousel .owl-dots {
    text-align: center;
    margin-top: 40px;
    position: relative;
    z-index: 3;
}

.gracefulspark-blog-posts-carousel .owl-dot {
  display: inline-block;
  margin: 0 6px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.6) !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  border: 2px solid rgba(255, 255, 255, 0.3) !important;
  outline: none;
  cursor: pointer;
}

.gracefulspark-blog-posts-carousel .owl-dot.active {
  background: #ffffff !important;
  border: 2px solid #ffffff !important;
  transform: scale(1.2);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.gracefulspark-blog-posts-carousel .owl-dot:hover,
.gracefulspark-blog-posts-carousel .owl-dot:focus {
  background: rgba(255, 255, 255, 0.8) !important;
  border: 2px solid rgba(255, 255, 255, 0.8) !important;
  transform: scale(1.1);
}

/* Responsive Design */
@media (max-width: 768px) {
    #gracefulspark-blog-carousel-section {
        padding: 60px 0 80px;
    }
    
    .gracefulspark-blog-carousel-title {
        font-size: 2rem;
        margin-bottom: 30px;
    }
    
    .gracefulspark-blog-post-card {
        height: auto;
        margin: 10px;
    }
    
    .gracefulspark-blog-posts-carousel .owl-nav button.owl-prev {
        left: -15px;
    }
    
    .gracefulspark-blog-posts-carousel .owl-nav button.owl-next {
        right: -15px;
    }
}

@media (max-width: 480px) {
    .gracefulspark-carousel-container {
        padding: 0 10px;
    }
    
    .gracefulspark-blog-posts-carousel .owl-nav button.owl-prev,
    .gracefulspark-blog-posts-carousel .owl-nav button.owl-next {
        width: 40px;
        height: 40px;
        font-size: 20px;
    }
}

/* Screen reader only text */
.gracefulspark-sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

#top-navigation {
    background: unset !important;
    background-image: linear-gradient(90deg,#5686FF 0%,#FF5671 100%) !important;
}