const Footer = () => {
  return (
    <footer className="footer">
      <div className="container">
        <div className="footer-grid">
          <div className="footer-brand">
            <a href="#top" className="wordmark">
              <span className="zh">美如玉</span>
              <span className="en tagline">美<small>溫 潤 如 玉</small></span>
            </a>
            <p>
              從一把剪刀、一支刷子，到屬於你的店。<br/>
              美如玉陪你走完每一哩路。
            </p>
          </div>
          <div>
            <h5>課程</h5>
            <ul>
              <li><a href="#courses">美容乙丙級證照</a></li>
              <li><a href="#courses">美髮乙丙級證照</a></li>
              <li><a href="#courses">轉職 · 創業班</a></li>
              <li><a href="#courses">男士理髮班</a></li>
            </ul>
          </div>
          <div>
            <h5>關於</h5>
            <ul>
              <li><a href="#teachers">師資陣容</a></li>
              <li><a href="#works">學員成果</a></li>
              <li><a href="#exam">考照資訊</a></li>
              <li><a href="#schedule">開課時間表</a></li>
            </ul>
          </div>
          <div>
            <h5>聯絡</h5>
            <ul>
              <li>03 8328227</li>
              <li>0910 551357 · 李老師</li>
              <li>0910 660815 · 李老師</li>
              <li>花蓮市德安一街 190 號</li>
              <li>週一 ~ 週五 09:00 ~ 17:00<br/>週六 10:00 ~ 12:00<br/>週日 公休</li>
            </ul>
          </div>
        </div>
        <div className="footer-bottom">
          <div>© 2026 美如玉美容美髮補習班 · Mei Ru Yu Academy · All rights reserved.</div>
          <div style={{display:"flex", gap: 24, alignItems:"center"}}>
            <a href="#">隱私政策</a>
            <a href="#">個資使用條款</a>
            <div className="footer-social">
              <a href="tel:03-8328227" aria-label="電話">TEL</a>
              <a href="#signup" aria-label="報名諮詢">諮詢</a>
            </div>
          </div>
        </div>
      </div>
    </footer>
  );
};

window.Footer = Footer;