/* GoldCare — Effects: radii, shadows, motion, z-index.
 *
 * Flat by default. Elevation comes from BORDER + surface color, never
 * drop-shadow soup. Shadows are reserved for the one or two "showcase" cards
 * (offer / pricing). Motion is calm: 150–300ms ease-out, no bounces/springs.
 */

:root {
  /* ============================================================
   * RADII
   * ============================================================ */
  --radius-sm:   6px;    /* inputs */
  --radius-md:   10px;   /* small buttons, chips */
  --radius-lg:   12px;   /* DEFAULT — buttons, primary CTAs, tabs */
  --radius-xl:   16px;   /* cards, feature tiles */
  --radius-2xl:  20px;   /* large content cards */
  --radius-3xl:  24px;   /* hero / offer showcase cards */
  --radius-pill: 9999px; /* eyebrow pills, badges, avatars, icon circles */

  /* Legacy fine-grain (portal chips / skeletons) */
  --radius-2:  2px;
  --radius-4:  4px;
  --radius-8:  8px;

  /* ============================================================
   * SHADOWS — flat by default; never stack multiple
   * ============================================================ */
  --shadow-card-soft: 0 4px 18px rgba(0, 0, 0, 0.07);          /* elevated soft card */
  --shadow-gold-glow: 0 4px 15px rgba(241, 170, 65, 0.16);     /* hero premium glow */
  /* Showcase / offer card — the loudest elevation in the system */
  --shadow-showcase:  0 34px 70px -34px rgba(241, 170, 65, 0.34),
                      0 16px 38px -22px rgba(12, 12, 13, 0.16);
  --shadow-icon-btn:  0 2px 8px rgba(0, 0, 0, 0.10);

  /* ============================================================
   * MOTION — calm and purposeful
   * ============================================================ */
  /* Motion durations */
  --duration-fast:   150ms; /* @kind other */
  --duration-normal: 200ms; /* @kind other */
  --duration-slow:   300ms; /* @kind other */

  --easing-out:    cubic-bezier(0, 0, 0.2, 1);     /* @kind other */
  --easing-in:     cubic-bezier(0.4, 0, 1, 1);     /* @kind other */
  --easing-in-out: cubic-bezier(0.4, 0, 0.2, 1);   /* @kind other */

  /* ============================================================
   * Z-INDEX
   * ============================================================ */
  /* Layers */
  --z-docked:   10;   /* @kind other */
  --z-sticky:   50;   /* @kind other */
  --z-mobile-cta: 60; /* @kind other */
  --z-dropdown: 1000; /* @kind other */
  --z-overlay:  1300; /* @kind other */
  --z-modal:    1400; /* @kind other */
  --z-tooltip:  1900; /* @kind other */
}

/* Scroll-reveal + pulse keyframes (calm, guarded).
 * `[data-reveal]` starts visible; the animation only overrides when
 * animation-timeline: view() is supported, and is disabled for reduced motion. */
@keyframes gcRevUp { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
@keyframes gcPulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }

[data-reveal] { opacity: 1; }
@supports (animation-timeline: view()) {
  [data-reveal] {
    animation: gcRevUp linear both;
    animation-timeline: view();
    animation-range: entry 4% entry 44%;
  }
}
@media (prefers-reduced-motion: reduce) {
  [data-reveal] { animation: none !important; opacity: 1 !important; transform: none !important; }
}