.cobia-page .page-hero { padding: 46px 0 54px; }
.cobia-page .page-hero h1 { font-size: clamp(2.25rem, 5vw, 4rem); max-width: 950px; }
.cobia-page .page-hero p { max-width: 760px; }
.cobia-page .project-overview { padding: 64px 0; }
.cobia-page .project-overview .content-split { grid-template-columns: 0.9fr 1.1fr; gap: 64px; }
.cobia-page .project-photo { display: block; position: relative; border-radius: 14px; overflow: hidden; background: #e4e7e9; cursor: zoom-in; }
.cobia-page .project-photo img { width: 100%; height: auto; aspect-ratio: 941 / 1672; object-fit: contain; }
.cobia-page .project-photo:focus-visible { outline: 3px solid #8c6d08; outline-offset: 5px; }
.cobia-page .photo-enlarge { position: absolute; bottom: 16px; right: 16px; background: rgba(10,22,40,.9); color: white; padding: 7px 12px; border-radius: 4px; font: 13px/1.4 Arial,sans-serif; }
.cobia-page .overview-figure > figcaption { color: #475467; font-size: .88rem; margin-top: 12px; }
.cobia-page .project-facts { margin-top: 28px; border-top: 1px solid var(--border); }
.cobia-page .project-facts div { display: grid; grid-template-columns: 90px 1fr; gap: 16px; padding: 13px 0; border-bottom: 1px solid var(--border); }
.cobia-page .project-facts dt { font-weight: bold; }
.cobia-page .project-facts dd { color: #344054; }
.cobia-page .project-gallery { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; }
.cobia-page .gallery-item figcaption { padding-top: 22px; }
.cobia-page .gallery-number { display: block; color: #775d08; font: bold .72rem/1.5 Arial,sans-serif; letter-spacing: .12em; margin-bottom: 10px; }
.cobia-page .gallery-item h3 { font-size: 1.5rem; margin-bottom: 12px; }
.cobia-page .gallery-item p { color: #344054; }
.cobia-page .project-details { gap: 64px; }
.cobia-page .project-details .material-band h2 { font-size: 2rem; }
.cobia-page .photo-dialog { position: fixed; inset: 0; margin: auto; width: min(1120px,100vw - 24px); height: min(1000px,100dvh - 24px); max-width: none; max-height: none; border: 0; border-radius: 12px; background: #0a1628; color: white; padding: 58px 62px 22px; overflow: hidden; }
.cobia-page .photo-dialog::backdrop { background: rgba(0,0,0,.88); }
.cobia-page .photo-dialog figure { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; }
.cobia-page .lightbox-image { display: block; width: 100%; height: 100%; min-height: 0; object-fit: contain; }
.cobia-page .lightbox-caption { flex-shrink: 0; text-align: center; font: 14px/1.5 Arial,sans-serif; max-width: 700px; }
.cobia-page .photo-dialog button { position: absolute; border: 1px solid rgba(255,255,255,.4); background: #14233a; color: #fff; width: 44px; height: 44px; border-radius: 50%; font: 24px/1 Arial,sans-serif; cursor: pointer; }
.cobia-page .photo-dialog button:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.cobia-page .lightbox-close { right: 12px; top: 10px; }
.cobia-page .lightbox-prev { left: 10px; top: calc(50% - 22px); }
.cobia-page .lightbox-next { right: 10px; top: calc(50% - 22px); }
html:has(.photo-dialog[open]) { overflow: hidden; }
@media(max-width: 900px) {
  .cobia-page .project-overview .content-split { grid-template-columns: 1fr 1fr; gap: 32px; }
  .cobia-page .content-copy h2 { font-size: 2.2rem; }
  .cobia-page .project-gallery { gap: 20px; }
  .cobia-page .project-details { grid-template-columns: 1fr; gap: 32px; }
}
@media(max-width: 640px) {
  .cobia-page .page-hero { padding: 32px 0 40px; }
  .cobia-page .project-overview { padding: 32px 0 48px; }
  .cobia-page .project-overview .content-split, .cobia-page .project-gallery { grid-template-columns: 1fr; gap: 36px; }
  .cobia-page .project-photo { border-radius: 10px; }
  .cobia-page .section { padding-top: 48px; padding-bottom: 48px; }
  .cobia-page .photo-dialog { width: 100vw; height: 100dvh; inset: 0; border-radius: 0; padding: 58px 10px 88px; }
  .cobia-page .lightbox-prev, .cobia-page .lightbox-next { top: auto; bottom: 18px; }
  .cobia-page .lightbox-prev { left: calc(50% - 58px); }
  .cobia-page .lightbox-next { right: calc(50% - 58px); }
  .cobia-page .lightbox-caption { font-size: 13px; }
}
@media(prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .cobia-page .button { transition: none; } }
