/* ======================================================================== video atlas (web/js/videos.js) */
.vbanner{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.4fr) auto;align-items:center;gap:24px;width:100%;margin:6px 0 26px;padding:18px 22px;border-radius:24px;
  background:radial-gradient(900px 300px at 15% -40%,rgba(214,180,106,.35),transparent 60%),linear-gradient(120deg,#0b1220,#13243a 60%,#0e1a2b);color:#fff;box-shadow:var(--shadow-lg);overflow:hidden;position:relative;isolation:isolate}
.vbanner::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent);transform:translateX(-100%);transition:transform .9s ease;z-index:-1}
.vbanner:hover::after{transform:translateX(100%)}
.vbanner:focus-visible{outline:3px solid var(--gold)}
.vb-art{display:flex;height:96px;gap:6px;-webkit-mask-image:linear-gradient(90deg,#000 70%,transparent);mask-image:linear-gradient(90deg,#000 70%,transparent)}
[dir="rtl"] .vb-art{-webkit-mask-image:linear-gradient(270deg,#000 70%,transparent);mask-image:linear-gradient(270deg,#000 70%,transparent)}
.vb-art img{height:100%;aspect-ratio:1;object-fit:cover;border-radius:12px;filter:saturate(.6) contrast(1.15);opacity:.9;transition:transform .4s}
.vbanner:hover .vb-art img{transform:translateY(-3px)}
.vb-art img:nth-child(2n){margin-top:10px}
.vb-tx{display:flex;flex-direction:column;gap:4px}
.vb-tx .eyebrow{color:var(--gold-2)}
.vb-tx b{font:400 30px/1.05 var(--f-disp);letter-spacing:-.01em}
.vb-tx small{color:rgba(255,255,255,.72);font-size:14px;line-height:1.45;max-width:52ch}
.vb-go{background:linear-gradient(180deg,#f1dfb2,#d6b46a);color:#1b1407;font-weight:700;border-radius:12px;padding:10px 16px;white-space:nowrap}
.tile .img.vposter{filter:saturate(.7) contrast(1.1);background-color:#000;background-position:center 35%}
.tile .meta .vmeta{background:var(--navy);color:var(--gold-2)}
.dtabs .vtab-n{font:700 11px var(--f-ui);background:var(--gold);color:#1b1407;border-radius:999px;padding:1px 7px;margin-inline-start:4px}

.vatlas{--vbg:#070b11;display:grid;gap:18px}
.vhero{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;flex-wrap:wrap;padding:20px 22px;border-radius:20px;color:#fff;
  background:radial-gradient(700px 240px at 100% 0,rgba(79,184,208,.22),transparent 60%),linear-gradient(135deg,#0b1220,#152a44)}
.vhero.big{padding:28px 26px}
.vhero .eyebrow{color:var(--gold-2)}
.vhero h3{font:400 28px/1.1 var(--f-disp);margin:6px 0 6px;color:#fff}
.vhero.big h3{font-size:36px}
.vhero p{margin:0;color:rgba(255,255,255,.75);max-width:62ch;font-size:14.5px}
.vsearch{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:8px 12px;min-width:min(320px,100%)}
.vsearch svg{width:18px;height:18px;opacity:.8;flex:none}
.vsearch input{all:unset;flex:1;color:#fff;font:15px var(--f-ui);min-width:0}
.vsearch input::placeholder{color:rgba(255,255,255,.55)}
.vchips{display:flex;gap:8px;flex-wrap:wrap}
.vchips button{border:1px solid var(--line);background:var(--surface);color:var(--ink-2);border-radius:999px;padding:6px 12px;font:600 13px var(--f-ui);cursor:pointer;transition:all .15s}
.vchips button b{font-weight:700;color:var(--ink-3);margin-inline-start:2px}
.vchips button:hover{border-color:var(--gold)}
.vchips button[aria-pressed="true"]{background:var(--navy);color:#fff;border-color:var(--navy)}
.vchips button[aria-pressed="true"] b{color:var(--gold-2)}
.vsec{display:grid;gap:12px}
.vsec[hidden],.vdis[hidden]{display:none}
.vsec-h{display:flex;align-items:baseline;gap:12px;border-bottom:1px solid var(--line);padding-bottom:6px;flex-wrap:wrap}
.vsec-h h4{font:500 21px var(--f-disp);margin:0}
.vsec-h span{color:var(--ink-3);font-size:13px}
.vdis{display:grid;gap:16px;padding-top:10px}
.vdis-h{display:flex;justify-content:space-between;align-items:center;gap:12px;border-inline-start:6px solid var(--c);padding-inline-start:12px;flex-wrap:wrap}
.vdis-h h3{font:400 28px var(--f-disp);margin:0}
.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
.vcard{all:unset;box-sizing:border-box;cursor:pointer;position:relative;display:block;border-radius:16px;overflow:hidden;background:var(--vbg);aspect-ratio:4/5;box-shadow:0 1px 2px rgba(0,0,0,.25),0 14px 30px -18px rgba(0,0,0,.6);
  transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s;animation:vin .45s both;animation-delay:var(--d,0ms)}
@keyframes vin{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
.vcard:hover,.vcard:focus-visible{transform:translateY(-4px);box-shadow:0 0 0 2px var(--gold),0 22px 40px -18px rgba(0,0,0,.7)}
.vcard[hidden]{display:none}
.vmedia{position:absolute;inset:0}
.vmedia img,.vmedia video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.vmedia img{filter:saturate(.75) contrast(1.08)}
.vcard:hover .vmedia img{transform:scale(1.04)}
.vmedia video{z-index:1;animation:vfade .35s both}
@keyframes vfade{from{opacity:0}to{opacity:1}}
.vmedia::after{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(0,0,0,.55) 0,transparent 26%,transparent 46%,rgba(4,8,14,.94) 100%)}
.vplay{position:absolute;z-index:3;top:46%;left:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:rgba(255,255,255,.18);backdrop-filter:blur(6px);display:grid;place-items:center;transition:all .25s}
.vplay svg{width:20px;fill:#fff;margin-left:3px}
.vcard:hover .vplay{opacity:0;transform:scale(.8)}
.vtop{position:absolute;z-index:3;top:10px;inset-inline:10px;display:flex;gap:6px;align-items:center}
.vnum{font:700 12px var(--f-mono);color:#fff;background:rgba(0,0,0,.45);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.18);border-radius:8px;padding:2px 7px}
.vviews{display:inline-flex;align-items:center;gap:4px;font:700 12px var(--f-ui);color:var(--gold-2);background:rgba(0,0,0,.45);backdrop-filter:blur(6px);border-radius:8px;padding:2px 7px;margin-inline-start:auto}
.vviews svg{width:13px;height:13px}
.vquiz{font:700 11px var(--f-ui);color:#1b1407;background:var(--gold-2);border-radius:8px;padding:2px 7px}
.vcap{position:absolute;z-index:3;inset-inline:12px;bottom:11px;color:#fff;font:600 13.5px/1.4 var(--f-ui);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-shadow:0 1px 8px rgba(0,0,0,.6)}

body.vt-open{overflow:hidden}
.vtheatre{position:fixed;inset:0;z-index:120;display:grid;grid-template-columns:minmax(0,1fr) 360px;color:#fff;animation:vfade .25s both}
.vt-bg{position:absolute;inset:0;background:rgba(3,6,10,.93);backdrop-filter:blur(10px)}
.vt-stage{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px;min-width:0}
.vt-screen{position:relative;border-radius:18px;overflow:hidden;background:#000;box-shadow:0 30px 80px -20px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.08)}
.vt-screen video{display:block;max-height:calc(100vh - 150px);max-width:100%;cursor:pointer}
.vt-hud{position:absolute;top:12px;left:12px;right:12px;display:flex;justify-content:space-between;pointer-events:none}
.vt-hud span{font:700 13px var(--f-mono);background:rgba(0,0,0,.5);border-radius:8px;padding:3px 9px}
.vt-ctl{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:8px 10px;flex-wrap:wrap;justify-content:center}
.vt-ctl button{all:unset;cursor:pointer;width:38px;height:38px;border-radius:10px;display:grid;place-items:center;color:#fff;transition:background .15s}
.vt-ctl button:hover{background:rgba(255,255,255,.12)}
.vt-ctl button svg{width:20px;height:20px;fill:currentColor}
.vt-ctl button[data-vt="prev"] svg,.vt-ctl button[data-vt="next"] svg{fill:none}
.vt-ctl button.big{width:48px;height:48px;background:linear-gradient(180deg,#f1dfb2,#d6b46a);color:#1b1407}
.vt-sp{display:flex;gap:2px;margin-left:8px;background:rgba(0,0,0,.3);border-radius:10px;padding:3px}
.vt-sp button{width:auto;height:30px;padding:0 9px;font:700 12px var(--f-ui);border-radius:8px}
.vt-sp button[aria-pressed="true"]{background:#fff;color:#0b1220}
.vt-count{font:600 12px var(--f-mono);color:rgba(255,255,255,.6);margin-left:8px}
.vt-side{position:relative;background:linear-gradient(180deg,#0e1726,#0a111c);border-inline-start:1px solid rgba(255,255,255,.08);padding:22px 20px;overflow:auto;display:flex;flex-direction:column;gap:10px}
.vt-side .eyebrow{color:var(--gold-2)}
.vt-side h3{font:400 24px/1.25 var(--f-disp);margin:0;padding-inline-end:34px;color:#fff}
.vt-en{color:rgba(255,255,255,.55);font-size:13px;margin:0}
.vt-note{background:rgba(214,180,106,.12);border:1px solid rgba(214,180,106,.35);border-radius:12px;padding:10px;font-size:13.5px;margin:0}
.vt-x{all:unset;cursor:pointer;position:absolute;top:16px;inset-inline-end:16px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.08)}
.vt-x:hover{background:rgba(255,255,255,.16)}
.vt-x svg{width:18px}
.vt-label{font:700 11px var(--f-ui);letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-top:10px}
.vt-strip{display:grid;grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:8px}
.vt-strip button{all:unset;cursor:pointer;position:relative;border-radius:10px;overflow:hidden;aspect-ratio:1;outline:2px solid transparent;outline-offset:-2px;opacity:.6;transition:all .15s}
.vt-strip button:hover{opacity:.9}
.vt-strip button[aria-pressed="true"]{outline-color:var(--gold-2);opacity:1}
.vt-strip img{width:100%;height:100%;object-fit:cover}
.vt-strip span{position:absolute;bottom:4px;inset-inline-start:6px;font:700 11px var(--f-mono);background:rgba(0,0,0,.6);border-radius:6px;padding:0 5px}
.vt-next{display:grid;gap:6px}
.vt-next button{all:unset;cursor:pointer;display:grid;grid-template-columns:64px 1fr;gap:10px;align-items:center;border-radius:12px;padding:6px;transition:background .15s}
.vt-next button:hover{background:rgba(255,255,255,.07)}
.vt-next img{width:64px;height:64px;object-fit:cover;border-radius:10px}
.vt-next span{font-size:13px;line-height:1.4;color:rgba(255,255,255,.85);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.vt-next b{font:700 11px var(--f-mono);color:var(--gold-2);margin-inline-end:6px}
.vt-keys{margin-top:auto;font-size:12px;color:rgba(255,255,255,.45);padding-top:14px}
@media (max-width:900px){
  .vtheatre{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow:auto}
  .vt-stage{padding:14px 10px 8px}
  .vt-screen video{max-height:58vh}
  .vt-side{border:0}
  .vt-keys{display:none}
  .vbanner{grid-template-columns:1fr;gap:14px}
  .vb-art{height:70px}
  .vgrid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
  .vhero h3,.vhero.big h3{font-size:26px}
}
html[lang="fa"] .vatlas .eyebrow,html[lang="fa"] .vt-side .eyebrow,html[lang="fa"] .vbanner .eyebrow{text-transform:none;letter-spacing:0}
.prose h4.step-h{margin-top:28px;padding-top:18px;border-top:1px solid var(--line)}
.vloops .cinegrid{margin:0}
.vloops figure[hidden]{display:none}
.vt-next video{width:64px;height:64px;object-fit:cover;border-radius:10px;pointer-events:none}
.vmedia video:not(.vhover){pointer-events:none}
.vt-hud span:empty{display:none}
