body.cF{background:#f6f0e2}.hero{text-align:center;padding:64px 0 30px}.hero h1{font-size:clamp(34px,5vw,60px);max-width:860px;margin:0 auto 12px}.sub{font-size:19px;color:#3d4d4a;max-width:600px;margin:0 auto}.cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:22px}
.hero.small{padding:48px 0 10px}
.strip{display:flex;gap:16px;justify-content:center;margin-top:40px;padding:0 20px;overflow:hidden}.strip a{flex:0 1 300px}.strip img{border-radius:14px;box-shadow:0 14px 32px rgba(15,91,74,.22);border:5px solid #fff;transition:.2s}.strip a:hover img{transform:translateY(-6px)}
.wh{background:#fff}.c{text-align:center}.rows{display:flex;flex-direction:column;gap:16px}
.scard.row{display:grid;grid-template-columns:260px 1fr;border-inline-start:6px solid var(--gold)}.scard.row .thumb img,.scard.row .ph{height:100%;aspect-ratio:auto;min-height:160px}
.scard.row .sb{display:flex;flex-direction:column;justify-content:center}
.cmp{width:100%;border-collapse:collapse;background:#fff;border-radius:16px;overflow:hidden;box-shadow:var(--sh)}.cmp th,.cmp td{padding:14px 18px;text-align:right;border-bottom:1px solid #e6ece9}.cmp th{background:var(--green);color:#fff}.cmp td:first-child{font-weight:800;color:var(--green);background:var(--mint)}
.tl{list-style:none;margin:0;padding:0 24px 0 0;border-right:3px solid var(--gold)}.tl li{position:relative;padding:0 24px 24px 0}.tl li:before{content:"";position:absolute;right:-31px;top:8px;width:16px;height:16px;border-radius:50%;background:var(--green);border:3px solid #fff}.tl b{display:block;color:var(--green);font-size:19px}.tl span{color:#51615f}
.steps.line{grid-template-columns:repeat(4,1fr)}.steps.line li{background:var(--mint);box-shadow:none;text-align:center}.steps.line i{margin-inline:auto;background:var(--gold);color:#3a2a05}
.band{background:linear-gradient(120deg,var(--green),var(--teal));color:#fff;border-radius:24px;padding:40px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}.band h2{color:#fff;margin:0}
.nr{max-width:820px}.h1s{font-size:clamp(30px,4vw,44px)}
@media(max-width:860px){.scard.row{grid-template-columns:1fr}.strip a:nth-child(n+3){display:none}.cmp th,.cmp td{padding:10px;font-size:14px}}
.cB .strip a{flex:0 1 300px;min-width:0}.cmp{display:block;overflow-x:auto}@media(max-width:520px){.steps.line{grid-template-columns:1fr}.hero{padding-top:40px}}
.hero .trust{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:18px}.trust span{background:#fff;border-radius:99px;padding:4px 16px;font-weight:700;font-size:14px;color:var(--green);box-shadow:var(--sh)}
.strip a{position:relative;display:block}.strip figcaption,.strip .cap{position:absolute;bottom:10px;inset-inline:10px;background:rgba(15,91,74,.92);color:#fff;border-radius:10px;padding:2px 10px;font-size:13px;font-weight:700;text-align:center}
.lgrid{display:grid;grid-template-columns:1.1fr 1fr;gap:34px;align-items:center}
.win{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 20px 50px rgba(15,91,74,.28);border:1px solid #d7e2de}.wbar{background:var(--mint);padding:8px 14px;display:flex;gap:6px;align-items:center;font-weight:800;color:var(--green);font-size:14px}.wbar i{width:10px;height:10px;border-radius:50%;background:var(--gold)}.wbar span{margin-inline-start:auto}.win img{width:100%}
.chk{list-style:none;padding:0;margin:14px 0 22px}.chk li{padding:3px 28px 3px 0;position:relative}.chk li:before{content:"✓";position:absolute;right:0;color:var(--gold);font-weight:800}
.fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.note{background:#fbf3df;border-inline-start:5px solid var(--gold);border-radius:12px;padding:16px 20px;color:#5b4410}.note b{color:#5b4410}
.shots{display:grid;grid-template-columns:1fr 1fr;gap:18px}.band .btn{white-space:nowrap}
.lead2{font-size:18px;color:#3d4d4a}
@media(max-width:860px){.lgrid,.shots,.fgrid{grid-template-columns:1fr}}
.cmp{display:table!important}.tw{overflow-x:auto;border-radius:16px}.band .btn.wa{background:var(--gold);color:#3a2a05}
:root{--turq:#19B7B0;--turqd:#0E8F89;--amber:#FFB52E;--ambd:#F29A00;--deep:#08382E;--ink2:#06382F}
body.cV{background:#fff;color:#243238}
.cV .top{background:rgba(255,255,255,.96);border-bottom:1px solid #e7eeeb}
.cV nav a.on,.cV nav a:hover{background:var(--green);color:#fff}
.cV .btn{font-weight:800}.cV .btn.lg{padding:15px 30px;font-size:18px;border-radius:16px}
.cV .btn.gold,.cV .btn.wa{background:var(--amber);color:#2e2104;box-shadow:0 6px 0 var(--ambd),0 12px 22px rgba(242,154,0,.28);border:0}
.cV .btn.gold:hover,.cV .btn.wa:hover{background:#ffc04d;transform:translateY(-2px)}
.cV .btn.sm.wa{box-shadow:0 3px 0 var(--ambd)}
.cV .btn.pri{background:var(--turq);color:var(--ink2);box-shadow:0 6px 0 var(--turqd),0 12px 22px rgba(25,183,176,.25)}.cV .btn.pri:hover{background:#2cc8c1;transform:translateY(-2px)}
.cV .btn.sm.pri{box-shadow:0 3px 0 var(--turqd)}
.cV .btn.ghost{border:2px solid var(--green);color:var(--green)}
.cV .btn.outl{border:2px solid rgba(255,255,255,.7);color:#fff;background:transparent}.cV .btn.outl:hover{background:rgba(255,255,255,.12)}
.cV .fab{background:var(--amber);color:#2e2104}
.cV .eyebrow{color:var(--turqd);background:#e6f8f7;padding:2px 14px;border-radius:99px}.cV .eyebrow.gold{color:var(--amber);background:rgba(255,181,46,.14)}
.cV h1,.cV h2{color:var(--green)}
.hero{background:radial-gradient(900px 420px at 85% -10%,rgba(25,183,176,.16),transparent 70%),radial-gradient(600px 360px at 0% 100%,rgba(255,181,46,.14),transparent 70%),#fff;padding:54px 0 64px;text-align:right}
.hg{display:grid;grid-template-columns:1fr 1.05fr;gap:36px;align-items:center}
.pill{display:inline-block;background:var(--green);color:#fff;border-radius:99px;padding:3px 16px;font-weight:700;font-size:14px;margin-bottom:14px}
.cV .hero h1{font-size:clamp(34px,4.6vw,56px);margin:0 0 14px;max-width:none;line-height:1.25}.hero h1 em{font-style:normal;color:var(--green);background:linear-gradient(transparent 62%,rgba(255,181,46,.55) 62%);padding:0 4px}
.cV .sub{font-size:19px;color:#35454a;margin:0 0 24px;max-width:520px}.cV .cta{justify-content:flex-start;margin-top:0}
.micro{font-size:14px;color:#5b6b69;margin-top:16px}
.collage{position:relative;height:430px}.shot{position:absolute;display:block;border-radius:18px;overflow:hidden;border:6px solid #fff;box-shadow:0 22px 50px rgba(8,56,46,.26);transition:.25s}.shot img{width:100%;display:block}.shot span{position:absolute;bottom:0;inset-inline:0;background:linear-gradient(transparent,rgba(8,56,46,.88));color:#fff;font-weight:700;font-size:14px;padding:18px 12px 8px;text-align:center}
.shot.s0{width:68%;top:0;right:0;z-index:2}.shot.s1{width:58%;top:150px;left:0;z-index:3;transform:rotate(-2.5deg)}.shot.s2{width:50%;bottom:0;right:12%;z-index:1;transform:rotate(2deg)}.shot:hover{transform:translateY(-6px) rotate(0);z-index:5}
.sec.tight{padding:36px 0}.sec.soft{background:#F3EBDC}
.bens{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.b{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid #e5eeeb;border-radius:18px;padding:18px;box-shadow:0 8px 24px rgba(15,91,74,.07)}.b>span{flex:0 0 52px;height:52px;border-radius:16px;display:grid;place-items:center;font-size:26px;background:#e6f8f7}.b1>span{background:#fff3d9}.b2>span{background:#e8efe9}.b3>span{background:#e6f8f7}.b h3{margin:0 0 2px;font-size:17px}.b p{margin:0;font-size:14px;color:#51615f;line-height:1.6}
.lead2{font-size:18px;color:#3d4d4a;max-width:680px}
.vgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:22px}
.vgrid .scard{--ac:var(--green);border-radius:22px;border:1px solid #e3ece9;border-top:6px solid var(--ac);box-shadow:0 12px 32px rgba(8,56,46,.10);display:flex;flex-direction:column;transition:.2s}.vgrid .scard:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(8,56,46,.16)}
.scard[data-subj="لغتي"]{--ac:#0F5B4A}.scard[data-subj="العلوم"]{--ac:#19B7B0}.scard[data-subj="English"]{--ac:#F29A00}.scard[data-subj="لغتي والرياضيات"]{--ac:#5B6FD6}
.vgrid .thumb{background:#f4f8f7}.vgrid .thumb img{aspect-ratio:8/5;width:100%;object-fit:cover}
.vgrid .sb{display:flex;flex-direction:column;flex:1;padding:20px}.vgrid .sb h3{font-size:21px;color:var(--ac);filter:brightness(.8)}.vgrid .sb>p{font-size:15.5px}
.vgrid .meta span{background:color-mix(in srgb,var(--ac) 14%,#fff);color:#243238}.vgrid .meta span+span{background:#f3f5f4;color:#51615f}
.hl{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-wrap:wrap;gap:6px}.hl li{font-size:13px;font-weight:700;background:color-mix(in srgb,var(--ac) 12%,#fff);border:1px solid color-mix(in srgb,var(--ac) 35%,#fff);border-radius:99px;padding:2px 12px;color:#243238}
.vgrid .acts{margin-top:auto}.vgrid .acts .btn{flex:1;white-space:nowrap}
.vgrid .acts a:last-child{background:var(--amber);color:#2e2104;border-color:transparent;box-shadow:0 3px 0 var(--ambd)}.vgrid .acts a:last-child:hover{background:#ffc04d}
.vgrid .ph{aspect-ratio:8/5}
.sec.dark{background:linear-gradient(160deg,#0A4437,#06322A);color:#d8ece6}.sec.dark h2,.sec.dark h1{color:#fff}.sec.dark .lead2{color:#c4e0d8}.sec.dark2{background:#082F27;color:#d8ece6}.sec.dark2 h2.w{color:#fff}.hint.w{color:#9ec4b9}
.lgrid{display:grid;grid-template-columns:1fr 1.1fr;gap:38px;align-items:center}.cta2{display:flex;gap:12px;flex-wrap:wrap}.h1w{font-size:clamp(30px,4vw,46px);margin:8px 0 12px}
.chk li:before{color:var(--amber)}.chk.dk li:before{color:var(--turqd)}.dark .chk{color:#e6f3ef}
.win{box-shadow:0 26px 60px rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.18)}
.vf{grid-template-columns:repeat(3,1fr)}.fc{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:20px}.fc h3{color:#fff;margin:6px 0 4px}.fc p{color:#b8d8cf;margin:0;font-size:15px}.fi{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:rgba(25,183,176,.2);font-size:24px}
.cV .cmp th{background:var(--green)}.cV .cmp td:first-child{background:#e6f8f7}.cV .tw{box-shadow:var(--sh)}
.cV .steps.line li{background:#fff;box-shadow:var(--sh);text-align:center}.cV .steps.line i{background:var(--turq);color:var(--ink2);margin-inline:auto}
.cV .band{background:linear-gradient(120deg,var(--green),#0b6b58);color:#fff}.cV .band h2{color:#fff}
.cV .faq details{border:1px solid #e5eeeb;box-shadow:none}.cV .faq summary{color:var(--green)}
.cV .note{background:#fff6e0}
.phead{padding:44px 0 8px;background:radial-gradient(700px 240px at 90% 0,rgba(25,183,176,.14),transparent 70%),#fff}
.cV .filters{background:#f4faf9;border:1px solid #dcefed;border-radius:16px;padding:14px 16px;margin-top:18px}.cV select,.cV input,.cV textarea{border:1.5px solid #cbd9d5;background:#fff}.cV select:focus,.cV input:focus,.cV textarea:focus{outline:3px solid rgba(25,183,176,.35);border-color:var(--turq)}
.cV .oform{border:1px solid #dcefed;border-top:6px solid var(--amber);box-shadow:0 18px 44px rgba(8,56,46,.12);gap:18px;padding:30px}.cV .oform label{font-size:16px;color:var(--green)}
.cV .oform .btn.wa{margin-top:6px}
.cV .foot{background:var(--deep);margin-top:0}.cV .fb p{color:var(--amber)}
.tl li:before{background:var(--turq)}
@media(max-width:980px){.vgrid{grid-template-columns:1fr 1fr}.bens{grid-template-columns:1fr 1fr}.vf{grid-template-columns:1fr 1fr}}
@media(max-width:860px){.hg,.lgrid{grid-template-columns:1fr}.hero{text-align:right;padding-top:34px}.collage{height:300px}.shot.s1{top:100px}}
@media(max-width:620px){.vgrid,.vf,.bens{grid-template-columns:1fr}.collage{height:260px}.cV .btn.lg{padding:13px 22px;font-size:17px;width:100%}.cV .cta{flex-direction:column}.vgrid .acts .btn{white-space:normal}}

/* ===== Typography system: Cairo (headings/buttons/nav) + IBM Plex Sans Arabic (text) ===== */
:root{--f-head:"Cairo","IBM Plex Sans Arabic",system-ui,"Segoe UI",Tahoma,sans-serif;--f-text:"IBM Plex Sans Arabic",system-ui,"Segoe UI",Tahoma,sans-serif}
body.cV{font-family:var(--f-text);font-weight:400;font-synthesis:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.cV h1,.cV h2{font-family:var(--f-head);font-weight:700;line-height:1.35}
.cV h3,.cV .fc h3,.cV .b h3,.cV .tl b,.cV .faq summary,.cV .cmp th{font-family:var(--f-head);font-weight:600;line-height:1.45}
.cV h1.h1s,.cV .hero h1,.cV .h1w{line-height:1.3}
.cV p,.cV li,.cV .sub,.cV .lead2,.cV .sb>p,.cV .b p,.cV .fc p,.cV .faq p,.cV .steps p,.cV .tl span,.cV .cmp td,.cV .note{font-family:var(--f-text);font-weight:400}
.cV .sub,.cV .lead2,.cV .sb>p,.cV .fc p,.cV .b p,.cV .steps p{font-weight:400;line-height:1.85}
.cV .chk li,.cV .cmp td,.cV .tl span{font-weight:500}
.cV .hint,.cV .micro,.cV small,.cV .foot small,.cV .empty,.cV .hint.w{font-family:var(--f-text);font-weight:400}
.cV .eyebrow,.cV .pill,.cV .brand b,.cV .brand small,.cV .fb b,.cV .shot span{font-family:var(--f-head);font-weight:700}
.cV .brand small{font-weight:600}
.cV .meta span,.cV .hl li,.cV .trust span{font-family:var(--f-text);font-weight:500}
.cV nav a,.cV .fl a{font-family:var(--f-head);font-weight:600}
.cV .fb p{font-family:var(--f-head);font-weight:600}
.cV .cmp td:first-child{font-family:var(--f-head);font-weight:600}
.cV .steps i{font-family:var(--f-head);font-weight:700}
/* forms and filters */
.cV select,.cV input,.cV textarea,.cV option{font-family:var(--f-text);font-weight:500;line-height:1.6}
.cV .filters label,.cV .oform label{font-family:var(--f-text);font-weight:500}
.cV .oform input::placeholder,.cV .oform textarea::placeholder{font-family:var(--f-text);font-weight:400;opacity:.65}
/* buttons: one family, centered, no Arabic clipping */
.cV .btn,.cV button.btn,.cV a.btn,.cV .fab{font-family:var(--f-head);line-height:1.5;display:inline-flex;align-items:center;justify-content:center;text-align:center;gap:8px;box-sizing:border-box;min-height:48px;padding:10px 24px;white-space:normal;text-wrap:balance;max-width:100%;overflow:visible;letter-spacing:0;-webkit-tap-highlight-color:transparent}
.cV .btn.sm{min-height:44px;padding:8px 16px}
.cV .btn.lg{min-height:54px;padding:12px clamp(20px,3vw,30px)}
.cV .btn bdi{unicode-bidi:isolate;font-family:var(--f-head);white-space:nowrap}
/* order/request buttons: Cairo 700, 16-17px */
.cV .btn.gold,.cV .btn.wa,.cV .vgrid .acts a:last-child,.cV .fab{font-weight:700;font-size:16px}
.cV .btn.lg.gold,.cV .btn.lg.wa{font-size:17px}
/* trial buttons: Cairo 600, 15-16px */
.cV .btn.pri,.cV .vgrid .acts a:first-child{font-weight:600;font-size:16px}
.cV .vgrid .acts .btn{font-size:15.5px}
.cV .vgrid .acts a:last-child{font-weight:700}
/* navigation + secondary actions: Cairo 600 */
.cV .btn.ghost,.cV .btn.outl,.cV .btn.dis{font-weight:600;font-size:16px}
.cV .btn.sm.wa{font-weight:700;font-size:16px}
/* interaction states keep colors, only add visible focus */
.cV .btn:focus-visible,.cV .fab:focus-visible,.cV nav a:focus-visible{outline:3px solid #19B7B0;outline-offset:3px}
.cV .btn.gold:focus-visible,.cV .btn.wa:focus-visible{outline-color:#08382E}
.cV .dark .btn:focus-visible{outline-color:#fff}
.cV .btn:active{transform:translateY(1px)}
@media(max-width:620px){.cV .btn.lg{min-height:52px}.cV .vgrid .acts .btn{min-height:48px}.cV .cta2 .btn{width:100%}}
.cV .oform label{min-width:0}.cV .oform input,.cV .oform select,.cV .oform textarea{width:100%;min-width:0;box-sizing:border-box}
@media(max-width:620px){.cV .shot span{font-size:12px;padding:12px 8px 6px}}
/* logo lockup (contains the brand name) */
.cV .brand img{width:auto;height:48px;max-width:190px;object-fit:contain}
.cV .fb img{width:190px;height:auto;padding:0;background:none;border-radius:0}
@media(max-width:520px){.cV .brand img{height:40px;max-width:160px}.cV .fb img{width:160px}}
