/**
 * training-need-assessment.html loads css/responsive.css, which sets html { font-size: 10px }.
 * The shared header/footer use Tailwind utilities in `rem` (same as learning-operating-system.html),
 * which assume a 16px root — with 10px root, nav text and spacing look too small.
 * Reset the root font size so rem-based chrome matches other marketing pages.
 */
html {
    font-size: 16px !important;
}

/**
 * Legacy Bootstrap from responsive.css / training-need-assessment.css: global anchor color.
 * Keep Inter + smoothing on injected chrome.
 */
#playablo-site-header-host,
#footer-sticky {
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
        "Helvetica Neue", Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

#playablo-site-header-host a {
    text-decoration: none !important;
}

#playablo-site-header-host a.magamenubutton,
#playablo-site-header-host a.magamenubutton:hover,
#playablo-site-header-host a.magamenubutton:focus {
    color: #101010 !important;
}

/* Transparent nav controls — avoid Bootstrap button defaults; sizes come from Tailwind (text-sm, etc.) */
#playablo-site-header-host button.magamenubutton {
    background: transparent !important;
    border: 0 !important;
}

#playablo-site-header-host .playablo-free-button {
    color: #fff !important;
    background-color: #098ff8 !important;
}

#playablo-site-header-host .playablo-free-button:hover,
#playablo-site-header-host .playablo-free-button:focus {
    color: #fff !important;
}