/*
Theme Name: World Pulse Wire v3
Theme URI: https://worldpulsewire.com/
Author: World Pulse Wire
Author URI: https://worldpulsewire.com/
Description: Original, fast, wire-service style news theme for World Pulse Wire. Clean white background, black text, sticky header, breaking ticker, hero, Latest grid and section hubs. All content comes from WordPress posts, pages and categories — no hardcoded articles, no plugins required.
Version: 2.1.0
Requires at least: 6.0
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: worldpulsewire
Tags: news, blog, custom-menu, featured-images, translation-ready
*/

/* =Reset & base ========================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 16px; line-height: 1.55; color: #111;
  background: #fff;
}
a { color: #111; text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3, h4 { line-height: 1.2; margin: 0 0 .5em; }
p { margin: 0 0 1em; }
ul, ol { margin: 0 0 1em 1.25em; padding: 0; }
.container { max-width: 1180px; margin: 0 auto; padding: 0 16px; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }

/* =Top utility bar ====================================================== */
.topbar { background: #111; color: #fff; font-size: 13px; }
.topbar .container { display: flex; justify-content: space-between; gap: 16px; align-items: center; min-height: 36px; flex-wrap: wrap; }
.topbar a { color: #fff; }
.topbar-date { text-transform: uppercase; letter-spacing: .04em; }
.topbar-links a { margin-left: 14px; }

/* =Masthead & sticky header ============================================== */
.site-header { position: sticky; top: 0; z-index: 50; background: #fff; border-bottom: 2px solid #111; }
.masthead { padding: 18px 0 12px; text-align: center; }
.site-title { font-size: 42px; font-weight: 900; letter-spacing: -.02em; margin: 0; text-transform: uppercase; }
.site-title a:hover { text-decoration: none; }
.site-tagline { color: #555; font-size: 14px; margin-top: 4px; }
.main-nav { border-top: 1px solid #ddd; }
.main-nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 0; }
.main-nav li { position: relative; }
.main-nav li a { display: block; padding: 10px 14px; font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.main-nav li a:hover, .main-nav li.current-menu-item > a { text-decoration: none; background: #111; color: #fff; }
.main-nav ul ul { display: none; position: absolute; left: 0; top: 100%; background: #fff; border: 1px solid #ddd; min-width: 200px; flex-direction: column; z-index: 60; }
.main-nav li:hover > ul, .main-nav li:focus-within > ul { display: flex; }
.main-nav ul ul li a { text-transform: none; font-weight: 600; letter-spacing: 0; }
.header-search { display: flex; justify-content: center; gap: 8px; padding: 10px 0 12px; }
.header-search input[type="search"] { width: min(420px, 70vw); padding: 8px 10px; border: 1px solid #111; font-size: 14px; }
.header-search button, .btn { background: #111; color: #fff; border: 1px solid #111; padding: 8px 14px; font-size: 14px; font-weight: 700; cursor: pointer; }
.header-search button:hover, .btn:hover { background: #333; }

/* =Breaking ticker ======================================================= */
.ticker { background: #111; color: #fff; }
.ticker .container { display: flex; align-items: stretch; gap: 0; }
.ticker-label { background: #c00; color: #fff; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; font-size: 13px; padding: 10px 14px; white-space: nowrap; }
.ticker-list { list-style: none; margin: 0; padding: 0; display: flex; overflow-x: auto; }
.ticker-list li { flex: 0 0 auto; }
.ticker-list a { color: #fff; display: block; padding: 10px 16px; font-size: 14px; white-space: nowrap; }
.ticker-list a:hover { text-decoration: underline; }

/* =Ad placeholders (labelled, no real ad code) ============================ */
.ad-slot { border: 1px dashed #999; background: #f7f7f7; color: #666; text-align: center; padding: 14px 10px; margin: 20px 0; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.ad-slot small { display: block; margin-top: 4px; text-transform: none; letter-spacing: 0; }

/* =Layout ================================================================ */
.content-area { display: grid; grid-template-columns: 1fr 300px; gap: 32px; padding: 24px 0 40px; align-items: start; }
.main-col { min-width: 0; }
.sidebar { border-left: 1px solid #ddd; padding-left: 24px; }
.widget { margin-bottom: 28px; }
.widget-title { font-size: 14px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; border-bottom: 2px solid #111; padding-bottom: 8px; margin-bottom: 12px; }
.widget ul { list-style: none; margin: 0; }
.widget li { border-bottom: 1px solid #eee; padding: 8px 0; font-size: 14px; }
.section { margin-bottom: 36px; }
.section-head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; border-bottom: 3px solid #111; padding-bottom: 8px; margin-bottom: 16px; }
.section-head h2 { font-size: 22px; font-weight: 900; text-transform: uppercase; letter-spacing: .02em; margin: 0; }
.section-head a { font-size: 13px; font-weight: 800; text-transform: uppercase; white-space: nowrap; }

/* =Hero & banner ========================================================= */
.hero { display: grid; grid-template-columns: 2fr 1fr; gap: 20px; margin-bottom: 24px; }
.hero-main h2 { font-size: 34px; font-weight: 900; }
.hero-main .excerpt { color: #444; font-size: 17px; }
.hero-side { display: grid; gap: 16px; align-content: start; }
.hero-side article h3 { font-size: 17px; }
.post-card h3 { font-size: 19px; }
.post-card h3 a:hover { text-decoration: underline; }
.post-meta { color: #666; font-size: 13px; margin-bottom: 6px; }
.post-meta .cat { font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: #c00; }
.post-meta time { margin-left: 6px; }

/* =Latest grid & cards ==================================================== */
.post-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.post-card { border-top: 1px solid #ddd; padding-top: 12px; }
.post-card .thumb { margin-bottom: 10px; overflow: hidden; }
.post-card .thumb img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.updates-list { list-style: none; margin: 0; }
.updates-list li { display: grid; grid-template-columns: 150px 1fr; gap: 16px; padding: 12px 0; border-bottom: 1px solid #eee; }
.updates-list time { color: #666; font-size: 13px; font-weight: 700; }
.updates-list h3 { font-size: 17px; margin: 0; }

/* =Single article ======================================================== */
.article-head { border-bottom: 1px solid #ddd; padding-bottom: 16px; margin-bottom: 20px; }
.article-head h1 { font-size: 38px; font-weight: 900; }
.article-head .standfirst { font-size: 19px; color: #444; }
.byline { color: #666; font-size: 14px; }
.share { display: flex; gap: 8px; flex-wrap: wrap; margin: 16px 0; }
.share a { border: 1px solid #111; padding: 6px 12px; font-size: 13px; font-weight: 700; }
.share a:hover { background: #111; color: #fff; text-decoration: none; }
.key-points { border: 1px solid #111; padding: 16px 18px; margin: 20px 0; background: #fafafa; }
.key-points h2 { font-size: 15px; text-transform: uppercase; letter-spacing: .06em; }
.key-points ul { margin-bottom: 0; }
.article-body { font-size: 18px; }
.source-footer { border-top: 1px solid #ddd; margin-top: 28px; padding-top: 14px; color: #555; font-size: 14px; }
.related-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }

/* =Archive / search / page =============================================== */
.archive-head { border-bottom: 3px solid #111; padding-bottom: 10px; margin-bottom: 20px; }
.breadcrumb { color: #666; font-size: 13px; margin-bottom: 8px; }
.breadcrumb a { color: #666; }
.pagination { display: flex; gap: 10px; margin-top: 24px; font-weight: 700; }
.pagination a, .pagination span { border: 1px solid #111; padding: 6px 12px; }
.pagination .current { background: #111; color: #fff; }

/* =Footer ================================================================ */
.site-footer { background: #111; color: #ddd; margin-top: 20px; }
.site-footer a { color: #fff; }
.footer-index { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; padding: 36px 0 24px; }
.footer-index h3 { color: #fff; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; }
.footer-index ul { list-style: none; margin: 0; }
.footer-index li { padding: 4px 0; font-size: 14px; }
.footer-nav ul { list-style: none; margin: 0; display: flex; flex-wrap: wrap; gap: 16px; padding: 16px 0; border-top: 1px solid #333; }
.footer-bottom { border-top: 1px solid #333; padding: 16px 0 28px; font-size: 13px; color: #aaa; }

/* =Responsive ============================================================ */
@media (max-width: 900px) {
  .content-area { grid-template-columns: 1fr; }
  .sidebar { border-left: 0; padding-left: 0; border-top: 1px solid #ddd; padding-top: 24px; }
  .hero { grid-template-columns: 1fr; }
  .post-grid, .related-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-index { grid-template-columns: repeat(2, 1fr); }
  .site-title { font-size: 32px; }
  .article-head h1 { font-size: 30px; }
}
@media (max-width: 560px) {
  .post-grid, .related-grid { grid-template-columns: 1fr; }
  .updates-list li { grid-template-columns: 1fr; }
  .footer-index { grid-template-columns: 1fr; }
  .main-nav li a { padding: 8px 10px; }
  .ticker-list a { white-space: normal; }
}

/* =v2 — sharper, tighter, stronger ======================================= */
body { font-size: 16.5px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
h1, h2, h3 { letter-spacing: -.015em; }
.site-title { font-size: 46px; letter-spacing: -.03em; }
.main-nav li a { padding: 11px 16px; }
.post-card { transition: transform .15s ease; }
.post-card:hover { transform: translateY(-2px); }
.post-card .thumb img { transition: transform .3s ease; }
.post-card:hover .thumb img { transform: scale(1.03); }
.section-head h2 { border-left: 4px solid #c00; padding-left: 10px; }
.section-head a::after { content: " \2192"; }
.sidebar { position: sticky; top: 140px; }
.trending { border: 1px solid #111; padding: 16px 18px; margin-bottom: 28px; background: #fafafa; }
.trending h2 { font-size: 16px; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 12px; }
.trending ol { list-style: none; margin: 0; }
.trending li { display: grid; grid-template-columns: 32px 1fr; gap: 10px; padding: 8px 0; border-bottom: 1px solid #eee; font-weight: 700; }
.trending li:last-child { border-bottom: 0; }
.trending .num { color: #c00; font-size: 22px; font-weight: 900; line-height: 1; }
.author-box { border: 1px solid #ddd; padding: 16px 18px; margin: 24px 0; background: #fafafa; }
.author-box h3 { font-size: 15px; text-transform: uppercase; letter-spacing: .06em; }
.reading-time { font-weight: 700; color: #111; }
.back-to-top { display: inline-block; margin-top: 12px; font-size: 13px; font-weight: 800; text-transform: uppercase; }
@media (max-width: 900px) { .sidebar { position: static; } .site-title { font-size: 34px; } }

/* =v2.1 — mobile: compact top, no wasted vertical space ================= */
@media (max-width: 900px) {
  .site-header { position: static; }
  .topbar .container { justify-content: center; min-height: 28px; }
  .topbar-links { display: none; }
  .topbar-date { font-size: 12px; }
  .masthead { padding: 10px 0 6px; }
  .site-title { font-size: 28px; }
  .site-tagline { display: none; }
  .main-nav ul { flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; -webkit-overflow-scrolling: touch; }
  .main-nav li { flex: 0 0 auto; }
  .main-nav li a { padding: 8px 12px; font-size: 12px; }
  .header-search { padding: 6px 0 8px; }
  .header-search input[type="search"] { width: min(300px, 68vw); padding: 7px 9px; }
  .header-search button { padding: 7px 10px; }
  .ticker-label { padding: 8px 10px; }
  .ticker-list a { padding: 8px 12px; font-size: 13px; }
  .content-area { padding: 16px 0 24px; gap: 20px; }
  .hero-main h2 { font-size: 24px; }
  .hero-main .excerpt { font-size: 15px; }
  .section { margin-bottom: 24px; }
  .section-head h2 { font-size: 19px; }
  .article-head h1 { font-size: 26px; }
  .article-head .standfirst { font-size: 16px; }
  .article-body { font-size: 16.5px; }
  .trending { padding: 12px 14px; margin-bottom: 20px; }
}
@media (max-width: 560px) {
  .site-title { font-size: 24px; }
  .hero-main h2 { font-size: 22px; }
  .post-card h3 { font-size: 17px; }
  .updates-list li { padding: 10px 0; }
  .container { padding: 0 12px; }
}
