/**
 * Core WordPress block surfaces — brand-aligned visuals only.
 * Layout width (default / wide / full) comes from theme.json + Core constrained layout.
 *
 * Scope matches typography.css: front main + block editor canvas.
 */

@layer blocks {
  :is(main#main, .editor-styles-wrapper) {
    /* Block gap comes from theme.json + is-layout-constrained; keep margins off here. */
    .wp-block-post-content > .wp-block-list,
    .wp-block-post-content > .wp-block-quote,
    .wp-block-post-content > .wp-block-pullquote,
    .wp-block-post-content > .wp-block-image,
    .wp-block-post-content > .wp-block-gallery,
    .wp-block-post-content > .wp-block-columns,
    .wp-block-post-content > .wp-block-media-text,
    .wp-block-post-content > .wp-block-table,
    .wp-block-post-content > .wp-block-verse,
    .wp-block-post-content > .wp-block-video,
    .wp-block-post-content > .wp-block-file,
    .wp-block-post-content > .wp-block-embed {
      margin-block: 0;
    }

    /* ─── lists ───────────────────────────────────────────── */
    .wp-block-list {
      padding-inline-start: 1.25em;
    }

    .wp-block-list li {
      margin-block: 0.35em;
    }

    .wp-block-list :is(ul, ol) {
      margin-block: 0.5em 0;
    }

    .wp-block-list ::marker {
      color: var(--ink-muted);
    }

    /* ─── quote / pullquote ────────────────────────────────── */
    .wp-block-quote {
      margin: 0;
      padding: 0.25em 0 0.25em 1.1em;
      border-left: 3px solid var(--accent);
    }

    .wp-block-quote cite {
      display: block;
      margin-top: 0.75em;
      font-family: var(--sans);
      font-size: var(--fs-micro);
      font-style: normal;
      font-weight: 500;
      color: var(--ink-muted);
      letter-spacing: 0.04em;
      text-transform: uppercase;
    }

    .wp-block-pullquote {
      text-align: center;
      border-top: 1px solid var(--hairline);
      border-bottom: 1px solid var(--hairline);
      padding-block: clamp(20px, 3vw, 36px);
    }

    .wp-block-pullquote blockquote {
      margin: 0;
      font-family: var(--serif);
      font-size: clamp(1.15rem, 1rem + 0.6vw, 1.45rem);
      line-height: 1.35;
      color: var(--ink);
    }

    .wp-block-pullquote blockquote p {
      margin: 0;
    }

    /* ─── separator (wide + dots; default rule stays in typography.css) ─ */
    hr.wp-block-separator.is-style-wide {
      max-width: none;
      width: 100%;
      height: 1px;
      border: none;
      background: var(--hairline);
      margin: clamp(40px, 6vh, 72px) auto;
      opacity: 1;
    }

    hr.wp-block-separator.is-style-dots {
      max-width: none;
      width: 100%;
      height: auto;
      border: none;
      background: none;
      text-align: center;
      margin: clamp(40px, 6vh, 72px) auto;
      opacity: 1;
    }

    hr.wp-block-separator.is-style-dots::before {
      color: var(--ink-muted);
      letter-spacing: 1.5em;
      padding-left: 1.5em;
    }

    /* ─── image / gallery ─────────────────────────────────── */
    .wp-block-image figcaption,
    .wp-block-gallery .blocks-gallery-caption,
    .wp-block-video figcaption {
      margin-top: 0.6em;
      font-family: var(--sans);
      font-size: var(--fs-micro);
      color: var(--ink-muted);
      text-align: center;
      line-height: 1.4;
    }

    .wp-block-image:not(.alignfull) img,
    .wp-block-gallery .wp-block-image img,
    .wp-block-video video {
      border-radius: min(18px, var(--radius-card));
    }

    .wp-block-gallery {
      gap: var(--layout-gap-three);
    }

    /* ─── buttons (layout only; colours + shape in core-button-styles.css) ─ */
    .wp-block-buttons {
      display: flex;
      flex-wrap: wrap;
      gap: var(--btn-group-gap);
    }

    /* ─── cover ───────────────────────────────────────────── */
    .wp-block-cover {
      border-radius: 0;
    }

    .wp-block-cover .wp-block-cover__inner-container {
      color: var(--canvas);
      width: 100%;
      max-width: var(--layout-max-main);
      margin-inline: auto;
      padding-inline: var(--pad-x);
    }

    .wp-block-cover .wp-block-heading,
    .wp-block-cover .wp-block-paragraph {
      color: inherit;
    }

    .wp-block-cover.alignfull .wp-block-cover__inner-container {
      max-width: min(
        calc(100% - 2 * var(--pad-x)),
        var(--wp--style--global--wide-size, var(--layout-max-main))
      );
    }

    /* ─── columns ─────────────────────────────────────────── */
    .wp-block-columns {
      gap: var(--layout-gap-split);
    }

    @media (max-width: 781px) {
      .wp-block-columns:not(.is-not-stacked-on-mobile) {
        gap: var(--section-mobile-top);
      }
    }

    /* ─── media & text ───────────────────────────────────── */
    .wp-block-media-text {
      gap: var(--layout-gap-split);
    }

    .wp-block-media-text__media img {
      border-radius: min(18px, var(--radius-card));
    }

    /* ─── table ───────────────────────────────────────────── */
    .wp-block-table {
      margin: 0;
    }

    .wp-block-table table {
      width: 100%;
      border-collapse: collapse;
      font-variant-numeric: tabular-nums;
    }

    .wp-block-table th {
      font-family: var(--sans);
      font-size: var(--fs-ui);
      font-weight: 600;
      text-align: left;
      padding: 0.65em 0.75em;
      border-bottom: 2px solid var(--ink);
    }

    .wp-block-table td {
      padding: 0.65em 0.75em;
      border-bottom: 1px solid var(--hairline);
    }

    .wp-block-table tbody tr:last-child td {
      border-bottom: none;
    }

    /* ─── code / preformatted / verse ─────────────────────── */
    .wp-block-code {
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
      font-size: 0.9em;
      line-height: 1.55;
      padding: 1em 1.15em;
      border-radius: 14px;
      background: var(--parchment);
      color: var(--ink-soft);
      border: 1px solid var(--hairline);
    }

    .wp-block-code code {
      font-family: inherit;
      background: transparent;
      padding: 0;
    }

    .wp-block-preformatted {
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
      font-size: 0.88em;
      line-height: 1.6;
      color: var(--ink-soft);
      white-space: pre-wrap;
    }

    .wp-block-verse {
      font-family: var(--serif);
      font-style: italic;
      color: var(--ink-muted);
      white-space: pre-wrap;
      line-height: 1.65;
    }

    /* ─── details ─────────────────────────────────────────── */
    .wp-block-details {
      border: 1px solid var(--hairline);
      border-radius: 14px;
      padding: 0.75em 1em 1em;
      background: color-mix(in srgb, var(--parchment) 35%, var(--canvas));
    }

    .wp-block-details summary {
      cursor: pointer;
      font-family: var(--sans);
      font-weight: 600;
      font-size: var(--fs-ui);
      letter-spacing: -0.01em;
      list-style-position: outside;
      color: var(--ink);
      transition: color var(--motion-snappy);
    }

    @media (hover: hover) {
      .wp-block-details summary:hover {
        color: var(--accent);
      }
    }

    .wp-block-details > :not(summary) {
      margin-top: 0.85em;
    }

    /* ─── embed ───────────────────────────────────────────── */
    .wp-block-embed .wp-block-embed__wrapper {
      border-radius: min(14px, var(--radius-card));
      overflow: hidden;
    }

    /* ─── video / file ─────────────────────────────────────── */
    .wp-block-video {
      margin: 0;
    }

    .wp-block-file {
      align-items: center;
    }

    .wp-block-file :not(.wp-element-button):not(.wp-block-file__button) {
      font-family: var(--sans);
      font-weight: 500;
    }

    .wp-block-file__button.wp-element-button,
    .wp-block-file .wp-block-file__button {
      background: transparent;
      color: var(--ink);
      border: 1px solid var(--btn-rule);
      border-radius: var(--radius-pill);
      font-family: var(--sans);
      font-weight: 500;
      font-size: var(--fs-micro);
      padding: 10px 18px;
    }

    @media (hover: hover) {
      .wp-block-file__button.wp-element-button:hover,
      .wp-block-file .wp-block-file__button:hover {
        background: color-mix(in srgb, var(--parchment) 88%, var(--canvas));
        border-color: var(--ink);
        opacity: 1;
        color: var(--ink);
      }
    }

    .wp-block-spacer {
      clear: both;
    }
  }
}

/*
 * Unlayered: sibling gap for core text blocks in post content + editor root.
 * theme.json blockGap drives is-layout-constrained globally; this mirrors it where
 * typography heading resets would otherwise leave p / heading stacks flush.
 */
:is(main#main, .editor-styles-wrapper)
  :is(
    .wp-block-post-content,
    .entry-content,
    .block-editor-block-list__layout.is-root-container
  )
  > * + * {
  margin-block-start: var(--wp--style--block-gap, 1.25em);
}