/*
 * Prism static-site fixes (CSS)
 * -----------------------------
 * Squarespace's parallax/banner background images had their width, height and
 * transform baked to fixed PIXEL values by the platform JavaScript at export
 * time. With that JS runtime removed, those fixed sizes don't scale, so on a
 * viewport wider (or taller) than the baked size the image no longer covers its
 * container and the section's background color shows through (typically a blank
 * strip on the right).
 *
 * Force these banner/background images to cover their container responsively at
 * any viewport size. Scoped to Squarespace's content-fill background wrappers so
 * ordinary inline/content images are unaffected.
 */
.content-fill > img,
.image-container.content-fill > img,
.parallax-images .image-container > img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: 50% 50% !important;
  transform: none !important;
  top: 0 !important;
  left: 0 !important;
}

/*
 * Banner pages with no main image (the legal pages: privacy, sms-terms,
 * messaging-privacy). The transparent site header is absolutely positioned
 * over the top of the banner (~170px tall, incl. the announcement bar).
 * Squarespace's default `.no-main-image` banner only reserves 80px of top
 * padding, so the page title renders partly *under* the header and its top
 * is clipped. The platform JS normally sets 250px here (the same value it
 * bakes inline on the has-main-image pages), which is what the live site
 * renders; match it. Scoped to `.no-main-image`, which only these
 * banner-image-less pages use, so every other page is unaffected.
 */
.title-desc-wrapper.no-main-image {
  padding-top: 250px;
}

/*
 * Site-wide footer legal links — the SMS/A2P compliance pages (Privacy
 * Policy, Messaging Privacy, SMS Terms), wired into every page footer.
 * The source site leaves these unlinked (direct-URL only); we surface them
 * site-wide so they're reachable and carrier-registration-friendly. Styled
 * to sit quietly on the footer's orange band, matching its white logo/social
 * treatment. Links are extensionless (/privacy, /messaging-privacy,
 * /sms-terms) — production hosting must map these to the .html files.
 */
.prism-legal-links {
  margin: 1.5em auto;
  padding: 0 1em 2em;
  text-align: center;
  font-family: 'proxima-nova', 'Helvetica Neue', Arial, sans-serif;
  font-size: 0.8rem;
  letter-spacing: 0.03em;
}
.prism-legal-links a {
  color: #fff;
  opacity: 0.85;
  text-decoration: none;
  white-space: nowrap;
}
.prism-legal-links a:hover,
.prism-legal-links a:focus {
  opacity: 1;
  text-decoration: underline;
}
.prism-legal-links a:not(:first-child) {
  margin-left: 0.9em;
  padding-left: 0.9em;
  border-left: 1px solid rgba(255, 255, 255, 0.4);
}

/*
 * Homepage parallax hero (index.html). The first #parallax-images container
 * is the video-background slot: its inner .content-fill wrapper is only sized
 * by Squarespace's video/parallax JS. Without it the wrapper is static with no
 * height, so the fallback hero image collapses to its natural aspect (about a
 * 220px band on phones) and the rest of the 100vh hero shows the background
 * color. Make the wrapper fill its fixed-position container so the image
 * covers the hero at every viewport, like the other parallax sections whose
 * <img> sits directly in the container.
 */
#parallax-images .image-container > .content-fill {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

/*
 * Responsive banner title padding. Squarespace's JS sets the banner title
 * wrapper's padding-top from the rendered header height, so it shrinks on
 * narrower viewports (measured on the live site: 250px at >=1200px, ~220px
 * around 900-1024px, ~178px at 640-768px, ~150px on phones). The static export
 * bakes the desktop 250px inline; approximate the live curve with breakpoints.
 */
@media (max-width: 1100px) {
  .title-desc-wrapper.has-main-image,
  .title-desc-wrapper.no-main-image { padding-top: 220px !important; }
}
@media (max-width: 800px) {
  .title-desc-wrapper.has-main-image,
  .title-desc-wrapper.no-main-image { padding-top: 178px !important; }
}
@media (max-width: 640px) {
  .title-desc-wrapper.has-main-image,
  .title-desc-wrapper.no-main-image { padding-top: 150px !important; }
}
