@charset "UTF-8";
/* =============================================================== *\
   Shared Entry Point

   Styles, die im Frontend und im Editor geladen werden.

   Wird nach build/shared.css kompiliert
   und in beiden Kontexten verwendet.
\* =============================================================== */
/* =============================================================== *\
   → Variablen (Farben, Spacing, Radius, Shadow)
\* =============================================================== */
:root {
  --wp--preset--color--neutral-100: #ebf6f3; /* sehr hell, fast weißlich mit Hauch Farbe */
  --wp--preset--color--neutral-200: #d9e1e0; /* zartes Grau */
  --wp--preset--color--neutral-300: #bfc7c6; /* helles Grau */
  --wp--preset--color--neutral-400: #9ea5a4; /* mittleres Grau */
  --wp--preset--color--neutral-500: #7f8685; /* gedecktes Grau */
  --wp--preset--color--neutral-600: #5f6564; /* dunkleres Grau */
  --wp--preset--color--neutral-700: #3e3e3e; /* dunkelgrau (dein Wert) */
  --wp--preset--color--neutral-800: #383838; /* fast schwarz (dein Wert) */
  --wp--preset--color--neutral-900: #2c2c2c; /* near-black */
  --box-padding: 25px;
  --kachel-padding-x: 25px;
  --header-height: 100px;
  --border-radius: 16px;
  --border-radius-small: 8px;
  --shadow-default: 3px 3px 8px #00000005;
  --shadow-medium: 3px 3px 8px #00000025;
  --shadow-dark: 3px 3px 8px #00000045;
  --shadow-soft: 0 6px 24px rgba(0, 0, 0, 0.08);
  --shadow-strong: 0 10px 40px rgba(0, 0, 0, 0.16);
  --shadow-floating: 0 12px 48px rgba(0, 0, 0, 0.1);
  --text-title-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}

/* =============================================================== *\
   Anpassungen für Mobile (Variablen)
\* =============================================================== */
@media screen and (max-width: 800px) {
  :root {
    --box-padding: 15px;
    --kachel-padding-x: 15px;
    --header-height: 54px;
    --border-radius: 8px;
  }
}
/* =============================================================== *\
   Shared Entry Point

   Styles, die im Frontend und im Editor geladen werden.

   Wird nach build/shared.css kompiliert
   und in beiden Kontexten verwendet.
\* =============================================================== */
/* =============================================================== *\
   Title
\* =============================================================== */