/*
Theme Name: News Host
Theme URI: https://themeansar.com/free-themes/newshost-free-blog-magazine-elementor-wordpress-theme/
Author: Themeansar
Author URI: https://themeansar.com
Description: News Host child theme — customized for StreamingLife.net. A sleek, dark, neon-accented entertainment & streaming news magazine layout. Fully responsive, dark-mode-first, with cyan/pink brand accents from the StreamingLife identity.
Version: 0.3
Requires PHP: 7.4
Requires at least: 6.6
Tested up to: 6.9
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Template: newsup
Text Domain: news-host
Tags: blog, portfolio, news, grid-Layout, one-column, two-columns, three-columns, flexible-header, left-sidebar, right-sidebar, custom-background, custom-colors, custom-logo, custom-menu, featured-images, footer-widgets, full-width-template, post-formats, rtl-language-support, theme-options, sticky-post, threaded-comments, translation-ready, block-styles, wide-blocks

News Host WordPress Theme is child theme of Newsup, Copyright 2020 Themeansar
News Host is distributed under the terms of the GNU General Public License v3
*/

/* =========================================================
   1. ROOT TOKENS
   ========================================================= */
:root {
    --bodyFont: 'Inter Tight', system-ui, -apple-system, sans-serif;
    --headFont: 'Inter Tight', system-ui, -apple-system, sans-serif;

    --radius:    10px;
    --radius-sm: 6px;
    --radius-lg: 16px;

    /* Brand */
    --sl-cyan:          #00d4ff;
    --sl-pink:          #ff3eb5;
    --sl-blue:          #3a7bff;
    --sl-gradient:      linear-gradient(135deg, #00d4ff 0%, #ff3eb5 100%);
    --sl-gradient-soft: linear-gradient(135deg, rgba(0,212,255,0.12) 0%, rgba(255,62,181,0.12) 100%);

    /* Surfaces */
    --bg-page:        #0a0e1a;
    --bg-card:        #131829;
    --bg-card-hover:  #1a2138;
    --bg-elevated:    #1a2138;
    --bg-deep:        #04060c;

    /* Text */
    --text-primary:   #f0f4ff;
    --text-secondary: #b8c1d9;
    --text-muted:     #6b7494;

    /* Borders */
    --border-subtle: rgba(255, 255, 255, 0.06);
    --border:        rgba(0, 212, 255, 0.15);
    --border-strong: rgba(0, 212, 255, 0.30);

    /* Shadows */
    --shadow-sm: 0 2px 8px  rgba(0, 0, 0, 0.30);
    --shadow-md: 0 6px 24px rgba(0, 0, 0, 0.40);
    --shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.50);
    --glow-cyan: 0 0 24px rgba(0, 212, 255, 0.35);
    --glow-pink: 0 0 24px rgba(255, 62, 181, 0.35);

    --transition: all 0.25s ease;
}

/* =========================================================
   2. GLOBAL / BODY
   ========================================================= */
html, body {
    background: var(--bg-page) !important;
    color: var(--text-primary);
}
body,
body.custom-background,
.wrapper,
#page.site,
#content {
    background-color: var(--bg-page) !important;
    color: var(--text-primary);
    font-family: var(--bodyFont);
    letter-spacing: 0.2px;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    color: var(--text-primary);
    font-family: var(--headFont);
    letter-spacing: -0.1px;
    font-weight: 700;
}

p { color: var(--text-secondary); }

a {
    color: var(--sl-cyan);
    transition: var(--transition);
}
a:hover,
a:focus {
    color: var(--sl-pink);
    text-decoration: none;
}
a:focus {
    outline: 2px solid var(--sl-cyan);
    outline-offset: 2px;
    border-radius: 2px;
}

/* Selection */
::selection {
    background: var(--sl-pink);
    color: #fff;
}

/* Scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--bg-page); }
::-webkit-scrollbar-thumb { background: var(--bg-elevated); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--sl-cyan); }

/* =========================================================
   3. TOP UTILITY BAR (date + socials)
   ========================================================= */
.mg-headwidget .mg-head-detail {
    background: var(--bg-deep);
    border-bottom: 1px solid var(--border-subtle);
    padding: 6px 0;
}
.mg-head-detail .info-left,
.mg-head-detail .info-left li,
.mg-head-detail .info-right,
.mg-head-detail .info-right li {
    color: var(--text-secondary);
}
.mg-social.info-right li a {
    color: var(--text-secondary);
}
.icon-soci { transition: var(--transition); }
.mg-social.info-right li a:hover .icon-soci { color: var(--sl-cyan); }

.icon-soci.facebook:hover  { color: #1877f2; }
.icon-soci.x-twitter:hover { color: #ffffff; }
.icon-soci.linkedin:hover  { color: #0a66c2; }
.icon-soci.instagram:hover { color: #e4405f; }
.icon-soci.youtube:hover   { color: #ff0000; }
.icon-soci.pinterest:hover { color: #bd081c; }
.icon-soci.telegram:hover  { color: #0088cc; }

/* =========================================================
   4. HEADER / LOGO AREA
   ========================================================= */

/* === HEADER BANNER FIX — high-specificity version === */
header.mg-headwidget .mg-nav-widget-area-back,
.wrapper header .mg-nav-widget-area-back {
    aspect-ratio: 22 / 7 !important;
    height: auto !important;
    min-height: 220px !important;
    max-height: 640px !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    width: 100% !important;
    display: block !important;
}

header.mg-headwidget .mg-nav-widget-area-back .overlay {
    height: 100% !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
}

header.mg-headwidget .mg-nav-widget-area-back .overlay .inner {
    height: 100% !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
}

header.mg-headwidget .mg-nav-widget-area-back .overlay .inner > .container-fluid {
    width: 100% !important;
}

.mg-nav-widget-area-back {
    background-color: var(--bg-page) !important;
    border-bottom: 1px solid var(--border-subtle);
}
.mg-nav-widget-area-back .overlay .inner {
    background: linear-gradient(180deg, rgba(10,14,26,0.35) 0%, rgba(10,14,26,0.90) 100%) !important;
}

.site-title,
.site-title a,
h1.site-title a,
p.site-title a {
    color: var(--text-primary) !important;
    background: var(--sl-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 800;
    letter-spacing: -0.5px;
}
.site-description {
    color: var(--text-secondary);
    letter-spacing: 1px;
    font-size: 13px;
    text-transform: uppercase;
}
/* === Logo: fluidly scales, never cropped, never overflows === */
.mg-nav-widget-area .navbar-header,
.mg-nav-widget-area .site-logo,
.mg-nav-widget-area .col-md-3,
.mg-nav-widget-area .col-12 {
    overflow: visible;
}
.site-logo {
    display: flex;
    align-items: center;
    line-height: 0;
}
.site-logo a,
.site-logo .custom-logo-link {
    display: inline-block;
    line-height: 0;
    max-width: 100%;
}
.site-logo img,
.custom-logo,
.custom-logo-link img,
.navbar-header .site-logo img {
    width: auto !important;
    height: auto !important;
    /* Grows smoothly: ~64px on phones, ~90px on laptops, ~140px on big monitors */
    max-height: clamp(64px, 8vw, 140px);
    max-width: 100%;
    object-fit: contain;
    object-position: left center;
    filter: drop-shadow(0 0 16px rgba(0, 212, 255, 0.25));
}

/* Center-logo layout (when "Center the Logo & Title" is on in the Customizer) */
.mg-headwidget.center .site-logo img,
.col-12.text-center .site-logo img,
.col-12.text-center .custom-logo {
    object-position: center center;
    margin-left: auto;
    margin-right: auto;
    display: block;
}

/* Comfortable vertical breathing room so the logo has space at any width */
.mg-nav-widget-area {
    padding-top: clamp(20px, 3vw, 44px);
    padding-bottom: clamp(20px, 3vw, 44px);
}

/* === Header banner: scales proportionally, same crop at every width === */
.mg-nav-widget-area-back {
    aspect-ratio: 22 / 7;
    height: auto !important;
    min-height: 220px;
    max-height: 640px;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-color: var(--bg-page);
}

/* Overlay/inner must fill the new flexible container */
.mg-nav-widget-area-back .overlay,
.mg-nav-widget-area-back .overlay .inner {
    height: 100%;
    display: flex;
    align-items: center;
}
.mg-nav-widget-area-back .overlay .inner > .container-fluid {
    width: 100%;
}

/* =========================================================
   5. NAVIGATION
   ========================================================= */
.mg-menu-full {
    background: var(--bg-deep);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}
.navbar-wp {
    background: transparent;
}
.navbar-wp .nav.navbar-nav > li > a,
.navbar-wp .navbar-nav > li > a {
    color: var(--text-primary);
    font-weight: 600;
    font-size: 13.5px;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    padding: 18px 16px;
    position: relative;
    transition: var(--transition);
    background: transparent;
}
.navbar-wp .nav.navbar-nav > li > a::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 10px;
    width: 0;
    height: 2px;
    background: var(--sl-gradient);
    transition: width 0.3s ease, left 0.3s ease;
    border-radius: 2px;
}
.navbar-wp .nav.navbar-nav > li:hover > a::after,
.navbar-wp .nav.navbar-nav > li.current-menu-item > a::after,
.navbar-wp .nav.navbar-nav > li.active > a::after {
    width: calc(100% - 32px);
    left: 16px;
}
.navbar-wp .nav.navbar-nav > li:hover > a,
.navbar-wp .nav.navbar-nav > li.current-menu-item > a {
    color: var(--sl-cyan);
}

/* Submenu */
.navbar-wp .dropdown-menu,
.navbar-wp ul.sub-menu {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-md);
    padding: 6px 0;
    min-width: 220px;
}
.navbar-wp .dropdown-menu > li > a,
.navbar-wp ul.sub-menu > li > a {
    color: var(--text-primary);
    padding: 10px 18px;
    font-size: 13px;
    transition: var(--transition);
}
.navbar-wp .dropdown-menu > li > a:hover,
.navbar-wp ul.sub-menu > li > a:hover {
    background: rgba(0, 212, 255, 0.08);
    color: var(--sl-cyan);
}

/* Mobile burger / home button */
.navbar-toggler { border: 1px solid var(--border); padding: 8px 10px; border-radius: var(--radius-sm); }
.navbar-toggler .burger-line { background-color: var(--text-primary); }
.mobilehomebtn { color: var(--text-primary); }
.mobilehomebtn:hover { color: var(--sl-cyan); }

/* Header search */
.mg-search-box .nav-link,
.mg-search-box .btn { color: var(--text-primary); }
.mg-search-box .dropdown-menu.searchinner {
    background: var(--bg-card);
    border: 1px solid var(--border);
}
.mg-search-box input[type="search"],
.mg-search-box input[type="text"] {
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    color: var(--text-primary);
}
.navbar-wp .dropdown-menu.searchinner .btn {
    background: var(--sl-gradient);
    color: #fff;
    border: none;
    border-radius: 0 4px 4px 0;
    height: 40px;
    line-height: 25px;
    padding: 5px 15px;
}
.mg-search-box .dropdown-toggle::after { display: none; }

/* =========================================================
   6. POPULAR TAGS + BREAKING-NEWS TICKER
   ========================================================= */
.mg-tpt-tag-area,
.mg-latest-news-sec {
    margin-top: 22px;
    padding: 0;
    border-bottom: none;
}
.mg-tpt-tag-area .mg-tpt-tag {
    color: var(--sl-cyan);
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
}
.mg-tpt-tag-area .mg-tpt-txnlst {
    background: var(--bg-card);
    border: 1px solid var(--border);
    padding: 4px 10px;
    border-radius: var(--radius-sm);
}
.mg-tpt-tag-area .mg-tpt-txnlst a {
    color: var(--text-secondary);
    transition: var(--transition);
}
.mg-tpt-tag-area .mg-tpt-txnlst a:hover { color: var(--sl-cyan); }

.mg-latest-news-sec { box-shadow: none; }
.mg-latest-news-sec .mg-latest-news {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
}
.mg-latest-news .bn_title {
    background: var(--sl-gradient) !important;
    color: #fff;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.mg-latest-news .news-content a,
.mg-latest-news .mg-latest-news-slider a {
    color: var(--text-primary);
}
.mg-latest-news .news-content a:hover,
.mg-latest-news .mg-latest-news-slider a:hover { color: var(--sl-cyan); }

/* =========================================================
   7. SECTION TITLES
   ========================================================= */
.mg-sec-title,
.mg-wid-title {
    border-bottom: 1px solid var(--border);
    margin-bottom: 22px;
    padding-bottom: 12px;
    position: relative;
}
.mg-sec-title h4,
.mg-wid-title .wtitle,
.mg-sidebar .mg-widget .wtitle,
.wp-block-search .wp-block-search__label,
.mg-widget .wp-block-group h2,
footer .mg-widget h6 {
    color: var(--text-primary);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    font-size: 15px;
    padding: 0 0 0 14px !important;
    position: relative;
    margin: 0;
    line-height: 1.2;
}
.mg-sec-title h4::before,
.mg-wid-title .wtitle::before,
.mg-sidebar .mg-widget .wtitle::before,
.wp-block-search .wp-block-search__label::before,
.mg-widget .wp-block-group h2::before,
footer .mg-widget h6::before {
    content: '';
    position: absolute !important;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 80%;
    background: var(--sl-gradient);
    border-radius: 2px;
    display: block !important;
}

/* =========================================================
   8. POST CARDS
   ========================================================= */
.mg-blog-post,
.mg-blog-post-box,
.mg-posts-sec-inner .mg-posts-sec-post,
.missed-inner {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius);
    overflow: hidden;
    transition: var(--transition);
    box-shadow: var(--shadow-sm);
}
.mg-blog-post:hover,
.mg-blog-post-box:hover,
.mg-posts-sec-inner .mg-posts-sec-post:hover {
    transform: translateY(-3px);
    border-color: var(--border-strong);
    box-shadow: var(--shadow-md), 0 0 0 1px rgba(0,212,255,0.20);
}

.homemain .mg-blog-post.lg,
.mg-blog-post.lg {
    height: 580px;
    border-radius: var(--radius);
    position: relative;
}
.mg-blog-post.lg::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 35%, rgba(10,14,26,0.95) 100%);
    z-index: 1;
    pointer-events: none;
    border-radius: var(--radius);
}
.mg-blog-post.lg .bottom,
.mg-blog-post.md .bottom {
    position: relative;
    z-index: 2;
}

.mg-blog-post.md {
    width: 49.8%;
    float: left;
    height: 236px;
}
.mg-blog-post.md .bottom h4 { font-size: 24px; }

.mg-blog-post h4.title a,
.mg-blog-post-box h4.title a,
.mg-blog-post .title a,
.mg-blog-post-box h4.title,
.mg-posts-sec-post .title a {
    color: var(--text-primary);
    transition: var(--transition);
    letter-spacing: -0.1px;
}
.mg-blog-post h4.title a:hover,
.mg-blog-post-box h4.title a:hover,
.mg-blog-post .title a:hover,
.mg-posts-sec-post .title a:hover {
    color: var(--sl-cyan);
}

.mg-blog-post .mg-blog-date,
.mg-blog-post-box .mg-blog-date,
.mg-blog-post .author,
.mg-blog-post .mg-blog-meta a,
.entry-meta,
.entry-meta a {
    color: var(--text-muted);
    font-size: 13px;
}

/* Editor's-pick / small post cards */
.editor-posts .mg-blog-post-box {
    margin-bottom: 24px;
    padding: 12px;
    border-radius: var(--radius);
    background: var(--bg-card);
}
.editor-posts .mg-blog-post-box .mg-post-thumb.sm {
    height: 155px;
    border-radius: var(--radius-sm);
    overflow: hidden;
}
.editor-posts .mg-blog-post-box .small { padding: 15px 6px 0; }
.editor-posts .mg-blog-post-box .post-edit-link { display: none; }
.editor-posts .mg-blog-post-box h4.title {
    display: -webkit-box;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mg-blog-post-box .mg-header { padding: 20px; }
.mg-blog-post-box h4.title { letter-spacing: -0.1px; }

.missed-inner,
.mg-posts-sec-inner .small-list-post .small-post {
    border-radius: var(--radius);
}
.mg-posts-modul-6 .mg-sec-top-post .title {
    font-size: 24px;
    line-height: 1.4;
}
.mg-posts-modul-6 .mg-post-thumb { margin-right: -5px; }

/* Featured image hover zoom */
.mg-post-thumb a,
.mg-blog-post .mg-post-thumb,
.mg-blog-post-box .mg-post-thumb {
    overflow: hidden;
    display: block;
}
.mg-post-thumb img {
    transition: transform 0.6s ease;
}
.mg-blog-post:hover .mg-post-thumb img,
.mg-blog-post-box:hover .mg-post-thumb img,
.mg-posts-sec-post:hover .mg-post-thumb img {
    transform: scale(1.05);
}

/* =========================================================
   9. CATEGORY BADGES
   ========================================================= */
.mg-blog-category a,
a.newsup-categories,
.cat-links a {
    text-transform: uppercase;
    padding: 5px 11px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.6px;
    transition: var(--transition);
    display: inline-block;
}
a.newsup-categories.category-color-1 { background: var(--sl-pink); color: #fff; }
a.newsup-categories.category-color-2 { background: var(--sl-cyan); color: #0a0e1a; }
a.newsup-categories.category-color-3 { background: #6b46ff;        color: #fff; }
a.newsup-categories.category-color-4 { background: #00e8a0;        color: #0a0e1a; }
a.newsup-categories.category-color-5 { background: #ffb800;        color: #0a0e1a; }
a.newsup-categories:hover,
.mg-blog-category a:hover {
    transform: translateY(-1px);
    filter: brightness(1.15);
}

/* =========================================================
   10. SIDEBAR WIDGETS
   ========================================================= */
.mg-sidebar .mg-widget {
    box-shadow: var(--shadow-sm);
    border-radius: var(--radius);
    border: 1px solid var(--border-subtle);
    background: var(--bg-card);
    padding: 22px;
    margin-bottom: 24px;
}
.mg-sidebar .mg-widget .wtitle { font-weight: 800; }
.mg-sidebar .mg-widget ul li,
.mg-sidebar .mg-widget ol li {
    border-bottom: 1px solid var(--border-subtle);
    padding: 10px 0;
    color: var(--text-secondary);
}
.mg-sidebar .mg-widget ul li:last-child,
.mg-sidebar .mg-widget ol li:last-child { border-bottom: none; }
.mg-sidebar .mg-widget a { color: var(--text-secondary); }
.mg-sidebar .mg-widget a:hover { color: var(--sl-cyan); }

/* Search */
.wp-block-search .wp-block-search__inside-wrapper {
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 4px;
}
.wp-block-search input.wp-block-search__input {
    background: transparent;
    border: none;
    color: var(--text-primary);
    padding: 8px 12px;
}
.wp-block-search input.wp-block-search__input::placeholder { color: var(--text-muted); }
.wp-block-search .wp-block-search__button {
    background: var(--sl-gradient);
    border: none;
    color: #fff;
    padding: 8px 16px;
    border-radius: var(--radius-sm);
    font-weight: 600;
    cursor: pointer;
}
.wp-block-search .wp-block-search__button:hover { filter: brightness(1.15); }
.wp-block-search.wp-block-search__button-only .wp-block-search__button { align-items: center; }
.mg-sidebar .mg-widget.widget_search:not(:has(.wp-block-search__button-outside)) { padding-top: 0; }
.widget_search:has(.wp-block-search.wp-block-search__button-only.wp-block-search__searchfield-hidden) {
    padding-left: 0;
    padding-right: 0;
}
.widget_search:has(.wp-block-search.wp-block-search__button-only.wp-block-search__searchfield-hidden) .wp-block-search__label {
    margin-left: 0;
}

/* =========================================================
   11. FOOTER
   ========================================================= */
footer,
.site-footer,
#footer,
.footer-area,
.mg-footer {
    background: var(--bg-deep) !important;
    color: var(--text-secondary);
    border-top: 1px solid var(--border);
}
footer h6,
footer .mg-widget h6,
footer .mg-widget .wtitle,
footer h2, footer h3, footer h4, footer h5 {
    color: var(--text-primary);
}
footer a { color: var(--text-secondary); }
footer a:hover { color: var(--sl-cyan); }
footer .site-description {
    letter-spacing: 1.2px;
    color: var(--text-muted);
}
.copyright,
.site-info,
.copyright-area {
    background: #02040a;
    border-top: 1px solid var(--border-subtle);
    color: var(--text-muted);
    padding: 18px 0;
    text-align: center;
    font-size: 13px;
}
.copyright a, .site-info a { color: var(--sl-cyan); }

/* =========================================================
   12. BUTTONS
   ========================================================= */
.btn,
.button,
button:not(.navbar-toggler):not(.wp-block-search__button),
input[type="submit"],
input[type="button"],
.wp-block-button__link {
    background: var(--sl-gradient);
    border: none;
    color: #fff !important;
    border-radius: var(--radius-sm);
    padding: 10px 22px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    font-size: 13px;
    transition: var(--transition);
    cursor: pointer;
}
.btn:hover,
.button:hover,
button:not(.navbar-toggler):hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.wp-block-button__link:hover {
    filter: brightness(1.15);
    box-shadow: var(--glow-cyan);
    transform: translateY(-1px);
    color: #fff !important;
}

/* "Read more" / view-all links */
.read-more,
.view-all,
a.more-link {
    color: var(--sl-cyan);
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    font-size: 12px;
}
.read-more:hover,
.view-all:hover,
a.more-link:hover { color: var(--sl-pink); }

/* =========================================================
   13. FORMS / INPUTS
   ========================================================= */
input[type="text"],
input[type="email"],
input[type="search"],
input[type="url"],
input[type="password"],
input[type="number"],
input[type="tel"],
textarea,
select {
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 10px 14px;
    transition: var(--transition);
    width: 100%;
    max-width: 100%;
}
input:focus, textarea:focus, select:focus {
    border-color: var(--sl-cyan);
    box-shadow: 0 0 0 3px rgba(0, 212, 255, 0.15);
    outline: none;
}
::placeholder { color: var(--text-muted); }
label { color: var(--text-secondary); font-weight: 600; }

/* =========================================================
   14. SINGLE POST / PAGE
   ========================================================= */
.single-post .entry-content,
.page .entry-content,
.entry-content {
    color: var(--text-secondary);
    font-size: 17px;
    line-height: 1.75;
}
.single-post .entry-content h2,
.single-post .entry-content h3,
.single-post .entry-content h4,
.page .entry-content h2,
.page .entry-content h3,
.page .entry-content h4 {
    color: var(--text-primary);
    margin-top: 2em;
}
.single-post .entry-content a,
.page .entry-content a {
    color: var(--sl-cyan);
    text-decoration: underline;
    text-decoration-color: rgba(0, 212, 255, 0.35);
    text-underline-offset: 3px;
}
.single-post .entry-content a:hover,
.page .entry-content a:hover {
    color: var(--sl-pink);
    text-decoration-color: var(--sl-pink);
}
.entry-title { font-size: 36px; line-height: 1.2; margin-bottom: 16px; }

blockquote {
    border-left: 4px solid var(--sl-cyan);
    background: var(--bg-card);
    padding: 18px 22px;
    margin: 24px 0;
    border-radius: var(--radius-sm);
    color: var(--text-secondary);
    font-style: italic;
}

pre, code {
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    color: var(--sl-cyan);
    border-radius: var(--radius-sm);
    font-family: 'JetBrains Mono', 'Fira Code', monospace;
}
pre { padding: 14px 18px; overflow-x: auto; }
pre.wp-block-code a { text-decoration: underline; }

hr, .wp-block-separator {
    border: none;
    border-top: 1px solid var(--border-subtle);
    margin: 32px 0;
}

table {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    overflow: hidden;
}
th { background: var(--bg-elevated); color: var(--text-primary); padding: 12px; }
td { padding: 12px; border-top: 1px solid var(--border-subtle); color: var(--text-secondary); }

/* =========================================================
   15. COMMENTS
   ========================================================= */
.comments-area,
.comment-list,
.comment-body {
    background: transparent;
    color: var(--text-secondary);
}
.comments-title,
.comment-reply-title {
    color: var(--text-primary);
    border-bottom: 1px solid var(--border);
    padding-bottom: 12px;
    margin-bottom: 24px;
}
.comment-author,
.comment-author .fn { color: var(--text-primary); font-weight: 700; }
.comment-metadata, .comment-metadata a { color: var(--text-muted); font-size: 13px; }
.comment-detail .edit-link a,
.comment-detail .reply a {
    color: var(--sl-cyan);
    text-decoration: underline;
}
.comment-list li {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius);
    padding: 18px;
    margin-bottom: 16px;
    list-style: none;
}

/* =========================================================
   16. PAGINATION
   ========================================================= */
.pagination .page-numbers,
.nav-links a,
.nav-links span,
.page-numbers {
    background: var(--bg-card);
    border: 1px solid var(--border);
    color: var(--text-primary);
    padding: 8px 14px;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    margin: 0 3px;
    display: inline-block;
    font-weight: 600;
}
.pagination .page-numbers:hover,
.pagination .page-numbers.current,
.nav-links a:hover,
.page-numbers.current {
    background: var(--sl-gradient);
    border-color: transparent;
    color: #fff;
}

/* =========================================================
   17. MISC PRESERVED FROM ORIGINAL
   ========================================================= */
body { letter-spacing: 0.2px; }
span.time {
    margin-left: 5px;
    padding: 2px 8px;
    border-radius: var(--radius-sm);
    font-size: 13px;
    font-weight: 600;
    line-height: 35px;
    background: var(--bg-card);
    color: var(--text-secondary);
}
.mg-social li span.icon-soci { float: unset; display: inline-block; }
.mg-headwidget.center .heacent { margin-top: 40px; color: var(--text-primary); }
.mg-headwidget.center .logo-center,
.mg-headwidget.center .navbar-header,
.mg-headwidget.center .site-branding-text { float: none; text-align: center; }
.mg-headwidget.center .navbar-brand {
    float: none;
    display: inline-block;
    margin: 8px auto 0 auto;
    font-weight: bold;
}
.mb1px { margin-bottom: 1px; }
.mg-headwidget .site-branding-text .text-center { color: var(--text-primary); text-align: center; }
.mg-social.info-right a:focus { outline: none; }
.mg-nav-widget-area .navbar-brand { margin-right: 0; }
.m-header { display: none; }
.desk-header { display: flex; }
.mobilehomebtn {
    width: 30px; text-align: center; line-height: 30px; height: 30px;
}
.logo-auto { margin-left: auto; margin-right: auto; text-align: center; }
.mg-latest-news .mg-latest-news-slider { left: 185px; }
div.mg-latest-news .bn_title span { border: none; top: unset; right: unset; }
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.40);
}

/* =========================================================
   18. BREAKING-NEWS TICKER (animation preserved)
   ========================================================= */
.mg-latest-news .bn_title .title {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding-right: 8px;
}
.bn_title .title::before {
    content: "\e0b7";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 16px;
    position: relative;
    z-index: 2;
}
.bn_title .title::after {
    content: "";
    position: absolute;
    left: 26px;
    top: 50%;
    transform: translateY(-50%) translateX(0);
    width: 35px;
    height: 35px;
    border: 2px solid #fff;
    border-radius: 50%;
    opacity: 0;
    animation: zoom 2s linear infinite;
    z-index: 1;
}
.bn_title .title span::before,
.bn_title .title span::after {
    content: "";
    position: absolute;
    right: -41px;
    top: 50%;
    transform: translateY(-50%);
    width: 35px;
    height: 35px;
    border: 2px solid #fff;
    border-radius: 50%;
    opacity: 0;
    z-index: 1;
}
.bn_title .title span::before { animation: zoom 2s linear 0.5s infinite; }
.bn_title .title span::after  { animation: zoom 2s linear 1s   infinite; }
@keyframes zoom {
    0%   { transform: translate(-50%, -50%) scale(0.2); opacity: 0; }
    50%  { opacity: 0.9; }
    100% { transform: translate(-50%, -50%) scale(1);   opacity: 0; }
}

/* =========================================================
   19. SCREEN READER
   ========================================================= */
.screen-reader-text:focus {
    background-color: var(--bg-card);
    border-radius: var(--radius-sm);
    box-shadow: 0 0 2px 2px rgba(0, 212, 255, 0.40);
    clip: auto !important;
    clip-path: none;
    color: var(--sl-cyan);
    display: block;
    font-size: 0.875rem;
    font-weight: 700;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
}

/* =========================================================
   20. RESPONSIVE
   ========================================================= */
@media (min-width: 1200px) {
    .mg-blog-post.md .bottom h4 {
        max-height: 65px;
        overflow: hidden;
    }
}
@media (max-width: 991px) {
    .navbar-wp .navbar-nav > li > a i { display: none; }
    #menu-primary li.active.home { display: none; }
    .m-header {
        width: 100%;
        padding-right: 15px;
        padding-left: 15px;
        display: flex;
        justify-content: space-between;
    }
    .desk-header { display: none; }
    .navbar-wp .nav.navbar-nav > li > a {
        padding: 14px 18px;
        border-bottom: 1px solid var(--border-subtle);
    }
    .navbar-wp .nav.navbar-nav > li > a::after { display: none; }
    .collapse.navbar-collapse {
        background: var(--bg-card);
        border-top: 1px solid var(--border);
    }
    .entry-title { font-size: 28px; }
    .mg-blog-post.md { width: 100%; float: none; }
}
@media (max-width: 767px) and (min-width: 576px) {
    .mg-fea-area .col-md-3 { display: flex; }
    .mg-fea-area .col-md-3.top-right-area { display: block; }
}
@media screen and (max-width: 767px) and (min-width: 240px) {
    .mg-headwidget .navbar-wp .navbar-nav > li > a {
        position: relative;
        border-bottom: 1px solid var(--border-subtle);
    }
}
@media (min-width: 240px) and (max-width: 576px) {
    .mg-fea-area .mg-posts-sec { margin-bottom: 20px; }
    .mg-fea-area .mr-bot60 { margin-bottom: 50px; }
    .site-logo img, .custom-logo { max-height: 60px; }
    .entry-title { font-size: 24px; }
    .mg-blog-post.lg { height: 420px; }
}