/* ============================================
   MSFT NEWS NOW — UNIFIED EDITORIAL THEME v2
   (Xbox Wire structure + Official MS Blog / Windows Blog palette)
   ============================================ */

:root {
  --bg:       #F3F4F6;
  --surface:  #FFFFFF;
  --ink:      #111827;
  --ink-2:    #4B5563;
  --ink-3:    #6B7280;
  --border:   #E1E4E8;
  --accent:       #0067B8;
  --accent-hover: #005A9E;
  --navy:     #0F172A;

  --sans: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --mono: "Consolas", "SFMono-Regular", ui-monospace, monospace;

  /* per-topic dots */
  --c-windows: #0067B8;
  --c-xbox:    #107C10;
  --c-copilot: #6D28D9;
  --c-m365:    #D83B01;
  --c-azure:   #0078D4;
}

body {
  background: var(--bg);
  color: var(--ink-2);
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
}

a { color: var(--accent); text-decoration: none; transition: color .2s ease; }
a:hover { color: var(--accent-hover); }
::selection { background: var(--accent); color: #fff; }

h1, h2, h3, h4, h5, h6,
.entry-title, .entry-title a {
  color: var(--ink);
  font-family: var(--sans);
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.15;
}

.entry-title { font-size: clamp(26px, 3vw, 42px); }
.single .entry-title { font-size: clamp(30px, 3.8vw, 52px); }

/* ---- header (clean/white, not frosted-dark) ---- */
.site-header,
.main-navigation {
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}

.main-navigation .main-nav ul li a {
  font-family: var(--sans);
  font-size: 15px;
  font-weight: 500;
  color: var(--ink);
}
.main-navigation .main-nav ul li a:hover { color: var(--accent); }
.site-logo img { height: 30px; }

/* ---- eyebrow / meta labels (the only mono usage now) ---- */
.entry-meta, .entry-meta a,
.posted-on, .byline,
.eyebrow-label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-3);
}
.byline a { color: var(--accent); font-family: var(--sans); text-transform: none; letter-spacing: normal; }

/* ---- category pill tags (kept, restyled) ---- */
.cat-links a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border: 1px solid var(--border);
  border-radius: 999px;
  margin-right: 6px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink);
  transition: border-color .2s, background .2s;
}
.cat-links a:hover { border-color: var(--accent); background: #EEF4FA; }

/* ---- buttons: soft rectangle, not full pill (Windows Blog style) ---- */
.button, button, input[type="submit"],
.wp-block-button__link, .gb-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 22px;
  border-radius: 6px;
  border: none;
  background: var(--navy);
  color: #fff !important;
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 600;
  transition: background .2s ease, transform .15s ease;
}
.button:hover, button:hover, input[type="submit"]:hover,
.wp-block-button__link:hover {
  background: var(--accent);
  transform: translateY(-1px);
}

/* ---- search field ---- */
.search-field, input[type="search"] {
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 10px 16px;
  background: #fff;
  color: var(--ink);
}

/* ---- post cards / archive grid ---- */
article.post, .post {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  transition: box-shadow .25s ease, transform .25s ease;
}
article.post:hover, .post:hover {
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
  transform: translateY(-2px);
}
.post .post-image img, .post-thumbnail img {
  aspect-ratio: 16 / 9;
  object-fit: cover;
  transition: transform .7s cubic-bezier(.22,.61,.16,1);
}
.post:hover .post-thumbnail img { transform: scale(1.04); }

/* ---- content area ---- */
.entry-content {
  color: var(--ink-2);
  font-size: clamp(16px, 1vw, 18px);
  line-height: 1.65;
}
.entry-content a { border-bottom: 1px solid rgba(0,103,184,0.3); }

/* ---- pagination ---- */
.pagination a, .page-numbers {
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.06em;
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 8px 14px;
}
.pagination a:hover, .page-numbers.current {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}

/* ---- footer (dark navy band, matches earlier proposal) ---- */
.site-footer, footer.site-footer {
  background: var(--navy);
  color: #94A3B8;
  padding: 48px 20px 24px;
}
.site-footer a { color: #F1F5F9; }
.site-footer a:hover { color: var(--accent-hover); }
.site-footer .widget-title, .site-footer h2, .site-footer h3 {
  font-family: var(--mono);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #94A3B8;
  margin-bottom: 12px;
}
.site-footer .copyright {
  max-width: 1240px;
  margin: 32px auto 0;
  padding-top: 16px;
  border-top: 1px solid #1E293B;
  font-size: 12px;
  color: #64748B;
}

hr { border: 0; border-top: 1px solid var(--border); }