/* Proposal document layout. Extends styles.css; the marketing page is untouched. */

.doc-hero { background: #103d2e; color: #fff; padding: 74px 0 78px; position: relative; overflow: hidden; }
.doc-hero::after { content: 'K'; position: absolute; right: 4%; top: -150px; color: rgba(255, 255, 255, .045); font-family: Manrope, sans-serif; font-size: 32rem; font-weight: 800; line-height: 1; pointer-events: none; }
.doc-hero .container { position: relative; z-index: 1; }
.doc-hero .eyebrow { color: #f1bd55; }
.doc-hero h1 { max-width: 880px; margin-bottom: 22px; font-family: Manrope, 'DM Sans', sans-serif; font-size: clamp(2.6rem, 5vw, 4.6rem); font-weight: 800; letter-spacing: -.055em; line-height: 1.06; }
.doc-hero h1 em { font-style: normal; color: #6fc79c; }
.doc-hero-lede { max-width: 620px; margin-bottom: 38px; color: #cfe2d4; font-size: 1.08rem; }
.doc-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 26px; margin-bottom: 40px; }
.doc-action-link { display: inline-flex; align-items: center; gap: 12px; padding-bottom: 6px; border-bottom: 1px solid #5c8b74; color: #eaf3ec; font-size: .86rem; font-weight: 700; }
.doc-action-link:hover { border-bottom-color: #f0bc50; color: #fff; }

.doc-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 24px; max-width: 930px; padding-top: 28px; border-top: 1px solid #3c6552; }
.doc-meta div { display: flex; flex-direction: column; gap: 7px; }
.doc-meta dt, .doc-meta strong { color: #8fb79f; font-size: .58rem; font-weight: 800; letter-spacing: .14em; }
.doc-meta span { color: #eef5ef; font-size: .93rem; font-weight: 600; }

.doc-toc { background: #f5f7f0; border-bottom: 1px solid #e0e8dd; padding: 34px 0; }
.doc-toc ol { display: grid; grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); gap: 11px 34px; margin: 0; padding: 0; list-style: none; counter-reset: toc; }
.doc-toc li { counter-increment: toc; }
.doc-toc a { display: flex; gap: 11px; align-items: baseline; color: #33493c; font-size: .88rem; font-weight: 600; }
.doc-toc a::before { content: counter(toc, decimal-leading-zero); color: #1d8159; font-size: .68rem; font-weight: 800; }
.doc-toc a:hover { color: #14805a; }

.doc-body { padding: 68px 0 30px; background: #fafaf5; }
.doc-body .container { width: min(880px, calc(100% - 64px)); }
.doc-section { padding-bottom: 58px; }
.doc-section + .doc-section { padding-top: 10px; }
.doc-section > h2 { display: flex; gap: 18px; align-items: baseline; margin-bottom: 26px; font-size: clamp(1.85rem, 3.1vw, 2.7rem); }
.doc-num { color: #1d8159; font-family: 'DM Sans', sans-serif; font-size: .82rem; font-weight: 800; letter-spacing: 0; flex: none; }
.doc-section h3 { margin: 38px 0 12px; font-size: 1.24rem; letter-spacing: -.035em; color: #10432f; }
.doc-section h3:first-of-type { margin-top: 26px; }
.doc-section p { color: #52655a; font-size: 1.01rem; }
.doc-section p.lead { font-size: 1.16rem; color: #36503f; }
.doc-section strong { color: #123425; }

.doc-list { margin: 0 0 20px; padding: 0; list-style: none; }
.doc-list li { position: relative; padding: 0 0 0 26px; margin-bottom: 13px; color: #52655a; font-size: 1.01rem; line-height: 1.65; }
.doc-list li::before { content: ''; position: absolute; left: 2px; top: .62em; width: 7px; height: 7px; border-radius: 2px; background: #cfa63f; }

.doc-table { width: 100%; margin: 6px 0 20px; border-collapse: collapse; font-size: .93rem; }
.doc-table th { padding: 0 16px 12px 0; border-bottom: 1px solid #c8d8ca; color: #147550; font-size: .6rem; font-weight: 800; letter-spacing: .13em; text-align: left; vertical-align: bottom; }
.doc-table td { padding: 15px 16px 15px 0; border-bottom: 1px solid #e0e7dc; color: #55685b; vertical-align: top; line-height: 1.55; }
.doc-table td:last-child, .doc-table th:last-child { padding-right: 0; }
.doc-table tbody tr:last-child td { border-bottom: 0; }
.doc-table .td-strong { color: #123425; font-weight: 600; }
.doc-table .td-stage { color: #12664a; font-weight: 700; white-space: nowrap; }

.doc-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); gap: 1px; margin: 26px 0 10px; background: #dde6da; border: 1px solid #dde6da; border-radius: 10px; overflow: hidden; }
.doc-cards article { padding: 26px 24px 28px; background: #fff; }
.doc-cards .card-icon { width: 34px; height: 34px; display: grid; place-items: center; margin-bottom: 16px; border-radius: 8px; background: #e8f1e7; color: #197150; }
.doc-cards h3 { margin: 0 0 9px; font-size: 1.07rem; }
.doc-cards p { margin: 0; font-size: .89rem; line-height: 1.6; }

.doc-callout { margin: 26px 0; padding: 28px 30px; border-radius: 11px; border-left: 4px solid #17805a; background: #fff; box-shadow: 0 8px 26px rgba(20, 65, 39, .06); }
.doc-callout p:last-child { margin-bottom: 0; }
.doc-callout.callout-dark { border-left-color: #f0bc50; background: #113d2e; color: #d5e5d9; box-shadow: none; }
.doc-callout.callout-dark p { color: #d5e5d9; }
.doc-callout.callout-dark strong { color: #fff; }

.doc-flow { margin: 26px 0 0; border-top: 1px solid #d6e5d8; }
.doc-flow article { display: grid; grid-template-columns: 46px 1fr; gap: 20px; padding: 22px 0; border-bottom: 1px solid #d6e5d8; }
.doc-flow article > span { color: #1c825a; font-weight: 800; font-size: .76rem; padding-top: 3px; }
.doc-flow h3 { margin: 0 0 7px; font-size: 1.1rem; }
.doc-flow p { margin: 0; font-size: .9rem; }

.doc-note { margin-top: 12px; color: #74856f; font-size: .85rem; font-style: italic; }

.doc-close { padding: 20px 0 82px; background: #fafaf5; }
.doc-close .container { width: min(880px, calc(100% - 64px)); }
.doc-close-inner { display: flex; align-items: center; justify-content: space-between; gap: 40px; padding: 46px 48px; border-radius: 13px; color: #fff; background: radial-gradient(circle at 95% 0%, #2c7955, transparent 48%), #113d2e; }
.doc-close-inner h2 { margin: 0 0 12px; font-size: clamp(1.9rem, 3.4vw, 2.6rem); }
.doc-close-inner p { margin: 0; max-width: 400px; color: #cfe2d4; font-size: .95rem; }

@media print {
  .site-header, .doc-toc, .site-footer, .doc-close, .skip-link, .doc-actions { display: none; }
  .doc-hero { background: #fff; color: #10432f; padding: 0 0 30px; }
  .doc-hero::after, .doc-hero-lede { color: #52655a; }
  .doc-hero::after { display: none; }
  .doc-hero h1, .doc-hero h1 em { color: #10432f; }
  .doc-meta dt, .doc-meta strong { color: #6b7d70; }
  .doc-meta span { color: #10432f; }
  .doc-section { page-break-inside: avoid; }
  .doc-body .container, .doc-hero .container { width: 100%; }
}

@media (max-width: 850px) {
  .doc-hero { padding: 50px 0 54px; }
  .doc-body { padding-top: 48px; }
  .doc-body .container, .doc-close .container { width: calc(100% - 40px); }
  .doc-section > h2 { flex-direction: column; gap: 8px; }
  .doc-table, .doc-table tbody, .doc-table tr, .doc-table td { display: block; width: 100%; }
  .doc-table thead { display: none; }
  .doc-table tr { padding: 16px 0; border-bottom: 1px solid #e0e7dc; }
  .doc-table td { padding: 3px 0; border: 0; }
  .doc-table td[data-label]::before { content: attr(data-label); display: block; margin-bottom: 4px; color: #147550; font-size: .56rem; font-weight: 800; letter-spacing: .13em; }
  .doc-close-inner { flex-direction: column; align-items: flex-start; padding: 34px 28px; }
}
