/*
Theme Name: Vestisrbija
Description: Lightweight custom theme for the Vestisrbija rebuild.
Version: 1.0.0
Text Domain: vestisrbija
*/

:root { --ink: #17212b; --muted: #65717e; --line: #e5e9ed; --accent: #d91f26; --surface: #fff; --page: #f5f7f8; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--page); color: var(--ink); font-family: Arial, Helvetica, sans-serif; line-height: 1.55; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--accent); }
.site-header { background: #151718; border-bottom: 2px solid #fff; }
.header-inner, .site-main, .footer-inner { width: min(1160px, calc(100% - 32px)); margin: 0 auto; }
.primary-nav { height: 82px; display: flex; align-items: stretch; justify-content: space-between; }
.brand { flex: 0 0 112px; display: flex; align-items: center; justify-content: center; background: #fff; margin: 3px 0; padding: 10px; }
.brand img { display: block; width: 100%; height: 100%; object-fit: contain; }
.header-menu { display: flex; align-items: stretch; justify-content: flex-end; list-style: none; margin: 0; padding: 0; }
.header-menu li { display: flex; align-items: stretch; }
.header-menu > li > a, .search-toggle { display: inline-flex; align-items: center; gap: 7px; padding: 0 20px; color: #f8f8f8; background: transparent; border: 0; font-size: 14px; font-weight: 800; font-family: inherit; }
.header-menu > li > a:hover, .header-menu > li > a:focus { color: #fff; background: #28508d; }
.has-mega-menu.is-open > a { color: #fff; background: #28508d; }
.header-menu span { font-size: 17px; line-height: 1; transform: translateY(-2px); }
.search-toggle { cursor: pointer; padding-right: 17px; }
.search-toggle:hover { color: #fff; }
.mobile-header, .mobile-menu-panel, .mobile-search-panel, .mobile-panel-overlay { display: none; }
.search-toggle svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; }
.search-item { position: relative; }
.search-panel { position: absolute; z-index: 35; top: 82px; right: 0; width: 300px; padding: 15px; visibility: hidden; opacity: 0; pointer-events: none; transform: translateY(-6px); background: #fff; border: 1px solid #e1e4e6; box-shadow: 0 14px 28px rgba(0, 0, 0, .18); transition: opacity 140ms ease, transform 140ms ease, visibility 0s linear 140ms; }
.search-item.is-open .search-panel { visibility: visible; opacity: 1; pointer-events: auto; transform: translateY(0); transition-delay: 0s; }
.header-search-form { display: flex; gap: 8px; }
.header-search-form input { min-width: 0; flex: 1; height: 38px; border: 1px solid #ccd2d6; padding: 0 10px; color: #24303a; font: 14px Arial, sans-serif; }
.header-search-form button { border: 0; padding: 0 14px; background: #28508d; color: #fff; font: 700 13px Arial, sans-serif; cursor: pointer; }
.header-search-form button:hover { background: #1e416f; }
.site-main { padding: 36px 0 56px; }
body.home .site-main, body.home.page .site-main { width: 100%; padding-top: 0; }
body.home .hero-showcase { width: min(1160px, 100%); margin: 0 auto; }
body.home .below-hero-layout { width: min(1160px, calc(100% - 32px)); margin-right: auto; margin-left: auto; }
.hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; height: 400px; background: #fff; }
.hero-secondary { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; }
.hero-showcase { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 400px; gap: 3px; background: #fff; }
.hero-showcase > .hero-card-lead { grid-column: 1; grid-row: 1; height: auto; }
.hero-latest-slider { grid-column: 2; grid-row: 1; min-width: 0; }
.hero-latest-track { display: grid; height: 100%; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 3px; overflow: hidden; }
.hero-latest-track .hero-card { min-width: 0; height: auto; }
.hero-latest-track .hero-copy { right: 13px; bottom: 12px; left: 13px; }
.hero-latest-track .hero-category { margin-bottom: 5px; }
.hero-latest-track .hero-card h2 { font-size: 15px; line-height: 1.22; }
.hero-latest-controls { display: none; justify-content: flex-end; gap: 5px; padding-top: 10px; }
.hero-latest-controls button { display: inline-flex; width: 27px; height: 27px; align-items: center; justify-content: center; border: 1px solid #d7dadd; background: #fff; color: #8d989f; font: 22px/1 Arial, sans-serif; cursor: pointer; }
.hero-latest-controls button:hover { border-color: #28508d; color: #28508d; }
.hero-card { position: relative; min-width: 0; overflow: hidden; background: #182029; color: #fff; }
.hero-image { position: absolute; inset: 0; display: block; }
.hero-image::after { position: absolute; inset: 0; content: ''; background: linear-gradient(to top, rgba(0, 0, 0, .78), rgba(0, 0, 0, .02) 65%); }
.hero-image img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform 220ms ease; }
.hero-card:hover .hero-image img { transform: scale(1.025); }
.hero-copy { position: absolute; right: 18px; bottom: 15px; left: 18px; z-index: 1; }
.hero-category { display: inline-block; margin-bottom: 7px; padding: 3px 5px; background: #111; color: #fff; font: 700 10px/1 Arial, sans-serif; text-transform: uppercase; }
.hero-card h1, .hero-card h2 { margin: 0; color: #fff; font-family: Arial, sans-serif; font-weight: 700; letter-spacing: -.025em; }
.hero-card h1 { max-width: 560px; font-size: clamp(1.6rem, 2.6vw, 2rem); line-height: 1.08; }
.hero-card h2 { font-size: 16px; line-height: 1.26; }
.hero-card h1 a, .hero-card h2 a { color: inherit; }
.below-hero-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(290px, 1fr); gap: 42px; padding-top: 38px; }
.category-feeds { min-width: 0; }
.category-feed { margin-bottom: 48px; }
.category-feed.is-loading { opacity: .55; pointer-events: none; transition: opacity 120ms ease; }
.category-feed-heading { display: flex; align-items: center; margin-bottom: 25px; border-top: 2px solid #222; }
.category-feed-heading h2 { margin: -2px 0 0; padding: 8px 12px; background: #171717; color: #fff; font: 700 13px/1 Arial, sans-serif; text-transform: uppercase; }
.category-feed-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3px; background: #fff; }
.category-feed-card { position: relative; min-width: 0; aspect-ratio: 3 / 2; overflow: hidden; background: #17212b; }
.category-feed-card a { position: absolute; inset: 0; display: block; color: #fff; }
.category-feed-card a::after { position: absolute; inset: 0; content: ''; background: linear-gradient(to top, rgba(0, 0, 0, .79), rgba(0, 0, 0, .04) 68%); }
.category-feed-card img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform 200ms ease; }
.category-feed-card:hover img { transform: scale(1.025); }
.category-feed-card span { position: absolute; z-index: 1; right: 17px; bottom: 17px; left: 17px; color: #fff; font: 700 17px/1.28 Arial, sans-serif; letter-spacing: -.025em; }
.category-feed-pagination { display: flex; justify-content: flex-end; gap: 6px; padding-top: 17px; }
.category-feed-pagination a { display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; border: 1px solid #d7dadd; color: #9ca6ae; font: 23px/1 Arial, sans-serif; }
.category-feed-pagination a:hover { border-color: #28508d; color: #28508d; }
.latest-news-widget { min-width: 0; }
.widget-heading { display: flex; align-items: center; gap: 0; margin-bottom: 26px; border-bottom: 2px solid #202020; }
.widget-heading span { display: inline-block; padding: 8px 12px; background: #171717; color: #fff; font: 700 13px/1 Arial, sans-serif; text-transform: uppercase; }
.latest-widget-feature { position: relative; overflow: hidden; height: 204px; background: #182029; }
.latest-widget-feature a { display: block; width: 100%; height: 100%; color: #fff; }
.latest-widget-feature a::after { position: absolute; inset: 0; content: ''; background: linear-gradient(to top, rgba(0, 0, 0, .8), rgba(0, 0, 0, .04) 70%); }
.latest-widget-feature img { width: 100%; height: 100%; display: block; object-fit: cover; }
.latest-widget-feature span { position: absolute; z-index: 1; right: 14px; bottom: 14px; left: 14px; font: 700 18px/1.25 Arial, sans-serif; letter-spacing: -.02em; }
.latest-widget-list { padding-top: 20px; }
.latest-widget-item { display: grid; grid-template-columns: 80px minmax(0, 1fr); gap: 16px; align-items: start; margin-bottom: 17px; }
.latest-widget-thumb { display: block; height: 59px; background: #e2e5e7; overflow: hidden; }
.latest-widget-thumb img { width: 100%; height: 100%; display: block; object-fit: cover; }
.latest-widget-item h3 { margin: 0; color: #123c7a; font: 13px/1.35 Arial, sans-serif; font-weight: 400; }
.latest-widget-item h3 a:hover { color: #d91f26; }
body.page { background: #eef0f1; }
body.page .site-main { padding-top: 28px; }
.page-with-sidebar { display: grid; grid-template-columns: minmax(0, 2fr) minmax(290px, 1fr); gap: 58px; margin: 0 24px 56px; padding: 38px 42px 48px; background: #fff; }
.about-page { min-width: 0; }
.about-page h1 { margin: 0 0 24px; font: 400 clamp(1.8rem, 3vw, 2.35rem)/1 Arial, sans-serif; letter-spacing: -.035em; text-transform: uppercase; }
.about-content { max-width: 760px; color: #1c242b; font-size: 16px; line-height: 1.68; }
.about-content p { margin: 0 0 25px; }
.about-content strong { font-weight: 700; }
.about-content h2 { margin: 29px 0 18px; padding-top: 28px; border-top: 1px solid #9da3a8; color: #12191f; font: 400 27px/1.15 Arial, sans-serif; text-transform: uppercase; }
.about-content h3 { margin: 24px 0 9px; color: #182128; font: 700 17px/1.3 Arial, sans-serif; }
.about-content ul { margin: -4px 0 27px; padding-left: 22px; }
.about-content li { padding-left: 1px; }
.contact-page { max-width: 860px; padding: 0 0 56px; }
.contact-heading { display: flex; align-items: center; margin-bottom: 23px; border-bottom: 2px solid #202020; }
.contact-heading span { display: inline-block; padding: 7px 12px; background: #171717; color: #fff; font: 700 13px/1 Arial, sans-serif; text-transform: uppercase; }
.contact-form p { margin: 0 0 20px; }
.contact-form p { color: #18232b; font: 13px/1.2 Arial, sans-serif; }
.contact-form .wpcf7-form-control-wrap { display: block; margin-top: 12px; }
.contact-form input:not([type="submit"]), .contact-form textarea { display: block; width: 100%; border: 1px solid #d9dddf; border-radius: 0; background: #fff; color: #17212b; font: 15px Arial, sans-serif; }
.contact-form input:not([type="submit"]) { height: 28px; padding: 4px 8px; }
.contact-form textarea { min-height: 134px; padding: 8px; resize: vertical; }
.contact-form input[type="submit"] { border: 0; padding: 7px 13px; background: #171717; color: #fff; font: 700 12px/1 Arial, sans-serif; cursor: pointer; }
.contact-form input[type="submit"]:hover { background: #28508d; }
.contact-form .wpcf7-not-valid-tip { margin-top: 5px; color: #c72727; font-size: 12px; }
.contact-form .wpcf7-response-output { margin: 16px 0 0; padding: 8px 11px; border-width: 1px; font-size: 13px; }
.latest-news-sticky { position: sticky; top: 22px; align-self: start; }
.tag-archive-with-sidebar { display: grid; grid-template-columns: minmax(0, 2fr) minmax(290px, 1fr); gap: 58px; padding: 4px 0 56px; }
.category-archive-page > h1 { margin: 0 0 18px; color: #121b22; font: 700 30px/1.15 Arial, sans-serif; text-transform: uppercase; }
.category-subcategory-filter { display: flex; flex-wrap: wrap; gap: 6px; margin: -8px 0 30px; }
.category-subcategory-filter a { border: 1px solid #e0e3e5; padding: 3px 9px; color: #30404c; background: #fff; font: 12px/1.2 Arial, sans-serif; }
.category-subcategory-filter a:hover { border-color: #28508d; color: #28508d; }
.category-featured-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3px; }
.category-feature-card { position: relative; min-width: 0; height: 220px; overflow: hidden; background: #1b242b; }
.category-feature-card > a { display: block; width: 100%; height: 100%; color: #fff; }
.category-feature-card > a::after { position: absolute; inset: 0; content: ''; background: linear-gradient(to top, rgba(0, 0, 0, .78), rgba(0, 0, 0, .04) 70%); }
.category-feature-card img { width: 100%; height: 100%; display: block; object-fit: cover; }
.category-feature-overlay { position: absolute; z-index: 1; right: 19px; bottom: 20px; left: 19px; display: block; }
.category-feature-overlay small { display: table; margin-bottom: 8px; padding: 3px 5px; background: #161616; color: #fff; font: 700 10px/1 Arial, sans-serif; text-transform: uppercase; }
.category-feature-overlay strong { display: block; color: #fff; font: 700 20px/1.3 Arial, sans-serif; letter-spacing: -.025em; }
.category-archive-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(290px, 1fr); gap: 58px; padding-top: 48px; }
.category-archive-results { min-width: 0; }
.category-archive-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 47px; row-gap: 42px; }
.category-archive-card { min-width: 0; }
.category-archive-image { display: block; aspect-ratio: 1.68 / 1; overflow: hidden; background: #e0e4e6; }
.category-archive-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.category-archive-card h2 { margin: 11px 0 0; color: #13202a; font: 400 21px/1.24 Arial, sans-serif; letter-spacing: -.025em; }
.category-archive-card h2 a:hover { color: #245da3; }
.category-archive-loader { min-height: 38px; padding-top: 22px; color: #77828a; font-size: 13px; text-align: center; }
.tag-archive { min-width: 0; }
.tag-archive > h1 { margin: 0 0 20px; color: #111b23; font: 400 clamp(1.8rem, 3vw, 2.35rem)/1.15 Arial, sans-serif; letter-spacing: -.035em; }
.tag-post-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 47px; row-gap: 43px; }
.tag-post-card { min-width: 0; }
.tag-post-image { display: block; aspect-ratio: 1.68 / 1; margin-bottom: 10px; overflow: hidden; background: #e1e5e7; }
.tag-post-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.tag-post-category { color: #245da3; font: 700 11px/1 Arial, sans-serif; text-transform: uppercase; }
.tag-post-card h2 { margin: 7px 0 11px; color: #10202c; font: 400 22px/1.2 Arial, sans-serif; letter-spacing: -.025em; }
.tag-post-card h2 a:hover { color: #245da3; }
.tag-post-card p { margin: 0; color: #67737d; font-size: 14px; line-height: 1.5; }
.archive-pagination { margin-top: 36px; }
.archive-pagination .nav-links { display: flex; flex-wrap: wrap; gap: 6px; }
.archive-pagination .page-numbers { display: inline-flex; width: 31px; height: 31px; align-items: center; justify-content: center; border: 1px solid #d7dadd; color: #53606a; font-size: 13px; }
.archive-pagination .page-numbers.current { border-color: #222; background: #222; color: #fff; }
.single-with-sidebar { display: grid; grid-template-columns: minmax(0, 2fr) minmax(290px, 1fr); gap: 58px; padding: 0 0 56px; }
.single-article { min-width: 0; }
.single-categories { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 16px; }
.single-categories a { padding: 5px 8px; background: #202020; color: #fff; font: 700 11px/1 Arial, sans-serif; }
.single-categories a:first-child { background: #d83468; }
.single-article > h1 { margin: 0 0 25px; color: #101820; font: 400 clamp(2.1rem, 4vw, 3.3rem)/1.16 Arial, sans-serif; letter-spacing: -.04em; }
.single-date { margin-bottom: 21px; padding-left: 10px; border-left: 2px solid #d59d3d; color: #9ba1a5; font-size: 14px; }
.single-content { color: #17232d; font-size: 17px; line-height: 1.7; }
.single-content img { max-width: 100%; height: auto; }
.single-content a { color: #245da3; text-decoration: underline; }
.post-keywords { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; margin-top: 38px; }
.post-keywords strong, .post-keywords a { padding: 5px 9px; border: 1px solid #e2e3e4; color: #26313a; font: 12px/1 Arial, sans-serif; }
.post-keywords strong { border-color: #202020; background: #202020; color: #fff; font-weight: 700; text-transform: uppercase; }
.single-post-navigation { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin: 38px 0 42px; }
.single-post-navigation > div { min-height: 70px; }
.single-post-navigation .next-post { text-align: right; }
.single-post-navigation span { display: block; margin-bottom: 10px; color: #b2b9be; font-size: 13px; }
.single-post-navigation a { color: #1c2932; font-size: 16px; line-height: 1.4; }
.single-post-navigation a:hover { color: #245da3; }
.recommendation-tabs { display: flex; align-items: flex-end; border-bottom: 2px solid #222; }
.recommendation-tabs button { border: 0; padding: 9px 13px; background: #f5f6f6; color: #555; font: 13px/1 Arial, sans-serif; cursor: pointer; text-transform: uppercase; }
.recommendation-tabs button.is-current { background: #222; color: #fff; }
.recommendation-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; min-height: 185px; padding-top: 26px; }
.recommendation-card { min-width: 0; }
.recommendation-image { display: block; aspect-ratio: 1.45 / 1; background: #e5e8e9; overflow: hidden; }
.recommendation-image img { width: 100%; height: 100%; display: block; object-fit: cover; }
.recommendation-card h3 { margin: 8px 0 0; font: 14px/1.4 Arial, sans-serif; font-weight: 400; }
.recommendation-card h3 a:hover { color: #245da3; }
.recommendation-controls { display: flex; gap: 6px; padding-top: 14px; }
.recommendation-controls button { width: 27px; height: 27px; border: 1px solid #d7dadd; background: #fff; color: #9ca6ae; font: 22px/1 Arial, sans-serif; cursor: pointer; }
.recommendation-controls button:hover { border-color: #28508d; color: #28508d; }
.post-recommendations.is-loading { opacity: .58; pointer-events: none; transition: opacity 120ms ease; }
.section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin: 0 0 22px; }
.section-heading h1, .section-heading h2 { margin: 0; font-size: clamp(1.55rem, 3vw, 2.2rem); letter-spacing: -.04em; }
.section-heading a { color: var(--accent); font-weight: 700; }
.post-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.post-card, .article, .empty-state { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.post-card-image { aspect-ratio: 16 / 9; display: block; background: #dfe5e8; }
.post-card-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.post-card-body { padding: 17px; }
.post-card h2 { margin: 7px 0 9px; font-size: 1.18rem; line-height: 1.25; letter-spacing: -.02em; }
.post-meta, .category-label { color: var(--muted); font-size: .8rem; }
.category-label { color: var(--accent); font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.post-card p { margin: 0; color: var(--muted); font-size: .92rem; }
.article { max-width: 820px; margin: 0 auto; padding: clamp(22px, 5vw, 56px); }
.article h1 { margin: 8px 0 14px; font-size: clamp(2rem, 5vw, 3.6rem); line-height: 1.08; letter-spacing: -.055em; }
.article-featured { width: 100%; height: auto; margin: 26px 0; border-radius: 8px; }
.article-content { font-size: 1.06rem; }
.article-content img { max-width: 100%; height: auto; }
.article-content a { color: var(--accent); text-decoration: underline; }
.pagination { margin-top: 32px; display: flex; gap: 8px; }
.pagination .page-numbers { background: #fff; border: 1px solid var(--line); padding: 8px 12px; border-radius: 6px; }
.pagination .current { background: var(--ink); color: #fff; }
.empty-state { padding: 32px; }
.site-footer { margin-top: 0; background: #202020; color: #f6f6f6; }
.footer-top { display: grid; grid-template-columns: 230px minmax(260px, 1fr) minmax(200px, .65fr); gap: 48px; min-height: 240px; align-items: start; padding-top: 41px; padding-bottom: 41px; }
.footer-logo { display: flex; width: 230px; height: 154px; align-items: center; justify-content: center; background: #fff; padding: 20px; }
.footer-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.footer-about h2, .footer-social h2 { margin: 7px 0 30px; color: #fff; font: 700 16px/1 Arial, sans-serif; text-transform: uppercase; }
.footer-about p { margin: 0; font-size: 15px; }
.facebook-link { display: inline-flex; width: 41px; height: 41px; align-items: center; justify-content: center; border: 1px solid #303030; color: #fff; font: 700 18px/1 Arial, sans-serif; }
.facebook-link:hover { border-color: #4169a8; color: #fff; background: #4169a8; }
.footer-bottom { border-top: 1px solid #252525; background: #111; }
.footer-bottom .footer-inner { display: flex; min-height: 36px; align-items: center; justify-content: space-between; gap: 20px; font-size: 12px; }
.footer-bottom p { margin: 0; }
.footer-bottom nav { display: flex; gap: 20px; white-space: nowrap; }
.footer-bottom nav a:hover { color: #4e78bc; }
.primary-nav { position: relative; }
.has-mega-menu { position: static; }
.mega-menu { position: absolute; z-index: 30; top: 82px; left: -2px; right: -2px; display: flex; min-height: 288px; visibility: hidden; opacity: 0; pointer-events: none; transform: translateY(-6px); background: #fff; border: 1px solid #e4e4e4; box-shadow: 0 14px 28px rgba(0, 0, 0, .18); color: #303030; transition: opacity 150ms ease, transform 150ms ease, visibility 0s linear 150ms; }
.has-mega-menu.is-open .mega-menu { visibility: visible; opacity: 1; pointer-events: auto; transform: translateY(0); transition-delay: 0s; }
.mega-tabs { flex: 0 0 220px; border-right: 1px solid #e8e8e8; padding: 10px 0; background: #fafafa; }
.mega-tabs-scroll { max-height: 288px; overflow-y: auto; scrollbar-color: #949494 #fafafa; scrollbar-width: thin; }
.mega-tabs-scroll::-webkit-scrollbar { width: 9px; }
.mega-tabs-scroll::-webkit-scrollbar-thumb { background: #949494; border-radius: 8px; }
.mega-tabs-scroll::-webkit-scrollbar-track { background: #fafafa; }
.mega-tabs button { display: block; width: 100%; border: 0; background: transparent; padding: 10px 30px; color: #383838; text-align: right; font: 14px/1.2 Arial, sans-serif; cursor: pointer; }
.mega-tabs button:hover, .mega-tabs button.is-current { color: #264b86; background: #fff; }
.mega-panels { display: grid; flex: 1; min-width: 0; padding: 21px 22px 18px; }
.mega-panels-politika { padding-left: 24px; padding-right: 24px; }
.mega-panel { grid-area: 1 / 1; min-width: 0; overflow: hidden; visibility: hidden; opacity: 0; pointer-events: none; transform: translateX(7px); transition: opacity 130ms ease, transform 130ms ease, visibility 0s linear 130ms; }
.has-mega-menu.is-open .mega-panel.is-current { visibility: visible; opacity: 1; pointer-events: auto; transform: translateX(0); transition-delay: 0s; }
.mega-track { display: flex; width: 100%; min-width: 0; gap: 22px; overflow: hidden; scroll-behavior: smooth; scroll-snap-type: x mandatory; }
.mega-panel.is-loading .mega-track { min-height: 184px; opacity: .42; }
.mega-empty { margin: 0; color: #6b747c; font: 14px Arial, sans-serif; }
.mega-card { scroll-snap-align: start; }
.mega-card { flex: 0 0 calc((100% - 66px) / 4); min-width: 0; position: relative; }
.politics-mega .mega-card { flex-basis: calc((100% - 88px) / 5); }
.mega-media { position: relative; }
.mega-image { display: block; aspect-ratio: 3 / 2; background: #e5e8e9; overflow: hidden; }
.mega-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.mega-category { position: absolute; bottom: 0; left: 0; z-index: 1; padding: 3px 5px; background: #141414; color: #fff; font-size: 10px; font-weight: 700; line-height: 1; }
.mega-card h3 { margin: 7px 0 0; color: #3a3a3a; font: 12px/1.4 Arial, sans-serif; font-weight: 400; }
.mega-card h3 a { display: block; overflow: hidden; color: inherit; background: transparent; padding: 0; font: inherit; }
.mega-card h3 a:hover { color: #28508d; background: transparent; }
.mega-controls { display: flex; justify-content: flex-end; gap: 6px; padding-top: 16px; }
.mega-arrow { width: 26px; height: 26px; border: 1px solid #ddd; background: #fff; color: #a9a9a9; font: 22px/20px Arial, sans-serif; cursor: pointer; }
.mega-arrow:hover { color: #28508d; border-color: #28508d; }
@media (max-width: 800px) { body.home .below-hero-layout { width: min(100% - 20px, 1160px); } body.home.page .site-main { padding-top: 0; } .header-inner, .site-main, .footer-inner { width: min(100% - 20px, 1160px); } .site-header { min-height: 62px; } .site-header .header-inner { display: none; } .mobile-header { display: grid; grid-template-columns: 62px 1fr 62px; height: 62px; align-items: center; } .mobile-header-button { display: inline-flex; width: 62px; height: 62px; align-items: center; justify-content: center; border: 0; background: transparent; color: #fff; cursor: pointer; } .mobile-menu-toggle { flex-direction: column; gap: 4px; } .mobile-menu-toggle span { display: block; width: 21px; height: 2px; background: currentColor; } .mobile-brand { display: flex; width: 78px; height: 56px; align-items: center; justify-content: center; justify-self: center; background: #fff; padding: 6px; } .mobile-brand img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; } .mobile-search-toggle svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; } .mobile-panel-overlay { position: fixed; z-index: 90; inset: 0; display: block; visibility: hidden; opacity: 0; background: rgba(0, 0, 0, .48); transition: opacity 180ms ease, visibility 0s linear 180ms; } .mobile-menu-panel, .mobile-search-panel { position: fixed; z-index: 91; top: 0; bottom: 0; display: block; width: min(84vw, 330px); overflow-y: auto; background: #fff; box-shadow: 0 0 28px rgba(0, 0, 0, .3); transition: transform 220ms ease; } .mobile-menu-panel { left: 0; transform: translateX(-103%); } .mobile-search-panel { right: 0; transform: translateX(103%); } body.mobile-menu-open, body.mobile-search-open { overflow: hidden; } body.mobile-menu-open .mobile-menu-panel, body.mobile-search-open .mobile-search-panel { transform: translateX(0); } body.mobile-menu-open .mobile-panel-overlay, body.mobile-search-open .mobile-panel-overlay { visibility: visible; opacity: 1; transition-delay: 0s; } .mobile-panel-heading { display: flex; height: 58px; align-items: center; justify-content: space-between; padding-left: 20px; border-bottom: 1px solid #e3e5e6; color: #1d252c; font: 700 16px/1 Arial, sans-serif; text-transform: uppercase; } .mobile-panel-close { width: 58px; height: 58px; border: 0; border-left: 1px solid #e3e5e6; background: #fff; color: #26333d; font: 31px/1 Arial, sans-serif; cursor: pointer; } .mobile-navigation { padding: 7px 0 24px; } .mobile-nav-row { display: flex; min-height: 52px; align-items: stretch; border-bottom: 1px solid #eaeced; } .mobile-nav-row a { flex: 1; padding: 16px 20px; color: #1c242b; font: 700 15px/1.3 Arial, sans-serif; text-transform: uppercase; } .mobile-nav-row button { width: 52px; border: 0; border-left: 1px solid #eaeced; background: #fff; color: #31568e; font-size: 15px; cursor: pointer; transition: transform 160ms ease; } .mobile-nav-group.is-open > .mobile-nav-row button { transform: rotate(180deg); } .mobile-submenu { max-height: 0; overflow: hidden; background: #f6f7f7; transition: max-height 220ms ease; } .mobile-nav-group.is-open .mobile-submenu { max-height: 520px; } .mobile-submenu a { display: block; padding: 10px 20px 10px 34px; color: #4a555e; font: 14px/1.4 Arial, sans-serif; } .mobile-submenu a:first-child { padding-top: 14px; } .mobile-submenu a:last-child { padding-bottom: 14px; } .mobile-search-form { display: flex; flex-direction: column; gap: 12px; padding: 20px; } .mobile-search-form input { width: 100%; height: 44px; border: 1px solid #cfd5d8; padding: 0 12px; color: #202b33; font: 15px Arial, sans-serif; } .mobile-search-form button { height: 42px; border: 0; background: #28508d; color: #fff; font: 700 14px Arial, sans-serif; cursor: pointer; } .primary-nav { height: 64px; } .brand { flex-basis: 92px; padding: 7px; } .header-menu { display: none; } .mega-menu { display: none !important; } .hero-grid { grid-template-columns: 1fr; height: auto; } .hero-showcase > .hero-card-lead { min-height: 330px; height: 330px; } .hero-latest-track { overflow-x: auto; scrollbar-width: none; } .hero-latest-track::-webkit-scrollbar { display: none; } .hero-latest-track .hero-card { flex-basis: 82%; height: 160px; } .hero-latest-track .hero-card h2 { font-size: 14px; } .hero-latest-controls { display: none; } .hero-copy { right: 12px; bottom: 12px; left: 12px; } .hero-card h1 { font-size: 1.65rem; } .hero-card h2 { font-size: 13px; } .below-hero-layout, .page-with-sidebar, .single-with-sidebar, .tag-archive-with-sidebar { grid-template-columns: 1fr; gap: 32px; } .page-with-sidebar { margin: 0 0 34px; padding: 26px 18px 34px; } .latest-news-widget { max-width: 430px; } .latest-news-sticky { position: static; } .category-feed-card span { right: 12px; bottom: 12px; left: 12px; font-size: 14px; } .single-post-navigation { gap: 20px; } .recommendation-grid { gap: 10px; } .recommendation-card h3 { font-size: 12px; } .tag-post-grid { column-gap: 18px; row-gap: 30px; } .tag-post-card h2 { font-size: 17px; } .tag-post-card p { font-size: 13px; } .footer-top { grid-template-columns: 1fr; gap: 26px; padding: 30px 0; } .footer-logo { width: 200px; height: 130px; } .footer-about h2, .footer-social h2 { margin: 0 0 12px; } .footer-bottom .footer-inner { align-items: flex-start; flex-direction: column; padding: 14px 0; } .footer-bottom nav { flex-wrap: wrap; gap: 10px 16px; white-space: normal; } .site-main { padding-top: 24px; } }

@media (max-width: 800px) {
	.category-feed-grid { grid-template-columns: 1fr; }
	.category-feed-card span { font-size: 17px; }
	.tag-archive > h1 { font-size: 23px; }
	.tag-post-grid { grid-template-columns: 1fr; gap: 42px; }
	.tag-post-image { aspect-ratio: 2.05 / 1; }
	.tag-post-card h2 { margin-top: 11px; font-size: 21px; }
	.tag-post-card p { font-size: 13px; }
	.category-archive-page > h1 { font-size: 24px; }
	.category-subcategory-filter { margin-bottom: 23px; }
	.category-featured-grid, .category-archive-grid { grid-template-columns: 1fr; }
	.category-featured-grid { width: 100vw; margin-left: calc(50% - 50vw); gap: 3px; }
	.category-feature-card { height: auto; aspect-ratio: 2.56 / 1; }
	.category-feature-overlay { right: 15px; bottom: 16px; left: 15px; }
	.category-feature-overlay strong { font-size: 19px; }
	.category-archive-layout { grid-template-columns: 1fr; gap: 32px; padding-top: 34px; }
	.category-archive-grid { row-gap: 38px; }
	.category-archive-card h2 { font-size: 21px; }
	.contact-page { padding-bottom: 34px; }
	.contact-form p { margin-bottom: 23px; }
	.contact-form input { height: 30px; }
	.contact-form textarea { min-height: 150px; }
	.footer-top { grid-template-columns: 1fr; justify-items: center; gap: 46px; min-height: 0; padding: 26px 0 27px; text-align: center; }
	.footer-logo { width: 255px; height: 171px; padding: 24px; }
	.footer-about h2, .footer-social h2 { margin: 0 0 26px; font-size: 16px; }
	.footer-about p { font-size: 13px; }
	.footer-social { display: flex; flex-direction: column; align-items: center; }
	.facebook-link { width: 37px; height: 37px; }
	.footer-bottom .footer-inner { width: 100%; align-items: center; gap: 13px; padding: 12px 8px 14px; text-align: center; }
	.footer-bottom nav { order: -1; justify-content: center; gap: 10px 17px; font-size: 12px; }
}

@media (max-width: 800px) {
	.hero-showcase { display: block; height: auto; }
	.hero-showcase > .hero-card-lead { min-height: 330px; height: 330px; }
	.hero-latest-slider { margin-top: 3px; }
	.hero-latest-track { display: flex; height: auto; overflow-x: auto; scroll-behavior: smooth; scroll-snap-type: x mandatory; }
	.hero-latest-track .hero-card { flex: 0 0 82%; height: 160px; scroll-snap-align: start; }
}