@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

* { margin: 0; padding: 0; box-sizing: border-box; font-family: "Poppins", sans-serif; }

html, body { height: 100%; }

body {
  /* You can keep your yellow, or make transparent if you prefer it to blend with Wix */
  background: #a10df2;              /* set to transparent if you want */
  display: grid;
  place-content: center;
  overflow: hidden;                  /* prevents double scrollbars in iframe */
}

/* Flipbook frame (JS will set exact width/height responsively) */
.flipbook {
  width: 1000px;                     /* fallback before JS runs */
  height: 600px;                     /* fallback before JS runs */
  box-shadow: 0 0 40px rgba(0,0,0,.3);
  background: #000;                  /* hides any seam between pages */
}

/* Full-bleed pages */
.flipbook > div { width: 100%; height: 100%; overflow: hidden; }
.flipbook img   { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Placeholder (first page) is never shown, but keep white just in case */
.placeholder { background: #fff; }

/* Small devices: soften the shadow so it looks nicer in tight space */
@media (max-width: 480px) {
  .flipbook { box-shadow: 0 0 24px rgba(0,0,0,.25); }
}