@media (max-width: 620px) {
  .nav { gap: 12px; }
  .nav-links { gap: 16px; font-size: 13px; }
  .nav-tools { gap: 6px; }
  :root[data-language="en"] .nav { flex-wrap: wrap; padding: 10px 0; row-gap: 8px; }
  :root[data-language="en"] .nav-links { order: 3; width: 100%; }
  :root[data-language="en"] .nav-tools { margin-left: auto; }
  .hero { flex-direction: column-reverse; gap: 24px; padding-top: 36px; }
  .hero-photo { width: 132px; }
  .section { padding-top: 48px; }
  .experience-item h3 { display: flex; flex-direction: column; gap: 2px; }
  .experience-role { margin-left: 0; }
  .rowitem { flex-wrap: wrap; }
  .rowitem p { margin-left: 0; width: 100%; text-align: left; }
  .footer-row { flex-direction: column; align-items: flex-start; gap: 10px; }
  .thought-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; row-gap: 3px; }
  .thought-title { font-size: 16px; }
  .thought-heading time { grid-column: 1 / -1; grid-row: 2; }
  .thought-heading .thought-chevron { grid-column: 2; grid-row: 1; }
  .thought-summary { padding: 20px 0; }
  .thought-body { font-size: 15px; }
}

@media (max-width: 380px) {
  .nav { flex-wrap: wrap; padding: 8px 0; row-gap: 8px; }
  .nav-links { order: 3; width: 100%; }
  .nav-tools { margin-left: auto; }
}