:root{
  /* Corners. The page mixes two vocabularies deliberately: pills for actions
     and fields, and hard 0px corners for content cards and dark rows. */
  --radius-none:0px;
  --radius-sm:4px;
  --radius-md:8px;
  --radius-lg:16px;
  --radius-squircle:42%;
  --radius-pill:999px;

  /* Shadows are used sparingly — a soft lift on floating actions, and a
     near-invisible card shadow. No coloured glows. */
  --shadow-none:none;
  --shadow-card:0 1px 2px rgba(0,0,0,.04);
  --shadow-raised:0 6px 18px rgba(10,9,89,.10);
  --shadow-action:0 8px 24px rgba(49,123,232,.28);

  /* Full-bleed gradients: the brand's main visual device. */
  --gradient-statement:linear-gradient(180deg,var(--cyan-550) 0%,#2993c7 46%,var(--indigo-500) 100%);
  --gradient-teal-black:linear-gradient(180deg,var(--cyan-500) 0%,var(--cyan-600) 46%,#000e0f 100%);
  --gradient-cta:linear-gradient(135deg,#187a9f 0%,#1f92a5 45%,#2cbeb3 100%); /* @kind color */
  --gradient-icon:linear-gradient(180deg,var(--accent-icon-from) 0%,var(--accent-icon-to) 100%);

  /* Protection scrim for text over photography. */
  --scrim-hero:linear-gradient(180deg,rgba(0,0,0,.42) 0%,rgba(0,0,0,.30) 55%,rgba(0,0,0,.52) 100%); /* @kind color */
  --scrim-soft:rgba(0,0,0,.28);

  /* Motion: short, eased, no bounce. */
  --ease-standard:cubic-bezier(.4,0,.2,1); /* @kind other */
  --ease-out:cubic-bezier(0,0,.2,1); /* @kind other */
  --duration-fast:120ms; /* @kind other */
  --duration-base:200ms; /* @kind other */
  --duration-slow:420ms; /* @kind other */
}
