/* SX Use Cases. monday-style layout in the site identity.
   Rules: no bold, no shadows, Arabic + English, Thmanyah Serif headings. */
.sxuc{--g:#048238;--g2:#036b2e;--gs:#e7f5ec;--ink:#14201a;--tx:#2b3631;--mu:#5d6a63;--line:#e3e9e5;--soft:#f4f7f5;--red:#c0443f;--rs:#fdeeed;
	--head:"Thmanyah Serif","Almarai","Barlow",Georgia,serif;
	font-family:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--tx);font-size:16px;line-height:1.7;background:#fff;text-align:start;overflow-x:clip}
.sxuc[lang="ar"]{font-family:"Almarai",Tahoma,system-ui,sans-serif}
.sxuc *,.sxuc *::before,.sxuc *::after{box-sizing:border-box;font-weight:400!important;box-shadow:none!important}
.sxuc [hidden]{display:none!important}
.sxuc a{text-decoration:none}
.sxuc img{display:block;max-width:100%;height:auto}
.sxuc .screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.sxuc-wrap{width:100%;max-width:1240px;margin:0 auto;padding:0 24px}
.sxuc-wrap.is-narrow{max-width:900px;text-align:center}
.sxuc-ic{display:inline-block;flex:0 0 auto;vertical-align:middle}
.sxuc[dir="rtl"] .sxuc-ic.is-arrow{transform:scaleX(-1)}

/* Type */
.sxuc-eyebrow{display:flex;align-items:center;gap:8px;margin:0 0 14px;color:var(--g);font-size:15px;line-height:1.4}
.sxuc-wrap.is-narrow .sxuc-eyebrow{justify-content:center}
.sxuc-h1{margin:0 0 18px;font-family:var(--head);font-size:clamp(34px,4.6vw,58px);line-height:1.18;letter-spacing:-.01em;color:var(--ink)}
.sxuc[lang="en"] .sxuc-h1{letter-spacing:-.025em;line-height:1.1}
.sxuc-h2{margin:0 0 16px;font-family:var(--head);font-size:clamp(28px,3.2vw,42px);line-height:1.25;color:var(--ink)}
.sxuc[lang="en"] .sxuc-h2{letter-spacing:-.02em}
.sxuc-h2.is-center{text-align:center;margin-bottom:40px}
.sxuc-lead{margin:0;max-width:640px;color:var(--mu);font-size:clamp(16px,1.4vw,19px);line-height:1.8}
.sxuc-p{margin:0;color:var(--mu);font-size:17px;line-height:1.85}

/* Buttons */
.sxuc-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:12px 26px;border:1px solid var(--g);border-radius:999px;background:var(--g);color:#fff!important;font-size:16px;line-height:1.2;transition:background .2s,border-color .2s;cursor:pointer}
.sxuc-btn:hover,.sxuc-btn:focus-visible{background:var(--g2);border-color:var(--g2);color:#fff!important}
.sxuc-btn.is-line{background:#fff;color:var(--ink)!important;border-color:#cfd8d3}
.sxuc-btn.is-line:hover,.sxuc-btn.is-line:focus-visible{background:var(--gs);border-color:var(--g);color:var(--g)!important}
.sxuc-btn .sxuc-ic.is-arrow{transition:transform .25s}
.sxuc-btn:hover .sxuc-ic.is-arrow{transform:translateX(3px)}
.sxuc[dir="rtl"] .sxuc-btn:hover .sxuc-ic.is-arrow{transform:scaleX(-1) translateX(3px)}
.sxuc-link{display:inline-flex;align-items:center;gap:6px;color:var(--g)!important;font-size:15px}
.sxuc-link:hover{text-decoration:underline;text-underline-offset:4px}

/* Hero: listing */
.sxuc-hero{padding:64px 0 40px}
.sxuc-hero.is-hub{text-align:center;padding-top:72px}
.sxuc-hero.is-hub .sxuc-eyebrow{justify-content:center}
.sxuc-hero.is-hub .sxuc-lead{margin:0 auto}
.sxuc-tools{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;max-width:760px;margin:34px auto 18px}
.sxuc-search{position:relative;flex:1 1 380px;display:flex;align-items:center}
.sxuc-search .sxuc-ic{position:absolute;inset-inline-start:18px;color:var(--mu);pointer-events:none}
.sxuc .sxuc-search input{width:100%;height:54px;margin:0;padding:0 20px;padding-inline-start:48px;border:1px solid #d3ddd7;border-radius:999px;background:#fff;color:var(--ink);font:inherit;font-size:16px;outline:none;transition:border-color .15s}
.sxuc .sxuc-search input:focus{border-color:var(--g);outline:3px solid rgba(4,130,56,.12)}
.sxuc-role{flex:0 1 240px}
.sxuc .sxuc-role select{width:100%;height:54px;margin:0;padding:0 20px;padding-inline-end:44px;border:1px solid #d3ddd7;border-radius:999px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%235d6a63' stroke-width='1.6'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 20px center;color:var(--ink);font:inherit;font-size:15px;-webkit-appearance:none;appearance:none;cursor:pointer;outline:none}
.sxuc[dir="rtl"] .sxuc-role select{background-position:left 20px center}
.sxuc .sxuc-role select:focus{border-color:var(--g)}
.sxuc-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:980px;margin:0 auto}
.sxuc .sxuc-chip{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 16px;border:1px solid transparent;border-radius:999px;background:var(--soft);color:var(--tx);font:inherit;font-size:14.5px;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.sxuc .sxuc-chip:hover{background:#e9efeb;color:var(--ink)}
.sxuc .sxuc-chip.is-on,.sxuc .sxuc-chip.is-on:hover{background:var(--gs);color:var(--g);border-color:#bfe2cc}
.sxuc .sxuc-chip:focus-visible{outline:2px solid var(--g);outline-offset:2px}

/* Cards */
.sxuc-list{padding:8px 0 72px}
.sxuc-count{margin:0 0 16px;color:var(--mu);font-size:14px;text-align:center}
.sxuc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.sxuc-card{position:relative;display:flex;flex-direction:column;gap:10px;min-height:236px;padding:24px;border:1px solid var(--line);border-radius:20px;background:#fff;color:var(--tx)!important;transition:border-color .2s,transform .2s,background .2s}
.sxuc-card.is-ready:hover,.sxuc-card.is-ready:focus-visible{border-color:var(--g);transform:translateY(-3px);outline:none}
.sxuc-card.is-soon{background:#fbfcfb}
.sxuc-card-top{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.sxuc-card-ic{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--gs);color:var(--g)}
.sxuc-card.is-soon .sxuc-card-ic{background:var(--soft);color:var(--mu)}
.sxuc-card-cat{color:var(--g);font-size:13.5px}
.sxuc-card.is-soon .sxuc-card-cat{color:var(--mu)}
.sxuc-card-n{margin-inline-start:auto;color:#9aa6a0;font-size:13px;unicode-bidi:isolate}
.sxuc-card-t{font-family:var(--head);font-size:21px;line-height:1.35;color:var(--ink)}
.sxuc-card-d{color:var(--mu);font-size:15px;line-height:1.7}
.sxuc-card-go{display:inline-flex;align-items:center;gap:6px;margin-top:auto;padding-top:8px;color:var(--g);font-size:14.5px}
.sxuc-card.is-soon .sxuc-card-go{color:#9aa6a0}
.sxuc-card.is-ready:hover .sxuc-card-go .sxuc-ic{transform:translateX(3px)}
.sxuc[dir="rtl"] .sxuc-card.is-ready:hover .sxuc-card-go .sxuc-ic{transform:scaleX(-1) translateX(3px)}
.sxuc-empty{margin:24px 0 0;padding:28px;border:1px dashed #cfd8d3;border-radius:16px;color:var(--mu);text-align:center}

/* Bottom band */
.sxuc-band{padding:0 0 88px}
.sxuc-band-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px;padding:40px 48px;border-radius:28px;background:var(--gs)}
.sxuc-band-in .sxuc-h2{margin-bottom:6px;font-size:clamp(24px,2.4vw,32px)}
.sxuc-band-in p{margin:0;color:var(--mu)}

/* Hero: one use case */
.sxuc-hero.is-case{padding:28px 0 72px}
.sxuc-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 36px;color:var(--mu);font-size:14px}
.sxuc-crumbs a{color:var(--mu)!important}
.sxuc-crumbs a:hover{color:var(--g)!important}
.sxuc-crumbs [aria-current]{color:var(--ink)}
.sxuc-hero-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;align-items:center}
.sxuc-actions{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0 18px}
.sxuc-for{margin:0;color:var(--mu);font-size:14px}
.sxuc-shot{position:relative;margin:0;padding:12px;border-radius:24px;background:var(--soft);border:1px solid var(--line)}
.sxuc-shot img{border-radius:14px;border:1px solid #e1e7e3;background:#fff}
.sxuc-shot figcaption,.sxuc-note{margin:10px 4px 0;color:#8a958f;font-size:12.5px;text-align:center}

/* Sections */
.sxuc-sec{padding:88px 0}
.sxuc-sec.is-soft{background:var(--soft)}
.sxuc-sec-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:28px}
.sxuc-sec-head .sxuc-h2{margin:0}
.sxuc-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start}
.sxuc-pains{display:grid;gap:12px}
.sxuc-pain{display:flex;gap:16px;padding:20px 22px;border:1px solid var(--line);border-radius:18px;background:#fff}
.sxuc-pain-ic{display:grid;place-items:center;flex:0 0 40px;height:40px;border-radius:12px;background:var(--rs);color:var(--red)}
.sxuc-pain h3,.sxuc-box h3{margin:0 0 4px;font-family:inherit;font-size:17px;line-height:1.5;color:var(--ink)}
.sxuc-pain p,.sxuc-box p{margin:0;color:var(--mu);font-size:15px;line-height:1.75}
.sxuc-statement{margin:0;font-family:var(--head);font-size:clamp(22px,2.4vw,31px);line-height:1.65;color:var(--ink)}
.sxuc[lang="en"] .sxuc-statement{line-height:1.5}

/* Steps */
.sxuc-steps{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:48px;align-items:start}
.sxuc-steps-list{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.sxuc-step{margin:0}
.sxuc .sxuc-step>button{position:relative;display:flex;gap:16px;width:100%;max-width:100%;margin:0;padding:18px 20px;border:1px solid transparent;border-radius:18px;background:transparent;color:var(--tx);font:inherit;line-height:1.6;text-align:start;white-space:normal;text-transform:none;cursor:pointer;overflow:hidden;transition:background .2s,border-color .2s}
/* Theme buttons are nowrap and turn purple on hover: keep the steps readable and in the site colours. */
.sxuc .sxuc-step>button,.sxuc .sxuc-step>button *{white-space:normal!important;overflow-wrap:anywhere}
.sxuc .sxuc-step>button:hover,.sxuc .sxuc-step>button:focus{background:var(--soft)!important;color:var(--tx)!important;border-color:transparent}
.sxuc .sxuc-step.is-on>button,.sxuc .sxuc-step.is-on>button:hover,.sxuc .sxuc-step.is-on>button:focus{background:#fff!important;border-color:var(--line)!important;color:var(--tx)!important}
.sxuc .sxuc-chip,.sxuc .sxuc-chip *{white-space:nowrap}
.sxuc .sxuc-chip:focus{background:var(--soft);color:var(--tx)}
.sxuc .sxuc-chip.is-on:focus{background:var(--gs);color:var(--g)}
.sxuc .sxuc-steps-list{min-width:0}
.sxuc .sxuc-step>button:focus-visible{outline:2px solid var(--g);outline-offset:2px}
.sxuc-step-n{display:grid;place-items:center;flex:0 0 34px;height:34px;border-radius:999px;background:var(--soft);color:var(--mu);font-size:15px;direction:ltr;transition:background .2s,color .2s}
.sxuc-step.is-on .sxuc-step-n{background:var(--g);color:#fff}
.sxuc-step-tx{display:grid;gap:4px;min-width:0}
.sxuc-step-t{font-size:17px;line-height:1.5;color:var(--ink)}
.sxuc-step-d{display:none;color:var(--mu);font-size:15px;line-height:1.75}
.sxuc-step.is-on .sxuc-step-d{display:block}
.sxuc-step-bar{position:absolute;inset-inline:20px;bottom:0;height:2px;background:transparent;overflow:hidden}
.sxuc-step-bar i{display:block;width:0;height:100%;background:var(--g)}
.sxuc-steps.is-auto .sxuc-step.is-on .sxuc-step-bar i{animation:sxuc-bar var(--sxuc-t,7s) linear forwards}
@keyframes sxuc-bar{to{width:100%}}
.sxuc-steps-view{position:sticky;top:96px}
.sxuc-shot.is-pane{animation:sxuc-in .35s ease}
.sxuc-shot.is-pane img{width:100%;aspect-ratio:1400/767;object-fit:contain;object-position:center top;background:#f5f6f6}
@keyframes sxuc-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.sxuc-shot.is-inline{display:none}

/* Outcome and role cards */
.sxuc-cards3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.sxuc-box{padding:28px;border-radius:20px;background:#fff;border:1px solid var(--line)}
.sxuc-box-ic{display:grid;place-items:center;width:44px;height:44px;margin-bottom:18px;border-radius:12px;background:var(--soft);color:var(--ink)}
.sxuc-box-ic.is-ok{background:var(--gs);color:var(--g)}

/* FAQ */
.sxuc-faq{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:56px;align-items:start}
.sxuc-faq .sxuc-h2{position:sticky;top:96px}
.sxuc-faq-list details{border-bottom:1px solid #cfd8d3}
.sxuc-faq-list details:first-child{border-top:1px solid #cfd8d3}
.sxuc-faq-list summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 0;list-style:none;cursor:pointer;color:var(--ink);font-size:18px;line-height:1.5}
.sxuc-faq-list summary::-webkit-details-marker{display:none}
.sxuc-faq-list summary:focus-visible{outline:2px solid var(--g);outline-offset:4px;border-radius:6px}
.sxuc-faq-list summary i{position:relative;flex:0 0 22px;height:22px}
.sxuc-faq-list summary i::before,.sxuc-faq-list summary i::after{content:"";position:absolute;top:10px;inset-inline:3px;height:1.6px;background:var(--ink);transition:transform .25s}
.sxuc-faq-list summary i::after{transform:rotate(90deg)}
.sxuc-faq-list details[open] summary i::after{transform:rotate(0)}
.sxuc-faq-list details p{margin:0;padding:0 0 22px;color:var(--mu);font-size:16px;line-height:1.85;max-width:720px}
.sxuc-grid.is-3{grid-template-columns:repeat(3,minmax(0,1fr))}

/* Demo request */
.sxuc-sec.is-demo{padding-top:24px}
.sxuc-demo{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:48px;align-items:start;padding:48px;border-radius:32px;background:var(--gs)}
.sxuc-ticks{display:grid;gap:10px;margin:24px 0 0;padding:0;list-style:none}
.sxuc-ticks li{display:flex;gap:10px;align-items:flex-start;color:var(--tx);font-size:15.5px}
.sxuc-ticks .sxuc-ic{margin-top:4px;color:var(--g)}
.sxuc-demo-form{padding:32px;border-radius:24px;background:#fff}
.sxuc-demo-form .sxf{font-size:15px}

/* Responsive */
@media (max-width:1024px){
	.sxuc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.sxuc-hero-grid,.sxuc-split,.sxuc-faq,.sxuc-demo{grid-template-columns:minmax(0,1fr);gap:36px}
	.sxuc-faq .sxuc-h2{position:static}
	.sxuc-steps{grid-template-columns:minmax(0,1fr)}
	.sxuc-steps-view{display:none}
	.sxuc-shot.is-inline{display:block;margin:4px 0 12px}
	.sxuc-step-d{display:block}
	.sxuc-step .sxuc-step-n{background:var(--g);color:#fff}
	.sxuc .sxuc-step>button{cursor:default;background:transparent!important;border-color:transparent!important;padding-inline:0}
	.sxuc-step-bar{display:none}
	.sxuc-cards3,.sxuc-grid.is-3{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
	.sxuc-wrap{padding:0 16px}
	.sxuc-grid{grid-template-columns:minmax(0,1fr)}
	.sxuc-hero{padding:40px 0 24px}
	.sxuc-hero.is-case{padding:20px 0 48px}
	.sxuc-sec{padding:56px 0}
	.sxuc-band-in,.sxuc-demo{padding:28px 20px;border-radius:24px}
	.sxuc-demo-form{padding:20px 16px}
	.sxuc-card{min-height:0}
	.sxuc-shot{padding:8px;border-radius:18px}
	.sxuc-shot img{border-radius:10px}
	.sxuc-actions .sxuc-btn{flex:1 1 100%}
	.sxuc .sxuc-chips{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;padding-bottom:6px;margin-inline:-16px;padding-inline:16px;scrollbar-width:none}
	.sxuc .sxuc-chip{flex:0 0 auto}
}
@media (prefers-reduced-motion:reduce){
	.sxuc *{animation:none!important;transition:none!important}
}
