// Contact section — LINE QR is the centerpiece
function ContactBlock() {
  return (
    <section className="ev-contact" id="contact">
      <div className="ev-contact__grid">
        <div className="ev-contact__words">
          <div className="ev-eyebrow ev-eyebrow--accent">聯絡</div>
          <h2 className="ev-h2">先加 LINE，再說車況。</h2>
          <p className="ev-contact__sub">JR 廠長親自回覆。我們不發罐頭訊息，所有諮詢都由現場師傅看過照片再報價。</p>
          <ul className="ev-contact__list">
            <li><strong>LINE</strong><span>@52ev</span></li>
            <li><strong>電話</strong><span>0938-886-773</span></li>
            <li><strong>地址</strong><span>彰化市金馬路三段 168 巷</span></li>
            <li><strong>停車</strong><span>門口可停車</span></li>
            <li><strong>週一至週六</strong><span>09:00 – 19:00</span></li>
            <li><strong>週日</strong><span>休息</span></li>
          </ul>
        </div>
        <a className="ev-contact__qr" href={LINE_URL} target="_blank" rel="noopener noreferrer">
          <div className="ev-qr-headline">
            <LineGlyph />
            <span>加入官方 LINE</span>
          </div>
          <div className="ev-qr-id">@52ev</div>
          <div
            className="ev-qr"
            style={{ backgroundImage: 'url(assets/line-qr.webp)' }}
            role="img"
            aria-label="LINE QR @52ev"
          />
          <div className="ev-qr-cap">點擊或掃描 QR 即時加入</div>
        </a>
      </div>
      <div style={{ maxWidth: 'var(--container)', margin: '48px auto 0', padding: '0 0px' }}>
        <iframe
          title="電車玩家廠房位置地圖"
          src="https://maps.google.com/maps?q=彰化市金馬路三段168巷&output=embed&z=16"
          width="100%"
          height="320"
          style={{ border: 0, borderRadius: 'var(--r-xl)', display: 'block' }}
          allowFullScreen=""
          loading="lazy"
          referrerPolicy="no-referrer-when-downgrade"
        />
      </div>
    </section>
  );
}

window.ContactBlock = ContactBlock;