/* Media Properties, Formats & Stunts (/media-properties, 26 Oct 2026): a page only the live copy has, built in the
   /creator-ip shell (redesign/new-pages.json), so it carries that page's Webflow id and reuses its whole design:
   photo first screen, the title large in lime, the opening statement, numbered chapters with a sticky title, a centred
   finale and the FAQ. Only what differs is below. Every word is from Alistair's doc (new-pages/media-properties.html). */
@import url("/_redesign/pages/creator-ip.css");

/* first screen: the team's EDGE photo as an <img> (it paints sooner than a CSS background), edge to edge, no overlay */
html[data-wl-path="media-properties"] .section-black-blue.case-study-hero { padding: 0; }
html[data-wl-path="media-properties"] .container-case-study-hero-image.wl-mp-hero {
  max-width: none;
  height: clamp(360px, 62svh, 700px);
  overflow: hidden;
  border-radius: 0;
  box-shadow: none;
  background: #0b1638;
}
html[data-wl-path="media-properties"] .wl-mp-hero-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 38%;  /* the climbers on the tower and the city far below */
}
html[data-wl-path="media-properties"] .section-page-hero .ima-hero-intro { color: #fff; font-size: clamp(1.05rem, .95rem + .45vw, 1.35rem); font-weight: 500; }
html[data-wl-path="media-properties"] .section-page-hero .ima-hero-intro.wl-mp-with { margin-top: 10px; color: var(--wl-muted); font-size: clamp(14.5px, 14px + .2vw, 16.5px); font-weight: 400; }

/* the opening button sits under the lime-ruled paragraph, on the same right-hand column */
html[data-wl-path="media-properties"] .section-cloud .wl-ip-intro .wl-mp-cta {
  display: flex;
  justify-content: flex-start;
  max-width: 62ch;
  margin: clamp(22px, 2.6vw, 34px) 0 0 auto;
  padding-left: clamp(20px, 2.4vw, 32px);
}
html[data-wl-path="media-properties"] .wl-faq-section-1 .wl-mp-faq-cta { display: flex; justify-content: center; margin-top: clamp(28px, 3vw, 44px); }
html[data-wl-path="media-properties"] .wl-faq-section-1 .partner-button {
  min-height: 52px;
  padding: 14px 28px;
  border-color: var(--wl-lime);
  background: var(--wl-lime);
  color: var(--wl-ink);
  font-size: 15px;
}
html[data-wl-path="media-properties"] #explore { scroll-margin-top: 96px; }

@media screen and (max-width: 991px) {
  html[data-wl-path="media-properties"] .section-cloud .wl-ip-intro .wl-mp-cta { margin-left: 0; }
}
@media screen and (max-width: 767px) {
  html[data-wl-path="media-properties"] .container-case-study-hero-image.wl-mp-hero { height: clamp(280px, 46svh, 440px); }
  html[data-wl-path="media-properties"] .section-cloud .wl-ip-intro .wl-mp-cta { padding-left: 0; }
  html[data-wl-path="media-properties"] .partner-button { width: 100%; max-width: 340px; }
}