/* IITBHM 2026 — Effects: shadows, gradients, motifs, motion */
:root {
  /* Shadows — soft, neutral, never colored. Cards float subtly on white. */
  --shadow-sm: 0 1px 2px rgba(8,16,32,0.08);
  --shadow-md: 0 6px 18px rgba(8,16,32,0.10);
  --shadow-lg: 0 18px 48px rgba(8,16,32,0.16);
  --shadow-navy: 0 18px 44px rgba(13,40,102,0.30); /* navy cards on light */

  /* Signature diagonal streak (red→navy) — the core graphic motif.
     Used as accent bars, corner wedges, divider strokes. */
  --streak-angle: -24deg; /* @kind other */
  --gradient-streak: linear-gradient(115deg, var(--red-600) 0%, var(--red-600) 42%, var(--navy-700) 42%, var(--navy-700) 100%);
  --gradient-navy: linear-gradient(160deg, var(--navy-700) 0%, var(--navy-900) 100%);
  --gradient-navy-photo: linear-gradient(180deg, rgba(7,25,63,0) 0%, rgba(7,25,63,0.85) 78%, rgba(7,25,63,0.96) 100%); /* @kind color */

  /* Dot-texture motif (halftone) — subtle build-up on navy panels */
  --dot-color: rgba(255,255,255,0.10);
  --dot-size: 14px;

  /* Focus */
  --focus-shadow: 0 0 0 3px var(--focus-ring);

  /* Motion — crisp & athletic. Quick, slight overshoot, no lazy fades. */
  --ease-out: cubic-bezier(0.16, 0.84, 0.30, 1); /* @kind other */
  --ease-sprint: cubic-bezier(0.22, 1.20, 0.36, 1); /* @kind other */
  --dur-fast: 120ms; /* @kind other */
  --dur-base: 220ms; /* @kind other */
  --dur-slow: 420ms; /* @kind other */
}

/* Halftone dot field — apply to a navy surface for the brand texture */
.fx-dots {
  background-image: radial-gradient(var(--dot-color) 1.6px, transparent 1.7px);
  background-size: var(--dot-size) var(--dot-size);
}

/* Diagonal accent wedge — bottom-right corner of banners */
.fx-streak {
  background: var(--gradient-streak);
}