/* GDBS site chrome - replicates the marketing landing nav + footer using the
   flux design tokens (the sub pages load flux.css + theme-bridge.css), so it
   matches gdbs.getvaultsync.com exactly. Loads last, so its body font wins. */
body{font-family:var(--ff-sans,'DM Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif)}

/* ---- header (mirrors .landing-nav / .landing-btn-*) ---- */
.gh{position:sticky;top:0;z-index:100;background:color-mix(in oklch,var(--surface-0,#fff) 90%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border,#e2e7ee)}
.gh-in{max-width:1180px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:18px}
.gh-logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-size:20px;font-weight:300;color:var(--text-primary,#1a2330);white-space:nowrap}
.gh-logo i{color:var(--accent,#2563eb);font-size:22px}
.gh-logo .ac{color:var(--accent,#2563eb)}

.gh-nav{display:flex;align-items:center;gap:.25rem;margin-left:8px}
.gh-item{position:relative;display:inline-flex}
.gh-trigger,.gh-toplink{padding:6px 14px;color:var(--text-secondary,#5b6675);font-size:13px;border-radius:4px;cursor:pointer;display:inline-flex;align-items:center;text-decoration:none;white-space:nowrap;transition:all .2s}
.gh-trigger:hover,.gh-toplink:hover,.gh-item:hover .gh-trigger{color:var(--text-primary,#1a2330);background:color-mix(in oklch,var(--accent,#2563eb) 12%,transparent)}
.gh-trigger::after{content:"";width:0;height:0;margin-left:6px;border-left:3.5px solid transparent;border-right:3.5px solid transparent;border-top:4px solid currentColor;opacity:.6}
.gh-menu{position:absolute;top:100%;left:0;min-width:200px;background:var(--bg-panel,var(--surface-0,#fff));border:1px solid var(--border,#e2e7ee);border-radius:10px;box-shadow:0 14px 34px rgba(15,23,42,.14);padding:8px;display:none;flex-direction:column;gap:2px;z-index:120}
.gh-item:hover .gh-menu{display:flex}
.gh-menu a{display:block;padding:8px 12px;border-radius:6px;font-size:13px;color:var(--text-secondary,#5b6675);text-decoration:none;white-space:nowrap}
.gh-menu a:hover{background:color-mix(in oklch,var(--accent,#2563eb) 10%,transparent);color:var(--accent,#2563eb)}

.gh-cta{margin-left:auto;display:flex;align-items:center;gap:.5rem}
.gh-btn{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;border-radius:5px;text-decoration:none;white-space:nowrap;cursor:pointer;transition:all .2s}
.gh-btn.out{padding:7px 18px;background:transparent;color:var(--text-bright,var(--text-primary,#1a2330));border:1px solid var(--border-light,var(--border,#cbd5e1))}
.gh-btn.out:hover{background:var(--bg-hover,rgba(37,99,235,.07));border-color:var(--accent,#2563eb);color:var(--accent,#2563eb)}
.gh-btn.pri{padding:8px 20px;background:var(--accent,#2563eb);color:var(--accent-text,#fff);border:1px solid var(--accent,#2563eb)}
.gh-btn.pri:hover{background:var(--accent-hover,#1d4ed8);border-color:var(--accent-hover,#1d4ed8)}
@media(max-width:860px){.gh-nav{display:none}.gh-btn.out{display:none}}

/* ---- footer ---- */
.gf{background:var(--bg-alt,#f7f9fc);border-top:1px solid var(--border,#e2e7ee);margin-top:48px}
.gf-in{max-width:1180px;margin:0 auto;padding:30px 24px 42px}
.gf-logo{display:inline-flex;align-items:center;gap:10px;color:var(--text-primary,#1a2330);font-weight:300;font-size:18px;margin-bottom:12px}
.gf-logo i{color:var(--accent,#2563eb);font-size:20px}
.gf-logo .ac{color:var(--accent,#2563eb)}
.gf p{margin:0 0 7px;font-size:12.5px;line-height:1.85;color:var(--text-secondary,#5b6675)}
.gf a{color:var(--accent,#2563eb);text-decoration:none}
.gf a:hover{text-decoration:underline}