:root{
--bg:#F3F3EF;
--bg2:#E8E9E4;
--card:#FCFCFA;
--line:#DCDDD5;
--line2:#C9CBC2;
--red:#C0392B;
--red-d:#96291E;
--red-l:#F5DAD5;
--navy:#1E3A5C;
--navy-d:#14293F;
--navy-l:#DDE4EC;
--sage:#7A9E9F;
--sage-l:#DDE8E7;
--txt:#26282B;
--mut:#6B7076;
--wrap:1180px;
--font:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Hiragino Sans GB','Microsoft YaHei','WenQuanYi Micro Hei',Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--txt);font-family:var(--font);font-size:16px;line-height:1.85}
img{max-width:100%;height:auto;display:block}
a{color:var(--navy);text-decoration:none}
h1,h2,h3,h4,figure,figcaption,blockquote,dl,dd,dt,table,p,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 22px;width:100%}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:11px 21px;font-size:15px;font-weight:700;line-height:1;border:0;border-radius:2px;cursor:pointer;background:linear-gradient(180deg,#C8462F,#96291E);color:#FFF8F4;transition:filter .18s,transform .18s}
.btn:hover{filter:brightness(1.08);transform:translateY(-1px)}
.btn--ghost{background:none;border:1px solid var(--navy);color:var(--navy);font-weight:700}
.btn--ghost:hover{background:var(--navy);color:#FFF8F4}
@keyframes swipeIn{from{opacity:0;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
.sw{animation:swipeIn .5s cubic-bezier(.22,.72,.28,1) both}
.sw.d1{animation-delay:.06s}
.sw.d2{animation-delay:.12s}
.top{position:sticky;top:0;z-index:30;background:#FAFAF7;border-top:4px solid var(--navy);border-bottom:1px solid var(--line)}
.top__in{max-width:var(--wrap);margin:0 auto;padding:10px 22px;display:flex;align-items:center;gap:18px}
.brand{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.brand img{width:38px;height:38px}
.brand b{font-size:19px;font-weight:700;color:var(--navy);letter-spacing:.02em}
.nav{display:flex;align-items:center;gap:16px;margin-left:auto;flex-wrap:wrap}
.nav a{font-size:14.5px;color:var(--txt);padding:6px 2px;border-bottom:2px solid transparent}
.nav a:hover{color:var(--red-d)}
.nav a[aria-current="page"]{color:var(--red-d);font-weight:700;border-bottom-color:var(--red)}
.top .btn{flex:0 0 auto}
.top .btn--ghost{border-color:var(--navy)}
.top .btn--ghost:hover{background:var(--navy);color:#FFF8F4}
.hero{position:relative;background:var(--bg);border-bottom:1px solid var(--line)}
.hero::after{content:"";position:absolute;right:0;top:0;width:150px;height:100%;background:repeating-linear-gradient(90deg,var(--navy-l) 0 2px,transparent 2px 14px);opacity:.55;pointer-events:none}
.hero__in{position:relative;z-index:1;max-width:var(--wrap);margin:0 auto;padding:50px 22px 56px;display:grid;grid-template-columns:1.06fr .94fr;gap:44px;align-items:center}
.kick{display:inline-block;font-size:12.5px;letter-spacing:.16em;color:var(--red-d);border-left:3px solid var(--red);padding-left:9px;line-height:1.4}
.hero h1{margin-top:16px;font-size:clamp(27px,4.4vw,42px);line-height:1.28;font-weight:700;color:var(--navy-d);letter-spacing:.01em}
.hero .lead{margin-top:16px;font-size:16.6px;color:#3A3D42;max-width:34em;line-height:1.9}
.hero__row{margin-top:24px;display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.hero__shot{display:flex;flex-direction:column;align-items:center;margin:0}
.paper{background:#FFF;padding:11px;border-top:3px solid var(--navy);border-bottom:3px solid var(--navy);box-shadow:0 0 0 1px var(--line)}
.hero__shot img{width:100%;max-width:308px;height:auto;margin:0 auto}
.hero__shot figcaption{margin-top:12px;font-size:12.6px;color:var(--mut);text-align:center;line-height:1.7}
.facts{background:var(--bg2);border-bottom:1px solid var(--line)}
.facts__in{max-width:var(--wrap);margin:0 auto;padding:22px 22px;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.fact{border-left:3px solid var(--red);padding-left:13px}
.fact b{display:block;font-size:22px;line-height:1.35;color:var(--navy-d)}
.fact span{font-size:13px;color:var(--mut)}
.sec{padding:54px 0 58px}
.sec--alt{background:var(--bg2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sec h2,.cta h2{position:relative;padding-left:16px;font-size:clamp(21px,2.5vw,27px);line-height:1.45;font-weight:700;color:var(--navy-d)}
.sec h2::before,.cta h2::before{content:"";position:absolute;left:0;top:.26em;bottom:.26em;width:6px;background:var(--red)}
.sub{margin-top:11px;font-size:15px;color:var(--mut);max-width:48em;line-height:1.85}
.gates{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px}
.gate{display:grid;grid-template-columns:1fr 36px;background:var(--card);border:1px solid var(--line);border-top:4px solid var(--navy)}
.gate__body{padding:17px 16px 18px 18px}
.gate__body h3{font-size:17px;line-height:1.45;color:var(--navy-d)}
.gate__body p{margin-top:7px;font-size:14px;color:var(--mut);line-height:1.78}
.gate__meta{display:block;margin-top:10px;font-size:12.4px;letter-spacing:.05em;color:var(--sage)}
.gate__tag{display:flex;align-items:center;justify-content:center;writing-mode:vertical-rl;text-orientation:upright;padding:10px 0;background:var(--red-l);color:var(--red-d);font-size:13px;font-weight:700;letter-spacing:.24em;border-left:1px solid var(--line)}
.flow{display:grid;grid-template-columns:.9fr 1.1fr;gap:38px;align-items:start;margin-top:30px}
.flow__shot{margin:0}
.flow__shot img{width:100%;max-width:330px;height:auto;margin:0 auto;box-shadow:0 0 0 1px var(--line)}
.flow__shot figcaption{margin-top:11px;font-size:12.6px;color:var(--mut);text-align:center;line-height:1.7}
.steps{margin-top:4px}
.steps li{position:relative;padding:14px 0 14px 48px;border-top:1px solid var(--line);font-size:14.8px;color:#3A3D42;line-height:1.8}
.steps li:last-child{border-bottom:1px solid var(--line)}
.steps li b{color:var(--navy-d)}
.steps li i{position:absolute;left:0;top:13px;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--navy-l);color:var(--navy-d);font-style:normal;font-size:13px;font-weight:700}
.sync{display:grid;grid-template-columns:.78fr 1.22fr;gap:38px;align-items:start;margin-top:30px}
.sync__shot{margin:0}
.sync__shot img{width:100%;max-width:290px;height:auto;margin:0 auto;box-shadow:0 0 0 1px var(--line)}
.sync__shot figcaption{margin-top:11px;font-size:12.6px;color:var(--mut);text-align:center;line-height:1.7}
.tbl{margin-top:6px;border-top:3px solid var(--navy)}
.tbl>div{display:grid;grid-template-columns:158px 1fr;gap:14px;padding:13px 0;border-bottom:1px solid var(--line)}
.tbl dt{font-size:14.6px;font-weight:700;color:var(--navy-d)}
.tbl dd{font-size:14.3px;color:var(--mut);line-height:1.8}
.shots{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px}
.shot{display:flex;flex-direction:column;margin:0;background:var(--card);border:1px solid var(--line);border-top:4px solid var(--navy);padding:12px 12px 16px}
.shot img{width:100%;height:auto;margin:0 auto}
.shot figcaption{margin-top:auto;padding-top:12px;font-size:13px;color:var(--mut);line-height:1.7}
.more{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:30px}
.ecard{display:block;background:var(--card);border:1px solid var(--line);border-top:4px solid var(--red);padding:24px 22px;transition:transform .2s,border-color .2s,box-shadow .2s}
.ecard:hover{transform:translateY(-3px);border-top-color:var(--navy);box-shadow:0 12px 26px rgba(30,58,92,.1)}
.ecard h3{font-size:18px;color:var(--navy-d);line-height:1.45}
.ecard p{margin-top:9px;font-size:14.5px;color:var(--mut);line-height:1.8}
.ecard span{display:inline-block;margin-top:14px;font-size:13.5px;font-weight:700;color:var(--red-d)}
.voice{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px}
.vc{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--navy);padding:20px 20px 18px}
.vc p{font-size:14.8px;color:#3A3D42;line-height:1.85}
.vc .who{display:block;margin-top:13px;font-size:13px;color:var(--sage)}
.faq{margin-top:28px;border-top:3px solid var(--navy)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{position:relative;cursor:pointer;list-style:none;padding:15px 36px 15px 0;font-size:15.4px;font-weight:700;color:var(--navy-d);line-height:1.65}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);font-size:21px;font-weight:400;color:var(--red)}
.faq details[open] summary::after{content:"\2013"}
.faq .a{padding:0 0 17px;font-size:14.6px;color:var(--mut);line-height:1.85;max-width:60em}
.cta{background:linear-gradient(135deg,#1E3A5C,#14293F);padding:52px 0 56px;color:#EFF3F8}
.cta h2{color:#FFFFFF}
.cta .sub{color:#C3CEE0}
.cta__row{margin-top:22px;display:flex;gap:14px;flex-wrap:wrap}
.cta .btn{color:#FFF8F4}
.cta .btn--ghost{color:#EFF3F8;border-color:#EFF3F8}
.cta .btn--ghost:hover{background:#EFF3F8;color:var(--navy-d)}
.foot{background:#EDEEE9;border-top:3px solid var(--navy);padding:42px 0 28px}
.foot__in{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:28px}
.foot h4{font-size:14px;letter-spacing:.06em;color:var(--navy-d);margin-bottom:11px}
.foot p{font-size:13.5px;color:var(--mut);line-height:1.85}
.foot a{display:block;padding:3px 0;font-size:13.8px;color:var(--mut)}
.foot a:hover{color:var(--red-d)}
.dis{margin-top:26px;border-top:1px solid var(--line2);padding-top:16px;font-size:13px;color:var(--mut);line-height:1.8}
.copy{margin-top:10px;font-size:12.6px;color:#8A8F94}
.page-hero{background:var(--bg2);border-bottom:1px solid var(--line);padding:42px 0 44px}
.page-hero .kick{margin-bottom:4px}
.page-hero h1{margin-top:14px;font-size:clamp(25px,3.6vw,36px);line-height:1.32;font-weight:700;color:var(--navy-d)}
.page-hero .lead{margin-top:15px;font-size:16.4px;color:#3A3D42;max-width:40em;line-height:1.9}
.page-hero__row{margin-top:20px;display:flex;gap:14px;flex-wrap:wrap}
.prose{margin-top:26px;max-width:62em}
.prose h2{margin-top:38px}
.prose h2:first-child{margin-top:0}
.prose h3{margin-top:26px;font-size:17.5px;color:var(--navy-d);line-height:1.5}
.prose p{margin-top:12px;font-size:15.6px;color:#33363B;line-height:1.95}
.prose ul.dot{margin-top:12px}
.prose ul.dot li{position:relative;padding-left:18px;font-size:15.4px;color:#33363B;line-height:1.9}
.prose ul.dot li::before{content:"";position:absolute;left:2px;top:.8em;width:7px;height:7px;background:var(--red);transform:rotate(45deg)}
.prose figure{margin:26px 0 0}
.prose figure img{width:100%;max-width:400px;height:auto;margin:0 auto;box-shadow:0 0 0 1px var(--line)}
.prose figure figcaption{margin-top:11px;font-size:12.8px;color:var(--mut);text-align:center;line-height:1.7}
.prose table{width:100%;border-collapse:collapse;margin-top:20px;font-size:14.4px}
.prose th,.prose td{border:1px solid var(--line2);padding:11px 13px;text-align:left;vertical-align:top;line-height:1.75}
.prose th{background:var(--navy-l);color:var(--navy-d);font-weight:700}
.prose td{color:#33363B}
.prose blockquote{margin-top:20px;border-left:4px solid var(--red);background:var(--card);padding:16px 18px;font-size:15px;color:#3A3D42;line-height:1.9}
@media (max-width:980px){
.hero__in{grid-template-columns:1fr;gap:32px;padding:40px 22px 46px}
.hero::after{width:100px}
.gates{grid-template-columns:repeat(2,1fr)}
.flow,.sync{grid-template-columns:1fr;gap:28px}
.shots,.voice{grid-template-columns:repeat(2,1fr)}
.more{grid-template-columns:1fr}
.facts__in{grid-template-columns:repeat(2,1fr)}
.foot__in{grid-template-columns:1fr 1fr;gap:22px}
.flow__shot img,.sync__shot img{max-width:320px}
}
@media (max-width:620px){
.top__in{flex-wrap:wrap;gap:10px 12px;padding:10px 16px}
.brand{order:1}
.top .btn{order:2;margin-left:auto;padding:9px 14px;font-size:13.5px}
.nav{order:3;flex:1 0 100%;margin-left:0;gap:6px;flex-wrap:nowrap;overflow-x:auto}
.nav a{font-size:13px;padding:5px 7px;white-space:nowrap}
.wrap{padding:0 16px}
.hero__in{padding:32px 16px 40px}
.hero::after{width:70px;opacity:.45}
.facts__in{padding:22px 16px}
.hero__shot img{max-width:268px}
.sec{padding:38px 0 42px}
.gates,.shots,.voice,.facts__in,.foot__in{grid-template-columns:1fr}
.tbl>div{grid-template-columns:1fr;gap:4px}
.cta{padding:40px 0 44px}
.page-hero{padding:30px 0 34px}
}