:root{
  --navy:#061d3a;
  --blue:#1677ff;
  --ink:#10233d;
  --muted:#687588;
  --soft:#f5f8fc;
  --line:#dfe5ec;
}
*{box-sizing:border-box}
html{background:#fff;scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--navy);background:#fff;overflow-x:hidden}
a{text-decoration:none;color:inherit}button{font:inherit}
.site-shell{
  position:relative;min-height:100vh;overflow:hidden;
  background:radial-gradient(circle at 11% 25%,rgba(22,119,255,.045),transparent 25%),
  radial-gradient(circle at 89% 33%,rgba(22,119,255,.04),transparent 23%),#fff
}
.site-shell:before,.site-shell:after{
  content:"";position:absolute;pointer-events:none;z-index:0;border-radius:50%;
  border:1px solid rgba(22,119,255,.07)
}
.site-shell:before{
  left:-390px;top:125px;width:770px;height:770px;
  box-shadow:92px 0 0 -91px rgba(22,119,255,.06),184px 0 0 -183px rgba(22,119,255,.045),276px 0 0 -275px rgba(22,119,255,.035)
}
.site-shell:after{
  right:-325px;top:365px;width:720px;height:720px;
  box-shadow:-92px 0 0 -91px rgba(22,119,255,.05),-184px 0 0 -183px rgba(22,119,255,.035)
}
.home-header{
  position:relative;z-index:20;width:calc(100% - 8%);max-width:1500px;height:82px;margin:18px auto 0;padding:0 28px;
  display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.97);
  border:1px solid rgba(6,29,58,.08);border-radius:42px;box-shadow:0 10px 30px rgba(6,29,58,.10);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)
}
.brand{height:100%;display:flex;align-items:center}
.brand img{display:block;height:52px;width:auto;max-width:300px;object-fit:contain}
.home-nav{height:100%;display:flex;align-items:center;gap:40px;color:var(--navy);font-size:17px;font-weight:600}
.home-nav>a,.nav-group>button{
  position:relative;height:100%;display:flex;align-items:center;gap:6px;padding:0;border:0;background:none;color:var(--navy);cursor:pointer
}
.home-nav>a:hover,.nav-group>button:hover{color:var(--blue)}
.home-nav .active{color:var(--blue)}
.home-nav .active:after{content:"";position:absolute;left:0;right:0;bottom:17px;height:3px;border-radius:99px;background:var(--blue)}
.nav-group{position:relative;height:100%;display:flex;align-items:center}
.nav-menu{
  position:absolute;top:calc(100% - 8px);left:50%;min-width:215px;padding:10px;border:1px solid rgba(6,29,58,.09);
  border-radius:18px;background:rgba(255,255,255,.98);box-shadow:0 18px 45px rgba(6,29,58,.14);
  opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,8px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease
}
.nav-group:hover .nav-menu,.nav-group:focus-within .nav-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
.nav-menu a,.nav-menu span{display:block;padding:11px 13px;border-radius:11px;font-size:14px;line-height:1.25}
.nav-menu a:hover{color:var(--blue);background:rgba(22,119,255,.08)}
.nav-menu span{color:rgba(6,29,58,.45)}
.menu-toggle{
  display:none;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:#eef6ff;color:var(--blue);
  align-items:center;justify-content:center;flex-direction:column;gap:5px
}
.menu-toggle span{display:block;width:20px;height:2px;border-radius:99px;background:currentColor}
.mobile-menu{
  position:fixed;top:0;right:0;z-index:80;width:min(390px,88vw);height:100vh;padding:96px 28px 32px;
  background:#fff;box-shadow:-26px 0 70px rgba(6,29,58,.18);transform:translateX(105%);transition:transform .25s ease
}
.mobile-menu.open{transform:translateX(0)}
.mobile-menu a{display:block;padding:15px 0;border-bottom:1px solid #e6edf5;color:var(--navy);font-size:20px;font-weight:700}
.hero{position:relative;z-index:2;width:min(92vw,1380px);margin:0 auto;padding:50px 0 20px;text-align:center}
.eyebrow{margin-bottom:15px;color:var(--blue);font-size:15px;line-height:1.2;font-weight:800;letter-spacing:.22em;text-transform:uppercase}
.hero h1{max-width:940px;margin:0 auto;font-size:clamp(52px,6vw,88px);line-height:.96;letter-spacing:-.055em;font-weight:800}
.hero h1 span{display:block;color:var(--blue)}
.hero p{max-width:760px;margin:18px auto 0;color:#233a58;font-size:clamp(19px,1.65vw,24px);line-height:1.35}
.orbit-stage{position:relative;z-index:2;width:min(92vw,1320px);height:620px;margin:0 auto 24px}
.orbit-system{position:absolute;left:50%;top:50%;width:min(760px,68vw);transform:translate(-50%,-50%)}
.globe-photo{display:block;width:100%;height:auto;filter:drop-shadow(0 10px 35px rgba(22,119,255,.16))}
.pillar{position:absolute;display:flex;align-items:center;gap:16px}
.pillar.operate{left:8%;top:45%}.pillar.transform{right:8%;top:45%}
.pillar.empower{left:50%;bottom:6px;transform:translateX(-50%);flex-direction:column;gap:7px}
.pillar-icon{
  width:96px;height:96px;flex:0 0 96px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--blue);
  background:rgba(255,255,255,.94);border:1px solid rgba(22,119,255,.10);box-shadow:0 10px 30px rgba(22,119,255,.12)
}
.pillar-icon svg{width:46px;height:46px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.pillar-copy{text-align:left}.pillar.transform .pillar-copy{text-align:right}.pillar.empower .pillar-copy{text-align:center}
.pillar-copy strong{display:block;font-size:26px;line-height:1;font-weight:800}
.pillar-copy span{display:block;margin-top:5px;color:#233a58;font-size:18px;line-height:1.2}
.entry-grid{position:relative;z-index:2;width:min(92vw,1320px);margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.entry-card{
  position:relative;aspect-ratio:1200 / 1060;min-height:0;padding:0;overflow:hidden;border:1px solid rgba(117,145,181,.28);border-radius:18px;
  background:#fff;box-shadow:0 12px 34px rgba(6,29,58,.08);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease
}
.entry-card:hover{transform:translateY(-3px);border-color:rgba(22,119,255,.32);box-shadow:0 16px 40px rgba(6,29,58,.11)}
.card-image{position:absolute;display:block;max-width:none;height:auto}
.operate-card .card-image{width:107.26%;left:-3.43%;top:-5.37%}
.transform-card .card-image{width:110.19%;left:-5.10%;top:-4.78%}
.mypaya-card .card-image{width:109.81%;left:-4.90%;top:-4.96%}
.bridge-title{
  position:relative;z-index:2;width:min(92vw,1320px);margin:46px auto 24px;display:flex;align-items:center;gap:24px;
  color:#587095;font-size:14px;font-weight:700;letter-spacing:.22em;text-transform:uppercase
}
.bridge-title:before,.bridge-title:after{content:"";flex:1;height:1px;background:#d7e4f5}
.value-row{position:relative;z-index:2;width:min(92vw,1320px);margin:0 auto 70px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.value-row article{display:grid;grid-template-columns:64px 1fr;gap:18px;align-items:center;padding:18px 30px}
.value-row article+article{border-left:1px solid #dfe5ec}
.value-icon{width:62px;height:62px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--blue);background:#eef6ff}
.value-icon svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.value-row h3{margin:0 0 4px;font-size:18px;line-height:1.2}
.value-row p{margin:0;color:var(--muted);font-size:15px;line-height:1.4}
@media(max-width:1000px){
  .home-nav{gap:24px;font-size:15px}.orbit-stage{height:540px}.orbit-system{width:min(650px,74vw)}
  .pillar.operate{left:0}.pillar.transform{right:0}
}
@media(max-width:850px){
  .home-header{width:calc(100% - 28px);height:68px;margin:12px auto 0;padding:0 16px 0 20px;border-radius:34px}
  .brand img{height:48px;max-width:60vw}.home-nav{display:none}.menu-toggle{display:flex}
  .hero{padding-top:48px}.hero h1{font-size:clamp(44px,10vw,64px)}
  .orbit-stage{height:auto;display:grid;grid-template-columns:1fr 1fr;gap:24px;padding-top:20px}
  .orbit-system{position:relative;left:auto;top:auto;width:min(620px,88vw);margin:0 auto;transform:none;grid-column:1/-1}
  .globe-photo{width:100%;max-width:none}
  .pillar{position:relative;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;flex-direction:column;justify-content:center;text-align:center}
  .pillar.empower{grid-column:1/-1}.pillar-copy,.pillar.transform .pillar-copy,.pillar.empower .pillar-copy{text-align:center}
  .pillar-icon{width:82px;height:82px;flex-basis:82px}.pillar-icon svg{width:39px;height:39px}
  .entry-grid{grid-template-columns:1fr}.entry-card{min-height:0}.value-row{grid-template-columns:1fr}
  .value-row article+article{border-left:0;border-top:1px solid #dfe5ec}
}
@media(max-width:560px){
  .hero,.orbit-stage,.entry-grid,.bridge-title,.value-row{width:88vw}.eyebrow{font-size:13px}.hero p{font-size:18px}
  .orbit-stage{grid-template-columns:1fr}.pillar.empower{grid-column:1}.entry-card{padding:0}.value-row article{padding:18px 0}
}