/* ═══════════════════════════════════════════════════════════
   ORIGINAL MINDS — Design System v1.1
   Editorial · Content-first · Helvetica Now Display
   DNA: intelligence.originalminds.co
   ═══════════════════════════════════════════════════════════ */

/* ── Colour Tokens ────────────────────────────────────────── */

:root {
  /* Neutrals — derived from intelligence.originalminds.co contrast scale */
  --om-black:        #0a0a0a;
  --om-grey-900:     #161616;
  --om-grey-850:     #191919;
  --om-grey-800:     #333333;
  --om-grey-700:     #444444;
  --om-grey-650:     #505050;
  --om-grey-600:     #5e5e5e;
  --om-grey-500:     #777777;
  --om-grey-400:     #8a8a8a;
  --om-grey-300:     #999999;
  --om-grey-200:     #dedede;
  --om-grey-100:     #e8e8e8;
  --om-grey-75:      #efefef;
  --om-grey-50:      #f7f7f7;
  --om-grey-25:      #fbfbfb;
  --om-white:        #ffffff;

  /* Background tiers */
  --om-bg-primary:   var(--om-white);
  --om-bg-secondary: var(--om-grey-50);
  --om-bg-tertiary:  var(--om-grey-100);
  --om-bg-inverse:   var(--om-black);
  --om-bg-offcanvas: #001216;

  /* Text tiers */
  --om-text-primary:   var(--om-grey-900);
  --om-text-secondary: var(--om-grey-800);
  --om-text-tertiary:  var(--om-grey-600);
  --om-text-muted:     var(--om-grey-500);
  --om-text-inverse:   var(--om-white);

  /* Accent — restrained, no colour */
  --om-accent:       #0a0a0a;
  --om-accent-hover: #333333;

  /* RAG scoring colours — per Notion brief */
  --om-rag-red:    #E8005A;
  --om-rag-amber:  #F5C800;
  --om-rag-green:  #00C97A;

  /* Borders — from reference site header treatment */
  --om-border-light:  var(--om-grey-100);
  --om-border-medium: var(--om-grey-200);
  --om-border-heavy:  var(--om-grey-800);

  /* ── Typography Tokens ──────────────────────────────────── */

  /* Font stack — Helvetica Now Display everywhere */
  --om-font-display: 'Helvetica Now Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --om-font-body:    'Helvetica Now Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --om-font:         var(--om-font-display);

  /* Scale — editorial, from ref site */
  --om-text-xs:      0.6875rem;   /* 11px — meta, labels */
  --om-text-sm:      0.8125rem;   /* 13px — nav dropdowns, excerpt */
  --om-text-base:    0.9375rem;   /* 15px — body text */
  --om-text-md:      1.1875rem;   /* 19px — post titles */
  --om-text-lg:      1.25rem;     /* 20px — section titles */
  --om-text-xl:      1.5rem;      /* 24px — h4 */
  --om-text-2xl:     2rem;        /* 32px — h3 */
  --om-text-3xl:     2.5rem;      /* 40px — h2 */
  --om-text-4xl:     3rem;        /* 48px — h1 */

  /* Weights */
  --om-weight-light:  300;
  --om-weight-normal: 400;
  --om-weight-medium: 500;
  --om-weight-semi:   600;
  --om-weight-bold:   700;

  /* Leading — from ref site */
  --om-leading-tight:  1.15;
  --om-leading-snug:   1.25;
  --om-leading-normal: 1.6;
  --om-leading-loose:  1.7;

  /* Tracking — from ref site heading styles */
  --om-tracking-tight:  -0.03em;
  --om-tracking-snug:   -0.02em;
  --om-tracking-normal:  0;
  --om-tracking-wide:    0.03em;
  --om-tracking-caps:    0.08em;

  /* ── Spacing — generous editorial scale ──────────────────── */

  --om-space-1:  0.25rem;    /* 4px  */
  --om-space-2:  0.5rem;     /* 8px  */
  --om-space-3:  0.75rem;    /* 12px */
  --om-space-4:  1rem;       /* 16px */
  --om-space-5:  1.5rem;     /* 24px */
  --om-space-6:  2.5rem;     /* 40px — up from 32 */
  --om-space-8:  4rem;       /* 64px — up from 48 */
  --om-space-10: 5rem;       /* 80px — up from 64 */
  --om-space-12: 6.5rem;     /* 104px — up from 80 */
  --om-space-16: 10rem;      /* 160px — up from 128 */

  /* ── Radius ─────────────────────────────────────────────── */

  --om-radius-sm:  2px;
  --om-radius-md:  4px;
  --om-radius-lg:  8px;

  /* ── Transitions ────────────────────────────────────────── */

  --om-ease:     cubic-bezier(0.25, 0.1, 0.25, 1);
  --om-duration: 200ms;
}


/* ── Global Reset & Base ──────────────────────────────────── */

*, *::before, *::after {
  box-sizing: border-box;
}

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body,
body.wp-theme-astra,
body.ast-desktop,
.ast-separate-container,
.ast-plain-container,
body button,
body input,
body select,
body textarea {
  font-family: var(--om-font-body) !important;
  font-weight: var(--om-weight-normal);
  font-size: var(--om-text-base);
  line-height: var(--om-leading-normal);
  letter-spacing: var(--om-tracking-normal);
  color: var(--om-text-secondary);
  background-color: var(--om-bg-primary);
}

/* ── Astra footer credit removal ──────────────────────────── */

.ast-footer-copyright,
.site-footer .ast-builder-footer-grid-columns,
.ast-small-footer {
  display: none !important;
}

.site-footer {
  display: none !important;
}


/* ── Typography ───────────────────────────────────────────── */

h1, h2, h3, h4, h5, h6,
.entry-title,
.page-title,
.ast-archive-title,
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
  font-family: var(--om-font-display) !important;
  font-weight: var(--om-weight-bold);
  line-height: var(--om-leading-snug);
  letter-spacing: var(--om-tracking-tight);
  color: var(--om-text-primary);
  margin: 0 0 var(--om-space-5);
}

h1, .om-h1 { font-size: var(--om-text-4xl); }
h2, .om-h2 { font-size: var(--om-text-3xl); }
h3, .om-h3 { font-size: var(--om-text-2xl); }
h4, .om-h4 { font-size: var(--om-text-xl);  }
h5, .om-h5 { font-size: var(--om-text-lg);  font-weight: var(--om-weight-semi); }
h6, .om-h6 { font-size: var(--om-text-md);  font-weight: var(--om-weight-semi); }

p {
  margin: 0 0 var(--om-space-4);
  color: var(--om-text-secondary);
}

.om-label {
  font-family: var(--om-font-display) !important;
  font-size: var(--om-text-xs);
  font-weight: var(--om-weight-semi);
  letter-spacing: var(--om-tracking-caps);
  text-transform: uppercase;
  color: var(--om-text-tertiary);
}

.om-caption {
  font-size: var(--om-text-sm);
  font-weight: var(--om-weight-normal);
  color: var(--om-text-tertiary);
}

.om-body {
  font-family: var(--om-font-body) !important;
  font-size: var(--om-text-base);
  font-weight: var(--om-weight-normal);
  line-height: var(--om-leading-normal);
}

.om-body-large {
  font-family: var(--om-font-body) !important;
  font-size: var(--om-text-md);
  font-weight: var(--om-weight-normal);
  line-height: var(--om-leading-loose);
}

strong, b { font-weight: var(--om-weight-bold); }
em, i     { font-style: italic; }


/* ── Links ────────────────────────────────────────────────── */

a,
a:visited,
a:focus {
  color: var(--om-text-primary) !important;
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
  transition: color var(--om-duration) var(--om-ease);
}

a:hover {
  color: var(--om-black) !important;
}


/* ── Dividers ─────────────────────────────────────────────── */

hr,
.om-divider {
  border: none;
  border-top: 1px solid var(--om-border-light);
  margin: var(--om-space-6) 0;
}

.om-divider--heavy {
  border-top-color: var(--om-text-primary);
}


/* ── Buttons ──────────────────────────────────────────────── */

.om-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--om-space-2);
  padding: var(--om-space-2) var(--om-space-5);
  font-family: var(--om-font);
  font-size: var(--om-text-sm);
  font-weight: var(--om-weight-medium);
  letter-spacing: var(--om-tracking-wide);
  text-transform: uppercase;
  color: var(--om-text-inverse);
  background: var(--om-accent);
  border: 1px solid var(--om-accent);
  border-bottom: none;
  border-radius: var(--om-radius-sm);
  cursor: pointer;
  transition: all var(--om-duration) var(--om-ease);
  text-decoration: none;
}

.om-btn:hover {
  background: var(--om-accent-hover);
  border-color: var(--om-accent-hover);
  border-bottom: none;
}

.om-btn--outline {
  color: var(--om-text-primary);
  background: transparent;
  border: 1px solid var(--om-border-heavy);
}

.om-btn--outline:hover {
  border-color: var(--om-text-primary);
  background: transparent;
}

.om-btn--ghost {
  color: var(--om-text-secondary);
  background: transparent;
  border: none;
  padding: var(--om-space-1) var(--om-space-2);
}

.om-btn--ghost:hover {
  color: var(--om-text-primary);
  background: transparent;
  border: none;
}


/* ── Cards — WGSN-style: borderless, image-first ─────────── */

.om-card {
  background: var(--om-bg-primary);
  border: none;
  border-radius: 0;
  padding: 0;
  transition: opacity var(--om-duration) var(--om-ease);
}

.om-card:hover {
  opacity: 0.85;
}

.om-card__image {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
  margin-bottom: var(--om-space-4);
}

.om-card__label {
  display: inline-block;
  font-size: var(--om-text-xs);
  font-weight: var(--om-weight-medium);
  letter-spacing: var(--om-tracking-wide);
  color: var(--om-text-primary);
  background: var(--om-bg-secondary);
  padding: var(--om-space-1) var(--om-space-2);
  margin-bottom: var(--om-space-3);
}

.om-card__title {
  font-size: var(--om-text-lg);
  font-weight: var(--om-weight-bold);
  line-height: var(--om-leading-snug);
  margin-bottom: var(--om-space-3);
}

.om-card__excerpt {
  font-size: var(--om-text-sm);
  font-weight: var(--om-weight-normal);
  line-height: var(--om-leading-normal);
  color: var(--om-text-tertiary);
  margin-bottom: var(--om-space-3);
}

.om-card__meta {
  font-size: var(--om-text-xs);
  color: var(--om-text-tertiary);
}

/* Compact card variant — bordered, for data/insights */
.om-card--compact {
  border: 1px solid var(--om-border-light);
  padding: var(--om-space-5);
}

.om-card--compact:hover {
  opacity: 1;
  border-color: var(--om-border-heavy);
}


/* ── Content Grid — 4-column WGSN-style ──────────────────── */

.om-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--om-space-6);
}

.om-grid--3 {
  grid-template-columns: repeat(3, 1fr);
}

.om-grid--2 {
  grid-template-columns: repeat(2, 1fr);
}

@media (max-width: 1024px) {
  .om-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  .om-grid,
  .om-grid--3 { grid-template-columns: 1fr; }
}


/* ── Section Header — WGSN report count style ────────────── */

.om-section-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: var(--om-space-5);
}

.om-section-header__title {
  font-size: var(--om-text-lg);
  font-weight: var(--om-weight-bold);
  margin: 0;
}

.om-section-header__count {
  font-size: var(--om-text-sm);
  color: var(--om-text-tertiary);
}

.om-section-header__link {
  font-size: var(--om-text-sm);
  font-weight: var(--om-weight-medium);
  color: var(--om-text-primary);
  border: none;
  display: inline-flex;
  align-items: center;
  gap: var(--om-space-1);
}

.om-section-header__link::after {
  content: '›';
  font-size: 1.1em;
  transition: transform var(--om-duration) var(--om-ease);
}

.om-section-header__link:hover {
  border: none;
}

.om-section-header__link:hover::after {
  transform: translateX(2px);
}


/* ── Tags / Chips — WGSN-style solid pills ───────────────── */

.om-tag {
  display: inline-flex;
  align-items: center;
  padding: 5px 12px;
  font-size: var(--om-text-xs);
  font-weight: var(--om-weight-medium);
  letter-spacing: var(--om-tracking-normal);
  color: var(--om-text-primary);
  background: var(--om-bg-secondary);
  border-radius: 100px;
  border: none;
  text-decoration: none;
  white-space: nowrap;
}

.om-tag--dark {
  color: var(--om-text-inverse);
  background: var(--om-accent);
}

.om-tag--active {
  color: var(--om-text-inverse);
  background: var(--om-accent);
}

.om-tag--dismissible::after {
  content: '×';
  margin-left: var(--om-space-2);
  font-size: 1em;
  opacity: 0.6;
}

/* Tag group — filter bar */
.om-tag-group {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--om-space-2);
}


/* ── Tables ───────────────────────────────────────────────── */

.om-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--om-text-sm);
}

.om-table th {
  font-size: var(--om-text-xs);
  font-weight: var(--om-weight-medium);
  letter-spacing: var(--om-tracking-caps);
  text-transform: uppercase;
  color: var(--om-text-tertiary);
  text-align: left;
  padding: var(--om-space-2) var(--om-space-3);
  border-bottom: 1px solid var(--om-text-primary);
}

.om-table td {
  padding: var(--om-space-3);
  border-bottom: 1px solid var(--om-border-light);
  vertical-align: top;
}

.om-table tr:last-child td {
  border-bottom: none;
}


/* ── Figures & Images ─────────────────────────────────────── */

figure {
  margin: var(--om-space-6) 0;
}

figure img {
  width: 100%;
  height: auto;
  display: block;
}

figcaption {
  font-size: var(--om-text-sm);
  color: var(--om-text-tertiary);
  margin-top: var(--om-space-2);
}


/* ── Blockquotes ──────────────────────────────────────────── */

blockquote {
  margin: var(--om-space-6) 0;
  padding: 0 0 0 var(--om-space-5);
  border-left: 2px solid var(--om-text-primary);
  font-size: var(--om-text-md);
  font-weight: var(--om-weight-normal);
  color: var(--om-text-primary);
}


/* ── Lists ────────────────────────────────────────────────── */

ul, ol {
  padding-left: var(--om-space-5);
  margin: 0 0 var(--om-space-4);
}

li {
  margin-bottom: var(--om-space-2);
  font-weight: var(--om-weight-normal);
}


/* ── Utility Classes ──────────────────────────────────────── */

.om-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.om-text-center { text-align: center; }
.om-text-right  { text-align: right; }

.om-mt-0  { margin-top: 0; }
.om-mt-4  { margin-top: var(--om-space-4); }
.om-mt-6  { margin-top: var(--om-space-6); }
.om-mt-8  { margin-top: var(--om-space-8); }
.om-mb-0  { margin-bottom: 0; }
.om-mb-4  { margin-bottom: var(--om-space-4); }
.om-mb-6  { margin-bottom: var(--om-space-6); }
.om-mb-8  { margin-bottom: var(--om-space-8); }


/* ── Astra Overrides ──────────────────────────────────────── */

/* Strip Astra container boxing */
.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article-post {
  background: transparent;
  padding: 0;
}

.ast-separate-container .site-content > .ast-container {
  max-width: 100%;
  padding: 0;
}

/* Clean up default Astra spacing */
.site-content .ast-container {
  padding-top: 0;
  padding-bottom: 0;
}

/* Override Astra entry-content defaults — body font for reading */
.entry-content,
.entry-content p,
.entry-content li,
.entry-content blockquote,
.entry-content figcaption,
.entry-content td,
.entry-content th,
.om-brief__body,
.om-brief__body p,
.om-brief__section-body,
.om-brief__signal-body {
  font-family: var(--om-font-body) !important;
  font-weight: var(--om-weight-normal);
  font-size: var(--om-text-base);
  line-height: var(--om-leading-normal);
  color: var(--om-text-secondary);
}

/* Astra header cleanup — only shown on non-brief pages */
.site-header {
  border-bottom: 1px solid var(--om-border-light);
}

.main-header-bar {
  border-bottom: none;
}


/* ── Data Callouts — WGSN insight cards ──────────────────── */

.om-data-callout {
  padding: var(--om-space-5);
  background: var(--om-bg-secondary);
  border: none;
  text-align: center;
}

.om-data-callout__stat {
  font-size: var(--om-text-3xl);
  font-weight: var(--om-weight-bold);
  line-height: 1;
  letter-spacing: var(--om-tracking-tight);
  color: var(--om-text-primary);
  margin-bottom: var(--om-space-2);
}

.om-data-callout__trend {
  display: inline-flex;
  align-items: center;
  gap: var(--om-space-1);
  font-size: var(--om-text-sm);
  font-weight: var(--om-weight-medium);
}

.om-data-callout__trend--up   { color: #1a7a3a; }
.om-data-callout__trend--down { color: #b91c1c; }

.om-data-callout__label {
  font-size: var(--om-text-xs);
  font-weight: var(--om-weight-normal);
  color: var(--om-text-tertiary);
  margin-top: var(--om-space-2);
}


/* ── Pull Quote — editorial style ────────────────────────── */

.om-pullquote {
  margin: var(--om-space-8) 0;
  padding: var(--om-space-6) 0;
  border-top: 1px solid var(--om-border-light);
  border-bottom: 1px solid var(--om-border-light);
  font-family: var(--om-font-display) !important;
  font-size: var(--om-text-xl);
  font-weight: var(--om-weight-light);
  line-height: var(--om-leading-snug);
  color: var(--om-text-primary);
  text-align: center;
}

.om-pullquote__attribution {
  font-size: var(--om-text-sm);
  font-weight: var(--om-weight-medium);
  color: var(--om-text-tertiary);
  margin-top: var(--om-space-3);
}


/* ── Feed / Hashtag Grid — WGSN "The Feed" ───────────────── */

.om-feed-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--om-space-3);
}

.om-feed-item {
  position: relative;
  overflow: hidden;
}

.om-feed-item__image {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  display: block;
}

.om-feed-item__tags {
  padding: var(--om-space-2);
  font-size: var(--om-text-xs);
  font-weight: var(--om-weight-medium);
  color: var(--om-text-secondary);
  line-height: var(--om-leading-snug);
}

@media (max-width: 1024px) {
  .om-feed-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 768px) {
  .om-feed-grid { grid-template-columns: repeat(2, 1fr); }
}