@font-face{font-family:Inter;src:url('InterVariable.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:Shabnam;src:url('Shabnam.woff2') format('woff2');font-weight:400 500;font-display:swap}
@font-face{font-family:Shabnam;src:url('Shabnam-Bold.woff2') format('woff2');font-weight:600 900;font-display:swap}
:root{color-scheme:dark;--bg:#101817;--panel:#162220;--line:#354642;--ink:#f1f6f2;--muted:#b3c5bd;--mint:#83f0bf;--green:#192c25;--paper:#e8efe8;--dark:#162720;--sub:#40554a;--rule:#b9cdc0;font:16px/1.65 Inter,system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink)}
:lang(fa){font-family:Shabnam,Inter,system-ui,sans-serif}
img,svg{display:block;max-width:100%}
svg{width:1.25em;height:1.25em;flex:none}
figure,h1,h2,h3,p,ul,ol{margin:0}
a{color:inherit;text-underline-offset:.25em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid currentColor;outline-offset:5px}
[id]{scroll-margin-block-start:1.25rem}
.wrap{width:min(100% - 3rem,72rem);margin-inline:auto}
.skip{position:absolute;inset-block-start:.6rem;inset-inline-start:1rem;z-index:2;padding:.55rem 1rem;background:var(--paper);color:var(--dark);transform:translateY(-180%)}
.skip:focus{transform:none}
.site-head{border-bottom:1px solid var(--line)}
.head-inner,.foot-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:4.9rem}
.brand{display:inline-flex;align-items:center;gap:.65rem;font-size:1.12rem;font-weight:800;letter-spacing:-.04em;text-decoration:none;white-space:nowrap}
.brand img{width:2.15rem;height:2.15rem}
.nav{display:flex;align-items:center;gap:clamp(.8rem,2.8vw,2.25rem);font-size:.85rem;color:var(--muted)}
.nav a{text-decoration:none;white-space:nowrap}
.nav a:hover{color:var(--ink);text-decoration:underline}
.language{display:inline-flex;align-items:center;gap:.4rem;min-height:2.6rem;padding:.2rem .7rem;border:1px solid var(--line);border-radius:.45rem;text-decoration:none;font-size:.84rem}
.language:hover,.secondary:hover{background:#253632}
.hero{display:grid;grid-template-columns:1fr 1.02fr;align-items:center;gap:clamp(2rem,5vw,4.5rem);padding-block:4.4rem 3.3rem}
.hero-copy{container-type:inline-size}
.eyebrow{display:flex;align-items:center;gap:.7rem;color:var(--mint);font-size:.78rem;font-weight:700;letter-spacing:.13em}
.eyebrow::before{content:'';width:.48rem;height:.48rem;border-radius:50%;background:currentColor;flex:none}
:lang(fa) .eyebrow{letter-spacing:0;font-size:.9rem}
.hero h1{font-size:clamp(2.55rem,6vw,5.2rem);font-size:clamp(2.55rem,15.2cqi,5.2rem);line-height:1.02;letter-spacing:-.052em;margin-block:1.15rem 1.5rem;font-weight:790}
.hero h1 span{display:block;color:var(--mint)}
:lang(fa) .hero h1{letter-spacing:0;line-height:1.22;font-size:clamp(3rem,5.8vw,5.4rem)}
.intro{max-width:34rem;color:var(--muted);font-size:clamp(1.05rem,1.6vw,1.2rem);line-height:1.75}
.actions{display:flex;flex-wrap:wrap;gap:.65rem;margin-block-start:1.8rem}
.button{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:3rem;padding:.58rem 1.05rem;border:1px solid transparent;border-radius:.5rem;font-weight:750;font-size:.9rem;text-decoration:none}
.button:hover{text-decoration:underline}
.primary{background:var(--mint);color:#12231a}
.primary:hover{background:#b3fbd8}
.primary:focus-visible{outline-color:var(--ink)}
.secondary{border-color:var(--line);color:var(--ink)}
.stage{direction:ltr;position:relative;isolation:isolate;min-height:27.5rem;display:grid;place-items:center;overflow:hidden;border:1px solid #426252;border-radius:1rem;background-color:#1b352b;background-image:radial-gradient(ellipse at 60% 36%,#467359 0%,transparent 74%),linear-gradient(#c1f6d014 1px,transparent 1px),linear-gradient(90deg,#c1f6d014 1px,transparent 1px);background-size:auto,24px 24px,24px 24px}
.stage::before,.stage::after{content:'';position:absolute;z-index:-1;width:74%;aspect-ratio:1;border:1px solid #a6dfb750;border-radius:50%}
.stage::after{width:61%;border-color:#a6dfb730}
.browser{position:absolute;inset:23% 18% 16% 9%;border:1px solid #9ac4a4;border-radius:.72rem;overflow:hidden;background:#203e31;box-shadow:0 1.1rem 2.4rem #07171055}
.browser-bar{height:2.15rem;border-bottom:1px solid #72927d;display:flex;align-items:center;gap:.28rem;padding-inline:.78rem}
.browser-bar i{width:.34rem;height:.34rem;border-radius:50%;background:#a6c2ac}
.browser-bar span{margin-inline:auto;width:47%;height:.63rem;border:1px solid #6e9680;border-radius:.2rem}
.browser-body{margin:1.45rem 1rem 1rem;display:grid;justify-items:start;gap:.55rem}
.browser-body i{width:56%;height:.27rem;border-radius:1rem;background:#729882}
.browser-body i:nth-child(2){width:47%}
.browser-body i:last-child{width:41%}
.browser-body b{width:56%;height:3.5rem;margin-block:.2rem;border:1px dashed #769785;border-radius:.35rem;background:repeating-linear-gradient(135deg,#bddac315 0 1px,transparent 1px 8px)}
.popup{position:relative;margin-left:26%;width:46%;height:auto;border:1px solid #fff;border-radius:.65rem;box-shadow:0 1.3rem 3rem #081c14a0}
.product figcaption{font-size:.75rem;color:var(--muted);margin-block-start:.4rem;text-align:center}
.facts{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--line);padding-block:1rem;margin-block-end:5.4rem;list-style:none;padding-inline-start:0}
.facts li{padding-inline:1.2rem;display:flex;align-items:center;gap:.65rem;font-size:.87rem;font-weight:650}
.facts li:first-child{padding-inline-start:0}
.facts li+li{border-inline-start:1px solid var(--line)}
.facts span{color:var(--mint);font-variant-numeric:tabular-nums;font-size:.75rem}
.section{padding-block:clamp(3.3rem,7vw,6rem)}
.light{color:var(--dark);background:var(--paper)}
.light .eyebrow{color:#20664c}
.section h2{margin-block:.6rem .8rem;font-size:clamp(2rem,4.5vw,3.65rem);font-weight:790;line-height:1.08;letter-spacing:-.046em}
:lang(fa) .section h2{line-height:1.35;letter-spacing:0}
.section-intro{color:var(--muted);max-width:48rem;font-size:1.04rem}
.light .section-intro{color:var(--sub)}
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-block-start:2.7rem;border:1px solid var(--rule);border-radius:.65rem;overflow:hidden}
.feature{padding:1.35rem;min-width:0}
.feature+.feature{border-inline-start:1px solid var(--rule)}
.glyph{display:grid;place-items:center;width:2.5rem;height:2.5rem;background:#d5e7d9;color:#235c45;border-radius:.45rem;margin-block-end:1rem}
.feature h3,.card h3{font-size:1.06rem;font-weight:780;line-height:1.35;margin-block-end:.5rem}
.feature p,.card p,.card li{font-size:.9rem;color:var(--sub)}
.proof-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-block-start:2rem}
.proof{background:var(--panel);border:1px solid var(--line);border-radius:.75rem;padding:clamp(1.3rem,3.2vw,2.35rem)}
.proof h3{font-size:1.35rem;margin-block-end:.7rem;line-height:1.3}
.proof p{color:var(--muted)}
.proof .metric{display:block;font-size:clamp(2.5rem,6vw,4.4rem);font-weight:820;letter-spacing:-.07em;color:var(--mint);line-height:1.05;margin-block-end:.7rem}
:lang(fa) .proof .metric{letter-spacing:0}
.note{font-size:.88rem;margin-block-start:.65rem}
.text-link{display:inline-flex;gap:.4rem;align-items:center;font-weight:700;font-size:.9rem;margin-block-start:1rem;color:var(--mint)}
.light .text-link{color:#215b44}
[dir=rtl] .arrow{transform:scaleX(-1)}
.install-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-block-start:1.7rem}
.card{border:1px solid var(--rule);border-radius:.65rem;padding:1.15rem;background:#f5f8f3;min-width:0}
.card h3{display:flex;align-items:center;gap:.55rem}
.card h3 svg{color:#32654d}
.card code{direction:ltr;display:block;width:max-content;max-width:100%;margin-block:.35rem .6rem;padding:.13rem .36rem;background:#dfebe0;border-radius:.2rem;font-size:.83em;overflow-wrap:anywhere}
.light .primary{background:#1b5f45;color:#fff}
.light .primary:hover{background:#164b37}
.light .primary:focus-visible{outline-color:var(--dark)}
.light .secondary{border-color:#789587;color:var(--dark)}
.light .secondary:hover{background:#d7e6d8}
.faq{max-width:47rem}
.faq details{border-bottom:1px solid var(--line);padding:.8rem .2rem}
.faq details:first-of-type{margin-block-start:1.5rem;border-top:1px solid var(--line)}
.faq summary{cursor:pointer;font-weight:700;padding:.27rem 0}
.faq p{color:var(--muted);padding-block:.35rem .3rem}
.site-foot{border-top:1px solid var(--line);padding-block:1rem}
.foot-inner{min-height:3.4rem;flex-wrap:wrap}
.foot-inner p,.foot-links{font-size:.83rem;color:var(--muted)}
.foot-links{display:flex;flex-wrap:wrap;gap:.6rem 1.25rem}
@media(max-width:56rem){.hero{gap:2rem}.stage{min-height:21rem}.facts{margin-block-end:3.2rem}.feature-grid{grid-template-columns:repeat(2,1fr)}.feature:nth-child(3){border-inline-start:0}.feature:nth-child(n+3){border-top:1px solid var(--rule)}}
@media(max-width:43rem){
  .wrap{width:calc(100% - 2rem)}
  .hero{grid-template-columns:1fr;padding-block:3rem 2rem}
  :lang(fa) .hero h1{font-size:clamp(3rem,9vw,4.4rem)}
  .product{width:min(100%,33rem);margin-inline:auto}
  .stage{min-height:0;aspect-ratio:1.24}
  .head-inner{display:grid;grid-template-columns:1fr auto;gap:.2rem .8rem;padding-block:.65rem}
  .nav{grid-row:2;grid-column:1/-1;gap:1.4rem}
  .nav a{padding-block:.35rem}
  .facts li{align-items:flex-start;flex-direction:column;gap:.2rem;padding-inline:.55rem;font-size:.78rem}
  .proof-grid,.install-grid{grid-template-columns:1fr}
  .feature{padding:1rem}
  .feature h3{font-size:.99rem}
  .feature p{font-size:.85rem}
  .foot-inner{align-items:flex-start;flex-direction:column}
}
@media(max-width:21rem){.feature-grid{grid-template-columns:1fr}.feature+.feature{border-inline-start:0;border-top:1px solid var(--rule)}}
