/*
 * Depth without a fourth colour: photographs in duotone (red over ink) and a
 * fine engraved hatch under the panels that sit on the paper. Loaded after
 * the theme on the pages that carry a photograph or a panel.
 */

/* A photograph becomes a red-and-ink plate: grey, then screened over red,
   then a whisper of ink multiplied back for the shadows. */
.lac-duotone,
.lac-parish-photo-fig:has(.lac-parish-photo),
.lac-parish-hero:has(.lac-parish-hero-img.is-photo) {
  position: relative;
  background: var(--lac-red);
  overflow: hidden;
  border-radius: 2px;
}
.lac-duotone img,
.lac-parish-photo-fig .lac-parish-photo,
.lac-parish-hero .lac-parish-hero-img.is-photo {
  display: block;
  width: 100%;
  filter: grayscale(1) contrast(1.08) brightness(0.96);
  mix-blend-mode: screen;
}
.lac-duotone::after,
.lac-parish-photo-fig:has(.lac-parish-photo)::after,
.lac-parish-hero:has(.lac-parish-hero-img.is-photo)::after {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--lac-ink);
  mix-blend-mode: multiply;
  opacity: 0.16;
  pointer-events: none;
}
.lac-parish-photo-fig .lac-photo-cap,
.lac-parish-hero figcaption {
  position: relative;
  z-index: 1;
  background: var(--lac-bg);
}

/* Panels: the hatch sits behind the list, inside a hairline. */
.lac-hatched,
.lac-live-panel .lac-live-list,
.lac-local-faq {
  background-color: var(--lac-bg);
  background-image: var(--lac-hatch);
  border: 1px solid var(--lac-rule);
  border-radius: 2px;
}
.lac-live-panel .lac-live-list > li {
  background: var(--lac-bg);
  margin: 0;
}
.lac-local-faq { padding: var(--lac-space-4) var(--lac-space-5); }

/* The hatch as a divider: two rules with the pattern between them. */
.lac-fish-divider::before,
.lac-fish-divider::after {
  background-image: var(--lac-hatch);
  background-color: transparent;
  height: 6px;
  border-top: 1px solid var(--lac-rule);
  border-bottom: 1px solid var(--lac-rule);
}