/* DriveWhip effects — shadows, borders, gradients, motion. */

:root {
  /* Shadows — soft, warm-tinted (asphalt, not pure black) */
  --shadow-xs:  0 1px 2px rgba(18,15,13,0.06);
  --shadow-sm:  0 2px 8px rgba(18,15,13,0.08);
  --shadow-md:  0 8px 24px rgba(18,15,13,0.10);
  --shadow-lg:  0 18px 48px rgba(18,15,13,0.16);
  --shadow-orange: 0 12px 32px rgba(255,98,33,0.32); /* lifted primary CTA */

  /* Borders */
  --border-width: 1.5px;
  --border-hairline: 1px;

  /* Brand gradients — orange heat + asphalt protection */
  --gradient-heat: linear-gradient(135deg, #FF7C3F 0%, #FF6221 45%, #ED4E10 100%); /* @kind other */
  --gradient-ember: linear-gradient(160deg, #FF6221 0%, #C63D0B 100%); /* @kind other */
  /* Bottom protection scrim for text over photos/video */
  --gradient-scrim: linear-gradient(to top, rgba(18,15,13,0.92) 0%, rgba(18,15,13,0.55) 38%, rgba(18,15,13,0) 100%); /* @kind other */
  --gradient-scrim-top: linear-gradient(to bottom, rgba(18,15,13,0.85) 0%, rgba(18,15,13,0) 100%); /* @kind other */

  /* Motion — confident, slightly springy. No bounce overkill. */
  --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 */
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1); /* @kind other */
  --dur-fast:   140ms; /* @kind other */
  --dur-base:   240ms; /* @kind other */
  --dur-slow:   420ms; /* @kind other */

  /* Focus ring */
  --focus-ring: 0 0 0 3px rgba(255,98,33,0.40);
}