/* About (studio): type, colours and the 3D panels. Layout is in
   layout-studio.css (generated from Wix's rules); the flip is js/studio.js.
   Values from wix-clone/capture. */
.studio-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  margin-top: calc(-1 * var(--header-h));
}
:where(.studio-main) h1 { font: 400 14px/1.3 var(--sans); margin: 0; }
:where(.studio-main) h2 { font: 400 45px/1 var(--sans); letter-spacing: -0.01em; text-transform: uppercase; margin: 0; }
:where(.studio-main) h3 { font: 400 14px/1.3 var(--sans); margin: 0; }
:where(.studio-main) p { font: 12px/1.6 var(--mono); letter-spacing: 0.05em; margin: 0; }
:where(.st-p3-list) p { line-height: 1.6; letter-spacing: -0.01em; }
.st-intro { background: var(--cream); }

.st-p3 { background: var(--yellow); }
.st-p1-img picture, .st-p1-img img, .st-p2-img picture, .st-p2-img img { display: block; width: 100%; height: 100%; }
.st-p1-img img, .st-p2-img img { object-fit: cover; }
.st-p1-img img { object-position: 54% 43%; } /* Wix focal points */
.st-p2-img img { object-position: 43% 50%; }
[data-flip] { transform-origin: 50% 50%; }

/* QA-003: on mobile the "Trusted by" section is sticky, and on Wix the footer
   sits inside the same page container, which gives the section the footer's
   height (458 px) of room to stay stuck. Same room here: a spacer as the
   last grid row of main (padding would not count: sticky stays inside the
   content box), with the footer pulled up over it. */
@media (max-width: 750px) {
  .studio-main::after { content: ""; height: 458px; }
  .studio-main + .site-footer { margin-top: -458px; }
}