/* Finlyft Brand Guidelines 1.0 (2025), pp. 12–14, 18–23.
   Axiforma awaits supplied webfont files; Poppins is the explicit fallback.
   Semantic status colours remain distinct from the brand palette. */
:root {
  --brand-ocean: #00244c;
  --brand-sky: #009dff;
  --brand-black: #0b0b0b;
  --brand-white: #ffffff;
  --brand-ocean-90: #1a3a5e;
  --brand-ocean-70: #4d6682;
  --brand-ocean-20: #ccd3db;
  --brand-ocean-10: #e6e9ed;
  --brand-sky-10: #e6f5ff;
  --ink: var(--brand-black);
  --text: var(--brand-black);
  --muted: var(--brand-ocean-70);
  --navy: var(--brand-ocean);
  --navy-soft: var(--brand-ocean-90);
  /* Dark text for links; Skyline is the accent/fill, not small text on white. */
  --blue: var(--brand-ocean);
  --blue-dark: var(--brand-ocean-90);
  --blue-soft: var(--brand-sky-10);
  --line: var(--brand-ocean-10);
  --surface: var(--brand-white);
  --surface-subtle: #f7f9fb;
  --canvas: #f7f9fb;
  --background: var(--canvas);
  --radius-sm: 8px;
  --radius-md: 12px;
  --shadow-sm: 0 1px 3px #00244c08;
  --shadow-md: 0 12px 32px #00244c14;
  color-scheme: light;
}
body { font-family: var(--font-poppins), Arial, sans-serif; color:var(--ink); background:var(--canvas); font-size:14px; line-height:1.5; }
button,input,textarea,select { font-family:inherit; }
h1,h2,h3 { font-family:"Axiforma",var(--font-poppins),Arial,sans-serif; color:var(--brand-ocean); font-weight:600; letter-spacing:-.02em; }
h1 { font-size:33px; line-height:1.3; }
h2 { font-size:24px; line-height:1.4; }
h3 { font-size:18px; line-height:1.5; }
.finlyftLogo { display:block; flex:none; width:136px; height:auto; overflow:visible; }
:focus-visible { outline:2px solid var(--brand-ocean); outline-offset:3px; }
input:focus,select:focus,textarea:focus { border-color:var(--brand-ocean); outline:2px solid var(--brand-sky); outline-offset:2px; }
input[type="checkbox"],input[type="radio"] { accent-color:var(--brand-ocean); }
.primaryButton { min-height:44px; border:1px solid var(--brand-sky); background:var(--brand-sky); color:var(--brand-ocean); font-size:14px; font-weight:600; box-shadow:none; }
.primaryButton:hover { border-color:var(--brand-ocean); background:var(--brand-ocean); color:white; box-shadow:none; transform:none; }
.secondaryButton { min-height:44px; border:1px solid var(--brand-ocean-20); background:white; color:var(--brand-ocean); font-size:14px; font-weight:500; }
.secondaryButton:hover { border-color:var(--brand-ocean); background:var(--brand-sky-10); color:var(--brand-ocean); }
.textButton,.rowLink { color:var(--brand-ocean); font-weight:500; }
.textButton:hover,.rowLink:hover { text-decoration:underline; text-underline-offset:4px; }
.iconButton { color:var(--brand-ocean); }
.iconButton:hover { color:var(--brand-ocean); background:var(--brand-sky-10); }
label { color:var(--brand-ocean); font-size:13px; font-weight:500; }
input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea { border-color:var(--brand-ocean-20); }
.status,.clientStatus { font-weight:500; }
.statusPENDING,.statusDRAFT,.statusSUBMITTED,.statusQUOTED,.statusACCEPTED,.statusUPLOADPENDING,.statusQUARANTINED,.clientStatusinfo { background:var(--brand-sky-10); color:var(--brand-ocean); }
.loginPage,.loginScreen { background:var(--brand-ocean); isolation:isolate; }
.loginPage::before,.loginScreen::before { content:""; position:fixed; z-index:-1; inset:0; pointer-events:none; background:linear-gradient(135deg,transparent 72%,#009dff20 72%,#009dff20 86%,var(--brand-sky) 86%); }
.loginPanel,.loginCard { border:0; border-radius:16px; box-shadow:0 24px 80px #00000026; padding:40px; }
.loginBrand { display:block; width:auto; height:auto; margin:0 0 16px; padding:10px 0; background:none; border-radius:0; box-shadow:none; }
.loginBrand .finlyftLogo { width:156px; }
.loginPanel h1,.loginCard h1 { font-size:33px; color:var(--brand-ocean); }
.loginForm label { font-size:14px; }
.loginForm input { min-height:48px; font-size:16px; }
.loginForm .primaryButton,.loginButton { min-height:48px; }
@media(max-width:520px) { h1 { font-size:24px; } .loginPanel,.loginCard { padding:32px 24px; } .loginBrand .finlyftLogo { width:136px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }