"use client";

import styles from "../vip.module.css";

type LandingHeroProps = {
  onTitleTap?: () => void;
};

export function LandingHero({ onTitleTap }: LandingHeroProps) {
  return (
    <section className={`${styles.section} ${styles.heroSection} ${styles.heroSection3d}`} style={{ textAlign: "center" }}>
      <p
        className={`${styles.heroEyebrow} animate__animated animate__fadeInDown`}
        style={{ animationDelay: "0.1s", animationFillMode: "both", cursor: "pointer" }}
        onClick={onTitleTap}
        title="连续点击 10 次切换测试价格"
      >
        异度星球会员中心
      </p>
      <h1
        className={`${styles.heroTitle} animate__animated animate__fadeInDown`}
        style={{ animationDelay: "0.2s", animationFillMode: "both" }}
      >
        <span className={styles.heroTitleAccent}>全模块解锁</span>
        <span className={styles.heroTitleRest}> · 持续更新 · 抱团出海</span>
      </h1>
      <p
        className={`${styles.heroLead} animate__animated animate__fadeInDown`}
        style={{ animationDelay: "0.3s", animationFillMode: "both" }}
      >
        一次付费，解锁电子书、视频教程、私密社群、即时问答，每周更新
      </p>
    </section>
  );
}