/* payment-shared.css - Shared styles for purebrain.ai payment pages */
/* Extracted 2026-04-01 to reduce page size */

/* === PUREBRAIN.AI COMPLETE STYLING (wp-custom-css) === */
			/* ============================================
   PUREBRAIN.AI COMPLETE STYLING
   Add to: WordPress Admin > Appearance > Customize > Additional CSS

   UPDATED: 2026-02-17 - Blog loader color fix
   FIX 1: Video overlay COMPLETELY REMOVED (grainy issue)
   FIX 2: Social share bar above comments REMOVED
   FIX 3: Read more buttons ALWAYS visible
   FIX 4: Footer social icons properly styled
   FIX 5: Blog page loader - GREEN to ORANGE/BLUE
   ============================================ */

/* ========== FIX 1: COMPLETELY REMOVE VIDEO OVERLAY ========== */
/* Jared reported video looks too grainy/dark - REMOVE ALL overlays */

.video-overlay,
.elementor-background-overlay,
[class*="background-overlay"],
.elementor-section::before,
.elementor-section::after,
body .elementor-background-overlay,
body.page-id-95 .elementor-background-overlay,
body.page-id-95 [class*="overlay"]:not(.elementor-post):not(.blog-card),
.elementor-background-video-fallback::after,
.elementor-section .elementor-background-overlay,
.elementor-section > .elementor-background-overlay {
    background: none !important;
    background-color: transparent !important;
    opacity: 0 !important;
    display: none !important;
    visibility: hidden !important;
}

/* For single posts, keep VERY minimal overlay for text readability only */
body.single-post::after {
    background: rgba(0,0,0,0.25) !important;
}

/* ========== FIX 2: REMOVE SOCIAL SHARE BAR ABOVE COMMENTS (AGGRESSIVE) ========== */
/* Hide social share bar that appears above comments section - NOT in footer */

/* Target the specific post-social-sharing class with high specificity */
body .post-social-sharing,
body.single-post .post-social-sharing,
article .post-social-sharing,
.entry-content .post-social-sharing,
.site-content .post-social-sharing,
div.post-social-sharing,
.post-share,
.social-share:not(footer *):not(.footer *):not(.footer-social *),
.sharedaddy,
.sd-sharing,
.sd-sharing-enabled,
.jp-relatedposts,
article .social-icons:not(footer .social-icons),
.entry-content + .social-share,
.single-post .elementor-social-icons:not(footer *):not(.footer *):not(#site-footer *),
.post-content + .social-share,
.entry-footer .social-share,
.post-footer .social-share,
.sharing-wrapper,
.post-social-share:not(footer *),
.share-this,
.addtoany_share_save_container:not(footer *),
.a2a_kit:not(footer *),
.heateor_sss_sharing_container:not(footer *) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* Keep footer social icons visible - override the hiding with footer-specific selectors */
footer .social-icons,
footer .social-share,
footer .elementor-social-icons,
#site-footer .social-icons,
#site-footer .elementor-social-icons,
.footer-social-icons,
.footer .elementor-widget-social-icons,
.footer-social,
.footer .social-icons {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    overflow: visible !important;
}

/* ========== FIX 3: READ MORE BUTTONS ALWAYS VISIBLE ========== */
/* Force Read More buttons to display on ALL blog posts */

/* Primary Read More button selectors */
.elementor-post__read-more,
a.elementor-post__read-more,
.wp-block-latest-posts__read-more,
.read-more,
a.read-more,
.more-link,
a.more-link,
.wp-block-post .read-more,
article .read-more,
.elementor-post .elementor-post__read-more,
a[class*="read-more"],
.post-read-more,
.continue-reading {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #f1420b 0%, #ff6b3d 100%) !important;
    padding: 12px 24px !important;
    border-radius: 25px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    font-size: 0.9rem !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    transition: all 0.3s ease !important;
    text-align: center !important;
    margin-top: 15px !important;
    cursor: pointer !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(241, 66, 11, 0.3) !important;
}

/* Read More hover state */
.elementor-post__read-more:hover,
a.elementor-post__read-more:hover,
.wp-block-latest-posts__read-more:hover,
.read-more:hover,
a.read-more:hover,
.more-link:hover,
a.more-link:hover,
a[class*="read-more"]:hover {
    color: #ffffff !important;
    background: linear-gradient(135deg, #2a93c1 0%, #1a7aa8 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(42, 147, 193, 0.4) !important;
}

/* Force container to show Read More */
.elementor-post__text,
.elementor-post .elementor-widget-container {
    overflow: visible !important;
}

/* ========== FIX 4: FOOTER SOCIAL ICONS STYLING ========== */
/* Ensure footer social icons are properly sized and visible */

footer .elementor-social-icon,
#site-footer .elementor-social-icon,
.footer .elementor-social-icon {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(42, 147, 193, 0.2) !important;
    border: 2px solid rgba(42, 147, 193, 0.5) !important;
    transition: all 0.3s ease !important;
}

footer .elementor-social-icon:hover,
#site-footer .elementor-social-icon:hover,
.footer .elementor-social-icon:hover {
    background: rgba(241, 66, 11, 0.3) !important;
    border-color: #f1420b !important;
    transform: scale(1.1) !important;
}

footer .elementor-social-icon i,
footer .elementor-social-icon svg,
#site-footer .elementor-social-icon i,
#site-footer .elementor-social-icon svg {
    width: 20px !important;
    height: 20px !important;
    color: white !important;
    fill: white !important;
}

/* ========== FIX 5: PAGE LOADER / PRELOADER - BRAND COLORS ========== */
/* FIX: Green arcs changed to Orange (#f1420b) and Blue (#2a93c1) */

/* Preloader background - dark brand */
.theme-preloader,
.preloader,
.page-loader,
.awaiken-preloader,
#awaiken-preloader,
.starter-starter-preloader,
[class*="preloader"],
[class*="loader"]:not([class*="upload"]):not(.loading-container) {
    background: #0a0a0f !important;
    background: linear-gradient(135deg, #0a0a0f 0%, #0d1520 100%) !important;
}

/* ===== AWAIKEN THEME PRELOADER - THE ACTUAL SPINNER ===== */
/* This targets the specific structure: .theme-preloader > .loading-container > .loading */

/* Loading container sizing - DOUBLE SIZE */
.theme-preloader .loading-container,
.theme-preloader .loading-container .loading {
    height: 200px !important;
    width: 200px !important;
}

/* THE SPINNER ARC - ORANGE + BLUE (not green!) */
.theme-preloader .loading-container .loading {
    border-width: 4px !important;
    border-style: solid !important;
    border-color: transparent #f1420b transparent #2a93c1 !important;
    border-radius: 50% !important;
    animation: spin 1s linear infinite !important;
}

/* Alternative: If the animation uses different colors */
.theme-preloader .loading,
.theme-preloader .loading-container > .loading {
    border-color: transparent #f1420b transparent #2a93c1 !important;
}

/* Preloader icon sizing - larger */
.theme-preloader .loading-container #loading-icon {
    max-width: 132px !important;
}

.theme-preloader #loading-icon,
.theme-preloader .loading-icon {
    max-width: 132px !important;
}

/* ===== GENERIC PRELOADER SPINNERS ===== */

/* Preloader spinner/animation - BLUE ring with ORANGE accent */
.theme-preloader::before,
.theme-preloader::after,
.preloader-spinner,
.loading-spinner,
.awaiken-preloader .spinner,
.awaiken-preloader::before,
.awaiken-preloader::after,
#awaiken-preloader .spinner,
[class*="loader-spin"],
.starter-starter-preloader .spinner {
    border-color: rgba(42, 147, 193, 0.2) !important;
    border-top-color: #f1420b !important;
    border-right-color: #2a93c1 !important;
}

/* Alternate loader styles */
.theme-preloader .spinner,
.loader-circle,
.loading-circle,
.awaiken-preloader .loader-circle {
    border: 4px solid rgba(42, 147, 193, 0.2) !important;
    border-top: 4px solid #f1420b !important;
    border-right: 4px solid #2a93c1 !important;
}

/* Loading text if present */
.loading-text,
.preloader-text,
.awaiken-preloader-text {
    color: #2a93c1 !important;
    font-family: 'Oswald', sans-serif;
}

/* SVG loaders */
.preloader svg,
.awaiken-preloader svg,
.loader svg,
.theme-preloader svg {
    stroke: #2a93c1 !important;
    fill: #f1420b !important;
}

/* SVG circle strokes specifically */
.preloader svg circle,
.theme-preloader svg circle,
.awaiken-preloader svg circle,
[class*="preloader"] svg circle,
[class*="loader"] svg circle {
    stroke: #f1420b !important;
    fill: none !important;
}

/* SVG path strokes */
.preloader svg path,
.theme-preloader svg path,
.awaiken-preloader svg path,
[class*="preloader"] svg path,
[class*="loader"] svg path {
    stroke: #2a93c1 !important;
}

/* Elementor loader */
.elementor-loading,
.elementor .eicon-loading {
    color: #2a93c1 !important;
}

/* Starter Templates loader (common WordPress plugin) */
.starter-templates-loader svg circle,
.starter-templates-loader svg path,
.starter-templates-loading svg circle,
.starter-templates-loading svg path {
    stroke: #f1420b !important;
}

/* Force ALL loading animations to brand colors */
@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* ========== BLOG PAGE (page-id-95) - TRANSPARENT BG FOR VIDEO ========== */

/* HIDE the spiral/hexagon logo EVERYWHERE on blog page */
body.page-id-95 .elementor-widget-image img,
body.page-id-95 img[src*="hexagon"],
body.page-id-95 img[src*="spiral"],
body.page-id-95 img[src*="icon"],
body.page-id-95 img[src*="Icon"],
body.page-id-95 img[src*="PT"],
body.page-id-95 .elementor-post__thumbnail + .elementor-widget-image img {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/* BUT keep the blog post featured images visible */
body.page-id-95 .elementor-post__thumbnail img,
body.page-id-95 .wp-post-image,
body.page-id-95 .attachment-full,
body.page-id-95 article img {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Make Elementor section backgrounds TRANSPARENT so brain video shows */
body.page-id-95 .elementor-section,
body.page-id-95 .elementor-container,
body.page-id-95 .elementor-column,
body.page-id-95 .elementor-widget-wrap,
body.page-id-95 .elementor-element {
    background-color: transparent !important;
    background-image: none !important;
}

/* Only the main page body and post cards should have background */
body.page-id-95 {
    background: transparent !important;
}

/* Post cards can have slight background for readability */
body.page-id-95 .elementor-post,
body.page-id-95 article.post {
    background: rgba(10, 15, 25, 0.7) !important;
    border-radius: 12px;
    border: 1px solid rgba(241, 66, 11, 0.3) !important;
}

/* ========== SUBSCRIBE BUTTON / CTA ========== */

/* Subscribe button styling */
.subscribe-btn,
.subscribe-button,
.newsletter-signup,
.email-signup,
[class*="subscribe"],
.wp-block-button__link {
    background: linear-gradient(135deg, #2a93c1 0%, #1a7aa8 100%) !important;
    color: #ffffff !important;
    border: none !important;
    padding: 14px 32px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(42, 147, 193, 0.3) !important;
}

.subscribe-btn:hover,
.subscribe-button:hover,
.newsletter-signup:hover,
[class*="subscribe"]:hover,
.wp-block-button__link:hover {
    background: linear-gradient(135deg, #f1420b 0%, #d63a09 100%) !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(241, 66, 11, 0.4) !important;
}

/* Subscribe form input */
.subscribe-form input[type="email"],
.newsletter-form input[type="email"],
[class*="subscribe"] input[type="email"] {
    background: rgba(20, 25, 40, 0.9) !important;
    border: 1px solid rgba(42, 147, 193, 0.3) !important;
    color: #ffffff !important;
    padding: 12px 16px !important;
    border-radius: 6px !important;
}

.subscribe-form input[type="email"]:focus,
[class*="subscribe"] input[type="email"]:focus {
    border-color: #2a93c1 !important;
    outline: none !important;
    box-shadow: 0 0 10px rgba(42, 147, 193, 0.3) !important;
}

/* ========== SINGLE POST PAGES ========== */

/* Brain Animation Background */
body.single-post::before {
    content: '';
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: url('https://purebrain.ai/wp-content/uploads/2026/02/Pure-Brain-Vid-3.gif') center center no-repeat;
    background-size: cover;
    opacity: 0.5;
    z-index: -2;
    pointer-events: none;
}

/* Dark overlay - MINIMAL for readability */
body.single-post::after {
    content: '';
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(5,8,15,0.25);
    z-index: -1;
    pointer-events: none;
}

/* Base background */
body.single-post {
    background: #0a0a0f !important;
}

/* Pure Tech Icon Badge */
body.single-post .site-header::after {
    content: '';
    position: fixed;
    top: 20px; right: 25px;
    width: 50px; height: 50px;
    background: url('https://purebrain.ai/wp-content/uploads/2026/02/cropped-cropped-MA1.BI-1.2.4-002-211107-Icon-PT.png') center/contain no-repeat;
    z-index: 9999;
    pointer-events: none;
    filter: drop-shadow(0 2px 10px rgba(42,147,193,0.7));
    animation: pb-icon-pulse 3s ease-in-out infinite;
}

@keyframes pb-icon-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.06); filter: drop-shadow(0 3px 18px rgba(42,147,193,1)); }
}

/* Main content area */
body.single-post .site-content,
body.single-post .entry-content,
body.single-post article.post {
    background: rgba(10,15,25,0.5) !important;
    backdrop-filter: blur(5px);
    border-radius: 12px;
    border: 1px solid rgba(42,147,193,0.2);
    padding: 40px !important;
    max-width: 900px;
    margin: 20px auto !important;
}

/* Post title */
body.single-post .entry-title,
body.single-post h1.entry-title {
    color: #ffffff !important;
    text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}

/* All headings */
body.single-post h1,
body.single-post h2,
body.single-post h3,
body.single-post h4 {
    color: #ffffff !important;
}

/* Body text */
body.single-post p,
body.single-post li,
body.single-post .entry-content p {
    color: rgba(255,255,255,0.9) !important;
    line-height: 1.7;
}

/* Links */
body.single-post a {
    color: #2a93c1 !important;
    transition: color 0.3s ease;
}

body.single-post a:hover {
    color: #f1420b !important;
}

/* Featured image */
body.single-post .post-thumbnail img,
body.single-post .wp-post-image {
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}

/* Meta info */
body.single-post .entry-meta,
body.single-post .post-meta {
    color: rgba(255,255,255,0.6) !important;
}

body.single-post .entry-meta a {
    color: rgba(255,255,255,0.7) !important;
}

/* Comments section */
body.single-post #comments,
body.single-post .comments-area {
    background: rgba(10,15,25,0.5);
    backdrop-filter: blur(5px);
    border-radius: 12px;
    border: 1px solid rgba(42,147,193,0.2);
    padding: 30px;
    margin-top: 30px;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

body.single-post #comments h3,
body.single-post .comments-title {
    color: #ffffff !important;
}

body.single-post .comment-form label {
    color: rgba(255,255,255,0.8) !important;
}

body.single-post .comment-form textarea,
body.single-post .comment-form input[type="text"],
body.single-post .comment-form input[type="email"] {
    background: rgba(20,25,40,0.8) !important;
    border: 1px solid rgba(42,147,193,0.3) !important;
    color: #ffffff !important;
    border-radius: 6px;
}

body.single-post .comment-form input[type="submit"] {
    background: linear-gradient(135deg, #2a93c1 0%, #1a6a94 100%) !important;
    color: #ffffff !important;
    border: none !important;
    padding: 12px 30px !important;
    border-radius: 6px !important;
    cursor: pointer;
}

body.single-post .comment-form input[type="submit"]:hover {
    background: linear-gradient(135deg, #f1420b 0%, #c13509 100%) !important;
}

/* Navigation */
body.single-post .post-navigation,
body.single-post .nav-links {
    background: rgba(10,15,25,0.5);
    padding: 20px;
    border-radius: 8px;
    margin-top: 20px;
}

body.single-post .nav-links a {
    color: #2a93c1 !important;
}

/* Sidebar if present */
body.single-post .widget-area,
body.single-post aside {
    background: rgba(10,15,25,0.5);
    border-radius: 12px;
    padding: 20px;
}

body.single-post .widget-title {
    color: #ffffff !important;
}

/* ========== POST META - DATE & CATEGORY COLORS ========== */

/* ===== AWAIKEN THEME SPECIFIC - post-single-meta ===== */

/* Calendar icon and date text - BLUE */
.post-single-meta li i.fa-calendar-days,
.post-single-meta li .fa-calendar-days,
.post-single-meta li i[class*="calendar"] {
    color: #2a93c1 !important;
}

/* Date text after calendar icon - BLUE */
.post-single-meta li:has(i.fa-calendar-days),
.post-single-meta li:has(i[class*="calendar"]),
.post-single-meta li:has(.fa-calendar) {
    color: #2a93c1 !important;
}

/* Tag icon and category text - ORANGE */
.post-single-meta li i.fa-tag,
.post-single-meta li .fa-tag,
.post-single-meta li i[class*="tag"] {
    color: #f1420b !important;
}

/* Category text after tag icon - ORANGE */
.post-single-meta li:has(i.fa-tag),
.post-single-meta li:has(i[class*="tag"]),
.post-single-meta li:has(.fa-tags) {
    color: #f1420b !important;
}

/* Fallback: target all LI in post-single-meta based on position */
/* First LI (usually date) - Blue */
.post-single-meta ul li:first-child {
    color: #2a93c1 !important;
}
.post-single-meta ul li:first-child i {
    color: #2a93c1 !important;
}

/* Second LI (usually category) - Orange */
.post-single-meta ul li:nth-child(2) {
    color: #f1420b !important;
}
.post-single-meta ul li:nth-child(2) i {
    color: #f1420b !important;
}

/* ===== END AWAIKEN THEME SPECIFIC ===== */

/* Date/calendar icon and text - BLUE (Generic selectors) */
.entry-meta .posted-on,
.entry-meta .entry-date,
.post-meta .date,
.elementor-post-info .elementor-post-info__item--date,
.elementor-post-date,
[class*="post-date"],
[class*="entry-date"],
.wp-block-post-date,
time.entry-date {
    color: #2a93c1 !important;
}

/* Calendar icon specifically */
.entry-meta .posted-on svg,
.entry-meta .posted-on i,
.elementor-post-info__item--date svg,
.elementor-post-info__item--date i,
[class*="calendar"],
i.fa-calendar,
i.fa-calendar-days,
.fa-calendar,
.fa-calendar-days {
    color: #2a93c1 !important;
    fill: #2a93c1 !important;
}

/* Category/tag icon and text - ORANGE (AGGRESSIVE) */
.entry-meta .cat-links,
.entry-meta .cat-links a,
.entry-meta .tag-links,
.entry-meta .tag-links a,
.post-meta .category,
.post-meta .category a,
.post-categories,
.post-categories a,
.elementor-post-info .elementor-post-info__item--terms,
.elementor-post-info .elementor-post-info__item--terms a,
.elementor-post-info__terms-list,
.elementor-post-info__terms-list a,
[class*="category"],
[class*="category"] a,
[class*="cat-links"],
[class*="cat-links"] a,
.wp-block-post-terms,
.wp-block-post-terms a,
.entry-categories,
.entry-categories a,
body.single-post .cat-links,
body.single-post .cat-links a,
body.single-post [class*="category"],
body.single-post [class*="category"] a,
body.single-post .elementor-post-info__terms-list,
body.single-post .elementor-post-info__terms-list a,
a[rel="category tag"],
a[rel="tag"] {
    color: #f1420b !important;
}

/* Tag/category icon specifically - ORANGE */
.entry-meta .cat-links svg,
.entry-meta .cat-links i,
.entry-meta .cat-links::before,
.entry-meta .tag-links svg,
.entry-meta .tag-links i,
.elementor-post-info__item--terms svg,
.elementor-post-info__item--terms i,
.elementor-post-info__item--terms::before,
[class*="tag-icon"],
[class*="category-icon"],
body.single-post .cat-links svg,
body.single-post .cat-links i,
body.single-post [class*="terms"] svg,
body.single-post [class*="terms"] i,
i.fa-tag,
i.fa-tags,
.fa-tag,
.fa-tags {
    color: #f1420b !important;
    fill: #f1420b !important;
}

/* Category links hover */
.cat-links a:hover,
.tag-links a:hover,
[class*="category"] a:hover {
    color: #ffffff !important;
    background: #f1420b !important;
    padding: 2px 6px;
    border-radius: 3px;
}

/* ========== BLOG LISTING PAGE ========== */

/* Post titles - white by default */
body.page-id-95 .wp-block-latest-posts__post-title,
body.page-id-95 .elementor-post__title,
body.page-id-95 .elementor-post__title a,
.wp-block-latest-posts__post-title,
.elementor-post__title,
.elementor-post__title a {
    color: #ffffff !important;
    transition: all 0.3s ease !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
}

/* Post titles - style the title container (Elementor uses this) */
body.page-id-95 .elementor-post__title,
.elementor-post__title {
    background: linear-gradient(135deg, #f1420b 0%, #d63a09 100%) !important;
    padding: 12px 16px !important;
    border-radius: 8px !important;
    display: inline-block !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

body.page-id-95 .elementor-post__title a,
.elementor-post__title a {
    color: #ffffff !important;
    text-decoration: none !important;
}

/* Post titles - hover effect */
body.page-id-95 .wp-block-latest-posts__post-title:hover,
body.page-id-95 .elementor-post__title:hover,
.wp-block-latest-posts__post-title:hover,
.elementor-post__title:hover {
    background: linear-gradient(135deg, #2a93c1 0%, #1a7aa8 100%) !important;
    transform: translateY(-2px) !important;
}

/* Mobile: ensure title box doesn't overflow */
@media (max-width: 768px) {
    body.page-id-95 .elementor-post__title,
    .elementor-post__title {
        padding: 10px 12px !important;
        font-size: 1rem !important;
        line-height: 1.4 !important;
        display: block !important;
        width: 100% !important;
    }
}

/* Post excerpt */
body.page-id-95 .wp-block-latest-posts__post-excerpt,
.wp-block-latest-posts__post-excerpt {
    color: rgba(255,255,255,0.75) !important;
}

/* Post date */
body.page-id-95 .wp-block-latest-posts__post-date,
.wp-block-latest-posts__post-date {
    color: rgba(255,255,255,0.5) !important;
}

/* Post list container */
body.page-id-95 .wp-block-latest-posts__list,
.wp-block-latest-posts__list {
    background: rgba(15,20,30,0.5) !important;
    padding: 25px !important;
    border-radius: 12px !important;
    border: 1px solid rgba(42,147,193,0.2) !important;
}

/* Featured images */
body.page-id-95 .wp-block-latest-posts__featured-image img,
.wp-block-latest-posts__featured-image img {
    border-radius: 8px !important;
    box-shadow: 0 5px 20px rgba(0,0,0,0.3) !important;
}

/* ========== HIDE MENU / NAVIGATION ========== */

/* Remove menu completely - navigation via page buttons only */
.navbar,
.navbar-expand-lg,
.responsive-menu,
.main-navigation,
.site-navigation,
.primary-menu,
.menu-toggle,
nav.menu,
#site-navigation,
.nav-menu,
[class*="menu"]:not(.footer-menu):not([class*="social"]),
a[href*="add-menu"],
.navbar-toggle {
    display: none !important;
    visibility: hidden !important;
}

/* Hide "Add a menu" text specifically */
a:contains("Add a menu"),
*:contains("Add a menu") {
    display: none !important;
}

/* Keep the logo/brand visible but hide menu items */
.navbar-brand {
    display: block !important;
    visibility: visible !important;
}

/* Hide any menu placeholder text */
.menu-item-has-children,
.sub-menu {
    display: none !important;
}

/* ========== HIDE FOOTER CREDIT ========== */

/* Remove "Created by Awaiken, Powered by WordPress" from ALL pages */
.copyright,
.footer .copyright,
#site-footer .copyright,
.footer-main .copyright {
    display: none !important;
    visibility: hidden !important;
}

/* Also hide any "Powered by" text */
[class*="powered"],
[class*="credit"] {
    display: none !important;
}

/* ========== FOOTER SOCIAL ICONS - BRAND COLORS ========== */

/* Footer social icons container - ONLY style footer social, not post social */
.footer-social,
footer .social-icons,
#site-footer .social-icons {
    display: flex !important;
    gap: 15px !important;
    align-items: center !important;
}

/* Footer social icon links - Blue by default */
.footer-social a,
footer .social-icons a,
#site-footer .social-icons a {
    color: #2a93c1 !important;
    background: rgba(42, 147, 193, 0.1) !important;
    border: 1px solid rgba(42, 147, 193, 0.3) !important;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease !important;
}

/* Footer social icon hover - Orange */
.footer-social a:hover,
footer .social-icons a:hover,
#site-footer .social-icons a:hover {
    color: #ffffff !important;
    background: #f1420b !important;
    border-color: #f1420b !important;
    transform: scale(1.1);
}

/* Footer social icon SVGs/icons */
.footer-social svg,
.footer-social i,
footer .social-icons svg,
footer .social-icons i {
    fill: currentColor;
    color: inherit !important;
    width: 18px;
    height: 18px;
}

/* Footer styling */
#site-footer,
.footer {
    background: rgba(5, 8, 15, 0.95) !important;
    border-top: 1px solid rgba(42, 147, 193, 0.2);
}

.footer-main {
    padding: 30px 20px !important;
}

/* Footer logo */
.footer-logo img {
    filter: brightness(1.2);
}

/* ========== FIX FLOATING LOGO OVERLAP ========== */

/* Fix logo/icon overlapping text on main pages */
.elementor-widget-image.floating-logo,
.floating-icon,
[class*="floating-logo"],
[class*="floating-icon"],
.elementor-element[data-element_type="widget"].elementor-widget-image {
    position: relative !important;
    z-index: 1 !important;
}

/* Ensure main content is above floating elements */
.elementor-heading-title,
h1, h2, h3,
.entry-title,
[class*="title"] {
    position: relative !important;
    z-index: 10 !important;
}

/* If there's a decorative element overlapping, push it back */
.elementor-widget-image img[src*="hexagon"],
.elementor-widget-image img[src*="icon"],
.decorative-element {
    z-index: 0 !important;
}

/* ========== SUBSCRIBE BUTTON / BLOG CTA ========== */

/* Subscribe section for blog */
.blog-subscribe,
.subscribe-section,
.newsletter-cta,
.jetpack-subscribe,
.wp-block-jetpack-subscriptions,
[class*="subscribe-form"],
[class*="newsletter-signup"] {
    background: linear-gradient(135deg, rgba(42, 147, 193, 0.15) 0%, rgba(241, 66, 11, 0.1) 100%) !important;
    border: 1px solid rgba(42, 147, 193, 0.3) !important;
    border-radius: 12px !important;
    padding: 30px !important;
    margin: 30px auto !important;
    max-width: 600px !important;
    text-align: center !important;
}

/* Subscribe heading */
.blog-subscribe h3,
.subscribe-section h3,
.newsletter-cta h3,
.wp-block-jetpack-subscriptions h3 {
    color: #ffffff !important;
    margin-bottom: 15px !important;
}

/* Subscribe description */
.blog-subscribe p,
.subscribe-section p,
.wp-block-jetpack-subscriptions p {
    color: rgba(255, 255, 255, 0.8) !important;
    margin-bottom: 20px !important;
}

/* Subscribe email input */
.blog-subscribe input[type="email"],
.subscribe-section input[type="email"],
.wp-block-jetpack-subscriptions input[type="email"],
.jetpack-subscribe input[type="email"] {
    background: rgba(20, 25, 40, 0.9) !important;
    border: 1px solid rgba(42, 147, 193, 0.4) !important;
    color: #ffffff !important;
    padding: 14px 18px !important;
    border-radius: 8px !important;
    width: 100% !important;
    max-width: 350px !important;
    margin-bottom: 15px !important;
    font-size: 16px !important;
}

.blog-subscribe input[type="email"]:focus,
.wp-block-jetpack-subscriptions input[type="email"]:focus {
    border-color: #2a93c1 !important;
    outline: none !important;
    box-shadow: 0 0 15px rgba(42, 147, 193, 0.3) !important;
}

/* Subscribe button */
.blog-subscribe button,
.blog-subscribe input[type="submit"],
.subscribe-section button,
.wp-block-jetpack-subscriptions button,
.wp-block-jetpack-subscriptions input[type="submit"],
.jetpack-subscribe button {
    background: linear-gradient(135deg, #f1420b 0%, #d63a09 100%) !important;
    color: #ffffff !important;
    border: none !important;
    padding: 14px 35px !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(241, 66, 11, 0.3) !important;
}

.blog-subscribe button:hover,
.wp-block-jetpack-subscriptions button:hover,
.jetpack-subscribe button:hover {
    background: linear-gradient(135deg, #2a93c1 0%, #1a7aa8 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(42, 147, 193, 0.4) !important;
}

/* ========== RESPONSIVE ========== */

@media (max-width: 768px) {
    /* Content area */
    body.single-post .site-content,
    body.single-post .entry-content,
    body.single-post article.post {
        padding: 20px !important;
        margin: 10px !important;
        border-radius: 8px;
    }

    /* Pure Tech icon badge - smaller on mobile */
    body.single-post .site-header::after {
        width: 40px;
        height: 40px;
        top: 15px;
        right: 15px;
    }

    /* LOGO - Much smaller on mobile */
    .logo,
    .site-logo,
    .custom-logo,
    .header-logo,
    .site-branding img,
    header .logo img,
    .logo img {
        max-width: 120px !important;
        max-height: 60px !important;
        width: auto !important;
        height: auto !important;
    }

    /* Logo container */
    .logo,
    .site-logo,
    .site-branding {
        max-width: 130px !important;
    }

    /* Header adjustments for mobile */
    header,
    .site-header {
        padding: 10px 15px !important;
    }
}

/* Even smaller on very small screens */
@media (max-width: 480px) {
    .logo,
    .site-logo,
    .custom-logo,
    .header-logo,
    .site-branding img,
    header .logo img,
    .logo img {
        max-width: 100px !important;
        max-height: 50px !important;
    }

    .logo,
    .site-logo,
    .site-branding {
        max-width: 110px !important;
    }
}

/* ========== MOBILE TEXT OVERFLOW FIX ========== */

/* GLOBAL: Prevent horizontal scroll on mobile */
html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
}

/* BLOG PAGE (page-id-95) - Fix text cutoff */
body.page-id-95 .elementor-widget-text-editor,
body.page-id-95 .elementor-text-editor,
body.page-id-95 p,
body.page-id-95 .elementor-heading-title {
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    max-width: 100% !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    box-sizing: border-box !important;
}

/* Blog page description text */
body.page-id-95 .elementor-widget-text-editor p {
    font-size: 0.95rem !important;
    line-height: 1.5 !important;
    text-align: center !important;
}

/* Post title box on blog page */
body.page-id-95 .elementor-post__title {
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    white-space: normal !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

@media (max-width: 768px) {
    /* Blog page mobile fixes */
    body.page-id-95 .elementor-container,
    body.page-id-95 .elementor-row,
    body.page-id-95 .elementor-column,
    body.page-id-95 .elementor-widget-wrap {
        padding-left: 10px !important;
        padding-right: 10px !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Heading text - smaller on mobile */
    body.page-id-95 .elementor-heading-title {
        font-size: 1.8rem !important;
        line-height: 1.2 !important;
        padding: 0 10px !important;
    }

    /* Description text - wrap properly */
    body.page-id-95 .elementor-widget-text-editor p {
        font-size: 0.85rem !important;
        padding: 0 15px !important;
        line-height: 1.4 !important;
    }

    /* Post title in card */
    body.page-id-95 .elementor-post__title {
        font-size: 0.95rem !important;
        padding: 8px 12px !important;
        line-height: 1.3 !important;
    }

    /* Post card container */
    body.page-id-95 .elementor-post {
        margin: 0 10px !important;
        max-width: calc(100% - 20px) !important;
    }
}

@media (max-width: 480px) {
    body.page-id-95 .elementor-heading-title {
        font-size: 1.5rem !important;
    }

    body.page-id-95 .elementor-widget-text-editor p {
        font-size: 0.8rem !important;
        padding: 0 10px !important;
    }

    body.page-id-95 .elementor-post__title {
        font-size: 0.85rem !important;
        padding: 6px 10px !important;
    }
}

/* Prevent text cutoff on all screen sizes */
body.single-post h1,
body.single-post h2,
body.single-post .entry-title,
body.single-post .post-title,
.wp-block-latest-posts__post-title {
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    hyphens: auto !important;
    -webkit-hyphens: auto !important;
    -ms-hyphens: auto !important;
}

/* Tighter spacing on mobile */
@media (max-width: 768px) {
    /* Reduce side padding to give more text room */
    body.single-post .site-content,
    body.single-post .entry-content,
    body.single-post article.post,
    body.single-post .post-content {
        padding: 15px 12px !important;
        margin: 8px !important;
    }

    /* Tighter title spacing */
    body.single-post h1,
    body.single-post .entry-title {
        font-size: 1.6rem !important;
        line-height: 1.3 !important;
        padding: 0 5px !important;
        margin-bottom: 15px !important;
    }

    body.single-post h2 {
        font-size: 1.3rem !important;
        line-height: 1.3 !important;
    }

    body.single-post h3 {
        font-size: 1.1rem !important;
    }

    /* Body text tighter */
    body.single-post p,
    body.single-post .entry-content p {
        font-size: 0.95rem !important;
        line-height: 1.6 !important;
        padding: 0 !important;
        margin-bottom: 12px !important;
    }

    /* Blog listing - tighter text */
    .wp-block-latest-posts__post-title {
        font-size: 1.1rem !important;
        line-height: 1.3 !important;
        padding: 0 !important;
    }

    .wp-block-latest-posts__post-excerpt {
        font-size: 0.9rem !important;
        line-height: 1.5 !important;
    }

    /* Container full width on mobile */
    body.single-post .site-content,
    body.single-post article {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
}

/* Extra small phones */
@media (max-width: 400px) {
    body.single-post h1,
    body.single-post .entry-title {
        font-size: 1.4rem !important;
        padding: 0 3px !important;
    }

    body.single-post p {
        font-size: 0.9rem !important;
    }

    body.single-post .site-content,
    body.single-post article.post {
        padding: 12px 8px !important;
        margin: 5px !important;
    }
}

/* ========== FOOTER SOCIAL ICONS - WCAG COMPLIANT ========== */

/* Footer social icons container */
.footer-social-icons,
.footer-social,
#site-footer .social-icons,
.footer .social-icons,
.elementor-widget-social-icons .elementor-social-icons-wrapper {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 20px !important;
    padding: 30px 20px !important;
    flex-wrap: wrap !important;
}

/* Individual social icon links - WCAG compliant 48px tap targets */
.footer-social-icons a,
.footer-social a,
#site-footer .social-icons a,
.footer .social-icons a,
.elementor-social-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    border-radius: 50% !important;
    background: rgba(42, 147, 193, 0.2) !important;
    border: 2px solid rgba(42, 147, 193, 0.5) !important;
    transition: all 0.3s ease !important;
    flex-shrink: 0 !important;
}

/* Social icon hover states */
.footer-social-icons a:hover,
.footer-social-icons a:focus,
.footer-social a:hover,
.footer-social a:focus,
#site-footer .social-icons a:hover,
.elementor-social-icon:hover,
.elementor-social-icon:focus {
    background: rgba(241, 66, 11, 0.3) !important;
    border-color: #f1420b !important;
    transform: scale(1.1) !important;
    outline: 2px solid rgba(241, 66, 11, 0.5) !important;
    outline-offset: 2px !important;
}

/* Icon sizing within social links */
.footer-social-icons svg,
.footer-social-icons i,
.footer-social svg,
.footer-social i,
#site-footer .social-icons svg,
#site-footer .social-icons i,
.elementor-social-icon i,
.elementor-social-icon svg {
    width: 20px !important;
    height: 20px !important;
    fill: white !important;
    color: white !important;
}

/* Mobile: Slightly larger tap targets */
@media (max-width: 480px) {
    .footer-social-icons,
    .footer-social {
        gap: 15px !important;
        padding: 25px 15px !important;
    }

    .footer-social-icons a,
    .footer-social a,
    .elementor-social-icon {
        width: 52px !important;
        height: 52px !important;
        min-width: 52px !important;
        min-height: 52px !important;
    }

    .footer-social-icons svg,
    .footer-social-icons i,
    .footer-social svg,
    .footer-social i,
    .elementor-social-icon i,
    .elementor-social-icon svg {
        width: 22px !important;
        height: 22px !important;
    }
}


/* ========== ADDITIONAL READ MORE FIX (2026-02-15 BOOP) ========== */
/* Force ALL blog posts to show Read More button consistently */

/* Generate Read More button via CSS pseudo-element if missing */
.blog-card:not(:has(.read-more)):not(:has(.elementor-post__read-more))::after,
article.post:not(:has(.read-more))::after {
    content: "Read more" !important;
    display: inline-block !important;
    background: #f1420b !important;
    color: white !important;
    padding: 10px 25px !important;
    border-radius: 50px !important;
    font-weight: 600 !important;
    margin-top: 15px !important;
    cursor: pointer !important;
}

/* Ensure Elementor posts widget shows read more */
.elementor-widget-posts .elementor-post__excerpt,
.elementor-widget-posts .elementor-post__content {
    display: block !important;
}

.elementor-posts-container .elementor-post {
    display: flex !important;
    flex-direction: column !important;
}

/* Theme-specific: Artistics theme blog cards */
.artistics-blog-card .read-more-link,
.artistics-post-card .read-more-btn,
.post-card .continue-reading {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Force minimum height on post cards to ensure button visibility */
.elementor-post,
.blog-card,
article.type-post {
    min-height: auto !important;
    overflow: visible !important;
}

/* ========== SOCIAL SHARING ICONS - PURE TECH BRANDING (2026-02-15) ========== */
/* These icons appear on blog posts (Facebook, WhatsApp, LinkedIn) */
/* Pure Tech Blue: #2a93c1 | Orange: #f1420b */

/* Target the social sharing container */
.post-social-sharing,
.social-sharing,
.share-buttons,
.artistics-social-share,
[class*="social-share"],
[class*="share-icons"] {
    display: flex !important;
    justify-content: center !important;
    gap: 15px !important;
    padding: 20px !important;
    background: rgba(20, 20, 25, 0.8) !important;
    border-radius: 12px !important;
    margin: 20px 0 !important;
}

/* Social icon buttons - Default state: Pure Tech Blue */
.post-social-sharing a,
.social-sharing a,
.share-buttons a,
.artistics-social-share a,
[class*="social-share"] a,
[class*="share-icons"] a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    background: #2a93c1 !important;  /* Pure Tech Blue */
    border-radius: 50% !important;
    color: white !important;
    font-size: 20px !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    border: 2px solid #2a93c1 !important;
}

/* Social icon buttons - Hover state: Orange */
.post-social-sharing a:hover,
.social-sharing a:hover,
.share-buttons a:hover,
.artistics-social-share a:hover,
[class*="social-share"] a:hover,
[class*="share-icons"] a:hover {
    background: #f1420b !important;  /* Orange */
    border-color: #f1420b !important;
    transform: scale(1.1) !important;
    box-shadow: 0 4px 15px rgba(241, 66, 11, 0.4) !important;
}

/* Icon color inside buttons */
.post-social-sharing a i,
.post-social-sharing a svg,
.social-sharing a i,
.social-sharing a svg,
.share-buttons a i,
.share-buttons a svg,
[class*="social-share"] a i,
[class*="social-share"] a svg {
    color: white !important;
    fill: white !important;
}

/* Alternative: If icons are background images or different structure */
.post-social-sharing .social-icon,
.social-sharing .social-icon,
.share-btn,
.social-btn {
    background-color: #2a93c1 !important;
    border-color: #2a93c1 !important;
}

.post-social-sharing .social-icon:hover,
.social-sharing .social-icon:hover,
.share-btn:hover,
.social-btn:hover {
    background-color: #f1420b !important;
    border-color: #f1420b !important;
}

/* Theme-specific: Artistics theme social icons */
.artistics-share-icons a,
.theme-social-share a,
.blog-share-icons a {
    background: #2a93c1 !important;
    color: white !important;
}

.artistics-share-icons a:hover,
.theme-social-share a:hover,
.blog-share-icons a:hover {
    background: #f1420b !important;
}

/* ========== FLOATING MAGIC CURSOR/ICON FIX (2026-02-15) ========== */
/* Fix green color to Pure Tech Orange (#f1420b) */

/* Target floating cursor/magic wand icons */
.floating-icon,
.magic-cursor,
.cursor-icon,
.floating-cursor,
[class*="floating"] [class*="cursor"],
[class*="magic"],
.site-cursor,
.custom-cursor,
.elementor-widget-image.floating,
.floating-element,
.floating-wand,
.wand-icon {
    color: #f1420b !important;
    fill: #f1420b !important;
    background-color: #f1420b !important;
    border-color: #f1420b !important;
}

/* SVG inside floating elements */
.floating-icon svg,
.magic-cursor svg,
[class*="floating"] svg,
[class*="magic"] svg {
    fill: #f1420b !important;
    color: #f1420b !important;
}

.floating-icon svg path,
.magic-cursor svg path,
[class*="floating"] svg path,
[class*="magic"] svg path {
    fill: #f1420b !important;
    stroke: #f1420b !important;
}

/* Elementor floating buttons */
.e-floating-buttons,
.e-floating-buttons__container,
.elementor-widget.e-floating-buttons {
    --e-floating-buttons-btn-bg-color: #f1420b !important;
    --e-floating-buttons-btn-icon-color: white !important;
}

.e-floating-buttons .e-floating-buttons__btn,
.e-floating-buttons__btn {
    background-color: #f1420b !important;
    background: #f1420b !important;
}

.e-floating-buttons .e-floating-buttons__btn:hover {
    background-color: #2a93c1 !important;
    background: #2a93c1 !important;
}

/* Any green override to orange */
[style*="green"],
[style*="#00ff00"],
[style*="#008000"],
[style*="rgb(0, 128, 0)"],
[style*="rgb(0, 255, 0)"] {
    color: #f1420b !important;
}

/* ========== MAGIC CURSOR / BALL - ORANGE ========== */
/* The custom cursor that follows mouse movement */

#magic-cursor,
.magic-cursor,
#ball,
.cursor-ball,
.cursor-dot,
.custom-cursor-inner,
.custom-cursor-outer {
    background: #f1420b !important;
    background-color: #f1420b !important;
    border-color: #f1420b !important;
}

/* Cursor inner ball specifically */
#magic-cursor #ball,
.magic-cursor .ball,
#ball {
    background: #f1420b !important;
}


/* ============================================
   BLOG POST FIXES - Feb 18, 2026
   Scoped to blog pages only - DO NOT affect homepage
   Issues: lime green elements, logo size, hover text
   ============================================ */

/* 1. Loading spinner dot - lime green to orange */
.single-post .starter-starter-preloader .starter-preloader-dot,
.blog .starter-starter-preloader .starter-preloader-dot,
.starter-starter-preloader .starter-preloader-dot,
body.single-post .starter-starter-preloader .starter-preloader-dot,
body.blog .starter-starter-preloader .starter-preloader-dot {
    background-color: #f1420b !important;
}

/* Loading spinner circle/arc - lime to blue */
.single-post .starter-starter-preloader .starter-preloader-circle,
.blog .starter-starter-preloader .starter-preloader-circle,
.starter-starter-preloader .starter-preloader-circle,
.starter-starter-preloader svg circle,
.starter-starter-preloader .starter-preloader-svg circle,
body.single-post .starter-starter-preloader svg circle,
body.blog .starter-starter-preloader svg circle {
    stroke: #2a93c1 !important;
}

/* 2. Footer social icons - override ANY lime/green to blue */
body.single-post footer .social-links a,
body.single-post footer .elementor-social-icon,
body.single-post .site-footer .social-links a,
body.blog footer .social-links a,
body.blog footer .elementor-social-icon,
footer .starter-footer-social-links a,
footer .starter-social-icon,
body.single-post footer a[class*="social"],
body.blog footer a[class*="social"],
footer .starter-social-links a,
.footer-social .starter-social-icon,
#site-footer .starter-social-icon,
.starter-footer-social-links .starter-social-icon {
    color: #2a93c1 !important;
    border-color: #2a93c1 !important;
    background-color: transparent !important;
    fill: #2a93c1 !important;
}

footer .starter-footer-social-links a:hover,
footer .starter-social-icon:hover,
.starter-footer-social-links .starter-social-icon:hover,
#site-footer .starter-social-icon:hover {
    color: #ffffff !important;
    background-color: #2a93c1 !important;
    fill: #ffffff !important;
}

/* Footer social icon SVGs - force blue not green */
footer .starter-social-icon svg,
footer .starter-social-icon i,
footer .starter-footer-social-links svg,
footer .starter-footer-social-links i,
#site-footer .starter-social-icon svg,
#site-footer .starter-social-icon i {
    color: #2a93c1 !important;
    fill: #2a93c1 !important;
}

footer .starter-social-icon:hover svg,
footer .starter-social-icon:hover i {
    color: #ffffff !important;
    fill: #ffffff !important;
}

/* 3. Social sharing icons above comments - lime to blue */
body.single-post .social-share a,
body.single-post .starter-social-share a,
body.single-post .starter-share-icons a,
body.single-post .starter-post-share a,
body.single-post .starter-social-icon-circle,
body.single-post .post-social-sharing a,
body.single-post [class*="social-share"] a,
body.single-post [class*="share-icons"] a {
    background-color: #2a93c1 !important;
    color: #ffffff !important;
    border-color: #2a93c1 !important;
}

body.single-post .social-share a:hover,
body.single-post .starter-social-share a:hover,
body.single-post .starter-share-icons a:hover,
body.single-post .starter-post-share a:hover,
body.single-post .post-social-sharing a:hover,
body.single-post [class*="social-share"] a:hover,
body.single-post [class*="share-icons"] a:hover {
    background-color: #f1420b !important;
    border-color: #f1420b !important;
}

/* 4. Post Comment button - lime to orange */
body.single-post .comment-form .submit,
body.single-post #commentform .submit,
body.single-post .form-submit .submit,
body.single-post .comment-form input[type="submit"],
body.single-post #commentform input[type="submit"],
body.single-post .form-submit input[type="submit"] {
    background-color: #f1420b !important;
    color: #ffffff !important;
    border-color: #f1420b !important;
    background: linear-gradient(135deg, #f1420b 0%, #d63a09 100%) !important;
}

body.single-post .comment-form .submit:hover,
body.single-post #commentform .submit:hover,
body.single-post .form-submit .submit:hover,
body.single-post .comment-form input[type="submit"]:hover,
body.single-post #commentform input[type="submit"]:hover {
    background-color: #2a93c1 !important;
    border-color: #2a93c1 !important;
    background: linear-gradient(135deg, #2a93c1 0%, #1a7aa8 100%) !important;
}

/* 5. Logo at top of blog posts - center and reduce by 75% */
body.single-post .site-branding img,
body.single-post .custom-logo,
body.single-post header .site-logo img,
body.single-post .starter-logo img,
body.single-post .starter-site-logo img,
body.blog .site-branding img,
body.blog .custom-logo,
body.blog header .site-logo img,
body.blog .starter-logo img,
body.blog .starter-site-logo img {
    max-width: 80px !important;
    height: auto !important;
    display: block !important;
    margin: 0 auto !important;
}

body.single-post .site-branding,
body.single-post header .site-logo,
body.single-post .starter-logo,
body.single-post .starter-site-logo,
body.blog .site-branding,
body.blog header .site-logo,
body.blog .starter-logo,
body.blog .starter-site-logo {
    text-align: center !important;
    display: flex !important;
    justify-content: center !important;
}

/* 7. Blog listing page - hover text fix */
/* When hovering article title buttons, text should be BLACK not orange */
/* (orange text on orange background = invisible) */
body.blog .starter-latest-posts a:hover,
body.blog .wp-block-latest-posts a:hover,
body.blog .starter-post-title a:hover,
body.blog article .entry-title a:hover,
body.blog .starter-posts-list a:hover,
body.page-id-95 .elementor-post__title a:hover,
body.page-id-95 .elementor-post__title:hover a {
    color: #000000 !important;
}

/* Fix button-style article links on hover */
body.blog .starter-read-more:hover,
body.blog .read-more-btn:hover {
    color: #ffffff !important;
    background-color: #2a93c1 !important;
}

/* Fix the elementor post title hover - ensure text stays WHITE on blue bg */
body.page-id-95 .elementor-post__title:hover a,
.elementor-post__title:hover a {
    color: #ffffff !important;
}

/* 8. Nuclear option: Override ANY remaining lime/green colors on blog pages */
/* Target common green hex values and named colors */
body.single-post [style*="color: lime"],
body.single-post [style*="color: green"],
body.single-post [style*="color: limegreen"],
body.single-post [style*="color: chartreuse"],
body.single-post [style*="color: greenyellow"],
body.single-post [style*="color:#b3ff00"],
body.single-post [style*="color:#9acd32"],
body.single-post [style*="color:#7cfc00"],
body.single-post [style*="color:#00ff00"],
body.single-post [style*="color:#adff2f"],
body.single-post [style*="color:#39ff14"],
body.blog [style*="color: lime"],
body.blog [style*="color: green"],
body.blog [style*="color: limegreen"],
body.blog [style*="color:#b3ff00"],
body.blog [style*="color:#00ff00"] {
    color: #2a93c1 !important;
}

body.single-post [style*="background-color: lime"],
body.single-post [style*="background-color: green"],
body.single-post [style*="background-color: limegreen"],
body.single-post [style*="background:#b3ff00"],
body.single-post [style*="background:#00ff00"],
body.blog [style*="background-color: lime"],
body.blog [style*="background-color: green"],
body.blog [style*="background:#b3ff00"],
body.blog [style*="background:#00ff00"] {
    background-color: #2a93c1 !important;
    background: #2a93c1 !important;
}

/* ========== END BLOG POST FIXES Feb 18, 2026 ========== */


/* === CATEGORY PAGE FIX (Feb 18) === */
body.category,
body.archive {
  color: #ffffff !important;
  background: #0a0a0a !important;
}
body.category a,
body.archive a {
  color: #2a93c1 !important;
}
body.category a:hover,
body.archive a:hover {
  color: #f1420b !important;
}
body.category h1,
body.category h2,
body.category .page-title,
body.archive h1,
body.archive h2,
body.archive .page-title {
  color: #ffffff !important;
}
body.category .nav-links a,
body.archive .nav-links a {
  color: #2a93c1 !important;
}
/* === END CATEGORY PAGE FIX === */

/* === BLOG NAVIGATION FIX v2 (Feb 18, 2026) === */
/* Show and style theme header as slim navbar on blog-related pages */
/* These pages use WordPress theme template (not Elementor Canvas) */

/* 1. Show the header on blog-related pages */
body.single-post header#masthead,
body.single-post .header-sticky,
body.single-post nav.navbar,
body.single-post .navbar-brand,
body.archive header#masthead,
body.archive .header-sticky,
body.archive nav.navbar,
body.archive .navbar-brand,
body.category header#masthead,
body.category .header-sticky,
body.category nav.navbar,
body.category .navbar-brand,
body.search header#masthead,
body.search .header-sticky,
body.search nav.navbar,
body.search .navbar-brand,
body.tag header#masthead,
body.tag .header-sticky,
body.tag nav.navbar,
body.tag .navbar-brand {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 2. Style the header as a slim navbar */
body.single-post header#masthead,
body.archive header#masthead,
body.category header#masthead,
body.search header#masthead,
body.tag header#masthead {
    height: auto !important;
    max-height: 70px !important;
    overflow: hidden !important;
    background: #0a0a0a !important;
    border-bottom: 2px solid #f1420b !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 9999 !important;
    padding: 0 !important;
}

/* Admin bar offset when logged in */
body.single-post.admin-bar header#masthead,
body.archive.admin-bar header#masthead,
body.category.admin-bar header#masthead,
body.search.admin-bar header#masthead,
body.tag.admin-bar header#masthead {
    top: 32px !important;
}

/* 3. Style the sticky wrapper */
body.single-post .header-sticky,
body.archive .header-sticky,
body.category .header-sticky,
body.search .header-sticky,
body.tag .header-sticky {
    height: auto !important;
    max-height: 70px !important;
    padding: 10px 20px !important;
}

/* 4. Style the navbar container */
body.single-post nav.navbar,
body.archive nav.navbar,
body.category nav.navbar,
body.search nav.navbar,
body.tag nav.navbar {
    height: auto !important;
    max-height: 50px !important;
    padding: 0 !important;
}

body.single-post nav.navbar .container,
body.archive nav.navbar .container,
body.category nav.navbar .container,
body.search nav.navbar .container,
body.tag nav.navbar .container {
    display: flex !important;
    align-items: center !important;
    height: 50px !important;
    max-width: 1300px !important;
    padding: 0 20px !important;
}

/* 5. Constrain the logo to a proper navbar size */
body.single-post .navbar-brand,
body.archive .navbar-brand,
body.category .navbar-brand,
body.search .navbar-brand,
body.tag .navbar-brand {
    height: 40px !important;
    width: auto !important;
    padding: 0 !important;
    margin: 0 !important;
}

body.single-post .navbar-brand img.logo,
body.archive .navbar-brand img.logo,
body.category .navbar-brand img.logo,
body.search .navbar-brand img.logo,
body.tag .navbar-brand img.logo {
    height: 40px !important;
    width: 40px !important;
    object-fit: contain !important;
}

/* 6. Style breadcrumb as a secondary nav below header */
body.single-post .breadcrumb-trail,
body.archive .breadcrumb-trail,
body.category .breadcrumb-trail,
body.search .breadcrumb-trail,
body.tag .breadcrumb-trail {
    background: #111 !important;
    padding: 8px 20px !important;
    border-bottom: 1px solid rgba(42,147,193,0.3) !important;
}

body.single-post .breadcrumb-trail a,
body.archive .breadcrumb-trail a,
body.category .breadcrumb-trail a,
body.search .breadcrumb-trail a,
body.tag .breadcrumb-trail a {
    color: #2a93c1 !important;
    text-decoration: none !important;
}

body.single-post .breadcrumb-trail a:hover,
body.archive .breadcrumb-trail a:hover,
body.category .breadcrumb-trail a:hover,
body.search .breadcrumb-trail a:hover,
body.tag .breadcrumb-trail a:hover {
    color: #f1420b !important;
}

/* 7. Add "Back to Blog" link using CSS - via ::after on navbar container */
body.single-post nav.navbar .container::after,
body.archive nav.navbar .container::after,
body.category nav.navbar .container::after,
body.search nav.navbar .container::after,
body.tag nav.navbar .container::after {
    content: "Home  |  Blog  |  AI Assessment" !important;
    display: flex !important;
    align-items: center !important;
    color: rgba(255,255,255,0.6) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    letter-spacing: 1px !important;
    margin-left: auto !important;
}

/* === END BLOG NAVIGATION FIX v2 === */

/* ========== BLOG POST HOVER FIXES - Feb 18, 2026 ========== */
/* Fix 1: pt-social-share icons - WHITE on hover (not orange) */
/* Fix 2: Category tag - WHITE text on hover (no orange background) */
/* Fix 3: Newsletter subscribe link - WHITE border on hover */

/* FIX 1: pt-social-share social icons hover - white background with blue icon */
body.single-post .pt-social-share a:hover,
.pt-social-share a:hover {
    background: #ffffff !important;
    color: #2a93c1 !important;
    border-color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(255, 255, 255, 0.3) !important;
    transform: scale(1.1) !important;
}

body.single-post .pt-social-share a:hover svg,
body.single-post .pt-social-share a:hover i,
.pt-social-share a:hover svg,
.pt-social-share a:hover i {
    color: #2a93c1 !important;
    fill: #2a93c1 !important;
}

/* FIX 2: Category tag links hover - white text, no orange background */
body.single-post a[rel="category tag"]:hover,
.post-single-meta a[rel="category tag"]:hover {
    color: #ffffff !important;
    background: transparent !important;
    background-color: transparent !important;
}

/* FIX 3: "Start Your AI Partnership" CTA button - blue glow highlight on hover */
/* SCOPED TO AWAKENING LINKS ONLY (v2021-02-21 fix) */
/* The broad body.single-post .blog-cta-block a:hover rule was removed because
   it also matched subscribe/newsletter links, giving them an unwanted blue glow
   and translateY(-2px) lift on hover. The plugin CSS (purebrain-blog-cta-hover)
   now governs subscribe link appearance. This rule targets only the CTA button. */
body.single-post .blog-cta-block a[href*="awakening"],
body.single-post .blog-cta-block p a[href*="awakening"] {
    transition: box-shadow 0.25s ease, transform 0.2s ease !important;
}

body.single-post .blog-cta-block a[href*="awakening"]:hover,
body.single-post .blog-cta-block p a[href*="awakening"]:hover {
    box-shadow:
        0 0 0 3px #2a93c1,
        0 0 18px rgba(42, 147, 193, 0.55),
        0 6px 20px rgba(0, 0, 0, 0.35) !important;
    transform: translateY(-2px) !important;
    text-decoration: none !important;
    color: #ffffff !important;
}

body.single-post .blog-cta-block a[href*="awakening"]:focus,
body.single-post .blog-cta-block p a[href*="awakening"]:focus {
    outline: none !important;
    box-shadow:
        0 0 0 3px #2a93c1,
        0 0 18px rgba(42, 147, 193, 0.55) !important;
}

/* ========== END BLOG POST HOVER FIXES ========== */

/* === BLOG NAV REAL LINKS FIX (Feb 18 2026) === */
body.single-post nav.navbar .container::after,
body.archive nav.navbar .container::after,
body.category nav.navbar .container::after,
body.search nav.navbar .container::after,
body.tag nav.navbar .container::after {
    content: none !important;
    display: none !important;
}
.blog-nav-links {
    display: flex !important;
    align-items: center !important;
    margin-left: auto !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    letter-spacing: 0.5px !important;
}
.blog-nav-links a {
    color: rgba(255,255,255,0.7) !important;
    text-decoration: none !important;
    padding: 4px 10px !important;
    transition: color 0.2s ease !important;
    cursor: pointer !important;
}
.blog-nav-links a:hover {
    color: #f1420b !important;
    text-decoration: none !important;
}
.blog-nav-sep {
    color: rgba(255,255,255,0.3) !important;
    font-size: 12px !important;
    user-select: none !important;
}
@media (max-width: 600px) {
    .blog-nav-links { font-size: 11px !important; }
    .blog-nav-links a { padding: 3px 6px !important; }
}
/* === END BLOG NAV REAL LINKS FIX === */

/* ============================================================ */
/* CATEGORY + HOVER FIX - Feb 18, 2026                         */
/* ============================================================ */

/* 1. HIDE MAGIC CURSOR ORANGE DOT */
#magic-cursor,
#ball {
    display: none !important;
}

/* 2. UNIVERSAL HOVER RULE - Any link with orange bg on hover = white text */
body.category .post-item h3 a:hover,
body.archive .post-item h3 a:hover,
body.category .entry-title a:hover,
body.archive .entry-title a:hover,
body.category article h2 a:hover,
body.category article h3 a:hover,
body.archive article h2 a:hover,
body.archive article h3 a:hover {
    color: #ffffff !important;
}

/* 3. BREADCRUMB TEXT - Readable and white on hover */
.breadcrumb-trail a:hover {
    color: #ffffff !important;
    background: transparent !important;
}
.breadcrumb-trail .trail-end span {
    color: #ffffff;
}

/* 4. CATEGORY TAGS - White on hover */
.cat-links a:hover,
[rel="category tag"]:hover,
.tags-links a:hover {
    color: #ffffff !important;
}

/* 5. Related reading links - white on hover */
.related-reading a:hover,
.related-post-title:hover,
.post-navigation a:hover {
    color: #ffffff !important;
}

/* 6. SHARE ICONS - Ensure white icons remain white */
.pt-social-share a svg,
.pt-social-share a svg path {
    fill: #ffffff !important;
    color: #ffffff !important;
}

/* ============================================================ */
/* END CATEGORY + HOVER FIX                                     */
/* ============================================================ */

/* === LINK HOVER FIX v2 - Feb 18, 2026 === */
/* Post title links WHITE on hover (broader selectors) */
body.category h2 a:hover, body.archive h2 a:hover,
body.category h3 a:hover, body.archive h3 a:hover,
body.category .post-title a:hover, body.archive .post-title a:hover,
body.category .entry-title a:hover, body.archive .entry-title a:hover,
body.category .post-item a:hover, body.archive .post-item a:hover,
body.search h2 a:hover, body.search h3 a:hover,
body.tag h2 a:hover, body.tag h3 a:hover {
    color: #ffffff !important;
}

/* Magic cursor hidden (class + ID + wildcard) */
div.magic-cursor, div#magic-cursor, span.magic-cursor {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}
/* === END LINK HOVER FIX v2 === */

/* ============================================================ */
/* CTA BUTTON ORANGE TEXT FIX - Feb 18, 2026                    */
/* Fix: "Awaken Your PURE BRAIN" button text/icon turning orange */
/* Applies to: purebrain.ai, /pay-test/, /pay-test-sandbox/     */
/* ============================================================ */

/* 1. Main CTA button - text MUST stay white */
.btn--primary,
.btn--primary:hover,
.btn--primary:focus,
.btn--primary:active,
.btn--primary:visited {
    color: #ffffff !important;
}

/* 2. SVG icons inside CTA button - white stroke, no orange */
.btn--primary svg,
.btn--primary svg path,
.btn--primary .btn__icon,
.btn--primary .btn__icon path {
    color: #ffffff !important;
    stroke: #ffffff !important;
    fill: none !important;
}
.btn--primary:hover svg,
.btn--primary:hover svg path,
.btn--primary:hover .btn__icon,
.btn--primary:hover .btn__icon path {
    color: #ffffff !important;
    stroke: #ffffff !important;
    fill: none !important;
}

/* 3. "Begin Awakening" button - white text always */
.chat-initial__btn,
.chat-initial__btn:hover,
.chat-initial__btn:focus {
    color: #ffffff !important;
}

/* 4. Hero CTA wrapper - ensure button inside stays white */
.hero__cta .btn--primary,
.hero__cta .btn--primary:hover,
.hero__cta button.btn--primary,
.hero__cta button.btn--primary:hover {
    color: #ffffff !important;
}

/* 5. Any button with "awaken" text - prevent orange inheritance */
button[onclick*="scrollToChat"],
button[onclick*="scrollToChat"]:hover,
button[onclick*="startConversation"],
button[onclick*="startConversation"]:hover {
    color: #ffffff !important;
}
button[onclick*="scrollToChat"] svg,
button[onclick*="scrollToChat"] svg path,
button[onclick*="scrollToChat"]:hover svg,
button[onclick*="scrollToChat"]:hover svg path {
    stroke: #ffffff !important;
    color: #ffffff !important;
    fill: none !important;
}

/* ============================================================ */
/* END CTA BUTTON ORANGE TEXT FIX                               */
/* ============================================================ */

/* === VIDEO HANDLER CSS === */
/* v1.3.0: Fix .video-background__video sizing on ALL pages and ALL viewports.
   width:auto/height:auto with the transform centering trick fails on mobile —
   browser shows the poster/hexagon image instead of rendering the video frame.
   width:100%/height:100%/object-fit:cover is universally supported. */
.video-background__video {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transform: none !important;
    min-width: unset !important;
    min-height: unset !important;
}

/* Mobile: bring video above html bg layer and hide living-background overlay.
   Covers homepage, live (689), pay-test-sandbox-3 (688), and page 1232. */
@media (max-width: 767px) {
    body.home .video-background,
    body.page-id-11 .video-background,
    body.page-id-689 .video-background,
    body.page-id-688 .video-background,
    body.page-id-1232 .video-background,
    body.page-id-319 .video-background {
        z-index: 0 !important;
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    body.home .living-background,
    body.page-id-11 .living-background,
    body.page-id-689 .living-background,
    body.page-id-688 .living-background,
    body.page-id-1232 .living-background,
    body.page-id-319 .living-background {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        z-index: -999 !important;
    }
    body.home .living-background *,
    body.page-id-11 .living-background *,
    body.page-id-689 .living-background *,
    body.page-id-688 .living-background *,
    body.page-id-1232 .living-background *,
    body.page-id-319 .living-background * {
        display: none !important;
        visibility: hidden !important;
    }
    body.home #content,
    body.home .site-content,
    body.home .elementor,
    body.page-id-11 #content,
    body.page-id-11 .site-content,
    body.page-id-11 .elementor,
    body.page-id-689 #content,
    body.page-id-689 .site-content,
    body.page-id-689 .elementor,
    body.page-id-688 #content,
    body.page-id-688 .site-content,
    body.page-id-688 .elementor,
    body.page-id-1232 #content,
    body.page-id-1232 .site-content,
    body.page-id-1232 .elementor,
    body.page-id-319 #content,
    body.page-id-319 .site-content,
    body.page-id-319 .elementor {
        position: relative;
        z-index: 1;
    }


    /* v1.4.0 MOBILE: Hide vortex hexagon rings + particles on mobile.
       These CSS-animated hexagons (.portal-vortex > .vortex-ring) cover the
       entire viewport on mobile, hiding the video background behind them.
       Also hide hero__particles dots and shrink the hero logo. */
    .portal-vortex,
    .vortex-ring {
        display: none !important;
        visibility: hidden !important;
    }
    .hero__particles {
        display: none !important;
    }
    .hero__logo {
        width: 70px !important;
        height: 70px !important;
        margin-bottom: 15px !important;
    }
    .hero__logo-glow {
        opacity: 0.1 !important;
        filter: blur(20px) !important;
    }
}

/* === MAGIC CURSOR BODY OVERRIDE === */
/* v5.0.4 - Override [class*="magic"] (specificity 0,1,0,0) which incorrectly matches
   body.tt-magic-cursor on ALL page types (elementor_canvas AND single blog posts).
   The Additional CSS [class*="magic"] rule makes body background + text orange (#f1420b).
   Fix: body.tt-magic-cursor (0,0,1,1) + !important beats the attribute selector.
   Runs at wp_footer priority 99 — after ALL other CSS including Additional CSS. */
body.tt-magic-cursor {
    color: #e8edf5 !important;
    background-color: #0a0e1a !important;
    border-color: inherit !important;
}
/* Single blog posts + blog listing: transparent for video bg (v6.2.2) */
/* Content areas use their own section backgrounds for readability */
body.single-post.tt-magic-cursor,
body.blog.tt-magic-cursor,
body.home.blog.tt-magic-cursor {
    background: transparent !important;
    background-color: transparent !important;
    color: #e8edf5 !important;
    border-color: inherit !important;
}
/* Category / archive pages */
body.category.tt-magic-cursor,
body.archive.tt-magic-cursor,
body.tag.tt-magic-cursor {
    background-color: #0a0a0a !important;
    background: #0a0a0a !important;
    color: #ffffff !important;
    border-color: inherit !important;
}
/* Page-816 specific maximum-specificity override for /ai-website-analysis/ */
body.page-id-816.tt-magic-cursor {
    color: #e8edf5 !important;
    background-color: #0a0e1a !important;
    background: #0a0e1a !important;
    border-color: inherit !important;
}
/* Page-825 specific maximum-specificity override for /client-report-duckdive/ */
body.page-id-825.tt-magic-cursor {
    color: #e8edf5 !important;
    background-color: #0a0e1a !important;
    background: #0a0e1a !important;
    border-color: inherit !important;
}
/* Page-826 specific maximum-specificity override for /ai-website-execution/ */
body.page-id-826.tt-magic-cursor {
    color: #e8edf5 !important;
    background-color: #0a0e1a !important;
    background: #0a0e1a !important;
    border-color: inherit !important;
}
/* Page-859 specific maximum-specificity override for /client-report-duckdive/ (published) */
body.page-id-859.tt-magic-cursor {
    color: #e8edf5 !important;
    background-color: #080a12 !important;
    background: #080a12 !important;
    border-color: inherit !important;
}
/* Page-860 specific maximum-specificity override for /ai-website-execution/ (current live page) */
body.page-id-860.tt-magic-cursor {
    color: #e8edf5 !important;
    background-color: #080a12 !important;
    background: #080a12 !important;
    border-color: inherit !important;
}
/* v6.2.2 - ALL video-bg pages: body must be transparent for fixed video background
   The .video-background uses position:fixed, inset:0, z-index:-1 to sit behind content.
   body.tt-magic-cursor { background-color:#0a0e1a } was blocking it with a solid body.
   These transparent overrides restore the video-through-body effect. */
body.home.tt-magic-cursor,
body.page-id-11.tt-magic-cursor,
body.page-id-689.tt-magic-cursor,
body.page-id-688.tt-magic-cursor,
body.page-id-1232.tt-magic-cursor,
body.page-id-319.tt-magic-cursor {
    background: transparent !important;
    background-color: transparent !important;
}
/* Blog posts: transparent body for video bg, content areas have their own dark bg */
body.single-post.tt-magic-cursor {
    background: transparent !important;
    background-color: transparent !important;
}
/* html dark fallback: prevents white flash on load if video is slow to start */
html {
    background: #080a12 !important;
    background-color: #080a12 !important;
}
/* Defeat [class*="magic"] svg descendant rules that match body children */
body.tt-magic-cursor svg,
body.tt-magic-cursor svg path,
body.tt-magic-cursor svg circle,
body.tt-magic-cursor svg rect,
body.tt-magic-cursor svg polygon,
body.tt-magic-cursor svg line {
    fill: currentColor !important;
    stroke: currentColor !important;
    color: inherit !important;
}

/* === AETHER FOOTER V470 === */
/* ── Aether Footer Credit Bar v4.7.0 — PROMINENT ── */

@keyframes pb-aether-shimmer {
    0%   { background-position: -200% center; }
    100% { background-position: 200% center; }
}
@keyframes pb-aether-pulse {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.75; }
}

#pb-aether-footer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 64px;
    background: linear-gradient(135deg, #0a0c14 0%, #0d1120 50%, #080c18 100%);
    border-top: 2px solid #f1420b;
    box-shadow: 0 -4px 24px rgba(241, 66, 11, 0.20), 0 -1px 0 rgba(42, 147, 193, 0.15);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    line-height: 1;
    color: #d1d5db;
    padding: 0 24px;
    box-sizing: border-box;
    letter-spacing: 0.025em;
    gap: 0;
    flex-wrap: wrap;
    font-size: 13px;
}
#pb-aether-footer a {
    text-decoration: none !important;
    transition: color 0.2s ease, text-shadow 0.2s ease;
}
#pb-aether-footer a:hover {
    background: none !important;
    text-decoration: none !important;
}

/* "Built by" label text */
#pb-aether-footer .pb-footer-label {
    color: #9ca3af;
    font-weight: 400;
}

/* AETHER — the star of the show */
#pb-aether-footer .pb-footer-aether {
    font-weight: 800;
    font-size: 15px;
    letter-spacing: 0.12em;
    color: #f1420b;
    text-shadow:
        0 0 8px rgba(241, 66, 11, 0.7),
        0 0 20px rgba(241, 66, 11, 0.35),
        0 0 40px rgba(241, 66, 11, 0.15);
    text-transform: uppercase;
    animation: pb-aether-pulse 3s ease-in-out infinite;
}

/* "(an AI)" */
#pb-aether-footer .pb-footer-ai-tag {
    color: #6b7280;
    font-size: 11px;
    font-style: italic;
}

/* "for" */
#pb-aether-footer .pb-footer-for {
    color: #9ca3af;
}

/* PureBrain.ai — orange */
#pb-aether-footer .pb-footer-purebrain {
    color: #f1420b;
    font-weight: 700;
    text-shadow: 0 0 6px rgba(241, 66, 11, 0.4);
}
#pb-aether-footer .pb-footer-purebrain:hover {
    color: #ff6633 !important;
    text-shadow: 0 0 12px rgba(241, 66, 11, 0.7) !important;
    background: none !important;
}

/* PureMarketing.ai & PureTechnology.ai — blue */
#pb-aether-footer .pb-footer-blue {
    color: #2a93c1;
    font-weight: 600;
}
#pb-aether-footer .pb-footer-blue:hover {
    color: #f1420b !important;
    text-shadow: 0 0 8px rgba(241, 66, 11, 0.5) !important;
    background: none !important;
}

/* Divider */
#pb-aether-footer .pb-footer-sep {
    color: rgba(255, 255, 255, 0.12);
    margin: 0 12px;
    font-weight: 300;
}

/* "Why Choose PureBrain?" CTA */
#pb-aether-footer .pb-footer-why {
    color: #2a93c1;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.04em;
    padding: 4px 10px;
    border: 1px solid rgba(42, 147, 193, 0.4);
    border-radius: 4px;
    transition: all 0.2s ease;
    background: rgba(42, 147, 193, 0.08);
}
#pb-aether-footer .pb-footer-why:hover {
    color: #ffffff !important;
    background: #f1420b !important;
    border-color: #f1420b !important;
    box-shadow: 0 0 12px rgba(241, 66, 11, 0.5);
    text-shadow: none;
}

/* "Mission & Values" link — same pill style as Why Choose PureBrain */
#pb-aether-footer .pb-footer-mission {
    color: #2a93c1;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.04em;
    padding: 4px 10px;
    border: 1px solid rgba(42, 147, 193, 0.4);
    border-radius: 4px;
    transition: all 0.2s ease;
    background: rgba(42, 147, 193, 0.08);
}
#pb-aether-footer .pb-footer-mission:hover {
    color: #ffffff !important;
    background: #f1420b !important;
    border-color: #f1420b !important;
    box-shadow: 0 0 12px rgba(241, 66, 11, 0.5);
    text-shadow: none;
}

/* "Migrate" link — same pill style as Why Choose PureBrain and Mission & Values */
#pb-aether-footer .pb-footer-migrate {
    color: #2a93c1;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.04em;
    padding: 4px 10px;
    border: 1px solid rgba(42, 147, 193, 0.4);
    border-radius: 4px;
    transition: all 0.2s ease;
    background: rgba(42, 147, 193, 0.08);
}
#pb-aether-footer .pb-footer-migrate:hover {
    color: #ffffff !important;
    background: #f1420b !important;
    border-color: #f1420b !important;
    box-shadow: 0 0 12px rgba(241, 66, 11, 0.5);
    text-shadow: none;
}

/* Push body content up so footer doesn't overlap */
body {
    padding-bottom: 64px !important;
}

/* Mobile adjustments */
@media (max-width: 600px) {
    /* Bug 1 fix: height:auto so footer never clips if content wraps */
    #pb-aether-footer {
        height: auto !important;
        min-height: 52px;
        padding: 8px 16px;
        font-size: 11px;
        flex-wrap: wrap;
        row-gap: 4px;
    }
    #pb-aether-footer .pb-footer-aether {
        font-size: 13px;
    }
    /* Bug 1 fix: hide Why and Migrate, show only Mission & Values */
    #pb-aether-footer .pb-footer-why,
    #pb-aether-footer .pb-footer-migrate {
        display: none !important;
    }
    /* Hide ALL separators on mobile — only Mission & Values pill remains, no orphan pipes */
    #pb-aether-footer .pb-footer-sep-why,
    #pb-aether-footer .pb-footer-sep-before-mission,
    #pb-aether-footer .pb-footer-sep-migrate {
        display: none !important;
    }
    /* Bug 2 fix: enough bottom padding so Aether footer never overlaps legal/privacy footer */
    body {
        padding-bottom: 80px !important;
    }
}

/* v6.1.0 Fix 3: Hide Aether footer bar on assessment page mobile to prevent
   overlap with answer Option C on the quiz. Desktop is unaffected (footer bar
   is only an issue on small screens where it floats over quiz options). */
@media (max-width: 767px) {
    body.page-id-284 #pb-aether-footer {
        display: none !important;
    }
    /* Remove padding-bottom compensation when footer is hidden */
    body.page-id-284 {
        padding-bottom: 0 !important;
    }
}


/* === REFERRAL PROGRAM SECTION === */
/* ── Referral Program Section ── */
#referral-program {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: #e8edf5;
}

/* Section divider line at top */
#referral-program::before {
    content: '';
    display: block;
    width: 120px;
    height: 3px;
    background: linear-gradient(90deg, #2a93c1, #f1420b);
    margin: 0 auto 64px auto;
    border-radius: 2px;
}

.referral__inner {
    max-width: 1100px;
    margin: 0 auto;
}

/* Header */
.referral__header {
    text-align: center;
    margin-bottom: 64px;
}

.referral__eyebrow {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #f1420b;
    background: rgba(241,66,11,0.1);
    border: 1px solid rgba(241,66,11,0.25);
    padding: 5px 14px;
    border-radius: 20px;
    margin-bottom: 20px;
}

.referral__title {
    font-size: clamp(2rem, 5vw, 3.2rem);
    font-weight: 800;
    line-height: 1.1;
    margin: 0 0 16px 0;
    letter-spacing: -0.02em;
}

.referral__title .accent-blue { color: #2a93c1; }
.referral__title .accent-orange { color: #f1420b; }

.referral__subtitle {
    font-size: 1.1rem;
    color: #8a9ab5;
    max-width: 560px;
    margin: 0 auto;
    line-height: 1.6;
}

/* How It Works — 3 steps */
.referral__steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 24px;
    margin-bottom: 64px;
}

.referral__step {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(42,147,193,0.15);
    border-radius: 16px;
    padding: 32px 28px;
    position: relative;
    transition: border-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.referral__step:hover {
    border-color: rgba(42,147,193,0.4);
    transform: translateY(-4px);
    box-shadow: 0 12px 40px rgba(42,147,193,0.12);
}

.referral__step-number {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    font-weight: 800;
    margin-bottom: 16px;
    position: relative;
}

.referral__step:nth-child(1) .referral__step-number {
    background: rgba(42,147,193,0.15);
    border: 1.5px solid rgba(42,147,193,0.4);
    color: #2a93c1;
    box-shadow: 0 0 16px rgba(42,147,193,0.2);
}
.referral__step:nth-child(2) .referral__step-number {
    background: rgba(241,66,11,0.12);
    border: 1.5px solid rgba(241,66,11,0.35);
    color: #f1420b;
    box-shadow: 0 0 16px rgba(241,66,11,0.15);
}
.referral__step:nth-child(3) .referral__step-number {
    background: rgba(201,162,39,0.12);
    border: 1.5px solid rgba(201,162,39,0.35);
    color: #c9a227;
    box-shadow: 0 0 16px rgba(201,162,39,0.15);
}

.referral__step-title {
    font-size: 1.05rem;
    font-weight: 700;
    margin: 0 0 8px 0;
    color: #ffffff;
}

.referral__step-body {
    font-size: 0.92rem;
    color: #8a9ab5;
    line-height: 1.6;
    margin: 0;
}

.referral__step-body a {
    color: #2a93c1;
    text-decoration: none;
    font-weight: 600;
}
.referral__step-body a:hover { color: #f1420b; }

/* Two-column layout: commission table + leaderboard */
.referral__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    margin-bottom: 56px;
    align-items: start;
}

@media (max-width: 768px) {
    .referral__grid {
        grid-template-columns: 1fr;
    }
}

/* Glass card shared */
.referral__card {
    background: rgba(42,147,193,0.06);
    border: 1px solid rgba(42,147,193,0.15);
    border-radius: 20px;
    padding: 32px 28px;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.referral__card-title {
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #5a6e88;
    margin: 0 0 24px 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.referral__card-title::before {
    content: '';
    display: inline-block;
    width: 24px;
    height: 2px;
    background: #f1420b;
    border-radius: 1px;
    flex-shrink: 0;
}

/* Commission tiers */
.referral__tiers { list-style: none; padding: 0; margin: 0; }

.referral__tier {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    border-radius: 10px;
    margin-bottom: 10px;
    background: rgba(255,255,255,0.03);
    border: 1px solid transparent;
    transition: border-color 0.25s ease, background 0.25s ease;
    cursor: default;
}

.referral__tier:last-child { margin-bottom: 0; }

.referral__tier:hover {
    border-color: rgba(201,162,39,0.3);
    background: rgba(201,162,39,0.05);
}

.referral__tier-name {
    font-size: 0.9rem;
    font-weight: 700;
    color: #e8edf5;
}

.referral__tier-price {
    font-size: 0.8rem;
    color: #5a6e88;
    margin-top: 2px;
}

.referral__tier-earn {
    text-align: right;
}

.referral__tier-amount {
    font-size: 1.05rem;
    font-weight: 800;
    color: #f1420b;
}

.referral__tier-label {
    font-size: 0.72rem;
    color: #5a6e88;
    display: block;
}

.referral__recurring-note {
    margin-top: 20px;
    padding: 12px 16px;
    background: rgba(42,147,193,0.06);
    border: 1px solid rgba(42,147,193,0.2);
    border-radius: 8px;
    font-size: 0.82rem;
    color: #2a93c1;
    text-align: center;
    font-style: italic;
}

/* Leaderboard */
.referral__leaderboard { list-style: none; padding: 0; margin: 0; min-height: 220px; }

.referral__lb-row {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    border-radius: 10px;
    margin-bottom: 8px;
    background: rgba(255,255,255,0.03);
    border: 1px solid transparent;
    transition: border-color 0.2s ease;
}

.referral__lb-row:last-child { margin-bottom: 0; }

.referral__lb-row:hover {
    border-color: rgba(42,147,193,0.2);
}

.referral__lb-rank {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 800;
    flex-shrink: 0;
}

.referral__lb-row:nth-child(1) .referral__lb-rank {
    background: rgba(201,162,39,0.2);
    border: 1.5px solid rgba(201,162,39,0.5);
    color: #c9a227;
}
.referral__lb-row:nth-child(2) .referral__lb-rank {
    background: rgba(200,200,200,0.12);
    border: 1.5px solid rgba(200,200,200,0.3);
    color: #c0c0c0;
}
.referral__lb-row:nth-child(3) .referral__lb-rank {
    background: rgba(205,127,50,0.12);
    border: 1.5px solid rgba(205,127,50,0.3);
    color: #cd7f32;
}
.referral__lb-row:nth-child(n+4) .referral__lb-rank {
    background: rgba(42,147,193,0.08);
    border: 1.5px solid rgba(42,147,193,0.2);
    color: #5a8eaa;
}

.referral__lb-name {
    flex: 1;
    font-size: 0.9rem;
    font-weight: 600;
    color: #d0d8e8;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.referral__lb-count {
    font-size: 0.82rem;
    font-weight: 700;
    color: #2a93c1;
    white-space: nowrap;
}

/* Skeleton shimmer for loading state */
@keyframes rp-shimmer {
    0% { background-position: -400px 0; }
    100% { background-position: 400px 0; }
}
.referral__lb-skeleton {
    height: 52px;
    border-radius: 10px;
    background: linear-gradient(90deg, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.07) 50%, rgba(255,255,255,0.03) 100%);
    background-size: 400px 100%;
    animation: rp-shimmer 1.5s infinite linear;
    margin-bottom: 8px;
}

.referral__lb-empty {
    text-align: center;
    padding: 40px 20px;
    color: #4a5568;
    font-size: 0.88rem;
    font-style: italic;
}

/* CTA block */
.referral__cta {
    text-align: center;
    padding: 56px 24px;
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 24px;
    position: relative;
    overflow: hidden;
}

.referral__cta::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 200px;
    height: 1px;
    background: linear-gradient(90deg, transparent, #f1420b, transparent);
}

.referral__cta-heading {
    font-size: clamp(1.4rem, 3.5vw, 2rem);
    font-weight: 800;
    margin: 0 0 12px 0;
    letter-spacing: -0.01em;
}

.referral__cta-sub {
    font-size: 0.95rem;
    color: #8a9ab5;
    margin: 0 0 32px 0;
    line-height: 1.6;
}

.referral__cta-btn {
    display: inline-block;
    padding: 16px 40px;
    background: linear-gradient(135deg, #f1420b 0%, #d13608 100%);
    color: #ffffff;
    font-size: 1rem;
    font-weight: 700;
    text-decoration: none;
    border-radius: 8px;
    letter-spacing: 0.02em;
    box-shadow: 0 6px 28px rgba(241,66,11,0.35);
    transition: background 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease;
}

.referral__cta-btn:hover {
    background: linear-gradient(135deg, #2a93c1 0%, #1e7da8 100%);
    box-shadow: 0 6px 32px rgba(42,147,193,0.4);
    transform: translateY(-2px);
    color: #ffffff;
    text-decoration: none;
}

/* Mobile responsive */
@media (max-width: 600px) {
    #referral-program {
        padding: 60px 16px;
    }
    .referral__steps {
        grid-template-columns: 1fr;
    }
    .referral__cta {
        padding: 40px 16px;
    }
}
