/* Society chrome — topbar, header, colophon.
   Shared across the bfc.lol Common Room, the Authentik Cable gate, and any
   future Society-register page. Body-level setup (background, font) stays
   per-page so this composes cleanly with different layouts.

   Source: extracted from `authentik-private-cable.njk` after the third use
   approached (cable + decision render + common-room landing). */

@import url('https://fonts.googleapis.com/css2?family=Libre+Caslon+Text:ital,wght@0,400;0,700;1,400&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

/* ─────────────────────────────────────────────────────────────────────
   Topbar — ambient signal of which building we're in.
   Two epigraphs, small caps, hairline rule under.
   ───────────────────────────────────────────────────────────────────── */
.society-topbar {
  padding: 10px 56px;
  display: flex;
  justify-content: space-between;
  font-family: "IBM Plex Sans", sans-serif;
  font-size: 10px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: #6a6862;
  background: #f4eedc;
  border-bottom: 1px solid #d8cfb6;
}

/* ─────────────────────────────────────────────────────────────────────
   Society header — crest + nameplate + nav.
   Used at full strength on the Common Room; collapsed forms (just the
   nameplate, no nav) are valid variants for narrower pages.
   ───────────────────────────────────────────────────────────────────── */
.society-header {
  padding: 26px 56px 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 2px double #1a1f3c;
  background: #f4eedc;
}

.society-imprint {
  display: flex;
  align-items: center;
  gap: 18px;
}

.society-crest {
  width: 56px;
  height: 68px;
  flex: 0 0 auto;
}

/* Crest strokes/fills are token-driven so the navy flavor flips them.
   Mark SVG elements with these classes rather than hardcoded attrs. */
.society-crest .crest-outer  { stroke: #1a1f3c; stroke-width: 1.2; fill: none; }
.society-crest .crest-inner  { stroke: #b88a2c; stroke-width: 0.5; fill: none; }
.society-crest .crest-letter { fill: #1a1f3c; }
.society-crest .crest-gilt   { fill: #b88a2c; }

.society-nameplate {
  font-family: "Libre Caslon Text", serif;
  font-size: 23px;
  font-weight: 700;
  color: #1a1f3c;
  line-height: 1.05;
  letter-spacing: -0.005em;
}

.society-nameplate .nameplate-sub {
  display: block;
  font-family: "IBM Plex Sans", sans-serif;
  font-size: 10px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: #b88a2c;
  margin-top: 6px;
  font-style: italic;
}

.society-nameplate .nameplate-sub .silentio {
  color: #6a6862;
  font-style: normal;
}

/* Standalone-tagline variant. Italic Caslon, soft-ink, no eyebrow tracking.
   Adopted on public chambers (landing, LoI) where Pecunia stands alone
   under the wordmark. .nameplate-sub remains for the paired "founded/sub"
   shape elsewhere. */
.society-nameplate .nameplate-tagline {
  display: block;
  font-family: "Libre Caslon Text", serif;
  font-style: italic;
  font-size: 15px;
  color: #3a3548;
  margin-top: 6px;
  letter-spacing: -0.005em;
}

.society-nav {
  display: flex;
  gap: 26px;
  font-size: 13px;
  color: #1a1f3c;
  font-family: "IBM Plex Sans", sans-serif;
  font-weight: 500;
}

.society-nav a,
.society-nav span {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  border-bottom: 1px solid transparent;
  padding-bottom: 2px;
  transition: color 0.15s ease, border-bottom-color 0.15s ease;
}

.society-nav a:hover,
.society-nav .is-active {
  color: #b88a2c;
  border-bottom-color: #b88a2c;
}

/* ─────────────────────────────────────────────────────────────────────
   Colophon — runs along the foot of every Society page.
   Carries the BFC parent credit, the .lol heritage note, the Bulletin imprint.
   ───────────────────────────────────────────────────────────────────── */
.society-colophon {
  border-top: 1px solid #d8cfb6;
  background: #ede5ce;
  padding: 14px 56px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: center;
  font-family: "IBM Plex Sans", sans-serif;
  color: #6a6862;
  font-size: 11px;
  line-height: 1.55;
}

.society-colophon-imprint .imprint-label {
  color: #1a1f3c;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-size: 10px;
}

.society-colophon-imprint .imprint-name {
  font-family: "Libre Caslon Text", serif;
  font-style: italic;
  color: #1a1f3c;
  font-size: 12.5px;
  letter-spacing: -0.005em;
  margin: 0 0 0 10px;
}

.society-colophon-imprint .imprint-est {
  font-family: "IBM Plex Mono", monospace;
  font-size: 10px;
  color: #a09a8a;
  margin-left: 8px;
}

.society-colophon-imprint .imprint-registry {
  display: block;
  font-family: "IBM Plex Mono", monospace;
  font-size: 8.5px;
  letter-spacing: 0.1em;
  color: #a09a8a;
  margin-top: 4px;
}

.society-colophon-bulletin {
  text-align: right;
  font-family: "IBM Plex Mono", monospace;
  font-size: 9.5px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

@media (max-width: 720px) {
  .society-topbar { padding: 10px 20px; gap: 12px; flex-wrap: wrap; }
  .society-topbar > span:nth-child(2) { display: none; }
  .society-header { padding: 22px 24px 18px; flex-direction: column; align-items: flex-start; gap: 16px; }
  .society-nav { flex-wrap: wrap; gap: 14px 18px; font-size: 12px; }
  .society-colophon { padding: 14px 20px; grid-template-columns: 1fr; gap: 8px; }
  .society-colophon-bulletin { text-align: left; }
}