.connected-system{position:relative;height:clamp(640px,48vw,880px);padding:0 0 100px;background:var(--page);overflow:hidden;isolation:isolate}
.system-heading{position:absolute;left:4.486%;top:8.5%;z-index:2}.system-heading h2{font-size:clamp(40px,4.07vw,68px);line-height:1.09;font-weight:600;letter-spacing:-2.4px;margin:0 0 23px}.system-heading>p{font-size:clamp(18px,1.435vw,24px);line-height:1.45;color:var(--muted);margin:0}
.system-track{position:absolute;inset:0 0 100px;width:100%;height:calc(100% - 100px);fill:none;stroke:#0063ff;stroke-width:1.6}.track-intro,.track-tail{stroke-dasharray:3 3;stroke-width:1.1}.track-tail{opacity:.7}.track-endpoints{fill:var(--page);stroke-width:1.2}
.system-items{position:absolute;inset:0 0 100px;list-style:none;padding:0;margin:0}.system-item{position:absolute;top:63.857%;left:14.234%;width:14%;text-align:center;transform:translateX(-50%)}.system-item:nth-child(2){left:31.519%;top:59.286%}.system-item:nth-child(3){left:49.581%;top:55.143%}.system-item:nth-child(4){left:67.285%;top:49.857%}.system-item:nth-child(5){left:84.988%;top:44.286%}
.system-number{position:absolute;left:50%;top:-68px;transform:translateX(-50%);width:45px;height:45px;display:grid;place-items:center;border:1.5px solid #0063ff;border-radius:50%;background:var(--page);color:var(--blue);font-size:21px;line-height:1}.system-number:after{content:'';position:absolute;left:50%;top:100%;height:23px;border-left:1px dashed #438fff}
.system-node{position:absolute;top:-7px;left:calc(50% - 7px);width:14px;height:14px;border:2px solid #0063ff;border-radius:50%;background:var(--page)}.system-node:after{content:'';position:absolute;inset:2px;border-radius:50%;background:#0063ff}
.system-item>img{display:block;margin:30px auto 15px;width:72px;height:76px;object-fit:contain;mix-blend-mode:multiply}.system-item h3{font-size:clamp(18px,1.315vw,22px);font-weight:600;letter-spacing:-.5px;line-height:1.2;margin:0 0 9px}.system-item>p{max-width:215px;margin:0 auto;font-size:clamp(14px,1.017vw,17px);line-height:1.55;color:var(--muted)}
.system-bottom-line{position:absolute;bottom:0;width:100%;height:100px;background:var(--soft);border-top:1px solid var(--line);fill:none;stroke:#4b95ff;stroke-width:1}.system-bottom-line circle{fill:var(--page)}.bottom-dashed{stroke-dasharray:3 3}
.system-entering .track-main{animation:draw-system 2.3s cubic-bezier(.3,0,.3,1) both}.system-entering .system-item{animation:enter-system .6s ease both;animation-delay:calc(.15s + var(--step)*.32s)}.system-entering .system-node:after{animation:node-arrival .55s ease both;animation-delay:calc(.45s + var(--step)*.32s)}
[data-theme='dark'] .system-item>img{filter:invert(1) hue-rotate(180deg);mix-blend-mode:screen}[data-theme='dark'] .system-track{stroke:#6aabff}[data-theme='dark'] .system-number,[data-theme='dark'] .system-node{border-color:#6aabff}[data-theme='dark'] .system-node:after{background:#6aabff}
@keyframes draw-system{from{stroke-dasharray:1;stroke-dashoffset:1}to{stroke-dasharray:1;stroke-dashoffset:0}}@keyframes enter-system{from{opacity:0;transform:translate(-50%,18px)}to{opacity:1;transform:translate(-50%,0)}}@keyframes node-arrival{from{transform:scale(.2)}to{transform:scale(1)}}
@media(max-width:1100px) and (min-width:801px){.system-heading h2{font-size:44px}.system-heading>p{font-size:19px}.system-item{width:16%}.system-item>img{width:62px;height:65px}.system-number{width:38px;height:38px;font-size:18px;top:-61px}.system-item h3{font-size:17px}.system-item>p{font-size:14px}.system-heading{top:7%}}
@media(max-width:800px){.connected-system{height:auto;padding:54px 24px 100px}.system-heading{position:relative;left:auto;top:auto;margin:0 auto 50px;max-width:570px}.system-heading h2{font-size:clamp(33px,6vw,46px);letter-spacing:-1.4px;margin-bottom:20px}.system-heading>p{font-size:17px}.system-track{display:none}.system-items{position:relative;inset:auto;max-width:570px;margin:0 auto;display:grid;gap:38px}.system-item,.system-item:nth-child(n){position:relative;top:auto;left:auto;width:100%;transform:none;text-align:left;padding-left:82px;min-height:145px}.system-item:not(:last-child):before{content:'';position:absolute;left:22px;top:43px;width:1px;height:calc(100% + 38px);background:#6ba7ff}.system-number{left:0;top:0;transform:none;width:45px;height:45px;font-size:20px}.system-number:after,.system-node{display:none}.system-item>img{width:58px;height:60px;margin:0 0 13px}.system-item h3{font-size:23px;margin-bottom:9px}.system-item>p{max-width:390px;margin:0;font-size:16px}.system-item.mobile-entering{animation:enter-system-mobile .6s ease both;animation-delay:calc(var(--step)*.14s)}.system-bottom-line{left:0;height:62px}.connected-system{padding-bottom:105px}}
@keyframes enter-system-mobile{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.system-entering .track-main,.system-entering .system-item,.system-entering .system-node:after{animation:none!important}}

@media(prefers-reduced-motion:reduce){.system-item.mobile-entering{animation:none!important}}

/* Focus reference: editorial introduction beside a compact card matrix. */
.focus-section>.section-container{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(0,1.8fr);gap:50px;align-items:start}
.focus-section .split-heading{display:block;text-align:left;margin:22px 0 0}.focus-section .split-heading h2{font-size:clamp(30px,2.7vw,43px);margin:18px 0 24px}.focus-section .split-heading>p{font-size:17px;line-height:1.7}
.focus-section .focus-grid{gap:18px;grid-template-columns:repeat(3,minmax(0,1fr))}.focus-section .focus-card{padding:24px;border-radius:18px;min-height:215px}.focus-section .focus-card h3{font-size:21px;line-height:1.25;margin:17px 0 12px}.focus-section .focus-card p{font-size:15px;line-height:1.55;margin-bottom:18px}.focus-section .focus-tag{font-size:12px;padding-top:14px}.focus-section .focus-number{font-size:11px;letter-spacing:.8px}.focus-section .climate-wide{grid-column:1/-1;min-height:120px;position:relative;padding-right:24%;overflow:hidden}.focus-section .climate-wide h3{margin:9px 0}.focus-section .climate-wide p{margin-bottom:0}.focus-section .climate-wide .focus-tag{display:none}.focus-section .climate-wide:after{content:'';position:absolute;right:-20px;top:15%;width:24%;height:80%;border:1px solid var(--line);border-radius:50%;box-shadow:0 0 0 15px var(--surface),0 0 0 16px var(--line),0 0 0 31px var(--surface),0 0 0 32px var(--line);transform:rotate(-20deg);opacity:.6}
@media(max-width:1100px){.focus-section>.section-container{grid-template-columns:1fr;gap:32px}.focus-section .split-heading{margin:0;max-width:700px}.focus-section .focus-card{min-height:200px}.focus-section .climate-wide{min-height:130px}}
@media(max-width:650px){.focus-section .focus-grid{grid-template-columns:1fr}.focus-section .focus-card{min-height:0;padding:25px}.focus-section .climate-wide{grid-column:auto;padding-right:25px}.focus-section .climate-wide:after{display:none}.focus-section .focus-card h3{font-size:23px}.focus-section .focus-card p{font-size:16px}.focus-section .focus-number{font-size:12px}}