#section-title { background: #35385e; padding-bottom: 0; }
/* Equipment: use the same single-column mobile flow as the newer sections. */
@media (max-width: 700px), (max-width: 1055px) and (max-resolution: 119dpi) {
  #section-device > .container.maingrid {
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
  }
  #section-device > .container.maingrid > * {
    grid-area: auto / 1 / auto / -1;
    min-width: 0;
  }
  #section-device #section-device__tc-title,
  #section-device #section-device__device-name { grid-row: 1; margin: 0; }
  #section-device__tc-title h1,
  #section-device__device-name h1 { margin: 0; }
  #section-device #section-device__tc-image {
    grid-row: 2; align-items: center; gap: 2rem; justify-content: flex-start;
  }
  #section-device__tc-image > img { width: min(100%, 300px); max-width: 100%; }
  #section-device__tc-image > img.tc-connector { width: min(85%, 300px); }
  #section-device #section-device__tc-text {
    grid-row: 3; display: grid; gap: 2rem; justify-content: normal;
  }
  #section-device #section-device__tc-text h3 { margin: 0 0 0.75rem; }
  #section-device #section-device__tc > hr { grid-row: 4; margin: 2rem 0; }
  #section-device #section-device__device-image {
    grid-row: 2; position: static; width: min(100%, 280px); margin: 0 auto;
  }
  #section-device #section-device__device-image img {
    position: static; display: block; width: 100%; max-width: 100%; height: auto;
    scale: 1; transform: none;
  }
  #section-device #section-device__device-desc {
    grid-row: 3; display: block; margin: 0; width: 100%;
  }
  #section-device .recorder-documents { grid-row: 4; margin: 0; }
  #section-device .recorder-documents h3 { margin: 0 0 0.75rem; }
}
#section-title #section-intro { background: transparent; margin-top: 5rem; }
#section-device__transition-in .-top { fill: #35385e; }
@media (max-width: 700px) {
  #section-title #section-intro { margin-top: 3rem; }
}
#section-device { background: #c1c8d9; }
#section-device__tc-text strong { font-weight: 700; }
.recorder-documents { grid-column: 1 / -1; margin-top: 3rem; min-width: 0; }
.recorder-documents h3 { margin-bottom: 1.5rem; }
.recorder-documents ul { list-style: disc outside; margin: 0; padding: 0; }
.recorder-documents li { margin: 0 0 1rem 1rem; line-height: 1.5; }
@media (min-width: 1056px) and (max-resolution: 119dpi), (min-width: 672px) and (min-resolution: 120dpi) {
  .recorder-documents { grid-column: 9 / 17; grid-row: 3; }
  #section-device__device-desc { grid-column: 9 / 17; grid-row: 2; }
}
/* TC022: match the visible device to the adjacent description, excluding alpha margins. */
#section-device__device-image img { height: auto; scale: 0.88; transform-origin: center; }
@media (min-width: 1056px) and (max-resolution: 119dpi), (min-width: 672px) and (min-resolution: 120dpi) {
  #section-device__device-image { position: relative; align-self: stretch; grid-row: 2 / 4; }
  #section-device__device-image img {
    position: absolute;
    height: 115.489%;
    width: auto;
    max-width: none;
    top: -9.85%;
    left: calc(50% - 48px);
    transform: translateX(-50%);
  }
}
#section-device__tc {
  background: #c1c8d9;
  box-shadow: 0 0 0 100vmax #c1c8d9;
  clip-path: inset(0 -100vmax);
}
#section-device__transition-out { background: #c1c8d9; }
#section-device__tc-image { gap: 3rem; }
#section-device__tc-image .tc-connector { width: 85%; align-self: center; }
#section-specs { background: #4b4d5e; color: #f4f4f4; }
#section-specs h1, #section-specs h3 { color: #f4f4f4; }
#section-specs ul { color: #d9dbe7; }
#section-specs hr { background: #777a98; }
#section-device__transition-out .-bottom,
#section-files__transition-in .-top { fill: #4b4d5e; }
#section-files { background: #cfcfcf; color: #292929; }
#section-files h1, #section-files h3 { color: #292929; }
#section-files .-group .-group-item,
#section-files .-group .-group-item:visited { --color: #fff; color: var(--color); }
#section-files .-group .-group-item:hover { --color: #a6c8ff; }
#section-files .-group .-group-item:focus-visible { --color: #a6c8ff; outline: 2px solid #a6c8ff; outline-offset: 4px; }
#section-files .-group .-group-item .-file-name,
#section-files .-group .-group-item:visited .-file-name { color: #c9cbd8; }
#section-files hr { background: #777a98; }
#section-files .cloud-description { grid-column: 1 / -1; text-align: center; font-size: 20px; line-height: 1.5; color: #4b4d5e; padding-bottom: 3rem; }
#section-files #cloud-title { margin-bottom: 2rem; }
.cloud-layout { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 30.45fr) minmax(0, 66.32fr); gap: 2rem; align-items: center; }
.cloud-features { display: grid; gap: 1.75rem; min-width: 0; }
@media (min-width: 801px) {
  .cloud-features { width: 100%; }
}
.cloud-features h3 { margin: 0 0 0.5rem; }
.cloud-features ul { color: #292929; }
#section-device__device-desc,
#section-device__tc-text ul,
.logger-features ul,
.hub-description ul,
.cloud-features ul { list-style: disc outside; padding: 0; margin: 0; }
#section-device__device-desc li,
#section-device__tc-text li,
.logger-features li,
.hub-description li,
.cloud-features li { margin: 0 0 1rem 1rem; line-height: 1.5; }
.cloud-illustration { margin: 0; min-width: 0; }
.cloud-illustration img { display: block; width: 100%; height: auto; }
@media (min-width: 1200px) {
  .cloud-illustration { width: min(125%, calc(100% + (100vw - 992px) / 2 - 24px)); }
}
@media (max-width: 800px) {
  .cloud-layout { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
}
#section-files .mobile-app-divider { grid-column: 1 / -1; margin: 4rem 0; }
#section-mobile-app { grid-column: 1 / -1; min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 4rem; align-items: center; }
#section-mobile-app #mobile-app-title { grid-column: 1 / -1; }
#section-files #mobile-app-title { margin-bottom: 2rem; }
.mobile-app-illustration { grid-column: 1; width: 100%; max-width: 440px; margin: 0 auto; }
.mobile-app-illustration img { display: block; width: 100%; height: auto; }
.mobile-app-visuals { grid-column: 1; min-width: 0; display: grid; gap: 1.5rem; }
.mobile-adapter-illustration { width: 100%; max-width: 440px; margin: 0 auto; }
.mobile-adapter-illustration img { display: block; width: 100%; height: auto; }
.mobile-adapter-illustration figcaption { margin-top: 0.5rem; text-align: center; color: #4b4d5e; line-height: 1.5; }
.mobile-app-features { min-width: 0; display: grid; gap: 1.5rem; }
.mobile-app-features h3 { margin: 0 0 0.5rem; }
.mobile-app-features ul { list-style: disc outside; padding: 0; margin: 0; }
.mobile-app-features li { margin: 0 0 1rem 1rem; line-height: 1.5; }
.mobile-app-features li:last-child { margin-bottom: 0; }
.mobile-app-requirements { margin: 0; line-height: 1.5; color: #4b4d5e; }
#section-files .rustore-link,
#section-files .btn-demo { justify-self: start; display: inline-block; padding: 0.9rem 1.5rem; border-radius: 8px; background: #35385e; color: #fff; text-decoration: none; line-height: 1.5; }
#section-files .rustore-link:hover,
#section-files .btn-demo:hover { background: #4b4d5e; }
#section-files .rustore-link:focus-visible,
#section-files .btn-demo:focus-visible { outline: 2px solid #35385e; outline-offset: 4px; }
@media (max-width: 700px) {
  #section-mobile-app { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
}
#section-specs h1 { margin-bottom: 4rem; }
.hub-divider { margin: 8rem 0; }
.hub-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4rem; align-items: center; }
.hub-description { display: grid; gap: 1.75rem; }
.hub-description h3 { margin: 0 0 0.5rem; }
.hub-description p { margin: 0; line-height: 1.5; }
.hub-description a { color: inherit; text-decoration: underline; text-underline-offset: 0.2em; }
.hub-description a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.hub-figure { position: relative; margin: 0; width: 100%; aspect-ratio: 1.35; overflow: hidden; }
.hub-figure img { position: absolute; width: 150%; max-width: none; height: auto; left: -25%; top: -3%; }
.hub-image-placeholder { min-height: 320px; box-sizing: border-box; border: 1px dashed #868895; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; padding: 2rem; text-align: center; color: #4b4d5e; }
.hub-image-placeholder span { font-size: 32px; line-height: 1.25; }
@media (max-width: 700px) {
  .hub-divider { margin: 4rem 0; }
  .hub-layout { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .hub-image-placeholder { min-height: 240px; }
}
.logger-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
.logger-visuals { min-width: 0; display: grid; gap: 5rem; padding: 2rem 0; }
.logger-top-figure { width: 80%; max-width: 300px; margin: 0 auto; }
.logger-top-figure img { display: block; width: 100%; height: auto; }
.logger-figure { min-width: 0; width: 100%; max-width: 360px; margin: 0 auto; scale: 1.21; }
/* Frame the supplied illustration without changing the original asset. */
.logger-image { position: relative; width: 100%; aspect-ratio: 0.55; overflow: hidden; }
.logger-image img { position: absolute; width: auto; max-width: none; height: 100%; left: 50%; top: 0; transform: translateX(-50%); }
.logger-features { display: grid; gap: 3rem; padding: 2rem 0; }
.logger-features h3 { margin-bottom: 1.5rem; }
.logger-features strong { font-weight: 700; }
.logger-features a { color: inherit; text-decoration: underline; text-underline-offset: 0.2em; }
.logger-features a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.logger-features sub { font-size: 0.75em; vertical-align: sub; }
@media (max-width: 700px) {
  #section-specs h1 { margin-bottom: 2rem; }
  .logger-layout { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .logger-figure { width: min(72%, 280px); margin: 0 auto; }
  .logger-features { gap: 2rem; padding: 1rem 0 0; }
  #section-title__nav { flex-wrap: wrap; }
}