/* ============================================================
   ÂMBAR · interações
   ============================================================ */
(function () {
  "use strict";

  const prefersReduced = matchMedia("(prefers-reduced-motion: reduce)").matches;
  const clamp = (n, a, b) => Math.max(a, Math.min(b, n));

  /* ---------- Opening animation ---------- */
  const intro = document.getElementById("intro");
  window.addEventListener("load", () => {
    setTimeout(() => {
      if (intro) intro.classList.add("is-done");
      document.body.classList.remove("is-loading");
      setTimeout(() => intro && intro.remove(), 1000);
    }, prefersReduced ? 0 : 2600);
  });

  /* ---------- Header state ---------- */
  const head = document.getElementById("head");
  const onHeadScroll = () => head.classList.toggle("is-scrolled", window.scrollY > 40);
  onHeadScroll();
  window.addEventListener("scroll", onHeadScroll, { passive: true });

  /* ---------- Reveal on scroll ---------- */
  if ("IntersectionObserver" in window && !prefersReduced) {
    const io = new IntersectionObserver((entries, obs) => {
      entries.forEach((entry) => {
        if (entry.isIntersecting) {
          entry.target.classList.add("is-visible");
          obs.unobserve(entry.target);
        }
      });
    }, { threshold: 0.2, rootMargin: "0px 0px -8% 0px" });
    document.querySelectorAll(".reveal").forEach((el) => io.observe(el));
  } else {
    document.querySelectorAll(".reveal").forEach((el) => el.classList.add("is-visible"));
  }

  /* ============================================================
     Degustation spine: gold line fills as you scroll through it
     ============================================================ */
  const spine = document.getElementById("spine");
  const fill = spine ? spine.querySelector(".spine__fill") : null;

  if (spine && fill && !prefersReduced) {
    let ticking = false;

    function paintSpine() {
      const h = spine.offsetHeight;
      const rect = spine.getBoundingClientRect();
      // progress: how far the viewport's mid-line has travelled through the spine
      const anchor = window.innerHeight * 0.55;
      const p = clamp((anchor - rect.top) / h, 0, 1);
      fill.style.height = (p * h) + "px";
    }

    function request() {
      if (ticking) return;
      ticking = true;
      requestAnimationFrame(() => { paintSpine(); ticking = false; });
    }

    paintSpine();
    window.addEventListener("scroll", request, { passive: true });
    window.addEventListener("resize", request);
  }

  /* ---------- Active nav link ---------- */
  const links = document.querySelectorAll(".nav a");
  const sections = document.querySelectorAll("main section[id]");
  if ("IntersectionObserver" in window && links.length) {
    const spy = new IntersectionObserver((entries) => {
      entries.forEach((entry) => {
        if (entry.isIntersecting) {
          links.forEach((a) =>
            a.style.setProperty(
              "color",
              a.getAttribute("href") === "#" + entry.target.id ? "var(--gold)" : ""
            )
          );
        }
      });
    }, { rootMargin: "-45% 0px -50% 0px" });
    sections.forEach((s) => spy.observe(s));
  }
})();
