*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{font-size:16px;-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:16px;line-height:1.6;color:var(--ink);background:#fff;overflow-x:hidden;}

:root{
  /* Brand tokens (ERP, fixed) */
  --ink:#0F172A;
  --sky:#0EA5E9;
  --sun:#FACC15;
  /* Deepened on-light variants — raw --sky/--sun measured against #fff fail WCAG
     (sky vs white 2.77:1, sun vs white 1.53:1). Raw tokens are safe on dark (--ink)
     backgrounds (sky vs ink measured 6.44:1) and as button fills are too light too —
     use these deepened shades for any text/small-icon/line use on light backgrounds. */
  --sky-600:#0284C7;   /* on-light UI elements (dots/lines/icons), measured 4.10:1 vs #fff */
  --sky-700:#0369A1;   /* on-light TEXT + button fill w/ white text, measured 5.93:1 vs #fff */
  --sun-800:#92400E;   /* on-light TEXT / outline stroke, measured 7.09:1 vs #fff */
  --gray-50:#F8FAFC;
  --gray-100:#F1F5F9;
  --gray-300:#CBD5E1;
  --gray-600:#475569;
  --line:#E2E8F0;
  --radius:8px;
}

h1,h2,h3,h4,h5,h6{line-height:1.2;font-weight:700;color:var(--ink);text-wrap:balance;}
h1{font-size:clamp(2rem,1.4rem + 2.6vw,3.25rem);}
h2{font-size:clamp(1.6rem,1.3rem + 1.4vw,2.375rem);}
h3{font-size:1.25rem;}
p{font-size:1rem;line-height:1.65;}
.lead{font-size:1.125rem;line-height:1.6;color:var(--gray-600);}

img,svg{max-width:100%;height:auto;display:block;}

.container{width:100%;padding-right:24px;padding-left:24px;margin-right:auto;margin-left:auto;}
@media (min-width:576px){.container{max-width:540px;}}
@media (min-width:768px){.container{max-width:720px;}}
@media (min-width:992px){.container{max-width:960px;}}
@media (min-width:1200px){.container{max-width:1200px;}}

.container--wide{max-width:1320px;margin:0 auto;padding:0 24px;}
.container--narrow{max-width:860px;margin:0 auto;padding:0 24px;}

.skip-link{position:absolute;top:-40px;left:0;background:var(--ink);color:#fff;padding:10px 16px;text-decoration:none;z-index:10000;border-radius:0 0 6px 0;}
.skip-link:focus{top:0;}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:14px 28px;font-size:1rem;font-weight:600;text-align:center;text-decoration:none;border-radius:var(--radius);transition:transform .15s ease,box-shadow .15s ease;cursor:pointer;border:none;min-height:48px;}
.btn-primary{background:var(--sky-700);color:#fff;}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(3,105,161,.32);}
.btn-primary:focus-visible{outline:3px solid var(--sun-800);outline-offset:2px;}
.btn-ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.55);}
.btn-ghost:hover{border-color:#fff;}

#topbar-container{min-height:45px;}
#dynamic-menu-container{min-height:70px;}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important;}
}