/* Shared typography: self-hosted Noto Sans JP and Inter on every corporate page. */
.ws-site {
  --ws-english: "Inter", "Noto Sans JP", "Helvetica Neue", Arial, sans-serif;
  --ws-japanese: "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
  font-family: "Inter", var(--ws-japanese);
  font-weight: 400;
  font-optical-sizing: auto;
  font-kerning: normal;
  letter-spacing: .015em;
  line-height: 1.9;
}

.ws-site :is(.ws-hero-title, .ws-page-title, .ws-section-heading) {
  font-weight: 500;
  font-feature-settings: "palt";
  letter-spacing: .015em;
}
.ws-site h3 { font-weight: 600; }
.ws-site .ws-nav { font-weight: 500; letter-spacing: .025em; }
.ws-site .ws-tech-diagram { --ws-tech-mono: var(--ws-english); }

/* Reading sizes for the selected corporate design, shared by all four pages. */
:is(.ws-subpage-midnight, .dcp-page[data-design=midnight]) {
  --ws-copy-size: 16px;
  --ws-label-size: 14px;
  --ws-meta-size: 12px;
  font-size: var(--ws-copy-size);
}

:is(.ws-subpage-midnight, .dcp-page[data-design=midnight]) :is(
  .ws-section-top > p,
  .ws-intro-copy > div > p:not(.ws-eyebrow, .ws-lead),
  .ws-business-body > p:not(.ws-business-category),
  .ws-system-feature-copy > p:not(.ws-eyebrow),
  .ws-system-points p,
  .ws-culture p:not(.ws-eyebrow),
  .ws-service-copy > p:not(.ws-eyebrow, .ws-lead),
  .ws-feature-list li,
  .ws-benefit p,
  .ws-process p,
  .ws-values p,
  .ws-company-table > div,
  .ws-career-card:nth-child(n) p,
  .ws-training-list li,
  .ws-section[aria-labelledby=careers-movie] > .ws-container > p:not(.ws-eyebrow),
  .ws-details summary,
  .ws-details-content,
  .ws-contact-inner > div:first-child > p:not(.ws-eyebrow)
) {
  font-size: var(--ws-copy-size);
}

:is(.ws-subpage-midnight, .dcp-page[data-design=midnight]) .ws-page-heading-grid .ws-lead,
.dcp-page[data-design=midnight] .ws-hero-description {
  font-size: var(--ws-copy-size);
  line-height: 2;
}

:is(.ws-subpage-midnight, .dcp-page[data-design=midnight]) :is(
  .ws-nav,
  .ws-button,
  .ws-text-link,
  .ws-hero-actions .ws-text-link,
  .ws-anchor-nav a,
  .ws-service-link > div > span,
  .ws-message-photo figcaption,
  .ws-service-diagram figcaption,
  .ws-note,
  .ws-contact-actions .ws-contact-note,
  .ws-footer-address,
  .ws-footer-nav,
  .ws-footer-bottom,
  .ws-footer-bottom a
) {
  font-size: var(--ws-label-size);
}

:is(.ws-subpage-midnight, .dcp-page[data-design=midnight]) :is(
  .ws-eyebrow,
  .ws-hero-topline .ws-eyebrow,
  .ws-hero-index,
  .ws-hero-note,
  .ws-hero-note > span,
  .ws-breadcrumb,
  .ws-business-category,
  .ws-tag,
  .ws-process-step-number,
  .ws-diagram-topline,
  .ws-footer-bottom small,
  .ws-menu-label
) {
  font-size: var(--ws-meta-size);
}

.dcp-page[data-design=midnight] .ws-hero-note > a:not(.ws-scroll-link),
.dcp-page[data-design=midnight] .ws-system-point-number,
.ws-subpage-midnight .ws-benefit > .ws-service-number {
  font-size: var(--ws-label-size);
}

/* Keep the technical labels legible without scaling the diagrams as images. */
.ws-subpage-midnight :is(
  .ws-tech-client,
  .ws-tech-sidebar,
  .ws-tech-table-head,
  .ws-tech-table-row,
  .ws-tech-state,
  .ws-tech-backend .ws-tech-node,
  .ws-tech-zone .ws-tech-node,
  .ws-tech-zone-heading,
  .ws-tech-migration-stages,
  .ws-tech-console,
  .ws-diagram-labels
) {
  font-size: var(--ws-label-size);
}

.ws-subpage-midnight :is(
  .ws-tech-connector > span,
  .ws-tech-window-bar,
  .ws-tech-window-hint,
  .ws-tech-code-label,
  .ws-tech-backend-label,
  .ws-tech-zone-code,
  .ws-tech-transfer
) {
  font-size: var(--ws-meta-size);
}

.ws-subpage-midnight .ws-tech-window-body { grid-template-columns: 84px minmax(0, 1fr); }
.ws-subpage-midnight .ws-tech-table-head,
.ws-subpage-midnight .ws-tech-table-row { grid-template-columns: minmax(0, 1fr) 54px; }
.ws-subpage-midnight .ws-tech-window-bar { grid-template-columns: 24px minmax(0, 1fr) auto; }
.ws-subpage-midnight .ws-tech-console { flex-wrap: wrap; }
.ws-subpage-midnight .ws-value-number { white-space: nowrap; }
:is(.ws-subpage-midnight, .dcp-page[data-design=midnight]) .ws-section-top > p { max-width: 420px; }

/* The two-column process cards need their own flow at tablet widths. */
@media (min-width: 768px) and (max-width: 1199px) {
  .ws-subpage-midnight .ws-process-step { display: block; }
  .ws-subpage-midnight .ws-process h3 { margin-top: 18px; }
  .ws-subpage-midnight .ws-process p { margin-top: 12px; }
  .ws-subpage-midnight .ws-process-step:not(:last-child)::after {
    top: 36px;
    right: -13px;
    bottom: auto;
    left: auto;
    content: "→";
  }
}

@media (max-width: 767px) {
  :is(.ws-subpage-midnight, .dcp-page[data-design=midnight]) { --ws-copy-size: 15px; }
  .ws-subpage-midnight .ws-lead { font-size: 16px; }
  .ws-subpage-midnight .ws-values > li { grid-template-columns: 52px minmax(0, 1fr); }
  .ws-subpage-midnight .ws-company-table > div { grid-template-columns: 90px minmax(0, 1fr); }
  .ws-subpage-midnight .ws-tech-window-body { display: block; }
  .ws-subpage-midnight .ws-tech-sidebar {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
    border-right: 0;
    border-bottom: 1px solid var(--ws-tech-border);
  }
  .ws-subpage-midnight .ws-tech-window-bar { grid-template-columns: 24px minmax(0, 1fr); letter-spacing: 0; }
  .ws-subpage-midnight .ws-tech-window-hint { grid-column: 2; }
  .ws-subpage-midnight .ws-tech-environments { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .ws-subpage-midnight .ws-tech-zone { padding: 16px; }
  .ws-subpage-midnight .ws-tech-zone .ws-tech-node { flex-direction: row; padding: 10px; }
  .ws-subpage-midnight .ws-tech-transfer { flex-direction: row; }
  .ws-subpage-midnight .ws-tech-transfer > span:last-child { transform: rotate(90deg); }
}

/* The ten development directions share the same reading rhythm and weights. */
.ws-site #wsd-content { font-size: 16px; line-height: 1.95; }
.ws-site #wsd-content :is(h2, h3) { font-feature-settings: "palt"; letter-spacing: .015em; }
.ws-site #wsd-content h3 { font-weight: 600; }
.ws-site #wsd-content :is(.wsd-link, .wsd-button) { font-weight: 600; }
.ws-site #wsd-content :is(
  .wsd-challenge > p, .wsd-response p, .wsd-capability p, .wsd-work > p, .wsd-work dd,
  .wsd-migration-options article > p, .wsd-migration-options article > div p,
  .wsd-principles p, .wsd-process-list li p, .wsd-process-output strong,
  .wsd-operation-grid p, .wsd-budget p:not(.wsd-kicker), .wsd-budget li,
  .wsd-preparation-grid p, .wsd-section-heading > p, .wsd-faq-item > div
) { font-size: 14px; }
.ws-site #wsd-content .wsd-faq-item summary { font-size: 15px; }
.ws-site #wsd-content .wsd-work dt { font-size: 11px; }
.ws-site .wsd-switcher-label strong { font-weight: 600; }
@media (max-width: 600px) {
  .ws-site #wsd-content .wsd-intro-copy > p { font-size: 15px; }
}