/* hearth.software: shared look for every page except the home page, which has its own
   copy of the same design. Colours, type, the top menu and the footer live here, so a
   change made once shows everywhere. */
:root {
  --bg: #0E0C0A; --bg2: #161310;
  --surface: #1C1916; --surface-2: #231F1B; --surface-3: #2A251F;
  --line: rgba(242,237,230,.10); --line-md: rgba(242,237,230,.16);
  --text: #F2EDE6; --text-dim: rgba(242,237,230,.62); --text-faint: rgba(242,237,230,.38);
  --ember: #C4622D; --ember-bright: #E07840; --ember-wash: rgba(196,98,45,.12); --ember-line: rgba(196,98,45,.35);
  --gold: #C9A96E; --live: #3DBE7A; --violet: #A88BD9;
  --serif: "Palatino Linotype", "Book Antiqua", Palatino, Georgia, serif;
  --ui: -apple-system, "Segoe UI", system-ui, Roboto, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 76px; }
body { margin: 0; background: var(--bg); color: var(--text); font: 16px/1.65 var(--ui); -webkit-font-smoothing: antialiased; padding-top: 60px; }
a { color: var(--ember-bright); }
h1, h2 { font-family: var(--serif); letter-spacing: -.5px; }
h1 { font-weight: 900; }
h2 { font-weight: 700; }
code { font-family: var(--mono); }

/* Top menu: the same on every page */
.site-nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; height: 60px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 0 40px; background: rgba(14,12,10,.86); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-bottom: 1px solid var(--line); }
.site-logo { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--text); }
.site-logo span { font-family: var(--serif); font-size: 18px; font-weight: 700; letter-spacing: -.3px; }
.site-logo small { font: 12px var(--mono); color: var(--text-faint); margin-left: 2px; }
.site-links { display: flex; align-items: center; gap: 26px; }
.site-links a { font-size: 13.5px; color: var(--text-dim); text-decoration: none; }
.site-links a:hover, .site-links a[aria-current="page"] { color: var(--text); }
.site-cta { padding: 8px 18px; border-radius: 8px; background: var(--ember); color: #fff !important; font-weight: 500; }
.site-cta:hover { background: var(--ember-bright); }
.site-menu { display: none; position: relative; }
.site-menu summary { list-style: none; cursor: pointer; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; border-radius: 10px; color: var(--text); }
.site-menu summary::-webkit-details-marker { display: none; }
.site-menu[open] summary { background: var(--surface); }
.site-menu-panel { position: absolute; right: 0; top: 52px; width: min(280px, calc(100vw - 32px)); background: var(--surface); border: 1px solid var(--line-md); border-radius: 14px; padding: 8px; box-shadow: 0 20px 50px rgba(0,0,0,.5); }
.site-menu-panel a { display: block; padding: 12px 14px; border-radius: 10px; color: var(--text); text-decoration: none; font-size: 15px; }
.site-menu-panel a:hover, .site-menu-panel a[aria-current="page"] { background: var(--surface-2); }
.site-menu-panel .site-cta { text-align: center; margin-top: 6px; }

/* Footer: the same on every page */
.site-foot { margin-top: 96px; border-top: 1px solid var(--line); }
.site-foot-in { max-width: 1100px; margin: 0 auto; padding: 40px 40px 48px; display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); gap: 28px; }
.site-foot-brand { font-family: var(--serif); font-size: 20px; font-weight: 700; color: var(--text); }
.site-foot p { margin: 6px 0 0; color: var(--text-faint); font-size: 14px; }
.site-foot h4 { margin: 0 0 10px; font: 600 11px/1 var(--ui); letter-spacing: .12em; text-transform: uppercase; color: var(--ember-bright); }
.site-foot ul { list-style: none; margin: 0; padding: 0; }
.site-foot li { margin: 0 0 8px; }
.site-foot li a { color: var(--text-dim); text-decoration: none; font-size: 14px; }
.site-foot li a:hover { color: var(--text); }

@media (max-width: 900px) {
  .site-nav { padding: 0 16px; }
  .site-links { display: none; }
  .site-menu { display: block; }
  .site-foot-in { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 32px 16px 40px; }
  .site-foot-in > :first-child { grid-column: 1 / -1; }
}

/* Page styles for FAQ-style <details> must not touch the menu. */
details.site-menu { background: none; border: 0; border-radius: 0; padding: 0; margin: 0; }
details.site-menu > summary { padding: 0; font-weight: 400; }
details.site-menu > summary::after { content: none !important; }
.site-menu-panel .site-cta, .site-menu-panel .site-cta[aria-current="page"] { background: var(--ember); color: #fff; }
/* Older pages style the bare footer element; the shared footer wins. */
footer.site-foot { display: block; padding: 0; gap: 0; font-size: inherit; color: inherit; margin-top: 96px; }
nav.site-nav { flex-wrap: nowrap; }