/* A simple video page and its print on the Fun Stuff workbench. */
.camper-page > .camper-content { max-width: 1200px; }
.camper-back,
.camper-links a {
  display: inline-block;
  padding: 7px 0;
  border-bottom: 1px solid var(--line);
  font-size: .875rem;
  text-decoration: none;
}
.camper-back:hover,
.camper-links a:hover { color: var(--accent); border-color: var(--accent); }
.camper-back:focus-visible,
.camper-links a:focus-visible,
.fun-object--a6-camper:focus-visible { outline: 2px solid var(--accent); outline-offset: 6px; }
.camper-header { padding: 56px 0 42px; }
.camper-header .eyebrow { font-size: .75rem; }
.camper-header h1 {
  margin: 0;
  font-size: clamp(42px, 6.5vw, 88px);
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: -.055em;
}
.camper-video { aspect-ratio: 16 / 9; background: #181715; }
.camper-video iframe { display: block; width: 100%; height: 100%; border: 0; }
.camper-links { display: flex; justify-content: flex-end; padding-top: 18px; }

.fun-object--a6-camper {
  top: 3260px;
  left: 12%;
  width: min(68%, 760px);
  transform: rotate(.65deg);
}
.fun-object--a6-camper.is-active { transform: rotate(.65deg) translateY(-6px) scale(1.012); }
.fun-video-cover { position: relative; }
.fun-print--a6-camper img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.fun-video-play {
  position: absolute;
  left: 50%;
  top: 50%;
  display: grid;
  place-items: center;
  width: 58px;
  height: 42px;
  padding-left: 3px;
  border-radius: 4px;
  background: rgba(24, 23, 21, .85);
  color: #fff;
  font-size: 20px;
  transform: translate(-50%, -50%);
}
@media (min-width: 1041px) {
  .fun-workbench__surface { min-height: 3880px; }
}
@media (min-width: 761px) and (max-width: 1040px) {
  .fun-workbench__surface { min-height: 3550px; }
  .fun-object--a6-camper { top: 3080px; left: 6%; width: 80%; }
}
@media (max-width: 760px) {
  .camper-header { padding: 38px 0 28px; }
  .fun-object--a6-camper { top: auto; left: auto; width: min(94%, 760px); justify-self: end; }
}
@media (prefers-reduced-motion: reduce) {
  .fun-object--a6-camper { transition: none; }
}