/* Adjustments for the static export: things Squarespace's scripts used to do. */

/* Embedded video blocks: poster overlay until clicked, then the provider's player. */
.sqs-video-wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.sqs-video-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; cursor: pointer; }
.sqs-video-overlay img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.sqs-video-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }

/* Squarespace-hosted videos are now plain <video> files, with Squarespace's play button. */
.sqs-native-video { position: relative; }
.sqs-native-video .port-video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; background: #000; object-fit: cover; }
.port-video-play {
  position: absolute; top: 50%; left: 50%; width: 64px; height: 64px; margin: -32px 0 0 -32px;
  border: 0; border-radius: 50%; background: rgba(0, 0, 0, .55); cursor: pointer; padding: 0;
}
.port-video-play::after {
  content: ""; position: absolute; top: 50%; left: 50%; margin: -11px 0 0 -6px;
  border-style: solid; border-width: 11px 0 11px 18px; border-color: transparent transparent transparent #fff;
}
.port-video-play:hover { background: rgba(0, 0, 0, .7); }
.port-video-play[hidden] { display: none; }

/* PadelSpot business plan: scrollable page-by-page viewer (was a Drive preview). */
.port-doc { overflow-y: auto; -webkit-overflow-scrolling: touch; box-sizing: border-box; padding: 8px; background: #e8e8e8; }
.port-doc img { display: block; width: 100%; height: auto; margin: 0 0 8px; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .2); }
.port-doc img:last-child { margin-bottom: 0; }

/* Homepage logo morph (canvas replaces the slides when WebGL is available). */
.port-morph-canvas { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; }
.port-morph-on .gallery-slideshow-item { visibility: hidden !important; }

/* Homepage on phones: the original hid overflow and put 90px above the footer, which pushed
   the social icons off the bottom of most screens. Keep them on screen (and reachable). */
@media screen and (max-width: 767px) {
  body.homepage { overflow: visible; }
  body.homepage footer#footer-sections { margin-top: 24px; }
}
