:root {
  --hub-black:#05070a;
  --hub-ink:#11161c;
  --hub-copy:#59636e;
  --hub-soft:#f3f5f7;
  --hub-line:#dce1e6;
  --hub-blue:#0878e8;
  --hub-blue-dark:#005bb6;
  --hub-blue-soft:#eaf4ff;
  --hub-white:#fff;
}

html {
  scroll-padding-top:126px;
}

.hub-site-shell {
  background:var(--hub-black);
}

.hub-page {
  overflow:hidden;
  color:var(--hub-ink);
  background:#fff;
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}

.hub-wide {
  width:min(1320px,calc(100% - 80px));
  margin:0 auto;
}

.hub-eyebrow {
  margin:0;
  color:var(--hub-blue);
  font-size:11px;
  font-weight:760;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.hub-local-nav {
  position:sticky;
  top:66px;
  z-index:28;
  color:#d7e1e9;
  border-bottom:1px solid rgba(142,162,179,.18);
  background:rgba(5,8,12,.92);
  backdrop-filter:blur(20px);
}

.hub-local-inner {
  display:flex;
  min-height:52px;
  align-items:center;
  justify-content:space-between;
  gap:30px;
}

.hub-local-name {
  flex:none;
  color:#fff;
  font-size:13px;
  font-weight:680;
  letter-spacing:-.01em;
}

.hub-local-name span {
  color:#81909c;
  font-weight:560;
}

.hub-local-links {
  display:flex;
  align-items:center;
  gap:28px;
}

.hub-local-links a {
  color:#9ca9b4;
  font-size:11px;
  font-weight:620;
  transition:color .18s ease,background .18s ease;
}

.hub-local-links a:hover,
.hub-local-links a[aria-current="true"] {
  color:#fff;
}

.hub-local-links .hub-local-cta {
  display:inline-flex;
  min-height:33px;
  align-items:center;
  padding:7px 13px;
  color:#fff;
  background:var(--hub-blue);
}

.hub-local-links .hub-local-cta:hover {
  color:#fff;
  background:#2392ff;
}

.hub-button {
  display:inline-flex;
  min-height:48px;
  align-items:center;
  justify-content:center;
  gap:16px;
  padding:13px 20px;
  border:1px solid transparent;
  font-size:12px;
  font-weight:720;
  transition:transform .18s ease,border-color .18s ease,background .18s ease,color .18s ease;
}

.hub-button:hover {
  transform:translateY(-2px);
}

.hub-button-primary {
  color:#fff;
  border-color:var(--hub-blue);
  background:var(--hub-blue);
}

.hub-button-primary:hover {
  border-color:var(--hub-blue-dark);
  background:var(--hub-blue-dark);
}

.hub-button-secondary {
  color:#18212a;
  border-color:#cbd2d8;
  background:rgba(255,255,255,.78);
  backdrop-filter:blur(10px);
}

.hub-button-secondary:hover {
  border-color:#a9b2ba;
  background:#fff;
}

.hub-hero {
  position:relative;
  min-height:690px;
  overflow:hidden;
  border-bottom:1px solid var(--hub-line);
  background:#f5f5f3;
}

.hub-hero::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(90deg,rgba(247,247,245,1) 0%,rgba(247,247,245,.98) 27%,rgba(247,247,245,.72) 42%,rgba(247,247,245,0) 65%);
  pointer-events:none;
}

.hub-hero-art {
  position:absolute;
  inset:0;
  overflow:hidden;
}

.hub-hero-art img {
  position:absolute;
  top:calc((100% - 120px)/2);
  left:73%;
  display:block;
  width:clamp(1120px,82vw,1600px);
  max-width:none;
  height:auto;
  transform:translate(-60%,-44%);
}

.hub-hero-inner {
  position:relative;
  z-index:2;
  display:flex;
  min-height:570px;
  align-items:center;
  padding:66px 0 54px;
}

.hub-hero-copy {
  width:min(575px,48%);
}

.hub-hero h1 {
  margin:20px 0 0;
  color:#090c10;
  font-size:clamp(58px,6vw,88px);
  font-weight:590;
  line-height:.96;
  letter-spacing:-.065em;
}

.hub-hero h1 span {
  color:#5f6972;
}

.hub-hero-copy > p:last-of-type {
  max-width:490px;
  margin:27px 0 0;
  color:#4f5962;
  font-size:18px;
  line-height:1.62;
}

.hub-hero-actions {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:31px;
}

.hub-hero-facts {
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  border-top:1px solid rgba(80,92,103,.2);
  background:linear-gradient(180deg,rgba(247,247,245,.82),rgba(247,247,245,.97) 36%,#f7f7f5 100%);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
}

.hub-hero-facts > div {
  display:flex;
  min-height:120px;
  flex-direction:column;
  justify-content:center;
  padding:23px 32px;
  border-right:1px solid rgba(80,92,103,.18);
}

.hub-hero-facts > div:first-child {
  padding-left:0;
}

.hub-hero-facts > div:last-child {
  border-right:0;
}

.hub-hero-facts strong {
  color:#151a20;
  font-size:25px;
  font-weight:600;
  letter-spacing:-.035em;
}

.hub-hero-facts span {
  margin-top:7px;
  color:#77808a;
  font-size:11px;
}

.hub-role {
  position:relative;
  overflow:hidden;
  padding:118px 0 126px;
  color:#fff;
  background:
    radial-gradient(circle at 78% 5%,rgba(8,120,232,.2),transparent 28%),
    linear-gradient(135deg,#05080c 0%,#0c151e 58%,#07111a 100%);
}

.hub-role::before {
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:linear-gradient(90deg,transparent,black 24%,black 80%,transparent);
  pointer-events:none;
}

.hub-role-layout {
  position:relative;
  z-index:1;
  display:grid;
  gap:72px;
}

.hub-role .hub-eyebrow {
  color:#72bdff;
}

.hub-role-copy h2 {
  max-width:1050px;
  margin:18px 0 0;
  font-size:clamp(50px,5.4vw,79px);
  font-weight:550;
  line-height:1.01;
  letter-spacing:-.058em;
}

.hub-role-copy h2 span {
  color:#8f9ca7;
}

.hub-role-copy > p:last-child {
  max-width:730px;
  margin:27px 0 0;
  color:#aab7c1;
  font-size:16px;
  line-height:1.7;
}

.hub-role-flow {
  display:grid;
  grid-template-columns:minmax(0,1fr) 92px minmax(0,1fr) 92px minmax(0,1.18fr);
  align-items:stretch;
}

.hub-role-node {
  display:flex;
  min-height:170px;
  flex-direction:column;
  justify-content:center;
  padding:27px 29px;
  border:1px solid #2b3945;
  background:rgba(10,18,26,.82);
  box-shadow:0 20px 55px rgba(0,0,0,.14);
}

.hub-role-node.is-hub {
  border-color:rgba(44,150,249,.68);
  background:linear-gradient(145deg,rgba(8,120,232,.25),rgba(10,18,26,.94));
}

.hub-role-node small {
  color:#6bb8ff;
  font-size:9px;
  font-weight:780;
  letter-spacing:.14em;
}

.hub-role-node strong {
  margin-top:18px;
  color:#f7fafc;
  font-size:21px;
  font-weight:610;
  letter-spacing:-.025em;
}

.hub-role-node span {
  margin-top:11px;
  color:#8f9ca7;
  font-size:11px;
  line-height:1.55;
}

.hub-role-link {
  display:flex;
  align-items:center;
  justify-content:center;
  color:#67b8ff;
  font-size:9px;
  font-weight:760;
  letter-spacing:.12em;
  white-space:nowrap;
}

.hub-role-link::after {
  content:"→";
  margin-left:8px;
  font-size:16px;
  letter-spacing:0;
}

.hub-interfaces {
  padding:126px 0 132px;
  background:#fff;
}

.hub-section-heading {
  display:grid;
  grid-template-columns:minmax(180px,.54fr) minmax(0,1.46fr);
  align-items:start;
  gap:60px;
  margin-bottom:72px;
}

.hub-section-heading .hub-eyebrow {
  margin-top:11px;
}

.hub-section-heading h2 {
  margin:0;
  font-size:clamp(48px,5.2vw,76px);
  font-weight:560;
  line-height:1.01;
  letter-spacing:-.057em;
}

.hub-interface-viewer {
  display:grid;
  grid-template-columns:minmax(0,1.42fr) minmax(300px,.58fr);
  min-height:690px;
  overflow:hidden;
  border:1px solid var(--hub-line);
  background:#f3f4f5;
}

.hub-interface-stage {
  position:relative;
  min-width:0;
  overflow:hidden;
  border-right:1px solid var(--hub-line);
  background:#f5f5f4;
}

.hub-interface-image {
  position:absolute;
  inset:0;
  margin:0;
}

.hub-interface-image img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

.hub-interface-image[hidden] {
  display:none;
}

.hub-port-marker {
  position:absolute;
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  padding:0;
  color:#fff;
  border:1px solid rgba(255,255,255,.7);
  border-radius:50%;
  background:rgba(7,120,232,.88);
  box-shadow:0 0 0 7px rgba(7,120,232,.14),0 7px 20px rgba(10,31,49,.22);
  cursor:pointer;
  backdrop-filter:blur(8px);
  transition:transform .18s ease,background .18s ease,box-shadow .18s ease;
}

.hub-port-marker:hover,
.hub-port-marker:focus-visible,
.hub-port-marker.is-active {
  transform:scale(1.08);
  background:#005fc7;
  box-shadow:0 0 0 10px rgba(7,120,232,.2),0 8px 24px rgba(10,31,49,.25);
}

.hub-port-marker span {
  font-size:10px;
  font-weight:780;
}

.hub-port-can-one { left:calc(50% + 187px); top:42%; }
.hub-port-can-two { left:calc(50% + 187px); top:63%; }
.hub-port-serial { left:calc(50% - 170px); top:61%; }
.hub-port-usb { left:59%; top:61%; }

.hub-interface-console {
  display:flex;
  min-width:0;
  flex-direction:column;
  justify-content:space-between;
  padding:34px;
  background:#0a0e13;
}

.hub-interface-tabs {
  display:flex;
  gap:5px;
  padding:4px;
  border:1px solid #252e37;
  background:#111820;
}

.hub-interface-tabs button {
  flex:1;
  min-height:39px;
  padding:9px 13px;
  color:#8493a0;
  border:0;
  background:transparent;
  cursor:pointer;
  font-size:11px;
  font-weight:680;
}

.hub-interface-tabs button[aria-selected="true"] {
  color:#fff;
  background:#27333e;
}

.hub-interface-detail {
  padding:55px 3px 6px;
  color:#fff;
}

.hub-interface-detail small {
  color:#69b6ff;
  font-size:10px;
  font-weight:760;
  letter-spacing:.13em;
}

.hub-interface-detail h3 {
  margin:19px 0 0;
  font-size:clamp(32px,3vw,45px);
  font-weight:570;
  line-height:1.04;
  letter-spacing:-.047em;
}

.hub-interface-detail p {
  margin:22px 0 0;
  color:#9facb8;
  font-size:15px;
  line-height:1.65;
}

.hub-interface-detail > div {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:28px;
}

.hub-interface-detail > div span {
  padding:8px 10px;
  color:#c1ccd5;
  border:1px solid #303b45;
  background:#111820;
  font-size:9px;
  font-weight:680;
}

.hub-enumeration {
  padding:126px 0 132px;
  background:
    radial-gradient(circle at 77% 20%,rgba(8,120,232,.1),transparent 34%),
    #eef3f7;
}

.hub-enumeration-layout {
  display:grid;
  grid-template-columns:minmax(330px,.76fr) minmax(520px,1.24fr);
  align-items:center;
  gap:90px;
}

.hub-enumeration-copy h2 {
  margin:18px 0 0;
  font-size:clamp(48px,4.7vw,69px);
  font-weight:560;
  line-height:1.01;
  letter-spacing:-.057em;
}

.hub-enumeration-copy h2 span {
  color:#697783;
}

.hub-enumeration-copy > p:last-of-type {
  max-width:550px;
  margin:26px 0 0;
  color:#566572;
  font-size:15px;
  line-height:1.72;
}

.hub-enumeration-facts {
  margin:34px 0 0;
  border-top:1px solid #b9c6d0;
}

.hub-enumeration-facts > div {
  display:grid;
  grid-template-columns:84px 1fr;
  gap:22px;
  padding:15px 0;
  border-bottom:1px solid #cbd5dd;
}

.hub-enumeration-facts dt {
  color:#71808c;
  font-size:9px;
  font-weight:760;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.hub-enumeration-facts dd {
  margin:0;
  color:#15212b;
  font-size:12px;
  font-weight:610;
}

.hub-system-window,
.hub-software-card {
  margin:0;
  overflow:hidden;
  border:1px solid #c7d1d9;
  background:#fff;
  box-shadow:0 28px 70px rgba(34,57,76,.14);
}

.hub-window-bar {
  display:flex;
  min-height:42px;
  align-items:center;
  gap:7px;
  padding:10px 14px;
  border-bottom:1px solid #d7dfe5;
  background:#f5f7f9;
}

.hub-window-bar > span {
  width:8px;
  height:8px;
  border-radius:50%;
  background:#bcc5cc;
}

.hub-window-bar > span:first-child {
  background:#82bdf3;
}

.hub-window-bar strong {
  margin-left:6px;
  color:#63717d;
  font-size:9px;
  font-weight:680;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.hub-system-window img,
.hub-software-card img {
  display:block;
  width:100%;
  height:auto;
}

.hub-system-window figcaption,
.hub-software-card figcaption {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:17px 19px;
  border-top:1px solid #e1e6ea;
  color:#71808c;
  font-size:9px;
  line-height:1.45;
}

.hub-applications {
  padding:122px 0 130px;
  color:#fff;
  background:#070a0e;
}

.hub-application-heading {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:50px;
  margin-bottom:55px;
}

.hub-application-heading .hub-eyebrow {
  color:#6bb8ff;
}

.hub-application-heading h2 {
  margin:15px 0 0;
  font-size:clamp(48px,5vw,72px);
  font-weight:550;
  line-height:1;
  letter-spacing:-.057em;
}

.hub-application-heading > p {
  max-width:430px;
  margin:0 0 7px;
  color:#93a0ab;
  font-size:14px;
  line-height:1.7;
}

.hub-use-case-grid {
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  border-top:1px solid #2a3641;
  border-left:1px solid #2a3641;
}

.hub-use-case {
  position:relative;
  display:flex;
  min-height:340px;
  grid-column:span 2;
  flex-direction:column;
  padding:35px 34px 32px;
  overflow:hidden;
  border-right:1px solid #2a3641;
  border-bottom:1px solid #2a3641;
  background:
    radial-gradient(circle at 90% 10%,rgba(8,120,232,.13),transparent 35%),
    #0c1218;
}

.hub-use-case-wide {
  min-height:365px;
  grid-column:span 3;
}

.hub-use-case::before {
  content:"";
  position:absolute;
  top:0;
  right:0;
  width:90px;
  height:3px;
  background:linear-gradient(90deg,transparent,#168df1);
}

.hub-use-case small {
  color:#63b5ff;
  font-size:9px;
  font-weight:760;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.hub-use-case h3 {
  max-width:520px;
  margin:47px 0 0;
  color:#f6f9fb;
  font-size:clamp(27px,2.5vw,37px);
  font-weight:560;
  line-height:1.08;
  letter-spacing:-.044em;
}

.hub-use-case p {
  max-width:620px;
  margin:19px 0 0;
  color:#9fabb5;
  font-size:13px;
  line-height:1.68;
}

.hub-use-case-tags {
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:auto;
  padding-top:28px;
}

.hub-use-case-tags span {
  padding:7px 9px;
  color:#b9dfff;
  border:1px solid #29455d;
  background:#101c26;
  font-size:8px;
  font-weight:650;
}

.hub-software {
  padding:124px 0 128px;
  border-bottom:1px solid var(--hub-line);
  background:#f4f6f8;
}

.hub-software-heading {
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
  align-items:end;
  gap:90px;
  margin-bottom:58px;
}

.hub-software-heading h2 {
  margin:17px 0 0;
  color:#111820;
  font-size:clamp(48px,5vw,72px);
  font-weight:550;
  line-height:1;
  letter-spacing:-.058em;
}

.hub-software-heading > p {
  max-width:470px;
  margin:0 0 5px;
  color:#62707c;
  font-size:14px;
  line-height:1.72;
}

.hub-software-grid {
  display:grid;
  grid-template-columns:minmax(0,1.18fr) minmax(360px,.82fr);
  align-items:stretch;
  gap:22px;
}

.hub-software-card {
  display:flex;
  flex-direction:column;
  box-shadow:0 22px 58px rgba(34,57,76,.1);
}

.hub-software-card figcaption {
  flex:1;
}

.hub-software-card figcaption strong,
.hub-software-card figcaption span {
  display:block;
}

.hub-software-card figcaption strong {
  color:#17222b;
  font-size:11px;
  font-weight:680;
}

.hub-software-card figcaption span {
  text-align:right;
}

.hub-platform-list-inline {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  margin-top:28px;
  border-top:1px solid #c7d0d8;
  border-left:1px solid #c7d0d8;
}

.hub-platform-list-inline article {
  min-height:105px;
  padding:0 25px;
  border-right:1px solid #c7d0d8;
  border-bottom:1px solid #c7d0d8;
}

.hub-platform-list-inline svg {
  fill:#273844;
}

.hub-platform-list-inline small {
  color:#778590;
}

.hub-platform-list-inline strong {
  color:#17222b;
}

.hub-platform-list-inline > article > span {
  color:#176ebd;
}

.hub-platform-list {
  border-top:1px solid #34404a;
}

.hub-platform-list article {
  display:grid;
  grid-template-columns:46px 1fr auto;
  align-items:center;
  gap:21px;
  min-height:116px;
  border-bottom:1px solid #34404a;
}

.hub-platform-list svg {
  width:28px;
  height:28px;
  fill:#e8f1f8;
}

.hub-platform-list small {
  display:block;
  color:#7f8e9b;
  font-size:9px;
  font-weight:720;
  letter-spacing:.11em;
}

.hub-platform-list strong {
  display:block;
  margin-top:6px;
  font-size:19px;
  font-weight:610;
}

.hub-platform-list > article > span {
  display:flex;
  align-items:center;
  gap:7px;
  color:#a9d6ff;
  font-size:10px;
  font-weight:680;
}

.hub-platform-list > article > span::before {
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:#56aefc;
  box-shadow:0 0 0 4px rgba(86,174,252,.1);
}

.hub-specifications {
  padding:126px 0 134px;
  background:#fff;
}

.hub-spec-layout {
  display:grid;
  grid-template-columns:minmax(290px,.76fr) minmax(0,1.24fr);
  align-items:start;
  gap:100px;
}

.hub-spec-heading {
  position:sticky;
  top:156px;
}

.hub-spec-heading h2 {
  margin:17px 0 0;
  font-size:clamp(50px,5.2vw,74px);
  font-weight:560;
  line-height:1;
  letter-spacing:-.058em;
}

.hub-spec-heading a {
  display:inline-block;
  margin-top:31px;
  color:var(--hub-blue);
  font-size:12px;
  font-weight:700;
}

.hub-spec-list {
  margin:0;
  border-top:1px solid #bfc7ce;
}

.hub-spec-list > div {
  display:grid;
  grid-template-columns:minmax(170px,.7fr) minmax(0,1.3fr);
  gap:30px;
  padding:22px 0;
  border-bottom:1px solid var(--hub-line);
}

.hub-spec-list dt {
  color:#7a858e;
  font-size:11px;
  font-weight:670;
}

.hub-spec-list dd {
  margin:0;
  color:#172029;
  font-size:14px;
  font-weight:530;
  line-height:1.55;
}

.hub-spec-list dd strong {
  color:var(--hub-blue);
  font-weight:700;
}

.hub-resources {
  padding:110px 0;
  border-top:1px solid var(--hub-line);
  background:var(--hub-soft);
}

.hub-resources-layout {
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  align-items:start;
  gap:100px;
}

.hub-resources h2 {
  max-width:580px;
  margin:17px 0 0;
  font-size:clamp(42px,4.3vw,62px);
  font-weight:560;
  line-height:1.02;
  letter-spacing:-.052em;
}

.hub-resource-links {
  border-top:1px solid #bfc7ce;
}

.hub-resource-links a {
  display:flex;
  min-height:82px;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border-bottom:1px solid #cdd3d8;
  font-size:15px;
  font-weight:620;
  transition:padding .18s ease,color .18s ease;
}

.hub-resource-links a:hover {
  padding-left:9px;
  color:var(--hub-blue);
}

.hub-resource-links b {
  color:var(--hub-blue);
  font-size:16px;
}

.hub-final-cta {
  padding:126px 0 132px;
  color:#fff;
  text-align:center;
  background:
    radial-gradient(circle at 50% 35%,rgba(26,130,232,.24),transparent 31%),
    #05080c;
}

.hub-final-cta .hub-eyebrow {
  color:#78beff;
}

.hub-final-cta h2 {
  max-width:900px;
  margin:20px auto 34px;
  font-size:clamp(55px,6.2vw,88px);
  font-weight:550;
  line-height:.99;
  letter-spacing:-.06em;
}

.hub-button-light {
  color:#07111a;
  background:#fff;
}

.hub-button-light:hover {
  background:#eaf4ff;
}

@media (max-width:1100px) {
  .hub-wide { width:min(100% - 52px,1320px); }
  .hub-hero { min-height:640px; }
  .hub-hero-inner { min-height:525px; }
  .hub-hero-art img { left:70%; width:clamp(1020px,105vw,1120px); }
  .hub-role-flow { grid-template-columns:minmax(0,1fr) 62px minmax(0,1fr) 62px minmax(0,1.16fr); }
  .hub-role-node { padding:24px 22px; }
  .hub-role-node strong { font-size:19px; }
  .hub-interface-viewer { grid-template-columns:minmax(0,1.25fr) minmax(290px,.75fr); min-height:620px; }
  .hub-port-can-one,.hub-port-can-two { left:calc(50% + 168px); }
  .hub-port-serial { left:calc(50% - 152px); }
  .hub-enumeration-layout { grid-template-columns:minmax(300px,.74fr) minmax(470px,1.26fr); gap:55px; }
  .hub-software-grid { grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr); }
  .hub-spec-layout,.hub-resources-layout { gap:70px; }
}

@media (max-width:860px) {
  html { scroll-padding-top:106px; }
  .hub-wide { width:calc(100% - 38px); }
  .hub-local-nav { top:58px; }
  .hub-local-links { gap:17px; }
  .hub-local-links a:not(.hub-local-cta) { display:none; }
  .hub-hero { min-height:auto; }
  .hub-hero::after { background:linear-gradient(180deg,#f7f7f5 0%,rgba(247,247,245,.99) 42%,rgba(247,247,245,.9) 54%,rgba(247,247,245,.74) 64%,rgba(247,247,245,.36) 70%,rgba(247,247,245,.12) 78%,rgba(247,247,245,.58) 100%); }
  .hub-hero-art { position:relative; inset:auto; display:block; width:100%; height:clamp(560px,76vw,660px); min-height:0; }
  .hub-hero-art img { position:absolute; top:66%; left:52%; width:clamp(620px,135vw,1080px); max-width:none; height:auto; object-fit:initial; object-position:initial; transform:translate(-60%,-47.8%); }
  .hub-hero-inner { position:absolute; inset:0; min-height:0; align-items:flex-start; padding-top:70px; }
  .hub-hero-copy { width:min(560px,76%); }
  .hub-hero h1 { font-size:clamp(48px,9vw,72px); }
  .hub-hero-copy > p:last-of-type { font-size:15px; }
  .hub-hero-facts { grid-template-columns:repeat(2,minmax(0,1fr)); background:#fff; }
  .hub-hero-facts > div { min-height:98px; padding:20px 22px; border-bottom:1px solid var(--hub-line); }
  .hub-hero-facts > div:first-child { padding-left:22px; }
  .hub-hero-facts strong { font-size:21px; }
  .hub-role { padding:88px 0 94px; }
  .hub-role-layout { gap:54px; }
  .hub-role-flow { grid-template-columns:1fr; gap:15px; }
  .hub-role-node { min-height:150px; }
  .hub-role-link { min-height:34px; }
  .hub-role-link::after { content:"↓"; }
  .hub-section-heading { grid-template-columns:1fr; gap:18px; margin-bottom:48px; }
  .hub-section-heading .hub-eyebrow { margin:0; }
  .hub-interfaces,.hub-enumeration,.hub-applications,.hub-software,.hub-specifications { padding:92px 0 98px; }
  .hub-interface-viewer { grid-template-columns:1fr; min-height:0; }
  .hub-interface-stage { min-height:68vw; border-right:0; border-bottom:1px solid var(--hub-line); }
  .hub-port-can-one,.hub-port-can-two { left:70%; }
  .hub-port-serial { left:32%; }
  .hub-interface-console { min-height:330px; }
  .hub-interface-detail { padding-top:45px; }
  .hub-enumeration-layout { grid-template-columns:1fr; gap:52px; }
  .hub-system-window { width:min(100%,720px); }
  .hub-application-heading { align-items:flex-start; flex-direction:column; gap:28px; }
  .hub-use-case-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hub-use-case,.hub-use-case-wide { min-height:310px; grid-column:auto; }
  .hub-use-case:last-child { grid-column:1/-1; }
  .hub-software-heading,.hub-software-grid { grid-template-columns:1fr; gap:42px; }
  .hub-software-heading { align-items:start; margin-bottom:48px; }
  .hub-software-heading > p { margin:0; }
  .hub-software-grid { gap:22px; }
  .hub-spec-layout,.hub-resources-layout { grid-template-columns:1fr; gap:55px; }
  .hub-resources { padding:88px 0 94px; }
  .hub-spec-heading { position:static; }
}

@media (max-width:560px) {
  .hub-wide { width:calc(100% - 28px); }
  .hub-local-inner { min-height:46px; }
  .hub-local-name { font-size:12px; }
  .hub-local-name span { display:none; }
  .hub-local-links .hub-local-cta { min-height:30px; padding:6px 10px; font-size:10px; }
  .hub-hero-inner { padding-top:50px; }
  .hub-hero-copy { width:100%; }
  .hub-hero h1 { margin-top:15px; font-size:50px; line-height:.99; }
  .hub-hero-copy > p:last-of-type { max-width:340px; margin-top:18px; font-size:14px; }
  .hub-hero-actions { margin-top:23px; }
  .hub-button { min-height:43px; padding:11px 14px; font-size:10px; }
  .hub-hero-facts { grid-template-columns:1fr 1fr; }
  .hub-hero-facts > div { min-height:83px; padding:15px 13px; }
  .hub-hero-facts > div:first-child { padding-left:13px; }
  .hub-hero-facts strong { font-size:17px; }
  .hub-hero-facts span { font-size:9px; }
  .hub-role-copy h2 { font-size:43px; }
  .hub-role-copy > p:last-child { font-size:14px; }
  .hub-role-node { min-height:135px; padding:22px; }
  .hub-section-heading h2,.hub-application-heading h2,.hub-spec-heading h2 { font-size:43px; }
  .hub-interface-stage { min-height:465px; }
  .hub-interface-image img { object-fit:cover; }
  .hub-port-marker { width:35px; height:35px; }
  .hub-port-can-one { left:74%; top:42%; }
  .hub-port-can-two { left:74%; top:63%; }
  .hub-port-serial { left:29%; top:61%; }
  .hub-port-usb { left:59%; top:60%; }
  .hub-interface-console { min-height:300px; padding:22px; }
  .hub-interface-detail h3 { font-size:32px; }
  .hub-enumeration-copy h2,.hub-software-heading h2 { font-size:42px; }
  .hub-system-window figcaption,.hub-software-card figcaption { align-items:flex-start; flex-direction:column; gap:6px; }
  .hub-software-card figcaption span { text-align:left; }
  .hub-use-case-grid { grid-template-columns:1fr; }
  .hub-use-case,.hub-use-case-wide,.hub-use-case:last-child { min-height:0; grid-column:auto; }
  .hub-use-case { padding:29px 25px 27px; }
  .hub-use-case h3 { margin-top:37px; font-size:30px; }
  .hub-use-case-tags { margin-top:27px; padding-top:0; }
  .hub-platform-list-inline { grid-template-columns:1fr; }
  .hub-platform-list article { grid-template-columns:38px 1fr; min-height:100px; }
  .hub-platform-list > article > span { grid-column:2; margin-top:-22px; }
  .hub-spec-list > div { grid-template-columns:1fr; gap:8px; padding:18px 0; }
  .hub-resources h2 { font-size:40px; }
  .hub-final-cta { padding:92px 0 98px; }
  .hub-final-cta h2 { font-size:49px; }
}

@media (prefers-reduced-motion:reduce) {
  .hub-button,
  .hub-port-marker,
  .hub-resource-links a {
    transition:none;
  }
}