/* ============================================================
   قسم فيديوهات يوتيوب القصيرة — ملف مستقل لتجنب كاش Firebase
   ============================================================ */
.video-showcase{background:var(--espresso);color:var(--paper);overflow:hidden}
.video-showcase .sec-title{color:var(--paper)}
.video-showcase .sec-sub{color:rgba(255,255,255,.68)}
.video-showcase .eyebrow{color:var(--honey)}
.short-videos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.short-video{min-width:0}
.short-video__player{
  position:relative;display:block;width:100%;aspect-ratio:9/16;padding:0;border:1px solid rgba(227,189,125,.25);
  border-radius:var(--r-lg);overflow:hidden;background:#120e0a;cursor:pointer;box-shadow:0 20px 45px rgba(0,0,0,.28);
  isolation:isolate;transition:transform .35s var(--ease),border-color .35s var(--ease),box-shadow .35s var(--ease)
}
.short-video__player:hover{transform:translateY(-5px);border-color:rgba(227,189,125,.7);box-shadow:0 26px 58px rgba(0,0,0,.4)}
.short-video__player img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;transition:transform .6s var(--ease),filter .35s var(--ease)}
.short-video__player:hover img{transform:scale(1.045);filter:saturate(1.06)}
.short-video__shade{position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(18,14,10,.75),transparent 48%,rgba(18,14,10,.12))}
.short-video__play{
  position:absolute;z-index:2;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:70px;height:70px;border-radius:50%;
  display:grid;place-items:center;color:var(--espresso);background:linear-gradient(135deg,var(--honey),var(--brass));
  box-shadow:0 12px 30px rgba(0,0,0,.35);transition:transform .3s var(--ease),box-shadow .3s var(--ease)
}
.short-video__play svg{width:31px;height:31px;margin-inline-start:3px}
.short-video__player:hover .short-video__play{transform:translate(-50%,-50%) scale(1.08);box-shadow:0 16px 38px rgba(0,0,0,.46)}
.short-video__hint{position:absolute;z-index:2;inset-inline:14px;inset-block-end:15px;color:#fff;font-family:var(--f-kufi);font-size:.9rem;font-weight:700;text-align:center}
.short-video__embed-wrap{position:relative;width:100%;aspect-ratio:9/16;border-radius:var(--r-lg);overflow:hidden;background:#000;box-shadow:0 20px 45px rgba(0,0,0,.28)}
.short-video__embed{display:block;width:100%;height:100%;border:1px solid rgba(227,189,125,.6);border-radius:inherit;background:#000}
.short-video__external{position:absolute;z-index:3;inset-inline:12px;inset-block-end:12px;padding:8px 10px;border-radius:10px;background:rgba(0,0,0,.72);color:#fff;text-align:center;font-family:var(--f-kufi);font-size:.75rem;text-decoration:none;opacity:0;pointer-events:none;transition:opacity .25s ease}
.short-video__embed-wrap:hover .short-video__external,.short-video__external:focus-visible{opacity:1;pointer-events:auto}

@media (max-width:1024px){.short-videos{grid-template-columns:repeat(2,minmax(0,1fr));max-width:680px;margin-inline:auto}}
@media (max-width:560px){
  .short-videos{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .short-video__player,.short-video__embed-wrap{border-radius:16px}
  .short-video__play{width:54px;height:54px}
  .short-video__play svg{width:25px;height:25px}
  .short-video__hint{font-size:.75rem;inset-inline:8px;inset-block-end:10px}
  .short-video__external{opacity:1;pointer-events:auto;font-size:.68rem;padding:6px 8px}
}
