/* ============================================================
   P&J Investicon — Schatten, Ränder, Bewegung
   ============================================================ */
:root{
  /* Schatten — weich, weit gestreut, tief angesetzt */
  --shadow-sm:0 4px 14px -4px rgba(0,0,0,.14);
  --shadow-md:0 24px 60px -20px rgba(0,0,0,.35);   /* Standard-Karte */
  --shadow-brand:0 20px 50px -14px rgba(37,71,26,.45); /* grüne Knöpfe */
  --shadow-hair:0 0 0 1px rgba(0,0,0,.05);          /* haardünne Kontur */

  /* Ränder */
  --border-width:1px;
  --border-hair:rgba(0,0,0,.10);
  --border-dashed:1px dashed rgba(0,0,0,.10);  /* @kind other */

  /* Bewegung — ein Easing für die ganze Marke */
  --ease:cubic-bezier(.22,.61,.36,1);  /* @kind other */
  --dur-fast:.2s;    /* @kind other */
  --dur:.25s;        /* @kind other */
  --dur-slow:.45s;   /* @kind other */
  --dur-reveal:.7s;  /* @kind other */

  /* Blaupausen-Raster (Architektur-Motiv dunkler Sektionen) */
  --grid-size:88px;              /* @kind spacing */
  --grid-line:rgba(0,0,0,.10);   /* @kind color */

  /* Kompatibilität mit der Website-Vorlage */
  --schatten:var(--shadow-md);
  --schatten-blau:var(--shadow-brand);
  --linie:var(--border-hair);
  --linie-dunkel:var(--border-hair);
}