/* PelycanFeedback – gemeinsames Fundament */

@font-face {
  font-family: 'Fraunces';
  src: url('/fonts/fraunces-latin-full-normal.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fraunces';
  src: url('/fonts/fraunces-latin-full-italic.woff2') format('woff2');
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Archivo';
  src: url('/fonts/archivo-latin-400-normal.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Archivo';
  src: url('/fonts/archivo-latin-500-normal.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Archivo';
  src: url('/fonts/archivo-latin-600-normal.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Archivo';
  src: url('/fonts/archivo-latin-700-normal.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
}

:root {
  /* Tinte & Papier */
  --ink: #0c1a2a;
  --ink-2: #122438;
  --ink-3: #1b3350;
  --paper: #f6f1e7;
  --paper-2: #efe7d8;
  --paper-3: #e5dac5;
  --muted: #8195ab;
  --muted-dark: #5c6f85;

  /* Signalfarben */
  --teal: #3ecfb2;
  --amber: #f2b33d;
  --coral: #f2705b;
  --blue: #5ba8f5;
  --rose: #e58fb1;

  --font-display: 'Fraunces', Georgia, serif;
  --font-ui: 'Archivo', 'Helvetica Neue', sans-serif;

  --radius: 14px;
  --shadow-card: 0 2px 6px rgba(12, 26, 42, .12), 0 12px 32px rgba(12, 26, 42, .10);
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font-ui);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
button, input, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; }
a { color: inherit; }

/* Kleine Bausteine */
.pulse-dot {
  display: inline-block; width: .55em; height: .55em; border-radius: 50%;
  background: var(--teal); animation: pulse 2s ease-out infinite;
}
@keyframes pulse {
  0% { box-shadow: 0 0 0 0 rgba(62, 207, 178, .55); }
  70% { box-shadow: 0 0 0 .6em rgba(62, 207, 178, 0); }
  100% { box-shadow: 0 0 0 0 rgba(62, 207, 178, 0); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}