/*
Theme Name: Revista Politica NBC Style Child
Description: Child theme pentru FactMedia NBC Style - pentru siguranță la actualizări
Template: factmedia-nbcstyle
Version: 1.0.0
Author: FactMedia Development Team
*/

/* Import parent theme styles */
@import url("../factmedia-nbcstyle/style.css");

/* 
CHILD THEME CUSTOM STYLES - REVISTA POLITICA
Aici poți adăuga stiluri personalizate care nu vor fi pierdute la actualizări
*/

/* RESET CSS */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    height: auto !important;
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 16px;
    line-height: 1.6;
    color: #1a1a1a;
    background: #f8fafc;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    height: auto !important;
    position: relative !important;
}

/* Fix pentru probleme de scroll blocate */
html, body {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    height: auto !important;
    min-height: 100vh;
    max-height: none !important;
}

/* TYPOGRAPHY - Finuțe și elegante */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-weight: 500;
    line-height: 1.4;
    margin: 0 0 0.8rem 0;
    color: #1f2937;
    letter-spacing: -0.01em;
}

h1 { font-size: 1.8rem; font-weight: 600; }
h2 { font-size: 1.5rem; font-weight: 600; }
h3 { font-size: 1.25rem; font-weight: 500; }
h4 { font-size: 1.1rem; font-weight: 500; }
h5 { font-size: 1rem; font-weight: 500; }
h6 { font-size: 0.9rem; font-weight: 500; }

/* Hero title stays larger but elegant */
.hero-title {
    font-family: 'Playfair Display', Georgia, serif !important;
    font-size: 2.2rem !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
}

/* News titles elegant and fine */
.news-title {
    font-size: 1.1rem !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    letter-spacing: -0.005em !important;
}

p {
    margin: 0 0 1rem 0;
    color: #4b5563;
}

a {
    color: #2563eb;
    text-decoration: none;
    transition: all 0.3s ease;
}

a:hover {
    color: #1d4ed8;
    text-decoration: underline;
}

/* LAYOUT CONTAINERS */
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.container-fluid {
    width: 100%;
    padding: 0 20px;
}

/* HEADER STYLES */
.site-header {
    background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
    color: white;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10000;
    box-shadow: 0 4px 20px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
}

/* Header structure order */
.header-top {
    order: 1;
}

.header-main {
    order: 2;
}

.main-navigation {
    order: 3;
}

/* Scrolled state - compact header cu logo + meniu pe aceeași linie */
.site-header.scrolled {
    padding: 0;
    box-shadow: 0 2px 15px rgba(0,0,0,0.2);
}

.site-header.scrolled .header-top {
    display: none;
}

.site-header.scrolled .header-main {
    padding: 8px 0;
    display: flex;
    align-items: center;
}

.site-header.scrolled .header-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.site-header.scrolled .site-branding {
    flex: 0 0 auto;
}

.site-header.scrolled .site-logo,
.site-header.scrolled .custom-logo {
    transform: scale(0.7);
    transition: transform 0.3s ease;
}

.site-header.scrolled .header-search {
    display: none;
}

.site-header.scrolled .main-navigation {
    background: transparent;
    border: none;
    padding: 0;
    position: static;
    flex: 1;
    display: flex;
    justify-content: center;
}

.site-header.scrolled .nav-menu {
    display: flex;
    gap: 5px;
}

.site-header.scrolled .nav-menu a {
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* Add padding to body to compensate for fixed header */
body {
    padding-top: 180px; /* Adjust based on header height */
}

body.scrolled {
    padding-top: 60px; /* Compact header height */
}

.header-top {
    background: #0f172a;
    padding: 8px 0;
    font-size: 14px;
}

/* Header Top Control from Customizer */
body.header-top-disabled .header-top {
    display: none !important;
}

body.header-top-disabled {
    padding-top: 120px !important; /* Reduced padding when header-top is disabled */
}

body.header-top-disabled.scrolled {
    padding-top: 60px !important;
}

.header-top .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-date {
    color: #94a3b8;
}

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

.header-weather {
    display: flex;
    align-items: center;
}

.weather-widget {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    color: #94a3b8;
}

.weather-main {
    display: flex;
    align-items: center;
    gap: 6px;
}

.weather-main i {
    color: #60a5fa;
    font-size: 16px;
}

.weather-temp {
    color: #e2e8f0;
    font-weight: 600;
}

.weather-details {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
}

.weather-city {
    color: #cbd5e1;
    font-weight: 500;
}

.weather-desc {
    color: #94a3b8;
    font-style: italic;
}

.weather-unavailable {
    color: #6b7280;
    font-size: 12px;
}

.weather-unavailable i {
    color: #ef4444;
}

.header-social a {
    color: #94a3b8;
    margin: 0 8px;
    font-size: 16px;
    transition: color 0.3s ease;
}

.header-social a:hover {
    color: #3b82f6;
}

.header-main {
    padding: 20px 0;
}

.header-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Logo Styles */
.site-logo {
    font-family: 'Playfair Display', serif;
    font-size: 2.5rem;
    font-weight: 700;
    color: white;
    text-decoration: none;
    letter-spacing: -1px;
}

.site-logo:hover {
    color: #60a5fa;
    text-decoration: none;
}

/* Custom Logo Responsive Styles */
.custom-logo {
    max-height: var(--logo-height, 60px) !important;
    max-width: var(--logo-width, auto) !important;
    width: auto !important;
    height: auto !important;
    display: block;
    object-fit: contain;
}

.site-branding .custom-logo-link {
    display: inline-block;
    line-height: 1;
}

/* Logo customizer settings support */
.site-branding {
    display: flex;
    align-items: center;
}

/* ===== FM WEATHER ROOT CENTRARE COMPLETĂ ===== */
/* Multiple selectors for maximum coverage and aggressive centering */
.fm-weather-root,
.fm-weather-container,
.fm-weather-wrapper,
.fm-weather-display,
.fm-weather-widget,
div[class*="fm-weather"],
div[id*="fm-weather"],
span[class*="fm-weather"],
.weather-root,
.weather-container {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
    flex-direction: row !important;
    overflow: visible !important;
    flex-shrink: 0 !important;
}

/* All children of fm-weather elements */
.fm-weather-root *,
.fm-weather-container *,
.fm-weather-wrapper *,
.fm-weather-display *,
div[class*="fm-weather"] *,
div[id*="fm-weather"] *,
span[class*="fm-weather"] *,
.weather-root *,
.weather-container * {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    margin: 0 4px !important;
    vertical-align: middle !important;
}

/* Direct weather item styling */
.fm-weather-item,
.weather-item,
.weather-element,
div[class*="weather-item"],
span[class*="weather-item"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 8px !important;
    vertical-align: middle !important;
    text-align: center !important;
    flex-shrink: 0 !important;
}

/* Weather details containers */
.weather-details,
.fm-weather-details,
.weather-info,
div[class*="weather-details"],
div[class*="weather-info"] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
    text-align: center !important;
    width: auto !important;
    margin: 0 auto !important;
    overflow: visible !important;
}

/* Weather text elements */
.weather-details span,
.fm-weather-details span,
.weather-info span,
div[class*="weather"] span,
.weather-text,
.weather-temp,
.weather-desc,
.weather-city {
    display: inline !important;
    margin: 0 6px !important;
    white-space: nowrap !important;
}

/* Parent container force centering */
.header-weather,
.weather-widget,
.weather-container {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: 100% !important;
}

/* Header weather specific centering */
.header-weather .fm-weather-root,
.header-weather div[class*="fm-weather"],
.header-weather .weather-widget {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    margin: 0 auto !important;
    width: auto !important;
    max-width: 100% !important;
}

/* Force all weather-related divs to center */
div[class*="weather"]:not(.weather-unavailable),
div[id*="weather"]:not(.weather-unavailable),
span[class*="weather"]:not(.weather-unavailable) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    margin: 0 2px !important;
}

/* Override any conflicting styles */
.fm-weather-root {
    float: none !important;
    clear: both !important;
    position: relative !important;
}

/* Specific plugin overrides */
.fm-weather-root table,
.fm-weather-root tr,
.fm-weather-root td {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: none !important;
    padding: 2px 4px !important;
    margin: 0 !important;
    text-align: center !important;
    width: auto !important;
}

.header-search {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-left: auto;
}

.search-form {
    position: relative;
}

.search-input {
    padding: 8px 35px 8px 12px;
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: 20px;
    background: rgba(255,255,255,0.1);
    color: white;
    width: 220px;
    font-size: 13px;
    backdrop-filter: blur(10px);
    transition: all 0.3s ease;
    font-weight: 400;
}

.search-input::placeholder {
    color: #cbd5e1;
    font-size: 13px;
}

.search-input:focus {
    outline: none;
    border-color: #3b82f6;
    background: rgba(255,255,255,0.15);
    box-shadow: 0 0 15px rgba(59, 130, 246, 0.2);
    width: 260px;
}

.search-button {
    position: absolute;
    right: 3px;
    top: 50%;
    transform: translateY(-50%);
    background: #3b82f6;
    border: none;
    padding: 6px 8px;
    border-radius: 15px;
    color: white;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 12px;
}

.search-button:hover {
    background: #2563eb;
    transform: translateY(-50%) scale(1.05);
}

/* NAVIGATION */
.main-navigation {
    background: rgba(0,0,0,0.1);
    padding: 0;
    border-top: 1px solid rgba(255,255,255,0.1);
}

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

.nav-menu li {
    position: relative;
}

.nav-menu a {
    display: block;
    padding: 15px 20px;
    color: #e2e8f0;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 0.5px;
    transition: all 0.3s ease;
}

.nav-menu a:hover,
.nav-menu .current-menu-item a {
    background: #3b82f6;
    color: white;
    text-decoration: none;
    transform: translateY(-2px);
}

/* BREAKING NEWS BAR - HIDDEN */
.breaking-news {
    display: none !important;
}

/* MAIN CONTENT AREA - FULL WIDTH LAYOUT (NO SIDEBAR) */
.site-main {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    padding: 40px 0;
    min-height: 60vh;
    max-width: 100%;
}

.content-area {
    background: white;
    border-radius: 15px;
    padding: 30px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
    border: 1px solid #e5e7eb;
}

/* HERO SECTION */
.hero-section {
    margin-bottom: 40px;
}

.hero-article {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    height: 400px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    display: flex;
    align-items: end;
}

.hero-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, transparent 70%);
    z-index: 2;
}

.hero-content {
    position: relative;
    z-index: 3;
    padding: 40px;
    color: white;
    width: 100%;
}

.hero-category {
    display: inline-block;
    background: #3b82f6;
    color: white;
    padding: 6px 15px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 15px;
}

.hero-title {
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 15px;
    text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}

.hero-excerpt {
    font-size: 1.1rem;
    line-height: 1.6;
    opacity: 0.9;
    margin-bottom: 20px;
}

.hero-meta {
    display: flex;
    align-items: center;
    gap: 20px;
    font-size: 14px;
    opacity: 0.8;
}

/* NEWS GRID - Optimizat pentru full-width layout */
.news-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 25px;
    margin-bottom: 40px;
}

/* Homepage News Grid - 3 coloane exacte */
.home .news-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.news-card {
    background: white;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid #f1f5f9;
}

.news-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(0,0,0,0.15);
}

.news-image {
    position: relative;
    height: 200px;
    overflow: hidden;
}

.news-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.news-card:hover .news-image img {
    transform: scale(1.05);
}

.news-content {
    padding: 25px;
}

.news-category {
    display: inline-block;
    background: #f1f5f9;
    color: #475569;
    padding: 4px 12px;
    border-radius: 15px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 15px;
}

.news-title {
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.4;
    margin-bottom: 12px;
}

.news-title a {
    color: #1f2937;
    text-decoration: none;
}

.news-title a:hover {
    color: #3b82f6;
}

.news-excerpt {
    color: #6b7280;
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 15px;
}

.news-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13px;
    color: #9ca3af;
    padding-top: 15px;
    border-top: 1px solid #f3f4f6;
}

.news-author {
    font-weight: 500;
}

.news-date {
    font-weight: 400;
}

/* SIDEBAR */
.sidebar {
    background: white;
    border-radius: 15px;
    padding: 30px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
    border: 1px solid #e5e7eb;
    height: fit-content;
    position: sticky;
    top: 120px;
}

.widget {
    margin-bottom: 35px;
}

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

.widget-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: #1f2937;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 3px solid #3b82f6;
    position: relative;
}

.widget-title::after {
    content: "";
    position: absolute;
    bottom: -3px;
    left: 0;
    width: 40px;
    height: 3px;
    background: #60a5fa;
}

/* TRENDING WIDGET */
.trending-post {
    display: flex;
    gap: 15px;
    padding: 15px 0;
    border-bottom: 1px solid #f3f4f6;
}

.trending-post:last-child {
    border-bottom: none;
}

.trending-image {
    width: 80px;
    height: 60px;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
}

.trending-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.trending-content h4 {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    margin-bottom: 5px;
}

.trending-content a {
    color: #374151;
    text-decoration: none;
}

.trending-content a:hover {
    color: #3b82f6;
}

.trending-meta {
    font-size: 12px;
    color: #9ca3af;
}

/* FOOTER */
.site-footer {
    background: #1f2937;
    color: #d1d5db;
    padding: 60px 0 30px;
    margin-top: 60px;
}

.footer-content {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 40px;
    margin-bottom: 40px;
}

.footer-section h3 {
    color: white;
    font-size: 1.25rem;
    margin-bottom: 20px;
}

.footer-section p {
    color: #9ca3af;
    line-height: 1.7;
}

.footer-section ul {
    list-style: none;
}

.footer-section ul li {
    margin-bottom: 10px;
}

.footer-section ul li a {
    color: #d1d5db;
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-section ul li a:hover {
    color: #3b82f6;
}

.footer-bottom {
    border-top: 1px solid #374151;
    padding-top: 30px;
    text-align: center;
    color: #9ca3af;
    font-size: 14px;
}

/* BREADCRUMBS */
.factmedia-breadcrumb {
    background: #f8fafc;
    padding: 15px 0;
    margin-bottom: 30px;
    border-radius: 10px;
    font-size: 14px;
}

.factmedia-breadcrumb a {
    color: #6b7280;
    text-decoration: none;
}

.factmedia-breadcrumb a:hover {
    color: #3b82f6;
}

.factmedia-breadcrumb span {
    color: #1f2937;
    font-weight: 500;
}

/* PAGINATION */
.factmedia-pagination {
    margin-top: 40px;
    display: flex;
    justify-content: center;
}

.pagination-list {
    display: flex;
    list-style: none;
    gap: 10px;
    align-items: center;
}

.pagination-item a,
.pagination-item span {
    display: block;
    padding: 12px 16px;
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    color: #6b7280;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.3s ease;
}

.pagination-item a:hover {
    background: #3b82f6;
    color: white;
    border-color: #3b82f6;
}

.pagination-item.current span {
    background: #3b82f6;
    color: white;
    border-color: #3b82f6;
}

/* RESPONSIVE DESIGN */
@media (max-width: 768px) {
    .site-main {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .header-content {
        flex-direction: row;
        gap: 15px;
        justify-content: space-between;
    }
    
    .site-logo {
        font-size: 1.8rem;
    }
    
    .header-search {
        margin-left: 0;
    }
    
    .search-input {
        width: 180px;
        font-size: 12px;
        padding: 6px 30px 6px 10px;
    }
    
    .search-input:focus {
        width: 200px;
    }
    
    .search-button {
        padding: 5px 6px;
        font-size: 11px;
    }
    
    .nav-menu {
        flex-wrap: wrap;
        justify-content: center;
    }
    
    .hero-title {
        font-size: 1.8rem;
    }
    
    .news-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .breaking-content {
        animation: none;
        white-space: normal;
    }
    
    .footer-content {
        grid-template-columns: 1fr;
        gap: 30px;
    }
}

@media (max-width: 480px) {
    .container {
        padding: 0 15px;
    }
    
    .header-content {
        gap: 10px;
    }
    
    .site-logo {
        font-size: 1.6rem;
    }
    
    .search-input {
        width: 150px;
        font-size: 11px;
        padding: 5px 25px 5px 8px;
    }
    
    .search-input:focus {
        width: 170px;
    }
    
    .search-button {
        padding: 4px 5px;
        font-size: 10px;
        right: 2px;
    }
    
    .content-area,
    .sidebar {
        padding: 20px;
    }
    
    .hero-content {
        padding: 20px;
    }
    
    .hero-title {
        font-size: 1.5rem;
    }
    
    .news-content {
        padding: 20px;
    }
    
    h1 { font-size: 2rem; }
    h2 { font-size: 1.75rem; }
    h3 { font-size: 1.5rem; }
}

/* UTILITY CLASSES */
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }

.mt-0 { margin-top: 0; }
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 0.75rem; }
.mt-4 { margin-top: 1rem; }
.mt-5 { margin-top: 1.25rem; }

.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: 0.25rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-3 { margin-bottom: 0.75rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-5 { margin-bottom: 1.25rem; }

.hidden { display: none; }
.block { display: block; }
.inline-block { display: inline-block; }
.flex { display: flex; }
.grid { display: grid; }

/* ANIMATIONS */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes slideInLeft {
    from { opacity: 0; transform: translateX(-50px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes slideInRight {
    from { opacity: 0; transform: translateX(50px); }
    to { opacity: 1; transform: translateX(0); }
}

.fade-in {
    animation: fadeIn 0.6s ease-out;
}

.slide-in-left {
    animation: slideInLeft 0.6s ease-out;
}

.slide-in-right {
    animation: slideInRight 0.6s ease-out;
}

/* LOADING STATES */
.loading {
    position: relative;
    overflow: hidden;
}

.loading::after {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.6), transparent);
    animation: loading 1.5s infinite;
}

@keyframes loading {
    0% { left: -100%; }
    100% { left: 100%; }
}

/* ELEGANT NEWS SECTION */
.elegant-news-section {
    margin: 40px 0 60px;
}

.elegant-news-section .container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ELEGANT TRENDING SECTION */
.trending-section-elegant {
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
    padding: 50px 0;
    margin: 60px 0;
}

.trending-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.trending-title {
    font-size: 1.5rem !important;
    font-weight: 600 !important;
    color: #1f2937 !important;
    margin-bottom: 30px !important;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    letter-spacing: -0.01em;
}

.trending-title i {
    color: #f59e0b;
    font-size: 1.3rem;
}

.trending-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 20px;
    margin-top: 30px;
}

.trending-item-elegant {
    background: white;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    border: 1px solid #f1f5f9;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 15px;
}

.trending-item-elegant:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
}

.trending-number-elegant {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
    color: white;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 16px;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

.trending-content-elegant {
    flex: 1;
}

.trending-post-title {
    font-size: 1rem !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    margin-bottom: 8px !important;
    letter-spacing: -0.01em;
}

.trending-post-title a {
    color: #1f2937;
    text-decoration: none;
    transition: color 0.3s ease;
}

.trending-post-title a:hover {
    color: #3b82f6;
    text-decoration: none;
}

.trending-meta-elegant {
    font-size: 13px;
    color: #6b7280;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* ELEGANT NEWSLETTER SECTION */
.newsletter-banner-elegant {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    margin: 60px 0;
    padding: 0;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 20px 40px rgba(102, 126, 234, 0.2);
}

.newsletter-content-elegant {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    min-height: 200px;
    gap: 40px;
    padding: 50px;
}

.newsletter-left {
    color: white;
}

.newsletter-title-elegant {
    font-size: 2rem !important;
    font-weight: 600 !important;
    margin-bottom: 15px !important;
    color: white !important;
    display: flex;
    align-items: center;
    gap: 15px;
    letter-spacing: -0.02em;
}

.newsletter-title-elegant i {
    font-size: 1.8rem;
    opacity: 0.9;
}

.newsletter-desc-elegant {
    font-size: 1.1rem;
    line-height: 1.6;
    color: rgba(255,255,255,0.9);
    margin: 0;
}

.newsletter-right {
    display: flex;
    justify-content: center;
    align-items: center;
}

.newsletter-form-elegant {
    width: 100%;
    max-width: 400px;
}

.newsletter-input-group {
    display: flex;
    background: white;
    border-radius: 50px;
    padding: 8px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
}

.newsletter-input-group:focus-within {
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    transform: translateY(-2px);
}

.newsletter-input-elegant {
    flex: 1;
    border: none;
    outline: none;
    padding: 15px 20px;
    font-size: 16px;
    background: transparent;
    color: #1f2937;
}

.newsletter-input-elegant::placeholder {
    color: #9ca3af;
}

.newsletter-button-elegant {
    background: linear-gradient(135deg, #1f2937 0%, #111827 100%);
    color: white;
    border: none;
    padding: 15px 25px;
    border-radius: 40px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    box-shadow: 0 4px 15px rgba(31, 41, 55, 0.3);
}

.newsletter-button-elegant:hover {
    background: linear-gradient(135deg, #111827 0%, #000000 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(31, 41, 55, 0.4);
}

.newsletter-button-elegant i {
    font-size: 14px;
}

/* RESPONSIVE DESIGN for new sections */
@media (max-width: 768px) {
    .trending-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .trending-item-elegant {
        padding: 15px;
    }
    
    .newsletter-content-elegant {
        grid-template-columns: 1fr;
        gap: 30px;
        padding: 40px 30px;
        text-align: center;
    }
    
    .newsletter-title-elegant {
        font-size: 1.5rem !important;
        justify-content: center;
    }
    
    .newsletter-input-group {
        flex-direction: column;
        gap: 10px;
        padding: 15px;
        border-radius: 20px;
    }
    
    .newsletter-button-elegant {
        border-radius: 15px;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .trending-wrapper {
        padding: 0 15px;
    }
    
    .trending-title {
        font-size: 1.3rem !important;
    }
    
    .newsletter-content-elegant {
        padding: 30px 20px;
    }
    
    .newsletter-title-elegant {
        font-size: 1.3rem !important;
        flex-direction: column;
        gap: 10px;
    }
}

/* PROFESSIONAL HOMEPAGE STYLES - BBC/NYT INSPIRED */

/* Hero Section Professional */
.hero-section-professional {
    background: #ffffff;
    padding: 40px 0;
    border-bottom: 1px solid #e5e7eb;
}

.hero-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 40px;
    align-items: start;
}

/* Homepage Hero Grid - revin la 2 coloane originale */
.home .hero-grid {
    grid-template-columns: 2fr 1fr;
    gap: 40px;
}

/* Main Hero Article */
.hero-main-article {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    border: 1px solid #f1f5f9;
}

.hero-main-image {
    position: relative;
    height: 300px;
    overflow: hidden;
}

.hero-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.hero-main-article:hover .hero-img {
    transform: scale(1.02);
}

.hero-category-tag {
    position: absolute;
    top: 20px;
    left: 20px;
    background: #dc2626;
    color: white;
    padding: 6px 12px;
    border-radius: 15px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.hero-main-content {
    padding: 30px;
}

.hero-main-title {
    font-size: 1.8rem !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    margin-bottom: 15px !important;
    letter-spacing: -0.02em;
}

.hero-main-title a {
    color: #111827;
    text-decoration: none;
}

.hero-main-title a:hover {
    color: #3b82f6;
}

.hero-main-excerpt {
    font-size: 1.1rem;
    line-height: 1.6;
    color: #4b5563;
    margin-bottom: 20px;
}

.hero-main-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 20px;
    border-top: 1px solid #f3f4f6;
}

.meta-author {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #6b7280;
}

.meta-author img {
    border-radius: 50%;
}

.meta-details {
    display: flex;
    align-items: center;
    gap: 15px;
    font-size: 13px;
    color: #9ca3af;
}

/* Secondary Hero Articles */
.hero-secondary {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.hero-secondary-article {
    display: flex;
    gap: 15px;
    padding: 15px;
    background: white;
    border-radius: 10px;
    border: 1px solid #f1f5f9;
    transition: all 0.3s ease;
}

.hero-secondary-article:hover {
    border-color: #e5e7eb;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}

.hero-secondary-image {
    width: 100px;
    height: 70px;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
}

.hero-secondary-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-secondary-content {
    flex: 1;
}

.secondary-category {
    font-size: 10px;
    color: #7c3aed;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 5px;
    display: block;
}

.hero-secondary-title {
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 8px !important;
}

.hero-secondary-title a {
    color: #374151;
    text-decoration: none;
}

.hero-secondary-title a:hover {
    color: #3b82f6;
}

.hero-secondary-meta {
    font-size: 11px;
    color: #9ca3af;
    display: flex;
    gap: 8px;
    align-items: center;
}

/* Main Content Professional Layout */
.main-content-professional {
    padding: 50px 0;
    background: #fafafa;
}

.content-full-width {
    width: 100%;
}

.content-main-full {
    background: transparent;
    max-width: 100%;
}

.content-main {
    background: white;
    border-radius: 15px;
    padding: 40px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.05);
}

.content-sidebar {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

/* Section Headers Professional */
.section-header-pro {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding-bottom: 15px;
    border-bottom: 3px solid #f1f5f9;
}

.section-title-pro {
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    color: #111827 !important;
    margin: 0 !important;
    display: flex;
    align-items: center;
    gap: 12px;
    letter-spacing: -0.01em;
}

.section-title-pro i {
    color: #3b82f6;
    font-size: 1.3rem;
}

.section-link {
    color: #6b7280;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: color 0.3s ease;
}

.section-link:hover {
    color: #3b82f6;
    text-decoration: underline;
}

.live-indicator {
    background: #dc2626;
    color: white;
    padding: 3px 8px;
    border-radius: 10px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    animation: pulse 2s infinite;
    margin-left: 10px;
}

/* Thematic Sections */
.thematic-section {
    margin-bottom: 50px;
}

.thematic-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 25px;
}

/* Homepage Thematic Grid - 3 coloane exacte */
.home .thematic-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.thematic-card {
    background: #f9fafb;
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.3s ease;
    border: 1px solid #f3f4f6;
}

.thematic-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
    border-color: #e5e7eb;
}

.thematic-image {
    height: 160px;
    overflow: hidden;
}

.thematic-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.thematic-card:hover .thematic-image img {
    transform: scale(1.05);
}

.thematic-content {
    padding: 20px;
}

.thematic-title {
    font-size: 1.1rem !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 10px !important;
}

.thematic-title a {
    color: #111827;
    text-decoration: none;
}

.thematic-title a:hover {
    color: #3b82f6;
}

.thematic-excerpt {
    font-size: 14px;
    color: #6b7280;
    line-height: 1.6;
    margin-bottom: 15px;
}

.thematic-meta {
    font-size: 12px;
    color: #9ca3af;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.meta-source {
    color: #3b82f6;
    font-weight: 500;
}

/* Economy Section Specific */
.economy-layout {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 30px;
    align-items: start;
}

.economy-news {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.economy-article {
    display: flex;
    gap: 15px;
    padding: 20px;
    background: #f8fafc;
    border-radius: 10px;
    border-left: 4px solid #10b981;
}

.economy-image {
    width: 80px;
    height: 60px;
    border-radius: 6px;
    overflow: hidden;
    flex-shrink: 0;
}

.economy-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.economy-content {
    flex: 1;
}

.economy-title {
    font-size: 1rem !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 8px !important;
}

.economy-title a {
    color: #111827;
    text-decoration: none;
}

.economy-title a:hover {
    color: #10b981;
}

.economy-meta {
    font-size: 12px;
    color: #6b7280;
    display: flex;
    gap: 8px;
    align-items: center;
}

/* Economy Data Widget */
.economy-data {
    background: #111827;
    color: white;
    padding: 25px;
    border-radius: 12px;
}

.data-widget h4 {
    color: white !important;
    margin-bottom: 20px !important;
    font-size: 1.1rem !important;
}

.data-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid #374151;
}

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

.data-label {
    font-size: 13px;
    color: #d1d5db;
    font-weight: 500;
}

.data-value {
    font-size: 14px;
    font-weight: 700;
    color: white;
}

.data-change {
    font-size: 12px;
    font-weight: 600;
    padding: 4px 8px;
    border-radius: 12px;
}

.data-change.positive {
    color: #10b981;
    background: rgba(16, 185, 129, 0.1);
}

.data-change.negative {
    color: #ef4444;
    background: rgba(239, 68, 68, 0.1);
}

/* Sports Section */
.sports-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 25px;
}

/* Homepage Sports Grid - 3 coloane exacte */
.home .sports-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.sports-card {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    border: 1px solid #f1f5f9;
}

.sports-image {
    position: relative;
    height: 180px;
    overflow: hidden;
}

.sports-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.live-score {
    position: absolute;
    bottom: 15px;
    right: 15px;
    background: rgba(0,0,0,0.9);
    color: white;
    padding: 8px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.live-score .score {
    color: #10b981;
    font-weight: 700;
}

.sports-content {
    padding: 20px;
}

.sports-title {
    font-size: 1.1rem !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 12px !important;
}

.sports-title a {
    color: #111827;
    text-decoration: none;
}

.sports-title a:hover {
    color: #f59e0b;
}

.sports-meta {
    font-size: 13px;
    color: #6b7280;
    display: flex;
    gap: 8px;
    align-items: center;
}

/* International Section */
.international-layout {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.international-article {
    display: flex;
    gap: 15px;
    padding: 20px;
    background: #f8fafc;
    border-radius: 10px;
    border-left: 4px solid #6366f1;
    transition: all 0.3s ease;
}

.international-article:hover {
    background: #f1f5f9;
    transform: translateX(5px);
}

.international-flag {
    width: 40px;
    height: 40px;
    background: #6366f1;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    flex-shrink: 0;
}

.international-content {
    flex: 1;
}

.international-location {
    font-size: 11px;
    color: #6366f1;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 5px;
}

.international-title {
    font-size: 1rem !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 8px !important;
}

.international-title a {
    color: #111827;
    text-decoration: none;
}

.international-title a:hover {
    color: #6366f1;
}

.international-meta {
    font-size: 12px;
    color: #6b7280;
    display: flex;
    gap: 8px;
    align-items: center;
}

.source-link {
    color: #3b82f6;
    text-decoration: none;
    font-weight: 500;
}

.source-link:hover {
    text-decoration: underline;
}

/* Opinions Section */
.opinions-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 25px;
}

.opinion-card {
    background: white;
    border-radius: 12px;
    padding: 25px;
    border: 1px solid #f1f5f9;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}

.opinion-author {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid #f3f4f6;
}

.opinion-author img {
    border-radius: 50%;
    border: 2px solid #e5e7eb;
}

.author-info h4 {
    font-size: 1rem !important;
    font-weight: 600 !important;
    color: #111827 !important;
    margin-bottom: 3px !important;
}

.author-title {
    font-size: 12px;
    color: #6b7280;
    font-weight: 500;
}

.opinion-title {
    font-size: 1.1rem !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 12px !important;
}

.opinion-title a {
    color: #111827;
    text-decoration: none;
}

.opinion-title a:hover {
    color: #7c3aed;
}

.opinion-excerpt {
    font-size: 14px;
    color: #6b7280;
    line-height: 1.6;
    margin-bottom: 15px;
}

.opinion-time {
    font-size: 12px;
    color: #9ca3af;
}

/* Sidebar Styles */
.sidebar-section {
    background: white;
    border-radius: 15px;
    padding: 25px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.05);
    border: 1px solid #f1f5f9;
}

.sidebar-title {
    font-size: 1.25rem !important;
    font-weight: 700 !important;
    color: #111827 !important;
    margin-bottom: 20px !important;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 15px;
    border-bottom: 2px solid #f1f5f9;
}

.sidebar-title i {
    color: #3b82f6;
}

/* Latest News Feed */
.latest-feed {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.latest-item {
    display: flex;
    gap: 15px;
    padding: 15px 0;
    border-bottom: 1px solid #f3f4f6;
    position: relative;
}

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

.latest-time {
    width: 60px;
    flex-shrink: 0;
    text-align: center;
}

.latest-time time {
    font-size: 14px;
    font-weight: 600;
    color: #111827;
    display: block;
}

.time-ago {
    font-size: 10px;
    color: #9ca3af;
    display: block;
    margin-top: 2px;
}

.latest-content {
    flex: 1;
}

.latest-title {
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 8px !important;
}

.latest-title a {
    color: #374151;
    text-decoration: none;
}

.latest-title a:hover {
    color: #3b82f6;
}

.latest-excerpt {
    font-size: 12px;
    color: #6b7280;
    line-height: 1.5;
}

.latest-indicator {
    width: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.breaking-dot {
    width: 8px;
    height: 8px;
    background: #dc2626;
    border-radius: 50%;
    animation: pulse 2s infinite;
}

/* Trending Sidebar */
.trending-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.trending-sidebar-item {
    display: flex;
    gap: 12px;
    align-items: start;
}

.trending-rank {
    background: #3b82f6;
    color: white;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    flex-shrink: 0;
}

.trending-sidebar-content {
    flex: 1;
}

.trending-sidebar-title {
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 6px !important;
}

.trending-sidebar-title a {
    color: #374151;
    text-decoration: none;
}

.trending-sidebar-title a:hover {
    color: #3b82f6;
}

.trending-sidebar-meta {
    font-size: 11px;
    color: #9ca3af;
    display: flex;
    gap: 6px;
    align-items: center;
}

/* Multimedia Sidebar */
.multimedia-content {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.multimedia-item {
    padding: 15px;
    background: #f8fafc;
    border-radius: 10px;
    border-left: 4px solid #8b5cf6;
}

.multimedia-type {
    font-size: 11px;
    color: #8b5cf6;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.multimedia-title {
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 6px !important;
}

.multimedia-title a {
    color: #374151;
    text-decoration: none;
}

.multimedia-title a:hover {
    color: #8b5cf6;
}

.multimedia-count {
    font-size: 12px;
    color: #6b7280;
    font-weight: 500;
}

/* RESPONSIVE DESIGN */
@media (max-width: 1024px) {
    .content-columns {
        grid-template-columns: 65% 35%;
        gap: 30px;
    }
    
    .hero-grid {
        gap: 30px;
    }
    
    .economy-layout {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

@media (max-width: 768px) {
    .hero-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .content-columns {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .content-main {
        padding: 25px;
    }
    
    .thematic-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .sports-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .opinions-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .section-header-pro {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
}

@media (max-width: 480px) {
    .hero-section-professional {
        padding: 20px 0;
    }
    
    .main-content-professional {
        padding: 30px 0;
    }
    
    .hero-main-content {
        padding: 20px;
    }
    
    .hero-main-title {
        font-size: 1.4rem !important;
    }
    
    .content-main {
        padding: 20px;
    }
    
    .sidebar-section {
        padding: 20px;
    }
    
    .thematic-card {
        margin-bottom: 15px;
    }
}

/* CATEGORY FEATURED ARTICLES SECTION */
.category-featured-section {
    margin-bottom: 40px;
    background: white;
    border-radius: 15px;
    padding: 30px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    border: 1px solid #f1f5f9;
}

.featured-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding-bottom: 15px;
    border-bottom: 2px solid #f1f5f9;
}

.featured-title {
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    color: #111827 !important;
    margin: 0 !important;
    display: flex;
    align-items: center;
    gap: 12px;
}

.featured-title i {
    color: #f59e0b;
    font-size: 1.3rem;
}

.featured-count {
    font-size: 14px;
    color: #6b7280;
    background: #f3f4f6;
    padding: 6px 12px;
    border-radius: 20px;
    font-weight: 500;
}

.featured-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
    gap: 30px;
}

.featured-article-card {
    background: #f8fafc;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
    border: 1px solid #e5e7eb;
    transition: all 0.3s ease;
}

.featured-article-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.15);
}

.featured-article-image {
    position: relative;
    height: 280px;
    overflow: hidden;
}

.featured-article-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.featured-article-card:hover .featured-article-image img {
    transform: scale(1.05);
}

.featured-badges {
    position: absolute;
    top: 20px;
    left: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.featured-badge {
    background: linear-gradient(45deg, #f59e0b, #fbbf24);
    color: white;
    padding: 8px 15px;
    border-radius: 25px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: flex;
    align-items: center;
    gap: 6px;
    box-shadow: 0 4px 15px rgba(245, 158, 11, 0.4);
}

.breaking-badge {
    background: linear-gradient(45deg, #dc2626, #ef4444);
    color: white;
    padding: 8px 15px;
    border-radius: 25px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    animation: pulse 2s infinite;
    display: flex;
    align-items: center;
    gap: 6px;
    box-shadow: 0 4px 15px rgba(220, 38, 38, 0.4);
}

.article-type-badge {
    position: absolute;
    bottom: 20px;
    right: 20px;
}

.type-badge {
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    backdrop-filter: blur(10px);
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

.type-badge.analysis {
    background: rgba(99, 102, 241, 0.9);
    color: white;
}

.type-badge.reportage {
    background: rgba(16, 185, 129, 0.9);
    color: white;
}

.type-badge.breaking {
    background: rgba(220, 38, 38, 0.9);
    color: white;
}

.type-badge.news {
    background: rgba(59, 130, 246, 0.9);
    color: white;
}

.featured-article-content {
    padding: 30px;
}

.featured-article-title {
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    margin-bottom: 15px !important;
    color: #111827;
}

.featured-article-title a {
    color: #111827;
    text-decoration: none;
    transition: color 0.3s ease;
}

.featured-article-title a:hover {
    color: #3b82f6;
}

.featured-article-excerpt {
    font-size: 16px;
    line-height: 1.6;
    color: #4b5563;
    margin-bottom: 20px;
}

.featured-article-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 20px;
    border-top: 1px solid #e5e7eb;
    font-size: 14px;
}

.meta-left {
    display: flex;
    gap: 20px;
    align-items: center;
}

.meta-right {
    display: flex;
    gap: 15px;
    align-items: center;
}

.meta-author,
.meta-date,
.meta-views,
.meta-reading {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #6b7280;
    font-weight: 500;
}

.meta-author i,
.meta-date i,
.meta-views i,
.meta-reading i {
    color: #9ca3af;
    font-size: 12px;
}

/* Responsive pentru Featured Articles */
@media (max-width: 768px) {
    .featured-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .featured-article-content {
        padding: 20px;
    }
    
    .featured-article-title {
        font-size: 1.3rem !important;
    }
    
    .featured-article-meta {
        flex-direction: column;
        gap: 15px;
        align-items: flex-start;
    }
    
    .meta-left,
    .meta-right {
        width: 100%;
        justify-content: space-between;
    }
}

@media (max-width: 480px) {
    .category-featured-section {
        padding: 20px;
    }
    
    .featured-header {
        flex-direction: column;
        gap: 15px;
        align-items: flex-start;
    }
    
    .featured-article-image {
        height: 220px;
    }
    
    .meta-left,
    .meta-right {
        flex-wrap: wrap;
        gap: 10px;
    }
}

/* ARTICLE PAGE STYLES */

/* Article Main Layout with Sidebar */
.article-main-layout {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 40px;
    padding: 0 40px 40px;
}

.article-content-wrapper {
    width: 100%;
}

.article-sidebar {
    position: sticky;
    top: 120px;
    height: fit-content;
}

/* Key Information Box */
.key-info-box {
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    border: 2px solid #3b82f6;
    border-radius: 15px;
    padding: 25px;
    margin-bottom: 30px;
    position: relative;
}

.key-info-box::before {
    content: "";
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background: linear-gradient(45deg, #3b82f6, #8b5cf6, #3b82f6);
    border-radius: 17px;
    z-index: -1;
    opacity: 0.7;
}

.key-info-box h4 {
    color: #1e40af !important;
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    margin-bottom: 15px !important;
    display: flex;
    align-items: center;
    gap: 10px;
}

.key-info-content {
    color: #1e40af;
    font-weight: 500;
    line-height: 1.6;
}

/* Inline Related Article */
.inline-related-article {
    background: #f8fafc;
    border: 2px solid #e5e7eb;
    border-radius: 15px;
    padding: 25px;
    margin: 40px 0;
    transition: all 0.3s ease;
}

.inline-related-article:hover {
    border-color: #3b82f6;
    box-shadow: 0 8px 25px rgba(59, 130, 246, 0.1);
}

.inline-related-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    color: #3b82f6;
    font-weight: 600;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.inline-related-content {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}

.inline-related-image {
    width: 120px;
    height: 90px;
    border-radius: 10px;
    overflow: hidden;
    flex-shrink: 0;
}

.inline-related-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inline-related-text {
    flex: 1;
}

.inline-related-text h5 {
    font-size: 1.1rem !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 10px !important;
}

.inline-related-text h5 a {
    color: #1f2937;
    text-decoration: none;
}

.inline-related-text h5 a:hover {
    color: #3b82f6;
}

.inline-related-text p {
    color: #6b7280;
    font-size: 15px;
    line-height: 1.5;
    margin-bottom: 15px;
}

.read-more-inline {
    color: #3b82f6;
    font-weight: 600;
    text-decoration: none;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: all 0.3s ease;
}

.read-more-inline:hover {
    color: #2563eb;
    transform: translateX(3px);
}

/* Statistics Chart */
.statistics-chart {
    background: #1f2937;
    color: white;
    border-radius: 15px;
    padding: 30px;
    margin: 40px 0;
    box-shadow: 0 10px 30px rgba(31, 41, 55, 0.3);
}

.statistics-chart h4 {
    color: white !important;
    font-size: 1.25rem !important;
    font-weight: 700 !important;
    margin-bottom: 20px !important;
    display: flex;
    align-items: center;
    gap: 12px;
}

.statistics-chart h4 i {
    color: #60a5fa;
    font-size: 1.2rem;
}

.stats-content {
    color: #e5e7eb;
    line-height: 1.7;
}

.stats-content p {
    color: #e5e7eb;
}

/* Highlighted Quote */
.highlighted-quote {
    background: linear-gradient(135deg, #f59e0b 0%, #f97316 100%);
    border-radius: 20px;
    padding: 40px;
    margin: 50px 0;
    position: relative;
    color: white;
    text-align: center;
    box-shadow: 0 15px 35px rgba(245, 158, 11, 0.3);
}

.quote-icon {
    position: absolute;
    top: -20px;
    left: 50%;
    transform: translateX(-50%);
    background: white;
    color: #f59e0b;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    box-shadow: 0 8px 20px rgba(0,0,0,0.1);
}

.highlighted-quote blockquote {
    font-size: 1.5rem !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin: 20px 0 !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    color: white !important;
    font-style: italic;
}

.quote-author {
    font-size: 16px;
    font-weight: 500;
    opacity: 0.9;
    margin-top: 20px;
}

.quote-author::before {
    content: "— ";
}

/* Article Sidebar Widgets */
.sidebar-widget {
    background: white;
    border-radius: 15px;
    padding: 25px;
    margin-bottom: 30px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    border: 1px solid #f1f5f9;
}

.widget-title {
    font-size: 1.2rem !important;
    font-weight: 700 !important;
    color: #1f2937 !important;
    margin-bottom: 20px !important;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 15px;
    border-bottom: 2px solid #f1f5f9;
}

.widget-title i {
    color: #3b82f6;
    font-size: 1.1rem;
}

/* Latest News List */
.latest-news-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.latest-news-item {
    display: flex;
    gap: 15px;
    padding: 15px 0;
    border-bottom: 1px solid #f3f4f6;
    align-items: flex-start;
}

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

.news-time {
    background: #3b82f6;
    color: white;
    padding: 8px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    flex-shrink: 0;
    text-align: center;
    min-width: 50px;
}

.news-content {
    flex: 1;
}

.news-content h5 {
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 6px !important;
}

.news-content h5 a {
    color: #374151;
    text-decoration: none;
}

.news-content h5 a:hover {
    color: #3b82f6;
}

.news-category {
    font-size: 12px;
    color: #9ca3af;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Most Read List */
.most-read-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.most-read-item {
    display: flex;
    gap: 15px;
    padding: 15px 0;
    border-bottom: 1px solid #f3f4f6;
    align-items: flex-start;
}

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

.read-rank {
    background: linear-gradient(135deg, #f59e0b 0%, #fbbf24 100%);
    color: white;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 14px;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);
}

.read-content {
    flex: 1;
}

.read-content h5 {
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 8px !important;
}

.read-content h5 a {
    color: #374151;
    text-decoration: none;
}

.read-content h5 a:hover {
    color: #3b82f6;
}

.read-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    color: #9ca3af;
}

.read-views,
.read-date {
    display: flex;
    align-items: center;
    gap: 4px;
}

/* Newsletter Widget */
.newsletter-widget {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: white;
}

.newsletter-widget .widget-title {
    color: white !important;
    border-bottom-color: rgba(255,255,255,0.2);
}

.newsletter-widget .widget-title i {
    color: white;
}

.newsletter-content p {
    color: rgba(255,255,255,0.9);
    margin-bottom: 20px;
    line-height: 1.6;
}

.newsletter-form {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.newsletter-input {
    padding: 15px;
    border: none;
    border-radius: 10px;
    font-size: 14px;
    background: white;
    color: #1f2937;
}

.newsletter-input::placeholder {
    color: #9ca3af;
}

.newsletter-btn {
    background: #1f2937;
    color: white;
    border: none;
    padding: 15px 20px;
    border-radius: 10px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.newsletter-btn:hover {
    background: #111827;
    transform: translateY(-2px);
}

/* Responsive Design for Article Page */
@media (max-width: 1024px) {
    .article-main-layout {
        grid-template-columns: 1fr 280px;
        gap: 30px;
    }
}

@media (max-width: 768px) {
    .article-main-layout {
        grid-template-columns: 1fr;
        gap: 30px;
        padding: 0 20px 30px;
    }
    
    .article-sidebar {
        position: static;
        order: -1;
    }
    
    .sidebar-widget {
        padding: 20px;
    }
    
    .inline-related-content {
        flex-direction: column;
        gap: 15px;
    }
    
    .inline-related-image {
        width: 100%;
        height: 200px;
    }
    
    .highlighted-quote {
        padding: 30px 20px;
        margin: 30px 0;
    }
    
    .highlighted-quote blockquote {
        font-size: 1.3rem !important;
    }
    
    .statistics-chart {
        padding: 25px 20px;
    }
}

@media (max-width: 480px) {
    .key-info-box {
        padding: 20px;
        margin-bottom: 25px;
    }
    
    .inline-related-article {
        padding: 20px;
        margin: 30px 0;
    }
    
    .highlighted-quote {
        padding: 25px 15px;
    }
    
    .highlighted-quote blockquote {
        font-size: 1.1rem !important;
    }
    
    .sidebar-widget {
        padding: 15px;
        margin-bottom: 20px;
    }
    
    .most-read-item,
    .latest-news-item {
        padding: 12px 0;
    }
}

/* FULL WIDTH HOMEPAGE LAYOUT */
.home .site-main {
    grid-template-columns: 1fr;
    gap: 0;
    max-width: 100%;
}

.home .content-area {
    max-width: 100%;
    background: transparent;
    box-shadow: none;
    border: none;
    padding: 0;
}

.home .sidebar {
    display: none;
}

/* BNR RATES WIDGET STYLES */
.bnr-rates-widget {
    background: #1f2937;
    color: white;
    border-radius: 15px;
    padding: 25px;
    margin-bottom: 30px;
    box-shadow: 0 10px 30px rgba(31, 41, 55, 0.3);
    position: relative;
    overflow: hidden;
}

.bnr-rates-widget::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent);
    animation: shimmer-bnr 3s infinite;
}

@keyframes shimmer-bnr {
    0% { left: -100%; }
    100% { left: 100%; }
}

.bnr-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 2px solid rgba(255,255,255,0.1);
}

.bnr-header h4 {
    color: white !important;
    font-size: 1.2rem !important;
    font-weight: 700 !important;
    margin: 0 !important;
    display: flex;
    align-items: center;
    gap: 10px;
}

.bnr-header h4 i {
    color: #60a5fa;
    font-size: 1.1rem;
}

.bnr-date {
    font-size: 12px;
    color: #9ca3af;
    background: rgba(255,255,255,0.1);
    padding: 4px 10px;
    border-radius: 15px;
    font-weight: 500;
}

.bnr-rates-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.bnr-rate-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px;
    background: rgba(255,255,255,0.05);
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.1);
    transition: all 0.3s ease;
}

.bnr-rate-item:hover {
    background: rgba(255,255,255,0.1);
    transform: translateX(5px);
    border-color: #60a5fa;
}

.currency-info {
    display: flex;
    align-items: center;
    gap: 12px;
}

.currency-flag {
    font-size: 20px;
    width: 30px;
    text-align: center;
}

.currency-details {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.currency-code {
    font-weight: 700;
    font-size: 14px;
    color: white;
}

.currency-name {
    font-size: 11px;
    color: #d1d5db;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.rate-value {
    text-align: right;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.rate-number {
    font-weight: 700;
    font-size: 16px;
    color: white;
}

.rate-change {
    font-size: 11px;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 4px;
    justify-content: center;
}

.rate-change.positive {
    color: #10b981;
    background: rgba(16, 185, 129, 0.2);
}

.rate-change.negative {
    color: #ef4444;
    background: rgba(239, 68, 68, 0.2);
}

.rate-change.neutral {
    color: #9ca3af;
    background: rgba(156, 163, 175, 0.2);
}

.bnr-footer {
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid rgba(255,255,255,0.1);
    text-align: center;
}

.bnr-footer small {
    color: #9ca3af;
    font-size: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.bnr-footer i {
    color: #60a5fa;
}

.bnr-error {
    background: #dc2626;
    color: white;
    padding: 20px;
    border-radius: 10px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-weight: 600;
}

/* BNR Inline Styles (pentru header sau alte locuri) */
.bnr-inline {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

.bnr-inline-item {
    font-size: 13px;
    color: #e2e8f0;
    padding: 4px 8px;
    background: rgba(255,255,255,0.1);
    border-radius: 12px;
    white-space: nowrap;
}

.bnr-inline-item strong {
    color: #60a5fa;
    font-weight: 700;
}

.bnr-inline-error {
    color: #ef4444;
    font-size: 12px;
    font-style: italic;
}

/* Integration cu Economy Data Widget existent */
.economy-data .bnr-rates-widget {
    background: transparent;
    box-shadow: none;
    padding: 0;
    margin: 0;
}

.economy-data .bnr-header {
    border-bottom-color: #374151;
}

.economy-data .bnr-rate-item {
    background: rgba(255,255,255,0.03);
    border-color: #374151;
    padding: 12px;
}

.economy-data .bnr-rate-item:hover {
    background: rgba(255,255,255,0.08);
}

/* Responsive BNR Widget */
@media (max-width: 768px) {
    .bnr-rates-widget {
        padding: 20px;
    }
    
    .bnr-header {
        flex-direction: column;
        gap: 10px;
        align-items: flex-start;
        text-align: left;
    }
    
    .bnr-rate-item {
        padding: 12px;
    }
    
    .currency-flag {
        font-size: 16px;
        width: 25px;
    }
    
    .rate-number {
        font-size: 14px;
    }
    
    .currency-code {
        font-size: 13px;
    }
    
    .currency-name {
        font-size: 10px;
    }
}

@media (max-width: 480px) {
    .bnr-rates-widget {
        padding: 15px;
    }
    
    .bnr-rate-item {
        padding: 10px;
    }
    
    .bnr-inline {
        flex-direction: column;
        gap: 8px;
        align-items: flex-start;
    }
    
    .bnr-inline-item {
        font-size: 12px;
    }
}

/* Live Update Animation */
.bnr-updating {
    position: relative;
    opacity: 0.7;
}

.bnr-updating::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(45deg, transparent 30%, rgba(255,255,255,0.1) 50%, transparent 70%);
    animation: updating-shine 1.5s infinite;
}

@keyframes updating-shine {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

/* BNR Data Integration in Existing Widgets */
.data-widget .bnr-section {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #374151;
}

.data-widget .bnr-section h5 {
    color: white !important;
    font-size: 14px !important;
    margin-bottom: 15px !important;
    display: flex;
    align-items: center;
    gap: 8px;
}

.data-widget .bnr-section h5 i {
    color: #60a5fa;
    font-size: 12px;
}

.data-widget .bnr-mini-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.data-widget .bnr-mini-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid #374151;
    font-size: 12px;
}

.data-widget .bnr-mini-item:last-child {
    border-bottom: none;
}

.data-widget .bnr-mini-currency {
    color: #d1d5db;
    font-weight: 600;
}

.data-widget .bnr-mini-rate {
    color: white;
    font-weight: 700;
}

/* ===== HOMEPAGE NO SIDEBAR - FULL WIDTH LAYOUT ===== */
.home .content-area {
    width: 100% !important;
    max-width: 100% !important;
}

.home .sidebar,
.home aside,
.home #secondary,
.home .widget-area,
.home .sidebar-primary,
.home .sidebar-secondary {
    display: none !important;
    width: 0 !important;
    visibility: hidden !important;
}

/* Force full width on homepage */
.home .content-wrapper,
.home .main-content,
.home .site-content {
    width: 100% !important;
    flex: 1 1 100% !important;
}

/* Remove any margins/padding that might be for sidebar spacing */
.home .content-area {
    padding-right: 0 !important;
    margin-right: 0 !important;
}

/* ===== PAGE TEMPLATE STYLES ===== */

/* Page Container */
.page-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    background: var(--fc-background-color, #f8fafc);
}

/* Page Content Layout */
.page-content {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 40px;
    margin-top: 20px;
}

/* Page Main Content */
.page-main {
    background: var(--fc-content-bg-color, #ffffff);
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    border: 1px solid var(--fc-border-color, #e5e7eb);
    overflow: hidden;
}

.page-article {
    position: relative;
}

/* Page Header */
.page-header {
    padding: 40px;
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border-bottom: 1px solid var(--fc-border-color, #e5e7eb);
}

.page-title {
    font-size: 2.5rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    color: var(--fc-text-color, #1f2937) !important;
    margin-bottom: 15px !important;
    letter-spacing: -0.02em;
}

.page-subtitle {
    font-size: 1.2rem;
    color: var(--fc-text-secondary-color, #6b7280);
    line-height: 1.5;
    margin-bottom: 20px;
    font-weight: 400;
}

.page-meta {
    display: flex;
    gap: 25px;
    align-items: center;
    font-size: 14px;
    color: var(--fc-text-secondary-color, #9ca3af);
    flex-wrap: wrap;
}

.page-updated,
.page-author {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
}

.page-updated i,
.page-author i {
    color: var(--fc-primary-color, #3b82f6);
    font-size: 13px;
}

/* Page Featured Image */
.page-featured-image {
    position: relative;
    max-height: 400px;
    overflow: hidden;
}

.page-image {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
}

.page-image-caption {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0,0,0,0.8));
    color: white;
    padding: 20px 40px;
    font-size: 14px;
    font-style: italic;
}

/* Page Body Content */
.page-body {
    padding: 40px;
}

.page-body h1,
.page-body h2,
.page-body h3,
.page-body h4,
.page-body h5,
.page-body h6 {
    color: var(--fc-text-color, #1f2937) !important;
    margin-top: 2rem;
    margin-bottom: 1rem;
}

.page-body h2 {
    font-size: 1.8rem !important;
    font-weight: 600 !important;
    border-bottom: 2px solid var(--fc-primary-color, #3b82f6);
    padding-bottom: 10px;
}

.page-body h3 {
    font-size: 1.5rem !important;
    font-weight: 600 !important;
    color: var(--fc-secondary-color, #1e293b) !important;
}

.page-body p {
    color: var(--fc-text-color, #374151);
    font-size: 16px;
    line-height: 1.8;
    margin-bottom: 1.5rem;
}

.page-body ul,
.page-body ol {
    color: var(--fc-text-color, #374151);
    padding-left: 2rem;
    margin-bottom: 1.5rem;
}

.page-body li {
    margin-bottom: 0.5rem;
    line-height: 1.7;
}

.page-body blockquote {
    background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
    border-left: 4px solid var(--fc-primary-color, #3b82f6);
    padding: 20px 30px;
    margin: 2rem 0;
    font-style: italic;
    font-size: 1.1rem;
    border-radius: 0 10px 10px 0;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}

.page-body blockquote p {
    margin-bottom: 10px;
    color: var(--fc-text-color, #1f2937);
    font-weight: 500;
}

.page-body img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
    margin: 2rem 0;
}

.page-body table {
    width: 100%;
    border-collapse: collapse;
    margin: 2rem 0;
    background: white;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
}

.page-body th,
.page-body td {
    padding: 15px;
    text-align: left;
    border-bottom: 1px solid var(--fc-border-color, #e5e7eb);
}

.page-body th {
    background: var(--fc-primary-color, #3b82f6);
    color: white;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.5px;
}

.page-body tr:hover {
    background: #f8fafc;
}

/* Page Links (Pagination) */
.page-links {
    background: #f8fafc;
    padding: 20px;
    border-radius: 10px;
    margin: 2rem 0;
    text-align: center;
}

.page-number {
    display: inline-block;
    padding: 8px 15px;
    margin: 0 5px;
    background: var(--fc-primary-color, #3b82f6);
    color: white;
    border-radius: 20px;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.3s ease;
}

.page-number:hover {
    background: var(--fc-button-hover-color, #2563eb);
    transform: translateY(-2px);
}

/* Page Footer */
.page-footer {
    padding: 40px;
    background: #f8fafc;
    border-top: 1px solid var(--fc-border-color, #e5e7eb);
}

.page-contact,
.page-links-section {
    margin-bottom: 30px;
    padding: 25px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    border: 1px solid var(--fc-border-color, #e5e7eb);
}

.page-contact h3,
.page-links-section h3 {
    color: var(--fc-text-color, #1f2937) !important;
    font-size: 1.2rem !important;
    font-weight: 600 !important;
    margin-bottom: 15px !important;
    display: flex;
    align-items: center;
    gap: 10px;
}

.page-contact h3 i,
.page-links-section h3 i {
    color: var(--fc-primary-color, #3b82f6);
}

.contact-content,
.additional-links {
    color: var(--fc-text-color, #374151);
    line-height: 1.7;
}

/* Page Share Section */
.page-share {
    background: white;
    padding: 25px;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    border: 1px solid var(--fc-border-color, #e5e7eb);
    text-align: center;
}

.page-share h4 {
    color: var(--fc-text-color, #1f2937) !important;
    font-size: 1.1rem !important;
    font-weight: 600 !important;
    margin-bottom: 20px !important;
}

.share-buttons {
    display: flex;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}

.share-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    border-radius: 25px;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    transition: all 0.3s ease;
    color: white;
}

.share-btn.facebook {
    background: linear-gradient(135deg, #1877f2 0%, #4267b2 100%);
}

.share-btn.twitter {
    background: linear-gradient(135deg, #1da1f2 0%, #0e7ec1 100%);
}

.share-btn.whatsapp {
    background: linear-gradient(135deg, #25d366 0%, #128c7e 100%);
}

.share-btn.email {
    background: linear-gradient(135deg, #6b7280 0%, #4b5563 100%);
}

.share-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.2);
    color: white;
    text-decoration: none;
}

/* Page Comments */
.page-comments {
    background: white;
    border-radius: 15px;
    padding: 40px;
    margin-top: 30px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    border: 1px solid var(--fc-border-color, #e5e7eb);
}

/* Page Sidebar */
.page-sidebar {
    display: flex;
    flex-direction: column;
    gap: 25px;
    position: sticky;
    top: 120px;
    height: fit-content;
}

.sidebar-widget {
    background: white;
    border-radius: 15px;
    padding: 25px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    border: 1px solid var(--fc-border-color, #e5e7eb);
}

.widget-title {
    font-size: 1.2rem !important;
    font-weight: 700 !important;
    color: var(--fc-text-color, #1f2937) !important;
    margin-bottom: 20px !important;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 15px;
    border-bottom: 2px solid var(--fc-border-color, #f1f5f9);
}

.widget-title i {
    color: var(--fc-primary-color, #3b82f6);
    font-size: 1.1rem;
}

/* Page Navigation Widget */
.page-nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.page-nav-list li {
    margin-bottom: 10px;
}

.page-nav-list a {
    display: block;
    padding: 12px 15px;
    color: var(--fc-text-color, #374151);
    text-decoration: none;
    border-radius: 8px;
    transition: all 0.3s ease;
    font-weight: 500;
}

.page-nav-list a:hover,
.page-nav-list .current_page_item a {
    background: var(--fc-primary-color, #3b82f6);
    color: white;
    transform: translateX(5px);
}

.page-nav-list .children {
    margin-top: 10px;
    margin-left: 20px;
    padding-left: 15px;
    border-left: 2px solid var(--fc-border-color, #e5e7eb);
}

.page-nav-list .children a {
    font-size: 14px;
    padding: 8px 12px;
    color: var(--fc-text-secondary-color, #6b7280);
}

/* Contact Widget */
.contact-info {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.contact-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid var(--fc-border-color, #f3f4f6);
}

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

.contact-item i {
    color: var(--fc-primary-color, #3b82f6);
    font-size: 16px;
    width: 20px;
    text-align: center;
}

.contact-item a {
    color: var(--fc-text-color, #374151);
    text-decoration: none;
    font-weight: 500;
}

.contact-item a:hover {
    color: var(--fc-primary-color, #3b82f6);
    text-decoration: underline;
}

.contact-item span {
    color: var(--fc-text-color, #374151);
    font-weight: 500;
}

/* Latest News Widget */
.latest-news-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.sidebar-news-item {
    display: flex;
    gap: 12px;
    padding: 15px 0;
    border-bottom: 1px solid var(--fc-border-color, #f3f4f6);
    align-items: flex-start;
}

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

.sidebar-news-image {
    width: 80px;
    height: 60px;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
}

.sidebar-news-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.sidebar-news-item:hover .sidebar-news-image img {
    transform: scale(1.05);
}

.sidebar-news-content {
    flex: 1;
}

.sidebar-news-title {
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 8px !important;
}

.sidebar-news-title a {
    color: var(--fc-text-color, #374151);
    text-decoration: none;
}

.sidebar-news-title a:hover {
    color: var(--fc-primary-color, #3b82f6);
}

.sidebar-news-time {
    font-size: 12px;
    color: var(--fc-text-secondary-color, #9ca3af);
    font-weight: 500;
}

/* Newsletter Widget */
.newsletter-widget {
    background: linear-gradient(135deg, var(--fc-primary-color, #3b82f6) 0%, var(--fc-secondary-color, #1e293b) 100%) !important;
    color: white;
}

.newsletter-widget .widget-title {
    color: white !important;
    border-bottom-color: rgba(255,255,255,0.2);
}

.newsletter-widget .widget-title i {
    color: white;
}

.newsletter-content p {
    color: rgba(255,255,255,0.9);
    margin-bottom: 20px;
    line-height: 1.6;
}

.newsletter-form {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.form-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.newsletter-input {
    padding: 15px;
    border: none;
    border-radius: 10px;
    font-size: 14px;
    background: white;
    color: var(--fc-text-color, #1f2937);
    font-weight: 500;
}

.newsletter-input::placeholder {
    color: var(--fc-text-secondary-color, #9ca3af);
}

.newsletter-input:focus {
    outline: none;
    box-shadow: 0 0 20px rgba(255,255,255,0.3);
}

.newsletter-checkbox {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    color: rgba(255,255,255,0.9);
    font-size: 12px;
    line-height: 1.5;
    cursor: pointer;
}

.newsletter-checkbox input[type="checkbox"] {
    margin: 0;
    width: 16px;
    height: 16px;
}

.newsletter-checkbox a {
    color: rgba(255,255,255,0.9);
    text-decoration: underline;
}

.newsletter-checkbox a:hover {
    color: white;
}

.newsletter-submit {
    background: var(--fc-secondary-color, #1f2937);
    color: white;
    border: none;
    padding: 15px 20px;
    border-radius: 10px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 14px;
}

.newsletter-submit:hover {
    background: #111827;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.3);
}

.newsletter-submit i {
    font-size: 12px;
}

/* Responsive Design for Pages */
@media (max-width: 1024px) {
    .page-content {
        grid-template-columns: 1fr 280px;
        gap: 30px;
    }
    
    .page-container {
        padding: 15px;
    }
}

@media (max-width: 768px) {
    .page-content {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .page-sidebar {
        position: static;
        order: -1;
    }
    
    .page-title {
        font-size: 2rem !important;
    }
    
    .page-header {
        padding: 30px 25px;
    }
    
    .page-body {
        padding: 30px 25px;
    }
    
    .page-footer {
        padding: 30px 25px;
    }
    
    .sidebar-widget {
        padding: 20px;
    }
    
    .share-buttons {
        justify-content: space-between;
        gap: 10px;
    }
    
    .share-btn {
        flex: 1;
        justify-content: center;
        padding: 10px 15px;
        font-size: 13px;
    }
    
    .page-meta {
        flex-direction: column;
        gap: 15px;
        align-items: flex-start;
    }
}

@media (max-width: 480px) {
    .page-container {
        padding: 10px;
    }
    
    .page-title {
        font-size: 1.8rem !important;
    }
    
    .page-header {
        padding: 25px 20px;
    }
    
    .page-body {
        padding: 25px 20px;
    }
    
    .page-footer {
        padding: 25px 20px;
    }
    
    .page-comments {
        padding: 25px 20px;
    }
    
    .sidebar-widget {
        padding: 15px;
    }
    
    .page-contact,
    .page-links-section,
    .page-share {
        padding: 20px;
    }
    
    .share-buttons {
        flex-direction: column;
        gap: 12px;
    }
    
    .share-btn {
        justify-content: center;
    }
    
    .page-subtitle {
        font-size: 1.1rem;
    }
    
    .page-body h2 {
        font-size: 1.5rem !important;
    }
    
    .page-body h3 {
        font-size: 1.3rem !important;
    }
}

/* Print Styles for Pages */
@media print {
    .page-sidebar,
    .page-share,
    .page-comments {
        display: none;
    }
    
    .page-content {
        grid-template-columns: 1fr;
    }
    
    .page-main {
        box-shadow: none;
        border: 1px solid #ddd;
    }
    
    .page-header {
        background: white;
        border-bottom: 2px solid #ddd;
    }
    
    .page-footer {
        background: white;
        border-top: 1px solid #ddd;
    }
    
    .page-body a {
        color: #000 !important;
        text-decoration: underline;
    }
    
    .page-body a[href]:after {
        content: " (" attr(href) ")";
        font-size: 12px;
        color: #666;
    }
}

/* DARK MODE SUPPORT */
@media (prefers-color-scheme: dark) {
    .auto-dark body {
        background: #0f172a;
        color: #e2e8f0;
    }
    
    .auto-dark .content-area,
    .auto-dark .sidebar {
        background: #1e293b;
        border-color: #334155;
    }
    
    .auto-dark .news-card {
        background: #1e293b;
        border-color: #334155;
    }
    
    .auto-dark .bnr-rates-widget {
        background: #0f172a;
        border: 1px solid #334155;
    }
    
    .auto-dark .bnr-rate-item {
        background: rgba(255,255,255,0.02);
        border-color: #334155;
    }
    
    .auto-dark .page-main,
    .auto-dark .sidebar-widget {
        background: #1e293b;
        border-color: #334155;
    }
    
    .auto-dark .page-header {
        background: #0f172a;
        border-color: #334155;
    }
    
    .auto-dark .page-footer {
        background: #0f172a;
        border-color: #334155;
    }
}