/* ClearAccess Documents — base + design tokens
   "Summit" system: institutional navy/slate, one restrained blue accent.
   Moves off the generated dark-SaaS neon (cyan+emerald) toward a trustworthy,
   civic/compliance-vendor feel. Light + dark modes. */

:root, [data-theme="light"] {
  /* Type scale (fluid) */
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  --text-sm: clamp(0.875rem, 0.8rem + 0.35vw, 1rem);
  --text-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --text-lg: clamp(1.125rem, 1rem + 0.6vw, 1.4rem);
  --text-xl: clamp(1.5rem, 1.2rem + 1.25vw, 2.25rem);
  --text-2xl: clamp(2rem, 1.3rem + 2.4vw, 3.4rem);
  --text-3xl: clamp(2.5rem, 1.4rem + 3.6vw, 4.5rem);

  /* Spacing (4px base) */
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem;
  --space-5:1.25rem; --space-6:1.5rem; --space-8:2rem; --space-10:2.5rem;
  --space-12:3rem; --space-16:4rem; --space-20:5rem; --space-24:6rem; --space-32:8rem;

  /* Surfaces — cool paper white with a faint blue-gray cast */
  --color-bg:#f6f8fb;
  --color-surface:#ffffff;
  --color-surface-2:#f0f4f9;
  --color-surface-offset:#e9eef5;
  --color-border:#d8e0ea;
  --color-divider:#e4eaf1;

  /* Ink — deep summit navy, not pure black */
  --color-text:#16273d;
  --color-text-muted:#516072;
  --color-text-faint:#8a97a6;
  --color-text-inverse:#f4f7fb;

  /* Primary accent — a confident institutional blue (trust) */
  --color-primary:#1e5aa8;
  --color-primary-hover:#174a8c;
  --color-primary-active:#123a6f;
  --color-primary-soft:#e7eff8;

  /* Deep brand navy (headers, dark sections, logo) */
  --color-navy:#12233b;
  --color-navy-2:#1a3050;
  --color-navy-3:#24406a;

  /* Verified accent — restrained slate-teal, used sparingly for "pass/verified" */
  --color-verify:#2f7d6b;
  --color-verify-soft:#e3f0ec;

  /* Semantic */
  --color-warning:#9a5b1a;
  --color-error:#a3283f;

  --radius-sm:.375rem; --radius-md:.5rem; --radius-lg:.75rem; --radius-xl:1rem; --radius-2xl:1.5rem; --radius-full:9999px;
  --transition-interactive:180ms cubic-bezier(.16,1,.3,1);
  --shadow-xs:0 1px 2px rgba(18,35,59,.05);
  --shadow-sm:0 2px 6px rgba(18,35,59,.07);
  --shadow-md:0 8px 24px rgba(18,35,59,.09);
  --shadow-lg:0 18px 48px rgba(18,35,59,.14);
  --content-narrow:680px; --content-default:1000px; --content-wide:1200px;

  --font-display:'Fraunces','Georgia',serif;
  --font-body:'Satoshi','Inter',system-ui,sans-serif;
  --font-mono:'IBM Plex Mono','SFMono-Regular',monospace;

  --logo-notch:var(--color-bg);
}

[data-theme="dark"] {
  --color-bg:#0e1a2b;
  --color-surface:#14243a;
  --color-surface-2:#182b44;
  --color-surface-offset:#1d3251;
  --color-border:#294059;
  --color-divider:#213750;

  --color-text:#e3ecf6;
  --color-text-muted:#9fb1c6;
  --color-text-faint:#6b7f96;
  --color-text-inverse:#12233b;

  --color-primary:#5b9be0;
  --color-primary-hover:#7db0ea;
  --color-primary-active:#98c1f0;
  --color-primary-soft:#1a3050;

  --color-navy:#0a1524;
  --color-navy-2:#12233b;
  --color-navy-3:#1a3050;

  --color-verify:#5cb39b;
  --color-verify-soft:#16302a;

  --color-warning:#d08a45;
  --color-error:#dd6478;

  --shadow-xs:0 1px 2px rgba(0,0,0,.3);
  --shadow-sm:0 2px 6px rgba(0,0,0,.35);
  --shadow-md:0 8px 24px rgba(0,0,0,.4);
  --shadow-lg:0 18px 48px rgba(0,0,0,.5);

  --logo-notch:var(--color-surface);
}

@media (prefers-color-scheme:dark){:root:not([data-theme]){
  --color-bg:#0e1a2b;--color-surface:#14243a;--color-surface-2:#182b44;--color-surface-offset:#1d3251;
  --color-border:#294059;--color-divider:#213750;--color-text:#e3ecf6;--color-text-muted:#9fb1c6;
  --color-text-faint:#6b7f96;--color-text-inverse:#12233b;--color-primary:#5b9be0;--color-primary-hover:#7db0ea;
  --color-primary-active:#98c1f0;--color-primary-soft:#1a3050;--color-navy:#0a1524;--color-navy-2:#12233b;
  --color-navy-3:#1a3050;--color-verify:#5cb39b;--color-verify-soft:#16302a;--logo-notch:var(--color-surface);
}}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:none;text-size-adjust:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;scroll-behavior:smooth;scroll-padding-top:5rem}
body{min-height:100dvh;line-height:1.6;font-family:var(--font-body);font-size:var(--text-base);color:var(--color-text);background:var(--color-bg)}
img,picture,video,canvas,svg{display:block;max-width:100%;height:auto}
ul[role=list],ol[role=list]{list-style:none}
input,button,textarea,select{font:inherit;color:inherit}
h1,h2,h3,h4,h5,h6{text-wrap:balance;line-height:1.12;font-family:var(--font-display);font-weight:600;letter-spacing:-.015em;color:var(--color-text)}
p,li{text-wrap:pretty}
a{color:inherit;text-decoration:none}
::selection{background:color-mix(in oklab,var(--color-primary) 22%,transparent);color:var(--color-text)}
:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px;border-radius:var(--radius-sm)}
button{cursor:pointer;background:none;border:none}
table{border-collapse:collapse;width:100%}
a,button,[role=button],input,textarea,select{transition:color var(--transition-interactive),background var(--transition-interactive),border-color var(--transition-interactive),box-shadow var(--transition-interactive),transform var(--transition-interactive)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}