/* build 20260925 */
/* SmartLoop Technology — site.css: page components for the redesigned pages (DESIGN-SPEC §6.8–§6.20, §6.22–§6.25).
   Tokens only; pages place components, they never restyle their insides. */

/* sections and heads */
.ui-section{padding-block:var(--section-y);overflow-x:clip}
.ui-section--tint{background:var(--surface-2)}
.ui-section--flush{padding-top:0}  /* CTA after an untinted section */
.ui-sechead{max-width:44rem;margin-bottom:var(--s-7)}
.ui-sechead--center{margin-inline:auto;text-align:center}
.ui-sub{margin:12px 0 0;color:var(--muted)}

/* device frame (§6.10) */
.ui-device{--w:260px;position:relative;isolation:isolate;display:block;margin:0;width:min(var(--w),78vw);padding:calc(var(--w)*.032);border-radius:calc(var(--w)*.165);background:#0E0E10;box-shadow:inset 0 0 0 1px rgb(255 255 255/.08),0 0 0 calc(var(--w)*.01) #2B2B2F,var(--sh-3)}
.ui-device__screen{position:relative;display:grid;aspect-ratio:9/19.5;border-radius:calc(var(--w)*.133);overflow:clip;background:#fff}
.ui-device__screen>img{grid-area:1/1;width:100%;height:100%;object-fit:cover;object-position:top}
.ui-device__screen>img:not(.is-active):not(:only-child){opacity:0}
@media (prefers-reduced-motion:no-preference){.ui-device__screen>img{transition:opacity var(--d-xfade) var(--ease-out),transform var(--d-xfade) var(--ease-out)}.ui-device__screen>img:not(.is-active):not(:only-child){transform:scale(1.02)}}
.ui-device--crop{margin-bottom:calc(var(--w)*-.65)}

/* heroes (§6.9) */
.ui-hero{position:relative;isolation:isolate;overflow:clip;background:linear-gradient(160deg,var(--hero-a) 0%,var(--hero-b) 55%,var(--hero-c) 100%)}
.ui-hero__bg,.ui-pagehero__bg,.ui-cta__bg{position:absolute;inset:0;z-index:-1;overflow:clip;pointer-events:none}
.ui-orb{position:absolute;width:clamp(280px,48vw,680px);aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,var(--orb-1),transparent)}
.ui-orb--a{top:-18%;inset-inline-end:-10%}
.ui-orb--b{bottom:-35%;inset-inline-end:20%;background:radial-gradient(closest-side,var(--orb-2),transparent)}
/* blueprint grid: white on dark heroes, brand-tinted on the page hero */
.ui-hero__grid,.ui-pagehero__grid{--g:rgb(255 255 255/.06);--m:radial-gradient(ellipse at calc(50% + 20%*var(--dir)) 40%,#000,transparent 70%);position:absolute;inset:0;background:linear-gradient(var(--g) 1px,transparent 1px),linear-gradient(90deg,var(--g) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:var(--m);mask-image:var(--m)}
.ui-pagehero__grid{--g:color-mix(in srgb,var(--brand-strong) 8%,transparent);--m:radial-gradient(ellipse at calc(50% + min(340px,28vw)*var(--dir)) 50%,#000,transparent 70%)}
@media (prefers-reduced-motion:no-preference){.ui-hero--company .ui-orb{animation:ui-drift 24s var(--ease-inout) 2 alternate}.ui-hero--company .ui-orb--b{animation-duration:30s}.is-offscreen .ui-orb{animation-play-state:paused}}
@keyframes ui-drift{to{transform:translate3d(calc(6vw*var(--dir)),4vh,0) scale(1.08)}}
.ui-hero__inner{display:grid;gap:var(--s-7);align-items:center;padding-block:clamp(56px,9vw,120px)}
@media (min-width:900px){.ui-hero__inner{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}}
.ui-hero__copy{min-width:0}
.ui-hero__copy>.ui-eyebrow{margin-bottom:var(--s-4)}
.ui-hero__copy .ui-lead{max-width:34rem;margin:var(--s-5) 0 0;color:var(--on-dark-muted)}
/* 900–1199 px: one Arabic beat per line, so the webfont swap cannot rewrap the H1 */
@media (min-width:900px) and (max-width:1199px){.ui-hero--company .ui-display:lang(ar) .ui-beat{display:block}}
.ui-hero__ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:var(--s-6)}
@media (max-width:599px){.ui-hero--company .ui-hero__ctas .ui-btn{flex:1 1 auto}}
.ui-hero__visual{display:flex;flex-direction:column;align-items:center;min-width:0}
.ui-duo{display:flex;align-items:flex-start;justify-content:center;gap:14px}
.ui-duo__item{--dw:min(150px,38vw);display:flex;flex-direction:column;align-items:center;gap:18px;width:var(--dw);border-radius:var(--r-lg);color:var(--on-dark);text-decoration:none!important}
.ui-duo__item--front{--dw:min(170px,43vw);margin-top:48px}
.ui-duo .ui-device{box-shadow:inset 0 0 0 1px rgb(255 255 255/.08),0 0 0 calc(var(--w)*.01) #2B2B2F,0 40px 70px -30px rgb(0 0 0/.6),0 20px 40px -20px rgb(0 0 0/.4);transition:translate var(--tf)}
.ui-duo__item .ui-device{--w:var(--dw)}
.ui-duo__item--back .ui-device{rotate:calc(-6deg*var(--dir))}
.ui-duo__item--front .ui-device{rotate:calc(4deg*var(--dir))}
/* ≥ 900 px the duo scales with its 355–518 px column (518 px = the fixed 210/230 px duo); 640 px tall so the copy's font swap cannot move the hero */
.ui-hero--company .ui-hero__visual{container-type:inline-size}
@media (min-width:900px){.ui-hero--company .ui-hero__visual{min-height:640px;justify-content:center}.ui-duo{gap:min(60px,calc(5vw - 6px))}.ui-duo__item--back{--dw:min(210px,calc(17.5vw - 20px))}.ui-duo__item--front{--dw:min(230px,calc(19.2vw - 22px));margin-top:min(72px,calc(6vw - 7px))}}
@supports (width:1cqi){@media (min-width:900px){.ui-duo{gap:min(60px,11.57cqi)}.ui-duo__item--back{--dw:min(210px,40.5cqi)}.ui-duo__item--front{--dw:min(230px,44.37cqi);margin-top:min(72px,13.89cqi)}}}
@media (hover:hover) and (pointer:fine){.ui-duo__item:hover .ui-device{translate:0 -6px}}
.ui-duo__cap{display:inline-flex;align-items:center;gap:10px;width:max-content;max-width:min(320px,90vw);padding:6px;padding-inline-end:14px;border:1px solid rgb(255 255 255/.18);border-radius:var(--r-pill);background:rgb(255 255 255/.12);text-align:start}
.ui-duo__item--back .ui-duo__cap{align-self:flex-start}.ui-duo__item--front .ui-duo__cap{align-self:flex-end}
.ui-dark .ui-duo__item{--focus:var(--focus-on-dark)}
.ui-duo__cap .ui-appicon{box-shadow:none}
.ui-duo__cap strong{display:block;font-size:14px;font-weight:600;line-height:1.3;white-space:nowrap}
.ui-duo__cap small{display:block;font-size:14px;line-height:1.4;color:var(--on-dark-muted)}
.ui-duo__cap small :lang(en){font-size:13px}
/* descriptors only beside a full-size duo */
@media (max-width:1199px){.ui-duo__cap small{display:none}}
@media (max-width:359px){.ui-duo__cap{gap:6px;padding-inline-end:10px}.ui-duo__cap strong{font-size:13px}}
@container (max-width:517px){.ui-duo__cap small{display:none}}
.ui-hero--product .ui-appicon--lg{margin-bottom:var(--s-5);box-shadow:0 0 0 1px rgb(255 255 255/.16),0 16px 32px -14px rgb(0 0 0/.55)}
.ui-hero__name{color:var(--name-on-dark)}
.ui-hero__tagline{max-width:36rem;margin:var(--s-4) 0 0;font-size:20px;font-weight:600;line-height:1.6;color:var(--on-dark);text-wrap:balance}
.ui-hero__tagline:lang(en){line-height:1.45}
.ui-hero__copy .ui-stores{margin-top:var(--s-6)}
.ui-device--hero{--w:200px}
@media (min-width:900px){.ui-device--hero{--w:220px}}
.ui-hero__cyclebar{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:20px}
.ui-cycle-toggle{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid rgb(255 255 255/.18);border-radius:50%;background:rgb(255 255 255/.12);color:#fff;cursor:pointer;transition:background-color var(--tf)}
.ui-cycle-toggle:hover{background:rgb(255 255 255/.2)}
.ui-cycle-toggle[aria-pressed="false"] .ui-cycle-toggle__play,.ui-cycle-toggle[aria-pressed="true"] .ui-cycle-toggle__pause{display:none}
.ui-device__cap{min-width:9rem;margin:0;font-size:14px;line-height:1.5;color:var(--on-dark-muted)}
.ui-device__cap [data-cap]:not(.is-active){display:none}
@media (max-width:899px){.ui-hero--product .ui-hero__inner{padding-bottom:0}.ui-hero--product .ui-hero__cyclebar{order:-1;margin:0 0 20px}.ui-device--hero{margin-bottom:calc(var(--w)*-.65)}}
.ui-pagehero{position:relative;isolation:isolate;overflow:clip;padding-block:clamp(48px,7vw,88px);background:var(--surface-2);box-shadow:inset 0 -1px var(--line)}
.ui-pagehero .ui-orb--a{top:calc(50% - clamp(140px,24vw,340px));inset-inline-end:max(-6%,calc(50% - 680px))}
.ui-pagehero .ui-h1{color:var(--brand-strong)}
.ui-pagehero .ui-lead{max-width:40rem;margin:var(--s-4) 0 0;color:var(--muted);text-wrap:balance}

/* facts strip (§6.11) */
.ui-facts{padding-block:var(--s-6);background:var(--surface-2);box-shadow:inset 0 1px var(--line),inset 0 -1px var(--line)}
.ui-facts__list{margin:0;padding:0;list-style:none}
.ui-facts__list--stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.ui-stat{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;padding-inline:var(--s-4);text-align:center}
.ui-stat+.ui-stat{border-inline-start:1px solid var(--line)}
.ui-stat__num{display:block;height:1em;font-size:var(--fs-stat);font-weight:700;line-height:1;color:var(--brand)}
.ui-stat__num:lang(en){letter-spacing:-.02em}
.ui-stat__num bdi{display:inline-block}
.ui-stat__label{font-size:15px;line-height:1.5;color:var(--muted);text-wrap:balance}
.ui-facts__list--chips{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 32px}
.ui-fact{display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:600;line-height:1.5;color:var(--ink-strong)}
.ui-fact .ui-i{box-sizing:content-box;padding:6px;border-radius:50%;background:color-mix(in oklab,var(--accent) 28%,transparent);color:var(--brand)}
@media (max-width:599px){.ui-stat{padding-inline:6px}.ui-stat__label{font-size:14px}.ui-facts__list--chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 16px}}
/* phones: both products' fact strips become one list (a row per fact) */
@media (max-width:419px){.ui-facts__list--stats{grid-template-columns:minmax(0,1fr);margin-block:-12px}.ui-facts__list--stats .ui-stat{flex-direction:row;align-items:baseline;gap:16px;padding:12px 0;text-align:start}.ui-stat+.ui-stat{border-inline-start:0;border-top:1px solid var(--line)}.ui-facts__list--stats .ui-stat__num{flex:0 0 4.25rem;font-size:32px}.ui-facts__list--chips{grid-template-columns:minmax(0,1fr);gap:12px}}

/* intro + scatter → order (§6.12) */
.ui-intro{display:grid;gap:var(--s-7);align-items:center}
@media (min-width:900px){.ui-intro{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}}
.ui-intro__text{display:flex;flex-direction:column;gap:var(--s-4)}
.ui-intro__text .ui-h2{margin-bottom:var(--s-2)}
.ui-intro__text p{max-width:40rem;margin:0}
.ui-intro__text b,.ui-check b{font-weight:700;color:var(--ink-strong)}
.ui-bad{font-weight:600;color:var(--danger-ink)}
.ui-good{font-weight:700;color:var(--accent-ink)}
/* a framed stage; the stack (chips 34 px apart behind the card) is centred: padding-top = 34 px per chip */
.ui-scatter{--stack:2;--sx:1;--sy:1;display:grid;place-content:center;width:100%;max-width:440px;height:340px;margin-inline:auto;padding:calc(34px*var(--stack)) 16px 0;border-radius:var(--r-xl);background:radial-gradient(closest-side,color-mix(in oklab,var(--brand) 10%,transparent),transparent),var(--surface-2);box-shadow:inset 0 0 0 1px var(--line)}
.ui-scatter:has(>.ui-scatter__chip:nth-child(3)){--stack:3}
.ui-section--tint .ui-scatter{background-color:var(--surface)}
.ui-scatter>*{grid-area:1/1;place-self:center}
.ui-scatter__chip{z-index:calc(4 - var(--n));display:flex;align-items:flex-start;justify-content:center;min-width:min(230px,100vw - 2*var(--gutter) - 72px);min-height:52px;padding:6px 20px 8px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);color:var(--muted);font-size:14px;font-weight:600;line-height:1.4;text-align:center;box-shadow:var(--sh-1);transform:translate(0,calc(var(--lift,-12px) - 34px*var(--n))) scale(calc(1 - var(--n)*.05))}
.ui-scatter__chip--bad{text-decoration:line-through;text-decoration-color:color-mix(in oklab,var(--danger-ink) 55%,transparent)}
.ui-scatter__card{z-index:5;display:flex;align-items:center;gap:14px;min-width:min(290px,100vw - 2*var(--gutter) - 32px);max-width:100%;min-height:76px;padding:16px 22px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);color:var(--ink-strong);font-size:18px;font-weight:600;line-height:1.4;box-shadow:var(--sh-2)}
.ui-scatter__card img{width:40px;height:40px}
.ui-scatter__card>span{text-wrap:balance}
@media (prefers-reduced-motion:no-preference){
/* scattered while the stage fades in, then the chips glide into the stack; the dashes stay until they move */
.ui-scatter__chip{--td:calc(520ms + var(--n)*140ms);transition:transform 1000ms var(--ease-out) var(--td),border-color 300ms var(--td);transition:transform 1000ms var(--ease-out) var(--td),border-color 300ms var(--td),border-style 0s var(--td) allow-discrete}
.sl-motion .ui-scatter:not(.is-in) .ui-scatter__chip{transform:translate(calc(var(--x)*var(--dir)*var(--sx)),calc(var(--y)*var(--sy))) rotate(calc(var(--r)*var(--dir)));border-style:dashed;border-color:var(--line-strong);transition:none}}
@media (max-width:899px){.ui-scatter{height:260px}}
@media (max-width:599px){.ui-scatter{--sx:.45;--sy:.65;--lift:-6px}.ui-scatter__card{min-height:64px;padding:12px 16px;font-size:16px}.ui-scatter__card img{width:36px;height:36px}}
@media (max-width:359px){.ui-scatter__card{gap:10px;padding-inline:14px;font-size:15px}}
@media (min-width:900px) and (max-width:959px){.ui-scatter__card{gap:10px;padding-inline:16px}}

/* tour: sticky story (md-tall) or swipe cards (§6.13) */
.ui-story__label{margin:0 0 6px;font-size:14px;font-weight:600;line-height:1.5;color:var(--brand-strong)}
.ui-story__label :lang(en){font-size:12px;text-transform:uppercase;letter-spacing:.12em}
.ui-story__step>p:not(.ui-story__label){margin:10px 0 0;color:var(--muted)}
.ui-story__tags:not(:empty){margin-top:10px}
.ui-story__media{display:none}
.ui-story__steps{display:grid;margin-block:0;list-style:none;grid-auto-flow:column;grid-auto-columns:min(82vw,340px);gap:16px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding-inline:var(--gutter);margin-inline:calc(var(--gutter)*-1);scroll-padding-inline:var(--gutter);scrollbar-width:none}
.ui-story__steps::-webkit-scrollbar{display:none}
.ui-story__step{scroll-snap-align:center;padding:20px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg)}
.ui-story__inline{display:flex;justify-content:center;margin:0 0 20px;padding-block:8px;border-radius:calc(var(--r-lg) - 8px);background:var(--surface-2)}
.ui-story__nav{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:var(--s-5)}
.ui-paddle{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--line-strong);border-radius:50%;background:var(--surface);color:var(--ink-strong);cursor:pointer;transition:background-color var(--tf)}
.ui-paddle:hover{background:var(--surface-2)}
.ui-paddle[aria-disabled="true"]{opacity:.4;cursor:default;background:var(--surface)}
@media (min-width:600px){.ui-story__step{scroll-snap-align:start}}
@media (min-width:900px) and (max-height:599px){.ui-story__steps{grid-auto-columns:min(44vw,520px)}.ui-story__step{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:repeat(4,auto) 1fr;column-gap:20px;align-content:start}.ui-story__step>*{grid-column:2}.ui-story__inline{grid-column:1;grid-row:1/-1;align-self:start;margin:0;padding:8px}.ui-story__inline .ui-device{--w:140px!important}}
.ui-story__dots{display:flex;gap:8px;margin:0;padding:0;list-style:none}
.ui-story__dot{width:8px;height:8px;border-radius:50%;background:var(--line-strong);transition:background-color var(--tu),scale var(--tu)}
.ui-story__dot.is-active{background:var(--brand);scale:1.25}
@media (min-width:900px) and (min-height:600px){
.ui-story__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:clamp(32px,6vw,96px)}
.ui-story__steps{display:block;overflow:visible;margin:0;padding:0}
.ui-story__step{display:flex;flex-direction:column;justify-content:center;min-height:clamp(340px,46vh,480px);padding:0;padding-inline-start:var(--s-5);background:none;border:0;border-inline-start:2px solid var(--line);border-radius:0;transition:border-color var(--tu)}
.ui-story__step[data-current]{border-inline-start-color:var(--brand)}
.ui-story__inline,.ui-story__nav{display:none}
.ui-story__media{position:sticky;top:calc(var(--header-h) + var(--subnav-h) + 3vh);display:grid;align-self:start;justify-items:center;gap:var(--s-5)}
.ui-story__step .ui-h3{font-size:clamp(1.5rem,1rem + 1.2vw,1.875rem)}
.ui-story__step>p:not(.ui-story__label){max-width:32rem;font-size:var(--fs-lead)}
.ui-story__label{margin-bottom:10px;font-size:15px}
.ui-device--story{--w:min(280px,calc((100svh - var(--header-h) - var(--subnav-h) - 3vh - 56px)*.46))}}

/* feature chapters: grouped bento + APG accordion (§6.14) */
.ui-chapters__jump{margin-bottom:var(--s-6)}
.ui-chapters{display:grid;gap:var(--s-5)}
.ui-chapter{padding:clamp(20px,2.6vw,32px);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl)}
.ui-chapter__head{margin:0;font-size:1rem}
.ui-chapter__btn{appearance:none;display:flex;align-items:center;gap:16px;width:100%;min-height:44px;margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:start;cursor:default}
.ui-chapter__icon{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;border-radius:var(--r-md);background:var(--brand-soft);color:var(--brand)}
.ui-chapter__label{flex:1;font-size:20px;font-weight:600;line-height:1.4;color:var(--ink-strong)}
.ui-chapter__chev{display:none;color:var(--muted);transition:rotate var(--tu)}
.sl-js .ui-chapter__btn{cursor:pointer}
.sl-js .ui-chapter__chev{display:block}
.ui-chapter__btn[aria-expanded="true"] .ui-chapter__chev{rotate:180deg}
.ui-chapter__body{display:grid;gap:12px;margin-top:20px;grid-template-columns:minmax(0,1fr)}
.ui-chapter__body[hidden]{margin:0;padding:0}
@media (min-width:900px) and (max-width:1199px){.ui-chapter__body{grid-template-columns:repeat(2,minmax(0,1fr))}.ui-feat--lead{grid-column:1/-1}.ui-feat:last-child:nth-child(even){grid-column:1/-1}}
@media (min-width:1200px){.ui-chapter__body{grid-template-columns:repeat(3,minmax(0,1fr))}.ui-feat--lead{grid-column:span 2}.ui-feat:last-child:nth-child(3n){grid-column:span 3}.ui-feat:last-child:nth-child(3n+4){grid-column:span 2}}
.ui-feat{display:flex;flex-direction:column;gap:6px;padding:16px;border-radius:var(--r-lg);transition:background-color var(--tf)}
.ui-feat:hover{background:var(--surface-2)}
.ui-feat .ui-h4{position:relative;padding-inline-start:16px}
.ui-feat .ui-h4::before{content:"";position:absolute;inset-inline-start:0;top:calc(.5lh - 3px);width:6px;height:6px;border-radius:50%;background:var(--brand)}
.ui-feat p:not(.ui-tag){margin:0;font-size:15px;color:var(--muted)}
.ui-feat p:lang(ar){line-height:1.75}
.ui-feat__tags:empty{display:none}
.ui-feat--lead,.ui-feat--lead:hover{padding:24px;background:var(--surface-3)}
.ui-feat--lead .ui-h4{padding:0;font-size:20px}
.ui-feat--lead .ui-h4::before{display:none}
.ui-feat__icon{display:grid;place-items:center;width:48px;height:48px;margin-bottom:10px;border-radius:var(--r-md);background:var(--surface);color:var(--brand);box-shadow:var(--sh-1)}

/* roles (§6.15) */
.ui-roles{position:relative;display:grid;gap:var(--s-5);margin:0;padding:0;list-style:none}
.ui-role{position:relative;padding:28px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg)}
.ui-role__icon{display:grid;place-items:center;width:56px;height:56px;margin-bottom:20px;border-radius:var(--r-lg);background:var(--brand-soft);color:var(--brand)}
.ui-role p{margin:8px 0 0;color:var(--muted)}
@media (min-width:900px){.ui-roles{grid-template-columns:repeat(3,minmax(0,1fr))}.ui-roles::before{content:"";position:absolute;z-index:1;top:56px;inset-inline-start:56px;inset-inline-end:calc((100% - 2*var(--s-5))/3 - 56px);height:1px;background:var(--line-strong);transform-origin:var(--start) 50%;transition:transform var(--d-line) var(--ease-out) 150ms}.ui-role__icon{position:relative;z-index:2}}
@media (prefers-reduced-motion:no-preference){.sl-motion .ui-roles:not(.is-in)::before{transform:scaleX(0)}}

/* checklists (§6.16) */
.ui-checks{display:grid;gap:var(--s-5)}
@media (min-width:900px){.ui-checks{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ui-checks__col{padding:clamp(24px,3vw,40px);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl)}
.ui-h2--sm{font-size:26px}
.ui-checklist{display:grid;gap:12px;margin:24px 0 0;padding:0;list-style:none}
.ui-check{display:flex;align-items:flex-start;gap:12px;font-size:16px;line-height:1.75}
.ui-check:lang(en),.ui-check :lang(en){line-height:1.6}
.ui-check>.ui-i{box-sizing:content-box;padding:4px;border-radius:50%;background:var(--brand-soft);color:var(--brand)}
.ui-check b{background:linear-gradient(transparent 62%,var(--brand-soft) 0)}
@media (prefers-reduced-motion:no-preference){.ui-check>.ui-i{transition:opacity 400ms var(--ease-out),scale 400ms var(--ease-out);transition-delay:calc(var(--i,0)*60ms + 200ms)}.sl-motion .ui-check:not(.is-in)>.ui-i{opacity:0;scale:.6}}

/* plans (§6.17) */
.ui-plans{display:grid;gap:var(--s-5);grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));max-width:880px;margin-inline:auto;align-items:stretch}
.ui-plan{position:relative;display:flex;flex-direction:column;gap:var(--s-4);padding:var(--s-6);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl)}
.ui-plan--featured{--plan-tint:color-mix(in oklab,var(--brand) 4%,#fff);border:1.5px solid transparent;background:linear-gradient(var(--plan-tint),var(--plan-tint)) padding-box,linear-gradient(135deg,var(--brand),var(--accent)) border-box;box-shadow:0 30px 60px -30px color-mix(in oklab,var(--brand) 45%,transparent)}
[data-brand="smartmanzil"] .ui-plan--featured,.ui-plan--featured[data-brand="smartmanzil"]{--plan-tint:color-mix(in oklab,var(--accent) 6%,#fff)}
.ui-plan__name{margin:0;font-size:20px;font-weight:700;color:var(--ink-strong)}
.ui-plan__tag,.ui-plan__note{margin:-8px 0 0;font-size:15px;color:var(--muted)}
.ui-plan__note{text-wrap:balance}
.ui-plan__note--good{color:var(--success-ink)}
.ui-plan__price{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;height:var(--fs-price);margin:0;font-size:1rem;font-weight:400;line-height:1;color:var(--muted)}
.ui-plan__price .ui-num{font-size:var(--fs-price);font-weight:700;color:var(--ink-strong)}
.ui-plan__price .ui-num:lang(en),.ui-plan__price:lang(en) .ui-num{letter-spacing:-.02em}
.ui-plan__price s{font-size:1rem;font-weight:400;color:var(--muted);text-decoration-thickness:1px;vertical-align:baseline}
.ui-plan__price--text{height:var(--fs-h2);font-size:var(--fs-h2);font-weight:700;color:var(--ink-strong)}
@media (min-width:600px){.ui-plan__price--text{height:var(--fs-price);align-items:flex-end}}
.ui-plan__list{display:grid;margin:0;padding:0;list-style:none;font-size:15px}
.ui-plan__list li{display:flex;align-items:flex-start;gap:10px;padding-block:10px;border-top:1px solid var(--line);line-height:1.6}
.ui-plan__list li:first-child{border-top:0}
.ui-plan__yes .ui-i{color:var(--success-ink)}
.ui-plan__no,.ui-plan__no .ui-i{color:var(--muted)}
.ui-plan__cta{margin-top:auto}
.ui-plan__badge{position:absolute;top:0;inset-inline-start:var(--s-6);display:inline-flex;align-items:center;height:28px;margin:0;padding-inline:12px;border-radius:var(--r-pill);background:var(--tag-premium-bg);color:var(--tag-premium-ink);font-size:14px;font-weight:600;line-height:20px;translate:0 -50%}
.ui-plans__note{max-width:40rem;margin:var(--s-5) auto 0;font-size:14px;color:var(--muted);text-align:center}

/* CTA band and mobile download bar (§6.18) */
.ui-cta{position:relative;isolation:isolate;overflow:clip;padding:clamp(40px,7vw,88px) clamp(24px,5vw,72px);border-radius:var(--r-xl);background:linear-gradient(160deg,var(--hero-a),var(--hero-c));text-align:center}
.ui-cta .ui-orb--a{top:-45%;inset-inline-end:-12%}
.ui-cta__mark{position:absolute;bottom:-28px;inset-inline-end:-20px;width:clamp(120px,16vw,192px);height:auto;border-radius:var(--r-icon);opacity:.3;rotate:calc(-8deg*var(--dir))}
svg.ui-cta__mark{bottom:-36px;width:clamp(140px,18vw,220px);height:auto;aspect-ratio:1;border-radius:0;color:rgb(255 255 255/.14);stroke-width:1.1;opacity:1}
@media (max-width:599px){.ui-cta__mark{width:96px;bottom:-56px;inset-inline-end:-28px}svg.ui-cta__mark{width:104px;bottom:-64px}}
.ui-cta .ui-h2{max-width:36rem;margin-inline:auto}
.ui-cta .ui-lead{max-width:36rem;margin:var(--s-4) auto 0;color:var(--on-dark-muted);text-wrap:balance}
.ui-cta__actions{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:12px;margin-top:var(--s-6)}
.ui-cta .ui-stores{justify-content:center}
@media (max-width:399px){.ui-cta{padding-inline:16px}}
.ui-cta__action{display:grid;justify-items:center;gap:8px}
.ui-cta__cap{display:inline-flex;align-items:center;gap:6px;margin:0;font-size:14px;color:var(--on-dark-muted)}
/* phones: company buttons stack at one width; the hours caption centred, clock on its first line */
@media (max-width:599px){.ui-cta__actions>.ui-btn,.ui-cta__action{flex:1 1 100%;max-width:20rem}.ui-cta__actions .ui-btn{padding-inline:16px}.ui-cta__action{justify-items:stretch}.ui-cta__cap{display:block;text-align:center}.ui-cta__cap .ui-i{display:inline-block;margin-inline-end:6px;vertical-align:-3px}}
.ui-cta a:not(.ui-btn,.ui-store){color:var(--on-dark);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.ui-dlbar{position:fixed;inset-inline:12px;bottom:max(12px,env(safe-area-inset-bottom));z-index:var(--z-dlbar);display:flex;align-items:center;gap:10px;padding:8px;padding-inline-start:10px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--sh-2);transform:translateY(130%);visibility:hidden;transition:transform var(--d-ui) var(--ease-sheet),visibility 0s linear var(--d-ui)}
.ui-dlbar.is-shown{transform:none;visibility:visible;transition-delay:0s}
.ui-dlbar__name{flex:1;min-width:0;font-size:15px;font-weight:700;line-height:1.25;color:var(--ink-strong)}
/* the name is never cut: below 380 px the button drops its icon and the gaps tighten; at 320 px an English name may wrap to two lines */
@media (max-width:379px){.ui-dlbar{gap:8px;padding-inline-start:8px}.ui-dlbar .ui-btn .ui-i{display:none}}
@media (min-width:900px){.ui-dlbar{display:none}}

/* product footer band (§6.19) */
.ui-productfoot{padding-block:var(--s-8) var(--s-7);background:var(--surface-2);box-shadow:inset 0 1px var(--line)}
.ui-productfoot__grid{display:grid;gap:var(--s-6)}
/* < 900 px: Legal and Help side by side only when no link would wrap; About and credits full width */
@media (max-width:899px){.ui-productfoot__grid{display:flex;flex-wrap:wrap}.ui-productfoot__col{flex:1 1 0;min-width:max-content}.ui-productfoot__about,.ui-productfoot__fine{flex-basis:100%;min-width:0}}
@media (min-width:900px){.ui-productfoot__grid{grid-template-columns:1fr 1fr 1.4fr;gap:var(--s-7)}}
.ui-productfoot__h{margin:0 0 8px;font-size:15px;font-weight:700;line-height:1.5;color:var(--ink-strong)}
.ui-links{margin:0;padding:0;list-style:none}
.ui-links a{display:flex;align-items:center;gap:10px;min-height:44px;color:var(--ink);text-decoration:none}
.ui-links a:hover{color:var(--link);text-decoration:underline}
.ui-links .ui-i{color:var(--brand)}
.ui-productfoot__about p{margin:0;font-size:15px;line-height:1.8;color:var(--muted)}
.ui-productfoot__about a{color:var(--link);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.ui-productfoot__fine{grid-column:1/-1;display:grid;gap:4px;margin:0;padding-top:var(--s-4);border-top:1px solid var(--line);font-size:13px;line-height:1.6;color:var(--muted)}
.ui-productfoot__fine p{margin:0;direction:ltr}
[dir="rtl"] .ui-productfoot__fine p{text-align:right}

/* contact tiles, copy button, support tile (§6.20) */
.ui-contact{display:grid;gap:16px;margin:0;padding:0;list-style:none}
@media (min-width:900px){.ui-contact{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-5)}}
.ui-contact__tile{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);transition:border-color var(--tf),translate var(--tf),box-shadow var(--tf)}
.ui-contact__link{display:flex;flex-direction:column;align-items:flex-start;min-height:140px;padding:28px;border-radius:inherit;color:var(--ink);text-decoration:none!important}
.ui-contact__icon{display:grid;place-items:center;width:48px;height:48px;margin-bottom:18px;border-radius:var(--r-md);background:var(--brand-soft);color:var(--brand)}
.ui-contact__title{padding-inline-end:56px;font-size:15px;font-weight:600;line-height:1.5;color:var(--muted)}
.ui-contact__val{display:block;max-width:100%;margin-top:2px;text-align:start;overflow-wrap:anywhere;font:600 18px/1.4 var(--font-sans);color:var(--ink-strong)}
.ui-contact__hint{display:block;margin-top:6px;font-size:14px;line-height:1.6;color:var(--muted);text-wrap:balance}
@media (min-width:900px) and (max-width:1099px){.ui-contact{gap:16px}.ui-contact__link{padding:24px 20px}}  /* the e-mail (218 px) stays on one line */
.ui-copy{position:absolute;top:12px;inset-inline-end:12px;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:44px;min-height:44px;padding-inline:12px;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--surface);color:var(--muted);font-size:14px;font-weight:600;cursor:pointer;transition:color var(--tf),border-color var(--tf)}
.ui-copy:hover{border-color:var(--line-strong);color:var(--ink-strong)}
.ui-copy__done,.ui-copy.is-copied .ui-copy__idle{display:none}
.ui-copy.is-copied .ui-copy__done{display:inline}
.ui-copy.is-copied{border-color:currentColor;color:var(--success-ink)}
.ui-support{display:flex;align-items:flex-start;gap:var(--s-5);margin-top:var(--s-7);padding:clamp(24px,3vw,36px);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl)}
.ui-support p{margin:8px 0 0;color:var(--muted)}
.ui-support a{color:var(--link);font-weight:600;text-decoration:underline;text-underline-offset:3px}
@media (max-width:599px){.ui-support{flex-direction:column;gap:var(--s-4)}}

/* product tiles (§6.22) */
.ui-products{display:grid;gap:var(--s-5);grid-template-columns:minmax(0,1fr);margin:0;padding:0;list-style:none}
@media (min-width:900px){.ui-products{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ui-product{position:relative;isolation:isolate;display:flex;flex-direction:column;overflow:clip;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);transition:translate var(--tf),box-shadow var(--tf),border-color var(--tf)}
.ui-product__media{position:relative;display:flex;justify-content:center;height:240px;padding-top:34px;overflow:clip;background:radial-gradient(circle at 50% 110%,var(--orb-1),transparent 62%),linear-gradient(160deg,var(--hero-a),var(--hero-c))}
.ui-product__media .ui-device{transition:translate var(--tf)}
.ui-product__body{display:flex;flex:1;flex-direction:column;align-items:flex-start;gap:12px;padding:clamp(20px,2.6vw,32px)}
.ui-product__body>p{margin:0;color:var(--muted)}
.ui-product__name{margin-top:4px}
.ui-product__name a{color:var(--ink-strong);text-decoration:none}
.ui-stretch::after{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit}
.ui-product__actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;width:100%;margin-top:auto;padding-top:8px}
.ui-product .ui-stores{position:relative;z-index:2}
.ui-product__more{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--link)}
@media (hover:hover) and (pointer:fine){.ui-product:hover,.ui-contact__tile:hover{translate:0 -2px;border-color:var(--line-strong);box-shadow:var(--sh-2)}.ui-product:hover{translate:0 -4px}.ui-product:hover .ui-product__media .ui-device{translate:0 -8px}.ui-product:hover .ui-product__more .ui-i--dir{translate:calc(3px*var(--dir)) 0}}
@supports selector(:has(*)){.ui-stretch:focus-visible{outline:none}.ui-product:has(.ui-stretch:focus-visible){outline:2px solid var(--focus);outline-offset:3px}}
.ui-product--compact{flex-direction:row;align-items:center;gap:var(--s-4);padding:var(--s-5)}
.ui-product--compact p{margin:0;color:var(--ink)}
.ui-product--compact a{color:var(--link);font-weight:600}
.ui-product--soon{grid-column:1/-1;justify-content:center;padding:var(--s-5);border:1px dashed var(--line-strong);background:var(--surface-2);text-align:center}
.ui-product--soon p{margin:0;color:var(--muted)}

/* process steps (§6.23) */
.ui-process{--n:3;position:relative;display:grid;gap:20px;margin:0;padding:0;list-style:none}
.ui-process:has(>:nth-child(4)){--n:4}
.ui-process::before{content:"";position:absolute;inset-inline-start:22px;top:22px;bottom:22px;width:1px;background:var(--line-strong);transform-origin:50% 0;transition:transform var(--d-line) var(--ease-out) 150ms}
.ui-process__step{display:flex;align-items:center;gap:14px;font-size:15px;font-weight:600;line-height:1.5;color:var(--ink-strong)}
.ui-process__step>span{text-wrap:balance}
.ui-process__dot{position:relative;display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;border:1px solid var(--line-strong);border-radius:50%;background:var(--surface);color:var(--brand)}
@media (min-width:900px){.ui-process{grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:16px}.ui-process::before{inset-inline:calc(50%/var(--n));bottom:auto;width:auto;height:1px;transform-origin:var(--start) 50%}.ui-process__step{flex-direction:column;text-align:center}}
@media (prefers-reduced-motion:no-preference){.ui-process__dot{transition:scale 500ms var(--ease-out),opacity 500ms var(--ease-out);transition-delay:calc(var(--i,0)*80ms + 150ms)}
.sl-motion .ui-process:not(.is-in)::before{transform:scaleY(0)}.sl-motion .ui-process:not(.is-in) .ui-process__dot{opacity:0;scale:.6}}
@media (min-width:900px) and (prefers-reduced-motion:no-preference){.sl-motion .ui-process:not(.is-in)::before{transform:scaleX(0)}}

/* bento tiles + spotlight (§6.24) */
.ui-bento{display:grid;gap:16px;grid-template-columns:repeat(6,minmax(0,1fr));margin:0;padding:0;list-style:none}
.ui-tile{position:relative;isolation:isolate;grid-column:span 6;display:flex;flex-direction:column;gap:10px;min-height:220px;padding:clamp(24px,3vw,36px);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);overflow:clip}
@media (min-width:600px){.ui-tile{grid-column:span 3}}
@media (min-width:900px){.ui-bento--4up{grid-template-columns:repeat(4,minmax(0,1fr))}.ui-bento--4up .ui-tile{grid-column:span 1}}
.ui-bento--4up .ui-tile{min-height:0}  /* one text, no heading */
.ui-bento--4up .ui-tile p{color:var(--ink)}
.ui-tile .ui-index{position:absolute;top:clamp(24px,3vw,36px);inset-inline-end:clamp(24px,3vw,36px)}
.ui-tile__icon{display:grid;place-items:center;width:48px;height:48px;margin-bottom:14px;border-radius:var(--r-md);background:var(--brand-soft);color:var(--brand)}
.ui-tile p{margin:0;color:var(--muted)}
.ui-spot::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:radial-gradient(420px circle at var(--x,50%) var(--y,50%),color-mix(in oklab,var(--brand) 10%,transparent),transparent 65%);opacity:0;transition:opacity var(--tu);pointer-events:none}
@media (hover:hover) and (pointer:fine){.ui-spot:hover::before{opacity:1}}

/* prose, statement, quote (§6.25) */
.ui-prose{margin:0;font-size:17px;color:var(--ink)}
.ui-prose:lang(ar){max-width:38rem;line-height:1.9}
.ui-prose:lang(en){max-width:65ch;line-height:1.7}
.ui-prose a{color:var(--link);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.ui-statement{max-width:44rem;margin:0;font-size:clamp(1.25rem,1rem + 1vw,1.625rem);font-weight:600;line-height:1.75;color:var(--ink-strong)}
.ui-statement:lang(en){line-height:1.5}
.ui-quote{margin:0;padding-inline-start:24px;border-inline-start:3px solid var(--brand);font-size:clamp(1.375rem,1rem + 1.4vw,1.875rem);font-weight:600;line-height:1.65;color:var(--ink-strong)}
.ui-quote:lang(en){line-height:1.4}