/* nav.css — accessible header for one-page site */
:root{
  --bg:#0c1020;
  --bg-2:#121735;
  --fg:#ffffff;
  --brand:#68a0ff;
  --shadow:0 8px 20px rgba(0,0,0,.15);
  --header-h: 64px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,'Noto Sans',Arial,sans-serif; color:#0b0f1a; background:#f6f8fc}
/* (bwv) removed global .container override from nav.css */
.site-header{background:var(--beige); color:var(--fg); position:sticky; top:0; z-index:1000; box-shadow:var(--shadow)}
.site-header .container{display:flex; align-items:center; gap:1rem; padding:.6rem 0}
.logo{display:flex; align-items:center; gap:.6rem; color:var(--fg); text-decoration:none; white-space:nowrap}
.logo-mark{font-size:1.35rem}
.logo-text{font-weight:700; letter-spacing:.2px}
.primary-nav{display:flex; align-items:center; gap:1rem; margin-left:auto}
.nav-toggle{display:none; background:none; border:0; padding:.4rem; cursor:pointer}
.nav-toggle:focus-visible{outline:2px solid var(--brand); outline-offset:2px}
.nav-toggle-box{display:block; width:22px; height:2px; background:var(--fg); margin:4px 0}
.nav-list{display:flex; align-items:center; list-style:none; padding:0; margin:0; gap:.5rem; flex-wrap:nowrap}
.nav-list a{display:block; padding:.5rem .75rem; border-radius:.5rem; color:#737373; text-decoration:none; font-weight:500; white-space:nowrap}
.nav-list a:hover{color:#000;}
.cta-row{display:flex; align-items:center; gap:.5rem}
.btn{display:inline-block; padding:.55rem .9rem; border-radius:.6rem; text-decoration:none; font-weight:600; border:1px solid transparent; cursor:pointer}
.btn:focus-visible{outline:2px solid var(--brand); outline-offset:2px}
.btn-primary{color:#fff;background:#a163f5; }
.btn-call{background:transparent; border:1px solid #a163f5; color:#a163f5;}
.btn-call:hover{background:#f5edff; border-color:#8a4de2; color:#8a4de2;}
.section{ scroll-margin-top: calc(var(--header-h) + 12px); }
/* Priority+ "More" */
.more{position:relative}
.more > button{background:transparent; border:1px solid rgba(255,255,255,.35); color:var(--fg)}
.more-menu{position:absolute; right:0; top:calc(100% + .4rem); background:#fff; color:#0b0f1a; border-radius:.6rem; box-shadow:var(--shadow); min-width:180px; padding:.3rem 0; display:none}
.more[aria-expanded="true"] .more-menu{display:block}
.more-menu a{display:block; padding:.5rem .75rem; border-radius:0; color:#0b0f1a}
.more-menu a:hover, .more-menu a:focus-visible{background:#f0f4ff}
@media (max-width: 900px){
  .nav-toggle{display:block}
  .nav-list{position:fixed; inset:64px 0 auto 0; background:linear-gradient(0deg,var(--bg-2),var(--bg)); padding:1rem; flex-direction:column; gap:.25rem; max-height:0; overflow:hidden; transition:max-height .25s ease}
  .nav-list.is-open{max-height:70vh; overflow:auto}
  .cta-row{display:none}
}
@media (prefers-reduced-motion: reduce){
  .nav-list{transition:none}
}

.section-anchor{display:block;height:0;margin:0;padding:0;scroll-margin-top:calc(var(--header-h) + 12px);}
.btn-primary:hover{background:#8a4de2;}
/* 1) Use the same container everywhere */
:root{
  --container-max: 1200px;              /* whatever your page uses */
  --container-pad: clamp(16px, 2vw, 24px);
}
/* (bwv) removed global .container override from nav.css */

/* 2) Make the header use the SAME container */
.site-header { width: 100%; }            /* not 100vw */


/* 3) If you had a calc based on vw, kill it */



/* (bwv) Nav alignment: use same container width/padding as the site */
.site-header { width: 100%; }
.site-header > .container {
  max-width: 72rem;           /* match style.css .container */
  margin-inline: auto;
  padding-inline: 1rem;       /* match style.css .container */
}

