/* Axiom Design Group — "Apex Lock" section divider.
   Noisy signal traces lock, from both edges inward, into two straight rules that meet at one
   precise apex: the top edge of the next section. Built by axiom-signal.js. No pure black or white. */

:root {
  /* Brand tokens (defaults from the original Axiom WordPress site). Swap this block to re-skin. */
  --axd-bg: #212121;
  --axd-header: #232323;
  --axd-surface: #2b2b2b;
  --axd-surface-2: #333333;
  --axd-footer: #161616;
  --axd-light: #f7f5f5;
  --axd-text-on-dark: #f7f5f5;
  --axd-text-on-light: #3f3f3f;
  --axd-muted: #727272;
  --axd-accent: #fe475c;        /* coral red */
  --axd-accent-deep: #e92c48;   /* hover */
  --axd-crimson: #c42f3c;       /* logo triangle */

  /* Divider tokens: trace colours left edge / apex / right edge. If any of them lacks contrast
     against a neighbouring section (e.g. an accent-coloured row), the script automatically uses
     a monochrome trace in whichever text token contrasts more: no palette-specific tuning. */
  --axd-signal-1: var(--axd-crimson);
  --axd-signal-2: var(--axd-accent);
  --axd-signal-3: var(--axd-accent-deep);
}

.axiom-divider {
  --axd-height: clamp(96px, 11vw, 220px);
  position: relative;
  height: var(--axd-height);
  margin: -1px 0;            /* hide hairline seams between rows */
  pointer-events: none;
  overflow-x: clip;          /* never a horizontal scrollbar */
  overflow-y: visible;       /* noisy traces may spill a little into both neighbours */
  z-index: 2;
}
.axiom-divider[data-overlap="1"] {
  margin: calc(-1 * var(--axd-height)) 0 -1px;
  background: transparent !important;
}
.axiom-divider__svg {
  position: absolute;
  left: 0; top: 0;
  width: 100%;
  height: calc(100% + 2px);  /* fill bleeds 2px into the section below: no seam */
  display: block;
  overflow: visible;
}
.axiom-divider__trace { fill: none; stroke-linecap: round; stroke-linejoin: round; }