:root{--bg:#18181b;--accent:#a21caf;--accent2:#e879f9;--light:#fafafa;}
html{scroll-behavior:smooth}
body{font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif;color:#0f172a;background:#fff}
.hero-grid{background:
radial-gradient(circle at 80% 20%, color-mix(in srgb,var(--accent2) 32%, transparent), transparent 34%),
linear-gradient(135deg,var(--bg),#111827 72%);}
.card{border:1px solid #e5e7eb;border-radius:28px;background:#fff;box-shadow:0 10px 30px rgba(15,23,42,.06)}
.section-title{letter-spacing:-.02em}
.hero-img{width:100%;height:430px;object-fit:cover;border-radius:28px;box-shadow:0 22px 70px rgba(0,0,0,.3)}
.thumb{width:100%;height:230px;object-fit:cover;border-radius:24px}
.kicker{color:var(--accent);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.78rem}
.btn-primary{background:var(--accent);color:#fff;border-radius:999px;padding:.9rem 1.35rem;font-weight:700;display:inline-flex;align-items:center;gap:.55rem}
.btn-primary:hover{filter:brightness(.95)}
.logo-mark{background:linear-gradient(135deg,var(--accent),var(--accent2));}
.soft{background:color-mix(in srgb,var(--accent) 7%, white)}
@media(max-width:768px){.hero-img{height:280px}.thumb{height:190px}}