/* Media and cohort components shared by the landing and future diagnostic flow. */
.video-frame {
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
  background:#17251e;
  border-radius:4px
}

.video-frame>img,.video-frame>iframe {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  border:0
}

.video-play {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  display:grid;
  place-items:center;
  width:68px;
  height:68px;
  border:0;
  border-radius:50%;
  background:var(--paper);
  color:var(--ink);
  transition:background .18s
}

.video-play span {
  font-size:24px;
  padding-left:4px
}

.video-play:hover {
  background:var(--lime)
}

.cohort-summary {
  display:grid;
  gap:8px;
  font-size:16px;
  margin:28px 0 32px
}

.cohort-summary strong {
  font-weight:500
}

.cohort-summary [data-cohort-availability] {
  font-size:13px;
  color:#c6d0c7
}

.seats-confirmed {
  font-weight:600
}

.diagnostics-page {
  min-height:100svh;
  display:flex;
  flex-direction:column
}

.diagnostics-header {
  padding-block:24px;
  display:flex;
  justify-content:space-between;
  align-items:center
}

.diagnostics-main {
  flex:1;
  display:flex;
  align-items:center;
  padding-block:64px
}

.diagnostics-shell {
  max-width:740px
}

.diagnostics-shell h1 {
  font-size:clamp(38px,5vw,68px)
}

.diagnostics-shell .lead {
  margin:28px 0 32px;
  max-width:650px
}

.diagnostics-shell .eyebrow {
  color:var(--muted)
}

.diagnostics-footer {
  font-size:13px;
  color:var(--muted);
  padding-block:24px
}

.diagnostics-shell .status-mark {
  display:inline-block;
  width:9px;
  height:9px;
  margin-right:10px;
  border-radius:50%;
  background:var(--accent)
}

@media(max-width:767px) {
  .video-play {
    width:56px;
    height:56px
  }

  .diagnostics-main {
    padding-block:40px
  }

  .diagnostics-header {
    padding-block:16px
  }

  .diagnostics-header .text-link {
    font-size:13px
  }

  .diagnostics-shell .button {
    width:100%
  }

  .diagnostics-shell .lead {
    font-size:18px
  }

}
