/* ============================================================
   Elevooh · Site público — fundação visual (Fase 1)
   Tokens + containers + componentes reutilizáveis (.ev-*)
   Carregar DEPOIS do <style> inline de cada página (aditivo,
   nunca substitui — evita risco de regressão nas 19 páginas
   que ainda não foram migradas).
   ============================================================ */

:root{
  --ev-brand-900:#003123;
  --ev-brand-neon:#02ff00;
  --ev-action:#0a7a08;
  --ev-action-bg-soft:#EAF7EC;
  --ev-bg:#F7F8F4;
  --ev-bg-muted:#F4F5F4;
  --ev-surface:#FFFFFF;
  --ev-text:#0F1714;
  --ev-text-secondary:#57645D;
  --ev-text-muted:#7D8B85;
  --ev-border:#E3E7E1;
  --ev-border-soft:#F0F2F0;

  --ev-ease-reveal:cubic-bezier(.2,.9,.25,1);
  --ev-ease-mech:cubic-bezier(.4,0,.2,1);
  --ev-ease-pop:cubic-bezier(.34,1.56,.64,1);
  --ev-dur-fast:200ms;
  --ev-dur-base:400ms;
  --ev-dur-reveal:700ms;
}

/* ---- containers ---- */
.ev-container-text{max-width:760px;margin:0 auto;padding-left:44px;padding-right:44px}
.ev-container-medium{max-width:1100px;margin:0 auto;padding-left:44px;padding-right:44px}
.ev-container-wide{max-width:1360px;margin:0 auto;padding-left:44px;padding-right:44px}
@media(max-width:640px){
  .ev-container-text,.ev-container-medium,.ev-container-wide{padding-left:20px;padding-right:20px}
}

/* ---- grid de 2 colunas: texto + rail funcional ---- */
.ev-split{display:grid;grid-template-columns:1fr;gap:32px;align-items:start}
@media(min-width:1024px){
  .ev-split{grid-template-columns:1fr 360px;gap:48px}
  .ev-split .ev-rail{position:sticky;top:96px}
}
@media(max-width:1023px){ .ev-split .ev-rail{order:-1} }

/* ---- diagrama de barra empilhada (construção de preço, etc.) ---- */
.ev-stackbar{display:flex;flex-direction:column;gap:10px}
.ev-stackbar-row{display:flex;align-items:center;gap:12px}
.ev-stackbar-num{width:22px;height:22px;border-radius:6px;background:var(--ev-action-bg-soft);color:var(--ev-action);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;flex:none;font-family:'Montserrat',sans-serif}
.ev-stackbar-label{font-size:12px;font-weight:700;color:var(--ev-text);flex:1;min-width:0}
.ev-stackbar-track{height:8px;border-radius:5px;background:var(--ev-bg-muted);overflow:hidden;margin-top:6px}
.ev-stackbar-fill{height:100%;border-radius:5px;background:var(--ev-brand-900);transition:width var(--ev-dur-reveal) var(--ev-ease-reveal)}

/* ---- matriz de icones sim/nao ---- */
.ev-imatrix{border:1px solid var(--ev-border);border-radius:14px;overflow:hidden;background:var(--ev-surface)}
.ev-imatrix-row{display:grid;grid-template-columns:1.2fr repeat(4,1fr);align-items:center;border-bottom:1px solid var(--ev-border-soft)}
.ev-imatrix-row:last-child{border-bottom:none}
.ev-imatrix-row.head{background:var(--ev-bg-muted);font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ev-text-muted)}
.ev-imatrix-cell{padding:12px 10px;text-align:center;font-size:13px}
.ev-imatrix-cell.attr{text-align:left;font-weight:700;color:var(--ev-text);padding-left:16px}
.ev-imatrix-yes{color:var(--ev-action);font-weight:900}
.ev-imatrix-no{color:var(--ev-text-muted);font-weight:900}

/* ---- silhuetas de escala (empena/led/outdoor/frontlight) ---- */
.ev-scale{display:flex;align-items:flex-end;justify-content:space-around;gap:18px;padding:24px 16px 0;background:var(--ev-bg-muted);border-radius:14px;border:1px solid var(--ev-border)}
.ev-scale-item{display:flex;flex-direction:column;align-items:center;gap:8px;flex:1}
.ev-scale-item svg{display:block}
.ev-scale-item .lbl{font-size:10.5px;font-weight:800;color:var(--ev-text-secondary);text-align:center;padding-bottom:14px}
.ev-scale-baseline{height:2px;background:var(--ev-border);margin:0 -16px}

/* ---- foto inset dentro de card (thumbnail contextual) ---- */
.ev-photo-inset{border-radius:10px;overflow:hidden;flex:none}
.ev-photo-inset img{display:block;width:100%;height:100%;object-fit:cover}

/* ---- slider nativo estilizado (CPM index etc.) ---- */
.ev-range{-webkit-appearance:none;appearance:none;width:100%;height:5px;border-radius:3px;background:rgba(255,255,255,.18);outline:none;cursor:pointer}
.ev-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:var(--ev-brand-neon);border:3px solid var(--ev-brand-900);cursor:pointer;transition:transform var(--ev-dur-fast) var(--ev-ease-pop)}
.ev-range::-webkit-slider-thumb:hover{transform:scale(1.15)}
.ev-range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--ev-brand-neon);border:3px solid var(--ev-brand-900);cursor:pointer}

/* ---- tag/badge (generaliza .tag.sim/.tag.nao) ---- */
.ev-badge{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:4px 10px;border-radius:100px}
.ev-badge.on{background:var(--ev-action-bg-soft);color:#0A6B2E}
.ev-badge.off{background:var(--ev-bg-muted);color:var(--ev-text-muted)}

/* ---- legenda de mapa ---- */
.ev-maplegend{display:flex;align-items:center;gap:18px;flex-wrap:wrap;font-size:12px;color:var(--ev-text-secondary)}
.ev-maplegend-item{display:flex;align-items:center;gap:7px}
.ev-maplegend-dot{width:11px;height:11px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--ev-border);flex:none}

/* ---- ranking top-N ---- */
.ev-ranking{display:flex;flex-direction:column;gap:2px}
.ev-ranking-row{display:flex;align-items:center;gap:12px;padding:10px 4px;border-bottom:1px solid var(--ev-border-soft)}
.ev-ranking-row:last-child{border-bottom:none}
.ev-ranking-pos{font-family:'Playfair Display',serif;font-style:italic;font-size:15px;color:var(--ev-action);flex:none;width:22px}
.ev-ranking-name{font-size:12.5px;font-weight:700;color:var(--ev-text);flex:1}
.ev-ranking-val{font-size:12px;font-weight:800;color:var(--ev-text-secondary);font-variant-numeric:tabular-nums}

/* ---- filtro chips ---- */
.ev-chiprow{display:flex;gap:8px;flex-wrap:wrap}
.ev-chip{border:1px solid var(--ev-border);background:var(--ev-surface);color:var(--ev-text-secondary);font-size:12px;font-weight:700;padding:7px 14px;border-radius:100px;cursor:pointer;transition:all var(--ev-dur-fast) ease;font-family:'Montserrat',sans-serif}
.ev-chip:hover{border-color:var(--ev-action)}
.ev-chip.active{background:var(--ev-brand-900);border-color:var(--ev-brand-900);color:#fff}

/* ---- stagger util: aplicado via JS (delay = min(i,8) * 60ms) ---- */
[data-rv][data-i]{transition-delay:calc(min(var(--i,0),8) * 60ms)}

@media(prefers-reduced-motion:reduce){
  .ev-stackbar-fill{transition:none}
  .ev-range::-webkit-slider-thumb{transition:none}
}
