/* Homepage-only restoration: one photographic stage with soft cream overlays.
   The approved 2:1 photograph stays intact and sits farther right; no copy edits. */
@layer loving-home-hero-unified-20261106 {
  #main .brand-hero-r03[data-home-hero-unified="20261106"] {
    --hero-photo-height: clamp(560px, 43vw, 920px);
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    min-height: var(--hero-photo-height) !important;
    isolation: isolate;
    background: var(--cream) !important;
    overflow: hidden !important;
  }
  #main .brand-hero-r03[data-home-hero-unified] > .frame-home-photo-r32 {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: auto !important;
    z-index: 0 !important;
  }
  #main .brand-hero-r03[data-home-hero-unified] > .frame-home-photo-r32::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    /* Fade remains part of the full scene and ends before the product packet. */
    background:
      linear-gradient(to right, var(--cream) 0%, var(--cream) 25%, rgba(247,243,231,.96) 32%, rgba(247,243,231,.72) 36%, rgba(247,243,231,.15) 41%, transparent 44%) !important;
    pointer-events: none;
  }
  /* Scale the complete photo proportionally, without translating it off canvas.
     The packet starts beyond the cream fade; only outer photo edges soften. */
  #main .brand-hero-r03[data-home-hero-unified] > .frame-home-photo-r32 > img {
    position: absolute !important;
    top: 50% !important;
    right: 0 !important;
    left: auto !important;
    width: 78% !important;
    height: auto !important;
    max-height: 100% !important;
    transform: translateY(-50%) !important;
    mask-image: linear-gradient(to bottom, transparent, #000 16px, #000 calc(100% - 24px), transparent);
  }
  #main .brand-hero-r03[data-home-hero-unified] > .brand-hero-copy {
    position: relative !important;
    grid-row: 1 !important;
    z-index: 1 !important;
    width: 45% !important;
    max-width: 760px !important;
    inset: auto !important;
    align-self: stretch !important;
    padding: 48px clamp(30px, 4.4vw, 90px) !important;
    padding-right: clamp(24px, 3vw, 54px) !important;
    background: transparent !important;
    justify-content: center !important;
  }
  #main .brand-hero-r03[data-home-hero-unified] .hero-values {
    gap: 18px !important;
  }
  @media (max-width: 1150px) {
    #main .brand-hero-r03[data-home-hero-unified="20261106"] {
      --hero-photo-height: 50vw;
      min-height: 0 !important;
    }
    #main .brand-hero-r03[data-home-hero-unified] > .frame-home-photo-r32 {
      height: var(--hero-photo-height) !important;
    }
    #main .brand-hero-r03[data-home-hero-unified] > .frame-home-photo-r32 > img {
      width: 100% !important;
      height: 100% !important;
      mask-image: none;
    }
    #main .brand-hero-r03[data-home-hero-unified] > .frame-home-photo-r32::after {
      background: linear-gradient(to bottom, transparent 67%, rgba(247,243,231,.12) 76%, rgba(247,243,231,.72) 91%, var(--cream) 100%) !important;
    }
    #main .brand-hero-r03[data-home-hero-unified] > .brand-hero-copy {
      width: 100% !important;
      max-width: none !important;
      padding: calc(var(--hero-photo-height) - 36px) 6% 32px !important;
      justify-content: flex-start !important;
    }
    #main .brand-hero-r03[data-home-hero-unified] .hero-values {
      margin-top: 22px !important;
    }
  }
  @media (max-width: 480px) {
    #main .brand-hero-r03[data-home-hero-unified] > .brand-hero-copy {
      padding-top: calc(var(--hero-photo-height) - 16px) !important;
      padding-bottom: 24px !important;
    }
    #main .brand-hero-r03[data-home-hero-unified] .hero-values {
      gap: 12px !important;
    }
  }
}