/* ============================================================
   GMC 2026 — Core WordPress block styles
   Ported from: apps/wordpress theme refactor/components/08-wp-blocks.html
   Loaded as editor style + front-end style.
   ============================================================ */

/* ─── Quote ───────────────────────────────────────────────── */
.wp-block-quote {
  border-left: 3px solid var(--cat-primary, var(--gmc-border-strong, rgba(255,255,255,.2)));
  padding: var(--space-lg, 24px) var(--space-xl, 32px);
  margin-block: var(--space-xl, 32px);
  background: var(--gmc-elevated, #141414);
}

.wp-block-quote p {
  font-family: var(--font-display, sans-serif);
  font-size: var(--text-2xl, 24px);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--gmc-text, #fff);
  margin-block-end: var(--space-sm, 12px);
}

.wp-block-quote cite {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--gmc-text-muted, #9A9A9A);
  letter-spacing: 0.08em;
  font-style: normal;
}

/* ─── Pullquote ───────────────────────────────────────────── */
.wp-block-pullquote {
  text-align: center;
  padding: var(--space-2xl, 48px) var(--space-xl, 32px);
  margin-block: var(--space-2xl, 48px);
  border-top: 2px solid var(--cat-primary, var(--gmc-border-strong, rgba(255,255,255,.2)));
  border-bottom: 2px solid var(--cat-primary, var(--gmc-border-strong, rgba(255,255,255,.2)));
}

.wp-block-pullquote p {
  font-family: var(--font-display, sans-serif);
  font-size: var(--text-3xl, 32px);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--gmc-text, #fff);
  max-width: 720px;
  margin-inline: auto;
  margin-block-end: var(--space-md, 16px);
}

.wp-block-pullquote cite {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--cat-primary, var(--gmc-text-muted, #9A9A9A));
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-style: normal;
}

/* ─── Code ────────────────────────────────────────────────── */
.wp-block-code {
  background: var(--gmc-elevated, #141414);
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  border-left: 3px solid var(--cat-primary, var(--gmc-learn, #6366F1));
  padding: var(--space-lg, 24px);
  margin-block: var(--space-xl, 32px);
  overflow-x: auto;
}

.wp-block-code code {
  font-family: var(--font-code, monospace);
  font-size: var(--text-sm, 12px);
  line-height: 1.7;
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
}

/* ─── Preformatted ────────────────────────────────────────── */
.wp-block-preformatted {
  font-family: var(--font-code, monospace);
  font-size: var(--text-sm, 12px);
  line-height: 1.6;
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  background: var(--gmc-elevated, #141414);
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  padding: var(--space-lg, 24px);
  margin-block: var(--space-xl, 32px);
  white-space: pre;
  overflow-x: auto;
}

/* ─── Image ───────────────────────────────────────────────── */
.wp-block-image {
  margin-block: var(--space-xl, 32px);
}

.wp-block-image figure { margin: 0; }

.wp-block-image img {
  width: 100%;
  height: auto;
  display: block;
}

.wp-block-image figcaption {
  font-family: var(--font-body, sans-serif);
  font-size: var(--text-sm, 12px);
  color: var(--gmc-text-muted, #9A9A9A);
  text-align: center;
  padding-block: var(--space-sm, 12px);
  border-bottom: 1px solid var(--gmc-border, rgba(255,255,255,.1));
}

/* ─── Gallery ─────────────────────────────────────────────── */
.wp-block-gallery {
  display: grid;
  gap: 2px;
  margin-block: var(--space-xl, 32px);
}

/* A11y decision (2026-06-15): the gallery caption inherited WP core's default
   #555 (2.77:1 on #0C0C0C → fails WCAG AA). Bumped to --gmc-text-muted
   (#9A9A9A, ~7:1) to match single-image captions. Same call as the Shopify
   a11y sprint, which replaced hardcoded #555 with a token. Two-class selector
   (0,2,0) so it beats WP core's caption rule. */
.wp-block-gallery .wp-element-caption,
.wp-block-gallery > figcaption {
  color: var(--gmc-text-muted, #9A9A9A);
  font-size: var(--text-sm, 12px);
  text-align: center;
  margin-block-start: var(--space-sm, 12px);
}

/* WP core generates columns via CSS custom property */
.wp-block-gallery.columns-2 { grid-template-columns: repeat(2, 1fr); }
.wp-block-gallery.columns-3 { grid-template-columns: repeat(3, 1fr); }
.wp-block-gallery.columns-4 { grid-template-columns: repeat(4, 1fr); }

.wp-block-gallery figure {
  margin: 0;
  aspect-ratio: 1;
  overflow: hidden;
}

.wp-block-gallery figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ─── Table ───────────────────────────────────────────────── */
.wp-block-table {
  margin-block: var(--space-xl, 32px);
  overflow-x: auto;
}

.wp-block-table table {
  width: 100%;
  border-collapse: collapse;
}

.wp-block-table thead tr {
  background: var(--gmc-elevated, #141414);
  border-bottom: 2px solid var(--cat-primary, var(--gmc-border-strong, rgba(255,255,255,.2)));
}

.wp-block-table th {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  text-align: left;
  padding: var(--space-sm, 12px) var(--space-md, 16px);
}

.wp-block-table td {
  font-family: var(--font-body, sans-serif);
  font-size: var(--text-md, 14px);
  color: var(--gmc-text, #fff);
  padding: var(--space-sm, 12px) var(--space-md, 16px);
  border-bottom: 1px solid var(--gmc-border, rgba(255,255,255,.1));
}

.wp-block-table tr:hover td {
  background: var(--gmc-elevated, #141414);
}

/* ─── Separator ───────────────────────────────────────────── */
.wp-block-separator {
  border: none;
  border-top: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  margin-block: var(--space-2xl, 48px);
}

.wp-block-separator.is-style-wide {
  border-top-color: var(--cat-primary, var(--gmc-border-strong, rgba(255,255,255,.2)));
  border-top-width: 2px;
}

/* ─── Media + Text ────────────────────────────────────────── */
.wp-block-media-text {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  margin-block: var(--space-xl, 32px);
  background: var(--gmc-elevated, #141414);
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
}

.wp-block-media-text.has-media-on-the-right {
  direction: rtl;
}
.wp-block-media-text.has-media-on-the-right > * {
  direction: ltr;
}

.wp-block-media-text .wp-block-media-text__media {
  min-height: 280px;
  background: var(--gmc-surface, #1A1A1A);
}

.wp-block-media-text__content h3,
.wp-block-media-text__content .wp-block-media-text__title {
  font-family: var(--font-display, sans-serif);
  font-size: var(--text-2xl, 24px);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.wp-block-media-text__content p {
  font-size: var(--text-md, 14px);
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  line-height: 1.6;
}

.wp-block-media-text .wp-block-media-text__media img,
.wp-block-media-text .wp-block-media-text__media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.wp-block-media-text .wp-block-media-text__content {
  padding: var(--space-2xl, 48px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--space-md, 16px);
}

/* ─── Buttons block ───────────────────────────────────────── */
.wp-block-buttons {
  display: flex;
  gap: var(--space-sm, 12px);
  flex-wrap: wrap;
  margin-block: var(--space-xl, 32px);
}

/* Align GMC button styles to WP core button block */
.wp-block-button__link {
  display: inline-flex;
  align-items: center;
  padding: var(--space-sm, 12px) var(--space-lg, 24px);
  font-family: var(--font-code, monospace);
  font-size: var(--text-sm, 12px);
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: 0;
  border: 2px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition:
    background var(--dur-fast, 100ms) var(--ease-standard, ease),
    border-color var(--dur-fast, 100ms) var(--ease-standard, ease),
    color var(--dur-fast, 100ms) var(--ease-standard, ease);
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link {
  background: var(--wp--preset--color--gmc-text, #fff);
  border-color: var(--wp--preset--color--gmc-text, #fff);
  color: var(--wp--preset--color--gmc-bg, #0C0C0C);
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
  background: transparent;
  color: var(--wp--preset--color--gmc-text, #fff);
}

.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent;
  border-color: currentColor;
}

/* ─── Button block styles — primary per category ──────────── */
.wp-block-button.is-style-primary-learn .wp-block-button__link,
.wp-block-button.is-style-primary-tools .wp-block-button__link,
.wp-block-button.is-style-primary-artists .wp-block-button__link,
.wp-block-button.is-style-primary-events .wp-block-button__link,
.wp-block-button.is-style-primary-opportunities .wp-block-button__link,
.wp-block-button.is-style-primary-news .wp-block-button__link {
  color: var(--gmc-bg, #0C0C0C);
}

.wp-block-button.is-style-primary-learn .wp-block-button__link        { background: var(--gmc-learn, #6366F1);         border-color: var(--gmc-learn, #6366F1); }
.wp-block-button.is-style-primary-tools .wp-block-button__link        { background: var(--gmc-tools, #22D3EE);         border-color: var(--gmc-tools, #22D3EE); }
.wp-block-button.is-style-primary-artists .wp-block-button__link      { background: var(--gmc-artists, #F472B6);       border-color: var(--gmc-artists, #F472B6); }
.wp-block-button.is-style-primary-events .wp-block-button__link       { background: var(--gmc-events, #A78BFA);        border-color: var(--gmc-events, #A78BFA); }
.wp-block-button.is-style-primary-opportunities .wp-block-button__link{ background: var(--gmc-opportunities, #34D399); border-color: var(--gmc-opportunities, #34D399); }
.wp-block-button.is-style-primary-news .wp-block-button__link         { background: var(--gmc-news, #FBBF24);          border-color: var(--gmc-news, #FBBF24); }

.wp-block-button.is-style-primary-learn .wp-block-button__link:hover        { background: transparent; color: var(--gmc-learn, #6366F1); }
.wp-block-button.is-style-primary-tools .wp-block-button__link:hover        { background: transparent; color: var(--gmc-tools, #22D3EE); }
.wp-block-button.is-style-primary-artists .wp-block-button__link:hover      { background: transparent; color: var(--gmc-artists, #F472B6); }
.wp-block-button.is-style-primary-events .wp-block-button__link:hover       { background: transparent; color: var(--gmc-events, #A78BFA); }
.wp-block-button.is-style-primary-opportunities .wp-block-button__link:hover{ background: transparent; color: var(--gmc-opportunities, #34D399); }
.wp-block-button.is-style-primary-news .wp-block-button__link:hover         { background: transparent; color: var(--gmc-news, #FBBF24); }

/* ─── Button block styles — secondary per category ───────── */
.wp-block-button.is-style-secondary-learn .wp-block-button__link        { background: transparent; border-color: var(--gmc-learn, #6366F1);         color: var(--gmc-learn, #6366F1); }
.wp-block-button.is-style-secondary-tools .wp-block-button__link        { background: transparent; border-color: var(--gmc-tools, #22D3EE);         color: var(--gmc-tools, #22D3EE); }
.wp-block-button.is-style-secondary-artists .wp-block-button__link      { background: transparent; border-color: var(--gmc-artists, #F472B6);       color: var(--gmc-artists, #F472B6); }
.wp-block-button.is-style-secondary-events .wp-block-button__link       { background: transparent; border-color: var(--gmc-events, #A78BFA);        color: var(--gmc-events, #A78BFA); }
.wp-block-button.is-style-secondary-opportunities .wp-block-button__link{ background: transparent; border-color: var(--gmc-opportunities, #34D399); color: var(--gmc-opportunities, #34D399); }
.wp-block-button.is-style-secondary-news .wp-block-button__link         { background: transparent; border-color: var(--gmc-news, #FBBF24);          color: var(--gmc-news, #FBBF24); }

.wp-block-button.is-style-secondary-learn .wp-block-button__link:hover        { background: var(--gmc-learn, #6366F1);         color: var(--gmc-bg, #0C0C0C); }
.wp-block-button.is-style-secondary-tools .wp-block-button__link:hover        { background: var(--gmc-tools, #22D3EE);         color: var(--gmc-bg, #0C0C0C); }
.wp-block-button.is-style-secondary-artists .wp-block-button__link:hover      { background: var(--gmc-artists, #F472B6);       color: var(--gmc-bg, #0C0C0C); }
.wp-block-button.is-style-secondary-events .wp-block-button__link:hover       { background: var(--gmc-events, #A78BFA);        color: var(--gmc-bg, #0C0C0C); }
.wp-block-button.is-style-secondary-opportunities .wp-block-button__link:hover{ background: var(--gmc-opportunities, #34D399); color: var(--gmc-bg, #0C0C0C); }
.wp-block-button.is-style-secondary-news .wp-block-button__link:hover         { background: var(--gmc-news, #FBBF24);          color: var(--gmc-bg, #0C0C0C); }

/* ─── Button block style — ghost ─────────────────────────── */
.wp-block-button.is-style-ghost .wp-block-button__link {
  background: transparent;
  border-color: var(--gmc-border, rgba(255,255,255,0.10));
  color: var(--gmc-text, #fff);
}
.wp-block-button.is-style-ghost .wp-block-button__link:hover {
  border-color: var(--gmc-border-strong, rgba(255,255,255,0.20));
}

/* ─── Badge component ────────────────────────────────────────
   Canonical .gmc-badge / --sm / --lg live in base.css (ported 1:1
   from the reference). Here only the anchor extension: badges used
   as links (hero-home, post cards) need no underline + hover. */
a.gmc-badge {
  text-decoration: none;
  transition:
    background var(--dur-fast, 100ms) var(--ease-standard, ease),
    color var(--dur-fast, 100ms) var(--ease-standard, ease);
}

a.gmc-badge:hover {
  background: var(--cat-primary, var(--gmc-border-strong, rgba(255,255,255,.2)));
  color: var(--gmc-bg, #0C0C0C);
}

a.gmc-badge:hover::before { background: var(--gmc-bg, #0C0C0C); }

/* ─── Columns ─────────────────────────────────────────────── */
.wp-block-columns {
  display: grid;
  gap: var(--space-xl, 32px);
  margin-block: var(--space-xl, 32px);
}

.wp-block-columns.has-2-columns { grid-template-columns: repeat(2, 1fr); }
.wp-block-columns.has-3-columns { grid-template-columns: repeat(3, 1fr); }

.wp-block-column {
  font-family: var(--font-body, sans-serif);
  font-size: var(--text-lg, 16px);
  line-height: 1.7;
}

.wp-block-column h3 {
  font-family: var(--font-display, sans-serif);
  font-size: var(--text-xl, 20px);
  font-weight: 700;
  margin-block-end: var(--space-sm, 12px);
}

/* ─── Verse ───────────────────────────────────────────────── */
.wp-block-verse {
  font-family: var(--font-body, sans-serif);
  font-size: var(--text-lg, 16px);
  font-style: italic;
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  line-height: 2.0;
  padding: var(--space-xl, 32px);
  border-left: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  margin-block: var(--space-xl, 32px);
}

/* ─── Post content area (single.html) ────────────────────── */
.post-content {
  max-width: 720px;
}

.post-content p {
  font-family: var(--font-body, sans-serif);
  font-size: var(--text-lg, 16px);
  line-height: 1.75;
  color: var(--gmc-text, #fff);
  margin-block-end: var(--space-lg, 24px);
}

.post-content h2 {
  font-family: var(--font-display, sans-serif);
  font-size: var(--text-3xl, 32px);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.1;
  margin-block: var(--space-2xl, 48px) var(--space-lg, 24px);
}

.post-content h3 {
  font-family: var(--font-display, sans-serif);
  font-size: var(--text-2xl, 24px);
  font-weight: 700;
  letter-spacing: -0.01em;
  margin-block: var(--space-xl, 32px) var(--space-md, 16px);
}

.post-content strong { font-weight: 600; }
.post-content em { color: var(--gmc-text-dim, rgba(255,255,255,.6)); }

.post-content a {
  color: var(--cat-primary, var(--gmc-learn, #6366F1));
  border-bottom: 1px solid transparent;
  transition: border-color var(--dur-fast, 100ms) var(--ease-standard, ease);
}
.post-content a:hover { border-bottom-color: currentColor; }

.post-content ul,
.post-content ol {
  padding-inline-start: var(--space-xl, 32px);
  margin-block: var(--space-md, 16px);
  display: flex;
  flex-direction: column;
  gap: var(--space-xs, 8px);
  font-family: var(--font-body, sans-serif);
  font-size: var(--text-lg, 16px);
  line-height: 1.6;
}

.post-content img {
  width: 100%;
  height: auto;
  margin-block: var(--space-2xl, 48px);
}

/* ─── Post tags ───────────────────────────────────────────── */
.post-tags {
  display: flex;
  gap: var(--space-xs, 8px);
  flex-wrap: wrap;
  padding-block: var(--space-xl, 32px);
  border-top: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  margin-block-start: var(--space-2xl, 48px);
}

.post-tag {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--gmc-text-muted, #9A9A9A);
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  padding: var(--space-2xs, 4px) var(--space-sm, 12px);
  letter-spacing: 0.06em;
  text-decoration: none;
  transition: all var(--dur-fast, 100ms) var(--ease-standard, ease);
}

.post-tag:hover {
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  border-color: var(--gmc-border-strong, rgba(255,255,255,.2));
}

/* ─── wp:post-terms (tag pills on single posts) ───────────── */
.wp-block-post-terms {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs, 8px);
  align-items: center;
}

.wp-block-post-terms__separator { display: none; }

.wp-block-post-terms a {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--cat-primary, var(--gmc-text-muted, #9A9A9A));
  border: 1px solid var(--cat-primary, var(--gmc-border, rgba(255,255,255,.1)));
  padding: var(--space-2xs, 4px) var(--space-sm, 12px);
  letter-spacing: 0.06em;
  text-decoration: none;
  transition: all var(--dur-fast, 100ms) var(--ease-standard, ease);
}

.wp-block-post-terms a:hover {
  color: var(--gmc-text, #fff);
  border-color: var(--cat-primary, var(--gmc-border-strong, rgba(255,255,255,.2)));
}

/* ─── Post card (gmc/post-card block output) ──────────────── */
.post-card {
  background: var(--gmc-elevated, #141414);
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  border-top: 3px solid var(--cat-primary, var(--gmc-border, rgba(255,255,255,.1)));
  display: flex;
  flex-direction: column;
  transition:
    background var(--dur-normal, 200ms) var(--ease-standard, ease),
    border-color var(--dur-normal, 200ms) var(--ease-standard, ease),
    transform var(--dur-normal, 200ms) var(--ease-standard, ease);
  cursor: pointer;
  text-decoration: none;
  color: inherit;
}

.post-card:hover {
  background: var(--gmc-surface, #1A1A1A);
  border-color: rgba(255,255,255,0.2);
  transform: translateY(-2px);
}

.post-card__image { aspect-ratio: 16/9; overflow: hidden; }
.post-card__image img { width: 100%; height: 100%; object-fit: cover; display: block; }

.post-card__body {
  padding: var(--space-lg, 24px);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm, 12px);
  flex: 1;
}

.post-card__meta {
  display: flex;
  align-items: center;
  gap: var(--space-sm, 12px);
}

.post-card__date {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--gmc-text-muted, #9A9A9A);
}

.post-card__title {
  font-family: var(--font-display, sans-serif);
  font-size: var(--text-xl, 20px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

.post-card__excerpt {
  font-size: var(--text-md, 14px);
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  line-height: 1.6;
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.post-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block-start: var(--space-sm, 12px);
  border-top: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  margin-block-start: var(--space-sm, 12px);
}

.post-card__author,
.post-card__readtime {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--gmc-text-muted, #9A9A9A);
}

/* ─── Post card — overlay variant ──────────────────────────
   Badge + title over a larger image (gradient backdrop);
   excerpt + metadata below. More horizontal than the stack. */
.post-card--overlay .post-card__media {
  position: relative;
  display: block;
  aspect-ratio: 16/10;
  background: var(--gmc-surface, #1A1A1A);
  overflow: hidden;
  text-decoration: none;
}

.post-card--overlay .post-card__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.post-card--overlay .post-card__media-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
    to top,
    rgba(12, 12, 12, 0.92) 0%,
    rgba(12, 12, 12, 0.55) 45%,
    rgba(12, 12, 12, 0.10) 80%,
    rgba(12, 12, 12, 0.00) 100%
  );
}

.post-card--overlay .post-card__media-content {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-xs, 8px);
  padding: var(--space-md, 16px);
}

.post-card--overlay .post-card__media-content .post-card__title {
  font-family: var(--font-display, sans-serif);
  font-size: var(--text-xl, 20px);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--gmc-text, #fff);
}

.post-card--overlay .post-card__body {
  padding: var(--space-md, 16px);
  gap: var(--space-sm, 12px);
}

.post-card--overlay .post-card__excerpt {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ─── Section header (eyebrow + category accent) ───────────
   Reference idiom (00-index / showcase): 4px left accent bar,
   mono eyebrow tinted by section category, display title.
   Tint via is-style-cat-* on the wrapper group. */
.gmc-section-header {
  border-left: 4px solid var(--cat-primary, var(--gmc-border-strong, rgba(255,255,255,.2)));
  padding-left: var(--space-lg, 24px);
}

.gmc-section-header__eyebrow {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 12px);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cat-primary, var(--gmc-text-muted, #9A9A9A));
  margin-block-end: var(--space-xs, 8px);
}

.gmc-section-header h2 {
  line-height: 1.05;
  letter-spacing: -0.03em;
}

/* ─── Latest posts grid (fluid columns + load more) ────────
   Title analysis (68 posts): median 45 chars, p90 80 → cards need
   ≥270px so the overlay title stays at 2–3 lines. auto-fill gives
   4 cols at 1280 content width, 3/2/1 as the viewport narrows. */
.gmc-latest-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: var(--space-lg, 24px);
  margin: 0;
  padding: 0;
  list-style: none;
}

.gmc-latest-grid > li {
  list-style: none;
  display: flex;
  margin: 0;
}

.gmc-latest-grid .post-card { width: 100%; }

/* Compact variant — smaller cards (e.g. Last Events strip in a column) */
.gmc-latest-grid--compact {
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: var(--space-md, 16px);
}

.gmc-latest-grid--compact .post-card__media { aspect-ratio: 16/11; }

.gmc-latest-grid--compact .post-card__media-content .post-card__title {
  font-size: var(--text-lg, 16px);
}

.gmc-latest-grid--compact .post-card__excerpt,
.gmc-latest-grid--compact .post-card__body { display: none; }

.gmc-load-more-wrap {
  display: flex;
  justify-content: center;
  margin-block-start: var(--space-xl, 32px);
}

.post-card--overlay .post-card__footer {
  margin-block-start: 0;
  padding-block-start: var(--space-sm, 12px);
}

/* ─── Sidebar ─────────────────────────────────────────────── */
.gmc-sidebar {
  display: flex;
  flex-direction: column;
  gap: var(--space-xl, 32px);
  position: sticky;
  top: 80px;
}

/* Non-sticky variant — scrolls with the page (single post sidebar) */
.gmc-sidebar--static { position: static; }

.sidebar-widget {
  background: var(--gmc-elevated, #141414);
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  padding: var(--space-lg, 24px);
}

.sidebar-widget__title {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--gmc-text-muted, #9A9A9A);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-block-end: var(--space-md, 16px);
  padding-block-end: var(--space-sm, 12px);
  border-bottom: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  display: flex;
  align-items: center;
  gap: var(--space-xs, 8px);
}

.sidebar-widget__title::before {
  content: '';
  width: 8px;
  height: 8px;
  background: var(--cat-primary, var(--gmc-text-muted, #9A9A9A));
  flex-shrink: 0;
}

/* ─── Categories ──────────────────────────────────────────── */
.wp-block-categories {
  list-style: none;
  padding: 0;
  margin: 0;
}

.wp-block-categories li.cat-item {
  padding-block: var(--space-2xs, 4px);
}

.wp-block-categories a {
  font-family: var(--font-body, sans-serif);
  font-size: var(--text-md, 14px);
  color: var(--gmc-text, #fff);
  text-decoration: none;
  transition: color var(--dur-fast, 100ms) var(--ease-standard, ease);
}

.wp-block-categories a[href*="/learn/"]:hover         { color: var(--gmc-learn, #6366F1); }
.wp-block-categories a[href*="/tools/"]:hover         { color: var(--gmc-tools, #22D3EE); }
.wp-block-categories a[href*="/artists/"]:hover       { color: var(--gmc-artists, #F472B6); }
.wp-block-categories a[href*="/events/"]:hover        { color: var(--gmc-events, #A78BFA); }
.wp-block-categories a[href*="/opportunities/"]:hover { color: var(--gmc-opportunities, #34D399); }
.wp-block-categories a[href*="/news/"]:hover          { color: var(--gmc-news, #FBBF24); }

.cat-count {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--gmc-text-muted, #9A9A9A);
  margin-inline-start: var(--space-2xs, 4px);
}

/* Nested subcategories (active when showHierarchy:true) */
.wp-block-categories .children {
  list-style: none;
  padding-inline-start: var(--space-md, 16px);
  border-inline-start: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  margin-block: var(--space-2xs, 4px) 0;
}

.wp-block-categories .children a {
  font-size: var(--text-sm, 12px);
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
}

.wp-block-categories .children a:hover {
  color: var(--gmc-text, #fff);
}

/* ─── Tag Cloud ───────────────────────────────────────────── */
.wp-block-tag-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs, 8px);
  padding: 0;
  margin: 0;
  list-style: none;
}

.wp-block-tag-cloud a,
.wp-block-tag-cloud .tag-cloud-link {
  display: inline-block;
  padding: var(--space-xs, 8px) var(--space-sm, 12px);
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px); /* override WP inline style */
  letter-spacing: 0.06em;
  line-height: 1.3;
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  text-decoration: none;
  transition: all var(--dur-fast, 100ms) var(--ease-standard, ease);
}

.wp-block-tag-cloud a:hover,
.wp-block-tag-cloud .tag-cloud-link:hover {
  border-color: var(--cat-primary, var(--gmc-border-strong, rgba(255,255,255,.2)));
  color: var(--cat-primary, var(--gmc-text, #fff));
}

.wp-block-tag-cloud .tag-pop-1 { font-size: var(--text-xs, 10px); }
.wp-block-tag-cloud .tag-pop-2 { font-size: var(--text-sm, 12px); }
.wp-block-tag-cloud .tag-pop-3 {
  font-size: var(--text-md, 14px);
  border-color: var(--cat-primary, var(--gmc-border-strong, rgba(255,255,255,.2)));
  color: var(--gmc-text, #fff);
}

/* ─── Archives ─────────────────────────────────────────────── */
.wp-block-archives-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.wp-block-archives-list li {
  padding-block: var(--space-2xs, 4px);
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}

.wp-block-archives-list li a {
  font-family: var(--font-body, sans-serif);
  font-size: var(--text-md, 14px);
  color: var(--gmc-text, #fff);
  text-decoration: none;
  transition: color var(--dur-fast, 100ms) var(--ease-standard, ease);
}

.wp-block-archives-list li a:hover {
  color: var(--cat-primary, var(--gmc-text-dim, rgba(255,255,255,.6)));
}

.archive-count {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--gmc-text-muted, #9A9A9A);
}

.wp-block-archives-dropdown-form { margin: 0; }

.wp-block-archives-dropdown select,
.wp-block-archives-dropdown-form select {
  width: 100%;
  padding: var(--space-sm, 12px) var(--space-md, 16px);
  background: var(--gmc-bg, #0C0C0C);
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  color: var(--gmc-text, #fff);
  font-family: var(--font-body, sans-serif);
  font-size: var(--text-md, 14px);
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  padding-inline-end: var(--space-2xl, 48px);
  background-image:
    linear-gradient(45deg, transparent 50%, var(--gmc-text-dim, rgba(255,255,255,.6)) 50%),
    linear-gradient(135deg, var(--gmc-text-dim, rgba(255,255,255,.6)) 50%, transparent 50%);
  background-position: calc(100% - 18px) center, calc(100% - 12px) center;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}

.wp-block-archives-dropdown select:focus,
.wp-block-archives-dropdown-form select:focus {
  outline: none;
  border-color: var(--gmc-border-strong, rgba(255,255,255,.2));
}

/* ─── Search block ─────────────────────────────────────────── */
.wp-block-search__inside-wrapper {
  display: flex;
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  background: transparent;
  overflow: hidden;
}

.wp-block-search__input {
  flex: 1;
  min-width: 0;
  padding: var(--space-sm, 12px) var(--space-md, 16px);
  background: var(--gmc-bg, #0C0C0C);
  border: none;
  outline: none;
  color: var(--gmc-text, #fff);
  font-family: var(--font-body, sans-serif);
  font-size: var(--text-md, 14px);
  transition: border-color var(--dur-fast, 100ms) var(--ease-standard, ease);
}

.wp-block-search__input::placeholder {
  color: var(--gmc-text-muted, #9A9A9A);
}

.wp-block-search__input:focus {
  outline: none;
}

.wp-block-search__button {
  padding: var(--space-sm, 12px) var(--space-md, 16px);
  background: var(--gmc-bg, #0C0C0C);
  border: none;
  border-left: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  font-family: var(--font-code, monospace);
  font-size: var(--text-md, 14px);
  cursor: pointer;
  flex-shrink: 0;
  transition: all var(--dur-fast, 100ms) var(--ease-standard, ease);
}

.wp-block-search__button:hover {
  background: var(--gmc-surface, #1A1A1A);
  color: var(--gmc-text, #fff);
}

/* ─── Comments — wp-block-comments suite ──────────────────── */
/* Ported from: apps/wordpress theme refactor/components/10-special-pages.html */
.wp-block-comments {
  margin-block-start: var(--space-3xl, 64px);
  border-top: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  padding-block-start: var(--space-2xl, 48px);
}

.wp-block-comments-title {
  font-family: var(--font-display, sans-serif);
  font-size: var(--text-2xl, 24px);
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-block-end: var(--space-xl, 32px);
}

/* comment-template generates an ordered list */
.wp-block-comment-template {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
}

/* Each comment is a li; the columns layout wraps avatar + body */
.wp-block-comment-template li {
  padding-block: var(--space-lg, 24px);
  border-bottom: 1px solid var(--gmc-border, rgba(255,255,255,.1));
}

.wp-block-comment-template li:last-child { border-bottom: none; }

/* Avatar border tinted by category */
.wp-block-avatar img,
.wp-block-avatar .wp-block-avatar__image {
  border: 2px solid var(--cat-primary, var(--gmc-border, rgba(255,255,255,.1)));
  display: block;
}

.wp-block-comment-author-name {
  font-family: var(--font-body, sans-serif);
  font-size: var(--text-md, 14px);
  font-weight: 600;
  color: var(--gmc-text, #fff);
  text-decoration: none;
}

.wp-block-comment-date,
.wp-block-comment-date a {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--gmc-text-muted, #9A9A9A);
  letter-spacing: 0.04em;
  text-decoration: none;
}

.wp-block-comment-content {
  font-family: var(--font-body, sans-serif);
  font-size: var(--text-md, 14px);
  line-height: 1.7;
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  margin-block: var(--space-sm, 12px) 0;
}

.wp-block-comment-reply-link a {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--gmc-text-muted, #9A9A9A);
  text-decoration: none;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  transition: color var(--dur-fast, 100ms) var(--ease-standard, ease);
}

.wp-block-comment-reply-link a:hover {
  color: var(--cat-primary, var(--gmc-text, #fff));
}

/* Comment form */
.wp-block-post-comments-form {
  margin-block-start: var(--space-2xl, 48px);
  padding: var(--space-xl, 32px);
  background: var(--gmc-elevated, #141414);
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
}

.wp-block-post-comments-form label {
  display: block;
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--gmc-text-muted, #9A9A9A);
  margin-block-end: var(--space-2xs, 4px);
}

.wp-block-post-comments-form input[type="text"],
.wp-block-post-comments-form input[type="email"],
.wp-block-post-comments-form input[type="url"],
.wp-block-post-comments-form textarea {
  width: 100%;
  background: var(--gmc-bg, #0C0C0C);
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  color: var(--gmc-text, #fff);
  padding: var(--space-sm, 12px) var(--space-md, 16px);
  font-family: var(--font-body, sans-serif);
  font-size: var(--text-md, 14px);
  line-height: 1.6;
  margin-block-end: var(--space-md, 16px);
  transition: border-color var(--dur-fast, 100ms) var(--ease-standard, ease);
}

.wp-block-post-comments-form input:focus,
.wp-block-post-comments-form textarea:focus {
  outline: none;
  border-color: var(--gmc-border-strong, rgba(255,255,255,.2));
}

.wp-block-post-comments-form input[type="submit"] {
  display: inline-flex;
  padding: var(--space-sm, 12px) var(--space-lg, 24px);
  background: var(--gmc-text, #fff);
  border: 2px solid var(--gmc-text, #fff);
  color: var(--gmc-bg, #0C0C0C);
  font-family: var(--font-code, monospace);
  font-size: var(--text-sm, 12px);
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition:
    background var(--dur-fast, 100ms) var(--ease-standard, ease),
    color var(--dur-fast, 100ms) var(--ease-standard, ease);
}

.wp-block-post-comments-form input[type="submit"]:hover {
  background: transparent;
  color: var(--gmc-text, #fff);
}

/* ─── Skeleton Loading States ──────────────────────────────── */
/* Ported from: apps/wordpress theme refactor/components/10-special-pages.html */
@keyframes skeleton-pulse {
  0%, 100% { opacity: 0.4; }
  50%       { opacity: 0.8; }
}

.skeleton {
  background: var(--gmc-elevated, #141414);
  animation: skeleton-pulse 1.5s ease-in-out infinite;
}

.skeleton-card {
  background: var(--gmc-elevated, #141414);
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  border-top: 3px solid var(--gmc-surface, #1A1A1A);
  padding: var(--space-lg, 24px);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm, 12px);
}

.skeleton-image {
  width: 100%;
  aspect-ratio: 16 / 9;
  background: var(--gmc-surface, #1A1A1A);
  animation: skeleton-pulse 1.5s ease-in-out infinite;
}

.skeleton-line {
  height: 12px;
  background: var(--gmc-surface, #1A1A1A);
  animation: skeleton-pulse 1.5s ease-in-out infinite;
}

.skeleton-line--short  { width: 40%; }
.skeleton-line--medium { width: 65%; }
.skeleton-line--full   { width: 100%; }
.skeleton-line--title  { height: 20px; width: 80%; }
.skeleton-line--badge  { height: 18px; width: 60px; }

.skeleton-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
}

/* ─── Footer patterns CSS ──────────────────────────────────── */
/* Used by patterns/footer-standard.php and patterns/footer-extended.php */
.footer-category-link {
  display: flex;
  align-items: center;
  gap: var(--space-sm, 12px);
  font-family: var(--font-body, sans-serif);
  font-size: var(--text-md, 14px);
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  text-decoration: none;
  transition: color var(--dur-fast, 100ms) var(--ease-standard, ease);
}

.footer-category-link:hover { color: var(--gmc-text, #fff); }

.footer-category-dot {
  width: 8px;
  height: 8px;
  background: var(--cat-primary, var(--gmc-text-muted, #9A9A9A));
  flex-shrink: 0;
}

.footer-nav-col__title {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gmc-text-muted, #9A9A9A);
  margin-block-end: var(--space-md, 16px);
  padding-block-end: var(--space-sm, 12px);
  border-bottom: 1px solid var(--gmc-border, rgba(255,255,255,.1));
}

.footer-nav-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm, 12px);
}

.footer-nav-list a {
  font-family: var(--font-body, sans-serif);
  font-size: var(--text-md, 14px);
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  text-decoration: none;
  transition: color var(--dur-fast, 100ms) var(--ease-standard, ease);
}

.footer-nav-list a:hover { color: var(--gmc-text, #fff); }

.social-links {
  display: flex;
  gap: var(--space-sm, 12px);
  margin-block-start: var(--space-lg, 24px);
}

.social-link {
  width: 36px;
  height: 36px;
  background: var(--gmc-elevated, #141414);
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  text-decoration: none;
  transition:
    border-color var(--dur-fast, 100ms) var(--ease-standard, ease),
    color var(--dur-fast, 100ms) var(--ease-standard, ease);
}

.social-link:hover {
  border-color: var(--gmc-border-strong, rgba(255,255,255,.2));
  color: var(--gmc-text, #fff);
}

/* ─── Footer logo ───────────────────────────────────────────── */
.footer-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-block-end: 16px;
}

.footer-logo__mark {
  width: 20px;
  height: 20px;
  background: var(--gmc-text, #fff);
  flex-shrink: 0;
}

.footer-logo__wordmark {
  font-family: var(--font-display, sans-serif);
  font-size: var(--text-md, 14px);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--gmc-text, #fff);
  margin: 0;
}

.footer-logo__tagline {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--gmc-text-muted, #9A9A9A);
  letter-spacing: 0.06em;
  margin: 2px 0 0;
}

/* ─── Footer stats ──────────────────────────────────────────── */
.footer-stats {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-block: 12px;
}

.footer-stat {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--gmc-text-muted, #9A9A9A);
  letter-spacing: 0.06em;
}

/* ─── Newsletter form ───────────────────────────────────────── */
@media (min-width: 601px) {
  .newsletter-form { min-width: 360px; }
}

.newsletter-form__input:focus {
  border-color: var(--gmc-border-strong, rgba(255,255,255,.25));
}

.newsletter-form__message {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  letter-spacing: 0.06em;
  margin-block-start: var(--space-xs, 8px);
}

.newsletter-form__message--ok  { color: #34D399; }
.newsletter-form__message--err { color: #F87171; }

@media (max-width: 600px) {
  .newsletter-form { flex-direction: column !important; min-width: 0 !important; width: 100%; }
  .newsletter-form__input { border-right: 1px solid var(--gmc-border, rgba(255,255,255,.1)) !important; }
}

/* ─── 404 glow ─────────────────────────────────────────────── */
.page-404-wrap {
  position: relative;
  overflow: hidden;
}

.page-404__glow {
  position: absolute;
  width: 400px;
  height: 400px;
  background: rgba(244, 114, 182, 0.12);
  border-radius: 50%;
  filter: blur(80px);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 0;
}

/* ─── Join Us Card (sidebar CTA widget) ────────────────────── */
.join-us-card {
  background: var(--gmc-elevated, #141414);
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  border-top: 3px solid var(--cat-primary, var(--gmc-border-strong, rgba(255,255,255,.2)));
  padding: var(--space-lg, 24px);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm, 12px);
}

.join-us-card__eyebrow {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cat-primary, var(--gmc-text-muted, #9A9A9A));
}

.join-us-card__title {
  font-family: var(--font-display, sans-serif);
  font-size: var(--text-xl, 20px);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.join-us-card__desc {
  font-size: var(--text-md, 14px);
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  line-height: 1.6;
}

/* ─── Recent Posts (gmc/recent-posts) ─────────────────────── */
.gmc-recent-posts {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
}

.gmc-recent-posts li {
  padding-block: var(--space-sm, 12px);
  border-bottom: 1px solid var(--gmc-border, rgba(255,255,255,.1));
}

.gmc-recent-posts li:last-child { border-bottom: none; }

.gmc-recent-posts .wp-block-latest-posts__post-title {
  display: block;
  font-family: var(--font-body, sans-serif);
  font-size: var(--text-md, 14px);
  font-weight: 500;
  line-height: 1.4;
  color: var(--gmc-text, #fff);
  text-decoration: none;
  margin-block-end: var(--space-2xs, 4px);
  transition: color var(--dur-fast, 100ms) var(--ease-standard, ease);
}

.gmc-recent-posts .wp-block-latest-posts__post-title:hover {
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
}

.gmc-recent-posts .wp-block-latest-posts__post-meta {
  display: flex;
  align-items: center;
  gap: var(--space-sm, 12px);
  flex-wrap: wrap;
}

.gmc-recent-posts .wp-block-latest-posts__post-date {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--gmc-text-muted, #9A9A9A);
  letter-spacing: 0.04em;
}

/* ─── Instagram placeholder ────────────────────────────────── */
.instagram-placeholder {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
}

.instagram-placeholder__item {
  aspect-ratio: 1;
  background: var(--gmc-surface, #1A1A1A);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--gmc-text-muted, #9A9A9A);
}

/* ─── Pagination (wp:query-pagination) ──────────────────────── */
.wp-block-query-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: var(--space-2xl);
}

.wp-block-query-pagination-numbers {
  display: flex;
  align-items: center;
  gap: 2px;
}

.wp-block-query-pagination-previous,
.wp-block-query-pagination-next,
.wp-block-query-pagination-numbers .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  min-width: 40px;
  padding: 0;
  background: var(--gmc-elevated);
  border: 1px solid var(--gmc-border);
  color: var(--gmc-text-dim);
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs);
  letter-spacing: 0.06em;
  text-decoration: none;
  transition:
    background   var(--dur-fast) var(--ease-standard),
    border-color var(--dur-fast) var(--ease-standard),
    color        var(--dur-fast) var(--ease-standard);
}

.wp-block-query-pagination-previous,
.wp-block-query-pagination-next {
  width: auto;
  padding-inline: var(--space-md);
}

.wp-block-query-pagination-previous:hover,
.wp-block-query-pagination-next:hover,
.wp-block-query-pagination-numbers .page-numbers:hover:not(.current):not(.dots) {
  background: var(--gmc-surface);
  color: var(--gmc-text);
  border-color: var(--gmc-border-strong);
}

.wp-block-query-pagination-numbers .page-numbers.current {
  background: var(--cat-primary, var(--gmc-text));
  border-color: var(--cat-primary, var(--gmc-text));
  color: var(--gmc-bg);
}

.wp-block-query-pagination-numbers .page-numbers.dots {
  background: transparent;
  border-color: transparent;
  color: var(--gmc-text-muted);
  pointer-events: none;
  cursor: default;
}

/* ─── Post Navigation (wp:post-navigation-link) ─────────────── */
.wp-block-post-navigation-link a {
  display: inline-flex;
  align-items: center;
  height: 40px;
  padding-inline: var(--space-md);
  background: transparent;
  border: 1px solid var(--gmc-border);
  color: var(--gmc-text-dim);
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs);
  letter-spacing: 0.06em;
  text-decoration: none;
  transition:
    background   var(--dur-fast) var(--ease-standard),
    border-color var(--dur-fast) var(--ease-standard),
    color        var(--dur-fast) var(--ease-standard);
}

.wp-block-post-navigation-link a:hover {
  background: var(--gmc-surface);
  color: var(--gmc-text);
  border-color: var(--gmc-border-strong);
}

/* ─── Font-size class aliases (kebab-case gotcha) ───────────
   WP generates presets in kebab form (--wp--preset--font-size--3-xl,
   .has-3-xl-font-size) but the theme markup convention writes
   has-3xl-font-size. Alias the non-kebab classes so both resolve.
   !important matches the core-generated preset rules. */
.has-2xl-font-size { font-size: var(--wp--preset--font-size--2-xl) !important; }
.has-3xl-font-size { font-size: var(--wp--preset--font-size--3-xl) !important; }
.has-4xl-font-size { font-size: var(--wp--preset--font-size--4-xl) !important; }
.has-5xl-font-size { font-size: var(--wp--preset--font-size--5-xl) !important; }

/* ─── Featured card (horizontal, large) ───────────────────── */
.featured-card {
  background: var(--gmc-elevated, #141414);
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  border-left: 4px solid var(--cat-primary, var(--gmc-border-strong, rgba(255,255,255,.2)));
  display: grid;
  grid-template-columns: 1fr 1fr;
  transition: background var(--dur-normal, 200ms) var(--ease-standard, ease);
  text-decoration: none;
  color: inherit;
}

.featured-card:hover { background: var(--gmc-surface, #1A1A1A); }

.featured-card__image {
  min-height: 320px;
  overflow: hidden;
  background: var(--gmc-surface, #1A1A1A);
}

.featured-card__image img { width: 100%; height: 100%; object-fit: cover; display: block; }

.featured-card__body {
  padding: var(--space-2xl, 48px);
  display: flex;
  flex-direction: column;
  gap: var(--space-md, 16px);
  justify-content: center;
}

.featured-card__label {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--cat-primary, var(--gmc-text-muted, #9A9A9A));
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.featured-card__title {
  font-family: var(--font-display, sans-serif);
  font-size: var(--text-4xl, 48px);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -0.03em;
}

.featured-card__excerpt {
  font-size: var(--text-lg, 16px);
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  line-height: 1.6;
}

.featured-card__cta {
  margin-block-start: var(--space-md, 16px);
  display: flex;
  gap: var(--space-sm, 12px);
  align-items: center;
}

/* ─── Magazine grid (asymmetric, first card 2 rows) ───────── */
.card-grid-magazine {
  display: grid;
  grid-template-columns: 2fr 1fr;
  grid-template-rows: auto auto;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* First grid child spans both rows. wp:post-template wraps each card in
   an <li>, so target the first child of the grid, whatever its tag. */
.card-grid-magazine > :first-child { grid-row: 1 / 3; }
.card-grid-magazine > :first-child .post-card__title { font-size: var(--text-3xl, 32px); }
.card-grid-magazine > :first-child .post-card__image { aspect-ratio: 4/3; }
.card-grid-magazine > li { list-style: none; display: flex; }
.card-grid-magazine .post-card { width: 100%; }

/* ─── Author card ─────────────────────────────────────────── */
.author-card {
  background: var(--gmc-elevated, #141414);
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  padding: var(--space-xl, 32px);
  display: flex;
  gap: var(--space-lg, 24px);
  align-items: flex-start;
}

.author-card__avatar {
  width: 64px;
  height: 64px;
  background: var(--gmc-surface, #1A1A1A);
  border: 2px solid var(--cat-primary, var(--gmc-border, rgba(255,255,255,.1)));
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display, sans-serif);
  font-size: var(--text-xl, 20px);
  font-weight: 900;
  color: var(--cat-primary, var(--gmc-text-dim, rgba(255,255,255,.6)));
  flex-shrink: 0;
  overflow: hidden;
}

.author-card__avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }

.author-card__info { flex: 1; }

.author-card__name {
  font-family: var(--font-display, sans-serif);
  font-size: var(--text-xl, 20px);
  font-weight: 700;
  margin-block-end: var(--space-2xs, 4px);
}

.author-card__role {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--cat-primary, var(--gmc-text-muted, #9A9A9A));
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-block-end: var(--space-sm, 12px);
}

.author-card__bio {
  font-size: var(--text-md, 14px);
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  line-height: 1.6;
}

.author-card__stats {
  display: flex;
  gap: var(--space-xl, 32px);
  margin-block-start: var(--space-md, 16px);
  padding-block-start: var(--space-md, 16px);
  border-top: 1px solid var(--gmc-border, rgba(255,255,255,.1));
}

.author-card__stat {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs, 4px);
}

.author-card__stat-value {
  font-family: var(--font-display, sans-serif);
  font-size: var(--text-2xl, 24px);
  font-weight: 800;
  color: var(--cat-primary, var(--gmc-text, #fff));
}

.author-card__stat-label {
  font-family: var(--font-code, monospace);
  font-size: var(--text-xs, 10px);
  color: var(--gmc-text-muted, #9A9A9A);
  letter-spacing: 0.06em;
}

/* ─── Archive item (horizontal list row) ──────────────────── */
.archive-item {
  background: var(--gmc-elevated, #141414);
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  border-left: 3px solid var(--cat-primary, var(--gmc-border, rgba(255,255,255,.1)));
  padding: var(--space-lg, 24px) var(--space-xl, 32px);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--space-xl, 32px);
  align-items: start;
  transition: background var(--dur-normal, 200ms) var(--ease-standard, ease);
  text-decoration: none;
  color: inherit;
}

.archive-item:hover { background: var(--gmc-surface, #1A1A1A); }

.archive-item__meta {
  display: flex;
  align-items: center;
  gap: var(--space-sm, 12px);
  margin-block-end: var(--space-sm, 12px);
}

.archive-item__title {
  font-family: var(--font-display, sans-serif);
  font-size: var(--text-2xl, 24px);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
  margin-block-end: var(--space-sm, 12px);
}

.archive-item__excerpt {
  font-size: var(--text-md, 14px);
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  line-height: 1.6;
}

.archive-item__image {
  width: 180px;
  aspect-ratio: 16/9;
  background: var(--gmc-surface, #1A1A1A);
  flex-shrink: 0;
  overflow: hidden;
}

.archive-item__image img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ─── Post hero (single.html — featured image as full-bleed hero) ── */
.post-hero {
  position: relative;
  min-height: 560px;
  background: var(--gmc-elevated, #141414);
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}

/* Breadcrumbs pinned top-left over the image */
.post-hero .post-hero__top {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 20;
  max-width: 1280px;
  margin-inline: auto;
  margin-block: 0; /* cancel WP flow-layout margin-block-start (0,2,0 beats it) */
  padding: var(--space-lg, 24px) var(--space-xl, 32px) 0;
}

.post-hero .wp-block-post-featured-image {
  position: absolute;
  inset: 0;
  margin: 0;
  z-index: 0;
}

.post-hero .wp-block-post-featured-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Scoped with two classes (0,2,0) so `margin: 0` beats WP's flow-layout
   gap rule `:root :where(.is-layout-flow) > * + *` (0,1,0) — otherwise the
   overlay drops ~24px, leaving an uncovered strip at the top of the hero. */
.post-hero .post-hero__overlay {
  position: absolute;
  inset: 0;
  margin: 0;
  z-index: 10;
  pointer-events: none;
  background: linear-gradient(
    to top,
    rgba(12, 12, 12, 0.92) 0%,
    rgba(12, 12, 12, 0.55) 45%,
    rgba(12, 12, 12, 0.15) 80%,
    rgba(12, 12, 12, 0.00) 100%
  );
}

.post-hero__content {
  position: relative;
  z-index: 20;
  width: 100%;
  max-width: 1280px;
  margin-inline: auto;
  /* Generous bottom padding lifts the block toward the vertical middle */
  padding: var(--space-4xl, 96px) var(--space-xl, 32px) calc(var(--space-4xl, 96px) + var(--space-xl, 32px));
}

.post-hero__content .wp-block-post-title {
  max-width: 880px;
  line-height: 1.05;
  letter-spacing: -0.03em;
}

/* Pills/breadcrumbs sit over the image — solid backdrop for legibility */
.post-hero .wp-block-post-terms a {
  background: rgba(12, 12, 12, 0.80);
}

.post-hero .breadcrumbs {
  background: rgba(12, 12, 12, 0.60);
  width: fit-content;
  padding: var(--space-2xs, 4px) var(--space-xs, 8px);
}

@media (max-width: 768px) {
  .post-hero { min-height: 400px; }
  .post-hero__content { padding: var(--space-2xl, 48px) var(--space-md, 16px) var(--space-xl, 32px); }
  /* The taller content stack climbs into the bright zone — heavier overlay */
  .post-hero__overlay {
    background: linear-gradient(
      to top,
      rgba(12, 12, 12, 0.95) 0%,
      rgba(12, 12, 12, 0.80) 40%,
      rgba(12, 12, 12, 0.55) 75%,
      rgba(12, 12, 12, 0.35) 100%
    );
  }
  /* Breadcrumbs wrap to 3 noisy lines over the image — category pills
     + title already carry the context on mobile */
  .post-hero .breadcrumbs { display: none; }
}

/* ─── Archive widget dropdown (wp:archives displayAsDropdown) ── */
.wp-block-archives-dropdown select {
  width: 100%;
  appearance: none;
  background-color: var(--gmc-elevated, #141414);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%239A9A9A'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right var(--space-sm, 12px) center;
  border: 1px solid var(--gmc-border, rgba(255,255,255,.1));
  color: var(--gmc-text-dim, rgba(255,255,255,.6));
  font-family: var(--font-code, monospace);
  font-size: var(--text-sm, 12px);
  padding: var(--space-sm, 12px) var(--space-xl, 32px) var(--space-sm, 12px) var(--space-md, 16px);
  cursor: pointer;
}

.wp-block-archives-dropdown select:focus {
  outline: none;
  border-color: var(--gmc-border-strong, rgba(255,255,255,.2));
}

/* ─── Responsive ──────────────────────────────────────────── */
@media (max-width: 768px) {
  .wp-block-media-text { grid-template-columns: 1fr; }
  .wp-block-columns.has-2-columns,
  .wp-block-columns.has-3-columns { grid-template-columns: 1fr; }
  .wp-block-gallery.columns-3,
  .wp-block-gallery.columns-4 { grid-template-columns: repeat(2, 1fr); }
  .gmc-sidebar { position: relative; top: 0; }
  .skeleton-grid { grid-template-columns: 1fr; }
  .featured-card { grid-template-columns: 1fr; }
  .featured-card__image { min-height: 200px; }
  .featured-card__body { padding: var(--space-lg, 24px); }
  .card-grid-magazine { grid-template-columns: 1fr; }
  .card-grid-magazine > :first-child { grid-row: auto; }
  .archive-item { grid-template-columns: 1fr; }
  .archive-item__image { display: none; }
  .author-card { flex-direction: column; }
}
