/* Nature Connect — Effects: radius, teardrop, shadow, motion
   The teardrop and the circle are the brand's two foundation shapes (brand
   guide p.22). Use them deliberately and let them read strongly: teardrop
   icon chips, teardrop bullets, circular avatars and badges. */

:root {
  /* Corner radii — soft, friendly, never sharp on containers */
  --radius-xs:  6px;
  --radius-sm:  10px;
  --radius-md:  16px;
  --radius-lg:  25px;   /* images, cards, panels — the house radius */
  --radius-xl:  32px;
  --radius-pill: 999px;
  --radius-circle: 50%;

  /* Teardrop motif.
     --radius-teardrop: rounded-shoulder teardrop via border-radius. The element
     is rotated -45deg so the sharp corner points UP; counter-rotate inner
     content with transform: rotate(45deg). For a precise teardrop use
     assets/shapes/teardrop.svg as a mask-image instead. */
  --radius-teardrop: 0 50% 50% 50%;
  --mask-teardrop: url('assets/shapes/teardrop.svg');  /* @kind other */

  /* Shadows — soft, indigo-tinted, low and natural. No harsh black. */
  --shadow-xs: 0 1px 2px rgba(43, 62, 120, 0.06);
  --shadow-sm: 0 2px 6px rgba(43, 62, 120, 0.08);
  --shadow-md: 0 8px 20px rgba(43, 62, 120, 0.10);
  --shadow-lg: 0 18px 40px rgba(43, 62, 120, 0.14);
  --shadow-focus: 0 0 0 3px rgba(70, 209, 241, 0.45);

  /* Print/report page sidebar — thin indigo bar down the outer edge of a
     printed page (Integrated Report pattern). Pair with a white page and
     generous inner margin. */
  --print-sidebar-width: 14px;
  --print-sidebar-color: var(--nc-indigo);

  /* Motion — gentle, natural. Fades and soft eases, no bounces. */
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);  /* @kind other */
  --ease-in-out: cubic-bezier(0.45, 0, 0.25, 1);  /* @kind other */
  --dur-fast: 140ms;  /* @kind other */
  --dur-base: 220ms;  /* @kind other */
  --dur-slow: 360ms;  /* @kind other */
}
