.connection-explorer{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:5vw;align-items:center}
.connection-figure{margin:0;min-width:0;background:#09090b;border:1px solid #303033}
.connection-diagram{position:relative;aspect-ratio:1/1;overflow:hidden}
.connection-diagram>img{display:block;width:100%;height:100%;object-fit:contain}
.part-label{position:absolute;right:7%;font-size:clamp(11px,1.5vw,20px);font-weight:700;letter-spacing:.025em;line-height:1}
.part-label:before{content:'';position:absolute;right:calc(100% + 12px);top:50%;width:38px;height:1px;background:#a8a8aa}
.part-foot{top:22%}.part-sock{top:52%}.part-shoe{top:81%}
.contact-hotspot{position:absolute;display:flex;align-items:center;gap:9px;right:5%;color:#ff5660;border:0;background:#0b0b0dcc;padding:4px 8px 4px 4px;min-height:44px;cursor:pointer;font-size:8px;letter-spacing:.03em}
.contact-hotspot span{display:grid;place-items:center;width:34px;height:34px;border:1px solid #ff5660;border-radius:50%;font-weight:700;font-size:10px}
.contact-hotspot b{font-weight:700}
.contact-hotspot:before{content:'';position:absolute;width:45px;height:1px;right:100%;top:50%;background:#e3212d}
.contact-inner{top:35%}.contact-outer{top:64%}
.connection-explorer[data-layer=inside] .contact-inner,.connection-explorer[data-layer=outside] .contact-outer{background:#e3212d;color:white}
.connection-explorer[data-layer=inside] .contact-inner span,.connection-explorer[data-layer=outside] .contact-outer span{border-color:#fff}
.connection-hotspot:focus-visible,.contact-hotspot:focus-visible,.connection-tabs button:focus-visible{outline:2px solid #fff;outline-offset:4px}
.connection-figure figcaption{font-size:7px;line-height:1.6;letter-spacing:.09em;padding:14px 18px;border-top:1px solid #303033;color:#ccc}
.connection-content>.eyebrow{margin-bottom:24px;color:#b7b6b2;font-size:9px}
.connection-tabs{display:grid;grid-template-columns:1fr 1fr 1fr;border-bottom:1px solid #444;gap:4px}
.connection-tabs button{color:#aaa;border:0;border-bottom:3px solid transparent;background:transparent;padding:12px 3px 17px;text-align:left;font-size:11px;line-height:1.5}
.connection-tabs button>span{display:block;font-size:8px;letter-spacing:.12em;margin-bottom:7px}
.connection-tabs button[aria-selected=true]{border-color:var(--red);color:var(--paper)}
#connection-panel{padding:32px 0 22px;min-height:290px}
#connection-panel .eyebrow{color:#ff5660;font-size:9px;letter-spacing:.13em;margin-bottom:19px}
#connection-title{font-size:clamp(30px,3.4vw,51px);line-height:1.07;letter-spacing:-.04em;margin:0 0 24px}
#connection-copy{font-size:15px;color:#c4c3be;line-height:1.7;max-width:44ch}
.coverage-note{border-top:1px solid #3d3d3d;padding:24px 0;display:flex;gap:22px;align-items:center}
.coverage-note>strong{font-size:54px;letter-spacing:-.06em;line-height:1}
.coverage-note span{font-size:9px;letter-spacing:.07em;font-weight:700}
.coverage-note p{font-size:11px;color:#b4b3ae;line-height:1.6;margin:7px 0 0}
.diagram-note{font-size:9px;color:#8e8e8e;line-height:1.6;max-width:47ch;margin:6px 0 0}
@media(max-width:1000px){.connection-explorer{gap:28px}.contact-hotspot b{display:none}.contact-hotspot{right:13%}.part-label{right:11%}.contact-hotspot:before{width:24px}.part-label:before{width:24px}#connection-copy{font-size:13px}#connection-panel{min-height:280px}.coverage-note{gap:15px}.coverage-note>strong{font-size:44px}}
@media(max-width:760px){.connection-explorer{grid-template-columns:1fr;gap:30px}.connection-figure{max-width:550px;width:100%;justify-self:center}.part-label{font-size:15px;right:8%}.contact-hotspot{right:5%}.contact-hotspot b{display:block;font-size:7px}.contact-hotspot:before{width:25px}.connection-content>.eyebrow{font-size:8px;margin-bottom:16px}.connection-tabs button{font-size:11px;padding-bottom:14px}#connection-panel{min-height:250px;padding-top:26px}#connection-title{font-size:35px;margin-bottom:19px}#connection-copy{font-size:14px;max-width:none}.coverage-note{padding:22px 0}.coverage-note>strong{font-size:52px}.diagram-note{font-size:9px}.connection-figure figcaption{font-size:6px;padding:12px}}
@media(max-width:350px){.contact-hotspot b{display:none}.contact-hotspot{right:10%}.part-label{font-size:13px}.connection-tabs button{font-size:10px}#connection-title{font-size:31px}}
/* Preserve the render's exact proportions and leave room for live labels. */
.connection-diagram{aspect-ratio:1.2076/1;background:#000}
.connection-diagram>img{width:78%;height:100%;object-fit:contain}
.part-label{right:3%}.part-foot{top:35%}.part-sock{top:60%}.part-shoe{top:86%}
.part-label:before{width:25px}
.contact-hotspot{right:2%;transform:translateY(-50%)}
.contact-inner{top:44.43%}.contact-outer{top:70.79%}
.contact-hotspot:before{width:20px}
@media(max-width:1100px){.contact-hotspot{right:5%}.contact-hotspot b{display:none}.part-label{font-size:14px;right:2%}.part-label:before{width:16px}}
@media(min-width:761px) and (max-width:900px){.connection-explorer{grid-template-columns:1fr}.connection-figure{max-width:650px;width:100%;justify-self:center}}
@media(max-width:760px){.contact-hotspot{right:4%}.contact-hotspot b{display:none}.part-label{right:2%;font-size:12px}.contact-hotspot:before{width:15px}.part-label:before{width:13px}#connection-panel{min-height:260px}}
@media(max-width:760px){.part-foot{top:29%}.part-sock{top:57%}.part-shoe{top:86%}}