/* utilities.css - wenige, klar benannte Helfer */

@layer utilities {
  .visually-hidden {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }

  /* Vertikaler Rhythmus zwischen Geschwistern */
  .flow > * + * { margin-block-start: var(--flow-space, var(--space-4)); }

  /* Horizontale Gruppierung mit Umbruch */
  .cluster {
    display: flex;
    flex-wrap: wrap;
    gap: var(--cluster-space, var(--space-3));
    align-items: center;
  }

  .section-cta { margin-block-start: var(--space-8); }

  .text-muted { color: var(--text-muted); }
  .text-sm { font-size: var(--text-sm); }
  .mono { font-family: var(--font-mono); }

  /* Schraffur-Flaeche fuer "in Entwicklung" und "manuell zu pruefen" */
  .hatch {
    background-image: var(--hatch);
    background-color: var(--surface);
  }

  /* Konsistente Inline-Icons (stroke 1.5, currentColor, viewBox 24) */
  .icon {
    inline-size: 1.25em;
    block-size: 1.25em;
    flex: none;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
}