.featured-projects, .project-faq { border-top: 1px solid var(--line); }
.projects-heading { max-width: 850px; margin-bottom: 36px; }
.projects-heading h2, .project-faq h2, .project-related h2, .project-booking h2 { font-family: 'Playfair Display', Georgia, serif; font-size: 36px; line-height: 1.2; font-weight: 500; letter-spacing: 0; }
.project-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.project-card { min-width: 0; }
.project-card-image { display: block; overflow: hidden; }
.project-card img { aspect-ratio: 3 / 2; object-fit: cover; height: auto; transition: transform 300ms ease; }
.project-card-image:hover img { transform: scale(1.025); }
.project-card h3 { font-size: 23px; line-height: 1.3; margin: 16px 0 8px; font-weight: 600; }
.project-city { color: var(--gold); font-size: 14px; margin: 12px 0; }
.project-card p:not(.project-city) { color: var(--muted); margin: 12px 0 20px; }
.project-card .project-link { display: inline-block; padding: 10px 0; border-bottom: 1px solid var(--gold); transition: color 200ms ease; }
.project-link:hover { color: var(--gold); }
.project-intro { padding-top: 165px; padding-bottom: 38px; }
.project-intro h1 { font-family: 'Playfair Display', Georgia, serif; font-size: 56px; font-weight: 500; line-height: 1.1; max-width: 1050px; margin: 20px 0; letter-spacing: 0; }
.project-intro > p:not(.project-city) { max-width: 850px; font-size: 18px; color: var(--muted); }
.project-breadcrumb { display: flex; flex-wrap: wrap; gap: 10px; font-size: 14px; color: var(--muted); }
.project-breadcrumb a { color: var(--gold); }
.project-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; padding-top: 0; }
.project-gallery a { display: block; align-self: start; }
.project-gallery a:first-child { grid-column: 1 / -1; }
.project-gallery img { height: auto; background: var(--charcoal); }
.project-booking { padding-top: 0; }
.project-service-links { display: flex; flex-wrap: wrap; gap: 16px 28px; margin: 20px 0 30px; }
.project-service-links a { text-decoration: underline; text-underline-offset: 5px; }
.project-related { padding-top: 0; }
.project-related h2 { margin-bottom: 32px; }
.project-related .project-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.project-faq { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 50px; }
.project-faq h2 { margin-top: 0; }
.project-faq details { border-bottom: 1px solid var(--line); padding: 20px 0; }
.project-faq details:first-child { border-top: 1px solid var(--line); }
.project-faq summary { cursor: pointer; font-size: 18px; font-weight: 600; padding-right: 15px; }
.project-faq details p { color: var(--muted); max-width: 750px; }
.project-faq details a { color: var(--cream); text-decoration: underline; }
.project-viewer { width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh; padding: 20px; border: 0; background: rgba(8,8,7,.98); color: var(--cream); }
.project-viewer::backdrop { background: #080807; }
.project-viewer[open] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto auto; gap: 12px; }
.project-viewer-tools { display: flex; align-items: center; justify-content: space-between; }
.project-viewer button { min-width: 48px; min-height: 48px; background: transparent; border: 1px solid var(--line); color: var(--cream); border-radius: 4px; font: inherit; font-size: 24px; cursor: pointer; transition: background 200ms ease; }
.project-viewer button:hover { background: var(--charcoal); }
.project-viewer img { width: 100%; height: 100%; min-height: 0; object-fit: contain; }
.project-viewer-caption { text-align: center; margin: 0; font-size: 14px; }
.project-viewer-controls { display: flex; justify-content: center; gap: 16px; }
html.project-viewer-open { overflow: hidden; }
.project-cards a:focus-visible, .project-gallery a:focus-visible, .project-viewer button:focus-visible, .project-faq summary:focus-visible { outline: 2px solid var(--gold); outline-offset: 5px; }
@media (max-width: 700px) {
  .project-cards, .project-related .project-cards, .project-faq, .project-gallery { grid-template-columns: minmax(0,1fr); }
  .project-gallery { gap: 16px; }
  .project-intro { padding-top: 130px; }
  .project-intro h1 { font-size: 38px; overflow-wrap: break-word; }
  .projects-heading h2, .project-faq h2, .project-related h2, .project-booking h2 { font-size: 30px; }
  .project-faq { gap: 20px; }
  .project-viewer { padding: 12px; }
}
@media (prefers-reduced-motion: reduce) { .project-card img, .project-link, .project-viewer button { transition: none; } }