/* ============================================================
   WordPress-specific additions layered on top of style.css
   ============================================================ */

/* Real project/portrait images replace the monogram placeholder */
.work-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
  border-radius: inherit;
  position: relative;
  z-index: 1;
}
.work-card-media.has-image::before {
  content: none;
}

/* Admin bar pushes the fixed header down so it doesn't overlap it */
body.admin-bar .site-header {
  top: 52px;
}
@media (max-width: 782px) {
  body.admin-bar .site-header {
    top: 66px;
  }
}

/* Case study: supporting screenshot list, each shown full width and
   full height (no crop, no size cap) */
.case-gallery {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.case-gallery figure {
  margin: 0;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--surface);
}
.case-gallery img {
  width: 100%;
  display: block;
}
.case-gallery figcaption {
  padding: 10px 4px 0;
  font-size: 0.8125rem;
  color: var(--fg-faint);
}

/* Work grid: "Load more" pagination on the Home page */
.work-grid > li.is-more-hidden {
  display: none;
}
.work-grid-more {
  display: flex;
  justify-content: center;
  margin-top: 48px;
}

/* Gallery images are clickable to open the lightbox */
.case-gallery img,
.case-image img {
  cursor: zoom-in;
}

/* Lightbox: full-screen zoomable image viewer for case study galleries */
.lightbox {
  position: fixed;
  inset: 0;
  z-index: 300;
  background: rgba(10, 10, 10, 0.94);
  display: flex;
  flex-direction: column;
}
.lightbox[hidden] {
  display: none;
}
.lightbox__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  color: #f2f2f0;
  flex-shrink: 0;
}
.lightbox__count {
  font-size: 0.8125rem;
  opacity: 0.6;
}
.lightbox__actions {
  display: flex;
  gap: 8px;
}
.lightbox__btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  color: #f2f2f0;
  font-size: 1.125rem;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s var(--ease);
}
.lightbox__btn:hover {
  background: rgba(255, 255, 255, 0.2);
}
.lightbox__stage {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  touch-action: none;
}
.lightbox__stage.is-zoomed {
  cursor: grab;
}
.lightbox__stage.is-panning {
  cursor: grabbing;
}
.lightbox__image {
  max-width: 90%;
  max-height: 100%;
  user-select: none;
  -webkit-user-drag: none;
  will-change: transform;
  transition: transform 0.15s ease-out;
}
.lightbox__image.is-panning {
  transition: none;
}
.lightbox__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  color: #f2f2f0;
  font-size: 1.75rem;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  transition: background 0.2s var(--ease);
}
.lightbox__nav:hover {
  background: rgba(255, 255, 255, 0.2);
}
.lightbox__prev {
  left: 16px;
}
.lightbox__next {
  right: 16px;
}
.lightbox__hint {
  text-align: center;
  color: rgba(242, 242, 240, 0.5);
  font-size: 0.8125rem;
  padding: 4px 0 18px;
  flex-shrink: 0;
}
@media (max-width: 600px) {
  .lightbox__nav {
    width: 36px;
    height: 36px;
    font-size: 1.375rem;
  }
  .lightbox__image {
    max-width: 96%;
  }
}

/* Contact page: centered single column now that the form has been
   removed in favor of the email block + social links only. */
.contact-single {
  max-width: 480px;
  margin: 0 auto;
  padding-bottom: 120px;
  text-align: center;
}
.contact-single .social-list {
  text-align: left;
  margin-top: 8px;
}