@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
@font-face{font-family:'Cairo Local';src:url('./fonts/Cairo-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:'Cairo Local';src:url('./fonts/Cairo-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:'Cairo Local';src:url('./fonts/Cairo-Black.ttf') format('truetype');font-weight:900;font-style:normal;font-display:swap}@font-face{font-family:'Tajawal Local';src:url('./fonts/Tajawal-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:'Tajawal Local';src:url('./fonts/Tajawal-Medium.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:'Tajawal Local';src:url('./fonts/Tajawal-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
:root{--color-base-100:#F4F8FC;--color-base-200:#E8F1F9;--color-base-300:#D5E2EE;--color-base-content:#10243A;--color-primary:#1478E8;--color-primary-content:#fff;--color-secondary:#70B7F5;--color-secondary-content:#07213A;--color-accent:#2D91F0;--color-accent-content:#fff;--color-neutral:#0B2945;--color-neutral-content:#F7FBFF;--color-success:#178C7D;--color-warning:#C3953E;--color-error:#C43232;--radius-box:1.4rem;--radius-field:.85rem;--radius-selector:.85rem}
*{box-sizing:border-box}html{scroll-behavior:smooth}html,body,#root{max-width:100%;min-height:100%;overflow-x:hidden}body{margin:0;min-height:100vh;font-family:'Manrope','Inter',ui-sans-serif,system-ui,sans-serif;letter-spacing:-.018em;background:#F4F8FC;color:#10243A}img{display:block;max-width:100%}button,input,select{font:inherit}button,.btn,select,input{touch-action:manipulation}button{cursor:pointer}.btn,.input,.select{min-height:2.75rem}.btn{white-space:normal}.display{font-weight:800;letter-spacing:-.065em;line-height:.96}.section-title{font-size:clamp(2rem,5vw,3rem);font-weight:800;letter-spacing:-.05em;line-height:1.08}.page-title{font-size:clamp(1.85rem,5vw,2.5rem);font-weight:900;letter-spacing:-.045em;line-height:1.15}.eyebrow{font-size:.66rem;font-weight:800;letter-spacing:.19em;text-transform:uppercase}.glass{background:rgba(255,255,255,.82);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.92);box-shadow:0 18px 50px rgba(26,81,127,.14)}.soft-shadow{box-shadow:0 30px 80px rgba(20,76,124,.22)}
.lime-btn{background:linear-gradient(135deg,#1685F2,#0968D2);color:#fff;border:0;box-shadow:0 12px 26px rgba(20,120,232,.25)}.lime-btn:hover{background:linear-gradient(135deg,#2595FF,#075EBE)}.violet-text{color:#1478E8}.plan-basic{border-top:4px solid #70B7F5}.plan-standard{border-top:4px solid #1478E8}.plan-premium{border-top:4px solid #0B2945}.dot-grid{background-image:radial-gradient(#4C9DE4 1.2px,transparent 1.2px);background-size:18px 18px}.hero-stage{background:radial-gradient(circle at 72% 42%,rgba(91,169,242,.29),transparent 34%),linear-gradient(135deg,#F7FBFF 0%,#EAF4FC 52%,#DDEDF9 100%)}.hero-stage:before{content:'COLLABORATE';position:absolute;left:50%;top:42px;transform:translateX(-50%);font-size:clamp(5rem,13vw,12rem);font-weight:800;letter-spacing:-.08em;color:rgba(255,255,255,.65);white-space:nowrap;pointer-events:none}.hero-orb{background:radial-gradient(circle at 38% 28%,#F7FCFF 0,#BFE0FA 42%,#5CAAF0 74%,#1679DD 100%);filter:drop-shadow(0 34px 38px rgba(26,102,170,.22))}.feature-item{border-color:rgba(247,251,255,.1)}.nav-link{color:rgba(16,36,58,.62);min-height:44px}.nav-link.is-active,.nav-link:hover{color:#1478E8}.mobile-nav-link{min-height:48px;border-radius:.75rem;padding:.6rem .8rem;text-align:start}.mobile-nav-link.is-active{background:#e8f1f9;color:#1478E8}.footer-link{min-height:44px;color:rgba(247,251,255,.65)}.footer-link:hover{color:#fff}
/* Motion is opt-in: reveal wrappers are explicitly placed on sections and cards. */
/* Reveal has a CSS fallback so a blocked/unsupported IntersectionObserver never leaves content hidden. */
@keyframes attachedFadeUp{from{opacity:0;transform:translate3d(0,24px,0)}to{opacity:1;transform:translate3d(0,0,0)}}@keyframes attachedFadeIn{from{opacity:0}to{opacity:1}}@keyframes attachedFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-9px,0)}}@keyframes attachedPulse{0%,100%{box-shadow:0 12px 26px rgba(20,120,232,.25)}50%{box-shadow:0 18px 34px rgba(20,120,232,.42)}}
.hero-enter{opacity:0;animation:attachedFadeUp .72s cubic-bezier(.2,.75,.25,1) forwards}.hero-enter-1{animation-delay:.08s}.hero-enter-2{animation-delay:.16s}.hero-enter-3{animation-delay:.27s}.hero-enter-4{animation-delay:.38s}.hero-enter-5{animation-delay:.49s}.hero-image{animation:attachedFadeIn .8s ease both,attachedFloat 5.5s 1s ease-in-out infinite}.hero-profile{animation:attachedFadeUp .7s .45s ease both}.hero-delivered{animation:attachedFadeUp .7s .62s ease both}.hero-match{animation:attachedFadeUp .7s .78s ease both}.hero-enter .lime-btn{animation:attachedPulse 3.4s 1.2s ease-in-out infinite}.reveal{opacity:0;transform:translate3d(0,28px,0);transition:opacity .7s cubic-bezier(.2,.75,.25,1) var(--reveal-delay,0ms),transform .7s cubic-bezier(.2,.75,.25,1) var(--reveal-delay,0ms);animation:attachedFadeUp .72s cubic-bezier(.2,.75,.25,1) var(--reveal-delay,0ms) both}.reveal.is-revealed{opacity:1;transform:translate3d(0,0,0);animation:none}.card-lift{transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;box-shadow:0 8px 28px rgba(18,62,100,.055)}.card-lift:hover{transform:translateY(-6px);border-color:#B6D8F4;box-shadow:0 24px 55px rgba(18,70,115,.13)}a,button{transition:transform .22s ease,box-shadow .22s ease,background-color .22s ease,color .22s ease,border-color .22s ease}a:hover,button:hover{transform:translateY(-2px)}a:active,button:active{transform:translateY(0) scale(.98)}
.arabic-ui{font-family:'Tajawal Local','Tahoma','Arial',sans-serif;letter-spacing:0;line-height:1.8}.arabic-ui button,.arabic-ui input,.arabic-ui select{font-family:'Tajawal Local','Tahoma','Arial',sans-serif}.arabic-ui .display{font-family:'Cairo Local','Tajawal Local','Tahoma',sans-serif;font-weight:900;letter-spacing:-.035em;line-height:1.25}.arabic-ui h1,.arabic-ui h2,.arabic-ui h3{font-family:'Cairo Local','Tajawal Local','Tahoma',sans-serif;font-weight:700;letter-spacing:-.025em;line-height:1.45}.arabic-ui h2{font-weight:900}.arabic-ui .eyebrow{font-weight:600;letter-spacing:.025em;line-height:1.7}.arabic-brand-line p{font-family:'Cairo Local','Tajawal Local',sans-serif;font-size:.9rem;font-weight:700;line-height:1.3;color:#10243A}.arabic-brand-line strong{font-weight:900;color:#1478E8}.arabic-ui .hero-stage:before{content:'تعاون'}
@media(min-width:640px){.feature-item:not(:nth-child(2n)){border-inline-end:1px solid rgba(247,251,255,.1)}}@media(min-width:1024px){.feature-item:not(:last-child){border-inline-end:1px solid rgba(247,251,255,.1)}}
@media(max-width:767px){.hero-stage:before{top:62px;font-size:clamp(3rem,18vw,4.6rem)}.hero-layout{min-height:0}.hero-stats{font-size:.72rem}.hero-stats b{font-size:1.05rem}.hero-profile{font-size:.82rem}.hero-delivered{max-width:195px}.card-lift:hover{transform:none;box-shadow:0 8px 28px rgba(18,62,100,.055)}.dashboard .table th,.dashboard .table td{padding:.7rem .6rem;white-space:nowrap}.modal-box{width:calc(100vw - 1.5rem);max-width:calc(100vw - 1.5rem);padding:1.25rem}.modal-action{flex-wrap:wrap}.modal-action .btn{flex:1;min-width:7rem}.card-body{padding:1.1rem}.directory .input input{font-size:.9rem}.arabic-ui .display{font-size:clamp(2.3rem,11.5vw,4.4rem);line-height:1.35}.arabic-ui .hero-stats{font-size:.69rem}}
@media(max-width:380px){.hero-visual{height:400px!important}.hero-image{height:278px!important}.hero-profile{width:174px}.hero-delivered{bottom:34px;max-width:172px}.hero-match{font-size:.68rem;padding:.45rem .6rem}.hero-stats{gap:.35rem}.hero-stats b{font-size:1rem}.arabic-brand-line{max-width:100%}.new-invitation-label{font-size:.78rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-enter,.hero-image,.hero-profile,.hero-delivered,.hero-match{animation:none;opacity:1;transform:none}.reveal{opacity:1;transform:none;transition:none;animation:none}.card-lift,a,button{transition:none}.card-lift:hover,a:hover,button:hover{transform:none}}

/* Mobile layout guardrails: keep the content column first, make the visual a bounded canvas,
   and ensure every child can shrink instead of widening the document. */
html{scroll-padding-top:var(--header-height,68px)}
.hero-layout,.hero-layout>div,.home main,.directory main,.dashboard main{min-width:0}
@media(max-width:1023px){
 .hero-layout{display:flex;flex-direction:column;align-items:stretch}
 .hero-layout>div:first-child{order:1;width:100%}
 .hero-layout>.hero-visual{order:2;width:100%;max-width:650px}
}
@media(max-width:639px){
 :root{--header-height:68px}
 .hero-layout{gap:1.25rem;padding:2rem 1rem 2.75rem}
 .hero-layout>div:first-child{padding-inline:.125rem}
 .hero-stage:before{opacity:.38;top:32px}
 .hero-stage .display{font-size:clamp(2.25rem,11.5vw,3.25rem);line-height:1.2;overflow-wrap:anywhere}
 .arabic-ui .hero-stage .display{font-size:clamp(2.25rem,11.5vw,3.35rem);line-height:1.35}
 .hero-layout p:not(.eyebrow):not(.arabic-brand-line p){font-size:1rem;line-height:1.85}
 .hero-layout .hero-visual{height:390px;min-height:390px;max-width:100%;overflow:visible}
 .hero-visual .hero-orb{top:24px!important;width:290px!important;height:290px!important}
 .home:not(.arabic-ui) .hero-visual .hero-orb{right:calc(50% - 145px)!important;left:auto!important}
 .arabic-ui .hero-visual .hero-orb{left:calc(50% - 145px)!important;right:auto!important}
 .hero-visual .hero-image{top:42px!important;width:calc(100% - 70px)!important;max-width:none;height:285px!important;border-radius:1.35rem}
 .hero-visual .hero-profile{top:8px!important;width:min(190px,54vw);padding:.7rem;font-size:.78rem}
 .hero-visual .hero-profile img{height:2.5rem;width:2.5rem}
 .hero-visual .hero-delivered{bottom:26px!important;max-width:min(205px,62vw);padding:.72rem;font-size:.78rem}
 .hero-visual .hero-delivered span{font-size:.66rem}
 .hero-visual .hero-delivered b{font-size:.8rem}
 .hero-visual .hero-match{bottom:2px!important;max-width:45%;padding:.55rem .7rem;font-size:.68rem;white-space:nowrap}
 .hero-enter-4{margin-top:1.35rem}
 .hero-enter-4 .btn{min-height:2.9rem;padding-inline:1rem;font-size:.88rem}
 .hero-stats{margin-top:1.65rem;gap:.45rem}
 .hero-stats b{font-size:1.05rem}
 .reveal-section,.directory section,.dashboard>div{min-width:0}
 .directory .reveal-card,.dashboard .reveal-card{min-width:0}
 .directory .input,.directory .select{max-width:100%}
 .directory .card-lift{min-width:0}
 .modal-box{max-height:calc(100dvh - 1rem)}
 .card-body{min-width:0}
 footer{min-width:0}
}
@media(max-width:380px){
 .hero-layout{padding-inline:.75rem}
 .hero-layout .hero-visual{height:370px;min-height:370px}
 .hero-visual .hero-image{height:270px!important;width:calc(100% - 62px)!important}
 .hero-visual .hero-profile{width:min(174px,55vw)}
 .hero-visual .hero-delivered{max-width:58vw;bottom:24px!important}
 .hero-visual .hero-match{font-size:.64rem}
 .hero-enter-4 .btn{padding-inline:.8rem;font-size:.82rem}
 .arabic-ui .hero-stage .display{font-size:clamp(2.15rem,11.5vw,3.1rem)}
}

/* Reliable mobile header, permanent actions, and off-canvas menu */
.mobile-side-menu{animation:menuSlideIn .24s ease-out both;overflow-y:auto;overscroll-behavior:contain}
@keyframes menuSlideIn{from{opacity:0;transform:translateX(var(--menu-start,24px))}to{opacity:1;transform:translateX(0)}}
.mobile-menu-backdrop{border:0;border-radius:0;min-height:0}
body.menu-open{overflow:hidden}
@media(max-width:767px){
 :root{--header-height:121px}
 html{scroll-padding-top:121px}
 .site-header{min-height:121px}
 .home .hero-layout{padding-top:2rem!important}
 .mobile-action-row .btn{font-size:.9rem}
 [dir="ltr"] .mobile-side-menu{--menu-start:-24px}
}
