/* ================================
   Guaranteed-working scroll layout
   ================================ */

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
}

/* IMPORTANT: allow native vertical scroll */
body {
  font-family: system-ui, sans-serif;
  overflow-y: auto;
  overflow-x: hidden;
  background: #0b0f17;
  color: #e6e8ec;
}

/* This creates vertical scroll length */
.ud-vertical-space {
  height: 400vh;
}

/* Fixed viewport */
.ud-viewport {
  position: fixed;
  inset: 0;
  overflow: hidden;
}

/* Horizontal track */
.ud-track {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  height: 100vh;
}

/* Scenes */
.ud-scene {
  min-width: 120vw;
  height: 100vh;
  display: flex;
  align-items: center;
  padding: 10vw;
}

.ud-content {
  max-width: 480px;
}

h1, h2 {
  margin: 0 0 12px;
  font-weight: 600;
}

p {
  margin: 0;
  opacity: 0.7;
}

/* Placeholder scene colours */
.scene-barn    { background: linear-gradient(120deg, #0b0f17, #1a2444); }
.scene-fields  { background: linear-gradient(120deg, #0b0f17, #123020); }
.scene-orchard { background: linear-gradient(120deg, #0b0f17, #302018); }
.scene-pond    { background: linear-gradient(120deg, #0b0f17, #182a30); }