/* NanoSys — Official Website Preview v5 */
@import url("https://cdn.jsdelivr.net/npm/vazirmatn@33.003/Vazirmatn-font-face.css");
:root{
 --bg:#050c15;--bg-alt:#071522;--surface:#091a2a;--surface-2:#0b2134;
 --line:rgba(117,171,206,.15);--line-bright:rgba(0,198,224,.30);
 --text:#f3f8fd;--soft:#d3e1eb;--muted:#8fa7ba;
 --navy:#0B132B;--blue:#1565FF;--cyan:#00C6E0;--success:#31cf96;--warm:#fcb257;
 --shadow:0 28px 78px rgba(0,0,0,.36);--radius:24px;--max:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;direction:rtl;color:var(--text);font-family:Vazirmatn,Tahoma,Arial,sans-serif;background:
 radial-gradient(820px 480px at 86% 0,rgba(21,101,255,.19),transparent 66%),
 radial-gradient(700px 500px at 0 18%,rgba(0,198,224,.08),transparent 70%),
 var(--bg);overflow-x:hidden}
body::after{content:"";position:fixed;z-index:-1;inset:0;pointer-events:none;background:
 linear-gradient(rgba(103,163,200,.032) 1px,transparent 1px),
 linear-gradient(90deg,rgba(103,163,200,.032) 1px,transparent 1px);
 background-size:60px 60px;mask-image:radial-gradient(ellipse at 63% 10%,#000,transparent 72%)}
a{color:inherit;text-decoration:none}img{display:block;max-width:100%}
button,input,select,textarea{font:inherit}
.en{direction:ltr;unicode-bidi:isolate;display:inline-block;font-family:Arial,sans-serif}
.container{width:min(var(--max),calc(100% - 44px));margin-inline:auto}
.section{padding:82px 0}
.section--border{border-block:1px solid rgba(117,171,206,.07);background:rgba(4,12,21,.42)}
.pill{display:inline-flex;align-items:center;gap:8px;margin-bottom:18px;padding:8px 14px;border-radius:999px;color:var(--cyan);font-size:12px;font-weight:600;background:rgba(0,198,224,.07);border:1px solid rgba(0,198,224,.18)}
.pill::before{content:"";width:7px;height:7px;border-radius:99px;background:var(--cyan);box-shadow:0 0 11px var(--cyan)}
h1,h2,h3,p{margin-top:0}h2{font-size:clamp(28px,4vw,41px);line-height:1.65;letter-spacing:-.45px;margin-bottom:13px}
.lead{max-width:770px;color:var(--muted);font-size:15px;line-height:2.22;margin:0}
.button{height:51px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:13px;padding:0 21px;border:1px solid transparent;font-size:14px;font-weight:600;transition:transform .18s,border-color .18s}
.button:hover{transform:translateY(-2px)}
.button--primary{background:linear-gradient(103deg,#04bddc,var(--blue));box-shadow:0 12px 29px rgba(17,110,224,.27)}
.button--secondary{border-color:rgba(0,198,224,.32);background:rgba(8,34,53,.48);color:#dcf4fb}
/* Header */
.header{height:78px;position:sticky;top:0;z-index:50;background:rgba(5,12,21,.90);border-bottom:1px solid var(--line);backdrop-filter:blur(17px)}
.header__row{height:100%;display:flex;align-items:center;justify-content:space-between;gap:22px}
.logo img{width:204px;height:auto}
.nav{display:flex;align-items:center;gap:23px;font-size:13px;color:#c8dae7}
.nav a:hover{color:var(--cyan)}
.header__buttons{display:flex;align-items:center;gap:9px}
.header__buttons .button{height:44px;padding-inline:16px;font-size:12.5px;white-space:nowrap}
.menu-button{display:none;height:45px;width:45px;align-items:center;justify-content:center;border-radius:13px;background:var(--surface);border:1px solid var(--line);color:var(--text)}
.menu-button svg{width:23px;height:23px}
.mobile-menu{display:none;position:fixed;top:78px;right:0;left:0;padding:10px 21px 19px;background:#071521;border-bottom:1px solid var(--line);z-index:49}
.mobile-menu.open{display:block}
.mobile-menu a.anchor{display:block;border-bottom:1px solid rgba(117,171,206,.11);padding:14px 4px;font-size:14px;color:#cedee9}
.mobile-menu__actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}
.mobile-menu__actions .button{padding-inline:8px}
/* Hero */
.hero{padding:66px 0 48px}
.hero__grid{display:grid;grid-template-columns:minmax(450px,1fr) 493px;gap:51px;align-items:center}
.hero h1{font-size:clamp(38px,5vw,55px);line-height:1.7;letter-spacing:-1px;margin-bottom:15px}
.hero h1 span{display:block;color:var(--cyan)}
.hero__text{color:var(--muted);font-size:15.5px;line-height:2.34;max-width:630px;margin-bottom:30px}
.hero__actions{display:flex;flex-wrap:wrap;gap:11px}
.hero__visual img{width:100%;border-radius:30px;box-shadow:var(--shadow)}
.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:48px}
.metric{min-height:124px;border-radius:18px;background:rgba(8,23,38,.75);border:1px solid var(--line);padding:21px 22px}
.metric strong{direction:ltr;unicode-bidi:isolate;text-align:right;display:block;color:var(--cyan);font:700 33px Arial,sans-serif;margin-bottom:7px}
.metric h3{font-size:14px;margin-bottom:5px}
.metric p{color:var(--muted);font-size:12px;line-height:1.9;margin:0}
/* Expertise */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:38px}
.card{border-radius:20px;border:1px solid var(--line);background:rgba(8,24,39,.76);padding:23px 20px;min-height:211px;transition:transform .17s,border-color .17s}
.card:hover{transform:translateY(-3px);border-color:var(--line-bright)}
.card__icon{width:44px;height:44px;border-radius:12px;background:rgba(0,198,224,.07);border:1px solid rgba(0,198,224,.18);display:grid;place-items:center;color:var(--cyan);font-size:20px;margin-bottom:16px}
.card h3{font-size:15px;line-height:1.85;margin-bottom:8px}
.card p{font-size:12.2px;line-height:2;color:var(--muted);margin:0}
/* Continuity */
.journey{display:grid;grid-template-columns:repeat(5,1fr);gap:11px;margin-top:35px}
.journey__step{position:relative;min-height:102px;display:grid;place-items:center;text-align:center;border-radius:17px;background:var(--surface);border:1px solid var(--line);font-size:13px;color:#d7e5ef}
.journey__step i{display:block;font-style:normal;font-size:22px;color:var(--cyan);margin-bottom:6px}
.journey__step:not(:last-child)::after{content:"‹";position:absolute;left:-12px;color:var(--cyan);top:39px;font-size:21px}
/* Healthcare / power */
.two{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.panel{height:100%;padding:29px 26px;border:1px solid var(--line);border-radius:24px;background:var(--surface)}
.panel h3{font-size:22px;line-height:1.8;margin-bottom:11px}
.panel p{font-size:13.5px;color:var(--muted);line-height:2.18;margin-bottom:21px}
.tags{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.tags span{padding:10px 9px;border-radius:10px;border:1px solid var(--line);color:#d0e0ea;font-size:11.5px}
.tags span::before{content:"✓";color:var(--success);font-weight:bold;margin-left:7px}
/* Products + trust */
.products{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;margin-top:38px}
.product{position:relative;overflow:hidden;padding:29px 27px;border-radius:24px;border:1px solid rgba(0,198,224,.19);background:linear-gradient(145deg,#0b2033,#071421)}
.product small{display:block;direction:ltr;text-align:right;font:600 10px Arial,sans-serif;color:var(--cyan);margin-bottom:15px}
.product h3{font:600 26px Arial,sans-serif;direction:ltr;text-align:right;margin-bottom:11px}
.product p{color:var(--muted);font-size:13px;line-height:2.15;margin-bottom:22px}
.chip{display:inline-flex;font-size:11px;color:var(--warm);border:1px solid rgba(252,178,87,.28);border-radius:99px;padding:7px 12px}
.trust{display:grid;grid-template-columns:.95fr 1.05fr;gap:16px}
.bio,.principles{border:1px solid var(--line);border-radius:24px;background:var(--surface);padding:28px}
.bio h3{font-size:26px;margin-bottom:5px}.bio .role{font:500 13px Arial,sans-serif;direction:ltr;text-align:right;color:var(--cyan);margin-bottom:17px}.bio p{font-size:13.5px;line-height:2.18;color:var(--muted);margin:0}
.principles{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px;background:transparent;border:0}
.principle{border-radius:18px;background:var(--surface);border:1px solid var(--line);padding:20px}
.principle h3{font-size:14px;margin-bottom:7px}.principle p{font-size:12px;color:var(--muted);line-height:1.9;margin:0}
/* Contact */
.contact{display:grid;grid-template-columns:322px 1fr;gap:16px;margin-top:35px}
.contact__details{display:flex;flex-direction:column;gap:11px}
.detail{border-radius:17px;border:1px solid var(--line);background:var(--surface);padding:20px}
.detail span{display:block;font-size:11.5px;color:var(--muted);margin-bottom:8px}
.detail a{font:500 18px Arial,sans-serif;direction:ltr;unicode-bidi:isolate;display:inline-block;color:#f1f7fc}
.form{border-radius:22px;border:1px solid var(--line);background:var(--surface);padding:25px}
.form__grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.field--full{grid-column:1/-1}
.field label{display:block;margin-bottom:7px;color:#cadce8;font-size:12px}
.field input,.field select,.field textarea{width:100%;padding:12px 13px;border:1px solid rgba(117,171,206,.19);border-radius:10px;background:#06131e;color:var(--text);outline:none}
.field textarea{min-height:103px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--cyan)}
.hidden{display:none!important}
.success{display:none;padding:12px;margin-bottom:15px;border-radius:10px;border:1px solid rgba(49,207,150,.36);background:rgba(49,207,150,.08);font-size:12.5px;color:#83edc3}
.success.show{display:block}
/* Floating contact */
.float{position:fixed;bottom:20px;left:17px;z-index:100;display:flex;align-items:flex-start;flex-direction:column-reverse;gap:9px}
.float__main{height:53px;border:0;border-radius:99px;background:linear-gradient(104deg,var(--cyan),var(--blue));color:white;box-shadow:0 14px 30px rgba(18,102,220,.34);display:flex;align-items:center;gap:8px;padding:0 16px;cursor:pointer;font-size:13px;font-weight:600}
.float__items{display:flex;flex-direction:column-reverse;gap:8px;opacity:0;transform:translateY(12px);pointer-events:none;transition:.2s}
.float.open .float__items{opacity:1;transform:none;pointer-events:auto}
.float__link{height:45px;border-radius:99px;border:1px solid var(--line-bright);background:#0b2033;display:flex;align-items:center;gap:9px;padding:0 14px;font-size:12.5px;box-shadow:var(--shadow)}
.float__link i{font-style:normal;color:var(--cyan)}
.footer{padding:28px 0;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
.footer__row{display:flex;align-items:center;justify-content:space-between;gap:17px}.footer__links{display:flex;align-items:center;gap:19px}.footer__links a{direction:ltr;unicode-bidi:isolate}
/* Responsive */
@media(max-width:1080px){
 .nav,.header__buttons{display:none}.menu-button{display:flex}
 .hero__grid{grid-template-columns:1fr;gap:36px}.hero__copy{text-align:center}.hero__text{margin-inline:auto}.hero__actions{justify-content:center}
 .hero__visual{max-width:550px;margin-inline:auto}
 .cards{grid-template-columns:repeat(2,1fr)}
 .journey{grid-template-columns:1fr;gap:8px}.journey__step{min-height:73px}.journey__step::after{display:none}
 .two,.trust,.contact{grid-template-columns:1fr}
}
@media(max-width:620px){
 .container{width:calc(100% - 28px)}.header{height:71px}.logo img{width:181px}.mobile-menu{top:71px}.mobile-menu__actions{grid-template-columns:1fr}
 .section{padding:56px 0}.hero{padding:37px 0 38px}.hero h1{font-size:30px;line-height:1.82}.hero__text{font-size:13.5px;line-height:2.22}.pill{font-size:11.5px}
 .hero__actions .button{flex:1;min-width:135px;padding-inline:10px}
 .hero__visual img{border-radius:21px}
 .metrics,.cards,.two,.tags,.products,.principles,.form__grid{grid-template-columns:1fr}
 .metric{min-height:0;padding:19px}.card{min-height:0;padding:21px 18px}
 .panel,.product,.bio,.form{padding:21px 18px}.panel h3{font-size:20px}
 .footer__row{flex-direction:column;text-align:center}.footer__links{flex-direction:column;gap:7px}
 .float__main{height:53px;width:53px;padding:0;justify-content:center}.float__main span{display:none}
}