/*! vk-hero-decor.css — sublimation photo décor hero. Full-bleed brand band with .vk-wrap
    centered content (matches vk-magic / vk-craft pattern). Class prefix .vkd. Token-driven. */

.vkd-band{position:relative;background:linear-gradient(180deg, var(--vk-deep), var(--vk-ink));color:var(--vk-text);padding:108px 0;font-family:var(--vk-bf);overflow:hidden}
.vkd-band__halo{position:absolute;inset:0;pointer-events:none;background:radial-gradient(58% 52% at 70% 46%, var(--vk-glow), transparent 70%)}
.vkd__grid{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
.vkd__copy{display:flex;flex-direction:column;gap:18px}
.vkd__h{font-family:var(--vk-hf);font-weight:500;font-size:clamp(34px,4.2vw,52px);line-height:1.08;margin:8px 0 0;color:var(--vk-text)}
.vkd__h em{font-style:italic;color:var(--vk-gold)}
.vkd__sub{font-size:17px;line-height:1.6;color:var(--vk-dim);max-width:38ch;margin:0}
.vkd__feat{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--vk-text)}
.vkd__ic{width:32px;height:32px;border-radius:50%;border:1px solid var(--vk-gold);display:flex;align-items:center;justify-content:center;color:var(--vk-gold);flex:none}
.vkd__cta{align-self:flex-start;margin-top:8px}

.vkd__stage{position:relative;display:flex;align-items:center;justify-content:center;min-height:420px}
.vkd__panel{position:relative;width:min(360px,90%);aspect-ratio:9/10;background:var(--vk-panel);border:1px solid var(--vk-gold);border-radius:10px;overflow:hidden;box-shadow:0 22px 54px var(--vk-shadow);animation:vkdBurns 24s ease-in-out infinite}
.vkd__photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(.95) contrast(1.04);animation:vkdBloom 24s ease-in-out infinite}
.vkd__sheen{position:absolute;top:-50%;left:-60%;width:60%;height:200%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);transform:skewX(-18deg);animation:vkdSheen 24s ease-in-out infinite}
.vkd__pulse{position:absolute;inset:0;background:radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--vk-gold) 50%, transparent), transparent 65%);opacity:0;animation:vkdPulse 24s ease-in-out infinite}
.vkd__cap{position:absolute;left:0;right:0;bottom:10px;text-align:center;font-family:var(--vk-hf);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--vk-gold);z-index:3}
.vkd__phone{position:absolute;right:6%;bottom:14%;width:108px;height:212px;background:var(--vk-ink);border:2px solid var(--vk-frame);border-radius:18px;box-shadow:0 18px 40px var(--vk-shadow);transform:rotate(-7deg) translate(0,0);overflow:hidden;animation:vkdPhone 24s ease-in-out infinite}
.vkd__scr{position:absolute;inset:5px;border-radius:13px;background:var(--vk-deep);overflow:hidden}
.vkd__home{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:var(--vk-deep);animation:vkdHome 24s ease-in-out infinite;z-index:2}
.vkd__play{width:34px;height:34px;border-radius:50%;background:color-mix(in srgb, var(--vk-gold) 16%, transparent);border:1px solid var(--vk-gold);color:var(--vk-gold);display:flex;align-items:center;justify-content:center;animation:vkdPlay 2.4s ease-in-out infinite}
.vkd__slide{position:absolute;inset:0;opacity:0}
.vkd__slide img{width:100%;height:100%;object-fit:cover;display:block;transform-origin:50% 55%}
.vkd__slide1{animation:vkdSlide1 24s ease-in-out infinite}
.vkd__slide1 img{animation:vkdKB 24s ease-in-out infinite}
.vkd__slide2{animation:vkdSlide2 24s ease-in-out infinite}
.vkd__slide2 img{animation:vkdKB 24s ease-in-out infinite}
.vkd__slide3{animation:vkdSlide3 24s ease-in-out infinite}
.vkd__slide3 img{animation:vkdKB 24s ease-in-out infinite}
.vkd__slide4{animation:vkdSlide4 24s ease-in-out infinite}
.vkd__slide4 img{animation:vkdKB 24s ease-in-out infinite}
.vkd__slide5{animation:vkdSlide5 24s ease-in-out infinite}
.vkd__slide5 img{animation:vkdKB 24s ease-in-out infinite}
.vkd__slide6{animation:vkdSlide6 24s ease-in-out infinite}
.vkd__slide6 img{animation:vkdKB 24s ease-in-out infinite}
.vkd__scrub{position:absolute;bottom:6px;left:8px;right:8px;height:2px;background:rgba(255,255,255,.18);border-radius:1px;overflow:hidden;animation:vkdScrubBox 24s ease-in-out infinite;z-index:3}
.vkd__scrub::after{content:"";display:block;height:100%;width:0;background:var(--vk-gold);animation:vkdScrubFill 24s ease-in-out infinite}
.vkd__ring{position:absolute;right:18%;bottom:42%;width:24px;height:24px;border-radius:50%;border:1.5px solid var(--vk-gold);opacity:0;animation:vkdRip 24s ease-out infinite}
.vkd__ring.b{animation-delay:.25s}
.vkd__ring.c{animation-delay:.5s}
.vkd__nfc{position:absolute;right:18%;top:18%;color:var(--vk-gold);font-size:20px;opacity:0;animation:vkdNfc 24s ease-in-out infinite}
@keyframes vkdBurns{0%,100%{transform:scale(1)}50%{transform:scale(1.025)}}
@keyframes vkdBloom{0%,8%{filter:grayscale(.95) contrast(1.04)}28%,93%{filter:grayscale(0) contrast(1.05) saturate(1.06)}98%,100%{filter:grayscale(.95) contrast(1.04)}}
@keyframes vkdSheen{0%,12%{left:-60%}28%{left:120%}100%{left:120%}}
@keyframes vkdPulse{0%,42%{opacity:0}45%,50%{opacity:.55}55%,100%{opacity:0}}
@keyframes vkdPhone{0%,18%{transform:rotate(-7deg) translate(0,0)}40%{transform:rotate(-13deg) translate(-92px,-14px)}46%,93%{transform:rotate(-11deg) translate(-92px,-14px)}98%,100%{transform:rotate(-7deg) translate(0,0)}}
@keyframes vkdHome{0%,44%{opacity:1}48%,94%{opacity:0}98%,100%{opacity:1}}
@keyframes vkdPlay{0%,100%{transform:scale(1);box-shadow:0 0 0 0 color-mix(in srgb, var(--vk-gold) 40%, transparent)}50%{transform:scale(1.08);box-shadow:0 0 0 9px transparent}}
@keyframes vkdSlide1{0%,46%{opacity:0}50%,55%{opacity:1}58%,100%{opacity:0}}
@keyframes vkdSlide2{0%,54%{opacity:0}58%,63%{opacity:1}66%,100%{opacity:0}}
@keyframes vkdSlide3{0%,62%{opacity:0}66%,71%{opacity:1}74%,100%{opacity:0}}
@keyframes vkdSlide4{0%,70%{opacity:0}74%,79%{opacity:1}82%,100%{opacity:0}}
@keyframes vkdSlide5{0%,78%{opacity:0}82%,87%{opacity:1}90%,100%{opacity:0}}
@keyframes vkdSlide6{0%,86%{opacity:0}90%,93%{opacity:1}96%,100%{opacity:0}}
@keyframes vkdKB{0%{transform:scale(1)}100%{transform:scale(1.08)}}
@keyframes vkdScrubBox{0%,46%{opacity:0}50%,93%{opacity:.9}97%,100%{opacity:0}}
@keyframes vkdScrubFill{0%,46%{width:0}93%{width:100%}97%,100%{width:0}}
@keyframes vkdRip{0%,42%{transform:scale(.4);opacity:0}46%{opacity:.95;transform:scale(.4)}58%{transform:scale(3.2);opacity:0}100%{transform:scale(3.2);opacity:0}}
@keyframes vkdNfc{0%,38%{opacity:0}43%,50%{opacity:1}55%,100%{opacity:0}}

@media (max-width:880px){
  .vkd-band{padding:72px 0}
  .vkd__grid{grid-template-columns:1fr;gap:48px}
  .vkd__stage{min-height:360px}
}
@media (prefers-reduced-motion: reduce){
  .vkd__panel,.vkd__photo,.vkd__sheen,.vkd__pulse,.vkd__phone,.vkd__home,.vkd__slide,.vkd__slide img,
  .vkd__scrub,.vkd__scrub::after,.vkd__ring,.vkd__nfc,.vkd__play{animation:none!important}
  .vkd__home{opacity:0}.vkd__slide1{opacity:1}.vkd__photo{filter:none}
}
