/* VERSION: project-detail.css v1.0.3-header-offset (2025-11-16, 13:40:00)
// Changes vs v1.0.2-centered-title-back-small:
// - Added top padding to .project-detail-section to prevent the title from being hidden by the fixed header.
// - Kept centered title and smaller back button.
//*/

.project-detail-section {
  padding-top: 120px;   /* offset from fixed header */
  padding-bottom: 60px;
}

/* Center the main title on project detail pages */
.project-detail-section .section-title {
  text-align: center;
}

.project-detail-section .section-title h1 {
  text-align: center;
}

/* Main layout: text + image side by side on desktop */
.project-detail-layout {
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
  align-items: flex-start;
}

.project-detail-text {
  flex: 1 1 320px;
  min-width: 0;
}

.project-detail-image {
  flex: 0 0 280px;
  max-width: 360px;
}

.project-detail-image img {
  width: 100%;
  height: auto;
  border-radius: 18px;
  display: block;
}

.project-detail-text h3 {
  margin-top: 20px;
  margin-bottom: 10px;
}

.project-detail-text ul {
  padding-left: 20px;
  margin-bottom: 14px;
}

/* Back to projects button */
.project-back-link {
  margin-top: 28px;
  text-align: center;
}

.project-back-link .btn {
  display: inline-block;
  font-size: 0.9rem;
  padding: 6px 14px;
}

/* Mobile layout */
@media (max-width: 768px) {
  .project-detail-layout {
    flex-direction: column;
  }

  .project-detail-image {
    max-width: 100%;
  }
}