/* Homepage banner (Nov 2026): one-bar header over a light animated background.
   Loaded only by / and /ar/ */
.site-header{position:absolute;left:0;right:0;top:0;background:transparent;border-bottom:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.hero{min-height:100vh;min-height:100svh;display:flex;align-items:center;padding:130px 0 100px;background:linear-gradient(180deg,#fbfbfc 0%,#f4f5f6 100%)}
.hero::before{opacity:.5;animation:hDots 40s linear infinite}
.hero .hero-grid{position:relative;z-index:2;width:100%}
.hero .eyebrow{color:#7c032e}
/* background layers */
.hbg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.hbg .blob{position:absolute;border-radius:50%;filter:blur(60px)}
.hbg .b1{width:520px;height:520px;inset-inline-start:-160px;bottom:-200px;background:rgba(124,3,46,.16);animation:hDrift1 18s ease-in-out infinite alternate}
.hbg .b2{width:560px;height:560px;inset-inline-end:-180px;top:-220px;background:rgba(81,88,95,.16);animation:hDrift2 22s ease-in-out infinite alternate}
.hbg .b3{width:300px;height:300px;inset-inline-start:42%;top:55%;background:rgba(124,3,46,.08);animation:hDrift1 26s ease-in-out -6s infinite alternate}
.hbg .ring{position:absolute;top:50%;border-radius:50%;border:1.5px solid rgba(81,88,95,.13)}
.hbg .r1{width:760px;height:760px;inset-inline-end:-200px;margin-top:-380px;animation:hSpin 70s linear infinite}
.hbg .r2{width:1040px;height:1040px;inset-inline-end:-340px;margin-top:-520px;border-color:rgba(124,3,46,.10);border-style:dashed;animation:hSpin 120s linear reverse infinite}
.hbg .ring::after{content:"";position:absolute;top:-6px;left:50%;width:11px;height:11px;margin-left:-5px;border-radius:50%;background:#7c032e;box-shadow:0 0 0 6px rgba(124,3,46,.12)}
.hbg .r2::after{background:#51585f;box-shadow:0 0 0 6px rgba(81,88,95,.12)}
.hbg svg{position:absolute;inset:0;width:100%;height:100%;opacity:.55}
.hbg line{stroke:#51585f;stroke-opacity:.22;stroke-width:1;stroke-dasharray:3 7;animation:hDash 3s linear infinite}
.hbg line.m{stroke:#7c032e;stroke-opacity:.28}
.hbg circle{fill:#51585f;opacity:.35;animation:hTwinkle 4s ease-in-out infinite}
.hbg circle.m{fill:#7c032e;opacity:.5}
.hbg circle:nth-child(3n){animation-delay:-1.3s}
.hbg circle:nth-child(3n+1){animation-delay:-2.6s}
/* social icons (left edge) */
.hsoc{position:absolute;inset-inline-start:26px;top:50%;transform:translateY(-50%);z-index:3;display:flex;flex-direction:column;align-items:center;gap:14px}
.hsoc::before{content:"";width:2px;height:56px;background:linear-gradient(rgba(124,3,46,0),#7c032e);margin-bottom:6px}
.hsoc a{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1.5px solid #dfe2e6;color:#51585f;box-shadow:0 6px 18px rgba(29,32,36,.08);opacity:0;animation:hSocIn .7s cubic-bezier(.34,1.56,.64,1) forwards,hBob 4s ease-in-out infinite;transition:background .25s,color .25s,border-color .25s,box-shadow .25s}
.hsoc a:nth-of-type(1){animation-delay:.3s,1.1s}
.hsoc a:nth-of-type(2){animation-delay:.45s,1.6s}
.hsoc a:nth-of-type(3){animation-delay:.6s,2.1s}
.hsoc a:nth-of-type(4){animation-delay:.75s,2.6s}
.hsoc svg{width:21px;height:21px;fill:currentColor;transition:transform .45s cubic-bezier(.34,1.56,.64,1)}
.hsoc a:hover,.hsoc a:focus-visible{background:#7c032e;border-color:#7c032e;color:#fff;box-shadow:0 10px 24px rgba(124,3,46,.35);animation-play-state:paused}
.hsoc a:hover svg{transform:rotate(360deg) scale(1.1)}
.hsoc span{writing-mode:vertical-rl;transform:rotate(180deg);font-size:.8rem;font-weight:600;letter-spacing:.18em;color:#51585f;margin-top:8px}
.hscroll{position:absolute;left:50%;bottom:0;z-index:3;display:flex;flex-direction:column;align-items:center}
.hscroll i{width:9px;height:9px;border-radius:50%;background:#7c032e;animation:hBob2 2s ease-in-out infinite}
.hscroll b{width:2px;height:60px;background:linear-gradient(#7c032e,rgba(124,3,46,0))}
@keyframes hDots{to{background-position:260px 130px}}
@keyframes hDrift1{to{transform:translate(120px,-90px) scale(1.15)}}
@keyframes hDrift2{to{transform:translate(-110px,100px) scale(1.1)}}
@keyframes hSpin{to{transform:rotate(360deg)}}
@keyframes hDash{to{stroke-dashoffset:-20}}
@keyframes hTwinkle{50%{opacity:.08}}
@keyframes hSocIn{from{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:none}}
@keyframes hBob{0%,100%{translate:0 0}50%{translate:0 -4px}}
@keyframes hBob2{50%{transform:translateY(8px)}}
@media(max-width:1200px){.hsoc{inset-inline-start:12px}.hsoc a{width:40px;height:40px}.hsoc svg{width:18px;height:18px}}
@media(max-width:900px){
 .hero{min-height:0;padding:100px 0 80px}
 .hero .hero-grid{display:flex;flex-direction:column;gap:6px}
 .hero .hero-art{order:-1;width:100%;max-width:300px;margin:-6px auto 4px}
 .hero .hero-art svg{max-width:300px}
 .hbg .r1{width:460px;height:460px;inset-inline-end:-220px;margin-top:-230px}
 .hbg .r2,.hsoc{display:none}
}
@media(prefers-reduced-motion:reduce){.hbg *,.hero::before,.hsoc a,.hscroll i{animation:none!important;opacity:1}}