/**
 * Photography warm lift (brand book pages 26–29, 32).
 *
 * Dawn rises through the bottom 60% of the frame so the band survives a
 * crop. Face anchors match services/brand_photography.py. At 360–640 the
 * card crop is 4:5. Full-bleed page heroes keep their band ratio.
 */

.ns-warm-lift {
  position: relative;
  isolation: isolate;
}

.ns-warm-lift:not(.marketing-hero)::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 60%;
  background: linear-gradient(to top, var(--color-dawn), transparent);
  pointer-events: none;
  z-index: 1;
}

.ns-warm-lift__photo {
  object-fit: cover;
}

.ns-warm-lift__photo[src*="photo-01-mother-and-son"] { object-position: 50% 46%; }
.ns-warm-lift__photo[src*="photo-02-family-breakfast"] { object-position: 50% 38%; }
.ns-warm-lift__photo[src*="photo-03-father-and-daughter"] { object-position: 50% 40%; }
.ns-warm-lift__photo[src*="photo-04-reading"] { object-position: 52% 28%; }
.ns-warm-lift__photo[src*="photo-05-sofa-phone"] { object-position: 72% 46%; }
.ns-warm-lift__photo[src*="photo-06-priya"] { object-position: 42% 36%; }
.ns-warm-lift__photo[src*="photo-07-marcus-and-dana"] { object-position: 62% 34%; }
.ns-warm-lift__photo[src*="photo-08-amara"] { object-position: 32% 40%; }
.ns-warm-lift__photo[src*="photo-09-susan-and-mother"] { object-position: 48% 32%; }

.ns-warm-lift > .care-path-photo-card__overlay,
.ns-warm-lift > .onboarding-funnel__media-wash {
  display: none;
}

.ns-warm-lift__caption {
  color: var(--color-ink);
}

.ns-warm-lift__caption h3,
.ns-warm-lift__caption p {
  color: var(--color-ink);
}

/* Page-band heroes: Dawn in the bottom 60%, type in that light. */
.marketing-hero.ns-warm-lift::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 60%;
  background: linear-gradient(to top, var(--color-dawn), transparent);
  pointer-events: none;
  z-index: 1;
}

.marketing-hero--how-it-works.ns-warm-lift::before {
  inset: auto 0 0 0;
  height: 60%;
  background: linear-gradient(to top, var(--color-dawn), transparent);
}

.marketing-hero--how-it-works.ns-warm-lift::after {
  content: none;
}

.marketing-hero--how-it-works.ns-warm-lift .marketing-hero__title,
.marketing-hero--how-it-works.ns-warm-lift .marketing-hero__lead {
  color: var(--color-ink);
  text-shadow: none;
}

/* About and press: the headline sits in the Dawn band. A Paper frost panel
   was painting over the ::after, so the type never landed in that light. */
.marketing-hero.ns-warm-lift {
  align-items: flex-end;
}

.marketing-hero.ns-warm-lift .marketing-hero__panel {
  border-color: transparent;
  background-color: transparent;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.marketing-hero.ns-warm-lift .marketing-hero__title,
.marketing-hero.ns-warm-lift .marketing-hero__lead,
.marketing-hero.ns-warm-lift .marketing-hero__eyebrow {
  color: var(--color-ink);
  text-shadow: none;
}

/* Cover the band. A background-image on a non-photo-only hero is stretched
   (marketing-hero.css sizes the first layer to 100% 100%). */
.marketing-hero.ns-warm-lift > .marketing-hero__photo {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  pointer-events: none;
}

@media (max-width: 640px) {
  .ns-warm-lift--crop,
  .care-path-photo-card .care-path-photo-card__media.ns-warm-lift,
  .care-path-photo-card--featured .care-path-photo-card__media.ns-warm-lift,
  .onboarding-funnel__media.ns-warm-lift,
  .onboarding-funnel__step-media.ns-warm-lift,
  .onboarding-funnel__panel[data-onboarding-screen="orientation"] .onboarding-funnel__step-media.ns-warm-lift,
  .dashboard-hub__main > .dashboard-care-paths--photo-layout .care-path-photo-card:not(.care-path-photo-card--featured) .care-path-photo-card__media.ns-warm-lift,
  .dashboard-hub__main > .dashboard-care-paths--photo-layout .care-path-photo-card--featured .care-path-photo-card__media.ns-warm-lift,
  .dashboard-hub__main > .dashboard-care-paths--photo-layout .care-path-photo-card--preventative .care-path-photo-card__media.ns-warm-lift {
    aspect-ratio: 4 / 5;
    height: auto;
    width: 100%;
    min-height: 0;
  }

  /* The 4:5 frame is on the figure. The photo has to fill it, or a 16:9
     img sits at the top and Dawn paints the empty band underneath. */
  .ns-warm-lift--crop > .ns-warm-lift__photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    aspect-ratio: auto;
    object-fit: cover;
  }

  /* Every enhanced-diagnostic card, including legacy JPGs. Beats the 16/10
     preventative frame so the first card is not twice as tall. */
  .ed-landing .care-path-photo-grid .care-path-photo-card__media.ns-warm-lift {
    aspect-ratio: 4 / 5;
    height: auto;
    width: 100%;
    min-height: 0;
  }
}
