/* PeptiCEOs signature, per the brand guidelines (v2.0, page 3).
 *
 * The inherited stylesheets set "Pepti" above a small tracked "BLUEPRINT".
 * The PeptiCEOs mark is one line: "Pepti" in navy (white on dark) and "CEOs"
 * in soft gold, both DM Sans, same size, no tracking or capitals trick.
 * Loaded last, so it wins over the inherited rules without !important.
 */
:root {
  --pc-navy: #101B2B;
  --pc-gold-soft: #C9AF7A;
  --pc-gold: #977644;
  --pc-ivory: #FBFAF7;
  --pc-paper: #F5F3EE;
  --pc-ink: #20221E;
  --pc-muted: #696C62;
  --pc-border: #DEDBD2;
}

.official-wordmark.pc-wordmark {
  display: inline-flex;
  flex-direction: row;
  align-items: baseline;
  gap: 0;
  font-family: "DM Sans", Arial, sans-serif;
  font-size: 1.6rem;
  font-weight: 650;
  line-height: 1;
  letter-spacing: -0.035em;
  white-space: nowrap;
}
.official-wordmark.pc-wordmark > span,
.official-wordmark.pc-wordmark b {
  font-family: "DM Sans", Arial, sans-serif;
  font-size: inherit;
  font-weight: 650;
  letter-spacing: inherit;
  line-height: 1;
  text-transform: none;
}
.official-wordmark.pc-wordmark > span { color: var(--pc-navy); }
.official-wordmark.pc-wordmark b { color: var(--pc-gold-soft); }

footer .official-wordmark.pc-wordmark { font-size: 1.85rem; }
footer .official-wordmark.pc-wordmark > span { color: #FFFFFF; }
footer .official-wordmark.pc-wordmark b { color: var(--pc-gold-soft); }

@media (max-width: 760px) {
  .official-wordmark.pc-wordmark { font-size: 1.35rem; }
}

/* Readability, from the homepage review.
 *
 * Body copy on the light sections was the guidelines' Muted grey (#696C62).
 * That colour is meant for secondary text; for paragraphs read after a long
 * day it is too faint, so running copy steps up towards Ink. The 12px fine
 * print, which carries the disclaimers, sat at about 4.1:1 against ivory,
 * under the 4.5:1 minimum; it now clears it.
 */
.section:not(.import-dark):not(.experience):not(footer) p,
.section:not(.import-dark):not(.experience):not(footer) li,
.faq details p { color: #46483F; }
/* Navy panels inside light sections keep their own light text. */
.offer-ledger p, .offer-ledger li, .offer-ledger small, .offer-ledger .fine,
.economics-output p, .economics-output li, .economics-output small, .economics-output .fine,
.apply-card p, .apply-card li, .apply-card small { color: rgba(255,255,255,.78) !important; }
.import-fine, .section:not(footer) .fine, .section:not(footer) small { color: #5E6057; }
/* !important because the light-section rule above is more specific than any
   selector that names a navy panel, and on navy it would be dark on dark. */
.import-dark .import-fine, .import-dark .fine, .import-dark small,
.experience .fine, .experience small { color: rgba(255,255,255,.72) !important; }

/* Fade-ins were a full second with a 35px rise on every section, slow enough
 * that a quick scroll lands on half-faded text. */
.reveal { transition: opacity .5s ease-out, transform .5s ease-out !important; }
.motion .reveal { transform: translateY(14px); }