:root{--primary-color: #1d366a;--primary-color-fade: #e8f9ff;--secondary-color: #fece20;--secondary-color-fade: #ffe896;--text-color: #000;--reverse-text-color: #fff;--transform-start: translateX(100%);--transform-middle: translateX(-5%);--transform-end: translateX(0%)}*{margin:0;padding:0;box-sizing:border-box}body{min-height:100vh;color:var(--text-color);font-family:Poppins,sans-serif;overflow-x:hidden}body *{font-family:Poppins,sans-serif}body[dir=rtl]{--transform-start: translateX(-100%);--transform-middle: translateX(5%);--transform-end: translateX(0%);font-family:Vazirmatn,sans-serif}body[dir=rtl] *{font-family:Vazirmatn,sans-serif}body[dir=rtl] .flip{transform:scaleX(-1)}smart-city-erp{position:relative;display:flex;flex-direction:column;min-height:100vh}router-outlet+*{flex:1}home{overflow:hidden;scroll-behavior:smooth}home .hero h1 span{animation:text-shadow 1s infinite alternate}@keyframes text-shadow{0%{text-shadow:1px 0 0 var(--secondary-color),-1px 0 0 var(--secondary-color),0 1px 0 var(--secondary-color),0 -1px 0 var(--secondary-color)}to{text-shadow:1px 0 0 transparent,-1px 0 0 transparent,0 1px 0 transparent,0 -1px 0 transparent}}home .vision{position:relative;display:flex;width:100%}home .vision h2{width:100%;font-weight:600;font-size:150px;color:var(--primary-color)}home .vision h2 span{display:block;width:100%;font-weight:400;animation:blur 1s infinite alternate;text-align:end}home .vision h2 span i{font-style:normal;animation:fade-color 1s infinite alternate}@keyframes fade-color{0%{color:inherit}to{color:var(--secondary-color)}}@keyframes blur{0%{filter:blur(0px)}to{filter:blur(2px)}}.grids{position:fixed;width:100%;height:100%;top:0;left:0;background:linear-gradient(90deg,rgba(0,255,255,.15) 1px,transparent 1px),linear-gradient(rgba(0,255,255,.15) 1px,transparent 1px);background-size:7% 15%;animation:glow 3s infinite linear,move 50s linear infinite}@keyframes glow{0%{filter:brightness(.5)}50%{filter:brightness(1.5)}to{filter:brightness(.5)}}@keyframes move{0%{background-position:0 0}to{background-position:100% 100%}}@media (max-width: 1024px){.grids{background-size:15% 25%}}@media (max-width: 768px) and (min-width: 500px){.grids{background-size:20% 35%}}@media (max-width: 500px){.grids{background-size:25% 35%}}custom-button{position:relative;display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:15px;height:46px;font-size:18px;color:var(--primary-color);white-space:nowrap;transition:all .3s;cursor:pointer}custom-button span{position:absolute;width:46px;height:46px;left:0;right:0;border-radius:5px;background:var(--secondary-color-fade);transition:all .3s;overflow:hidden;z-index:-1}custom-button svg{width:46px;height:16px;padding:0 16px;opacity:1;fill:var(--primary-color);transition:all .3s}custom-button:hover{gap:15px;padding:15px;color:var(--contact-reverse-color)}custom-button:hover span{width:100%}custom-button:hover svg{width:16px;padding:0;fill:var(--contact-reverse-color)}