:root{
  --bg:#05080d;--panel:#0b121c;--panel2:#0f1926;--line:#1d3246;
  --blue:#16b8ff;--blue2:#0077ff;--text:#f1f7fc;--muted:#9aabba;
  --ok:#32e6ae;--amber:#ffbd45
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;max-width:100%;overflow-x:hidden}
body{
  margin:0;max-width:100%;overflow-x:hidden;
  background:radial-gradient(850px 450px at 80% 0,#07284a 0,transparent 60%),var(--bg);
  color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  line-height:1.55
}
a{text-decoration:none;color:inherit}
img{max-width:100%}
.wrap{width:min(1160px,calc(100% - 40px));margin:auto}
.nav{position:sticky;top:0;z-index:4;background:#05080df0;border-bottom:1px solid #10202f;backdrop-filter:blur(14px)}
.navin{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.brand{display:flex;align-items:center;gap:10px;font-size:1.2rem;font-weight:800;letter-spacing:.04em;min-width:0}
.brand-logo{display:block;width:clamp(165px,18vw,215px);height:auto;object-fit:contain}
.links{display:flex;gap:20px;color:var(--muted);font-size:.87rem;min-width:0}
.links a:hover{color:var(--blue)}
.lang{display:flex;align-items:center;gap:5px;white-space:nowrap}
.lang a{font-size:.74rem;border:1px solid #284158;border-radius:6px;padding:6px 7px;color:#d2e2ef}
.lang a:hover,.lang a[aria-current="page"]{border-color:var(--blue);color:var(--blue)}
.demo-note{display:block;color:#91a6b8;font-size:.66rem;margin-top:5px}
.hero{padding:105px 0 70px;overflow:hidden}
.gridhero{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:50px}
.gridhero>*{min-width:0}
.eyebrow{display:flex;gap:9px;align-items:center;color:var(--blue);font-size:.76rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase}
.pulse{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 6px #32e6ae21}
.hero h1{font-size:clamp(2.65rem,6vw,5.2rem);line-height:1.02;margin:17px 0 21px;letter-spacing:-.055em}
.hero h1 span{color:var(--blue);text-shadow:0 0 35px #008cff8f}
.lead{max-width:580px;color:#b6c6d4;font-size:1.13rem}
.buttons{display:flex;flex-wrap:wrap;gap:13px;margin-top:30px}
.btn{padding:13px 20px;border-radius:7px;font-weight:750;font-size:.93rem;transition:.2s}
.primary{background:var(--blue);color:#02111c;box-shadow:0 10px 28px #009dff37}
.primary:hover{transform:translateY(-2px);background:#63d3ff}
.secondary{border:1px solid #31546f;color:#e5f4ff;background:#0b1621}
.secondary:hover{border-color:var(--blue);color:var(--blue)}
.edition{display:flex;align-items:center;gap:10px;margin-top:30px;color:#c3d4e2;font-size:.82rem;flex-wrap:wrap}
.win{border:1px solid #245277;padding:2px 6px;color:#52c8ff}
.console{position:relative;background:linear-gradient(145deg,#0e1c2b,#070c13);border:1px solid #1e4666;border-radius:13px;padding:18px;box-shadow:0 25px 60px #0008,0 0 45px #007bff1f;min-width:0}
.console:before{content:"SMARTROUTE · CENTRAL DE OPERAÇÕES";display:block;color:#a8c1d5;font-weight:700;letter-spacing:.1em;font-size:.67rem;padding:0 0 14px;border-bottom:1px solid #203547}
html[lang="en"] .console:before{content:"SMARTROUTE · OPERATIONS CENTER"}
html[lang="ja"] .console:before{content:"SMARTROUTE · オペレーションセンター"}
html[lang="zh"] .console:before{content:"SMARTROUTE · 运营中心"}
.minihead{display:flex;justify-content:space-between;gap:10px;margin:15px 0;color:#91a6b8;font-size:.72rem;flex-wrap:wrap}
.live{color:var(--ok)}
.route{display:grid;grid-template-columns:minmax(0,1fr) 20px minmax(0,1fr) 20px minmax(0,1fr);align-items:center;gap:8px}
.node{min-height:89px;border:1px solid #23445d;background:#0d1925;padding:11px;border-radius:7px;min-width:0}
.node b{display:block;font-size:.76rem}
.node small{display:block;color:#90a7b9;font-size:.67rem;margin-top:5px}
.node i{display:block;width:8px;height:8px;border-radius:50%;background:var(--ok);margin-top:10px}
.arrow{color:var(--blue);font-size:1.25rem;text-align:center}
.bar{height:7px;background:#152636;border-radius:8px;margin-top:20px;overflow:hidden}
.bar b{display:block;width:72%;height:100%;background:linear-gradient(90deg,var(--blue2),var(--blue));box-shadow:0 0 15px var(--blue)}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:38px;border-top:1px solid #173047;border-left:1px solid #173047;width:100%}
.stat{padding:19px;border-right:1px solid #173047;border-bottom:1px solid #173047;min-width:0}
.stat b{display:block;color:var(--blue);font-size:1.32rem;overflow-wrap:anywhere}
.stat span{color:var(--muted);font-size:.76rem;overflow-wrap:anywhere}
.section{padding:90px 0;border-top:1px solid #10202d}
.tag{color:var(--blue);font-weight:800;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase}
.section h2{font-size:clamp(2rem,4vw,3.25rem);line-height:1.1;letter-spacing:-.04em;margin:12px 0 14px}
.intro{max-width:640px;color:var(--muted);font-size:1.02rem}
.flow{margin-top:40px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}
.step,.card{background:linear-gradient(145deg,#0c1722,#080e15);border:1px solid #183149;border-radius:9px;padding:21px;min-width:0}
.num{font-size:.75rem;color:var(--blue);font-weight:800}
.step h3,.card h3{margin:14px 0 7px;font-size:1rem}
.step p,.card p{margin:0;color:var(--muted);font-size:.88rem}
.features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:37px}
.icon{font-size:1.35rem;color:var(--blue)}
.portal{display:grid;grid-template-columns:1fr 1fr;gap:45px;align-items:center}
.portal>*{min-width:0}
.phone{margin:auto;width:min(278px,100%);background:#0a121d;border:1px solid #286080;border-radius:28px;padding:12px;box-shadow:0 25px 55px #0009}
.screen{background:linear-gradient(180deg,#10233a,#070e17);border-radius:20px;padding:20px;min-height:465px}
.screen .top{font-size:.73rem;color:#a7bac9;display:flex;justify-content:space-between;gap:8px}
.driver{margin-top:32px;font-size:1.2rem;font-weight:750}
.call{margin-top:22px;padding:18px;border:1px solid #197fb3;background:#07233a;border-radius:9px}
.call b{color:#59d4ff}.call p{font-size:.78rem;color:#b7cede;margin:8px 0 0}
.status{display:flex;gap:8px;margin-top:22px;flex-wrap:wrap}
.status span{font-size:.65rem;padding:7px 8px;border:1px solid #254356;border-radius:5px;color:#9cafbc}
.status span:first-child{color:#051117;background:var(--ok);border-color:var(--ok)}
.enterprise{display:grid;grid-template-columns:1.1fr .9fr;gap:30px}
.enterprise>*{min-width:0}
.check{list-style:none;padding:0;margin:27px 0}
.check li{padding:10px 0;border-bottom:1px solid #172a3a;color:#c7d6e0}
.check li:before{content:"✓";color:var(--ok);font-weight:900;margin-right:12px}
.data-panel{background:#09121d;border:1px solid #24465c;border-radius:10px;padding:24px;min-width:0}
.data-title{font-size:.76rem;color:#9bb1c2;letter-spacing:.09em}
.row{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid #172f43;font-size:.85rem}
.row b{color:var(--ok);text-align:right}
.support{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.contact{padding:75px 0;background:linear-gradient(110deg,#061b2c,#06101b 60%,#071827)}
.contactbox{display:flex;justify-content:space-between;align-items:end;gap:25px}
.contact h2{max-width:670px;margin-bottom:0}
.foot{padding:28px 0;color:#7e95a8;font-size:.78rem;display:flex;justify-content:space-between;gap:15px}
.footerbrand{color:#dcecf8;font-weight:750}

@media(max-width:830px){
  .links{display:flex;order:3;width:100%;overflow-x:auto;justify-content:flex-start;gap:14px;padding:7px 0 9px;white-space:nowrap}
  .links a{flex:none}
  .navin{height:auto;min-height:74px;flex-wrap:wrap;gap:6px;padding-top:8px}
  .brand-logo{width:clamp(140px,38vw,180px)}
  .lang{margin-left:auto}
  .gridhero,.portal,.enterprise{grid-template-columns:1fr}
  .hero{padding-top:70px}
  .console{max-width:600px}
  .flow,.features,.support{grid-template-columns:1fr 1fr}
  .contactbox{align-items:start;flex-direction:column}
  .stats{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){
  .wrap{width:min(100% - 28px,1160px)}
  .flow,.features,.support,.stats{grid-template-columns:1fr}
  .route{gap:4px;grid-template-columns:minmax(0,1fr) 13px minmax(0,1fr) 13px minmax(0,1fr)}
  .node{padding:8px}
  .node b{font-size:.64rem}
  .arrow{font-size:.9rem}
  .hero h1{font-size:2rem;line-height:1.08;letter-spacing:-.035em}
  .navin{height:auto;min-height:64px}
  .lang{display:flex}
  .stat{padding:14px}
  .foot{flex-direction:column}
  .section{padding:67px 0}
  .row{flex-direction:column;gap:4px}
  .row b{text-align:left}
}
@media(max-width:480px){
  html[lang="ja"] .hero h1{font-size:clamp(1.4rem,7vw,1.65rem);line-height:1.18;letter-spacing:0}
}