@font-face{font-family:YekanBakh;src:url('/assets/fonts/YekanBakhFaNum-Light.woff2') format('woff2');font-style:normal;font-weight:300;font-display:swap}
@font-face{font-family:YekanBakh;src:url('/assets/fonts/YekanBakhFaNum-Regular.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:YekanBakh;src:url('/assets/fonts/YekanBakhFaNum-SemiBold.woff2') format('woff2');font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:YekanBakh;src:url('/assets/fonts/YekanBakhFaNum-Bold.woff2') format('woff2');font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:Vazirmatn;src:url('/assets/fonts/Vazirmatn-variable.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
:root{font-family:Inter,'Segoe UI',Arial,sans-serif;color:#173239;background:#f7f9f8;font-synthesis:none;scroll-behavior:smooth}
*{box-sizing:border-box}
body{margin:0;min-width:320px}
html[lang=fa]{font-family:YekanBakh,Vazirmatn,Tahoma,sans-serif}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #62c9ad;outline-offset:4px}
.skip-link{position:absolute;top:-60px;left:20px;z-index:20;background:#fff;padding:10px 14px;border-radius:8px}
.skip-link:focus{top:10px}
.section-shell{width:min(1180px,calc(100% - 48px));margin-inline:auto}
.site-header{height:78px;background:#f7f9f8ec;border-bottom:1px solid #e3eae8;position:sticky;top:0;z-index:10;backdrop-filter:blur(18px)}
.nav-wrap{width:min(1260px,calc(100% - 48px));height:100%;margin:auto;display:flex;align-items:center;gap:54px}
.wordmark{display:inline-flex;align-items:center;gap:8px;direction:ltr;font-size:24px;font-weight:650;letter-spacing:-1.6px;white-space:nowrap;color:#142c34}
.wordmark-dot{color:#15a581;margin-left:-8px}
.mark{display:inline-grid;place-items:center;flex:none;width:34px;height:34px;letter-spacing:0}
.mark img{display:block;width:100%;height:100%}
.nav-links,.nav-actions{display:flex;align-items:center;gap:29px}
.nav-links{flex:1}
.nav-links a,.nav-login{font-size:12px;font-weight:550;color:#587078;transition:color .18s}
.nav-links a:hover,.nav-login:hover{color:#147f69}
.nav-actions{gap:16px}
.locale-button{border:1px solid #d8e5e0;background:#fff;border-radius:8px;padding:8px 11px;font-size:11px;font-weight:600;color:#275c56}
.locale-button:hover{background:#edf8f3}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:18px;border-radius:9px;border:1px solid transparent;padding:11px 17px;font-size:12px;font-weight:600;white-space:nowrap;transition:transform .16s,background .16s,box-shadow .16s}
.btn:hover{transform:translateY(-2px)}
.btn-dark{background:#17383b;color:#fff;box-shadow:0 7px 20px #1c4a401a}
.btn-dark:hover{background:#236357}
.btn-outline{border-color:#d0dfda;background:#fff;color:#1b4e4c}
.btn-outline:hover{background:#ecf7f1}
.btn-large{min-height:49px;padding:13px 20px;font-size:13px}
.hero{display:flex;flex-direction:column;align-items:center;gap:26px;padding-block:42px 36px;text-align:center}
.hero-copy{min-width:0;width:100%;max-width:920px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;color:#208872;font-size:10px;font-weight:650;letter-spacing:1.3px}
.eyebrow-line{width:23px;height:1px;background:#2fa488}
h1,h2,h3,p{margin-top:0}
.hero h1{display:flex;justify-content:center;flex-wrap:wrap;column-gap:.22em;font-size:clamp(34px,4.3vw,54px);line-height:1.12;letter-spacing:-.05em;font-weight:650;margin:14px 0 16px}
.hero h1 .accent{color:#218d76}
.hero-description{max-width:660px;font-size:14px;line-height:1.6;color:#668087;margin:0 auto 20px;text-wrap:balance}
.hero-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:10px}
.hero-note{font-size:10px;color:#8b9ea0;line-height:1.5;margin:12px 0 0}
.demo-frame{border:1px solid #dce8e5;border-radius:17px;background:#fff;box-shadow:0 30px 90px #224c4714,0 5px 20px #224c4708;overflow:hidden;transform:rotate(1deg)}
.demo-bar{height:49px;display:flex;align-items:center;gap:16px;padding:0 19px;border-bottom:1px solid #e8eeeb;font-size:9px;font-weight:650;letter-spacing:.7px;color:#83989a;white-space:nowrap}
.demo-dots{display:flex;gap:5px}.demo-dots i{width:6px;height:6px;background:#d7e3df;border-radius:50%}
.demo-live{margin-left:auto;display:flex;align-items:center;gap:6px;color:#29896e}.demo-live i{width:6px;height:6px;background:#45bd8d;border-radius:50%}
.demo-body{padding:35px 35px 32px;background:radial-gradient(circle at 90% 0%,#f4fbf7,transparent 55%),#fff}
.demo-message{display:flex;gap:12px;align-items:start}
.avatar{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:9px;background:#e4eeeb;color:#54736c;font-size:11px;font-weight:650}
.demo-message small,.decision-head small{display:block;font-size:9px;letter-spacing:.8px;font-weight:650;color:#869b9c;margin-bottom:6px}
.demo-message p{border:1px solid #e4ece9;background:#f9fbfa;border-radius:3px 11px 11px 11px;padding:14px 16px;font-size:13px;color:#29454b;margin:0;max-width:400px;line-height:1.5}
.flow-line{height:47px;width:1px;background:#cbded7;margin-left:16px;position:relative}.flow-line span{position:absolute;left:-2px;width:5px;height:5px;background:#2ca887;border-radius:50%}.flow-line span:nth-child(1){top:10px}.flow-line span:nth-child(2){top:21px;opacity:.6}.flow-line span:nth-child(3){top:32px;opacity:.3}
.demo-decision{border:1px solid #c7e5d8;background:#f6fbf8;border-radius:12px;padding:18px 19px;margin-left:33px;box-shadow:0 8px 24px #1b795e0b}
.decision-head{display:flex;align-items:center;gap:9px}.decision-head strong{font-size:12px;display:block}.decision-head small{margin:2px 0 0;font-size:8px}
.decision-icon{display:grid;place-items:center;width:29px;height:29px;background:#173e3a;border-radius:8px;color:#a0eac9;font-size:17px}
.decision-state{margin-left:auto;padding:5px 7px;border-radius:4px;background:#e0f2e8;color:#278467;font-size:8px;font-weight:650;white-space:nowrap}
.action-code{display:flex;flex-wrap:wrap;gap:8px;margin:19px 0 12px;font:11px/1.5 Consolas,monospace}.action-code span:first-child{color:#268873;font-weight:700}.action-code span:last-child{color:#4f6f6d}
.demo-decision p{font-size:10px;color:#829797;margin:0;line-height:1.5}
.demo-complete{display:flex;align-items:center;gap:8px;margin:20px 0 0 33px;color:#62897c;font-size:10px}.demo-complete span:first-child{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#e1f4e8;color:#248a67;font-weight:700}
.demo-footer{display:flex;gap:16px;justify-content:space-between;flex-wrap:wrap;border-top:1px solid #e8eeeb;background:#fbfdfc;padding:16px 19px}.demo-footer>span{display:flex;align-items:center;gap:6px;font-size:8px;letter-spacing:.5px;font-weight:650;color:#698582}.demo-footer i{width:5px;height:5px;border-radius:50%;background:#52b994}
.trust-strip{background:#eaf3ef;border-block:1px solid #e0ede6}.trust-inner{min-height:79px;display:flex;align-items:center;justify-content:space-between;gap:25px}.trust-inner>span{font-size:10px;font-weight:650;color:#428270;letter-spacing:1px}.trust-inner div{display:flex;align-items:center;gap:24px;color:#39635b}.trust-inner b{font-size:12px;font-weight:600}.trust-inner i{width:4px;height:4px;border-radius:50%;background:#75b59b}
.steps,.faq{padding-block:110px}
.section-top{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:32px}.section-top h2,.boundary h2,.final-cta h2{font-size:clamp(31px,3.5vw,46px);font-weight:650;line-height:1.17;letter-spacing:-.055em;margin:11px 0 0}.section-top p{max-width:350px;color:#758b8c;font-size:13px;line-height:1.7;margin:0 0 3px}
.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.step-card{background:#fff;border:1px solid #e0e9e6;border-radius:13px;padding:27px;min-height:270px;box-shadow:0 12px 36px #224e4008}.step-num{font-size:10px;font-weight:650;color:#a1b2ad}.step-symbol{display:grid;place-items:center;width:43px;height:43px;border-radius:10px;background:#e9f6ef;color:#1c896f;font:600 19px Consolas,monospace;margin:23px 0}.step-card h3{font-size:17px;letter-spacing:-.025em;margin:0 0 11px;font-weight:650}.step-card p{font-size:12px;color:#71898b;line-height:1.7;margin:0}
.deployment{background:#eaf2ee;padding-block:100px}.deploy-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.deploy-card{background:#fff;border:1px solid #d9e7e0;border-radius:15px;padding:32px;min-height:392px;display:flex;flex-direction:column}.deploy-card.featured{background:#173b3b;color:#fff;border-color:#173b3b}.deploy-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.deploy-icon{display:grid;place-items:center;width:43px;height:43px;border-radius:10px;background:#e6f3eb;color:#27866d;font-size:23px}.featured .deploy-icon{background:#2a5550;color:#a5e8c9}.deploy-label{font-size:9px;letter-spacing:.9px;color:#79a397;font-weight:650}.featured .deploy-label{color:#b2d8c9}.deploy-card h3{font-size:27px;letter-spacing:-.04em;margin:0 0 10px;font-weight:650}.deploy-card p{font-size:13px;line-height:1.7;color:#6b8384;max-width:490px;margin:0 0 18px}.featured p{color:#bbd2c9}.deploy-card ul{padding-left:18px;margin:0 0 20px;color:#627d7b;font-size:12px;line-height:2}.featured ul{color:#c4ded3}.deploy-link{margin-top:auto;padding-top:17px;border-top:1px solid #e3eae6;display:flex;justify-content:space-between;font-size:12px;font-weight:650;color:#21876e}.featured .deploy-link{border-color:#3b615a;color:#a0e9c7}.deploy-link:hover{text-decoration:underline}
.boundary{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:90px;padding-block:125px}.boundary-visual{min-height:260px;border:1px solid #e1ebe5;border-radius:18px;background:radial-gradient(circle at center,#e9f7ef,transparent 70%),#fff;display:flex;align-items:center;justify-content:center;gap:10px;position:relative;box-shadow:0 14px 45px #224e4008}.boundary-node{border:1px solid #d7e7df;background:#fff;border-radius:9px;padding:15px 14px;color:#4a6764;font-size:10px;font-weight:650;letter-spacing:.4px;white-space:nowrap}.runlet-node{background:#193f3c;color:#b8efd7;border-color:#193f3c}.boundary-visual>span{color:#81b8a3}.boundary-caption{position:absolute;bottom:34px;font-size:9px;color:#8da8a1;letter-spacing:.8px}.boundary-caption span{padding-inline:8px;color:#9ec4b2}.boundary h2{margin:15px 0 17px}.boundary p{font-size:14px;line-height:1.75;color:#758b8a;margin-bottom:21px}.boundary a{color:#1c806d;font-size:12px;font-weight:650}.boundary a:hover{text-decoration:underline}
.faq{padding-top:0}.faq-list{border-top:1px solid #dce8e2}.faq details{border-bottom:1px solid #dce8e2;padding:22px 5px}.faq summary{cursor:pointer;font-size:14px;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:25px}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:'+';font-size:20px;font-weight:400;color:#1c876f;line-height:14px}.faq details[open] summary:after{content:'−'}.faq details p{font-size:12px;color:#718987;line-height:1.7;max-width:780px;margin:13px 0 0}
.final-cta{background:#183b3b;border-radius:18px;color:#fff;padding:55px 62px;display:flex;align-items:center;justify-content:space-between;gap:30px;margin-bottom:85px}.final-cta .eyebrow{color:#96debf}.final-cta h2{margin:13px 0 12px}.final-cta p{color:#bfd3c9;font-size:13px;margin:0;line-height:1.6}.btn-light{background:#a8edcb;color:#123c38}.btn-light:hover{background:#c6f8dc}
.site-footer{border-top:1px solid #e0e9e5;background:#f4f8f5}.footer-inner{padding-block:44px;display:grid;grid-template-columns:1fr auto;gap:24px}.site-footer p{font-size:12px;color:#8a9e99;margin:12px 0 0}.site-footer nav{display:flex;align-items:center;flex-wrap:wrap;gap:22px}.site-footer nav a{font-size:11px;color:#5c7772}.site-footer nav a:hover{color:#168269;text-decoration:underline}.site-footer small{grid-column:1/-1;color:#a0b0a9;font-size:10px}
.legal-main{max-width:850px;padding-block:80px 110px}.legal-main h1{font-size:clamp(39px,5vw,58px);letter-spacing:-.06em;margin:16px 0 12px}.legal-lead{font-size:15px;color:#6c8582;line-height:1.7;max-width:700px;margin-bottom:46px}.legal-main section{padding:25px 0;border-top:1px solid #dfe9e3}.legal-main h2{font-size:20px;letter-spacing:-.03em;margin-bottom:11px}.legal-main section p,.legal-main li{font-size:13px;color:#627b78;line-height:1.8}.legal-main ul{padding-inline-start:22px}.legal-main a{color:#1b826c;text-decoration:underline}.legal-back{font-size:12px;color:#227e68;font-weight:600}
html[dir=rtl] .nav-links,html[dir=rtl] .nav-actions{flex-direction:row}
html[dir=rtl] .hero h1,html[dir=rtl] .section-top h2,html[dir=rtl] .boundary h2,html[dir=rtl] .final-cta h2,html[dir=rtl] .legal-main h1{letter-spacing:0;line-height:1.45}
html[dir=rtl] .eyebrow,html[dir=rtl] .trust-inner>span,html[dir=rtl] .deploy-label{letter-spacing:0}
html[dir=rtl] .demo-frame{transform:rotate(-1deg)}
html[dir=rtl] .demo-live,html[dir=rtl] .decision-state{margin-left:0;margin-right:auto}
html[dir=rtl] .demo-message p{border-radius:11px 3px 11px 11px}
html[dir=rtl] .flow-line{margin-left:0;margin-right:16px}
html[dir=rtl] .demo-decision,html[dir=rtl] .demo-complete{margin-left:0;margin-right:33px}
html[dir=rtl] .action-code,html[dir=rtl] .boundary-visual{direction:ltr}
html[dir=rtl] .deploy-card ul{padding-left:0;padding-right:18px}
@media(max-width:960px){.nav-wrap{gap:26px}.nav-links{gap:15px}.hero{gap:30px;min-height:0;padding-block:75px}.hero h1{font-size:clamp(44px,5vw,60px)}.demo-body{padding:25px}.boundary{gap:40px}}
@media(max-width:760px){.site-header{height:67px}.nav-links,.nav-login{display:none}.nav-wrap{justify-content:space-between}.nav-actions{margin-left:auto}.hero,.boundary{grid-template-columns:1fr}.hero{padding-block:62px 75px}.demo-frame{max-width:600px;transform:none}.trust-inner,.section-top{align-items:start;flex-direction:column}.trust-inner{padding-block:18px;gap:13px}.steps,.faq{padding-block:75px}.steps-grid{grid-template-columns:1fr}.step-card{min-height:0}.deployment{padding-block:75px}.deploy-grid{grid-template-columns:1fr}.deploy-card{min-height:0}.boundary{padding-block:85px}.boundary-visual{min-height:210px}.final-cta{padding:36px;align-items:start;flex-direction:column;margin-bottom:60px}.footer-inner{grid-template-columns:1fr}.site-footer small{grid-column:auto}html[dir=rtl] .nav-actions{margin-left:0;margin-right:auto}}
@media(max-width:480px){.section-shell,.nav-wrap{width:min(100% - 32px,1180px)}.nav-cta{padding-inline:12px}.hero h1{font-size:45px}.hero-description{font-size:14px}.hero-actions .btn{width:100%}.demo-bar{padding-inline:12px;gap:8px}.demo-live{display:none}.demo-body{padding:20px 14px}.demo-decision{margin-left:20px;padding:13px}.decision-state{font-size:7px}.demo-footer{gap:8px}.demo-footer>span{font-size:7px}.trust-inner div{gap:11px;flex-wrap:wrap}.trust-inner b{font-size:10px}.boundary-visual{gap:4px}.boundary-node{padding:10px 7px;font-size:8px}.boundary-caption{font-size:7px}.final-cta{padding:28px}.legal-main{padding-block:50px 80px}html[dir=rtl] .demo-decision,html[dir=rtl] .demo-complete{margin-right:20px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}.btn{transition:none}.demo-frame{transform:none!important}}
.hero-flow-figure,.knowledge-figure{margin:0}
.hero-flow-figure img,.knowledge-figure img{display:block;width:100%;height:auto}
.hero-flow-figure img{aspect-ratio:1672/941;object-fit:cover}
.flow-legend{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:13px 17px;border-bottom:1px solid #e8eeeb;background:#f4f9f6;color:#37665a;font-size:10px;font-weight:600;text-align:center}
.flow-legend span+span{border-inline-start:1px solid #d8e9df}
.steps-story{display:grid;gap:20px}
.knowledge-figure{overflow:hidden;border:1px solid #e0e9e6;border-radius:16px;background:#fff;box-shadow:0 12px 36px #224e4008}
.knowledge-figure img{aspect-ratio:2079/756;object-fit:cover}
.knowledge-figure figcaption{padding:15px 22px;color:#447667;font-size:12px;font-weight:600;text-align:center;line-height:1.6}
.steps-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.step-row{display:flex;align-items:start;gap:14px;min-height:170px;padding:25px;border:1px solid #e0e9e6;border-radius:13px;background:#fff}
.step-row .step-num{flex:none;color:#238b70;padding-top:4px}
.step-row h3{font-size:16px;font-weight:620;letter-spacing:-.025em;margin:0 0 9px}
.step-row p{font-size:12px;line-height:1.7;color:#71898b;margin:0}
html[dir=rtl] .step-row h3{letter-spacing:0}
@media(max-width:760px){.steps-list{grid-template-columns:1fr}.step-row{min-height:0}.knowledge-figure figcaption{padding:12px 16px}.flow-legend{font-size:9px}}
@media(max-width:480px){.flow-legend{gap:2px;padding-inline:7px;font-size:8px}.knowledge-figure img{aspect-ratio:4/3;object-position:35% center}.knowledge-figure figcaption{font-size:10px}.step-row{padding:19px}}
html[lang=fa] *{letter-spacing:0;word-spacing:normal}
html[lang=fa] .wordmark{letter-spacing:-1.6px;font-family:Inter,'Segoe UI',Arial,sans-serif}
html[lang=fa] .hero h1{line-height:1.25}
html[lang=fa] .section-top h2,html[lang=fa] .boundary h2,html[lang=fa] .final-cta h2,html[lang=fa] .legal-main h1{line-height:1.32}
html[lang=fa] .hero-description,html[lang=fa] .section-top p,html[lang=fa] .step-row p,html[lang=fa] .deploy-card p,html[lang=fa] .boundary p,html[lang=fa] .faq details p{line-height:1.6}
.hero-stage{position:relative;width:100%;max-width:1060px;margin:0;overflow:hidden;border:1px solid #dce8e5;border-radius:16px;background:#fff;box-shadow:0 16px 45px #224c4710}
.hero-stage>img{display:block;width:100%;height:232px;object-fit:cover;object-position:center 38%}
.stage-label{position:absolute;top:12px;inset-inline-start:14px;padding:7px 10px;border:1px solid #ffffff90;border-radius:6px;background:#fffdf5e8;color:#55766b;font-size:8px;font-weight:600;letter-spacing:.5px}
.hero-example{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:24px;padding:18px 24px;border-top:1px solid #e3ebe5;text-align:start}
.example-request,.example-result{display:flex;align-items:center;gap:11px;min-width:0}
.hero-example small{display:block;color:#7a9187;font-size:8px;font-weight:600;line-height:1.5;margin-bottom:4px}
.hero-example p{font-size:12px;line-height:1.5;color:#294c42;margin:0}
.example-icon,.example-check{display:grid;place-items:center;flex:none;width:31px;height:31px;border-radius:9px;font-size:16px;background:#eef4f0;color:#51806b}
.example-check{background:#e5f5ea;color:#23835b}
.example-bridge{display:flex;align-items:center;gap:8px;padding-inline:22px;border-inline:1px solid #e5eee8}
.example-bridge .mark{width:28px;height:28px}
.example-bridge small{margin:0;white-space:nowrap}
.runlet-node{display:flex;align-items:center;gap:5px;direction:ltr}
.runlet-node img{display:block;flex:none}
@media(max-width:960px){.hero{padding-block:36px 30px;gap:22px}.hero h1{font-size:clamp(34px,4.3vw,54px)}.hero-example{gap:16px;padding:16px 20px}.example-bridge{padding-inline:14px}}
@media(max-width:760px){.hero{padding-block:32px 28px}.hero-stage>img{height:210px}.hero-example{grid-template-columns:1fr;gap:14px}.example-bridge{display:none}.example-result{padding-top:14px;border-top:1px solid #e5eee8}.hero h1{font-size:clamp(34px,6vw,44px)}}
@media(max-width:480px){.hero{gap:20px}.hero h1{font-size:34px}.hero-description{font-size:13px}.hero-actions .btn{width:auto;min-height:44px;padding:10px 14px;font-size:12px}.hero-stage>img{height:auto;aspect-ratio:1672/941}.stage-label{font-size:7px;top:9px;inset-inline-start:9px}.hero-example{padding:15px}.hero-note{font-size:9px}}

/* Landing motion is isolated from the panel and legal pages. */
.landing-page .hero{position:relative;isolation:isolate}
.landing-page .hero::before{content:"";position:absolute;inset:-10px 0 0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 50% 18%,#d9f0e660,transparent 65%)}
.landing-page .site-header{transition:box-shadow .25s ease}
.landing-page .site-header.is-scrolled{box-shadow:0 4px 22px #193b370a}
.landing-page .site-header::after{content:"";position:absolute;inset-inline:0;bottom:-1px;height:2px;background:#35a887;transform:scaleX(var(--page-progress,0));transform-origin:left;pointer-events:none}
html[dir=rtl] .landing-page .site-header::after{transform-origin:right}
.landing-page .stage-label{z-index:1}
.motion-control{position:absolute;z-index:2;top:12px;inset-inline-end:14px;display:inline-flex;align-items:center;gap:6px;padding:7px 9px;border:1px solid #ffffff90;border-radius:6px;background:#fffdf5e8;color:#55766b;font-size:9px;line-height:1.2}
.motion-control:hover{background:#fff}
.motion-control[hidden],.motion-play-label,.motion-play-icon{display:none}
.motion-control[aria-pressed=true] .motion-pause-label,.motion-control[aria-pressed=true] .motion-pause-icon{display:none}
.motion-control[aria-pressed=true] .motion-play-label,.motion-control[aria-pressed=true] .motion-play-icon{display:inline}

.motion-enabled .hero-copy>*{animation:hero-arrive .7s cubic-bezier(.2,.7,.2,1) both}
.motion-enabled .hero-copy>h1{animation-delay:70ms}
.motion-enabled .hero-copy>.hero-description{animation-delay:140ms}
.motion-enabled .hero-copy>.hero-actions{animation-delay:210ms}
.motion-enabled .hero-copy>.hero-note{animation-delay:260ms}
.motion-enabled .hero-stage{animation:hero-arrive .85s cubic-bezier(.2,.7,.2,1) 300ms both}
.motion-enabled .hero h1 .accent{position:relative;isolation:isolate}
.motion-enabled .hero h1 .accent::after{content:"";position:absolute;z-index:-1;inset-inline:0;bottom:2px;height:6px;border-radius:99px;background:#a4dfc750;transform-origin:left;animation:underline-grow 1s cubic-bezier(.2,.7,.2,1) 450ms both}
html[dir=rtl] .motion-enabled .hero h1 .accent::after{transform-origin:right}
.motion-enabled .reveal-pending{opacity:0;transform:translate3d(0,24px,0);transition:opacity .7s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms),transform .7s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms)}
.motion-enabled .reveal-visible{opacity:1;transform:none}

.hero-example{position:relative;overflow:hidden}
.motion-enabled .flow-running .hero-example::before{content:"";position:absolute;inset-inline-start:0;top:0;width:25%;height:2px;background:linear-gradient(90deg,transparent,#50b892,transparent);animation:request-travel 6s ease-in-out infinite;pointer-events:none}
html[dir=rtl] .landing-page{--flow-direction:-1}
.motion-enabled .flow-running .example-icon{animation:request-pulse 6s ease-in-out infinite}
.motion-enabled .flow-running .example-bridge .mark img{animation:action-match 6s ease-in-out infinite}
.motion-enabled .flow-running .example-check{animation:action-done 6s ease-in-out infinite}
.motion-enabled .flow-running.boundary-visual>span{animation:handoff 6s ease-in-out infinite}
.motion-enabled .flow-running.boundary-visual>span:nth-of-type(2){animation-delay:.7s}
.motion-enabled .flow-running .runlet-node{animation:broker-glow 6s ease-in-out infinite}
.motion-enabled .faq details[open] p{animation:answer-arrive .25s ease-out both}

.motion-paused *,.motion-paused *::before,.motion-paused *::after{animation-play-state:paused!important}
.motion-paused .hero-copy>*,.motion-paused .hero-stage{animation:none;opacity:1;transform:none}
.motion-paused .reveal-pending{opacity:1;transform:none;transition:none}

@keyframes hero-arrive{from{opacity:0;transform:translate3d(0,16px,0)}to{opacity:1;transform:none}}
@keyframes underline-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes request-travel{0%{opacity:0;transform:translateX(calc(-100% * var(--flow-direction,1)))}12%{opacity:1}65%{opacity:1;transform:translateX(calc(400% * var(--flow-direction,1)))}75%,100%{opacity:0;transform:translateX(calc(400% * var(--flow-direction,1)))}}
@keyframes request-travel-down{0%{opacity:0;transform:translateY(-100%)}12%{opacity:1}65%{opacity:1;transform:translateY(400%)}75%,100%{opacity:0;transform:translateY(400%)}}
@keyframes request-pulse{0%,28%,100%{box-shadow:0 0 0 0 #50b89200}12%{box-shadow:0 0 0 7px #50b89218}}
@keyframes action-match{0%,20%,58%,100%{transform:scale(1)}36%{transform:scale(1.15)}}
@keyframes action-done{0%,42%{opacity:.65;transform:scale(.94)}63%{opacity:1;transform:scale(1.12)}78%,100%{opacity:1;transform:scale(1)}}
@keyframes handoff{0%,80%,100%{opacity:.4;transform:translateX(0)}40%{opacity:1;transform:translateX(3px)}}
@keyframes broker-glow{0%,70%,100%{box-shadow:0 0 0 0 #60bd9200}40%{box-shadow:0 0 0 6px #60bd9218}}
@keyframes answer-arrive{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}

@media(hover:hover) and (pointer:fine){
  .landing-page .nav-links a{position:relative}
  .landing-page .nav-links a::after{content:"";position:absolute;inset-inline:0;bottom:-7px;height:1px;background:#35a887;transform:scaleX(0);transform-origin:center;transition:transform .2s ease}
  .landing-page .nav-links a:hover::after{transform:scaleX(1)}
  .landing-page .wordmark .mark{transition:transform .25s ease}
  .landing-page .wordmark:hover .mark{transform:translateY(-2px) rotate(-6deg)}
  .landing-page .btn>span{transition:transform .2s ease}
  .landing-page .btn:hover>span{transform:translate(2px,-2px)}
  .landing-page .step-row,.landing-page .deploy-card{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
  .landing-page .step-row:hover,.landing-page .deploy-card:hover{transform:translateY(-4px);border-color:#9acdb8;box-shadow:0 16px 30px #224e4010}
  .landing-page .knowledge-figure img{transition:transform .8s ease}
  .landing-page .knowledge-figure:hover img{transform:scale(1.015)}
}
@media(max-width:760px){.motion-enabled .flow-running .hero-example::before{top:0;width:2px;height:25%;background:linear-gradient(transparent,#50b892,transparent);animation-name:request-travel-down}}
@media(max-width:480px){.motion-control{top:9px;inset-inline-end:9px;padding:6px 7px;font-size:8px}}
@media(prefers-reduced-motion:reduce){
  .landing-page *,.landing-page *::before,.landing-page *::after{animation:none!important;transition:none!important}
  .landing-page .reveal-pending{opacity:1;transform:none}
  .landing-page .hero-example::before,.motion-control{display:none}
}

/* A hands-on explanation, styled as product UI rather than API output. */
.hero-contact{display:inline-block;margin-top:12px;color:#34745d;font-size:12px;text-underline-offset:4px}
.interactive-example{padding-block:64px 48px}
.example-console{border:1px solid #dce6df;border-radius:20px;background:#fff;box-shadow:0 12px 40px #193e2b06;overflow:hidden}
.example-toolbar{padding:18px 24px;border-bottom:1px solid #e7ede8;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:#fafcf9}
.example-choices{display:flex;gap:4px;flex-wrap:wrap;padding:4px;border:1px solid #e0e7e1;border-radius:12px;background:#fff}
.example-choices button{font:inherit;font-size:13px;font-weight:500;padding:9px 14px;border:0;border-radius:8px;background:transparent;color:#657168;cursor:pointer}
.example-choices button[aria-pressed=true]{background:#e8f3ec;color:#205d43}
.preview-label{font-size:11px;color:#69776d}
.use-case-panel{display:grid;grid-template-columns:1fr 1fr;min-height:330px}
.use-case-panel[hidden]{display:none}
.case-request{padding:32px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;border-inline-end:1px solid #e7ede8}
.case-message{background:#edf5ef;color:#234d38;padding:18px 20px;border-radius:16px 16px 4px 16px;font-size:19px;line-height:1.6;margin:18px 0}
.case-context{font-size:13px;line-height:1.8;color:#67736b;max-width:390px;margin:0}
.case-result{background:#f7faf7;padding:28px 32px;display:flex;flex-direction:column;justify-content:center}
.result-label{font-size:10px;letter-spacing:.08em;font-weight:600;color:#347354;display:block;margin-bottom:12px}
.sample-form,.sample-ticket{background:#fff;border:1px solid #e0e8e2;border-radius:14px;padding:20px;width:100%;max-width:430px}
.case-result h3{font-size:16px;font-weight:600;line-height:1.6;margin:0 0 12px}
.sample-field-label{display:block;font-size:11px;color:#617269;margin:10px 0 5px}
.sample-field{display:block;border:1px solid #e3e9e5;background:#fcfdfb;border-radius:7px;padding:9px 12px;color:#77837b;font-size:12px}
.sample-textarea{min-height:52px}
.sample-success{display:block;color:#27704c;font-size:11px;margin-top:16px}
.sample-status{display:inline-block;background:#e9f3eb;color:#337451;padding:4px 8px;border-radius:20px;font-size:10px;white-space:nowrap}
.sample-ticket .sample-status{margin-bottom:16px}
.sample-ticket p{color:#66736b;font-size:13px;line-height:1.8}
.sample-ticket-footer{display:flex;justify-content:space-between;border-top:1px solid #e6ece7;padding-top:14px;margin-top:24px;font-size:11px;color:#728078}
.sample-list{display:grid;gap:12px}
.sample-list-card{display:flex;align-items:center;gap:12px;border:1px solid #e0e8e2;border-radius:12px;background:#fff;padding:18px}
.sample-list-card h3{font-size:13px;margin:0;flex:1}
.sample-list-icon{color:#397358;background:#edf5ef;padding:8px;border-radius:8px}
.example-next{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 24px;border-top:1px solid #e7ede8;font-size:12px;color:#657369;flex-wrap:wrap}
.outcome-points{display:flex;justify-content:center;flex-wrap:wrap;gap:12px 32px;padding-top:22px;font-size:12px;color:#66766a}
.outcome-points span::before{content:'✓';color:#3c855b;margin-inline-end:8px}
.usage-section{display:grid;grid-template-columns:1.5fr 1fr;gap:48px;padding-block:40px 64px}
.usage-section h2{font-size:30px;font-weight:600;letter-spacing:-.025em;margin:12px 0}
.usage-section p{font-size:14px;line-height:1.8;color:#627165;max-width:650px}
.usage-contact{border-inline-start:1px solid #dce6df;padding-inline-start:32px;align-self:center}
.usage-contact .btn{margin-top:12px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.example-choices button:focus-visible{outline:2px solid #347354;outline-offset:3px}
[lang=fa] .result-label{letter-spacing:0}
@media(max-width:760px){.interactive-example{padding-top:40px}.use-case-panel{grid-template-columns:1fr}.case-request{border-inline-end:0;border-bottom:1px solid #e7ede8;padding:24px}.case-result{padding:24px}.case-message{font-size:17px}.example-toolbar{padding:16px}.preview-label{width:100%}.usage-section{grid-template-columns:1fr;gap:16px}.usage-contact{border-inline-start:0;padding-inline-start:0}.usage-section h2{font-size:26px}.example-next{padding:16px}.example-choices button{font-size:12px;padding:8px 10px}}
