/* ─────────────────────────────────────────────────────────────────────────
   Spotty — układ strony głównej Unity (styles.css + pages.css), własne
   kolory z brandbooka Spotty: Primary Violet #7C3AED, Secondary Magenta
   #D6409F, Brand Deep #250A45, plus cyjan z gradientu ikony.
   Tak jak w Unity: płaskie bloki koloru, bez gradientów.
   ───────────────────────────────────────────────────────────────────────── */

:root {
  --ink: #1c0d33;
  --paper: #fbf9ff;
  --cream: #ece4fb;
  --rose: #7c3aed;
  --gold: #b8237f;
  --green: #250a45;
  --orange: #ff6100;
  --cyan: #19d3e6;
  --line: rgba(28, 13, 51, 0.16);
}

.wordmark { letter-spacing: .02em; }
.wordmark-mark, .rose-image, .footer-rose { background-image: url("img/spotty-mark.png"); }
.site-header::before { background: rgba(251, 249, 255, .8); }

/* hero: królik w orbitach zamiast róży */
.orbit-one { border-color: rgba(124, 58, 237, .45); }
.orbit-two { border-color: rgba(214, 64, 159, .5); }

.impact { background: var(--green); }
.impact-item > span { color: var(--cyan); }

.symbol-rose::after { border-color: var(--rose); }
.symbol-rose.is-spotty { background-image: url("img/spotty-mark.png"); }
.symbol--unity .symbol-rose { background-image: url("../tudor-rose.png"); }

.schools--magenta { background: var(--gold); }
.schools--magenta .schools-list span:hover { color: var(--gold); }

.pro { background: var(--rose); }
.pro .model-number { color: #ffd0f0; }

.footer-rose { bottom: -230px; right: 4%; transform: rotate(-8deg); }

@media (max-width: 760px) {
  .footer-rose { bottom: -170px; height: 420px; right: -80px; width: 420px; }
}