/* Text version of the /order/cleaning/ walk-through (order/cleaning/text/…), on top of css/text.css
 * and css/order-text.css: the same page in the cleaning site's light mint, with the sticky
 * "open the animated version" button in its teal. */

:root {
  --bg: #e4f3ee;
  --bg-2: #f4fbf8;
  --ink: #0f2a2e;
  --ink-2: #3c5a5e;
  --ink-3: #6b8487;
  --line: rgba(15, 42, 46, 0.12);
  --line-2: rgba(15, 42, 46, 0.22);
  --brand: #0e9f97;
  --brand-ink: #0b7f79;
  --brand-soft: rgba(14, 159, 151, 0.12);
  color-scheme: light;
}
a:hover { color: #075e5a; }
b { color: var(--ink); }
.aside { border-color: rgba(14, 159, 151, 0.35); background: rgba(255, 255, 255, 0.7); }
h4 { color: var(--brand-ink); }
.steps > li::marker { color: var(--brand); }
.clk { display: inline-block; margin-right: 4px; padding: 0 8px; border-radius: 99px; background: var(--brand-soft); color: var(--brand-ink); font: 700 0.8em/1.7 ui-monospace, Menlo, Consolas, monospace; vertical-align: 0.1em; }
.eq { font-family: ui-monospace, Menlo, Consolas, monospace; }
.quote { padding-left: 14px; border-left: 3px solid var(--brand); color: var(--ink-2); }

.open-anim { background: linear-gradient(100deg, #0e9f97 0%, #14b8a6 60%, #5eead4 100%); box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.35) inset, 0 14px 40px -10px rgba(14, 159, 151, 0.6), 0 4px 18px rgba(15, 42, 46, 0.2); color: #fff; }
.open-anim:hover { color: #fff; }
.oa-t b { color: #fff; }
.oa-play { background: #fff; }
.oa-play::after { border-color: transparent transparent transparent #0e9f97; }
.oa-play::before { border-color: rgba(255, 255, 255, 0.6); }