/* Local overrides for the static copy of blockchainbywomen.com (replaces Squarespace runtime JS) */

/* Banner / background images that Squarespace positioned with JavaScript */
figure#thumbnail, .content-fill { position: absolute; top: 0; left: 0; right: 0; bottom: 0; overflow: hidden; }
figure#thumbnail img, .content-fill > img, .sqs-video-overlay > img, img[data-mode="cover"] {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--focal, 50% 50%);
}
img[data-src] { visibility: visible !important; }
figure.loading { opacity: 1 !important; }

/* Video embeds: plain responsive iframes */
.sqs-video-wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.sqs-video-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
.video-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 24px; padding: 40px 6vw 80px; }
.video-grid .video-item { position: relative; padding-bottom: 56.25%; height: 0; background: #000; }
.video-grid .video-item iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }

/* Mobile navigation (sidecar) */
#sidecarNav nav > div > a { display: block; }
.mobile-nav-toggle { display: none; }
.force-mobile-nav .mobile-nav-toggle { display: block; }
.force-mobile-nav .body-overlay { display: none; }
.force-mobile-nav.mobile-nav-open .body-overlay { display: block; }

/* Sticky header shown after scrolling past the banner */
.show-on-scroll-wrapper { display: none; }
@media only screen and (min-width: 641px) { .show-on-scroll-wrapper { display: block; } }

/* Contact link that replaces the Squarespace form on /connect */
.contact-email { text-align: center; padding: 20px 0; }
.contact-email a.sqs-block-button-element { display: inline-block; }
.contact-email p { margin-top: 16px; }
.contact-email a.sqs-block-button-element { border: 2px solid #201a16; color: #201a16; padding: 1.2em 2em; text-transform: uppercase; letter-spacing: 2px; font-size: 13px; text-decoration: none; }
.contact-email a.sqs-block-button-element:hover { background: #201a16; color: #fff; }

/* Videos page: grid of click-to-play YouTube thumbnails (replaces the Squarespace gallery) */
.video-grid { max-width: 1100px; margin: 0 auto; grid-template-columns: repeat(3, 1fr); gap: 20px; padding: 40px 20px 80px; }
@media (max-width: 900px) { .video-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .video-grid { grid-template-columns: 1fr; } }
.video-grid .video-item { padding-bottom: 66.666%; cursor: pointer; overflow: hidden; }
.video-grid .video-item img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.video-grid .video-item .sqs-video-icon { position: absolute; top: 50%; left: 50%; width: 64px; height: 64px; margin: -32px 0 0 -32px; border-radius: 50%; background: rgba(0,0,0,.55); }
.video-grid .video-item .sqs-video-icon:after { content: ''; position: absolute; left: 25px; top: 19px; border-style: solid; border-width: 13px 0 13px 20px; border-color: transparent transparent transparent #fff; }
.video-grid .video-item:hover .sqs-video-icon { background: rgba(0,0,0,.8); }
.video-grid .video-title { font-size: 13px; line-height: 1.4; margin: 10px 0 0; color: #333; }

/* Image blocks with a Squarespace "fade in" animation stayed invisible without Squarespace's JS */
.sqs-block[data-definition-name="website.components.imageLayout"] .image-block-outer-wrapper[class*="combination-animation-"] :is(.image-block-wrapper, .image-caption-wrapper, .image-inset, .sqs-dynamic-text-container) { opacity: 1 !important; transform: none !important; }

/* Image blocks with "dynamic" title text (collage / poster / overlap layouts): Squarespace's script
   scaled the text to the card width; use container-relative units to do the same without it. */
.sqs-block-image .image-block-v2 .image-card-wrapper { container-type: inline-size; }
.sqs-block-image .image-block-v2 .image-title-wrapper { font-size: 5.5cqw !important; }
.sqs-block-image .image-block-v2 .image-subtitle-wrapper { font-size: 3.2cqw !important; }
.sqs-block-image .image-block-v2 .sqs-cdk-dynamic-text { font-size: 100% !important; }
.sqs-block-image .image-block-v2 .image-button-wrapper { font-size: 3.2cqw !important; }
.sqs-block-image .image-block-v2 .image-button-wrapper a { font-size: inherit !important; }