/* model: openai; role: delegated-website-typography-editor; 2026-10-15.
   Shared editorial hierarchy. Load after component styles.
   The approved hero, video, embedded product UI, role controls and diagrams
   retain their own scale; this file governs the website's editorial text. */
:root {
  --kv-type-chapter: 44px;
  --kv-type-section: 32px;
  --kv-type-card: 22px;
  --kv-type-body: 16px;
  --kv-type-label: 12px;
  --kv-type-kicker: 12px;
  --kv-leading-heading: 1.2;
  --kv-leading-card: 1.35;
  --kv-leading-body: 1.65;
  --kv-leading-label: 1.5;
  --kv-space-kicker: 24px;
  --kv-space-heading: 16px;
  --kv-space-copy: 12px;
}

/* Chapter markers share the same visual grammar on light and dark sections. */
body main .section-kicker,
#work-together .section-kicker,
#platform .section-kicker,
#industries.kv-photo-industries .section-kicker {
  display: flex;
  align-items: center;
  gap: 18px;
  margin: 0 0 var(--kv-space-kicker);
  font-size: var(--kv-type-kicker);
  font-weight: 600;
  line-height: var(--kv-leading-label);
  letter-spacing: .12em;
  text-transform: uppercase;
}
#work-together .section-kicker,
#industries.kv-photo-industries .section-kicker { color: #c4d6df; }
#work-together .section-kicker > span:first-child,
#industries.kv-photo-industries .section-kicker > span:first-child { color: #8ce5d3; }
body main .section-kicker > i {
  flex: 0 0 32px;
  width: 32px;
  height: 1px;
  background: currentColor;
  opacity: .4;
}

/* Main chapter titles. */
#work-together #kh-change .kh-picker-intro #kh-examples-title,
#platform > .container > .section-intro .section-heading,
#industries.kv-photo-industries #industries-title,
body .closing.kv-closing h2 {
  margin: 0;
  font-size: var(--kv-type-chapter);
  font-weight: 400;
  line-height: var(--kv-leading-heading);
  letter-spacing: -.03em;
  text-wrap: balance;
}
#work-together #kh-change .kh-picker-intro { margin-bottom: 28px; text-align: center; }
#platform > .container > .section-intro > p,
#industries.kv-photo-industries .industries-copy,
body .closing.kv-closing .closing-copy {
  font-size: var(--kv-type-body);
  font-weight: 400;
  line-height: var(--kv-leading-body);
}
body .closing.kv-closing .closing-copy { margin-top: var(--kv-space-heading); }

/* Section titles within a chapter. */
#work-together #approach #cooperation-steps-title,
#kv-static-showcase .kv-gallery-heading :is(h2, h3),
#deployment-models .kd-feature-heading :is(h2, h3) {
  margin: 0 0 var(--kv-space-copy);
  font-size: var(--kv-type-section);
  font-weight: 400;
  line-height: var(--kv-leading-heading);
  letter-spacing: -.025em;
  text-wrap: balance;
}
#work-together #approach #cooperation-steps-title { margin: 0; }
#work-together #approach #kh-start-title {
  margin-top: var(--kv-space-heading);
  font-size: var(--kv-type-label);
  line-height: var(--kv-leading-label);
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
}
#kv-static-showcase .kv-gallery-heading p,
#kv-static-showcase .kv-gallery-heading p.kv-custom-tagline,
#deployment-models .kd-feature-heading p {
  font-size: var(--kv-type-body);
  line-height: var(--kv-leading-body);
}
#kv-static-showcase .kv-gallery-heading p.kv-custom-tagline { font-weight: 500; }
#kv-static-showcase .kv-gallery-tag,
#deployment-models .kd-feature-heading > span,
#deployment-models .kd-editorial .kd-eyebrow {
  font-size: var(--kv-type-label);
  line-height: var(--kv-leading-label);
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* Role card: outcome, supporting role, review output and workflow context. */
#work-together #kh-change .kh-example-details .kh-person h3,
#work-together #kh-change .kh-example-context #kh-example-goal {
  font-size: var(--kv-type-card);
  line-height: var(--kv-leading-card);
  font-weight: 500;
  letter-spacing: -.015em;
}
#work-together #kh-change .kh-example-details .kh-person .kh-task-type,
#work-together #kh-change .kh-example-details .kh-example-context dt {
  font-size: var(--kv-type-label);
  line-height: var(--kv-leading-label);
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
#work-together #kh-change .kh-example-details .kh-example-context dt { margin: 0 0 8px; }
#work-together #kh-change .kh-example-details .kh-example-context dd,
#work-together #kh-change .kh-system-row > p,
#work-together #kh-change .kh-workflow-link {
  font-size: var(--kv-type-body);
  line-height: var(--kv-leading-body);
}
#work-together #kh-change .kh-system-row > span,
#work-together #kh-change .kh-workflow-scope {
  font-size: var(--kv-type-label);
  line-height: var(--kv-leading-label);
}

/* Cooperation deliverables, gallery captions and industry cards. */
#work-together #how-we-start .kh-card-title,
#kv-static-showcase .kv-gallery-copy :is(h3, h4),
#deployment-models .kd-editorial :is(h3, h4),
#industries.kv-photo-industries .industry-card h3,
#industries .kh-context-invite h3 {
  margin: 0 0 var(--kv-space-copy);
  font-size: var(--kv-type-card);
  font-weight: 500;
  line-height: var(--kv-leading-card);
  letter-spacing: -.015em;
}
#work-together #how-we-start .kh-card-title { margin: 0; min-height: 60px; }
#work-together #how-we-start .kh-card-description,
#work-together #how-we-start .kh-card-delivery > span,
#kv-static-showcase .kv-gallery-copy p,
#deployment-models .kd-editorial > p:not(.kd-eyebrow),
#industries.kv-photo-industries .industry-card p,
#industries .kh-context-invite p,
#industries .kh-context-invite a {
  font-size: var(--kv-type-body);
  line-height: var(--kv-leading-body);
}
#deployment-models .kd-editorial .kd-small-copy {
  /* Existing component marks this paragraph !important. Match only that rule. */
  font-size: var(--kv-type-body) !important;
}
#work-together #how-we-start .kh-card-description { margin-top: var(--kv-space-heading); }
#work-together #how-we-start .kh-card-number small,
#work-together #how-we-start .kh-card-delivery p,
#kv-static-showcase .kv-gallery-pager span,
#kv-static-showcase .kv-showcase-note,
#deployment-models .kd-feature-footer p {
  font-size: var(--kv-type-label);
  line-height: var(--kv-leading-label);
}
#kv-static-showcase .kv-gallery-actions a,
#kv-static-showcase .kv-gallery-actions button,
#deployment-models .kd-feature-footer a {
  font-size: var(--kv-type-body);
  line-height: var(--kv-leading-body);
}

/* Shared footer, including Contact, FAQ and Privacy. */
body footer.footer .footer-top > p:not(.footer-label) {
  font-size: var(--kv-type-section);
  font-weight: 400;
  line-height: var(--kv-leading-heading);
  letter-spacing: -.025em;
}
body footer.footer .company-detail p,
body footer.footer .footer-grid a,
body footer.footer .company-detail .kv-linkedin-footer {
  font-size: var(--kv-type-body);
  line-height: var(--kv-leading-body);
}
body footer.footer .footer-label,
body footer.footer .footer-bottom {
  font-size: var(--kv-type-label);
  line-height: var(--kv-leading-label);
}
body footer.footer .footer-label {
  margin-bottom: var(--kv-space-heading);
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* Secondary pages use the same section/body/label scale, preserving page h1s. */
.contact-section .contact-form-wrap .form-heading h2,
#main.faq > section h2,
#main.privacy > section h2 {
  margin: 0 0 var(--kv-space-heading);
  font-size: var(--kv-type-section);
  font-weight: 400;
  line-height: var(--kv-leading-heading);
  letter-spacing: -.025em;
}
.contact-section .contact-intro .intro-copy,
.contact-section .contact-intro .conversation-note p:not(.note-label),
.contact-section .contact-form-wrap .form-heading p,
.contact-section .contact-form :is(input, select, textarea),
.contact-section .contact-form-wrap .noscript-note,
#main.faq > .lead,
#main.faq details p,
#main.faq .faq-cta > div > span,
#main.privacy > .lead,
#main.privacy > section p {
  font-size: var(--kv-type-body);
  line-height: var(--kv-leading-body);
}
.contact-section .contact-intro :is(.eyebrow, .note-label, .company-line),
.contact-section .contact-form :is(label, .optional, .field-hint, .form-status),
.contact-section .contact-form .form-actions > p {
  font-size: var(--kv-type-label);
  line-height: var(--kv-leading-label);
}
.contact-section .contact-intro :is(.eyebrow, .note-label) {
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
}
#main.faq details summary h3,
#main.faq .faq-cta strong {
  font-size: var(--kv-type-card);
  font-weight: 500;
  line-height: var(--kv-leading-card);
  letter-spacing: -.015em;
}
#main.faq .faq-toc { font-size: var(--kv-type-body); line-height: var(--kv-leading-body); }

@media (max-width: 1000px) {
  #work-together #how-we-start .kh-card-title { min-height: 0; }
}
@media (max-width: 600px) {
  :root {
    --kv-type-chapter: 30px;
    --kv-type-section: 24px;
    --kv-type-card: 20px;
    --kv-type-kicker: 11px;
    --kv-space-kicker: 20px;
  }
  #work-together #kh-change .kh-picker-intro { margin-bottom: 24px; }
  #work-together #kh-change .kh-example-details .kh-example-context { grid-template-columns: minmax(0, 1fr); }
  #kv-static-showcase .kv-gallery-heading { flex-wrap: wrap; }
  #kv-static-showcase .kv-gallery-tag { flex-basis: 100%; }
}