/* FUEGO — top navigation. One source of truth: loaded by front-page.php and header.php.
   All nav styling is class-based (no inline styles), so rules here always win. */

.fg-topnav{position:sticky;top:0;z-index:100;background:var(--char-950);border-bottom:1px solid var(--line-dim)}
.fg-topnav-in{max-width:1320px;margin:0 auto;padding:0 clamp(20px,4vw,24px);min-height:66px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;box-sizing:border-box}
.fg-topnav .fg-brand{flex:none;display:flex;align-items:center;text-decoration:none}
.fg-topnav .fg-brand img{height:18px;width:auto;display:block}
.fg-topnav-actions{display:flex;align-items:center;gap:12px;margin-left:auto;flex-wrap:wrap;justify-content:flex-end}

.fg-topnav .fg-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--fdata);font-weight:600;font-size:10px;letter-spacing:var(--track-label);text-transform:uppercase;border-radius:var(--r-sm);border:1px solid transparent;min-height:32px;padding:0 14px;white-space:nowrap;flex:none;cursor:pointer;transition:all var(--dur-fast) var(--ease-fuego);text-decoration:none;box-sizing:border-box}
.fg-topnav .fg-btn-secondary{background:transparent;border-color:var(--line);color:var(--champ)}
.fg-topnav .fg-btn-secondary:hover{background:var(--char-800);border-color:var(--grey-dim);color:var(--champ)}
.fg-topnav .fg-btn-outline{background:transparent;border-color:color-mix(in srgb, var(--blaze) 70%, var(--line));color:var(--blaze)}
.fg-topnav .fg-btn-outline:hover{background:var(--char-800);border-color:var(--blaze);color:var(--blaze);box-shadow:0 0 12px -6px var(--blaze)}

@media (max-width:760px){
	/* --fg-nav-pad is the ONE number for vertical space in the mobile nav */
	.fg-topnav{--fg-nav-pad:14px}
	.fg-topnav-in{flex-wrap:nowrap;justify-content:space-between;gap:12px;min-height:0;padding:var(--fg-nav-pad) 16px}
	.fg-topnav .fg-brand img{height:16px}
	.fg-topnav-actions{margin-left:0;gap:0;flex:none;flex-wrap:nowrap}
	.fg-topnav-actions .fg-btn{flex:none;padding:0 16px}
}