/* css/snippet.css
   Base styles for all snippet pages.
   Keep this file stable; per-snippet tweaks belong in css/snippets/<slug>.css
*/

/* Snippet pages use normal document flow */
.snippet-body {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}

/* Footer wrapper follows normal flow */
.snippet-body #site-footer {
  margin-top: 2rem;
}

/* Main snippet stage does NOT force viewport height */
.snippet-stage {
  position: relative;
  flex: 0 0 auto;
  min-height: auto;
}

/* Full-bleed background image.
   Set per snippet via --snippet-bg (see per-snippet CSS).
*/
.snippet-bg {
  position: fixed;
  inset: 0;
  z-index: -3;
  pointer-events: none;

  background-image: var(--snippet-bg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Optional overlay layer (per snippet). */
.snippet-overlay {
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background: transparent;
}

/* Text block: positioned per snippet. */
.snippet-text {
  position: relative;
  max-width: 52ch;
  margin: 0 auto;

  padding: clamp(2rem, 8vh, 8rem) 1.25rem 2.5rem;
  color: var(--text);
}

.snippet-title {
  margin: 0 0 1.8rem;
  font-size: 1.35rem;
  font-weight: 600;
  letter-spacing: var(--tracking);
}

.snippet-poem {
  font-size: 0.98rem;
  opacity: 0.95;
}

.snippet-poem p {
  line-height: 1.6;
  margin: 0 0 2.0rem;
}

/* Subtle snippet signature */
.snippet-signature {
  margin-top: 2.5rem;
  font-size: 0.8rem;
  letter-spacing: 0.14em;
  opacity: 0.45;

  color: var(--text);
  text-align: left;
}