/* StartFill website look for the STF portal and console: white site bar with the website menu, navy #0A1628, orange #FF8C00,
   Raleway (headings, menu) and Lato (buttons). Fonts and logo are served by STF itself (/portal/brand/); while a font file is
   missing the system font is used. Shared by portal.html and console.html. No inline styles (CSP). */
@font-face { font-family: "Raleway"; src: url("/portal/brand/Raleway-VariableFont_wght.ttf") format("truetype"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Lato"; src: url("/portal/brand/Lato-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Lato"; src: url("/portal/brand/Lato-Bold.ttf") format("truetype"); font-weight: 700; font-display: swap; }

.sfbar { --sf-navy: #0A1628; --sf-orange: #FF8C00; background: #fff; color: var(--sf-navy); border-bottom: 1px solid #E3E8F0; font-family: "Raleway", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; position: relative; z-index: 30; }
.sfbar-in { max-width: 1280px; margin: 0 auto; padding: 0 24px; min-height: 68px; display: flex; align-items: center; gap: 28px; }
.sflogo { display: inline-flex; flex-direction: column; line-height: 1; text-decoration: none; color: var(--sf-navy); flex: none; }
.sflogo-main { font-weight: 800; font-size: 1.6rem; letter-spacing: -.02em; }
.sflogo-main b { color: var(--sf-orange); font-weight: 800; }
.sflogo-sub { font-size: .62rem; font-weight: 700; letter-spacing: .32em; text-transform: uppercase; margin-top: 3px; color: #3D4B63; }
.sfmenu { display: flex; align-items: center; gap: 4px; margin-left: auto; flex-wrap: wrap; }
.sfmenu a { color: var(--sf-navy); text-decoration: none; text-transform: uppercase; font-size: .78rem; font-weight: 600; letter-spacing: .03em; padding: 10px 11px; border-radius: 6px; }
.sfmenu a:hover { color: #B35F00; }
.sfmenu a[aria-current="true"] { box-shadow: inset 0 -3px 0 var(--sf-orange); }
.sfcta { display: inline-flex; align-items: center; background: var(--sf-orange); color: #fff; text-decoration: none; text-transform: uppercase; font-family: "Lato", ui-sans-serif, system-ui, Arial, sans-serif; font-weight: 700; font-size: .85rem; letter-spacing: .04em; padding: 11px 20px; border-radius: 5px; flex: none; }
.sfcta:hover { background: #E67E00; color: #fff; }
.sfbar a:focus-visible { outline: 3px solid var(--sf-navy); outline-offset: 2px; }
@media (max-width: 1060px) { .sfmenu { display: none; } .sfcta { margin-left: auto; } }
@media (max-width: 480px) { .sfbar-in { padding: 0 14px; gap: 12px; } .sfcta { padding: 10px 12px; font-size: .78rem; } }
