/*
Theme Name: World Pulse Wire v9
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.6.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; }
}

/* =v2.2 — article presentation gaps closed (wire-service system) ========= */
/* Larger, dominant headline like the big wire portals. */
.article-head h1 { font-size: 44px; line-height: 1.15; }
/* Serif body copy, narrower readable column, blue underlined in-body links. */
.article-body { font-family: Georgia, "Times New Roman", serif; font-size: 19px; line-height: 1.65; max-width: 730px; }
.article-body p { margin-bottom: 1.1em; }
.article-body h2, .article-body h3 { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; font-weight: 900; }
.article-body h2 { font-size: 22px; margin: 1.4em 0 .5em; }
.article-body h3 { font-size: 19px; margin: 1.2em 0 .5em; }
.article-body a { color: #0b5cab; text-decoration: underline; }
/* Author row: circular avatar + name, share labelled on the right. */
.byline-row { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.byline-row .byline { display: flex; align-items: center; gap: 10px; margin: 0; }
.byline-row .byline img { border-radius: 50%; }
.share-label { font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #666; margin-right: 4px; }
/* Key Points restyled: thick rule above, dotted rule below, label prominent. */
.key-points { border: 0; border-top: 4px solid #111; border-bottom: 1px dotted #999; background: #fff; padding: 14px 0 16px; }
.key-points h2 { font-size: 14px; letter-spacing: .1em; }
/* Featured-image caption / credit, small grey, under the image. */
.article-image { max-width: 730px; }
.article-image figcaption, .image-caption { color: #666; font-size: 13px; margin-top: 8px; line-height: 1.45; }
/* Compact sticky header on scroll: masthead + search collapse away, nav stays. */
body.scrolled .masthead, body.scrolled .header-search { display: none; }
body.scrolled .site-header { box-shadow: 0 2px 8px rgba(0,0,0,.12); }
/* Dismissible breaking ticker. */
.ticker-close { background: transparent; border: 0; color: #fff; font-size: 18px; cursor: pointer; padding: 8px 12px; margin-left: auto; }
@media (max-width: 900px) {
  .article-head h1 { font-size: 30px; }
  .article-body { font-size: 18px; }
}

/* =v2.2.1 — Key Points fix: existing articles store Key Points as a plain
   H2 + list inside the body (no .key-points wrapper), so style the body's
   first H2 as the Key Points heading instead. */
.article-body h2:first-of-type { border-top: 4px solid #111; padding-top: 14px; }
.article-body h2:first-of-type + ul { border-bottom: 1px dotted #999; padding-bottom: 16px; margin-bottom: 20px; }

/* =v2.3 — Listen to this article ========================================= */
.listen-box { border: 1px solid #111; padding: 12px 14px; margin: 16px 0 20px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; background: #fafafa; }
.listen-box button { background: #111; color: #fff; border: 1px solid #111; padding: 8px 14px; font-weight: 700; cursor: pointer; }
.listen-box audio { width: 100%; }
.listen-status { font-size: 13px; color: #555; }

/* =v2.5 — responsive ads: every slot fits every screen =================== */
/* No ad may overflow its container on any device. */
.ad-slot { max-width: 100%; overflow: hidden; }
.ad-slot iframe { max-width: 100%; }
.ad-slot > div { max-width: 100%; }
/* Header: desktop shows 728x90, phones show 320x50 instead. */
.ad-header-mobile { display: none; }
@media (max-width: 760px) {
  .ad-header-desktop { display: none; }
  .ad-header-mobile { display: block; }
}