/* Public document and team examples. Member tools keep their own styles. */
.doc-demo-page {
  --demo-panel: #15161d;
  --demo-border: #30323e;
}
.doc-proof-hero .premium-hero-grid {
  align-items: center;
}
.doc-proof-hero .hero-copy h1 {
  max-width: 670px;
}
.doc-proof-hero .hero-trust-note {
  margin: 10px 0 0;
}
.doc-proof-hero .funnel-access {
  margin-top: 8px;
}
.doc-paper {
  min-width: 0;
  margin: 0;
  border: 1px solid #d7d8e2;
  border-radius: 14px;
  background: #f8f8fb;
  color: #242633;
  padding: clamp(19px, 3.2vw, 40px);
  box-shadow: 0 20px 65px rgb(0 0 0 / 24%);
  overflow-wrap: anywhere;
}
.doc-paper h2, .doc-paper h3, .doc-paper strong, .doc-paper dt {
  color: #191a24;
}
.doc-paper h2, .doc-paper h3 {
  font-size: clamp(24px, 3vw, 35px);
  letter-spacing: -.04em;
  line-height: 1.16;
  margin: 10px 0 6px;
}
.doc-paper .doc-paper-kicker {
  color: #4145a4;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.doc-paper .doc-paper-note, .doc-paper .doc-paper-meta {
  color: #4f5263;
  font-size: 13px;
}
.doc-paper .doc-paper-meta {
  margin: 0 0 20px;
}
.doc-paper-timeline {
  margin: 0 0 16px;
}
.doc-paper-timeline > div {
  display: grid;
  grid-template-columns: 95px minmax(0, 1fr);
  gap: 10px;
  padding: 12px 0;
  border-top: 1px solid #d8dae3;
}
.doc-paper-timeline dt, .doc-paper-timeline dd {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
}
.doc-paper-timeline dt {
  font-weight: 700;
}
.doc-paper a {
  color: #363a9b;
  font-weight: 650;
  text-decoration: underline;
  text-underline-offset: 3px;
}
/* Keep light paper legible within the site's dark typography layer. */
@layer docstara-system {
  @media screen {
    .doc-paper :is(h2, h3) {
      color: #191a24 !important;
      font-size: clamp(24px, 3vw, 35px) !important;
      margin-bottom: 6px !important;
    }
    .doc-paper p {
      color: #242633 !important;
    }
    .doc-paper p.doc-paper-kicker {
      color: #4145a4 !important;
      font-size: 11px !important;
      letter-spacing: .1em !important;
    }
    .doc-paper p:is(.doc-paper-meta, .doc-paper-note) {
      color: #4f5263 !important;
      font-size: 13px !important;
    }
    .doc-paper .doc-demo-preview-text {
      font-size: 14px !important;
      line-height: 1.6 !important;
    }
    .doc-paper a {
      color: #363a9b !important;
    }
  }
}
.doc-proof-strip {
  padding: 34px 0;
  border-bottom: 1px solid var(--doc-border, #262832);
}
.doc-proof-strip h2 {
  font-size: clamp(24px, 3vw, 33px);
  letter-spacing: -.035em;
  margin: 5px 0 18px;
}
.doc-proof-links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.doc-proof-links a, .doc-demo-panel {
  background: var(--demo-panel, #15161d);
  border: 1px solid var(--demo-border, #30323e);
  border-radius: 11px;
  padding: 18px 20px;
}
.doc-proof-links a {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  color: #f4f5f7;
  font-weight: 650;
  text-decoration: none;
}
.doc-proof-links a:hover {
  border-color: #a2a5ff;
}
.doc-proof-links a span {
  color: #b4b7ff;
}
.doc-proof-review {
  border-top: 1px solid var(--doc-border, #262832);
}
.doc-proof-review .wrap, .doc-demo-readiness .wrap {
  max-width: 820px;
}
.doc-demo-intro, .doc-demo-main, .doc-demo-readiness {
  padding: clamp(44px, 7vw, 84px) 0;
}
.doc-demo-intro {
  padding-bottom: 22px;
}
.doc-demo-intro h1 {
  margin: 0 0 15px;
  font-size: clamp(40px, 6.5vw, 72px);
  line-height: 1.04;
  letter-spacing: -.055em;
}
.doc-demo-intro p:not(.hero-eyebrow), .doc-demo-team-copy, .doc-proof-review p:not(.section-kicker) {
  max-width: 690px;
  color: #bdc0cf;
}
.doc-demo-main {
  padding-top: 18px;
}
.doc-demo-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 18px;
  margin-bottom: 14px;
}
.doc-demo-toolbar h2 {
  margin: 0;
  font-size: clamp(23px, 3vw, 32px);
}
.doc-demo-grid, .doc-demo-team-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 18px;
}
.doc-demo-team-grid {
  align-items: stretch;
  margin: 18px 0;
}
.doc-demo-panel {
  min-width: 0;
}
.doc-demo-panel h3 {
  margin: 0 0 8px;
  font-size: 23px;
}
.doc-demo-panel p, .doc-demo-panel li, .doc-demo-caption {
  color: #bdc0cf;
}
.doc-demo-caption {
  font-size: 13px;
  margin: 10px 0 0;
}
.doc-demo-panel dl {
  margin: 14px 0;
}
.doc-demo-panel dt {
  font-weight: 650;
}
.doc-demo-panel dd {
  margin: 0 0 12px;
  color: #bdc0cf;
}
.doc-demo-panel details {
  margin-bottom: 15px;
}
.doc-demo-panel summary {
  cursor: pointer;
  font-weight: 650;
}
.doc-demo-panel ul {
  margin: 9px 0 0;
  padding-inline-start: 22px;
}
.doc-demo-panel .demo-brand-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.doc-demo-toolbar label, .doc-demo-panel label {
  display: block;
  margin: 0 0 6px;
  color: #eef0f6;
  font-size: 14px;
  font-weight: 600;
}
.doc-demo-panel input, .doc-demo-panel textarea, .doc-demo-toolbar select {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #60637a;
  border-radius: 7px;
  background: #101116;
  color: #f4f5f7;
  font: inherit;
  color-scheme: dark;
}
.doc-demo-panel textarea {
  min-height: 140px;
  resize: vertical;
}
.doc-demo-preview-text {
  white-space: pre-wrap;
  min-height: 100px;
  font-size: 14px;
  line-height: 1.6;
  margin: 16px 0;
}
.doc-demo-brand {
  min-height: 21px;
  line-height: 1.35;
}
.doc-demo-brand span {
  display: block;
  font-size: 13px;
}
.doc-demo-brand span:empty {
  display: none;
}
.doc-demo-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 15px;
}
.doc-demo-actions button:disabled {
  opacity: .65;
  cursor: default;
}
.doc-demo-status {
  min-height: 1.5em;
  margin: 8px 0 0;
  color: #d1d3e1;
}
.doc-demo-readiness {
  border-top: 1px solid var(--doc-border, #262832);
}
.doc-demo-checklist {
  min-width: 0;
  padding: 0;
  border: 0;
}
.doc-demo-checklist legend {
  margin: 0 0 10px;
  padding: 0;
  font-weight: 650;
}
.doc-demo-checklist label {
  display: flex;
  align-items: start;
  gap: 9px;
  padding: 9px 0;
  cursor: pointer;
}
.doc-demo-checklist input {
  accent-color: #888cff;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  margin: 2px 0 0;
}
.doc-demo-page a:focus-visible, .doc-demo-page button:focus-visible,
.doc-demo-page input:focus-visible, .doc-demo-page select:focus-visible,
.doc-demo-page summary:focus-visible, .doc-demo-page textarea:focus-visible,
.doc-paper a:focus-visible, .doc-proof-links a:focus-visible {
  outline: 3px solid #a5a8ff;
  outline-offset: 3px;
}
.doc-paper a:focus-visible {
  outline-color: #4145a4;
}
.doc-demo-page #sample-documents, .doc-demo-page #readiness, #brokerage-workflows {
  scroll-margin-top: 84px;
}
@media (max-width: 760px) {
  .doc-proof-links, .doc-demo-grid, .doc-demo-team-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 390px) {
  .doc-demo-panel .demo-brand-fields {
    grid-template-columns: minmax(0, 1fr);
  }
  .doc-paper-timeline > div {
    grid-template-columns: 77px minmax(0, 1fr);
  }
}
