/* ============================================================
   Agentic Punks — Pattern & motif utilities
   The zine toolkit: grain, trim, torn edges, halftone, wedge,
   stamps, stickers, display type. Class-based because these are
   foundational texture/layout primitives reused everywhere.
   Verbatim aus dem Design-System (patterns.css).
   ============================================================ */

/* Grain / risograph noise overlay — drop on any panel via .grain */
.ap-grain { position: relative; }
.ap-grain::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.07;
  mix-blend-mode: multiply;
  background-image:
    radial-gradient(rgba(0,0,0,0.8) 1px, transparent 1px),
    radial-gradient(rgba(0,0,0,0.6) 1px, transparent 1px);
  background-size: 3px 3px, 7px 7px;
  background-position: 0 0, 1px 2px;
}

/* Halftone dot field */
.ap-halftone {
  background-image: radial-gradient(circle, var(--ink) 1.5px, transparent 2px);
  background-size: 8px 8px;
}

/* Red trim bar (top edge accent) */
.ap-trim {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 14px;
  background: var(--red);
  z-index: 3;
}
.ap-trim.bottom { top: auto; bottom: 0; }

/* Torn paper edge strip */
.ap-torn {
  position: absolute;
  left: 0; right: 0;
  height: 22px;
  background: var(--cream);
  clip-path: polygon(
    0 0, 3% 70%, 6% 20%, 9% 80%, 12% 30%, 15% 90%, 18% 40%, 21% 75%,
    24% 25%, 27% 85%, 30% 35%, 33% 70%, 36% 20%, 39% 80%, 42% 30%, 45% 90%,
    48% 40%, 51% 75%, 54% 25%, 57% 85%, 60% 35%, 63% 70%, 66% 20%, 69% 80%,
    72% 30%, 75% 90%, 78% 40%, 81% 75%, 84% 25%, 87% 85%, 90% 35%, 93% 70%,
    96% 20%, 100% 60%, 100% 100%, 0 100%
  );
}
.ap-torn.top { top: 0; }

/* Chunky red wedge (hero shape / logo backdrop) */
.ap-wedge {
  background: var(--red);
  clip-path: polygon(0 0, 100% 0, 68% 100%, 32% 100%);
}

/* Display headline */
.ap-display {
  font-family: var(--font-display);
  font-weight: 400;
  line-height: var(--lh-display);
  letter-spacing: var(--tracking-tight);
  color: var(--ink);
  text-transform: uppercase;
  margin: 0;
}
.ap-display.outline {
  -webkit-text-stroke: 2px var(--ink);
  color: transparent;
}

/* Uppercase mono eyebrow / section slug */
.ap-slug {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: var(--fs-label);
  letter-spacing: var(--tracking-slug);
  text-transform: uppercase;
  color: var(--muted);
}

/* Marker highlight (red felt-tip swipe under text) */
.ap-hl {
  background: linear-gradient(180deg, transparent 60%, rgba(193,39,45,0.35) 60%, rgba(193,39,45,0.35) 92%, transparent 92%);
  padding: 0 2px;
}

/* Rule accents */
.ap-rule { border: 0; border-top: 2px solid var(--ink); margin: 24px 0; }
.ap-rule.red { border: 0; height: 6px; background: var(--red); }
.ap-rule.thin { border-top: 1px solid var(--ink); opacity: 0.4; margin: 24px 0; }

/* Diamond dot (mark bullet) */
.ap-dot {
  display: inline-block;
  width: 10px; height: 10px;
  background: var(--red);
  transform: rotate(45deg);
}

/* Default link styling */
a { color: var(--link); text-decoration: none; }
a:hover { color: var(--link-hover); }
