/* HONCHEER site — Alibaba-style light theme + interactions */
html { scroll-behavior: smooth; }

body { font-family: 'Inter', ui-sans-serif, system-ui, sans-serif; }

/* ---------- Reveal on scroll ---------- */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.reveal.in-view { opacity: 1; transform: none; }

/* ---------- Marquee ---------- */
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.marquee-track { display: flex; width: max-content; animation: marquee 32s linear infinite; }
.marquee-track:hover { animation-play-state: paused; }

/* ---------- Hero ken-burns ---------- */
@keyframes kenburns { from { transform: scale(1); } to { transform: scale(1.09); } }
.hero-zoom { animation: kenburns 20s ease-in-out infinite alternate; }

/* ---------- Floating WhatsApp + back-to-top ---------- */
.float-btns { position: fixed; right: 20px; bottom: 20px; z-index: 60; display: flex; flex-direction: column; gap: 12px; }
.float-wa { width: 56px; height: 56px; border-radius: 9999px; background: #25D366; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 24px rgba(37, 211, 102, .45); transition: transform .2s ease; }
.float-wa:hover { transform: scale(1.08); }
.float-wa svg { width: 30px; height: 30px; fill: #fff; }
.float-top { width: 44px; height: 44px; border-radius: 9999px; background: #FF6A00; color: #fff; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 20px rgba(255, 106, 0, .4); opacity: 0; pointer-events: none; transition: opacity .3s ease; }
.float-top.show { opacity: 1; pointer-events: auto; }

/* ---------- Lightbox ---------- */
.lightbox { position: fixed; inset: 0; z-index: 90; background: rgba(2, 6, 23, .94); display: none; align-items: center; justify-content: center; cursor: zoom-out; }
.lightbox.open { display: flex; }
.lightbox img { max-width: 90vw; max-height: 88vh; border-radius: 12px; box-shadow: 0 30px 80px rgba(0, 0, 0, .6); }
.lb-close { position: absolute; top: 14px; right: 26px; color: #fff; font-size: 40px; line-height: 1; cursor: pointer; user-select: none; }

/* ---------- FAQ accordion ---------- */
.faq-a { max-height: 0; overflow: hidden; transition: max-height .35s ease; }
.faq-item.open .faq-a { max-height: 320px; }
.faq-chevron { transition: transform .3s ease; }
.faq-item.open .faq-chevron { transform: rotate(180deg); }

/* ---------- Alibaba-style product card ---------- */
.card-ali { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.card-ali:hover { transform: translateY(-4px); box-shadow: 0 12px 32px -8px rgba(15, 23, 42, .18); border-color: #FF6A00; }
.price-ali { color: #FF6A00; font-weight: 800; }

/* ---------- Trust badge shimmer ---------- */
@keyframes pulse-ring { 0% { box-shadow: 0 0 0 0 rgba(255, 106, 0, .35); } 70% { box-shadow: 0 0 0 10px rgba(255, 106, 0, 0); } 100% { box-shadow: 0 0 0 0 rgba(255, 106, 0, 0); } }
.pulse-ring { animation: pulse-ring 2.4s infinite; }

/* ---------- Custom scrollbar (light) ---------- */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: #FF6A00; }
