/* Shared contract typography & layout */
:root {
  --cusp-ivory:   #F4EFE6;
  --cusp-limestone:#E8E0D2;
  --cusp-paper:   #FCFAF5;
  --cusp-black:   #171615;
  --cusp-charcoal:#11110F;
  --cusp-grey:    #6F685F;
  --cusp-grey-soft:#9C958A;
  --cusp-gold:    #B8944E;
  --cusp-gold-soft:#D7B66A;
  --cusp-line:    rgba(23,22,21,0.08);
  --font-sans: "Helvetica Neue", Helvetica, Arial, system-ui, -apple-system, sans-serif;
  --font-serif: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, "Times New Roman", Georgia, serif;
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
::selection { background: var(--cusp-black); color: var(--cusp-ivory); }
html, body {
  background: var(--cusp-ivory);
  color: var(--cusp-black);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.55;
}
.italic { font-family: var(--font-serif); font-style: italic; font-weight: 400; }
.bold { font-weight: 700; }
a { color: inherit; }

.chrome {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  padding: 22px 44px;
  display: flex; justify-content: space-between; align-items: center;
  background: rgba(244,239,230,0.92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--cusp-line);
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; font-weight: 600;
}
.chrome .left { font-weight: 700; letter-spacing: 0.32em; font-size: 18px; }
.chrome a { color: inherit; text-decoration: none; }
.chrome .right { display: flex; gap: 24px; color: var(--cusp-grey); }
.chrome .right .ref { font-family: ui-monospace, "SF Mono", Menlo, Monaco, monospace; color: var(--cusp-grey-soft); }

.page { max-width: 880px; margin: 0 auto; padding: 140px 40px 120px; }
@media (max-width: 700px) { .page { padding: 110px 22px 80px; } .chrome { padding: 18px 22px; } }

.doc-header { border-bottom: 1px solid var(--cusp-line); padding-bottom: 36px; margin-bottom: 56px; }
.doc-header .doctype { font-size: 11px; letter-spacing: 0.32em; text-transform: uppercase; font-weight: 700; color: var(--cusp-gold); }
.doc-header h1 { font-size: clamp(32px, 4vw, 46px); font-weight: 300; letter-spacing: -0.025em; line-height: 1.05; margin-top: 16px; }
.doc-header h1 .italic { font-weight: 400; }
.doc-header .meta-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 22px; margin-top: 28px; }
.doc-header .meta { font-size: 12px; }
.doc-header .meta .label { color: var(--cusp-grey); text-transform: uppercase; letter-spacing: 0.18em; font-weight: 600; margin-bottom: 4px; }
.doc-header .meta .value { font-weight: 600; }

.parties { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--cusp-line); border: 1px solid var(--cusp-line); margin: 28px 0; }
.party { background: var(--cusp-paper); padding: 24px; }
.party .label { font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--cusp-grey); font-weight: 700; margin-bottom: 10px; }
.party .name { font-size: 15px; font-weight: 600; margin-bottom: 4px; }
.party .detail { font-size: 12.5px; color: var(--cusp-grey); line-height: 1.5; }
@media (max-width: 700px) { .parties { grid-template-columns: 1fr; } }

.sec { margin-bottom: 48px; }
.sec h2 { font-size: 13px; letter-spacing: 0.28em; text-transform: uppercase; color: var(--cusp-gold); font-weight: 700; margin-bottom: 18px; }
.sec p { margin-bottom: 14px; font-size: 15px; line-height: 1.65; }
.sec p:last-child { margin-bottom: 0; }
.sec strong { font-weight: 600; }

.clauses { counter-reset: cl; }
.clause { display: grid; grid-template-columns: 56px 1fr; gap: 24px; padding: 26px 0; border-top: 1px solid var(--cusp-line); }
.clause:first-of-type { border-top: none; padding-top: 0; }
.clause .num { font-size: 13px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--cusp-gold); font-weight: 700; padding-top: 4px; }
.clause .body h4 { font-size: 17px; font-weight: 600; margin-bottom: 10px; letter-spacing: -0.005em; }
.clause .body p { font-size: 14.5px; line-height: 1.65; margin-bottom: 12px; }
.clause .body p:last-child { margin-bottom: 0; }
@media (max-width: 700px) { .clause { grid-template-columns: 44px 1fr; gap: 16px; } }

.figure {
  background: var(--cusp-charcoal); color: var(--cusp-ivory);
  border-radius: 6px;
  padding: 28px; margin: 18px 0;
}
.figure .label { font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--cusp-gold-soft); font-weight: 700; margin-bottom: 10px; }
.figure .amt { font-size: 30px; font-weight: 300; letter-spacing: -0.02em; line-height: 1.05; margin-bottom: 8px; }
.figure .desc { font-size: 13px; color: rgba(244,239,230,0.78); line-height: 1.55; }

.checklist { list-style: none; padding: 0; margin: 14px 0; }
.checklist li { padding: 10px 0 10px 32px; position: relative; font-size: 14px; line-height: 1.55; border-bottom: 1px solid var(--cusp-line); }
.checklist li::before { content: ""; position: absolute; left: 4px; top: 14px; width: 16px; height: 16px; border: 1.5px solid var(--cusp-gold); border-radius: 3px; }
.checklist li.done::before { background: var(--cusp-gold); }
.checklist li.done::after { content: "&#10003;"; position: absolute; left: 6px; top: 12px; color: var(--cusp-charcoal); font-size: 12px; font-weight: 900; }
.checklist li strong { font-weight: 600; }
.checklist li .meta { display: block; font-size: 12px; color: var(--cusp-grey); margin-top: 3px; }

.sigs { margin-top: 80px; padding-top: 48px; border-top: 2px solid var(--cusp-black); }
.sigs h3 { font-size: 18px; font-weight: 600; margin-bottom: 6px; }
.sigs .sub { font-size: 13px; color: var(--cusp-grey); margin-bottom: 32px; }
.sig-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media (max-width: 700px) { .sig-grid { grid-template-columns: 1fr; } }
.sig-row { padding: 24px; background: var(--cusp-paper); border: 1px solid var(--cusp-line); border-radius: 4px; }
.sig-row .role { font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--cusp-gold); font-weight: 700; margin-bottom: 8px; }
.sig-row .who { font-size: 14px; font-weight: 600; margin-bottom: 24px; }
.sig-row .pad { height: 64px; border: 1px dashed var(--cusp-grey-soft); border-radius: 3px; background: var(--cusp-ivory); display: flex; align-items: center; justify-content: center; font-size: 11px; color: var(--cusp-grey); letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 12px; }
.sig-row .when { font-size: 11px; color: var(--cusp-grey-soft); }

.cta-row { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 48px; padding-top: 36px; border-top: 1px solid var(--cusp-line); }
.btn { font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; font-weight: 700; padding: 16px 26px; border-radius: 999px; border: none; cursor: pointer; transition: background 0.2s; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; }
.btn.primary { background: var(--cusp-black); color: var(--cusp-ivory); }
.btn.primary:hover { background: var(--cusp-gold); }
.btn.secondary { background: transparent; color: var(--cusp-black); border: 1px solid var(--cusp-black); }
.btn.secondary:hover { background: var(--cusp-black); color: var(--cusp-ivory); }

.cusp-note { padding: 22px 26px; background: rgba(184,148,78,0.08); border-left: 3px solid var(--cusp-gold); border-radius: 4px; margin: 28px 0; font-size: 13.5px; line-height: 1.65; color: var(--cusp-grey); }
.cusp-note strong { color: var(--cusp-black); }

.foot { padding: 36px 44px; text-align: center; border-top: 1px solid var(--cusp-line); font-size: 11px; color: var(--cusp-grey); letter-spacing: 0.18em; text-transform: uppercase; }
.foot a { color: inherit; text-decoration: none; }
