/* 出行应用与产品矩阵共用蓝白能源背景及卡片视觉规范。 */
:is(#controller,#controller-loop){background:#fff;isolation:isolate;color:#14294a}
:is(#controller,#controller-loop)::before{content:"";position:absolute;z-index:0;inset:0;background:var(--page-image-99248d148f, url("../assets/optimized/matrix-background-gpt-image-2-2b5e46f788c2.webp")) center top/cover no-repeat;opacity:.46;pointer-events:none}
:is(#controller,#controller-loop)>.slide-inner{position:relative;z-index:1}
:is(#controller,#controller-loop)>.slide-bottom{z-index:1;color:#6682ad;border-color:#dbe6f5}
:is(#controller,#controller-loop)>.slide-inner>h2{position:relative;color:#081d4e;font-weight:700;letter-spacing:-.04em}
:is(#controller,#controller-loop)>.slide-inner>h2::before{content:"03  SECTION　│　MOBILITY & OPERATIONS";display:block;margin-bottom:8px;color:#3183e8;font:600 10px/1.2 var(--mono);letter-spacing:.13em}
:is(#controller,#controller-loop)>.slide-inner>h2::after{content:"CLEAN ENERGY · FOR A BETTER TOMORROW";position:absolute;right:0;top:2px;color:#6682ad;font:500 9px/1.2 var(--mono);letter-spacing:.22em}
:is(#controller,#controller-loop) .module-subnav{border-color:#dbe6f5}
:is(#controller,#controller-loop) .module-subnav a{color:#587092}
:is(#controller,#controller-loop) .module-subnav a[aria-current=page]{color:#137bf0;border-color:#1681ff}
#controller .mobility-apps article{border:1px solid #dbe6f5;border-radius:12px;background:linear-gradient(145deg,#fbfdfff2,#eef6fff2);box-shadow:0 6px 14px rgba(25,82,158,.05);transition:border-color .25s,box-shadow .25s}
#controller .mobility-apps article:hover{border-color:#66adff;box-shadow:0 12px 24px rgba(16,105,214,.14)}
#controller .mobility-apps h3{color:#09265a;font-weight:600}
#controller .mobility-image{border:1px solid #e1ebf7;border-radius:9px;background:radial-gradient(circle at 58% 55%,rgba(126,192,255,.15),transparent 55%),rgba(255,255,255,.82)}
#controller .mobility-apps p,#controller-loop .mobility-loop-steps p{color:#526a88}
:is(#controller,#controller-loop) .text-button{color:#137bf0;border-color:#bdd5f2}
:is(#controller,#controller-loop) :is(button,a):focus-visible{outline:2px solid #1681ff;outline-offset:4px}
#controller-loop .mobility-loop-visual{border:1px solid #e1ebf7;border-radius:12px;background:radial-gradient(circle at 58% 55%,rgba(126,192,255,.22),transparent 45%),linear-gradient(145deg,#fbfdff,#eef6ff);box-shadow:0 6px 14px rgba(25,82,158,.05)}
#controller-loop>.slide-inner>h2::before,#controller-loop>.slide-inner>h2::after{content:none}
#controller-loop .loop-ring{position:relative;width:min(92%,520px);aspect-ratio:1;margin:auto;border:42px solid rgba(50,128,226,.08);border-radius:50%;box-shadow:inset 0 0 0 2px rgba(23,110,210,.28),0 0 0 2px rgba(23,110,210,.08)}
#controller-loop .loop-ring::before{content:"";position:absolute;inset:-27px;border:3px solid #0f45b5;border-left-color:transparent;border-radius:50%;transform:rotate(-18deg)}
#controller-loop .loop-ring::after{content:"›";position:absolute;right:4%;top:9%;color:#0f45b5;font:700 42px/1 Arial;transform:rotate(48deg)}
#controller-loop .loop-node{position:absolute;z-index:2;display:grid;place-items:center;width:120px;height:62px;border:1px solid #83a9e9;border-radius:6px;background:#fff;color:#063eb0;font-size:27px;box-shadow:0 8px 20px rgba(25,82,158,.08)}
#controller-loop .loop-sense{top:-58px;left:50%;transform:translateX(-50%)}
#controller-loop .loop-insight{right:-86px;top:25%}
#controller-loop .loop-decide{right:-35px;bottom:-38px}
#controller-loop .loop-execute{left:-35px;bottom:-38px}
#controller-loop .loop-assess{left:-86px;top:25%}
#controller-loop .loop-core{position:absolute;inset:24%;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,.72);text-align:center;color:#0b459f}
#controller-loop .loop-core strong{font-size:28px}#controller-loop .loop-core small{margin-top:9px;color:#617797;font-size:14px}
#controller-loop .mobility-loop-steps article{border:1px solid #dbe6f5;border-radius:10px;padding:12px 16px;align-items:center;background:linear-gradient(145deg,#fbfdfff2,#eef6fff2);box-shadow:0 4px 10px rgba(31,83,150,.04)}
#controller-loop .mobility-loop-steps h3{color:#176ed2;font-weight:600}
@media(min-width:901px) and (max-height:820px){#controller-loop .mobility-loop-steps article{padding:8px 12px}}
@media(max-width:900px),(max-height:620px){
 :is(#controller,#controller-loop)::before{opacity:.35}
 :is(#controller,#controller-loop)>.slide-inner>h2::after{display:none}
 :is(#controller,#controller-loop)>.slide-inner>h2::before{font-size:9px;letter-spacing:.08em}
 #controller-loop .loop-ring{width:min(78vw,430px);border-width:32px;margin:60px auto}
 #controller-loop .loop-node{width:86px;height:48px;font-size:20px}
 #controller-loop .loop-insight{right:-62px}#controller-loop .loop-assess{left:-62px}
}
@media(prefers-reduced-motion:reduce){#controller .mobility-apps article{transition:none}}
/* 数字引擎运营闭环统一采用黑色主色与中性灰层级。 */
#controller-loop{color:#111827;background:#fafbfc}
#controller-loop::before{opacity:.12;filter:grayscale(1)}
#controller-loop>.slide-inner>h2,#controller-loop .mobility-loop-steps h3,#controller-loop .loop-core,#controller-loop .loop-node{color:#111827}
#controller-loop .mobility-loop-steps p,#controller-loop .loop-core small{color:#5b616b}
#controller-loop .mobility-loop-visual{border-color:#dfe2e6;background:radial-gradient(circle at 58% 55%,#e9ebee,transparent 48%),linear-gradient(145deg,#fff,#f4f5f7);box-shadow:0 6px 14px #11182708}
#controller-loop .mobility-loop-steps article{border-color:#dfe2e6;background:linear-gradient(145deg,#fff,#f5f6f8);box-shadow:0 4px 10px #11182706}
#controller-loop .loop-ring{border-color:#1118270d;box-shadow:inset 0 0 0 2px #11182738,0 0 0 2px #11182712}
#controller-loop .loop-ring::before{border-color:#252b34;border-left-color:transparent}
#controller-loop .loop-ring::after{color:#252b34}
#controller-loop .loop-node{border-color:#b9bec6;box-shadow:0 8px 20px #1118270d}
#controller-loop>.slide-bottom{color:#737983;border-color:#dfe2e6}
/* 运营闭环：黑底白字，突出流程与内容。 */
#controller-loop{background:#090b10;color:#f5f7fb}
#controller-loop::before{opacity:.035;filter:grayscale(1)}
#controller-loop>.slide-inner>h2,#controller-loop .mobility-loop-steps h3,#controller-loop .loop-core,#controller-loop .loop-node{color:#fff}
#controller-loop .mobility-loop-steps p,#controller-loop .loop-core small{color:#d0d5df}
#controller-loop .mobility-loop-visual{border-color:#343945;background:radial-gradient(circle at 50% 48%,#242a35,transparent 64%),linear-gradient(145deg,#141820,#0d1017);box-shadow:0 12px 32px #0004}
#controller-loop .mobility-loop-steps article{border-color:#363c48;background:linear-gradient(135deg,#1b202a,#12161e);box-shadow:0 8px 20px #0003}
#controller-loop .loop-ring{border-color:#ffffff0b;box-shadow:inset 0 0 0 2px #ffffff45,0 0 0 2px #ffffff16}
#controller-loop .loop-ring::before{border-color:#f2f5fa;border-left-color:transparent}
#controller-loop .loop-ring::after{color:#f2f5fa}
#controller-loop .loop-node{background:#202631;border-color:#818b9c;box-shadow:0 8px 24px #0005}
#controller-loop .loop-core{background:#191e28}
#controller-loop>.slide-bottom{color:#b6bfce;border-color:#343945}
body:has(#controller-loop.active) .page-counter{color:#e9edf5}
body:has(#controller-loop.active) .page-dots button{background:#798291}
body:has(#controller-loop.active) .page-dots button.active{background:#fff}