/* Phone layout: the same two journeys, composed for a smaller screen. */
@media (max-width: 650px) {
  html { scroll-padding-top: 90px; }
  header { position: sticky; top: 0; height: 72px; border-bottom: 1px solid #d3d9d866; }
  .wordmark { font-size: 24px; }
  .wordmark span { margin-top: 5px; }
  .menu { min-width: 76px; min-height: 48px; }
  nav { top: 72px; max-height: calc(100dvh - 72px); overflow-y: auto; padding-bottom: max(24px, env(safe-area-inset-bottom)); }
  nav a { min-height: 48px; font-size: 15px; }
  .concept { align-items: center; gap: 14px; min-height: 36px; }
  .concept span { max-width: 155px; line-height: 1.5; }
  .hero { min-height: 0; padding: 36px 6% 75px; }
  h1 { font-size: clamp(39px, 10.7vw, 65px); margin: 25px 0 20px; line-height: 1.12; }
  .hero .eyebrow { font-size: 9px; }
  .intro { font-size: 14px; line-height: 1.7; margin-top: 0; }
  .hero-actions { margin-top: 25px; gap: 10px; align-items: stretch; }
  .hero-actions a { min-width: 0; min-height: 52px; padding: 15px 17px; font-size: 13px; border: 1px solid #a8b9be77; background: #10273599; }
  .hero-actions a span { font-size: 18px; }
  .hero-actions a:active { background: #304b58; }
  .hero-bottom { bottom: 22px; padding-top: 14px; }
  .architecture { opacity: .4; }
  .path { padding: 25px 0; }
  .path-number { font-size: 9px; line-height: 1.6; }
  .path h2 { font-size: clamp(26px, 7.4vw, 36px); }
  .circle-arrow { flex: 0 0 44px; height: 44px; }
  .section { padding: 54px 6%; }
  h2, .identity h2 { font-size: clamp(31px, 9.4vw, 44px); }
  .contact h2 { font-size: clamp(38px, 11vw, 54px); }
  .body-copy, .identity p:not(.eyebrow) { font-size: 15px; line-height: 1.8; }
  .small-note { font-size: 11px; }
  .button { width: 100%; min-height: 54px; font-size: 14px; padding: 17px 20px; }
  summary { min-height: 44px; line-height: 1.5; font-size: 15px; }
  summary b { flex-shrink: 0; }
  details { padding: 14px 0; }
  details p { font-size: 14px; padding-left: 28px; }
  .career-statement { min-height: 260px; }
  .portrait { height: auto; aspect-ratio: 1 / 1.08; max-width: none; }
  .portrait img { object-position: center top; }
  .quiet-link { min-height: 48px; font-size: 13px; }
  .footer-top>a:last-child, .footer-bottom>a { display: inline-flex; align-items: center; min-height: 44px; }
  .footer-bottom { font-size: 11px; }
  footer { padding-bottom: max(24px, env(safe-area-inset-bottom)); }
  dialog { position: fixed; inset: auto 0 0; width: 100%; max-width: 100%; max-height: 92dvh; margin: 0; padding: 54px 24px max(28px, env(safe-area-inset-bottom)); border-radius: 18px 18px 0 0; overscroll-behavior: contain; }
  dialog::before { content: ''; position: absolute; top: 10px; left: calc(50% - 18px); width: 36px; height: 3px; border-radius: 2px; background: #a9b5b6; }
  .close { top: 13px; right: 12px; width: 44px; height: 44px; }
  dialog h2 { font-size: 34px; margin: 14px 0; }
  dialog .demo-note { margin: 15px 0; }
  label { font-size: 13px; margin-top: 16px; }
  input, select { font-size: 16px; min-height: 50px; }
  .fields { gap: 0; }
  .submit { margin-top: 24px; }
}
@media (max-width: 360px) {
  .concept { font-size: 7px; gap: 8px; }
  .concept span { max-width: 140px; }
  .career-statement strong { font-size: 42px; }
  .section-heading { gap: 12px; }
  dialog { padding-left: 18px; padding-right: 18px; }
}
@media (hover: none) { .button:hover { transform: none; } }