/* =========================================================================
   Animation ตอนเลื่อนหน้า (scroll reveal) — หน้าแรกใหม่
   assets/spu-reveal.js ใส่ class ให้เอง ไม่ต้องตั้งอะไรใน Elementor:
     .rv          ส่วนทั่วไป: ค่อยๆ ลอยขึ้น + ชัดขึ้น
     .rv-band     แถบหัวข้อชมพู (spu-band): เลื่อนเข้ามาจากขวา
     .rv-item     การ์ด/รูปในตาราง (bento, การ์ดเมนู): ทยอยขึ้นทีละใบ (--i = ลำดับ)
   ซ่อนก่อนเฉพาะตอน JS ทำงานแล้ว (html.spu-rv) — JS ไม่ทำงาน หน้ายังเห็นครบ
   ไม่ใช้กับส่วนบนสุด (แบนเนอร์) และคนที่ตั้งเครื่องให้ลดการเคลื่อนไหว
   ========================================================================= */
/* พื้นหลังหน้าที่เห็นตอนส่วนยังซ่อน/กำลังค่อยๆ ชัด: ดำ (สีเดียวกับ section ส่วนใหญ่) แทนขาวของ body */
html.spu-rv body,
html.spu-rv .elementor[data-elementor-type="wp-page"] { background-color: #1C1C1C; }
/* .rv-band ที่รอเล่นอยู่เลื่อนไปขวา 60px — ถ้าไม่ตัด หน้าจะกว้างเกินจอ (มือถือเลื่อนซ้ายขวาได้) */
html.spu-rv .elementor[data-elementor-type="wp-page"] { overflow-x: clip; }

html.spu-rv .rv,
html.spu-rv .rv-item {
  opacity: 0;
  transform: translateY(36px);
  transition: opacity .7s ease, transform .8s cubic-bezier(.2, .7, .2, 1);
  transition-delay: calc(var(--i, 0) * 90ms);
  will-change: opacity, transform;
}
html.spu-rv .rv-item { transform: translateY(28px) scale(.97); }
html.spu-rv .rv-band {
  opacity: 0;
  transform: translateX(60px);
  transition: opacity .7s ease, transform .9s cubic-bezier(.2, .7, .2, 1);
}
html.spu-rv .rv-band .elementor-heading-title { transition: letter-spacing 1s cubic-bezier(.2, .7, .2, 1) .15s; letter-spacing: .12em; }

html.spu-rv .rv.is-in,
html.spu-rv .rv-item.is-in,
html.spu-rv .rv-band.is-in { opacity: 1; transform: none; }
html.spu-rv .rv-band.is-in .elementor-heading-title { letter-spacing: normal; }

/* หลังเล่นจบ ปล่อย will-change ไม่ให้กินหน่วยความจำ */
html.spu-rv .is-done { will-change: auto; }

@media (prefers-reduced-motion: reduce) {
  html.spu-rv .rv, html.spu-rv .rv-item, html.spu-rv .rv-band { opacity: 1; transform: none; transition: none; }
}