/*
Theme Name:  NeoNews
Theme URI:   https://neonews.site
Author:      NeoNews Editorial
Author URI:  https://neonews.site/about
Description: Beautiful modern US news theme for NeoNews.site — full E-E-A-T signals, Schema.org, Google News compliance, category colour system, reading progress bar.
Version:     1.0.0
License:     GNU General Public License v2
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: neonews
Tags:        news, magazine, responsive, schema, seo, google-news
*/

/* ── Design Tokens ───────────────────────────────── */
:root {
  /* Core palette */
  --void        : #0D1117;
  --void-soft   : #161B27;
  --accent      : #2EA8FF;
  --accent-dark : #1A8FE3;
  --frost       : #F6F8FA;
  --white       : #FFFFFF;
  --ink         : #1C2233;
  --ash         : #5A6476;
  --mist        : #E0E7EF;
  --red         : #EF4444;

  /* Category colours */
  --cat-politics   : #3B82F6;
  --cat-crime      : #EF4444;
  --cat-business   : #10B981;
  --cat-health     : #8B5CF6;
  --cat-technology : #F59E0B;
  --cat-community  : #EC4899;
  --cat-world      : #06B6D4;
  --cat-default    : #2EA8FF;

  /* Typography */
  --f-head  : 'Syne', system-ui, sans-serif;
  --f-body  : 'Source Serif 4', Georgia, serif;
  --f-ui    : 'DM Sans', system-ui, sans-serif;

  /* Spacing & radius */
  --r-sm    : 4px;
  --r-md    : 8px;
  --r-lg    : 12px;
  --sh      : 0 1px 3px rgba(0,0,0,.07), 0 4px 16px rgba(0,0,0,.06);
  --sh-lg   : 0 4px 6px rgba(0,0,0,.05), 0 10px 40px rgba(0,0,0,.1);
  --max     : 1240px;
  --gap     : 28px;
}

/* ── Reset ───────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { scroll-behavior:smooth; font-size:16px }
body { font-family:var(--f-ui); color:var(--ink); background:var(--frost); line-height:1.6; }
img  { max-width:100%; height:auto; display:block }
a    { color:var(--accent); text-decoration:none; transition:color .18s }
a:hover { color:var(--accent-dark); text-decoration:underline }
.container { max-width:var(--max); margin:0 auto; padding:0 20px }

/* ── Accessibility ────────────────────────────────── */
.skip-link { position:absolute; top:-999px; left:0; background:var(--accent); color:#fff; padding:8px 18px; z-index:9999 }
.skip-link:focus { top:0 }
:focus-visible { outline:2px solid var(--accent); outline-offset:3px }

/* ── Reading Progress Bar ─────────────────────────── */
#neo-progress {
  position:fixed; top:0; left:0; height:3px; width:0%;
  background:linear-gradient(90deg, var(--accent), #7C3AED);
  z-index:9998; transition:width .1s linear;
}

/* ── Breaking Ticker ─────────────────────────────── */
.neo-ticker {
  background:var(--red);
  color:#fff;
  font-family:var(--f-ui);
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.05em;
  padding:0;
  overflow:hidden;
  height:32px;
  display:flex;
  align-items:center;
}
.neo-ticker__label {
  background:var(--void);
  padding:0 16px;
  height:100%;
  display:flex;
  align-items:center;
  gap:6px;
  flex-shrink:0;
  font-size:.68rem;
  text-transform:uppercase;
  letter-spacing:.1em;
}
.neo-ticker__label::before {
  content:'';
  width:6px; height:6px;
  border-radius:50%;
  background:var(--red);
  animation:pulse 1.2s ease-in-out infinite;
}
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.5;transform:scale(.8)} }
.neo-ticker__track {
  display:inline-block;
  white-space:nowrap;
  animation:ticker 40s linear infinite;
  padding-left:32px;
}
@keyframes ticker { from{transform:translateX(100vw)} to{transform:translateX(-100%)} }

/* ── Top Bar ─────────────────────────────────────── */
.neo-topbar {
  background:var(--void);
  color:rgba(255,255,255,.55);
  font-family:var(--f-ui);
  font-size:.72rem;
  padding:6px 0;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.neo-topbar .container { display:flex; justify-content:space-between; align-items:center }
.neo-topbar a { color:rgba(255,255,255,.6); margin-left:16px; transition:color .18s }
.neo-topbar a:hover { color:#fff; text-decoration:none }

/* ── Header ──────────────────────────────────────── */
.neo-header {
  background:var(--void);
  padding:0;
  position:sticky;
  top:0;
  z-index:900;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.neo-header__inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  height:64px;
}
.neo-logo a {
  font-family:var(--f-head);
  font-size:1.7rem;
  font-weight:800;
  color:#fff;
  letter-spacing:-.03em;
  display:flex;
  align-items:center;
  gap:2px;
  text-shadow:0 0 30px rgba(46,168,255,.4);
}
.neo-logo a em {
  color:var(--accent);
  font-style:normal;
}
.neo-logo__tag {
  font-family:var(--f-ui);
  font-size:.6rem;
  color:rgba(255,255,255,.35);
  letter-spacing:.12em;
  text-transform:uppercase;
  display:block;
  margin-top:-2px;
}
.neo-nav ul {
  list-style:none;
  display:flex;
  gap:4px;
  align-items:center;
}
.neo-nav a {
  font-family:var(--f-ui);
  font-size:.8rem;
  font-weight:500;
  color:rgba(255,255,255,.65);
  text-transform:uppercase;
  letter-spacing:.07em;
  padding:6px 12px;
  border-radius:var(--r-sm);
  transition:all .18s;
}
.neo-nav a:hover,
.neo-nav .current-menu-item > a {
  color:#fff;
  background:rgba(255,255,255,.08);
  text-decoration:none;
}
.neo-menu-toggle {
  display:none;
  background:rgba(255,255,255,.1);
  border:none;
  color:#fff;
  padding:8px 12px;
  border-radius:var(--r-sm);
  cursor:pointer;
  font-size:1rem;
}

/* ── Category Badges ─────────────────────────────── */
.neo-cat {
  display:inline-block;
  font-family:var(--f-ui);
  font-size:.65rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
  padding:3px 10px;
  border-radius:20px;
  color:#fff;
  background:var(--cat-default);
  margin-bottom:10px;
}
.neo-cat[data-cat="politics"]   { background:var(--cat-politics) }
.neo-cat[data-cat="crime"]      { background:var(--cat-crime) }
.neo-cat[data-cat="business"]   { background:var(--cat-business) }
.neo-cat[data-cat="health"]     { background:var(--cat-health) }
.neo-cat[data-cat="technology"] { background:var(--cat-technology); color:var(--ink) }
.neo-cat[data-cat="community"]  { background:var(--cat-community) }
.neo-cat[data-cat="world"]      { background:var(--cat-world) }

/* ── Post Cards ──────────────────────────────────── */
.neo-card {
  background:var(--white);
  border-radius:var(--r-lg);
  overflow:hidden;
  box-shadow:var(--sh);
  transition:transform .22s ease, box-shadow .22s ease;
  display:flex;
  flex-direction:column;
}
.neo-card:hover {
  transform:translateY(-4px);
  box-shadow:var(--sh-lg);
}
.neo-card__img {
  position:relative;
  overflow:hidden;
}
.neo-card__img img {
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  transition:transform .4s ease;
}
.neo-card:hover .neo-card__img img { transform:scale(1.04) }
.neo-card__body { padding:18px; flex:1; display:flex; flex-direction:column }
.neo-card__title {
  font-family:var(--f-head);
  font-size:1.05rem;
  font-weight:700;
  line-height:1.3;
  margin-bottom:10px;
  flex:1;
}
.neo-card__title a { color:var(--ink) }
.neo-card__title a:hover { color:var(--accent); text-decoration:none }
.neo-card__meta {
  font-family:var(--f-ui);
  font-size:.72rem;
  color:var(--ash);
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:auto;
  padding-top:12px;
  border-top:1px solid var(--mist);
}
.neo-card__excerpt {
  font-size:.88rem;
  color:#4A5568;
  line-height:1.65;
  margin-bottom:12px;
  font-family:var(--f-ui);
}

/* Hero card — bigger */
.neo-hero-main .neo-card__title { font-size:1.65rem; line-height:1.2 }
.neo-hero-main .neo-card__excerpt { font-size:.95rem }

/* ── Section Labels ──────────────────────────────── */
.neo-section-label {
  font-family:var(--f-head);
  font-size:.72rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.15em;
  color:var(--ink);
  display:flex;
  align-items:center;
  gap:12px;
  margin:36px 0 20px;
}
.neo-section-label::after {
  content:'';
  flex:1;
  height:1px;
  background:var(--mist);
}
.neo-section-label span {
  background:var(--accent);
  color:#fff;
  padding:2px 10px;
  border-radius:3px;
}

/* ── Grid Layouts ────────────────────────────────── */
.neo-hero-grid {
  display:grid;
  grid-template-columns:1.6fr 1fr;
  gap:var(--gap);
  padding:var(--gap) 0 0;
}
.neo-side-stack { display:grid; gap:var(--gap); align-content:start }
.neo-news-grid  { display:grid; grid-template-columns:repeat(auto-fill, minmax(280px,1fr)); gap:var(--gap); }

/* ── Content + Sidebar ───────────────────────────── */
.neo-cs-wrap {
  display:grid;
  grid-template-columns:1fr 320px;
  gap:36px;
  padding:28px 0 48px;
  align-items:start;
}

/* ── Sidebar ─────────────────────────────────────── */
.neo-widget {
  background:var(--white);
  border-radius:var(--r-lg);
  padding:22px;
  box-shadow:var(--sh);
  margin-bottom:24px;
}
.neo-widget-title {
  font-family:var(--f-head);
  font-size:.75rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--ink);
  padding-bottom:10px;
  margin-bottom:16px;
  border-bottom:2px solid var(--accent);
  display:flex;
  align-items:center;
  gap:8px;
}

/* ── Article ─────────────────────────────────────── */
.neo-article-header {
  background:var(--void);
  color:#fff;
  padding:48px 0 40px;
  position:relative;
  overflow:hidden;
}
.neo-article-header::before {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(46,168,255,.08) 0%, transparent 60%);
  pointer-events:none;
}
.neo-article-header .container { position:relative }
.neo-article-header .neo-cat { margin-bottom:16px }
.neo-article-title {
  font-family:var(--f-head);
  font-size:2.2rem;
  font-weight:800;
  line-height:1.2;
  color:#fff;
  margin-bottom:16px;
  max-width:800px;
}
.neo-article-meta {
  font-family:var(--f-ui);
  font-size:.78rem;
  color:rgba(255,255,255,.55);
  display:flex;
  gap:20px;
  flex-wrap:wrap;
}
.neo-article-meta strong { color:rgba(255,255,255,.85) }
.neo-article-feat {
  width:100%;
  max-height:500px;
  object-fit:cover;
  border-radius:var(--r-lg) var(--r-lg) 0 0;
  display:block;
}
.neo-article-body {
  font-family:var(--f-body);
  font-size:1.05rem;
  line-height:1.88;
  color:#2D3748;
  max-width:720px;
}
.neo-article-body h2 {
  font-family:var(--f-head);
  font-size:1.4rem;
  font-weight:700;
  color:var(--ink);
  margin:1.8em 0 .6em;
}
.neo-article-body h3 {
  font-family:var(--f-head);
  font-size:1.15rem;
  font-weight:700;
  color:var(--ink);
  margin:1.4em 0 .5em;
}
.neo-article-body p { margin-bottom:1.3em }
.neo-article-body blockquote {
  border-left:4px solid var(--accent);
  padding:16px 24px;
  margin:28px 0;
  background:rgba(46,168,255,.04);
  border-radius:0 var(--r-md) var(--r-md) 0;
  font-style:italic;
  color:#4A5568;
}
.neo-article-body ul,.neo-article-body ol {
  padding-left:28px;
  margin-bottom:1.3em;
}
.neo-article-body li { margin-bottom:.5em }
.neo-img-caption {
  font-family:var(--f-ui);
  font-size:.75rem;
  color:var(--ash);
  font-style:italic;
  margin:8px 0 24px;
  text-align:center;
}

/* ── Author Box ──────────────────────────────────── */
.neo-author-box {
  display:flex;
  gap:20px;
  align-items:flex-start;
  background:var(--white);
  border-radius:var(--r-lg);
  padding:24px;
  box-shadow:var(--sh);
  margin:32px 0;
  border-top:3px solid var(--accent);
}
.neo-author-box img {
  width:72px;
  height:72px;
  border-radius:50%;
  object-fit:cover;
  flex-shrink:0;
  border:3px solid var(--mist);
}
.neo-author-name {
  font-family:var(--f-head);
  font-weight:700;
  font-size:1rem;
  color:var(--ink);
}
.neo-author-role {
  font-family:var(--f-ui);
  font-size:.7rem;
  color:var(--accent);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  margin:3px 0 8px;
}
.neo-author-bio {
  font-size:.9rem;
  color:var(--ash);
  line-height:1.65;
  font-family:var(--f-ui);
}

/* ── Tags ────────────────────────────────────────── */
.neo-tags { margin-top:24px; display:flex; flex-wrap:wrap; gap:8px }
.neo-tags a {
  font-family:var(--f-ui);
  font-size:.72rem;
  padding:5px 12px;
  background:var(--frost);
  color:var(--ash);
  border-radius:20px;
  border:1px solid var(--mist);
  transition:all .18s;
}
.neo-tags a:hover {
  background:var(--accent);
  color:#fff;
  border-color:var(--accent);
  text-decoration:none;
}

/* ── Breadcrumbs ─────────────────────────────────── */
.neo-breadcrumbs {
  font-family:var(--f-ui);
  font-size:.73rem;
  color:var(--ash);
  padding:12px 0;
  border-bottom:1px solid var(--mist);
  margin-bottom:24px;
}
.neo-breadcrumbs a { color:var(--ash) }
.neo-breadcrumbs a:hover { color:var(--accent) }
.neo-breadcrumbs span + span::before { content:' / '; margin:0 6px; opacity:.4 }

/* ── Pages ───────────────────────────────────────── */
.neo-page-header {
  background:var(--void);
  padding:40px 0;
  margin-bottom:32px;
}
.neo-page-title {
  font-family:var(--f-head);
  font-size:2rem;
  font-weight:800;
  color:#fff;
  letter-spacing:-.02em;
}
.neo-page-body { max-width:800px; font-family:var(--f-ui) }
.neo-page-body h2 {
  font-family:var(--f-head);
  font-size:1.3rem;
  font-weight:700;
  color:var(--ink);
  margin:1.8em 0 .6em;
}
.neo-page-body p,.neo-page-body li { font-size:1rem; line-height:1.8; margin-bottom:1em; color:#374151 }
.neo-page-body ul,.neo-page-body ol { padding-left:24px; margin-bottom:1em }

/* ── Contact ─────────────────────────────────────── */
.neo-contact-grid { display:grid; grid-template-columns:2fr 1fr; gap:40px; max-width:900px }
.neo-form-group { margin-bottom:18px }
.neo-form-group label {
  display:block;
  font-family:var(--f-ui);
  font-size:.8rem;
  font-weight:600;
  margin-bottom:6px;
  color:var(--ink);
}
input,textarea,select {
  width:100%;
  padding:11px 14px;
  border:1.5px solid var(--mist);
  border-radius:var(--r-md);
  font-family:var(--f-ui);
  font-size:.95rem;
  color:var(--ink);
  background:#fff;
  transition:border-color .18s;
}
input:focus,textarea:focus,select:focus { outline:none; border-color:var(--accent) }
textarea { resize:vertical; min-height:130px }
.neo-btn {
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:var(--accent);
  color:#fff;
  padding:12px 28px;
  border:none;
  border-radius:var(--r-md);
  font-family:var(--f-ui);
  font-size:.88rem;
  font-weight:700;
  cursor:pointer;
  transition:background .18s, transform .18s;
  text-decoration:none;
  letter-spacing:.02em;
}
.neo-btn:hover { background:var(--accent-dark); color:#fff; text-decoration:none; transform:translateY(-1px) }
.neo-btn-dark { background:var(--void) }
.neo-btn-dark:hover { background:var(--void-soft) }
.neo-alert { padding:12px 16px; border-radius:var(--r-md); font-size:.88rem; font-family:var(--f-ui); margin-bottom:16px }
.neo-alert.ok  { background:#ECFDF5; border-left:4px solid #10B981; color:#064E3B }
.neo-alert.err { background:#FEF2F2; border-left:4px solid #EF4444; color:#7F1D1D }

/* ── Pagination ──────────────────────────────────── */
.neo-pagination {
  display:flex;
  gap:6px;
  justify-content:center;
  padding:32px 0;
  flex-wrap:wrap;
}
.neo-pagination a,.neo-pagination span {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:40px;
  height:40px;
  padding:0 12px;
  border-radius:var(--r-md);
  font-family:var(--f-ui);
  font-size:.83rem;
  font-weight:600;
  background:var(--white);
  color:var(--ink);
  border:1px solid var(--mist);
  box-shadow:var(--sh);
  transition:all .18s;
}
.neo-pagination .current,.neo-pagination a:hover {
  background:var(--accent);
  color:#fff;
  border-color:var(--accent);
  text-decoration:none;
}

/* ── Footer ──────────────────────────────────────── */
.neo-footer {
  background:var(--void);
  color:rgba(255,255,255,.6);
  padding:56px 0 0;
  margin-top:56px;
}
.neo-footer-grid {
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:40px;
  margin-bottom:48px;
}
.neo-footer-logo a {
  font-family:var(--f-head);
  font-size:1.6rem;
  font-weight:800;
  color:#fff;
  letter-spacing:-.02em;
}
.neo-footer-logo a em { color:var(--accent); font-style:normal }
.neo-footer-desc { font-size:.85rem; margin-top:12px; line-height:1.7; font-family:var(--f-ui) }
.neo-footer-head {
  font-family:var(--f-ui);
  font-size:.68rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.15em;
  color:rgba(255,255,255,.4);
  margin-bottom:16px;
  padding-bottom:8px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.neo-footer-links ul { list-style:none }
.neo-footer-links li { margin-bottom:8px }
.neo-footer-links a { color:rgba(255,255,255,.6); font-size:.85rem; font-family:var(--f-ui); transition:color .18s }
.neo-footer-links a:hover { color:#fff; text-decoration:none }
.neo-footer-bottom {
  border-top:1px solid rgba(255,255,255,.07);
  padding:18px 0;
}
.neo-footer-bottom .container {
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  font-size:.75rem;
  font-family:var(--f-ui);
}
.neo-footer-bottom a { color:rgba(255,255,255,.45) }
.neo-footer-bottom a:hover { color:#fff; text-decoration:none }
.neo-footer-legal { display:flex; gap:20px }

/* ── 404 ─────────────────────────────────────────── */
.neo-404 {
  text-align:center;
  padding:100px 0;
}
.neo-404__code {
  font-family:var(--f-head);
  font-size:8rem;
  font-weight:800;
  background:linear-gradient(135deg, var(--accent), #7C3AED);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  line-height:1;
  margin-bottom:16px;
}
.neo-404 h2 {
  font-family:var(--f-head);
  font-size:1.5rem;
  color:var(--ink);
  margin-bottom:24px;
}

/* ── Source credit ───────────────────────────────── */
.neo-source {
  font-family:var(--f-ui);
  font-size:.8em;
  color:var(--ash);
  border-top:1px solid var(--mist);
  padding-top:.8em;
  margin-top:1.5em;
}

/* ── Search form ─────────────────────────────────── */
.neo-search-form {
  display:flex;
  gap:8px;
}
.neo-search-form input { flex:1 }
.neo-search-form button { flex-shrink:0; padding:11px 20px }

/* ── Responsive ──────────────────────────────────── */
@media (max-width:1024px) {
  .neo-hero-grid { grid-template-columns:1fr }
  .neo-cs-wrap   { grid-template-columns:1fr }
  .neo-footer-grid { grid-template-columns:1fr 1fr }
  .neo-contact-grid { grid-template-columns:1fr }
}
@media (max-width:640px) {
  .neo-header__inner { height:56px }
  .neo-logo a { font-size:1.4rem }
  .neo-nav { display:none; position:absolute; top:100%; left:0; right:0; background:var(--void); padding:12px 20px; border-top:1px solid rgba(255,255,255,.07) }
  .neo-nav.active { display:block }
  .neo-nav ul { flex-direction:column; gap:4px }
  .neo-nav a { display:block; padding:10px 12px }
  .neo-menu-toggle { display:block }
  .neo-article-title { font-size:1.5rem }
  .neo-footer-grid { grid-template-columns:1fr }
  .neo-footer-bottom .container { flex-direction:column; align-items:flex-start }
  .neo-article-header { padding:28px 0 24px }
}
@media (prefers-reduced-motion:reduce) {
  .neo-ticker__track { animation:none }
  *,.neo-card { transition:none !important }
  .neo-ticker__label::before { animation:none }
}
