.hero{background:linear-gradient(158deg,#282a40 0%,#12131f 100%);color:#fff;padding:52px 0 70px;position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;right:-6%;top:-10%;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(200,144,48,.1) 0%,transparent 70%)}
.hero-g{display:grid;grid-template-columns:1.08fr .92fr;gap:44px;align-items:center;position:relative;z-index:1}
.hero h1{color:#fff;margin-bottom:.4em}.hero p{color:rgba(255,255,255,.78)}
.hero .ld{color:rgba(255,255,255,.82);max-width:62ch}
.hero-s{display:flex;gap:18px;margin-top:22px;flex-wrap:wrap}
.hero-s b{display:block;font-family:var(--bd);font-weight:800;font-size:1.28rem;color:var(--a400)}
.hero-s span{font-size:.72rem;color:rgba(255,255,255,.55)}
.hero-m{text-align:center;position:relative}
.hero-m img{max-height:380px;margin:0 auto;filter:drop-shadow(0 16px 26px rgba(0,0,0,.4));animation:float 6s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@media(prefers-reduced-motion:reduce){.hero-m img{animation:none}}
.hero-badge{position:absolute;bottom:4%;left:0;background:#fff;color:var(--s900);padding:8px 12px;border-radius:8px;box-shadow:var(--shm);font-weight:700;font-size:.76rem;display:flex;align-items:center;gap:6px}
.hero-tag{display:inline-flex;align-items:center;gap:8px;background:rgba(224,176,80,.14);border:1px solid rgba(224,176,80,.35);color:var(--honey-lt);font-size:.76rem;font-weight:700;padding:6px 12px;border-radius:var(--rpill);margin-bottom:16px}
.hero .qf{grid-template-columns:repeat(3,1fr);margin:18px 0 0}
.why-g{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.why{background:var(--wh);border:1px solid var(--line);border-radius:var(--rmd);padding:22px 18px;text-align:center}
.why img{height:44px;width:auto;margin:0 auto 12px}.why h3{font-size:1rem}.why p{font-size:.86rem;margin:0}
.mech{display:grid;grid-template-columns:1fr 1fr;gap:20px 40px}
.diff-g{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.diff{border-top:3px solid var(--a500);padding-top:14px}.diff h3{font-size:1rem}.diff p{font-size:.9rem;margin:0}
.cmp-note{font-size:.84rem;color:var(--ink2);margin-top:12px}
.ref-g{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ref-g a{display:block;background:var(--wh);border:1px solid var(--line);border-radius:var(--rsm);padding:12px 14px;font-size:.88rem;font-weight:600;color:var(--s800)}
.ref-g a:hover{border-color:var(--a500);color:var(--a500)}
.blog-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:991px){.hero-g{grid-template-columns:1fr;text-align:center;gap:24px}.hero .ld{margin-left:auto;margin-right:auto}.hero-s{justify-content:center}.hero-m img{max-height:260px}.btn-row{justify-content:center}.hero .qa{text-align:left}.why-g{grid-template-columns:1fr 1fr}.diff-g{grid-template-columns:1fr}.mech{grid-template-columns:1fr}.blog-strip{grid-template-columns:1fr}}
@media(max-width:479px){.why-g{grid-template-columns:1fr}.ref-g{grid-template-columns:1fr}}