/* =========================================================================
 * BM Starter: Frontend global styles
 * Page-template-level styling (post archive, single post, 404, etc.)
 * Block-level styling lives in /blocks/<name>/style.css.
 * Plugin block styling lives in the bmuller-blocks plugin.
 * ========================================================================= */

:root {
  --bms-bg:      var(--wp--preset--color--bg, #F1F2F3);
  --bms-bg-card: var(--wp--preset--color--bg-card, #FFFFFF);
  --bms-ink:     var(--wp--preset--color--ink, #1A1915);
  --bms-ink-2:   var(--wp--preset--color--ink-2, #4A4740);
  --bms-ink-3:   var(--wp--preset--color--ink-3, #8B867C);
  --bms-rule:    var(--wp--preset--color--rule, #DCDFE2);
  --bms-accent:  var(--wp--preset--color--accent, #B8694A);
  --bms-green:   var(--wp--preset--color--green, #3F6B3A);
}

body {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  color: var(--bms-ink);
  background: var(--bms-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* ---- Single post ---- */

.bms-single-header {
  padding: 64px 40px 40px;
  text-align: center;
}
.bms-single-meta {
  font-family: ui-monospace, Menlo, monospace;
  font-size: 11.5px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--bms-ink-3);
  margin-bottom: 8px;
}
.bms-single-title {
  font-family: 'Inter Tight', 'SF Pro Display', sans-serif;
  font-weight: 600;
  font-size: clamp(32px, 4vw, 56px);
  letter-spacing: -0.034em;
  line-height: 1.05;
  max-width: 24ch;
  margin: 8px auto 0;
  text-wrap: balance;
}
.bms-single-featured {
  margin: 32px auto 48px;
  max-width: 1240px;
  border-radius: 14px;
  overflow: hidden;
}
.bms-single-content {
  padding: 0 40px 80px;
}
.bms-single-content p,
.bms-single-content ul,
.bms-single-content ol {
  font-size: 17px;
  line-height: 1.7;
  color: var(--bms-ink-2);
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}
.bms-single-content h2,
.bms-single-content h3 {
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 48px;
}

/* ---- Index / archive / search ---- */

.bms-page-main { padding: 64px 0 80px; }

.bms-index-header {
  padding: 0 40px 48px;
  text-align: center;
}
.bms-index-eyebrow {
  font-family: ui-monospace, Menlo, monospace;
  font-size: 11.5px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--bms-accent);
  margin-bottom: 12px;
}
.bms-index-title {
  font-family: 'Inter Tight', 'SF Pro Display', sans-serif;
  font-weight: 600;
  font-size: clamp(36px, 4.4vw, 56px);
  letter-spacing: -0.034em;
  line-height: 1.05;
  margin: 0 auto;
  max-width: 22ch;
  text-wrap: balance;
}

.bms-card-body {
  padding: 16px 24px 32px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.bms-card-body .wp-block-post-date {
  font-family: ui-monospace, Menlo, monospace;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--bms-ink-3);
}
.bms-card-body .wp-block-post-title {
  font-family: 'Inter Tight', sans-serif;
  font-weight: 600;
  font-size: 22px;
  letter-spacing: -0.022em;
  line-height: 1.2;
  margin: 0;
}
.bms-card-body .wp-block-post-title a {
  color: var(--bms-ink);
  text-decoration: none;
}
.bms-card-body .wp-block-post-title a:hover {
  color: var(--bms-accent);
}
.bms-card-body .wp-block-post-excerpt {
  font-size: 14.5px;
  color: var(--bms-ink-2);
  line-height: 1.55;
  margin: 0;
}

/* ---- 404 ---- */

.bms-404 {
  text-align: center;
  padding: 120px 40px;
  max-width: 600px;
  margin: 0 auto;
}
.bms-404-eyebrow {
  font-family: ui-monospace, Menlo, monospace;
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--bms-accent);
  margin: 0 0 16px;
}
.bms-404-title {
  font-family: 'Inter Tight', sans-serif;
  font-weight: 600;
  font-size: clamp(40px, 5vw, 64px);
  letter-spacing: -0.034em;
  line-height: 1.05;
  margin: 0 0 16px;
}
.bms-404-body {
  font-size: 16px;
  color: var(--bms-ink-2);
  line-height: 1.55;
  margin: 0 0 32px;
}

/* Pagination */
.wp-block-query-pagination {
  margin-top: 56px;
  font-family: ui-monospace, Menlo, monospace;
  font-size: 13px;
  letter-spacing: 0.06em;
}
.wp-block-query-pagination a {
  color: var(--bms-ink-2);
  text-decoration: none;
  padding: 0 8px;
}
.wp-block-query-pagination a:hover {
  color: var(--bms-accent);
}
.wp-block-query-pagination-numbers .page-numbers.current {
  color: var(--bms-accent);
  font-weight: 600;
}

/* Search form */
.bms-search-form {
  max-width: 480px;
  margin: 32px auto 0;
}
.bms-search-form .wp-block-search__inside-wrapper {
  border-radius: 999px;
  border: 1px solid var(--bms-rule);
  background: var(--bms-bg-card);
  padding: 4px;
}
.bms-search-form input {
  border: 0;
  background: transparent;
  padding: 8px 16px;
  font-size: 14px;
  color: var(--bms-ink);
  flex: 1;
  outline: none;
}
.bms-search-form button {
  background: var(--bms-ink);
  color: #fff;
  border: 0;
  border-radius: 999px;
  padding: 10px 20px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
}
.bms-search-form button:hover {
  background: var(--bms-accent);
}

/* ---- Page template (with title) ---- */

.bms-page-header {
  padding: 80px 40px 48px;
  text-align: center;
  border-bottom: 1px solid var(--bms-rule);
}
.bms-page-title {
  font-family: 'Inter Tight', 'SF Pro Display', sans-serif;
  font-weight: 600;
  font-size: clamp(36px, 4.4vw, 56px);
  letter-spacing: -0.034em;
  line-height: 1.05;
  margin: 0;
  max-width: 22ch;
  margin-left: auto;
  margin-right: auto;
  text-wrap: balance;
}

/* ---- Per-page settings: footer gap (off by default) ---- */
/* The footer normally sits flush against the page content, so full-bleed CTA
   banners flow directly into the dark footer with no awkward gap. Pages that
   would benefit from a margin (blog posts, About) opt in via the
   "Show footer gap" toggle in the Brandmuller sidebar panel. */

/* Default — no gap. */
.bms-footer-wrap { margin-top: 0; }
footer.wp-block-template-part,
.wp-site-blocks > footer.wp-block-template-part,
.wp-block-template-part { margin-block-start: 0; }

/* Opt in — page meta _bms_footer_gap = true adds the bms-footer-gap class. */
body.bms-footer-gap .bms-footer-wrap { margin-top: 80px; }
body.bms-footer-gap footer.wp-block-template-part,
body.bms-footer-gap .wp-site-blocks > footer.wp-block-template-part,
body.bms-footer-gap .wp-block-template-part { margin-block-start: 24px; }
