:root {
  --brand-amber: #ff7e00;
  --brand-obsidian: #0b0d0e;
  --brand-off-white: #e6edf3;
  --brand-slate: #21262d;
  --brand-muted: #a8b3bd;
  --brand-surface: #121619;
  --brand-amber-soft: #ffb15c;

  --ink: var(--brand-off-white);
  --muted: var(--brand-muted);
  --paper: var(--brand-obsidian);
  --card: var(--brand-surface);
  --green: var(--brand-amber);
  --mint: #291a0c;
  --line: var(--brand-slate);
  --gold: var(--brand-amber);
  --shadow: 0 18px 50px rgba(0, 0, 0, 0.35);
}

.site-header {
  background: rgba(11, 13, 14, 0.9);
  border-color: var(--brand-slate);
}

.button {
  background: var(--brand-amber);
  color: var(--brand-obsidian);
}

.button:hover {
  background: var(--brand-amber-soft);
}

.hero-panel {
  background: var(--brand-amber);
  color: var(--brand-obsidian);
  transform: none;
}

.hero-panel .panel-label,
.hero-panel li span {
  color: var(--brand-obsidian);
}

.hero-panel li {
  border-top-color: rgba(11, 13, 14, 0.24);
}

.work-section {
  background: #070809;
  color: var(--brand-off-white);
}

.work-section .eyebrow,
.tag {
  color: var(--brand-amber-soft) !important;
}

.project {
  border-color: var(--brand-slate);
  background: rgba(255, 255, 255, 0.025);
}

.lawn-visual {
  background: linear-gradient(135deg, #ff7e00, #ffc27d);
}

.mini-browser {
  background: var(--brand-surface);
  color: var(--brand-off-white);
}

.mini-browser span {
  background: #53606c;
}

.mini-browser strong {
  color: var(--brand-amber);
}

.automation-visual {
  background: #101418;
  border: 1px solid var(--brand-slate);
}

.dashboard-visual {
  background: linear-gradient(150deg, #3d250f, #ff7e00);
}

.dash {
  background: #111519;
}

.dash span {
  background: var(--brand-amber);
}

.dash b {
  background: #39414a;
}

.contact {
  background: #17120e;
  border: 1px solid #4b2a0b;
}

.skip-link {
  background: var(--brand-off-white);
  color: var(--brand-obsidian);
  border-color: var(--brand-amber);
}

::selection {
  background: var(--brand-amber);
  color: var(--brand-obsidian);
}