/* ON AIR TV — SECTION 06 · Try Before You Subscribe · «الشعاع» (معتمد 10/11) */
.otr{position:relative;font-family:"IBM Plex Sans Arabic",system-ui,sans-serif;color:#F4D6B0;padding:0 0 60px}
.otr *{box-sizing:border-box}

/* المشهد: لقطة بروجكتر حقيقية، تذوب بالصفحة من كل الأطراف */
.otr-art{position:relative;height:300px;z-index:0;
  -webkit-mask:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.6) 14%,#000 30%,#000 58%,transparent 100%);mask:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.6) 14%,#000 30%,#000 58%,transparent 100%)}
.otr-fx{position:absolute;inset:0;-webkit-mask:linear-gradient(90deg,transparent 0%,#000 14%,#000 86%,transparent 100%);mask:linear-gradient(90deg,transparent 0%,#000 14%,#000 86%,transparent 100%)}
.otr-img{position:absolute;inset:0;background:url(images/bg-cinema.webp) 22% 50%/cover no-repeat;
  filter:saturate(.45) contrast(1.15) brightness(.78);opacity:.88}
/* تدريج لوني بهويتنا: ظلال كحلي + ضوء سماوي */
.otr-grade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,19,43,.55),rgba(28,37,65,.15) 55%,rgba(91,192,222,.08));mix-blend-mode:multiply}
.otr-tint{position:absolute;inset:0;background:linear-gradient(100deg,rgba(58,80,107,.55),rgba(91,192,222,.35));mix-blend-mode:color}
.otr-haze{position:absolute;inset:0;background:radial-gradient(45% 55% at 62% 46%,rgba(91,192,222,.22),transparent 70%);mix-blend-mode:screen}
/* حبيبات فيلم خفيفة */
.otr-grain{position:absolute;inset:0;opacity:.13;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
html[dir=ltr] .otr-art{transform:scaleX(-1)}

/* النص */
.otr-copy{position:relative;z-index:1;margin:-70px auto 0;padding:0 22px;max-width:620px;text-align:center}
.otr-h{margin:0;font-weight:700;line-height:1.12;letter-spacing:-.01em;font-size:38px;color:#F4D6B0}
.otr-h .l2{display:block;background:linear-gradient(90deg,#F4D6B0 0%,#BFE6F2 55%,#5BC0DE 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
html[dir=rtl] .otr-h .l2{background:linear-gradient(270deg,#F4D6B0 0%,#BFE6F2 55%,#5BC0DE 100%);-webkit-background-clip:text;background-clip:text}
.otr-rule{display:block;width:44px;height:2px;margin:20px auto 0;border-radius:2px;background:#5BC0DE;box-shadow:0 0 12px rgba(91,192,222,.8)}
.otr-sub{margin:18px auto 0;max-width:30em;font-size:15.5px;line-height:1.85;color:rgba(244,214,176,.76)}

/* زر طلب التجربة: كريمي صلب + دائرة تشغيل سماوية (بدون أورنج، بدون ربط حالياً) */
.otr-btn{display:inline-flex;align-items:center;gap:14px;margin-top:28px;height:56px;padding-inline:8px 26px;border:0;border-radius:999px;cursor:pointer;
  font:inherit;font-size:16px;font-weight:700;color:#05070D;background:linear-gradient(180deg,#F8E2C4,#F4D6B0);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 18px 34px -16px rgba(0,0,0,.95),0 0 0 1px rgba(244,214,176,.25);transition:box-shadow .35s,transform .35s}
.otr-btn i{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#0B132B;color:#5BC0DE;box-shadow:0 0 0 1px rgba(91,192,222,.45)}
.otr-btn i svg{width:14px;height:14px;margin-left:2px}
.otr-btn:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 22px 40px -16px rgba(0,0,0,.95),0 0 34px -4px rgba(91,192,222,.55)}
.otr-btn:focus-visible{outline:2px solid #5BC0DE;outline-offset:4px}

/* حركة مرة وحدة: الشعاع يقوى والنص يطلع */
.otr.anim .otr-haze{opacity:0}
.otr.anim .otr-copy > *{opacity:0;transform:translateY(14px)}
.otr.anim.in .otr-haze{opacity:1;transition:opacity 1.4s ease}
.otr.anim.in .otr-copy > *{opacity:1;transform:none;transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.otr.anim.in .otr-copy > :nth-child(2){transition-delay:.12s}.otr.anim.in .otr-copy > :nth-child(3){transition-delay:.22s}.otr.anim.in .otr-copy > :nth-child(4){transition-delay:.32s}
@media (prefers-reduced-motion:reduce){.otr.anim .otr-haze,.otr.anim .otr-copy > *{opacity:1;transform:none;transition:none}}

/* الكمبيوتر: المشهد بعرض الصفحة والنص داخل الشعاع */
@media (min-width:1024px){
  .otr{padding:0;min-height:640px;display:flex;align-items:center}
  .otr-art{position:absolute;inset:-90px 0 -140px 0;height:auto;
    -webkit-mask:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.55) 14%,#000 28%,#000 66%,transparent 92%);mask:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.55) 14%,#000 28%,#000 66%,transparent 92%)}
  .otr-fx{-webkit-mask:linear-gradient(90deg,transparent 0%,#000 18%,#000 100%);mask:linear-gradient(90deg,transparent 0%,#000 18%,#000 100%)}
  .otr-img{background-position:18% 50%}
  .otr-copy{margin:0;margin-inline-start:max(6vw,calc((100% - 1200px)/2 + 24px));max-width:560px;text-align:start;padding:120px 0}
  .otr-h{font-size:66px}
  .otr-rule{margin-inline:0;margin-top:26px}
  .otr-sub{margin-inline:0;font-size:18.5px}
  .otr-btn{height:60px;font-size:17px;margin-top:34px}
  /* ظل جانبي تحت النص عشان يقرأ بوضوح */
  .otr::after{content:"";position:absolute;z-index:0;inset:0;pointer-events:none;-webkit-mask:linear-gradient(180deg,transparent 0%,#000 25%,#000 70%,transparent 100%);mask:linear-gradient(180deg,transparent 0%,#000 25%,#000 70%,transparent 100%);background:linear-gradient(270deg,rgba(5,7,13,.78) 0%,rgba(5,7,13,.45) 34%,transparent 58%)}
  html[dir=ltr] .otr::after{background:linear-gradient(90deg,rgba(5,7,13,.78) 0%,rgba(5,7,13,.45) 34%,transparent 58%)}
}
