/* ─────────────────────────────
   Unstable Unicorns – page theme
   ───────────────────────────── */

/* Rainbow background */
:root{
  --bg: linear-gradient(
    135deg,
    #ff5f6d 0%,
    #ffc371 20%,
    #f7ff00 35%,
    #7cff6b 50%,
    #4facfe 65%,
    #a18cd1 80%,
    #fbc2eb 100%
  );
}

/* Ensure gradient fills the viewport smoothly */
html,
body{
  min-height: 100%;
}

body{
  background: var(--bg);
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;

  /* Default text colour for anything NOT on a card */
  color: #1b1e28;
}

/* ─────────────────────────────
   Cards: dark, readable surfaces
   ───────────────────────────── */

.card{
  background: rgba(21,25,37,0.92);
  border-color: rgba(39,48,71,0.85);

  /* Force light text inside cards */
  color: var(--text);
}

/* Definition list labels inside cards */
.card .dl dt{
  color: var(--muted);
}

/* Links: dark outside cards, light inside cards */
a{
  color: #1b1e28;
}

.card a{
  color: var(--link);
}

/* ─────────────────────────────
   Header / footer / misc text
   ───────────────────────────── */

/* Header should not introduce its own colour band */
.site-header{
  background: linear-gradient(
    180deg,
    rgba(0,0,0,0.35) 0%,
    rgba(0,0,0,0) 100%
  );
}

.site-header h1,
.site-header .subtitle{
  color: #1b1e28;
}

/* Breadcrumbs sit on the background */
.breadcrumb,
.breadcrumb a{
  color: #1b1e28;
}

/* Footer should stay transparent on this page */
.site-footer{
  background: transparent;
}

.site-footer,
.site-footer a{
  color: #1b1e28;
}