/*
Theme Name: Rebgr Blog Theme
Theme URI: https://rebgr.com/
Description: A standalone premium blog theme with Apple-quality design.
Author: Rebgr
Version: 2.0.1
Text Domain: rebgr
*/

/* ==========================================================================
   1. Apple-Exact Design Tokens & CSS Variables (Rebgr Blog Theme)
   ========================================================================== */
:root {
	/* Apple Exact Core Colors */
	--vv-apple-blue: #0071e3;
	--vv-apple-blue-hover: #0077ed;
	--vv-apple-blue-light: #e8f0fd;
	--vv-apple-cyan: #06c;
	--vv-apple-purple: #bf5af2;
	--vv-apple-green: #34c759;
	--vv-apple-orange: #ff9500;

	/* Light Mode — Apple Paper White System */
	--vv-paper: #fbfbfd;
	--vv-surface: #ffffff;
	--vv-surface-2: #f5f5f7;
	--vv-ink: #1d1d1f;
	--vv-heading: #1d1d1f;
	--vv-muted: #6e6e73;
	--vv-subtle: #86868b;
	--vv-card-bg: #ffffff;
	--vv-border: rgba(0, 0, 0, 0.08);
	--vv-border-strong: rgba(0, 0, 0, 0.14);
	--vv-shadow: 0 2px 12px rgba(0, 0, 0, 0.04), 0 1px 3px rgba(0, 0, 0, 0.03);
	--vv-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.07), 0 2px 6px rgba(0, 0, 0, 0.04);
	--vv-shadow-hover: 0 20px 44px rgba(0, 0, 0, 0.10), 0 4px 12px rgba(0, 0, 0, 0.05);
	--vv-radius-sm: 10px;
	--vv-radius-md: 14px;
	--vv-radius-lg: 20px;
	--vv-radius-xl: 28px;

	/* Apple Frosted Glass Header */
	--vv-header-glass: rgba(255, 255, 255, 0.72);
	--vv-header-border: rgba(0, 0, 0, 0.10);
	--vv-header-text: #1d1d1f;
	--vv-header-hover-bg: rgba(0, 0, 0, 0.04);
	--vv-dropdown-glass: rgba(255, 255, 255, 0.92);

	/* Apple Typography — Inter + system stack */
	--vv-font-sans: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", system-ui, sans-serif;
	--vv-font-serif: "Noto Serif Tamil", "Georgia", serif;
	--vv-font-mono: "SF Mono", "Fira Code", monospace;

	/* Transitions */
	--vv-ease: cubic-bezier(0.25, 0.46, 0.45, 0.94);
	--vv-spring: cubic-bezier(0.16, 1, 0.3, 1);
}

/* Dark Mode Overrides — Apple True Black / Midnight System */
html[scheme="dark"] {
	--vv-paper: #000000;
	--vv-surface: #1c1c1e;
	--vv-surface-2: #2c2c2e;
	--vv-ink: #f5f5f7;
	--vv-heading: #ffffff;
	--vv-muted: #adadb8;
	--vv-subtle: #6e6e73;
	--vv-card-bg: #1c1c1e;
	--vv-border: rgba(255, 255, 255, 0.10);
	--vv-border-strong: rgba(255, 255, 255, 0.16);
	--vv-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
	--vv-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.6);
	--vv-shadow-hover: 0 20px 44px rgba(0, 0, 0, 0.75);

	--vv-header-glass: rgba(0, 0, 0, 0.75);
	--vv-header-border: rgba(255, 255, 255, 0.09);
	--vv-header-text: #f5f5f7;
	--vv-header-hover-bg: rgba(255, 255, 255, 0.07);
	--vv-dropdown-glass: rgba(28, 28, 30, 0.96);

	/* Override parent theme vars */
	--pt-body-color: #f5f5f7;
	--pt-body-bg-color: #000000;
	--pt-headings-color: #ffffff;
	--pt-card-bg: #1c1c1e;
	--pt-border-color: rgba(255, 255, 255, 0.10);
}

/* ==========================================================================
   2. Core Typography & Base — Apple Grade
   ========================================================================== */
html, body {
	margin: 0;
	padding: 0;
	font-family: var(--vv-font-sans);
	font-size: 17px;
	color: var(--vv-ink);
	background-color: var(--vv-paper);
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	font-feature-settings: "ss01", "cv01", "kern";
	transition: background-color 400ms ease, color 400ms ease;
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.site-title {
	font-family: var(--vv-font-sans);
	font-weight: 700;
	color: var(--vv-heading);
	letter-spacing: -0.022em;
	line-height: 1.2;
}

/* Apple uses tight negative tracking on display headings */
/* Heading sizes — kept modest so widgets/sidebar stay clean.
   Hero headline overrides applied in apple-premium.css for .rebgr-hero-headline */
h1 { font-size: clamp(1.6rem, 3vw, 2.25rem); letter-spacing: -0.02em; }
h2 { font-size: clamp(1.25rem, 2vw, 1.7rem); letter-spacing: -0.018em; }
h3 { font-size: clamp(1.05rem, 1.5vw, 1.3rem); }

a {
	color: var(--vv-apple-blue);
	text-decoration: none;
	transition: color 200ms var(--vv-ease), opacity 200ms var(--vv-ease);
}

a:hover, a:focus {
	color: var(--vv-apple-blue-hover);
	opacity: 0.9;
}

/* ==========================================================================
   3. Apple Frosted Glass Header — Ultra-Premium
   ========================================================================== */
#site-header,
.pt-header-layout-1 #site-header,
.site-header,
.pt-header-inner {
	background: var(--vv-header-glass) !important;
	backdrop-filter: saturate(180%) blur(20px) !important;
	-webkit-backdrop-filter: saturate(180%) blur(20px) !important;
	border-bottom: 0.5px solid var(--vv-header-border) !important;
	position: sticky !important;
	top: 0;
	z-index: 1000;
	transition: background 400ms var(--vv-ease), border-color 400ms var(--vv-ease);
}

.site-title a,
.site-branding .site-title a {
	font-family: var(--vv-font-sans);
	font-weight: 700;
	font-size: 1.5rem;
	letter-spacing: -0.02em;
	color: var(--vv-ink) !important;
}

/* Header Navigation Bar (Increased Legible Font Size) */
.blogsy-header-nav-wrapper {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.blogsy-header-nav {
	display: flex;
	align-items: center;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 0.45rem;
}

.blogsy-header-nav > li {
	position: relative;
}

.blogsy-header-nav > li > a,
.blogsy-header-nav > li > a span {
	display: inline-flex;
	align-items: center;
	padding: 0.55rem 1.1rem;
	color: var(--vv-header-text) !important;
	font-weight: 700;
	font-size: 0.92rem !important; /* Header nav — Apple standard size */
	border-radius: 20px;
	transition: all 200ms cubic-bezier(0.16, 1, 0.3, 1);
}

.blogsy-header-nav > li:hover > a,
.blogsy-header-nav > li > a:hover,
.blogsy-header-nav > li.current-menu-item > a {
	color: var(--vv-apple-blue) !important;
	background: var(--vv-header-hover-bg);
	transform: translateY(-1px);
}

html[scheme="dark"] .blogsy-header-nav > li:hover > a,
html[scheme="dark"] .blogsy-header-nav > li > a:hover,
html[scheme="dark"] .blogsy-header-nav > li.current-menu-item > a {
	color: var(--vv-apple-cyan) !important;
}

/* Animated Carets on Dropdown Items */
.blogsy-header-nav > li.menu-item-has-children > a::after,
.blogsy-header-nav > li.page_item_has_children > a::after {
	content: "▾";
	margin-left: 0.35rem;
	font-size: 0.85rem;
	transition: transform 250ms ease;
}

.blogsy-header-nav > li.menu-item-has-children:hover > a::after,
.blogsy-header-nav > li.page_item_has_children:hover > a::after {
	transform: rotate(180deg);
}

/* Submenu Dropdown Box (Frosted Glass) */
.blogsy-header-nav .sub-menu {
	position: absolute;
	top: calc(100% + 8px);
	left: 0;
	min-width: 240px;
	background: var(--vv-dropdown-glass) !important;
	backdrop-filter: blur(24px) saturate(190%) !important;
	-webkit-backdrop-filter: blur(24px) saturate(190%) !important;
	border: 1px solid var(--vv-border) !important;
	border-radius: 16px;
	padding: 0.65rem;
	margin: 0;
	list-style: none;
	box-shadow: var(--vv-shadow-hover);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px) scale(0.98);
	transition: all 220ms cubic-bezier(0.16, 1, 0.3, 1);
	z-index: 999;
}

.blogsy-header-nav > li:hover > .sub-menu,
.blogsy-header-nav > li.hovered > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0) scale(1);
}

.blogsy-header-nav .sub-menu li a {
	display: block;
	padding: 0.65rem 1.1rem;
	color: var(--vv-ink) !important;
	font-size: 0.875rem !important; /* Submenu — slightly smaller than nav */
	font-weight: 600;
	border-radius: 10px;
	transition: all 180ms ease;
}

.blogsy-header-nav .sub-menu li a:hover {
	color: var(--vv-apple-blue) !important;
	background: var(--vv-header-hover-bg);
	transform: translateX(4px);
}

html[scheme="dark"] .blogsy-header-nav .sub-menu li a:hover {
	color: var(--vv-apple-cyan) !important;
}

/* ==========================================================================
   4. Apple-Style Footer — Exact Apple.com Footer
   ========================================================================== */
#site-footer,
.vision-vectors-footer,
.vv-apple-footer,
.vv-site-footer {
	background: #f5f5f7 !important;
	color: #1d1d1f !important;
	border-top: 0.5px solid rgba(0, 0, 0, 0.16) !important;
	padding-top: 3rem;
	padding-bottom: 1.5rem;
}

html[scheme="dark"] #site-footer,
html[scheme="dark"] .vision-vectors-footer,
html[scheme="dark"] .vv-site-footer {
	background: #161617 !important;
	color: #f5f5f7 !important;
	border-top-color: rgba(255, 255, 255, 0.09) !important;
}

.vv-footer-container {
	display: flex;
	flex-direction: column;
	gap: 3rem;
}

.vv-footer-grid {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1.2fr;
	gap: 3rem;
}

.vv-footer-brand .vv-footer-logo a {
	font-family: var(--vv-font-sans);
	font-weight: 800;
	font-size: 2rem; /* Larger footer logo */
	letter-spacing: -0.02em;
	background: linear-gradient(135deg, #38bdf8 0%, #a855f7 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.vv-footer-desc {
	color: #94a3b8;
	font-size: 1.05rem; /* Larger footer description */
	line-height: 1.65;
	margin: 0.8rem 0 1.4rem;
}

.vv-footer-badge-pill {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	background: rgba(56, 189, 248, 0.1);
	border: 1px solid rgba(56, 189, 248, 0.25);
	border-radius: 30px;
	padding: 0.5rem 1.1rem;
}

.vv-badge-dot {
	width: 8px;
	height: 8px;
	background: #38bdf8;
	border-radius: 50%;
	box-shadow: 0 0 10px #38bdf8;
	animation: vv-pulse 2s infinite;
}

@keyframes vv-pulse {
	0%, 100% { transform: scale(1); opacity: 1; }
	50% { transform: scale(1.3); opacity: 0.6; }
}

.vv-badge-text {
	color: #38bdf8;
	font-family: var(--vv-font-serif);
	font-weight: 700;
	font-size: 1.05rem; /* Larger motto font size */
}

.vv-footer-heading {
	color: #ffffff;
	font-family: var(--vv-font-serif);
	font-size: 0.75rem; /* Apple-style footer headings — small-caps label */
	font-weight: 700;
	margin-bottom: 1.2rem;
	position: relative;
	padding-bottom: 0.5rem;
}

.vv-footer-heading::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 36px;
	height: 2px;
	background: var(--vv-apple-cyan);
	border-radius: 2px;
}

.vv-footer-links {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.vv-footer-links li a {
	color: #cbd5e1 !important;
	font-size: 0.875rem !important; /* Footer links — clean small size */
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	transition: all 200ms cubic-bezier(0.16, 1, 0.3, 1);
}

.vv-arrow {
	color: var(--vv-apple-cyan);
	opacity: 0.7;
	transition: transform 200ms ease, opacity 200ms ease;
}

.vv-footer-links li a:hover {
	color: #ffffff !important;
	transform: translateX(6px);
}

.vv-footer-links li a:hover .vv-arrow {
	opacity: 1;
	transform: translateX(3px);
}

/* Footer Bottom Bar */
.vv-footer-bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: 1.8rem;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	color: #94a3b8;
	font-size: 0.95rem;
}

.vv-copyright-text strong {
	color: #e2e8f0;
}

.vv-footer-tag span {
	color: var(--vv-apple-cyan);
	font-weight: 600;
}

/* ==========================================================================
   5. Supercool Card Micro-Animations
   ========================================================================== */
.blog .post,
.archive .post,
.search .post,
.blogsy-post-grid article,
.card-layout {
	background-color: var(--vv-card-bg);
	border: 1px solid var(--vv-border);
	border-radius: 18px;
	overflow: hidden;
	box-shadow: var(--vv-shadow);
	transition: transform 350ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 350ms cubic-bezier(0.16, 1, 0.3, 1), background-color 300ms ease;
}

.blog .post:hover,
.archive .post:hover,
.search .post:hover,
.blogsy-post-grid article:hover {
	transform: translateY(-6px) scale(1.008);
	box-shadow: var(--vv-shadow-hover);
}

.post-thumbnail,
.post-thumbnail img,
.wp-post-image {
	border-radius: 14px;
	overflow: hidden;
	transition: transform 500ms cubic-bezier(0.16, 1, 0.3, 1);
}

.blog .post:hover .post-thumbnail img,
.archive .post:hover .post-thumbnail img,
.blogsy-post-grid article:hover .wp-post-image {
	transform: scale(1.04);
}

/* ==========================================================================
   6. Single Post Editorial Luxury Overhaul & Archive Pagination
   ========================================================================== */
.single-post-wrapper {
	padding: 2.5rem 0 4rem;
}

.single-content {
	background: var(--vv-card-bg);
	border: 1px solid var(--vv-border);
	border-radius: 20px;
	padding: 2.5rem 3rem;
	box-shadow: var(--vv-shadow);
	margin-bottom: 2.5rem;
}

.single-content-inner {
	font-size: 1.15rem;
	line-height: 1.9;
	color: var(--vv-ink);
}

.single-content-inner p {
	margin-bottom: 1.6em;
}

.single-hero-inside,
.entry-header {
	margin-bottom: 2rem;
	padding-bottom: 1.5rem;
	border-bottom: 1px solid var(--vv-border);
}

.entry-title {
	font-size: clamp(2rem, 4vw, 2.75rem);
	font-weight: 800;
	line-height: 1.3;
	margin-bottom: 1rem;
	color: var(--vv-heading);
}

/* Post Blockquote Styling */
.single-content blockquote {
	margin: 2.2rem 0;
	padding: 1.4rem 1.8rem;
	border-left: 4px solid var(--vv-apple-cyan);
	background: rgba(56, 189, 248, 0.07);
	border-radius: 0 16px 16px 0;
	font-family: var(--vv-font-serif);
	font-size: 1.22rem;
	font-style: italic;
	color: var(--vv-heading);
}

/* Author Box & Comment Cards */
.author-box,
.comments-area,
.nav-links,
.navigation.post-navigation {
	background: var(--vv-card-bg);
	border: 1px solid var(--vv-border);
	border-radius: 18px;
	padding: 1.8rem 2rem;
	box-shadow: var(--vv-shadow);
	margin-bottom: 2rem;
}

/* Archive Pagination Styling */
.nav-links,
.pagination,
.page-numbers {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	margin: 2.5rem 0;
	list-style: none;
	padding: 0;
}

.page-numbers a,
.page-numbers span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.6rem;
	height: 2.6rem;
	padding: 0 0.8rem;
	border-radius: 12px;
	border: 1px solid var(--vv-border);
	background: var(--vv-card-bg);
	color: var(--vv-ink);
	font-weight: 700;
	font-size: 1.05rem;
	transition: all 200ms ease;
}

.page-numbers a:hover,
.page-numbers .current {
	background: var(--vv-apple-blue);
	color: #ffffff !important;
	border-color: var(--vv-apple-blue);
	transform: translateY(-2px);
	box-shadow: 0 6px 16px rgba(0, 113, 227, 0.25);
}

html[scheme="dark"] .page-numbers a:hover,
html[scheme="dark"] .page-numbers .current {
	background: var(--vv-apple-cyan);
	color: #0f172a !important;
	border-color: var(--vv-apple-cyan);
}

/* ==========================================================================
   7. Responsive Layout Adjustments
   ========================================================================== */
@media (max-width: 900px) {
	.vv-footer-grid {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.vv-footer-bottom {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.8rem;
	}
}

/* Paginated Archives / Time Capsule Accordion widget */
.vv-time-capsule {
	margin: 0;
	padding: 0;
}

.vv-archives__year-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.vv-archives__year-item {
	border-bottom: 1px dashed rgba(0, 0, 0, 0.08);
	margin-bottom: 6px;
	padding-bottom: 6px;
}

.vv-archives__year-item:last-child {
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 0;
}

.vv-archives__year-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 6px 8px;
	border-radius: 8px;
	transition: background 0.2s ease;
}

.vv-archives__year-header:hover {
	background: rgba(124, 58, 237, 0.06);
}

.vv-archives__year-header.is-active-year {
	background: rgba(124, 58, 237, 0.1);
}

.vv-archives__year-link {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-grow: 1;
	color: var(--vv-ink, #1f2937);
	font-weight: 700;
	font-size: 1rem;
	text-decoration: none;
}

.vv-archives__year-link:hover,
.vv-archives__year-link.is-active {
	color: #7c3aed;
}

.vv-archives__toggle {
	background: transparent;
	border: none;
	cursor: pointer;
	padding: 6px 8px;
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #6b7280;
	transition: transform 0.25s ease, background 0.2s ease, color 0.2s ease;
}

.vv-archives__toggle:hover {
	background: rgba(124, 58, 237, 0.12);
	color: #7c3aed;
}

.vv-archives__chevron {
	transition: transform 0.25s ease;
}

.vv-archives__year-item.is-open .vv-archives__chevron {
	transform: rotate(180deg);
}

.vv-archives__month-list {
	margin: 4px 0 6px 12px;
	padding: 4px 0 4px 12px;
	list-style: none;
	border-left: 2px solid rgba(124, 58, 237, 0.2);
}

.vv-archives__month-item {
	margin-bottom: 3px;
}

.vv-archives__month-item:last-child {
	margin-bottom: 0;
}

.vv-archives__month-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 5px 10px;
	border-radius: 6px;
	color: var(--vv-muted, #4b5563);
	font-size: 0.9rem;
	font-weight: 500;
	text-decoration: none;
	transition: all 0.2s ease;
}

.vv-archives__month-link:hover {
	background: rgba(124, 58, 237, 0.08);
	color: #7c3aed;
	padding-left: 14px;
}

.vv-archives__month-link.is-active {
	background: #7c3aed;
	color: #ffffff !important;
	font-weight: 700;
}

.vv-archives__month-link.is-active .vv-archives__count {
	background: rgba(255, 255, 255, 0.25);
	color: #ffffff;
	border-color: transparent;
}

.vv-archives__count {
	min-width: 1.6rem;
	padding: 0.1rem 0.45rem;
	border: 1px solid rgba(124, 58, 237, 0.25);
	border-radius: 999px;
	color: #7c3aed;
	background: rgba(124, 58, 237, 0.06);
	font-size: 0.78rem;
	font-weight: 700;
	line-height: 1.35;
	text-align: center;
}

/* Explicit Arrow Controls for Coverflow Carousels */
.coverflow-wrapper .cf-controls,
.pyml-coverflow-wrapper .cf-controls {
	pointer-events: none;
	position: absolute;
	top: 45%;
	left: 0;
	right: 0;
	transform: translateY(-50%);
	display: flex;
	justify-content: space-between;
	padding: 0 16px;
	z-index: 99;
}

.cf-btn,
.rebgr-cf-btn {
	pointer-events: auto !important;
	width: 52px !important;
	height: 52px !important;
	border-radius: 50% !important;
	border: 2.5px solid #7c3aed !important;
	background: #ffffff !important;
	color: #7c3aed !important;
	box-shadow: 0 4px 20px rgba(124, 58, 237, 0.35) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	opacity: 1 !important;
	visibility: visible !important;
	cursor: pointer !important;
	z-index: 100 !important;
	transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.cf-btn svg,
.rebgr-cf-btn svg {
	width: 24px !important;
	height: 24px !important;
	stroke: #7c3aed !important;
	stroke-width: 3.5px !important;
	fill: none !important;
	display: block !important;
	transition: stroke 0.2s ease, transform 0.2s ease !important;
}

.cf-btn:hover,
.rebgr-cf-btn:hover {
	background: #7c3aed !important;
	border-color: #7c3aed !important;
	color: #ffffff !important;
	transform: scale(1.14) !important;
	box-shadow: 0 8px 24px rgba(124, 58, 237, 0.5) !important;
}

.cf-btn:hover svg,
.rebgr-cf-btn:hover svg {
	stroke: #ffffff !important;
}

/* Dark Theme overrides for Coverflow Arrow Buttons */
html[scheme="dark"] .cf-btn,
html[scheme="dark"] .rebgr-cf-btn {
	background: #1e1e2e !important;
	border-color: #a78bfa !important;
	color: #a78bfa !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6) !important;
}

html[scheme="dark"] .cf-btn svg,
html[scheme="dark"] .rebgr-cf-btn svg {
	stroke: #a78bfa !important;
}

html[scheme="dark"] .cf-btn:hover,
html[scheme="dark"] .rebgr-cf-btn:hover {
	background: #7c3aed !important;
	border-color: #7c3aed !important;
}

html[scheme="dark"] .cf-btn:hover svg,
html[scheme="dark"] .rebgr-cf-btn:hover svg {
	stroke: #ffffff !important;
}

/* Brand artwork supplied for Vision Vectors; animated variants load on intent. */
.vv-logo-inner {
	display: flex;
	align-items: center;
}

.vv-brand-logo {
	display: block;
	border-radius: 0.7rem;
	outline-offset: 5px;
}

.vv-brand-logo__art {
	display: block;
	width: clamp(10.5rem, 18vw, 14rem);
	aspect-ratio: 16 / 9;
	background: center / contain no-repeat url("assets/images/branding/logo-light.png");
}

html[scheme="dark"] .vv-brand-logo__art {
	background-image: url("assets/images/branding/logo-dark.png");
}

.vv-brand-logo--animated .vv-brand-logo__art {
	background-image: url("assets/images/branding/logo-animated-light.gif");
}

html[scheme="dark"] .vv-brand-logo--animated .vv-brand-logo__art {
	background-image: url("assets/images/branding/logo-animated-dark.gif");
}

@media (max-width: 600px) {
	.vv-brand-logo__art {
		width: 9rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.vv-brand-logo--animated .vv-brand-logo__art {
		background-image: url("assets/images/branding/logo-light.png");
	}

	html[scheme="dark"] .vv-brand-logo--animated .vv-brand-logo__art {
		background-image: url("assets/images/branding/logo-dark.png");
	}
}

/* ==========================================================================
   Post Card Overhaul: Overlapping Floating Photo ("Secondshot") & Reduced Font Sizes
   ========================================================================== */

/* Main Card Container */
.default-post-list-item.card-layout,
.post-wrapper.card-layout,
article.card-layout {
	background-color: var(--vv-card-bg, #ffffff) !important;
	border: 1px solid var(--vv-border, rgba(0, 0, 0, 0.08)) !important;
	border-radius: 24px !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04), 0 2px 6px rgba(0, 0, 0, 0.02) !important;
	overflow: visible !important;
	position: relative !important;
	margin-left: 45px !important;
	margin-bottom: 2.2rem !important;
	transition: transform 300ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 300ms cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.default-post-list-item.card-layout:hover,
.post-wrapper.card-layout:hover,
article.card-layout:hover {
	transform: translateY(-4px) !important;
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.08), 0 4px 12px rgba(0, 0, 0, 0.04) !important;
}

/* Inner Layout Flex Wrapper */
.default-post-list-item .post-wrapper-inner,
.post-wrapper.card-layout .post-wrapper-inner {
	display: flex !important;
	align-items: center !important;
	gap: 2rem !important;
	padding: 1.5rem 2rem 1.5rem 0 !important;
	overflow: visible !important;
}

/* Overlapping Pop-Out Floating Photo Container (Secondshot Target Style) */
.default-post-list-item .image-container,
.post-wrapper.card-layout .image-container {
	margin-left: -48px !important;
	flex-shrink: 0 !important;
	width: 290px !important;
	max-width: 42% !important;
	border-radius: 20px !important;
	box-shadow: 0 14px 30px -4px rgba(0, 0, 0, 0.22), 0 4px 12px rgba(0, 0, 0, 0.1) !important;
	overflow: hidden !important;
	position: relative !important;
	z-index: 2 !important;
	transition: transform 350ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 350ms cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.default-post-list-item:hover .image-container,
.post-wrapper.card-layout:hover .image-container {
	transform: translateY(-3px) scale(1.015) !important;
	box-shadow: 0 20px 40px -4px rgba(0, 0, 0, 0.28), 0 6px 16px rgba(0, 0, 0, 0.12) !important;
}

.default-post-list-item .image-container img,
.post-wrapper.card-layout .image-container img {
	width: 100% !important;
	height: 100% !important;
	aspect-ratio: 16 / 11 !important;
	object-fit: cover !important;
	border-radius: 20px !important;
	display: block !important;
	transition: transform 500ms ease !important;
}

.default-post-list-item:hover .image-container img,
.post-wrapper.card-layout:hover .image-container img {
	transform: scale(1.05) !important;
}

/* Content Container */
.default-post-list-item .content-container,
.post-wrapper.card-layout .content-container {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 0.6rem !important;
	padding-right: 0.5rem !important;
}

/* Category Pill Badges (Top of Content) */
.default-post-list-item .terms-wrapper.terms-pills,
.default-post-list-item .terms-wrapper,
.post-wrapper.card-layout .terms-wrapper {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 0.45rem !important;
	margin-bottom: 0.35rem !important;
}

.default-post-list-item .term-item.term-pill,
.default-post-list-item .terms-wrapper a,
.post-wrapper.card-layout .terms-wrapper a {
	display: inline-flex !important;
	align-items: center !important;
	padding: 0.3rem 0.9rem !important;
	border-radius: 20px !important;
	background-color: #dbeafe !important;
	color: #2563eb !important;
	font-size: 0.78rem !important; /* Decreased Pill Font Size */
	font-weight: 600 !important;
	line-height: 1.3 !important;
	text-decoration: none !important;
	transition: all 200ms ease !important;
	border: none !important;
}

.default-post-list-item .terms-wrapper a:hover,
.post-wrapper.card-layout .terms-wrapper a:hover {
	background-color: #2563eb !important;
	color: #ffffff !important;
	transform: translateY(-1px) !important;
}

html[scheme="dark"] .default-post-list-item .term-item.term-pill,
html[scheme="dark"] .default-post-list-item .terms-wrapper a {
	background-color: rgba(56, 189, 248, 0.15) !important;
	color: #38bdf8 !important;
}

html[scheme="dark"] .default-post-list-item .terms-wrapper a:hover {
	background-color: #38bdf8 !important;
	color: #0f172a !important;
}

/* Significantly Decreased Card Title Font Size */
.default-post-list-item .title,
.default-post-list-item .title a,
.post-wrapper.card-layout .title,
.post-wrapper.card-layout .title a {
	font-family: var(--vv-font-sans, system-ui, sans-serif) !important;
	font-size: 1.22rem !important; /* Decreased from ~28px to ~19.5px */
	font-weight: 700 !important;
	line-height: 1.38 !important;
	color: var(--vv-heading, #1e293b) !important;
	margin: 0 !important;
	letter-spacing: -0.01em !important;
	transition: color 200ms ease !important;
}

.default-post-list-item .title a:hover,
.post-wrapper.card-layout .title a:hover {
	color: var(--vv-apple-blue, #0071e3) !important;
}

html[scheme="dark"] .default-post-list-item .title a:hover {
	color: var(--vv-apple-cyan, #38bdf8) !important;
}

/* Decreased Excerpt Font Size */
.default-post-list-item .excerpt,
.post-wrapper.card-layout .excerpt,
.post-wrapper.card-layout .excerpt p {
	font-size: 0.92rem !important; /* Decreased excerpt font size to ~14.7px */
	line-height: 1.62 !important;
	color: var(--vv-muted, #475569) !important;
	margin: 0.2rem 0 0.4rem 0 !important;
	display: -webkit-box !important;
	-webkit-line-clamp: 3 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
}

/* Footer Author & Date Meta Row */
.default-post-list-item .card-author-date-footer,
.post-wrapper.card-layout .card-author-date-footer {
	display: flex !important;
	align-items: center !important;
	gap: 0.5rem !important;
	font-size: 0.85rem !important; /* Clean small footer font */
	font-weight: 600 !important;
	color: var(--vv-muted, #64748b) !important;
	margin-top: 0.3rem !important;
}

.default-post-list-item .card-author-date-footer .author-name {
	color: var(--vv-heading, #334155) !important;
}

.default-post-list-item .card-author-date-footer .meta-dot {
	color: #cbd5e1 !important;
	font-weight: 400 !important;
}

.default-post-list-item .card-author-date-footer .date {
	color: var(--vv-muted, #64748b) !important;
}

/* Responsive Layout Adjustments for Mobile & Tablet */
@media (max-width: 768px) {
	.default-post-list-item.card-layout,
	.post-wrapper.card-layout,
	article.card-layout {
		margin-left: 0 !important;
		border-radius: 18px !important;
	}

	.default-post-list-item .post-wrapper-inner,
	.post-wrapper.card-layout .post-wrapper-inner {
		flex-direction: column !important;
		padding: 1.2rem !important;
		gap: 1.2rem !important;
	}

	.default-post-list-item .image-container,
	.post-wrapper.card-layout .image-container {
		margin-left: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		border-radius: 14px !important;
	}

	.default-post-list-item .title a,
	.post-wrapper.card-layout .title a {
		font-size: 1.12rem !important;
	}
}

/* ==========================================================================
   Header Luxury Overhaul & Complete Fix
   ========================================================================== */

/* Main Header Container */
#site-header,
.vv-site-header,
.site-header,
.rebgr-header {
	position: sticky !important;
	top: 0 !important;
	z-index: 99999 !important;
	background: #ffffff !important;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important;
	transition: background-color 200ms ease, border-color 200ms ease, box-shadow 200ms ease !important;
}

html[scheme="dark"] #site-header,
html[scheme="dark"] .vv-site-header,
html[scheme="dark"] .rebgr-header,
html[data-theme="dark"] #site-header {
	background: #0f172a !important;
	border-bottom-color: rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35) !important;
}

/* Header Shell Grid / Flex Layout */
.vv-header-shell,
#site-header .vv-header-shell,
.rebgr-header-shell {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 1.5rem !important;
	width: 100% !important;
	max-width: 1360px !important;
	margin: 0 auto !important;
	padding: 0 1.5rem !important;
	height: 64px !important;
	min-height: 64px !important;
	box-sizing: border-box !important;
}

/* Logo Section */
.vv-header-brand,
.rebgr-header-brand,
.pt-logo,
#site-header .pt-logo {
	display: flex !important;
	align-items: center !important;
	flex-shrink: 0 !important;
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin: 0 !important;
	position: relative !important;
	z-index: 50 !important;
	pointer-events: auto !important;
}

.logo-link,
.rebgr-brand-link,
.vv-brand-logo,
.rebgr-footer-logo-link {
	display: inline-flex !important;
	align-items: center !important;
	cursor: pointer !important;
	text-decoration: none !important;
	pointer-events: auto !important;
}

.rebgr-brand-wordmark,
.rebgr-brand-text,
.rebgr-brand-title,
.rebgr-footer-wordmark {
	pointer-events: auto !important;
	cursor: pointer !important;
}

.vv-header-brand img,
.rebgr-header-brand img,
.site-logo,
.site-logo-icon,
.footer-logo-img {
	background-color: transparent !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	border: none !important;
	max-height: 48px !important;
	height: 48px !important;
	width: auto !important;
	object-fit: contain !important;
	pointer-events: auto !important;
	cursor: pointer !important;
}

.logo-dark-theme,
.logo-dark-mode,
img.logo-dark-theme,
img.logo-dark-mode {
	display: none !important;
}

.logo-light-theme,
.logo-light-mode,
img.logo-light-theme,
img.logo-light-mode {
	display: block !important;
}

html[data-theme="dark"] .logo-dark-theme,
html[scheme="dark"] .logo-dark-theme,
html.dark-mode .logo-dark-theme,
body.dark-mode .logo-dark-theme {
	display: block !important;
}

html[data-theme="dark"] .logo-light-theme,
html[scheme="dark"] .logo-light-theme,
html.dark-mode .logo-light-theme,
body.dark-mode .logo-light-theme {
	display: none !important;
}

/* Primary Navigation Menu - SINGLE UNBROKEN ROW */
.vv-primary-navigation,
.rebgr-primary-nav {
	flex: 1 1 auto !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	margin: 0 1rem !important;
	min-width: 0 !important;
}

.vv-primary-menu,
.blogsy-header-nav,
.vv-primary-navigation ul,
.rebgr-primary-nav ul {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 1.75rem !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.vv-primary-menu > li,
.blogsy-header-nav > li,
.vv-primary-navigation ul > li,
.rebgr-primary-nav li {
	display: inline-flex !important;
	align-items: center !important;
	flex-shrink: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}

.vv-primary-menu > li > a,
.blogsy-header-nav > li > a,
.vv-primary-navigation ul > li > a,
.rebgr-primary-nav li a {
	display: inline-flex !important;
	align-items: center !important;
	white-space: nowrap !important;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-size: 0.9375rem !important;
	font-weight: 600 !important;
	color: #1e293b !important;
	padding: 0.45rem 0.75rem !important;
	border-radius: 8px !important;
	text-decoration: none !important;
	transition: color 180ms ease, background-color 180ms ease !important;
}

.vv-primary-menu > li > a:hover,
.blogsy-header-nav > li > a:hover,
.vv-primary-navigation ul > li > a:hover,
.rebgr-primary-nav li a:hover {
	color: #0070f3 !important;
	background-color: rgba(0, 112, 243, 0.06) !important;
}

.vv-primary-menu > li.current-menu-item > a,
.blogsy-header-nav > li.current-menu-item > a,
.rebgr-primary-nav li.current-menu-item > a {
	color: #0070f3 !important;
	font-weight: 700 !important;
}

html[scheme="dark"] .vv-primary-menu > li > a,
html[scheme="dark"] .blogsy-header-nav > li > a,
html[scheme="dark"] .vv-primary-navigation ul > li > a,
html[scheme="dark"] .rebgr-primary-nav li a {
	color: #f1f5f9 !important;
}

html[scheme="dark"] .vv-primary-menu > li > a:hover,
html[scheme="dark"] .blogsy-header-nav > li > a:hover,
html[scheme="dark"] .rebgr-primary-nav li a:hover {
	color: #38bdf8 !important;
	background-color: rgba(56, 189, 248, 0.12) !important;
}

/* Header Actions Right Section */
.vv-header-actions,
.rebgr-header-actions {
	display: flex !important;
	align-items: center !important;
	gap: 0.65rem !important;
	flex-shrink: 0 !important;
}

/* Search Box Form */
.vv-header-search-box,
.rebgr-search-box {
	display: flex !important;
	align-items: center !important;
}

.vv-header-search-form,
.rebgr-search-box .vv-header-search-form {
	display: flex !important;
	align-items: center !important;
	position: relative !important;
	background: #f1f5f9 !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 9999px !important;
	height: 38px !important;
	padding: 0 12px 0 16px !important;
	gap: 0.35rem !important;
	box-sizing: border-box !important;
	transition: background-color 200ms ease, border-color 200ms ease, box-shadow 200ms ease !important;
}

.vv-header-search-form:focus-within,
.rebgr-search-box .vv-header-search-form:focus-within {
	background: #ffffff !important;
	border-color: #0070f3 !important;
	box-shadow: 0 0 0 3px rgba(0, 112, 243, 0.15) !important;
}

html[scheme="dark"] .vv-header-search-form,
html[scheme="dark"] .rebgr-search-box .vv-header-search-form {
	background: #1e293b !important;
	border-color: #334155 !important;
}

html[scheme="dark"] .vv-header-search-form:focus-within,
html[scheme="dark"] .rebgr-search-box .vv-header-search-form:focus-within {
	background: #0f172a !important;
	border-color: #38bdf8 !important;
	box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.2) !important;
}

.vv-header-search-input,
.rebgr-search-box .vv-header-search-input {
	background: transparent !important;
	border: none !important;
	outline: none !important;
	font-family: inherit !important;
	font-size: 0.875rem !important;
	color: #1e293b !important;
	width: 140px !important;
	height: 100% !important;
	padding: 0 !important;
	transition: width 240ms cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.vv-header-search-input::placeholder,
.rebgr-search-box .vv-header-search-input::placeholder {
	color: #94a3b8 !important;
	font-weight: 400 !important;
}

html[scheme="dark"] .vv-header-search-input,
html[scheme="dark"] .rebgr-search-box .vv-header-search-input {
	color: #f8fafc !important;
}

.vv-header-search-form:focus-within .vv-header-search-input,
.rebgr-search-box .vv-header-search-form:focus-within .vv-header-search-input {
	width: 200px !important;
}

.vv-header-search-submit,
.rebgr-search-box .vv-header-search-submit {
	background: none !important;
	border: none !important;
	padding: 0 !important;
	cursor: pointer !important;
	color: #64748b !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	transition: color 180ms ease !important;
}

.vv-header-search-submit:hover,
.rebgr-search-box .vv-header-search-submit:hover {
	color: #0070f3 !important;
}

html[scheme="dark"] .vv-header-search-submit:hover,
html[scheme="dark"] .rebgr-search-box .vv-header-search-submit:hover {
	color: #38bdf8 !important;
}

/* Subscribe Pill Button */
.vv-subscribe-link,
.rebgr-subscribe-btn,
.subscribe-button {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	height: 38px !important;
	padding: 0 1.35rem !important;
	background: #0070f3 !important;
	color: #ffffff !important;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-size: 0.875rem !important;
	font-weight: 600 !important;
	border-radius: 9999px !important;
	text-decoration: none !important;
	border: none !important;
	cursor: pointer !important;
	white-space: nowrap !important;
	box-sizing: border-box !important;
	transition: all 180ms cubic-bezier(0.4, 0, 0.2, 1) !important;
	box-shadow: 0 2px 8px rgba(0, 112, 243, 0.3) !important;
}

.vv-subscribe-link:hover,
.rebgr-subscribe-btn:hover,
.subscribe-button:hover {
	background: #0060df !important;
	color: #ffffff !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 4px 14px rgba(0, 112, 243, 0.45) !important;
}

/* Dark Mode Switcher Button */
.vv-theme-toggle,
.rebgr-theme-toggle,
.dark-mode-switcher {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 38px !important;
	height: 38px !important;
	border-radius: 9999px !important;
	background: #f1f5f9 !important;
	border: 1px solid #e2e8f0 !important;
	cursor: pointer !important;
	color: #1e293b !important;
	padding: 0 !important;
	box-sizing: border-box !important;
	transition: all 180ms ease !important;
}

.vv-theme-toggle:hover,
.rebgr-theme-toggle:hover,
.dark-mode-switcher:hover {
	background: #e2e8f0 !important;
	border-color: #cbd5e1 !important;
	transform: scale(1.05) !important;
}

html[scheme="dark"] .vv-theme-toggle,
html[scheme="dark"] .rebgr-theme-toggle,
html[scheme="dark"] .dark-mode-switcher {
	background: #1e293b !important;
	border-color: #334155 !important;
	color: #f8fafc !important;
}

html[scheme="dark"] .vv-theme-toggle:hover,
html[scheme="dark"] .rebgr-theme-toggle:hover,
html[scheme="dark"] .dark-mode-switcher:hover {
	background: #334155 !important;
	border-color: #475569 !important;
}


/* ==========================================================================
   LIGHT MODE — Blue Gradient Outer Background
   Only affects the outermost page background (html/body).
   Header, footer, cards and content areas retain their white backgrounds.
   Dark mode is NOT touched here — it stays fully dark.
   ========================================================================== */

/* Light mode: vivid blue gradient on the outermost canvas */
html[scheme="light"] body,
html[data-theme="light"] body,
html.light-mode body {
	background: linear-gradient(135deg, #5a74a8 0%, #6f87b8 40%, #8aa3cc 70%, #4e6898 100%) !important;
	background-attachment: fixed !important;
}

/* The actual page column (everything between header and footer) should be transparent
   so the blue shows through the gaps — sidebars, post-list container, etc. */
html[scheme="light"] #site,
html[scheme="light"] #site-inner,
html[scheme="light"] #page,
html[scheme="light"] .site-content,
html[data-theme="light"] #site,
html[data-theme="light"] #site-inner,
body:not([class*="dark"]) #site,
body:not([class*="dark"]) #site-inner {
	background: transparent !important;
}

/* Main content wrap — keep white/near-white so text is readable */
html[scheme="light"] .pt-content-wrap,
html[scheme="light"] .blogsy-content,
html[scheme="light"] #content,
html[scheme="light"] .entry-content,
html[scheme="light"] main,
html[data-theme="light"] .pt-content-wrap,
html[data-theme="light"] #content,
html[data-theme="light"] main {
	background: transparent !important;
}

/* All post cards and sidebar widgets get a white background so they float over blue */
html[scheme="light"] .default-post-list-item.card-layout,
html[scheme="light"] .post-wrapper.card-layout,
html[scheme="light"] article.card-layout,
html[scheme="light"] .blogsy-sidebar-widget,
html[scheme="light"] .widget,
html[scheme="light"] .sidebar-container-inner .widget,
html[data-theme="light"] .default-post-list-item.card-layout,
html[data-theme="light"] .post-wrapper.card-layout,
html[data-theme="light"] article.card-layout {
	background-color: #ffffff !important;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.14), 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

/* Header stays white with glass effect */
html[scheme="light"] #site-header,
html[scheme="light"] .site-header,
html[scheme="light"] .pt-header-inner,
html[data-theme="light"] #site-header {
	background: rgba(255, 255, 255, 0.88) !important;
	backdrop-filter: saturate(180%) blur(20px) !important;
	-webkit-backdrop-filter: saturate(180%) blur(20px) !important;
	border-bottom: 0.5px solid rgba(0, 0, 0, 0.10) !important;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9) inset, 0 2px 8px rgba(0, 50, 120, 0.12) !important;
}

/* Footer stays white/light in light mode */
html[scheme="light"] #site-footer,
html[scheme="light"] .vision-vectors-footer,
html[scheme="light"] .vv-apple-footer,
html[scheme="light"] .vv-site-footer,
html[data-theme="light"] #site-footer {
	background: #f0f4ff !important;
	color: #1d1d1f !important;
	border-top: 0.5px solid rgba(0, 0, 0, 0.12) !important;
}

/* Single post content area — white card */
html[scheme="light"] .single-content,
html[data-theme="light"] .single-content {
	background: #ffffff !important;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.10) !important;
}

/* Author box, comments, navigation boxes — white in light mode */
html[scheme="light"] .author-box,
html[scheme="light"] .comments-area,
html[scheme="light"] .nav-links,
html[scheme="light"] .navigation.post-navigation,
html[data-theme="light"] .author-box,
html[data-theme="light"] .comments-area {
	background: #ffffff !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08) !important;
}

/* Ensure text colors are correct in light mode (dark text on white cards) */
html[scheme="light"] body,
html[data-theme="light"] body {
	color: var(--vv-ink, #1d1d1f) !important;
}

html[scheme="light"] h1,
html[scheme="light"] h2,
html[scheme="light"] h3,
html[scheme="light"] h4,
html[scheme="light"] h5,
html[scheme="light"] h6,
html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3 {
	color: var(--vv-heading, #1d1d1f) !important;
}

/* ==========================================================================
   DARK MODE — unchanged, but ensuring body has proper dark background
   ========================================================================== */
html[scheme="dark"] body,
html[data-theme="dark"] body,
html.dark-mode body {
	background: var(--vv-paper, #000000) !important;
	background-image: none !important;
	background-attachment: initial !important;
}

html[scheme="dark"] #site,
html[scheme="dark"] #site-inner,
html[scheme="dark"] #page,
html[data-theme="dark"] #site,
html[data-theme="dark"] #site-inner {
	background: transparent !important;
}


/* ==========================================================================
   WhatsApp Channel Social Icon
   ========================================================================== */
.rebgr-icon-whatsapp {
	background: #25D366 !important;
	color: #fff !important;
}
.rebgr-icon-whatsapp:hover,
.rebgr-icon-whatsapp:focus {
	background: #128C7E !important;
	transform: scale(1.12);
}