/* The company chapter carries Design A's navy and Manrope typography. */
.about-navy {
  --about-ink: #f2f2e9;
  --about-muted: #a7b6bf;
  --about-accent: #9dbfe2;
  --about-line: #52616b;
  background: #0e1e2c;
  color: var(--about-ink);
  font-family: Manrope, 'Apple SD Gothic Neo', 'Malgun Gothic', Arial, sans-serif;
}

.about-navy .about-title {
  border-top: 1px solid var(--about-line);
  padding-top: 20px;
  margin-bottom: 42px;
}

.about-navy .label { color: var(--about-accent); }

.about-navy .about-title h2,
html:lang(ko) .about-navy .about-title h2 {
  font-family: inherit;
  font-size: clamp(31px, 3.1vw, 45px);
  font-weight: 450;
  line-height: 1.15;
  letter-spacing: -.04em;
  color: var(--about-ink);
}

.about-navy .about-title h2 em,
html:lang(ko) .about-navy .about-title h2 em {
  font-style: normal;
  color: var(--about-accent);
}

.about-navy .about-copy > p { color: #c9d3d8; }
.about-navy .location { border-color: var(--about-line); }
.about-navy .business-hours,
.about-navy .service-area { color: #c9d3d8; }
.about-navy .text-link { color: var(--about-accent); border-color: var(--about-accent); }
.about-navy .location a:focus-visible { outline-color: var(--about-accent); }

/* Continue the navy chapter through the model and its controls. */
.about-navy .study-panel {
  background: #0e1e2c;
  border-color: #354b5c;
  color: var(--about-accent);
}
.about-navy .study-modes,
.about-navy .study-playback { border-color: #354b5c; }
.about-navy .study-topline > span:last-child,
.about-navy .study-modes button,
.about-navy .study-view-label,
.about-navy .study-axis-label,
.about-navy .study-legend,
.about-navy .study-phase { color: var(--about-muted); }
.about-navy .study-modes button[aria-pressed=true],
.about-navy .study-playback button { color: var(--about-accent); }
.about-navy .study-modes button[aria-pressed=true] { border-bottom-color: var(--about-accent); }
.about-navy .study-animated .study-modes button[aria-pressed=true] { border-bottom-color: #354b5c; }
.about-navy .study-animated .study-modes button[aria-pressed=true]:after { background: var(--about-accent); }
.about-navy .study-modes button:hover { color: var(--about-ink); background: #172c3d; }
.about-navy .study-panel button:focus-visible { outline-color: var(--about-accent); }
.about-navy .study-key i:before { background: #9dbfe2; }
.about-navy .study-key i:after { background: #e0a16b; }
.about-navy .structure-study figcaption,
.about-navy .structure-study figcaption > span:last-child { color: var(--about-muted); }

@media (max-width: 780px) {
  .about-navy .about-title { margin-bottom: 32px; padding-top: 17px; }
  .about-navy .about-title h2,
  html:lang(ko) .about-navy .about-title h2 { font-size: clamp(29px, 5.6vw, 40px); line-height: 1.2; }
}

@media (max-width: 360px) {
  .about-navy .about-title h2,
  html:lang(ko) .about-navy .about-title h2 { font-size: 28px; }
}