.page-content.smartlab-page {
  display: grid;
  align-items: center;
  padding: clamp(2rem, 6vw, 5rem) 1.25rem;
  min-height: min(38rem, 75vh);
  color: var(--color-text);
}

.smartlab-shell {
  width: 100%;
  max-width: 65rem;
  margin-inline: auto;
}

.smartlab-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(17rem, 23rem);
  align-items: center;
  gap: clamp(2rem, 7vw, 6rem);
}

.smartlab-brand img {
  display: block;
  width: 4rem;
  height: 4rem;
  margin-bottom: 1.25rem;
  border-radius: 1rem;
  background: #322671;
  object-fit: contain;
}

.smartlab-brand h1 {
  margin: 0;
  color: inherit;
  font-size: clamp(3rem, 7vw, 5.25rem);
  font-weight: 700;
  letter-spacing: -.065em;
  line-height: .98;
}

.smartlab-brand h1 span {
  display: block;
  margin-top: .8rem;
  color: var(--color-text-light);
  font-size: clamp(1rem, 2.3vw, 1.4rem);
  letter-spacing: .12em;
  line-height: 1.4;
}

.smartlab-brand p {
  max-width: 28rem;
  margin: 1.25rem 0 0;
  color: var(--color-text-light);
  font-size: 1rem;
  line-height: 1.8;
}

.smartlab-entry {
  padding: clamp(1.4rem, 4vw, 2.25rem);
  border: 1px solid var(--color-secondary);
  border-radius: 1rem;
  background: var(--color-box-body);
  box-shadow: 0 14px 34px #493c7d12;
}

.smartlab-entry h2 {
  margin: 0 0 1.1rem;
  color: inherit;
  font-size: 1.2rem;
}

.smartlab-entry a.smartlab-button {
  display: block;
  padding: .85rem 1rem;
  border-radius: .55rem;
  background: var(--color-primary);
  color: var(--color-primary-contrast);
  font-weight: 700;
  text-align: center;
  text-decoration: none;
}

.smartlab-entry a.smartlab-button:hover {
  background: var(--color-primary-hover);
  color: var(--color-primary-contrast);
}

.smartlab-entry a.smartlab-button:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 4px;
}

.smartlab-signin {
  display: grid;
  gap: 1rem;
  min-width: 0;
  color: var(--color-text);
}

.page-content.smartlab-home {
  flex: 1 0 auto;
  align-content: start;
  gap: clamp(2rem, 5vw, 4rem);
}

.smartlab-team {
  position: relative;
  width: min(100%, 60rem);
  margin: 0 auto;
}

.smartlab-team-art {
  display: block;
  width: 100%;
  height: auto;
}

.smartlab-team-logo {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 14%;
  height: auto;
  border-radius: 22%;
  background: #322671;
  transform: translate(-50%, -50%);
}

.smartlab-connection {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.smartlab-connection span {
  position: absolute;
  left: 39%;
  top: 40%;
  width: clamp(3px, .65vw, 7px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: #3d9f88;
  animation: smartlab-signal 4.5s ease-in-out infinite;
}

.smartlab-connection span:nth-child(2) {
  left: 41%;
  top: 64%;
  animation-delay: -1.5s;
}

.smartlab-connection span:nth-child(3) {
  left: 58%;
  top: 48%;
  animation-delay: -3s;
}

@keyframes smartlab-signal {
  0%, 100% { opacity: 0; transform: translate(-.45rem, .25rem); }
  50% { opacity: .85; transform: translate(.45rem, -.25rem); }
}

@media (prefers-reduced-motion: reduce) {
  .smartlab-connection { display: none; }
}

@media (max-width: 680px) {
  .smartlab-shell {
    grid-template-columns: minmax(0, 1fr);
  }
}
