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

html { overflow-x: hidden; }

body {
	background: #f6f6ec;
	font: 13px/1.5 Arimo, Arial, Helvetica, sans-serif;
	color: #343e47;
}

a { color: #343e47; text-decoration: none; }
a:hover { color: #0b60d1; }

img { max-width: 100%; height: auto; border: 0; vertical-align: top; }

#container {
	max-width: 960px;
	margin: 0 auto;
	background: #fff;
	position: relative;
}

/* ================= CUSTOM HEADER STYLES ================= */
.custom-header {
	width: 100%;
	background: #fff;
	font: 700 14px 'Roboto Condensed', Arial, sans-serif;
}

.header-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 14px 20px;
	background: #000;
}

.logo-wrap {
	display: flex;
	align-items: center;
	gap: 14px;
}

.logo-wrap img {
	max-height: 60px;
	width: auto;
	display: block;
}

.site-title {
	margin: 0;
	padding: 0;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}
.site-title a {
	color: inherit;
	text-decoration: none;
}

.tagline {
	font-size: 14px;
	margin-bottom: 0;
	font-weight: 700;
	white-space: nowrap;
	color: #fff;
}

.header-right-group {
	display: flex;
	align-items: center;
	gap: 4px;
}

.social-icons {
	display: flex;
	gap: 10px;
}

.social-icons a {
	width: 32px;
	height: 32px;
	background: #eee;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #000;
	font-size: 14px;
	text-decoration: none;
	border-radius: 3px;
}

.social-icons a:hover {
	opacity: .85;
	background: #fff;
}

.desktop-nav {
	background: #0a58ca;
}

.desktop-nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
}

.desktop-nav li {
	position: relative;
}

.desktop-nav a {
	display: block;
	padding: 15px 18px;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	text-decoration: none;
	border-right: 1px solid rgba(255,255,255,.25);
}

.desktop-nav li:hover > a {
	background: rgba(255,255,255,.18);
}

.desktop-nav .submenu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	background: #fff;
	min-width: 200px;
	z-index: 999;
	box-shadow: 0 8px 20px rgba(0,0,0,.15);
}

.desktop-nav li:hover > .submenu {
	display: block;
}

.desktop-nav .submenu a {
	padding: 10px 16px;
	color: #000;
	border-bottom: 1px solid #eee;
}

.desktop-nav .submenu a:hover {
	background: #f5f5f5;
}

/* ================= MOBILE HEADER ================= */
.mobile-header-wrapper {
	display: none;
	padding-top: 0;
}

.mobile-sticky-header {
	position: relative;
	top: auto;
	left: auto;
	width: 100%;
	z-index: 1000;
	background: #000;
	border-top: 1px solid rgba(255,255,255,0.1);
	border-bottom: 1px solid rgba(255,255,255,0.1);
	margin: 0 !important;
	padding: 0 !important;
	overflow: visible;
}

/* ===== MOBILE TOP BAR (logo, hamburger, icons) ===== */
.mobile-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 8px 12px;
	background: #000;
	position: relative;
}

.hamburger-btn {
	flex: 0 0 auto;
	background: none;
	border: none;
	cursor: pointer;
	padding: 6px;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.hamburger-btn span {
	display: block;
	width: 22px;
	height: 2px;
	background: #fff;
	border-radius: 2px;
	transition: transform 0.3s ease, opacity 0.3s ease;
}
.hamburger-btn.active span:nth-child(1) {
	transform: rotate(45deg) translate(4px, 4px);
}
.hamburger-btn.active span:nth-child(2) {
	opacity: 0;
}
.hamburger-btn.active span:nth-child(3) {
	transform: rotate(-45deg) translate(4px, -4px);
}

.mobile-top .mobile-logo {
	margin: 0 auto;
	max-height: 36px;
}
.mobile-top .mobile-header-icons {
	margin-left: auto;
}

.mobile-logo img,
.mobile-logo .custom-logo {
	display: block;
	max-height: 30px;
	width: auto;
	margin: 0;
}

.mobile-header-wrapper .custom-logo-link {
	display: inline-block;
	background: #000000;
	padding: 8px;
	border-radius: 4px;
}

.mobile-header-wrapper .custom-logo {
	display: block;
	max-height: 30px;
	width: auto;
	margin: 0;
}

.mobile-header-icons {
	display: flex;
	align-items: center;
	gap: 6px;
}

.icon-btn {
	background: none;
	border: none;
	cursor: pointer;
	padding: 6px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

.profile-btn img {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
}

.profile-btn .profile-svg {
	border-radius: 50%;
	background: transparent;
	display: block;
}

/* ===== HAMBURGER MENU PANEL ===== */
.hamburger-menu-panel {
	display: none;
	background: #111;
	padding: 10px 16px;
}
.hamburger-menu-panel.active {
	display: block;
}
.hamburger-menu-panel a {
	display: block;
	color: #ccc;
	padding: 8px 0;
	font-size: 13px;
	text-decoration: none;
	border-bottom: 1px solid rgba(255,255,255,0.05);
}
.hamburger-menu-panel a:hover {
	color: #fff;
}

.mobile-search-slide {
	display: none;
	margin: 0 !important;
	padding: 10px 14px !important;
	background: #000;
}

.mobile-search-slide form {
	background: transparent;
}

.mobile-search-slide.active {
	display: block;
}

.mobile-search-slide input[type="search"] {
	flex: 1;
	padding: 8px;
	border: 1px solid #555;
	border-radius: 4px;
	font-size: 14px;
	color: #fff;
	background: #333;
}
.mobile-search-slide input[type="search"]::placeholder {
	color: #999;
}

.mobile-search-slide .search-go-btn {
	background: #fff;
	color: #000;
	padding: 8px 14px;
	border-radius: 4px;
	border: none;
	cursor: pointer;
}

/* close icon hidden by default */
.search-toggle-btn .close-icon { display: none; }
.search-toggle-btn.active .search-icon { display: none; }
.search-toggle-btn.active .close-icon { display: inline; }

/* ============================================
   MOBILE SCROLLABLE NAV WITH ICONS
   ============================================ */
.mobile-scroll-nav {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    white-space: nowrap;
}

.mobile-scroll-nav::-webkit-scrollbar {
    display: none;
}

.mobile-scroll-nav .nav-container {
    padding: 0;
    max-width: 100%;
}

.mobile-scroll-nav .site-navigation__menu {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    flex-wrap: nowrap;
    min-width: max-content;
}

.mobile-scroll-nav .menu-item {
    display: inline-flex;
    flex-shrink: 0;
}

.mobile-scroll-nav .navigation__link {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 8px 12px;
    color: #fff;
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
    text-transform: uppercase;
}
.mobile-scroll-nav .nav-icon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}
.mobile-scroll-nav .navigation__link:hover {
    background: rgba(255,255,255,0.15);
}

/* ================= RESPONSIVE ================= */
@media (max-width: 768px) {
	.header-desktop { display: none; }
	.mobile-header-wrapper { display: block; }
}

@media (min-width: 769px) {
	.mobile-header-wrapper { display: none; }
}

.desktop-only { display: block; }
.mobile-only { display: none; }

@media (max-width: 768px) {
	.desktop-only { display: none; }
	.mobile-only { display: block; }
}

@media (max-width: 768px) {
	.mobile-header-wrapper .mobile-scroll-nav {
		display: block;
		background: #000;
		color: #fff;
	}
}

/* ================= MAIN LAYOUT ================= */
#main {
	padding: 8px 0 0;
	overflow: clip;
}

.col-scs {
	display: flex;
	flex-wrap: wrap;
}

/* ================= PAGE LAYOUT ================= */
.site-main .container {
	max-width: 960px;
	margin: 0 auto;
	padding: 8px 0 0;
	overflow: clip;
	display: flex;
	flex-wrap: wrap;
}
.content-area {
	width: 75%;
	padding: 0 8px;
	overflow: hidden;
	overflow-wrap: break-word;
}

/* ================= SLIDER ================= */
#slider {
	width: 100%;
	padding: 0 8px;
	margin-bottom: 15px;
	border-top: 6px solid #0b60d1;
	border-radius: 12px;
	box-shadow: 0 0 3px #c8ccc0;
	background: #fff;
}

#basic-slider {
	position: relative;
	max-width: 100%;
	margin: 0 auto;
	overflow: hidden;
}

#basic-slider .item {
	display: flex;
	align-items: center;
	position: relative;
}

#basic-slider .item img {
	width: 100%;
	height: auto;
	display: block;
}

#basic-slider h4.slider-element {
	position: absolute;
	bottom: 50px;
	left: 20px;
	right: 20px;
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	text-shadow: 0 2px 8px rgba(0,0,0,0.7);
	z-index: 2;
	line-height: 1.3;
}

#basic-slider p.slider-element {
	position: absolute;
	bottom: 20px;
	left: 20px;
	color: #ddd;
	font-size: 13px;
	z-index: 2;
	text-shadow: 0 1px 4px rgba(0,0,0,0.6);
}

/* ================= CONTENT & SIDEBARS ================= */
#content {
	width: 100%;
	padding: 0 8px;
}

#sidebar-left {
	width: 25%;
	padding: 0 8px;
	order: 0;
}

#sidebar-right {
	width: 25%;
	padding: 0 8px;
	order: 2;
}

.col-scs > #content {
	width: 50%;
	order: 1;
}

/* ================= STICKY SIDEBARS ================= */
@media (min-width: 841px) {
	#sidebar-left, #sidebar-right {
		position: sticky;
		top: 20px;
		align-self: flex-start;
	}
}

/* ================= HOME CENTER COLUMN ================= */
.col-home-center {
	width: 50%;
	order: 1;
}

/* ================= SINGLE VIEW ================= */
.single-view {
	background: #f6f6ec;
	border: 1px solid #c8ccc0;
	border-top: none;
	border-radius: 12px;
	box-shadow: 0 0 3px #c8ccc0;
	padding: 8px 10px;
	margin: 0 0 10px;
	overflow: hidden;
}

.page .single-title {
	font-size: 20px;
}

/* ================= BLOG TITLE (section headers) ================= */
.blog-title {
	background: #0b60d1;
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	margin: -8px -10px 8px -10px;
	padding: 4px 8px;
	border-radius: 12px 12px 0 0;
	text-transform: uppercase;
}

/* ================= SINGLE TITLE (post meta on single view) ================= */
.single-title {
	background: #0b60d1;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	margin: -8px -10px 8px -10px;
	padding: 4px 8px;
	border-radius: 12px 12px 0 0;
	border-bottom: 1px solid #c8ccc0;
}
.single-title .w {
	color: #fff;
	font-weight: 400;
}
.single-title .post-age {
	color: #fff !important;
	font-weight: 700;
	font-size: 12px;
}
.single-title .g a {
	color: #000;
	font-weight: 700;
}
.single-title .s {
	color: #000 !important;
}
.single-title .s b {
	color: #000;
}
.single-title .s a {
	color: #000;
}
.single-title .s a:hover {
	color: #0b60d1;
	text-decoration: none;
}
.single-title a {
	color: #000;
}
.single-title a:hover {
	color: #0b60d1;
	text-decoration: none;
}

/* ================= BLOG VIEW (list items) ================= */
.blog-view {
	background: #FFF;
	border: 1px solid #0b60d1;
	border-radius: 12px;
	border-top: 6px solid #0b60d1;
	box-shadow: 0 0 2px #0b60d1;
	padding: 8px 10px;
	margin: 0 0 5px;
	overflow: hidden;
}

/* ================= POST THUMBNAILS ================= */
.postthumb {
	width: 65px;
	height: 65px;
	border: 2px solid #0b60d1;
	border-radius: 50%;
	box-shadow: 0 0 0 1px #fff;
	background-size: cover;
	background-position: center;
	float: left;
	margin-right: 8px;
	display: block;
	flex-shrink: 0;
}

.Trendsthumb {
	width: 65px;
	height: 65px;
	border: 2px solid #0b60d1;
	border-radius: 50%;
	box-shadow: 0 0 0 1px #fff;
	background-size: cover;
	background-position: center;
	float: left;
	margin-right: 8px;
	flex-shrink: 0;
}

.Weeklythumb {
	width: 65px;
	height: 65px;
	border: 2px solid #0b60d1;
	border-radius: 50%;
	box-shadow: 0 0 0 1px #fff;
	background-size: cover;
	background-position: center;
	float: left;
	margin-right: 8px;
	flex-shrink: 0;
}

.sidebarthumb {
	width: 55px;
	height: 55px;
	border: 2px solid #0b60d1;
	border-radius: 50%;
	box-shadow: 0 0 0 1px #fff;
	background-size: cover;
	background-position: center;
	float: left;
	margin-right: 5px;
	flex-shrink: 0;
}

.relatedthumb {
	width: 60px;
	height: 60px;
	border: 2px solid #0b60d1;
	border-radius: 50%;
	box-shadow: 0 0 0 1px #fff;
	background-size: cover;
	background-position: center;
	float: left;
	margin: 0 8px 5px 0;
	flex-shrink: 0;
}

/* ================= ENTRY TITLE (in blog view) ================= */
.entry-title {
	font-size: 14px;
	font-weight: 700;
	line-height: 1.4;
	display: block;
	overflow: hidden;
}

.entry-title a {
	color: #222;
}

.entry-title a:hover {
	color: #0b60d1;
}

.blog-view .entry-header {
	overflow: hidden;
}

/* ================= ENTRY HEADER & META ================= */
.entry-header {
	margin-bottom: 2px;
}

.entry-meta {
	font-size: 11px;
	color: #888;
	margin: 2px 0 4px;
}

.entry-meta .posted-on,
.entry-meta .byline {
	margin-right: 6px;
}

.entry-meta a {
	color: #888;
}

.entry-meta a:hover {
	color: #0b60d1;
}

/* ================= ENTRY CONTENT ================= */
.entry-content {
	font-size: 13px;
	line-height: 1.6;
	color: #444;
	margin-top: 2px;
	overflow-wrap: break-word;
}

.entry-content p {
	margin: 0 0 10px;
}

.entry-content img {
	max-width: 100%;
	height: auto;
}

.entry-content iframe,
.entry-content embed,
.entry-content object,
.entry-content video {
	max-width: 100% !important;
}

.wp-block-embed iframe {
	max-width: 100% !important;
}

.entry-content a {
	color: #0b60d1;
}

.entry-content a:hover {
	color: #0b60d1;
}

.entry-content blockquote {
	background: #f9f9f9;
	border-left: 5px solid #0b60d1;
	margin: 15px 0;
	padding: 10px 15px;
	font-style: italic;
	color: #555;
}

.entry-content blockquote p:last-child {
	margin-bottom: 0;
}

.entry-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 15px 0;
}

.entry-content td {
	padding: 5px 8px;
	border: 1px solid #ddd;
}

.entry-content th {
	background: #0b60d1;
	color: #fff;
	padding: 8px;
	border: 1px solid #0b60d1;
	text-align: left;
}

.entry-content ul,
.entry-content ol {
	margin: 10px 0;
	padding-left: 20px;
}

.entry-content li {
	margin-bottom: 5px;
	line-height: 1.6;
}

/* ================= ARCHIVE INFO ================= */
.archive-info {
	background: #f6f6ec;
	border: 1px solid #c8ccc0;
	border-radius: 12px;
	box-shadow: 0 0 3px #c8ccc0;
	padding: 8px 10px;
	margin-bottom: 15px;
	overflow: hidden;
}

.archive-title {
	background: #0b60d1;
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	margin: -8px -10px 8px -10px;
	padding: 4px 8px;
	border-radius: 12px 12px 0 0;
	text-transform: uppercase;
}

.archive-title span {
	color: #fff;
}

.taxonomy-description {
	font-size: 13px;
	color: #666;
	padding: 0 0 4px;
}

/* ================= PAGINATION ================= */
.pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin: 40px 0 20px 0;
    font-family: Arial, sans-serif;
    position: relative;
    padding-top: 20px;
}

.pagination::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #ddd;
}

.pagination a {
    display: inline-flex;
    align-items: center;
    padding: 12px 28px;
    background-color: #f0f0f0;
    color: #000;
    text-decoration: none;
    border-radius: 30px;
    font-size: 16px;
    font-weight: 600;
    border: none;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    transition: none;
}

.pagination a:hover {
    background-color: #f0f0f0;
    transform: none;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.pagination .arrow {
    margin: 0 6px;
    font-size: 18px;
    line-height: 1;
}

.pagination a:first-child .arrow {
    margin-right: 8px;
    margin-left: 0;
}

.pagination a:last-child .arrow {
    margin-left: 8px;
    margin-right: 0;
}

.pagination a.disabled {
    pointer-events: none;
    opacity: 0.5;
    background-color: #f0f0f0;
    color: #000;
    cursor: default;
    box-shadow: none;
}

.pagination a:not(.disabled) {
    background-color: #f0f0f0;
    color: #000;
    cursor: pointer;
}

.latest-posts-pagination {
    display: none !important;
}

@media screen and (max-width: 768px) {
    .pagination {
        margin: 30px 0 15px 0;
        padding-top: 18px;
    }
    .pagination a {
        padding: 10px 22px;
        font-size: 15px;
    }
    .pagination .arrow {
        font-size: 16px;
    }
}

@media screen and (max-width: 480px) {
    .pagination {
        margin: 25px 0 12px 0;
        padding-top: 16px;
    }
    .pagination a {
        padding: 8px 18px;
        font-size: 14px;
    }
    .pagination .arrow {
        font-size: 15px;
        margin: 0 4px;
    }
}

@media screen and (max-width: 360px) {
    .pagination {
        margin: 20px 0 10px 0;
        padding-top: 14px;
    }
    .pagination a {
        padding: 6px 15px;
        font-size: 13px;
    }
    .pagination .arrow {
        font-size: 14px;
        margin: 0 3px;
    }
}

@supports (-webkit-touch-callout: none) {
    .pagination a {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}

/* ================= CONTINUE READING ================= */
.continue-reading {
	display: inline-block;
	margin: 8px 0 0;
	padding: 4px 12px;
	background: #0b60d1;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	border-radius: 4px;
}

.continue-reading:hover {
	background: #222;
	color: #fff;
}

/* ================= BLOG NAV (prev/next post) ================= */
.blog-nav {
	padding: 10px 8px;
	overflow: hidden;
	margin: 10px 0;
}

.link-prev {
	float: left;
	max-width: 45%;
}

.link-next {
	float: right;
	max-width: 45%;
	text-align: right;
}

.link-prev a,
.link-next a {
	display: inline-block;
	padding: 6px 14px;
	background: #f6f6ec;
	border: 1px solid #c8ccc0;
	border-radius: 6px;
	font-size: 12px;
	font-weight: 600;
	color: #222;
}

.link-prev a:hover,
.link-next a:hover {
	background: #0b60d1;
	color: #fff;
	border-color: #0b60d1;
}

/* ================= PAGE NAV / COMMENT NAV ================= */
.page-nav,
.comment-nav {
	padding: 10px 8px;
	overflow: hidden;
	font-size: 12px;
	margin: 5px 0;
}

.page-nav a,
.comment-nav a {
	padding: 4px 10px;
	border: 1px solid #ddd;
	margin: 0 2px;
	border-radius: 3px;
}

.page-nav a:hover,
.comment-nav a:hover {
	background: #222;
	color: #fff;
	border-color: #222;
}

/* ================= WIDGETS ================= */
.frontier-widget {
	background: #f6f6ec;
	border: 1px solid #c8ccc0;
	border-radius: 12px;
	box-shadow: 0 0 3px #c8ccc0;
	margin-bottom: 15px;
	padding: 8px 10px;
	overflow: hidden;
}

.widget-title {
	background: #0b60d1;
	color: #fff;
	font-size: 16px;
	font-weight: 700;
	margin: 0 0 10px;
	padding: 8px 10px;
	border-radius: 6px;
	text-transform: uppercase;
}

.widget-sidebar {
	overflow: hidden;
}

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

.widget ul li {
	padding: 5px 0;
	border-bottom: 1px solid #f0f0f0;
	font-size: 13px;
}

.widget ul li:last-child {
	border-bottom: none;
}

.widget ul li a {
	color: #444;
}

.widget ul li a:hover {
	color: #0b60d1;
}

/* Search widget */
.widget_search input[type="search"],
.widget_search .search-field {
	width: 100%;
	padding: 8px;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 13px;
	box-sizing: border-box;
}

.widget_search input[type="submit"],
.widget_search .search-submit {
	display: none;
}

/* Calendar widget */
.widget_calendar table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}

.widget_calendar caption {
	font-weight: 700;
	padding: 6px;
	background: #f6f6ec;
	border-radius: 4px 4px 0 0;
}

.widget_calendar th,
.widget_calendar td {
	text-align: center;
	padding: 4px;
	border: 1px solid #eee;
}

.widget_calendar #today {
	background: #0b60d1;
	color: #fff;
	font-weight: 700;
}

/* Tag cloud */
.tagcloud a {
	display: inline-block;
	padding: 3px 8px;
	margin: 2px;
	background: #f0f0f0;
	font-size: 12px !important;
	color: #555;
	border-radius: 3px;
}

.tagcloud a:hover {
	background: #0b60d1;
	color: #fff;
}

/* Recent Comments widget */
#recentcomments li {
	padding: 6px 0;
	border-bottom: 1px solid #f0f0f0;
	font-size: 13px;
	color: #555;
}

#recentcomments li:last-child {
	border-bottom: none;
}

.comment-author-link {
	color: #222;
	font-weight: 600;
}

/* ================= COMMENTS AREA (legacy) ================= */
.comments-area {
	margin: 20px 0;
	padding: 0 8px;
}

.comments-area ol {
	list-style: none;
	padding: 0;
}

.comments-area .comment {
	border-bottom: 1px solid #eee;
	padding: 10px 0;
}

.comments-area .comment-author {
	font-weight: 700;
	color: #222;
}

.comments-area .comment-meta {
	font-size: 11px;
	color: #888;
	margin: 2px 0 6px;
}

.comments-area .comment-content {
	font-size: 13px;
	line-height: 1.5;
	color: #444;
}

.comments-area .reply a {
	font-size: 11px;
	color: #0b60d1;
	text-transform: uppercase;
	font-weight: 600;
}

/* ================= BOTTOM BAR ================= */
#bottom-bar {
	padding: 15px 20px;
	background: #111;
	color: #aaa;
	font-size: 12px;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}

#bottom-bar a {
	color: #ccc;
}

#bottom-bar a:hover {
	color: #fff;
}

#theme-link {
	margin-left: auto;
	text-align: right;
}

/* ================= UTILITIES ================= */
.cf::after {
	content: '';
	display: table;
	clear: both;
}

.aligncenter {
	display: block;
	margin: 0 auto;
}

.alignleft {
	float: left;
	margin: 5px 15px 10px 0;
}

.alignright {
	float: right;
	margin: 5px 0 10px 15px;
}

.wp-caption {
	max-width: 100%;
	background: #f9f9f9;
	padding: 5px;
	border: 1px solid #eee;
}

.wp-caption-text {
	font-size: 11px;
	color: #888;
	text-align: center;
	padding: 3px 0 0;
}

.sticky {
	background: #fcfcfc;
}

.gallery-caption {
	font-size: 11px;
	color: #888;
}

.bypostauthor {
	background: #f9f9f9;
}

.screen-reader-text {
	position: absolute;
	left: -9999px;
}

/* ================= PAGE LINKS ================= */
.page-links {
	font-size: 13px;
	margin: 15px 0;
	padding: 8px;
	clear: both;
}

.page-links a {
	padding: 3px 8px;
	border: 1px solid #ddd;
	margin: 0 2px;
	border-radius: 3px;
}

.page-links a:hover {
	background: #222;
	color: #fff;
	border-color: #222;
}

/* ================= ENTRY TAGS ================= */
.entry-tags {
	padding: 10px 8px;
	margin: 10px 0;
	clear: both;
}

.entry-tags a {
	color: #0b60d1;
	font-size: 11px;
	font-weight: 600;
}
.entry-tags a:hover {
	color: #0b60d1;
}

/* ================= COMMENT FORM (legacy) ================= */
.comment-form {
	margin: 15px 0;
}

.comment-form label {
	display: block;
	font-weight: 700;
	font-size: 13px;
	color: #333;
	margin-bottom: 3px;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
	width: 100%;
	padding: 8px 10px;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 13px;
	font-family: inherit;
	margin-bottom: 10px;
	box-sizing: border-box;
}

.comment-form input[type="submit"] {
	padding: 8px 20px;
	background: #222;
	color: #fff;
	border: none;
	border-radius: 4px;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
	text-transform: uppercase;
}

.comment-form input[type="submit"]:hover {
	background: #0b60d1;
}

/* ================= ENTRY CATEGORY ================= */
.entry-category {
	font-size: 11px;
	text-transform: uppercase;
	font-weight: 700;
	margin-bottom: 3px;
}

.entry-category a {
	color: #0b60d1;
}

.entry-category a:hover {
	color: #222;
}

/* ================= BREADCRUMBS ================= */
.breadcrumbs {
	padding: 8px;
	font-size: 12px;
	color: #888;
	margin-bottom: 5px;
}

.breadcrumbs a {
	color: #0b60d1;
}

.breadcrumbs a:hover {
	color: #0b60d1;
}

.breadcrumb-sep {
	margin: 0 5px;
	color: #ccc;
}

/* ================= BACK TO TOP ================= */
#back-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 999;
	display: none;
}

#back-top a {
	display: block;
	width: 40px;
	height: 40px;
	background: rgba(0,0,0,0.6);
	color: #fff;
	text-align: center;
	font-size: 22px;
	line-height: 40px;
	border-radius: 4px;
}

#back-top a:hover {
	background: #000;
}

/* ================= RELATED POSTS ================= */
.related-posts {
	margin: 20px 0;
	padding: 0 8px;
}

.related-posts-title {
	font-size: 18px;
	font-weight: 700;
	color: #222;
	margin: 0 0 12px;
	padding: 0 0 8px;
	border-bottom: 1px solid #ddd;
	text-transform: uppercase;
}

.related-posts-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 10px;
}

.related-post-item {
	text-align: center;
}

.related-post-item img {
	width: 100%;
	height: auto;
	border-radius: 4px;
}

.related-post-item h4 {
	font-size: 13px;
	font-weight: 700;
	margin: 5px 0 2px;
	line-height: 1.3;
}

.related-post-item h4 a {
	color: #222;
}

.related-post-item h4 a:hover {
	color: #0b60d1;
}

.related-post-date {
	font-size: 11px;
	color: #888;
}

/* ================= SIDEBAR RIGHT WIDGETS ================= */
#sidebar-right .frontier-widget {
	margin-bottom: 15px;
	padding: 0 8px;
}

#sidebar-right .widget-title {
	font-size: 14px;
}

/* ================= POST VIEW ================= */
.post-view {
	padding: 8px;
	margin-bottom: 5px;
	text-align: center;
}

/* ================= ARCHIVE SEARCH RESULT ================= */

/* ================= 404 PAGE ================= */
.error-404 {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-height: 60vh;
  padding: 40px;
  text-align: left;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  overflow: hidden;
}

.error-404 .page-title {
  font-size: 48px;
  margin-bottom: 20px;
  color: #222;
  font-weight: 400;
  position: relative;
  z-index: 2;
  border: none;
  padding: 0;
}

.error-404 .entry-content {
  position: relative;
  z-index: 2;
  width: 100%;
}

.error-404 .mh-box p {
  font-size: 18px;
  color: #555;
  margin-bottom: 30px;
  line-height: 1.5;
  position: relative;
  z-index: 2;
}

.error-search {
  max-width: 400px;
  width: 100%;
  position: relative;
  z-index: 2;
}

.error-search form {
  display: flex;
  gap: 10px;
}

.error-search .search-field {
  -webkit-appearance: none;
  flex: 1;
  padding: 12px 15px;
  font-size: 16px;
  border: 1px solid #ddd;
  border-radius: 4px;
  background: #fff;
  outline: none;
}

.error-search .search-submit {
  padding: 12px 20px;
  font-size: 16px;
  background: #000;
  color: #fff;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

.baby-character {
  position: absolute;
  right: -100px;
  bottom: 20px;
  width: 120px;
  height: 120px;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="50" cy="40" r="30" fill="white" opacity="0.8"/><circle cx="40" cy="35" r="5" fill="black"/><circle cx="60" cy="35" r="5" fill="black"/><path d="M40,55 Q50,65 60,55" stroke="black" stroke-width="2" fill="none"/><circle cx="35" cy="25" r="3" fill="white"/><circle cx="55" cy="25" r="3" fill="white"/></svg>');
  background-repeat: no-repeat;
  z-index: 1;
  animation: walk 15s linear infinite;
  opacity: 0.5;
}

@keyframes walk {
  0% {
    transform: translateX(0) rotateY(0deg);
    right: -100px;
  }
  50% {
    right: calc(100% + 100px);
    transform: translateX(0) rotateY(0deg);
  }
  51% {
    transform: translateX(0) rotateY(180deg);
  }
  100% {
    right: -100px;
    transform: translateX(0) rotateY(180deg);
  }
}

@media (max-width: 480px) {
  .error-404 {
    padding: 20px;
  }
  
  .error-404 .page-title {
    font-size: 36px;
  }
  
  .error-404 .mh-box p {
    font-size: 16px;
  }
  
  .baby-character {
    width: 80px;
    height: 80px;
    opacity: 0.3;
  }
  
  .error-search form {
    flex-direction: column;
  }
}

/* ================= BOLD & SINGLE VIEW ARTICLE ================= */
.bold {
	font-weight: 700;
}

article.single-view {
	padding: 8px 10px;
	margin-bottom: 10px;
}

/* ================= TOP-VIEW ================= */
.top-view {
	background: #f6f6ec;
	border: 1px solid #c8ccc0;
	border-radius: 12px;
	box-shadow: 0 0 3px #c8ccc0;
	padding: 8px 10px;
	margin: 0 0 10px;
	overflow: hidden;
}

/* ================= MODERN COMMENT SYSTEM ================= */
.comments-section {
	margin: 20px 0;
	padding: 0 8px;
}

/* ===== COMMENT SECTION TITLE (red header) ===== */
.section-title-wrapper {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 0 15px;
}
.section-title {
	margin: 0;
	padding: 0;
	border: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
}
.section-title-inner {
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
	color: #fff;
	background: #0b60d1;
	padding: 6px 10px;
	border-radius: 6px;
}
.add-comment-btn {
	padding: 5px 12px;
	background: #fff;
	color: #0b60d1;
	border: none;
	border-radius: 4px;
	font-size: 11px;
	font-weight: 700;
	cursor: pointer;
	font-family: inherit;
	text-transform: uppercase;
}
.add-comment-btn:hover {
	background: #f0f0f0;
}

.comments-header-bar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 15px;
	padding: 8px 0;
	border-bottom: 1px solid #ebebeb;
}

.comments-header-label {
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	color: #000;
}

.comments-filter-dropdown {
	position: relative;
	display: inline-block;
}

.comments-filter-toggle {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 5px 12px;
	background: #f5f5f5;
	border: 1px solid #ddd;
	border-radius: 4px;
	cursor: pointer;
	font-size: 12px;
	font-weight: 600;
	font-family: inherit;
	color: #333;
	text-transform: uppercase;
}

.comments-filter-toggle:hover {
	background: #ebebeb;
}

.filter-arrow {
	transition: transform 0.2s;
}

.comments-filter-dropdown.is-open .filter-arrow {
	transform: rotate(180deg);
}

.comments-filter-menu {
	display: none;
	position: absolute;
	top: 100%;
	right: 0;
	z-index: 100;
	min-width: 140px;
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 4px;
	box-shadow: 0 4px 12px rgba(0,0,0,0.1);
	list-style: none;
	margin: 4px 0 0;
	padding: 4px 0;
}

.comments-filter-dropdown.is-open .comments-filter-menu {
	display: block;
}

.filter-option {
	padding: 8px 14px;
	font-size: 12px;
	font-weight: 600;
	color: #555;
	cursor: pointer;
	text-transform: uppercase;
}

.filter-option:hover {
	background: #f5f5f5;
	color: #000;
}

.filter-option.active {
	color: #000;
	background: #f0f0f0;
}

/* ===== COMMENT FORM ===== */
.comment-form-wrap {
	margin-bottom: 20px;
}

.comment-form {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.comment-form__field {
	width: 100%;
}

.comment-form__input,
.comment-form__textarea {
	width: 100%;
	padding: 12px 15px;
	border: 2px solid #000;
	font-size: 14px;
	font-family: inherit;
	background: #fff;
	box-sizing: border-box;
	border-radius: 8px;
}

.comment-form__input:focus,
.comment-form__textarea:focus {
	outline: none;
	border-color: #e64946;
}

.comment-form__textarea {
	resize: vertical;
	min-height: 100px;
}

.comment-form__submit {
	display: inline-block;
	padding: 12px 28px;
	background: #000;
	color: #fff;
	border: 2px solid #000;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	cursor: pointer;
	align-self: flex-end;
	border-radius: 8px;
	font-family: inherit;
}

.comment-form__submit:hover {
	background: #e64946;
	border-color: #e64946;
}

.comment-divider {
	height: 1px;
	background: #ddd;
	margin: 25px 0;
}

/* ===== COMMENT LIST ===== */
.comments-list {
	margin-bottom: 25px;
}

.comment-item {
	padding: 20px 0;
	border-bottom: 1px solid #ebebeb;
}

.comment-item:first-child {
	padding-top: 0;
}

.comment-item:last-child {
	border-bottom: none;
}

.comment-item .comment-item {
	margin-left: 40px;
	padding-top: 15px;
	margin-top: 0;
}

.comment-item__header {
	margin-bottom: 12px;
}

.comment-item__author {
	display: flex;
	align-items: center;
	gap: 12px;
}

.comment-item__avatar {
	flex-shrink: 0;
}

.comment-item__avatar .comment-avatar {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 2px solid #000;
	object-fit: cover;
}

.comment-item__meta {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.comment-item__name {
	font-size: 14px;
	font-weight: 700;
	color: #000;
}

.comment-item__name a {
	color: #000;
	text-decoration: none;
}

.comment-item__name a:hover {
	color: #e64946;
}

.comment-verified-badge {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	font-size: 10px;
	font-weight: 700;
	color: #fff;
	background: #00a651;
	padding: 2px 7px;
	border-radius: 3px;
	margin-left: 6px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.comment-verified-badge svg {
	width: 10px;
	height: 10px;
	flex-shrink: 0;
}

.comment-item__date {
	font-size: 11px;
	color: #888;
	text-transform: uppercase;
}

.comment-item__body {
	font-size: 14px;
	line-height: 1.6;
	color: #333;
	margin-bottom: 12px;
}

.comment-item__body p {
	margin-bottom: 10px;
}

.comment-item__body p:last-child {
	margin-bottom: 0;
}

/* ===== COMMENT ACTIONS ===== */
.comment-item__actions {
	display: flex;
	align-items: center;
	gap: 15px;
}

.comment-action {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 6px 12px;
	background: #f5f5f5;
	border: 1px solid #ddd;
	cursor: pointer;
	font-size: 12px;
	font-weight: 600;
	color: #555;
	transition: all 0.2s;
	border-radius: 4px;
	font-family: inherit;
}

.comment-action:hover {
	background: #ebebeb;
	border-color: #bbb;
}

.comment-action .like-count,
.comment-action .dislike-count {
	font-size: 12px;
	font-weight: 700;
}

.comment-action--reply {
	background: transparent;
	border: none;
	color: #0b60d1;
	padding: 6px 8px;
}

.comment-action--reply:hover {
	text-decoration: underline;
	background: transparent;
}

/* ===== REPLY FORM ===== */
.comment-reply-form.is-hidden {
	display: none;
}

.comment-reply-form {
	margin-top: 15px;
	padding: 15px;
	background: #f9f9f9;
	border: 1px solid #ebebeb;
}

.comment-reply-form .comment-form--reply {
	gap: 10px;
}

.comment-reply-form .comment-form__input,
.comment-reply-form .comment-form__textarea {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 13px;
	font-family: inherit;
	box-sizing: border-box;
}

.comment-reply-form .comment-form__submit {
	padding: 8px 20px;
	background: #222;
	color: #fff;
	border: none;
	border-radius: 4px;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
	font-family: inherit;
	text-transform: uppercase;
}

.comment-reply-form .comment-form__submit:hover {
	background: #e64946;
}

.comment-honeypot {
	position: absolute;
	left: -9999px;
	opacity: 0;
	height: 0;
	overflow: hidden;
}

/* ===== COMMENT RESPOND ===== */
.comment-respond {
	margin: 20px 0;
	padding: 15px;
	background: #f9f9f9;
	border: 1px solid #eee;
	border-radius: 6px;
}

.comment-reply-title {
	font-size: 16px;
	font-weight: 700;
	color: #222;
	margin: 0 0 10px;
}

.comment-reply-title small {
	font-size: 12px;
	font-weight: 400;
}

#cancel-comment-reply-link {
	font-size: 12px;
	font-weight: 400;
	color: #0b60d1;
	margin-left: 8px;
}

.must-log-in a,
.logged-in-as a {
	color: #0b60d1;
}

.must-log-in a:hover,
.logged-in-as a:hover {
	color: #0b60d1;
}

/* ===== NO COMMENTS TEXT ===== */
.no-comments-text {
	text-align: center;
	padding: 30px;
	color: #888;
	font-style: italic;
	background: #f9f9f9;
	border: 1px dashed #ddd;
}

/* ===== COMMENTS PAGINATION ===== */
.comments-pagination {
	margin-top: 20px;
	text-align: center;
}

.comments-pagination a,
.comments-pagination span {
	display: inline-block;
	padding: 8px 14px;
	margin: 0 2px;
	border: 1px solid #000;
	text-decoration: none;
	font-weight: 700;
	color: #000;
	background: #fff;
	font-size: 12px;
}

.comments-pagination .current {
	background: #000;
	color: #fff;
}

.comments-pagination a:hover {
	background: #e64946;
	color: #fff;
	border-color: #e64946;
}

/* ===== COMMENTS LOADING ===== */
.comments-loading {
	text-align: center;
	padding: 20px;
	color: #888;
	font-size: 13px;
}

.comments-load-more-wrap {
    text-align: center;
    margin: 20px 0;
}
.comments-load-more {
    display: inline-block;
    padding: 10px 24px;
    background: #000;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    font-family: inherit;
    text-transform: uppercase;
}
.comments-load-more:hover {
    background: #e64946;
}
.comments-load-more.is-loading {
    opacity: 0.7;
    cursor: wait;
}
.comments-load-more.no-more {
    background: #999;
    cursor: default;
}

/* ================= GOOGLE PREFERRED BUTTON ================= */
.ep-google-preferred-wrapper {
    margin-bottom: 12px;
    text-align: left;
}
.ep-google-preferred-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: #f8f9fa;
    border: 1px solid #dadce0;
    border-radius: 4px;
    color: #3c4043;
    font-size: 12px;
    text-decoration: none;
    transition: background .15s, border-color .15s;
}
.ep-google-preferred-btn:hover {
    background: #e8eaed;
    border-color: #bdc1c6;
    color: #202124;
}
.ep-google-preferred-btn svg {
    flex-shrink: 0;
}

/* ================= FULL-WIDTH FEATURED IMAGE ON SINGLE ================= */
.single-featured-image-wrap {
    position: relative;
    left: -8px;
    width: calc(100% + 16px);
    overflow: hidden;
}
.single-featured-image-wrap img {
    width: 100%;
    height: auto;
    display: block;
}
.single-image-caption {
    font-size: 12px;
    color: #666;
    padding: 8px 8px 10px;
    background: #f9f9f9;
    font-style: italic;
    line-height: 1.5;
    position: relative;
    left: -8px;
    width: calc(100% + 16px);
    padding-left: 16px;
    padding-right: 16px;
}
.single-image-separator {
    height: 1px;
    background: #ddd;
    margin: 0;
}
.single-image-separator + .entry-content {
    padding-top: 8px;
}

/* ================= ACTION BAR: LIKE | DISLIKE | SHARE ================= */
.single-action-bar {
    display: flex;
    align-items: center;
    gap: 0;
    margin: 20px 0 0;
    border: 1px solid #ddd;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
}

.single-action-bar__like,
.single-action-bar__dislike,
.single-action-bar__share {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    flex: 1;
    padding: 12px 16px;
    background: #fff;
    color: #333;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.5px;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    text-transform: uppercase;
    border-right: 1px solid #ddd;
}

.single-action-bar__share {
    border-right: none;
}

.single-action-bar__like i,
.single-action-bar__dislike i,
.single-action-bar__share i {
    font-size: 18px;
}

.single-action-bar__like:hover,
.single-action-bar__dislike:hover,
.single-action-bar__share:hover {
    background: #f5f5f5;
}

.single-action-bar__like.liked {
    color: #28a745;
    background: #f0fff4;
}

.single-action-bar__dislike.disliked {
    color: #dc3545;
    background: #fff5f5;
}

.like-count,
.dislike-count {
    font-weight: 800;
    min-width: 24px;
}

.label {
    font-weight: 700;
}

.single-content-sep {
    border: none;
    border-top: 2px solid #e0e0e0;
    margin: 20px 0;
}

.share-tooltip {
    position: absolute;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.15);
    padding: 12px;
    z-index: 9999;
    display: none;
    border: 1px solid #e0e0e0;
}

.share-tooltip.active {
    display: block;
    animation: fadeInUp 0.2s ease;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.share-tooltip-arrow {
    position: absolute;
    top: -8px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #fff;
    filter: drop-shadow(0 -2px 2px rgba(0,0,0,0.05));
}

.share-tooltip-content {
    display: flex;
    gap: 12px;
    align-items: center;
}

.share-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    text-decoration: none;
    transition: all 0.2s ease;
    font-size: 20px;
}

.share-icon.whatsapp { background: #25D366; color: #fff; }
.share-icon.whatsapp:hover { background: #20b858; transform: translateY(-2px); }
.share-icon.facebook { background: #1877F2; color: #fff; }
.share-icon.facebook:hover { background: #1664d6; transform: translateY(-2px); }
.share-icon.twitter { background: #000000; color: #fff; }
.share-icon.twitter:hover { background: #1a1a1a; transform: translateY(-2px); }
.share-icon.pinterest { background: #E60023; color: #fff; }
.share-icon.pinterest:hover { background: #c5001e; transform: translateY(-2px); }
.share-icon.email { background: #6c757d; color: #fff; }
.share-icon.email:hover { background: #5a6268; transform: translateY(-2px); }

.single-action-bar__like:active,
.single-action-bar__dislike:active {
    transform: scale(0.98);
}

.single-action-bar__like[disabled],
.single-action-bar__dislike[disabled] {
    opacity: 0.6;
    cursor: not-allowed;
}

@media (max-width: 768px) {
    .single-action-bar__like,
    .single-action-bar__dislike,
    .single-action-bar__share {
        padding: 10px 12px;
        font-size: 11px;
    }
    .label {
        display: none;
    }
    .single-action-bar__like i,
    .single-action-bar__dislike i,
    .single-action-bar__share i {
        font-size: 18px;
    }
    .share-icon {
        width: 36px;
        height: 36px;
        font-size: 18px;
    }
    .share-tooltip-content {
        gap: 8px;
    }
}

/* ================= TOP-VIEW SECTION ON SINGLE ================= */
.top-view .top-view-subtitle {
    font-size: 13px;
    color: #666;
    margin: 4px 0 10px;
    padding: 0 8px 8px;
    border-bottom: 1px solid #ebebeb;
    line-height: 1.5;
}
.top-view .top-view-related-posts {
    padding: 8px;
    margin-top: 4px;
}
.top-view .top-view-related-list {
    font-size: 12px;
    line-height: 1.7;
    color: #555;
}
.top-view .top-view-related-list a {
    color: #0b60d1;
    font-weight: 600;
}
.top-view .top-view-related-list a:hover {
    color: #0b60d1;
    text-decoration: underline;
}
.top-view .top-view-related-list .related-sep {
    color: #ccc;
    margin: 0 4px;
    font-weight: 400;
}

/* ================= POST VIEW META (before article) ================= */
.post-view-meta {
    padding: 8px;
    margin-bottom: 5px;
    font-size: 18px;
    color: #000;
    border-bottom: 1px solid #c8ccc0;
}
.post-view-meta b {
    font-weight: 700;
}
.post-view-meta a {
    color: #000;
    text-decoration: none;
}
.post-view-meta a:hover {
    color: #0b60d1;
    text-decoration: none;
    cursor: pointer;
}
.meta-comment-icon {
    vertical-align: middle;
    margin-right: 2px;
    display: inline-block;
}

/* ================= DESKTOP SEARCH ================= */
.desktop-search-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
}
.desktop-search-toggle {
    background: none;
    border: none;
    cursor: pointer;
    padding: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    line-height: 1;
}
.desktop-search-toggle .close-icon { display: none; }
.desktop-search-toggle.active .search-icon { display: none; }
.desktop-search-toggle.active .close-icon { display: inline; }
.desktop-search-slide {
	display: none;
	padding: 10px 14px;
	background: #000;
}
.desktop-search-slide.active {
    display: block;
}
.desktop-search-slide form {
    display: flex;
    flex: 1;
    gap: 6px;
    align-items: center;
    max-width: 600px;
    margin: 0 auto;
}
.desktop-search-slide input[type="search"] {
    flex: 1;
    padding: 8px;
    border: 1px solid #555;
    border-radius: 4px;
    font-size: 14px;
    color: #fff;
    background: #333;
}
.desktop-search-slide input[type="search"]::placeholder {
    color: #999;
}
.desktop-search-slide .search-go-btn {
	background: #fff;
	color: #000;
	padding: 8px 14px;
	border-radius: 4px;
	border: none;
	cursor: pointer;
}

@media (max-width: 768px) {
    .desktop-search-wrap { display: none; }
    .desktop-search-slide { display: none !important; }
}

.comment-form-message {
    padding: 10px 14px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    margin-top: 10px;
}
.comment-form-message.success {
    background: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}
.comment-form-message.error {
    background: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}

#showfordesktop { display: none; }
@media screen and (min-width: 500px) { #showfordesktop { display: block; } }

#showformobile { display: none; }
@media screen and (max-width: 500px) { #showformobile { display: block; } }

/* ================= AUTHOR PROFILE CARD ================= */
.dropjamz-author-card {
    display:flex;
    gap:20px;
    align-items:flex-start;
    padding:20px;
    margin-bottom:20px;
    background:#f9f9f9;
    border-radius:8px;
    border:1px solid #e0e0e0;
    box-sizing:border-box;
    max-width:100%;
    width:100%;
    overflow-x:hidden;
}
.dropjamz-author-card-avatar {
    flex-shrink:0;
}
.dropjamz-author-card-avatar img {
    width:100px;
    height:100px;
    border-radius:50%;
    object-fit:cover;
    display:block;
    border:3px solid #fff;
    box-shadow:0 2px 8px rgba(0,0,0,0.1);
}
.dropjamz-author-card-info {
    flex:1;
    min-width:0;
}
.author-card-name {
    margin:0 0 6px;
    font-size:20px;
    font-weight:700;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}
.author-card-name span,
.author-card-name h1 {
    font-size:20px;
    font-weight:700;
    text-transform:uppercase;
    margin:0;
    padding:0;
    line-height:1.2;
}
.author-badge {
    color:#ff0044;
    font-size:13px;
    background:rgba(255,0,68,0.1);
    padding:3px 10px;
    border-radius:12px;
    vertical-align:middle;
    font-weight:600;
    text-transform:none;
}
.author-card-name .dropjamz-like-btn {
    vertical-align:middle;
}
.dropjamz-author-card-bio {
    font-size:13px;
    color:#555;
    margin:0 0 10px;
    line-height:1.5;
}
.dropjamz-author-card-actions {
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    align-items:center;
}
.dropjamz-author-card-actions a,
.dropjamz-author-card-actions button {
    display:inline-flex;
    align-items:center;
    gap:5px;
    font-size:12px;
    font-weight:600;
    color:#333;
    text-decoration:none;
    padding:6px 14px;
    border-radius:20px;
    border:1px solid #ccc;
    background:#fff;
    cursor:pointer;
    transition:all 0.2s;
}
.dropjamz-author-card-actions a:hover,
.dropjamz-author-card-actions button:hover {
    background:#000;
    color:#fff;
    border-color:#000;
}
.dropjamz-author-card-actions .email-link {
    font-size:13px;
    padding:8px 16px;
}
.dropjamz-author-card-actions .msg-btn {
    background:#000;
    color:#fff;
    border-color:#000;
    font-size:13px;
    font-weight:700;
    padding:8px 20px;
    border-radius:24px;
    box-shadow:0 4px 10px rgba(0,0,0,0.2);
}
.dropjamz-author-card-actions .msg-btn:hover {
    background:#333;
}
.msg-btn-wrap { display:inline-block; }
.msg-dropdown { display:none; position:fixed; width:440px; max-width:90vw; min-width:340px; background:#fff; border:1px solid #ddd; border-radius:14px; box-shadow:0 10px 40px rgba(0,0,0,0.18); padding:24px; z-index:99999; }
.msg-dropdown.active { display:block; }
.msg-dropdown h4 { margin:0 0 16px; font-size:17px; font-weight:700; color:#111; letter-spacing:0.3px; }
.msg-dropdown input, .msg-dropdown select, .msg-dropdown textarea { width:100%; box-sizing:border-box; padding:12px 14px; border:1.5px solid #d1d1d1; border-radius:8px; font-size:14px; margin-bottom:12px; background:#fafafa; transition:border 0.2s, box-shadow 0.2s; }
.msg-dropdown input:focus, .msg-dropdown select:focus, .msg-dropdown textarea:focus { outline:none; border-color:#cc06a8; box-shadow:0 0 0 3px rgba(204,6,168,0.12); background:#fff; }
.msg-dropdown input::placeholder, .msg-dropdown textarea::placeholder { color:#999; font-size:14px; }
.msg-dropdown select { cursor:pointer; appearance:auto; color:#555; }
.msg-dropdown .msg-submit { width:100%; padding:12px; background:#cc06a8; color:#fff; border:none; border-radius:8px; font-size:15px; font-weight:700; cursor:pointer; transition:background 0.2s; letter-spacing:0.5px; }
.msg-dropdown .msg-submit:hover { background:#a00585; }
.msg-dropdown .msg-submit:disabled { opacity:0.6; cursor:default; }
.msg-dropdown .msg-status { font-size:13px; margin-top:10px; text-align:center; font-weight:600; }
@media (max-width:600px) {
    .dropjamz-author-card {
        flex-direction:column;
        align-items:center;
        text-align:center;
    }
    .author-card-name {
        justify-content:center;
    }
    .dropjamz-author-card {
        overflow-x:hidden;
        word-wrap:break-word;
        overflow-wrap:break-word;
    }
    .dropjamz-author-card-actions {
        justify-content:center;
        flex-wrap:wrap;
    }
}

/* ============================================
   EDITORIAL PICKS CAROUSEL (All devices)
   Auto-slide, 1 post visible
============================================ */
.editorial-picks-wrapper {
	display: block;
	width: 100%;
	background: #fff;
	margin-bottom: 15px;
	padding: 0 8px;
}
.editorial-picks-wrapper .editorial-carousel-container {
	padding-top: 10px;
}

.list-titlee {
	font-size: 20px;
	font-weight: 700;
	color: #111;
	margin: 0 12px 12px 12px;
	padding-bottom: 8px;
	position: relative;
}
.list-titlee::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 40px;
	height: 3px;
	background: #00a651;
	border-radius: 3px;
}

.editorial-carousel-container {
	position: relative;
	width: 100%;
	max-width: 480px;
	margin: 0 auto;
	overflow: hidden;
}

.editorial-carousel {
	display: flex;
	transition: transform 0.4s ease-in-out;
	will-change: transform;
}

.carousel-slide {
	flex: 0 0 100%;
	width: 100%;
	padding: 0 10px;
	box-sizing: border-box;
}

.nw-hot-card {
	text-decoration: none;
	display: block;
}

.nw-hot-thumb {
	position: relative;
	height: 420px;
	background-size: cover;
	background-position: center;
	border-radius: 4px;
	overflow: hidden;
}

.nw-hot-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.82), rgba(0,0,0,0.15));
}

.nw-hot-content {
	position: absolute;
	bottom: 12px;
	left: 12px;
	right: 12px;
	z-index: 2;
}

.nw-hot-cat {
	display: inline-block;
	background: #000;
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 1px;
	padding: 4px 8px;
	margin-bottom: 8px;
	text-transform: uppercase;
}

.nw-hot-content h3 {
	color: #fff;
	font-size: 17px;
	line-height: 1.4;
	margin: 0;
	font-weight: 700;
}

.carousel-prev,
.carousel-next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 5;
	background: rgba(0,0,0,0.6);
	color: #fff;
	border: none;
	font-size: 22px;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: opacity 0.3s, background 0.3s;
	opacity: 0;
	pointer-events: none;
	line-height: 1;
	padding: 0;
}
.editorial-carousel-container:hover .carousel-prev,
.editorial-carousel-container:hover .carousel-next {
	opacity: 1;
	pointer-events: auto;
}
.carousel-prev:hover,
.carousel-next:hover {
	background: rgba(0,0,0,0.85);
}
.carousel-prev { left: 18px; }
.carousel-next { right: 18px; }

.carousel-dots {
	display: flex;
	justify-content: center;
	gap: 8px;
	margin: 12px 0 20px;
}
.carousel-dots .dot {
	width: 8px;
	height: 8px;
	background: #ccc;
	border-radius: 50%;
	cursor: pointer;
	transition: background 0.2s;
}
.carousel-dots .dot.active {
	background: #00a651;
	width: 20px;
	border-radius: 4px;
}

@media (max-width: 768px) {
	.nw-hot-thumb {
		height: 220px;
	}
}

@media (max-width: 480px) {
	.list-titlee {
		font-size: 18px;
		margin: 0 10px 10px 10px;
	}
	.nw-hot-thumb {
		height: 200px;
	}
	.nw-hot-content h3 {
		font-size: 15px;
	}
}

/* Disclaimer Styles */
.post-disclaimer {
    position: relative;
    background-color: #f9f9f9;
    padding: 20px 18px;
    margin: 20px 0;
    max-width: 100%;
    font-family: Arial, sans-serif;
    font-size: 14px;
    color: #333;
    border-radius: 6px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    overflow: hidden;
    border-left: 2px solid #0b60d1;
    box-sizing: border-box;
}

.post-disclaimer::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #0b60d1;
    -webkit-animation: blinkBorder 4s infinite;
    animation: blinkBorder 4s infinite;
}

.post-disclaimer::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #0b60d1;
    -webkit-animation: blinkBorder 4s infinite;
    animation: blinkBorder 4s infinite;
}

.post-disclaimer .right-border {
    position: absolute;
    top: 0;
    right: 0;
    width: 2px;
    height: 100%;
    background-color: #0b60d1;
    -webkit-animation: blinkBorder 4s infinite;
    animation: blinkBorder 4s infinite;
}

@-webkit-keyframes blinkBorder {
    0%, 45%, 55%, 100% { opacity: 1; }
    50% { opacity: 0; }
}

@keyframes blinkBorder {
    0%, 45%, 55%, 100% { opacity: 1; }
    50% { opacity: 0; }
}

.post-disclaimer a {
    color: #0b60d1;
    text-decoration: underline;
}

.post-disclaimer strong {
    color: #0b60d1;
}

@media (max-width: 600px) {
    .post-disclaimer {
        font-size: 13px;
        padding: 16px 12px;
    }
}