/* ============================================================
   KILR Proposal — Brand Overrides + Proposal Utilities
   Loaded after kilr-framework.css to override font families
   and add proposal-specific component classes.
   ============================================================ */

/* --- Font overrides for KILR proposals --- */
:root {
  --h--font-family: 'itc-benguiat', Georgia, serif;
  --sh--font-family: 'dm-sans', sans-serif;
  --p--font-family: 'dm-sans', sans-serif;
}

/* --- Proposal page base --- */
.proposal-page {
  background: #e6e6e4;
  position: relative;
  min-height: 100vh;
  overflow: hidden;
}

/* --- Paper texture overlay --- */
.paper-texture {
  display: none;
}

/* --- Page number badge (bottom-left yellow pill) --- */
.page-badge {
  position: absolute;
  bottom: 30px;
  left: 30px;
  background: #fabd02;
  border-radius: 61px;
  padding: 3px 10px;
  z-index: 10;
  font-family: var(--p--font-family);
  font-size: 12px;
  font-weight: 500;
  color: #fff;
  line-height: 1.2;
}

/* --- KILR logo (in-flow, black on light bg) --- */
.proposal-logo {
  display: block;
  filter: brightness(0);
}

/* --- Accent bar (yellow top stripe) --- */
.accent-bar-top {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 5px;
  background: #fabd02;
  z-index: 2;
}

/* --- Yellow rule divider (centered) --- */
.yellow-rule {
  width: 40px;
  height: 3px;
  background: #fabd02;
  margin: 0 auto var(--space-xs);
}

/* --- Card with yellow left accent border --- */
.card-accent {
  background: #f5f5f5;
  border-left: 5px solid #fabd02;
  border-radius: 10px;
  padding: var(--space-xs);
}

/* --- Prepared by/for card (cover page) --- */
.prepared-card {
  background: #f5f5f3;
  border-radius: 12px;
  display: flex;
  overflow: hidden;
  box-shadow: 0 2px 16px rgba(0,0,0,0.07);
}

.prepared-card__section {
  flex: 1;
  padding: 20px 24px;
  text-align: center;
}

.prepared-card__divider {
  width: 1px;
  background: rgba(0,0,0,0.07);
  flex-shrink: 0;
}

/* --- Proposal content area (sits above texture) --- */
.proposal-content {
  position: relative;
  z-index: 5;
  padding-left: var(--space-s);
  padding-right: var(--space-s);
}

/* --- Scrollable page card (white bg, viewport-fixed, scrollable) --- */
.proposal-scroll-card {
  background: #fff;
  border-radius: 16px;
  height: calc(100vh - 90px);
  overflow-y: auto;
  margin-top: 12px;
}

/* --- Text color utilities --- */
.text-black { color: #000; }
.text-muted { color: #3a3a3a; }
.text-gray { color: #666; }
.text-label {
  font-size: var(--text-xxs);
  color: rgba(0,0,0,0.45);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin: 0 0 8px;
}

/* --- Font weight utilities --- */
.font-normal { font-weight: 400; }
.font-medium { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold { font-weight: 700; }

/* --- Text transform --- */
.uppercase { text-transform: uppercase; }
.italic { font-style: italic; }

/* --- Letter spacing for headings --- */
.tracking-tight { letter-spacing: -0.01em; }

/* --- Spacing utilities using framework vars --- */
.mb-0 { margin-bottom: 0; }
.mb-tiny { margin-bottom: var(--space-tiny); }
.mb-xxxs { margin-bottom: var(--space-xxxs); }
.mb-xxs { margin-bottom: var(--space-xxs); }
.mb-xs { margin-bottom: var(--space-xs); }
.mb-s { margin-bottom: var(--space-s); }
.mb-m { margin-bottom: var(--space-m); }
.mb-l { margin-bottom: var(--space-l); }
.mt-xs { margin-top: var(--space-xs); }
.mt-s { margin-top: var(--space-s); }

/* --- No bottom margin override for paragraphs --- */
.paragraph-m.mb-0,
.paragraph-s.mb-0,
.paragraph-xs.mb-0 {
  margin-bottom: 0;
}

/* --- List styles --- */
.list-disc {
  list-style-type: disc;
  padding-left: 18px;
}

.list-decimal {
  list-style-type: decimal;
  padding-left: 18px;
}

/* --- Bordered list item (pricing deliverables) --- */
.list-item-bordered {
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(0,0,0,0.2);
  margin-bottom: 6px;
}

/* --- Bordered header (pricing section headers) --- */
.header-bordered {
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  padding: 6px 0;
}

/* --- Signature line --- */
.signature-line {
  border-top: 1px solid #000;
  padding-top: 4px;
}

/* --- Cover page centered layout --- */
.proposal-cover-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: var(--space-xl) var(--space-s);
  min-height: 100vh;
}

/* --- Logo positioned absolute top-left --- */
.proposal-logo-abs {
  position: absolute;
  top: var(--space-xs);
  left: var(--space-s);
  z-index: 10;
  display: block;
  filter: brightness(0);
  width: 58px;
  height: 27px;
}

/* --- Pages with absolute logo need top padding for content clearance --- */
.proposal-page .proposal-content {
  padding-top: calc(var(--space-xs) + 27px + var(--space-s));
}
