/* H30 v0.9.6 — homepage-only manual photo galleries. No autoplay. */
#featured-work .work-carousel { position: relative; }
#featured-work .work-carousel [hidden], .work-lightbox [hidden] { display: none !important; }
#featured-work .work-carousel .project-photo { text-decoration: none; touch-action: pan-y pinch-zoom; -webkit-tap-highlight-color: transparent; }
#featured-work .work-carousel .project-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: none; transition: opacity 180ms ease; }
#featured-work .work-carousel .project-photo img.is-entering { opacity: 0; }
#featured-work .work-carousel .project-photo:hover img { transform: none; }
#featured-work .work-carousel .project-expand { z-index: 3; width: 40px; height: 40px; background: #082b43d9; border-color: #ffffffa6; pointer-events: none; }
#featured-work .work-carousel .project-expand .icon { width: 17px; height: 17px; }
#featured-work .work-nav { position: absolute; top: 50%; z-index: 4; transform: translateY(-50%); width: 44px; height: 44px; padding: 0; display: grid; place-items: center; border: 1px solid #ffffffb3; border-radius: 2px; color: #fff; background: #082b43e8; box-shadow: 0 2px 10px #001a2d1a; cursor: pointer; transition: background 160ms ease, opacity 160ms ease; }
#featured-work .work-nav:hover { background: #082b43; }
#featured-work .work-nav .icon { width: 20px; height: 20px; }
#featured-work .work-prev { left: 12px; }
#featured-work .work-next { right: 12px; }
#featured-work .work-nav:focus-visible, #featured-work .work-open:focus-visible { outline: 3px solid #ff6a18; outline-offset: 3px; }
#featured-work .work-counter { position: absolute; bottom: 12px; left: 12px; z-index: 4; padding: 7px 10px; border-radius: 2px; color: #fff; background: #082b43e8; font: 600 12px/1.2 Inter,system-ui,sans-serif; font-variant-numeric: tabular-nums; letter-spacing: .055em; pointer-events: none; }
#featured-work .work-error { position: absolute; top: 12px; left: 12px; right: 12px; z-index: 5; color: #fff; background: #082b43f2; padding: 10px 12px; font: 500 12px/1.4 Inter,system-ui,sans-serif; pointer-events: none; }
#featured-work .work-gallery-link { cursor: pointer; }
#featured-work .work-fallback { margin-top: 12px; font-size: 14px; color: #082b43; }
#featured-work .work-fallback summary { cursor: pointer; }
#featured-work .work-fallback ul { padding-left: 20px; margin-top: 10px; }
#featured-work .work-fallback a { text-decoration: underline; text-underline-offset: 3px; }
#featured-work .work-fallback li+li { margin-top: 8px; }
.work-sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
@media (hover: hover) and (pointer: fine) {
  #featured-work .work-nav { opacity: 0; }
  #featured-work .work-carousel:hover .work-nav, #featured-work .work-carousel:focus-within .work-nav { opacity: 1; }
}
/* Full-window viewer only. The cards above keep their approved layout.
   Contain preserves each full asset: no new crop, no stretched photographs.
   This fills the browser viewport, not the operating system's fullscreen mode. */
.work-lightbox {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  max-width: none;
  max-height: none;
  margin: 0;
  border: 0;
  border-radius: 0;
  padding: 0;
  box-sizing: border-box;
  color: #fff;
  background: #041923;
  box-shadow: none;
  overflow: hidden;
  overscroll-behavior: contain;
}
.work-lightbox::backdrop { background: #041923; }
.work-dialog-stage {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  display: grid;
  place-items: center;
  background: #041923;
  overflow: hidden;
  touch-action: pan-y pinch-zoom;
}
.work-dialog-stage > img {
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  object-fit: contain;
  object-position: center;
  user-select: none;
  -webkit-user-select: none;
}
/* Overlay controls leave the complete viewport available to the photograph.
   Gradients supply contrast without the old white title and caption bars. */
.work-dialog-top {
  position: absolute;
  inset: 0 0 auto;
  z-index: 3;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  padding: calc(20px + env(safe-area-inset-top, 0px))
           calc(24px + env(safe-area-inset-right, 0px)) 48px
           calc(24px + env(safe-area-inset-left, 0px));
  background: linear-gradient(180deg, #02131bf0 0%, #02131bba 48%, #02131b00 100%);
  pointer-events: none;
}
.work-dialog-top > div { min-width: 0; padding-top: 2px; }
.work-dialog-eyebrow {
  margin: 0 0 5px;
  color: #d6e4eb;
  text-transform: uppercase;
  letter-spacing: .12em;
  font: 600 9px/1.4 Inter,system-ui,sans-serif;
}
.work-dialog-top h2 {
  margin: 0;
  color: #fff;
  font: 600 18px/1.35 Inter,system-ui,sans-serif;
  letter-spacing: -.015em;
  overflow-wrap: anywhere;
  text-shadow: 0 1px 4px #0009;
}
.work-dialog-close, .work-dialog-nav {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid #ffffff8c;
  border-radius: 50%;
  background: #041923de;
  color: #fff;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: background 150ms ease, border-color 150ms ease;
}
.work-dialog-close { flex: 0 0 48px; pointer-events: auto; }
.work-dialog-close:hover, .work-dialog-nav:hover { background: #082b43; border-color: #fff; }
.work-dialog-close .icon { width: 23px; height: 23px; }
.work-dialog-nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; }
.work-dialog-nav .icon { width: 24px; height: 24px; }
.work-dialog-prev { left: calc(20px + env(safe-area-inset-left, 0px)); }
.work-dialog-next { right: calc(20px + env(safe-area-inset-right, 0px)); }
.work-dialog-nav:focus-visible, .work-dialog-close:focus-visible {
  outline: 3px solid #ff8b46;
  outline-offset: 3px;
}
.work-dialog-bottom {
  position: absolute;
  inset: auto 0 0;
  z-index: 3;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  padding: 50px calc(24px + env(safe-area-inset-right, 0px))
           calc(20px + env(safe-area-inset-bottom, 0px))
           calc(24px + env(safe-area-inset-left, 0px));
  background: linear-gradient(0deg, #02131bf0 0%, #02131bba 48%, #02131b00 100%);
  pointer-events: none;
}
.work-dialog-bottom p {
  max-width: 76ch;
  min-width: 0;
  margin: 0;
  color: #f0f5f8;
  font: 400 13px/1.5 Inter,system-ui,sans-serif;
  overflow-wrap: anywhere;
  text-shadow: 0 1px 4px #0009;
}
.work-dialog-counter {
  flex-shrink: 0;
  color: #fff;
  font: 600 12px/1.6 Inter,system-ui,sans-serif;
  font-variant-numeric: tabular-nums;
  letter-spacing: .06em;
  white-space: nowrap;
}
.work-dialog-loading {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  max-width: calc(100% - 144px);
  padding: 8px 14px;
  border: 1px solid #ffffff66;
  border-radius: 4px;
  background: #041923ef;
  color: #fff;
  font: 500 12px/1.5 Inter,system-ui,sans-serif;
  text-align: center;
  pointer-events: none;
}
.work-dialog-error {
  position: absolute;
  top: calc(90px + env(safe-area-inset-top, 0px));
  left: 50%;
  transform: translateX(-50%);
  z-index: 4;
  width: max-content;
  max-width: min(600px, calc(100% - 48px));
  margin: 0;
  padding: 10px 14px;
  border: 1px solid #ffffff88;
  border-radius: 4px;
  background: #041923f2;
  color: #fff;
  font: 500 13px/1.5 Inter,system-ui,sans-serif;
  text-align: center;
  pointer-events: none;
}
@media (max-width: 760px) {
  .work-dialog-top {
    gap: 16px;
    padding: calc(14px + env(safe-area-inset-top, 0px))
             calc(14px + env(safe-area-inset-right, 0px)) 40px
             calc(16px + env(safe-area-inset-left, 0px));
  }
  .work-dialog-top h2 { font-size: 16px; }
  .work-dialog-eyebrow { font-size: 9px; }
  .work-dialog-close, .work-dialog-nav { width: 44px; height: 44px; }
  .work-dialog-close { flex-basis: 44px; }
  .work-dialog-prev { left: calc(12px + env(safe-area-inset-left, 0px)); }
  .work-dialog-next { right: calc(12px + env(safe-area-inset-right, 0px)); }
  .work-dialog-bottom {
    gap: 16px;
    padding: 40px calc(16px + env(safe-area-inset-right, 0px))
             calc(16px + env(safe-area-inset-bottom, 0px))
             calc(16px + env(safe-area-inset-left, 0px));
  }
  .work-dialog-bottom p { font-size: 12px; line-height: 1.5; }
  .work-dialog-counter { font-size: 12px; }
  .work-dialog-error { top: calc(86px + env(safe-area-inset-top, 0px)); font-size: 12px; }
}
@media (max-height: 500px) and (orientation: landscape) {
  .work-dialog-top { padding-top: calc(10px + env(safe-area-inset-top, 0px)); padding-bottom: 28px; }
  .work-dialog-eyebrow { display: none; }
  .work-dialog-top h2 { font-size: 15px; line-height: 1.35; padding-top: 10px; }
  .work-dialog-bottom { padding-top: 28px; padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)); }
  .work-dialog-bottom p { font-size: 12px; }
  .work-dialog-error { top: calc(66px + env(safe-area-inset-top, 0px)); }
}
@media (prefers-reduced-motion: reduce) {
  #featured-work .work-carousel .project-photo img, #featured-work .work-nav,
  .work-dialog-close, .work-dialog-nav { transition: none; }
}