/*
Theme Name: Design by Munk
Theme URI: https://design-by-munk.com
Description: Design by Munk child theme — brand tokens, self-hosted fonts, editorial layout. Layout is CSS we own; content stays block-editable. Keep in sync with ../../brand/tokens.json (run: python tools/brand_tokens.py --emit css).
Author: Design by Munk
Template: twentytwentyfive
Version: 0.36.0
Requires at least: 6.5
Tested up to: 6.8
Text Domain: dbm
*/

/* Brand tokens — generated from brand/tokens.json. Do not edit by hand; re-emit. */
@import url("tokens.css");

:root {
  --dbm-measure: 68ch;          /* body line length ~50–75 chars */
  --dbm-rule: 2px solid var(--dbm-accent);
}

/* --- base --- */
html, body { overflow-x: hidden; max-width: 100%; }
* { min-width: 0; }
body {
  background: var(--dbm-bg-solid);
  color: var(--dbm-text);
  font-family: var(--dbm-font-body);
  line-height: 1.6;
  overflow-wrap: break-word;
}
h1, h2, h3 { overflow-wrap: break-word; hyphens: none; }
/* atmospheric ground: navy->plum plus a low amber glow bleeding off the top-left */
.wp-site-blocks {
  background:
    radial-gradient(60rem 40rem at 12% -10%, rgba(217,118,6,0.14), transparent 60%),
    var(--dbm-bg);
}

/* --- type scale: real jumps, heavy display --- */
h1, .dbm-hook  { font-size: clamp(2.6rem, 7vw, 5.5rem); }
h2             { font-size: clamp(1.9rem, 4vw, 3rem); margin-top: 2.5em; }
h3             { font-size: clamp(1.3rem, 2.4vw, 1.7rem); }
h1, h2, h3, .dbm-hook {
  font-family: var(--dbm-font-hook);
  text-transform: uppercase;
  letter-spacing: 0.01em;
  line-height: 1.02;
}
.dbm-kicker, .dbm-label, .wp-block-button__link {
  font-family: var(--dbm-font-label);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

p, li { max-width: var(--dbm-measure); }

/* --- amber hairline dividers, never boxes --- */
.dbm-divider,
.wp-block-separator { border: 0; border-top: var(--dbm-rule); opacity: 1; max-width: 96px; }

/* --- CTA --- */
.wp-block-button__link {
  background: transparent;
  color: var(--dbm-accent);
  border: var(--dbm-rule);
  border-radius: 0;
  padding: 0.7em 1.4em;
}
.wp-block-button__link:hover { background: var(--dbm-accent); color: var(--dbm-bg-solid); }

/* --- editorial: asymmetric, generous --- */
.dbm-asym { display: grid; grid-template-columns: 1fr; gap: clamp(1.5rem, 4vw, 4rem); }
@media (min-width: 900px) { .dbm-asym { grid-template-columns: 7fr 5fr; } }

.dbm-proof { display: flex; flex-wrap: wrap; gap: 2rem; font-family: var(--dbm-font-label); }
.dbm-proof strong { display: block; font-size: 2rem; color: var(--dbm-accent); }

img { max-width: 100%; height: auto; }
.wp-block-image figure, .wp-block-image { margin-inline: 0; }
.wp-block-image img { max-height: 78vh; width: auto; }

/* --- FAQ (details/summary, no JS) --- */
.dbm-faq details {
  border-top: 1px solid rgba(235,235,235,0.18);
  padding: 1rem 0;
}
.dbm-faq summary {
  font-family: var(--dbm-font-label);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-size: 1.1rem;
  cursor: pointer;
  list-style: none;
}
.dbm-faq summary::-webkit-details-marker { display: none; }
.dbm-faq summary::after { content: " +"; color: var(--dbm-accent); }
.dbm-faq details[open] summary::after { content: " –"; }

/* --- sticky mobile CTA --- */
@media (max-width: 768px) {
  .wp-site-blocks { padding-bottom: 4rem; }
}

/* --- one orchestrated page-load reveal (respects reduced-motion) --- */
@media (prefers-reduced-motion: no-preference) {
  .entry-content > *, .wp-block-post-content > * {
    opacity: 0;
    transform: translateY(12px);
    animation: dbm-rise 0.6s cubic-bezier(0.2, 0.7, 0.2, 1) forwards;
  }
  .entry-content > *:nth-child(1){animation-delay:.05s}
  .entry-content > *:nth-child(2){animation-delay:.12s}
  .entry-content > *:nth-child(3){animation-delay:.19s}
  .entry-content > *:nth-child(4){animation-delay:.26s}
  .entry-content > *:nth-child(5){animation-delay:.33s}
  .entry-content > *:nth-child(n+6){animation-delay:.4s}
  @keyframes dbm-rise { to { opacity: 1; transform: none; } }
}
