/* ═══════════════════════════════════════════════════
   CASE OVERRIDES — complemento ao case.css
   Paleta: Laranja · Terracota · Bege (#F2EDE4 base)
   Este arquivo existe para garantir que blocos inline
   nos HTMLs dos cases também herdem as vars corretas,
   e para micro-ajustes que não cabem no case.css base.
═══════════════════════════════════════════════════ */

/* ── TOKENS (mirrors case.css — garante cascade em
   qualquer componente inline que use as vars) ─────── */
:root {
  --black:          #F2EDE4;
  --dark:           #EDE5D8;
  --dark-2:         #E8DDD0;
  --dark-3:         #E3D9C8;
  --card-bg:        #EAE2D4;
  --border:         rgba(180,130,80,0.15);
  --border-hov:     rgba(180,130,80,0.35);
  --accent-1:       #E66822;
  --accent-2:       #C24F31;
  --gold:           #C8921A;
  --text-primary:   #2C1A0E;
  --text-secondary: #6B4C35;
  --text-muted:     #A8896E;
}

/* ── SCROLLBAR ────────────────────────────────────── */
::selection {
  background: var(--accent-1);
  color: #fff;
}
::-webkit-scrollbar-track { background: var(--black); }
::-webkit-scrollbar-thumb {
  background: rgba(230,104,34,0.25);
  border-radius: 4px;
}

/* ── DIVIDER ──────────────────────────────────────── */
.divider {
  border: none;
  height: 1px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(230,104,34,0.25) 30%,
    rgba(194,79,49,0.2) 70%,
    transparent 100%);
  margin: 0;
}

/* ── CASE RESULT — refinamento de gradiente ───────── */
.case-result {
  background: linear-gradient(135deg,
    rgba(230,104,34,0.07) 0%,
    rgba(200,146,26,0.04) 100%);
  border: 1px solid rgba(230,104,34,0.18);
}

.case-result__label {
  color: var(--gold);
  background: rgba(200,146,26,0.08);
  border: 1px solid rgba(200,146,26,0.2);
}

/* ── CASE NAV ─────────────────────────────────────── */
.case-nav {
  background: var(--dark);
  border-top: 1px solid var(--border);
}

.case-nav__link {
  background: var(--card-bg);
  border-color: var(--border);
  color: var(--text-secondary);
}

.case-nav__link:hover {
  border-color: var(--accent-1);
  color: var(--accent-1);
  background: rgba(230,104,34,0.06);
}

/* ── ETAPA — acento lateral laranja ──────────────── */
.etapa__header {
  border-left: 2px solid var(--accent-1);
  background: rgba(230,104,34,0.04);
}

.etapa__block h4 {
  color: var(--accent-2);
}
.etapa__block h4 i {
  color: var(--accent-2);
}