/* --- Base reset --- */
*{box-sizing:border-box;margin:0;padding:0}
:root{--text:#1f2937;--accent:#1e3a8a;--bg:#fff}

html, body {
  height: 100%;
  display: flex;
  flex-direction: column;
}

body{
  color:var(--text);
  font-family:'Roboto',sans-serif;
  line-height:1.6;
  background:#fff;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  background:url('/assets/logo.png') no-repeat center center;
  background-size:600px auto;
  opacity:0.03;
  pointer-events:none;
  z-index:0;
}

/* --- Topbar --- */
.topbar{
  position:sticky;top:0;z-index:2000;
  display:flex;align-items:center;gap:16px;
  background:var(--bg);
  padding:8px 16px;
  box-shadow:0 2px 8px rgba(0,0,0,.06);
}
.logo img{max-height:56px;height:auto}
.site-title{font-weight:700;font-size:18px;color:var(--accent)}

/* Desktop nav */
.menu{margin-left:auto;display:flex;gap:12px;z-index:2001}
.menu a{display:inline-block;padding:8px 12px;border-radius:999px;text-decoration:none;color:var(--accent);font-weight:500}
.menu a:hover{background:rgba(30,58,138,.08)}
.hamburger{display:none;font-size:28px;user-select:none;cursor:pointer}

/* Mobile menu overlay */
@media (max-width:768px){
  .hamburger{display:block;z-index:2002;margin-left:auto}
  .menu{
    position:fixed;right:0;top:0;width:80%;max-width:320px;height:100vh;background:#fff;
    padding:80px 20px 20px;box-shadow:-8px 0 24px rgba(0,0,0,.18);
    transform:translateX(100%);transition:transform .25s ease;
    display:flex;flex-direction:column;gap:14px;z-index:1001
  }
  .menu.active{transform:translateX(0)}
  .menu-backdrop{
    position:fixed;inset:0;background:rgba(0,0,0,.35);
    backdrop-filter:blur(2px);opacity:0;pointer-events:none;
    transition:opacity .25s ease;z-index:1000
  }
  .menu-backdrop.active{opacity:1;pointer-events:auto}
}
body.no-scroll{overflow:hidden}

/* --- Main content --- */
main{padding:20px;max-width:1000px;margin:0 auto;position:relative;z-index:10;flex:1}
h1,h2,h3{color:var(--accent);margin-bottom:12px}
p{margin-bottom:12px}

/* --- Footer --- */
footer{
  background:#f1f1f1;
  text-align:center;
  padding:12px;
  font-size:14px;
  color:#333;
  margin-top:auto;
  position:relative;
  z-index:10;
}
