/* Variant: Sunset — Cobalt's layout, warm: a dusk gradient hero panel, deep rose accent.
   Shared markup; overrides assets/site.css. Light only. */

:root {
  --bg: #fffaf6;
  --surface: #ffffff;
  --muted: #fbefe8;
  --ink: #2a1520;
  --ink-2: #6b5560;
  --line: #f0e1d9;
  --accent: #c2255c;
  --accent-ink: #ffffff;
  --accent-soft: #fde4ec;
  --green-soft: #fde9d9;
  --amber-soft: #fff0d1;
  --night: #2a1424;
  --night-2: #3a1d32;
  --night-ink-2: #d4b8c6;

  --ui-accent: #e8590c;
  --ui-img: #fff0e6;
  --ui-tint-a: #ffe0d1;
  --ui-tint-b: #fde1ec;
  --ui-tint-c: #fff0c7;
  --stage-ink: #ffffff;

  color-scheme: light;
}

.stage {
  background-color: #e0457b;
  background-image:
    radial-gradient(rgba(255, 255, 255, 0.16) 1px, transparent 1px),
    linear-gradient(135deg, #ffb347 0%, #ff7a59 32%, #e0457b 64%, #7b4bd8 100%);
  background-size: 22px 22px, auto;
  box-shadow: 0 40px 80px -40px rgba(224, 69, 123, 0.55);
}
.ui { box-shadow: 0 20px 40px -20px rgba(80, 20, 50, 0.45); }

.hero__title { letter-spacing: -0.055em; }
.tile--dark .focus strong { color: #ffb08a; }
.ticks li::before { border-color: #e8590c; }
.steps li::before { background: linear-gradient(135deg, #ff8a4c, #e0457b); }
.faq details[open] summary::after { background: linear-gradient(135deg, #ff8a4c, #e0457b); }
.product__visual--water { background: #ffe9dc; }
.product__visual--jobs { background: #fde1ec; }
.product__visual--food { background: #fff0c7; }
.product__link { color: var(--accent); }
.phscale__ticks { color: var(--ink-2); }
.section--contact { background: linear-gradient(160deg, #3a1d32, #2a1424 60%); }