/* 08487 原创首页 hero：intro + mosaic（与 81310 轮播完全异构） */
.vh84-hero{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:22px;align-items:stretch;margin-top:24px;padding:34px 36px;border-radius:28px;background:linear-gradient(135deg,#ffffff 0%,#fdf2f8 55%,#fce7f3 100%);border:1px solid #f9d8e8;box-shadow:0 10px 34px rgba(236,72,153,.08)}
.vh84-intro{display:flex;flex-direction:column;justify-content:center;min-width:0}
.vh84-eyebrow{display:inline-flex;align-self:flex-start;align-items:center;gap:7px;font-size:12px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:#be185d;background:#fce7f3;padding:6px 14px;border-radius:99px}
.vh84-title{font-size:32px;line-height:1.18;font-weight:800;color:#1e1b2e;margin:14px 0 0;letter-spacing:-.4px}
.vh84-sub{margin:10px 0 0;font-size:14.5px;line-height:1.65;color:#6b7280;max-width:30em}
.vh84-stats{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.vh84-stat{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#4b5563;background:#fff;border:1px solid #f3d3e3;border-radius:14px;padding:8px 14px;box-shadow:0 2px 8px rgba(236,72,153,.06)}
.vh84-stat b{font-size:16px;color:#be185d;font-weight:800}
.vh84-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.vh84-btn{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:800;padding:13px 30px;border-radius:99px;text-decoration:none;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.vh84-btn--main{background:linear-gradient(135deg,#ec4899,#db2777);color:#fff;box-shadow:0 10px 24px rgba(219,39,119,.35)}
.vh84-btn--main:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(219,39,119,.45);color:#fff}
.vh84-btn--soft{background:#fff;color:#be185d;border:2px solid #f3c9dd}
.vh84-btn--soft:hover{border-color:#ec4899;transform:translateY(-2px);color:#be185d}
.vh84-mosaic{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:12px;min-width:0}
.vh84-tile{position:relative;display:block;border-radius:18px;overflow:hidden;background:#f9a8d4;min-height:118px;text-decoration:none}
.vh84-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.vh84-tile:hover img{transform:scale(1.06)}
.vh84-tile__veil{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(30,27,46,0) 42%,rgba(30,27,46,.78) 100%)}
.vh84-tile__tag{position:absolute;z-index:2;top:10px;right:10px;font-size:11px;font-weight:800;color:#fff;background:rgba(236,72,153,.92);padding:4px 10px;border-radius:99px;opacity:0;transform:translateY(-4px);transition:.25s}
.vh84-tile:hover .vh84-tile__tag{opacity:1;transform:none}
.vh84-tile__info{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;align-items:flex-end;justify-content:space-between;gap:8px;padding:10px 12px}
.vh84-tile__name{font-size:13.5px;font-weight:700;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 1px 6px rgba(0,0,0,.4)}
.vh84-tile__plays{font-size:11.5px;font-weight:700;color:#fbcfe8;white-space:nowrap}
@media(max-width:1100px){
.vh84-hero{grid-template-columns:1fr;padding:26px 22px}
.vh84-title{font-size:26px}
.vh84-mosaic{grid-template-rows:auto}
.vh84-tile{min-height:150px}
}
@media(max-width:768px){
.vh84-title{font-size:22px}
.vh84-sub{font-size:13.5px}
}
@media(max-width:480px){
.vh84-mosaic{gap:9px}
.vh84-tile{min-height:104px;border-radius:14px}
.vh84-actions .vh84-btn{width:100%;justify-content:center}
}