/*
 * unrushed-brand.css
 * ──────────────────────────────────────────────────────────────────
 * Unrushed Mind — Sanctuary Brand Override
 * Version: 1.0.0
 * Loaded after newsum-style (priority 20) via functions.php
 *
 * Purpose: Override all Newsum theme default tech/news styles to match
 * the Unrushed Mind "Digital Sanctuary" brand identity.
 *
 * Palette:
 *   Sage Green   #C5A059  — healing, accent, interactive states
 *   Warm Amber   #C4975E  — logo dot, philosophy, warmth
 *   Obsidian     #161817  — primary background
 *   Dark Surface #1d201f  — cards, panels
 *   Warm Parchment #E5E3DC — body text (dark mode)
 *   Warm Alabaster #FBF9F5 — background (light mode)
 *   Deep Forest  #2D312E  — body text (light mode)
 * ──────────────────────────────────────────────────────────────────
 */


/* ══════════════════════════════════════════════════════════════════
   1. BODY & BASE TYPOGRAPHY — Sanctuary Reading Experience
══════════════════════════════════════════════════════════════════ */

body {
    background-color: var(--bg-color, #161817);
    color: var(--text-primary, #E5E3DC);
    font-family: var(--font-body, 'Inter', sans-serif);
    font-size: 17px;
    line-height: 1.75;
}

/* Article reading text — warm, spacious, easy on the eyes */
.article-body p,
.entry-content p,
.single-content p,
.page-content p {
    font-size: 18px;
    line-height: 1.82;
    margin-bottom: 1.45em;
    color: var(--text-primary, #E5E3DC);
}

/* Headings — Sanctuary serif */
h1, h2, h3, h4, h5, h6,
.single-title,
.entry-title,
.article-title,
.page-title {
    font-family: var(--font-heading, 'Lora', 'Playfair Display', serif);
    line-height: 1.25;
    color: var(--text-primary, #E5E3DC);
}

/* Global link hover — Sage Green */
a:hover {
    color: var(--accent-color, #C5A059);
}

/* Focus ring — accessibility, brand color */
:focus-visible {
    outline: 2px solid var(--accent-color, #C5A059) !important;
    outline-offset: 3px !important;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.btn-subscribe:focus-visible,
.social-icon-btn:focus-visible {
    outline: 2px solid var(--accent-color, #C5A059) !important;
    outline-offset: 2px !important;
}


/* ══════════════════════════════════════════════════════════════════
   2. SCROLLBAR — Subtle Sanctuary style
══════════════════════════════════════════════════════════════════ */

::-webkit-scrollbar {
    width: 6px;
}
::-webkit-scrollbar-track {
    background: #161817;
}
::-webkit-scrollbar-thumb {
    background: #2e3331;
    border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--accent-color, #C5A059);
}


/* ══════════════════════════════════════════════════════════════════
   3. HEADER — Warm Obsidian, no harsh black
══════════════════════════════════════════════════════════════════ */

.header-super-top {
    background: #111413;
    border-bottom: 1px solid var(--border-color, #242826);
}

.header-top {
    background: rgba(22, 24, 23, 0.97);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--border-color, #242826);
}

.header-bottom {
    background: var(--surface-color, #1d201f);
    border-bottom: 1px solid var(--border-color, #242826);
}

/* ── Logo — Sanctuary serif with Warm Amber dot ── */
.brand-logo {
    font-family: var(--font-heading, 'Lora', 'Playfair Display', serif) !important;
    font-size: 1.85rem !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em !important;
}

.brand-logo span,
.drawer-brand span {
    color: var(--accent-warm, #C4975E) !important;
}

/* ── Nav hover states ── */
.nav-menu li a:hover {
    color: var(--accent-color, #C5A059);
}
.nav-menu li.current-menu-item > a {
    color: var(--accent-color, #C5A059);
}

/* ── Subscribe button ── */
.btn-subscribe {
    background: var(--accent-color, #C5A059) !important;
    border-color: var(--accent-color, #C5A059) !important;
    color: #fff !important;
}
.btn-subscribe:hover {
    background: #A67D2E !important;
    border-color: #A67D2E !important;
}

/* ── Social icon hover in topbar ── */
.header-super-top .utility-socials a:hover,
.header-super-top .social-icon-btn:hover {
    background: var(--accent-color, #C5A059) !important;
    border-color: var(--accent-color, #C5A059) !important;
    color: #fff !important;
}

/* ── Ticker label — replaces red with Sage ── */
.ticker-label {
    background: var(--accent-color, #C5A059) !important;
    color: #fff !important;
}

/* ── Nav button (search, etc.) hover ── */
.nav-btn:hover,
.header-search-btn:hover {
    background: var(--accent-color, #C5A059) !important;
    border-color: var(--accent-color, #C5A059) !important;
    color: #fff !important;
}


/* ══════════════════════════════════════════════════════════════════
   4. HIDE ELEMENTS — Not aligned with brand
══════════════════════════════════════════════════════════════════ */

/* Marquee news ticker — distracting, not Sanctuary */
.marquee-banner {
    display: none !important;
}

/* Sponsorship placeholder — not live yet */
.newsum-header-sponsor-frame,
.newsum-sponsor-spotlight {
    display: none !important;
}

/* Multimedia / Podcast section — not live yet */
.media-section {
    display: none !important;
}

/* "Systems Normal" footer status pill — too tech-news */
.footer-status-pill {
    display: none !important;
}

/* 2nm semiconductor dossier / custom banner */
.newsum-custom-cta {
    display: none !important;
}

/* Story quick-preview modal placeholders */
.story-quick-modal,
.quick-summary-drawer {
    display: none !important;
}

/* Security disclosure tech link in footer */
.footer-legal-links li:has(a[href*="/security/"]),
.footer-legal-links a[href*="/security/"] {
    display: none !important;
}

/* Hide uncategorized category */
.cat-item a[href*="uncategorized"],
.footer-cat-list li:has(a[href*="uncategorized"]),
.sidebar-widget li:has(a[href*="uncategorized"]) {
    display: none !important;
}

/* Clean About Page — hide tech newsroom demo mastheads & stats */
.about-hero-section,
.about-stats-bar,
.about-values-section,
.about-masthead-section {
    display: none !important;
}
.page-about-content {
    padding-top: 2rem !important;
}
.about-story-container {
    max-width: 860px !important;
    margin: 0 auto !important;
    padding: 2rem 1.5rem 4rem !important;
}

/* Ensure author bio box in articles has Sanctuary warmth */
.author-box {
    background: #1d201f !important;
    border: 1px solid #242826 !important;
    border-radius: 12px !important;
    padding: 1.75rem !important;
}
.author-box-label {
    color: #C5A059 !important;
    letter-spacing: 0.12em !important;
}
.author-box-bio {
    color: #c8d4cf !important;
    font-size: 0.95rem !important;
    line-height: 1.7 !important;
}


/* ══════════════════════════════════════════════════════════════════
   5. CARDS & BENTO GRID — Warm, rounded Sanctuary cards
══════════════════════════════════════════════════════════════════ */

.bento-tile,
.slide,
.article-card,
.feed-card,
.list-card,
.card,
.hero-card {
    border-radius: 10px !important;
    overflow: hidden !important;
}

/* Category labels on cards */
.card-content .category,
.article-meta .category,
.tile-content .category,
.post-meta .category {
    color: var(--accent-color, #C5A059) !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
}

/* Badge / pill labels */
.badge,
.card-badge {
    background: rgba(197, 160, 89, 0.15) !important;
    border: 1px solid rgba(197, 160, 89, 0.3) !important;
    color: var(--accent-color, #C5A059) !important;
}

/* AI Summary button */
.card-action-pill.card-read-time {
    color: var(--accent-color, #C5A059) !important;
}

.card-action-pill.card-summary-btn {
    background: rgba(197, 160, 89, 0.1) !important;
    border: 1px solid rgba(197, 160, 89, 0.22) !important;
    color: #c8d4cf !important;
}
.card-action-pill.card-summary-btn:hover {
    background: rgba(197, 160, 89, 0.22) !important;
    color: #fff !important;
}

/* Progress bar */
.progress-fill,
.reading-progress-fill {
    background: linear-gradient(90deg, var(--accent-color, #C5A059), var(--accent-warm, #C4975E)) !important;
}


/* ══════════════════════════════════════════════════════════════════
   6. FEED SECTION HEADERS — Sanctuary serif, Sage Green
══════════════════════════════════════════════════════════════════ */

.feed-header h2,
.section-header h2,
.panel-section-title {
    font-family: var(--font-heading, 'Lora', 'Playfair Display', serif) !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    color: var(--accent-color, #C5A059) !important;
    font-weight: 600 !important;
}

.feed-filters button.active,
.feed-filters button:hover {
    color: var(--accent-color, #C5A059) !important;
    border-bottom-color: var(--accent-color, #C5A059) !important;
}

/* Panel links */
.panel-title a,
.panel-links a {
    color: var(--text-primary, #E5E3DC) !important;
}
.panel-links a:hover {
    color: var(--accent-color, #C5A059) !important;
}


/* ══════════════════════════════════════════════════════════════════
   7. EDITORIAL CALLOUT — The Sanctuary Quote Block
══════════════════════════════════════════════════════════════════ */

.editorial-callout {
    border-left: 3px solid var(--accent-color, #C5A059) !important;
    background: rgba(197, 160, 89, 0.04) !important;
    border-radius: 0 8px 8px 0 !important;
    padding: 1.5rem 2rem !important;
    margin: 2rem 0 !important;
}

.editorial-callout .quote-mark,
.editorial-callout cite,
.story-header-cat,
.summary-header-badge,
.summary-full-link,
.badge-dot,
.drawer-section-label {
    color: var(--accent-color, #C5A059) !important;
}

.editorial-callout blockquote,
.editorial-callout blockquote p {
    font-family: var(--font-heading, 'Lora', 'Playfair Display', serif) !important;
    font-size: 1.2rem !important;
    font-style: italic !important;
    line-height: 1.72 !important;
    color: var(--text-primary, #E5E3DC) !important;
}

/* Article blockquotes */
.entry-content blockquote,
.article-body blockquote {
    border-left: 3px solid var(--accent-color, #C5A059) !important;
    background: rgba(197, 160, 89, 0.04) !important;
    padding: 1.25rem 1.5rem !important;
    border-radius: 0 8px 8px 0 !important;
    font-style: italic !important;
    font-family: var(--font-heading, 'Lora', 'Playfair Display', serif) !important;
    color: #c8d4cf !important;
    margin: 2rem 0 !important;
}

/* Article body links */
.entry-content p a,
.article-body p a {
    color: var(--accent-color, #C5A059) !important;
    text-decoration: underline !important;
    text-decoration-color: rgba(197, 160, 89, 0.4) !important;
    text-underline-offset: 3px !important;
}
.entry-content p a:hover,
.article-body p a:hover {
    color: var(--accent-warm, #C4975E) !important;
    text-decoration-color: rgba(196, 151, 94, 0.5) !important;
}


/* ══════════════════════════════════════════════════════════════════
   8. BUTTONS — Sage Green CTA
══════════════════════════════════════════════════════════════════ */

.cta-btn,
.btn-primary,
button[type="submit"],
input[type="submit"] {
    background: var(--accent-color, #C5A059) !important;
    border-color: var(--accent-color, #C5A059) !important;
    color: #fff !important;
    border-radius: 6px !important;
    transition: background 0.2s ease !important;
}

.cta-btn:hover,
.btn-primary:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
    background: #A67D2E !important;
    border-color: #A67D2E !important;
}


/* ══════════════════════════════════════════════════════════════════
   9. SEARCH
══════════════════════════════════════════════════════════════════ */

.wp-block-search__button {
    background: var(--accent-color, #C5A059) !important;
    border-color: var(--accent-color, #C5A059) !important;
    color: #fff !important;
}

.wp-block-search__input {
    background: var(--surface-color, #1d201f) !important;
    border-color: var(--border-color, #242826) !important;
    color: var(--text-primary, #E5E3DC) !important;
}

.search-topic-pill:hover,
.search-topic-pill.active {
    background: rgba(197, 160, 89, 0.14) !important;
    border-color: var(--accent-color, #C5A059) !important;
    color: var(--accent-color, #C5A059) !important;
}


/* ══════════════════════════════════════════════════════════════════
   10. NEWSLETTER CTA — Sanctuary invitation, not terminal dispatch
══════════════════════════════════════════════════════════════════ */

.newsletter-tag {
    color: var(--accent-color, #C5A059) !important;
    background: rgba(197, 160, 89, 0.1) !important;
    border: 1px solid rgba(197, 160, 89, 0.2) !important;
    border-radius: 4px !important;
}

.newsletter-heading {
    font-family: var(--font-heading, 'Lora', 'Playfair Display', serif) !important;
    color: var(--text-primary, #E5E3DC) !important;
}

.newsletter-heading em {
    color: var(--accent-warm, #C4975E) !important;
    font-style: normal !important;
}

.newsletter-desc {
    color: var(--text-secondary, #9a9e9b) !important;
}

.newsletter-form-block input[type="email"],
.footer-input-wrap input[type="email"] {
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid var(--accent-color, #C5A059) !important;
    color: var(--text-primary, #E5E3DC) !important;
    border-radius: 6px !important;
}

.newsletter-form-block .btn-primary[type="submit"],
.footer-input-wrap button[type="submit"] {
    background: var(--accent-color, #C5A059) !important;
    border-color: var(--accent-color, #C5A059) !important;
}


/* ══════════════════════════════════════════════════════════════════
   11. FOOTER — Deep Obsidian, Sanctuary warmth
══════════════════════════════════════════════════════════════════ */

.site-footer {
    background: #111413 !important;
    border-top: 1px solid var(--border-color, #242826) !important;
}

.footer-massive-brand .brand-logo.massive span,
.footer-massive-brand .brand-logo span {
    color: var(--accent-warm, #C4975E) !important;
}

.footer-col h4,
.footer-widget-title {
    font-family: var(--font-heading, 'Lora', 'Playfair Display', serif) !important;
    color: var(--text-primary, #E5E3DC) !important;
}

.footer-links-list a:hover,
.footer-cat-list a:hover .cat-name {
    color: var(--accent-color, #C5A059) !important;
}

.cat-count {
    background: rgba(197, 160, 89, 0.12) !important;
    color: var(--accent-color, #C5A059) !important;
    border: 1px solid rgba(197, 160, 89, 0.2) !important;
    border-radius: 4px !important;
}

.social-icon-btn:hover {
    color: var(--accent-color, #C5A059) !important;
    border-color: var(--accent-color, #C5A059) !important;
    background: rgba(197, 160, 89, 0.1) !important;
}

.footer-gallery-thumb img {
    border-radius: 6px !important;
    filter: brightness(0.85) saturate(0.9) !important;
}
.footer-gallery-thumb:hover img {
    filter: brightness(1) saturate(1) !important;
}

.footer-back-to-top:hover {
    background: var(--accent-color, #C5A059) !important;
    border-color: var(--accent-color, #C5A059) !important;
}


/* ══════════════════════════════════════════════════════════════════
   12. DRAWER MENU — Sanctuary sidebar nav
══════════════════════════════════════════════════════════════════ */

.drawer-nav li a:hover,
.drawer-nav li.current-menu-item > a,
.drawer-topic-item:hover,
.drawer-meta-list li a:hover {
    color: var(--accent-color, #C5A059) !important;
    background: rgba(197, 160, 89, 0.06) !important;
}

.drawer-nav .sub-menu {
    border-left: 2px solid var(--accent-color, #C5A059) !important;
}

.drawer-close:hover {
    border-color: var(--accent-color, #C5A059) !important;
    color: var(--accent-color, #C5A059) !important;
}


/* ══════════════════════════════════════════════════════════════════
   13. SIDEBAR WIDGETS
══════════════════════════════════════════════════════════════════ */

.widget-title,
.widgettitle {
    font-family: var(--font-heading, 'Lora', 'Playfair Display', serif) !important;
    color: var(--accent-color, #C5A059) !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
}


/* ══════════════════════════════════════════════════════════════════
   14. LIGHT MODE OVERRIDES
══════════════════════════════════════════════════════════════════ */

html.light-theme body,
body.light-theme {
    background-color: #FBF9F5 !important;
    color: #2D312E !important;
}

html.light-theme .header-super-top,
body.light-theme .header-super-top {
    background: #EBE8E2 !important;
    color: #2D312E !important;
}

html.light-theme .header-top,
body.light-theme .header-top {
    background: rgba(251, 249, 245, 0.97) !important;
}

html.light-theme .header-bottom,
body.light-theme .header-bottom {
    background: #fff !important;
    border-bottom: 1px solid #e0ddd8 !important;
}

html.light-theme .site-footer,
body.light-theme .site-footer {
    background: #161817 !important;
}

html.light-theme .ticker-label,
body.light-theme .ticker-label {
    background: var(--accent-color, #C5A059) !important;
    color: #fff !important;
}

/* Light mode cards */
html.light-theme .article-card,
html.light-theme .feed-card,
html.light-theme .list-card,
body.light-theme .article-card,
body.light-theme .feed-card,
body.light-theme .list-card {
    background: #ffffff !important;
    border: 1px solid #e0ddd8 !important;
}


/* ══════════════════════════════════════════════════════════════════
   15. RESPONSIVE — Mobile Sanctuary
══════════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
    body {
        font-size: 16px !important;
    }

    .article-body p,
    .entry-content p,
    .single-content p {
        font-size: 17px !important;
        line-height: 1.75 !important;
    }

    .brand-logo {
        font-size: 1.5rem !important;
    }

    h1, .single-title, .entry-title {
        font-size: 1.75rem !important;
    }
}

@media (max-width: 480px) {
    .article-body p,
    .entry-content p {
        font-size: 16.5px !important;
    }
}


/* ══════════════════════════════════════════════════════════════════
   16. SANCTUARY CATEGORY & ARCHIVE FEED — 1 ROW = 1 ARTICLE
   16:9 Widescreen Thumbnails, Editorial Typography, Pure Minimalist Layout
   (Excerpt & Author Removed — Visual & Title Hero)
══════════════════════════════════════════════════════════════════ */

/* Single-column feed container with calm, generous breathing room */
html body .archive-feed-container,
html body .archive-feed-container.feed-layout-list,
html body .archive-feed-container.feed-layout-grid,
html body .archive-feed-container.grid-3-col,
html body .archive-feed-container.grid-2-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 2.25rem !important;
    width: 100% !important;
    grid-template-columns: none !important;
}

/* Card Base — 1 Row per Article */
html body .archive-post-card,
html body .feed-layout-list .archive-post-card,
html body .feed-layout-grid .archive-post-card,
html body .grid-3-col .archive-post-card,
html body .grid-2-col .archive-post-card {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    background: #1d201f !important;
    border: 1px solid #282c2a !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), 
                border-color 0.28s ease, 
                box-shadow 0.28s ease !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25) !important;
    position: relative !important;
    height: auto !important;
}

html body .archive-post-card:hover,
html body .feed-layout-list .archive-post-card:hover,
html body .feed-layout-grid .archive-post-card:hover {
    transform: translateY(-3px) !important;
    border-color: rgba(197, 160, 89, 0.55) !important;
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.42) !important;
}

/* Thumbnail Column — Strict 16:9 Aspect Ratio */
html body .card-media-wrap,
html body .feed-layout-list .card-media-wrap,
html body .feed-layout-grid .card-media-wrap,
html body .grid-3-col .card-media-wrap,
html body .grid-2-col .card-media-wrap {
    width: 360px !important;
    max-width: 44% !important;
    flex-shrink: 0 !important;
    aspect-ratio: 16 / 9 !important;
    height: auto !important;
    min-height: unset !important;
    max-height: unset !important;
    position: relative !important;
    overflow: hidden !important;
    background: #141615 !important;
    border-radius: 14px 0 0 14px !important;
    align-self: center !important;
}

html body .card-media-link {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
}

html body .card-thumb-img,
html body .feed-layout-list .card-thumb-img,
html body .feed-layout-grid .card-thumb-img,
html body .grid-3-col .card-thumb-img,
html body .grid-2-col .card-thumb-img {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
    transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

html body .archive-post-card:hover .card-thumb-img {
    transform: scale(1.035) !important;
}

/* Category Badge on Thumbnail */
html body .card-category-badge {
    position: absolute !important;
    top: 14px !important;
    left: 14px !important;
    background: rgba(18, 22, 20, 0.9) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    color: #C5A059 !important;
    border: 1px solid rgba(197, 160, 89, 0.4) !important;
    padding: 4px 11px !important;
    border-radius: 6px !important;
    font-size: 0.72rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    z-index: 2 !important;
}

/* Hide Quick Action Deck & Bookmark overlays on archive feed */
html body .card-action-deck,
html body .feed-layout-list .card-action-deck,
html body .archive-post-card .card-action-deck {
    display: none !important;
}

/* Card Content Body */
html body .card-body-wrap,
html body .feed-layout-list .card-body-wrap,
html body .feed-layout-grid .card-body-wrap,
html body .grid-3-col .card-body-wrap,
html body .grid-2-col .card-body-wrap {
    flex: 1 !important;
    padding: 1.6rem 2.2rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    min-width: 0 !important;
}

/* Card Meta Top: Date & Category */
html body .card-meta-top {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 6px 8px !important;
    font-family: var(--font-body, 'Inter', sans-serif) !important;
    font-size: 0.82rem !important;
    color: #8C9690 !important;
    margin-bottom: 0.65rem !important;
    letter-spacing: 0.02em !important;
}

html body .card-meta-top .card-date {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    color: #9BA59F !important;
    white-space: nowrap !important;
}

html body .card-meta-top .card-meta-sep {
    color: #555E59 !important;
}

html body .card-meta-top .card-read-time {
    display: none !important;
}

/* Post Title */
html body .card-title,
html body .card-title a,
html body .feed-layout-list .card-title,
html body .feed-layout-list .card-title a,
html body .feed-layout-grid .card-title,
html body .feed-layout-grid .card-title a,
html body .grid-3-col .card-title,
html body .grid-3-col .card-title a,
html body .grid-2-col .card-title,
html body .grid-2-col .card-title a {
    font-family: var(--font-heading, 'Lora', 'Playfair Display', serif) !important;
    font-size: 1.45rem !important;
    line-height: 1.34 !important;
    font-weight: 500 !important;
    margin: 0 0 0.85rem 0 !important;
    color: #F3F1EC !important;
    text-decoration: none !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    transition: color 0.2s ease !important;
}

html body .card-title a:hover {
    color: #C5A059 !important;
}

/* HIDE EXCERPT COMPLETELY (High Specificity to beat any document order) */
html body .card-excerpt,
html body .archive-post-card .card-excerpt,
html body .feed-layout-list .card-excerpt,
html body .feed-layout-grid .card-excerpt,
html body .grid-3-col .card-excerpt,
html body .grid-2-col .card-excerpt {
    display: none !important;
}

/* HIDE AUTHOR BYLINE COMPLETELY (Also fail-safe hides author text if old template rendered) */
html body .author-byline,
html body .feed-layout-list .author-byline,
html body .archive-post-card .author-byline {
    display: none !important;
}

/* If old template is still on server, keep date visible in footer */
html body .card-meta-footer .author-byline {
    display: flex !important;
    align-items: center !important;
}
html body .card-meta-footer .author-byline .by-text,
html body .card-meta-footer .author-byline .author-link,
html body .card-meta-footer .author-byline .meta-sep {
    display: none !important;
}
html body .card-meta-footer .author-byline time {
    color: #9BA59F !important;
    font-size: 0.82rem !important;
    font-family: var(--font-body, 'Inter', sans-serif) !important;
}

/* Card Footer */
html body .card-meta-footer,
html body .feed-layout-list .card-meta-footer,
html body .feed-layout-grid .card-meta-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
    padding-top: 0.85rem !important;
    margin-top: 0.25rem !important;
}

html body .card-read-link,
html body .card-read-link span {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 0.86rem !important;
    font-weight: 500 !important;
    color: #C5A059 !important;
    text-decoration: none !important;
    transition: transform 0.2s ease, color 0.2s ease !important;
}

html body .card-read-link svg {
    stroke: #C5A059 !important;
    transition: stroke 0.2s ease !important;
}

html body .card-read-link:hover,
html body .card-read-link:hover span {
    color: #C4975E !important;
    transform: translateX(3px) !important;
}

html body .card-read-link:hover svg {
    stroke: #C4975E !important;
}

/* ══════════════════════════════════════════════════════════════════
   MOBILE & TABLET RESPONSIVE OPTIMIZATION
══════════════════════════════════════════════════════════════════ */

@media (max-width: 991px) {
    html body .archive-layout-wrap {
        grid-template-columns: 1fr !important;
        gap: 2rem !important;
    }

    html body .archive-post-card,
    html body .feed-layout-list .archive-post-card,
    html body .feed-layout-grid .archive-post-card,
    html body .grid-3-col .archive-post-card,
    html body .grid-2-col .archive-post-card {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    html body .card-media-wrap,
    html body .feed-layout-list .card-media-wrap,
    html body .feed-layout-grid .card-media-wrap,
    html body .grid-3-col .card-media-wrap,
    html body .grid-2-col .card-media-wrap {
        width: 100% !important;
        max-width: 100% !important;
        aspect-ratio: 16 / 9 !important;
        height: auto !important;
        min-height: unset !important;
        max-height: unset !important;
        border-radius: 14px 14px 0 0 !important;
        align-self: stretch !important;
    }

    html body .card-thumb-img,
    html body .feed-layout-list .card-thumb-img,
    html body .feed-layout-grid .card-thumb-img,
    html body .grid-3-col .card-thumb-img,
    html body .grid-2-col .card-thumb-img {
        width: 100% !important;
        height: 100% !important;
        aspect-ratio: 16 / 9 !important;
        object-fit: cover !important;
        object-position: center !important;
    }

    html body .card-body-wrap,
    html body .feed-layout-list .card-body-wrap,
    html body .feed-layout-grid .card-body-wrap {
        padding: 1.35rem 1.25rem 1.5rem !important;
    }

    html body .card-title,
    html body .feed-layout-list .card-title,
    html body .feed-layout-grid .card-title {
        font-size: 1.35rem !important;
        margin-bottom: 0.85rem !important;
    }
}

@media (max-width: 768px) {
    html body .archive-layout-wrap {
        padding: 0 1rem !important;
    }

    html body .archive-feed-container,
    html body .archive-feed-container.feed-layout-list,
    html body .archive-feed-container.feed-layout-grid,
    html body .archive-feed-container.grid-3-col,
    html body .archive-feed-container.grid-2-col {
        gap: 1.75rem !important;
    }

    html body .archive-post-card,
    html body .feed-layout-list .archive-post-card,
    html body .feed-layout-grid .archive-post-card,
    html body .grid-3-col .archive-post-card,
    html body .grid-2-col .archive-post-card {
        border-radius: 12px !important;
    }

    html body .card-media-wrap,
    html body .feed-layout-list .card-media-wrap,
    html body .feed-layout-grid .card-media-wrap,
    html body .grid-3-col .card-media-wrap,
    html body .grid-2-col .card-media-wrap {
        border-radius: 12px 12px 0 0 !important;
    }

    html body .card-body-wrap,
    html body .feed-layout-list .card-body-wrap,
    html body .feed-layout-grid .card-body-wrap {
        padding: 1.2rem 1.1rem 1.35rem !important;
    }

    html body .card-title,
    html body .feed-layout-list .card-title,
    html body .feed-layout-grid .card-title {
        font-size: 1.22rem !important;
        line-height: 1.35 !important;
        margin-bottom: 0.65rem !important;
    }
}

@media (max-width: 480px) {
    html body .archive-feed-container,
    html body .archive-feed-container.feed-layout-list,
    html body .archive-feed-container.feed-layout-grid,
    html body .archive-feed-container.grid-3-col,
    html body .archive-feed-container.grid-2-col {
        gap: 1.35rem !important;
    }

    html body .archive-post-card,
    html body .feed-layout-list .archive-post-card,
    html body .feed-layout-grid .archive-post-card,
    html body .grid-3-col .archive-post-card,
    html body .grid-2-col .archive-post-card {
        border-radius: 10px !important;
    }

    html body .card-media-wrap,
    html body .feed-layout-list .card-media-wrap,
    html body .feed-layout-grid .card-media-wrap,
    html body .grid-3-col .card-media-wrap,
    html body .grid-2-col .card-media-wrap {
        border-radius: 10px 10px 0 0 !important;
    }

    html body .card-body-wrap,
    html body .feed-layout-list .card-body-wrap,
    html body .feed-layout-grid .card-body-wrap {
        padding: 1rem 0.95rem 1.15rem !important;
    }

    html body .card-title,
    html body .feed-layout-list .card-title,
    html body .feed-layout-grid .card-title {
        font-size: 1.12rem !important;
    }
}




/* ══════════════════════════════════════════════════════════════════
   17. HOMEPAGE 16:9 THUMBNAIL ASPECT RATIO & SANCTUARY STYLING
   Standardizes Hero Slider, Hero Bento Tiles, The Wire Featured Card,
   List Cards Mini Thumbnails, Feed Cards & Dispatches to 16:9 Widescreen.
   Removes Red Category Boxes with Sanctuary Sage/Amber Styling.
══════════════════════════════════════════════════════════════════ */

/* Eliminate theme default red blocks across all categories & badges */
html body .tile-content .category,
html body .card-content .category,
html body .article-meta .category,
html body .post-meta .category {
    background: rgba(197, 160, 89, 0.15) !important;
    color: #C5A059 !important;
    border: 1px solid rgba(197, 160, 89, 0.35) !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
    font-size: 0.6875rem !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    display: inline-block !important;
}

html body .slide .badge {
    background: #C5A059 !important;
    color: #161817 !important;
    font-weight: 700 !important;
    border-radius: 4px !important;
}

html body .card-action-pill.card-read-time {
    color: #C4975E !important;
}

/* 1. HERO SECTION — DESKTOP 16:9 RATIO */
@media (min-width: 1025px) {
    html body .hero-live-wall {
        height: auto !important;
        grid-template-columns: 1.15fr 2fr 1.15fr !important;
        align-items: stretch !important;
    }

    html body .hero-slider {
        aspect-ratio: 16 / 9 !important;
        height: auto !important;
        min-height: 380px !important;
    }

    html body .slide-bg {
        object-fit: cover !important;
        object-position: center !important;
    }

    html body .hero-headline {
        font-size: clamp(1.4rem, 1.8vw, 2rem) !important;
        -webkit-line-clamp: 2 !important;
    }

    html body .hero-excerpt {
        font-size: 0.88rem !important;
        -webkit-line-clamp: 2 !important;
    }

    html body .slide-content {
        padding: 1.5rem 1.75rem !important;
        right: 140px !important;
    }

    html body .bento-tile .tile-title {
        font-size: 0.95rem !important;
        -webkit-line-clamp: 2 !important;
    }

    html body .bento-tile .tile-excerpt {
        display: none !important;
    }
}

/* 2. HERO SECTION — MOBILE & TABLET RESPONSIVENESS */
@media (max-width: 768px) {
    html body .hero-live-wall {
        height: auto !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        margin-bottom: 2rem !important;
    }

    html body .hero-slider {
        aspect-ratio: 16 / 9 !important;
        height: auto !important;
        width: 100% !important;
        border-radius: 12px !important;
        position: relative !important;
        overflow: hidden !important;
    }

    html body .slide-bg {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    html body .slide-overlay {
        background: linear-gradient(to top, rgba(22, 24, 23, 0.95) 0%, rgba(22, 24, 23, 0.4) 60%, rgba(22, 24, 23, 0.1) 100%) !important;
    }

    html body .slide-content {
        padding: 0.85rem 1rem !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
    }

    html body .slide .badge {
        font-size: 0.6rem !important;
        padding: 2px 7px !important;
        margin-bottom: 0.25rem !important;
        background: #C5A059 !important;
        color: #161817 !important;
        font-weight: 700 !important;
        border-radius: 3px !important;
    }

    html body .slide .article-meta {
        font-size: 0.6rem !important;
        margin-bottom: 0.25rem !important;
        gap: 0.4rem !important;
    }

    html body .slide .article-meta .category {
        color: #C4975E !important;
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
    }

    html body .hero-headline {
        font-size: 1.05rem !important;
        line-height: 1.25 !important;
        margin-bottom: 0 !important;
        max-width: 100% !important;
        -webkit-line-clamp: 2 !important;
    }

    html body .hero-excerpt {
        display: none !important;
    }

    html body .slider-controls {
        top: 10px !important;
        right: 10px !important;
        bottom: auto !important;
        padding: 3px 8px !important;
        background: rgba(22, 24, 23, 0.75) !important;
        backdrop-filter: blur(8px) !important;
        border: 1px solid rgba(255, 255, 255, 0.12) !important;
        border-radius: 6px !important;
    }

    html body .slider-controls .nav-btn {
        font-size: 0.85rem !important;
    }

    html body .slider-controls .slide-counter {
        font-size: 0.65rem !important;
    }

    html body .card-action-deck.slider-deck {
        display: none !important;
    }

    html body .hero-col:last-child {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;
    }

    html body .hero-col:last-child .bento-tile {
        aspect-ratio: 16 / 9 !important;
        height: auto !important;
        border-radius: 8px !important;
        border: 1px solid rgba(255, 255, 255, 0.08) !important;
    }

    html body .hero-col:last-child .bento-tile .tile-overlay {
        background: linear-gradient(to top, rgba(22, 24, 23, 0.95) 0%, rgba(22, 24, 23, 0.3) 100%) !important;
    }

    html body .hero-col:last-child .bento-tile .card-action-deck {
        display: none !important;
    }

    html body .hero-col:last-child .bento-tile .tile-content {
        padding: 0.45rem 0.55rem !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
    }

    html body .hero-col:last-child .bento-tile .category {
        display: none !important;
    }

    html body .hero-col:last-child .bento-tile .tile-title {
        font-size: 0.72rem !important;
        line-height: 1.25 !important;
        margin: 0 !important;
        -webkit-line-clamp: 2 !important;
    }

    html body .hero-col:last-child .bento-tile .tile-excerpt {
        display: none !important;
    }
}

/* 3. THE WIRE — FEATURED LEAD ARTICLE 16:9 */
html body .the-wire-section .mixed-main .card-img-wrap {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    flex: 0 0 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    border-radius: 8px 8px 0 0 !important;
}

html body .the-wire-section .mixed-main .card-img-wrap img {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: cover !important;
    object-position: center !important;
}

/* 4. THE WIRE — LIST ITEMS MINI THUMBNAILS IN 16:9 */
html body .the-wire-section .mixed-list .list-thumb {
    width: 110px !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    border-radius: 6px !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
}

html body .the-wire-section .mixed-list .list-thumb img {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: cover !important;
}

@media (max-width: 480px) {
    html body .the-wire-section .mixed-list .list-thumb {
        width: 85px !important;
    }
}

/* 5. FEED GRID & RECENT DISPATCHES CARDS IN EXACT 16:9 */
html body .feed-card .card-img-wrap {
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    height: auto !important;
    overflow: hidden !important;
    border-radius: 8px 8px 0 0 !important;
}

html body .feed-card .card-img-wrap img {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: cover !important;
    object-position: center !important;
}

/* 6. FOOTER MINI THUMBNAILS & SANCTUARY GALLERY IN 16:9 */
html body .footer-mini-thumb {
    width: 75px !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    border-radius: 4px !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
}

html body .footer-mini-thumb img {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: cover !important;
}

html body .footer-gallery-thumb {
    aspect-ratio: 16 / 9 !important;
    height: auto !important;
    border-radius: 4px !important;
    overflow: hidden !important;
}

html body .footer-gallery-thumb img {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: cover !important;
}

/* ══════════════════════════════════════════════════════════════════
   18. SANCTUARY REFINEMENTS: VOID REMOVAL, RED HEADING ELIMINATION,
       4 PILLARS ORDERING (WEALTH - HEALTH - LOVE - HAPPINESS)
══════════════════════════════════════════════════════════════════ */

/* 1. ELIMINATE RED BACKGROUND & RED TEXT ON ALL HEADINGS & BADGES */
html body .feed-header h2,
html body #masonryFeedHeader h2,
html body #recentDispatchesHeader h2,
html body .category-accordion-wrapper .feed-header h2 {
    background: transparent !important;
    color: #E5E3DC !important;
    font-family: var(--font-heading), 'Lora', serif !important;
    font-size: 1.15rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    padding: 0.25rem 0 0.25rem 1rem !important;
    margin: 0 !important;
    border-left: 3px solid #C5A059 !important;
}

html body #masonryFeedHeader h2 {
    color: #E5E3DC !important;
}

/* Newsletter Section: Remove Red Line, Fix Red Badges & Red Buttons */
html body .newsletter-cta-section {
    border-top: 1px solid #242826 !important;
}

html body .newsletter-tag {
    color: #C5A059 !important;
    background: rgba(197, 160, 89, 0.12) !important;
    border: 1px solid rgba(197, 160, 89, 0.25) !important;
}

/* Accent Variable Neutralization */
:root, html, body {
    --accent-color: #C5A059 !important;
}

html body .newsletter-cta-section .newsletter-form-block .btn-primary[type="submit"],
html body .newsletter-cta-section .newsletter-form-block .btn-primary,
html body .newsletter-cta-section button.btn-primary,
html body .newsletter-form-block .btn-primary,
html body .newsletter-form-block button[type="submit"],
html body .footer-input-wrap button[type="submit"],
html body .wp-block-search__button {
    background: #C5A059 !important;
    background-color: #C5A059 !important;
    border-color: #C5A059 !important;
    color: #ffffff !important;
    border: none !important;
    transition: background 0.2s ease !important;
}

html body .newsletter-cta-section .newsletter-form-block .btn-primary[type="submit"]:hover,
html body .newsletter-cta-section .newsletter-form-block .btn-primary:hover,
html body .newsletter-cta-section button.btn-primary:hover,
html body .newsletter-form-block .btn-primary:hover,
html body .newsletter-form-block button[type="submit"]:hover,
html body .footer-input-wrap button[type="submit"]:hover,
html body .wp-block-search__button:hover {
    background: #A67D2E !important;
    background-color: #A67D2E !important;
    border-color: #A67D2E !important;
}

/* Category counts in footer & sidebar */
html body .cat-count {
    background: rgba(197, 160, 89, 0.15) !important;
    color: #C5A059 !important;
}

/* Breaking Ticker Label */
html body .ticker-label {
    background: #C5A059 !important;
    color: #161817 !important;
    font-weight: 700 !important;
}

/* 2. REMOVE 1,820PX EMPTY VOID AT THE BOTTOM OF HOMEPAGE */
/* Hides duplicate recent dispatches so main column and sidebar finish on the exact same baseline */
html body #recentDispatchesHeader,
html body .the-wire-section .main-feed-grid {
    display: none !important;
}

/* Sticky Sidebar on Desktop so it never leaves empty white space */
@media (min-width: 1025px) {
    html body .content-sidebar-wrap .sidebar-column {
        position: sticky !important;
        top: 90px !important;
        align-self: flex-start !important;
    }
}

/* 3. 4 PILLARS ORDERING: WEALTH - HEALTH - LOVE - HAPPINESS IN SIDEBAR & FOOTER & CATEGORY LISTS */
html body .widget_categories ul,
html body .wp-block-categories,
html body .footer-cat-list {
    display: flex !important;
    flex-direction: column !important;
}

html body .widget_categories li:has(a[href*="wealth"]),
html body .wp-block-categories li:has(a[href*="wealth"]),
html body .footer-cat-list li:has(a[href*="wealth"]) {
    order: 1 !important;
}

html body .widget_categories li:has(a[href*="health"]),
html body .wp-block-categories li:has(a[href*="health"]),
html body .footer-cat-list li:has(a[href*="health"]) {
    order: 2 !important;
}

html body .widget_categories li:has(a[href*="love"]),
html body .wp-block-categories li:has(a[href*="love"]),
html body .footer-cat-list li:has(a[href*="love"]) {
    order: 3 !important;
}

html body .widget_categories li:has(a[href*="happiness"]),
html body .wp-block-categories li:has(a[href*="happiness"]),
html body .footer-cat-list li:has(a[href*="happiness"]) {
    order: 4 !important;
}


/* ══════════════════════════════════════════════════════════════════
   19. PHONG THỦY MỆNH KIM (KIẾM PHONG KIM) & ZERO GRAYSCALE
       - LOẠI BỎ 100% HIỆU ỨNG XÁM ẢNH & XÁM CHỮ
       - BẢNG MÀU VÀNG HOÀNG KIM (IMPERIAL GOLD) & BẠCH KIM (PLATINUM)
══════════════════════════════════════════════════════════════════ */

/* 1. BỎ HOÀN TOÀN LÀM XÁM ẢNH & THUMBNAILS (GIỮ 100% MÀU TỰ NHIÊN) */
img,
.slide-bg,
.tile-bg,
.card-img-wrap img,
.list-thumb img,
.feed-card .card-img-wrap img,
.mixed-main .card-img-wrap img,
.masonry-card .card-img-wrap img,
.wire-lead-card .card-img-wrap img,
.editors-pick-card .card-img-wrap img,
.featured-post .featured-img-wrap img,
.footer-gallery-thumb img,
.sanctuary-gallery img,
.bento-tile img,
.article-card img,
.hero-slider .slide-bg {
    filter: none !important;
    -webkit-filter: none !important;
    opacity: 1 !important;
    transition: transform 0.4s ease, opacity 0.3s ease !important;
}

.hero-slider:hover .slide.active .slide-bg,
.bento-tile:hover .tile-bg,
.feed-card:hover .card-img-wrap img,
.mixed-main .article-card:hover .card-img-wrap img,
.mixed-list .list-card:hover .list-thumb img,
.footer-gallery-thumb:hover img {
    filter: none !important;
    -webkit-filter: none !important;
}

.panel-overlay,
.accordion-panel:hover .panel-overlay {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* 2. BỎ LÀM XÁM CHỮ — TIÊU ĐỀ SẮC NÉT, ĐẬM ĐÀ, RÕ RÀNG */
/* Hero Bento Tiles & Hero Slider (Nền ảnh tối => Chữ trắng tinh + Shadow) */
.hero-col .bento-tile .tile-title a,
.bento-tile .tile-title a,
.hero-slider .slide-title a,
.bento-hero .tile-title a {
    color: #FFFFFF !important;
    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.75) !important;
    font-weight: 600 !important;
}

.hero-col .bento-tile:hover .tile-title a,
.bento-tile:hover .tile-title a,
.hero-slider:hover .slide-title a {
    color: #E5C158 !important;
}

.hero-col .bento-tile .category,
.hero-slider .badge {
    color: #E5C158 !important;
    background: rgba(0, 0, 0, 0.6) !important;
    border: 1px solid rgba(229, 193, 88, 0.45) !important;
}

/* Thân bài / Feed Cards / List Cards (Light Theme => Đen than chì đậm #1A1D1C) */
html.light-theme .article-card .card-title a,
html.light-theme .feed-card .card-title a,
html.light-theme .mixed-main .card-title a,
html.light-theme .mixed-list .list-title a,
html.light-theme .slide-title a,
html.light-theme .entry-title a,
html.light-theme .post-title a,
html.light-theme .sidebar-column .widget a,
html.light-theme .sidebar-column .wp-block-latest-posts a,
body.light-theme .article-card .card-title a,
body.light-theme .feed-card .card-title a,
body.light-theme .mixed-main .card-title a,
body.light-theme .mixed-list .list-title a,
body.light-theme .sidebar-column a {
    color: #1A1D1C !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

/* Hover: Ánh kim hoàng gia Kiếm Phong Kim */
html.light-theme .article-card:hover .card-title a,
html.light-theme .feed-card:hover .card-title a,
html.light-theme .mixed-main .article-card:hover .card-title a,
html.light-theme .mixed-list .list-card:hover .list-title a,
html.light-theme .sidebar-column a:hover,
html.light-theme a:hover {
    color: #B88E3E !important;
}

/* Tóm tắt / Excerpt / Meta: Rõ ràng, dễ đọc */
html.light-theme .card-summary,
html.light-theme .card-desc,
html.light-theme .mixed-main p,
html.light-theme .article-card p,
html.light-theme .feed-card p {
    color: #383B39 !important;
    opacity: 1 !important;
    line-height: 1.65 !important;
}

html.light-theme .article-meta,
html.light-theme .card-meta {
    color: #6A6E6B !important;
}

/* Section Headings */
html.light-theme #masonryFeedHeader h2,
html.light-theme .the-wire-section .feed-header h2,
html.light-theme #trendingHeader h2,
html.light-theme .feed-header h2 {
    color: #1A1D1C !important;
    border-left: 3px solid #B88E3E !important;
    background: transparent !important;
}

html.dark-theme #masonryFeedHeader h2,
html.dark-theme .feed-header h2 {
    color: #F5F3ED !important;
    border-left: 3px solid #C5A059 !important;
}

/* ══════════════════════════════════════════════════════════════════
   3. PHONG THỦY KIẾM PHONG KIM — IMPERIAL GOLD & PLATINUM
   ══════════════════════════════════════════════════════════════════ */
:root, html, body {
    --accent-color: #B88E3E !important;
    --accent-gold: #C5A059 !important;
    --accent-warm: #D4AF37 !important;
    --accent-light: #E5C158 !important;
    --primary-color: #B88E3E !important;
    --link-color: #B88E3E !important;
}

/* Category Badges trên nền sáng */
html.light-theme .mixed-main .category,
html.light-theme .feed-card .category,
html.light-theme .article-card .category,
html.light-theme .category,
html.light-theme .badge,
.category,
.badge {
    color: #8C651E !important;
    background: rgba(197, 160, 89, 0.14) !important;
    border: 1px solid rgba(197, 160, 89, 0.35) !important;
    font-weight: 600 !important;
}

/* Toàn bộ nút hành động chính (Primary Action Buttons) */
html body .btn-primary,
html body .btn-subscribe,
html body .wp-block-search__button,
html body .newsletter-cta-section .newsletter-form-block .btn-primary[type="submit"],
html body .newsletter-cta-section .newsletter-form-block .btn-primary,
html body .newsletter-cta-section button.btn-primary,
html body button.btn-primary,
html body .footer-input-wrap button[type="submit"] {
    background: linear-gradient(135deg, #C5A059 0%, #A67D2E 100%) !important;
    background-color: #C5A059 !important;
    border-color: #A67D2E !important;
    color: #FFFFFF !important;
    font-weight: 600 !important;
    border: none !important;
    box-shadow: 0 4px 14px rgba(184, 142, 62, 0.28) !important;
    transition: all 0.25s ease !important;
    border-radius: 6px !important;
}

html body .btn-primary:hover,
html body .btn-subscribe:hover,
html body .wp-block-search__button:hover,
html body .newsletter-cta-section .newsletter-form-block .btn-primary[type="submit"]:hover,
html body .newsletter-cta-section .newsletter-form-block .btn-primary:hover,
html body .footer-input-wrap button[type="submit"]:hover {
    background: linear-gradient(135deg, #D4AF37 0%, #B88E3E 100%) !important;
    background-color: #D4AF37 !important;
    box-shadow: 0 6px 18px rgba(184, 142, 62, 0.42) !important;
    transform: translateY(-1px) !important;
}

/* Breaking Ticker Label */
html body .ticker-label {
    background: linear-gradient(135deg, #C5A059 0%, #A67D2E 100%) !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
}

/* Quote Callout */
html body .editorial-callout {
    border-left: 3px solid #B88E3E !important;
    background: rgba(197, 160, 89, 0.05) !important;
}
html body .editorial-callout .quote-mark,
html body .editorial-callout cite {
    color: #B88E3E !important;
}

/* Newsletter Input & Tag */
html body .newsletter-tag {
    color: #8C651E !important;
    background: rgba(197, 160, 89, 0.14) !important;
    border: 1px solid rgba(197, 160, 89, 0.35) !important;
}
html body .newsletter-form-block input[type="email"],
html body .footer-input-wrap input[type="email"] {
    border: 1px solid #C5A059 !important;
}

/* Category Counts in Footer & Sidebar */
html body .cat-count {
    background: rgba(197, 160, 89, 0.16) !important;
    color: #8C651E !important;
    font-weight: 600 !important;
}

/* Brand Logo Dot / Accent */
.brand-logo span,
.drawer-brand span,
.footer-massive-brand .brand-logo.massive span {
    color: #D4AF37 !important;
}

/* Active Nav Links & Focus */
html body .nav-menu li.current-menu-item > a,
html body .drawer-nav li.current-menu-item > a {
    color: #B88E3E !important;
}
input:focus,
button:focus,
.btn-subscribe:focus {
    outline: 2px solid #B88E3E !important;
}


/* ══════════════════════════════════════════════════════════════════
   21. SINGLE POST REFINEMENTS & SANCTUARY READING EXPERIENCE
   - 16:9 Aspect Ratio Hero & Related Thumbnails
   - Modern Bottom Social Share Deck (FB, Pinterest, X, WhatsApp, LinkedIn, Copy Link)
   - Layout Expansion (Eliminate 80px sticky sidebar)
   - Tightened Whitespace (Comments, Related Stories, Footer gaps)
   ══════════════════════════════════════════════════════════════════ */

/* 1. HERO THUMBNAIL ASPECT RATIO (16:9 LOCKED) */
html:root body .hero-image-wrap,
html body .hero-image-wrap {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 2rem auto !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    border-radius: 8px !important;
    background: #1a1c1b !important;
}

html:root body .hero-image,
html body .hero-image,
html:root body .hero-image-wrap img,
html body .hero-image-wrap img {
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: cover !important;
    display: block !important;
    filter: none !important;
    border-radius: 8px !important;
}

/* 2. RELATED POSTS THUMBNAILS (16:9 LOCKED & NO GRAYSCALE) */
html:root body .related-posts-section .feed-card .card-img-wrap,
html body .related-posts-section .feed-card .card-img-wrap {
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    width: 100% !important;
}

html:root body .related-posts-section .feed-card .card-img-wrap img,
html body .related-posts-section .feed-card .card-img-wrap img {
    aspect-ratio: 16 / 9 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    filter: none !important;
    transition: transform 0.4s ease !important;
}

html:root body .related-posts-section .feed-card:hover .card-img-wrap img,
html body .related-posts-section .feed-card:hover .card-img-wrap img {
    transform: scale(1.04) !important;
    filter: none !important;
}

/* 3. ARTICLE CONTENT LAYOUT EXPANSION & REMOVE OLD STICKY SHARE */
html:root body .sticky-share,
html body .sticky-share {
    display: none !important;
}

html:root body .article-layout,
html body .article-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 340px !important;
    gap: 3.5rem !important;
    max-width: 1280px !important;
    margin: 0 auto !important;
    padding: 0 var(--space-md) !important;
    align-items: flex-start !important;
}

html:root body .article-body-wrapper,
html body .article-body-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

html:root body .article-body,
html body .article-body {
    max-width: 100% !important;
    font-size: 1.125rem !important;
    line-height: 1.85 !important;
}

@media (max-width: 1024px) {
    html:root body .article-layout,
    html body .article-layout {
        grid-template-columns: 1fr !important;
        gap: 2rem !important;
    }
}

/* 4. MODERN HORIZONTAL BOTTOM SHARE DECK */
html:root body .article-bottom-share-deck,
html body .article-bottom-share-deck {
    margin: 2.5rem 0 2rem 0 !important;
    padding: 1.5rem !important;
    background: #1a1c1b !important;
    border: 1px solid rgba(197, 160, 89, 0.28) !important;
    border-radius: 10px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 1rem !important;
}

html:root body.light-theme .article-bottom-share-deck,
html body.light-theme .article-bottom-share-deck {
    background: #F4F1EA !important;
    border-color: rgba(197, 160, 89, 0.35) !important;
}

html:root body .article-bottom-share-deck .share-deck-header,
html body .article-bottom-share-deck .share-deck-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

html:root body .article-bottom-share-deck .share-deck-label,
html body .article-bottom-share-deck .share-deck-label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    font-family: var(--font-heading, 'Lora', serif) !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    color: #C5A059 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
}

html:root body .article-bottom-share-deck .share-deck-label svg,
html body .article-bottom-share-deck .share-deck-label svg {
    stroke: #C5A059 !important;
}

html:root body .article-bottom-share-deck .share-deck-buttons,
html body .article-bottom-share-deck .share-deck-buttons {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.65rem !important;
    align-items: center !important;
}

html:root body .share-btn-pill,
html body .share-btn-pill {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    padding: 0.55rem 1rem !important;
    border-radius: 6px !important;
    font-family: var(--font-mono, monospace) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    background: #232724 !important;
    color: #E5E3DC !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
    line-height: 1 !important;
}

html:root body.light-theme .share-btn-pill,
html body.light-theme .share-btn-pill {
    background: #FFFFFF !important;
    color: #2D312E !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
}

html:root body .share-btn-pill svg,
html body .share-btn-pill svg {
    flex-shrink: 0 !important;
    transition: transform 0.2s ease !important;
}

html:root body .share-btn-pill:hover,
html body .share-btn-pill:hover {
    transform: translateY(-2px) !important;
    border-color: #C5A059 !important;
    color: #C5A059 !important;
    background: rgba(197, 160, 89, 0.12) !important;
}

html:root body .share-btn-pill:hover svg,
html body .share-btn-pill:hover svg {
    transform: scale(1.1) !important;
}

/* Individual Brand Accent Hovers */
html:root body .share-btn-pill.share-fb:hover {
    border-color: #1877F2 !important;
    color: #1877F2 !important;
    background: rgba(24, 119, 242, 0.12) !important;
}
html:root body .share-btn-pill.share-pin:hover {
    border-color: #E60023 !important;
    color: #E60023 !important;
    background: rgba(230, 0, 35, 0.12) !important;
}
html:root body .share-btn-pill.share-x:hover {
    border-color: #C5A059 !important;
    color: #FFFFFF !important;
    background: #000000 !important;
}
html:root body .share-btn-pill.share-wa:hover {
    border-color: #25D366 !important;
    color: #25D366 !important;
    background: rgba(37, 211, 102, 0.12) !important;
}
html:root body .share-btn-pill.share-in:hover {
    border-color: #0A66C2 !important;
    color: #0A66C2 !important;
    background: rgba(10, 102, 194, 0.12) !important;
}
html:root body .share-btn-pill.copy-link-btn:hover {
    border-color: #C5A059 !important;
    color: #C5A059 !important;
    background: rgba(197, 160, 89, 0.15) !important;
}

/* 5. TIGHTENED WHITESPACE GAPS (COMMENTS, RELATED STORIES, FOOTER) */
html:root body .single-article,
html body .single-article {
    margin-bottom: 2rem !important;
}

html:root body .comments-area,
html body .comments-area,
html:root body #comments,
html body #comments {
    margin-top: 2rem !important;
    padding-top: 2rem !important;
    margin-bottom: 1.5rem !important;
    border-top: 1px solid rgba(197, 160, 89, 0.25) !important;
}

html:root body .author-box,
html body .author-box {
    margin-top: 2rem !important;
    margin-bottom: 2rem !important;
    border-color: rgba(197, 160, 89, 0.2) !important;
}

html:root body .post-navigation-deck,
html body .post-navigation-deck {
    margin-top: 1.5rem !important;
    margin-bottom: 2rem !important;
}

html:root body .related-posts-section,
html body .related-posts-section {
    margin-top: 1.5rem !important;
    margin-bottom: 2.25rem !important;
    padding: 0 var(--space-md) !important;
}

html:root body .related-posts-section .feed-header,
html body .related-posts-section .feed-header {
    margin-bottom: 1.5rem !important;
    border-bottom: 1px solid rgba(197, 160, 89, 0.25) !important;
    padding-bottom: 0.75rem !important;
}

html:root body .related-posts-section .feed-header h2,
html body .related-posts-section .feed-header h2 {
    color: #C5A059 !important;
    font-family: var(--font-heading, 'Lora', serif) !important;
    font-size: 1.5rem !important;
    letter-spacing: -0.01em !important;
}

html:root body .site-footer,
html body .site-footer {
    margin-top: 1.5rem !important;
    padding-top: 3.5rem !important;
}

/* 6. MOBILE HEADER SUPER-TOP & UTILITY ROW OVERLAP FIX */
@media (max-width: 768px) {
    html:root body .utility-tagline,
    html body .utility-tagline {
        display: none !important;
    }
    html:root body .header-inner.utility-row,
    html body .header-inner.utility-row {
        padding: 0.35rem 0.75rem !important;
        min-height: 32px !important;
    }
    html:root body .utility-date,
    html body .utility-date {
        font-size: 0.68rem !important;
        white-space: nowrap !important;
    }
    html:root body .header-super-top .utility-socials,
    html body .header-super-top .utility-socials {
        gap: 0.35rem !important;
    }
    html:root body .header-super-top .utility-socials a,
    html body .header-super-top .utility-socials a {
        width: 22px !important;
        height: 22px !important;
    }
    html:root body .header-super-top .utility-socials a svg,
    html body .header-super-top .utility-socials a svg {
        width: 10px !important;
        height: 10px !important;
    }
}

/* ══════════════════════════════════════════════════════════════════
   21. SANCTUARY SIDEBAR CARDS (A Peaceful Haven & Burnout Assessment)
   ══════════════════════════════════════════════════════════════════ */
.sanctuary-sidebar-card {
    background: linear-gradient(145deg, #1d201f 0%, #171918 100%) !important;
    border: 1px solid rgba(197, 160, 89, 0.3) !important;
    border-radius: 10px !important;
    padding: 22px !important;
    margin-bottom: 0 !important;
    position: relative !important;
    overflow: hidden !important;
}
.sanctuary-sidebar-card::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 3px !important;
    height: 100% !important;
    background: linear-gradient(180deg, #C5A059, #D4AF37) !important;
}
.sanctuary-card-kicker {
    display: inline-block !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    color: #C5A059 !important;
    font-weight: 600 !important;
    margin-bottom: 6px !important;
}
.sanctuary-card-title {
    font-family: "Lora", serif !important;
    font-size: 1.15rem !important;
    color: #E5E3DC !important;
    margin: 0 0 10px 0 !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;
}
.sanctuary-card-desc {
    font-size: 0.88rem !important;
    line-height: 1.6 !important;
    color: #9a9e9b !important;
    margin: 0 0 14px 0 !important;
}
.sanctuary-card-link {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    color: #C5A059 !important;
    font-size: 0.84rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}
.sanctuary-card-link:hover {
    color: #D4AF37 !important;
    gap: 9px !important;
}
.sanctuary-quiz-btn {
    display: block !important;
    text-align: center !important;
    background: linear-gradient(135deg, #C5A059, #B88E3E) !important;
    color: #161817 !important;
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    letter-spacing: 0.05em !important;
    padding: 10px 16px !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}
.sanctuary-quiz-btn:hover {
    background: linear-gradient(135deg, #D4AF37, #C5A059) !important;
    color: #111413 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(197, 160, 89, 0.25) !important;
}

/* ══════════════════════════════════════════════════════════════════
   22. SOFT LAUNCH POLISH & ELEMENT VISIBILITY
   ══════════════════════════════════════════════════════════════════ */
/* Tạm ẩn các link mạng xã hội chưa có kênh chính thức */
.header-super-top .utility-socials,
.utility-socials,
.footer-social-deck {
    display: none !important;
}

/* Tạm ẩn toàn bộ các phần thu thập Email & nút Subscribe */
.newsletter-cta-section,
#newsletterSection,
.footer-newsletter-form,
.footer-newsletter-desc,
.btn-subscribe {
    display: none !important;
}

/* Tối ưu lại khoảng cách cột 4 Footer khi ẩn form */
.footer-col-dispatch .footer-gallery-title {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Tối ưu thanh Ticker & phím Search trên Mobile */
@media (max-width: 768px) {
    .trending-ticker,
    #trendingTickerHeader {
        display: none !important;
    }
    .search-btn kbd {
        display: none !important;
    }
}

/* ══════════════════════════════════════════════════════════════════
   23. WHITESPACE HARMONIZATION & SECTION TIGHTENING
   - Homepage: The Wire 3-post grid spacing, Quote removal, Feed filters removal
   - Sidebar: Inter-widget gap tightening
   - Single Post: Menu-to-Title spacing, Under-Thumb spacing, Under-Related Stories spacing
   ══════════════════════════════════════════════════════════════════ */

/* --- 1. HOMEPAGE: THE WIRE SECTION & FEEDS --- */
/* Kéo 3 bài viết phía dưới The Wire lại gần khối chính (bỏ khoảng cách rộng thừa) */
.the-wire-section .mixed-block {
    margin-bottom: 0 !important;
}

.the-wire-section .main-column {
    gap: 1.5rem !important;
}

.the-wire-section .feed-grid {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Bỏ hoàn toàn trích dẫn Marcus Aurelius & kéo phần bài viết mới Recent Dispatches lại gần */
.the-wire-section .editorial-callout,
#interludeQuoteBlock,
.editorial-callout {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
    border: none !important;
}

#recentDispatchesHeader {
    margin-top: 1.5rem !important;
}

/* Bỏ các nút không hoạt động (Editor's Picks, Trending, All) phía trên sidebar/The Wire */
.feed-filters {
    display: none !important;
}

/* --- 2. SIDEBAR: THU HẸP KHOẢNG CÁCH GIỮA CÁC PHẦN --- */
/* Đồng bộ khoảng cách giữa các widget và card với flex gap thanh lịch */
.sidebar-column {
    gap: 1.15rem !important;
}

.sidebar-column .sidebar-widget,
.sidebar-column .widget,
.sidebar-column .widget_block,
.widget-area .widget,
.widget-area .sidebar-widget {
    margin-bottom: 0 !important;
}

/* --- 3. GIAO DIỆN BÀI VIẾT: TỐI ƯU KHOẢNG TRỐNG --- */
/* Khoảng cách giữa Menu và Tiêu đề bài viết */
body.single .site-content,
html:root body.single .site-content,
html body.single .site-content {
    padding-top: 1.25rem !important;
}

html:root body .single-article .article-hero,
html body .single-article .article-hero {
    padding-top: 0.5rem !important;
    padding-bottom: 0 !important;
}

html:root body .article-meta-top,
html body .article-meta-top {
    margin-bottom: 0.75rem !important;
}

html:root body .article-title,
html body .article-title {
    margin-bottom: 1.25rem !important;
}

/* Khoảng cách dưới Thumbnail bài viết */
html:root body .hero-image-wrap,
html body .hero-image-wrap {
    margin-top: 1.25rem !important;
    margin-bottom: 1.25rem !important;
}

html:root body .article-layout,
html body .article-layout {
    margin-top: 0 !important;
}

/* Khoảng cách dưới "Related Stories" và trước Footer */
html:root body .single-article,
html body .single-article {
    margin-bottom: 1.5rem !important;
}

html:root body .related-posts-section,
html body .related-posts-section {
    margin-top: 1.25rem !important;
    margin-bottom: 1rem !important;
}

html:root body .related-posts-section .feed-grid,
html body .related-posts-section .feed-grid {
    margin-bottom: 0 !important;
}

body.single .site-content,
html:root body.single .site-content,
html body.single .site-content {
    padding-bottom: 1rem !important;
}

html:root body.single .site-footer,
html body.single .site-footer {
    margin-top: 0 !important;
    padding-top: 2rem !important;
}


/* ==========================================================================
   UNRUSHED MIND V1.2 - BRAND IDENTITY, GAPS TIGHTENING & SANCTUARY DARK MODE
   ========================================================================== */

/* ── 1. LOGO & BRAND NAME IN DARK THEME (IMPERIAL CHAMPAGNE GOLD) ── */
html:not(.light-theme) .brand-logo,
html:not(.light-theme) .brand-logo a,
html:not(.light-theme) .drawer-brand,
html:not(.light-theme) .drawer-brand a,
html:not(.light-theme) .site-title,
html:not(.light-theme) .site-title a,
html:not(.light-theme) .brand-logo span,
html:not(.light-theme) .drawer-brand span {
    color: #C5A059 !important;
}

/* Custom logo image: invert & tint to brand gold (#C5A059) in dark mode */
html:not(.light-theme) .brand-logo img.custom-logo,
html:not(.light-theme) .custom-logo-link img,
html:not(.light-theme) img.custom-logo {
    filter: brightness(0) saturate(100%) invert(69%) sepia(38%) saturate(720%) hue-rotate(6deg) brightness(95%) contrast(90%) !important;
}

html.light-theme .brand-logo img.custom-logo,
html.light-theme .custom-logo-link img,
html.light-theme img.custom-logo {
    filter: none !important;
}

html.light-theme .brand-logo,
html.light-theme .brand-logo a,
html.light-theme .drawer-brand,
html.light-theme .drawer-brand a {
    color: #2D312E !important;
}

html.light-theme .brand-logo span,
html.light-theme .drawer-brand span {
    color: #C5A059 !important;
}

/* ── 2. REMOVE MASSIVE BRAND FOOTER BLOCK ── */
.footer-massive-brand {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
}

/* ── 3. CATEGORY & ARCHIVE PAGES: OBSIDIAN DARK BACKGROUND & BADGE FIX ── */
html:not(.light-theme) body.archive,
html:not(.light-theme) body.category,
html:not(.light-theme) body.tag,
html:not(.light-theme) body.author,
html:not(.light-theme) .archive-page-content,
html:not(.light-theme) .archive-layout-wrap,
html:not(.light-theme) .main-content-col,
html:not(.light-theme) .archive-feed-container {
    background-color: #161817 !important;
    color: #E5E3DC !important;
}

html:not(.light-theme) .archive-masthead,
html:not(.light-theme) .category-masthead-hero {
    background: #1a1d1c !important;
    border-bottom: 1px solid #282c2a !important;
}

html:not(.light-theme) .archive-masthead .archive-title {
    color: #FBF9F5 !important;
}

html:not(.light-theme) .archive-masthead .archive-desc {
    color: #9BA59F !important;
}

html:not(.light-theme) .archive-filter-bar {
    border-top: 1px solid #282c2a !important;
}

html:not(.light-theme) .filter-label {
    color: #8C9690 !important;
}

html:not(.light-theme) .filter-pill {
    background: #1d201f !important;
    border: 1px solid #282c2a !important;
    color: #E5E3DC !important;
}

html:not(.light-theme) .filter-pill .pill-count {
    color: #8C9690 !important;
}

html:not(.light-theme) .filter-pill:hover,
html:not(.light-theme) .filter-pill.active {
    background: #C5A059 !important;
    color: #161817 !important;
    border-color: #C5A059 !important;
}

html:not(.light-theme) .filter-pill:hover .pill-count,
html:not(.light-theme) .filter-pill.active .pill-count {
    color: #161817 !important;
}

/* Category Badge inside Card Meta (No longer overlaying & covering thumbnail text) */
html body .card-category-badge,
html body .archive-post-card .card-category-badge {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    background: rgba(197, 160, 89, 0.12) !important;
    color: #C5A059 !important;
    border: 1px solid rgba(197, 160, 89, 0.35) !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    line-height: 1.4 !important;
    margin-right: 0.25rem !important;
    z-index: 1 !important;
}

html body.light-theme .card-category-badge,
html.light-theme body .card-category-badge {
    background: rgba(197, 160, 89, 0.15) !important;
    color: #8C6721 !important;
    border-color: rgba(197, 160, 89, 0.4) !important;
}

/* ── 4. HOMEPAGE GAPS & EXCESSIVE WHITESPACE REDUCTION ── */
/* Tighten homepage site-content padding */
body.home .site-content,
html.home .site-content {
    padding-top: 0.75rem !important;
    padding-bottom: 1.5rem !important;
}

/* Marquee strip spacing */
.marquee-banner,
#marquee-wrapper {
    margin: 1.25rem 0 !important;
    padding: 0.75rem 0 !important;
}

/* Category accordion section */
.category-accordion-wrapper {
    margin-bottom: 1.5rem !important;
}
.category-accordion-wrapper .feed-header {
    margin-bottom: 1rem !important;
}
.category-accordion {
    margin-bottom: 0 !important;
}

/* The Wire section */
.the-wire-section,
#masonrySectionWrap {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important;
}
#masonryFeedHeader {
    margin-bottom: 1rem !important;
}

/* Inside The Wire: Main column gap */
.the-wire-section .main-column {
    gap: 1.25rem !important;
}
.the-wire-section .mixed-block {
    margin-bottom: 0 !important;
}
.the-wire-section .feed-grid {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Recent dispatches header & grid */
#recentDispatchesHeader {
    margin-top: 0.5rem !important;
    margin-bottom: 1rem !important;
}
.main-feed-grid {
    gap: 1.25rem !important;
    margin-bottom: 0 !important;
}

/* Newsletter CTA section */
.newsletter-cta-section,
#newsletterSection {
    margin: 1.75rem 0 1rem 0 !important;
    padding: 2.25rem 2rem !important;
}

/* Site footer top spacing */
.site-footer {
    margin-top: 0 !important;
    padding-top: 2rem !important;
}


/* ══════════════════════════════════════════════════════════════════
   22. ADMIN POST EDITOR (TINYMCE / CLASSIC EDITOR) OVERRIDES
   White writing canvas, dark legible typography, no yellow focus box
   ══════════════════════════════════════════════════════════════════ */
body.mce-content-body,
body#tinymce,
.editor-styles-wrapper {
    background-color: #ffffff !important;
    background: #ffffff !important;
    color: #222222 !important;
    padding: 20px 24px !important;
}

body.mce-content-body p,
body.mce-content-body h1,
body.mce-content-body h2,
body.mce-content-body h3,
body.mce-content-body h4,
body.mce-content-body h5,
body.mce-content-body h6,
body.mce-content-body li,
body.mce-content-body blockquote,
body.mce-content-body span,
body.mce-content-body div {
    color: #222222 !important;
}

body.mce-content-body *:focus,
body.mce-content-body *:focus-visible,
body.mce-content-body p:focus,
body.mce-content-body p:focus-visible,
body.mce-content-body h1:focus,
body.mce-content-body h1:focus-visible,
body.mce-content-body h2:focus,
body.mce-content-body h2:focus-visible,
body.mce-content-body h3:focus,
body.mce-content-body h3:focus-visible,
body.mce-content-body div:focus,
body.mce-content-body div:focus-visible,
body.mce-content-body li:focus,
body.mce-content-body li:focus-visible,
body.mce-content-body blockquote:focus,
body.mce-content-body blockquote:focus-visible {
    outline: none !important;
    outline-width: 0 !important;
    outline-color: transparent !important;
    box-shadow: none !important;
    border-color: transparent !important;
}

/* ══════════════════════════════════════════════════════════════════
   24. SIDEBAR CATEGORIES HIERARCHICAL DIRECTORY (4 PILLARS + SUB-TOPICS)
   Structured Pillar Cards with indented Sub-categories & Post Counts
   ══════════════════════════════════════════════════════════════════ */
.sidebar-column .wp-block-categories-list,
.widget-area .wp-block-categories-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 11px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Enforce strategic 4 Pillars order: Health -> Wealth -> Love -> Happiness -> Quiz */
.sidebar-column .wp-block-categories-list > li.cat-item-6  { order: 1 !important; }
.sidebar-column .wp-block-categories-list > li.cat-item-7  { order: 2 !important; }
.sidebar-column .wp-block-categories-list > li.cat-item-8  { order: 3 !important; }
.sidebar-column .wp-block-categories-list > li.cat-item-9  { order: 4 !important; }
.sidebar-column .wp-block-categories-list > li.cat-item-12 { order: 5 !important; }
.sidebar-column .wp-block-categories-list > li.cat-item    { order: 10; }

/* Parent Pillar Card */
.sidebar-column .wp-block-categories-list > li.cat-item {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: linear-gradient(145deg, #1d201f 0%, #181a19 100%) !important;
    border: 1px solid rgba(197, 160, 89, 0.22) !important;
    border-left: 3px solid #C5A059 !important;
    border-radius: 8px !important;
    padding: 11px 14px !important;
    margin: 0 !important;
    color: #9a9e9b !important;
    font-size: 0.78rem !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.sidebar-column .wp-block-categories-list > li.cat-item:hover {
    border-color: rgba(197, 160, 89, 0.48) !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.22) !important;
}

/* Parent Pillar Link */
.sidebar-column .wp-block-categories-list > li.cat-item > a {
    font-family: var(--font-heading, 'Lora', 'Playfair Display', serif) !important;
    font-size: 0.98rem !important;
    font-weight: 600 !important;
    color: #E5E3DC !important;
    text-decoration: none !important;
    letter-spacing: 0.01em !important;
    transition: color 0.2s ease !important;
}

.sidebar-column .wp-block-categories-list > li.cat-item > a:hover,
.sidebar-column .wp-block-categories-list > li.cat-item.current-cat > a,
.sidebar-column .wp-block-categories-list > li.cat-item.current-cat-parent > a {
    color: #C5A059 !important;
}

/* Children Sub-categories List */
.sidebar-column .wp-block-categories-list > li.cat-item > ul.children {
    flex: 0 0 100% !important;
    width: 100% !important;
    list-style: none !important;
    margin: 8px 0 0 0 !important;
    padding: 8px 0 2px 10px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
    border-left: 1px solid rgba(197, 160, 89, 0.25) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
}

/* Individual Sub-category Row */
.sidebar-column .wp-block-categories-list ul.children > li.cat-item {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 3px 4px !important;
    margin: 0 !important;
    font-size: 0.76rem !important;
    color: #8C9690 !important;
    border-radius: 4px !important;
    background: transparent !important;
    border: none !important;
}

.sidebar-column .wp-block-categories-list ul.children > li.cat-item > a {
    display: inline-flex !important;
    align-items: center !important;
    font-family: var(--font-body, 'Inter', sans-serif) !important;
    font-size: 0.85rem !important;
    font-weight: 400 !important;
    color: #b8c0bc !important;
    text-decoration: none !important;
    transition: color 0.18s ease, transform 0.18s ease !important;
}

.sidebar-column .wp-block-categories-list ul.children > li.cat-item > a::before {
    content: "\203A" !important;
    color: #C5A059 !important;
    font-weight: 600 !important;
    margin-right: 7px !important;
    font-size: 0.95rem !important;
    line-height: 1 !important;
}

.sidebar-column .wp-block-categories-list ul.children > li.cat-item > a:hover,
.sidebar-column .wp-block-categories-list ul.children > li.cat-item.current-cat > a {
    color: #C5A059 !important;
    transform: translateX(2px) !important;
}

.sidebar-column .wp-block-categories-list ul.children > li.cat-item.current-cat > a {
    font-weight: 600 !important;
}

/* Light Theme Adjustments for Sidebar Categories Directory */
html.light-theme .sidebar-column .wp-block-categories-list > li.cat-item,
body.light-theme .sidebar-column .wp-block-categories-list > li.cat-item {
    background: #FBF9F5 !important;
    border-color: rgba(184, 142, 62, 0.28) !important;
    border-left-color: #B88E3E !important;
    color: #6c726f !important;
}

html.light-theme .sidebar-column .wp-block-categories-list > li.cat-item > a,
body.light-theme .sidebar-column .wp-block-categories-list > li.cat-item > a {
    color: #2D312E !important;
}

html.light-theme .sidebar-column .wp-block-categories-list > li.cat-item > ul.children,
body.light-theme .sidebar-column .wp-block-categories-list > li.cat-item > ul.children {
    border-top-color: rgba(0, 0, 0, 0.06) !important;
    border-left-color: rgba(184, 142, 62, 0.3) !important;
}

html.light-theme .sidebar-column .wp-block-categories-list ul.children > li.cat-item > a,
body.light-theme .sidebar-column .wp-block-categories-list ul.children > li.cat-item > a {
    color: #4a504d !important;
}

html.light-theme .sidebar-column .wp-block-categories-list ul.children > li.cat-item > a:hover,
body.light-theme .sidebar-column .wp-block-categories-list ul.children > li.cat-item > a:hover {
    color: #B88E3E !important;
}

/* ══════════════════════════════════════════════════════════════════
   25. QUIZ, ARCHIVE & SINGLE POST HIGH-CONTRAST HARMONIZATION
       (100% Legible in Both Light Mode & Dark Mode)
   ══════════════════════════════════════════════════════════════════ */

/* 1. Light Mode Archive Cards & Masthead (/quiz/ & Category Pages) */
html.light-theme .archive-masthead,
body.light-theme .archive-masthead {
    background: #F4F1EA !important;
    border-bottom: 1px solid #E0DDD5 !important;
}

html.light-theme .archive-masthead .archive-title,
body.light-theme .archive-masthead .archive-title {
    color: #1A1D1C !important;
}

html.light-theme .archive-masthead .archive-desc,
body.light-theme .archive-masthead .archive-desc {
    color: #4A504D !important;
}

html.light-theme .archive-count-pill,
body.light-theme .archive-count-pill {
    background: #FFFFFF !important;
    border-color: #DCD7CE !important;
    color: #4A504D !important;
}

html.light-theme .archive-filter-bar,
body.light-theme .archive-filter-bar {
    border-top-color: #E0DDD5 !important;
}

html.light-theme .filter-label,
body.light-theme .filter-label {
    color: #555E59 !important;
}

html.light-theme .filter-pill,
body.light-theme .filter-pill {
    background: #FFFFFF !important;
    border: 1px solid #DCD7CE !important;
    color: #2D312E !important;
}

html.light-theme .filter-pill .pill-count,
body.light-theme .filter-pill .pill-count {
    color: #6A706D !important;
}

html.light-theme .filter-pill:hover,
html.light-theme .filter-pill.active,
body.light-theme .filter-pill:hover,
body.light-theme .filter-pill.active {
    background: #B88E3E !important;
    border-color: #B88E3E !important;
    color: #FFFFFF !important;
}

html.light-theme .filter-pill:hover .pill-count,
html.light-theme .filter-pill.active .pill-count,
body.light-theme .filter-pill:hover .pill-count,
body.light-theme .filter-pill.active .pill-count {
    color: #FFFFFF !important;
}

html.light-theme body .archive-post-card,
html body.light-theme .archive-post-card,
html.light-theme body .feed-layout-list .archive-post-card,
html body.light-theme .feed-layout-list .archive-post-card,
html.light-theme body .feed-layout-grid .archive-post-card,
html body.light-theme .feed-layout-grid .archive-post-card {
    background: #FFFFFF !important;
    border: 1px solid #E0DDD5 !important;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.05) !important;
}

html.light-theme body .archive-post-card .card-title,
html.light-theme body .archive-post-card .card-title a,
html body.light-theme .archive-post-card .card-title,
html body.light-theme .archive-post-card .card-title a {
    color: #1A1D1C !important;
}

html.light-theme body .archive-post-card .card-title a:hover,
html body.light-theme .archive-post-card .card-title a:hover {
    color: #B88E3E !important;
}

html.light-theme body .card-meta-top .card-date,
html body.light-theme .card-meta-top .card-date,
html.light-theme body .card-meta-footer .author-byline time,
html body.light-theme .card-meta-footer .author-byline time {
    color: #555E59 !important;
}

html.light-theme body .card-meta-top .card-read-time,
html body.light-theme .card-meta-top .card-read-time {
    display: none !important;
}

/* Light Theme Card Read Link */
html.light-theme body .card-read-link,
html.light-theme body .card-read-link span,
html body.light-theme .card-read-link,
html body.light-theme .card-read-link span {
    color: #8C651E !important;
}

html.light-theme body .card-read-link svg,
html body.light-theme .card-read-link svg {
    stroke: #8C651E !important;
}

html.light-theme body .card-meta-footer,
html body.light-theme .card-meta-footer {
    border-top-color: rgba(0, 0, 0, 0.08) !important;
}

/* 2. Light & Dark Mode Blockquotes, Author Box, and Sidebar Sanctuary Cards */
html.light-theme .entry-content blockquote,
html.light-theme .article-body blockquote,
body.light-theme .entry-content blockquote,
body.light-theme .article-body blockquote,
html.light-theme .entry-content blockquote p,
html.light-theme .article-body blockquote p,
body.light-theme .entry-content blockquote p,
body.light-theme .article-body blockquote p {
    color: #2D312E !important;
    background: rgba(184, 142, 62, 0.08) !important;
    border-left-color: #B88E3E !important;
}

html.light-theme .author-box,
body.light-theme .author-box {
    background: #F4F1EA !important;
    border: 1px solid #DCD7CE !important;
}

html.light-theme .author-box-name a,
body.light-theme .author-box-name a {
    color: #1A1D1C !important;
}

html.light-theme .author-box-bio,
body.light-theme .author-box-bio {
    color: #383B39 !important;
}

html.light-theme .author-box-label,
body.light-theme .author-box-label,
html.light-theme .author-box-link,
body.light-theme .author-box-link {
    color: #8C651E !important;
}

html.light-theme .sanctuary-sidebar-card,
body.light-theme .sanctuary-sidebar-card {
    background: linear-gradient(145deg, #FBF9F5 0%, #F2EDE2 100%) !important;
    border-color: rgba(184, 142, 62, 0.38) !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04) !important;
}

html.light-theme .sanctuary-card-title,
body.light-theme .sanctuary-card-title {
    color: #1A1D1C !important;
}

html.light-theme .sanctuary-card-desc,
body.light-theme .sanctuary-card-desc {
    color: #4A504D !important;
}

html.light-theme .sanctuary-card-kicker,
body.light-theme .sanctuary-card-kicker,
html.light-theme .sanctuary-card-link,
body.light-theme .sanctuary-card-link {
    color: #8C651E !important;
}

html.light-theme .sanctuary-quiz-btn,
body.light-theme .sanctuary-quiz-btn {
    background: linear-gradient(135deg, #C5A059, #A67D2E) !important;
    color: #FFFFFF !important;
}

/* 3. Quiz Page Lead Text (/burnout-quiz/) */
.unrushed-quiz-page-lead {
    text-align: center !important;
    font-style: italic !important;
    color: #D4AF37 !important;
    margin-bottom: 24px !important;
    font-size: 1.1rem !important;
}

html.light-theme .unrushed-quiz-page-lead,
body.light-theme .unrushed-quiz-page-lead {
    color: #7A5614 !important;
}


/* ==========================================================================
   26. MOBILE ARTICLE RESPONSIVE & LAYOUT OVERFLOW SANCTUARY FIX
   ========================================================================== */
@media (max-width: 1024px) {
    html:root body .article-layout,
    html body .article-layout {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 2rem !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
}

@media (max-width: 768px) {
    html, body {
        overflow-x: hidden !important;
    }

    /* 1. Remove double gutters on mobile single posts */
    body.single .site-content,
    html:root body.single .site-content,
    html body.single .site-content {
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 2. Hero container mobile breathing room */
    html:root body .single-article .article-hero,
    html body .single-article .article-hero {
        padding-left: 16px !important;
        padding-right: 16px !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 3. Article Layout & Body: true 100% width with 16px safe gutters */
    html:root body .article-layout,
    html body .article-layout {
        grid-template-columns: minmax(0, 1fr) !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
        margin: 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    html:root body .article-body-wrapper,
    html body .article-body-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    html:root body .article-body,
    html body .article-body {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }

    /* 4. Sidebar & Search block: prevent rigid minimum content width blow-out */
    .sidebar-column,
    .sidebar-widget,
    .wp-block-search,
    .wp-block-search__inside-wrapper {
        max-width: 100% !important;
        min-width: 0 !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .wp-block-search__input {
        min-width: 0 !important;
        flex: 1 1 auto !important;
        width: 0 !important;
        box-sizing: border-box !important;
    }

    /* 5. Responsive Tables (Touch-friendly horizontal scroll) */
    .unrushed-table-responsive,
    .wp-block-table {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        margin: 1.5rem 0 !important;
        box-sizing: border-box !important;
    }

    table,
    .sanctuary-diagnostic-table {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        border-collapse: collapse !important;
        box-sizing: border-box !important;
    }

    table th,
    table td {
        white-space: normal !important;
        min-width: 120px !important;
    }

    /* 6. Table of Contents (TOC) Mobile Card */
    .unrushed-toc-card {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 16px 18px !important;
        margin: 20px 0 28px 0 !important;
    }

    .unrushed-toc-header {
        flex-wrap: wrap !important;
        gap: 8px !important;
    }

    .unrushed-toc-header p {
        margin: 0 !important;
        display: inline-flex !important;
    }

    .unrushed-toc-heading {
        font-size: 15px !important;
    }

    .unrushed-toc-link {
        word-break: break-word !important;
    }

    /* 7. Takeaways card, share deck & author box */
    .article-takeaways-card,
    .article-bottom-share-deck,
    .author-box,
    .post-navigation-deck {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
}

/* ==========================================================================
   QUIZ ARCHIVE: INSTANT FILTERING & RESPONSIVE SUBCATEGORIES WRAP
   ========================================================================== */
html body .archive-post-card.is-filtered-out,
html body .feed-layout-list .archive-post-card.is-filtered-out,
html body .feed-layout-grid .archive-post-card.is-filtered-out,
html body .grid-3-col .archive-post-card.is-filtered-out,
html body .grid-2-col .archive-post-card.is-filtered-out {
    display: none !important;
}

html body .archive-filter-bar.quiz-filter-bar {
    display: flex !important;
    align-items: flex-start !important;
    flex-wrap: wrap !important;
    gap: 0.85rem !important;
    margin-top: 1.25rem !important;
    padding-top: 1.25rem !important;
    border-top: 1px solid rgba(197, 160, 89, 0.2) !important;
    overflow: visible !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

html body .quiz-filter-bar .filter-pills-track {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 0.55rem !important;
    overflow: visible !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
}

@media (max-width: 768px) {
    html body .archive-filter-bar.quiz-filter-bar {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 0.75rem !important;
        padding-top: 1rem !important;
        margin-top: 1rem !important;
    }
    html body .quiz-filter-bar .filter-pills-track {
        gap: 0.45rem !important;
        width: 100% !important;
    }
}