/* ===== SECTION 02 — Discover On Air ===== */
.od{position:relative;background:transparent;font-family:"IBM Plex Sans Arabic",system-ui,sans-serif;color:#F4D6B0;padding:8px 0 72px}
.od *{box-sizing:border-box}
.od-wrap{max-width:1200px;margin:0 auto;padding:0 20px}

/* الشريط: سكة زجاجية واحدة لكل صف، بدون مربعات */
.od-kicker{display:flex;align-items:center;justify-content:center;gap:14px;margin:0 auto 18px;padding:0 20px;font-size:15px;font-weight:400;color:rgba(244,214,176,.72);text-align:center}
.od-kicker::before,.od-kicker::after{content:"";flex:0 1 64px;height:1px;background:linear-gradient(90deg,transparent,rgba(58,80,107,.9))}
.od-kicker::after{background:linear-gradient(270deg,transparent,rgba(58,80,107,.9))}
.dl{display:flex;flex-direction:column;gap:10px}
.dl-row{position:relative;overflow:hidden;direction:ltr;
  background:linear-gradient(180deg,rgba(28,37,65,.34),rgba(11,19,43,.22));
  border-block:1px solid rgba(58,80,107,.28);
  -webkit-mask:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.dl-row::before{content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent 20%,rgba(91,192,222,.35) 50%,transparent 80%);z-index:1}
.dl-t{display:flex;width:max-content;margin:0;padding:0;list-style:none;animation:dl-run 60s linear infinite;will-change:transform}
.dl-row.rev .dl-t{animation-direction:reverse;animation-duration:70s}
.dl-i{flex:0 0 auto;width:172px;height:86px;display:grid;place-items:center;position:relative}
.dl-i + .dl-i::before{content:"";position:absolute;inset-inline-start:0;top:26%;bottom:26%;width:1px;background:rgba(58,80,107,.35)}
.dl-i img{display:block;width:calc(var(--w,60px)*var(--k,1));height:calc(var(--h,40px)*var(--k,1));max-width:none;max-height:none;object-fit:contain;opacity:.9;
  filter:drop-shadow(0 0 14px rgba(91,192,222,.10));transition:opacity .3s,filter .3s}
.dl-row:hover .dl-i img{opacity:1;filter:drop-shadow(0 0 16px rgba(91,192,222,.18))}
@media (hover:hover) and (pointer:fine){.dl:hover .dl-t{animation-play-state:paused}}
@media (prefers-reduced-motion:reduce){.dl-t{animation:none}}
@keyframes dl-run{to{transform:translateX(-50%)}}

/* العنوان */
.od-head{text-align:center;margin:76px auto 40px;max-width:720px}
.od-h{margin:0;font-weight:700;font-size:clamp(28px,3.4vw,46px);line-height:1.2;color:#F4D6B0}
.od-sub{margin:14px auto 0;font-size:clamp(15px,1.3vw,18px);line-height:1.75;color:rgba(244,214,176,.68)}

/* العوالم الثلاثة: إطارات سينمائية بإيقاع متدرّج */
.od-worlds{display:grid;grid-template-columns:1fr 1.18fr 1fr;gap:18px;align-items:end}
.ow{position:relative;overflow:hidden;border-radius:20px;aspect-ratio:3/4;isolation:isolate;
  border:1px solid rgba(58,80,107,.3);background:#0B132B}
.ow.mid{aspect-ratio:3/4.35}
.ow-img{position:absolute;inset:0;transition:filter .5s}
.ow-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,19,43,.15) 0%,transparent 35%,rgba(5,7,13,.55) 62%,rgba(5,7,13,.92) 100%)}
/* صور مؤقتة لتوضيح المزاج فقط */
.ph-sports{background:radial-gradient(60% 45% at 50% 18%,rgba(220,235,245,.55),transparent 70%),radial-gradient(90% 50% at 50% 100%,#1f4a3a 0%,#0e2a22 60%,#0B132B 100%),#0B132B}
.ph-movies{background:radial-gradient(25% 70% at 50% 0%,rgba(244,214,176,.42),transparent 80%),radial-gradient(70% 40% at 50% 100%,#2a1d24,#0B132B 80%),#0B132B}
.ph-series{background:radial-gradient(40% 35% at 30% 45%,rgba(91,192,222,.4),transparent 75%),radial-gradient(80% 60% at 70% 80%,#1C2541,#05070D 80%)}
.ow-tag{position:absolute;top:14px;inset-inline-start:14px;z-index:3;font-size:11px;padding:4px 10px;border-radius:999px;background:rgba(5,7,13,.55);color:rgba(244,214,176,.6);border:1px dashed rgba(244,214,176,.25)}
.ow-body{position:absolute;inset:auto 0 0 0;z-index:2;padding:24px 24px 26px}
.ow-line{display:block;width:28px;height:2px;border-radius:2px;background:#5BC0DE;opacity:.7;margin-bottom:14px;transition:width .5s}
.ow-t{margin:0;font-size:clamp(22px,2vw,28px);font-weight:700;color:#F4D6B0;line-height:1.2;display:flex;align-items:center;gap:10px}
.ow-d{margin:8px 0 0;font-size:15px;line-height:1.6;color:rgba(244,214,176,.7)}
.live-dot{width:8px;height:8px;border-radius:50%;background:#5BC0DE;box-shadow:0 0 0 0 rgba(91,192,222,.5);animation:pulse 2.4s ease-out infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(91,192,222,.45)}70%{box-shadow:0 0 0 9px rgba(91,192,222,0)}100%{box-shadow:0 0 0 0 rgba(91,192,222,0)}}
@media (prefers-reduced-motion:reduce){.live-dot{animation:none}}
.ph-sports{background:url(https://images.unsplash.com/photo-1706675780107-7c43cc487928?auto=format&fit=crop&w=1400&q=78) center/cover}
.ph-movies{background:url(https://images.unsplash.com/photo-1485095329183-d0797cdc5676?auto=format&fit=crop&w=1400&q=78) center/cover}
.ph-series{background:url(https://images.unsplash.com/photo-1721733258410-35e699661ad6?auto=format&fit=crop&w=1400&q=78) center/cover}
/* تدريج لوني موحّد للثلاث صور */
.ow-img{filter:saturate(.72) contrast(1.06) brightness(.86)}
.ow-img::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(58,80,107,.45),rgba(11,19,43,.25));mix-blend-mode:color;z-index:0}
/* تفاعل: إضاءة خفيفة بدون زوم */
.ow::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;border-radius:inherit;
  background:radial-gradient(70% 40% at 50% 100%,rgba(91,192,222,.16),transparent 70%);opacity:0;transition:opacity .5s}
@media (hover:hover){
  .od-worlds:hover .ow .ow-img{filter:saturate(.6) contrast(1.06) brightness(.62)}
  .od-worlds .ow:hover .ow-img{filter:saturate(.8) contrast(1.06) brightness(.98)}
  .ow:hover::after{opacity:1} .ow:hover .ow-line{width:48px}
  .ow:hover{border-color:rgba(91,192,222,.35)}
}
/* الرابط الهادئ للسكشن 03 */
.od-next{display:flex;justify-content:center;margin-top:40px}
.od-link{display:inline-flex;align-items:center;gap:10px;color:#5BC0DE;font-size:16px;font-weight:600;text-decoration:none;padding:10px 4px;border-bottom:1px solid rgba(91,192,222,.35);transition:border-color .3s,gap .3s}
.od-link:hover{border-color:#5BC0DE;gap:14px}
.od-link svg{width:18px;height:18px}
html[dir=rtl] .od-link svg{transform:scaleX(-1)}
.od-link:focus-visible{outline:2px solid #5BC0DE;outline-offset:4px;border-radius:4px}

@media (max-width:767px){
  .od{padding-bottom:56px}
  .od-kicker{font-size:14px;margin-bottom:14px}
  .dl{gap:8px} .dl-i{width:132px;height:74px;--k:.88}
  .od-head{margin:52px auto 28px}
  .od-worlds{grid-template-columns:1fr;gap:14px}
  .ow,.ow.mid{aspect-ratio:16/10}
  .ow-body{padding:18px 18px 18px}
  .ow-line{margin-bottom:10px}
  .ow-d{font-size:14px;margin-top:6px}
  .od-next{margin-top:30px}
}


/* ===== نيون الكروت: يطلع من تحت على الجنبين ويذوب لين نص الكرت فوق ===== */
.ow{filter:drop-shadow(0 14px 26px rgba(91,192,222,.14))}
.ow-neon{position:absolute;inset:0;z-index:4;border-radius:inherit;padding:1.5px;pointer-events:none;
  background:
    radial-gradient(34% 7% at 50% 0%,rgba(91,192,222,.55),rgba(91,192,222,0) 100%),
    linear-gradient(0deg,#5BC0DE 0%,rgba(91,192,222,.9) 18%,rgba(91,192,222,.42) 48%,rgba(91,192,222,.12) 78%,rgba(91,192,222,.05) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
/* توهج داخلي ناعم من تحت */
.ow-neon::before{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 -26px 34px -24px rgba(91,192,222,.5),inset 0 0 0 1px rgba(91,192,222,.05)}
/* لمعة خفيفة تطلع مع الخط من تحت لفوق ببطء */
.ow-neon::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;
  background:linear-gradient(0deg,rgba(244,214,176,0),rgba(244,214,176,.95),rgba(244,214,176,0)) 0 120%/100% 26% no-repeat;
  -webkit-mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  opacity:.55;animation:owRise 6.5s ease-in-out infinite}
.ow:nth-child(2) .ow-neon::after{animation-delay:-2.2s}.ow:nth-child(3) .ow-neon::after{animation-delay:-4.4s}
@keyframes owRise{0%{background-position:0 130%;opacity:0}12%{opacity:.6}70%{opacity:.25}100%{background-position:0 -40%;opacity:0}}
.ow:hover .ow-neon{filter:brightness(1.25)}
@media (prefers-reduced-motion:reduce){.ow-neon::after{animation:none;opacity:0}}

/* ===== الجوال: الأقسام الثلاثة جنب بعض ===== */
@media (max-width:767px){
  .od-worlds{grid-template-columns:1fr 1.14fr 1fr;gap:8px;align-items:end}
  .ow{aspect-ratio:3/4.7;border-radius:16px}
  .ow.mid{aspect-ratio:3/4.9}
  .ow-body{padding:10px 9px 12px}
  .ow-line{width:18px;margin-bottom:7px}
  .ow-t{font-size:14px;gap:6px}
  .od .ow-d{font-size:10.5px;line-height:1.55;margin-top:4px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .live-dot{width:6px;height:6px}
  .od-head{margin:44px auto 22px}
  .od-next{margin-top:24px}
}
@media (min-width:768px){
  .ow-neon,.ow-neon::after{padding:2px}
  .ow-neon::before{box-shadow:inset 0 -40px 50px -34px rgba(91,192,222,.6),inset 0 0 0 1px rgba(91,192,222,.06)}
  .ow{filter:drop-shadow(0 22px 40px rgba(91,192,222,.18))}
}
/* الشعارات بالكمبيوتر: مقاس أكبر وموزون */
@media (min-width:1024px){.dl-i{width:204px;height:100px;--k:1.24}}
