:root{
  --bg:#fff; --ink:#222; --muted:#e6e6e6; --accent:#36648B;
  --header-h-mobile:56px; --header-h-desktop:64px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; color:var(--ink); background:var(--bg);
  font:18px/1.6 Georgia,"Times New Roman",Times,serif;
  padding-top:calc(var(--header-h-mobile) + env(safe-area-inset-top));
  overflow-x:hidden;
}

/* Header */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:1100;
  background:#fff; border-bottom:1px solid var(--muted);
  padding-top:env(safe-area-inset-top);
}
.bar{
  max-width:1100px; margin:0 auto; padding:0 12px;
  height:var(--header-h-mobile);
  display:flex; align-items:center; justify-content:space-between;
}
.brand{ display:flex; align-items:center; min-width:0; }
.brand img{ display:block; max-height:44px; width:auto; height:auto; object-fit:contain; }

/* Hamburger */
.menu-toggle{ border:0; background:transparent; cursor:pointer; height:44px; width:44px; position:relative; }
.menu-toggle:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.hamb, .hamb::before, .hamb::after{
  content:""; position:absolute; left:50%; transform:translateX(-50%);
  width:22px; height:2px; background:#222; border-radius:2px; transition:transform .25s ease, top .25s ease, background .25s ease;
}
.hamb{ top:50%; }
.hamb::before{ top:-7px; }
.hamb::after{ top:7px; }
body.nav-open .hamb{ background:transparent; }
body.nav-open .hamb::before{ top:0; transform:translateX(-50%) rotate(45deg); }
body.nav-open .hamb::after{ top:0; transform:translateX(-50%) rotate(-45deg); }

/* Off-canvas nav + backdrop */
.nav{
  position:fixed; top:0; left:0; z-index:1050;
  width:min(82vw, 360px); height:100dvh;
  background:#f7f7f7; border-right:1px solid var(--muted);
  transform:translateX(-100%); transition:transform .28s ease-out;
  padding-top:calc(var(--header-h-mobile) + env(safe-area-inset-top));
  display:flex; flex-direction:column;
}
body.nav-open .nav{ transform:translateX(0); }
.nav a{
  padding:16px 22px; font:600 1.1rem/1.2 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  color:#222; text-decoration:none; border-bottom:1px solid #eaeaea;
}

.backdrop{
  position:fixed; inset:0; background:rgba(0,0,0,.35);
  opacity:0; pointer-events:none; transition:opacity .2s ease; z-index:1025;
}
body.nav-open .backdrop{ opacity:1; pointer-events:auto; }

/* Content + footer */
.main-container, .container{ max-width:880px; margin:0 auto; padding:36px 18px; }
.site-footer{
  background:#f7f7f7; border-top:1px solid var(--muted);
  padding:22px 18px; text-align:center; font-size:.95em; color:#444; margin-top:40px; position:relative;
}
.site-footer::before{ content:""; position:absolute; left:0; right:0; top:0; height:3px; background:var(--accent); }
.footer-cta{ margin-top:14px; display:flex; flex-wrap:wrap; justify-content:center; gap:10px; }
.footer-legal{ margin-top:1rem; font-size:.85rem; color:#666; }
.button{ display:inline-block; padding:.55rem .9rem; border-radius:8px; border:2px solid var(--accent); font-weight:700; line-height:1; }
.button--primary{ background:var(--accent); color:#fff; }
.button--ghost{ background:#fff; color:var(--accent); }

/* Desktop: inline nav */
@media (min-width:821px){
  body{ padding-top:calc(var(--header-h-desktop) + env(safe-area-inset-top)); }
  .bar{ height:var(--header-h-desktop); }
  .brand img{ max-height:56px; }
  .menu-toggle{ display:none; }
  .nav{
    position:static; transform:none; height:auto; width:auto; padding-top:0;
    background:transparent; border:0; z-index:auto;
    flex-direction:row; align-items:center; gap:.4rem;
  }
  .nav a{ border:0; padding:.45rem .6rem; border-radius:.4rem; font-size:1rem; }
  .nav a:hover, .nav a:focus-visible{ background:#f3f3f3; outline:none; }
  .backdrop{ display:none; }
}

@media (prefers-reduced-motion:reduce){ *{transition:none !important; animation:none !important} }