@font-face{font-family:Tajawal;src:url('/showcases/ba-center-20261111/assets/tajawal-400.ttf') format('truetype');font-weight:400;font-display:swap}@font-face{font-family:Tajawal;src:url('/showcases/ba-center-20261111/assets/tajawal-700.ttf') format('truetype');font-weight:700;font-display:swap}
:root{--paper:#faf9f4;--ink:#152d3d;--muted:#586773;--accent:#175bdf;--soft:#eef1e9;--line:#dce2df;--card:#fff;--radius:24px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font:18px/1.75 Tajawal,Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a,input,select,textarea,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:5px}img{max-width:100%;height:auto;display:block}button{cursor:pointer}p,h1,h2,h3{margin:0}p{color:var(--muted)}h1,h2,h3{line-height:1.2}h1{font-size:clamp(45px,5.6vw,78px);letter-spacing:-1.6px}h2{font-size:clamp(32px,4vw,53px);letter-spacing:-.9px}h3{font-size:25px}em{font-style:normal;color:var(--accent)}.wrap{width:min(1200px,calc(100% - 72px));margin:auto}.skip{position:absolute;top:-100px}.skip:focus{top:10px;z-index:100;background:#fff;padding:10px}.top{border-bottom:1px solid var(--line);background:var(--paper);position:sticky;top:0;z-index:30}.nav{height:90px;display:flex;align-items:center;gap:32px}.agency-brand{display:flex;align-items:center;gap:12px;margin-left:auto;font:700 25px/1.05 Arial,sans-serif;direction:ltr;white-space:nowrap}.agency-brand small{font:400 11px/1.4 Tajawal,sans-serif;letter-spacing:1px;display:block;margin-top:6px}.brand-icon{display:grid;place-items:center;width:45px;height:45px;background:var(--accent);color:white;border-radius:13px;font-size:31px}.navlinks{display:flex;gap:25px;font-size:15px;font-weight:700}.navlinks a:hover,.textlink:hover{color:var(--accent)}.button{display:inline-flex;align-items:center;justify-content:center;gap:14px;border:1px solid var(--accent);border-radius:12px;padding:14px 24px;background:var(--accent);color:white;font-size:17px;font-weight:700;line-height:1.4;transition:transform .2s,box-shadow .2s}.button:hover{transform:translateY(-2px);box-shadow:0 7px 24px #10243a18}.button.outline{background:transparent;color:var(--ink);border-color:var(--line)}.button.small{font-size:15px;padding:12px 18px}.menutoggle{display:none;background:transparent;border:1px solid var(--line);border-radius:10px;padding:7px 12px;color:var(--ink)}.hero{overflow:clip;padding:86px 0 72px;display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;min-height:690px}.eyebrow{display:block;color:var(--accent);font-size:14px;font-weight:700;letter-spacing:1px;margin-bottom:20px}.hero .lead{font-size:21px;line-height:1.9;margin-top:25px;max-width:550px}.actions{display:flex;gap:16px;flex-wrap:wrap;align-items:center;margin-top:30px}.textlink{font-weight:700;font-size:16px;display:inline-block}.hero-tags{display:flex;gap:9px;flex-wrap:wrap;margin-top:32px;font-size:13px;color:var(--muted)}.hero-tags span{border:1px solid var(--line);padding:5px 12px;border-radius:50px}.hero-scene{position:relative;perspective:1000px;padding:30px 0 40px;isolation:isolate}.scene-orbit{position:absolute;inset:-12px;border-radius:50%;border:1px dashed #acb8aa;z-index:-1;animation:orbit 80s linear infinite}.scene-orbit:after{content:'';position:absolute;top:20%;left:5%;width:17px;height:17px;background:#b9d76f;border-radius:50%;box-shadow:0 0 0 9px #b9d76f22}.academy-window{background:white;border-radius:20px;border:1px solid #dbe1e3;box-shadow:0 30px 80px #203d3e1a;transform:rotate(-3deg);overflow:hidden}.window-top{padding:15px 20px;display:flex;gap:5px;align-items:center;border-bottom:1px solid var(--line);font-size:11px;color:#64717a;direction:ltr}.window-top i{width:7px;height:7px;border-radius:50%;background:#ccd2d7}.window-top span{margin:auto}.course-demo{padding:25px;direction:rtl}.course-banner{min-height:195px;border-radius:13px;background:#193e38;color:#fff;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:30px}.course-banner:after{content:'';position:absolute;width:180px;height:180px;border:28px solid #c4d779;left:-60px;bottom:-70px;border-radius:50%;transform:rotate(20deg)}.course-banner small{color:#d6e0bd;font-size:12px}.course-banner strong{font-size:29px;max-width:240px;line-height:1.4;z-index:1}.play-symbol{font-family:Arial;border:1px solid #ffffff70;border-radius:100%;display:grid;place-items:center;width:42px;height:42px;margin-top:14px;direction:ltr}.lesson-list{display:grid;gap:10px;margin-top:20px;font-size:13px}.lesson-list div{display:flex;align-items:center;gap:12px;padding:7px;border-bottom:1px solid #e5ebe7}.lesson-list b{background:#eff3e7;color:#29453b;padding:4px 9px;border-radius:7px}.lesson-list span{margin-inline-start:auto;color:#67766b;font-size:12px}.float-note{position:absolute;background:#fff;border:1px solid var(--line);border-radius:14px;padding:15px 20px;box-shadow:0 10px 40px #163a3115;font-size:13px;animation:float 6s ease-in-out infinite;right:0;bottom:5px}.float-note strong{display:block;color:#1c4637;font-size:17px}.float-note.second{left:0;right:auto;top:0;bottom:auto;animation-delay:-3s}.demo-label{font-size:11px;text-align:center;display:block;margin-top:24px;color:var(--muted)}.trustline{border-block:1px solid var(--line);padding:24px 0}.trustline .wrap{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;font-size:16px}.trustline span{color:var(--muted)}.section{padding:100px 0}.soft{background:var(--soft)}.sectionhead{display:flex;align-items:end;justify-content:space-between;gap:55px;margin-bottom:46px}.sectionhead p{max-width:390px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:32px;transition:transform .25s}.card:hover{transform:translateY(-4px)}.card .number{font:400 14px Arial,sans-serif;color:var(--accent);display:block;margin-bottom:45px}.card h3{margin-bottom:16px}.card p{font-size:17px}.card .textlink{margin-top:24px}.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.feature-list{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:14px}.feature-list li{border-bottom:1px solid var(--line);padding-bottom:14px;display:flex;align-items:start;gap:13px}.feature-list li:before{content:'✓';color:var(--accent);font-weight:700}.feature-list strong{display:block;font-size:19px}.feature-list p{font-size:16px;margin-top:4px}.image-frame{padding:10px;border:1px solid var(--line);border-radius:20px;background:var(--card);box-shadow:0 25px 65px #172f3510;overflow:hidden}.image-frame img{border-radius:12px;width:100%}.caption{font-size:12px;margin-top:12px;color:var(--muted)}.process{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}.process article{border-top:2px solid var(--line);padding-top:26px}.process b{font:400 42px Arial;color:var(--accent);opacity:.7}.process h3{font-size:23px;margin:20px 0 12px}.process p{font-size:16px}.portfolio-card{overflow:hidden;border-radius:20px;border:1px solid var(--line);background:var(--card)}.portfolio-card img{width:100%;aspect-ratio:1.55;object-fit:cover;object-position:top;transition:transform .5s}.portfolio-card:hover img{transform:scale(1.025)}.portfolio-card div{padding:25px}.portfolio-card small{color:var(--accent);font-size:12px}.portfolio-card h3{margin-top:8px;font-size:23px}.portfolio-card p{font-size:16px;margin-top:10px}.faq{display:grid;gap:12px}.faq details{border:1px solid var(--line);border-radius:16px;background:var(--card);padding:22px 26px}.faq summary{cursor:pointer;font-weight:700;font-size:19px}.faq details p{margin-top:15px;font-size:17px}.contact{border-radius:32px;background:var(--ink);color:white;padding:55px;display:grid;grid-template-columns:.9fr 1.1fr;gap:70px}.contact .eyebrow{color:#bdcff5}.contact h2{font-size:44px}.contact p{color:#c9d4da;margin-top:20px}.contact ul{padding-right:20px;color:#d1dce2;font-size:17px;line-height:2.2}.contact-form{display:grid;gap:17px}.contact-form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.contact-form label{font-size:14px;color:#e8eff4;display:grid;gap:7px}.contact-form input,.contact-form select,.contact-form textarea{width:100%;min-width:0;color:#172e3a;background:#fff;border:1px solid #b9c9d3;border-radius:10px;padding:11px 13px;font-size:16px;line-height:1.4}.contact-form textarea{resize:vertical}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{outline:3px solid #a9c4ff;outline-offset:2px}.contact-form button{width:100%}.contact-form .hint{font-size:12px;margin:0}.contact-form [data-lead-feedback]{padding:12px;background:#fff;color:#143b31!important;border-radius:8px}.footer{padding:36px 0;border-top:1px solid var(--line)}.footer .wrap{display:flex;justify-content:space-between;gap:25px;align-items:center}.footer p,.footer a{font-size:14px}.footer-links{display:flex;gap:22px}.article{max-width:850px;padding:70px 0 100px}.article h1{font-size:48px;margin:24px 0}.article h2{font-size:29px;margin:35px 0 16px}.article p{margin:16px 0}.article ul{padding-right:22px}.article li{margin:10px 0;color:var(--muted)}.article .eyebrow{margin-top:40px}.reveal-enabled [data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .65s,transform .65s}.reveal-enabled [data-reveal].visible{opacity:1;transform:none}
.system{--paper:#0c121b;--ink:#eef3f9;--muted:#a6b2c1;--accent:#b6ef71;--soft:#111a27;--line:#293545;--card:#131d2b;--radius:18px}.system .agency-brand{font-size:22px}.system .brand-icon{background:var(--accent);color:#17221a;border-radius:9px}.system .button{color:#182512}.system .button.outline{color:#eaf0f6}.system .hero{grid-template-columns:1.05fr 1fr;gap:60px;background:radial-gradient(ellipse at 20% 40%,#1b2c2744,transparent 65%)}.system h1{font-size:clamp(43px,5.1vw,70px)}.system .hero em{display:inline-block}.system .hero-tags span{background:#141e2c}.system .trustline{background:#101925}.system .card:hover{border-color:#b6ef7177}.system .contact{background:#172433;border:1px solid var(--line)}.system .contact .eyebrow{color:var(--accent)}.system .contact p{color:#b5c2d0}.system .contact h2{color:white}.system .contact-form input,.system .contact-form select,.system .contact-form textarea{background:#0d1723;color:#ecf4ff;border-color:#415267}.system .contact-form input:focus,.system .contact-form select:focus,.system .contact-form textarea:focus{outline-color:#b6ef71}.system .contact-form label{color:#d8e2ed}.system .contact-form .hint{color:#adbccc}.system .footer p{color:var(--muted)}.system-panel{position:relative;border:1px solid #3b4859;background:#131e2c;border-radius:20px;box-shadow:0 35px 100px #0005;overflow:hidden;transform:rotate(2deg)}.system-panel .window-top{border-color:#304053;color:#aebaca;background:#182535}.system-panel .window-top i{background:#536575}.system-panel .window-top .live{margin-inline-start:auto;color:#b6ef71;font-size:11px}.panel-content{padding:25px}.panel-label{font-size:11px;color:#7f91a6;display:block;margin-bottom:12px}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:17px}.panel-head span{font-size:11px;color:#bad49a;background:#b6ef7112;padding:4px 10px;border-radius:20px}.stats-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}.stat{border:1px solid #304153;border-radius:12px;padding:16px;background:#172535}.stat small{color:#a7b8c9;font-size:12px}.stat strong{font:700 29px Arial;display:block;margin-top:12px;color:#edf5ff}.stat em{font-size:11px}.chart{height:100px;display:flex;align-items:end;gap:12px;border-bottom:1px solid #405064;margin-top:12px;padding:0 8px}.chart i{width:100%;height:var(--h);background:linear-gradient(#b6ef71,#567e4744);border-radius:5px 5px 0 0;transform-origin:bottom;animation:grow .9s both}.chart i:nth-child(2n){background:linear-gradient(#83b6e7,#44648855)}.ai-note{padding:15px;border:1px solid #b6ef713d;border-radius:12px;margin-top:19px;background:#b6ef7108;font-size:13px;line-height:1.8;color:#d4deeb}.ai-note b{color:#b6ef71;display:block;margin-bottom:5px}.system-orbit{position:absolute;width:110%;height:115%;inset:-8% -5%;border:1px solid #b6ef7128;border-radius:35%;transform:rotate(-9deg);z-index:-1}.product-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:26px}.product-tabs button{background:transparent;border:1px solid var(--line);color:var(--muted);border-radius:50px;padding:9px 22px;font-size:16px}.product-tabs button[aria-selected=true]{background:var(--accent);color:#17221a;border-color:var(--accent)}.product-panel[hidden]{display:none}.flow{display:flex;gap:15px;align-items:center;margin:30px 0;flex-wrap:wrap}.flow span{border:1px solid var(--line);border-radius:10px;padding:10px 18px;font-size:15px;background:var(--card)}.flow i{color:var(--accent);font-style:normal}.system .sectionhead p{color:#b6c3d1}.system .faq details{background:#101b28}.system .article h1{font-size:48px}
@keyframes float{50%{transform:translateY(-9px)}}@keyframes orbit{to{transform:rotate(360deg)}}@keyframes grow{from{transform:scaleY(.2)}to{transform:scaleY(1)}}
@media(min-width:1050px){.system .hero-scene{transform:translateY(var(--scene-shift,0px))}.hero-scene .academy-window{rotate:var(--scene-rotate,0deg)}}
@media(max-width:1050px){.wrap{width:calc(100% - 44px)}.nav{gap:20px}.navlinks{gap:15px}.nav .button{display:none}.hero,.system .hero{gap:40px;min-height:auto}.hero{padding:65px 0}.hero h1{font-size:54px}.float-note{right:-9px}.float-note.second{left:-9px}.section{padding:75px 0}.split{gap:35px}.contact{gap:35px;padding:35px}.card{padding:25px}.grid3{gap:16px}.book-detail-grid{gap:30px}}
@media(max-width:760px){html{scroll-padding-top:85px}.wrap{width:calc(100% - 36px)}.nav{height:76px;position:relative}.agency-brand{font-size:22px}.agency-brand small{font-size:9px}.brand-icon{width:40px;height:40px;font-size:26px}.menutoggle{display:block}.navlinks{display:none;position:absolute;top:76px;right:-18px;left:-18px;padding:22px;background:var(--paper);box-shadow:0 12px 22px #0002;border-bottom:1px solid var(--line);flex-direction:column}.navlinks.open{display:flex}.hero,.system .hero{grid-template-columns:1fr;gap:35px;padding:45px 0 40px}.hero h1,.system h1{font-size:clamp(40px,10.8vw,58px);line-height:1.2;letter-spacing:-.9px}.hero .lead{font-size:19px;margin-top:21px}.hero .eyebrow{font-size:12px;margin-bottom:19px}.hero-tags{margin-top:24px;gap:7px}.hero-tags span{font-size:11px}.hero-scene{padding:22px 15px 36px;max-width:500px;width:100%;margin:0 auto}.scene-orbit{inset:5px 5px 0}.float-note{padding:10px 13px;font-size:10px;right:0;bottom:5px}.float-note strong{font-size:14px}.float-note.second{left:0}.course-demo{padding:18px}.course-banner{min-height:165px;padding:23px}.course-banner strong{font-size:25px}.course-banner small{font-size:11px}.window-top{padding:12px 15px}.lesson-list{gap:4px}.lesson-list div{padding:5px}.demo-label{font-size:10px;margin-top:14px}.trustline .wrap{display:grid;grid-template-columns:1fr 1fr;font-size:14px;gap:14px}.section{padding:60px 0}.sectionhead{display:block;margin-bottom:30px}.sectionhead p{margin-top:20px;max-width:none}.eyebrow{font-size:12px;margin-bottom:13px}h2{font-size:35px;line-height:1.3}.grid3,.grid2,.split{grid-template-columns:1fr;gap:20px}.card{padding:26px}.card .number{margin-bottom:25px}.card h3{font-size:24px}.process{grid-template-columns:1fr 1fr;gap:30px 22px}.process b{font-size:34px}.process h3{font-size:20px;margin-top:17px}.process p{font-size:15px}.contact{grid-template-columns:1fr;border-radius:22px;padding:28px 22px;gap:30px}.contact h2{font-size:35px}.contact-form .row{grid-template-columns:1fr}.contact-form label{font-size:14px}.contact ul{font-size:15px}.contact-form .hint{font-size:12px}.footer .wrap{flex-direction:column;align-items:flex-start;gap:20px}.footer-links{gap:18px}.footer .agency-brand{font-size:21px}.article{padding:40px 0 65px}.article h1,.system .article h1{font-size:36px}.article h2{font-size:25px}.actions{gap:18px;margin-top:26px}.button{padding:14px 20px;font-size:16px}.system-panel{transform:rotate(0)}.system .hero-scene{padding:5px 0 10px}.panel-content{padding:20px}.chart{gap:9px;height:85px}.stat{padding:12px}.stat strong{font-size:25px}.panel-head{font-size:15px}.product-tabs{gap:8px}.product-tabs button{padding:8px 17px;font-size:14px}.system .split{gap:27px}.faq details{padding:20px}.faq summary{font-size:18px}.flow{gap:8px}.flow span{padding:8px 12px;font-size:13px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal-enabled [data-reveal]{opacity:1;transform:none}.system .hero-scene{transform:none}}
