/* Shared web foundation for LEGEND, Protect, AgentPortal and ClientApp.
   Component styles consume these variables; this file owns page defaults. */
:root{
  --web-navy:#102b62;
  --web-navy-deep:#081a3a;
  --web-navy-royal:#173b7a;
  --web-gold:#d4ad45;
  --web-gold-strong:#f0cf78;
  --web-ink:#101a35;
  --web-muted:#5b6680;
  --web-surface:#f7f8fb;
  --web-white:#fff;
  --web-border:rgba(16,43,98,.13);
  --web-radius-sm:12px;
  --web-radius-md:18px;
  --web-radius-lg:24px;
  --web-shadow:0 18px 52px rgba(8,26,58,.10);
  --web-font:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --web-page-pad:clamp(20px,6.5vw,108px);
  --web-public-page-pad:clamp(24px,4.25vw,72px);
  --web-public-section-y:clamp(52px,6vw,88px);
  --web-public-reading-max:1040px;
  --web-public-heading-max:1180px;
  --web-public-body-weight:500;
  --web-public-heading-weight:800;
  --web-public-card-border:color-mix(in srgb,var(--web-gold) 58%,var(--web-navy) 16%);
  --web-public-flow-gap:clamp(16px,2vw,28px);
  --web-public-mobile-page-pad:clamp(18px,5vw,24px);
  --web-public-mobile-section-y:clamp(44px,10vw,64px);
  --web-public-mobile-media-max:560px;
  --web-public-action-min:180px;
  --web-public-banner-pad-block:10px;
  --web-public-banner-pad-inline:14px;
  --web-public-banner-title-size:clamp(21px,2.25vw,31px);
  --web-public-banner-title-weight:800;
  --web-public-banner-title-line:1;
  --web-public-banner-title-tracking:-.025em;
  --web-header-height:88px;
  --navy:var(--web-navy);
  --navy-deep:var(--web-navy-deep);
  --navy-royal:var(--web-navy-royal);
  --gold:var(--web-gold);
  --gold-strong:var(--web-gold-strong);
  --ink:var(--web-ink);
  --muted:var(--web-muted);
  --surface:var(--web-surface);
  --white:var(--web-white);
  --border:var(--web-border);
  --radius-sm:var(--web-radius-sm);
  --radius-md:var(--web-radius-md);
  --radius-lg:var(--web-radius-lg);
  --shadow:var(--web-shadow);
  --font:var(--web-font);
  --page-pad:var(--web-page-pad);
  --header-height:var(--web-header-height);
}

/* Site-scoped default palettes live here, not in component CSS. User-authored
   Website Studio theme values still override these through the canonical theme layer. */
:root[data-legend-site="business"]{
  --web-navy:#16233b;
  --web-navy-deep:#0b1426;
  --web-navy-royal:#263a60;
  --web-gold:#caa85f;
  --web-gold-strong:#efd69a;
  --web-ink:#172033;
  --web-muted:#626f84;
  --web-surface:#f5f7fa;
  --web-white:#ffffff;
  --web-border:rgba(22,35,59,.12);
  --web-shadow:0 18px 48px rgba(11,20,38,.10);
}
*{box-sizing:border-box}
html{scroll-behavior:auto}
body{margin:0;min-width:320px;min-height:100dvh;background:var(--web-white);color:var(--web-ink);font-family:var(--web-font);line-height:1.65}
button,input,select,textarea{font:inherit}
img{max-width:100%}
:focus-visible{outline:2px solid var(--web-gold);outline-offset:3px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}