/* ==========================================================================
   KuduDoc v6 — the site theme. Every v5 page, re-skinned in the v6 language.
   The v5 page CSS is loaded into a lower cascade layer (layer v5), so every rule here wins
   without specificity games. The v5 content, fences, captions and scripts are untouched.

   The language (from the approved v6 landing):
   · one continuous ground: the page opens on the landing's blue, eases through pale blue to
     white, and closes on the same blue — sections never paint their own backgrounds (no seams)
   · flat colour, crisp edges, no glow, no blur; the KuduDoc mark as a flat poster shape
   · one orange (#ff762b) for the primary action, the H1 rule and the seal
   · the logo's slanted stroke as the recurring marker
   · Montserrat 650 display with real stroke mass, Inter body; pill buttons; soft layered cards
   ========================================================================== */

/* ---------------------------------------------------------------- tokens the v5 CSS reads */
:root {
  --v6-blue-ground: #2a64a0;
  --ember: #ff762b;                       /* one orange */
  --g-surface-dawn: #2a64a0;              /* v5's dawn gradient → the flat landing blue */
  --surface-dawn: #2a64a0;
  --g-navy-blue: #2a64a0;
  --v6-ease: cubic-bezier(.2, .8, .2, 1);
}

/* ---------------------------------------------------------------- the ground */
html { background: #2a64a0; }
html body {
  background:
    linear-gradient(180deg, #dcebf8 0, #eef5fc 1100px, #ffffff 2300px, #ffffff calc(100% - 2600px), #e8f0f8 calc(100% - 1300px), #dfe9f4 100%);
  color: var(--navy);
}
/* sections sit on the ground; they no longer paint their own bands */
html body :is(.surface-white, .surface-paper, .surface-mist, .surface-ice) { background: transparent; }
html body main > :is(section, div) { background-color: transparent; }

/* ---------------------------------------------------------------- the opening: blue, with the mark as a flat poster */
html body .hero-cu {
  position: relative; overflow: hidden; padding: 176px 0 104px; color: #fff;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 72'%3E%3Cg transform='translate(40 36) rotate(-8) skewX(-14) translate(-31 -32)' stroke-linecap='round' stroke-width='6.5'%3E%3Cpath d='M13 14V50' stroke='%23004e99' stroke-opacity='.16'/%3E%3Cpath d='M25 9V55' stroke='%23004e99' stroke-opacity='.22'/%3E%3Cpath d='M37 13V51' stroke='%23004e99' stroke-opacity='.13'/%3E%3Cpath d='M49 18V46' stroke='%23004e99' stroke-opacity='.18'/%3E%3C/g%3E%3C/svg%3E") right -6vw center / auto 150% no-repeat,
    linear-gradient(180deg, #2a64a0 0, #2a64a0 calc(100% - 150px), #dcebf8 100%);
}
/* when a product capture follows, the blue runs on and the capture straddles its edge */
html body .hero-cu:has(+ .proof-cu) { background-color: #2a64a0; background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 72'%3E%3Cg transform='translate(40 36) rotate(-8) skewX(-14) translate(-31 -32)' stroke-linecap='round' stroke-width='6.5'%3E%3Cpath d='M13 14V50' stroke='%23004e99' stroke-opacity='.16'/%3E%3Cpath d='M25 9V55' stroke='%23004e99' stroke-opacity='.22'/%3E%3Cpath d='M37 13V51' stroke='%23004e99' stroke-opacity='.13'/%3E%3Cpath d='M49 18V46' stroke='%23004e99' stroke-opacity='.18'/%3E%3C/g%3E%3C/svg%3E"), none; padding-bottom: 72px; }
html body .hero-cu + .proof-cu { position: relative; background: linear-gradient(180deg, #2a64a0 0, #2a64a0 38%, transparent 38%); padding-top: 8px; }
html body .hero-cu .cu-wrap { position: relative; z-index: 1; }
html body .hero-cu .eyebrow {
  display: flex; align-items: center; margin: 0 0 24px; color: #d6eeff;
  font: 600 12.5px/1 var(--font-sans); letter-spacing: .15em; text-transform: uppercase;
}
html body .hero-cu .eyebrow::before { content: ""; width: 3px; height: 13px; margin-right: 10px; border-radius: 2px; background: var(--orange); transform: skewX(-14deg) translateY(1px); }
html body .hero-cu h1 { font: 650 clamp(46px, 6vw, 86px)/.98 var(--font-display); letter-spacing: -.038em; color: #fff; max-width: 15ch; }
html body .hero-cu h1 .hero-line { color: #fff; }
html body .hero-cu h1 .hero-line + .hero-line, html body .hero-cu h1 .text-sky, html body .hero-cu h1 .text-blue { color: #a9dcff; }
html body .hero-cu .kd-rule { background: var(--orange); }
html body .hero-cu .hero-sub { margin-top: 22px; font: 400 clamp(20px, 2vw, 26px)/1.4 var(--font-sans); letter-spacing: -.012em; color: rgba(236, 244, 252, .86); max-width: 34ch; }
html body .hero-cu :is(p, li) { color: rgba(236, 244, 252, .86); }
html body .hero-cu .hero-note, html body .hero-cu .fence, html body .hero-cu .kd-caption { color: rgba(226, 238, 250, .7); }
html body .hero-cu a:not(.btn) { color: #fff; }
html body .hero-cu .hero-link { color: #d6eeff; }

/* ---------------------------------------------------------------- dark panels: the same flat blue, no glow */
html body :is(.surface-dawn, .surface-blue, .surface-navy, .dark-panel, .cta-gradient, .cta-dark) {
  background: #2a64a0; background-image: none; box-shadow: none; color: rgba(236, 244, 252, .86);
}
html body :is(.surface-dawn, .surface-blue, .surface-navy, .dark-panel, .cta-gradient, .cta-dark)::before,
html body :is(.surface-dawn, .surface-blue, .surface-navy, .dark-panel, .cta-gradient, .cta-dark)::after { background: none; filter: none; box-shadow: none; }
html body :is(.surface-dawn, .surface-blue, .surface-navy, .dark-panel, .cta-gradient, .cta-dark) :is(h1, h2, h3, .kd-h2, .kd-h3) { color: #fff; }
html body :is(.surface-dawn, .surface-blue, .surface-navy, .dark-panel, .cta-gradient, .cta-dark) .eyebrow { color: #d6eeff; }
/* the closing band is full-bleed and runs straight into the footer: one blue at the bottom, as on the landing */
html body :is(#closing, .cta-gradient) {
  max-width: none !important; width: auto !important; margin: 0 !important; border-radius: 0 !important;
  padding: 112px 40px 96px !important; overflow: visible;
}
html body :is(#closing, .cta-gradient)::before { display: none; }
html body :is(#closing, .cta-gradient) > :is(.cta-gradient-inner, div:first-child) { max-width: 1200px; margin: 0 auto; align-items: flex-start; text-align: left; }
html body :is(#closing, .cta-gradient) h2 { font-size: clamp(36px, 4.2vw, 60px); line-height: 1.02; letter-spacing: -.035em; }
html body :is(#closing, .cta-gradient) h2 span { color: #ffc15c; }
html body :is(#closing, .cta-gradient) :is(p, .fence) { color: rgba(236, 244, 252, .82); }
/* whatever wraps the page ends where the closing band ends */
html body main > div:has(> #closing:last-child, > .cta-gradient:last-child) { padding-bottom: 0 !important; margin-bottom: 0 !important; }
/* openings not yet converted still clear the fixed nav */
html body main > :first-child > :first-child:not(.hero-cu), html body main > section:first-child:not(.hero-cu) { padding-top: max(120px, 8vw) !important; }
html body main > :last-child { margin-bottom: 0; }

/* ---------------------------------------------------------------- type */
html body :is(h2, .kd-h2, .display-2xl, .display-xl) { font-weight: 650; letter-spacing: -.032em; }
html body :is(h3, .kd-h3) { font-weight: 650; letter-spacing: -.02em; }
html body .eyebrow, html body .kd-eyebrow { font: 600 12.5px/1 var(--font-sans); letter-spacing: .15em; text-transform: uppercase; }
html body .kd-h2 .text-slate, html body h2 .text-slate { color: #5d7087; }

/* ---------------------------------------------------------------- buttons: pills, the one orange for the primary action */
html body .btn { border-radius: 999px; }
html body .btn-primary, html body .btn-onblue-primary {
  color: #fff; border: 0; background: linear-gradient(180deg, #ff8f45 0%, #ff6a30 55%, #ff5528 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35), inset 0 -1px 0 rgba(160,40,10,.25), 0 1px 2px rgba(120,30,0,.25), 0 8px 22px -6px rgba(255,90,40,.55);
}
html body .btn-primary:hover { background: linear-gradient(180deg, #ff9a55 0%, #ff7036 55%, #ff5a2c 100%); }
html body .btn-secondary { background: #fff; color: var(--navy); border: 0; box-shadow: inset 0 0 0 1.5px #dfe6ee; }
html body .btn-secondary:hover { box-shadow: inset 0 0 0 1.5px var(--blue); }
html body .btn-onblue { background: #fff; color: var(--navy); border: 0; }
html body .btn-onblue-ghost { background: transparent; color: #fff; border: 0; box-shadow: inset 0 0 0 1.5px rgba(191, 227, 255, .45); }
html body .btn-onblue-ghost:hover { background: rgba(191, 227, 255, .1); }
html body .hero-cu .btn-secondary, html body .hero-cu .btn-ghost { background: transparent; color: #fff; box-shadow: inset 0 0 0 1.5px rgba(191, 227, 255, .45); }

/* ---------------------------------------------------------------- cards and frames: white, hairline, soft layered shadow */
html body :is(.card, .kd-card, .pcat-card, .tl-card, .pplan, .pricing-card, .plan-card) {
  border-radius: 20px; border: 0; background: #fff;
  box-shadow: inset 0 0 0 1px rgba(16, 45, 73, .07), 0 1px 2px rgba(16, 45, 73, .05), 0 16px 40px -24px rgba(16, 45, 73, .32);
}
html body :is(.frame, .mock-frame, .capture-frame, .kd-mock) { border-radius: 16px; }
html body .proof-cu .frame { box-shadow: 0 2px 4px rgba(6, 22, 42, .08), 0 24px 60px -18px rgba(6, 22, 42, .38); }

/* ---------------------------------------------------------------- FAQ accordions */
html body .accordion-item { border-radius: 16px; background: #fff; box-shadow: inset 0 0 0 1px rgba(16, 45, 73, .07); margin-bottom: 10px; border: 0; }
html body .accordion-trigger { font-weight: 600; }

/* ---------------------------------------------------------------- the slanted stroke as the marker, in the one orange */
html body .kd-h2::before { background: var(--orange); }
/* list markers are the logo's slanted stroke in blue; orange stays for the seal */
html body .kd-marks li::before { background: #006bcb; }
html body :is(.surface-dawn, .surface-blue, .surface-navy, .dark-panel, .cta-gradient, .cta-dark, .hero-cu) .kd-marks li::before { background: #a9dcff; }

/* ---------------------------------------------------------------- the footer band (v6 footer) */
.v6-foot-band { background: #2a64a0; color: rgba(226, 238, 250, .72); padding: 0 0 8px; }
.v6-foot-band .wrap { width: 100%; max-width: 1280px; margin: 0 auto; padding: 0 40px; }
.v6-foot-band .foot { margin-top: 0; }
@media (max-width: 640px) { .v6-foot-band .wrap { padding: 0 20px; } html body .hero-cu { padding: 128px 0 80px; } }
@media (prefers-reduced-motion: reduce) { .v6-foot-band * { transition: none !important; } }


/* ================================================================ site-wide fixes from the audit (24 Sep 2026) */

/* FAQ: one card, whatever the markup (.accordion or details/summary) */
html body .accordion { border-top: 0; gap: 10px; }
html body .accordion-item { border: 0; border-radius: 18px; background: #fff; margin: 0;
  box-shadow: inset 0 0 0 1px rgba(16, 45, 73, .08), 0 1px 2px rgba(16, 45, 73, .04); transition: box-shadow 160ms var(--v6-ease); }
html body .accordion-item:has(.accordion-trigger[aria-expanded="true"]) { box-shadow: inset 0 0 0 1.5px rgba(0, 107, 203, .35), 0 12px 30px -20px rgba(16, 45, 73, .35); }
html body .accordion-trigger { background: transparent; border-radius: inherit; padding: 22px 24px; font: 600 17px/1.4 var(--font-sans); color: var(--navy); }
html body .accordion-trigger:hover { color: #006bcb; }
html body .accordion-trigger .accordion-icon, html body .accordion-trigger .accordion-chevron { color: #006bcb; }
html body .accordion-content > div > :first-child, html body .accordion-body { padding: 0 24px 22px; }
html body .accordion-boxed .accordion-item { padding: 0; border: 0; }
html body main details:not(.nav details) { border: 0; border-radius: 18px; background: #fff; margin: 0 0 10px; padding: 0;
  box-shadow: inset 0 0 0 1px rgba(16, 45, 73, .08), 0 1px 2px rgba(16, 45, 73, .04); }
html body main details[open] { box-shadow: inset 0 0 0 1.5px rgba(0, 107, 203, .35), 0 12px 30px -20px rgba(16, 45, 73, .35); padding-bottom: 0; }
html body main details > summary { padding: 22px 24px; min-height: 0; font: 600 17px/1.4 var(--font-sans); color: var(--navy); cursor: pointer; }
html body main details > :not(summary) { padding-left: 24px; padding-right: 24px; }
html body main details > :last-child:not(summary) { padding-bottom: 22px; }
@media (max-width: 640px) {
  html body .accordion-trigger, html body main details > summary { padding: 18px 18px; font-size: 16px; }
  html body .accordion-content > div > :first-child, html body .accordion-body, html body main details > :not(summary) { padding-left: 18px; padding-right: 18px; }
}

/* captions: one bar, not two (a proof chip nested inside a caption drew its own) */
html body :is(.kd-caption, .capture-caption, .kd-mock-label, .kd-mock-caption) .chip-proof { border-left: 0; padding-left: 0; margin: 0; }

/* the Sealed chip: the landing's, everywhere — the one orange on peach */
html body :is(.kd-chip-sealed, .kd-chip--sealed) { background: #fff0e6; color: #d8561c; box-shadow: inset 0 0 0 1px rgba(255, 118, 43, .4); font-weight: 700; }
/* the Vault chip: flat blue, not the old navy */
html body :is(.kd-chip-vault, .kd-chip--vault) { background: #2a64a0; color: #fff; }

/* closing: the landing's highlight — amber into orange — and a wrapper around a blue card becomes the band */
html body :is(#closing, .cta-gradient) h2 span {
  background: linear-gradient(100deg, #ffc15c, #ff7a3a); -webkit-background-clip: text; background-clip: text; color: transparent; padding-bottom: .06em;
}
html body #closing:has(> .cta-dark, > .cta-gradient, > div > .cta-dark, > div > .cta-gradient) { background: #2a64a0; }
html body #closing :is(.cta-dark, .cta-gradient) { padding: 0 !important; background: transparent; }

/* the opening's poster fades with the blue instead of stopping in a hard line at the section edge */
html body .hero-cu:not(:has(+ .proof-cu)) { background: linear-gradient(180deg, #2a64a0 0, #2a64a0 calc(100% - 150px), #dcebf8 100%); }
html body .hero-cu::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 72'%3E%3Cg transform='translate(40 36) rotate(-8) skewX(-14) translate(-31 -32)' stroke-linecap='round' stroke-width='6.5'%3E%3Cpath d='M13 14V50' stroke='%23004e99' stroke-opacity='.16'/%3E%3Cpath d='M25 9V55' stroke='%23004e99' stroke-opacity='.22'/%3E%3Cpath d='M37 13V51' stroke='%23004e99' stroke-opacity='.13'/%3E%3Cpath d='M49 18V46' stroke='%23004e99' stroke-opacity='.18'/%3E%3C/g%3E%3C/svg%3E") right -6vw center / auto 150% no-repeat;
  -webkit-mask-image: linear-gradient(180deg, #000 0, #000 calc(100% - 190px), transparent calc(100% - 40px));
          mask-image: linear-gradient(180deg, #000 0, #000 calc(100% - 190px), transparent calc(100% - 40px));
}
html body .hero-cu:has(+ .proof-cu)::after { -webkit-mask-image: none; mask-image: none; }
html body .hero-cu:has(+ .proof-cu) { background-image: none; }

/* rhythm: sections were 224px apart (v5); tighter, continuous */
html body :is(.section, .section-lg, .home-section, .psection, .biz-section) { padding-top: 88px; padding-bottom: 88px; }
@media (max-width: 640px) { html body :is(.section, .section-lg, .home-section, .psection, .biz-section) { padding-top: 64px; padding-bottom: 64px; } }

/* ================================================================ shared parts the design build added (27 Sep 2026) */
/* ---------------------------------------------------------------- kda · the app panel, drawn in HTML
   a crisp KuduDoc screen — top bar, a quiet rail, the content — in the signing editor's language. */
.kda { display: block; background: #fff; color: var(--navy); font: 400 13px/1.45 var(--font-sans); text-align: left; }
.kda small.kda-k { display: block; font: 600 11px/1.3 var(--font-sans); letter-spacing: .1em; text-transform: uppercase; color: #56697f; }
.kda .icon { width: 16px; height: 16px; flex: none; }
.kda-bar { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 12px 18px; border-bottom: 1px solid #e6ecf2; }
.kda-crumb { flex: none; font-size: 12.5px; color: #56697f; white-space: nowrap; }
.kda-crumb i { margin: 0 6px; font-style: normal; color: #b3c0ce; }
.kda-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 650 16px/1.25 var(--font-display); letter-spacing: -.015em; }
.kda-count { flex: none; font-size: 12.5px; color: #56697f; white-space: nowrap; }
.kda-grow { flex: 1 1 auto; }
.kda-search { display: flex; flex: none; align-items: center; gap: 8px; width: 230px; height: 32px; padding: 0 12px; border-radius: 999px; background: #f3f7fb; box-shadow: inset 0 0 0 1px #e6ecf2; color: #7a8ca0; font-size: 12.5px; white-space: nowrap; overflow: hidden; }
.kda-btn { display: inline-flex; flex: none; align-items: center; gap: 6px; height: 32px; padding: 0 15px; border-radius: 999px; box-shadow: inset 0 0 0 1px rgba(16, 45, 73, .16); font-weight: 600; font-size: 13px; white-space: nowrap; color: var(--navy); }
.kda-btn.is-primary { background: #006bcb; color: #fff; box-shadow: none; }
.kda-btn.is-small { height: 26px; padding: 0 11px; font-size: 12px; }
.kda-body { display: grid; grid-template-columns: 212px minmax(0, 1fr); }
.kda-side { display: flex; flex-direction: column; gap: 2px; padding: 14px 10px 16px; border-right: 1px solid #e6ecf2; background: #fbfcfe; }
.kda-side small.kda-k { margin: 8px 10px 6px; }
.kda-side small.kda-k:first-child { margin-top: 2px; }
.kda-nav { display: flex; align-items: center; gap: 10px; min-width: 0; height: 34px; padding: 0 10px; border-radius: 8px; color: #3f5470; font-weight: 500; white-space: nowrap; }
.kda-nav > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.kda-nav .icon { color: #6b7f95; }
.kda-nav em { margin-left: auto; font-style: normal; font-size: 12px; color: #8a9bb0; }
.kda-nav.is-on { background: #eef5fc; color: #004e99; font-weight: 600; box-shadow: inset 2px 0 0 #006bcb; }
.kda-nav.is-on .icon { color: #006bcb; }
.kda-main { min-width: 0; padding: 16px 20px 18px; }
.kda-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.kda-chips span { display: inline-flex; align-items: center; height: 28px; padding: 0 12px; border-radius: 999px; box-shadow: inset 0 0 0 1px #dfe6ee; color: #3f5470; font-size: 12.5px; font-weight: 500; white-space: nowrap; }
.kda-chips span.is-on { background: #eef5fc; box-shadow: inset 0 0 0 1.5px #006bcb; color: #004e99; font-weight: 600; }
.kda-table { border: 1px solid #e6ecf2; border-radius: 12px; overflow: hidden; background: #fff; }
.kda-row { display: grid; grid-template-columns: minmax(0, 1fr) 196px 150px 74px; align-items: center; gap: 14px; padding: 11px 16px; border-top: 1px solid #eef2f6; }
.kda-row:first-child { border-top: 0; }
.kda-row.kda-head { padding-block: 9px; background: #f7f9fc; font: 600 11px/1.3 var(--font-sans); letter-spacing: .1em; text-transform: uppercase; color: #56697f; }
.kda-row.is-picked { background: #fafcff; box-shadow: inset 3px 0 0 #006bcb; }
.kda-file { display: flex; align-items: center; gap: 12px; min-width: 0; }
.kda-doc { display: grid; flex: none; place-items: center; width: 30px; height: 36px; border-radius: 5px; background: #f3f7fb; box-shadow: inset 0 0 0 1px #dde5ee; color: #56697f; font: 700 8.5px/1 var(--font-sans); letter-spacing: .05em; }
.kda-file > div { min-width: 0; }
.kda-file b, .kda-file span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kda-file b { font-weight: 600; font-size: 13.5px; }
.kda-file span { font-size: 12px; color: #56697f; }
.kda-state { display: inline-flex; align-items: center; justify-self: start; gap: 7px; height: 26px; padding: 0 11px 0 9px; border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.kda-state::before { content: ""; flex: none; width: 3px; height: 11px; border-radius: 2px; background: currentColor; transform: skewX(-14deg); }
.kda-state.is-sealed { background: var(--peach); color: #c9490b; box-shadow: inset 0 0 0 1px rgba(255, 118, 43, .42); }
.kda-state.is-wait { background: #eef5fc; color: #004e99; box-shadow: inset 0 0 0 1px rgba(0, 107, 203, .28); }
.kda-state.is-file { background: #f1f5f9; color: #3f5470; }
.kda-date { font-size: 12.5px; color: #3f5470; white-space: nowrap; }
.kda-date b { font-weight: 600; color: var(--navy); }
.kda-act { justify-self: end; }
.kda-ask { display: flex; align-items: center; gap: 10px; min-width: 0; height: 44px; margin-top: 14px; padding: 0 7px 0 14px; border-radius: 12px; box-shadow: inset 0 0 0 1px #dfe6ee; color: #7a8ca0; font-size: 13px; white-space: nowrap; }
.kda-ask .icon { color: #006bcb; }
.kda-ask > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.kda-ask .kda-btn { margin-left: auto; }
/* Home: the four counts, then a list with one action per row */
.kda-counts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding: 16px 18px 6px; }
.kda-counts > div { display: grid; gap: 2px; padding: 12px 14px; border-radius: 12px; box-shadow: inset 0 0 0 1px #e6ecf2; }
.kda-counts > div.is-on { box-shadow: inset 0 0 0 1.5px #006bcb; background: #fafcff; }
.kda-counts b { font: 650 24px/1.1 var(--font-display); letter-spacing: -.02em; }
.kda-counts span { font-size: 12px; font-weight: 600; color: #3f5470; }
.kda-listhead { display: flex; align-items: baseline; justify-content: space-between; padding: 14px 18px 8px; }
.kda-listhead > span { font-size: 12px; font-weight: 600; color: #006bcb; }
.kda-home .kda-table { margin: 0 18px 18px; }
.kda-table.is-list .kda-row { grid-template-columns: minmax(0, 1fr) auto auto; }
.kda-days { padding: 3px 9px; border-radius: 999px; background: #eef5fc; color: #004e99; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
/* Vault: the locked screen before setup */
.kda-vault-body { display: grid; justify-items: center; gap: 12px; padding: 30px 28px 32px; background: #f7f9fc; text-align: center; }
.kda-lock { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 1.5px #c9d6e4; }
.kda-lock .icon { width: 22px; height: 22px; color: #2a64a0; }
.kda-vault-body > b { font: 650 17px/1.3 var(--font-display); letter-spacing: -.015em; }
.kda-vault-body > p { max-width: 46ch; margin: 0; font-size: 13px; line-height: 1.55; color: #3f5470; }
.kda-steps { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 18px; margin: 2px 0 0; padding: 0; list-style: none; font-size: 12.5px; color: #56697f; }
.kda-steps li { display: flex; align-items: center; gap: 7px; }
.kda-steps i { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: #e8eef5; color: #3f5470; font: 600 11px/1 var(--font-sans); font-style: normal; }
.kda-steps li.is-now { color: var(--navy); font-weight: 600; }
.kda-steps li.is-now i { background: #006bcb; color: #fff; }
.kda-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 6px; }
/* Ask: the question, the answer, the passages; and the source open at the cited clause */
.kda-q { display: flex; align-items: center; gap: 10px; }
.kda-q b { font: 650 15px/1.35 var(--font-display); letter-spacing: -.01em; }
.kda-av { display: grid; flex: none; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #eef5fc; color: #006bcb; font: 600 11px/1 var(--font-sans); font-style: normal; }
.kda-a { margin: 12px 0 0; padding: 14px 16px; border-radius: 12px; box-shadow: inset 0 0 0 1px #e6ecf2; }
.kda .kda-a p { margin: 0 0 8px; font-size: 13px; line-height: 1.55; color: #26405c; }
.kda .kda-a p:last-child { margin-bottom: 0; }
.kda-a p b { font-weight: 600; color: var(--navy); }
.kda-ans .kda-listhead { padding: 14px 0 8px; }
.kda-note { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 8px 18px; border-bottom: 1px solid #e6ecf2; background: #fafcff; color: #004e99; font-size: 12px; font-weight: 600; }
.kda-note > span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kda-note em { margin-left: auto; font-style: normal; font-weight: 500; color: #56697f; white-space: nowrap; }
.kda-canvas { padding: 20px 24px 24px; background: #f3f7fb; }
.kda-paper { max-width: 560px; margin: 0 auto; padding: 22px 26px; border-radius: 4px; background: #fff; box-shadow: 0 1px 2px rgba(16, 45, 73, .06), 0 10px 26px -16px rgba(16, 45, 73, .3); }
.kda .kda-paper p { margin: 0 0 9px; font-size: 12px; line-height: 1.6; color: #3f5470; }
.kda .kda-paper p:last-child { margin-bottom: 0; }
.kda-paper p b { font-weight: 600; color: var(--navy); }
.kda .kda-paper p.is-hl { margin-inline: -8px; padding: 6px 8px; border-radius: 4px; background: #e3f2ff; color: var(--navy); box-shadow: inset 2px 0 0 #006bcb; }
/* Redact: the source record beside the new copy, then the report */
.kda-split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.kda-pane { display: grid; gap: 8px; justify-items: start; padding: 12px; border-radius: 12px; background: #f3f7fb; }
.kda-pane.is-copy { background: #eef5fc; box-shadow: inset 0 0 0 1.5px rgba(0, 107, 203, .35); }
.kda-sheet { display: grid; gap: 7px; justify-self: stretch; padding: 14px 14px 16px; border-radius: 4px; background: #fff; box-shadow: 0 1px 2px rgba(16, 45, 73, .06), 0 8px 20px -14px rgba(16, 45, 73, .3); }
.kda-sheet .l { display: block; height: 5px; border-radius: 3px; background: #e3e9f0; }
.kda-sheet .l.s { width: 55%; }
.kda-sheet .l.m { width: 78%; }
.kda-pii { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 500 11.5px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--navy); }
.kda-pii.is-gone { height: 16px; border-radius: 3px; box-shadow: inset 0 0 0 1px #a9bdd2; background: #f7fafd; color: transparent; }
.kda-pii.is-gone:first-of-type { width: 62%; }
.kda-redact .kda-listhead { padding: 14px 0 8px; }
.kda-redact .kda-table .kda-row { grid-template-columns: minmax(0, 1fr) auto; padding: 9px 14px; }
/* compact: a half-width column (no rail, name and state only) */
.kda.is-compact .kda-body { grid-template-columns: minmax(0, 1fr); }
.kda.is-compact :is(.kda-side, .kda-search, .kda-crumb) { display: none; }
.kda.is-compact .kda-main { padding: 14px 14px 16px; }
.kda.is-compact .kda-chips { flex-wrap: nowrap; overflow: hidden; }
.kda.is-compact .kda-row { grid-template-columns: minmax(0, 1fr) auto; gap: 10px; padding: 10px 12px; }
.kda.is-compact .kda-row > :is(.kda-date, .kda-act), .kda.is-compact .kda-head > :nth-child(n+3) { display: none; }
@media (max-width: 980px) {
  .kda-body { grid-template-columns: minmax(0, 1fr); }
  .kda-side { display: none; }
  .kda-search { display: none; }
}
@media (max-width: 760px) {
  .kda { font-size: 12px; }
  .kda-bar { gap: 8px; padding: 10px 12px; }
  .kda-crumb, .kda-count { display: none; }
  .kda-title { font-size: 14px; }
  .kda-btn { height: 28px; padding: 0 12px; font-size: 12px; }
  .kda-main { padding: 12px; }
  .kda-chips { flex-wrap: nowrap; overflow: hidden; margin-bottom: 10px; }
  .kda-chips span { height: 26px; padding: 0 10px; font-size: 11.5px; }
  .kda-row { grid-template-columns: minmax(0, 1fr) auto; gap: 10px; padding: 10px 12px; }
  .kda-row > .kda-date, .kda-row > .kda-act, .kda-head > :nth-child(n+3) { display: none; }
  .kda-file { gap: 10px; }
  .kda-doc { width: 26px; height: 31px; font-size: 7.5px; }
  .kda-file b { font-size: 12.5px; }
  .kda-file span { font-size: 11px; }
  .kda-state { height: 24px; padding: 0 9px 0 8px; font-size: 11px; }
  .kda-ask { height: 40px; margin-top: 10px; font-size: 12px; }
  .kda-q b { font-size: 13.5px; }
  .kda-a { padding: 12px; }
  .kda .kda-a p { font-size: 12px; }
  .kda-note { padding: 7px 12px; font-size: 11px; }
  .kda-note .kda-btn { display: none; }
  .kda-canvas { padding: 12px; }
  .kda-paper { padding: 14px 14px; }
  .kda .kda-paper p { font-size: 11px; }
  .kda-vault-body { gap: 10px; padding: 20px 16px 22px; }
  .kda-vault-body > b { font-size: 15px; }
  .kda-vault-body > p { font-size: 12px; }
  .kda-steps { flex-direction: column; align-items: flex-start; font-size: 12px; }
  .kda-counts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 12px 12px 4px; }
  .kda-counts > div { padding: 8px 10px; }
  .kda-counts b { font-size: 18px; }
  .kda-counts span { font-size: 11px; }
  .kda-listhead { padding: 10px 12px 6px; }
  .kda-home .kda-table { margin: 0 12px 12px; }
  .kda-table.is-list .kda-row { grid-template-columns: minmax(0, 1fr) auto; }
  .kda-table.is-list .kda-row > .kda-btn { display: none; }
}
.kda-state.is-due { background: #fff7e6; color: #8a5a00; box-shadow: inset 0 0 0 1px rgba(214, 150, 20, .35); }
/* ---- end kda */

/* the closing band's primary action: the one orange */
html body #closing .btn-onblue { color: #fff; border: 0; background: linear-gradient(180deg, #ff8f45 0%, #ff6a30 55%, #ff5528 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.35), inset 0 -1px 0 rgba(160,40,10,.25), 0 1px 2px rgba(120,30,0,.25), 0 8px 22px -6px rgba(255,90,40,.55); }
html body #closing .btn-onblue:hover { background: linear-gradient(180deg, #ff9a55 0%, #ff7036 55%, #ff5a2c 100%); color: #fff; }

/* a {{CO_…}} company placeholder on the light ground (the footer's own is in nav.css) */
html body main .ph { border-color: rgba(0, 107, 203, .45); color: #0b4f8f; background: rgba(0, 107, 203, .06); white-space: normal; }