/* Shared header/nav styling for the account-area shell (x-layout), extracted
   from site.css so the marketing site and account pages render an identical
   header without loading site.css's global element resets (body/a/h1/p)
   on top of Tailwind-styled page content. */
:root{--ink:#142033;--muted:#4d596c;--line:#e2e7ef;--red:#c93434;--red-dark:#a72828;--shadow:0 18px 55px #14203318}
.site-header{height:72px;max-width:1240px;margin:auto;padding:0 24px;display:flex;align-items:center;gap:24px;border-bottom:1px solid var(--line);background:#fff;font-family:Arial,"Helvetica Neue",system-ui,sans-serif}
.site-brand{display:flex;align-items:center;gap:9px;font:800 18px Arial,"Helvetica Neue",system-ui,sans-serif;color:var(--ink);text-decoration:none}
.site-brand span{width:36px;height:36px;border-radius:11px;background:var(--red);display:grid;place-items:center}
.site-header nav{display:flex;align-items:center;gap:22px;margin-left:auto;font-weight:600;font-size:14px}
.site-header nav>a:not(.button),.nav-dropdown-toggle{color:var(--ink);text-decoration:none;background:none;border:0;font:inherit;font-weight:600;cursor:pointer;padding:0;display:inline-flex;align-items:center;gap:4px}
.site-header nav>a:not(.button):hover,.nav-dropdown-toggle:hover{color:var(--red)}
.button{display:inline-flex;align-items:center;justify-content:center;border-radius:10px;padding:11px 17px;font-weight:700;border:1px solid var(--line);color:var(--ink);text-decoration:none;cursor:pointer;font-size:14px}
.button.primary{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 8px 22px #c9343435}
.button.primary:hover{background:var(--red-dark)}
.button.ghost:hover{background:#f7f8fb}
.nav-toggle{display:none;margin-left:auto;border:0;background:none;font-size:24px;width:44px;height:44px;cursor:pointer;color:var(--ink)}

.nav-dropdown{position:relative}
.nav-dropdown-menu{display:none;position:absolute;top:calc(100% + 12px);right:0;min-width:180px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:8px;flex-direction:column;gap:2px;z-index:10}
.nav-dropdown.open .nav-dropdown-menu{display:flex}
.nav-dropdown-menu a,.nav-dropdown-menu button{display:block;width:100%;text-align:left;padding:9px 12px;border-radius:8px;color:var(--ink);text-decoration:none;background:none;border:0;font:inherit;font-weight:600;font-size:14px;cursor:pointer}
.nav-dropdown-menu a:hover,.nav-dropdown-menu button:hover{background:#f7f8fb}
.nav-dropdown-menu form{margin:0}

@media(max-width:850px){
  .site-header nav{display:none;position:absolute;top:65px;left:16px;right:16px;padding:18px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);z-index:5;flex-direction:column;align-items:stretch;gap:14px}
  .site-header.open nav{display:flex}
  .nav-toggle{display:flex;align-items:center;justify-content:center}
  .nav-dropdown-menu{position:static;box-shadow:none;border:0;padding:0 0 0 12px;display:none}
  .nav-dropdown.open .nav-dropdown-menu{display:flex}
}
