/* Colours of the isometric illustrations, for the public site and the standalone pages. */
.sx-art {
  --a-floor: #f7f4ef;
  --a-grid: rgb(23 32 51 / 7%);
  --a-edge: rgb(23 32 51 / 14%);
  --a-glass: #bcd2ea;
  --a-steel-t: #eef1f6;
  --a-steel-l: #cdd5e0;
  --a-steel-r: #b6c0ce;
  --a-wall-t: #ffffff;
  --a-wall-l: #f0f2f6;
  --a-wall-r: #dfe4ec;
  --a-dark-t: #3a4254;
  --a-dark-l: #2a3040;
  --a-dark-r: #202534;
  --a-orange-t: #ffa04d;
  --a-orange-l: #ff7900;
  --a-orange-r: #d96400;
  --a-carton-t: #f7dcbb;
  --a-carton-l: #e8c196;
  --a-carton-r: #d6a877;
  display: block;
  inline-size: 100%;
  block-size: auto;
  overflow: visible;
}
:root[data-theme='dark'] .sx-art {
  --a-floor: #26282e;
  --a-grid: rgb(255 255 255 / 6%);
  --a-edge: rgb(0 0 0 / 40%);
  --a-glass: #4a6a8f;
  --a-steel-t: #565b67;
  --a-steel-l: #474c57;
  --a-steel-r: #3a3e48;
  --a-wall-t: #666b78;
  --a-wall-l: #4e525e;
  --a-wall-r: #41454f;
  --a-dark-t: #1c1e24;
  --a-dark-l: #15171c;
  --a-dark-r: #101115;
  --a-carton-t: #b98f5f;
  --a-carton-l: #9c774d;
  --a-carton-r: #84633e;
}
.sx-art polygon,
.sx-art path.b,
.sx-art ellipse {
  stroke: var(--a-edge);
  stroke-width: 0.8;
  stroke-linejoin: round;
}
.sx-art .a-floor {
  fill: var(--a-floor);
  stroke: var(--a-grid);
}
.sx-art .a-grid {
  stroke: var(--a-grid);
  stroke-width: 1;
}
.sx-art .a-glass {
  fill: var(--a-glass);
}
.sx-art .a-door {
  fill: var(--a-dark-l);
}
.sx-art .a-roof {
  fill: var(--a-steel-t);
}
.sx-art .a-roof-side {
  fill: var(--a-glass);
}
.sx-art .a-cone {
  fill: var(--a-orange-l);
}
.sx-art :is(.a-steel, .a-trailer) .t {
  fill: var(--a-steel-t);
}
.sx-art :is(.a-steel, .a-trailer) .l {
  fill: var(--a-steel-l);
}
.sx-art :is(.a-steel, .a-trailer) .r {
  fill: var(--a-steel-r);
}
.sx-art :is(.a-wall, .a-sheet) .t {
  fill: var(--a-wall-t);
}
.sx-art :is(.a-wall, .a-sheet) .l {
  fill: var(--a-wall-l);
}
.sx-art :is(.a-wall, .a-sheet) .r {
  fill: var(--a-wall-r);
}
.sx-art :is(.a-frame, .a-belt, .a-machine, .a-cab, .a-glassbox) .t {
  fill: var(--a-dark-t);
}
.sx-art :is(.a-frame, .a-belt, .a-machine, .a-cab, .a-glassbox) .l {
  fill: var(--a-dark-l);
}
.sx-art :is(.a-frame, .a-belt, .a-machine, .a-cab, .a-glassbox) .r {
  fill: var(--a-dark-r);
}
.sx-art :is(.a-orange, .a-orangepad) .t {
  fill: var(--a-orange-t);
}
.sx-art :is(.a-orange, .a-orangepad) .l {
  fill: var(--a-orange-l);
}
.sx-art :is(.a-orange, .a-orangepad) .r {
  fill: var(--a-orange-r);
}
.sx-art .a-carton .t {
  fill: var(--a-carton-t);
}
.sx-art .a-carton .l {
  fill: var(--a-carton-l);
}
.sx-art .a-carton .r {
  fill: var(--a-carton-r);
}
.sx-art .a-pad .t {
  fill: var(--a-steel-t);
}
.sx-art .a-pad .l {
  fill: var(--a-steel-l);
}
.sx-art .a-pad .r {
  fill: var(--a-steel-r);
}
.sx-art .s0 {
  stop-color: var(--a-steel-r);
}
.sx-art .s1 {
  stop-color: var(--a-wall-t);
}
.sx-art .s2 {
  stop-color: var(--a-steel-l);
}
.sx-art :is(.a-tank, .a-flask) .t {
  fill: var(--a-wall-t);
}
.sx-art :is(.a-stack) .t {
  fill: var(--a-dark-t);
}
.sx-art .a-bottle .t {
  fill: var(--a-orange-l);
}
.sx-art .a-band {
  fill: none;
  stroke: var(--a-orange-l);
  stroke-width: 3;
}
.sx-art .a-pipe {
  fill: none;
  stroke: var(--a-steel-r);
  stroke-width: 5;
  stroke-linecap: round;
}
.sx-art .a-flow {
  fill: none;
  stroke: var(--a-orange-l);
  stroke-width: 2;
  stroke-dasharray: 8 20;
  stroke-linecap: round;
}
.sx-art .a-arm {
  fill: none;
  stroke: var(--a-orange-l);
  stroke-width: 7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.sx-art .a-light {
  fill: var(--a-orange-l);
}
/* Registration and trial headers */
.registration-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  align-items: center;
  gap: 24px;
  margin-block-end: 18px;
}
.registration-hero-art {
  max-inline-size: 380px;
  justify-self: end;
}
@media (max-width: 760px) {
  .registration-hero {
    grid-template-columns: minmax(0, 1fr);
  }
  .registration-hero-art {
    display: none;
  }
}
