.hpg{display:flex;flex-direction:column;gap:12px;width:100%}.hpg__top{display:grid;grid-template-columns:2fr 1fr;gap:12px}.hpg__side{display:grid;grid-template-rows:1fr 1fr;gap:12px;min-height:0}.hpg__bottom{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}.hpg-item{position:relative;display:block;overflow:hidden;background-color:#1f2540;background-size:cover;background-position:center;color:#fff;isolation:isolate;aspect-ratio:16 / 9;transition:transform 0.4s ease}.hpg-item__cover{position:absolute;inset:0;z-index:4;text-decoration:none;overflow:hidden;text-indent:100%;white-space:nowrap}.hpg-item__cover:focus-visible{outline:3px solid #fff;outline-offset:-3px}.hpg-item--hero{aspect-ratio:auto;min-height:100%}.hpg__top:not(:has(.hpg__side)) .hpg-item--hero{aspect-ratio:16 / 9}.hpg-item::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(0,0,0,.8) 100%);z-index:1;pointer-events:none}.hpg-item__overlay{position:absolute;inset:0;background-color:rgba(37,53,122,.78);opacity:0;transition:opacity 0.4s ease;z-index:2;pointer-events:none}.hpg-item__arrow{position:absolute;top:16px;right:16px;width:38px;height:38px;color:#fff;opacity:0;transform:translate(-10px,10px) scale(.85);transition:opacity 0.4s ease,transform 0.4s ease;z-index:3;pointer-events:none}.hpg-item--hero .hpg-item__arrow{width:52px;height:52px;top:22px;right:22px}.hpg-item__content{position:absolute;left:0;right:0;bottom:0;padding:18px 22px;z-index:5;pointer-events:none}.hpg-item__category{display:inline-block;padding:5px 12px;margin-bottom:10px;background-color:#4f46e5;color:#fff;font-size:12px;font-weight:600;line-height:1.2;letter-spacing:.02em;border-radius:2px;text-decoration:none;pointer-events:auto;transition:background-color 0.2s ease,transform 0.2s ease}.hpg-item__category:hover,.hpg-item__category:focus-visible{background-color:#fff;color:#1f2540;outline:none}.hpg-item__title{margin:0;color:#fff;font-size:17px;font-weight:700;line-height:1.3;text-shadow:0 1px 3px rgba(0,0,0,.4)}.hpg-item--hero .hpg-item__title{font-size:30px;line-height:1.2}.hpg-item__author{display:block;margin-top:12px;font-size:13px;color:rgba(255,255,255,.85)}.hpg-item__author em{font-style:normal;text-decoration:underline;text-underline-offset:2px}.hpg-item:hover .hpg-item__overlay{opacity:1}.hpg-item:hover .hpg-item__arrow{opacity:1;transform:translate(0,0) scale(1)}.hpg-empty{padding:48px 24px;text-align:center;color:#6b7280;background:#f7f7f7;border:2px dashed #d1d5db;border-radius:4px;font-size:14px}@media (max-width:1024px){.hpg-item__title{font-size:15px}.hpg-item--hero .hpg-item__title{font-size:22px}.hpg-item__content{padding:14px 16px}}@media (max-width:767px){.hpg__top{grid-template-columns:1fr}.hpg__side{grid-template-rows:none;grid-template-columns:1fr}.hpg__bottom{display:none}.hpg-item{aspect-ratio:16 / 9}.hpg-item--hero{aspect-ratio:16 / 9;min-height:0}.hpg-item--hero .hpg-item__title{font-size:20px}.hpg-item__content{padding:14px 16px}}