/* ============================================
   iPark B2B — Design Tokens (self-contained)
   Deep Blue dominant · Cherry Red accent
   ============================================ */
:root{
  /* Brand */
  --ipark-blue:#031927;
  --ipark-blue-900:#020f18;
  --ipark-blue-800:#051825;
  --ipark-blue-700:#0a2438;
  --ipark-blue-600:#15334a;
  --ipark-blue-500:#1f4660;
  --ipark-blue-400:#3a6285;
  --ipark-blue-300:#6088a8;
  --ipark-blue-200:#a6bccf;
  --ipark-blue-100:#d8e3ec;
  --ipark-blue-50:#f1f5f9;

  --ipark-red:#ea1744;
  --ipark-red-600:#c41440;
  --ipark-red-200:#ffc2cf;
  --ipark-red-100:#ffe0e7;
  --ipark-red-50:#fff1f4;

  --ipark-beige:#f4f7fb;   /* Was warm beige; replaced by cool soft gray to remove yellow tones */

  /* Semantic */
  --bg:#ffffff;
  --bg-soft:#f7f9fb;
  --bg-dark:var(--ipark-blue);
  --bg-dark-grad:linear-gradient(135deg,#031927 0%,#0a2438 100%);

  --fg:var(--ipark-blue);
  --fg-muted:#5c6a7a;
  --fg-subtle:#6b7a8a; /* raised from #8a94a0 — WCAG AA contrast on white */
  --fg-on-dark:#ffffff;
  --fg-on-dark-muted:rgba(255,255,255,.7);

  --border:#e6ebf0;
  --border-strong:#cfd7df;
  --border-dark:rgba(255,255,255,.12);

  --accent:var(--ipark-red);
  --accent-soft:var(--ipark-red-50);
  --accent-border:var(--ipark-red-100);
  --accent-100:var(--ipark-red-100);  /* alias — fixes pay-wizard.css references */
  --accent-200:var(--ipark-red-200);
  --success:#0e8a4a;
  --success-600:#086b38;

  --data-good:#0e8a4a;
  --data-warn:#b25a00;

  /* Type */
  --font-sans:'Poppins',system-ui,-apple-system,Segoe UI,sans-serif;
  --font-mono:'SF Mono',Menlo,Consolas,monospace;

  --fs-eyebrow:12px;
  --fs-body:16px;
  --fs-lead:18px;
  --fs-h3:clamp(1.25rem,2vw,1.5rem);
  --fs-h2:clamp(1.875rem,4vw,2.75rem);
  --fs-h1:clamp(2.25rem,5vw,3.6rem);
  --fs-display:clamp(2.75rem,6vw,4.5rem);

  /* Space */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px;
  --sp-5:24px; --sp-6:32px; --sp-7:48px; --sp-8:64px;
  --sp-9:96px; --sp-10:128px;

  /* Radii */
  --r-sm:8px; --r-md:12px; --r-lg:18px; --r-xl:24px; --r-pill:999px;

  /* Shadows */
  --shadow-sm:0 4px 12px rgba(3,25,39,.06);
  --shadow-md:0 12px 32px rgba(3,25,39,.10);
  --shadow-lg:0 24px 60px rgba(3,25,39,.14);
  --shadow-xl:0 32px 80px rgba(3,25,39,.20);
  --shadow-red:0 12px 32px rgba(234,23,68,.30);

  /* Layout */
  --container-max:1200px;
  --container-pad:24px;
  --header-h:72px;

  /* Motion */
  --t-fast:.15s ease;
  --t-base:.25s ease;
  --t-slow:.4s ease;

  /* Z-index scale */
  --z-dropdown:200;
  --z-sticky:1000;
  --z-drawer-bg:1100;
  --z-drawer:1101;
  --z-modal:2000;
  --z-skip-link:9999;
}

/* Base */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:var(--font-sans);
  font-size:var(--fs-body);
  color:var(--fg);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  line-height:1.5;
}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%;display:block}
h1,h2,h3,h4,h5{margin:0;font-family:var(--font-sans);color:var(--fg);font-weight:700}
p{margin:0}
::selection{background:var(--accent);color:#fff}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;padding:14px 26px;border-radius:var(--r-pill);font-weight:700;font-size:15px;border:0;cursor:pointer;text-decoration:none;font-family:inherit;transition:transform var(--t-base),background var(--t-base),box-shadow var(--t-base)}
.btn-primary{background:var(--accent);color:#fff;box-shadow:var(--shadow-red)}
.btn-primary:hover{background:var(--ipark-red-600);transform:translateY(-2px)}
.btn-secondary{background:#fff;color:var(--ipark-blue);border:1px solid var(--border-strong)}
.btn-secondary:hover{border-color:var(--ipark-blue)}
.btn-dark{background:var(--ipark-blue);color:#fff}
.btn-dark:hover{background:var(--ipark-blue-700);transform:translateY(-2px)}
.btn-ghost-dark{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.25)}
.btn-ghost-dark:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.5)}

/* Eyebrow */
.eyebrow{display:inline-block;background:var(--ipark-blue-50);color:var(--ipark-blue);border:1px solid var(--ipark-blue-100);padding:8px 16px;border-radius:var(--r-pill);font-size:var(--fs-eyebrow);font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.eyebrow-live{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--border);color:var(--fg);font-size:12px;font-weight:600;padding:8px 16px;border-radius:var(--r-pill)}
.eyebrow-live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(234,23,68,.18);animation:pulse 2s ease-in-out infinite}
.eyebrow-dark{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.18)}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.45}}

/* Focus visible — global accessibility */
:focus{outline:none}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:6px}
.hdr :focus-visible,.bg-dark :focus-visible{outline-color:#fff}

/* Skip link */
.skip-link{position:absolute;left:-9999px;top:0;background:var(--accent);color:#fff;padding:12px 20px;border-radius:0 0 12px 0;font-weight:700;z-index:var(--z-skip-link);text-decoration:none}
.skip-link:focus{left:0}

/* Reduced motion */
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}.claim-track,.lm-track{animation:none!important;transform:none!important}.modal.open{animation:none!important}.modal-card{animation:none!important;transform:none!important;opacity:1!important}}

/* Forced colors (Windows High Contrast) */
@media(forced-colors:active){.accent{-webkit-text-fill-color:unset;background:none;color:LinkText}}
