:root { --primary-color:#000; --secondary-color:#ffe800; --accent-color:#0066cc; --light-bg:#fff; }
body { font-family:'Open Sans',Arial,sans-serif; background:#fff; color:#1a1a1a; }
.on-topbar { background:#000; }
.on-topbar-inner { display:flex; align-items:center; justify-content:space-between; height:64px; padding:0 24px; }
.on-brand { display:flex; align-items:center; gap:10px; color:#fff; text-decoration:none; }
.on-brand:hover { color:#fff; text-decoration:none; }
.on-trillium { font-size:30px; color:#fff; }
.on-wordmark { font-size:28px; font-weight:700; letter-spacing:.5px; }
.on-actions { display:flex; align-items:center; gap:18px; }
.on-link, .on-welcome { color:#fff; font-size:15px; }
.on-form { margin:0; }
.btn-on-signin { background:#000; color:#fff; border:2px solid #fff; padding:8px 22px; font-weight:600; font-size:15px; }
.btn-on-signin:hover, .btn-on-signin:focus { background:#ffe800; color:#000; border-color:#ffe800; }
.on-yellow-rule { height:6px; background:#ffe800; }
.on-welcome-page { padding:48px 0 32px; max-width:880px; }
.on-welcome-page h1 { font-weight:700; font-size:40px; margin-bottom:16px; }
.on-lead { font-size:20px; max-width:680px; margin-bottom:28px; }
.btn-on-primary { display:inline-block; background:#0066cc; color:#fff; border:0; padding:12px 28px; font-weight:600; font-size:17px; text-decoration:none; border-radius:2px; }
.btn-on-primary:hover { background:#004c99; color:#fff; text-decoration:none; }
.on-info { margin-top:48px; padding:24px; border-left:6px solid #ffe800; background:#f4f4f4; }
.on-card { border:1px solid #ccc; padding:24px; margin-bottom:20px; }
.on-footer { background:#000; color:#fff; padding:28px 0; margin-top:48px; border-top:6px solid #ffe800; }
.on-footer-links { list-style:none; padding:0; display:flex; gap:24px; }
.on-disclaimer { opacity:.7; font-size:13px; }

.on-logo { height:40px; width:auto; display:block; }