@font-face {
    font-family: 'monotype_corsivaregular';
    src: url('../fonts/mtcorsva-webfont.eot');
    src: url('../fonts/mtcorsva-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/mtcorsva-webfont.woff2') format('woff2'),
        url('../fonts/mtcorsva-webfont.woff') format('woff'),
        url('../fonts/mtcorsva-webfont.svg#monotype_corsivaregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Nunito Sans Regular';
    font-style: normal;
    font-weight: normal;
    src: local('../fonts/Nunito Sans Regular'), url('../fonts/NunitoSans-Regular.woff') format('woff');
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --primary-color: #5e40e8;
    --secondary-color: #bfabf6;
    --gradient-color: linear-gradient(45deg, #5f3fe5, #603fe6);
}

body {
    background: #f8f8fc;
    color: #111827;
    font-size: 14px;
    font-family: 'Nunito Sans Regular';
    padding: 120px 0;
}

img {
    width: 100%;
    height: auto;
}

a {
    text-decoration: none;
}

ul {
    list-style-type: none;
}

* {
    box-sizing: border-box;
}

.btn {
    border: none;
    padding: 14px 28px;
    color: #fff;
    font-weight: 600;
    border-radius: 14px;
    cursor: pointer;
}

@keyframes float {
    0% {
        transform: translateY(5px);
    }

    50% {
        transform: translateY(-30px);
    }

    100% {
        transform: translateY(0px);
    }
}

.container {
    width: 96%;
    display: table;
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
}

.header {
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 999999;
    background: #fff;
    border-bottom: 1px solid #ededed;
}

.header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
}

.logo_wrap {
    width: auto;
    float: left;
}

.nav-menu {
    z-index: 99999;
}

.nav-menu ul {
    display: flex;
    list-style: none;
    gap: 35px;
}

.nav-menu ul li {
    position: relative;
}

.nav-menu ul li a .trending_icon {
    width: 17px;
    position: absolute;
    bottom: -2px;
    background-color: transparent;
    top: 3px;
    left: 100%;
}

.nav-menu ul li a.prime_color {
    color: var(--primary-color);
}

.nav-menu ul li a {
    font-size: 16px;
    color: #767676;
    border-bottom: 2px solid transparent;
    padding-bottom: 5px;
}
.nav-menu ul li a i{
    display:none;
}
.nav-menu ul.submenu li a,
.nav-menu ul.sub-menu li a {
    color: #767676 !important;
    border-bottom: 2px solid transparent !important;
    font-size: 14px !important;
}

.nav-menu ul li a:hover,
.nav-menu ul li.current-menu-item a {
    color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

.nav-menu ul li a span {
    background-color: var(--primary-color);
    position: absolute;
    left: 0px;
    top: 100%;
    width: 0px;
    height: 3px;
    border-radius: 10px;
    transition: width 0.15s linear;
}

.nav-menu ul:not(.submenu):not(.sub-menu)>li.current-menu-item>a>.trending_icon,
.nav-menu ul:not(.submenu):not(.sub-menu)>li:hover>a>.trending_icon {
    width: 17px;
}

.nav-menu ul:not(.submenu):not(.sub-menu)>li.current-menu-item>a>span,
.nav-menu ul:not(.submenu):not(.sub-menu)>li:hover>a>span {
    width: 100%;
}

.header-btns {
    display: flex;
    gap: 12px;
}

.header-btns a {
    color: #111;
}

.icon.search {
    padding: 17px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 50%;
    color: #111;
}

.primary_btn {
    background: var(--gradient-color);
    box-shadow: 0 10px 30px rgba(124, 58, 237, .25);
    color: #fff !important;
}

.white_btn {
    padding: 15px;
    background: #decefb47;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    cursor: pointer;
    position: relative;
    color: #111827;
}

ul.submenu,
ul.sub-menu {
    position: absolute;
    background: #fff;
    padding: 13px 12px;
    border-radius: 10px;
    top: 40px;
    box-shadow: 1px 2px 9px #ccc;
    display: none;
    z-index: 999;
}

ul.submenu li,
ul.sub-menu li {
    padding-bottom: 5px;
    margin-bottom: 5px;
}

.white_btn:hover ul.submenu.account,
.nav-menu ul li:hover ul.submenu,
.nav-menu ul li:hover ul.sub-menu {
    display: block;
}

/* Premium Account Dropdown styling */
ul.submenu.account {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    left: auto;
    width: 160px;
    background: #ffffff;
    border: 1px solid #e7e1ff;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(99, 102, 241, 0.08);
    padding: 8px;
    z-index: 99999;
    border-left: none; /* override default left border */
}

ul.submenu.account::before {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    height: 8px;
    background: transparent;
}

ul.submenu.account li {
    padding: 0 !important;
    margin: 0 !important;
    list-style: none;
}

ul.submenu.account li a {
    display: block;
    padding: 8px 12px;
    color: #4b5563;
    font-size: 13px;
    font-weight: 500;
    border-radius: 8px;
    transition: background-color 0.2s, color 0.2s;
    text-align: left;
    text-transform: none;
    letter-spacing: normal;
}

ul.submenu.account li a:hover {
    background-color: #f5f3ff;
    color: #6366f1;
}

ul.submenu,
ul.sub-menu {
    top: 25px;
    border-left: 3px solid var(--primary-color);
    width: 178px;
}

.primary_btn:hover,
.writer-card .primary_btn:hover {
    background: #9d80ef;
}

.nav-menu ul li i {
    font-size: 10px;
}

.nav-menu ul li.menu-item-has-children>a::after {
    content: "\f107";
    font-family: "FontAwesome", "Font Awesome 5 Free", "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 10px;
    margin-left: 6px;
    display: inline-block;
    vertical-align: middle;
}

.editors-pick {
    min-width: 0;
}

.editors-pick-slider {
    width: 100%;
    overflow: hidden;
}

.editors-pick-slider .swiper-slide {
    width: 100% !important;
}

.hero {
    position: relative;
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    align-items: center;
    background: #fff;
    border-radius: 30px;
    overflow: hidden;
    padding: 40px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .05);
}

.hero:before {
    content: "";
    position: absolute;
    inset: 0;

    background:
        radial-gradient(circle at 80% 20%,
            rgba(125, 94, 255, .15),
            transparent 40%);
}

.hero-content {
    width: 100%;
    z-index: 2;
}

.tag {
    display: inline-block;
    border: 1px solid #d9cfff;
    color: #6d5efc;
    font-size: 13px;
    font-weight: 600;
    padding: 10px 18px;
    border-radius: 50px;
    margin-bottom: 25px;
}

.hero h1 {
    font-size: 50px;
    line-height: 1.08;
    margin-bottom: 25px;
    font-weight: 800;
}

.hero p {
    font-size: 20px;
    color: #6b7280;
    line-height: 1.5;
    margin-bottom: 18px;
}

.author_details_section {
    display: flex;
    align-items: center;
    gap: 15px;
}

.author_details_section.margin {
    margin-bottom: 35px;
    margin-top: 25px;
}

.author_details_section img {
    width: 50px !important;
    height: 50px !important;
    border-radius: 50% !important;
}

.author_details_section h4 {
    font-size: 14px;
    margin-bottom: 4px;
}

.author_details_section h4 a {
    color: #6c4eff;
}

.author_details_section h4 a:hover {
    color: #7a7a7a;
}

.author_details_section span {
    color: #6b7280;
    font-size: 12px;
}

.hero-image {
    text-align: right;
    position: relative;
    border-radius: 15px;
}

.hero-image img {
    width: 100%;
    border-radius: 25px;
}

.section {
    margin: 30px 0;
}

.section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 14px;
}

.section-header h2 {
    font-size: 24px;
    color: #111;
}

.section-header a {
    text-decoration: none;
    color: #6d5efc;
    font-weight: 600;
}

.topics-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 20px;
}

.topic-card {
    background: white;
    border-radius: 20px;
    padding: 15px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, .04);
    transition: 0.6s ease-out;
}

.topic-card:hover {
    transform: translateY(-5px);
}

.topic-card .icon {
    width: 55px;
    height: 55px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    margin-bottom: 18px;
}

.purple {
    background: #f2ecff;
    color: #7c3aed;
}

.blue {
    background: #e8f2ff;
    color: #3b82f6;
}

.green {
    background: #e9fff0;
    color: #16a34a;
}

.pink {
    background: #ffeef6;
    color: #ec4899;
}

.orange {
    background: #fff4e7;
    color: #f97316;
}

.violet {
    background: #f3edff;
    color: #8b5cf6;
}

.topic-card h4 {
    margin-bottom: 10px;
    font-size: 18px;
}

.topic-card span a {
    color: #6b7280;
    transition: 0.6s ease-out;
}

.topic-card h4 a {
    color: #111827;
    transition: 0.6s ease-out;
}

.topic-card h4 a:hover,
.topic-card span a:hover {
    color: var(--primary-color);

}

/* content section */
.content-section {
    display: grid;
    grid-template-columns: 2fr 1.25fr;
    gap: 16px;
}
.editors-pick,
.trending-section,
.top-writers-category,
.writer-cta,
.section.subcategories {
    background: #fff;
    border: 1px solid #e7e1ff;
    border-radius: 24px;
    padding: 25px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .03);
}

.section-header h2 i {
    color: var(--primary-color);
}

.featured-image {
    position: relative;
}

.featured-image img {
    width: 100%;
    height: 320px;
    object-fit: cover;
    border-radius: 18px;
}

.play-btn {
    position: absolute;
    right: 25px;
    bottom: 25px;
    width: 65px;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    text-decoration: none;
    background: linear-gradient(135deg,
            #60a5fa,
            #8b5cf6);

    color: #fff;
    font-size: 22px;

    box-shadow:
        0 15px 30px rgba(139, 92, 246, .35);
}

.category_name {
    display: inline-block;
    margin-top: 20px;
    background: #ede9fe;
    color: #7c3aed;
    padding: 8px 14px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 600;
}

.featured-post h3 {
    font-size: 24px;
    line-height: 1.3;
    margin-top: 18px;
    margin-bottom: 15px;
}

.featured-post h3 a {
    color: #111827;
}

.featured-post h3 a:hover {
    color: var(--primary-color);
}

.featured-post p {
    color: #6b7280;
    line-height: 1.6;
    font-size: 16px;
}

.featured-post .author_details_section {
    margin-top: 12px;
    margin-bottom: 0px;
}

/* Trending */

.trending-list {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.trending-item {
    display: flex;
    gap: 18px;
    align-items: flex-start;
}

.trending-item img {
    width: auto;
    /* height: 90px; */
    border-radius: 12px;
    object-fit: cover;
    flex-shrink: 0;
}

.trending-item h4 {
    font-size: 16px;
    line-height: 1.45;
    margin-bottom: 10px;
}

.trending-item h4 a,
.hero h1 a,
.writer-card h3 a,
.article-content h3 a {
    color: #111;
}

.trending-item h4 a:hover,
.hero h1 a:hover,
.writer-card h3 a:hover,
.article-content h3 a:hover {
    color: var(--primary-color);
}

.trending-item span {
    color: #6b7280;
    font-size: 14px;
}

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

/* CARD */

.article-card {
    background: #fff;
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid #ececec;
    transition: .3s;
}

.article-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, .06);
}

.article-image {
    position: relative;
}

.article-image img {
    width: 100%;
    height: 180px;
    object-fit: cover;
}

.category-tag {
    position: absolute;
    top: 15px;
    left: 15px;
    font-size: 12px;
    font-weight: 600;
    padding: 8px 14px;
    border-radius: 30px;
    color: #fff;
}

.category-tag a {
    color: #fff;
}

.category-tag.purple {
    background: #7c3aed;
}

.category-tag.blue {
    background: #3b82f6;
}

.category-tag.green {
    background: #22c55e;
}

.category-tag.orange {
    background: #f97316;
}

/* CONTENT */

.article-content {
    padding: 20px;
}

.article-content h3 {
    font-size: 16px;
    line-height: 1.4;
    margin-bottom: 8px;
}

/*newsletter*/
.newsletter-box {
    background: linear-gradient(135deg, #faf8ff, #f5f3ff);
    border: 1px solid #ececec;
    border-radius: 24px;
    padding: 35px 45px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.newsletter-left {
    display: flex;
    align-items: center;
    gap: 20px;
}

.newsletter-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 30px;
    background: linear-gradient(135deg, #60a5fa, #8b5cf6);
}

.newsletter-left h3 {
    font-size: 32px;
    margin-bottom: 8px;
}

.newsletter-left p {
    color: #6b7280;
    font-size: 16px;
}

.newsletter-form {
    display: flex;
    gap: 15px;
    width: 50%;
}

.newsletter-form input {
    flex: 1;
    height: 60px;
    border: none;
    background: white;
    border-radius: 16px;
    padding: 0 20px;
    font-size: 15px;
    outline: none;
}

.newsletter-form button {
    width: 170px;
    border: none;
    color: white;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    border-radius: 16px;
    background: var(--primary-color);
}

/* footer */
.footer-section {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
    gap: 60px;
    padding-bottom: 20px;
}

.footer {
    position: relative;
    padding-top: 20px;
    float: left;
    width: 100%;
    /* padding-bottom: 20px; */
    z-index: 999;
    background: #f9f9f9;
}

.footer .logo_wrap {
    width: 80%;
    margin-bottom: 15px;
}

.footer-section .footer-col {
    flex: 1;
    min-width: 18%;
}

.footer-section .footer-col h4 {
    margin-bottom: 15px;
    font-size: 14px;
    letter-spacing: 1px;
}

.footer-col ul li a {
    color: #5a5a5a;
    float: left;
    width: 100%;
    margin-bottom: 5px;
    transition: 0.6s ease-out;
}

.footer-col ul li a:hover {
    padding-left: 5px;
    color: var(--primary-color);
}

.footer-col p {
    color: #5a5a5a;
    line-height: 21px;
    margin: 10px 0;
}

.social-icons {
    margin-top: 18px;
}

.social-icons a {
    color: #222;
    margin-right: 15px;
}

.footer_logo {
    float: left;
    width: 100%;
    margin-bottom: 8px;
}

.footer_logo img {
    width: 80px;
}

.footer-bottom {
    text-align: center;
    padding: 16px 15px;
    font-size: 12px;
    opacity: 0.8;
    border-top: 1px solid rgb(159 159 159 / 20%);
    float: left;
    width: 100%;
}

.footer-bottom a {
    color: var(--primary-color);
}

.footer-bottom a:hover {
    color: var(--secondary-color);
}

.footer-col.big_width {
    min-width: 30%;
}

.section.exhibition_notifiation {
    padding-top: 0;
}

.tags {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
}

.tags a {
    text-decoration: none;
    padding: 5px 10px;
    background: #f2eeff;
    border: 1px solid #ececec;
    border-radius: 12px;
    color: #6b7280;
    font-size: 14px;
    transition: .3s;
}

.tags a:hover {
    background: #8B5CF6;
    color: white !important;
    border-color: #8B5CF6;
    padding-left: 16px !important;
}

/*write-for-us*/
.section.profile-upgrade {
    position: relative;
}

.profile-upgrade {
    display: grid;
    grid-template-columns: 2fr 1.25fr;
    gap: 30px;
    align-items: center;
    background: #fff;
    border-radius: 30px;
    overflow: hidden;
    padding: 60px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .05);
    min-height: 500px;
}

.center-image {
    position: relative;
    /* left: 50%; */
    /* width: 360px; */
    text-align: center;
    z-index: 9;
}

.center-image img {
    width: 520px;
}

.left-section {
    max-width: 500px;
    position: relative;
}

.info-card {
    position: absolute;
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 24px;
    padding: 12px 15px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .04);
}

.number {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: white;
    font-size: 14px;
    font-weight: 700;
    background: linear-gradient(135deg, #8b5cf6, #3b82f6);
}

.info-card h3 {
    font-size: 16px;
    margin: 9px 0;
    line-height: 1.2;
}

.info-card p {
    font-size: 13px;
    color: #475569;
    line-height: 1.2;
}

.card-1 {
    width: 210px;
    top: -70px;
    left: 30px;
}

.card-2 {
    width: 232px;
    left: -43px;
    bottom: -12px;
}

.card-3 {
    width: 240px;
    right: -142px;
    bottom: 200px;
}

.card-4 {
    width: 220px;
    right: -147px;
    bottom: 54px;
}

.card-5 {
    width: 220px;
    right: 30px;
    bottom: -60px;
}

.circle-stat {
    width: 50px;
    /* height: 50px; */
    border-radius: 50%;
    /* display: flex; */
    align-items: center;
    justify-content: center;
    font-size: 17px;
    font-weight: 800;
    /* margin-top: 20px; */
    color: var(--primary-color);
    /* border: 5px solid var(--primary-color); */
    position: relative;
}

.right-section h3 {
    font-size: 32px;
    margin-bottom: 14px;
}

.right-section p {
    color: #6b7280;
    line-height: 1.6;
    font-size: 16px;
}

.btn_wrap {
    margin-top: 35px;
}

.pricing_plan_link {
    width: 100%;
    display: inline-block;
    margin: 26px 0;
    color: var(--primary-color);
}

/*top-writers*/
.section-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 22px;
    flex-wrap: wrap;
}

.section-badge {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 30px;
    background: #f4f0ff;
    color: #6d5efc;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 12px;
}

.section-header p {
    color: #64748b;
}

.view-all {
    text-decoration: none;
    color: #6d5efc;
    font-weight: 600;
}

.writers-grid {

    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
}

.writer-card {
    background: white;
    border: 1px solid #ececec;
    border-radius: 24px;
    overflow: hidden;
    text-align: center;
    transition: .3s;
}

.writer-card:hover {
    transform: translateY(-8px);
    box-shadow:
        0 20px 40px rgba(0, 0, 0, .06);
}

.writer-cover {
    height: 110px;
    background: linear-gradient(135deg, #60a5fa, #8b5cf6);
    position: relative;
}

.writer-avatar {
    width: 95px;
    height: 95px;
    border-radius: 50%;
    margin-top: -45px;
    border: 5px solid white;
    object-fit: cover;
    z-index: 99;
    position: relative;
}

.btn.follow_btn {
    background: #ffffff36;
    padding: 6px 22px;
    border-radius: 8px;
    position: absolute;
    right: 9px;
    top: 10px;
}

.btn.follow_btn:hover {
    background: var(--primary-color);
}

.writer-card h3 {
    margin-top: 15px;
    font-size: 22px;
}

.writer-role {
    display: block;
    color: #6d5efc;
    margin-top: 8px;
    margin-bottom: 20px;
}

.writer-stats {
    display: flex;
    justify-content: center;
    gap: 25px;
    margin-bottom: 25px;
}

.writer-stats strong {
    display: block;
    font-size: 20px;
}

.writer-stats span {
    color: #64748b;
    font-size: 13px;
}

.writer-card .primary_btn {
    display: block;
    margin: 0 20px 20px;
    padding: 14px;
    border-radius: 14px;
    text-decoration: none;
    color: white;
    background: var(--primary-color)
}

.create_ac_mobile_view {
    display: none;
}

.right-section h3 {
    font-size: 25px;
}

/*footer*/
.mobile-footer {
    position: fixed;
    bottom: 5px;
    left: 50%;
    transform: translateX(-50%);
    width: 95%;
    /* max-width: 500px; */
    background: rgba(255, 255, 255, .95);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, .8);
    border-radius: 24px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 12px 10px;
    box-shadow: 0 15px 40px rgba(0, 0, 0, .08);
    z-index: 9999;
    display: none;
}

.footer-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    text-decoration: none;
    color: #64748b;
    font-size: 10px;
    transition: .3s;
}

.footer-item i {
    font-size: 15px;
}

.footer-item.active {
    color: #6d5efc;
}

.footer-item:hover {
    color: #6d5efc;
}

.menu_trigger {
    float: inline-start;
    font-family: "FontAwesome";
    font-size: 22px;
    width: 40px;
    height: 25px;
    text-decoration: none;
    display: none;
    text-align: center;
    margin: 13px auto;
    color: #111;
}

.menu_trigger::before {
    content: "\f0c9";
}

.close_btn {
    position: absolute;
    inset-inline-end: -3px;
    top: 0;
    padding: 10px;
    display: none;
    color: #fff;
}

.category-layout {
    display: grid;
    grid-template-columns: 2fr 360px;
    gap: 30px;
}

.category-hero {
    display: grid;
    grid-template-columns: 2fr 1fr;
    background: linear-gradient(135deg, #f6f2ff, #f3f0fd);
    border-radius: 28px;
    padding: 10px 28px;
    align-items: center;
    /* margin-bottom: 40px; */
    margin-top: 0;
}

.category-icon {
    width: 50px;
    height: 50px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #6d5efc;
    background: white;
    box-shadow: 0 10px 30px rgba(109, 94, 252, .08);
}

.category-hero h1 {
    font-size: 32px;
    margin: 10px 0 6px;
}

.category-hero p {
    color: #64748b;
    font-size: 16px;
    line-height: 1.4;
    max-width: 500px;
}

.category-stats {
    display: flex;
    gap: 25px;
    margin: 14px 0 0;
}

.category-stats span {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #475569;
}

.category-stats i {
    color: var(--primary-color);
}

.featured-post.category-featured {
    background: #fff;
    border: 1px solid #ececec;
    border-radius: 24px;
    padding: 25px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .03);
}

.bookmark_icon {
    position: absolute;
    right: 14px;
    top: 5px;
    background: #fff;
    padding: 13px 12px;
    color: #ffffff;
    border-radius: 50%;
    color: var(--primary-color);
    cursor: pointer;
}

.bookmark_icon:hover,
.bookmark_icon.active {
    background: var(--primary-color);
    color: #fff;
}

.category-stats.in-post {
    margin-bottom: 15px;
    margin-top: 8px;
    gap: 11px;
}

.category-stats.in-post a {
    color: #111;
    font-size: 11px;
}

.category-stats.in-post i {
    font-size: 10px;
}

.category-stats.in-post a:hover {
    color: var(--primary-color);
}

.in_category_details {
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.section.main_wrap {
    margin: 0;
}

/*pagignation*/
.pagination {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    margin: 20px 0;
    flex-wrap: wrap;
    width: 100%;
    position: relative;
}

.pagination a,
.pagination span {
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    transition: .3s ease;
}

.page-number {
    background: #fff;
    color: #333;
    border: 1px solid #e5e5e5;
}

.page-number:hover {
    background: #f8f8f8;
    transform: translateY(-2px);
}

.page-number.active {
    background: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
    box-shadow: 0 8px 20px rgb(79 91 255 / 25%);
}

.page-btn {
    background: #111827;
    color: #fff;
}

.page-btn:hover {
    background: #000;
    transform: translateY(-2px);
}

.dots {
    color: #999;
    width: auto !important;
    padding: 0 5px;
}

.writer-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 22px;
}

.writer-info {
    display: flex;
    align-items: center;
    gap: 12px;
}

.writer-info img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover;
}

.writer-info h4 {
    font-size: 15px;
    margin-bottom: 3px;
    font-weight: 600;
}

.writer-info span {
    font-size: 13px;
    color: #64748b;
}

.follow-btn {
    padding: 10px 18px;
    border-radius: 12px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    color: #7c3aed;
    background: #f3efff;
    transition: .3s;
}

.follow-btn:hover {
    background: #7c3aed;
    color: #fff;
}

.view-link-wrap {
    margin-top: 20px;
    text-align: right;
}

.writer-cta {
    background: linear-gradient(135deg, #f6f2ff, #f3f0fd);
    padding-bottom: 36px;
}

.writer-cta .section-header {
    margin-bottom: 4px;
    margin-top: 20px;
}

.writer-cta .icon-box {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    margin-bottom: 9px;
    color: #7c3aed;
    font-size: 18px;
    background: linear-gradient(135deg, #efe8ff, #e8edff);
}

.writer-cta h3 {
    font-size: 34px;
    margin-bottom: 15px;
}

.writer-cta p {
    color: #64748b;
    line-height: 1.8;
    margin-bottom: 25px;
}

.view-subcat-wrap {
    margin-top: 12px;
}

.view-subcat-wrap .view-all {
    background: var(--primary-color);
    padding: 10px 16px;
    border-radius: 10px;
    color: #fff;
}

.subcategory-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 9px;
}

.subcategory-card {
    background: #fff;
    border: 1px solid #eef0f7;
    border-radius: 20px;
    padding: 11px 10px;
    text-align: center;
    text-decoration: none;
    transition: .3s ease;
    box-shadow: 0 4px 15px rgba(0, 0, 0, .03);
}

.subcategory-card:hover {
    transform: translateY(-5px);
    border-color: #8b5cf6;
    box-shadow: 0 15px 35px rgba(139, 92, 246, .12);
}

.subcategory-card .icon {
    width: 52px;
    height: 52px;
    margin: 0 auto 15px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #f4efff, #eef3ff);
}

.subcategory-card .icon i {
    font-size: 22px;
    color: #7c3aed;
}

.subcategory-card span {
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: #1f2937;
    line-height: 1.4;
}

/* Single blog css */

/* PROGRESS */

.progress-wrapper {
    height: 4px;
    background: #ececf4;
}

.progress-bar {
    width: 0;
    height: 100%;
    background: #5b4df8;
}

/* LAYOUT */
.blog-container {
    max-width: 1400px;
    margin: auto;
    display: flex;
    gap: 30px;
    padding: 0px 20px;
}

/* LEFT */

aside.left-sidebar {
    width: 50px;
    padding: 13px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
}

.social-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 5px 0;
    border-radius: 14px;
    text-align: center;
    font-size: 10px;
}

.social-box span {
    color: var(--primary-color);
    background: #bfabf645;
    padding: 5px 9px;
    border-radius: 50%;
    font-size: 14px;
}

.social-box img {
    border-radius: 50%;
    width: 30px;
    height: 30px;
}

.social-box i {
    display: flex;
    align-items: center;

    font-size: 14px;
    color: var(--primary-color);
    padding: 10px 17px;
    border-radius: 50%;
    justify-content: center;
}

/* CONTENT */
.flex-content {
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.content {
    background: #fff;
    border-radius: 24px;
    width: 68%;
    padding: 40px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .04);
}

.content .badge {
    display: inline-block;
    background: var(--secondary-color);
    color: var(--primary-color);
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 14px;
    margin-bottom: 15px;
    font-weight: bold;
}

.content h1 {
    font-size: 42px;
    line-height: 1.08;
    margin-bottom: 25px;
    font-weight: 800;
}

.content .subtitle {
    color: #6b7280;
    line-height: 1.3;
    font-size: 16px;
    margin-bottom: 15px;
}

.content .author {
    display: flex;
    align-items: center;
    gap: 15px;
}

.content .author img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
}

.featured-img {
    width: 100%;
    border-radius: 20px;
    margin: 25px 0;
}

.article-images {
    width: 100%;
    height: 150px;
    object-fit: cover;
    margin: 15px 0;
    border-radius: 20px;
}

.content h2 {
    font-size: 26px;
    margin: 15px 0;
}

.content h3 {
    margin: 10px 0;
}

main.content h4 {
    margin-bottom: 10px;
}

.content p {
    font-size: 15px;
    line-height: 25px;
    color: #6b7280;
    margin-bottom: 10px;
}

.content ul {
    list-style: none;
    padding: 0;
}

.content ol li {
    position: relative;
    padding-left: 10px;
    margin-bottom: 10px;
    font-size: 14px;
    color: #4b5563;
}

.content ul li {
    position: relative;
    padding-left: 25px;
    margin-bottom: 10px;
    font-size: 14px;
    line-height: 25px;
    color: #4b5563;
}

.ai-benefits-lists li:before {
    content: "✓";
    position: absolute;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 3px;
    width: 17px;
    height: 17px;
    font-size: 10px;
    border-radius: 50%;
    background: var(--primary-color);
    color: white;
}

.content ul li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 6px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #6d5dfc;
    box-shadow: 0 0 0 4px rgba(109, 93, 252, .15);
}

/* Quote box */
.article-quote-box {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    padding: 25px;
    margin: 20px 0;
    background: linear-gradient(90deg,
            #f6f1ff 0%,
            #f8f5ff 50%,
            #faf8ff 100%);
    border-radius: 16px;
    border: 1px solid #f0eaff;
}

.quote-icon {
    font-size: 42px;
    line-height: 1;
    color: #6d5dfc;
    font-weight: 700;
    flex-shrink: 0;
    margin-top: -4px;
}

.quote-content {
    flex: 1;
}

.quote-text {
    margin: 0 0 8px;
    font-size: 20px;
    font-weight: 600;
    color: #1f2937;
    line-height: 1.6;
}

.quote-author {
    display: block;
    font-size: 16px;
    color: #5b6475;
    font-weight: 500;
}

/* AUTHOR CARD - STYLES MOVED TO ROOT STYLE.CSS */

/* ARTICLE NAVIGATION */

.article-navigation {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 20px;
}

.article-nav-card.left {
    text-align: left;
}

.article-nav-card.right {
    text-align: right;
}

.article-nav-card {
    border: 1px solid #ececf5;
    border-radius: 18px;
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 15px;
    background: #fff;
}

.article-nav-card img {
    width: 80px;
    height: 80px;
    border-radius: 12px;
    object-fit: cover;
}

.article-nav-card span {
    color: #6c4cff;
    font-size: 14px;
}

.article-nav-card h4 {
    margin-top: 8px;
    font-size: 16px;
    line-height: 1.5;
}

.arrow {
    font-size: 26px;
    color: #6c4cff;
}

/* COMMENTS */

.comments-section {
    margin-top: 20px;
    border-top: 1px solid #eef0f8;
    padding-top: 16px;
}
.comment-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

.comment-heading h2 {
    font-size: 24px;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
}

.sort-by {
    font-size: 14px;
    color: #64748b;
}

.sort-by strong {
    color: #6c4cff;
    font-weight: 600;
}

/* RESPOND / COMMENT FORM */
.comment-respond {
    background: #f8fafc;
    border-radius: 20px;
    padding: 30px;
    margin-bottom: 40px;
    border: 1px solid #f1f5f9;
}

.comment-reply-title {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 20px;
    color: #0f172a;
}

.comment-reply-title a {
    font-size: 14px;
    color: #ef4444;
    margin-left: 10px;
    text-decoration: none;
}

.comment-form {
    display: grid;
    grid-template-columns: 50px 1fr 1fr;
    column-gap: 20px;
    row-gap: 20px;
    align-items: start;
}

/* Avatar wrap */
.comment-form-avatar-wrap {
    grid-column: 1;
    grid-row: 1 / span 5;
}

.comment-form-avatar-wrap img.comment-avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #fff;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
}

/* Note fields */
.comment-notes,
.logged-in-as {
    grid-column: 2 / span 2;
    font-size: 14px;
    color: #64748b;
    margin: 0;
    line-height: 1.5;
}

.logged-in-as a {
    color: #6c4cff;
    text-decoration: none;
    font-weight: 500;
}

.logged-in-as a:hover {
    text-decoration: underline;
}

/* Textarea / Comment Field */
.comment-form-comment {
    grid-column: 2 / span 2;
    width: 100%;
}

.comment-form-comment textarea {
    width: 100%;
    min-height: 120px;
    max-height: 250px;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    padding: 15px 20px;
    font-size: 15px;
    font-family: inherit;
    color: #334155;
    background-color: #fff;
    resize: vertical;
    transition: border-color 0.2s, box-shadow 0.2s;
    box-sizing: border-box;
}

.comment-form-comment textarea:focus {
    outline: none;
    border-color: #6c4cff;
    box-shadow: 0 0 0 3px rgba(108, 76, 255, 0.1);
}

/* Author & Email inputs (Guest) */
.comment-form-author {
    grid-column: 2;
}

.comment-form-email {
    grid-column: 3;
}

.comment-form-author input,
.comment-form-email input {
    width: 100%;
    height: 52px;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    padding: 0 20px;
    font-size: 15px;
    color: #334155;
    background-color: #fff;
    transition: border-color 0.2s, box-shadow 0.2s;
    box-sizing: border-box;
}

.comment-form-author input:focus,
.comment-form-email input:focus {
    outline: none;
    border-color: #6c4cff;
    box-shadow: 0 0 0 3px rgba(108, 76, 255, 0.1);
}

/* Cookies consent checkbox */
.comment-form-cookies-consent {
    grid-column: 2 / span 2;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #64748b;
    margin: 0;
}

.comment-form-cookies-consent input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: #6c4cff;
    cursor: pointer;
}

.comment-form-cookies-consent label {
    cursor: pointer;
    user-select: none;
    line-height: 1.4;
}

/* Submit Button wrapper */
.form-submit {
    grid-column: 2 / span 2;
    margin: 0;
    text-align: right;
}

.form-submit button.primary_btn {
    height: 50px;
    padding: 0 30px;
    border: none;
    background: #6c4cff;
    color: #fff;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(108, 76, 255, 0.2);
    transition: background-color 0.2s, transform 0.1s, box-shadow 0.2s;
}

.form-submit button.primary_btn:hover {
    background: #5b3edd;
    box-shadow: 0 6px 16px rgba(108, 76, 255, 0.3);
}

.form-submit button.primary_btn:active {
    transform: translateY(1px);
}

/* COMMENTS LIST */
.comments-list {
    display: flex;
    flex-direction: column;
    gap: 30px;
    margin-bottom: 40px;
}

/* Root depth wrapper generated by WordPress list callback */
.comments-list>div.comment {
    border-bottom: 1px solid #f1f5f9;
    padding-bottom: 25px;
}

.comments-list>div.comment:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.comment-item {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: start;
}

.comment-item img.avatar {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    object-fit: cover;
    background: #f1f5f9;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    flex-shrink: 0;
}

.comment-content {
    flex: 1;
    min-width: 0;
}

.comment-content h4 {
    font-size: 18px;
    font-weight: 600;
    color: #0f172a;
    margin: 0 0 8px 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.comment-content h4 span {
    font-size: 13px;
    font-weight: 400;
    color: #94a3b8;
    margin-left: 0;
}

.comment-content p {
    font-size: 15px;
    color: #475569;
    line-height: 1.6;
    margin: 0 0 12px 0;
}

.comment-actions {
    display: flex;
    align-items: center;
    gap: 20px;
    font-size: 14px;
    margin-top: 12px;
}

.comment-actions a {
    text-decoration: none;
    color: #6c4cff;
    font-weight: 600;
    transition: color 0.2s;
}

.comment-actions a:hover {
    color: #5b3edd;
}

.comment-actions span {
    color: #64748b;
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    user-select: none;
    transition: color 0.2s;
}

.comment-actions span:hover {
    color: #6c4cff;
}

/* Styling nested replies to match mockup .comment-reply */
.comment-item .comment-item {
    flex-basis: 100%;
    background: #faf8ff;
    border-radius: 14px;
    padding: 20px;
    margin-top: 20px;
    border: 1px solid #f1edff;
}

/* Ensure nested elements inside reply look good */
.comment-item .comment-item img.avatar {
    width: 40px;
    height: 40px;
}

.comment-item .comment-item h4 {
    font-size: 16px;
}

.author-badge {
    background: #efe9ff;
    color: #6c4cff !important;
    padding: 3px 10px;
    border-radius: 6px;
    margin-left: 10px;
}

.view-comments {
    text-align: center;
    margin-top: 35px;
}

.view-comments a {
    text-decoration: none;
    color: #6c4cff;
    font-weight: 600;
    font-size: 18px;
}

/* RIGHT SIDEBAR */

.right-sidebar {
    display: flex;
    width: 30%;
    flex-direction: column;
    gap: 25px;
}

.blog-sidebar {
    width: 100%;
}

.sidebar-card {
    background: #fff;
    border: 1px solid #eef0f8;
    border-radius: 24px;
    padding: 28px;
    margin-bottom: 0px;
    box-shadow: 0 8px 40px rgba(111, 87, 255, .06), 0 1px 2px rgba(0, 0, 0, .02);
}
/* Titles */

.sidebar-title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 20px;
    font-weight: 700;
    color: #111827;
    margin-bottom: 28px;
}

/* On This Page */

.toc-list {
    list-style: none;
    padding-left: 18px;
    position: relative;
}

/* .toc-list:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 1px;
    background: #5e40e873;
} */

.toc-list li {
    position: relative;
    font-size: 18px;
    font-weight: 500;
    color: #1f2937;
    line-height: 1.5;
}

.toc-list li:last-child {
    margin-bottom: 0;
}

.toc-list li:before {
    content: "•";
    position: absolute;
    left: 0;
    top: 0;
    color: var(--primary-color) ;
    font-size: 16px;
    margin-right: 5px;
}

aside.left {
    justify-content: space-between;
    display: block;
}

.sidebar-res {
    display: flex;
    justify-content: space-between;
}

a.social-link {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

/* WIDGET GENERAL RESET */
.widget_content {
    list-style: none;
    margin-bottom: 22px;
}

/* Sidebar Widgets Margin Gap */
.sidebar .widget_content,
.right-sidebar .widget_content {
    margin-bottom: 30px;
}
.sidebar .widget_content:last-child,
.right-sidebar .widget_content:last-child {
    margin-bottom: 0;
}

/* MEGAMENU STYLES */
.mega-menu-parent {
    position: relative;
}

.mega-submenu {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: 100%;
    background: #fff;
    border-radius: 20px;
    padding: 30px;
    box-shadow: 0 15px 50px rgba(0, 0, 0, .12);
    opacity: 0;
    visibility: hidden;
    transition: .3s;
    z-index: 999;
    display: flex !important;
    gap: 30px;
}

.mega-submenu.active {
    opacity: 1;
    visibility: visible;
}

.mega-submenu-left {
    flex: 1.8;
}

.mega-submenu-right {
    flex: 1;
    border-left: 1px solid #f1f1f1;
    padding-left: 30px;
}

.submenu-title {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 25px;
}

.submenu-title i {
    color: #6c4cff;
    font-size: 20px;
}

.submenu-title h3 {
    margin: 0;
    font-size: 24px;
    color: #111;
}

.category-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
}

.category-box {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 10px !important;
    border: 1px solid #ececec !important;
    border-radius: 16px;
    text-decoration: none;
    transition: .3s;
}

.category-box:hover {
    border-color: #6c4cff;
    transform: translateY(-3px);
}

.cat-icon {
    width: 40px;
    height: 40px;
    background: #f4efff;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6c4cff;
    font-size: 16px;
}

.cat-icon i {
    font-size: 20px !important;
}

.cat-content {
    flex: 1;
}

.cat-content h4 {
    margin: 0 0 6px;
    font-size: 14px;
    color: #111;
    text-align: left;
}

.cat-content span {
    color: #777;
    font-size: 14px;
    display: block;
    text-align: left;
    background-color: transparent !important;
    position: relative !important;
    left: 0px;
    top: 100%;
    width: auto !important;
    height: auto !important;
    border-radius: 0 !important;
}

.cat-arrow {
    color: #6c4cff;
}

.view-all-categories {
    margin-top: 20px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: #f7f3ff;
    border-radius: 16px;
    color: #6c4cff;
    text-decoration: none;
    font-weight: 600;
}

/* Mega menu featured post card styling */
.mega-menu-featured-post .featured-post-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
}

.featured-card a:hover {
    border: none;
}

.mega-menu-featured-post .featured-post-title h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    color: #111;
}

.mega-menu-featured-post .featured-card {
    text-align: left;
}

.mega-menu-featured-post .featured-card img {
    /* width: 100%;
    height: 160px; */
    object-fit: cover;
    border-radius: 12px;
    margin-bottom: 12px;
}

.mega-menu-featured-post .featured-card h4 {
    margin: 0 0 8px;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.4;
}

.mega-menu-featured-post .featured-card h4 a {
    color: #111;
    text-decoration: none;
}

.mega-menu-featured-post .featured-card h4 a:hover {
    color: #6c4cff;
}

.mega-menu-featured-post .featured-card p {
    font-size: 14px;
    color: #555;
    line-height: 1.5;
    margin: 0;
}

/* 404 PAGE CSS */
/*=========================
    HERO SECTION
=========================*/



.hero-wrapper-error {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 80px;
}

/* LEFT */

.hero-content-error {
    width: 45%;
}

.hero-content-error .badge {
    display: inline-block;
    padding: 8px 18px;
    background: #f2ecff;
    color: #6C4EFF;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 30px;
}

.hero-content-error h1 {
    font-size: 42px;
    line-height: 1.1;
    color: #12143A;
    font-weight: 800;
}

.hero-content-error h1 span {
    display: block;
    color: #6C4EFF;
}

.hero-content-error p {
    margin: 30px 0;
    color: #73758b;
    font-size: 22px;
    line-height: 1.7;
}

/* BUTTONS */

.hero-buttons-error {
    display: flex;
    gap: 20px;
}

.hero-buttons-error .btn-purple {
    background: #6C4EFF;
    color: #fff;
    padding: 12px 16px;
    border-radius: 6px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: .3s;
}

.hero-buttons-error .btn-purple:hover {
    background: #5538f5;
    transform: translateY(-3px);
}

.hero-buttons-error .btn-white {
    padding: 12px 34px;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
    background: #fff;
    color: #222;
    font-weight: 600;
    transition: .3s;
}

.hero-buttons-error .btn-white:hover {
    border-color: #6C4EFF;
    color: #6C4EFF;
}

/* RIGHT */

.hero-image-error {
    width: 50%;
    text-align: right;
}

.hero-image-error img {
    width: 100%;
    max-width: 650px;
}

/*=========================
    SEARCH
=========================*/

.search-box-error {
    margin-top: 60px;
    background: #fff;
    border-radius: 24px;
    padding: 25px 35px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 10px 35px rgba(0, 0, 0, .08);
    border: 1px solid #efefef;
}

.search-left {
    display: flex;
    align-items: center;
    gap: 25px;
}

.search-icon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #F4EEFF;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #6C4EFF;
    font-size: 20px;
}

.search-left h3 {
    font-size: 22px;
    color: #17193c;
}

.search-left p {
    color: #7b7d90;
    font-size: 16px;
}

/* FORM */

.search-box-error form {
    width: 520px;
    display: flex;
}

.search-box-error input {
    flex: 1;
    height: 50px;
    border: 1px solid #ececec;
    border-radius: 12px 0 0 12px;
    padding: 0 25px;
    font-size: 16px;
    outline: none;
}

.search-box-error input:focus {
    border-color: #6C4EFF;
}

.search-box-error button {
    width: 150px;
    background: #6C4EFF;
    color: #fff;
    border: none;
    border-radius: 0 12px 12px 0;
    font-size: 17px;
    font-weight: 600;
    cursor: pointer;
    transition: .3s;
}

.search-box-error button:hover {
    background: #5538f5;
}




.wp-block-table td,
.wp-block-table th {
    border: 1px solid #bfabf645 !important;
    padding: .5em;
}

.wp-block-table thead {
    border-bottom: 3px solid var(--primary-color) !important;
}

.wp-block-embed iframe {
    max-width: 100%;
    border-radius: 15px;
    margin-bottom: 15px;
}

.content .wp-block-image img {
    border-radius: 10px;
    margin-bottom: 15px;
}

.content .wp-block-tag-cloud a {
    color: #334155;
}

.content .wp-block-tag-cloud a:hover {
    text-decoration: underline;
    color: var(--primary-color);
}

/* TRENDING PAGE CSS */
.hero-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.hero-content h1 {
    font-size: 40px;
    margin-bottom: 20px;
}

.hero-content p {
    font-size: 15px;
    color: #666;
    line-height: 25px;
}

.hero-image img {
    width: 400px;
    border-radius: 20px;
}

section.trending-page {
    margin: 30px 0;
}

.trending-content {
    position: relative;
    background: #fff;
    border-radius: 30px;
    overflow: hidden;
    padding: 30px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .05);
}

.trending-content .tabs {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.trending-content .tabs a {
    text-decoration: none;
    background: #fff;
    border: 1px solid #eee;
    padding: 8px 20px;
    border-radius: 20px;
    color: #333;
}

.trending-content .tabs .active {
    background: #6d4cff;
    color: #fff;
}

.trending-content .main-layout {
    display: flex;
    gap: 30px;
    align-items: flex-start;
}

.trending .content-area {
    flex: 1;
}

.top-head {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.top-head .view-all {
    margin: 0;
}

.content-area .top-head .section-title {
    font-size: 24px;
    font-weight: 700;
    /* margin-bottom: 25px; */
    text-align: left;
    margin-bottom: 0px;
}

.featured-post.trending {
    position: relative;
    background: #fff;
    border-radius: 20px;
    padding: 15px;
    display: flex;
    gap: 25px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .05);
    margin-bottom: 10px;
}

.featured-post.trending img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 15px;
}

.post-content .category {
    color: var(--primary-color);
    font-weight: bold;
}

.post-content h2 {
    margin: 10px 0;
    font-size: 24px;
}
.post-content h2 a{
    color: #000;
}
.post-content .number {
    position: absolute;
    top: 10%;
    left: 3%;
    width: 35px;
    height: 35px;
    background: var(--primary-color);
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white !important;
    font-weight: 700;
}

.right-sidetrends .trending-topics {
    background: #fff;
    border: 1px solid #ececf5;
    border-radius: 20px;
    padding: 28px;
    box-shadow: 0 10px 35px rgba(0, 0, 0, 0.04);
}

.articles-grid.trending {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}
.trending-topics .widget-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 30px;
}

.trending-topics .widget-title h3 {
    font-size: 24px;
    font-weight: 700;
    color: #1f2235;
    margin: 0;
}

.widget-title .title-icon {
    font-size: 18px;
}

.trending-topics .topic-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.trending-topics .topic-list li {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 15px;
}

.topic-list .topic-icon {
    width: 34px;
    height: 34px;
    min-width: 34px;
    border-radius: 50%;
    background: #f5f2ff;
    color: #6c4eff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 700;
}

.topic-list .topic-info h4 {
    margin: 0 0 4px;
    font-size: 16px;
    font-weight: 500;
    color: #333851;
}

.topic-list .topic-info span {
    font-size: 14px;
    color: #9aa0b4;
}

.trending-topics .view-all {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 15px;
    text-decoration: none;
    color: #6c4eff;
    font-weight: 600;
    font-size: 15px;
    transition: .3s;
}

.trending-topics .view-all:hover {
    gap: 12px;
}

/* ==========================
   TOP WRITERS
========================== */
.writers-widget {
    background: #fff;
    border: 1px solid #ececf5;
    border-radius: 18px;
    padding: 25px;
    margin: 15px 0;
    box-shadow: 0 10px 35px rgba(0, 0, 0, .04);
}

.widget-heading {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 25px;
}

.writer-item {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    gap: 5px;
}

.writer-item:last-of-type {
    margin-bottom: 25px;
}

.writer-item img {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    object-fit: cover;
}

.writer-info {
    flex: 1;
    flex-direction: column;
    gap: 0;
    align-items: flex-start;
}

.writer-info h4 {
    margin: 0 0 4px;
    font-size: 12px;
    font-weight: 600;
    color: #2b2e42;
}

.writer-info span {
    font-size: 14px;
    color: #9aa0b4;
}

.writer-item a {
    min-width: 80px;
    text-align: center;
    text-decoration: none;
    background: #f5f0ff;
    color: #6d4cff;
    font-size: 14px;
    font-weight: 600;
    padding: 10px 0;
    border-radius: 10px;
    transition: .3s;
}

.writer-item a:hover {
    background: #6d4cff;
    color: #fff;
}

.view-link {
    text-align: center;
}

.view-link a {
    text-decoration: none;
    color: #6d4cff;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* ==========================
   WRITE CTA
========================== */
.write-widget {
    margin-top: 25px;
    background: linear-gradient(135deg,
            #f7f4ff,
            #f1edff);
    border-radius: 18px;
    padding: 25px;
}

.cta-icon {
    width: 42px;
    height: 42px;
    margin-bottom: 18px;
    background: #d5cdf9;
    padding: 18px 17px;
    width: 58px;
    height: 58px;
    /* padding: 12px 0; */
    border-radius: 50%;
}

.cta-icon i {
    color: var(--primary-color);
    font-size: 20px;
}

.write-widget h3 {
    margin: 0 0 15px;
    font-size: 24px;
    font-weight: 700;
    color: #252840;
    line-height: 1.3;
}

.write-widget p {
    color: #6d7387;
    margin-bottom: 20px;
}

.writer-btn {
    display: inline-block;
    background: #6d4cff;
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    padding: 14px 28px;
    border-radius: 12px;
    transition: .3s;
}

.writer-btn:hover {
    transform: translateY(-2px);
}

aside.right-sidetrends {
    width: 30%;
}

.right-sidetrends h3 {
    font-size: 20px;
}

.section.articles {
    margin-top: 20px;
    padding: 20px 10px;
}

/* ==========================================================================
   Footer Widget Areas & Blocks Styling
   ========================================================================== */
/* Short Description & About Logo Widget in Footer Column */
.footer-section .footer-col.short_desc_widget,
.footer-section .footer-col.about_logo_widget {
    min-width: 30%;
}

/* Nav Menu widget styling in footer columns */
.footer-col.widget_nav_menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-col.widget_nav_menu ul li {
    list-style: none;
    margin: 0;
}

/* Tag Cloud widget styling in footer */
.footer-col.widget_tag_cloud .tagcloud,
.footer-col .tagcloud,
.footer-col .wp-block-tag-cloud,
.wp-block-tag-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
}

.footer-col.widget_tag_cloud .tagcloud a,
.footer-col .tagcloud a,
.footer-col .wp-block-tag-cloud a,
.wp-block-tag-cloud a {
    display: inline-block !important;
    text-decoration: none !important;
    padding: 5px 10px !important;
    background: #f2eeff !important;
    border: 1px solid #ececec !important;
    border-radius: 12px !important;
    color: #6b7280 !important;
    font-size: 14px !important;
    transition: .3s !important;
    float: left;
    margin: 0 !important;
    line-height: 1.2 !important;
}

.footer-col.widget_tag_cloud .tagcloud a:hover,
.footer-col .tagcloud a:hover,
.footer-col .wp-block-tag-cloud a:hover,
.wp-block-tag-cloud a:hover {
    background: #8B5CF6 !important;
    color: white !important;
}

/* Social links widget/block styling in footer */
.footer-col .wp-block-social-links, .footer-col .social-icons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
    padding: 0;
    list-style: none;
}

.footer-col .wp-block-social-links li,
.footer-col .social-icons li {
    margin: 0;
    list-style: none;
}

.footer-col .wp-block-social-links a,
.footer-col .social-icons a {
    color: #222 !important;
    margin-right: 0 !important;
    font-size: 16px;
    transition: color 0.3s ease;
}

.footer-col .wp-block-social-links a:hover,
.footer-col .social-icons a:hover {
    color: var(--primary-color) !important;
}

.footer-col .wp-block-social-links .wp-social-link {
    background: transparent !important;
}

/* About Page */

/* HERO */

/* .hero {

    padding: 80px 0;

} */

.hero-about .hero-grid {

    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 80px;

}

.hero-about .tag {

    display: inline-block;
    padding: 10px 18px;
    background: #F4F0FF;
    color: #6B45FF;
    border-radius: 50px;
    font-weight: 700;
    font-size: 13px;
    margin-bottom: 30px;

}

.hero-about .hero-left h1 {
    font-size: 42px;
    line-height: 1.1;
    font-weight: 800;
    margin-bottom: 20px;
}

.hero-about .hero-left p {

    font-size: 19px;
    line-height: 1.9;
    color: #676B82;
    max-width: 560px;

}

.hero-about .stats {

    display: flex;
    gap: 70px;
    margin-top: 55px;

}

.hero-about .stat-card {

    display: flex;
    align-items: center;
    gap: 18px;

}

.hero-about .stat-card h4 {
    color: #000;
    font-size: 20px;
}

.hero-about .circle {
    width: 50px;
    height: 50px;
    background: #F4F0FF;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    color: #6B45FF;
}

.hero-about .stat h2 {

    font-size: 34px;
    font-weight: 800;

}

.hero-about .stat span {

    color: #777;
    font-size: 15px;

}

/* RIGHT */

.hero-about .hero-image {
    position: relative;
    background: linear-gradient(135deg, #EFE9FF, #F9F7FF);
    border-radius: 35px;
    padding: 60px;
    text-align: center;

}

.hero-about .hero-image img {
    width: 100%;
    max-width: 520px;

}

.hero-about .floating {
    position: absolute;
    width: 65px;
    height: 65px;
    border-radius: 20px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #6B45FF;
    font-size: 24px;
    box-shadow: 0 18px 45px rgba(108, 74, 255, .15);

}

.hero-about .heart {
    top: 35px;
    left: 30px;

}

.hero-about .chat {
    top: 60px;
    right: 35px;

}

.hero-about .bubble {
    bottom: 100px;
    left: 15px;

}

/*==============================
MISSION SECTION
==============================*/

.mission-section {
    padding: 70px 0;
}

.mission-wrapper {
    display: grid;
    grid-template-columns: 46% 48%;
    justify-content: space-between;
    align-items: center;
    gap: 60px;
}

/* Left Image */

.mission-image {
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .08);
}

.mission-image img {
    width: 100%;
    display: block;
}

/* Right Content */

.section-tag {
    display: inline-block;
    color: #6C4AFF;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.mission-content h2,
.community-content h2 {
    font-size: 38px;
    line-height: 1.12;
    font-weight: 800;
    color: #16172B;
    margin-bottom: 15px;
}

.mission-desc {
    font-size: 16px;
    color: #6B7280;
    line-height: 24px;
    margin-bottom: 25px;
    max-width: 550px;
}

/* Feature */

.mission-item {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 30px;
}

.mission-icon {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: #F4F0FF;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    color: #6C4AFF;
    font-size: 16px;
    transition: .3s;
}

.mission-item:hover .mission-icon {
    background: #6C4AFF;
    color: #fff;
}

.mission-text h4 {
    font-size: 22px;
    font-weight: 700;
    /* margin-bottom: 10px; */
    color: #1A1B2D;
}

.mission-text p {
    color: #6B7280;
    line-height: 1.8;
    font-size: 16px;
}

/*======================================
        OUR VALUES
=======================================*/

.section-subtitle {
    display: block;
    text-align: center;
    color: #6C4EFF;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .8px;
    margin-bottom: 12px;
}

.section-title {
    text-align: center;
    font-size: 38px;
    font-weight: 800;
    color: #171827;
    margin-bottom: 30px;
}

/* Cards */

.values-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;

}

.value-card {
    background: #fff;
    border-radius: 22px;
    padding: 20px;
    text-align: center;
    border: 1px solid #efefef;
    transition: .35s;
    box-shadow: 0 12px 40px rgba(40, 40, 40, .05);

}

.value-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 25px 60px rgba(108, 78, 255, .18);

}

.value-icon {
    width: 70px;
    height: 70px;
    margin: auto;
    border-radius: 50%;
    background: #F3EEFF;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6C4EFF;
    font-size: 26px;
    margin-bottom: 20px;
    transition: .35s;
}


.value-card:hover .value-icon {
    background: #6C4EFF;
    color: #fff;
}

.value-card h3 {
    font-size: 20px;
    margin-bottom: 10px;
    font-weight: 700;
    color: #1d2032;
}

.value-card p {
    font-size: 16px;
    line-height: 24px;
    color: #707585;
}

/*=================================
      COMMUNITY SECTION
==================================*/

.community-section {

    padding: 100px 0;

}

.community-wrapper {

    display: grid;
    grid-template-columns: 45% 50%;
    justify-content: space-between;
    align-items: center;
    gap: 70px;

}

/* Left */



.community-content p {
    color: #707585;
    line-height: 24px;
    font-size: 16px;
    margin-bottom: 15px;
}

.community-stats {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;

}

.community-stat {

    display: flex;
    align-items: center;
    gap: 15px;

}

.stat-icon {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: #F4EEFF;
    color: #6C4EFF;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
}
.stat-icon.likes {
    background: #e300ff14;
    color: red;
}
.community-stat h3 {
    font-size: 24px;
    font-weight: 800;
    color: #1B1B2F;

}

/* .community-stat span {
    font-size: 12px;
    color: #777;

} */

/* Right */

.community-gallery {

    position: relative;

}

.image-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;

}

.image-grid img {
    width: 100%;
    height: 130px;
    object-fit: cover;
    border-radius: 18px;
    transition: .35s;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .08);

}

.image-grid img:hover {
    transform: scale(1.05);

}

/* Floating Card */

.join-card {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 350px;
    background: #fff;
    border-radius: 22px;
    padding: 15px;
    text-align: center;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .15);
}

.join-card h4 {
    font-size: 18px;
    line-height: 24px;
    color: #1C1D31;
    margin-bottom: 15px;
}

.join-card a {
    display: inline-block;
    padding: 15px 35px;
    background: #6C4EFF;
    color: #fff;
    border-radius: 12px;
    font-weight: 700;
    transition: .3s;

}

.join-card a:hover {
    background: #4f2fff;
}
section.trending-hero .hero-wrap {
    background: linear-gradient(3deg, transparent, #eae1ff);
    padding: 20px 30px;
    border-radius: 28px;
    box-shadow: 0 10px 40px rgb(0 0 0 / 5%);
}
body.author,.page-template-template-contact {
    padding-top: 76px;
}
/*writer-dashboard*/

.writer_container {
    display: flex;
    gap: 30px;
    justify-content: space-between;
    padding:0 12px;
}
.writer_left_side_bar {
    width: 33%;
}
.writer_left_side_bar .card{
    background:#fff;
    border-radius:14px;
    padding:25px;
    margin-bottom:28px;
    box-shadow:0 10px 35px rgba(70,50,180,.12);
}
.card .title{
    text-align:center;
    font-size:18px;
    font-weight:800;
    color:#11143d;
    margin-bottom:25px;
}
.card .progress-box{
    width:170px;
    height:170px;
    border-radius:50%;
    margin:0 auto;
    background:
    conic-gradient(#4734e8 82%,#ebe8ff 0);
    display:flex;
    align-items:center;
    justify-content:center;
}
.card .progress-inner{
    width:120px;
    height:120px;
    background:white;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
}
.card .percent{
    font-size:38px;
    color:#4734e8;
    font-weight:900;
}
.card .status{
    text-align:center;
    color:#4934e8;
    font-size:18px;
    font-weight:bold;
    margin-top:25px;
}
.card .desc{
    text-align:center;
    color:#6d7190;
    line-height:1.6;
    font-size:14px;
    margin-top:15px;
}
.card .timeline{
    position:relative;
}
.card .timeline:before{
    content:"";
    position:absolute;
    left:24px;
    top:20px;
    width:2px;
    height:85%;
    background:#dedcf5;
}
.card .step{
    display:flex;
    gap:18px;
    margin-bottom:35px;
    position:relative;
}
.card .num{
    width:45px;
    height:45px;
    background:#eef0fa;
    border-radius:50%;
    text-align:center;
    line-height:45px;
    font-weight:bold;
    color:#555;
    z-index:2;
}
.card .step.active .num{
    background:#4833e8;
    color:white;
}
.card .step h4{
    color:#151842;
    font-size:15px;
    margin-bottom:7px;
}
.card .step p{
    color:#737897;
    font-size:13px;
}
.card.benefit{
    background:linear-gradient(135deg,#4b35ee,#4b2fd2);
    color:white;
}
.benefit.icon{
    font-size:35px;
}
.benefit h3{
    margin:20px 0;
    font-size:19px;
}
.benefit ul{
    list-style:none;
}
.benefit li{
    font-size:14px;
    margin:15px 0;
}
.benefit li:before{
    content:"✓";
    margin-right:10px;
    color:#4cff99;
}
.card .help{
    display:flex;
    align-items:center;
    gap:18px;
}
.help-icon{
    width:60px;
    height:60px;
    border-radius:12px;
    background:#eeeaff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
}
.help h3{
    color:#12163e;
    font-size:17px;
}
.help p{
    color:#777;
    font-size:13px;
}
.card .btn{
    margin-top:20px;
    display:block;
    background:#eeeaff;
    padding:15px;
    border-radius:8px;
    text-align:center;
    color:#4a33e8;
    font-weight:bold;
    text-decoration:none;
}
.form-group.profile-pic-group {
    width: 27%;
}
.form-group.profile-pic-group img {
    border-radius: 50%;
    background: var(--primary-color);
    border: 3px solid #fff;
}
.profile-row {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 40px;
    margin-top: 35px;
}
.profile-row .upload-box {
    height: 200px;
    border: 2px dashed #8d80ff;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #fcfbff;
}
.profile-row .avatar{
    width:110px;
    height:110px;
    border-radius:50%;
    background:#ddd;
    margin-bottom:20px;
    position:relative;
    overflow:hidden;
}
.profile-row .avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
}
.profile-row .edit{
    position:absolute;
    right:0;
    bottom:5px;
    width:35px;
    height:35px;
    background:#fff;
    border:2px solid #4938e8;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
}
.profile-row .upload-title{
    color:#4938e8;
    font-weight:700;
}
.profile-row .upload-text{
    font-size:13px;
    color:#777;
    margin-top:8px;
}
.profile-row textarea{
    height:200px;
    padding:20px;
    resize:none;
}
.profile-pic-upload-actions {
    display: flex;
    flex-direction: column;
}
label.btn.secondary_btn.btn-upload-pic {
    padding: 0;
    text-align: left;
    color: var(--primary-color);
    margin-bottom: 2px;
}
span.file-info-label {
    font-size: 12px;
}
/* Removed conflicting cropper modal overrides */
.form-step-title {
    font-size: 18px;
    font-weight: 700;
    color: #0f172a;
    margin: 30px 0 20px;
    padding-bottom: 10px;
}
.profile_num {
    background: var(--primary-color);
    color: #fff;
    font-size: 13px;
    padding: 8px 12px;
    border-radius: 50%;
    margin-right: 8px;
}
a.aud-like-btn {
    color: #000;
}
.author-left-profile .author-stats span {
    color: #cacaca;
}
/*pricing*/
.inner-hero {
    padding: 0;
}
.contact-hero-image, .inner-hero-image {
    height: 300px;
}
.pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.pricing-card{
    position:relative;
    background:#fff;
    border:1px solid #ECECF3;
    border-radius:24px;
    padding:40px;
    transition:.35s;
    box-shadow:0 12px 35px rgba(0,0,0,.05);
}
.pricing-card:hover{
    transform:translateY(-10px);
    box-shadow:0 30px 60px rgba(108,77,255,.12);
}
.featured{
    border:2px solid #6C4DFF;
    transform:scale(1.03);
}
.featured:hover{
    transform:scale(1.03) translateY(-10px);
}

.popular{
    position:absolute;
    top:-15px;
    left:50%;
    transform:translateX(-50%);
    background:#6C4DFF;
    color:#fff;
    padding:8px 18px;
    border-radius:30px;
    font-size:13px;
    font-weight:600;
}

.plan-name{
    font-size:34px;
    font-weight:700;
    margin-bottom:10px;
    color:#111827;
}
.plan-desc{
    color:#6B7280;
    line-height:1.7;
    margin-bottom:30px;
    min-height:60px;
}
.pricing-card .price {
    font-size: 33px;
    font-weight: 800;
    color: #111827;
    margin-bottom: 30px;
}
.pricing-card .currency{
    font-size:24px;
    vertical-align:top;
}
.pricing-card .price small{
    font-size:18px;
    color:#888;
    font-weight:500;
}
.pricing-card .btn-primary,
.pricing-card .btn-outline{
    display:block;
    width:100%;
    text-align:center;
    padding:16px;
    border-radius:14px;
    font-weight:700;
    text-decoration:none;
    transition:.3s;
    margin-bottom:35px;
}
.pricing-card .btn-primary{
    background:#6C4DFF;
    color:#fff;
}

.pricing-card .btn-primary:hover{
     background:#5636ff;
}
.pricing-card .btn-outline{
    border:2px solid #6C4DFF;
    color:#6C4DFF;
}
.pricing-card .btn-outline:hover{
    background:#6C4DFF;
    color:#fff;
}
.feature-list{
    list-style:none;
}

.feature-list li{
    display:flex;
    align-items:flex-start;
    gap:12px;
     margin-bottom:18px;
    color:#444;
    line-height:1.6;

}
.feature-list li i{
    color:#6C4DFF;
    margin-top:3px;
}
.feature-list .disabled{
    color:#B6B6B6;
}
.feature-list .disabled i{
    color:#D4D4D4;
}
section.inner-main-section {
    padding: 50px 0;
}
.inner-pricing-grid {
    padding: 0 0 40px;
}
.pricing-header-wrap {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-bottom: 35px;
    padding: 0 10px;
}
.pricing-toggle-container {
    display: inline-flex;
    background: #F3F4F6;
    padding: 6px;
    border-radius: 30px;
    border: 1px solid #E5E7EB;
    gap: 4px;
}
.pricing-toggle-btn {
    border: none;
    background: transparent;
    padding: 10px 24px;
    font-size: 14px;
    font-weight: 700;
    color: #4B5563;
    border-radius: 24px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    outline: none;
    display: flex;
    align-items: center;
    gap: 8px;
}
.pricing-toggle-btn.active {
    background: #fff;
    color: #6C4DFF;
    box-shadow: 0 4px 12px rgba(108, 77, 255, 0.15);
}
.pricing-toggle-btn:hover:not(.active) {
    color: #111827;
}
.discount-badge {
    background: #ECFDF5;
    color: #059669;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 12px;
}
.compare-section h2 {
    font-size: 24px;
    margin-bottom: 12px;
    color: #101828;
}
.compare-table{
    background:#fff;
    border-radius:20px;
    overflow:hidden;
    border:1px solid #ECECF3;
    box-shadow:
    0 20px 50px rgba(0,0,0,.05);
}
.compare-table table{
    width:100%;
    border-collapse:collapse;
}
.compare-table th{
    padding:22px;
    background:#fafaff;
    font-size:16px;
    color:#111827;
}
.compare-table td{
    padding:22px;
    text-align:center;
    border-top:1px solid #eee;
    color:#555;
}
.compare-table th:first-child,
.compare-table td:first-child{
    text-align:left;
    font-weight:600;
}
.compare-table .highlight{
    background:#F5F1FF;
}
.compare-table i{
    color:#6C4DFF;
    font-size:18px;
}
.compare-table .close{
    color:#B8B8C8;

}
.page-template-page-fullwidth-php .content {
    width: 100%;
}
/*privacy policy*/
.content_grid {
    display: flex;
    gap: 20px;
}
.content_grid .content {
    flex: 1;
}
.content_grid .right-sidebar {
    position: -webkit-sticky;
    position: sticky;
    top: 100px;
    align-self: flex-start;
}
@media screen and (max-width: 1100px) {
    .content_grid {
        flex-direction: column;
    }
    .content_grid .right-sidebar {
        position: static;
        width: 100%;
    }
}
.sidebar_section h2 {
    font-size: 24px;
    margin-bottom: 15px;
}
.sidebar_section .toc-list {
    padding-left: 00px;
}
.sidebar_section .toc-list li {
    font-size: 14px;
    margin-bottom: 12px;
    padding-left: 20px;
    color: var(--primary-color);
}
.sidebar_section {
    background: #fff;
    border: 1px solid #e7e1ff;
    border-radius: 24px;
    padding: 25px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .03);
}
.page_heading {
    width: 100%;
    padding: 17px 12px;
    font-size: 34px;
    background: #f3ecff;
    border-radius: 15px;
    margin-bottom: 16px;
    text-align: center;
}
.page-template-template-dashboard {
    padding: 90px 0;
}
.menu_sidebar{
    list-style:none;
}
.menu_sidebar li {
    height: 48px;
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 0 20px;
    border-radius: 6px;
    margin-bottom: 4px;
    font-size: 15px;
    color: #3d4664;
    cursor: pointer;
    transition: .3s;
}
.menu_sidebar li i{
    width:20px;
}
.menu_sidebar li:hover,
.menu_sidebar li.active{
    background:#f3efff;
    color:#6c4cff;
}
.dashboard-sidebar .feature-box {
    margin-top: 34px;
    background: linear-gradient(135deg, #fff, #f3edff);
    border: 1px solid #ded3ff;
    padding: 25px;
    border-radius: 20px;
    text-align: center;
    margin-bottom: 65px;
}
.dashboard-sidebar .feature-icon{
    font-size:35px;
    margin-bottom:15px;
}
.dashboard-sidebar .feature-box h4{
    margin-bottom:12px;
}
.dashboard-sidebar .feature-box p{
    font-size:13px;
    line-height:1.6;
    color:#555;
    margin-bottom:20px;
}

.feature-box .guidelines_btn {
    width: 100%;
    padding: 13px;
    background: #fff;
    border: 1px solid #6c4cff;
    color: #6c4cff;
    border-radius: 10px;
    display: block;
}

.dashboard-sidebar .logout{
    position:absolute;
    bottom:35px;
    display:flex;
    gap:15px;
    color:#3d4664;

}
.profile_grid {
    display: flex;
    gap: 6px;
    padding-bottom: 15px;
    margin-bottom: 20px;
    border-bottom: 1px solid #e5e3e3;
}
.profile-avatar-wrap {
    position: relative;
    width: 60px;
    height: 60px;
    /* margin: 0 auto 20px; */
}
.profile_info_grid {
    text-align: left;
}
.dashboard-sidebar .logout {
    position: absolute;
    bottom: 35px;
    display: flex;
    gap: 15px;
    color: #3d4664;
    background: var(--primary-color);
    width: 85%;
    padding: 13px;
    border-radius: 6px;
    color: #fff;
}
.twocard_row {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}
.earning-panel {
    background: white;
    border-radius: 22px;
    padding: 35px;
    height: max-content;
    box-shadow: 0 15px 40px rgba(0, 0, 0, .06);
    width: 48%;
}
.panel-head{
    display:flex;
    justify-content:space-between;
    margin-bottom:35px;
}
.panel-head a{
    color:#6c4cff;
    text-decoration:none;
}
.balance{
    position:relative;
}
.balance span,
.withdraw span{
   color:#667085;
    font-size:14px;
}
.balance h2{
    font-size:34px;
    margin:15px 0;
}
.growth{
    position:absolute;
    right:0;
    top:30px;
    background:#dcffe9;
    color:#00a85a;
    padding:8px 15px;
    border-radius:12px;
}
.earning-panel hr{
    border:0;
    border-top:1px solid #eee;
    margin:30px 0;
}
.withdraw{
    position:relative;
}
.withdraw h3{
    margin-top:15px;
    font-size:26px;
}
.withdraw button{
    position:absolute;
    right:0;
    bottom:0;
    background:#6246ff;
    color:white;
    border:0;
    padding:15px 25px;
    border-radius:12px;
    font-weight:600;

}
td.cell_image img {
    width: 90px;
    height: 100%;
    border-radius: 10px;
}
.dashboard-main .section.articles {
    margin-top: 0;
    padding: 20px 30px;
}
.views-info {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-top: 10px;
}
.views-info strong {
    font-size: 20px;
}
.views-info span,
.views-info small{
    color:#667085;

}
.views-info label {
    background: #d9ffe9;
    color: #00c86b;
    padding: 7px 18px;
    border-radius: 9px;
    font-weight: 700;
}
.month-btn {
    background: #f5f0ff;
    border: 1px solid #d9ccff;
    padding: 12px 12px;
    border-radius: 8px;
    color: #6246ff;
    font-size: 14px;
    /* font-weight: 700; */
}
.analytics-stats {
    margin-top: 30px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.small-stat {
    border: 1px solid #edf0fa;
    border-radius: 9px;
    padding: 9px;
    display: flex;
    gap: 17px;
    align-items: center;
}
.small-stat i {
    width: 55px;
    height: 55px;
    background: #eee9ff;
    color: #6246ff;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}
.small-stat span{
    color:#667085;
}
.small-stat h3{
    font-size:20px;
}
.small-stat b{
    color:#00c86b;
    font-size:16px;
    margin-left:20px;
}