/* Lightweight bilingual advertising motion, scoped to the home hero. */
#pbHeroCarousel .hero-content{max-width:660px;padding-block:48px}
#pbHeroCarousel .hero-content h1{font-family:Inter,Tajawal,Arial,sans-serif;font-size:clamp(2.2rem,4.3vw,4.4rem);font-weight:800;line-height:1.12;letter-spacing:-.035em;margin:14px 0 20px;text-wrap:balance;overflow-wrap:break-word}
body.pb-ar #pbHeroCarousel .hero-content{direction:rtl;text-align:right}
body.pb-ar #pbHeroCarousel .hero-content h1{font-family:Tajawal,Inter,Arial,sans-serif;font-size:clamp(2.25rem,4.1vw,4.2rem);line-height:1.3;letter-spacing:0}
#pbHeroCarousel .hero-content p{font-size:clamp(.95rem,1.15vw,1.08rem);line-height:1.85;max-width:570px;text-wrap:pretty}
#pbHeroCarousel .hero-content .eyebrow{color:#887025;font-weight:800;letter-spacing:.12em}
body.pb-ar #pbHeroCarousel .hero-content .eyebrow{letter-spacing:0}
#pbHeroCarousel .carousel-item{transition:opacity .85s ease-in-out}
#pbHeroCarousel .pb-ad-ready .hero-content>.eyebrow,
#pbHeroCarousel .pb-ad-ready .hero-content>h1,
#pbHeroCarousel .pb-ad-ready .hero-content>p,
#pbHeroCarousel .pb-ad-ready .hero-content>.d-flex{animation:pb-ad-reveal .7s cubic-bezier(.2,.7,.25,1) both}
#pbHeroCarousel .pb-ad-ready .hero-content>h1{animation-delay:.1s}
#pbHeroCarousel .pb-ad-ready .hero-content>p{animation-delay:.2s}
#pbHeroCarousel .pb-ad-ready .hero-content>.d-flex{animation-delay:.3s}
#pbHeroCarousel .carousel-inner{position:relative;isolation:isolate}
#pbHeroCarousel .carousel-inner::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;background:linear-gradient(110deg,transparent 25%,rgba(199,165,74,.08) 40%,rgba(255,225,148,.32) 50%,rgba(199,165,74,.08) 60%,transparent 75%);transform:translateX(-100%)}
#pbHeroCarousel.pb-gold-transition .carousel-inner::after{animation:pb-gold-pass .85s ease-out both}
#pbHeroCarousel .carousel-control-prev,#pbHeroCarousel .carousel-control-next{z-index:5;width:7%;color:var(--gold,#c7a54a)}
#pbHeroCarousel .carousel-control-prev-icon,#pbHeroCarousel .carousel-control-next-icon{border:1px solid #c7a54a;border-radius:50%;background-color:rgba(65,66,40,.4);background-size:45%;width:40px;height:40px}
@keyframes pb-ad-reveal{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes pb-gold-pass{0%{opacity:0;transform:translateX(-100%)}25%{opacity:1}100%{opacity:0;transform:translateX(100%)}}
@media(max-width:767.98px){
 #pbHeroCarousel .hero-content{max-width:100%;padding:48px 16px 76px}
 #pbHeroCarousel .hero-content h1,body.pb-ar #pbHeroCarousel .hero-content h1{font-size:clamp(1.9rem,7.6vw,3rem);line-height:1.25;letter-spacing:0}
 #pbHeroCarousel .hero-content p{font-size:.95rem;line-height:1.75}
 #pbHeroCarousel .hero-content>.d-flex{gap:10px!important}
 #pbHeroCarousel .hero-content .btn{padding:12px 16px;font-size:.85rem}
 #pbHeroCarousel .carousel-control-prev-icon,#pbHeroCarousel .carousel-control-next-icon{width:30px;height:30px}
}
@media(prefers-reduced-motion:reduce){
 #pbHeroCarousel .carousel-item{transition:none!important}
 #pbHeroCarousel .hero-content>*{animation:none!important}
 #pbHeroCarousel .carousel-inner::after{display:none!important;animation:none!important}
}

/* v2.8.32 — animate the incoming image itself, using Bootstrap transition states. */
#pbHeroCarousel .carousel-item{transition:opacity 1.15s ease-in-out!important}
#pbHeroCarousel .carousel-item-next.carousel-item-start,
#pbHeroCarousel .carousel-item-prev.carousel-item-end{
 opacity:1!important;z-index:2;
 animation:pb-image-gold-reveal 1.15s cubic-bezier(.2,.65,.3,1) both;
}
#pbHeroCarousel .carousel-item-next.carousel-item-start .pb-hero-bg,
#pbHeroCarousel .carousel-item-prev.carousel-item-end .pb-hero-bg{
 animation:pb-image-settle 1.15s cubic-bezier(.2,.65,.3,1) both;
}
#pbHeroCarousel .carousel-item::after{
 content:"";position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;
 background:linear-gradient(100deg,transparent 32%,rgba(151,113,28,.15) 42%,rgba(255,220,125,.85) 49%,rgba(199,165,74,.5) 52%,transparent 65%);
}
#pbHeroCarousel .carousel-item-next.carousel-item-start::after,
#pbHeroCarousel .carousel-item-prev.carousel-item-end::after{
 animation:pb-image-gold-edge 1.15s ease-in-out both;
}
#pbHeroCarousel .carousel-inner::after{display:none!important}
@keyframes pb-image-gold-reveal{
 from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}
}
@keyframes pb-image-settle{from{transform:scale(1.06)}to{transform:scale(1)}}
@keyframes pb-image-gold-edge{
 0%{opacity:0;transform:translateX(-100%)}
 18%{opacity:.9}75%{opacity:.75}
 100%{opacity:0;transform:translateX(100%)}
}
body.pb-ar #pbHeroCarousel .carousel-item-next.carousel-item-start,
body.pb-ar #pbHeroCarousel .carousel-item-prev.carousel-item-end{animation-name:pb-image-gold-reveal-rtl}
@keyframes pb-image-gold-reveal-rtl{from{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0 0 0 0)}}
@media(prefers-reduced-motion:reduce){
 #pbHeroCarousel .carousel-item{transition:none!important;animation:none!important;clip-path:none!important}
 #pbHeroCarousel .carousel-item .pb-hero-bg{animation:none!important}
 #pbHeroCarousel .carousel-item::after{display:none!important;animation:none!important}
}
