/* Mobile is the default. Larger screens progressively gain space and columns. */
@media (max-width: 639px) {
  .hero { padding-block: 24px 28px; }
  .hero h1 { margin-top: 16px; font-size: 1.75rem; line-height: 1.35; }
  .hero-description { margin-top: 16px; font-size: 0.9375rem; line-height: 1.65; }
  .hero-actions { margin-top: 20px; }
}
@media (min-width: 640px) {
  :root { --page-gutter: 32px; --section-spacing: 80px; }
  .profile-list, .competency-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profile-list { gap: 20px 24px; }
  .profile-list > div { padding-bottom: 0; border-bottom: 0; }
  .case-facts, .case-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-dialog { width: calc(100% - 64px); max-height: calc(100dvh - 64px); }
  .modal-shell { max-height: calc(100dvh - 66px); }
  .modal-content { padding: 32px; }
  .modal-toolbar { padding-inline: 32px; }
}

@media (min-width: 960px) {
  :root { --page-gutter: 40px; --section-spacing: 96px; }
  .header-inner { flex-direction: row; align-items: center; justify-content: space-between; gap: 32px; padding-block: 20px; }
  .brand { align-self: auto; }
  .site-nav ul { gap: 24px; }
  .js .site-nav { position: static; max-height: none; overflow: visible; padding: 0; border: 0; }
  .js .site-nav ul { display: flex; gap: 24px; }
  .js .site-nav a { width: auto; padding-inline: 0; }
  .js .site-nav .button { padding-inline: 16px; }
  .section-layout { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 64px; }
  .profile-list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .profile-list { gap: 0; }
  .profile-list > div { padding-inline: 20px; border-left: 1px solid var(--border); }
  .profile-list > div:first-child { padding-left: 0; border-left: 0; }
  .profile-list > div:last-child { padding-right: 0; }
  .competency h3 { min-height: 2.9em; }
  .project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-card-featured { padding: 32px; }
  .case-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .project-card > .case-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .journey-timeline { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 40px; }
  .journey-step { margin-left: 0; padding: 36px 24px 0 0; border-left: 0; border-top: 1px solid var(--border); }
  .journey-step:last-child { padding-right: 0; border-top-color: transparent; }
  .journey-step::before { top: -5px; left: 0; }
  .journey-step h3 { font-size: var(--text-base); }
}

@media (max-width: 959px) { .js .site-nav:not([data-open='true']) { display: none; } }
@media (min-width: 960px) { .js .menu-toggle { display: none; } }


@media (min-width: 640px) { .additional-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

@media (min-width: 640px) { .skills-groups, .learning-cards, .learning-bring-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1120px) { .skills-groups, .learning-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } .learning-bring-list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
