/* slides/slide.css — base for any 1920x1080 PTR slide.
   Each slide HTML is a full-bleed 16:9 frame that scales via JS to fit viewport. */

@import url("../colors_and_type.css");

html, body { margin: 0; padding: 0; background: #0a0a0a; overflow: hidden; }

.stage {
  position: fixed; inset: 0;
  overflow: hidden;
}

.slide {
  position: absolute;
  top: 0; left: 0;
  width: 1920px;
  height: 1080px;
  background: var(--ptr-white);
  color: var(--ptr-black);
  overflow: hidden;
  transform-origin: 0 0;       /* scaler combines translate + scale from top-left */
  font-family: var(--font-sans);
}

.slide--green { background: var(--ptr-green); color: var(--ptr-white); }
.slide--ink { background: var(--ptr-ink); color: var(--ptr-white); }
.slide--orange { background: var(--ptr-orange); color: var(--ptr-black); }
.slide--bone { background: var(--ptr-bone); }
.slide--stone { background: var(--ptr-stone); color: var(--ptr-white); }

.slide__pad {
  position: absolute;
  inset: 36px;
}

.headline {
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: 96px;
  line-height: 98px;
  letter-spacing: -0.01em;
  margin: 0;
}

.headline--green { color: var(--ptr-green); }
.headline--white { color: var(--ptr-white); }

.lead-42 {
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: 42px;
  line-height: 49px;
  margin: 0;
}

.lead-28 {
  font-family: var(--font-sans);
  font-size: 28px;
  line-height: 34px;
  letter-spacing: 0.01em;
  margin: 0;
}

.deck-footer {
  position: absolute;
  left: 36px;
  right: 36px;
  bottom: 36px;
  height: 41px;
  border-top: 1px solid currentColor;
  padding-top: 16px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: 20px;
  line-height: 24px;
}