/* Homepage Videos — isolated design: no Video Gallery or global selectors. */
.vhvideos{--vv-ink:var(--viv-ink);--vv-teal:var(--viv-primary);--vv-gold:var(--viv-accent);position:relative;isolation:isolate;overflow:hidden;padding:clamp(72px,7.5vw,112px) 0;background:linear-gradient(145deg,var(--viv-primary-soft-2) 0%,var(--viv-primary-soft) 46%,#fff 100%);color:var(--vv-ink)}
.vhvideos *{box-sizing:border-box}
.vhvideos__shape{position:absolute;right:-160px;top:-180px;width:510px;height:510px;pointer-events:none;border:1px solid color-mix(in srgb,var(--viv-primary) 9%,transparent);border-radius:41% 59% 56% 44%/56% 47% 53% 44%;transform:rotate(-12deg);box-shadow:0 0 0 63px color-mix(in srgb,var(--viv-primary) 2.5%,transparent),0 0 0 145px color-mix(in srgb,var(--viv-primary) 1.6%,transparent);z-index:-1}
.vhvideos__shell{width:min(1380px,calc(100% - 64px));margin-inline:auto}
.vhvideos__intro{position:relative;display:flex;align-items:center;justify-content:space-between;gap:36px;padding:34px 44px 37px;margin-bottom:33px;border-radius:26px;background:linear-gradient(118deg,var(--viv-primary-deep) 5%,var(--viv-primary-deep) 67%,var(--viv-primary));color:#fff;overflow:hidden}
.vhvideos__intro:after{content:"";position:absolute;width:410px;height:410px;right:-205px;top:-260px;border:1px solid color-mix(in srgb,var(--viv-primary-soft-2) 21%,transparent);border-radius:50%;box-shadow:0 0 0 45px color-mix(in srgb,var(--viv-primary-soft-2) 4.5%,transparent),0 0 0 92px color-mix(in srgb,var(--viv-primary-soft-2) 2.8%,transparent);pointer-events:none}
.vhvideos__intro-copy{position:relative;z-index:1;max-width:850px}
.vhvideos__eyebrow{display:inline-flex;align-items:center;gap:12px;margin-bottom:12px;color:color-mix(in srgb,var(--viv-primary) 48%,var(--viv-white));font-size:11px;line-height:1.4;letter-spacing:.17em;font-weight:800;text-transform:uppercase}
.vhvideos__eyebrow>span{width:30px;height:2px;background:var(--vv-gold)}
.vhvideos__intro h2{margin:0;color:#fff;font-size:39px;line-height:1.18;letter-spacing:-.025em;font-weight:700}
.vhvideos__intro p{max-width:750px;margin:13px 0 0;color:var(--viv-primary-soft-2);font-size:16px;line-height:1.7}
.vhvideos__intro-mark{position:relative;z-index:1;display:grid;place-items:center;flex:0 0 102px;width:102px;height:102px;border:1px solid color-mix(in srgb,var(--viv-primary-soft-2) 28%,transparent);border-radius:27px;color:var(--viv-primary-soft-2);background:rgba(255,255,255,.08);transform:rotate(-7deg)}
.vhvideos__intro-mark svg{width:50px;height:50px;transform:rotate(7deg)}
.vhvideos__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:21px;align-items:stretch}
.vhvideos__card{min-width:0;display:flex;border:1px solid var(--viv-primary-soft-2);border-radius:19px;overflow:hidden;background:#fff;box-shadow:0 5px 22px color-mix(in srgb,var(--viv-primary-deep) 3.4%,transparent);transition:transform .34s cubic-bezier(.22,1,.36,1),box-shadow .34s ease,border-color .34s ease}
.vhvideos__card:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--viv-primary) 48%,var(--viv-white));box-shadow:0 16px 30px color-mix(in srgb,var(--viv-primary-deep) 6.5%,transparent)}
.vhvideos__open{appearance:none;border:0;display:flex;flex-direction:column;width:100%;padding:0;background:transparent;color:inherit;text-align:left;font:inherit;cursor:pointer}
.vhvideos__open:focus-visible{outline:3px solid var(--vv-gold);outline-offset:-4px}
.vhvideos__poster{position:relative;display:block;width:100%;aspect-ratio:16/9;overflow:hidden;background:linear-gradient(135deg,var(--viv-primary),var(--viv-primary) 68%,color-mix(in srgb,var(--viv-primary) 48%,var(--viv-white)));color:var(--viv-primary-soft-2)}
.vhvideos__poster:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,color-mix(in srgb,var(--viv-primary-deep) 31%,transparent),transparent 62%);pointer-events:none}
.vhvideos__poster img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.2,.75,.24,1)}
.vhvideos__card:hover .vhvideos__poster img{transform:scale(1.055)}
.vhvideos__poster-placeholder{position:absolute;inset:0;display:grid;place-items:center;opacity:.65}
.vhvideos__poster-placeholder svg{width:72px;height:72px;stroke-width:1.25}
.vhvideos__play{position:absolute;left:50%;top:50%;z-index:1;display:grid;place-items:center;width:65px;height:65px;border-radius:50%;background:#fff;color:var(--viv-primary);box-shadow:0 9px 30px color-mix(in srgb,var(--viv-primary-deep) 18%,transparent);transform:translate(-50%,-50%);transition:background .3s ease,color .3s ease,transform .3s ease}
.vhvideos__play svg{width:28px;height:28px;margin-left:3px}
.vhvideos__card:hover .vhvideos__play{background:var(--vv-gold);color:var(--viv-primary-deep);transform:translate(-50%,-50%) scale(1.085)}
.vhvideos__duration{position:absolute;bottom:13px;right:14px;z-index:1;padding:4px 9px;background:color-mix(in srgb,var(--viv-primary-deep) 83%,transparent);border-radius:6px;color:#fff;font-size:12px;font-weight:700}
.vhvideos__card-body{display:flex;flex:1;flex-direction:column;gap:9px;min-width:0;width:100%;padding:19px 20px 20px}
.vhvideos__title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--vv-ink);font-size:18px;line-height:1.36;letter-spacing:-.015em;font-weight:700;overflow-wrap:anywhere}
.vhvideos__description{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--viv-slate);font-size:14px;line-height:1.5}
.vhvideos__footer{display:flex;justify-content:center;margin-top:35px}
.vhvideos__all{min-height:54px;display:inline-flex;align-items:center;justify-content:center;gap:25px;padding:14px 23px 14px 27px;background:var(--viv-primary-deep);border:1px solid var(--viv-primary-deep);border-radius:13px;color:#fff!important;text-decoration:none!important;font-size:14px;font-weight:800;transition:background .25s ease,transform .25s ease,border-color .25s ease}
.vhvideos__all svg{width:21px;height:21px;transition:transform .25s ease}
.vhvideos__all:hover{background:var(--viv-primary);border-color:var(--viv-primary);transform:translateY(-2px)}
.vhvideos__all:hover svg{transform:translateX(4px)}
.vhvideos__all:focus-visible{outline:3px solid var(--vv-gold);outline-offset:3px}
.vhvideos__empty{padding:20px;border:1px dashed color-mix(in srgb,var(--viv-primary) 48%,var(--viv-white));border-radius:13px;color:var(--viv-primary);background:#fff}
.vhvideos__modal[hidden]{display:none!important}
.vhvideos__modal{position:fixed;inset:0;z-index:999999;display:flex;align-items:center;justify-content:center;padding:25px;background:color-mix(in srgb,var(--viv-primary-deep) 91%,transparent);backdrop-filter:blur(8px);overflow-y:auto}
.vhvideos__dialog{width:min(100%,1010px);margin:auto;background:var(--viv-primary-deep);color:#fff;border-radius:20px;overflow:hidden;box-shadow:0 30px 85px rgba(0,0,0,.3)}
.vhvideos__modal-bar{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px 20px;color:color-mix(in srgb,var(--viv-primary) 48%,var(--viv-white));font-size:11px;font-weight:800;letter-spacing:.16em}
.vhvideos__modal-bar button{display:grid;place-items:center;width:44px;height:44px;border:1px solid color-mix(in srgb,var(--viv-primary-soft-2) 35%,transparent);border-radius:12px;background:rgba(255,255,255,.08);color:#fff;cursor:pointer}
.vhvideos__modal-bar button:hover{background:var(--viv-primary)}
.vhvideos__modal-bar button:focus-visible{outline:3px solid var(--vv-gold);outline-offset:2px}
.vhvideos__modal-bar svg{width:22px;height:22px}
.vhvideos__player{width:100%;aspect-ratio:16/9;background:#000}
.vhvideos__player iframe,.vhvideos__player video{display:block;width:100%;height:100%;border:0;background:#000;object-fit:contain}
.vhvideos__modal-caption{padding:18px 25px 25px}
.vhvideos__modal-caption h3{color:#fff;margin:0;font-size:22px;font-weight:700;line-height:1.4}
.vhvideos__modal-caption p{color:color-mix(in srgb,var(--viv-primary) 48%,var(--viv-white));font-size:14px;line-height:1.6;margin:9px 0 0}
@media(max-width:1180px){.vhvideos__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:850px){.vhvideos__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.vhvideos__shell{width:calc(100% - 40px)}.vhvideos__intro{padding:30px}.vhvideos__intro-mark{flex-basis:78px;width:78px;height:78px;border-radius:22px}.vhvideos__intro-mark svg{width:41px;height:41px}}
@media(max-width:570px){.vhvideos{padding:65px 0 70px}.vhvideos__shell{width:calc(100% - 32px)}.vhvideos__intro{gap:16px;padding:27px 24px;border-radius:19px}.vhvideos__intro h2{font-size:clamp(29px,7.8vw,39px)}.vhvideos__intro p{font-size:14px}.vhvideos__intro-mark{display:none}.vhvideos__grid{grid-template-columns:1fr;gap:17px}.vhvideos__card-body{padding:21px}.vhvideos__poster{aspect-ratio:16/9}.vhvideos__title{font-size:19px}.vhvideos__all{width:100%}.vhvideos__modal{padding:10px}.vhvideos__dialog{border-radius:12px}.vhvideos__modal-caption{padding:16px}.vhvideos__modal-caption h3{font-size:18px}}
@media(prefers-reduced-motion:reduce){.vhvideos__card,.vhvideos__poster img,.vhvideos__play,.vhvideos__watch svg,.vhvideos__all,.vhvideos__all svg{transition:none!important}.vhvideos__card:hover,.vhvideos__card:hover .vhvideos__play,.vhvideos__all:hover{transform:none}}