/* Story "Photo behind": the photo fills the section behind the text, which sits on the left (happyleads' 1.0 look,
   for every theme). Desktop only: on phones the photo stays above the text. The photo spans the container. */
@media (min-width: 992px) {
  .npc-intro--photo-bg { overflow: hidden; }
  .npc-intro--photo-bg .container { position: relative; }
  .npc-intro--photo-bg .row { min-height: 480px; }
  .npc-intro--photo-bg .row > :has(> .npc-intro__image-wrap) {
    position: absolute;
    top: calc(-1 * var(--npc-section-py));
    bottom: calc(-1 * var(--npc-section-py));
    left: 0;
    right: 0;
    width: auto;
    max-width: none;
    margin: 0;
    padding: 0;
  }
  .npc-intro--photo-bg .npc-intro__image-wrap {
    height: 100%;
    border-radius: 0;
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 6%, #000 92%, transparent 100%);
    mask-image: linear-gradient(to right, transparent 0, #000 6%, #000 92%, transparent 100%);
  }
  /* Keeps the text readable on any photo: white fades in behind the text column. */
  .npc-intro--photo-bg .npc-intro__image-wrap::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, rgba(255, 255, 255, .92) 0%, rgba(255, 255, 255, .7) 40%, rgba(255, 255, 255, 0) 60%);
  }
  .npc-intro--photo-bg .npc-intro__image { object-position: right top; border-radius: 0; height: 100%; width: 100%; object-fit: cover; }
  .npc-intro--photo-bg .row > :not(:has(> .npc-intro__image-wrap)) { position: relative; z-index: 1; flex: 0 0 50%; max-width: 50%; }
}

/* Zones: the photo is a zone element (a figure in the photo column), a phone link keeps its icon. */
.npc-intro__image-wrap.npc-zone .wp-block-image { margin: 0; height: 100%; }
.npc-intro .npc-intro__link[href^="tel:"]:not(:has(> i))::before { content: "\f095"; font-family: "Font Awesome 6 Free"; font-weight: 900; margin-right: .5rem; }

/* Editor only: WordPress centres every block with auto margins. In a text column laid out as a flex column (a
   client's CSS can do that) they shrank the title and the list to the middle. */
.npc-intro .npc-zone > .wp-block { margin-left: 0; margin-right: 0; }