/* TrakCorp effects — glass, hairlines, green glow, premium easing. */

:root {
  /* ---- Radii ---------------------------------------------------------- */
  --radius-pill: 999px;        /* badges, chips, tab rail */
  --radius-sm: 0.5rem;         /* buttons, inputs, small chips */
  --radius-icon: 10px;         /* 36px contact icon chip */
  --radius-chip: 12px;         /* 38px card icon chip */
  --radius-panel: 14px;        /* panels inside mocks */
  --radius-card: 1rem;         /* work cards, app cards */
  --radius-mock: 16px;         /* device / browser mock */
  --radius-portrait: 24px;     /* founder portrait */
  --radius-glass: 2rem;        /* glass section cards */

  /* ---- Glass ---------------------------------------------------------- */
  --glass-bg: linear-gradient(135deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.01) 100%); /* @kind color */
  --glass-border: hsl(0 0% 100% / 0.12);
  --glass-blur: blur(20px) saturate(150%); /* @kind other */
  --glass-shadow: inset 0 1px 0 0 rgba(255,255,255,0.05), 0 4px 20px -4px rgba(0,0,0,0.15);

  /* ---- Shadows -------------------------------------------------------- */
  --shadow-card: 0 2px 10px -2px hsl(0 0% 100% / 0.03);
  --shadow-elegant: 0 4px 20px -4px hsl(0 0% 100% / 0.05);
  --shadow-mock: 0 40px 80px -30px rgba(0,0,0,0.7);   /* floating product mock */
  --shadow-lift-glass: 0 20px 50px -20px rgba(34,197,94,0.25), inset 0 1px 0 0 rgba(255,255,255,0.05);
  --shadow-lift-card: 0 20px 40px -20px rgba(34,197,94,0.25);

  /* ---- Green glow (interaction only) ---------------------------------- */
  --glow-button-hover: 0 0 30px rgba(34,197,94,0.6);
  --glow-outline-hover: 0 0 20px rgba(34,197,94,0.3);
  --glow-dot: 0 0 12px rgba(52,211,153,0.8);
  --glow-rule: 0 0 14px rgba(52,211,153,0.5);
  --glow-success: 0 0 40px hsl(134 50% 40% / 0.35);

  /* ---- Motion --------------------------------------------------------- */
  --ease-premium: cubic-bezier(0.16, 1, 0.3, 1);          /* @kind other */
  --ease-elegant: cubic-bezier(0.25, 0.46, 0.45, 0.94);   /* @kind other */
  --transition-smooth: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --transition-elegant: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94); /* @kind other */
  --duration-fast: 0.2s;   /* @kind other */
  --duration-base: 0.3s;   /* @kind other */
  --duration-reveal: 0.9s; /* @kind other */
  --lift: translateY(-6px);            /* @kind other */
  --reveal-from: translateY(28px);     /* @kind other */
  --stagger-step: 110ms;               /* @kind other */
}