/* RankwellPress bundle: theme-core */

/* --- base/_reset.css --- */
/* =========================================================
 * RankwellPress — Base Reset 
 * ========================================================= */

/* Box sizing rules */
*,
*::before,
*::after {
    box-sizing: border-box;
}

/* Remove default margin & padding */
body, h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd, ul, ol {
    margin: 0;
    padding: 0;
}

/* Set core root defaults */
html:focus-within {
    scroll-behavior: smooth;
}

/* Add base line-height for better readability */
body {
    min-height: 100vh;
    text-rendering: optimizeSpeed;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.5;
    background-color: var(--rw-bg-body, #f7f8fa);
}

/* ==========================================
 * UPGRADED: Global Link Reset
 * ========================================== */
a {
    text-decoration: none;
    color: inherit;
    background-color: transparent;
}

/* ADDED: Ensure keyboard focus visibility */
a:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
    text-decoration-skip-ink: auto;
}

/* Make images easier to work with */
img, picture, svg, video, canvas {
    max-width: 100%;
    height: auto;
    display: block;
    vertical-align: middle;
}

/* Inherit fonts for inputs and buttons */
input, button, textarea, select {
    font: inherit;
    color: inherit;
}

/* ADDED: Remove list styles */
ul, ol {
    list-style: none;
}

/* ADDED: Reset table borders */
table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* =========================================================
 * RANKWELLPRESS WIDGET SHIELD
 * ========================================================= */
.rankwellpress-shortcode-widget-wrapper a,
.rankwellpress-shortcode-widget-wrapper a:visited,
.rankwellpress-shortcode-widget-wrapper a:hover,
.rankwellpress-shortcode-widget-wrapper a:focus,
.rankwellpress-shortcode-widget-wrapper a:active {
    text-decoration: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
    background-image: none !important;
    outline-color: transparent;
}

/* ADDED: Remove button default styles */
button {
    border: none;
    background: none;
    cursor: pointer;
    padding: 0;
}

/* Accessibility: Remove animations for those who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
    html:focus-within {
        scroll-behavior: auto;
    }
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}


/* ─────────────────────────────────────────────────────────
   Skip to Content — Accessibility
   Hidden by default, visible on keyboard focus.
   ───────────────────────────────────────────────────────── */

.rwp-skip-link {
    position: absolute;
    top: -100px;
    left: 0;
    z-index: 100000;
    padding: 12px 20px;
    background: #0d7c3e;
    color: #ffffff;
    font-weight: 600;
    font-size: 16px;
    line-height: 1;
    text-decoration: none;
    border-radius: 0 0 6px 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    transition: top 0.2s ease, outline 0.2s ease;
}

.rwp-skip-link:focus,
.rwp-skip-link:focus-visible {
    top: 0;
    color: #ffffff;
    outline: 3px solid #ffffff;
    outline-offset: 2px;
}

/* Ensure the main target has no visible outline when jumped to */
#rwp-main:focus {
    outline: none;
}

.rwp-skip-link.screen-reader-text:focus,
.rwp-skip-link.screen-reader-text:focus-visible {
    position: absolute;
    top: 0;
    left: 0;
    width: auto;
    height: auto;
    clip: auto;
    clip-path: none;
    font-size: 16px;
    line-height: 1;
}



/* --- base/_typography.css --- */
/* =========================================================
 * RankwellPress — Base Typography & WordPress Core Classes
 * ========================================================= */

body {
    font-family: var(--rw-font-primary, 'Lexend', system-ui, -apple-system, sans-serif);
    font-size: var(--rw-body-size, 1rem);
    line-height: var(--rw-body-lh, 1.6);
    color: var(--rw-text-body, #4b5563);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

/* Headings scale — WIRED TO: Global Headings (H1-H6) from DynamicCSS */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--rw-font-primary, 'Lexend', system-ui, -apple-system, sans-serif);
    color: var(--rw-text-heading, #111827);
    line-height: 1.2;
    font-weight: var(--rw-heading-weight, 700);
    margin-bottom: var(--rw-space-3, 0.75rem);
    letter-spacing: -0.01em;
    word-break: normal;
    overflow-wrap: normal;
    hyphens: none;
    -webkit-hyphens: none;
}

h1 { font-size: var(--rw-h1-size, 36px); }
h2 { font-size: var(--rw-h2-size, 30px); }
h3 { font-size: var(--rw-h3-size, 24px); }
h4 { font-size: 1.25rem; }
h5 { font-size: 1.125rem; }
h6 { font-size: 1rem; }

p {
    margin-bottom: var(--rw-space-3, 0.75rem);
}

/* =========================================================
 * GLOBAL LINK COLORS — one color everywhere
 * Uses primary brand color for consistency.
 * :link / :visited explicit to beat user-agent defaults.
 * ========================================================= */
a:link,
a:visited {
    color: var(--rw-color-primary, #0d7c3e);
    text-decoration: none;
    transition: color 0.2s ease;
}

a:hover,
a:focus,
a:focus-visible {
    color: var(--rw-color-accent, #0f1e33);
}

/* External links — same color as internal, no special case */
a[target="_blank"]:link,
a[target="_blank"]:visited {
    color: var(--rw-color-primary, #0d7c3e);
}

a[target="_blank"]:hover,
a[target="_blank"]:focus-visible {
    color: var(--rw-color-accent, #0f1e33);
}

/* Screen reader utility */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
}

/* Skip link — becomes visible on keyboard focus */
.screen-reader-text:focus {
    background-color: #ffffff;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    clip-path: none;
    color: #0d7c3e;
    display: block;
    font-size: 14px;
    font-weight: 700;
    height: auto;
    left: 6px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 6px;
    width: auto;
    z-index: 100000;
}

.skip-link:focus {
    outline: 2px solid #0d7c3e;
    outline-offset: 2px;
}

/* Dark mode variant (optional but recommended) */
html[data-theme="dark"] .screen-reader-text:focus {
    background-color: #1f2937;
    color: #34d399;
}

/* =========================================================
 * Post Meta — Refined spacing
 * ========================================================= */
.post-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 15px;
    font-size: 0.85rem;
    color: var(--rw-text-muted, #6b7280);
    margin-top: 10px;
    margin-bottom: 10px;
}

.post-meta span, 
.post-meta a,
.post-meta .meta-date,
.post-meta .meta-author,
.post-meta .meta-comments,
.post-meta .post-date,
.post-meta .post-author {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--rw-text-muted, #6b7280);
    text-decoration: none;
    transition: color 0.2s ease;
    white-space: nowrap;
}

.post-meta a:hover {
    color: var(--rw-color-primary, #0d7c3e);
}

.post-meta svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    color: var(--rw-color-primary, #0d7c3e);
}

/* =========================================================
 * GLOBAL CATEGORY BADGE — Clean flat rectangle
 * Wired to: Badge Background & Text from DynamicCSS
 * ========================================================= */

.cat-badge {
    display: inline-block;
    background-color: var(--rw-badge-bg, #c92525);
    color: var(--rw-badge-text, #ffffff) !important;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    line-height: 1;
    padding: 5px 10px;
    text-decoration: none;
    border: none;
    border-radius: 3px;
    transition: opacity 0.15s ease;
}

.cat-badge:hover {
    opacity: 0.85;
    color: var(--rw-badge-text, #ffffff) !important;
}

.post-category a {
    color: var(--rw-color-primary, #0d7c3e);
    font-weight: 600;
    text-decoration: none;
}

.post-category a:hover {
    text-decoration: underline;
}

/* =========================================================
 * WordPress CORE CLASSES
 * ========================================================= */
.wp-caption {
    max-width: 100%;
    margin-bottom: var(--rw-space-3, 0.75rem);
}

.wp-caption img {
    display: block;
    max-width: 100%;
    height: auto;
}

.wp-caption-text {
    font-size: 0.85rem;
    color: var(--rw-text-muted, #6b7280);
    text-align: left;
    margin-top: 8px;
    font-style: italic;
    padding: 8px 12px 8px 16px;
    background: var(--rw-bg-alt, #f3f4f6);
    border-left: 4px solid var(--rw-color-primary, #0d7c3e);
}

.sticky {
    display: block;
}

.gallery-caption {
    font-size: 0.85rem;
    color: var(--rw-text-muted, #6b7280);
    text-align: center;
    margin-top: 8px;
}

.bypostauthor {
    display: block;
}

/* =========================================================
 * Responsive
 * ========================================================= */
@media (max-width: 767px) {
    .post-meta {
        gap: 10px;
        font-size: 0.8rem;
    }
    
    h1 { font-size: var(--rw-h1-size, 26px); }
    h2 { font-size: var(--rw-h2-size, 18px); }
    h3 { font-size: var(--rw-h3-size, 20px); }
}

/* =========================================================
 * ARTICLE CONTENT LINKS
 * All links (internal + external) use primary brand color.
 * :link / :visited explicit to beat user-agent defaults.
 * ========================================================= */

.post-content a:link,
.post-content a:visited,
.entry-content a:link,
.entry-content a:visited,
.single-content a:link,
.single-content a:visited,
.rankwellpress-single-content a:link,
.rankwellpress-single-content a:visited,
.rwp-article-body a:link,
.rwp-article-body a:visited {
    color: var(--rw-color-primary, #0d7c3e);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    text-decoration-color: currentColor;
    transition: color 0.15s ease, text-decoration-color 0.15s ease, text-decoration-thickness 0.15s ease;
}

.post-content a:hover,
.post-content a:focus-visible,
.entry-content a:hover,
.entry-content a:focus-visible,
.single-content a:hover,
.single-content a:focus-visible,
.rankwellpress-single-content a:hover,
.rankwellpress-single-content a:focus-visible,
.rwp-article-body a:hover,
.rwp-article-body a:focus-visible {
    color: var(--rw-color-accent, #0f1e33);
    text-decoration-thickness: 2px;
    text-decoration-color: currentColor;
}

/* External links — same color, no special case */
.post-content a[target="_blank"]:link,
.post-content a[target="_blank"]:visited,
.entry-content a[target="_blank"]:link,
.entry-content a[target="_blank"]:visited,
.single-content a[target="_blank"]:link,
.single-content a[target="_blank"]:visited,
.rankwellpress-single-content a[target="_blank"]:link,
.rankwellpress-single-content a[target="_blank"]:visited,
.rwp-article-body a[target="_blank"]:link,
.rwp-article-body a[target="_blank"]:visited {
    color: var(--rw-color-primary, #0d7c3e);
}

.post-content a[target="_blank"]:hover,
.post-content a[target="_blank"]:focus-visible,
.entry-content a[target="_blank"]:hover,
.entry-content a[target="_blank"]:focus-visible,
.single-content a[target="_blank"]:hover,
.single-content a[target="_blank"]:focus-visible,
.rankwellpress-single-content a[target="_blank"]:hover,
.rankwellpress-single-content a[target="_blank"]:focus-visible,
.rwp-article-body a[target="_blank"]:hover,
.rwp-article-body a[target="_blank"]:focus-visible {
    color: var(--rw-color-accent, #0f1e33);
}

/* External link indicator arrow (kept — only affects ::after) */
.post-content a[target="_blank"]::after,
.entry-content a[target="_blank"]::after,
.single-content a[target="_blank"]::after,
.rankwellpress-single-content a[target="_blank"]::after,
.rwp-article-body a[target="_blank"]::after {
    content: "↗";
    display: inline-block;
    font-size: 0.75em;
    line-height: 1;
    margin-left: 2px;
    opacity: 0.7;
    text-decoration: none;
    transform: translateY(-1px);
}

/* =========================================================
 * DARK MODE — link colors
 * Links follow the primary color which is #ffffff in dark mode.
 * Override here if you want a specific link color.
 * ========================================================= */
html[data-theme="dark"] .post-content a:link,
html[data-theme="dark"] .post-content a:visited,
html[data-theme="dark"] .entry-content a:link,
html[data-theme="dark"] .entry-content a:visited,
html[data-theme="dark"] .single-content a:link,
html[data-theme="dark"] .single-content a:visited,
html[data-theme="dark"] .rankwellpress-single-content a:link,
html[data-theme="dark"] .rankwellpress-single-content a:visited,
html[data-theme="dark"] .rwp-article-body a:link,
html[data-theme="dark"] .rwp-article-body a:visited {
    color: #34d399;
}

html[data-theme="dark"] .post-content a:hover,
html[data-theme="dark"] .post-content a:focus-visible,
html[data-theme="dark"] .entry-content a:hover,
html[data-theme="dark"] .entry-content a:focus-visible,
html[data-theme="dark"] .single-content a:hover,
html[data-theme="dark"] .single-content a:focus-visible,
html[data-theme="dark"] .rankwellpress-single-content a:hover,
html[data-theme="dark"] .rankwellpress-single-content a:focus-visible,
html[data-theme="dark"] .rwp-article-body a:hover,
html[data-theme="dark"] .rwp-article-body a:focus-visible {
    color: #6ee7b7;
}

html[data-theme="dark"] .post-content a[target="_blank"]:link,
html[data-theme="dark"] .post-content a[target="_blank"]:visited,
html[data-theme="dark"] .entry-content a[target="_blank"]:link,
html[data-theme="dark"] .entry-content a[target="_blank"]:visited,
html[data-theme="dark"] .single-content a[target="_blank"]:link,
html[data-theme="dark"] .single-content a[target="_blank"]:visited,
html[data-theme="dark"] .rankwellpress-single-content a[target="_blank"]:link,
html[data-theme="dark"] .rankwellpress-single-content a[target="_blank"]:visited,
html[data-theme="dark"] .rwp-article-body a[target="_blank"]:link,
html[data-theme="dark"] .rwp-article-body a[target="_blank"]:visited {
    color: #34d399;
}

html[data-theme="dark"] .post-content a[target="_blank"]:hover,
html[data-theme="dark"] .entry-content a[target="_blank"]:hover,
html[data-theme="dark"] .single-content a[target="_blank"]:hover,
html[data-theme="dark"] .rankwellpress-single-content a[target="_blank"]:hover,
html[data-theme="dark"] .rwp-article-body a[target="_blank"]:hover {
    color: #6ee7b7;
}

/* --- layout.css --- */
/* =========================================================
 * RankwellPress — Complete Layout Styles v3.4.0
 * Footer + Grid + Sidebar + Dark Mode + Alignment + Ads
 * + Premium widget containment (sidebar + footer)
 * ========================================================= */


/* ============================================
 * 0. GLOBAL RESET — AdSense-safe
 * ============================================ */

*,
*::before,
*::after {
    box-sizing: border-box;
}

body,
h1, h2, h3, h4, h5, h6,
p, blockquote, pre,
ul, ol, dl, dd, figure,
hr, fieldset, legend,
button, input, textarea, select {
    margin: 0;
    padding: 0;
}

html {
    overflow-x: hidden;
    width: 100%;
}

body {
    width: 100%;
    position: relative;
    overflow-x: clip;
}

body > ins.adsbygoogle,
body > .adsbygoogle,
body > iframe[id^="aswift"] {
    position: relative;
    z-index: 2147483646;
}

body.rwp-no-sticky-header .rwp-header {
    position: static !important;
    top: auto !important;
}


/* ============================================
 * 1. FOOTER STYLES — Region-Based
 * ============================================ */

.rwp-footer {
    background-color: var(--rw-footer-bg, #0f1e33);
    color: var(--rw-footer-text, #9ca3af);
    margin-top: auto;
    width: 100%;
}

.rwp-footer-region {
    width: 100%;
}

.rwp-footer-heading {
    color: var(--rw-footer-heading, #ffffff);
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-align: center;
    margin: 0 0 calc(var(--rw-space-5, 1.5rem) * 0.5);
    padding: 0;
}

/* ── 1a. Widget Columns ─────────────────────────── */
.rwp-footer-widgets {
    padding-top: calc(var(--rw-space-8, 3rem) * 0.75);
    padding-bottom: calc(var(--rw-space-6, 2rem) * 0.75);
}

.rwp-footer-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: calc(var(--rw-space-5, 1.5rem) * 0.75);
    min-width: 0;
}

.rwp-footer-grid.rwp-columns-1 { grid-template-columns: 1fr; }
.rwp-footer-grid.rwp-columns-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.rwp-footer-grid > * {
    min-width: 0;
    max-width: 100%;
}

@media (max-width: 640px) {
    .rwp-footer-grid.rwp-columns-2 { grid-template-columns: 1fr; }
}

/* ── 1b. Widget Background — Inherit Footer ─────── */
.rwp-footer .widget {
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 0 calc(var(--rw-space-5, 1.5rem) * 0.75) 0;
    color: inherit;
    font-size: inherit;
    min-width: 0;
    max-width: 100%;
}

.rwp-footer .widget-title,
.rwp-footer .widgettitle,
.rwp-footer h2.widget-title,
.rwp-footer h3.widget-title,
.rwp-footer h4.widget-title {
    color: var(--rw-footer-heading, #ffffff);
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-align: left;
    margin: 0 0 calc(var(--rw-space-4, 1rem) * 0.75);
    padding: 0 0 calc(var(--rw-space-2, 0.5rem) * 0.5);
    border: none;
    position: relative;
}

.rwp-footer .widget-title::after,
.rwp-footer .widgettitle::after {
    display: none !important;
}

.rwp-footer .widget ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.rwp-footer .widget ul li {
    color: var(--rw-footer-text, #9ca3af);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    padding: calc(var(--rw-space-2, 0.5rem) * 0.5) 0;
    margin: 0;
    display: block;
}

.rwp-footer .widget ul li:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.rwp-footer .widget a,
.rwp-footer .widget a:visited {
    color: var(--rw-footer-text, #9ca3af);
    text-decoration: none;
    transition: color 0.2s ease;
}

.rwp-footer .widget a:hover,
.rwp-footer .widget a:focus {
    color: var(--rw-footer-heading, #ffffff);
    text-decoration: none;
}

.rwp-footer .widget p,
.rwp-footer .widget span,
.rwp-footer .widget div,
.rwp-footer .widget label,
.rwp-footer .widget li {
    color: var(--rw-footer-text, #9ca3af);
}

.rwp-footer .widget h1,
.rwp-footer .widget h2,
.rwp-footer .widget h3,
.rwp-footer .widget h4,
.rwp-footer .widget h5,
.rwp-footer .widget h6 {
    color: var(--rw-footer-heading, #ffffff);
}

.rwp-footer .widget img {
    max-width: 100%;
    height: auto;
    opacity: 1;
}

.rwp-footer .widget input[type="text"],
.rwp-footer .widget input[type="email"],
.rwp-footer .widget input[type="search"],
.rwp-footer .widget input[type="url"],
.rwp-footer .widget textarea,
.rwp-footer .widget select {
    background-color: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--rw-footer-heading, #ffffff);
    padding: 8px 12px;
    border-radius: 4px;
    width: 100%;
    box-sizing: border-box;
}

.rwp-footer .widget input::placeholder,
.rwp-footer .widget textarea::placeholder {
    color: var(--rw-footer-text, #9ca3af);
    opacity: 0.7;
}

.rwp-footer .widget input:focus,
.rwp-footer .widget textarea:focus,
.rwp-footer .widget select:focus {
    outline: none;
    border-color: var(--rw-footer-accent, #0d7c3e);
    background-color: rgba(255, 255, 255, 0.08);
}

.rwp-footer .widget button,
.rwp-footer .widget input[type="submit"],
.rwp-footer .widget .button {
    background-color: var(--rw-footer-accent, #0d7c3e);
    color: #ffffff;
    border: none;
    padding: 8px 16px;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
    transition: background-color 0.2s ease;
}

.rwp-footer .widget button:hover,
.rwp-footer .widget input[type="submit"]:hover,
.rwp-footer .widget .button:hover {
    background-color: color-mix(in srgb, var(--rw-footer-accent, #0d7c3e) 85%, black);
}

.rwp-footer .widget .tagcloud a,
.rwp-footer .widget .cat-item a,
.rwp-footer .widget .wp-tag-cloud a {
    display: inline-block;
    padding: 4px 10px;
    margin: 2px;
    background-color: rgba(255, 255, 255, 0.05);
    border-radius: 4px;
    font-size: 0.85rem !important;
}

.rwp-footer .widget .tagcloud a:hover,
.rwp-footer .widget .cat-item a:hover {
    background-color: var(--rw-footer-accent, #0d7c3e);
    color: #ffffff;
}

.rwp-footer .widget .recentcomments,
.rwp-footer .widget .rpwwt-widget li,
.rwp-footer .widget ul li {
    background: transparent !important;
    border-left: none !important;
    padding-left: 0 !important;
}

/* Don't apply the footer ul li border styling inside premium cards */
.rwp-footer .rwp-premium-trending__card ul,
.rwp-footer .rwp-premium-related__card ul,
.rwp-footer-widgets .rwp-premium-trending__card ul,
.rwp-footer-widgets .rwp-premium-related__card ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.rwp-footer .rwp-premium-trending__card ul li,
.rwp-footer .rwp-premium-related__card ul li,
.rwp-footer-widgets .rwp-premium-trending__card ul li,
.rwp-footer-widgets .rwp-premium-related__card ul li {
    border-bottom: none !important;
    padding: 0 !important;
    margin: 0;
}

.rwp-footer .widget.widget_search form {
    display: flex;
    gap: 8px;
}

.rwp-footer .widget.widget_search input[type="search"] {
    flex: 1;
}

.rwp-footer .widget_calendar table {
    width: 100%;
    border-collapse: collapse;
}

.rwp-footer .widget_calendar th,
.rwp-footer .widget_calendar td {
    color: var(--rw-footer-text, #9ca3af);
    padding: 4px;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.rwp-footer .widget_calendar caption {
    color: var(--rw-footer-heading, #ffffff);
    margin-bottom: 8px;
    font-weight: 600;
}

/* ── 1c. Brand Block ────────────────────────────── */
.rwp-footer-brand {
    padding: calc(var(--rw-space-7, 2.5rem) * 0.75) 0;
    text-align: center;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.rwp-footer-brand-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
}

.rwp-footer-brand-logo {
    display: inline-block;
    text-decoration: none;
    line-height: 0;
}

.rwp-footer-brand-logo img {
    display: block;
    max-height: 60px;
    max-width: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    margin: 0 auto;
    opacity: 1;
}

@media (max-width: 640px) {
    .rwp-footer-brand-logo img {
        max-height: 44px;
    }
}

/* ── 1d. About Us ───────────────────────────────── */
.rwp-footer-about {
    padding: calc(var(--rw-space-7, 2.5rem) * 0.75) 0;
    text-align: center;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.rwp-footer-about-text {
    color: var(--rw-footer-text, #9ca3af);
    font-size: 0.95rem;
    line-height: 1.7;
    max-width: 640px;
    margin: 0 auto;
    text-align: center;
}

.rwp-footer-about-contact {
    color: var(--rw-footer-text, #9ca3af);
    font-size: 0.95rem;
    line-height: 1.7;
    margin: calc(var(--rw-space-4, 1rem) * 0.75) auto 0;
    text-align: center;
}

.rwp-footer-about-contact a {
    color: var(--rw-footer-heading, #ffffff);
    text-decoration: none;
    border-bottom: 1px solid var(--rw-footer-accent, #0d7c3e);
    transition: border-color 0.2s ease, color 0.2s ease;
}

.rwp-footer-about-contact a:hover {
    color: var(--rw-footer-accent, #0d7c3e);
    border-bottom-color: var(--rw-footer-heading, #ffffff);
}

/* ── 1e. Follow Us ──────────────────────────────── */
.rwp-footer-follow {
    padding: calc(var(--rw-space-7, 2.5rem) * 0.75) 0;
    text-align: center;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.rwp-footer-social-links {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: calc(var(--rw-space-3, 0.75rem) * 0.75);
    margin: 0;
    padding: 0;
}

.rwp-footer-follow .rwp-social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 0;
    color: #ffffff;
    text-decoration: none;
    transition: transform 0.2s ease, filter 0.2s ease;
    background-color: rgba(255, 255, 255, 0.08);
}

.rwp-footer-follow .rwp-social-facebook  { background-color: #1877F2; }
.rwp-footer-follow .rwp-social-twitter   { background-color: #000000; }
.rwp-footer-follow .rwp-social-instagram { background-color: #E1306C; }
.rwp-footer-follow .rwp-social-youtube   { background-color: #FF0000; }
.rwp-footer-follow .rwp-social-linkedin  { background-color: #0A66C2; }
.rwp-footer-follow .rwp-social-whatsapp  { background-color: #25D366; }
.rwp-footer-follow .rwp-social-telegram  { background-color: #0088CC; }
.rwp-footer-follow .rwp-social-tiktok    { background-color: #000000; }
.rwp-footer-follow .rwp-social-pinterest { background-color: #BD081C; }
.rwp-footer-follow .rwp-social-reddit    { background-color: #FF4500; }

.rwp-footer-follow .rwp-social-icon:hover {
    transform: translateY(-2px);
    filter: brightness(1.1);
}

.rwp-footer-follow .rwp-social-icon svg {
    width: 22px;
    height: 22px;
    fill: currentColor;
}

@media (max-width: 480px) {
    .rwp-footer-follow .rwp-social-icon {
        width: 44px;
        height: 44px;
    }
    .rwp-footer-follow .rwp-social-icon svg {
        width: 20px;
        height: 20px;
    }
}


/* ============================================
   1f. MENU STRIP + BOTTOM BAR
   ============================================ */

.rwp-footer-menu-strip {
    width: 100%;
    box-sizing: border-box;
    background-color: transparent;
    background-image: none;
    text-align: center;
    margin: 0;
    padding: calc(var(--rw-space-5, 1.5rem) * 0.75) 0;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.rwp-footer-menu-strip .rwp-container {
    padding-top: 0;
    padding-bottom: 0;
}

.rwp-footer-menu-strip .rwp-footer-menu-container {
    display: block;
    width: 100%;
    text-align: center;
}

.rwp-footer-menu-strip .rwp-footer-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: calc(var(--rw-space-4, 1rem) * 0.85);
    list-style: none;
    padding: 0;
    margin: 0;
}

.rwp-footer-menu-strip .rwp-footer-menu li {
    margin: 0;
    padding: 0;
}

.rwp-footer-menu-strip .rwp-footer-menu a {
    color: var(--rw-footer-text, #9ca3af);
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 500;
    transition: color 0.2s ease;
    opacity: 0.9;
}

.rwp-footer-menu-strip .rwp-footer-menu a:hover {
    color: var(--rw-footer-heading, #ffffff);
    text-decoration: underline;
    text-underline-offset: 4px;
    opacity: 1;
}

/* ── Bottom bar — green copyright strip ─────────── */
.rwp-footer-bottom {
    width: 100%;
    box-sizing: border-box;
    background-color: var(--rw-footer-bottom-bg, #0d7c3e);
    text-align: center;
    margin: 0;
    border: none;
}

.rwp-footer-bottom .rwp-container {
    padding-top: calc(var(--rw-space-4, 1rem) * 1.25);
    padding-bottom: calc(var(--rw-space-4, 1rem) * 1.25);
}

/* ── Single unified bottom bar layout ── */
.rwp-footer-bottom-inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    color: var(--rw-footer-bottom-text-color, #ffffff);
    font-size: 0.875rem;
    font-weight: 500;
    letter-spacing: 0.3px;
    width: 100%;
    margin: 0 auto;
}

.rwp-copyright {
    margin: 0;
    color: inherit;
    text-align: left;
    line-height: 1.5;
    word-break: break-word;
}

.rwp-copyright a,
.rwp-copyright a:link,
.rwp-copyright a:visited,
.rwp-copyright a:active,
.rwp-copyright a:focus {
    color: #ffffff !important;
    background-color: transparent !important;
    text-decoration: none !important;
    font-weight: 700 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5) !important;
    opacity: 1 !important;
}

.rwp-copyright a:hover,
.rwp-copyright a:focus-visible {
    color: #ffffff !important;
    border-bottom-color: #ffffff !important;
    outline: 2px solid rgba(255, 255, 255, 0.7);
    outline-offset: 2px;
    border-radius: 2px;
}

/* ── Credit block (single instance) ── */
.rwp-footer-credit {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: var(--rw-footer-bottom-text-color, #ffffff);
    font-size: 0.9em;
    line-height: 1.4;
    text-align: right;
    white-space: nowrap;
}

.rwp-footer-credit a,
.rwp-footer-credit a:link,
.rwp-footer-credit a:visited {
    color: var(--rw-footer-bottom-text-color, #ffffff) !important;
    text-decoration: none;
    font-weight: 600;
    opacity: 0.9;
    transition: opacity 0.2s ease, text-decoration 0.2s ease;
}

.rwp-footer-credit a:hover,
.rwp-footer-credit a:focus,
.rwp-footer-credit a:focus-visible {
    color: var(--rw-footer-bottom-text-color, #ffffff) !important;
    opacity: 1;
    text-decoration: underline;
    outline: 2px solid currentColor;
    outline-offset: 2px;
    border-radius: 2px;
}

/* Mobile adjustments */
@media (max-width: 767px) {
    .rwp-footer-menu-strip {
        padding: calc(var(--rw-space-5, 1.5rem) * 0.5) 0;
    }
    .rwp-footer-menu-strip .rwp-footer-menu {
        gap: calc(var(--rw-space-4, 1rem) * 0.5);
    }
    .rwp-footer-menu-strip .rwp-footer-menu a {
        font-size: 0.8125rem;
    }

    .rwp-footer-bottom-inner {
        flex-direction: column;
        text-align: center;
        gap: 6px;
        font-size: 0.8125rem;
    }

    .rwp-copyright {
        text-align: center;
    }

    .rwp-footer-credit {
        text-align: center;
        white-space: normal;
    }
}

/* ── 1g. Legacy footer classes ──────────────────── */
.rwp-footer-social-nav {
    background-color: transparent;
    padding: calc(var(--rw-space-5, 1.5rem) * 0.5) 0;
    text-align: center;
    margin: 0;
    border: none;
}

.rwp-footer-social-nav .rwp-footer-social-links {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: calc(var(--rw-space-3, 0.75rem) * 0.5);
    margin-bottom: calc(var(--rw-space-4, 1rem) * 0.5);
    padding: 0;
}

.rwp-footer-social-nav .rwp-social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 0;
    color: #ffffff;
    text-decoration: none;
    transition: all 0.3s ease;
    background-color: rgba(255, 255, 255, 0.1);
}

.rwp-footer-social-nav .rwp-footer-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: calc(var(--rw-space-4, 1rem) * 0.5);
    list-style: none;
    padding: 0;
    margin: 0;
}

.rwp-footer-social-nav .rwp-footer-menu a {
    color: var(--rw-footer-text, #9ca3af);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    transition: color 0.2s ease;
}

.rwp-footer-social-nav .rwp-footer-menu a:hover {
    color: var(--rw-footer-heading, #ffffff);
}

.rwp-footer-menu-centered { justify-content: center !important; }
.rwp-footer-menu-section {
    padding: calc(var(--rw-space-5, 1.5rem) * 0.3) 0;
    text-align: center;
}

.rwp-footer .rwp-title-underline { color: var(--rw-footer-heading, #ffffff); }
.rwp-footer .rwp-title-underline::after {
    background: linear-gradient(90deg,
        var(--rw-footer-accent, #0d7c3e) 0%,
        color-mix(in srgb, var(--rw-footer-accent, #0d7c3e) 20%, transparent) 100%);
}
.rwp-footer .rwp-title-border {
    color: var(--rw-footer-heading, #ffffff);
    border-left-color: var(--rw-footer-accent, #0d7c3e);
}
.rwp-footer .rwp-title-between-lines { color: var(--rw-footer-heading, #ffffff); }
.rwp-footer .rwp-title-between-lines::before,
.rwp-footer .rwp-title-between-lines::after {
    background: linear-gradient(90deg,
        transparent 0%,
        var(--rw-footer-accent, #0d7c3e) 50%,
        transparent 100%);
}
.rwp-footer .rwp-title-slant { color: var(--rw-footer-heading, #ffffff); }
.rwp-footer .rwp-title-slant::before { background-color: var(--rw-footer-accent, #0d7c3e); }


/* ============================================
 * 2. BACK TO TOP BUTTON
 * ============================================ */

.rwp-back-to-top {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 45px;
    height: 45px;
    background-color: var(--rw-footer-accent, #0d7c3e);
    color: #ffffff;
    border: 2px solid transparent;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s, background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
    box-shadow: var(--rw-shadow-md, 0 4px 12px rgba(0,0,0,0.08));
    text-decoration: none;
}

.rwp-back-to-top.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.rwp-back-to-top:hover {
    background-color: var(--rw-footer-bg, #0a5e2f);
    transform: translateY(-3px);
    box-shadow: var(--rw-shadow-hover, 0 8px 24px rgba(0,0,0,0.12));
}

.rwp-back-to-top svg {
    color: currentColor;
    fill: none;
    stroke: currentColor;
    width: 24px;
    height: 24px;
}

html[data-theme="dark"] .rwp-back-to-top {
    background-color: #ffffff;
    color: #0d7c3e;
    border: 2px solid #0d7c3e;
    box-shadow: 0 4px 12px rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .rwp-back-to-top:hover {
    background-color: #0d7c3e;
    color: #ffffff;
    border-color: #ffffff;
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

@media (max-width: 768px) {
    .rwp-back-to-top {
        bottom: 20px;
        right: 20px;
        width: 40px;
        height: 40px;
    }


	/* ============================================
 * 2. BACK TO TOP BUTTON
 * ============================================ */

.rwp-back-to-top {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 45px;
    height: 45px;
    background-color: var(--rw-color-primary, #0d7c3e);
    color: #ffffff;
    border: 2px solid transparent;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s, background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
    box-shadow: var(--rw-shadow-md, 0 4px 12px rgba(0,0,0,0.08));
    text-decoration: none;
}

.rwp-back-to-top.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.rwp-back-to-top:hover {
    background-color: color-mix(in srgb, var(--rw-color-primary, #0d7c3e) 85%, black);
    transform: translateY(-3px);
    box-shadow: var(--rw-shadow-hover, 0 8px 24px rgba(0,0,0,0.12));
}

.rwp-back-to-top svg {
    color: currentColor;
    fill: none;
    stroke: currentColor;
    width: 24px;
    height: 24px;
}

html[data-theme="dark"] .rwp-back-to-top {
    background-color: var(--rw-color-primary, #4ade80);
    color: #0f172a;
    border: 2px solid var(--rw-color-primary, #4ade80);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}

html[data-theme="dark"] .rwp-back-to-top:hover {
    background-color: color-mix(in srgb, var(--rw-color-primary, #4ade80) 85%, black);
    color: #0f172a;
    border-color: var(--rw-color-primary, #4ade80);
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
}

@media (max-width: 768px) {
    .rwp-back-to-top {
        bottom: 20px;
        right: 20px;
        width: 40px;
        height: 40px;
    }
}


/* ============================================
 * 3. GRID LAYOUT (Archive/Index/Search/Home)
 * ============================================ */

.rankwellpress-container {
    width: 100%;
    max-width: var(--rw-container-desktop, 1200px);
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}

@media (min-width: 768px) and (max-width: 1024px) {
    .rankwellpress-container {
        padding: 0 15px;
    }
}

@media (max-width: 767px) {
    .rankwellpress-container {
        width: 100%;
        padding: 0 12px;
        box-sizing: border-box;
    }
}

.rankwellpress-main-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--rw-space-4, 1rem);
    margin-top: var(--rw-space-5, 1.5rem);
    margin-bottom: var(--rw-space-8, 3rem);
    min-width: 0;
}

.rankwellpress-main-layout > * {
    min-width: 0;
    max-width: 100%;
}

@media (min-width: 992px) {
    .rankwellpress-main-layout {
        grid-template-columns: minmax(0, 2fr) minmax(var(--rw-sidebar-width, 320px), 1fr);
        gap: var(--rw-space-5, 1.5rem);
    }
}

.rankwellpress-content-area {
    min-width: 0;
    max-width: 100%;
}

.rankwellpress-sidebar {
    position: relative;
    min-width: 0;
    max-width: 100%;
}

@media (min-width: 992px) {
    .rankwellpress-sidebar-inner {
        position: sticky;
        top: 100px;
        transition: top var(--rw-transition-standard, 0.3s ease);
        min-width: 0;
    }
}


/* ============================================
 * 4. SIDEBAR WIDGET STYLES — FLAT
 * ============================================ */

.rankwellpress-sidebar {
    display: flex;
    flex-direction: column;
    gap: 0;
    position: relative;
}

/* Contain the entire chain so carousels can't push the column wide. */
.rankwellpress-sidebar,
.rankwellpress-sidebar-inner,
.rankwellpress-sidebar > *,
.rankwellpress-sidebar-inner > * {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.rankwellpress-sidebar .widget {
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
    margin-bottom: 32px;
    min-height: 0;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.rankwellpress-sidebar .widget:last-child {
    margin-bottom: 0;
}

.rankwellpress-sidebar .widget-title {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--rw-text-heading, #111827);
    margin: 0 0 20px 0;
    padding: 0;
    border: none;
    position: static;
}

.rankwellpress-sidebar .widget-title::after {
    display: none !important;
}

.rankwellpress-sidebar .widget ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.rankwellpress-sidebar .widget ul li {
    padding: 8px 0;
    border-bottom: none;
    color: var(--rw-text-body, #4b5563);
    display: block;
}

.rankwellpress-sidebar .widget ul li:last-child {
    padding-bottom: 0;
}

.rankwellpress-sidebar .widget ul li a {
    color: var(--rw-text-body, #4b5563);
    font-weight: 500;
    transition: color 0.2s ease;
    display: inline-block;
}

.rankwellpress-sidebar .widget ul li a:hover {
    color: var(--rw-color-primary, #0d7c3e);
}

.rankwellpress-sidebar .widget_text,
.rankwellpress-sidebar .widget_custom_html {
    padding: 0;
    background: transparent;
    border: none;
    box-shadow: none;
}

/* Shortcode wrapper inside sidebar must clip its contents */
.rankwellpress-sidebar .rkp-sc-widget,
.rankwellpress-sidebar .rankwellpress-shortcode-widget {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    box-sizing: border-box;
}


/* ============================================
 * 5. SINGLE POST LAYOUT
 * ============================================ */

.single-post-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
    width: 100%;
    box-sizing: border-box;
    min-width: 0;
}

.single-post-layout > * {
    min-width: 0;
    max-width: 100%;
}

.single-post-main {
    min-width: 0;
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
}

.single-post-sidebar {
    min-width: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

@media (min-width: 992px) {
    .single-post-layout.has-sidebar-right { grid-template-columns: minmax(0, 1fr) 300px; }
    .single-post-layout.has-sidebar-left  { grid-template-columns: 300px minmax(0, 1fr); }
    .single-post-layout.has-sidebar-none  { grid-template-columns: 1fr; max-width: 800px; margin: 0 auto; }

    .single-post-sidebar.rwp-sidebar-sticky {
        position: sticky;
        top: 90px;
        align-self: flex-start;
        max-height: calc(100vh - 120px);
        overflow-y: auto;
    }
}

@media (max-width: 991px) {
    .single-post-layout,
    .single-post-layout.has-sidebar-left,
    .single-post-layout.has-sidebar-right,
    .single-post-layout.has-sidebar-none {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .single-post-sidebar.rwp-sidebar-sticky {
        position: static;
        max-height: none;
        overflow-y: visible;
    }
}

.single-post-main img,
.single-post-main iframe,
.single-post-main embed,
.single-post-main object,
.single-post-main video,
.single-post-main table,
.single-post-main pre,
.single-post-main code {
    max-width: 100%;
    height: auto;
    box-sizing: border-box;
}

.single-post-main table {
    display: block;
    overflow-x: auto;
}

.single-post-sidebar {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.single-post-sidebar .widget {
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
    margin-bottom: 32px;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.single-post-sidebar .widget:last-child {
    margin-bottom: 0;
}

.single-post-sidebar .widget-title {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--rw-text-heading, #111827);
    margin: 0 0 20px 0;
    padding: 0;
    border: none;
    position: static;
}

.single-post-sidebar .widget-title::after {
    display: none !important;
}

.single-post-sidebar .widget ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.single-post-sidebar .widget ul li {
    padding: 8px 0;
    border-bottom: none;
}

.single-post-sidebar .widget ul li:last-child {
    padding-bottom: 0;
}

.single-post-sidebar .widget ul li a {
    color: var(--rw-text-body, #4b5563);
    font-weight: 500;
    transition: color 0.2s ease;
    display: inline-block;
}

.single-post-sidebar .widget ul li a:hover {
    color: var(--rw-color-primary, #0d7c3e);
}

.single-post-sidebar .rkp-sc-widget,
.single-post-sidebar .rankwellpress-shortcode-widget {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    box-sizing: border-box;
}


/* ============================================
 * 6. DARK MODE
 * ============================================ */

.rwp-icon-sun { display: none; }
.rwp-icon-moon { display: block; }

html[data-theme="dark"] .rwp-icon-moon { display: none; }
html[data-theme="dark"] .rwp-icon-sun { display: block; }

html[data-theme="dark"] {
    --rw-bg-body: #0f172a !important;
    --rw-bg-content: #1e293b !important;
    --rw-bg-alt: #334155 !important;
    --rw-text-body: #cbd5e1 !important;
    --rw-text-muted: #94a3b8 !important;
    --rw-text-heading: #f8fafc !important;
    --rw-border-color: #334155 !important;
    --rw-border-light: #475569 !important;
    --rw-widget-title-color: #f8fafc !important;
    --rw-widget-list-title-color: #f8fafc !important;
    --rwp-mobile-icon-bg: #1e293b !important;
    --rwp-mobile-icon-text: #f8fafc !important;
}

html[data-theme="dark"] .post-content img,
html[data-theme="dark"] .single-content img,
html[data-theme="dark"] .rankwellpress-single-content img,
html[data-theme="dark"] .rankwellpress-sidebar img,
html[data-theme="dark"] .single-post-sidebar img {
    opacity: 0.85;
    transition: opacity 0.3s ease;
}

html[data-theme="dark"] .post-content img:hover,
html[data-theme="dark"] .single-content img:hover,
html[data-theme="dark"] .rankwellpress-single-content img:hover,
html[data-theme="dark"] .rankwellpress-sidebar img:hover,
html[data-theme="dark"] .single-post-sidebar img:hover {
    opacity: 1;
}

html[data-theme="dark"] .rwp-ad-leaderboard img,
html[data-theme="dark"] .rwp-ad-leaderboard iframe,
html[data-theme="dark"] ins.adsbygoogle {
    opacity: 1 !important;
    filter: none !important;
}


/* ============================================
 * 7. DARK MODE FIXES — Cards, Buttons
 * ============================================ */

html[data-theme="dark"] .rankwellpress-load-more-headlines,
html[data-theme="dark"] .rankwellpress-headlines-load-more button,
html[data-theme="dark"] .flexnews-load-more-container button,
html[data-theme="dark"] .rankwellpress-load-more-wrapper button {
    color: var(--rw-color-primary, #0d7c3e) !important;
}


/* ============================================
 * 8. WordPress CORE ALIGNMENT CLASSES
 * ============================================ */

.alignleft {
    float: left;
    margin-right: 1.5em;
    margin-bottom: 1.5em;
    max-width: 50%;
}

.alignright {
    float: right;
    margin-left: 1.5em;
    margin-bottom: 1.5em;
    max-width: 50%;
}

.aligncenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1.5em;
    text-align: center;
}

.alignwide {
    margin-left: -80px;
    margin-right: -80px;
    max-width: none;
}

.alignfull {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    max-width: 100vw;
    width: 100vw;
}

@media (max-width: 768px) {
    .alignleft,
    .alignright {
        float: none;
        margin-left: auto;
        margin-right: auto;
        max-width: 100%;
    }

    .alignwide {
        margin-left: 0;
        margin-right: 0;
    }
}


/* =========================================================
 * 9. Leaderboard Ad (AdSense-safe)
 * ========================================================= */

.rwp-ad-leaderboard {
    width: 100%;
    max-width: 728px;
    margin: 20px auto;
    padding: 0;
    text-align: center;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
}

.rwp-ad-leaderboard *,
.rwp-ad-leaderboard *::before,
.rwp-ad-leaderboard *::after {
    box-sizing: border-box;
}

.rwp-ad-leaderboard .rwp-ad-label {
    display: block;
    margin: 0 0 8px;
    color: #999999;
    font-size: 10px;
    line-height: 1;
    font-weight: 400;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.rwp-ad-leaderboard .rwp-ad-content {
    width: 100%;
    max-width: 728px;
    min-height: 90px;
    margin: 0 auto;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow-x: hidden;
    overflow-y: visible;
    position: relative;
}

.rwp-ad-leaderboard ins.adsbygoogle {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    padding: 0;
}

.rwp-ad-leaderboard iframe {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0;
    margin: 0 auto;
    padding: 0;
    border: 0;
}

.rwp-ad-leaderboard .rankwell-ad-placeholder {
    width: 100%;
    max-width: 728px;
    min-height: 90px;
    margin: 0 auto;
    padding: 15px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: linear-gradient(135deg, #0066cc, #004499);
    border-radius: 8px;
    text-align: center;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.rwp-ad-leaderboard .rankwell-ad-placeholder-title {
    margin: 0 0 4px;
    color: #ffffff;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 700;
}

.rwp-ad-leaderboard .rankwell-ad-placeholder-subtitle {
    margin: 0;
    color: #ffd700;
    font-size: 13px;
    line-height: 1.2;
    font-weight: 500;
}

.rwp-ad-leaderboard .rankwell-ad-placeholder-btn {
    display: inline-block;
    margin-top: 8px;
    padding: 6px 16px;
    background: #ff6600;
    color: #ffffff;
    border-radius: 4px;
    font-size: 13px;
    line-height: 1.2;
    font-weight: 700;
    text-decoration: none;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.rwp-ad-leaderboard .rankwell-ad-placeholder-btn:hover {
    background: #e55c00;
    transform: translateY(-1px);
}

.rwp-ad-leaderboard .rankwell-ad-placeholder-btn:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 2px;
}

html[data-theme="dark"] .rwp-ad-leaderboard .rwp-ad-label {
    color: #64748b;
}

html[data-theme="dark"] .rwp-ad-leaderboard .rankwell-ad-placeholder {
    background: linear-gradient(135deg, #1a3a6b, #0d1f44);
}

@media (max-width: 768px) {
    .rwp-ad-leaderboard {
        width: 100%;
        max-width: 100%;
        margin: 10px auto;
        padding: 0 10px;
    }
    .rwp-ad-leaderboard .rwp-ad-label {
        margin-bottom: 5px;
        font-size: 9px;
    }
    .rwp-ad-leaderboard .rwp-ad-content {
        width: 100%;
        max-width: 100%;
        min-height: 100px;
    }
    .rwp-ad-leaderboard[data-format="fixed-320x50"] .rwp-ad-content {
        min-height: 50px;
    }
    .rwp-ad-leaderboard ins.adsbygoogle {
        width: 100% !important;
        max-width: 100% !important;
    }
    .rwp-ad-leaderboard .rankwell-ad-placeholder {
        width: 100%;
        max-width: 100%;
        min-height: 100px;
        padding: 10px 15px;
        border-radius: 6px;
    }
    .rwp-ad-leaderboard .rankwell-ad-placeholder-title {
        font-size: 16px;
    }
    .rwp-ad-leaderboard .rankwell-ad-placeholder-subtitle {
        font-size: 12px;
    }
    .rwp-ad-leaderboard .rankwell-ad-placeholder-btn {
        padding: 4px 14px;
        font-size: 12px;
    }
}

@media (max-width: 480px) {
    .rwp-ad-leaderboard {
        margin: 8px auto;
        padding: 0 5px;
    }
    .rwp-ad-leaderboard .rwp-ad-content {
        min-height: 100px;
    }
    .rwp-ad-leaderboard .rankwell-ad-placeholder {
        min-height: 100px;
        padding: 10px;
    }
    .rwp-ad-leaderboard .rankwell-ad-placeholder-title {
        font-size: 14px;
    }
    .rwp-ad-leaderboard .rankwell-ad-placeholder-subtitle {
        font-size: 11px;
    }
}

@media (max-width: 359px) {
    .rwp-ad-leaderboard .rwp-ad-content {
        min-height: 90px;
    }
    .rwp-ad-leaderboard .rankwell-ad-placeholder {
        min-height: 90px;
    }
    .rwp-ad-leaderboard .rankwell-ad-placeholder-title {
        font-size: 13px;
    }
    .rwp-ad-leaderboard .rankwell-ad-placeholder-subtitle {
        font-size: 10px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .rwp-ad-leaderboard .rankwell-ad-placeholder-btn {
        transition: none;
    }
    .rwp-ad-leaderboard .rankwell-ad-placeholder-btn:hover {
        transform: none;
    }
}


/* =========================================================
 * 10. FOOTER SOCIAL ICONS — IMMUNITY SHIELD
 * ========================================================= */

.rwp-footer .rwp-social-icon,
.rwp-footer .rwp-social-icon:link,
.rwp-footer .rwp-social-icon:visited,
.rwp-footer .rwp-social-icon:hover,
.rwp-footer .rwp-social-icon:focus,
.rwp-footer .rwp-social-icon:focus-visible,
.rwp-footer .rwp-social-icon:active,
.rwp-footer-follow .rwp-social-icon,
.rwp-footer-follow .rwp-social-icon:link,
.rwp-footer-follow .rwp-social-icon:visited,
.rwp-footer-follow .rwp-social-icon:hover,
.rwp-footer-follow .rwp-social-icon:focus,
.rwp-footer-follow .rwp-social-icon:focus-visible,
.rwp-footer-follow .rwp-social-icon:active,
.rwp-footer-social-nav .rwp-social-icon,
.rwp-footer-social-nav .rwp-social-icon:link,
.rwp-footer-social-nav .rwp-social-icon:visited,
.rwp-footer-social-nav .rwp-social-icon:hover,
.rwp-footer-social-nav .rwp-social-icon:focus,
.rwp-footer-social-nav .rwp-social-icon:focus-visible,
.rwp-footer-social-nav .rwp-social-icon:active {
    color: #ffffff !important;
    text-decoration: none !important;
    text-decoration-line: none !important;
    text-decoration-color: transparent !important;
    border-bottom: none !important;
}

.rwp-footer .rwp-social-icon[target="_blank"]::after,
.rwp-footer-follow .rwp-social-icon[target="_blank"]::after,
.rwp-footer-social-nav .rwp-social-icon[target="_blank"]::after {
    content: none !important;
    display: none !important;
}

.rwp-footer .rwp-social-icon svg,
.rwp-footer-follow .rwp-social-icon svg,
.rwp-footer-social-nav .rwp-social-icon svg {
    fill: currentColor !important;
    color: #ffffff !important;
}

.rwp-footer-follow .rwp-social-facebook,
.rwp-footer-social-nav .rwp-social-facebook { background-color: var(--rw-brand-facebook, #1877F2) !important; }
.rwp-footer-follow .rwp-social-twitter,
.rwp-footer-social-nav .rwp-social-twitter { background-color: var(--rw-brand-twitter, #000000) !important; }
.rwp-footer-follow .rwp-social-instagram,
.rwp-footer-social-nav .rwp-social-instagram { background-color: var(--rw-brand-instagram, #E1306C) !important; }
.rwp-footer-follow .rwp-social-youtube,
.rwp-footer-social-nav .rwp-social-youtube { background-color: var(--rw-brand-youtube, #FF0000) !important; }
.rwp-footer-follow .rwp-social-linkedin,
.rwp-footer-social-nav .rwp-social-linkedin { background-color: var(--rw-brand-linkedin, #0A66C2) !important; }
.rwp-footer-follow .rwp-social-whatsapp,
.rwp-footer-social-nav .rwp-social-whatsapp { background-color: var(--rw-brand-whatsapp, #25D366) !important; }
.rwp-footer-follow .rwp-social-telegram,
.rwp-footer-social-nav .rwp-social-telegram { background-color: var(--rw-brand-telegram, #0088CC) !important; }
.rwp-footer-follow .rwp-social-tiktok,
.rwp-footer-social-nav .rwp-social-tiktok { background-color: #000000 !important; }
.rwp-footer-follow .rwp-social-pinterest,
.rwp-footer-social-nav .rwp-social-pinterest { background-color: #BD081C !important; }
.rwp-footer-follow .rwp-social-reddit,
.rwp-footer-social-nav .rwp-social-reddit { background-color: #FF4500 !important; }

.rwp-footer .rwp-social-icon:hover,
.rwp-footer .rwp-social-icon:focus-visible,
.rwp-footer-follow .rwp-social-icon:hover,
.rwp-footer-follow .rwp-social-icon:focus-visible,
.rwp-footer-social-nav .rwp-social-icon:hover,
.rwp-footer-social-nav .rwp-social-icon:focus-visible {
    color: #ffffff !important;
    filter: brightness(1.15);
}


/* =========================================================
 * 11. SIDEBAR CONTAINMENT — Premium widgets / carousels
 * Fixes horizontal overflow when [rkp_trending] is placed
 * inside a sidebar, home page, or single post sidebar.
 * Root cause: flex/grid items default to min-width: auto, so
 * a carousel's content-width forces its ancestors wider than
 * the viewport. min-width: 0 + overflow:hidden breaks the chain.
 * ========================================================= */

/* ── Sidebar column itself ── */
.rankwellpress-sidebar,
.single-post-sidebar,
.rankwellpress-sidebar-inner,
.single-post-sidebar.rwp-sidebar-sticky {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

/* ── Widgets inside the sidebar ── */
.rankwellpress-sidebar > *,
.single-post-sidebar > *,
.rankwellpress-sidebar-inner > * {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

/* ── Shortcode wrapper ── */
.rankwellpress-sidebar .rkp-sc-widget,
.single-post-sidebar .rkp-sc-widget,
.rankwellpress-sidebar .rankwellpress-shortcode-widget,
.single-post-sidebar .rankwellpress-shortcode-widget {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    box-sizing: border-box;
}

/* ── Trending widget inside sidebar — clip the carousel ── */
.rankwellpress-sidebar .rwp-premium-trending,
.rankwellpress-sidebar .rwp-premium-widget-trending,
.single-post-sidebar .rwp-premium-trending,
.single-post-sidebar .rwp-premium-widget-trending,
.rankwellpress-sidebar .rkp-premium-trending-widget,
.single-post-sidebar .rkp-premium-trending-widget {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    box-sizing: border-box;
    position: relative;
}

/* ── Scroller stays content-width inside the clipped wrapper ── */
.rankwellpress-sidebar .rwp-premium-trending__scroller,
.single-post-sidebar .rwp-premium-trending__scroller {
    display: flex;
    flex-wrap: nowrap;
    gap: 16px;
    width: max-content;
    will-change: transform;
}

/* ── Cards — bounded width in sidebar ── */
.rankwellpress-sidebar .rwp-premium-trending__card,
.single-post-sidebar .rwp-premium-trending__card {
    flex: 0 0 auto;
    width: 240px;
    max-width: 80vw;
    box-sizing: border-box;
}

/* ── Generic safety — the main layout grid, both sidebars ── */
.widget-area,
.sidebar,
.rwp-sidebar,
.rkp-sidebar {
    min-width: 0;
    max-width: 100%;
}

.widget-area > *,
.sidebar > *,
.rwp-sidebar > *,
.rkp-sidebar > * {
    min-width: 0;
    max-width: 100%;
}

@media (max-width: 480px) {
    .rankwellpress-sidebar .rwp-premium-trending__card,
    .single-post-sidebar .rwp-premium-trending__card {
        width: 200px;
    }
    .rankwellpress-sidebar .rwp-premium-trending__scroller,
    .single-post-sidebar .rwp-premium-trending__scroller {
        gap: 12px;
    }
}


/* =========================================================
 * 12. FOOTER — Premium widget containment & dark glass
 * ========================================================= */

/* ── Contain the trending / posts widgets to their column ── */
.rwp-footer .rwp-premium-trending,
.rwp-footer .rwp-premium-widget-trending,
.rwp-footer .rwp-premium-widget--grid,
.rwp-footer-widgets .rwp-premium-trending,
.rwp-footer-widgets .rwp-premium-widget-trending,
.rwp-footer-widgets .rwp-premium-widget--grid,
.rwp-footer .rkp-premium-trending-widget,
.rwp-footer .rkp-premium-posts-widget,
.rwp-footer-widgets .rkp-premium-trending-widget,
.rwp-footer-widgets .rkp-premium-posts-widget {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    box-sizing: border-box;
    position: relative;
}

/* ── Scroller containment ── */
.rwp-footer .rwp-premium-trending__scroller,
.rwp-footer-widgets .rwp-premium-trending__scroller {
    display: flex;
    flex-wrap: nowrap;
    gap: 14px;
    width: max-content;
    will-change: transform;
}

.rwp-footer .rkp-premium-trending-widget__scroller,
.rwp-footer-widgets .rkp-premium-trending-widget__scroller {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

/* ── Card widths in footer ── */
.rwp-footer .rwp-premium-trending__card,
.rwp-footer-widgets .rwp-premium-trending__card {
    flex: 0 0 auto;
    width: 220px;
    max-width: 80vw;
    box-sizing: border-box;
}

.rwp-footer .rkp-premium-trending-widget__card,
.rwp-footer-widgets .rkp-premium-trending-widget__card {
    flex: 0 0 200px;
    max-width: 80vw;
    box-sizing: border-box;
}

/* ── Dark glass — card bodies ── */
.rwp-footer .rwp-premium-related__body,
.rwp-footer-widgets .rwp-premium-related__body,
.rwp-footer .rwp-premium-trending__body,
.rwp-footer-widgets .rwp-premium-trending__body,
.rwp-footer .rkp-premium-posts-widget__card-body,
.rwp-footer-widgets .rkp-premium-posts-widget__card-body,
.rwp-footer .rkp-premium-trending-widget__card-body,
.rwp-footer-widgets .rkp-premium-trending-widget__card-body {
    background: rgba(15, 23, 42, 0.65);
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(14px) saturate(180%);
    -webkit-backdrop-filter: blur(14px) saturate(180%);
}

@supports not (backdrop-filter: blur(1px)) {
    .rwp-footer .rwp-premium-related__body,
    .rwp-footer-widgets .rwp-premium-related__body,
    .rwp-footer .rwp-premium-trending__body,
    .rwp-footer-widgets .rwp-premium-trending__body,
    .rwp-footer .rkp-premium-posts-widget__card-body,
    .rwp-footer-widgets .rkp-premium-posts-widget__card-body,
    .rwp-footer .rkp-premium-trending-widget__card-body,
    .rwp-footer-widgets .rkp-premium-trending-widget__card-body {
        background: rgba(15, 23, 42, 0.92);
    }
}

/* ── Dark glass — titles ── */
.rwp-footer .rwp-premium-related__heading,
.rwp-footer .rwp-premium-related__heading a,
.rwp-footer-widgets .rwp-premium-related__heading,
.rwp-footer-widgets .rwp-premium-related__heading a,
.rwp-footer .rwp-premium-trending__heading,
.rwp-footer .rwp-premium-trending__heading a,
.rwp-footer-widgets .rwp-premium-trending__heading,
.rwp-footer-widgets .rwp-premium-trending__heading a,
.rwp-footer .rkp-premium-posts-widget__card-title,
.rwp-footer .rkp-premium-posts-widget__card-title a,
.rwp-footer-widgets .rkp-premium-posts-widget__card-title,
.rwp-footer-widgets .rkp-premium-posts-widget__card-title a,
.rwp-footer .rkp-premium-trending-widget__card-title,
.rwp-footer .rkp-premium-trending-widget__card-title a,
.rwp-footer-widgets .rkp-premium-trending-widget__card-title,
.rwp-footer-widgets .rkp-premium-trending-widget__card-title a {
    color: #f8fafc;
}

.rwp-footer .rwp-premium-related__heading a:hover,
.rwp-footer-widgets .rwp-premium-related__heading a:hover,
.rwp-footer .rwp-premium-trending__heading a:hover,
.rwp-footer-widgets .rwp-premium-trending__heading a:hover,
.rwp-footer .rkp-premium-posts-widget__card-title a:hover,
.rwp-footer-widgets .rkp-premium-posts-widget__card-title a:hover,
.rwp-footer .rkp-premium-trending-widget__card-title a:hover,
.rwp-footer-widgets .rkp-premium-trending-widget__card-title a:hover {
    color: var(--rw-footer-accent, #4ade80);
}

/* ── Dark glass — category pills ── */
.rwp-footer .rwp-premium-related__category,
.rwp-footer-widgets .rwp-premium-related__category,
.rwp-footer .rwp-premium-trending__category,
.rwp-footer-widgets .rwp-premium-trending__category,
.rwp-footer .rkp-premium-posts-widget__cat,
.rwp-footer .rkp-premium-trending-widget__cat,
.rwp-footer-widgets .rkp-premium-posts-widget__cat,
.rwp-footer-widgets .rkp-premium-trending-widget__cat {
    background: rgba(30, 41, 59, 0.7);
    color: var(--rw-footer-accent, #4ade80);
    border-color: color-mix(in srgb, var(--rw-footer-accent, #4ade80) 30%, transparent);
}

.rwp-footer .rwp-premium-related__category:hover,
.rwp-footer-widgets .rwp-premium-related__category:hover,
.rwp-footer .rwp-premium-trending__category:hover,
.rwp-footer-widgets .rwp-premium-trending__category:hover,
.rwp-footer .rkp-premium-posts-widget__cat:hover,
.rwp-footer .rkp-premium-trending-widget__cat:hover,
.rwp-footer-widgets .rkp-premium-posts-widget__cat:hover,
.rwp-footer-widgets .rkp-premium-trending-widget__cat:hover {
    background: var(--rw-footer-accent, #4ade80);
    color: #0f172a;
    border-color: var(--rw-footer-accent, #4ade80);
}

/* ── Dark glass — meta rows ── */
.rwp-footer .rwp-premium-related__meta,
.rwp-footer-widgets .rwp-premium-related__meta,
.rwp-footer .rkp-premium-posts-widget__meta,
.rwp-footer-widgets .rkp-premium-posts-widget__meta {
    color: #94a3b8;
    border-top-color: rgba(255, 255, 255, 0.08);
}

/* ── Dark glass — load more buttons ── */
.rwp-footer .rwp-premium-widget__load-more,
.rwp-footer-widgets .rwp-premium-widget__load-more,
.rwp-footer .rkp-premium-posts-widget__load-more,
.rwp-footer-widgets .rkp-premium-posts-widget__load-more {
    background: rgba(30, 41, 59, 0.65);
    color: var(--rw-footer-accent, #4ade80);
    border-color: color-mix(in srgb, var(--rw-footer-accent, #4ade80) 30%, transparent);
}

.rwp-footer .rwp-premium-widget__load-more:hover,
.rwp-footer .rwp-premium-widget__load-more:focus-visible,
.rwp-footer-widgets .rwp-premium-widget__load-more:hover,
.rwp-footer-widgets .rwp-premium-widget__load-more:focus-visible,
.rwp-footer .rkp-premium-posts-widget__load-more:hover,
.rwp-footer .rkp-premium-posts-widget__load-more:focus-visible,
.rwp-footer-widgets .rkp-premium-posts-widget__load-more:hover,
.rwp-footer-widgets .rkp-premium-posts-widget__load-more:focus-visible {
    background: var(--rw-footer-accent, #4ade80);
    color: #0f172a;
    border-color: var(--rw-footer-accent, #4ade80);
}

/* ── Dark glass — section titles (both namespaces) ── */
.rwp-footer .rkp-premium-section-title--glass .rkp-premium-section-title__head,
.rwp-footer-widgets .rkp-premium-section-title--glass .rkp-premium-section-title__head,
.rwp-footer .rwp-section-title--glass .rwp-section-title__main,
.rwp-footer-widgets .rwp-section-title--glass .rwp-section-title__main {
    background: rgba(30, 41, 59, 0.65);
    border-color: color-mix(in srgb, var(--rw-footer-accent, #4ade80) 26%, transparent);
}

.rwp-footer .rkp-premium-section-title--glass .rkp-premium-section-title__label,
.rwp-footer-widgets .rkp-premium-section-title--glass .rkp-premium-section-title__label,
.rwp-footer .rwp-section-title--glass .rwp-section-title__text,
.rwp-footer-widgets .rwp-section-title--glass .rwp-section-title__text {
    color: var(--rw-footer-accent, #4ade80);
}

.rwp-footer .rkp-premium-section-title__cta,
.rwp-footer-widgets .rkp-premium-section-title__cta,
.rwp-footer .rwp-section-title__view-all,
.rwp-footer-widgets .rwp-section-title__view-all {
    color: #94a3b8;
}

.rwp-footer .rkp-premium-section-title__cta:hover,
.rwp-footer-widgets .rkp-premium-section-title__cta:hover,
.rwp-footer .rwp-section-title__view-all:hover,
.rwp-footer-widgets .rwp-section-title__view-all:hover {
    color: var(--rw-footer-accent, #4ade80);
    background: color-mix(in srgb, var(--rw-footer-accent, #4ade80) 10%, transparent);
}

/* ── Mobile: card width ── */
@media (max-width: 480px) {
    .rwp-footer .rwp-premium-trending__card,
    .rwp-footer-widgets .rwp-premium-trending__card {
        width: 200px;
    }
    .rwp-footer .rkp-premium-trending-widget__card,
    .rwp-footer-widgets .rkp-premium-trending-widget__card {
        flex: 0 0 180px;
    }
}

/* --- layout/_sidebar.css --- */
/* =========================================================
 * RankwellPress — Sidebar Layout
 * File: assets/css/layout/_sidebar.css
 *
 * Layout-only stylesheet. Arranges widgets vertically in the
 * sidebar with consistent spacing.
 *
 * INTENTIONALLY DOES NOT STYLE:
 *   - Widget container chrome (background, border, radius, shadow)
 *   - Widget titles
 *   - Widget content (lists, links, forms, paragraphs, etc.)
 *
 * Those are the responsibility of each widget's own stylesheet:
 *   - Default WP widgets  → styles/widgets/*.css  (to be created)
 *   - RankwellPress widgets → widgets.css
 *   - RankwellPress Pro widgets → premium-widgets.css
 *
 * Rationale:
 *   Styling widget innards from a global sidebar stylesheet
 *   forces the same visual treatment on every widget regardless
 *   of what it renders. That breaks custom-designed widgets
 *   (card-in-card, double padding, fighting specificity) and
 *   defeats the point of having per-widget stylesheets.
 *
 *   A layout-only sidebar stylesheet keeps the file's job
 *   narrow and predictable: "arrange these vertically, with
 *   this much space between them." Nothing more.
 * ========================================================= */

/* Homepage + Archive Sidebar */
.rankwellpress-sidebar {
    display: flex;
    flex-direction: column;
    gap: var(--rw-space-5, 1.5rem);
}

/* Single Post Sidebar */
.single-post-sidebar {
    display: flex;
    flex-direction: column;
    gap: var(--rw-space-5, 1.5rem);
}

/* That's the entire file. */

/* --- widgets.css --- */
/* =========================================================
 * RankwellPress — Widget Styles (glass + frost edition)
 * FINAL — Overlay scrim fix merged into section 7
 *
 * CHANGES IN THIS VERSION
 * - Section 7: the boxed, blurred glass panel on large overlay
 *   cards is replaced by a bottom gradient scrim with a smaller
 *   fluid title size. No title clamping, no hidden excerpt.
 * - Overlay badge is now solid accent (readable on dark).
 * - Mobile (<=480px) and reduced-transparency rules updated to match.
 *
 * Earlier fix kept: the PHP template wraps the badge and meta in a
 * `.rwp-card-subrow` div, which is forced to be a grid container
 * with the correct gap.
 *
 * CUSTOMIZER WIRING (this revision)
 * - Role-based token model. Existing Customizer settings are
 *   repurposed via the :root alias block below:
 *
 *     WIDGET TITLE          ← Widget Heading Size / Weight
 *     LARGE POST TITLE      ← Post Title Size / Weight
 *     SMALL POST TITLE      ← Compact Title Size / Weight
 *     Minimal Title Size / Weight = dead (nothing reads it)
 *
 *   Every var() keeps the previous hard-coded value as the
 *   fallback, so rendering is identical if the CSS-vars
 *   pipeline ever fails to emit a token.
 *
 * TEXT WRAPPING (this revision)
 * - Card titles (grid, full, overlay) use `text-wrap: pretty`
 *   instead of `text-wrap: balance`. Pretty avoids orphans
 *   without forcing a shorter first line, which lets variable-
 *   length news headlines fill the available width naturally.
 * ========================================================= */

/* =========================================================
 * 0. DESIGN TOKENS
 * ========================================================= */

:root {
    /* ── Role aliases ──
       Maps existing Customizer tokens to the three visual
       roles used throughout this stylesheet. */

    /* Widget Title ← Widget Heading Size/Weight */
    --rwp-title-widget-size:   var(--rw-widget-title-size, 20px);
    --rwp-title-widget-weight: var(--rw-widget-title-weight, 700);

    /* Large Post Title ← Post Title Size/Weight */
    --rwp-title-large-size:    var(--rw-widget-post-title-size, 20px);
    --rwp-title-large-weight:  var(--rw-widget-post-title-weight, 800);
    --rwp-title-large-clamp:   3;

    /* Small Post Title ← Compact Title Size/Weight */
    --rwp-title-small-size:    var(--rw-herogrid-compact-size, 14px);
    --rwp-title-small-weight:  var(--rw-herogrid-compact-weight, 600);
    --rwp-title-small-clamp:   var(--rw-line-clamp, 2);

    /* ── Structural tokens ── */

    --rwp-accent: var(--rw-color-primary, #0d7c3e);
    --rwp-title-accent: var(--rw-widget-title-color, var(--rwp-accent));
    --rwp-title-ink-accent: var(--rwp-title-accent);
    --rwp-title-ink: var(--rw-text-heading, #0f172a);
    --rwp-inverse: var(--rw-text-inverse, #ffffff);

    --rwp-cat: var(--rw-widget-category-text, var(--rwp-accent));
    --rwp-cat-bg: color-mix(in srgb, var(--rw-widget-category-bg, var(--rwp-accent)) 8%, transparent);
    --rwp-cat-ring: color-mix(in srgb, var(--rw-widget-category-bg, var(--rwp-accent)) 16%, transparent);

    --rwp-post-title: var(--rw-widget-post-title-color, #0f172a);
    --rwp-post-title-hover: var(--rw-widget-post-title-hover, var(--rwp-accent));
    --rwp-muted: var(--rw-text-muted, #6b7789);

    --rwp-surface-solid: var(--rw-widget-card-bg, #ffffff);
    --rwp-surface: color-mix(in srgb, var(--rwp-surface-solid) 72%, transparent);
    --rwp-surface-hover: color-mix(in srgb, var(--rwp-surface-solid) 86%, transparent);
    --rwp-blur: 14px;
    --rwp-saturate: 160%;
    --rwp-frost-edge: rgba(255, 255, 255, 0.75);
    --rwp-edge: rgba(15, 23, 42, 0.07);
    --rwp-edge-strong: rgba(15, 23, 42, 0.14);
    --rwp-placeholder: rgba(15, 23, 42, 0.05);

    --rwp-line: rgba(15, 23, 42, 0.08);
    --rwp-hover-bg: rgba(15, 23, 42, 0.035);

    --rwp-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    --rwp-shadow-hover: 0 6px 18px -10px rgba(15, 23, 42, 0.16);

    --rwp-glass-dark: rgba(10, 14, 22, 0.38);
    --rwp-glass-dark-edge: rgba(255, 255, 255, 0.18);
    --rwp-glass-chip: rgba(255, 255, 255, 0.16);

    /* Overlay scrim (large image cards) */
    --rwp-scrim-pad: 56px 16px 14px;

    --rwp-radius: 10px;
    --rwp-radius-media: 6px;
    --rwp-radius-pill: 999px;
    --rwp-card-media-radius: 0px;
    --rwp-pad: 10px;
    --rwp-body-pad: 12px 14px 14px;
    --rwp-gap: var(--rw-widget-item-gap, 12px);
    --rwp-section-gap: 22px;
    --rwp-grid-gap: 14px;
    --rwp-thumb: 80px;
    --rwp-lift: -1px;

    --rwp-focus: 50% 35%;

    --rwp-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
    --rwp-dur-fast: 0.15s;
    --rwp-dur-med: 0.3s;
    --rwp-dur-slow: 0.5s;
}

html[data-theme="dark"] {
    --rwp-post-title: var(--rw-widget-post-title-color, #f1f5f9);
    --rwp-title-ink: var(--rw-text-heading, #f8fafc);
    --rwp-muted: var(--rw-text-muted, #94a3b8);
    --rwp-surface-solid: var(--rw-widget-card-bg, #151b27);
    --rwp-surface: color-mix(in srgb, var(--rwp-surface-solid) 62%, transparent);
    --rwp-surface-hover: color-mix(in srgb, var(--rwp-surface-solid) 78%, transparent);
    --rwp-frost-edge: rgba(255, 255, 255, 0.10);
    --rwp-edge: rgba(255, 255, 255, 0.07);
    --rwp-edge-strong: rgba(255, 255, 255, 0.15);
    --rwp-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
    --rwp-shadow-hover: 0 8px 22px -12px rgba(0, 0, 0, 0.6);
    --rwp-placeholder: rgba(255, 255, 255, 0.06);
    --rwp-line: rgba(255, 255, 255, 0.08);
    --rwp-hover-bg: rgba(255, 255, 255, 0.05);
}

.rwp-footer {
    --rwp-accent: var(--rw-footer-accent, #0d7c3e);
    --rwp-title-accent: var(--rw-footer-accent, #0d7c3e);
    --rwp-title-ink-accent: var(--rw-footer-heading, #ffffff);
    --rwp-title-ink: var(--rw-footer-heading, #ffffff);
    --rwp-cat: var(--rw-footer-accent, #0d7c3e);
    --rwp-cat-bg: color-mix(in srgb, var(--rw-footer-accent, #0d7c3e) 12%, transparent);
    --rwp-cat-ring: color-mix(in srgb, var(--rw-footer-accent, #0d7c3e) 22%, transparent);
    --rwp-post-title: var(--rw-footer-heading, #ffffff);
    --rwp-post-title-hover: var(--rw-footer-accent, #0d7c3e);
    --rwp-muted: var(--rw-footer-text, #94a3b8);
    --rwp-surface-solid: #1a2130;
    --rwp-surface: rgba(255, 255, 255, 0.05);
    --rwp-surface-hover: rgba(255, 255, 255, 0.08);
    --rwp-frost-edge: rgba(255, 255, 255, 0.10);
    --rwp-edge: rgba(255, 255, 255, 0.08);
    --rwp-edge-strong: rgba(255, 255, 255, 0.16);
    --rwp-shadow-hover: 0 8px 22px -12px rgba(0, 0, 0, 0.6);
    --rwp-placeholder: rgba(255, 255, 255, 0.06);
    --rwp-line: rgba(255, 255, 255, 0.08);
    --rwp-hover-bg: rgba(255, 255, 255, 0.05);
}

.rwp-flat {
    --rwp-surface: transparent;
    --rwp-surface-hover: transparent;
    --rwp-frost-edge: transparent;
    --rwp-edge: transparent;
    --rwp-edge-strong: transparent;
    --rwp-shadow: none;
    --rwp-shadow-hover: none;
    --rwp-blur: 0px;
    --rwp-radius: 0px;
    --rwp-radius-media: 4px;
    --rwp-card-media-radius: 8px;
    --rwp-pad: 0px;
    --rwp-body-pad: 10px 0 0;
    --rwp-lift: 0px;
}


/* =========================================================
 * GLASS MIXIN
 * ========================================================= */

:is(.rwp-card, .rwp-grid-card, .rwp-card-full) {
    background: var(--rwp-surface-solid);
    border: 1px solid var(--rwp-edge);
    border-radius: var(--rwp-radius);
    box-shadow:
        inset 0 1px 0 var(--rwp-frost-edge),
        var(--rwp-shadow);
    transition:
        transform var(--rwp-dur-med) var(--rwp-ease),
        box-shadow var(--rwp-dur-med) var(--rwp-ease),
        background-color var(--rwp-dur-med) ease,
        border-color var(--rwp-dur-fast) ease;
}

@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    :is(.rwp-card, .rwp-grid-card, .rwp-card-full) {
        background: var(--rwp-surface);
        -webkit-backdrop-filter: blur(var(--rwp-blur)) saturate(var(--rwp-saturate));
        backdrop-filter: blur(var(--rwp-blur)) saturate(var(--rwp-saturate));
    }
    :is(.rwp-card, .rwp-grid-card, .rwp-card-full):hover {
        background: var(--rwp-surface-hover);
    }
}

:is(.rwp-card, .rwp-grid-card, .rwp-card-full):hover {
    transform: translateY(var(--rwp-lift));
    border-color: var(--rwp-edge-strong);
    box-shadow:
        inset 0 1px 0 var(--rwp-frost-edge),
        var(--rwp-shadow-hover);
}

.rwp-flat :is(.rwp-card, .rwp-grid-card, .rwp-card-full) {
    background: transparent;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}


/* =========================================================
 * 1. BASE
 * ========================================================= */

.rankwellpress-headlines-ad-spot,
.flexnews-ad-spot,
.featured-news-ad-spot,
.rankwellpress-hero-grid-ad-spot {
    width: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
}

:is(.rankwellpress-headlines-ad-spot,
    .flexnews-ad-spot,
    .featured-news-ad-spot,
    .rankwellpress-hero-grid-ad-spot):has(ins.adsbygoogle, iframe[id*="google_ads"], .google-auto-placed) {
    min-height: 90px;
    margin: calc(var(--rw-space-3, 0.75rem) * 0.7) 0;
}

.rankwellpress-hero-grid-ad-spot,
.featured-news-ad-spot {
    grid-column: 1 / -1;
}

.rankwellpress-headlines-row,
.flexnews-row,
.featured-news-row,
.rankwellpress-hero-grid-row {
    width: 100%;
}

:is(.rankwellpress-headlines-widget,
    .rankwellpress-flex-news-widget,
    .rankwellpress-featured-news-widget,
    .rankwellpress-hero-grid-widget,
    .widget_rankwellpress_headlines,
    .widget_rankwellpress_flex_news,
    .widget_rankwellpress_featured_news,
    .widget_rankwellpress_hero_grid,
    .rwp-widget) {
    background: none;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    outline: 0;
    padding: 0;
    margin-bottom: var(--rwp-section-gap);
}

:is(.widget_rankwellpress_headlines,
    .widget_rankwellpress_flex_news,
    .widget_rankwellpress_featured_news,
    .widget_rankwellpress_hero_grid) :is(li, p) {
    margin: 0;
    padding: 0;
}

:is(.widget_rankwellpress_headlines,
    .widget_rankwellpress_flex_news,
    .widget_rankwellpress_featured_news,
    .widget_rankwellpress_hero_grid) :is(h1, h2, h3, h4, h5, h6) {
    margin-top: 0;
    padding: 0;
}

:is(.widget_rankwellpress_headlines,
    .widget_rankwellpress_flex_news,
    .widget_rankwellpress_featured_news,
    .widget_rankwellpress_hero_grid) .widget-title {
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 14px;
}

:is(.widget_rankwellpress_headlines,
    .widget_rankwellpress_flex_news,
    .widget_rankwellpress_featured_news,
    .widget_rankwellpress_hero_grid) .widget-title::after {
    display: none;
}


/* =========================================================
 * 2. WIDGET TITLES
 * ========================================================= */

:is(.rwp-title-underline,
    .rwp-title-border,
    .rwp-title-slant,
    .rwp-title-top-border,
    .rwp-title-bg-fill,
    .rwp-title-minimal,
    .rwp-title-between-lines) {
    margin-bottom: 14px;
    letter-spacing: -0.01em;
    border: 0;
}

:is(.rwp-title-underline,
    .rwp-title-border,
    .rwp-title-top-border,
    .rwp-title-bg-fill,
    .rwp-title-minimal,
    .rwp-title-between-lines) {
    font-size: var(--rwp-title-widget-size);
    font-weight: var(--rwp-title-widget-weight);
}

.rwp-title-underline {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    color: var(--rwp-title-ink-accent);
}

.rwp-title-underline::after {
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background: var(--rwp-edge-strong);
    background-image: linear-gradient(var(--rwp-title-accent), var(--rwp-title-accent));
    background-repeat: no-repeat;
    background-size: 48px 100%;
}

.rwp-title-border {
    color: var(--rwp-title-ink-accent);
    padding-left: 14px;
    border-left: 3px solid var(--rwp-title-accent);
}

.rwp-title-slant {
    position: relative;
    display: inline-block;
    z-index: 1;
    padding: 8px 22px;
    color: var(--rwp-inverse);
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.rwp-title-slant::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    border-radius: 3px;
    background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--rwp-title-accent) 92%, #ffffff) 0%,
        var(--rwp-title-accent) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28);
    transform: skewX(-12deg);
}

.rwp-title-top-border {
    color: var(--rwp-title-ink);
    padding-top: 12px;
    border-top: 3px solid var(--rwp-title-accent);
}

.rwp-title-bg-fill {
    color: var(--rwp-title-ink);
    padding: var(--rw-widget-header-padding, 12px 16px);
    border: 1px solid var(--rwp-edge);
    border-radius: var(--rwp-radius-media);
    background-color: color-mix(in srgb, var(--rwp-title-accent) 9%, transparent);
    box-shadow: inset 0 1px 0 var(--rwp-frost-edge);
}

@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .rwp-title-bg-fill {
        -webkit-backdrop-filter: blur(10px) saturate(150%);
        backdrop-filter: blur(10px) saturate(150%);
    }
}

.rwp-title-bg-fill span {
    position: relative;
    padding-left: 14px;
}

.rwp-title-bg-fill span::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 3px;
    height: 18px;
    border-radius: 2px;
    background-color: var(--rwp-title-accent);
    transform: translateY(-50%);
}

.rwp-title-minimal {
    color: var(--rwp-title-ink);
}

.rwp-title-between-lines {
    display: flex;
    align-items: center;
    gap: 16px;
    color: var(--rwp-title-ink-accent);
    text-transform: uppercase;
}

.rwp-title-between-lines::before,
.rwp-title-between-lines::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--rwp-edge-strong);
}

.rwp-title-between-lines span {
    flex-shrink: 0;
    white-space: nowrap;
}


/* =========================================================
 * 3. MEDIA
 * ========================================================= */

:is(.rwp-card-thumb,
    .rwp-grid-card-thumb,
    .rwp-card-full-thumb,
    .rankwellpress-headlines-featured) img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    object-fit: cover !important;
    object-position: var(--rwp-focus) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    transition: transform var(--rwp-dur-slow) var(--rwp-ease);
}

html[data-theme="dark"] :is(.rwp-card-thumb,
    .rwp-grid-card-thumb,
    .rwp-card-full-thumb,
    .rankwellpress-headlines-featured) img,
.rwp-footer :is(.rwp-card-thumb,
    .rwp-grid-card-thumb,
    .rwp-card-full-thumb,
    .rankwellpress-headlines-featured) img {
    filter: brightness(0.94);
}

.featured-story-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: var(--rwp-focus);
    transition: transform var(--rwp-dur-slow) var(--rwp-ease);
}

.rwp-card:hover .rwp-card-thumb img,
.rwp-grid-card:hover .rwp-grid-card-thumb img,
.rwp-card-full:hover .rwp-card-full-thumb img,
.rankwellpress-headlines-featured:hover img,
.featured-story:hover .featured-story-bg {
    transform: scale(1.035);
}

:is(.rwp-card-placeholder,
    .rankwellpress-headlines-featured-placeholder,
    .featured-story-bg--placeholder) {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.35), transparent 60%),
        var(--rwp-placeholder);
}

.featured-story-bg--placeholder {
    position: absolute;
    inset: 0;
}

.rwp-card-thumb {
    position: relative;
    flex: 0 0 var(--rwp-thumb);
    width: var(--rwp-thumb);
    height: var(--rwp-thumb);
    min-width: var(--rwp-thumb);
    min-height: var(--rwp-thumb);
    max-width: var(--rwp-thumb);
    max-height: var(--rwp-thumb);
    margin: 0;
    padding: 0;
    overflow: hidden;
    border-radius: var(--rwp-radius-media);
    background: var(--rwp-placeholder);
    box-sizing: border-box;
}

.rwp-card-thumb::after,
.rwp-grid-card-thumb::after,
.rwp-card-full-thumb::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14);
    pointer-events: none;
}

/* --- IMAGE SHAPES --- */
.rwp-card .rwp-card-thumb.rwp-card-thumb--rounded { border-radius: 12px !important; }
.rwp-card .rwp-card-thumb.rwp-card-thumb--circle { border-radius: 50% !important; }
.rwp-card .rwp-card-thumb.rwp-card-thumb--square { border-radius: 0 !important; }
.rwp-card .rwp-card-thumb.rwp-card-thumb--slant {
    border-radius: 5px !important;
    transform: skewX(-8deg) !important;
    overflow: hidden !important;
}
.rwp-card .rwp-card-thumb.rwp-card-thumb--slant img { transform: skewX(8deg) scale(1.15) !important; }
.rwp-card:hover .rwp-card-thumb.rwp-card-thumb--slant img { transform: skewX(8deg) scale(1.2) !important; }


/* =========================================================
 * 4. HORIZONTAL CARD
 * ========================================================= */

.rwp-card {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: var(--rwp-gap);
    margin: 0;
    padding: var(--rwp-pad);
}

.rwp-card.rwp-card-thumb-right { flex-direction: row-reverse !important; }
.rwp-card:has(.rwp-card-thumb-right) { flex-direction: row-reverse !important; }

/* ---- Global Premium List (Top List style) ---- */

:is(.flexnews-list, .rankwellpress-headlines-list) {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    gap: 0 !important;
    overflow: visible !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    counter-reset: rwp-rank;
    position: relative;
}

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card {
    position: relative;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    padding: 14px 10px !important;
    margin: 0 -10px !important;
    width: calc(100% + 20px) !important;
    background: transparent !important;
    border: none !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    box-sizing: border-box !important;
    transition: background-color 0.3s ease !important;
}

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card.rwp-card-thumb-right { flex-direction: row-reverse !important; }
:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card:has(.rwp-card-thumb-right) { flex-direction: row-reverse !important; }

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card:hover {
    background: var(--rwp-hover-bg) !important;
    box-shadow: none !important;
    transform: none !important;
    border-color: transparent !important;
}

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 3px;
    height: 0;
    border-radius: 3px;
    background: var(--rwp-accent);
    transform: translateY(-50%);
    transition: height 0.35s var(--rwp-ease);
    z-index: 2;
    pointer-events: none;
}

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card:hover::before { height: 46%; }

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card::after {
    content: "";
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--rwp-line) 12%, var(--rwp-line) 88%, transparent);
    transition: opacity 0.3s ease;
    pointer-events: none;
    z-index: 1;
}

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card:hover::after,
:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card:hover + .rwp-card::after { opacity: 0; }

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card:last-child::after { display: none; }

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card-thumb {
    flex: 0 0 var(--rwp-thumb) !important;
    width: var(--rwp-thumb) !important;
    height: var(--rwp-thumb) !important;
    min-width: var(--rwp-thumb) !important;
    min-height: var(--rwp-thumb) !important;
    max-width: var(--rwp-thumb) !important;
    max-height: var(--rwp-thumb) !important;
    border-radius: var(--rwp-radius-media) !important;
    overflow: hidden !important;
    background: var(--rwp-placeholder) !important;
    box-shadow: var(--rwp-shadow) !important;
    align-self: center !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
}

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card .rwp-card-thumb.rwp-card-thumb--rounded { border-radius: 12px !important; }
:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card .rwp-card-thumb.rwp-card-thumb--circle { border-radius: 50% !important; }
:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card .rwp-card-thumb.rwp-card-thumb--square { border-radius: 0 !important; }
:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card .rwp-card-thumb.rwp-card-thumb--slant {
    border-radius: 5px !important;
    transform: skewX(-8deg) !important;
    overflow: hidden !important;
}
:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card .rwp-card-thumb.rwp-card-thumb--slant img { transform: skewX(8deg) scale(1.15) !important; }
:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card:hover .rwp-card-thumb.rwp-card-thumb--slant img { transform: skewX(8deg) scale(1.2) !important; }

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card-thumb::after { box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.08) !important; }
html[data-theme="dark"] :is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card-thumb::after { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.10) !important; }

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card-thumb img {
    border-radius: 0 !important;
    transition: transform 0.6s var(--rwp-ease) !important;
}

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card:hover .rwp-card-thumb img { transform: scale(1.08) !important; }

/* =========================================================
 * 4b. CARD BODY — PHP WRAPPER FIX
 *
 * The PHP template wraps the badge and meta in a
 * `.rwp-card-subrow` div. We force BOTH the parent grid
 * and the subrow to be a 2-column grid, so the gap is
 * applied no matter what the AJAX template outputs.
 * ========================================================= */

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card-body {
    flex: 1 1 auto;
    min-width: 0;
    padding: 0;
    margin: 0;
    text-align: left;
    align-items: center;
}

.flexnews-row .rwp-card-body,
.rankwellpress-headlines-row .rwp-card-body,
.rwp-card-body {
    display: grid !important;
    grid-template-columns: max-content minmax(0, 1fr) !important;
    column-gap: 12px !important;
    row-gap: 6px;
    align-items: center;
    justify-content: start;
    justify-items: start;
    width: 100%;
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    padding: 0;
    text-align: left;
}

/* Force Title to span the full width */
.flexnews-row .rwp-card-body .rwp-card-title,
.rankwellpress-headlines-row .rwp-card-body .rwp-card-title,
.rwp-card-body .rwp-card-title {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    text-align: left;
    margin-bottom: 4px !important;
}

/* --- CRITICAL FIX: Force the PHP subrow wrapper to be a grid too --- */
.rwp-card-subrow,
.rwp-card-body .rwp-card-subrow {
    display: grid !important;
    grid-template-columns: max-content minmax(0, 1fr) !important;
    column-gap: 12px !important;
    row-gap: 0 !important;
    align-items: center !important;
    justify-content: start !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Ensure badge and meta inside the subrow behave correctly */
.rwp-card-subrow .rwp-card-badge,
.rwp-card-subrow .rankwellpress-headlines-category {
    grid-column: 1 !important;
    justify-self: start !important;
    align-self: center !important;
    width: auto !important;
    max-width: fit-content !important;
    display: inline-flex !important;
}

.rwp-card-subrow .rwp-card-meta,
.rwp-card-subrow .rankwellpress-headlines-meta {
    grid-column: 2 !important;
    justify-self: start !important;
    align-self: center !important;
    width: auto !important;
    max-width: fit-content !important;
    margin-left: 0 !important;
    display: inline-flex !important;
    white-space: nowrap !important;
}

/* If there's no badge, the meta should span both columns */
.rwp-card-subrow:not(:has(.rwp-card-badge)) .rwp-card-meta {
    grid-column: 1 / -1 !important;
}

/* Hide the bullet separator */
.rwp-card-subrow .rwp-card-badge + .rwp-card-meta::before { display: none !important; }


/* Title — SMALL POST TITLE
 * ─────────────────────────────────────────────────────────
 * Reads role token aliased from Compact Title Size/Weight.
 * Line-clamp reads Post Title Line Clamp.
 * ───────────────────────────────────────────────────────── */
:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card-title {
    font-size: var(--rwp-title-small-size) !important;
    font-weight: var(--rwp-title-small-weight) !important;
    line-height: 1.35 !important;
    letter-spacing: -0.005em !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--rwp-post-title) !important;
    display: -webkit-box !important;
    -webkit-line-clamp: var(--rwp-title-small-clamp) !important;
    line-clamp: var(--rwp-title-small-clamp) !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-wrap: pretty !important;
    width: 100% !important;
}

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card-title a {
    color: inherit !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card-title a:hover { color: var(--rwp-accent) !important; }

/* Meta */
:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card-meta {
    font-size: 0.68rem !important;
    font-weight: 600 !important;
    color: var(--rwp-muted) !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0 !important;
    letter-spacing: 0.02em !important;
    font-variant-numeric: tabular-nums !important;
    line-height: 1.4 !important;
    white-space: nowrap !important;
}

/* Category pill */
:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    background: rgba(255, 255, 255, 0.7) !important;
    -webkit-backdrop-filter: blur(10px) saturate(140%) !important;
    backdrop-filter: blur(10px) saturate(140%) !important;
    color: var(--rwp-accent) !important;
    border: 1px solid color-mix(in srgb, var(--rwp-accent) 22%, transparent) !important;
    border-radius: 999px !important;
    padding: 3px 10px !important;
    font-size: 0.6rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    box-shadow: none !important;
    text-decoration: none !important;
    width: fit-content !important;
    transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

:is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card-badge:hover {
    background: var(--rwp-accent) !important;
    color: #ffffff !important;
    border-color: var(--rwp-accent) !important;
}

html[data-theme="dark"] :is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card-badge,
.rwp-footer :is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card-badge {
    background: rgba(30, 41, 59, 0.7) !important;
    color: var(--rwp-accent) !important;
    border-color: color-mix(in srgb, var(--rwp-accent) 30%, transparent) !important;
}

/* Widget Title — WIDGET TITLE role
 * ─────────────────────────────────────────────────────────
 * Reads Widget Heading Size/Weight via alias.
 * ───────────────────────────────────────────────────────── */
:is(.rankwellpress-flex-news-widget, .rankwellpress-headlines-widget) .widget-title,
:is(.flexnews-list, .rankwellpress-headlines-list) .widget-title {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    font-size: var(--rwp-title-widget-size) !important;
    font-weight: var(--rwp-title-widget-weight) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.14em !important;
    color: var(--rwp-title-ink) !important;
    line-height: 1.2 !important;
    border: 0 !important;
    position: relative;
    background: none !important;
}

:is(.rankwellpress-flex-news-widget, .rankwellpress-headlines-widget) .widget-title::before {
    content: "";
    display: inline-block;
    width: 22px;
    height: 3px;
    border-radius: 3px;
    background: var(--rwp-title-accent);
    flex: 0 0 auto;
    position: static;
    transform: none;
}

:is(.rankwellpress-flex-news-widget, .rankwellpress-headlines-widget) .widget-title::after {
    content: "";
    display: block !important;
    flex: 1 1 auto;
    height: 1px;
    background: linear-gradient(90deg, var(--rwp-line), transparent);
    border-radius: 3px;
}

:is(.flexnews-list, .rankwellpress-headlines-list) .widget-title::after { display: none !important; }

.rwp-card--bordered { border-color: var(--rwp-edge-strong); }

/* Generic title/meta/badge styles (for grid/full cards too)
 * ─────────────────────────────────────────────────────────
 * .rwp-card-title inside a LIST container is Small Post Title
 * (handled above). This generic block is what GRID cards use,
 * which per the role model belong to LARGE POST TITLE.
 *
 * text-wrap: pretty — avoids orphaned words without forcing
 * a shorter first line. Replaces `balance`, which was
 * prematurely wrapping long headlines.
 * ───────────────────────────────────────────────────────── */
.rwp-card-title,
.rwp-card-full-title {
    margin: 0;
    padding: 0;
    font-size: var(--rwp-title-large-size);
    font-weight: var(--rwp-title-large-weight);
    line-height: 1.35;
    letter-spacing: -0.012em;
    text-wrap: pretty;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--rwp-title-large-clamp);
    line-clamp: var(--rwp-title-large-clamp);
    overflow: hidden;
}

.rwp-card-title a,
.rwp-card-full-title a {
    color: var(--rwp-post-title);
    text-decoration: none;
    transition: color var(--rwp-dur-fast) ease;
}

.rwp-card-title a:hover,
.rwp-card-full-title a:hover { color: var(--rwp-post-title-hover); }

.rwp-card-badge,
.rwp-card-full-badge a {
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 2px 9px;
    border: 0;
    border-radius: var(--rwp-radius-pill);
    background-color: var(--rwp-cat-bg);
    box-shadow: inset 0 0 0 1px var(--rwp-cat-ring);
    color: var(--rwp-cat);
    font-size: 0.6rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color var(--rwp-dur-fast) ease;
}

.rwp-card-badge:hover,
.rwp-card-full-badge a:hover { background-color: color-mix(in srgb, var(--rwp-cat) 15%, transparent); }

.rwp-card-meta,
.rwp-card-full-meta {
    display: inline-flex;
    align-items: center;
    gap: 0;
    margin: 0;
    padding: 0;
    justify-self: start;
    color: var(--rwp-muted);
    font-size: 0.7rem;
    font-weight: 450;
    line-height: 1.3;
    opacity: 0.9;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}


/* =========================================================
 * 5. GRID CARD — Featured News
 * ========================================================= */

.rwp-grid-card {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
}

.rwp-grid-card-thumb {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    border-radius: var(--rwp-card-media-radius);
    background: var(--rwp-placeholder);
    box-sizing: border-box;
}

.rwp-grid-card-body {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    grid-template-areas:
        "title title"
        "badge meta";
    align-items: center;
    column-gap: 12px !important;
    row-gap: 8px;
    padding: var(--rwp-body-pad);
    text-align: left;
    justify-content: start;
    justify-items: start;
}

.rwp-grid-card-body .rwp-card-title { grid-area: title; width: 100%; }
.rwp-grid-card-body .rwp-card-badge { grid-area: badge; }
.rwp-grid-card-body .rwp-card-meta  { grid-area: meta; }

.rwp-grid-card-body:not(:has(.rwp-card-badge)) .rwp-card-meta { grid-column: 1 / -1; }
.rwp-grid-card-body .rwp-card-badge + .rwp-card-meta::before { display: none !important; }


/* =========================================================
 * 6. FULL CARD — Hero Grid
 * ========================================================= */

.rwp-card-full {
    min-width: 0;
    overflow: hidden;
}

.rwp-card-full-thumb {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: var(--rwp-card-media-radius);
    background: var(--rwp-placeholder);
    box-sizing: border-box;
}

.rwp-card-full-body {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    grid-template-areas:
        "title   title"
        "badge   meta"
        "excerpt excerpt";
    align-items: center;
    column-gap: 12px !important;
    row-gap: 8px;
    padding: var(--rwp-body-pad);
    text-align: left;
    justify-content: start;
    justify-items: start;
}

.rwp-card-full-body .rwp-card-full-title,
.rwp-card-full-body .rwp-card-title      { grid-area: title; width: 100%; }
.rwp-card-full-body .rwp-card-full-badge,
.rwp-card-full-body .rwp-card-badge      { grid-area: badge; margin: 0; }
.rwp-card-full-body .rwp-card-full-meta,
.rwp-card-full-body .rwp-card-meta       { grid-area: meta; }

.rwp-card-full-body .rwp-card-full-badge + .rwp-card-full-meta::before,
.rwp-card-full-body .rwp-card-badge + .rwp-card-meta::before { display: none !important; }

.rwp-card-full-excerpt {
    grid-area: excerpt;
    width: 100%;
    margin: 2px 0 0;
    padding: 0;
    color: var(--rwp-muted);
    font-size: 0.875rem;
    line-height: 1.6;
    text-wrap: pretty;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    overflow: hidden;
}

/* Compact / Minimal variants — LARGE POST TITLE
 * ─────────────────────────────────────────────────────────
 * Both variants are full-width hero-grid cards, so per the
 * role model they read LARGE POST TITLE.
 * ───────────────────────────────────────────────────────── */
.rwp-card-full--compact .rwp-card-full-body  { padding-top: 10px; }
.rwp-card-full--compact .rwp-card-full-title {
    font-size: var(--rwp-title-large-size);
    font-weight: var(--rwp-title-large-weight);
}

.rwp-card-full--minimal .rwp-card-full-body  { padding-top: 8px; }
.rwp-card-full--minimal .rwp-card-full-title {
    font-size: var(--rwp-title-large-size);
    font-weight: var(--rwp-title-large-weight);
}


/* =========================================================
 * 7. OVERLAY CARDS — SCRIM DESIGN
 *
 * The old boxed glass panel was an opaque, blurred box that
 * hid the photo behind long titles. It is now a bottom gradient
 * scrim: the text sits on a fade, so the image stays visible
 * above and through it. Titles are NOT truncated.
 * ========================================================= */

.rankwellpress-headlines-featured,
.featured-story {
    position: relative;
    margin-bottom: 12px;
    overflow: hidden;
    isolation: isolate;
    aspect-ratio: 16 / 10;
    min-height: 200px;
    border-radius: var(--rwp-radius);
    background: var(--rwp-placeholder);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.12),
        0 6px 18px -12px rgba(15, 23, 42, 0.3);
}

.rankwellpress-headlines-featured > a:has(> img) { display: block; width: 100%; height: 100%; }

/* Light base darkening only; the content block carries its own scrim */
.featured-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(to top, rgba(8, 12, 20, 0.35) 0%, transparent 60%);
    pointer-events: none;
}

/* Scrim container: grid, anchored to the bottom, height capped */
.rankwellpress-headlines-featured-overlay,
.featured-content {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
    z-index: 2;
    padding: var(--rwp-scrim-pad);     /* top padding = gradient fade zone */
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: linear-gradient(
        to top,
        rgba(8, 12, 20, 0.90) 0%,
        rgba(8, 12, 20, 0.72) 45%,
        rgba(8, 12, 20, 0.35) 75%,
        transparent 100%
    );
    -webkit-backdrop-filter: none;
    backdrop-filter: none;

    display: grid !important;
    grid-template-columns: max-content minmax(0, 1fr) !important;
    column-gap: 12px !important;
    row-gap: 6px;
    align-content: end;
    text-align: left;
    justify-content: start;
    justify-items: start;
}

/* Force the overlay subrow to be a grid too */
.rankwellpress-headlines-featured-overlay .rwp-card-subrow,
.featured-content .rwp-card-subrow {
    display: grid !important;
    grid-template-columns: max-content minmax(0, 1fr) !important;
    column-gap: 12px !important;
    grid-column: 1 / -1 !important;
    width: 100% !important;
}

/* Title — LARGE POST TITLE
 * Overlay featured titles are hero-class cards, so they read
 * Post Title Size/Weight via the large role alias.
 *
 * text-wrap: pretty — natural line fill instead of balanced
 * wrapping, so long headlines don't wrap early. */
.rankwellpress-headlines-featured-title,
.featured-title {
    grid-column: 1 / -1 !important;
    width: 100%;
    margin: 0;
    font-size: var(--rwp-title-large-size);
    font-weight: var(--rwp-title-large-weight);
    line-height: 1.28;
    letter-spacing: -0.015em;
    text-wrap: pretty;
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.45);
}

.rankwellpress-headlines-featured-title a,
.featured-title a { color: var(--rwp-inverse); text-decoration: none; }

.rankwellpress-headlines-featured-title a:hover,
.featured-title a:hover { text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }

/* Badge: solid accent, readable on dark */
.rankwellpress-headlines-category,
.featured-badge,
.rankwellpress-headlines-featured-overlay .rwp-card-badge,
.featured-content .rwp-card-badge {
    display: inline-block;
    margin: 0;
    padding: 3px 10px !important;
    border: 0 !important;
    border-radius: var(--rwp-radius-pill);
    background: var(--rwp-accent) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
    color: #ffffff !important;
    font-size: 0.6rem !important;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    transition: filter var(--rwp-dur-fast) ease;
}

.rankwellpress-headlines-category:hover,
.featured-badge:hover,
.rankwellpress-headlines-featured-overlay .rwp-card-badge:hover,
.featured-content .rwp-card-badge:hover { filter: brightness(1.1); }

/* Meta on overlay */
.rankwellpress-headlines-meta,
.featured-meta,
.rankwellpress-headlines-featured-overlay .rwp-card-meta,
.featured-content .rwp-card-meta {
    display: inline-flex;
    align-items: center;
    gap: 0;
    margin: 0;
    padding: 0;
    color: rgba(255, 255, 255, 0.8) !important;
    font-size: 0.7rem !important;
    opacity: 1;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.rankwellpress-headlines-featured-overlay .rankwellpress-headlines-category + .rankwellpress-headlines-meta::before,
.featured-content .featured-badge + .featured-meta::before { display: none !important; }


/* =========================================================
 * 8. LAYOUT CONTAINERS
 * ========================================================= */

.rankwellpress-headlines-list,
.flexnews-list { display: flex; flex-direction: column; gap: 0; }

.news-grid { display: grid; grid-template-columns: 1fr; gap: var(--rwp-grid-gap); }
.news-grid > * { min-width: 0; max-width: 100%; }

@media (min-width: 480px) { .news-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 768px) { .news-grid { grid-template-columns: repeat(var(--grid-columns, 2), 1fr); } }

.rankwellpress-hero-grid { display: grid; grid-template-columns: 1fr; gap: var(--rwp-grid-gap); margin-bottom: 0; }
@media (min-width: 769px) { .rankwellpress-hero-grid { grid-template-columns: repeat(2, 1fr); } }


/* =========================================================
 * 9. LOAD MORE
 * ========================================================= */

.rankwellpress-headlines-load-more,
.flexnews-load-more-container,
.rankwellpress-load-more-wrapper { margin: 10px 0 18px; text-align: center; }

.rankwellpress-load-more-headlines,
.rankwellpress-headlines-load-more button,
.flexnews-load-more-container button,
.rankwellpress-load-more-wrapper button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 0;
    min-width: 0;
    height: auto;
    padding: 10px 20px;
    font-family: inherit;
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    border-radius: 8px;
    cursor: pointer;
    background: var(--rw-button-bg, #0d7c3e) !important;
    color: var(--rw-button-text, #ffffff) !important;
    border: 1px solid var(--rw-button-border, transparent) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    transition:
        background-color var(--rwp-dur-fast) ease,
        border-color var(--rwp-dur-fast) ease,
        transform var(--rwp-dur-fast) ease,
        opacity var(--rwp-dur-fast) ease;
}

.rankwellpress-load-more-headlines::after,
.rankwellpress-headlines-load-more button::after,
.flexnews-load-more-container button::after,
.rankwellpress-load-more-wrapper button::after {
    content: "›";
    display: inline-block;
    font-size: 1.2em;
    line-height: 1;
    transition: transform var(--rwp-dur-fast) ease;
}

.rankwellpress-load-more-headlines:hover,
.rankwellpress-headlines-load-more button:hover,
.flexnews-load-more-container button:hover,
.rankwellpress-load-more-wrapper button:hover {
    background: color-mix(in srgb, var(--rw-button-bg, #0d7c3e) 85%, #000000) !important;
    border-color: color-mix(in srgb, var(--rw-button-bg, #0d7c3e) 85%, #000000) !important;
}

.rankwellpress-load-more-headlines:hover::after,
.rankwellpress-headlines-load-more button:hover::after,
.flexnews-load-more-container button:hover::after,
.rankwellpress-load-more-wrapper button:hover::after { transform: translateX(2px); }

:is(.rankwellpress-load-more-headlines,
    .rankwellpress-headlines-load-more button,
    .flexnews-load-more-container button,
    .rankwellpress-load-more-wrapper button):is(.is-loading, [aria-busy="true"]) {
    cursor: progress;
    pointer-events: none;
    opacity: 0.75;
}

:is(.rankwellpress-load-more-headlines,
    .rankwellpress-headlines-load-more button,
    .flexnews-load-more-container button,
    .rankwellpress-load-more-wrapper button):is(.is-loading, [aria-busy="true"])::after {
    content: "";
    width: 10px;
    height: 10px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: rwp-spin 0.7s linear infinite;
}

:is(.rankwellpress-load-more-headlines,
    .rankwellpress-headlines-load-more button,
    .flexnews-load-more-container button,
    .rankwellpress-load-more-wrapper button):disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
}

html[data-theme="dark"] :is(
    .rankwellpress-load-more-headlines,
    .rankwellpress-headlines-load-more button,
    .flexnews-load-more-container button,
    .rankwellpress-load-more-wrapper button
):hover {
    background: color-mix(in srgb, var(--rw-button-bg, #000000) 90%, #ffffff) !important;
    border-color: rgba(255, 255, 255, 0.4) !important;
}


/* =========================================================
 * 10. MOTION
 * ========================================================= */

@keyframes rwp-rise { from { opacity: 0; transform: translateY(6px); } to   { opacity: 1; transform: translateY(0); } }
@keyframes rwp-spin { to { transform: rotate(360deg); } }

.rankwellpress-headlines-list > .rwp-card,
.flexnews-list > .rwp-card,
.news-grid > .rwp-grid-card,
.rankwellpress-hero-grid > .rwp-card-full { animation: rwp-rise var(--rwp-dur-slow) var(--rwp-ease) both; }

:is(.rankwellpress-headlines-list, .flexnews-list, .news-grid, .rankwellpress-hero-grid) > :nth-child(2) { animation-delay: 0.04s; }
:is(.rankwellpress-headlines-list, .flexnews-list, .news-grid, .rankwellpress-hero-grid) > :nth-child(3) { animation-delay: 0.08s; }
:is(.rankwellpress-headlines-list, .flexnews-list, .news-grid, .rankwellpress-hero-grid) > :nth-child(4) { animation-delay: 0.12s; }
:is(.rankwellpress-headlines-list, .flexnews-list, .news-grid, .rankwellpress-hero-grid) > :nth-child(n+5) { animation-delay: 0.16s; }


/* =========================================================
 * 11. ACCESSIBILITY · TOUCH · RESPONSIVE · REDUCED MOTION
 * ========================================================= */

:is(.rwp-card, .rwp-grid-card, .rwp-card-full, .rankwellpress-headlines-featured, .featured-story) a:focus-visible,
:is(.rankwellpress-load-more-headlines,
    .rankwellpress-headlines-load-more button,
    .flexnews-load-more-container button,
    .rankwellpress-load-more-wrapper button):focus-visible {
    outline: 2px solid var(--rwp-accent);
    outline-offset: 3px;
    border-radius: 6px;
}

@media (prefers-reduced-transparency: reduce) {
    :is(.rwp-card, .rwp-grid-card, .rwp-card-full) {
        background: var(--rwp-surface-solid);
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }
    .rankwellpress-headlines-featured-overlay,
    .featured-content {
        background: linear-gradient(to top, rgba(8, 12, 20, 0.95), rgba(8, 12, 20, 0.6) 70%, transparent);
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }
}

@media (hover: none) {
    .rwp-card:hover,
    .rwp-grid-card:hover,
    .rwp-card-full:hover {
        transform: none;
        box-shadow: inset 0 1px 0 var(--rwp-frost-edge), var(--rwp-shadow);
    }
    .rwp-card:hover .rwp-card-thumb img,
    .rwp-grid-card:hover .rwp-grid-card-thumb img,
    .rwp-card-full:hover .rwp-card-full-thumb img,
    .rankwellpress-headlines-featured:hover img,
    .featured-story:hover .featured-story-bg { transform: none; }
    :is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card:hover { background: transparent !important; }
    :is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card:hover::before { height: 0; }
}

@media (max-width: 768px) {
    :root { --rwp-section-gap: 18px; }
    .rankwellpress-hero-grid { gap: 12px; }
    .rwp-card .rwp-card-thumb.rwp-card-thumb--slant { transform: skewX(-5deg) !important; }
    .rwp-card .rwp-card-thumb.rwp-card-thumb--slant img { transform: skewX(5deg) scale(1.1) !important; }
}

@media (max-width: 480px) {
    :root {
        --rwp-thumb: 70px;
        --rwp-blur: 10px;
        --rwp-scrim-pad: 44px 14px 12px;
    }

    .flexnews-row .rwp-card-body,
    .rankwellpress-headlines-row .rwp-card-body,
    .rwp-card-body,
    .rwp-grid-card-body,
    .rwp-card-full-body { column-gap: 10px !important; row-gap: 4px; }

    /* Ensure the subrow gap is respected on mobile too */
    .rwp-card-subrow { column-gap: 10px !important; }

    :is(.rwp-card-meta, .rwp-card-full-meta) { font-size: 0.66rem; }
    .rwp-card-full-excerpt { font-size: 0.8rem; }

    /* Overlay title — LARGE POST TITLE × 0.85 on mobile */
    .rankwellpress-headlines-featured-title,
    .featured-title { font-size: calc(var(--rwp-title-large-size) * 0.85); }

    .rankwellpress-headlines-featured,
    .featured-story { min-height: 180px; }

    :is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card {
        gap: 12px !important;
        padding: 12px 8px !important;
        margin: 0 -8px !important;
        width: calc(100% + 16px) !important;
    }

    /* List card title — SMALL POST TITLE × 0.85 on mobile */
    :is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card-title {
        font-size: calc(var(--rwp-title-small-size) * 0.85) !important;
    }

    :is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card-badge { font-size: 0.56rem !important; padding: 3px 9px !important; }
    :is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card-meta { font-size: 0.64rem !important; }

    /* Widget title — WIDGET TITLE role, tighten letter-spacing only */
    :is(.rankwellpress-flex-news-widget, .rankwellpress-headlines-widget) .widget-title {
        letter-spacing: 0.12em !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
    }
    .rwp-card:hover,
    .rwp-grid-card:hover,
    .rwp-card-full:hover,
    .rwp-card:hover .rwp-card-thumb img,
    .rwp-grid-card:hover .rwp-grid-card-thumb img,
    .rwp-card-full:hover .rwp-card-full-thumb img,
    .rankwellpress-headlines-featured:hover img,
    .featured-story:hover .featured-story-bg { transform: none; }
    :is(.flexnews-list, .rankwellpress-headlines-list) .rwp-card::before { transition: none !important; }
}


/* Any RankwellPress widget inside a known dark section gets dark styling */
:is(.dark-section, .bg-dark, .dark-bg, [data-theme="dark"], .has-dark-background)
:is(.rankwellpress-headlines-widget,
    .rankwellpress-flex-news-widget,
    .rankwellpress-featured-news-widget,
    .rankwellpress-hero-grid-widget) {
    --rwp-post-title: #f1f5f9;
    --rwp-title-ink: #f8fafc;
    --rwp-title-ink-accent: var(--rwp-accent);
    --rwp-muted: #94a3b8;
    --rwp-surface-solid: #151b27;
    --rwp-surface: rgba(255, 255, 255, 0.05);
    --rwp-surface-hover: rgba(255, 255, 255, 0.08);
    --rwp-frost-edge: rgba(255, 255, 255, 0.10);
    --rwp-edge: rgba(255, 255, 255, 0.07);
    --rwp-edge-strong: rgba(255, 255, 255, 0.15);
    --rwp-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
    --rwp-shadow-hover: 0 8px 22px -12px rgba(0, 0, 0, 0.6);
    --rwp-placeholder: rgba(255, 255, 255, 0.06);
    --rwp-line: rgba(255, 255, 255, 0.08);
    --rwp-hover-bg: rgba(255, 255, 255, 0.05);
    --rwp-cat-bg: color-mix(in srgb, var(--rwp-accent) 20%, transparent);
    --rwp-cat-ring: color-mix(in srgb, var(--rwp-accent) 35%, transparent);
}

/* Dark pill for badge (list/grid cards only; overlay badges stay solid accent) */
:is(.dark-section, .bg-dark, .dark-bg, [data-theme="dark"], .has-dark-background)
:is(.rankwellpress-headlines-widget,
    .rankwellpress-flex-news-widget,
    .rankwellpress-featured-news-widget,
    .rankwellpress-hero-grid-widget)
.rwp-card-badge:not(.rankwellpress-headlines-featured-overlay .rwp-card-badge):not(.featured-content .rwp-card-badge) {
    background: rgba(30, 41, 59, 0.7) !important;
    border-color: color-mix(in srgb, var(--rwp-accent) 30%, transparent) !important;
}


/* --- headers/_base.css --- */
/* =========================================================
 * RankwellPress — Header Base Styles
 *
 * Shared primitives for ALL header layouts.
 * Nothing layout-specific lives here.
 *
 * Layout-specific files:
 *   - header-magazine.css  (floating pill, app-style)
 *   - header-default.css   (flat dark bar, classic)
 *   - header-centered.css  (minimal bar, ultra-clean)
 *
 * @package RankwellPress
 * @since   3.1.0
 * ========================================================= */

/* ============================================
   CONTAINER
   ============================================ */
.rwp-container {
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}

@media (min-width: 1025px) {
    .rwp-container { max-width: var(--rw-container-desktop, 1200px); }
}
@media (min-width: 768px) and (max-width: 1024px) {
    .rwp-container { max-width: var(--rw-container-tablet, 95%); padding: 0 15px; }
}
@media (max-width: 767px) {
    .rwp-container { max-width: 100%; padding: 0 20px; }
}

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

.rwp-skip-link {
    position: absolute;
    top: -100px;
    left: 6px;
    z-index: 100000;
    padding: 10px 16px;
    background: #ffffff;
    color: #111827;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 600;
    transition: top 0.2s ease;
}
.rwp-skip-link:focus {
    top: 6px;
}

/* ============================================
   TOP BAR — Shared by all layouts
   ============================================ */
.rwp-topbar {
    background: var(--rw-topbar-bg, #0f1e33);
    color: var(--rw-topbar-text, #f9fafb);
    font-size: 0.85rem;
    padding: 6px 0;
    position: relative;
    z-index: 1001;
}

.rwp-topbar-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 20px;
}

.rwp-topbar-nav ul {
    display: flex;
    list-style: none;
    gap: 20px;
    margin: 0;
    padding: 0;
}
.rwp-topbar-nav a {
    color: var(--rw-topbar-text, #f9fafb);
    text-decoration: none;
    transition: opacity var(--rw-transition-fast, 0.2s ease);
}
.rwp-topbar-nav a:hover { opacity: 0.8; }

.rwp-topbar-social-label { display: none; }
@media (min-width: 768px) {
    .rwp-topbar-social-label { display: inline; margin-left: 4px; }
}

@media (max-width: 480px) {
    .rwp-topbar-inner {
        justify-content: center;
        text-align: center;
    }
}

/* ============================================
   ICON BUTTON — Inline utility button
   Used for search, dark-mode, etc.
   ============================================ */
.rwp-btn-icon,
.rwp-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: currentColor;
    cursor: pointer;
    flex-shrink: 0;
    transition: background-color 0.2s ease;
}
.rwp-btn-icon:hover,
.rwp-icon-btn:hover {
    background-color: rgba(255, 255, 255, 0.15);
}

.rwp-btn-icon:focus-visible,
.rwp-icon-btn:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

/* ============================================
   FLOATING BUTTON — Circular/square icon
   Base styles apply at all breakpoints.
   Shape controlled by rwp-floating-* modifier.
   ============================================ */
.rwp-floating-circle {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: var(--rwp-mobile-icon-bg, #ffffff) !important;
    color: var(--rwp-mobile-icon-text, #111827) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    box-shadow: 0 2px 10px rgba(0, 0, 0, var(--rw-glass-glow, 0.12));
    cursor: pointer;
    margin: 0 !important;
    padding: 0;
    transition:
        border-radius var(--rw-transition-fast, 0.2s ease),
        transform var(--rw-transition-fast, 0.2s ease),
        background-color var(--rw-transition-fast, 0.2s ease),
        box-shadow var(--rw-transition-fast, 0.2s ease);
}

.rwp-floating-circle:active {
    transform: scale(0.96);
}

/* Shape modifiers — driven by rwp-floating-* class */
.rwp-floating-circle.rwp-floating-square   { border-radius: 8px; }
.rwp-floating-circle.rwp-floating-rounded  { border-radius: 12px; }
.rwp-floating-circle.rwp-floating-squircle { border-radius: 22%; }

/* ============================================
   FLOATING PILL — Container of 2+ icon buttons
   Wraps search + dark-mode in a single capsule.
   ============================================ */
.rwp-floating-pill {
    display: flex;
    align-items: center;
    gap: 0;
    padding: 1px;
    border-radius: 100px;
    background-color: var(--rwp-mobile-icon-bg, #ffffff);
    box-shadow: 0 2px 10px rgba(0, 0, 0, var(--rw-glass-glow, 0.12));
    margin: 0 !important;
}

.rwp-floating-pill .rwp-icon-btn,
.rwp-floating-pill .rwp-btn-icon {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: transparent !important;
    color: var(--rwp-mobile-icon-text, #111827) !important;
}
.rwp-floating-pill .rwp-icon-btn:active,
.rwp-floating-pill .rwp-btn-icon:active {
    background-color: rgba(0, 0, 0, 0.05) !important;
    transform: scale(0.96);
}

@media (max-width: 480px) {
    .rwp-floating-circle { width: 32px; height: 32px; }
    .rwp-floating-pill .rwp-icon-btn,
    .rwp-floating-pill .rwp-btn-icon { width: 28px; height: 28px; }
}

/* ============================================
   HAMBURGER ICON — Shared
   ============================================ */
.rwp-hamburger-icon {
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: 20px;
}
.rwp-hamburger-icon span {
    display: block;
    height: 2px;
    width: 100%;
    background-color: currentColor;
    border-radius: 2px;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

/* Two-line variant (minimal header) */
.rwp-hamburger-icon--two span:nth-child(3) { display: none; }

@media (max-width: 480px) {
    .rwp-hamburger-icon {
        gap: 3px;
        width: 16px;
    }
}

/* ============================================
   MOBILE DROPDOWNS — Menu + Search
   Shared behaviour; visual skin applied per-layout if needed.
   ============================================ */
.rwp-mobile-dropdown {
    position: fixed;
    top: 60px;
    left: 10px;
    right: 10px;
    width: auto;
    background: var(--rw-bg-content, #ffffff);
    border: 1px solid var(--rw-border-light, #e5e7eb);
    border-radius: 20px;
    padding: 20px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);
    z-index: 10000;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition:
        opacity 0.3s ease,
        transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275),
        visibility 0.3s;
    max-height: calc(100vh - 100px);
    overflow-y: auto;
}

.rwp-mobile-dropdown.is-open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.rwp-mobile-dropdown:not(.is-open) {
    pointer-events: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    z-index: -1 !important;
}

@media (min-width: 992px) {
    .rwp-mobile-dropdown { display: none !important; }
}

/* ============================================
   MOBILE SEARCH FORM — Used in dropdown + overlay
   ============================================ */
.rwp-mobile-search-form {
    display: flex;
    gap: 10px;
    margin: 0;
    width: 100%;
}

.rwp-mobile-search-input {
    flex: 1;
    min-width: 0;
    padding: 14px 16px;
    border-radius: 12px;
    border: 1px solid var(--rw-border-light, #e5e7eb);
    font-size: 16px;
    background: var(--rw-bg-content, #ffffff);
    color: var(--rw-text-body, #4b5563);
    outline: none;
    box-sizing: border-box;
    transition: border-color 0.2s ease;
}
.rwp-mobile-search-input:focus {
    border-color: var(--rw-color-primary, #0d7c3e);
}

.rwp-mobile-search-btn {
    background: var(--rw-color-primary, #0d7c3e);
    color: var(--rw-text-inverse, #ffffff);
    padding: 0 20px;
    border-radius: 12px;
    border: none;
    font-weight: 600;
    font-size: 15px;
    cursor: pointer;
    flex-shrink: 0;
    white-space: nowrap;
}

/* ============================================
   MOBILE MENU — Contents of the dropdown
   ============================================ */
.rwp-mobile-nav { margin-bottom: 15px; }

.rwp-mobile-primary-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}
.rwp-mobile-primary-menu li {
    border-bottom: 1px solid var(--rw-border-light, rgba(0, 0, 0, 0.05));
}
.rwp-mobile-primary-menu li:last-child { border-bottom: none; }

.rwp-mobile-primary-menu a {
    display: block;
    padding: 12px 0;
    color: var(--rw-text-heading, #111827);
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    transition: color 0.2s ease, padding-left 0.2s ease;
}
.rwp-mobile-primary-menu a:hover {
    color: var(--rw-color-primary, #0d7c3e);
    padding-left: 6px;
}

.rwp-mobile-menu-footer {
    border-top: 1px solid var(--rw-border-light, rgba(0, 0, 0, 0.05));
    padding-top: 15px;
}

.rwp-mobile-top-links {
    list-style: none;
    padding: 0;
    margin: 0 0 15px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: center;
}
.rwp-mobile-top-links a {
    color: var(--rw-text-muted, #6b7280);
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
}

.rwp-mobile-socials {
    display: flex;
    gap: 15px;
    justify-content: center;
}
.rwp-mobile-social-link {
    color: var(--rw-text-muted, #6b7280);
    transition: color 0.2s ease;
}
.rwp-mobile-social-link:hover {
    color: var(--rw-color-primary, #0d7c3e);
}

/* ============================================
   SEARCH OVERLAY — Fullscreen search
   ============================================ */
.rwp-search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.85);
    z-index: 10001;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 15vh;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}
.rwp-search-overlay[aria-hidden="false"] {
    opacity: 1;
    visibility: visible;
}

.rwp-search-box {
    width: 90%;
    max-width: 600px;
    position: relative;
}
.rwp-search-box .rwp-mobile-search-form { gap: 0; }
.rwp-search-box .rwp-mobile-search-input {
    border-radius: 8px 0 0 8px;
    border: none;
    padding: 16px 20px;
    font-size: 18px;
    background: #ffffff;
    color: #111827;
}
.rwp-search-box .rwp-mobile-search-btn {
    border-radius: 0 8px 8px 0;
    padding: 0 24px;
    font-size: 16px;
}

.rwp-search-close {
    position: absolute;
    top: -50px;
    right: 0;
    background: transparent;
    border: none;
    color: #ffffff;
    font-size: 32px;
    line-height: 1;
    padding: 0;
    cursor: pointer;
}
.rwp-search-close:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 4px;
}

/* ============================================
   SCROLL STATE — Contract only
   The `.scrolled` class hook lives here.
   Visual effect is defined per-header.
   ============================================ */
.rwp-header {
    transition: box-shadow 0.3s ease, background-color 0.3s ease;
}

/* ============================================
   NON-STICKY HEADER — overrides sticky position
   Applied when enable_sticky_header is off
   (body class added by functions.php filter).
   ============================================ */
body.rwp-no-sticky-header .rwp-header {
    position: static !important;
    top: auto !important;
}

/* ============================================
   DARK MODE — Shared dropdowns + inputs
   ============================================ */
html[data-theme="dark"] .rwp-mobile-dropdown {
    background: #1e293b !important;
    border-color: #334155 !important;
}
html[data-theme="dark"] .rwp-mobile-primary-menu a {
    color: #f8fafc !important;
}
html[data-theme="dark"] .rwp-mobile-primary-menu li {
    border-bottom-color: #334155 !important;
}
html[data-theme="dark"] .rwp-mobile-search-input {
    background: #1e293b !important;
    color: #f8fafc !important;
    border-color: #334155 !important;
}

/* --- components/_breadcrumbs.css --- */
/* ==========================================================================
   RankwellPress Pro
   Utility Section — Premium Editorial Version
   Rows aligned · Breaking · Currency · Breadcrumbs

   CUSTOMIZER WIRING — this revision
   ─────────────────────────────────────────────────────────
   Every colour that identifies the site's brand is wired to
   the theme's dynamic CSS variables. Presets, Customizer
   changes, and Reset Colours all affect these elements.

   Tokens read (from DynamicCSSCompiler output):
     --rw-bg-content             (content_bg_color)
     --rw-border-light           (border_color)
     --rw-text-heading           (heading_color)
     --rw-text-muted             (meta_text_color)
     --rw-text-inverse           (primary_text_color)
     --rw-color-primary          (primary_color)
     --rw-container-desktop      (container_width_desktop)

   Every var() keeps the previous hardcoded value as fallback,
   so rendering is identical if the CSS-vars pipeline ever
   fails to emit a token.

   DESIGN NOTES
   - Both ticker label pills (Breaking + Currency) read
     --rw-color-primary. They are the two most prominent
     chrome elements on the page; they should carry the
     site's brand colour, not the secondary badge colour.
   - Ticker item text reads --rw-text-heading (the same token
     used for article titles) — the ticker reads as headline
     chrome, not as meta text.
   - Breadcrumb colours are utility chrome — they follow text
     tokens, not brand. Only the hover state takes brand colour.
   - Dark-mode overrides keep working; they win by specificity
     after the variables resolve.

   VERTICAL RHYTHM
   - Row min-height is 34px desktop / 32px mobile. Tight enough
     to bring headlines up, tall enough to keep label pills and
     text breathing.
   - The section carries a normal 8px top margin (keeps the card
     off the header) and 12px bottom margin, then a "+ *" rule
     neutralises the top margin of the first block below it. That
     collapses the theme's default main-content padding into a
     tight 8px gap, without compressing the utility card itself.
   ========================================================================== */

.rwp-utility-section {
    background: var(--rw-bg-content, #fff);
    border: 1px solid color-mix(in srgb, var(--rw-border-light, #e5e7eb) 60%, transparent);
    border-radius: 8px;
    box-shadow:
        0 1px 2px rgba(15, 30, 51, 0.04),
        0 4px 12px rgba(15, 30, 51, 0.04);

    /* Symmetric sides, tight top, slightly larger bottom to
       separate the card from whatever follows. */
    margin: 8px auto 12px;
    max-width: var(--rw-container-desktop, 1200px);
    overflow: hidden;
    position: relative;
}

/* Subtle top accent */
.rwp-utility-section::before {
    content: "";
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    height: 2px;
    background: var(--rw-color-primary, #0d7c3e);
    opacity: .12;
}

/* Remove heavy left accent */
.rwp-utility-section::after {
    display: none;
}

/* ==========================================================================
   FLOW INTO CONTENT
   ─────────────────────────────────────────────────────────
   The utility section closes itself visually with a border,
   radius, and shadow — it doesn't need a large gap beneath it.
   Neutralise the top margin of the first block below so readers
   reach the stories sooner.

   Safe because:
     · `+ *` matches only the immediate next sibling, never
       descendants.
     · margin-top: 8px is a tighter value than the theme default
       (~24–48px combined padding + widget margin).
     · The section's own top margin, internal padding, and row
       heights are untouched.
   ========================================================================== */

.rwp-utility-section + * {
    margin-top: 8px;
}

.rwp-utility-section + .rwp-widget,
.rwp-utility-section + .widget,
.rwp-utility-section + section,
.rwp-utility-section + .rankwellpress-posts-wrapper,
.rwp-utility-section + .rankwellpress-hero-grid,
.rwp-utility-section + .rankwellpress-headlines-widget,
.rwp-utility-section + .rankwellpress-flex-news-widget,
.rwp-utility-section + .rankwellpress-featured-news-widget {
    margin-top: 8px;
}

/* ==========================================================================
   ROW RESET — consistent left alignment
   ========================================================================== */

.rwp-utility-section .rwp-breaking-news-ticker,
.rwp-utility-section .rwp-currency-ticker,
.rwp-utility-section .rankwellpress-breadcrumbs {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    margin: 0;
    padding: 0 10px !important;
    padding-left: 10px !important;
    box-sizing: border-box;
}

/* ==========================================================================
   CONSISTENT ROW HEIGHT
   34px desktop — tight enough to save vertical space, tall enough
   for label pills and legible ticker text.
   ========================================================================== */

.rwp-utility-section .rwp-breaking-news-ticker,
.rwp-utility-section .rwp-currency-ticker,
.rwp-utility-section .rankwellpress-breadcrumbs,
.rwp-utility-section .rankwellpress-breadcrumbs .rankwellpress-container,
.rwp-utility-section .rwp-currency-ticker-inner {
    min-height: 34px;
    display: flex;
    align-items: center;
}

/* ==========================================================================
   DIVIDERS
   Divider only between rows. On non-single views the currency
   ticker becomes the last row, so it shouldn't carry a trailing
   bottom border.
   ========================================================================== */

.rwp-utility-section .rwp-breaking-news-ticker:not(:last-child),
.rwp-utility-section .rwp-currency-ticker:not(:last-child) {
    border-bottom: 1px solid color-mix(in srgb, var(--rw-border-light, #e5e7eb) 40%, transparent);
}

/* ==========================================================================
   LABELS — aligned to the same left edge
   ========================================================================== */

.rwp-utility-section .rwp-ticker-label,
.rwp-utility-section .rwp-currency-ticker-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 5px 12px !important;
    margin-left: 0 !important;
    margin-right: 10px !important;

    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;

    border-radius: 6px;
    line-height: 1;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Both labels read the site's Primary Brand colour so they
   sit at the top of the visual hierarchy alongside the header,
   buttons, links, and other brand chrome. */
.rwp-utility-section .rwp-ticker-label,
.rwp-utility-section .rwp-currency-ticker-label {
    background: var(--rw-color-primary, #0d7c3e) !important;
    color: var(--rw-text-inverse, #ffffff) !important;
}

/* ==========================================================================
   BREAKING NEWS
   ========================================================================== */

.rwp-utility-section .rwp-ticker-viewport {
    flex: 1;
    overflow: hidden;
    display: flex;
    align-items: center;
    height: 100%;
}

.rwp-utility-section .rwp-ticker-track {
    display: flex;
    align-items: center;
    white-space: nowrap;
    will-change: transform;
    animation: rwpTickerScroll var(--rwp-ticker-speed, 28s) linear infinite;
}

.rwp-utility-section .rwp-ticker-viewport:hover .rwp-ticker-track {
    animation-play-state: paused;
}

.rwp-utility-section .rwp-ticker-item {
    display: flex;
    align-items: center;
    padding: 0 14px;
    position: relative;
}

.rwp-utility-section .rwp-ticker-item::after {
    content: "";
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--rw-color-primary, #0d7c3e) 45%, transparent);

    position: absolute;
    right: -2px;
    top: 50%;
    transform: translateY(-50%);
}

.rwp-utility-section .rwp-ticker-item:last-child::after {
    display: none;
}

.rwp-utility-section .rwp-ticker-item-link {
    color: var(--rw-text-heading, #0f1e33) !important;
    text-decoration: none !important;
    font-size: .86rem !important;
    font-weight: 600 !important;
    text-shadow: none !important;
    background: transparent !important;
}

.rwp-utility-section .rwp-ticker-item-link:hover,
.rwp-utility-section .rwp-ticker-item-link:focus-visible {
    color: var(--rw-color-primary, #0d7c3e) !important;
    text-decoration: underline !important;
}

/* ==========================================================================
   CURRENCY
   ========================================================================== */

.rwp-utility-section .rwp-currency-ticker-inner {
    width: 100%;
    display: flex;
    align-items: center;
    padding: 0 !important;
}

.rwp-utility-section .rwp-currency-ticker-wrapper {
    flex: 1;
    overflow: hidden;
}

.rwp-utility-section .rwp-currency-ticker-track {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    animation-name: rwp-ticker-scroll;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

.rwp-utility-section .rwp-currency-ticker-wrapper:hover .rwp-currency-ticker-track {
    animation-play-state: paused;
}

.rwp-utility-section .rwp-currency-ticker-item {
    display: inline-flex;
    align-items: center;

    font-size: .82rem;
    font-weight: 600;

    color: var(--rw-text-heading, #0f1e33) !important;
    -webkit-text-fill-color: var(--rw-text-heading, #0f1e33) !important;
}

.rwp-utility-section .rwp-currency-ticker-item strong {
    font-weight: 700;
    color: var(--rw-text-heading, #0f1e33) !important;
    -webkit-text-fill-color: var(--rw-text-heading, #0f1e33) !important;
}

.rwp-utility-section .rwp-currency-ticker-item::after {
    content: "•";
    margin: 0 10px;
    color: color-mix(in srgb, var(--rw-text-heading, #0f1e33) 35%, transparent);
}

.rwp-utility-section .rwp-currency-ticker-item:last-child::after {
    display: none;
}

/* ==========================================================================
   BREADCRUMB
   ========================================================================== */

.rwp-utility-section .rankwellpress-breadcrumbs {
    /* Neutral tint — intentionally not the brand colour.
       Breadcrumbs are wayfinding chrome, they should recede. */
    background: color-mix(in srgb, var(--rw-text-heading, #0f1e33) 2%, transparent);
}

.rwp-utility-section .rankwellpress-breadcrumbs .rankwellpress-container {
    width: 100%;
    padding: 0 !important;
    display: flex;
    align-items: center;
    height: 100%;
}

.rwp-utility-section .breadcrumb-inner {
    display: flex;
    align-items: center;
    gap: 6px;

    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;

    font-size: .82rem;
    width: 100%;
}

.rwp-utility-section .breadcrumb-item,
.rwp-utility-section .breadcrumb-item a {
    color: var(--rw-text-muted, #6b7280) !important;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

.rwp-utility-section .breadcrumb-item a:hover {
    color: var(--rw-color-primary, #0d7c3e) !important;
}

.rwp-utility-section .breadcrumb-current {
    color: var(--rw-text-heading, #0f1e33) !important;
    font-weight: 600;
}

.rwp-utility-section .breadcrumb-separator {
    color: var(--rw-border-light, #cbd5e1);
    margin: 0 2px;
    flex-shrink: 0;
}

/* ==========================================================================
   ANIMATIONS
   ========================================================================== */

@keyframes rwpTickerScroll {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

@keyframes rwp-ticker-scroll {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* ==========================================================================
   DARK MODE
   ========================================================================== */

html[data-theme="dark"] .rwp-utility-section {
    background: var(--rw-bg-content, #1b1f27);
    border-color: var(--rw-border-light, rgba(255,255,255,.08));

    box-shadow:
        0 1px 2px rgba(0,0,0,.25),
        0 4px 12px rgba(0,0,0,.20);
}

html[data-theme="dark"] .rankwellpress-breadcrumbs {
    background: rgba(255,255,255,.03);
}

html[data-theme="dark"] .rwp-ticker-item-link,
html[data-theme="dark"] .rwp-currency-ticker-item,
html[data-theme="dark"] .rwp-currency-ticker-item strong {
    color: var(--rw-text-heading, #f3f4f6) !important;
    -webkit-text-fill-color: var(--rw-text-heading, #f3f4f6) !important;
}

html[data-theme="dark"] .breadcrumb-item,
html[data-theme="dark"] .breadcrumb-item a {
    color: var(--rw-text-muted, #94a3b8) !important;
    -webkit-text-fill-color: var(--rw-text-muted, #94a3b8) !important;
}

html[data-theme="dark"] .breadcrumb-current {
    color: var(--rw-text-heading, #f8fafc) !important;
    -webkit-text-fill-color: var(--rw-text-heading, #f8fafc) !important;
}

html[data-theme="dark"] .breadcrumb-separator {
    color: var(--rw-border-light, #475569);
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 768px) {

    .rwp-utility-section {
        border-radius: 6px;
        margin: 6px auto 10px;
    }

    .rwp-utility-section .rwp-breaking-news-ticker,
    .rwp-utility-section .rwp-currency-ticker,
    .rwp-utility-section .rankwellpress-breadcrumbs,
    .rwp-utility-section .rankwellpress-breadcrumbs .rankwellpress-container,
    .rwp-utility-section .rwp-currency-ticker-inner {
        /* 32px mobile — tighter than desktop to save more fold
           space on small screens where every pixel counts. */
        min-height: 32px;
    }

    /* Keep left alignment on mobile */
    .rwp-utility-section .rwp-breaking-news-ticker,
    .rwp-utility-section .rwp-currency-ticker,
    .rwp-utility-section .rankwellpress-breadcrumbs {
        padding: 0 8px !important;
        padding-left: 8px !important;
    }

    .rwp-utility-section .rwp-ticker-label,
    .rwp-utility-section .rwp-currency-ticker-label {
        font-size: 10px !important;
        padding: 4px 10px !important;
        margin-left: 0 !important;
        margin-right: 8px !important;
        letter-spacing: .08em !important;
    }

    .rwp-utility-section .rwp-ticker-item-link {
        font-size: .78rem !important;
    }

    .rwp-utility-section .rwp-currency-ticker-item {
        font-size: .76rem;
    }

    .rwp-utility-section .breadcrumb-inner {
        font-size: .74rem;
    }

    /* Even tighter flow-into-content on mobile — first headline
       should be reachable with minimal thumb travel. */
    .rwp-utility-section + * {
        margin-top: 6px;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
    .rwp-utility-section .rwp-ticker-track,
    .rwp-utility-section .rwp-currency-ticker-track {
        animation: none !important;
    }
}

/* ==========================================================================
   PRINT
   ========================================================================== */

@media print {
    .rwp-utility-section {
        display: none !important;
    }
}
