/* PilotTrain Showreel: the block and its opening line, as the shortcode prints them.
   Everything the script builds is styled by showreel-reel.css, which the script loads
   before it builds, so no remove-unused-CSS tool can strip those rules.
   Colours, type and the 1200 px content column follow the PilotTrain sales page. */
.ptsr {
  --ptsr-h: 80;
  --ptsr-ink: #00172a;
  --ptsr-text: #1b2733;
  --ptsr-muted: #5b6b7c;
  --ptsr-line: #e3e8ee;
  --ptsr-blue: #0a66c2;
  --ptsr-good: #15803d;
  --ptsr-gold: #ffc94d;
  --ptsr-pad-x: max(20px, calc(50% - 600px));
  --ptsr-pad-y: clamp(20px, 4.5vh, 60px);
  position: relative;
  box-sizing: border-box;
  width: 100%;
  height: calc(var(--ptsr-h) * 1vh);
  height: calc(var(--ptsr-h) * 1svh);
  min-height: 460px;
  max-height: 1100px;
  margin: 0;
  padding: var(--ptsr-pad-y) var(--ptsr-pad-x);
  overflow: hidden;
  background: #fff;
  color: var(--ptsr-ink);
  /* Inter on the sales site, Inter Display on the app: whichever the theme loads. */
  font-family: Inter, 'Inter Display', 'Inter Tight', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  isolation: isolate;
  user-select: none;
  -webkit-user-select: none;
}

/* Until the script has built the reel: the opening line on its own. */
.ptsr__fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  height: 100%;
  margin: 0;
  font-size: clamp(36px, 6.4vw, 96px);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1.02;
  text-align: center;
  text-wrap: balance;
  color: var(--ptsr-ink);
}

@media (max-width: 600px) {
  .ptsr { min-height: 420px; }
}
