/*
Theme Name: BD24 Lite
Theme URI: https://example.com/bd24-lite
Author: Your Name
Author URI: https://example.com
Description: A simple, lightweight news/magazine WordPress theme inspired by the BD24Live layout. Features a breaking-news ticker, category blocks, a latest-news sidebar, and a multi-column footer. No page builder required.
Version: 1.7.0
Requires at least: 5.5
Tested up to: 6.5
Requires PHP: 7.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bd24-lite
Tags: news, magazine, blog, two-columns, right-sidebar, custom-logo, custom-menu, featured-images
*/

/* ==========================================================================
   1. Variables & Reset
   ========================================================================== */
:root{
    --color-primary:#e7141a;        /* news red */
    --color-primary-dark:#b80f14;
    --color-dark:#1a1a1a;
    --color-nav:#222;
    --color-text:#2b2b2b;
    --color-muted:#777;
    --color-border:#e5e5e5;
    --color-bg:#f4f4f4;
    --color-white:#fff;
    --max-width:1180px;
    --gap:24px;
    --font-body:"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans Bengali",sans-serif;
    --font-head:"Georgia","Times New Roman",serif;
}

*,*::before,*::after{box-sizing:border-box;}
body{
    margin:0;
    font-family:var(--font-body);
    color:var(--color-text);
    background:var(--color-bg);
    line-height:1.6;
    font-size:16px;
}
img{max-width:100%;height:auto;display:block;}
a{color:var(--color-primary);text-decoration:none;}
a:hover{color:var(--color-primary-dark);}
h1,h2,h3,h4,h5,h6{font-family:var(--font-head);line-height:1.3;margin:0 0 .5em;color:var(--color-dark);}
p{margin:0 0 1em;}
ul{margin:0;padding:0;}

.container{
    max-width:var(--max-width);
    margin:0 auto;
    padding:0 16px;
}

/* ==========================================================================
   2. Top Bar
   ========================================================================== */
.top-bar{
    background:var(--color-dark);
    color:#ddd;
    font-size:13px;
}
.top-bar .container{
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:38px;
    flex-wrap:wrap;
    gap:8px;
}
.top-bar a{color:#ddd;}
.top-bar a:hover{color:var(--color-white);}
.top-date{display:flex;align-items:center;gap:6px;}
.top-social{display:flex;align-items:center;gap:14px;}
.top-social a{font-weight:600;}
.lang-toggle{
    border:1px solid #555;
    padding:2px 8px;
    border-radius:3px;
    font-weight:600;
}

/* ==========================================================================
   3. Header & Logo
   ========================================================================== */
.site-header{background:var(--color-white);border-bottom:1px solid var(--color-border);}
.header-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:18px 16px;
    gap:20px;
    flex-wrap:wrap;
}
.site-branding{max-width:320px;}
.custom-logo-link img,.site-branding img{max-height:80px;width:auto;}
.site-title{font-size:30px;margin:0;}
.site-title a{color:var(--color-dark);}
.site-description{font-size:13px;color:var(--color-muted);margin:0;}
.header-ad{
    flex:1;
    min-width:200px;
    text-align:center;
    color:var(--color-muted);
    font-size:13px;
}

/* ==========================================================================
   4. Navigation
   ========================================================================== */
.main-nav{background:var(--color-primary);}
.nav-flex{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}
.main-nav ul{
    list-style:none;
    display:flex;
    flex-wrap:wrap;
    margin:0;
}
.main-nav li{position:relative;}
.main-nav a{
    display:block;
    color:var(--color-white);
    padding:13px 16px;
    font-weight:600;
    font-size:15px;
    font-family:var(--font-body);
}
.main-nav a:hover,
.main-nav .current-menu-item > a{
    background:rgba(0,0,0,.18);
    color:var(--color-white);
}
/* dropdown submenu */
.main-nav ul ul{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    background:var(--color-nav);
    min-width:200px;
    flex-direction:column;
    z-index:50;
    box-shadow:0 8px 20px rgba(0,0,0,.2);
}
.main-nav li:hover > ul{display:flex;}
.main-nav ul ul a{padding:11px 16px;border-bottom:1px solid rgba(255,255,255,.08);}

.nav-search{display:flex;align-items:center;}
.nav-search input[type="search"]{
    border:none;
    padding:8px 10px;
    font-size:14px;
    width:160px;
    border-radius:3px 0 0 3px;
    outline:none;
}
.nav-search button{
    border:none;
    background:var(--color-dark);
    color:#fff;
    padding:9px 14px;
    cursor:pointer;
    border-radius:0 3px 3px 0;
    font-size:14px;
}

/* mobile menu toggle */
.menu-toggle{
    display:none;
    background:transparent;
    border:0;
    color:#fff;
    font-size:22px;
    padding:12px 16px;
    cursor:pointer;
}

/* ==========================================================================
   5. Breaking News Ticker
   ========================================================================== */
.breaking{
    background:var(--color-white);
    border-bottom:1px solid var(--color-border);
    overflow:hidden;
}
.breaking .container{display:flex;align-items:center;gap:0;}
.breaking-label{
    background:var(--color-dark);
    color:#fff;
    font-weight:700;
    padding:8px 16px;
    font-size:13px;
    text-transform:uppercase;
    white-space:nowrap;
    flex-shrink:0;
    letter-spacing:.5px;
}
.breaking-track{
    overflow:hidden;
    white-space:nowrap;
    flex:1;
    padding:8px 0;
}
.breaking-track span{
    display:inline-block;
    padding-left:100%;
    animation:ticker 28s linear infinite;
}
.breaking-track a{color:var(--color-text);margin-right:40px;font-size:14px;}
.breaking-track a:hover{color:var(--color-primary);}
@keyframes ticker{
    0%{transform:translateX(0);}
    100%{transform:translateX(-100%);}
}

/* ==========================================================================
   6. Layout: content + sidebar
   ========================================================================== */
.site-main{padding:28px 0 40px;}
.layout{
    display:grid;
    grid-template-columns:1fr 320px;
    gap:var(--gap);
}
@media(max-width:900px){
    .layout{grid-template-columns:1fr;}
}

/* ==========================================================================
   7. Section headings
   ========================================================================== */
.block-title{
    display:flex;
    align-items:center;
    margin:0 0 16px;
    font-size:20px;
    border-bottom:2px solid var(--color-border);
    position:relative;
}
.block-title span{
    background:var(--color-primary);
    color:#fff;
    padding:6px 16px;
    font-family:var(--font-body);
    font-weight:700;
    font-size:16px;
    letter-spacing:.3px;
}

/* ==========================================================================
   8. Hero / Featured
   ========================================================================== */
.hero{margin-bottom:34px;}
.hero-grid{
    display:grid;
    grid-template-columns:2fr 1fr;
    gap:var(--gap);
}
@media(max-width:680px){.hero-grid{grid-template-columns:1fr;}}

.hero-main{position:relative;border-radius:6px;overflow:hidden;background:#000;}
.hero-main img{width:100%;height:420px;object-fit:cover;opacity:.85;}
.hero-main .hero-caption{
    position:absolute;
    bottom:0;left:0;right:0;
    padding:26px 22px 20px;
    background:linear-gradient(transparent,rgba(0,0,0,.85));
}
.hero-main .hero-caption h2{color:#fff;font-size:26px;margin:0 0 6px;}
.hero-main .hero-caption h2 a{color:#fff;}
.hero-side{display:flex;flex-direction:column;gap:var(--gap);}
.hero-side .mini{position:relative;border-radius:6px;overflow:hidden;background:#000;flex:1;}
.hero-side .mini img{width:100%;height:198px;object-fit:cover;opacity:.85;}
.hero-side .mini .hero-caption{
    position:absolute;bottom:0;left:0;right:0;
    padding:16px 14px 12px;
    background:linear-gradient(transparent,rgba(0,0,0,.85));
}
.hero-side .mini h3{color:#fff;font-size:16px;margin:0;}
.hero-side .mini h3 a{color:#fff;}
.cat-badge{
    display:inline-block;
    background:var(--color-primary);
    color:#fff;
    font-size:11px;
    font-weight:700;
    padding:3px 9px;
    border-radius:3px;
    margin-bottom:8px;
    text-transform:uppercase;
    letter-spacing:.4px;
    font-family:var(--font-body);
}

/* ==========================================================================
   9. Post cards / grids
   ========================================================================== */
.post-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:var(--gap);
    margin-bottom:34px;
}
@media(max-width:560px){.post-grid{grid-template-columns:1fr;}}

.card{
    background:var(--color-white);
    border:1px solid var(--color-border);
    border-radius:6px;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    transition:box-shadow .2s,transform .2s;
}
.card:hover{box-shadow:0 8px 24px rgba(0,0,0,.09);transform:translateY(-2px);}
.card-thumb{display:block;height:180px;overflow:hidden;background:#eee;}
.card-thumb img{width:100%;height:100%;object-fit:cover;}
.card-body{padding:15px 16px 18px;}
.card-body .cat-badge{margin-bottom:9px;}
.card-title{font-size:18px;margin:0 0 8px;}
.card-meta{font-size:12px;color:var(--color-muted);margin-bottom:8px;}
.card-meta a{color:var(--color-muted);}
.card-excerpt{font-size:14px;color:#555;margin:0;}

/* horizontal list card (used in sidebar/sections) */
.list-card{
    display:flex;
    gap:12px;
    padding:12px 0;
    border-bottom:1px solid var(--color-border);
    align-items:flex-start;
}
.list-card:last-child{border-bottom:0;}
.list-card .list-thumb{
    width:84px;height:64px;flex-shrink:0;
    border-radius:4px;overflow:hidden;background:#eee;
}
.list-card .list-thumb img{width:100%;height:100%;object-fit:cover;}
.list-card h4{font-size:14px;margin:0 0 4px;line-height:1.4;}
.list-card .card-meta{margin:0;}
.list-number{
    font-family:var(--font-head);
    font-size:22px;
    font-weight:700;
    color:var(--color-primary);
    width:28px;flex-shrink:0;
    line-height:1.2;
}

/* ==========================================================================
   10. Sidebar
   ========================================================================== */
.sidebar .widget{
    background:var(--color-white);
    border:1px solid var(--color-border);
    border-radius:6px;
    padding:18px;
    margin-bottom:24px;
}
.sidebar .widget-title{
    font-size:16px;
    font-family:var(--font-body);
    font-weight:700;
    margin:0 0 14px;
    padding-bottom:10px;
    border-bottom:2px solid var(--color-primary);
    color:var(--color-dark);
}
.sidebar ul{list-style:none;}
.sidebar .widget > ul > li{
    padding:9px 0;
    border-bottom:1px solid var(--color-border);
    font-size:14px;
}
.sidebar .widget > ul > li:last-child{border-bottom:0;}
.sidebar a{color:var(--color-text);}
.sidebar a:hover{color:var(--color-primary);}

/* ==========================================================================
   11. Single post & pages
   ========================================================================== */
.entry{
    background:var(--color-white);
    border:1px solid var(--color-border);
    border-radius:6px;
    padding:28px 30px 34px;
}
.entry-header{margin-bottom:18px;}
.entry-title{font-size:30px;margin:8px 0 12px;}
.entry-meta{
    font-size:13px;color:var(--color-muted);
    display:flex;flex-wrap:wrap;gap:14px;
    padding-bottom:14px;border-bottom:1px solid var(--color-border);
}
.entry-meta a{color:var(--color-muted);}
.featured-img{margin:0 0 22px;border-radius:6px;overflow:hidden;}
.entry-content{font-size:17px;line-height:1.8;}
.entry-content h2,.entry-content h3{margin-top:1.4em;}
.entry-content img{border-radius:5px;margin:1em 0;}
.entry-content blockquote{
    border-left:4px solid var(--color-primary);
    margin:1.2em 0;padding:.4em 1.2em;
    background:#fafafa;color:#444;font-style:italic;
}
.entry-footer{
    margin-top:24px;padding-top:18px;
    border-top:1px solid var(--color-border);
    font-size:13px;color:var(--color-muted);
}
.tags-links a{
    display:inline-block;background:var(--color-bg);
    padding:3px 10px;border-radius:3px;margin:0 4px 4px 0;
    font-size:12px;color:#555;
}

/* ==========================================================================
   12. Archive / index header
   ========================================================================== */
.page-header{
    background:var(--color-white);
    border:1px solid var(--color-border);
    border-radius:6px;
    padding:18px 22px;
    margin-bottom:24px;
}
.page-header .page-title{font-size:24px;margin:0;}
.page-header .archive-description{margin:6px 0 0;color:var(--color-muted);font-size:14px;}

/* ==========================================================================
   13. Pagination
   ========================================================================== */
.pagination{margin:30px 0 10px;text-align:center;}
.pagination .page-numbers{
    display:inline-block;
    padding:8px 14px;
    margin:0 3px;
    background:var(--color-white);
    border:1px solid var(--color-border);
    border-radius:4px;
    color:var(--color-text);
    font-size:14px;
}
.pagination .page-numbers.current{
    background:var(--color-primary);
    color:#fff;border-color:var(--color-primary);
}
.pagination a.page-numbers:hover{background:var(--color-dark);color:#fff;border-color:var(--color-dark);}

/* ==========================================================================
   14. Comments
   ========================================================================== */
.comments-area{
    background:var(--color-white);
    border:1px solid var(--color-border);
    border-radius:6px;
    padding:24px 28px;margin-top:24px;
}
.comment-list{list-style:none;}
.comment-list li{padding:14px 0;border-bottom:1px solid var(--color-border);}
.comment-author{font-weight:600;font-size:14px;}
.comment-metadata{font-size:12px;color:var(--color-muted);}
.comment-respond input[type=text],
.comment-respond input[type=email],
.comment-respond input[type=url],
.comment-respond textarea{
    width:100%;padding:10px;border:1px solid var(--color-border);
    border-radius:4px;margin-bottom:12px;font-family:inherit;
}

/* buttons */
.btn,button,input[type=submit]{
    display:inline-block;
    background:var(--color-primary);
    color:#fff;border:none;
    padding:10px 22px;border-radius:4px;
    font-weight:600;cursor:pointer;font-size:15px;
}
.btn:hover,button:hover,input[type=submit]:hover{background:var(--color-primary-dark);color:#fff;}

/* ==========================================================================
   15. Footer
   ========================================================================== */
.site-footer{background:var(--color-dark);color:#bdbdbd;margin-top:30px;}
.footer-widgets{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:30px;
    padding:44px 0 30px;
}
@media(max-width:900px){.footer-widgets{grid-template-columns:repeat(2,1fr);}}
@media(max-width:520px){.footer-widgets{grid-template-columns:1fr;}}
.site-footer .widget-title{
    color:#fff;font-family:var(--font-body);
    font-size:16px;font-weight:700;margin:0 0 16px;
    padding-bottom:10px;border-bottom:2px solid var(--color-primary);
}
.site-footer a{color:#bdbdbd;}
.site-footer a:hover{color:#fff;}
.site-footer ul{list-style:none;}
.site-footer .footer-widgets li{padding:6px 0;border-bottom:1px solid rgba(255,255,255,.07);font-size:14px;}
.footer-about p{font-size:14px;line-height:1.7;}
.footer-bottom{
    border-top:1px solid rgba(255,255,255,.1);
    padding:16px 0;font-size:13px;text-align:center;color:#999;
}

/* ==========================================================================
   16. Helpers & accessibility
   ========================================================================== */
.screen-reader-text{
    border:0;clip:rect(1px,1px,1px,1px);
    clip-path:inset(50%);height:1px;width:1px;
    margin:-1px;overflow:hidden;padding:0;position:absolute;
}
a:focus,button:focus,input:focus{outline:2px solid var(--color-primary);outline-offset:2px;}
.no-thumb{
    display:flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg,#e7141a22,#22222211);
    color:var(--color-primary);font-family:var(--font-head);
    font-weight:700;font-size:20px;height:100%;width:100%;
}

/* ==========================================================================
   17. Responsive nav
   ========================================================================== */
@media(max-width:768px){
    .menu-toggle{display:block;}
    .nav-flex{flex-wrap:wrap;}
    .main-nav ul.nav-menu{
        display:none;
        flex-direction:column;
        width:100%;
        order:3;
    }
    .main-nav ul.nav-menu.open{display:flex;}
    .main-nav ul.nav-menu li{width:100%;}
    .main-nav ul ul{position:static;box-shadow:none;width:100%;}
    .main-nav li:hover > ul{display:none;}
    .main-nav ul ul.open{display:flex;}
    .nav-search{order:2;margin-left:auto;}
    .nav-search input[type=search]{width:120px;}
    .hero-main img{height:300px;}
}

/* ==========================================================================
   18. Homepage category boxes
   ========================================================================== */
.cat-box{margin-bottom:36px;}

.block-title--link{justify-content:space-between;align-items:stretch;}
.block-title--link > span{margin-right:auto;}
.block-title .more-link{
    align-self:center;
    font-family:var(--font-body);
    font-size:13px;font-weight:700;
    color:var(--color-primary);
    padding-left:14px;white-space:nowrap;
}
.block-title .more-link:hover{color:var(--color-primary-dark);}

/* Two columns: lead story + 4 secondary items */
.cat-inner{display:grid;grid-template-columns:1.5fr 1fr;gap:22px;}

/* Lead story (shared by both styles) */
.cat-lead{
    background:var(--color-white);
    border:1px solid var(--color-border);
    border-radius:6px;overflow:hidden;
    display:flex;flex-direction:column;
    transition:box-shadow .2s;
}
.cat-lead:hover{box-shadow:0 8px 24px rgba(0,0,0,.08);}
.cat-lead-thumb{display:block;height:232px;background:#eee;overflow:hidden;}
.cat-lead-thumb img{width:100%;height:100%;object-fit:cover;}
.cat-lead-body{padding:16px 18px 18px;}
.cat-lead-body h3{font-size:20px;margin:0 0 7px;line-height:1.35;}
.cat-lead-body h3 a{color:var(--color-dark);}
.cat-lead-body h3 a:hover{color:var(--color-primary);}
.cat-lead-body .card-meta{font-size:12px;color:var(--color-muted);}
.cat-lead-excerpt{font-size:14px;color:#555;margin:8px 0 0;}

/* Secondary item internals (shared markup) */
.cat-item-thumb{display:block;background:#eee;overflow:hidden;border-radius:4px;}
.cat-item-thumb img{width:100%;height:100%;object-fit:cover;}
.cat-item-body h4{margin:0 0 4px;line-height:1.4;}
.cat-item-body h4 a{color:var(--color-dark);}
.cat-item-body h4 a:hover{color:var(--color-primary);}
.cat-item-body .card-meta{font-size:11px;color:var(--color-muted);}

/* ---- GRID style: 4 small cards in a 2x2 ---- */
.cat-box--grid .cat-secondary{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;align-content:start;
}
.cat-box--grid .cat-item{
    background:var(--color-white);
    border:1px solid var(--color-border);
    border-radius:6px;overflow:hidden;
    display:flex;flex-direction:column;
    transition:box-shadow .2s;
}
.cat-box--grid .cat-item:hover{box-shadow:0 6px 16px rgba(0,0,0,.08);}
.cat-box--grid .cat-item-thumb{height:86px;}
.cat-box--grid .cat-item-body{padding:9px 11px 11px;}
.cat-box--grid .cat-item-body h4{font-size:13px;}

/* ---- LIST style: 4 stacked headline rows ---- */
.cat-box--list .cat-secondary{display:flex;flex-direction:column;}
.cat-box--list .cat-item{
    display:flex;gap:12px;align-items:flex-start;
    padding:11px 0;border-bottom:1px solid var(--color-border);
}
.cat-box--list .cat-item:first-child{padding-top:0;}
.cat-box--list .cat-item:last-child{border-bottom:0;}
.cat-box--list .cat-item-thumb{width:90px;height:62px;flex-shrink:0;}
.cat-box--list .cat-item-body h4{font-size:14px;}

/* responsive */
@media(max-width:680px){
    .cat-inner{grid-template-columns:1fr;}
    .cat-lead-thumb{height:200px;}
    .cat-box--grid .cat-secondary{grid-template-columns:1fr 1fr;}
}

/* ==========================================================================
   19. Category box — extra styles (overlay + compact)
   ========================================================================== */

/* ---- OVERLAY: title sits over the photo ---- */
.cat-box--overlay .cat-lead{
    position:relative;border:0;background:#000;
    border-radius:6px;overflow:hidden;
}
.cat-box--overlay .cat-lead-thumb{height:300px;}
.cat-box--overlay .cat-lead-thumb img{opacity:.9;}
.cat-box--overlay .cat-lead-body{
    position:absolute;left:0;right:0;bottom:0;
    padding:20px 18px 16px;
    background:linear-gradient(transparent,rgba(0,0,0,.9));
}
.cat-box--overlay .cat-lead-body h3{margin:0 0 5px;}
.cat-box--overlay .cat-lead-body h3 a,
.cat-box--overlay .cat-lead-body h3 a:hover{color:#fff;}
.cat-box--overlay .cat-lead-body .card-meta{color:#e0e0e0;}
.cat-box--overlay .cat-lead-excerpt{display:none;}

.cat-box--overlay .cat-secondary{
    display:grid;grid-template-columns:1fr 1fr;gap:14px;align-content:start;
}
.cat-box--overlay .cat-item{
    position:relative;border:0;background:#000;
    border-radius:6px;overflow:hidden;
}
.cat-box--overlay .cat-item-thumb{height:122px;}
.cat-box--overlay .cat-item-thumb img{opacity:.9;}
.cat-box--overlay .cat-item-body{
    position:absolute;left:0;right:0;bottom:0;
    padding:11px 11px 9px;
    background:linear-gradient(transparent,rgba(0,0,0,.88));
}
.cat-box--overlay .cat-item-body h4{font-size:13px;}
.cat-box--overlay .cat-item-body h4 a,
.cat-box--overlay .cat-item-body h4 a:hover{color:#fff;}
.cat-box--overlay .cat-item-body .card-meta{color:#e0e0e0;}

/* ---- COMPACT: clean numbered list ---- */
.cat-compact-list{
    list-style:none;margin:0;padding:4px 16px;
    background:var(--color-white);
    border:1px solid var(--color-border);
    border-radius:6px;
}
.cat-compact-item{
    display:flex;align-items:center;gap:13px;
    padding:12px 0;border-bottom:1px solid var(--color-border);
}
.cat-compact-item:last-child{border-bottom:0;}
.cat-num{
    font-family:var(--font-head);
    font-size:20px;font-weight:700;color:var(--color-primary);
    width:26px;flex-shrink:0;text-align:center;
}
.cat-compact-thumb{
    width:76px;height:56px;flex-shrink:0;
    border-radius:4px;overflow:hidden;background:#eee;display:block;
}
.cat-compact-thumb img{width:100%;height:100%;object-fit:cover;}
.cat-compact-body{flex:1;min-width:0;}
.cat-compact-body h4{margin:0 0 3px;font-size:14px;line-height:1.45;}
.cat-compact-body h4 a{color:var(--color-dark);}
.cat-compact-body h4 a:hover{color:var(--color-primary);}
.cat-compact-body .card-meta{font-size:11px;color:var(--color-muted);}

@media(max-width:680px){
    .cat-box--overlay .cat-lead-thumb{height:230px;}
}

/* ==========================================================================
   20. Social icons, sidebar tabs, ad box, Facebook box (v1.3)
   ========================================================================== */

/* ---- Social icon links ---- */
.social-icons{display:inline-flex;align-items:center;gap:8px;}
.social-icons .soc{
    display:inline-flex;align-items:center;justify-content:center;
    width:28px;height:28px;border-radius:50%;
    background:rgba(255,255,255,.14);color:#fff;
    transition:background .2s,transform .2s;
}
.social-icons .soc:hover{transform:translateY(-1px);color:#fff;}
.social-icons .soc svg{display:block;}
.social-icons .soc-facebook:hover{background:#1877f2;}
.social-icons .soc-twitter:hover{background:#000;}
.social-icons .soc-youtube:hover{background:#ff0000;}
.social-icons .soc-instagram:hover{background:#e1306c;}
.social-icons .soc-linkedin:hover{background:#0a66c2;}

/* footer bottom row with social on the right */
.footer-bottom-inner{
    display:flex;align-items:center;justify-content:space-between;
    gap:14px;flex-wrap:wrap;
}
.footer-social .soc{background:rgba(255,255,255,.1);}

/* ---- Sidebar News Flash tabs ---- */
.widget-newsflash{padding:0;overflow:hidden;}
.nf-tabs{display:flex;}
.nf-tab{
    flex:1;background:#efefef;border:0;
    padding:13px 10px;cursor:pointer;
    font-family:var(--font-body);font-weight:700;font-size:15px;
    color:var(--color-dark);
    border-bottom:2px solid transparent;
    transition:background .15s,color .15s;
}
.nf-tab:hover{background:#e6e6e6;}
.nf-tab.active{
    background:var(--color-primary);color:#fff;
    border-bottom-color:var(--color-primary-dark);
}
.nf-panel{display:none;padding:6px 18px 14px;}
.nf-panel.active{display:block;}

/* ---- Advertisement box ---- */
.widget-ad{text-align:center;}
.ad-label{
    display:block;font-size:10px;letter-spacing:1.5px;
    text-transform:uppercase;color:#b5b5b5;margin-bottom:8px;
}
.widget-ad img{display:block;margin:0 auto;border-radius:4px;max-width:100%;}
.ad-placeholder{
    background:repeating-linear-gradient(45deg,#f2f2f2,#f2f2f2 12px,#ececec 12px,#ececec 24px);
    border:1px dashed #cfcfcf;border-radius:5px;
    padding:48px 12px;color:#9a9a9a;font-size:13px;font-weight:600;
}

/* ---- Facebook page box ---- */
.widget-fb{padding-bottom:14px;}
.widget-fb .fb-box{display:flex;justify-content:center;overflow:hidden;border-radius:4px;}
.widget-fb iframe{max-width:100%;border:0;}

/* ==========================================================================
   21. Share buttons, footer info, back-to-top (v1.4)
   ========================================================================== */

/* ---- Single post share buttons ---- */
.share-box{
    display:flex;align-items:center;flex-wrap:wrap;gap:12px;
    margin:26px 0 4px;padding:15px 0;
    border-top:1px solid var(--color-border);
    border-bottom:1px solid var(--color-border);
}
.share-label{font-weight:700;font-size:15px;color:var(--color-dark);}
.share-buttons{display:flex;flex-wrap:wrap;gap:8px;}
.share-btn{
    display:inline-flex;align-items:center;gap:7px;
    padding:8px 14px;border:0;border-radius:4px;cursor:pointer;
    font-family:var(--font-body);font-size:13px;font-weight:600;
    color:#fff;background:#555;line-height:1;
    transition:opacity .2s,transform .2s,background .2s;
}
.share-btn:hover{opacity:.92;transform:translateY(-1px);color:#fff;}
.share-btn svg{display:block;}
.share-facebook{background:#1877f2;}
.share-twitter{background:#000;}
.share-whatsapp{background:#25d366;}
.share-telegram{background:#0088cc;}
.share-linkedin{background:#0a66c2;}
.share-copy{background:#444;}
.share-copy.copied{background:#1a7f37;}
@media(max-width:520px){
    .share-btn span{display:none;}
    .share-btn{padding:10px 12px;}
}

/* ---- Footer info (editor / publisher / contact) ---- */
.footer-info{
    background:#141414;color:#cfcfcf;
    border-top:1px solid rgba(255,255,255,.08);
    font-size:13.5px;
}
.footer-info-inner{padding:16px;}
.footer-info p{margin:0 0 6px;line-height:1.7;}
.footer-info p:last-child{margin-bottom:0;}
.footer-info strong{color:#fff;font-weight:700;}
.footer-info .fi-people span,
.footer-info .fi-contact span{margin-right:20px;display:inline-block;}
.footer-info a{color:#cfcfcf;}
.footer-info a:hover{color:#fff;}

/* ---- Back to top ---- */
.to-top{
    position:fixed;right:20px;bottom:20px;z-index:99;
    width:44px;height:44px;border:0;border-radius:6px;
    background:var(--color-primary);color:#fff;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    opacity:0;visibility:hidden;transform:translateY(12px);
    transition:opacity .25s,transform .25s,background .2s;
    box-shadow:0 4px 14px rgba(0,0,0,.28);
}
.to-top.show{opacity:1;visibility:visible;transform:translateY(0);}
.to-top:hover{background:var(--color-primary-dark);}
.to-top svg{display:block;}

/* ==========================================================================
   22. Publisher footer (v1.5) — replaces the 4-column widget footer
   ========================================================================== */
.publisher-footer{
    padding:40px 0 32px;
    border-top:1px solid rgba(255,255,255,.1);
}
.pf-grid{
    display:grid;
    grid-template-columns:1fr 1fr 1.25fr;
    gap:40px;
}
.pf-col h3{
    color:#fff;
    font-family:var(--font-head);
    font-size:18px;font-weight:700;
    margin:0 0 16px;padding-bottom:12px;
    position:relative;
    border-bottom:1px solid rgba(255,255,255,.18);
    line-height:1.5;
}
.pf-col h3::after{
    content:"";position:absolute;left:0;bottom:-1px;
    width:50px;height:2px;background:var(--color-primary);
}
.pf-col p{color:#bdbdbd;font-size:15px;line-height:2;margin:0 0 10px;}
.pf-col p:last-child{margin-bottom:0;}
.pf-col a{color:#bdbdbd;}
.pf-col a:hover{color:#fff;}
.pf-office p{font-size:14px;line-height:1.9;}

@media(max-width:768px){
    .pf-grid{grid-template-columns:1fr;gap:26px;}
}

/* ==========================================================================
   23. Homepage Video Gallery + Photo Gallery (v1.6)
   ========================================================================== */
.home-section{margin-bottom:36px;}
.block-title .bt-icon{vertical-align:-2px;margin-right:7px;}

/* ---- Video gallery ---- */
.video-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.video-item{display:flex;flex-direction:column;}
.video-thumb{position:relative;display:block;border-radius:6px;overflow:hidden;background:#000;}
.video-thumb img{width:100%;height:152px;object-fit:cover;display:block;transition:opacity .2s;}
.video-thumb:hover img{opacity:.85;}
.play-btn{
    position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
    width:50px;height:50px;border-radius:50%;
    background:rgba(231,20,26,.92);color:#fff;
    display:flex;align-items:center;justify-content:center;
    padding-left:3px;box-shadow:0 2px 10px rgba(0,0,0,.4);
    transition:transform .2s,background .2s;
}
.video-thumb:hover .play-btn{transform:translate(-50%,-50%) scale(1.08);background:var(--color-primary);}
.video-title{font-size:14px;line-height:1.5;margin:10px 0 0;padding-bottom:12px;border-bottom:2px solid var(--color-primary);}
.video-title a{color:var(--color-dark);}
.video-title a:hover{color:var(--color-primary);}
@media(max-width:760px){.video-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:460px){.video-grid{grid-template-columns:1fr;}}

/* ---- Video lightbox ---- */
.video-modal{
    position:fixed;inset:0;z-index:9999;
    background:rgba(0,0,0,.86);
    display:none;align-items:center;justify-content:center;padding:20px;
}
.video-modal.open{display:flex;}
.video-modal-inner{position:relative;width:100%;max-width:900px;}
.video-frame{position:relative;padding-bottom:56.25%;height:0;background:#000;border-radius:6px;overflow:hidden;}
.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.video-close{
    position:absolute;top:-46px;right:0;
    background:transparent;border:0;color:#fff;
    font-size:36px;line-height:1;cursor:pointer;
}

/* ---- Photo gallery slider ---- */
.pg-main{position:relative;border-radius:6px;overflow:hidden;background:#000;}
.pg-slide{display:none;position:relative;}
.pg-slide.active{display:block;}
.pg-slide img{width:100%;height:440px;object-fit:cover;display:block;}
.pg-caption{
    position:absolute;left:0;right:0;bottom:0;
    padding:32px 22px 16px;color:#fff;font-size:18px;font-weight:700;
    background:linear-gradient(transparent,rgba(0,0,0,.82));
    font-family:var(--font-head);line-height:1.4;
}
.pg-arrow{
    position:absolute;top:50%;transform:translateY(-50%);z-index:3;
    width:46px;height:46px;border:0;border-radius:50%;
    background:rgba(255,255,255,.85);color:#222;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    transition:background .2s;
}
.pg-arrow:hover{background:#fff;}
.pg-prev{left:14px;}
.pg-next{right:14px;}
.pg-thumbs{display:flex;gap:10px;margin-top:12px;overflow-x:auto;padding-bottom:4px;}
.pg-thumb{
    flex:0 0 auto;width:112px;height:72px;
    border:2px solid transparent;border-radius:5px;overflow:hidden;
    padding:0;cursor:pointer;background:#eee;opacity:.65;
    transition:opacity .2s,border-color .2s;
}
.pg-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.pg-thumb.active,.pg-thumb:hover{opacity:1;border-color:var(--color-primary);}
@media(max-width:680px){
    .pg-slide img{height:300px;}
    .pg-thumb{width:92px;height:60px;}
    .pg-caption{font-size:15px;padding:24px 16px 14px;}
}

/* v1.7 — footer columns without a heading still align with heading columns */
.pf-col:not(:has(h3)){padding-top:52px;}
@media(max-width:768px){.pf-col:not(:has(h3)){padding-top:0;}}