:root { --brand-green:#1a442f; --brand-green-hover:#267c51; --night-blue:#0a1738; }
html,body{height:100%;margin:0;padding:0;display:flex;flex-direction:column;}
body{font-family:'Segoe UI',sans-serif;background:var(--night-blue);color:#fff;}
.page-content{flex:1;display:flex;flex-direction:column;}
/* header/nav/brand styles (the ones you already have) */
.site-header{position:sticky;top:0;z-index:50;background:var(--night-blue);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(6px);}
.nav-wrap{max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:700;color:#fff;text-decoration:none;}
.brand-logo{height:30px;width:auto;display:block;border-radius:6px;}
.nav{display:flex;align-items:center;gap:.4rem;}
.nav a{color:#fff;background:var(--brand-green);padding:.55rem 1rem;border-radius:6px;text-decoration:none;transition:background-color .25s,transform .15s,box-shadow .25s;box-shadow:0 2px 10px rgba(0,0,0,.25);font-size:.95rem;}
.nav a:hover{background:var(--brand-green-hover);transform:translateY(-1px);}
.nav a.active{outline:2px solid rgba(255,255,255,.18);box-shadow:0 0 0 3px rgba(26,68,47,.35);}
.menu-toggle{display:none;background:var(--brand-green);color:#fff;border:none;padding:.55rem .8rem;border-radius:6px;cursor:pointer;}
@media(max-width:720px){.nav{display:none;position:absolute;left:0;right:0;top:58px;background:var(--night-blue);padding:.75rem;border-bottom:1px solid rgba(255,255,255,.08);}
.nav.open{display:flex;flex-direction:column;gap:.6rem;}
.menu-toggle{display:inline-flex;align-items:center;gap:.4rem;}
}
/* footer */
.footer{background:var(--night-blue);text-align:center;padding:2rem 1rem;color:#fff;font-size:.9rem;margin-top:2rem;}
.footer .social-icons{margin-top:.75rem;}
.footer .social-icons a{margin:0 12px;display:inline-block;}
.footer .social-icons img{width:28px;height:28px;vertical-align:middle;filter:brightness(0) invert(1);transition:transform .2s;}
.footer .social-icons img:hover{transform:scale(1.2);}
.version-info{font-size:.85em;color:#888;margin-top:.5em;}
/* safety: header never turns into a white card */
.site-header .tab{background:transparent!important;color:inherit;box-shadow:none;padding:0;border-radius:0;}