@import "https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&family=Noto+Sans+Arabic:wght@400;500;600;700;800;900&display=swap";
:root{--color-primary:#6a4cff;--color-primary-dark:#4e34d8;--color-primary-light:#8b6fff;--color-primary-soft:#6a4cff14;--color-primary-glow:#6a4cff26;--color-accent:#f59e0b;--color-accent-soft:#f59e0b14;--color-pink:#e0568a;--color-pink-soft:#e0568a14;--color-teal:#00a991;--color-teal-soft:#00a99114;--color-bg:#faf7f0;--color-bg-alt:#f1ece1;--color-surface:#fff;--color-surface-glass:#ffffffb3;--color-card-border:#ded3c266;--color-text:#0f172a;--color-text-secondary:#475569;--color-text-muted:#64748b;--color-text-inverse:#fff;--radius-sm:12px;--radius-md:20px;--radius-lg:32px;--radius-xl:44px;--radius-full:9999px;--font-en:"Outfit", -apple-system, BlinkMacSystemFont, sans-serif;--font-ar:"Noto Sans Arabic", sans-serif;--transition-fast:.15s cubic-bezier(.16, 1, .3, 1);--transition-base:.3s cubic-bezier(.16, 1, .3, 1);--transition-slow:.6s cubic-bezier(.16, 1, .3, 1);--max-width:1200px;--nav-height:80px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-en);color:var(--color-text);background-color:var(--color-bg);min-width:320px;line-height:1.5;overflow-x:hidden}[dir=rtl] body{font-family:var(--font-ar)}a{color:inherit;text-decoration:none}img,svg,video,canvas{max-width:100%}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border:none;min-height:44px}.skipLink{z-index:2000;background:var(--color-text);color:var(--color-text-inverse);border-radius:var(--radius-sm);transition:transform var(--transition-fast);padding:12px 16px;font-weight:800;position:fixed;top:12px;left:12px;transform:translateY(-140%)}.skipLink:focus{transform:translateY(0)}.srOnly{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.container{width:100%;max-width:var(--max-width);margin:0 auto;padding:0 24px}@media (max-width:768px){.container{padding:0 20px}}.section{padding:120px 0;position:relative}@media (max-width:768px){.section{padding:80px 0}}h1,h2,h3,h4{letter-spacing:-.03em;font-weight:800;line-height:1.1}[dir=rtl] h1,[dir=rtl] h2,[dir=rtl] h3,[dir=rtl] h4{letter-spacing:0;line-height:1.25}.eyebrow{text-transform:uppercase;letter-spacing:.08em;color:var(--color-primary);background:var(--color-primary-soft);border-radius:var(--radius-full);margin-bottom:16px;padding:6px 16px;font-size:14px;font-weight:700;display:inline-block}[dir=rtl] .eyebrow{letter-spacing:.02em}.sectionTitle{color:var(--color-text);margin-bottom:16px;font-size:48px;font-weight:900;line-height:1.1}@media (max-width:768px){.sectionTitle{font-size:34px}}.sectionSubtitle{color:var(--color-text-secondary);max-width:600px;font-size:18px;line-height:1.6}.btnPrimary{color:var(--color-text-inverse);background:linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));border-radius:var(--radius-md);transition:transform var(--transition-fast), box-shadow var(--transition-base);cursor:pointer;justify-content:center;align-items:center;gap:10px;padding:16px 36px;font-size:16px;font-weight:700;display:inline-flex;position:relative;overflow:hidden;box-shadow:0 4px 20px #6a4cff40}.btnPrimary:after{content:"";background:linear-gradient(90deg,#fff0 0%,#ffffff4d 50%,#fff0 100%);width:200%;height:100%;transition:none;position:absolute;top:0;left:-50%;transform:skew(-25deg)translate(-100%)}.btnPrimary:hover:after{transition:transform .8s;transform:skew(-25deg)translate(100%)}.btnPrimary:hover{transform:translateY(-3px)scale(1.02);box-shadow:0 8px 30px #6a4cff59}.btnPrimary:active{transform:translateY(-1px)scale(.98)}.btnOutline{color:var(--color-text);background:var(--color-surface);border:1px solid var(--color-card-border);border-radius:var(--radius-md);transition:all var(--transition-base);cursor:pointer;justify-content:center;align-items:center;gap:10px;padding:16px 36px;font-size:16px;font-weight:700;display:inline-flex;box-shadow:0 2px 8px #00000005}.btnOutline:hover{border-color:var(--color-primary);background:var(--color-primary-soft);color:var(--color-primary);transform:translateY(-3px)scale(1.02);box-shadow:0 8px 20px #6a4cff14}.btnOutline:active{transform:translateY(-1px)scale(.98)}.glassCard{background:var(--color-surface-glass);-webkit-backdrop-filter:blur(30px);border-radius:var(--radius-md);transition:all var(--transition-base);border:1px solid #fff9;box-shadow:0 10px 30px -10px #1720330f,inset 0 1px #fffc,inset 0 -1px #00000005}.blurBlob{border-radius:var(--radius-full);filter:blur(120px);opacity:.45;pointer-events:none;z-index:0;animation:20s ease-in-out infinite alternate floatAround;position:absolute}@keyframes floatAround{0%{transform:translate(0)scale(1)}50%{transform:translate(50px,80px)scale(1.15)}to{transform:translate(-20px,40px)scale(.9)}}@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()) and (animation-range:entry){@keyframes reveal-in{0%{opacity:0;transform:translateY(60px)scale(.92)}to{opacity:1;transform:translateY(0)scale(1)}}.scrollReveal{animation:linear both reveal-in;animation-timeline:view();animation-range:entry 10% cover 30%}}}.animate-on-scroll{opacity:0;transition:opacity var(--transition-slow), transform var(--transition-slow);transform:translateY(40px)scale(.96)}.animate-on-scroll.visible{opacity:1;transform:translateY(0)scale(1)}.delay-1{transition-delay:.1s}.delay-2{transition-delay:.2s}.delay-3{transition-delay:.3s}.delay-4{transition-delay:.4s}.bentoGrid{grid-template-columns:repeat(3,1fr);gap:24px;display:grid}.bentoCol2{grid-column:span 2}.bentoCol1{grid-column:span 1}@media (max-width:1024px){.bentoGrid{grid-template-columns:repeat(2,1fr)}.bentoCol2{grid-column:span 2}}@media (max-width:768px){.bentoGrid{grid-template-columns:1fr}.bentoCol2{grid-column:span 1}}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--color-bg)}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--radius-full);border:2px solid var(--color-bg)}::-webkit-scrollbar-thumb:hover{background:var(--color-text-muted)}:focus-visible{outline:3px solid var(--color-primary);outline-offset:3px;border-radius:var(--radius-sm)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
