/* CSI Effects — shadows, borders, transitions, patterns */
:root{
  /* Elevation — soft, cool-tinted (navy-based) shadows, never black */
  --shadow-xs:0 1px 2px rgba(22,22,83,.06);
  --shadow-sm:0 2px 8px rgba(22,22,83,.08);
  --shadow-md:0 8px 24px rgba(22,22,83,.10);
  --shadow-lg:0 18px 48px rgba(22,22,83,.14);
  --shadow-focus:0 0 0 3px rgba(0,48,240,.28);

  /* Borders */
  --border-hairline:1px solid var(--csi-line);
  --border-card:1px solid var(--csi-line);
  --border-teal:1.5px solid var(--csi-teal);

  /* Motion — brand feel is precise & quick, subtle ease, no bounce */
  --ease-standard:cubic-bezier(.4,0,.2,1); /* @kind other */
  --ease-out:cubic-bezier(.2,.7,.2,1); /* @kind other */
  --dur-fast:120ms; /* @kind other */
  --dur-base:200ms; /* @kind other */
  --dur-slow:340ms; /* @kind other */
  --dur-micro:180ms; /* @kind other — hover/press/cursor micro-interactions */
  --dur-reveal:600ms; /* @kind other — section entrances */
  --ease-brand:cubic-bezier(.2,.7,.2,1); /* @kind other — entrance easing */
  --stagger:90ms; /* @kind other — entrance stagger step */
  --ease-micro:cubic-bezier(.4,0,.2,1); /* @kind other */

  /* Signature dot-grid pattern (blue-grey dots on light) */
  --dot-grid:radial-gradient(var(--csi-bluegrey) 1.4px,transparent 1.5px); /* @kind other */
  --dot-grid-size:16px 16px; /* @kind spacing */
}

/* Utility: the CSI dot-grid backdrop */
.csi-dotgrid{background-image:var(--dot-grid);background-size:var(--dot-grid-size)}

/* Section-entrance primitives — scoped to .anim (load) / .anim-scroll (scroll) page states.
   Transform + opacity only; trigger once via one shared IntersectionObserver adding .in. */
.rv-mask{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.anim-scroll .rv-line{display:block;transform:translateY(110%);transition:transform var(--dur-reveal) var(--ease-brand);transition-delay:var(--rd,calc(var(--i,0)*var(--stagger)))}
.rv-line{display:block}
.anim-scroll .rv-h.in .rv-line{transform:none}
.rv-m{overflow:hidden}
.anim-scroll .rv-m>img{transform:scale(1.08);transition:transform var(--dur-reveal) var(--ease-brand);transition-delay:var(--rd,0ms)}
.anim-scroll .rv-m.in>img{transform:none}
@media (prefers-reduced-motion:reduce){.anim-scroll .rv-line,.anim-scroll .rv-m>img{transition:none!important;transform:none!important}}