/* ============================================================
   Web Global News Theme — Main Stylesheet
   ============================================================ */

/* ----- CSS Custom Properties ----- */
:root {
	--wg-primary: #E63946;
	--wg-primary-hover: #C1121F;
	--wg-primary-light: #FDECEA;
	--wg-secondary: #457B9D;
	--wg-secondary-hover: #365F7A;
	--wg-accent: #1D3557;
	--wg-surface: #FFFFFF;
	--wg-surface-alt: #F8F9FA;
	--wg-surface-dark: #E9ECEF;
	--wg-text: #212529;
	--wg-text-light: #6C757D;
	--wg-text-inverse: #FFFFFF;
	--wg-border: #DEE2E6;
	--wg-border-light: #F1F3F5;
	--wg-breaking: #DC3545;
	--wg-exclusive: #FFC107;
	--wg-updated: #20C997;
	--wg-shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
	--wg-shadow-md: 0 4px 6px rgba(0,0,0,0.07);
	--wg-shadow-lg: 0 10px 15px rgba(0,0,0,0.1);
	--wg-shadow-xl: 0 20px 25px rgba(0,0,0,0.15);
	--wg-radius-sm: 4px;
	--wg-radius-md: 8px;
	--wg-radius-lg: 12px;
	--wg-max-width: 1200px;
	--wg-content-width: 800px;
	--wg-header-height: 60px;
	--wg-sidebar-width: 340px;
	--wg-transition: 0.2s ease;
	--wg-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	--wg-font-heading: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Dark Mode */
[data-theme="dark"] {
	--wg-surface: #121212;
	--wg-surface-alt: #1E1E1E;
	--wg-surface-dark: #2D2D2D;
	--wg-text: #E9ECEF;
	--wg-text-light: #ADB5BD;
	--wg-text-inverse: #FFFFFF;
	--wg-border: #343A40;
	--wg-border-light: #495057;
	--wg-primary-light: #3D1A1E;
	--wg-shadow-sm: 0 1px 2px rgba(0,0,0,0.3);
	--wg-shadow-md: 0 4px 6px rgba(0,0,0,0.4);
	--wg-shadow-lg: 0 10px 15px rgba(0,0,0,0.5);
	--wg-shadow-xl: 0 20px 25px rgba(0,0,0,0.6);
}

/* Dark Mode — Header & Nav overrides */
[data-theme="dark"] .site-header { background: var(--wg-surface); border-bottom-color: var(--wg-border); }
[data-theme="dark"] .main-nav { background: var(--wg-surface); border-bottom-color: var(--wg-primary); }
[data-theme="dark"] .menu-toggle { color: var(--wg-text); }
[data-theme="dark"] .theme-toggle { color: var(--wg-text); }
[data-theme="dark"] .theme-toggle:hover { background: rgba(255,255,255,0.1); }
[data-theme="dark"] .site-header__search-input { background: var(--wg-surface-alt); border-color: var(--wg-border); color: var(--wg-text); }
[data-theme="dark"] .site-header__search-input::placeholder { color: var(--wg-text-light); }
[data-theme="dark"] .site-header__search-icon { color: var(--wg-text-light); }
[data-theme="dark"] .top-bar__auth { color: var(--wg-text-inverse); }
[data-theme="dark"] .card { background: var(--wg-surface); }
[data-theme="dark"] .card__title a { color: var(--wg-text); }
[data-theme="dark"] .card__title a:hover { color: var(--wg-primary); }
[data-theme="dark"] .section-heading { border-bottom-color: var(--wg-border); }
[data-theme="dark"] .section-heading__link { color: var(--wg-primary); }
[data-theme="dark"] .hero-news__side-card { background: var(--wg-surface-alt); }
[data-theme="dark"] .sidebar__widget { background: var(--wg-surface-alt); border-color: var(--wg-border-light); }
[data-theme="dark"] .opinion-card { background: var(--wg-surface-alt); border-color: var(--wg-border-light); }
[data-theme="dark"] .author-box { background: var(--wg-surface-alt); border-color: var(--wg-border-light); }
[data-theme="dark"] .breadcrumbs__link { color: var(--wg-text-light); }
[data-theme="dark"] .breadcrumbs__item--current { color: var(--wg-text); }
[data-theme="dark"] .post-tags__link { background: var(--wg-surface-alt); border-color: var(--wg-border); color: var(--wg-text-light); }
[data-theme="dark"] .pagination .page-numbers { background: var(--wg-surface-alt); border-color: var(--wg-border); color: var(--wg-text); }
[data-theme="dark"] .pagination .page-numbers.current { background: var(--wg-primary); color: #fff; border-color: var(--wg-primary); }
[data-theme="dark"] .wg-btn--load-more { background: var(--wg-surface-alt); border-color: var(--wg-border); color: var(--wg-text); }
[data-theme="dark"] .wg-btn--load-more:hover { background: var(--wg-primary); color: #fff; border-color: var(--wg-primary); }
[data-theme="dark"] .post-navigation__prev, [data-theme="dark"] .post-navigation__next { background: var(--wg-surface-alt); }
[data-theme="dark"] .wg-btn--outline { border-color: var(--wg-border); color: var(--wg-text); }
[data-theme="dark"] .wg-btn--outline:hover { border-color: var(--wg-primary); color: var(--wg-primary); }
[data-theme="dark"] .search-results__link { color: var(--wg-text); }
[data-theme="dark"] .widget-popular-posts__title { color: var(--wg-text); }
[data-theme="dark"] .error-404__code { color: var(--wg-border); }
[data-theme="dark"] .error-404__title { color: var(--wg-text); }

/* ----- Reset ----- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; font-family: var(--wg-font-body); font-size: 16px; line-height: 1.6; color: var(--wg-text); background: var(--wg-surface); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
h1, h2, h3, h4, h5, h6 { margin: 0 0 0.5em; font-family: var(--wg-font-heading); font-weight: 700; line-height: 1.2; color: var(--wg-text); }
p { margin: 0 0 1em; }
a { color: var(--wg-primary); text-decoration: none; transition: color var(--wg-transition); }
a:hover { color: var(--wg-primary-hover); }
img { max-width: 100%; height: auto; display: block; }
ul, ol { margin: 0 0 1em; padding-left: 1.5em; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; border: none; background: none; }
.screen-reader-text { border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; }
.screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0,0,0,0.6); clip: auto !important; clip-path: none; color: #21759b; display: block; font-size: 0.875rem; font-weight: 700; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; }
[hidden] { display: none; }

/* ----- Icons ----- */
.icon {
	display: inline-block;
	width: 1em;
	height: 1em;
	vertical-align: -0.125em;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
	flex-shrink: 0;
}

/* Social icons — filled, not stroked */
.icon--telegram, .icon--vk, .icon--youtube, .icon--facebook, .icon--instagram, .icon--odnoklassniki, .icon--dzen, .icon--rutube, .icon--mailru {
	stroke: none;
	fill: currentColor;
}

/* ----- Layout ----- */
.container { max-width: var(--wg-max-width); margin: 0 auto; padding: 0 1rem; }
.container--narrow { max-width: var(--wg-content-width); }
.site-content { padding: 1.5rem 0; }
.site-main { min-width: 0; }
.content-area { display: grid; grid-template-columns: 1fr var(--wg-sidebar-width); gap: 2rem; }
.content-area--full { grid-template-columns: 1fr; }
.content-area--sidebar-left { grid-template-columns: var(--wg-sidebar-width) 1fr; }
.alignwide { max-width: var(--wg-max-width); margin-left: auto; margin-right: auto; width: 100%; }
.alignfull { width: 100vw; margin-left: calc(50% - 50vw); }

/* ----- Skip Link ----- */
.skip-link { position: fixed; top: -100%; left: 0; z-index: 99999; padding: 0.75rem 1.5rem; background: var(--wg-primary); color: var(--wg-text-inverse); font-weight: 600; transition: top var(--wg-transition); }
.skip-link:focus { top: 0; }

/* ----- Menu Overlay ----- */
.menu-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 10000; opacity: 0; visibility: hidden; transition: opacity 0.3s, visibility 0.3s; pointer-events: none; }
.menu-overlay.is-active { opacity: 1; visibility: visible; pointer-events: auto; }

/* ----- Top Bar ----- */
.top-bar { background: var(--wg-accent); color: var(--wg-text-inverse); font-size: 0.8125rem; line-height: 1; }
.top-bar__inner { display: flex; align-items: center; justify-content: space-between; height: 36px; gap: 1rem; }
.top-bar__left, .top-bar__right { display: flex; align-items: center; gap: 1rem; }
.top-bar__date { opacity: 0.8; }
.top-bar__social { display: flex; gap: 0.5rem; }
.top-bar__social a { color: var(--wg-text-inverse); opacity: 0.8; transition: opacity var(--wg-transition); display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; }
.top-bar__social a:hover { opacity: 1; color: var(--wg-text-inverse); }
.top-bar__social .icon { width: 18px; height: 18px; }
.top-bar__auth { color: var(--wg-text-inverse); opacity: 0.9; display: inline-flex; align-items: center; gap: 0.35rem; }
.top-bar__auth:hover { opacity: 1; color: var(--wg-text-inverse); }
.top-bar__auth .icon { width: 18px; height: 18px; }
.theme-toggle { color: var(--wg-text-inverse); display: inline-flex; align-items: center; justify-content: center; padding: 0.25rem; border-radius: var(--wg-radius-sm); transition: background var(--wg-transition); width: 28px; height: 28px; }
.theme-toggle:hover { background: rgba(255,255,255,0.1); }
.theme-toggle .icon { width: 18px; height: 18px; }

/* ----- Header ----- */
.site-header { position: sticky; top: 0; z-index: 1000; background: var(--wg-surface); border-bottom: 1px solid var(--wg-border); height: var(--wg-header-height); display: flex; align-items: center; transition: box-shadow var(--wg-transition), background var(--wg-transition); }
.site-header.is-scrolled { box-shadow: var(--wg-shadow-md); }
.site-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; width: 100%; }
.site-header__logo { flex-shrink: 0; }
.site-header__logo-link { display: flex; align-items: center; gap: 0.625rem; text-decoration: none; }
.site-header__logo-img { height: 40px; width: auto; }
.site-header__site-name { font-size: 1.25rem; font-weight: 800; color: var(--wg-text); line-height: 1.2; white-space: nowrap; }
.site-header__logo-link:hover .site-header__site-name { color: var(--wg-primary); }
.site-header__search { flex: 1; max-width: 400px; position: relative; }
.site-header__search-input { width: 100%; padding: 0.5rem 1rem 0.5rem 2.5rem; border: 1px solid var(--wg-border); border-radius: var(--wg-radius-md); background: var(--wg-surface-alt); font-size: 0.875rem; transition: border-color var(--wg-transition), box-shadow var(--wg-transition); }
.site-header__search-input:focus { outline: none; border-color: var(--wg-primary); box-shadow: 0 0 0 3px var(--wg-primary-light); }
.site-header__search-icon { position: absolute; left: 0.75rem; top: 50%; transform: translateY(-50%); color: var(--wg-text-light); pointer-events: none; display: flex; align-items: center; justify-content: center; }
.site-header__search-icon .icon { width: 18px; height: 18px; }
.site-header__actions { display: flex; align-items: center; gap: 0.75rem; background: var(--wg-accent);
	padding: 2px; border-radius: 5px; }
.site-header__actions .top-bar__auth .icon { width: 20px; height: 20px; }
.menu-toggle { display: none; padding: 0.5rem; color: var(--wg-text); align-items: center; justify-content: center; width: 40px; height: 40px; }
.menu-toggle .icon { width: 24px; height: 24px; }

/* ----- Main Navigation ----- */
.main-nav { background: var(--wg-surface); border-bottom: 2px solid var(--wg-primary); }
.main-nav__inner { display: flex; align-items: center; }
.main-nav__list { display: flex; list-style: none; margin: 0; padding: 0; gap: .2rem; }
.main-nav__item { position: relative; }
.main-nav__item + .main-nav__item { border-left: 1px solid var(--wg-border); }
.main-nav__link { display: flex; align-items: center; padding: 0.875rem 1.25rem; color: var(--wg-text); font-weight: 600; font-size: 0.9375rem; text-decoration: none; transition: color var(--wg-transition), background var(--wg-transition); border-bottom: 3px solid transparent; margin-bottom: -2px; letter-spacing: 0.01em; }
.main-nav__link:hover { color: var(--wg-primary); background: var(--wg-primary-light); }
.main-nav__link.is-active { color: var(--wg-primary); border-bottom-color: var(--wg-primary); background: var(--wg-primary-light); }
.main-nav__link--highlight { color: var(--wg-primary); font-weight: 700; }

/* Arrow indicator for parent items */
.menu-item-has-children > a { position: relative; padding-right: 1.75rem; }
.menu-item-has-children > a::after { content: ''; position: absolute; right: 0.75rem; top: 50%; width: 6px; height: 6px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-70%) rotate(45deg); transition: transform var(--wg-transition); pointer-events: none; }
.menu-item-has-children:hover > a::after { transform: translateY(-30%) rotate(45deg); }

/* Dropdown — matches both .main-nav__dropdown and WordPress .sub-menu */
.main-nav__dropdown,
.main-nav .sub-menu { position: absolute; top: 100%; left: 0; min-width: 240px; background: var(--wg-surface); border: 1px solid var(--wg-border); border-top: 3px solid var(--wg-primary); border-radius: 0 0 var(--wg-radius-md) var(--wg-radius-md); box-shadow: var(--wg-shadow-lg); opacity: 0; visibility: hidden; transform: translateY(-4px); transition: all var(--wg-transition); z-index: 100; list-style: none; margin: 0; padding: 0.5rem 0; }
.main-nav__item:hover > .main-nav__dropdown,
.main-nav__item:hover > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.main-nav__dropdown-link,
.main-nav .sub-menu a { display: block; padding: 0.7rem 1.25rem; color: var(--wg-text); font-size: 0.875rem; text-decoration: none; transition: background var(--wg-transition), color var(--wg-transition); white-space: nowrap; border-left: 3px solid transparent; }
.main-nav__dropdown-link:hover,
.main-nav .sub-menu a:hover { background: var(--wg-primary-light); color: var(--wg-primary); border-left-color: var(--wg-primary); }

/* Nested submenus */
.main-nav .sub-menu .sub-menu { top: 0; left: 100%; margin-left: -1px; }
.main-nav .sub-menu li { position: relative; }

/* ----- Search Modal ----- */
.search-modal { position: fixed; inset: 0; z-index: 10000; background: rgba(0,0,0,0.6); display: flex; align-items: flex-start; justify-content: center; padding-top: 10vh; opacity: 0; visibility: hidden; transition: all 0.3s; }
.search-modal.is-active { opacity: 1; visibility: visible; }
.search-modal__inner { background: var(--wg-surface); border-radius: var(--wg-radius-lg); width: 90%; max-width: 600px; overflow: hidden; box-shadow: var(--wg-shadow-xl); transform: translateY(-20px); transition: transform 0.3s; }
.search-modal.is-active .search-modal__inner { transform: translateY(0); }
.search-modal__header { display: flex; align-items: center; padding: 0.75rem 1rem; border-bottom: 1px solid var(--wg-border); }
.search-modal__input { flex: 1; border: none; background: none; font-size: 1.125rem; outline: none; padding: 0.5rem; }
.search-modal__close { padding: 0.5rem; color: var(--wg-text-light); border-radius: var(--wg-radius-sm); }
.search-modal__close:hover { background: var(--wg-surface-alt); }
.search-modal__results { max-height: 60vh; overflow-y: auto; padding: 0.5rem; }

/* ----- Breaking News Ticker ----- */
.breaking-ticker { background: var(--wg-breaking); color: var(--wg-text-inverse); overflow: hidden; }
.breaking-ticker__inner { display: flex; align-items: center; height: 40px; }
.breaking-ticker__label { display: flex; align-items: center; gap: 0.5rem; padding: 0 1rem; background: var(--wg-primary); font-weight: 700; font-size: 0.8125rem; text-transform: uppercase; letter-spacing: 0.05em; height: 100%; white-space: nowrap; flex-shrink: 0; }
.breaking-ticker__pulse { width: 8px; height: 8px; border-radius: 50%; background: var(--wg-text-inverse); animation: pulse 1.5s infinite; }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }
.breaking-ticker__track { overflow: hidden; flex: 1; }
.breaking-ticker__content { display: flex; animation: ticker 30s linear infinite; white-space: nowrap; }
.breaking-ticker__item { padding: 0 2rem; }
.breaking-ticker__item a { color: var(--wg-text-inverse); font-size: 0.875rem; }
.breaking-ticker__item a:hover { text-decoration: underline; }
@keyframes ticker { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* ----- Hero / Featured News ----- */
.hero-news { padding: 2rem 0; }
.hero-news__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.hero-news__main { position: relative; border-radius: var(--wg-radius-lg); overflow: hidden; }
.hero-news__main-img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.hero-news__main-overlay { position: absolute; bottom: 0; left: 0; right: 0; padding: 2rem; background: linear-gradient(transparent, rgba(0,0,0,0.85)); color: var(--wg-text-inverse); }
.hero-news__main-category { display: inline-block; padding: 0.25rem 0.75rem; background: var(--wg-primary); color: var(--wg-text-inverse); font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; border-radius: var(--wg-radius-sm); margin-bottom: 0.75rem; }
.hero-news__main-title { font-size: 1.75rem; font-weight: 800; line-height: 1.2; margin-bottom: 0.5rem; }
.hero-news__main-title a { color: var(--wg-text-inverse); }
.hero-news__main-title a:hover { text-decoration: underline; }
.hero-news__main-meta { display: flex; align-items: center; gap: 1rem; font-size: 0.8125rem; opacity: 0.85; }
.hero-news__sidebar { display: flex; flex-direction: column; gap: 1rem; }
.hero-news__side-card { display: flex; gap: 1rem; padding: 0.75rem; border-radius: var(--wg-radius-md); background: var(--wg-surface-alt); transition: transform var(--wg-transition), box-shadow var(--wg-transition); }
.hero-news__side-card:hover { transform: translateY(-2px); box-shadow: var(--wg-shadow-md); }
.hero-news__side-thumb { flex-shrink: 0; width: 120px; height: 80px; border-radius: var(--wg-radius-sm); overflow: hidden; }
.hero-news__side-thumb img { width: 100%; height: 100%; object-fit: cover; }
.hero-news__side-content { display: flex; flex-direction: column; justify-content: center; gap: 0.25rem; min-width: 0; }
.hero-news__side-category { font-size: 0.75rem; font-weight: 600; color: var(--wg-primary); text-transform: uppercase; }
.hero-news__side-title { font-size: 0.9375rem; font-weight: 600; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.hero-news__side-title a { color: var(--wg-text); }
.hero-news__side-title a:hover { color: var(--wg-primary); }
.hero-news__side-meta { font-size: 0.75rem; color: var(--wg-text-light); }

/* ----- Post Meta ----- */
.post-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem 1rem; font-size: 0.8125rem; color: var(--wg-text-light); }
.post-meta__author a { color: var(--wg-primary); font-weight: 500; }
.post-meta__author a:hover { text-decoration: underline; }
.post-meta__date time { display: flex; align-items: center; gap: 0.25rem; }
.post-meta__views, .post-meta__reading, .post-meta__comments { display: flex; align-items: center; gap: 0.25rem; }
.post-meta .icon { width: 14px; height: 14px; opacity: 0.6; display: inline-block; vertical-align: -0.15em; }

/* ----- Section Headings ----- */
.section-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.25rem; padding-bottom: 0.75rem; border-bottom: 2px solid var(--wg-border); }
.section-heading__title { font-size: 1.25rem; font-weight: 800; display: flex; align-items: center; gap: 0.5rem; }
.section-heading__title::before { content: ''; display: block; width: 4px; height: 1.25rem; background: var(--wg-primary); border-radius: 2px; }
.section-heading__link { font-size: 0.875rem; font-weight: 500; color: var(--wg-primary); display: flex; align-items: center; gap: 0.25rem; }
.section-heading__link:hover { text-decoration: underline; }
.section-heading__link .icon { width: 16px; height: 16px; display: inline-block; vertical-align: -0.2em; }

/* ----- News Cards ----- */
.card { display: flex; flex-direction: column; border-radius: var(--wg-radius-md); overflow: hidden; background: var(--wg-surface); transition: transform var(--wg-transition), box-shadow var(--wg-transition); }
.card:hover { transform: translateY(-3px); box-shadow: var(--wg-shadow-md); }
.card__thumb { position: relative; overflow: hidden; aspect-ratio: 16/10; }
.card__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s; }
.card:hover .card__thumb img { transform: scale(1.05); }
.card__category { position: absolute; top: 0.75rem; left: 0.75rem; padding: 0.2rem 0.6rem; background: var(--wg-primary); color: var(--wg-text-inverse); font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; border-radius: var(--wg-radius-sm); z-index: 1; }
.card__badge { position: absolute; top: 0.75rem; right: 0.75rem; padding: 0.2rem 0.6rem; font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; border-radius: var(--wg-radius-sm); z-index: 1; }
.card__badge--breaking { background: var(--wg-breaking); color: var(--wg-text-inverse); }
.card__badge--exclusive { background: var(--wg-exclusive); color: #000; }
.card__badge--updated { background: var(--wg-updated); color: #fff; }
.card__play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 56px; height: 56px; background: rgba(0,0,0,0.7); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; transition: background var(--wg-transition), transform var(--wg-transition); }
.card:hover .card__play { background: var(--wg-primary); transform: translate(-50%, -50%) scale(1.1); }
.card__play .icon { width: 24px; height: 24px; margin-left: 3px; fill: none; stroke: #fff; stroke-width: 2; }
.card__body { display: flex; flex-direction: column; gap: 0.5rem; padding: 1rem; flex: 1; }
.card__title { font-size: 1rem; font-weight: 700; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.card__title a { color: var(--wg-text); }
.card__title a:hover { color: var(--wg-primary); }
.card__excerpt { font-size: 0.875rem; color: var(--wg-text-light); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.card__meta { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 0.5rem; font-size: 0.75rem; color: var(--wg-text-light); }

/* Card Horizontal */
.card--horizontal { flex-direction: row; }
.card--horizontal .card__thumb { width: 200px; flex-shrink: 0; aspect-ratio: 4/3; }
.card--horizontal .card__body { flex: 1; padding: 0.75rem; }

/* Card Compact */
.card--compact .card__thumb { aspect-ratio: 16/9; }
.card--compact .card__body { padding: 0.75rem; }
.card--compact .card__title { font-size: 0.9375rem; -webkit-line-clamp: 2; }

/* Card Sidebar */
.card--sidebar { flex-direction: row; gap: 0.75rem; background: none; border-radius: 0; }
.card--sidebar:hover { transform: none; box-shadow: none; }
.card--sidebar .card__thumb { width: 80px; height: 60px; aspect-ratio: unset; flex-shrink: 0; border-radius: var(--wg-radius-sm); overflow: hidden; }
.card--sidebar .card__body { padding: 0; gap: 0.25rem; justify-content: center; }
.card--sidebar .card__title { font-size: 0.875rem; -webkit-line-clamp: 2; }

/* Card Popular Rank */
.card--rank { flex-direction: row; gap: 1rem; align-items: flex-start; background: none; padding: 0.75rem 0; border-bottom: 1px solid var(--wg-border-light); }
.card--rank:last-child { border-bottom: none; }
.card--rank:hover { transform: none; box-shadow: none; }
.card--rank__number { flex-shrink: 0; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; background: var(--wg-primary); color: var(--wg-text-inverse); font-size: 0.875rem; font-weight: 800; border-radius: var(--wg-radius-sm); }
.card--rank:nth-child(2) .card--rank__number { background: var(--wg-secondary); }
.card--rank:nth-child(3) .card--rank__number { background: var(--wg-accent); }
.card--rank .card__thumb { width: 80px; height: 60px; aspect-ratio: unset; flex-shrink: 0; border-radius: var(--wg-radius-sm); overflow: hidden; }
.card--rank .card__body { padding: 0; flex: 1; gap: 0.25rem; }
.card--rank .card__title { font-size: 0.875rem; -webkit-line-clamp: 2; }

/* ----- Category Sections ----- */
.category-section { padding: 2rem 0; border-bottom: 1px solid var(--wg-border); }
.category-section:last-child { border-bottom: none; }
.category-section__grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1.5rem; }
.category-section__featured { grid-column: 1 / -1; }

/* ----- News Grid ----- */
.news-grid { display: grid; grid-template-columns: repeat(var(--wg-grid-columns, 3), 1fr); gap: 1.5rem; }

/* ----- Tabs ----- */
.tabs { display: flex; gap: 0; border-bottom: 2px solid var(--wg-border); margin-bottom: 1.5rem; }
.tabs__tab { padding: 0.75rem 1.25rem; font-weight: 600; font-size: 0.9375rem; color: var(--wg-text-light); border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all var(--wg-transition); }
.tabs__tab:hover { color: var(--wg-text); }
.tabs__tab.is-active { color: var(--wg-primary); border-bottom-color: var(--wg-primary); }

/* ----- Opinion / Author Cards ----- */
.opinion-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.opinion-card { padding: 1.25rem; border-radius: var(--wg-radius-md); background: var(--wg-surface-alt); border: 1px solid var(--wg-border-light); }
.opinion-card__author { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1rem; }
.opinion-card__avatar { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.opinion-card__name { font-weight: 700; font-size: 0.9375rem; color: var(--wg-text); }
.opinion-card__name:hover { color: var(--wg-primary); }
.opinion-card__role { font-size: 0.75rem; color: var(--wg-text-light); }
.opinion-card__title { font-size: 1rem; font-weight: 600; line-height: 1.3; }
.opinion-card__title a { color: var(--wg-text); }
.opinion-card__title a:hover { color: var(--wg-primary); }

/* ----- Video Section ----- */
.video-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 1.5rem; }
.video-main { position: relative; border-radius: var(--wg-radius-lg); overflow: hidden; }
.video-main img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.video-sidebar { display: flex; flex-direction: column; gap: 1rem; }
.video-item { display: flex; gap: 0.75rem; }
.video-item__thumb { width: 120px; height: 68px; flex-shrink: 0; border-radius: var(--wg-radius-sm); overflow: hidden; position: relative; }
.video-item__thumb img { width: 100%; height: 100%; object-fit: cover; }
.video-item__play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 32px; height: 32px; background: rgba(0,0,0,0.7); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; }
.video-item__play .icon { width: 14px; height: 14px; margin-left: 2px; fill: none; stroke: #fff; stroke-width: 2; }
.video-item__title { font-size: 0.875rem; font-weight: 600; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.video-item__title a { color: var(--wg-text); }
.video-item__title a:hover { color: var(--wg-primary); }
.video-item__date { font-size: 0.75rem; color: var(--wg-text-light); }

/* ----- Subscription ----- */
.subscription { background: var(--wg-accent); color: var(--wg-text-inverse); border-radius: var(--wg-radius-lg); padding: 3rem; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.subscription__content { max-width: 500px; }
.subscription__title { font-size: 1.75rem; font-weight: 800; color: var(--wg-text-inverse); margin-bottom: 0.5rem; }
.subscription__desc { font-size: 1rem; opacity: 0.85; margin-bottom: 1.25rem; }
.subscription__form { display: flex; gap: 0.5rem; }
.subscription__input { flex: 1; padding: 0.75rem 1rem; border: 1px solid rgba(255,255,255,0.3); border-radius: var(--wg-radius-md); background: rgba(255,255,255,0.1); color: #fff; font-size: 0.9375rem; }
.subscription__input::placeholder { color: rgba(255,255,255,0.6); }
.subscription__input:focus { outline: none; border-color: #fff; background: rgba(255,255,255,0.15); }
.subscription__btn { padding: 0.75rem 1.5rem; background: var(--wg-primary); color: #fff; font-weight: 700; font-size: 0.9375rem; border-radius: var(--wg-radius-md); transition: background var(--wg-transition); white-space: nowrap; }
.subscription__btn:hover { background: var(--wg-primary-hover); color: #fff; }
.subscription__privacy { font-size: 0.75rem; opacity: 0.6; margin-top: 0.5rem; }
.subscription__message { margin-top: 0.5rem; font-size: 0.875rem; }
.subscription__decoration { opacity: 0.1; color: #fff; }

/* ----- Sidebar ----- */
.sidebar { display: flex; flex-direction: column; gap: 1.5rem; }
.sidebar__widget { padding: 1.25rem; background: var(--wg-surface-alt); border-radius: var(--wg-radius-md); border: 1px solid var(--wg-border-light); }
.sidebar__widget-title { font-size: 1rem; font-weight: 700; margin-bottom: 1rem; padding-bottom: 0.5rem; border-bottom: 2px solid var(--wg-primary); display: flex; align-items: center; gap: 0.5rem; }
.sidebar__widget-title::before { content: ''; display: block; width: 4px; height: 1rem; background: var(--wg-primary); border-radius: 2px; }
.sidebar__categories { list-style: none; margin: 0; padding: 0; }
.sidebar__cat-item { border-bottom: 1px solid var(--wg-border-light); }
.sidebar__cat-item:last-child { border-bottom: none; }
.sidebar__cat-item a { display: flex; align-items: center; justify-content: space-between; padding: 0.5rem 0; color: var(--wg-text); font-size: 0.875rem; text-decoration: none; transition: color var(--wg-transition); }
.sidebar__cat-item a:hover { color: var(--wg-primary); }
.sidebar__cat-count { background: var(--wg-surface-dark); color: var(--wg-text-light); font-size: 0.75rem; font-weight: 600; padding: 0.125rem 0.5rem; border-radius: var(--wg-radius-sm); min-width: 24px; text-align: center; }

/* ----- Breadcrumbs ----- */
.breadcrumbs { padding: 0.75rem 0; font-size: 0.8125rem; }
.breadcrumbs__list { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem; list-style: none; margin: 0; padding: 0; }
.breadcrumbs__item { display: flex; align-items: center; }
.breadcrumbs__item:not(:last-child)::after { content: '/'; margin-left: 0.25rem; color: var(--wg-text-light); }
.breadcrumbs__link { color: var(--wg-text-light); }
.breadcrumbs__link:hover { color: var(--wg-primary); }
.breadcrumbs__item--current { color: var(--wg-text); font-weight: 500; }

/* ----- Single Post ----- */
.single-header { padding: 2rem 0 1rem; }
.single-header__category { display: inline-block; margin-bottom: 0.75rem; }
.single-header__title { font-size: clamp(1.75rem, 3vw, 2.5rem); font-weight: 800; line-height: 1.15; margin-bottom: 0.5rem; }
.single-header__subtitle { font-size: 1.125rem; color: var(--wg-text-light); line-height: 1.5; margin-bottom: 1rem; }
.single-header__meta { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; }
.single-header__author { display: flex; align-items: center; gap: 0.75rem; }
.single-header__author-avatar { width: 40px; height: 40px; border-radius: 50%; }
.single-header__author-name { font-weight: 600; color: var(--wg-text); }
.single-header__author-name:hover { color: var(--wg-primary); }
.single-featured-image { margin-bottom: 2rem; border-radius: var(--wg-radius-lg); overflow: hidden; }
.single-featured-image img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.single-featured-image__caption { padding: 0.75rem 0; font-size: 0.8125rem; color: var(--wg-text-light); font-style: italic; }
.single-content { max-width: var(--wg-content-width); }
.single-content p { font-size: 1.0625rem; line-height: 1.8; margin-bottom: 1.5em; }
.single-content h2 { font-size: 1.5rem; margin: 2rem 0 0.75rem; }
.single-content h3 { font-size: 1.25rem; margin: 1.75rem 0 0.5rem; }
.single-content blockquote { margin: 2rem 0; padding: 1.5rem 2rem; border-left: 4px solid var(--wg-primary); background: var(--wg-surface-alt); border-radius: 0 var(--wg-radius-md) var(--wg-radius-md) 0; font-style: italic; font-size: 1.125rem; }
.single-content blockquote cite { display: block; margin-top: 0.75rem; font-size: 0.875rem; font-style: normal; color: var(--wg-text-light); }
.single-content figure { margin: 2rem 0; }
.single-content figcaption { font-size: 0.875rem; color: var(--wg-text-light); text-align: center; margin-top: 0.5rem; }
.single-content table { width: 100%; border-collapse: collapse; margin: 2rem 0; }
.single-content th, .single-content td { padding: 0.75rem 1rem; border: 1px solid var(--wg-border); text-align: left; }
.single-content th { background: var(--wg-surface-alt); font-weight: 600; }
.single-content ul, .single-content ol { margin: 1.5rem 0; padding-left: 1.5em; }
.single-content li { margin-bottom: 0.5em; }
.single-content img { border-radius: var(--wg-radius-md); }

/* ----- Article Actions ----- */
.article-actions { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; padding: 1.5rem 0; border-top: 1px solid var(--wg-border); border-bottom: 1px solid var(--wg-border); margin: 2rem 0; }
.article-actions__left, .article-actions__right { display: flex; align-items: center; gap: 0.5rem; }
.btn-print, .btn-fontsize { padding: 0.5rem; border-radius: var(--wg-radius-sm); color: var(--wg-text-light); transition: all var(--wg-transition); display: inline-flex; align-items: center; justify-content: center; }
.btn-print:hover, .btn-fontsize:hover { background: var(--wg-surface-alt); color: var(--wg-text); }
.btn-print .icon, .btn-fontsize .icon { width: 20px; height: 20px; display: inline-block; vertical-align: -0.15em; }

/* Share Buttons */
.share-buttons { display: flex; align-items: center; gap: 0.5rem; }
.share-buttons__label { font-size: 0.875rem; font-weight: 600; color: var(--wg-text-light); }
.share-buttons__list { display: flex; gap: 0.375rem; }
.share-buttons__btn { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: var(--wg-radius-sm); color: #fff; transition: transform var(--wg-transition), opacity var(--wg-transition); }
.share-buttons__btn:hover { transform: scale(1.1); color: #fff; }
.share-buttons__btn .icon { width: 18px; height: 18px; display: inline-block; vertical-align: -0.1em; fill: none; stroke: #fff; stroke-width: 2; }
.share-buttons__btn--link .icon { fill: none; stroke: #fff; }
.share-buttons__btn--telegram { background: #0088CC; }
.share-buttons__btn--vk { background: #4C75A3; }
.share-buttons__btn--odnoklassniki { background: #ED8007; }
.share-buttons__btn--twitter { background: #000; }
.share-buttons__btn--facebook { background: #1877F2; }
.share-buttons__btn--link { background: var(--wg-text-light); }

/* ----- Author Box ----- */
.author-box { display: flex; gap: 1.5rem; padding: 1.5rem; background: var(--wg-surface-alt); border-radius: var(--wg-radius-md); border: 1px solid var(--wg-border-light); margin: 2rem 0; }
.author-box__avatar { flex-shrink: 0; }
.author-box__img { width: 80px; height: 80px; border-radius: 50%; }
.author-box__name { font-size: 1.125rem; font-weight: 700; margin-bottom: 0.25rem; }
.author-box__name a { color: var(--wg-text); }
.author-box__name a:hover { color: var(--wg-primary); }
.author-box__desc { font-size: 0.9375rem; color: var(--wg-text-light); line-height: 1.5; margin-bottom: 0.5rem; }
.author-box__stats { font-size: 0.8125rem; color: var(--wg-text-light); }

/* ----- Post Navigation ----- */
.post-navigation { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin: 2rem 0; }
.post-navigation__prev, .post-navigation__next { padding: 1.25rem; background: var(--wg-surface-alt); border-radius: var(--wg-radius-md); transition: background var(--wg-transition); }
.post-navigation__prev:hover, .post-navigation__next:hover { background: var(--wg-surface-dark); }
.post-navigation__next { text-align: right; }
.post-navigation__label { display: block; font-size: 0.75rem; color: var(--wg-text-light); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 0.25rem; }
.post-navigation__title { font-size: 0.9375rem; font-weight: 600; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ----- Related Posts ----- */
.related-posts { padding: 2rem 0; }
.related-posts__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem; }

/* ----- Tags ----- */
.post-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin: 1.5rem 0; }
.post-tags__label { font-weight: 600; font-size: 0.875rem; color: var(--wg-text-light); }
.post-tags__link { padding: 0.25rem 0.75rem; background: var(--wg-surface-alt); border: 1px solid var(--wg-border); border-radius: var(--wg-radius-sm); font-size: 0.8125rem; color: var(--wg-text-light); transition: all var(--wg-transition); }
.post-tags__link:hover { background: var(--wg-primary); color: var(--wg-text-inverse); border-color: var(--wg-primary); }

/* ----- Pagination ----- */
.pagination { display: flex; justify-content: center; gap: 0.25rem; margin: 2rem 0; }
.pagination .nav-links { display: flex; gap: 0.25rem; }
.pagination .page-numbers { display: flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 0.5rem; border-radius: var(--wg-radius-sm); font-size: 0.875rem; font-weight: 500; color: var(--wg-text); background: var(--wg-surface-alt); border: 1px solid var(--wg-border); transition: all var(--wg-transition); }
.pagination .page-numbers:hover { background: var(--wg-primary); color: var(--wg-text-inverse); border-color: var(--wg-primary); }
.pagination .page-numbers.current { background: var(--wg-primary); color: var(--wg-text-inverse); border-color: var(--wg-primary); }
.pagination .prev, .pagination .next { display: inline-flex; align-items: center; gap: 0.25rem; }
.pagination .prev .icon, .pagination .next .icon { width: 16px; height: 16px; display: inline-block; vertical-align: -0.2em; }

/* ----- Footer ----- */
.site-footer { background: var(--wg-accent); color: var(--wg-text-inverse); margin-top: 3rem; }
.footer-main { padding: 3rem 0; }
.footer-main__grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 2rem; }
.footer-brand { max-width: 300px; }
.footer-brand__logo { margin-bottom: 1rem; }
.footer-brand__logo-link { display: flex; align-items: center; gap: 0.625rem; text-decoration: none; }
.footer-brand__logo-img { height: 36px; width: auto; }
.footer-brand__site-name { font-size: 1.25rem; font-weight: 800; color: var(--wg-text-inverse); line-height: 1.2; }
.footer-brand__desc { font-size: 0.875rem; opacity: 0.7; line-height: 1.6; margin-bottom: 1rem; }
.footer-heading { font-size: 1rem; font-weight: 700; margin-bottom: 1rem; color: var(--wg-text-inverse); }
.footer-links { list-style: none; margin: 0; padding: 0; }
.footer-links li { margin-bottom: 0.5rem; }
.footer-links a { color: rgba(255,255,255,0.7); font-size: 0.875rem; transition: color var(--wg-transition); }
.footer-links a:hover { color: #fff; }
.footer-contact { font-size: 0.875rem; }
.footer-contact p { margin-bottom: 0.5rem; display: flex; align-items: center; gap: 0.5rem; }
.footer-contact .icon { width: 16px; height: 16px; opacity: 0.7; display: inline-block; vertical-align: -0.2em; flex-shrink: 0; }
.footer-social { display: flex; gap: 0.75rem; margin-top: 1rem; }
.footer-social a { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: var(--wg-radius-sm); background: rgba(255,255,255,0.1); color: rgba(255,255,255,0.7); transition: all var(--wg-transition); }
.footer-social a:hover { background: var(--wg-primary); color: #fff; }
.footer-social a .icon { width: 18px; height: 18px; display: inline-block; vertical-align: -0.1em; }
.footer-bottom { padding: 1rem 0; border-top: 1px solid rgba(255,255,255,0.1); }
.footer-bottom__inner { display: flex; align-items: center; justify-content: space-between; font-size: 0.8125rem; opacity: 0.6; }
.footer-bottom__brand { display: flex; align-items: center; gap: 0.625rem; }
.footer-bottom__logo { height: 20px; width: auto; filter: brightness(0) invert(1); opacity: 0.7; }
.footer-bottom__links { display: flex; gap: 1.5rem; }
.footer-bottom__links a { color: rgba(255,255,255,0.7); }
.footer-bottom__links a:hover { color: #fff; }
.back-to-top { position: fixed; bottom: 2rem; right: 2rem; width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; background: var(--wg-primary); color: #fff; border-radius: 50%; box-shadow: var(--wg-shadow-md); opacity: 0; visibility: hidden; transition: all var(--wg-transition); z-index: 99; }
.back-to-top.is-visible { opacity: 1; visibility: visible; }
.back-to-top:hover { background: var(--wg-primary-hover); transform: translateY(-2px); color: #fff; }
.back-to-top .icon { width: 20px; height: 20px; display: inline-block; vertical-align: -0.15em; fill: none; stroke: #fff; stroke-width: 2; }

/* ----- Search Results ----- */
.search-results__list { list-style: none; margin: 0; padding: 0; }
.search-results__item { border-bottom: 1px solid var(--wg-border-light); }
.search-results__link { display: flex; gap: 1rem; padding: 1rem 0; color: var(--wg-text); }
.search-results__link:hover { color: var(--wg-primary); }
.search-results__thumb { width: 80px; height: 60px; flex-shrink: 0; border-radius: var(--wg-radius-sm); overflow: hidden; }
.search-results__thumb img { width: 100%; height: 100%; object-fit: cover; }
.search-results__category { font-size: 0.75rem; font-weight: 600; color: var(--wg-primary); text-transform: uppercase; }
.search-results__title { font-weight: 600; font-size: 0.9375rem; display: block; margin-top: 0.25rem; }
.search-results__date { font-size: 0.75rem; color: var(--wg-text-light); margin-top: 0.25rem; display: block; }
.search-results__more { display: inline-block; margin-top: 1rem; color: var(--wg-primary); font-weight: 500; }
.search-results__empty { text-align: center; padding: 3rem; color: var(--wg-text-light); font-size: 1.125rem; }

/* ----- 404 ----- */
.error-404 { text-align: center; padding: 5rem 1rem; }
.error-404__code { font-size: 8rem; font-weight: 900; color: var(--wg-border); line-height: 1; }
.error-404__title { font-size: 1.5rem; font-weight: 700; margin: 1rem 0 0.5rem; }
.error-404__desc { font-size: 1rem; color: var(--wg-text-light); margin-bottom: 2rem; }
.error-404__search { max-width: 400px; margin: 0 auto; }
.error-404__search input { width: 100%; padding: 0.75rem 1rem; border: 2px solid var(--wg-border); border-radius: var(--wg-radius-md); font-size: 1rem; }
.error-404__search input:focus { border-color: var(--wg-primary); outline: none; }

/* ----- Buttons ----- */
.wg-btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.75rem 1.5rem; font-weight: 600; font-size: 0.9375rem; border-radius: var(--wg-radius-md); transition: all var(--wg-transition); }
.wg-btn--primary { background: var(--wg-primary); color: #fff; }
.wg-btn--primary:hover { background: var(--wg-primary-hover); color: #fff; }
.wg-btn--outline { border: 2px solid var(--wg-border); color: var(--wg-text); }
.wg-btn--outline:hover { border-color: var(--wg-primary); color: var(--wg-primary); }
.wg-btn--load-more { width: 100%; padding: 1rem; background: var(--wg-surface-alt); border: 1px solid var(--wg-border); border-radius: var(--wg-radius-md); font-weight: 600; color: var(--wg-text); transition: all var(--wg-transition); }
.wg-btn--load-more:hover { background: var(--wg-primary); color: #fff; border-color: var(--wg-primary); }

/* ----- Badges ----- */
.badge { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; border-radius: var(--wg-radius-sm); }
.badge--breaking { background: var(--wg-breaking); color: #fff; }
.badge--exclusive { background: var(--wg-exclusive); color: #000; }
.badge--updated { background: var(--wg-updated); color: #fff; }

/* ----- Reading Time / Views ----- */
.reading-time, .view-count { display: inline-flex; align-items: center; gap: 0.25rem; font-size: 0.8125rem; color: var(--wg-text-light); }
.reading-time .icon, .view-count .icon { width: 14px; height: 14px; display: inline-block; vertical-align: -0.15em; opacity: 0.6; }

/* ----- Font Size Toggle ----- */
.font-size-toggle { display: flex; gap: 0.25rem; }
.font-size-toggle__btn { padding: 0.375rem 0.625rem; border: 1px solid var(--wg-border); border-radius: var(--wg-radius-sm); font-weight: 600; font-size: 0.8125rem; color: var(--wg-text-light); transition: all var(--wg-transition); }
.font-size-toggle__btn:hover { background: var(--wg-primary); color: #fff; border-color: var(--wg-primary); }

/* ----- Widget Popular Posts ----- */
.widget-popular-posts__item { display: flex; gap: 0.75rem; align-items: flex-start; padding: 0.75rem 0; border-bottom: 1px solid var(--wg-border-light); }
.widget-popular-posts__item:last-child { border-bottom: none; }
.widget-popular-posts__rank { flex-shrink: 0; width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; background: var(--wg-primary); color: #fff; font-size: 0.75rem; font-weight: 800; border-radius: var(--wg-radius-sm); }
.widget-popular-posts__thumb { flex-shrink: 0; width: 60px; height: 45px; border-radius: var(--wg-radius-sm); overflow: hidden; }
.widget-popular-posts__thumb img { width: 100%; height: 100%; object-fit: cover; }
.widget-popular-posts__info { flex: 1; min-width: 0; }
.widget-popular-posts__title { font-size: 0.875rem; font-weight: 600; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--wg-text); }
.widget-popular-posts__title:hover { color: var(--wg-primary); }
.widget-popular-posts__date { font-size: 0.75rem; color: var(--wg-text-light); display: block; margin-top: 0.25rem; }

/* ----- Social Links Widget ----- */
.widget-social-links { display: flex; gap: 0.5rem; }
.widget-social-links__link { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: var(--wg-radius-sm); background: var(--wg-surface-alt); color: var(--wg-text-light); transition: all var(--wg-transition); }
.widget-social-links__link:hover { background: var(--wg-primary); color: #fff; }
.widget-social-links__link .icon { width: 18px; height: 18px; display: inline-block; vertical-align: -0.1em; }

/* ----- Ad Widget ----- */
.widget-ad__content { text-align: center; }

/* ----- Responsive ----- */
@media (max-width: 1200px) {
	.hero-news__main-title { font-size: 1.5rem; }
	.footer-main__grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 1024px) {
	.content-area { grid-template-columns: 1fr; }
	.hero-news__grid { grid-template-columns: 1fr; }
	.category-section__grid { grid-template-columns: 1fr 1fr; }
	.opinion-grid { grid-template-columns: 1fr 1fr; }
	.video-grid { grid-template-columns: 1fr; }
	.related-posts__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
	.top-bar__left { display: none; }
	.site-header__search { display: none; }
	.menu-toggle { display: flex; }
	.main-nav { position: fixed; top: 0; left: 0; bottom: 0; width: 280px; background: var(--wg-surface); z-index: 10001; transform: translateX(-100%); transition: transform 0.3s; overflow-y: auto; box-shadow: var(--wg-shadow-xl); border-right: 3px solid var(--wg-primary); }
	.main-nav.is-open { transform: translateX(0); }
	.main-nav__list { flex-direction: column; }
	.main-nav__item + .main-nav__item { border-left: none; border-top: 1px solid var(--wg-border-light); }
	.main-nav__link { padding: 0.875rem 1.25rem; border-bottom: none; margin-bottom: 0; font-size: 0.9375rem; }
	.main-nav__dropdown,
	.main-nav .sub-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: none; display: none; padding-left: 1rem; padding-top: 0; padding-bottom: 0; }
	.main-nav .menu-item.is-open > .main-nav__dropdown,
	.main-nav .menu-item.is-open > .sub-menu { display: block; }
	.menu-item-has-children.is-open > a { background: var(--wg-primary-light); color: var(--wg-primary); }
	.menu-item-has-children > a::after { right: 1rem; transition: transform 0.3s; }
	.menu-item-has-children.is-open > a::after { transform: translateY(-30%) rotate(45deg); }
	.main-nav .sub-menu a { white-space: normal; }
	.hero-news__side-card { flex-direction: column; }
	.hero-news__side-thumb { width: 100%; height: 160px; }
	.category-section__grid { grid-template-columns: 1fr; }
	.opinion-grid { grid-template-columns: 1fr; }
	.subscription { flex-direction: column; padding: 2rem; }
	.subscription__form { flex-direction: column; }
	.post-navigation { grid-template-columns: 1fr; }
	.related-posts__grid { grid-template-columns: 1fr; }
	.article-actions { flex-direction: column; align-items: flex-start; }
	.footer-main__grid { grid-template-columns: 1fr; }
	.footer-bottom__inner { flex-direction: column; gap: 0.5rem; }
	.footer-bottom__links { flex-wrap: wrap; justify-content: center; }
	.hero-news__main-title { font-size: 1.35rem; }
	.single-header__title { font-size: 1.5rem; }
	.content-area--sidebar-left { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
	.container { padding: 0 0.75rem; }
	.top-bar__right { gap: 0.5rem; }
	.card--horizontal { flex-direction: column; }
	.card--horizontal .card__thumb { width: 100%; aspect-ratio: 16/9; }
	.subscription__title { font-size: 1.25rem; }
	.error-404__code { font-size: 5rem; }
}
