/* ─────────────────────────────────────────────────────────────────────────────
   Bugnet — shared theme (capture-mark brand)
   Loaded last on every page (blog posts get it through shared/blog.css) so the
   page-level stylesheets keep their layout while picking up one type system,
   one button language and the navy / cobalt / signal-red palette.
   Palette values themselves live in each page's :root tokens.
   ───────────────────────────────────────────────────────────────────────────── */

:root {
  --bn-navy: #0A0F1E;
  --bn-navy-2: #121A33;
  --bn-cobalt: #2E5BFF;
  --bn-cobalt-d: #1E44D8;
  --bn-cobalt-lt: #E7EDFF;
  --bn-red: #FF4D3D;
  --bn-red-lt: #FFE8E5;
  --bn-green: #16B67F;
  --bn-amber: #F5A524;
  --bn-text: #0E1320;
  --bn-muted: #566074;
  --bn-line: #E4E7EE;
  --bn-soft: #F5F7FB;
  --f-mono: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
  --f-pixel: 'Silkscreen', 'JetBrains Mono', monospace;
}

body {
  font-family: 'Manrope', 'Helvetica Neue', Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  word-spacing: 0.02em;
}

h1, h2, h3, h4 { font-weight: 800; letter-spacing: -0.03em; }
h1 { letter-spacing: -0.04em; }

/* The old theme set a word in each headline in italic coral. Keep the accent,
   drop the italic: Manrope has no true italic and faux-italics look cheap. */
h1 em, h2 em, h3 em { font-style: normal; color: var(--bn-cobalt); }

code, pre, kbd, samp { font-family: var(--f-mono); }

::selection { background: rgba(46, 91, 255, 0.18); }

a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, summary:focus-visible {
  outline: 2px solid var(--bn-cobalt);
  outline-offset: 2px;
}

/* ─── Buttons: flat, crisp, 10px radius (replaces the chunky 3D press) ──── */
.btn, .nav-cta, .cta-btn, .btn-primary, .btn-secondary, .btn-ghost, .btn-outline, .btn-sage {
  border-radius: 10px;
  letter-spacing: -0.005em;
  font-weight: 700;
}
.btn-primary {
  background: var(--bn-cobalt);
  color: #fff;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 6px 16px -6px rgba(46, 91, 255, 0.6);
}
.btn-primary:hover { background: var(--bn-cobalt-d); transform: none; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 6px 16px -6px rgba(46, 91, 255, 0.6); }
.btn-primary:active { transform: translateY(1px); box-shadow: none; }
.btn-sage { box-shadow: none; }
.btn-sage:hover { transform: none; }

/* ─── Logo: capture mark + lowercase wordmark ───────────────────────────── */
.bn-mark { color: var(--bn-cobalt); flex: none; display: block; }
.nav-logo, .footer-logo, .sidebar-logo, .mobile-logo, .login-logo {
  display: inline-flex; align-items: center; gap: 9px; text-decoration: none;
}
.nav-logo .wordmark, .footer-logo .wordmark, .sidebar-logo .wordmark,
.mobile-logo .wordmark, .login-logo > span {
  font-family: 'Manrope', sans-serif;
  font-weight: 800;
  letter-spacing: -0.05em;
  line-height: 1;
}
.nav-logo .wordmark, .sidebar-logo .wordmark, .mobile-logo .wordmark, .login-logo > span { color: var(--bn-text); }
/* Site footers are navy (the homepage's white footer overrides this in main.css). */
footer .footer-logo .wordmark { color: #fff; }
footer .footer-logo .bn-mark { color: #7EA0FF; }
.nav-logo:hover { transform: none; }

/* Engine mark inside a call-to-action button (e.g. "Get the Godot plugin") */
.btn-engine-icon { height: 1.25em; width: auto; max-width: 1.5em; object-fit: contain; vertical-align: -0.25em; margin-right: 0.15em; flex-shrink: 0; }