/* Isthmus Meridian — Effects: elevation, glow, blur, motion
   ================================================================
   The brand lives on black. Depth comes from soft blue glows and
   hairline borders — NOT heavy drop shadows. Glass tiles use blur.
*/
:root {
  /* ---- Soft ambient elevation (borderless, dark-UI tuned) ----
     On black, separation comes from a lighter surface + a soft shadow,
     never a stroke. These stack a tight contact shadow with a wide
     ambient one. */
  --shadow-sm:  0 1px 2px rgba(0,0,0,0.5);
  --shadow-md:  0 6px 20px -8px rgba(0,0,0,0.66), 0 1px 2px rgba(0,0,0,0.5);
  --shadow-lg:  0 24px 60px -20px rgba(0,0,0,0.82), 0 6px 18px -8px rgba(0,0,0,0.6);
  --shadow-card:   0 2px 6px -2px rgba(0,0,0,0.5), 0 14px 34px -16px rgba(0,0,0,0.66);   /* @kind shadow */
  --shadow-raised: 0 4px 12px -4px rgba(0,0,0,0.55), 0 22px 52px -18px rgba(0,0,0,0.74); /* @kind shadow */
  --shadow-pop:    0 12px 28px -8px rgba(0,0,0,0.6), 0 40px 84px -26px rgba(0,0,0,0.84); /* @kind shadow */

  /* ---- Signature blue glows (the brand's "light source") ---- */
  --glow-sky:    0 0 60px -6px rgba(136,193,237,0.45);   /* @kind shadow */
  --glow-steel:  0 0 80px -10px rgba(70,134,183,0.55);   /* @kind shadow */
  --glow-soft:   0 20px 80px -24px rgba(70,134,183,0.40);/* @kind shadow */
  --glow-focus:  0 0 0 3px rgba(136,193,237,0.30);       /* @kind shadow */

  /* ---- Inner sheen for glass tiles ---- */
  --sheen-top:   inset 0 1px 0 rgba(255,255,255,0.10);   /* @kind shadow */
  --sheen-edge:  inset 0 0 0 1px rgba(255,255,255,0.06); /* @kind shadow */

  /* ---- Blur ---- */
  --blur-glass:  saturate(150%) blur(20px);   /* @kind other */
  --blur-strong: saturate(170%) blur(34px);   /* @kind other */

  /* ---- Liquid glass + brushed metal materials ----
     Glass = translucent cool tint + blur + a bright specular top edge
     and a soft dark bottom edge (the refractive rim). Metal = a cool
     silver face with a diagonal sheen band. Layer the *-sheen gradient
     as a ::before/overlay above the face. */
  --glass-face:   linear-gradient(160deg, rgba(28,36,46,0.62) 0%, rgba(10,14,19,0.52) 100%);  /* @kind color */
  --glass-tint:   rgba(16,22,30,0.44);   /* @kind color */
  --glass-sheen:  linear-gradient(150deg, rgba(255,255,255,0.14) 0%, rgba(255,255,255,0.02) 26%, transparent 52%);  /* @kind color */
  --metal-face:   linear-gradient(158deg, #2b333c 0%, #171d24 34%, #10151b 62%, #1c232b 100%);  /* @kind color */
  --metal-sheen:  linear-gradient(120deg, transparent 30%, rgba(180,205,228,0.18) 47%, rgba(255,255,255,0.30) 50%, rgba(180,205,228,0.14) 53%, transparent 70%);  /* @kind color */
  --chrome-rail:  linear-gradient(180deg, #e7eef5 0%, #b7c6d4 20%, #7f909e 50%, #aab9c6 78%, #5f6d79 100%);  /* @kind color */

  /* Specular rim: bright hairline on top, faint dark on the bottom */
  --edge-specular: inset 0 1px 0 rgba(255,255,255,0.22), inset 0 -1px 0 rgba(0,0,0,0.35);   /* @kind shadow */
  --edge-glass:    inset 0 1px 0 rgba(255,255,255,0.16), inset 0 0 0 1px rgba(255,255,255,0.05);   /* @kind shadow */
  --edge-metal:    inset 0 1px 0 rgba(255,255,255,0.14), inset 0 -1px 1px rgba(0,0,0,0.5), 0 1px 0 rgba(255,255,255,0.03);   /* @kind shadow */

  /* ---- Motion — slow, cinematic, no bounce ---- */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);     /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);     /* @kind other */
  --dur-fast:    140ms;   /* @kind other */
  --dur-base:    240ms;   /* @kind other */
  --dur-slow:    420ms;   /* @kind other */
  --dur-cinema:  900ms;   /* @kind other */
}