/* =========================================================================
   GETMYLOOK BAND — companion-app strip on the landing page.
   Fashion Edition is GetMyLook's content arm, so this link is load-bearing;
   the crawler copy lives in the landing prerender (build-cloudflare-exact.cjs
   hiddenBody). Localized copy is optional: window.FASHION_COPY.getmylook
   overrides the English defaults below.
   ========================================================================= */
function GetMyLookBand() {
  const copy = window.FASHION_COPY?.getmylook || {};
  return (
    <section id="getmylook" className="section section-rule" data-screen-label="08 GetMyLook">
      <div className="frame">
        <div className="sec-head">
          <div className="num">{copy.sectionNum || "No. 05"}</div>
          <h2 className="title">
            {copy.title || "One more door,"} <span className="display italic" style={{ color: "var(--accent)" }}>{copy.titleAccent || "same wardrobe."}</span>
          </h2>
          <div className="meta"></div>
        </div>
        <a className="gml-card" href="https://getmylook.app">
          <img className="gml-icon" src="/assets/getmylook-icon.png" alt="GetMyLook" width="96" height="96" loading="lazy" />
          <p className="gml-tag">{copy.tag || "Companion app — Outfit boards"}</p>
          <p className="gml-title">GetMyLook</p>
          <p className="gml-desc">{copy.desc || "A canvas for the wardrobe you're building — each outfit a card that travels, with every piece a tap away. Free to build."}</p>
          <span className="gml-cta">{copy.cta || "Open getmylook.app"} <span className="arr">→</span></span>
        </a>
      </div>
    </section>
  );
}
window.GetMyLookBand = GetMyLookBand;
