body{--bg:#061b25;--text:#eaf4f2;--muted:#a3bdc3;--accent:#81e1db;--rule:rgba(129,225,219,.32);--menu-bg:#0b2834;background:var(--bg)}
.syntra-opening{padding:5px 0 clamp(95px,10vw,160px)}.syntra-label{display:flex;justify-content:space-between;align-items:center;gap:20px}.syntra-opening h1{font:700 clamp(7rem,18vw,22rem)/.84 Arial,Helvetica,sans-serif;letter-spacing:-.105em;margin:clamp(45px,7vw,115px) 0 40px}.syntra-opening h1 span{color:var(--accent)}.syntra-opening-row{display:flex;align-items:end;justify-content:space-between;gap:30px;border-top:1px solid var(--rule);padding-top:27px}.syntra-opening-row p{font:400 clamp(1.4rem,2.3vw,2.4rem)/1.3 Georgia,serif}.syntra-opening-row em{color:var(--accent);font-weight:400}
.syntra-diagram{background:#e9f1ec;color:#082b37;padding-block:clamp(85px,9vw,145px)}.syntra-diagram .section-label{color:#197677}.diagram-heading{display:grid;grid-template-columns:170px 1fr;gap:clamp(32px,5vw,85px)}.diagram-heading h2,.syntra-purpose h2,.syntra-sequence h2,.syntra-end h2{font:400 clamp(3rem,5.3vw,6rem)/1.03 Georgia,serif;letter-spacing:-.065em}.diagram-heading p{margin-top:20px;color:#537078;font-size:1rem}
.diagram-flow{display:grid;grid-template-columns:minmax(0,1fr) 150px minmax(200px,.55fr);gap:25px;align-items:center;margin:70px 0 0 255px;padding:55px 0;border-top:1px solid #186b7270;border-bottom:1px solid #186b7270}.sensor-array{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.sensor-array>span{aspect-ratio:1;display:grid;place-items:center;border:1px solid #177a7d;border-radius:50%;font:700 .9rem Georgia,serif;letter-spacing:.08em;color:#13686e;background:#ffffff9e}.sensor-array b{grid-column:1/-1;margin-top:12px;color:#13686e;font:700 .74rem Georgia,serif;letter-spacing:.18em}.signal{display:flex;align-items:center;gap:7px;flex-direction:column;color:#13686e;font:700 .72rem Georgia,serif;letter-spacing:.18em}.signal i{display:block;width:100%;height:1px;background:#13686e;position:relative}.signal i::after{content:"";position:absolute;right:0;top:-5px;width:10px;height:10px;border-top:1px solid #13686e;border-right:1px solid #13686e;transform:rotate(45deg)}.receiver{aspect-ratio:1.5;display:flex;flex-direction:column;justify-content:space-between;padding:18px;border:1px solid #177a7d;background:#0a3642;color:#b6eeee}.receiver span,.receiver small{font:700 .68rem Georgia,serif;letter-spacing:.13em}.receiver strong{font:400 3.3rem Georgia,serif;text-align:center;line-height:1}
.syntra-purpose{display:grid;grid-template-columns:170px 1fr;gap:clamp(32px,5vw,85px);padding-block:clamp(95px,10vw,160px)}.syntra-purpose h2 em{color:var(--accent);font-weight:400}.syntra-purpose p{max-width:66ch;margin-top:25px;color:#bdd3d6;font-size:1.1rem;line-height:1.75}.syntra-purpose p:first-of-type{font:400 clamp(1.25rem,1.8vw,1.55rem)/1.58 Georgia,serif;color:#e7f4f1;margin-top:37px}
.syntra-sequence{background:#0e3440;padding-block:clamp(90px,9vw,145px)}.syntra-sequence h2{margin:25px 0 55px;max-width:18ch}.sequence{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(25px,5vw,80px)}.sequence article{border-top:1px solid var(--rule);padding-top:23px}.sequence article>span{color:var(--accent);font:700 .74rem Georgia,serif;letter-spacing:.18em}.sequence h3{font:400 clamp(2.2rem,3.4vw,4rem)/1.08 Georgia,serif;letter-spacing:-.06em;margin:27px 0 14px}.sequence p{max-width:31ch;color:#bcd5d9;line-height:1.7}
.syntra-end{display:grid;grid-template-columns:170px 1fr;gap:clamp(32px,5vw,85px);padding-block:clamp(95px,10vw,155px)}.syntra-end h2{max-width:17ch}.syntra-end p{max-width:62ch;margin:26px 0;color:#bdd3d6;font-size:1.09rem;line-height:1.73}
@media(max-width:1120px){.diagram-flow{margin-left:0}}
@media(max-width:790px){.syntra-opening h1{font-size:clamp(6rem,18vw,11rem)}.diagram-heading,.syntra-purpose,.syntra-end{grid-template-columns:1fr}.diagram-flow{grid-template-columns:1fr 90px 190px;gap:12px}.syntra-opening-row{align-items:start;flex-direction:column}.sequence{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.syntra-label{align-items:flex-start;flex-direction:column;gap:13px}.syntra-opening h1{font-size:clamp(3.65rem,14vw,7.5rem)}.diagram-heading h2,.syntra-purpose h2,.syntra-sequence h2,.syntra-end h2{font-size:clamp(2.65rem,10vw,4rem)}.diagram-flow{grid-template-columns:1fr;gap:26px;padding:35px 0}.sensor-array{width:min(100%,330px);margin:auto}.signal{height:50px}.signal i{height:48px;width:1px}.signal i::after{right:-5px;top:auto;bottom:0;transform:rotate(135deg)}.receiver{width:min(100%,240px);margin:auto}.sequence{grid-template-columns:1fr}.sequence article{padding-bottom:12px}}
.syntra-routine{width:min(100%,1920px);margin:auto}.syntra-routine img{width:100%;height:auto;display:block;border-block:1px solid var(--rule)}.syntra-routine figcaption{padding-block:17px;color:var(--accent);font:italic 1rem Georgia,serif;text-align:right}
/* A conceptual arena map, kept separate from actual sensor readings. */
.syntra-map{padding-block:clamp(85px,9vw,145px);background:#e9f1ec;color:#0a2c37}.syntra-map .section-label{color:#167778}.syntra-map-heading{display:grid;grid-template-columns:170px 1fr;gap:clamp(32px,5vw,85px);margin-bottom:40px}.syntra-map-heading h2{font:400 clamp(3rem,5.3vw,6rem)/1.03 Georgia,serif;letter-spacing:-.065em}.syntra-map-heading p{max-width:65ch;margin-top:21px;color:#486a70;line-height:1.7;font-size:1.08rem}.syntra-map-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(265px,.55fr);gap:clamp(20px,3vw,45px);align-items:start}.arena-panel{min-width:0;background:#092832;color:#d2efea;border:1px solid #3e7776;box-shadow:0 25px 65px #082b3740}.arena-panel-head,.arena-panel-foot{display:flex;justify-content:space-between;gap:15px;padding:16px 22px;color:#95d2cb;font:700 .65rem/1.5 Georgia,serif;letter-spacing:.15em}.arena-panel-head{border-bottom:1px solid #6da5a344}.arena-panel-foot{border-top:1px solid #6da5a344}.arena-panel svg{display:block;width:100%;height:auto}.syntra-route{fill:none;stroke-width:5;stroke-linecap:round;stroke-opacity:.8;transition:opacity .25s,stroke-width .25s}.syntra-map.is-filtered .syntra-route:not(.is-active){opacity:.08}.syntra-map.is-filtered .syntra-route.is-active{stroke-width:8;stroke-opacity:1}.map-control{border-top:2px solid #248789;padding-top:14px}.map-control-label{font:700 .68rem Georgia,serif;letter-spacing:.15em;color:#197677}.route-buttons{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:25px}.route-button{display:flex;align-items:center;gap:9px;min-height:43px;padding:9px 10px;border:1px solid #7da8a7;background:#f7fbf8;color:#17444b;text-align:left;font:700 .72rem Arial,Helvetica,sans-serif;transition:background .2s,border-color .2s}.route-button:first-child{grid-column:1/-1}.route-button i{width:10px;height:10px;flex:none;border-radius:50%;background:var(--route-color)}.route-button:hover,.route-button.is-active{background:#0a3a46;color:#f3faf8;border-color:#0a3a46}.route-state{min-height:2.6em;margin:18px 0 25px;color:#386368;font:italic .95rem/1.45 Georgia,serif}.map-data{border-top:1px solid #9cb9b5}.map-data>div{display:grid;gap:2px;padding:12px 0;border-bottom:1px solid #9cb9b5}.map-data b{font:700 .66rem Georgia,serif;letter-spacing:.12em;color:#167778}.map-data span{color:#385d63;font-size:.86rem;line-height:1.4}
@media(max-width:990px){.syntra-map-layout{grid-template-columns:1fr}.map-control{display:grid;grid-template-columns:1fr 1fr;gap:0 35px}.map-control-label,.route-buttons,.route-state{grid-column:1}.map-data{grid-column:2;grid-row:1/4}}
@media(max-width:790px){.syntra-map-heading{grid-template-columns:1fr}}
@media(max-width:620px){.syntra-map-heading h2{font-size:clamp(2.65rem,10vw,4rem)}.map-control{display:block}.arena-panel-head,.arena-panel-foot{padding:12px;font-size:.54rem}.arena-panel-foot span:last-child{display:none}.map-data{margin-top:25px}}