// Boise Maternity — Sections 1 (Hero), 2 (Welcome), 3 (Gallery)

// ---------- 1. HERO ----------
function BmHero() {
  return (
    <section data-screen-label="01 BM Hero" style={{
      position: "relative", height: "100vh", minHeight: 760,
      background: VM_INK, overflow: "hidden",
    }}>
      <img
        src="/images/boise-maternity.jpg"
        alt="Boise maternity photographer — luxury modern maternity portrait by J. Renée Studios"
        style={{
          position: "absolute", inset: 0, width: "100%", height: "100%",
          objectFit: "cover", objectPosition: "center 30%",
        }}
      />
      <div style={{
        position: "absolute", inset: 0,
        background: "linear-gradient(180deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.18) 30%, rgba(0,0,0,0.05) 50%, rgba(0,0,0,0.7) 100%)",
      }} />
      <div style={{
        position: "relative", zIndex: 2, height: "100%",
        maxWidth: 1320, margin: "0 auto", padding: "140px 48px 84px",
        display: "flex", flexDirection: "column", justifyContent: "flex-end",
      }}>
        <div style={{ display: "flex", alignItems: "center", gap: 18, marginBottom: 36 }}>
          <VmGoldRule width={56} />
          <VmEyebrow color={VM_GOLD}>Boise · Modern Maternity</VmEyebrow>
        </div>
        <h1 className="vm-hero-h1" style={{
          fontFamily: "Gloock, serif", fontWeight: 400, color: VM_WHITE,
          fontSize: "clamp(48px, 8.4vw, 132px)", lineHeight: 1.0,
          letterSpacing: "-0.005em", margin: 0, textWrap: "balance", maxWidth: 1100,
        }}>
          Modern <em style={{ fontStyle: "italic", color: "#efe5cf" }}>Maternity</em><br/>Portraits.
        </h1>
        <p style={{
          fontFamily: "Poppins, sans-serif", fontWeight: 300, fontSize: 17,
          lineHeight: 1.7, color: "rgba(255,255,255,0.88)",
          maxWidth: 580, margin: "44px 0 0 0",
        }}>
          Editorial maternity photography in the Boise studio — for the woman, and for the people who define this chapter with her.
        </p>
      </div>
    </section>
  );
}

// ---------- 2. WELCOME ----------
function BmWelcome() {
  return (
    <section data-screen-label="02 BM Welcome" style={{ background: VM_WHITE, padding: "180px 48px" }}>
      <div style={{ maxWidth: 760, margin: "0 auto", textAlign: "center" }}>
        <div style={{ display: "inline-flex", alignItems: "center", gap: 16, marginBottom: 28 }}>
          <VmGoldRule width={36} />
          <VmEyebrow>Welcome</VmEyebrow>
          <VmGoldRule width={36} />
        </div>
        <h2 style={{
          fontFamily: "Gloock, serif", fontWeight: 400, color: VM_INK,
          fontSize: "clamp(28px, 3.2vw, 38px)", lineHeight: 1.2,
          letterSpacing: "-0.005em", margin: "0 0 56px 0", textWrap: "balance",
        }}>
          Boise Modern Maternity Photographer.
        </h2>
        <div style={{
          fontFamily: "Poppins, sans-serif", fontWeight: 300, fontSize: 16,
          lineHeight: 1.95, color: "#2a2622", textAlign: "left",
        }}>
          <p style={{ margin: "0 0 22px 0" }}>
            Modern Maternity is luxury maternity photography in the Boise studio — built around a single belief: that a woman in this chapter of her life deserves images she'll actually want to display, not tuck into a baby book.
          </p>
          <p style={{ margin: "0 0 22px 0" }}>
            I'm Jennifer — the photographer behind J. Renée Studios. For more than twenty years, I've been documenting women through the chapters that matter, and few chapters are more fleeting than this one.
          </p>
          <p style={{ margin: "0 0 22px 0" }}>
            Every Modern Maternity session is fully guided, fully styled, and built around her. Her partner is welcome. Her children are welcome. The people who define this chapter with her are part of the portrait of who she is becoming.
          </p>
          <p style={{ margin: 0, fontStyle: "italic" }}>
            This is editorial. This is intentional. This is the kind of session you'll look back on years from now and finally love an image of yourself.
          </p>
        </div>
      </div>
    </section>
  );
}

// ---------- 3. GALLERY (sliding marquee) ----------
function BmGallery() {
  const images = [
    { src: "/images/vm-gallery-01.jpg", alt: "Boise modern maternity — black-and-white silhouette portrait of a pregnant woman draped in flowing fabric" },
    { src: "/images/vm-gallery-02.jpg", alt: "Boise modern maternity — striking black-and-white silhouette of a pregnant woman in profile" },
    { src: "/images/vm-gallery-03.jpg", alt: "Boise modern maternity — intimate black-and-white couples portrait, partner kissing the belly" },
    { src: "/images/vm-gallery-04.jpg", alt: "Boise modern maternity — editorial black-and-white couples portrait, partner's hands cradling the belly" },
    { src: "/images/vm-gallery-05.jpg", alt: "Boise modern maternity — black-and-white profile portrait in a fitted black turtleneck" },
    { src: "/images/vm-gallery-06.jpg", alt: "Boise modern maternity — joyful black-and-white portrait in a fitted dress and wide-brim hat" },
    { src: "/images/vm-gallery-07.jpg", alt: "Boise modern maternity — editorial silhouette seated on a studio cube" },
    { src: "/images/vm-gallery-08.jpg", alt: "Boise modern maternity — black-and-white family portrait, partner kissing the belly while toddler kisses mother" },
    { src: "/images/vm-gallery-09.jpg", alt: "Boise modern maternity — dramatic low-key black-and-white profile, single light revealing the silhouette" },
    { src: "/images/vm-gallery-10.jpg", alt: "Boise modern maternity — full-length portrait draped in flowing nude chiffon against a textured wall" },
    { src: "/images/vm-gallery-11.jpg", alt: "Boise modern maternity — black-and-white couples portrait, foreheads together with hands cradling the belly" },
    { src: "/images/vm-gallery-12.jpg", alt: "Boise modern maternity — intimate black-and-white couples portrait in studio" },
  ];
  return (
    <PortfolioGrid
      images={images}
      label="03 BM Gallery"
      galleryAria="Boise Modern Maternity gallery"
      subhead="Selected maternity sessions from the Boise studio."
    />
  );
}

Object.assign(window, { BmHero, BmWelcome, BmGallery });