:root{--bg:#FFFFFF;--bg2:#F5F7FC;--ink:#14213D;--muted:#5B6782;--line:#E3E8F2;--blue:#2F4371;--blue2:#22335A;--sky:#EDF1F8;--pink:#E5245A;--ok:#12A36B;--display:'Readex Pro','IBM Plex Sans Arabic',Tahoma,sans-serif;--body:'IBM Plex Sans Arabic',Tahoma,sans-serif;--r:18px;--shadow:0 30px 80px -30px rgba(16,60,140,.35),0 8px 24px -12px rgba(16,60,140,.18)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.75 var(--body);-webkit-font-smoothing:antialiased}
a{color:inherit}img{max-width:100%;height:auto;display:block}[hidden]{display:none!important}
.wrap{width:min(1180px,100% - 32px);margin-inline:auto}
.ltr{direction:ltr;unicode-bidi:isolate}
/* header */
header.top{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.85);backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;gap:22px;height:68px}
.brand{display:flex;align-items:center;gap:9px;font:700 21px var(--display);text-decoration:none;white-space:nowrap}.brand b{color:var(--blue)}
.brand img{height:40px;width:auto}
nav{display:flex;gap:4px;margin-inline-start:auto}nav a{padding:8px 8px;white-space:nowrap;border-radius:10px;text-decoration:none;color:var(--muted);font-size:15px;font-weight:500}nav a:hover{background:var(--sky);color:var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;border-radius:12px;border:1px solid var(--line);background:#fff;font:600 16px var(--body);text-decoration:none;cursor:pointer;color:var(--ink);transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px -10px rgba(16,60,140,.4)}
.btn.primary{background:var(--blue);border-color:var(--blue);color:#fff}.btn.primary:hover{background:var(--blue2)}
.btn.sm{padding:9px 16px;font-size:15px}
/* hero */
.hero{position:relative;overflow:hidden;padding:72px 0 40px;text-align:center;background:radial-gradient(900px 420px at 50% -10%,#E3E9F6 0%,rgba(227,233,246,0) 70%),radial-gradient(600px 300px at 85% 20%,#FCE6EE 0%,rgba(252,230,238,0) 70%)}
.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;background:#fff;border:1px solid #D5DCEB;color:var(--blue2);font-size:14px;font-weight:600}
.pill i{width:7px;height:7px;border-radius:50%;background:var(--ok);display:inline-block}
h1{font:700 clamp(36px,5.6vw,68px)/1.15 var(--display);margin:22px auto 16px;letter-spacing:-.5px}
h1 .g{background:linear-gradient(90deg,#2F4371,#E5245A);-webkit-background-clip:text;background-clip:text;color:transparent}
.sub{font-size:clamp(17px,2vw,20px);color:var(--muted);margin:0 auto 26px;max-width:46ch}.sub b{color:var(--ink)}
.ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.tiny{margin-top:14px;font-size:14px;color:var(--muted)}
.frame{margin:48px auto 0;max-width:1080px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);overflow:hidden}
.frame .bar{display:flex;align-items:center;gap:7px;height:34px;padding:0 14px;background:#F6F8FC;border-bottom:1px solid var(--line);direction:ltr}
.frame .bar span{width:11px;height:11px;border-radius:50%;background:#FF5F57}.frame .bar span:nth-child(2){background:#FEBC2E}.frame .bar span:nth-child(3){background:#28C840}
.frame .bar em{margin-inline-start:12px;font:500 12px var(--body);color:#8A97AD;font-style:normal}
/* chips */
.chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:40px auto 0;max-width:980px}
.chips span{padding:8px 14px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:15px;color:var(--ink)}
/* sections */
section{padding:88px 0}section.alt{background:var(--bg2)}
.eyebrow{color:var(--pink);font-weight:700;font-size:14px;letter-spacing:.3px}
h2{font:700 clamp(28px,3.6vw,44px)/1.25 var(--display);margin:8px 0 12px;letter-spacing:-.3px}
.lead{color:var(--muted);font-size:18px;max-width:60ch}
.center{text-align:center}.center .lead{margin-inline:auto}
.row2{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:56px;align-items:center;margin-top:64px}
.row2.flip>div:first-child{order:2}
.row2 h3{font:700 26px/1.35 var(--display);margin:6px 0 10px}
.row2 ul{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:8px}
.row2 li{position:relative;padding-inline-start:28px;color:var(--ink)}
.row2 li::before{content:'';position:absolute;inset-inline-start:0;top:8px;width:18px;height:18px;border-radius:50%;background:var(--sky) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F4371' stroke-width='3'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/12px no-repeat}
.tag{display:inline-block;padding:4px 10px;border-radius:8px;background:var(--sky);color:var(--blue2);font:600 13px var(--body)}
.shot{border-radius:14px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);background:#fff}
/* cards */
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:40px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:24px}
.card h3{font:700 19px/1.4 var(--display);margin:10px 0 6px}.card p{margin:0;color:var(--muted);font-size:16px}
.ic{width:44px;height:44px;border-radius:12px;background:var(--sky);display:grid;place-items:center;font-size:22px}
.reps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:26px 22px;margin-top:40px}.reps figure{grid-column:span 2}.reps figure:nth-child(4){grid-column:2/span 2}.reps figure{margin:0}
.paper{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);overflow:hidden;aspect-ratio:1000/1150;transform:rotate(0)}
.reps figure:nth-child(odd) .paper{transform:rotate(-1deg)}.reps figure:nth-child(even) .paper{transform:rotate(1deg)}
.reps figcaption{margin-top:16px;text-align:center}.reps figcaption b{display:block;font-family:var(--display)}.reps figcaption span{color:var(--muted);font-size:15px}
/* pricing */
.pksw{display:flex;gap:6px;justify-content:center;margin:30px auto 0;background:var(--sky);border-radius:16px;padding:6px;width:max-content;max-width:100%}.pksw button{all:unset;cursor:pointer;padding:10px 26px;border-radius:12px;text-align:center;line-height:1.3}.pksw button b{display:block;font-size:17px}.pksw button small{display:block;font-size:12.5px;color:var(--muted)}.pksw button[aria-selected=true]{background:#fff;box-shadow:0 6px 18px -8px rgba(20,33,61,.35);color:var(--blue)}.pksw button:focus-visible{outline:3px solid var(--pink)}.pk tr.on td{background:#F4F7FD}
.prices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:40px;align-items:stretch}
.price{background:#fff;border:1px solid var(--line);border-radius:22px;padding:28px;display:flex;flex-direction:column;gap:10px}
.price.hot{border:2px solid var(--blue);box-shadow:var(--shadow);position:relative}
.price .badge{position:absolute;top:-13px;inset-inline-start:24px;background:var(--pink);color:#fff;font-size:13px;font-weight:700;padding:4px 12px;border-radius:999px}
.price h3{font:700 20px var(--display);margin:0}.price .amt{font:700 40px/1.1 var(--display)}.price .amt small{font-size:16px;color:var(--muted);font-weight:500}
.price .was{color:var(--muted);font-size:17px}.price .was s{color:var(--ink);font-weight:700;font-size:20px;text-decoration:line-through;text-decoration-color:var(--pink);text-decoration-thickness:3px}.price ul{list-style:none;padding:0;margin:6px 0 10px;display:grid;gap:7px;flex:1}
.price li{padding-inline-start:26px;position:relative;font-size:15.5px}.price li::before{content:'✓';position:absolute;inset-inline-start:0;color:var(--blue);font-weight:700}
.price li.no{color:var(--muted)}.price li.no::before{content:'✗';color:var(--pink)}.price{position:relative}.price .after{font-size:14px;color:var(--ink);background:var(--sky);border-radius:10px;padding:6px 10px}
.note{color:var(--muted);font-size:14px;margin-top:16px}
.devs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px}.devs div{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px}.devs b{display:block;font-family:var(--display)}.devs span{color:var(--muted);font-size:15px}
/* steps */
.steps{list-style:none;padding:0;margin:40px 0 28px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;counter-reset:s}
.steps li{counter-increment:s;background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px}
.steps li::before{content:counter(s);display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--blue);color:#fff;font:700 16px var(--display);margin-bottom:10px}
.steps b{display:block;font-family:var(--display)}.steps span{color:var(--muted);font-size:15px}
/* faq */
.faq{max-width:820px;margin:36px auto 0;display:grid;gap:10px}
.faq details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 20px}
.faq summary{cursor:pointer;font:600 17px var(--display);list-style:none;display:flex;justify-content:space-between;gap:12px}.faq summary::after{content:'+';color:var(--blue);font-size:22px;line-height:1}
.faq details[open] summary::after{content:'–'}.faq p{margin:10px 0 0;color:var(--muted)}
/* order */
.order{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:start}
.flow{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:12px;counter-reset:f}.flow li{counter-increment:f;display:flex;gap:12px}.flow li::before{content:counter(f);flex:none;width:30px;height:30px;border-radius:9px;background:var(--sky);color:var(--blue2);display:grid;place-items:center;font-weight:700}
.flow b{display:block}.flow span{color:var(--muted);font-size:15px}
.form{background:#fff;border:1px solid var(--line);border-radius:22px;padding:26px;box-shadow:var(--shadow);display:grid;gap:14px}
.field{display:grid;gap:6px}.field label{font-size:15px;color:var(--muted)}
.form input,.form select,.form textarea{font:inherit;font-size:16px;padding:11px 14px;border:1px solid var(--line);border-radius:12px;background:#FBFCFF;color:var(--ink);width:100%}
.form textarea{min-height:80px}.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid #BFD6FF;border-color:var(--blue)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.sum{display:flex;justify-content:space-between;padding:12px 16px;border-radius:12px;background:var(--sky);font-weight:600}.sum .p{color:var(--blue2)}
.pays{display:flex;gap:10px;flex-wrap:wrap}.pays label{display:flex;gap:6px;align-items:center;padding:9px 14px;border:1px solid var(--line);border-radius:12px;cursor:pointer}
.err{color:#D92D20;font-size:15px;min-height:1px}.done{display:grid;gap:8px;padding:16px;border-radius:14px;background:#EFFAF5}.done .row{display:flex;gap:10px;flex-wrap:wrap}
/* cta + footer */
.big{background:linear-gradient(135deg,#22335A,#2F4371 55%,#E5245A);color:#fff;border-radius:28px;padding:56px 32px;text-align:center}
.big h2{color:#fff}.big p{color:#DCE9FF;margin:0 0 24px}.big .btn{border-color:#fff}.big .btn.primary{background:#fff;color:var(--blue2)}
footer{padding:36px 0;border-top:1px solid var(--line);color:var(--muted);font-size:14px}footer .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
@media (max-width:980px){nav{display:none}.row2,.order{grid-template-columns:1fr;gap:28px}.row2.flip>div:first-child{order:0}.grid3,.prices{grid-template-columns:1fr 1fr}.steps{grid-template-columns:1fr 1fr}}
@media (max-width:980px){.reps{grid-template-columns:1fr 1fr}.reps figure,.reps figure:nth-child(4){grid-column:auto}}@media (max-width:640px){.reps{grid-template-columns:1fr}.paper{transform:none!important}section{padding:64px 0}.hero{padding-top:48px}.grid3,.prices,.steps,.devs,.grid2{grid-template-columns:1fr}.top .btn{display:none}.top .btn.primary{display:inline-flex}.frame .bar{height:26px}}
.pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:36px;align-items:start}.pcard{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px;display:flex;flex-direction:column;gap:8px;min-width:0}.pcard h3{margin:2px 0 0}.pcard .tag{align-self:flex-start}.pcard ul{margin:4px 0 8px}.pimg{max-height:560px;overflow:hidden;position:relative;background:#F2F6FB}.pimg img{display:block;width:100%;height:auto}.pimg::after{content:"";position:absolute;inset:auto 0 0 0;height:60px;background:linear-gradient(transparent,#F2F6FB)}.pcard.wide{grid-column:span 2}@media (max-width:760px){.nextg{grid-template-columns:1fr 1fr!important}}@media (max-width:1240px){nav a{font-size:14px;padding:8px 6px}}@media (max-width:1100px){nav{display:none}}@media (max-width:900px){.pcard.wide{grid-column:auto}.pgrid{grid-template-columns:1fr}.pimg{max-height:520px}}
.pk{width:100%;border-collapse:collapse;font-size:14.5px;margin:2px 0 4px}.pk th{font-size:12.5px;color:var(--muted);font-weight:600;text-align:start;padding:4px 6px;border-bottom:1px solid var(--line)}.pk td{padding:6px;border-bottom:1px solid var(--line);vertical-align:middle}.pk td small{display:block;color:var(--muted);font-size:12px}.pk td s{color:var(--muted);text-decoration-color:var(--pink);text-decoration-thickness:2px}.pk td b{font-size:16px}
@media (max-width:760px){.prices{grid-template-columns:1fr!important}.pk{font-size:13.5px}}

/* ===== multi-page additions ===== */
.top .wrap{position:relative}.mm{position:static}.mm>button{all:unset;cursor:pointer;padding:8px 10px;border-radius:10px;color:var(--muted);font-size:15px;font-weight:600;white-space:nowrap}
.mm>button:hover,.mm.open>button{background:var(--sky);color:var(--ink)}
.mpanel{position:absolute;top:calc(100% + 6px);left:0;right:0;width:auto;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 40px 90px -30px rgba(20,33,61,.35);padding:22px;display:none;grid-template-columns:1fr 1fr 250px;gap:18px;z-index:60}
.mm.open .mpanel{display:grid}
.mpanel a{white-space:normal}.mcol h6{margin:0 0 8px;font:700 12.5px var(--body);color:var(--muted);letter-spacing:.3px}
.mcol a{display:flex;gap:10px;align-items:flex-start;padding:9px 10px;border-radius:12px;text-decoration:none}.mcol a:hover{background:var(--sky)}
.mcol a i{font-style:normal;font-size:20px;line-height:1.4}.mcol a b{display:block;font-size:15px;color:var(--ink)}.mcol a small{display:block;color:var(--muted);font-size:13px;line-height:1.5}
.mfeat{background:linear-gradient(150deg,#14213D,#2F4371);color:#fff;border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:8px;text-decoration:none}
.mfeat em{font-style:normal;align-self:flex-start;background:var(--pink);border-radius:99px;padding:2px 12px;font-size:12.5px;font-weight:700}
.mfeat b{font:700 20px/1.4 var(--display)}.mfeat span{opacity:.85;font-size:14px;line-height:1.7}.mfeat u{text-decoration:none;margin-top:auto;font-weight:700}
.burger{display:none;all:unset;cursor:pointer;font-size:24px;padding:4px 8px}
@media (max-width:1100px){nav{display:flex!important}nav>a{display:none}.mpanel{position:fixed;top:68px;inset-inline:8px;width:auto;grid-template-columns:1fr;max-height:calc(100vh - 80px);overflow:auto}}
/* page hero (feature pages) */
.phero{padding:70px 0 30px;text-align:center;background:radial-gradient(800px 380px at 80% 0%,rgba(229,36,90,.08),transparent 70%),linear-gradient(#F7F9FD,#fff)}
.phero .back{display:inline-block;color:var(--muted);text-decoration:none;font-size:14px;margin-bottom:14px}
.phero h1{font:700 clamp(32px,5vw,54px)/1.25 var(--display);margin:8px auto 12px;max-width:900px;text-wrap:balance}
.phero p.sub{color:var(--muted);font-size:19px;max-width:720px;margin:0 auto 22px}
.pframe{margin:40px auto 0;max-width:1000px;border-radius:16px;border:1px solid var(--line);box-shadow:var(--shadow);overflow:hidden;background:#fff}
.pframe .bar{display:flex;gap:6px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line);background:#F7F9FD}.pframe .bar span{width:10px;height:10px;border-radius:50%;background:#E3E8F2}.pframe .bar span:nth-child(1){background:#FF5F57}.pframe .bar span:nth-child(2){background:#FEBC2E}.pframe .bar span:nth-child(3){background:#28C840}
.pframe .bar em{font-style:normal;color:var(--muted);font-size:12.5px;margin-inline-start:10px;direction:ltr}
.pframe img{width:100%;display:block;max-height:640px;object-fit:cover;object-position:top}.pframe img[src*=cam-now]{object-position:center 70%}
.pbody section{padding:56px 0}.pbody .row2{margin-top:0}
.qa{max-width:820px;margin:0 auto}.qa h2{text-align:center}.qa details{border-bottom:1px solid var(--line);padding:14px 0}.qa summary{cursor:pointer;font-weight:700;font-size:17.5px}.qa p{color:var(--muted);margin:8px 0 0}
.ctaband{max-width:820px;margin:0 auto;text-align:center;background:var(--sky);border-radius:22px;padding:34px 22px}.ctaband h3{font:700 24px/1.5 var(--display);margin:0 0 14px}
.ctaband .ctas{justify-content:center}
/* home: exceptional cards */
.xgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:40px}
.xcard{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;text-decoration:none;transition:transform .15s,box-shadow .15s}
.xcard:hover{transform:translateY(-3px);box-shadow:0 24px 50px -28px rgba(20,33,61,.45)}
.xcard .xi{aspect-ratio:16/10;background:#F2F6FB;overflow:hidden}.xcard .xi img{width:100%;height:100%;object-fit:cover;object-position:top}
.xcard .xt{padding:18px 20px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
.xcard .tag{align-self:flex-start}.xcard h3{margin:0;font:700 21px/1.4 var(--display)}.xcard p{margin:0;color:var(--muted);font-size:15.5px}
.xcard u{text-decoration:none;color:var(--blue);font-weight:700;margin-top:auto;padding-top:8px}
.xcard.xbig{grid-column:span 2;flex-direction:row}.xcard.xbig .xi{flex:1.1;aspect-ratio:auto;min-height:300px}.xcard.xbig .xt{flex:1;justify-content:center;padding:28px}.xcard.xbig h3{font-size:27px}

.xcard.xwide{grid-column:1/-1;flex-direction:row}.xcard.xwide .xi{flex:1.1;aspect-ratio:auto;min-height:240px}.xcard.xwide .xt{flex:1;justify-content:center;padding:28px}
@media (max-width:900px){.xcard.xwide{grid-column:auto;flex-direction:column}.xcard.xwide .xi{min-height:0;aspect-ratio:16/10}}
@media (max-width:900px){.xgrid{grid-template-columns:1fr}.xcard.xbig{grid-column:auto;flex-direction:column}.xcard.xbig .xi{min-height:0;aspect-ratio:16/10}}

/* ===== v2 design: clearer hierarchy, bigger labels, calmer rhythm ===== */
:root{--bg2:#F3F6FB;--sky:#EAF0FA;--ink:#14213D;--muted:#55627E;--blue:#2F4371;--pink:#E5245A;--pink-soft:#FDE9EF;--gold:#F4B740}
body{font-size:17.5px;line-height:1.85}
section{padding:104px 0}
section.alt{background:linear-gradient(180deg,#F3F6FB,#EEF2F9)}
/* section labels: the red text, now a clear pill */
.eyebrow{display:inline-flex;align-items:center;gap:8px;font:700 18px/1.4 var(--display);color:var(--pink);background:var(--pink-soft);padding:8px 20px;border-radius:999px;letter-spacing:0}
.eyebrow::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--pink)}
h2,.center h2{font:700 clamp(30px,3.6vw,46px)/1.3 var(--display);margin:16px 0 14px;color:var(--ink);text-wrap:balance;letter-spacing:-.2px}
.lead{font-size:19.5px;line-height:1.9;color:var(--muted);max-width:780px}
.center{margin-bottom:8px}.center .lead{margin-inline:auto}
h3{color:var(--ink)}
.tag{font:700 13.5px var(--body);padding:5px 12px;border-radius:999px;background:var(--sky);color:var(--blue)}
/* cards */
.card,.pcard,.price,.hcard,.ccard,.xcard{border-radius:22px}
.card{background:#fff;border:1px solid var(--line);box-shadow:0 18px 40px -32px rgba(20,33,61,.45)}
.card h3{font:700 20px/1.45 var(--display)}
.row2{gap:64px}
.row2 h2{margin-top:14px}
.shot{border-radius:20px;overflow:hidden;box-shadow:0 30px 70px -36px rgba(20,33,61,.55);border:1px solid var(--line)}
/* hero */
.hero{background:radial-gradient(900px 520px at 85% -10%,rgba(229,36,90,.12),transparent 65%),radial-gradient(900px 600px at 0% 0%,rgba(47,67,113,.10),transparent 60%),#fff}
.hero h1{letter-spacing:-.5px}
.hero .sub{font-size:21px}
.chips span{font-size:15px;padding:7px 14px;border-radius:999px;background:#fff;border:1px solid var(--line)}
/* exceptional features: a dark band so they stand out */
#features{background:radial-gradient(900px 500px at 90% 0%,rgba(229,36,90,.28),transparent 60%),linear-gradient(160deg,#14213D,#22335A 60%,#2B3F6C)!important;color:#fff}
#features h2{color:#fff}#features .lead{color:#C9D3EA}
#features .eyebrow{background:rgba(229,36,90,.18);color:#FF8FB0}#features .eyebrow::before{background:#FF5C8A}
#features .xcard{border:0;box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
.xcard .xt{padding:22px 24px 24px}.xcard h3{font-size:22px}.xcard p{font-size:16px;line-height:1.8}
.xcard .tag{background:var(--pink-soft);color:var(--pink)}
.xcard.xbig .tag{background:var(--pink);color:#fff}
/* "and also" grid */
.cgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:44px}
.ccard{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);overflow:hidden;text-decoration:none;transition:transform .15s,box-shadow .15s}
.ccard:hover{transform:translateY(-3px);box-shadow:0 24px 50px -28px rgba(20,33,61,.45)}
.ccard .ci{aspect-ratio:4/3;background:#EEF2F9;overflow:hidden;border-bottom:1px solid var(--line)}.ccard .ci img{width:100%;height:100%;object-fit:cover;object-position:top}
.ccard .ct{padding:18px 18px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
.ccard h3{margin:0;font:700 19px/1.4 var(--display)}.ccard p{margin:0;color:var(--muted);font-size:15px;line-height:1.75}
.ccard u{text-decoration:none;color:var(--blue);font-weight:700;margin-top:auto;padding-top:8px;font-size:15px}
@media (max-width:1000px){.cgrid{grid-template-columns:1fr 1fr}}@media (max-width:560px){.cgrid{grid-template-columns:1fr}}
/* help: 3 columns with video */
.hgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:44px}
.hcard{background:#fff;border:1px solid var(--line);overflow:hidden;display:flex;flex-direction:column}
.hcard .hv video{width:100%;display:block;aspect-ratio:16/9;background:#000}
.hcard .hb{padding:20px 22px 24px}.hcard .eyebrow{font-size:14px;padding:5px 14px}
.hcard h3{font:700 20px/1.45 var(--display);margin:12px 0 8px}
.hcard ol{margin:0;padding-inline-start:20px;color:var(--muted);font-size:15.5px}
@media (max-width:900px){.hgrid{grid-template-columns:1fr}}
/* pricing */
#pricing .price{padding:32px}
.price .amt{font-size:46px}
/* feature pages */
.phero{padding:84px 0 40px}
.phero h1{font-size:clamp(34px,5vw,58px)}
.pbody section{padding:80px 0}
.pbody .center{margin-bottom:10px}
.qa h2{font-size:clamp(26px,3vw,36px)}
.ctaband{background:linear-gradient(135deg,#14213D,#2F4371 65%,#E5245A);color:#fff;padding:44px 24px}.ctaband h3{color:#fff;font-size:26px}
.ctaband .btn:not(.primary){background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}.ctaband .btn.primary{background:#fff;color:var(--blue);border-color:#fff}
@media (max-width:640px){section{padding:70px 0}.eyebrow{font-size:15px}.lead{font-size:17.5px}}
/* ===== v3: each card its own color, light features band ===== */
#features{background:linear-gradient(180deg,#FFFFFF,#F6F8FC)!important;color:var(--ink)}
#features h2{color:var(--ink)}#features .lead{color:var(--muted)}
#features .eyebrow{background:var(--pink-soft);color:var(--pink)}#features .eyebrow::before{background:var(--pink)}
#features .xcard{border:1px solid var(--line);box-shadow:0 18px 40px -30px rgba(20,33,61,.4)}
.xgrid>.xcard:nth-child(1),.cgrid>.ccard:nth-child(1){--c:#E5245A;--t:#FDE9EF}
.xgrid>.xcard:nth-child(2),.cgrid>.ccard:nth-child(2){--c:#12A36B;--t:#E3F6EE}
.xgrid>.xcard:nth-child(3),.cgrid>.ccard:nth-child(3){--c:#7B4DDB;--t:#F0EAFC}
.xgrid>.xcard:nth-child(4),.cgrid>.ccard:nth-child(4){--c:#F08A24;--t:#FEF1E3}
.xgrid>.xcard:nth-child(5),.cgrid>.ccard:nth-child(5){--c:#1E6FE0;--t:#E6F0FD}
.xgrid>.xcard:nth-child(6),.cgrid>.ccard:nth-child(6){--c:#0F9DAE;--t:#E1F5F7}
.cgrid>.ccard:nth-child(7){--c:#C2410C;--t:#FCEDE5}
.cgrid>.ccard:nth-child(8){--c:#3949AB;--t:#E8EAF7}
.xcard,.ccard{border-top:5px solid var(--c)!important}
.xcard .xt,.ccard .ct{background:linear-gradient(180deg,var(--t),#fff 70%)}
.xcard h3,.ccard h3{color:var(--c)!important}
.xcard .tag,.xcard.xbig .tag{background:var(--c)!important;color:#fff!important}
.xcard u,.ccard u{color:var(--c)!important}
.xcard:hover,.ccard:hover{box-shadow:0 26px 50px -26px var(--c)!important}
.xcard .xi,.ccard .ci{border-bottom:1px solid var(--line)}
/* hero with the device photo */
.hgrid2{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:48px;align-items:center;text-align:start}
.hgrid2 .ctas{justify-content:flex-start}.hgrid2 .pill{margin-inline:0}
.hgrid2 h1{font-size:clamp(34px,4.4vw,58px)}
.hdev{margin:0;position:relative;border-radius:28px;overflow:hidden;box-shadow:0 40px 90px -40px rgba(20,33,61,.6);border:1px solid var(--line);aspect-ratio:4/4.4;background:#EEF2F9}
.hdev img{width:100%;height:100%;object-fit:cover;object-position:center 62%}
.hdev figcaption{position:absolute;inset:auto 14px 14px 14px;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border-radius:16px;padding:12px 16px;display:flex;flex-direction:column;gap:2px;text-align:start}
.hdev figcaption b{font:700 18px var(--display);color:var(--blue);direction:ltr;text-align:right}.hdev figcaption span{font-size:14px;color:var(--muted)}
.hero .chips{margin-top:40px}
@media (max-width:900px){.hgrid2{grid-template-columns:1fr;gap:28px;text-align:center}.hgrid2 .ctas{justify-content:center}.hgrid2 .pill{margin-inline:auto}.hdev{max-width:460px;margin:0 auto}}
/* patent strip under the logo bar */
.patbar{background:#14213D;color:#E6EBF5;font-size:13.5px;line-height:1.6}
.patbar .wrap{display:flex!important;flex-wrap:wrap;gap:4px 10px;align-items:center;justify-content:center;height:auto!important;padding:7px 0;text-align:center}
.patbar b{color:#fff}.patbar .sep{opacity:.5}
@media (max-width:700px){.patbar{font-size:12px}.patbar .sep{display:none}.patbar .wrap>span{flex-basis:100%}}
.mpanel{top:calc(100% + 6px)}
/* ===== v4: uniform, tidy feature cards ===== */
.xgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.xcard.xbig,.xcard.xwide{grid-column:auto!important;flex-direction:column!important}
.xcard{border:1px solid var(--line)!important;border-top:1px solid var(--line)!important;border-radius:24px;background:#fff;position:relative}
.xcard .xi,.ccard .ci{aspect-ratio:16/11!important;min-height:0!important;flex:none!important;background:var(--t)!important;padding:16px;border-bottom:0!important}
.xcard .xi img,.ccard .ci img{width:100%;height:100%;object-fit:contain!important;object-position:center!important;border-radius:12px;background:#fff;box-shadow:0 10px 24px -16px rgba(20,33,61,.45)}
.xcard .xt,.ccard .ct{background:#fff!important;padding:22px 24px 24px!important;gap:8px;position:relative}
.xic{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;font-size:26px;background:var(--t);border:2px solid #fff;box-shadow:0 8px 18px -10px var(--c);margin-top:-48px;margin-bottom:4px}
.xcard .tag,.xcard.xbig .tag{position:absolute;top:22px;inset-inline-end:24px;background:var(--t)!important;color:var(--c)!important;font-size:13px}
.xcard h3{font-size:22px!important;line-height:1.4}.xcard p{font-size:16px;line-height:1.8;color:var(--muted)}
.xcard u,.ccard u{display:inline-flex;align-items:center;gap:6px;padding-top:12px}
.xcard::before,.ccard::before{content:'';position:absolute;inset:0 0 auto 0;height:5px;background:var(--c);border-radius:24px 24px 0 0;z-index:1}
.xcard,.ccard{border-top-width:1px!important}
.ccard{border-radius:22px;position:relative}
.ccard .xic{width:44px;height:44px;font-size:22px;border-radius:14px;margin-top:-40px}
.ccard .ct{padding:18px 18px 20px!important}
@media (max-width:1000px){.xgrid{grid-template-columns:1fr 1fr}}@media (max-width:640px){.xgrid{grid-template-columns:1fr}}
.xcard .xt{position:static!important}
.xcard .tag,.xcard.xbig .tag{top:26px!important;inset-inline-end:auto!important;inset-inline-start:26px;z-index:2;background:var(--c)!important;color:#fff!important;box-shadow:0 6px 14px -8px rgba(0,0,0,.4)}

/* منتجاتنا */
.prods{padding:56px 0 30px}.pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-width:1080px;margin:22px auto 0}
.pcard{display:flex;flex-direction:column;gap:6px;border-radius:22px;padding:22px 22px 20px;color:#14213D;text-decoration:none;border:1px solid var(--line);transition:transform .15s,box-shadow .15s}
.pcard:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(20,33,61,.10)}
.pcard.p1{background:#EEF4FF}.pcard.p2{background:#EFFAF4}.pcard.p3{background:#FFF4EC}
.pcard .pic{font-size:30px}.pcard b{font:800 21px var(--display);direction:ltr;text-align:right}.pcard em{font-style:normal;font-weight:700;color:#C2185B}
.pcard p{margin:4px 0 6px;color:#3D4A66;font-size:15.5px;line-height:1.8}.pcard u{text-decoration:none;font-weight:700;color:#1E3A8A;margin-top:auto}
@media(max-width:820px){.pgrid{grid-template-columns:1fr}}

@media (max-width:1100px){nav>a.navhome{display:inline-flex!important;align-items:center;font-weight:700}}

.lgal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;max-width:1180px;margin:24px auto 0}
.lgal figure{margin:0;background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 10px 26px rgba(20,33,61,.07)}
.lgal img{display:block;width:100%;height:auto;border-bottom:1px solid var(--line)}
.lgal figcaption{padding:12px 16px 14px;display:flex;flex-direction:column;gap:3px}.lgal figcaption b{font:700 17px var(--display)}.lgal figcaption span{color:var(--muted);font-size:14.5px;line-height:1.7}
@media(max-width:820px){.lgal{grid-template-columns:1fr}}
/* ===== colored nav tabs ===== */
nav{gap:6px;align-items:center}
nav a.nl,.mm>button.nl{--c:#3730A3;--t:#EEF2FF;display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:999px;background:var(--t);color:var(--c);font-size:14.5px;font-weight:700;white-space:nowrap;text-decoration:none;border:1px solid color-mix(in srgb,var(--c) 16%,transparent);transition:transform .15s,box-shadow .15s,background .15s,color .15s;line-height:1.3}
nav a.nl i,.mm>button.nl i{font-style:normal;font-size:15px;line-height:1}
nav a.nl:hover,.mm>button.nl:hover,.mm.open>button.nl{transform:translateY(-2px);box-shadow:0 8px 18px -8px color-mix(in srgb,var(--c) 60%,transparent);background:color-mix(in srgb,var(--t) 70%,var(--c) 12%);color:var(--c)}
nav a.nl.on{background:var(--c);color:#fff;border-color:var(--c);box-shadow:0 8px 18px -8px color-mix(in srgb,var(--c) 70%,transparent)}
.n-home{--c:#3730A3!important;--t:#EEF2FF!important}.n-feat{--c:#BE185D!important;--t:#FFF0F6!important}.n-voice{--c:#6D28D9!important;--t:#F5F0FF!important}
.n-mkt{--c:#C2410C!important;--t:#FFF4EA!important}.n-xr{--c:#0E7490!important;--t:#E8FBFD!important}.n-lab{--c:#15803D!important;--t:#EDFCF2!important}
.n-price{--c:#A16207!important;--t:#FFF9DB!important}.n-faq{--c:#0369A1!important;--t:#EBF6FF!important}.n-wa{--c:#047857!important;--t:#E7FAF2!important}
@media (max-width:1500px){nav a.nl,.mm>button.nl{padding:6px 10px;font-size:13.5px;gap:4px}nav{gap:4px}}
@media (max-width:1280px){nav a.nl i{display:none}}
@media (max-width:1100px){nav a.nl:not(.navhome){display:none}nav a.nl i{display:inline}}
.top .wrap{width:min(1560px,100% - 32px);gap:14px}.top .wrap>a:first-child,.top .logo,.top .brand{flex-shrink:0}.top .wrap>.btn{flex-shrink:0}
/* ===== manage.html + home «إدارة العيادة» ===== */
.mgrow{display:grid;grid-template-columns:1.15fr 1fr;gap:34px;align-items:center;margin:0 auto 54px;max-width:1080px}.mgrow.rev .mgimg{order:2}
.mgimg{background:#fff;border:1px solid var(--line);border-radius:18px;padding:10px;box-shadow:0 30px 70px -40px rgba(20,33,61,.45)}.mgimg img{display:block;width:100%;height:auto;max-height:520px;object-fit:contain;border-radius:12px}
.mgtx h3{font:800 26px/1.4 var(--display);margin:8px 0}.mgtx p{color:var(--muted);font-size:17px;line-height:1.9;margin:0}.mgic{font-size:34px}
.mggrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:26px}.mgm{display:flex;gap:12px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px 16px}.mgm span{font-size:24px}.mgm b{display:block;font-size:16px}.mgm small{color:var(--muted);font-size:14px}
.mgtiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:30px}.mgt{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;text-decoration:none;color:var(--ink);transition:transform .15s,box-shadow .15s}.mgt:hover{transform:translateY(-3px);box-shadow:0 20px 50px -30px rgba(20,33,61,.5)}
.mgt img{width:100%;height:190px;object-fit:cover;object-position:top;border-bottom:1px solid var(--line);background:#F7F9FD}.mgt b{padding:12px 14px;font-size:16px}
@media (max-width:900px){.mgrow{grid-template-columns:1fr;gap:16px}.mgrow.rev .mgimg{order:0}.mggrid,.mgtiles{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.mggrid,.mgtiles{grid-template-columns:1fr}.mgtx h3{font-size:22px}}
@media (max-width:600px){nav a.nl.navhome{display:none!important}.top .wrap>a:first-child img{width:118px;height:auto}.top .wrap>.btn.sm{padding:8px 12px;font-size:13px}.mm>button.nl{padding:6px 10px;font-size:13px}}
@media (max-width:420px){#mkQ{min-width:0!important;width:100%!important;box-sizing:border-box}#mkQ{flex:1 1 100%}}