/*
Theme Name: Techmeme
Theme URI: https://example.com
Author: Your Name
Author URI: https://example.com
Description: A wire-service style theme for AI and tech news sites, built with an editorial masthead, breaking-headline ticker, and category grids for AI and News. Includes templates for About, Disclaimer, and Contact.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: bytewire
*/

:root{
  --paper:#F6F4EF;
  --paper-dim:#EDEAE1;
  --ink:#191A1E;
  --ink-soft:#4B4E56;
  --rule:#D8D3C6;
  --signal:#2B4CFF;
  --alert:#D6402C;
  --wire:#1F7A5C;
  --max:1160px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Source Serif 4', Georgia, serif;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
::selection{background:var(--signal); color:#fff;}

h1,h2,h3,.display{
  font-family:'Archivo Narrow', sans-serif;
  letter-spacing:-0.01em;
  line-height:1.05;
  text-transform:uppercase;
}
.mono{
  font-family:'JetBrains Mono', monospace;
  letter-spacing:0.02em;
}

.wrap{max-width:var(--max); margin:0 auto; padding:0 24px;}

/* ===== Masthead ===== */
.masthead-bar{
  background:var(--ink);
  color:var(--paper);
  font-family:'JetBrains Mono', monospace;
  font-size:11px;
  letter-spacing:0.08em;
}
.masthead-bar .wrap{
  display:flex; justify-content:space-between; align-items:center;
  padding-top:8px; padding-bottom:8px;
  flex-wrap:wrap; gap:6px;
}
.masthead-bar .live-dot{
  display:inline-block; width:6px; height:6px; border-radius:50%;
  background:var(--alert); margin-right:6px;
  animation:pulse 1.6s infinite;
}
@keyframes pulse{
  0%,100%{opacity:1;} 50%{opacity:0.35;}
}

header.site-header{
  border-bottom:3px solid var(--ink);
  background:var(--paper);
  position:sticky; top:0; z-index:50;
}
.nameplate{
  display:flex; justify-content:space-between; align-items:flex-end;
  padding:22px 0 16px;
  flex-wrap:wrap; gap:10px;
}
.nameplate .brand{
  font-size:clamp(34px, 6vw, 56px);
  font-weight:800;
}
.nameplate .brand span{color:var(--signal);}
.nameplate .brand img{max-height:56px;}
.nameplate .sub{
  font-family:'JetBrains Mono', monospace;
  font-size:11px;
  color:var(--ink-soft);
  text-align:right;
  line-height:1.5;
}

nav.categories{
  border-top:1px solid var(--rule);
  background:var(--paper);
}
nav.categories ul{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:2px;
}
nav.categories li{position:relative;}
nav.categories a{
  display:block;
  font-family:'Archivo Narrow', sans-serif;
  font-weight:700;
  font-size:14px;
  letter-spacing:0.04em;
  text-transform:uppercase;
  padding:13px 18px;
  border-right:1px solid var(--rule);
  transition:background 0.15s ease, color 0.15s ease;
}
nav.categories li:first-child a{padding-left:0;}
nav.categories a:hover, nav.categories a:focus-visible{
  background:var(--ink); color:var(--paper);
  outline:none;
}
nav.categories a:focus-visible{outline:2px solid var(--signal); outline-offset:-2px;}
nav.categories .current-menu-item > a,
nav.categories .current_page_item > a{
  background:var(--signal); color:#fff;
}

/* ===== Ticker (signature element) ===== */
.ticker{
  background:var(--signal);
  color:#fff;
  overflow:hidden;
  white-space:nowrap;
  border-bottom:3px solid var(--ink);
}
.ticker-inner{
  display:inline-flex;
  align-items:center;
  padding:9px 0;
  animation:scroll-left 32s linear infinite;
}
.ticker:hover .ticker-inner{animation-play-state:paused;}
.ticker-tag{
  font-family:'JetBrains Mono', monospace;
  font-weight:600;
  font-size:11px;
  background:var(--ink);
  padding:3px 8px;
  margin-right:10px;
  border-radius:2px;
}
.ticker-item{
  font-family:'JetBrains Mono', monospace;
  font-size:13px;
  margin-right:48px;
  display:inline-flex;
  align-items:center;
}
@keyframes scroll-left{
  0%{transform:translateX(0);}
  100%{transform:translateX(-50%);}
}
@media (prefers-reduced-motion: reduce){
  .ticker-inner{animation:none;}
  .masthead-bar .live-dot{animation:none;}
}

section, .content-section{padding:56px 0;}
section + section, .content-section + .content-section{border-top:1px solid var(--rule);}

.section-label{
  display:flex; align-items:center; gap:12px;
  margin-bottom:28px;
}
.section-label .num{
  font-family:'JetBrains Mono', monospace;
  font-size:12px;
  color:var(--ink-soft);
}
.section-label h2{font-size:26px;}
.section-label .rule{flex:1; height:1px; background:var(--rule);}

/* ===== Hero / Home ===== */
.hero{
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:40px;
  align-items:start;
}
.hero-lead .kicker{
  font-family:'JetBrains Mono', monospace;
  font-size:12px; font-weight:600;
  color:var(--alert);
  display:block; margin-bottom:10px;
}
.hero-lead h1{
  font-size:clamp(30px, 4.5vw, 48px);
  margin-bottom:16px;
  text-transform:none;
}
.hero-lead h1 a:hover{color:var(--signal);}
.hero-lead p{
  font-size:18px; color:var(--ink-soft); max-width:52ch;
}
.hero-lead .byline{
  margin-top:18px;
  font-family:'JetBrains Mono', monospace;
  font-size:12px;
  color:var(--ink-soft);
}
.hero-side{
  border-left:1px solid var(--rule);
  padding-left:32px;
  display:flex; flex-direction:column; gap:20px;
}
.hero-side h3{
  font-size:12px; color:var(--ink-soft); font-weight:600; letter-spacing:0.1em;
}
.side-item{padding-bottom:16px; border-bottom:1px solid var(--rule);}
.side-item:last-child{border-bottom:none; padding-bottom:0;}
.side-item a{font-family:'Archivo Narrow', sans-serif; font-weight:700; font-size:16px; text-transform:none;}
.side-item a:hover{color:var(--signal);}
.side-item .meta{font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--ink-soft); display:block; margin-top:4px;}

/* ===== Card grid ===== */
.grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:28px;
}
.grid.grid-2{grid-template-columns:repeat(2, 1fr);}
.card{
  display:flex; flex-direction:column;
  gap:10px;
}
.card .thumb{
  width:100%; aspect-ratio:16/10; object-fit:cover;
  border:1px solid var(--ink); margin-bottom:4px;
}
.card .tag{
  display:inline-block;
  font-family:'JetBrains Mono', monospace;
  font-size:10px; font-weight:600;
  text-transform:uppercase; letter-spacing:0.06em;
  padding:3px 8px;
  border:1px solid var(--ink);
  width:fit-content;
}
.tag.ai{border-color:var(--signal); color:var(--signal);}
.tag.news{border-color:var(--wire); color:var(--wire);}
.tag.cat-default{border-color:var(--ink-soft); color:var(--ink-soft);}
.card h3{
  font-size:19px;
  text-transform:none;
  font-weight:700;
}
.card h3 a:hover{color:var(--signal);}
.card p{font-size:15px; color:var(--ink-soft);}
.card .meta{font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--ink-soft);}

.empty-note{color:var(--ink-soft); font-family:'JetBrains Mono', monospace; font-size:13px;}

/* ===== Prose / pages ===== */
.prose{max-width:70ch;}
.prose h1{font-size:30px; margin-bottom:18px; text-transform:none;}
.prose h2{font-size:26px; margin:28px 0 14px;}
.prose p, .prose li{margin-bottom:14px; color:var(--ink-soft); font-size:16px;}
.prose strong{color:var(--ink);}
.prose a{color:var(--signal); text-decoration:underline;}
.prose ul, .prose ol{padding-left:22px;}

.panel{
  background:var(--paper-dim);
  border:1px solid var(--rule);
  padding:24px;
}
.disclaimer-panel{border-left:4px solid var(--alert);}

/* ===== Contact form ===== */
form.contact-form{
  display:grid; gap:14px; max-width:520px; margin-top:20px;
}
form.contact-form label{
  font-family:'JetBrains Mono', monospace;
  font-size:11px; text-transform:uppercase; letter-spacing:0.05em;
  color:var(--ink-soft); display:block; margin-bottom:6px;
}
form.contact-form input, form.contact-form textarea{
  width:100%;
  font-family:'Source Serif 4', serif;
  font-size:15px;
  padding:11px 12px;
  border:1px solid var(--ink);
  background:var(--paper);
  color:var(--ink);
}
form.contact-form input:focus, form.contact-form textarea:focus{
  outline:2px solid var(--signal); outline-offset:1px;
}
form.contact-form textarea{resize:vertical; min-height:110px;}
.btn{
  font-family:'Archivo Narrow', sans-serif;
  font-weight:700; text-transform:uppercase; letter-spacing:0.04em;
  background:var(--ink); color:var(--paper);
  border:none; padding:13px 22px;
  width:fit-content; cursor:pointer;
  transition:background 0.15s ease;
}
.btn:hover{background:var(--signal);}

.contact-meta{margin-top:28px; font-family:'JetBrains Mono', monospace; font-size:13px; color:var(--ink-soft);}
.contact-meta a{color:var(--signal); text-decoration:underline;}

/* ===== Single post ===== */
.single-post header.entry-header{margin-bottom:24px;}
.single-post .entry-title{font-size:clamp(28px,4vw,42px); text-transform:none; margin-bottom:12px;}
.single-post .entry-meta{font-family:'JetBrains Mono', monospace; font-size:12px; color:var(--ink-soft); margin-bottom:20px;}
.single-post .entry-thumb{margin-bottom:24px; border:1px solid var(--ink);}
.single-post .entry-content{max-width:70ch; font-size:17px;}
.single-post .entry-content p{margin-bottom:16px;}
.single-post .entry-content h2, .single-post .entry-content h3{text-transform:none; margin:28px 0 12px;}
.single-post .entry-content a{color:var(--signal); text-decoration:underline;}
.single-post .entry-content blockquote{border-left:3px solid var(--signal); padding-left:16px; color:var(--ink-soft); font-style:italic; margin:16px 0;}
.single-post .entry-content img{border:1px solid var(--ink); margin:16px 0;}

/* ===== Pagination ===== */
.pagination{
  display:flex; gap:10px; margin-top:36px;
  font-family:'JetBrains Mono', monospace; font-size:13px;
}
.pagination a, .pagination span{
  padding:8px 14px; border:1px solid var(--ink);
}
.pagination a:hover{background:var(--ink); color:var(--paper);}
.pagination .current{background:var(--ink); color:var(--paper);}

footer.site-footer{
  background:var(--ink);
  color:var(--paper-dim);
  padding:30px 0;
  font-family:'JetBrains Mono', monospace;
  font-size:12px;
}
footer.site-footer .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}
footer.site-footer a:hover{color:var(--signal);}
footer.site-footer ul{list-style:none; display:flex; gap:16px; flex-wrap:wrap;}

@media (max-width: 860px){
  .hero{grid-template-columns:1fr;}
  .hero-side{border-left:none; padding-left:0; border-top:1px solid var(--rule); padding-top:20px;}
  .grid{grid-template-columns:1fr 1fr;}
  nav.categories ul{gap:0;}
  nav.categories a{padding:12px 12px; font-size:13px;}
}
@media (max-width: 560px){
  .grid, .grid.grid-2{grid-template-columns:1fr;}
  .nameplate{flex-direction:column; align-items:flex-start;}
  .nameplate .sub{text-align:left;}
}
