﻿/* O2O Homepage — Production CSS v2 */
*,::before,::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:"PingFang SC","Microsoft YaHei",sans-serif;background:#F8F9FA;color:#1F2933;line-height:1.8}
a{color:inherit;text-decoration:none}img,svg{max-width:100%;height:auto}

.max-w-7xl{max-width:1280px;margin:0 auto}.max-w-3xl{max-width:768px;margin:0 auto}.max-w-lg{max-width:512px}
.px-6{padding:0 24px}.p-8{padding:32px}.mt-1{margin-top:4px}.mt-2{margin-top:8px}.mt-3{margin-top:12px}.mt-5{margin-top:20px}.mt-8{margin-top:32px}.mb-2{margin-bottom:8px}.mb-3{margin-bottom:12px}
.flex{display:flex}.grid{display:grid}.hidden{display:none}.block{display:block}
.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}
.gap-3{gap:12px}.gap-4{gap:16px}.gap-6{gap:24px}.gap-8{gap:32px}
.grid-cols-2{grid-template-columns:repeat(2,1fr)}.text-center{text-align:center}
.font-bold{font-weight:700}.font-extrabold{font-weight:800}.font-semibold{font-weight:600}
.text-xs{font-size:12px}.text-sm{font-size:14px}.text-lg{font-size:18px}.text-xl{font-size:20px}.text-2xl{font-size:24px}.text-3xl{font-size:30px}.text-4xl{font-size:36px}.md\:text-4xl{font-size:36px}.md\:text-5xl{font-size:48px}
.text-1{color:#1F2933}.text-2{color:#5E6B7A}.text-3{color:#939DA8}.text-white{color:#fff}
.leading-tight{line-height:1.3}.bg-white{background:#fff}.rounded-lg{border-radius:8px}

/* Nav */
.nav{border-bottom:1px solid #E8ECF1;background:#fff;box-shadow:none}
.sticky{position:sticky}.top-0{top:0}.z-50{z-index:50}.h-16{height:64px}

/* Cards — refined shadow, no transform */
.card{border-radius:8px;background:#fff;padding:32px;box-shadow:0 1px 3px rgba(0,0,0,.04),0 1px 2px rgba(0,0,0,.06);transition:box-shadow .2s}
.card:hover{box-shadow:0 2px 8px rgba(0,0,0,.06),0 2px 4px rgba(0,0,0,.04)}

/* Buttons */
.btn-ghost{border:1px solid #FF6034;color:#FF6034;border-radius:8px;padding:10px 24px;font-size:14px;font-weight:500;transition:all .2s;display:inline-block}.btn-ghost:hover{background:#FF6034;color:#fff}
.btn-primary{background:#FF6034;color:#fff;border-radius:8px;padding:12px 32px;font-size:15px;font-weight:600;transition:all .2s;display:inline-block;border:none}.btn-primary:hover{background:#e5522a}
.btn-secondary{border:1px solid #D0D5DD;color:#1F2933;border-radius:8px;padding:12px 32px;font-size:15px;font-weight:500;transition:all .2s;display:inline-block;background:#fff}.btn-secondary:hover{border-color:#1F2933}

/* Icon */
.icon-sq{width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:6px;background:#FFF5F0;color:#FF6034;font-size:14px;margin-bottom:20px}

/* Hero */
.hero-illustration{width:100%;max-width:420px;aspect-ratio:1;background:#F8F9FA;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#D0D5DD;font-size:80px}

/* Footer */
footer{background:#1A1E24;color:#939DA8}footer a{color:#939DA8;transition:color .2s}footer a:hover{color:#FF6034}

/* Section spacing */
section{padding:80px 0}
h2{font-size:28px;font-weight:700;color:#1F2933;margin-bottom:16px}
.subtitle{font-size:16px;color:#5E6B7A;margin-bottom:48px}
.border-t{border-top:1px solid #E8ECF1}.border-gray-100{border-color:#E8ECF1}

@media(min-width:768px){.md\:flex{display:flex}.md\:block{display:block}.md\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.md\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.md\:grid-cols-4{grid-template-columns:repeat(4,1fr)}.md\:py-28{padding-top:112px;padding-bottom:112px}.md\:text-4xl{font-size:36px}.md\:text-5xl{font-size:42px}}