:root{
  --navy:#061f44;
  --navy-2:#0b2f62;
  --blue:#2674ff;
  --orange:#ff5a0a;
  --orange-2:#ff7a1a;
  --ink:#0b2348;
  --muted:#66758f;
  --line:#dfe8f4;
  --panel:#ffffff;
  --soft:#f6f9fd;
  --shadow:0 18px 50px rgba(14,45,84,.11);
  --radius:28px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Tahoma,"Segoe UI",Arial,sans-serif;color:var(--ink);background:#f7f9fc;direction:rtl;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none} button,a{touch-action:manipulation} img{max-width:100%;display:block}
.container{width:min(1180px,calc(100% - 40px));margin-inline:auto}
.brand{display:inline-flex;align-items:center;gap:12px;direction:ltr}
.brand img{width:58px;height:64px;object-fit:contain}.brand-name{font-size:34px;font-weight:800;letter-spacing:-1.5px;color:var(--navy)}.brand-name .sys{color:var(--orange)}
.eyebrow{font-size:13px;letter-spacing:4px;color:#7283a2;text-transform:uppercase;font-weight:700}
.btn{min-height:52px;border-radius:15px;padding:0 24px;display:inline-flex;align-items:center;justify-content:center;gap:10px;font-size:17px;font-weight:800;border:1px solid transparent;transition:.2s ease;cursor:pointer}.btn:hover{transform:translateY(-1px)}
.btn-primary{background:linear-gradient(135deg,var(--orange),var(--orange-2));color:#fff;box-shadow:0 10px 24px rgba(255,90,10,.2)}.btn-outline{border-color:#bdcce0;background:#fff;color:var(--navy)}.btn-navy{background:var(--navy);color:white}.muted{color:var(--muted)}
.site-header{height:86px;background:rgba(255,255,255,.94);border-bottom:1px solid #edf1f7;display:flex;align-items:center;position:sticky;top:0;z-index:20;backdrop-filter:blur(14px)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:20px}.site-header .brand img{width:42px;height:46px}.site-header .brand-name{font-size:26px}
.nav{display:flex;align-items:center;gap:30px;font-size:15px;font-weight:700;color:#40516d}.nav a:hover,.nav a.active{color:var(--orange)}.mobile-menu{display:none}
.page-shell{min-height:100vh;position:relative;overflow:hidden;background:radial-gradient(circle at 6% 22%,rgba(38,116,255,.08),transparent 22%),radial-gradient(circle at 92% 62%,rgba(255,90,10,.06),transparent 22%),linear-gradient(180deg,#fff 0,#f8fbff 60%,#fff 100%)}
.page-shell:before,.page-shell:after{content:"";position:absolute;width:340px;height:340px;border-radius:90px;transform:rotate(45deg);background:rgba(219,233,250,.38);z-index:0}.page-shell:before{right:-220px;top:220px}.page-shell:after{left:-250px;bottom:50px}.page-content{position:relative;z-index:1}
.home{min-height:100vh;display:grid;place-items:center;padding:36px 0}.home-wrap{width:min(1080px,calc(100% - 34px));text-align:center}.home-brand{justify-content:center;margin-bottom:14px}.home-brand img{width:88px;height:98px}.home-brand .brand-name{font-size:55px}
.home h1{font-size:clamp(34px,4.6vw,61px);line-height:1.18;margin:12px 0 13px;letter-spacing:-2px}.home .tagline{font-size:clamp(20px,2.3vw,31px);color:#687792;margin:0 0 34px}
.product-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;max-width:880px;margin:0 auto}.product-card{background:rgba(255,255,255,.92);border:1px solid #e5edf7;border-radius:30px;padding:34px 30px 26px;box-shadow:var(--shadow);transition:.25s ease;min-height:380px;display:flex;flex-direction:column;align-items:center}.product-card:hover{transform:translateY(-5px);box-shadow:0 23px 60px rgba(14,45,84,.15)}
.product-illustration{width:220px;height:170px;position:relative;display:grid;place-items:center;margin-bottom:12px}.product-illustration:before{content:"";position:absolute;width:170px;height:125px;border-radius:45px;background:linear-gradient(135deg,#fff4eb,#eaf3ff);transform:rotate(-6deg)}.icon-svg{position:relative;width:116px;height:116px;color:var(--navy);filter:drop-shadow(0 10px 18px rgba(5,30,65,.08))}
.product-card h2{font-size:35px;margin:2px 0 10px}.product-card p{margin:0 0 24px;font-size:19px;color:#687792;min-height:48px}.product-card .btn{width:100%;margin-top:auto}
.contact-line{margin:35px auto 0;display:flex;align-items:center;justify-content:center;gap:18px;color:#66758f}.contact-line:before,.contact-line:after{content:"";width:80px;height:1px;background:#cad7e7}.contact-line a{color:var(--navy);font-weight:800;direction:ltr}
.hero{padding:58px 0 38px}.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:48px;align-items:center}.hero h1{font-size:clamp(38px,4.2vw,60px);line-height:1.22;margin:15px 0 18px;letter-spacing:-2.2px}.hero h1 strong{color:var(--blue)}.hero .lead{font-size:20px;line-height:2;color:#60708b;margin:0 0 24px;max-width:660px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.hero-actions .btn{min-width:190px}.hero-note{font-size:14px;color:#8995a8;margin-top:18px}
.ui-scene{min-height:480px;position:relative;display:grid;place-items:center}.device-card{width:100%;max-width:570px;background:#fff;border:1px solid #dfe8f4;border-radius:30px;box-shadow:0 30px 70px rgba(6,31,68,.16);padding:18px;transform:perspective(900px) rotateY(-2deg)}
.window-top{height:36px;border-bottom:1px solid #edf2f8;display:flex;align-items:center;gap:7px;padding:0 6px;direction:ltr}.dot{width:9px;height:9px;border-radius:50%;background:#d6dee9}.dot:nth-child(1){background:#ff715b}.dot:nth-child(2){background:#ffbf3d}.dot:nth-child(3){background:#36c66d}
.chat-ui{display:grid;grid-template-columns:38% 62%;min-height:365px}.chat-list{background:#f8fbff;border-left:1px solid #e5edf7;padding:12px}.chat-main{padding:14px 16px;display:flex;flex-direction:column}.ui-title{font-weight:900;font-size:16px;margin-bottom:12px}.chat-item{display:flex;gap:9px;align-items:center;padding:10px 4px;border-bottom:1px solid #edf2f8}.avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#2b75ff,#20b981);flex:none}.avatar.orange{background:linear-gradient(135deg,#ff6b11,#ff9d42)}.avatar.purple{background:linear-gradient(135deg,#7038e8,#a969f3)}.chat-item div{min-width:0}.chat-item b{font-size:12px}.chat-item small{display:block;color:#8390a5;font-size:9px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.msg{max-width:78%;background:#f1f5fb;padding:10px 12px;border-radius:14px;margin:5px 0;font-size:12px;line-height:1.65}.msg.me{background:#e8f2ff;margin-right:auto}.composer{margin-top:auto;border:1px solid #dce6f2;border-radius:12px;height:38px;color:#9aa5b6;display:flex;align-items:center;padding:0 12px;font-size:10px}.phone-float{position:absolute;left:4%;bottom:0;width:210px;background:#071f42;border:8px solid #08162b;border-radius:30px;box-shadow:0 18px 40px rgba(6,31,68,.25);overflow:hidden;transform:rotate(-2deg)}.phone-top{height:28px;background:#071f42}.phone-screen{background:#fff;padding:10px;min-height:300px}.phone-screen .chat-item{padding:8px 2px}.phone-screen .avatar{width:28px;height:28px}
.section{padding:50px 0}.section-title{text-align:center;font-size:36px;margin:0 0 10px;letter-spacing:-1px}.section-sub{text-align:center;color:#75839a;margin:0 0 30px;font-size:17px}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.feature{background:#fff;border:1px solid #e7eef7;border-radius:22px;padding:24px;text-align:center;box-shadow:0 10px 28px rgba(10,40,80,.06)}.feature-icon{width:62px;height:62px;border-radius:50%;background:#eef5ff;display:grid;place-items:center;margin:0 auto 15px;color:var(--blue)}.feature:nth-child(2) .feature-icon{background:#fff1e8;color:var(--orange)}.feature:nth-child(3) .feature-icon{background:#ebfaf5;color:#1ba979}.feature:nth-child(4) .feature-icon{background:#f3ecff;color:#7642db}.feature svg{width:31px;height:31px}.feature h3{font-size:18px;margin:0 0 9px}.feature p{font-size:14px;line-height:1.8;color:#78859a;margin:0}.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.why{background:#fff;border:1px solid #e7eef7;border-radius:20px;padding:22px;display:flex;gap:14px;align-items:flex-start}.why-badge{width:46px;height:46px;border-radius:14px;background:#fff2e9;color:var(--orange);display:grid;place-items:center;flex:none}.why-badge svg{width:24px;height:24px}.why h3{margin:1px 0 5px;font-size:18px}.why p{margin:0;color:#78859a;font-size:14px;line-height:1.75}
.footer{padding:24px 0;border-top:1px solid #e9eff6;background:#fff}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:24px}.footer .brand img{width:38px;height:42px}.footer .brand-name{font-size:22px}.footer-contact{display:flex;gap:9px;align-items:center;font-size:14px;color:#697792}.footer-contact a{direction:ltr;font-size:17px;font-weight:800;color:var(--navy)}
.cc-ui{background:#f8fbff;border-radius:20px;padding:16px;min-height:395px}.cc-topcards{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.metric{background:#fff;border:1px solid #e3ebf4;border-radius:14px;padding:12px;text-align:center}.metric b{display:block;font-size:23px;color:var(--navy)}.metric span{font-size:9px;color:#7f8aa0}.cc-body{display:grid;grid-template-columns:1.2fr .8fr;gap:12px;margin-top:12px}.chart{height:160px;background:#fff;border:1px solid #e3ebf4;border-radius:16px;padding:12px;position:relative;overflow:hidden}.chart-title{font-size:11px;font-weight:800}.chart-lines{position:absolute;inset:48px 12px 20px;background:linear-gradient(to bottom,transparent 24%,#edf2f8 25%,transparent 26%,transparent 49%,#edf2f8 50%,transparent 51%,transparent 74%,#edf2f8 75%,transparent 76%)}.chart-lines:before,.chart-lines:after{content:"";position:absolute;left:0;right:0;height:70px;border-top:3px solid #2e77ff;border-radius:50%;transform:skewY(-8deg) translateY(24px)}.chart-lines:after{border-color:#ff6a16;transform:skewY(7deg) translateY(42px)}.agent-list{background:#fff;border:1px solid #e3ebf4;border-radius:16px;padding:12px}.agent{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #eef2f7;padding:9px 0;font-size:10px}.status{width:8px;height:8px;border-radius:50%;background:#20b981}.status.busy{background:#ff9a38}.call-pop{position:absolute;right:-12px;bottom:24px;width:205px;background:#fff;border:1px solid #dce6f1;border-radius:20px;box-shadow:0 16px 35px rgba(8,36,73,.16);padding:15px}.call-pop h4{font-size:13px;margin:0 0 6px}.call-pop p{font-size:10px;color:#7d8aa0;margin:0 0 12px}.hang{width:46px;height:46px;border-radius:50%;background:#ff4b32;color:#fff;display:grid;place-items:center;margin:auto;font-size:20px}
@media (max-width:900px){.container{width:min(100% - 28px,760px)}.nav{display:none}.mobile-menu{display:grid;place-items:center;width:44px;height:44px;border:1px solid #e1e8f1;border-radius:12px;background:#fff;color:var(--navy)}.hero{padding:34px 0 26px}.hero-grid{grid-template-columns:1fr;gap:22px}.hero-copy{text-align:center}.hero .lead{margin-inline:auto}.hero-actions{justify-content:center}.ui-scene{min-height:420px}.device-card{max-width:620px}.phone-float{left:2%}.feature-grid{grid-template-columns:1fr 1fr}.why-grid{grid-template-columns:1fr}}
@media (max-width:620px){.site-header{height:70px}.site-header .brand img{width:36px;height:40px}.site-header .brand-name{font-size:22px}.home{padding:24px 0}.home-brand img{width:70px;height:78px}.home-brand .brand-name{font-size:42px}.home h1{font-size:36px;letter-spacing:-1.4px}.home .tagline{font-size:20px;line-height:1.8;margin-bottom:25px}.product-grid{grid-template-columns:1fr;gap:18px}.product-card{min-height:0;padding:25px 22px 22px}.product-illustration{height:140px}.product-card h2{font-size:30px}.product-card p{font-size:17px;min-height:0}.contact-line{margin-top:24px}.hero h1{font-size:36px;letter-spacing:-1.4px}.hero .lead{font-size:17px;line-height:1.9}.hero-actions{display:grid;grid-template-columns:1fr;width:100%}.hero-actions .btn{width:100%}.ui-scene{min-height:360px}.device-card{padding:10px;border-radius:22px}.chat-ui{min-height:300px;grid-template-columns:44% 56%}.chat-main{padding:10px}.msg{font-size:10px}.phone-float{display:none}.section{padding:38px 0}.section-title{font-size:29px}.feature-grid{grid-template-columns:1fr 1fr;gap:12px}.feature{padding:18px 12px}.feature h3{font-size:16px}.feature p{font-size:12px}.feature-icon{width:52px;height:52px}.footer-inner{flex-direction:column}.footer{padding-bottom:28px}.cc-topcards{grid-template-columns:repeat(2,1fr)}.cc-body{grid-template-columns:1fr}.call-pop{display:none}}
@media (max-width:420px){.feature-grid{grid-template-columns:1fr}.home h1{font-size:31px}.home .tagline{font-size:18px}.product-card{border-radius:24px}.hero h1{font-size:31px}.chat-ui{grid-template-columns:1fr}.chat-main{display:none}}

/* NanoSys Home — Mobile single-screen final */
@media (max-width:620px){

  .page-shell.home{
    height:100dvh;
    min-height:100dvh;
    overflow:hidden;
    padding:10px 0;
  }

  .home-wrap{
    width:calc(100% - 24px);
    height:100%;
    display:grid;
    grid-template-rows:auto auto auto minmax(0,1fr) auto;
    align-content:stretch;
  }

  .home-brand{
    margin:0 auto 2px;
  }

  .home-brand img{
    width:48px;
    height:54px;
  }

  .home-brand .brand-name{
    font-size:30px;
  }

  .home h1{
    font-size:27px;
    line-height:1.25;
    margin:2px 0 3px;
    letter-spacing:-.8px;
  }

  .home .tagline{
    font-size:15px;
    line-height:1.45;
    margin:0 0 8px;
  }

  .product-grid{
    width:100%;
    max-width:none;
    height:100%;
    min-height:0;
    display:grid;
    grid-template-columns:1fr;
    grid-template-rows:repeat(2,minmax(0,1fr));
    gap:10px;
    margin:0;
  }

  .product-card{
    min-height:0;
    height:100%;
    padding:10px 14px;
    border-radius:20px;

    display:grid;
    grid-template-columns:100px 1fr;
    grid-template-rows:auto auto auto;
    column-gap:12px;
    align-content:center;
    align-items:center;
    text-align:right;
  }

  .product-illustration{
    grid-column:1;
    grid-row:1 / 4;
    width:100px;
    height:95px;
    margin:0;
  }

  .product-illustration:before{
    width:90px;
    height:72px;
    border-radius:26px;
  }

  .icon-svg{
    width:68px;
    height:68px;
  }

  .product-card h2{
    grid-column:2;
    margin:0;
    font-size:25px;
    line-height:1.25;
  }

  .product-card p{
    grid-column:2;
    min-height:0;
    margin:2px 0 7px;
    font-size:14px;
    line-height:1.5;
  }

  .product-card .btn{
    grid-column:2;
    width:100%;
    min-height:42px;
    margin:0;
    padding:0 12px;
    border-radius:12px;
    font-size:15px;
  }

  .contact-line{
    margin:8px 0 0;
    min-height:28px;
    gap:8px;
    white-space:nowrap;
    font-size:13px;
  }

  .contact-line:before,
  .contact-line:after{
    width:24px;
    flex:0 1 24px;
  }

  .contact-line a{
    white-space:nowrap;
    font-size:15px;
  }
}

/* very short mobile screens */
@media (max-width:620px) and (max-height:700px){

  .home-brand img{
    width:40px;
    height:44px;
  }

  .home-brand .brand-name{
    font-size:26px;
  }

  .home h1{
    font-size:23px;
  }

  .home .tagline{
    font-size:13px;
    margin-bottom:5px;
  }

  .product-grid{
    gap:7px;
  }

  .product-card{
    grid-template-columns:82px 1fr;
    padding:7px 12px;
  }

  .product-illustration{
    width:82px;
    height:72px;
  }

  .product-illustration:before{
    width:74px;
    height:58px;
  }

  .icon-svg{
    width:56px;
    height:56px;
  }

  .product-card h2{
    font-size:21px;
  }

  .product-card p{
    font-size:12px;
    margin-bottom:4px;
  }

  .product-card .btn{
    min-height:37px;
    font-size:14px;
  }

  .contact-line{
    margin-top:5px;
  }
}
