/* ============================================================
   Blueprint credentials page
   Scoped to .bp-credentials-body for gradual migration.
   Mirrors the bp-about / bp-rec / bp-thoughts blueprint pattern.
   ============================================================ */

.bp-credentials-body {
  background:
    radial-gradient(circle at 1px 1px, #c6cdd5 0.6px, transparent 0.7px) 0 0 / 24px 24px,
    #eef2f5;
  color: #16263a;
}

.bp-credentials-body strong { color: inherit; }

/* ---------- Nav ---------- */

.bp-cred-nav {
  position: sticky;
  top: 0;
  z-index: 100;
  min-height: 48px;
  padding: 12px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  background: #16263a;
  color: #ffffff;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.bp-cred-nav a:hover { text-decoration: none; }

.bp-cred-nav-brand,
.bp-cred-nav-links { display: flex; align-items: center; gap: 14px; }
.bp-cred-nav-links { list-style: none; flex-wrap: wrap; justify-content: flex-end; }
.bp-cred-nav-links a { color: #ffffff; }
.bp-cred-nav-links a[aria-current="page"] { color: #b9412a; }
.bp-cred-nav-muted { color: #a3b4c7; }

.bp-cred-dot {
  width: 8px;
  height: 8px;
  display: inline-block;
  border-radius: 999px;
  background: #3e7f5b;
  box-shadow: 0 0 0 2px rgba(62, 127, 91, 0.25);
}

/* ---------- Page shell ---------- */

.bp-cred-page {
  background:
    radial-gradient(circle at 1px 1px, #c6cdd5 0.6px, transparent 0.7px) 0 0 / 24px 24px,
    #eef2f5;
}

.bp-cred-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 430px);
  gap: 48px;
  padding: 44px 48px 36px;
  border-bottom: 1px solid #cdd3da;
}

.bp-cred-mono,
.bp-cred-kicker {
  font-family: var(--font-mono);
  font-size: 10.5px;
  line-height: 1.35;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #52617a;
  font-weight: 500;
}

.bp-cred-accent { color: #b9412a; }

.bp-cred-hero h1 {
  max-width: 980px;
  margin: 14px 0 0;
  color: #16263a;
  font-family: 'Newsreader', Georgia, serif;
  font-size: clamp(44px, 6vw, 72px);
  font-weight: 500;
  line-height: 0.99;
  letter-spacing: -0.032em;
}

.bp-cred-dek {
  max-width: 760px;
  margin-top: 18px;
  color: #52617a;
  font-family: 'Newsreader', Georgia, serif;
  font-size: 19px;
  line-height: 1.48;
}

.bp-cred-panel {
  background: #16263a;
  color: #ffffff;
  border: 1px solid #16263a;
}

.bp-cred-panel-head,
.bp-cred-panel-row { padding: 15px 18px; border-bottom: 1px solid rgba(255,255,255,0.16); }
.bp-cred-panel-head {
  display: flex; justify-content: space-between; gap: 16px;
  color: #a3b4c7; font-family: var(--font-mono); font-size: 10px;
  letter-spacing: 0.08em; text-transform: uppercase;
}
.bp-cred-panel-row span {
  display: block; color: #a3b4c7; font-family: var(--font-mono);
  font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase;
  margin-bottom: 6px;
}
.bp-cred-panel-row p { margin: 0; color: rgba(255,255,255,0.84); font-size: 13px; line-height: 1.5; }

/* ---------- Receipts strip ---------- */

.bp-cred-receipts {
  display: grid; grid-template-columns: repeat(6, 1fr);
  border-top: 1px solid #cdd3da; border-bottom: 1px solid #cdd3da;
  background: #ffffff;
}
.bp-cred-receipts article { padding: 20px 22px; border-right: 1px solid #cdd3da; }
.bp-cred-receipts article:last-child { border-right: 0; }
.bp-cred-receipts strong {
  display: block; color: #16263a;
  font-family: 'Fraunces', Georgia, serif;
  font-size: clamp(28px, 3.5vw, 38px);
  font-weight: 500; line-height: 1; letter-spacing: -0.02em;
}
.bp-cred-receipts span {
  display: block; margin-top: 8px; color: #52617a;
  font-family: var(--font-mono); font-size: 10px; line-height: 1.4;
  letter-spacing: 0.06em; text-transform: uppercase;
}

/* ---------- Section tags ---------- */

.bp-cred-section-tag {
  display: flex; justify-content: space-between; gap: 24px;
  padding: 14px 48px;
  border-top: 1px solid #16263a; border-bottom: 1px solid #cdd3da;
  color: #52617a; font-family: var(--font-mono);
  font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase;
}
.bp-cred-section-tag span:first-child { color: #b9412a; }

.bp-cred-section-tag-headline {
  background: #16263a;
  color: #ffffff;
  border-top-color: #16263a;
  border-bottom-color: #16263a;
}
.bp-cred-section-tag-headline span:first-child { color: #ffffff; }
.bp-cred-section-tag-headline span:last-child { color: #a3b4c7; }

.bp-cred-section-tag-quiet {
  border-top-color: #cdd3da;
  background: transparent;
  color: #7a8696;
}
.bp-cred-section-tag-quiet span:first-child { color: #7a8696; }

/* ---------- Standard cluster content row ---------- */

.bp-cred-content {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  gap: 42px;
  padding: 32px 48px 44px;
}

.bp-cred-sidebar { position: sticky; top: 72px; align-self: start; }
.bp-cred-sidebar h2 {
  margin-top: 8px; color: #16263a;
  font-family: 'Newsreader', Georgia, serif;
  font-size: 30px; font-weight: 500;
  line-height: 1.08; letter-spacing: -0.018em;
}
.bp-cred-sidebar p {
  margin-top: 12px; color: #52617a;
  font-family: 'Newsreader', Georgia, serif;
  font-size: 14px; font-style: italic; line-height: 1.6;
}

.bp-cred-main { display: grid; gap: 18px; }

/* ---------- Credential list rows ---------- */

.bp-cred-list {
  list-style: none; margin: 0; padding: 0;
  border-top: 1px solid #cdd3da;
}
.bp-cred-list li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: end;
  padding: 18px 0;
  border-bottom: 1px solid #cdd3da;
}
.bp-cred-row h3 {
  margin: 6px 0 0;
  color: #16263a;
  font-family: 'Newsreader', Georgia, serif;
  font-size: 22px; font-weight: 500; line-height: 1.2;
  letter-spacing: -0.012em;
}
.bp-cred-issuer {
  margin: 6px 0 0;
  color: #52617a; font-size: 13.5px; line-height: 1.4;
}
.bp-cred-meta { text-align: right; white-space: nowrap; }
.bp-cred-meta .bp-cred-mono { color: #16263a; }

/* Major variant — Education & Methodology — bigger headings */
.bp-cred-list-major li { padding: 22px 0; }
.bp-cred-list-major h3 { font-size: 26px; }

/* Quiet variant — Google Analytics — smaller, lower contrast */
.bp-cred-list-quiet li { padding: 12px 0; }
.bp-cred-list-quiet h3 {
  font-family: var(--font-sans);
  font-size: 16px;
  font-weight: 500;
  color: #2d3e55;
}
.bp-cred-list-quiet .bp-cred-meta .bp-cred-mono { color: #7a8696; }

/* ---------- Quiet content variant ---------- */

.bp-cred-content-quiet .bp-cred-sidebar h2,
.bp-cred-content-muted .bp-cred-sidebar h2 {
  color: #2d3e55;
}
.bp-cred-h2-quiet {
  font-size: 24px !important;
}

/* ---------- Muted content (additional coursework) ---------- */

.bp-cred-content-muted {
  background: rgba(255, 255, 255, 0.4);
  color: #52617a;
}
.bp-cred-content-muted .bp-cred-main {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px 32px;
}
.bp-cred-muted-note {
  font-style: normal !important;
  font-family: var(--font-mono) !important;
  font-size: 10.5px !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #7a8696 !important;
}

.bp-cred-tag-group {
  padding: 14px 0;
  border-top: 1px solid #cdd3da;
}
.bp-cred-tag-group:first-child,
.bp-cred-tag-group:nth-child(2) {
  border-top: 0;
}
.bp-cred-tag-group .bp-cred-mono {
  color: #7a8696;
  margin-bottom: 8px;
}
.bp-cred-tag-list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: 6px 8px;
}
.bp-cred-tag-list li {
  display: inline-block;
  padding: 4px 10px;
  background: #ffffff;
  border: 1px solid #cdd3da;
  color: #52617a;
  font-family: var(--font-sans);
  font-size: 12.5px;
  line-height: 1.3;
}

/* ============================================================
   Amplitude headline section — most weight
   ============================================================ */

.bp-cred-amplitude {
  background: #16263a;
  color: #ffffff;
  padding: 36px 48px 44px;
  border-bottom: 1px solid #16263a;
}

.bp-cred-amp-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 280px);
  gap: 36px;
  padding-bottom: 28px;
  border-bottom: 1px solid rgba(255,255,255,0.18);
}
.bp-cred-amp-kicker { color: #b9412a !important; }
.bp-cred-amp-head h2 {
  margin: 12px 0 0;
  color: #ffffff;
  font-family: 'Newsreader', Georgia, serif;
  font-size: clamp(34px, 4.5vw, 48px);
  font-weight: 500;
  line-height: 1.04;
  letter-spacing: -0.024em;
  max-width: 760px;
}
.bp-cred-amp-dek {
  margin-top: 16px;
  max-width: 660px;
  color: rgba(255,255,255,0.78);
  font-family: 'Newsreader', Georgia, serif;
  font-size: 17px;
  line-height: 1.5;
}

.bp-cred-amp-legend {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: 6px;
  align-self: end;
}
.bp-cred-amp-legend li {
  display: flex; align-items: center; gap: 10px;
  color: rgba(255,255,255,0.7);
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.bp-cred-amp-legend span {
  display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px;
  border: 1px solid rgba(255,255,255,0.32);
  color: #ffffff;
  font-size: 10.5px;
}

/* Tier bands */
.bp-cred-amp-tier {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 32px;
  padding: 26px 0;
  border-bottom: 1px solid rgba(255,255,255,0.16);
  align-items: start;
}
.bp-cred-amp-tier:last-child { border-bottom: 0; padding-bottom: 4px; }

.bp-cred-amp-tier-label .bp-cred-mono { color: rgba(255,255,255,0.6); }
.bp-cred-amp-tier-label h3 {
  margin: 6px 0 0;
  color: #ffffff;
  font-family: 'Newsreader', Georgia, serif;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.02em;
}
.bp-cred-amp-tier-label p:last-child {
  margin-top: 8px;
  color: rgba(255,255,255,0.62);
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.bp-cred-amp-grid {
  list-style: none; margin: 0; padding: 0;
  display: grid;
  gap: 1px;
  background: rgba(255,255,255,0.16);
  border: 1px solid rgba(255,255,255,0.16);
}
.bp-cred-amp-grid li {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 16px;
  padding: 14px 18px;
  background: #16263a;
}
.bp-cred-amp-grid strong {
  color: #ffffff;
  font-family: 'Newsreader', Georgia, serif;
  font-weight: 500;
  font-size: 20px;
  line-height: 1.2;
}
.bp-cred-amp-grid span {
  color: rgba(255,255,255,0.55);
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

/* Tier 1 — Expert — most prominent */
.bp-cred-amp-tier-expert .bp-cred-amp-tier-label h3 { font-size: 44px; }
.bp-cred-amp-tier-expert .bp-cred-amp-tier-label .bp-cred-mono { color: #b9412a; }
.bp-cred-amp-rarity {
  margin-top: 10px !important;
  color: #b9412a !important;
  font-family: 'Newsreader', Georgia, serif !important;
  font-style: italic;
  font-size: 14px !important;
  line-height: 1.4;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.bp-cred-amp-tier-expert .bp-cred-amp-grid {
  grid-template-columns: repeat(2, 1fr);
  background: #b9412a;
  border-color: #b9412a;
}
.bp-cred-amp-tier-expert .bp-cred-amp-grid li {
  background: #16263a;
  padding: 22px 22px;
}
.bp-cred-amp-tier-expert .bp-cred-amp-grid strong { font-size: 28px; }
.bp-cred-amp-tier-expert .bp-cred-amp-grid span { color: #b9412a; }

/* Tier 2 — Specialist */
.bp-cred-amp-tier-specialist .bp-cred-amp-tier-label h3 { font-size: 36px; }
.bp-cred-amp-tier-specialist .bp-cred-amp-grid {
  grid-template-columns: repeat(3, 1fr);
}
.bp-cred-amp-tier-specialist .bp-cred-amp-grid strong { font-size: 22px; }

/* Tier 3 — Practitioner */
.bp-cred-amp-tier-practitioner .bp-cred-amp-tier-label h3 { font-size: 30px; }
.bp-cred-amp-tier-practitioner .bp-cred-amp-grid {
  grid-template-columns: repeat(3, 1fr);
}
.bp-cred-amp-tier-practitioner .bp-cred-amp-grid strong { font-size: 19px; }

/* Tier 4 — Foundations — quietest within Amplitude */
.bp-cred-amp-tier-foundations .bp-cred-amp-tier-label h3 { font-size: 24px; }
.bp-cred-amp-tier-foundations .bp-cred-amp-grid {
  grid-template-columns: repeat(3, 1fr);
}
.bp-cred-amp-tier-foundations .bp-cred-amp-grid li { padding: 11px 16px; }
.bp-cred-amp-tier-foundations .bp-cred-amp-grid strong {
  font-family: var(--font-sans);
  font-size: 15px;
  font-weight: 500;
  color: rgba(255,255,255,0.88);
}

/* ---------- Next links ---------- */

.bp-cred-next {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid #cdd3da;
  border-left: 1px solid #cdd3da;
}
.bp-cred-next a {
  min-height: 150px;
  padding: 22px 24px;
  background: #ffffff;
  border-right: 1px solid #cdd3da;
  border-bottom: 1px solid #cdd3da;
  display: flex; flex-direction: column; gap: 10px;
}
.bp-cred-next a:hover { text-decoration: none; background: #f8fafc; }
.bp-cred-next strong {
  color: #16263a;
  font-family: 'Newsreader', Georgia, serif;
  font-size: 22px; font-weight: 500; line-height: 1.12;
}
.bp-cred-next span:last-child {
  color: #52617a; font-size: 13.5px; line-height: 1.55;
}

/* ============================================================
   Responsive
   ============================================================ */

@media (max-width: 1040px) {
  .bp-cred-hero,
  .bp-cred-content,
  .bp-cred-amp-head { grid-template-columns: 1fr; }
  .bp-cred-sidebar { position: static; }
  .bp-cred-receipts,
  .bp-cred-next { grid-template-columns: repeat(2, 1fr); }
  .bp-cred-content-muted .bp-cred-main { grid-template-columns: 1fr; }
  .bp-cred-amp-tier { grid-template-columns: 1fr; gap: 16px; }
  .bp-cred-amp-legend { justify-self: start; }
  .bp-cred-amp-tier-expert .bp-cred-amp-grid,
  .bp-cred-amp-tier-specialist .bp-cred-amp-grid,
  .bp-cred-amp-tier-practitioner .bp-cred-amp-grid,
  .bp-cred-amp-tier-foundations .bp-cred-amp-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 720px) {
  .bp-cred-nav {
    position: static;
    align-items: flex-start;
    flex-direction: column;
    padding: 14px 20px;
  }
  .bp-cred-nav-links { justify-content: flex-start; gap: 12px 18px; }
  .bp-cred-hero,
  .bp-cred-content,
  .bp-cred-section-tag,
  .bp-cred-amplitude { padding-left: 20px; padding-right: 20px; }
  .bp-cred-section-tag { flex-direction: column; gap: 6px; }
  .bp-cred-receipts,
  .bp-cred-next { grid-template-columns: 1fr; }
  .bp-cred-hero h1 { font-size: 38px; }
  .bp-cred-amp-tier-expert .bp-cred-amp-grid,
  .bp-cred-amp-tier-specialist .bp-cred-amp-grid,
  .bp-cred-amp-tier-practitioner .bp-cred-amp-grid,
  .bp-cred-amp-tier-foundations .bp-cred-amp-grid {
    grid-template-columns: 1fr;
  }
  .bp-cred-list li {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .bp-cred-meta { text-align: left; }
}