.hero{background:linear-gradient(158deg,#243a5e 0%,#0e1628 100%);color:#fff;padding:56px 0 90px;position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;right:-6%;top:-10%;width:400px;height:400px;border-radius:50%;background:radial-gradient(circle,rgba(232,104,48,.06) 0%,transparent 70%)}
.hero-g{display:grid;grid-template-columns:1.06fr .94fr;gap:44px;align-items:center;position:relative;z-index:1}
.hero h1{color:#fff}.hero p{color:rgba(255,255,255,.76)}
.hero-s{display:flex;gap:18px;margin-top:24px;flex-wrap:wrap}
.hero-s b{display:block;font-family:var(--hd);font-weight:800;font-size:1.28rem;color:var(--tg400)}
.hero-s span{font-size:.72rem;color:rgba(255,255,255,.55)}
.hero-m{text-align:center;position:relative}
.hero-m img{max-height:360px;margin:0 auto;filter:drop-shadow(0 16px 26px rgba(0,0,0,.4))}
.hero-badge{position:absolute;bottom:4%;left:0;background:#fff;color:var(--cb900);padding:8px 12px;border-radius:var(--rsm);box-shadow:var(--shm);font-weight:700;font-size:.76rem;display:flex;align-items:center;gap:6px}
@media(max-width:991px){.hero-g{grid-template-columns:1fr;text-align:center;gap:24px}.hero p{margin-left:auto;margin-right:auto;max-width:52ch}.hero-s{justify-content:center}.hero-m img{max-height:260px}.btn-row{justify-content:center}}
<style>
.hero-benefits{
    list-style:none;
    margin:25px 0;
    padding:0;
}

.hero-benefits li{
    display:flex;
    align-items:flex-start;
    gap:12px;
    margin:14px 0;
    color:#ffffff;
    font-size:18px;
    line-height:1.7;
    font-weight:500;
}

.hero-benefits li::before{
    content:"✔";
    color:#22c55e;
    font-size:20px;
    font-weight:700;
    flex-shrink:0;
    margin-top:2px;
}

.hero-benefits strong{
    color:#ffffff;
    font-weight:700;
}
</style>

