/* Small responsive fixes and object-fit helpers */
.hero-photo{object-fit:cover}
.hero-photo.fullwidth{width:100%;height:auto;border-radius:12px}
.bio-photo{object-fit:cover}
.project-card img{object-fit:cover}

@media(max-width:700px){
  .hero-photo{width:100%;height:auto}
}

/* Ensure included navigation and header areas have horizontal padding so
   headings and logo don't touch the window edge on small viewports. */
#site-nav, .site-header { padding-left: 20px; padding-right: 20px; }

@media (max-width: 480px) {
  /* Slightly larger side padding on very small screens for readability */
  #site-nav, .site-header { padding-left: 16px; padding-right: 16px; }
}