:root {
  --sistalex-navy: #0D1B3D;
  --sistalex-red: #E71D2A;
  --sistalex-white: #FFFFFF;
  --sistalex-soft-bg: #F5F7FB;
  --sistalex-border: #D8E0ED;
  --sistalex-font: "Sora", "Poppins", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.sistalex-brand-logo {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
}

.sistalex-brand-logo--header {
  max-height: 42px;
}

.sistalex-brand-logo--login {
  width: min(420px, 88vw);
}

.sistalex-brand-icon {
  display: block;
  width: 40px;
  height: 40px;
  object-fit: contain;
}

.sistalex-brand-icon--sm { width: 24px; height: 24px; }
.sistalex-brand-icon--md { width: 40px; height: 40px; }
.sistalex-brand-icon--lg { width: 64px; height: 64px; }

.sistalex-brand-safe-area {
  padding: 0.55em;
}

.sistalex-brand-dark {
  background: var(--sistalex-navy);
  color: var(--sistalex-white);
}