/*
Theme Name: WireCore
Description: Shared theme for the prediction-markets publications. One codebase, two site profiles (wire | desk), switched by the WIRECORE_SITE constant. Schema-complete, AEO-native, fast.
Version: 0.3.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: wirecore
*/

/* ---------------------------------------------------------------------------
   Design direction — light, high-contrast, heavy display type.

   Measured from the three references Alex picked:
     Sherwood     ABC Rom 900, UPPERCASE, -1.44px tracking, leading TIGHTER
                  than the type size (31px on 36px). Pure black on white.
                  Monospace for the news rail. No decorative colour at all.
     Kalshi News  Custom condensed grotesque, green accent, live market
                  ticker strip pinned under the nav.
     PredictionNews  Clash Display 600 at 48px, royal blue, hairline rules.

   The throughline: white page, sans-serif everything, one heavy grotesque
   doing all the work, colour reserved for data rather than decoration.
   --------------------------------------------------------------------------- */

@import url('https://fonts.googleapis.com/css2?family=Archivo:opsz,wght@8..144,400;8..144,500;8..144,600;8..144,700;8..144,800;8..144,900&family=Archivo+Narrow:wght@500;600;700&family=JetBrains+Mono:wght@400;600&display=swap');

:root {
  --wc-max: 42rem;
  --wc-max-wide: 78rem;

  /* Near-black rather than pure black: holds up better across displays and
     stops large headline masses from vibrating. */
  --wc-ink: #0b0b0c;
  --wc-ink-soft: #5c5f66;
  --wc-ink-faint: #8b8f97;
  --wc-bg: #ffffff;
  --wc-bg-soft: #f6f6f4;
  --wc-rule: #e3e3e0;
  --wc-rule-hard: #0b0b0c;

  --wc-accent: #1338c4;
  --wc-accent-ink: #ffffff;

  /* Functional only — market direction, case posture, verification state.
     Never decorative. */
  --wc-up: #0a7d4b;
  --wc-down: #c0392b;
  --wc-warn: #a8620a;

  --wc-display: 'Archivo', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
  --wc-cond: 'Archivo Narrow', 'Archivo', sans-serif;
  --wc-text: 'Archivo', -apple-system, BlinkMacSystemFont, sans-serif;
  --wc-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* The desk is the same skeleton in a warmer register — softer paper, warm
   accent — so the two brands never read as the same publication. */
[data-site="desk"] {
  --wc-bg-soft: #faf7f2;
  --wc-accent: #c2410c;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--wc-bg);
  color: var(--wc-ink);
  font-family: var(--wc-text);
  font-size: 1.0625rem;
  line-height: 1.6;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
}

img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-underline-offset: 0.18em; text-decoration-thickness: 1px; }
p { margin: 0 0 1.1em; text-wrap: pretty; }

/* ---------------------------------------------------------------------------
   Display type — the whole personality lives here.
   Heavy weight, negative tracking, leading pulled under 1.0 on the big sizes.
   --------------------------------------------------------------------------- */

h1, h2, h3, h4 { font-family: var(--wc-display); margin: 0; text-wrap: balance; }

.wc-display {
  font-weight: 900;
  font-size: clamp(2.25rem, 1.3rem + 4.2vw, 4rem);
  line-height: 0.94;
  letter-spacing: -0.035em;
  text-transform: uppercase;
}

h1 {
  font-weight: 800;
  font-size: clamp(1.9rem, 1.25rem + 2.9vw, 3.05rem);
  line-height: 1.02;
  letter-spacing: -0.032em;
  margin-bottom: 0.5rem;
}

h2 {
  font-weight: 800;
  font-size: clamp(1.35rem, 1.15rem + 0.9vw, 1.7rem);
  line-height: 1.1;
  letter-spacing: -0.022em;
  margin: 2.4rem 0 0.7rem;
}

h3 {
  font-weight: 700;
  font-size: 1.1rem;
  line-height: 1.2;
  letter-spacing: -0.015em;
  margin: 1.9rem 0 0.5rem;
}

/* ---------------------------------------------------------------------------
   Layout
   --------------------------------------------------------------------------- */

.wc-shell { width: min(100% - 2.5rem, var(--wc-max-wide)); margin-inline: auto; }
.wc-measure { width: min(100%, var(--wc-max)); }

/* ---------------------------------------------------------------------------
   Masthead + ticker
   The ticker is Kalshi's best functional idea: live numbers pinned under the
   nav, so the publication looks alive before you read a word.
   --------------------------------------------------------------------------- */

.wc-masthead { border-bottom: 2px solid var(--wc-rule-hard); }
.wc-masthead__row {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 1.5rem; padding: 1.1rem 0 0.9rem;
}
.wc-masthead__brand {
  font-family: var(--wc-display); font-weight: 900; font-size: 1.5rem;
  letter-spacing: -0.045em; text-transform: uppercase; text-decoration: none;
  line-height: 1;
}
.wc-masthead__tag {
  font-family: var(--wc-cond); font-size: 0.7rem; font-weight: 600;
  letter-spacing: 0.11em; text-transform: uppercase; color: var(--wc-ink-faint);
  margin-top: 0.3rem;
}

.wc-nav { display: flex; flex-wrap: wrap; gap: 1.15rem; font-family: var(--wc-cond); font-size: 0.9rem; font-weight: 600; }
.wc-nav a { color: var(--wc-ink); text-decoration: none; }
.wc-nav a:hover { text-decoration: underline; }
.wc-nav a[aria-current] { text-decoration: underline; text-decoration-thickness: 2px; }

.wc-ticker {
  border-bottom: 1px solid var(--wc-rule);
  overflow: hidden; background: var(--wc-bg-soft);
}
.wc-ticker__track {
  display: flex; gap: 2.25rem; padding: 0.5rem 0;
  font-family: var(--wc-mono); font-size: 0.78rem; white-space: nowrap;
}
.wc-ticker__item { display: inline-flex; align-items: baseline; gap: 0.5rem; }
.wc-ticker__label { color: var(--wc-ink-soft); }
.wc-ticker__val { font-weight: 600; }
.wc-ticker__val.up { color: var(--wc-up); }
.wc-ticker__val.down { color: var(--wc-down); }

/* ---------------------------------------------------------------------------
   Article furniture
   --------------------------------------------------------------------------- */

.wc-eyebrow {
  font-family: var(--wc-cond); font-size: 0.72rem; font-weight: 700;
  letter-spacing: 0.13em; text-transform: uppercase; color: var(--wc-ink);
  margin: 0 0 0.55rem;
}
.wc-eyebrow--accent { color: var(--wc-accent); }

.wc-dek {
  font-size: 1.15rem; line-height: 1.45; color: var(--wc-ink-soft);
  letter-spacing: -0.011em; margin: 0 0 1.1rem;
}

.wc-byline {
  font-family: var(--wc-cond); font-size: 0.85rem; color: var(--wc-ink-soft);
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.45rem 0.7rem;
  padding: 0.7rem 0; border-top: 1px solid var(--wc-rule);
  border-bottom: 1px solid var(--wc-rule); margin-bottom: 1.6rem;
}
.wc-byline__author { color: var(--wc-ink); font-weight: 700; }
.wc-byline__sep { color: var(--wc-rule); }

.wc-verified {
  display: inline-flex; align-items: center; gap: 0.35rem;
  font-family: var(--wc-mono); font-size: 0.72rem; color: var(--wc-ink-soft);
}
.wc-verified::before {
  content: ""; width: 0.45rem; height: 0.45rem; border-radius: 50%;
  background: var(--wc-up); flex: none;
}
.wc-verified[data-stale="1"]::before { background: var(--wc-warn); }

/* "Why this matters" — Prediction News leads with this and it earns the space.
   Hard rule above, not a tinted box. */
.wc-why { border-top: 2px solid var(--wc-rule-hard); padding-top: 0.9rem; margin: 1.6rem 0; }
.wc-why__h {
  font-family: var(--wc-cond); font-size: 0.72rem; font-weight: 700;
  letter-spacing: 0.13em; text-transform: uppercase; margin: 0 0 0.45rem;
}
.wc-why p { margin: 0; font-size: 1rem; line-height: 1.55; }

/* Answer-first block — the module that wins operational SERPs. */
.wc-answer {
  font-size: 1.15rem; line-height: 1.5; letter-spacing: -0.01em;
  border-left: 4px solid var(--wc-ink); padding-left: 1.15rem; margin: 0 0 1.9rem;
}
.wc-answer p:last-child { margin-bottom: 0; }

/* ---------------------------------------------------------------------------
   Key facts — checkable numbers beat word count
   --------------------------------------------------------------------------- */

.wc-facts {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
  border-top: 2px solid var(--wc-rule-hard); border-bottom: 2px solid var(--wc-rule-hard);
  margin: 2rem 0;
}
.wc-facts__cell { padding: 0.85rem 1rem 0.9rem 0; border-right: 1px solid var(--wc-rule); }
.wc-facts__cell:last-child { border-right: 0; }
.wc-facts__k {
  font-family: var(--wc-cond); font-size: 0.68rem; font-weight: 600;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--wc-ink-faint);
  margin-bottom: 0.25rem;
}
.wc-facts__v { font-family: var(--wc-display); font-size: 1.25rem; font-weight: 800; letter-spacing: -0.02em; }

/* ---------------------------------------------------------------------------
   Steps
   --------------------------------------------------------------------------- */

.wc-steps { counter-reset: wcstep; list-style: none; padding: 0; margin: 1.7rem 0; }
.wc-steps__item { counter-increment: wcstep; position: relative; padding: 0 0 1.5rem 2.9rem; }
.wc-steps__item::before {
  content: counter(wcstep); position: absolute; left: 0; top: -0.1rem;
  width: 1.85rem; height: 1.85rem;
  border: 2px solid var(--wc-ink); border-radius: 50%;
  font-family: var(--wc-display); font-size: 0.85rem; font-weight: 800;
  display: grid; place-items: center;
}
.wc-steps__title { font-family: var(--wc-display); font-weight: 700; font-size: 1.02rem; margin: 0 0 0.3rem; letter-spacing: -0.015em; }
.wc-steps figure { margin: 0.8rem 0 0; }
.wc-steps figcaption { font-family: var(--wc-cond); font-size: 0.78rem; color: var(--wc-ink-faint); margin-top: 0.35rem; }
.wc-shot { border: 1px solid var(--wc-rule-hard); }

/* Error branch — the surface nobody covers */
.wc-branch { border: 2px solid var(--wc-rule-hard); padding: 1.15rem 1.3rem; margin: 1.9rem 0; }
.wc-branch__h {
  font-family: var(--wc-cond); font-size: 0.72rem; font-weight: 700;
  letter-spacing: 0.13em; text-transform: uppercase; margin: 0 0 0.7rem;
}
.wc-branch p { font-size: 0.98rem; }
.wc-branch p:last-child { margin-bottom: 0; }

/* ---------------------------------------------------------------------------
   Chips + tables
   --------------------------------------------------------------------------- */

.wc-chip {
  display: inline-flex; align-items: center;
  font-family: var(--wc-cond); font-size: 0.7rem; font-weight: 700;
  letter-spacing: 0.06em; text-transform: uppercase;
  padding: 0.18rem 0.5rem; border: 1.5px solid currentColor;
}
.wc-chip--open { color: var(--wc-up); }
.wc-chip--contested { color: var(--wc-warn); }
.wc-chip--blocked { color: var(--wc-down); }

.wc-tablewrap { overflow-x: auto; margin: 1.6rem 0; }
.wc-tablewrap table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
.wc-tablewrap th {
  font-family: var(--wc-cond); font-size: 0.68rem; font-weight: 700;
  letter-spacing: 0.11em; text-transform: uppercase; color: var(--wc-ink-faint);
  text-align: left; padding: 0.5rem 0.9rem 0.5rem 0;
  border-bottom: 2px solid var(--wc-rule-hard);
}
.wc-tablewrap td { padding: 0.7rem 0.9rem 0.7rem 0; border-bottom: 1px solid var(--wc-rule); vertical-align: top; }
.wc-tablewrap tbody tr:last-child td { border-bottom: 0; }

/* ---------------------------------------------------------------------------
   Source strip — honest aggregation credit
   --------------------------------------------------------------------------- */

.wc-sources { margin: 2.2rem 0; padding-top: 1rem; border-top: 2px solid var(--wc-rule-hard); }
.wc-sources__label {
  font-family: var(--wc-cond); font-size: 0.68rem; font-weight: 700;
  letter-spacing: 0.13em; text-transform: uppercase; color: var(--wc-ink-faint);
  margin-bottom: 0.5rem;
}
.wc-sources__first { font-family: var(--wc-cond); font-size: 0.95rem; font-weight: 700; margin-bottom: 0.6rem; }
.wc-sources__list { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.wc-sources__list a {
  font-family: var(--wc-mono); font-size: 0.72rem; padding: 0.2rem 0.45rem;
  border: 1px solid var(--wc-rule); color: var(--wc-ink-soft); text-decoration: none;
}
.wc-sources__list a:hover { border-color: var(--wc-ink); color: var(--wc-ink); }

/* ---------------------------------------------------------------------------
   Email capture — nobody in the consumer set has this
   --------------------------------------------------------------------------- */

.wc-capture { border: 2px solid var(--wc-rule-hard); padding: 1.35rem 1.4rem; margin: 2.4rem 0; }
.wc-capture__h { font-family: var(--wc-display); font-weight: 800; font-size: 1.15rem; letter-spacing: -0.02em; margin: 0 0 0.35rem; }
.wc-capture__p { font-size: 0.92rem; color: var(--wc-ink-soft); margin: 0 0 0.95rem; }
.wc-capture__form { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.wc-capture input[type="email"] {
  flex: 1 1 13rem; min-width: 0; padding: 0.65rem 0.8rem; font: inherit; font-size: 0.95rem;
  border: 1.5px solid var(--wc-ink); background: var(--wc-bg); color: var(--wc-ink);
}
.wc-capture button {
  padding: 0.65rem 1.3rem; font-family: var(--wc-cond); font-size: 0.95rem; font-weight: 700;
  letter-spacing: 0.03em; text-transform: uppercase;
  border: 1.5px solid var(--wc-ink); background: var(--wc-ink); color: var(--wc-bg); cursor: pointer;
}
.wc-capture button:hover { background: var(--wc-accent); border-color: var(--wc-accent); }

/* ---------------------------------------------------------------------------
   Footer, corrections, a11y
   --------------------------------------------------------------------------- */

.wc-foot {
  margin-top: 3.5rem; padding: 1.6rem 0 3rem;
  border-top: 2px solid var(--wc-rule-hard);
  font-family: var(--wc-cond); font-size: 0.86rem; color: var(--wc-ink-soft);
}
.wc-foot a { color: var(--wc-ink); }

.wc-correction { border-left: 4px solid var(--wc-down); padding: 0.8rem 1.05rem; margin: 1.7rem 0; font-size: 0.92rem; }
.wc-correction__h { font-family: var(--wc-cond); font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.7rem; color: var(--wc-down); margin: 0 0 0.3rem; }

.wc-skip { position: absolute; left: -9999px; }
.wc-skip:focus { left: 0.5rem; top: 0.5rem; z-index: 99; padding: 0.6rem 1rem; background: var(--wc-ink); color: var(--wc-bg); }
:focus-visible { outline: 2px solid var(--wc-accent); outline-offset: 2px; }

@media print { .wc-capture, .wc-nav, .wc-foot, .wc-ticker { display: none; } }
