/* ============================================================
   AXOS Index — V1: base comparativa de empresas
   Design system: styles.css (mesma paleta / tipografia / grid).
   Index / publicação / relatório / instrumento de pesquisa —
   não dashboard. Muito espaço negativo, linhas delicadas,
   dados pequenos, cor parcimoniosa.
   ============================================================ */

:root{
  --ax-container: 1180px;
  --ax-pad: 40px;
  --ax-hair: 1px solid var(--line);
  --ax-hair-strong: 1px solid var(--line-strong);
  --ax-ease: cubic-bezier(.22,.8,.28,1);
}
@media (max-width:1000px){ :root{ --ax-pad: 28px; } }
@media (max-width:600px){ :root{ --ax-pad: 20px; } }

.ax-wrap{ max-width:var(--ax-container); margin:0 auto; padding-inline:var(--ax-pad); }
body.axos-index{ background:var(--paper); }
.ax [hidden]{ display:none !important; }

/* ---------- primitivas ---------- */
.ax-kicker{
  display:flex; align-items:center; gap:12px; margin:0;
  font-family:'Instrument Sans', sans-serif; font-size:11px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--ink-soft);
}
.ax-devflag{
  font-size:9.5px; letter-spacing:.14em; color:var(--muted);
  border:var(--ax-hair); border-radius:2px; padding:2px 7px 1px;
}
.ax-head{
  font-family:'Instrument Sans', sans-serif; font-weight:500; text-transform:uppercase;
  letter-spacing:-.01em; line-height:1.04; color:var(--ink);
  font-size:clamp(24px,3.4vw,38px); margin:16px 0 0;
}
.ax-kv{
  font-family:'Instrument Sans', sans-serif; font-size:10.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted);
}
.ax-num{ font-variant-numeric:tabular-nums; }

/* ============================================================
   ABERTURA
   ============================================================ */
.ax-intro{ padding:72px 0 40px; }
.ax-intro-title{
  font-family:'Instrument Sans', sans-serif; font-weight:600; text-transform:uppercase;
  letter-spacing:-.02em; line-height:1; color:var(--ink);
  font-size:clamp(34px,5.4vw,64px); margin:20px 0 0;
}
.ax-intro-title .ax-l1, .ax-intro-title .ax-l2{ display:block; }
.ax-intro-title .ax-num{ display:inline; font-weight:400; letter-spacing:-.04em; }
.ax-intro-sub{
  font-family:'Instrument Sans', sans-serif; font-size:15px; line-height:1.55;
  color:var(--ink-soft); margin:24px 0 0; max-width:52ch;
}
.ax-intro-meta{
  margin:20px 0 0; font-family:'Instrument Sans', sans-serif; font-size:11px;
  letter-spacing:.06em; color:var(--muted); text-transform:lowercase;
  font-variant-numeric:tabular-nums;
}

/* ============================================================
   INDEX — conteúdo principal
   ============================================================ */
.ax-index{ padding:44px 0 112px; border-top:var(--ax-hair); }
.ax-index-head{ margin-bottom:32px; }
.ax-index-head .ax-kicker{ margin-bottom:0; }

/* ---------- toolbar editorial — uma linha, com ícones ---------- */
.ax-toolbar{
  display:flex; align-items:center; gap:16px 24px; flex-wrap:wrap;
  padding-bottom:16px; border-bottom:var(--ax-hair-strong); margin-bottom:8px;
}

/* Capacidade: navegação horizontal inspirada no Pulse (símbolos oficiais) */
.ax-cap-strip{ display:flex; align-items:center; gap:2px; flex-wrap:wrap; }
.ax-cap-chip{
  appearance:none; background:none; border:none; cursor:pointer;
  font-family:'Instrument Sans', sans-serif; font-size:10.5px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--muted); padding:6px 9px; border-radius:2px;
  transition:color .15s var(--ax-ease), background .15s var(--ax-ease);
}
.ax-cap-chip:hover{ color:var(--ink); }
.ax-cap-chip.is-active{ color:var(--ink); background:var(--card); }
.ax-cap-chip:focus-visible{ outline:2px solid var(--ink); outline-offset:1px; }
.ax-cap-chip--icon{ padding:5px; line-height:0; }
.ax-cap-chip--icon svg{ width:20px; height:20px; display:block; }
.ax-cap-chip--icon svg [stroke]{ stroke:currentColor; }
.ax-cap-chip--icon svg [fill]:not([fill="none"]){ fill:currentColor; }
.ax-cap-chip--icon{ color:var(--muted); }
.ax-cap-chip--icon:hover{ color:var(--ink-soft); }
.ax-cap-chip--icon.is-active{ background:var(--card); }

/* Estágio / Setor / Modelo: pills com menu (não select de form) */
.ax-fpills{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.ax-fpill-wrap{ position:relative; }
.ax-fpill{
  appearance:none; background:none; cursor:pointer;
  display:inline-flex; align-items:center; gap:7px;
  border:1px solid var(--line-strong); border-radius:20px; padding:6px 12px 6px 10px;
  font-family:'Instrument Sans', sans-serif; font-size:11px; letter-spacing:.04em;
  text-transform:uppercase; color:var(--ink-soft);
  transition:border-color .15s var(--ax-ease), color .15s var(--ax-ease);
}
.ax-fpill:hover{ border-color:var(--ink); color:var(--ink); }
.ax-fpill:focus-visible{ outline:2px solid var(--ink); outline-offset:2px; }
.ax-fpill-ico{ line-height:0; color:var(--muted); }
.ax-fpill-ico svg{ width:13px; height:13px; display:block; }
.ax-fpill.is-active{ border-color:var(--ink); color:var(--ink); background:var(--ink); }
.ax-fpill.is-active .ax-fpill-ico{ color:var(--paper); }
.ax-fpill.is-active .ax-fpill-txt{ color:var(--paper); }
.ax-fpill-val{ font-variant-numeric:tabular-nums; letter-spacing:0; text-transform:none; }
.ax-fpill.is-active .ax-fpill-val{ color:var(--paper); }
.ax-fpill.is-active .ax-fpill-val::before{ content:'· '; }

.ax-fmenu{
  position:absolute; top:calc(100% + 6px); left:0; z-index:20; min-width:150px;
  background:var(--paper); border:1px solid var(--line-strong); border-radius:6px;
  padding:5px; box-shadow:0 18px 40px -22px rgba(38,44,46,.5);
  display:flex; flex-direction:column;
}
.ax-fmenu-opt{
  appearance:none; background:none; border:none; cursor:pointer; text-align:left;
  font-family:'Instrument Sans', sans-serif; font-size:12.5px; color:var(--ink);
  padding:8px 10px; border-radius:3px;
}
.ax-fmenu-opt:hover{ background:var(--card); }
.ax-fmenu-opt.is-active{ color:var(--ink); font-weight:500; }
.ax-fmenu-opt.is-active::after{ content:' ·'; color:var(--gold); }

.ax-clear{
  appearance:none; background:none; border:none; cursor:pointer; padding:0 0 2px;
  font-family:'Instrument Sans', sans-serif; font-size:10.5px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--ink-soft); border-bottom:1px solid var(--line-strong);
}
.ax-clear:hover{ color:var(--ink); }

.ax-viewtoggle{ display:flex; align-items:center; gap:0; margin-left:auto; }
.ax-viewtoggle button{
  appearance:none; background:none; border:none; cursor:pointer; padding:2px 12px 4px;
  font-family:'Instrument Sans', sans-serif; font-size:11px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--muted); border-bottom:1px solid var(--line);
  transition:color .15s var(--ax-ease), border-color .15s var(--ax-ease);
}
.ax-viewtoggle button:first-child{ padding-left:0; }
.ax-viewtoggle button:hover{ color:var(--ink); }
.ax-viewtoggle button[aria-pressed="true"]{ color:var(--ink); border-bottom-color:var(--ink); }
.ax-viewtoggle button:focus-visible{ outline:2px solid var(--ink); outline-offset:2px; }

.ax-view-meta{
  margin:14px 0 0; font-family:'Instrument Sans', sans-serif; font-size:10.5px;
  letter-spacing:.1em; text-transform:uppercase; color:var(--muted); font-variant-numeric:tabular-nums;
}
.ax-view-empty{ padding:56px 0; text-align:center; color:var(--muted); font-size:13px; }
.ax-clear-inline{
  appearance:none; background:none; border:none; cursor:pointer; padding:0;
  font:inherit; color:var(--gold); text-transform:none; letter-spacing:0;
  border-bottom:1px solid var(--line-strong);
}
.ax-clear-inline:hover{ border-color:var(--gold); }

/* ============================================================
   LISTA (default)
   ============================================================ */
.ax-list{ list-style:none; margin:0; padding:0; }
.ax-list li{ list-style:none; }
.ax-row{
  display:grid;
  grid-template-columns:38px minmax(0,1fr) minmax(0,auto) 64px;
  align-items:baseline; column-gap:20px; width:100%;
  text-align:left; color:inherit; background:transparent; border:none;
  border-bottom:var(--ax-hair);
  padding:18px 6px 18px 0; cursor:pointer; position:relative;
  font-family:'Instrument Sans', sans-serif;
  transition:background .14s var(--ax-ease);
}
.ax-row:hover, .ax-row:focus-visible{ background:var(--card); }
.ax-row:focus-visible{ outline:none; }
.ax-row:hover::before, .ax-row:focus-visible::before{
  content:''; position:absolute; left:calc(var(--ax-pad) * -1); top:0; bottom:-1px; width:2px; background:var(--ink);
}
.ax-row-rank{ font-size:11px; color:var(--muted); font-variant-numeric:tabular-nums; }
.ax-row-name{
  font-size:15.5px; font-weight:500; text-transform:uppercase; letter-spacing:-.005em; color:var(--ink);
}
.ax-row-meta{
  font-size:11.5px; color:var(--ink-soft); letter-spacing:.01em; text-align:right;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.ax-row-score{
  font-size:22px; font-weight:400; color:var(--ink); letter-spacing:-.03em;
  font-variant-numeric:tabular-nums; text-align:right;
}

@media (max-width:640px){
  .ax-row{
    grid-template-columns:26px minmax(0,1fr) auto;
    grid-template-areas:"rank name score" "rank meta score";
    row-gap:3px; column-gap:12px; padding:15px 0;
  }
  .ax-row-rank{ grid-area:rank; align-self:center; }
  .ax-row-name{ grid-area:name; }
  .ax-row-meta{ grid-area:meta; text-align:left; }
  .ax-row-score{ grid-area:score; align-self:center; font-size:20px; }
}

/* ============================================================
   RADAR — todas as empresas sobrepostas num só instrumento
   ============================================================ */
.ax-radar-all{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(220px,.5fr);
  gap:clamp(24px,4vw,56px); align-items:center; margin-top:12px;
}
.ax-radar-all-viz{ width:100%; max-width:560px; margin-inline:auto; aspect-ratio:1/1; }
.ax-radar-all-viz svg{ width:100%; height:100%; display:block; overflow:visible; }
.ax-radar-polys polygon{ transition:stroke .14s var(--ax-ease), stroke-width .14s var(--ax-ease); }
.ax-radar-dot{ transition:opacity .14s var(--ax-ease); }

.ax-radar-legend{ list-style:none; margin:0; padding:0; }
.ax-radar-legend li{ list-style:none; }
.ax-rleg{
  appearance:none; background:none; border:none; cursor:pointer; width:100%; text-align:left;
  display:grid; grid-template-columns:26px minmax(0,1fr) auto; align-items:baseline; gap:10px;
  padding:9px 4px; border-top:var(--ax-hair);
  font-family:'Instrument Sans', sans-serif; color:inherit;
  transition:background .14s var(--ax-ease);
}
.ax-radar-legend li:last-child .ax-rleg{ border-bottom:var(--ax-hair); }
.ax-rleg:hover, .ax-rleg:focus-visible, .ax-rleg.is-lit{ background:var(--card); }
.ax-rleg:focus-visible{ outline:none; }
.ax-rleg-rank{ font-size:10px; color:var(--muted); font-variant-numeric:tabular-nums; }
.ax-rleg-name{ font-size:12.5px; font-weight:500; text-transform:uppercase; letter-spacing:-.005em; color:var(--ink); }
.ax-rleg-score{ font-size:14px; color:var(--ink-soft); font-variant-numeric:tabular-nums; letter-spacing:-.02em; }

@media (max-width:820px){
  .ax-radar-all{ grid-template-columns:1fr; gap:16px; }
  .ax-radar-all-viz{ max-width:440px; }
}

/* ============================================================
   EMPRESA — visão individual
   ============================================================ */
.ax-company{ padding:56px 0 112px; }
.ax-back{
  display:inline-block; font-family:'Instrument Sans', sans-serif; font-size:11px;
  letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft);
  text-decoration:none; margin-bottom:40px;
}
.ax-back:hover{ color:var(--ink); }

.ax-company-head{
  display:flex; align-items:flex-start; justify-content:space-between; gap:32px;
  padding-bottom:36px; border-bottom:var(--ax-hair);
}
.ax-company-name{
  font-family:'Instrument Sans', sans-serif; font-weight:600; text-transform:uppercase;
  letter-spacing:-.015em; line-height:1; color:var(--ink);
  font-size:clamp(32px,4.6vw,60px); margin:14px 0 0;
}
.ax-company-meta{
  font-family:'Instrument Sans', sans-serif; font-size:13px; color:var(--ink-soft);
  letter-spacing:.01em; margin:16px 0 0;
}
.ax-co-site{
  display:inline-block; font-family:'Instrument Sans', sans-serif; font-size:12.5px;
  color:var(--gold); text-decoration:none; border-bottom:1px solid var(--line-strong);
  margin:12px 0 0;
}
.ax-co-site:hover{ border-color:var(--gold); }
.ax-company-score{ flex-shrink:0; text-align:right; }
.ax-company-score .ax-kv{ display:block; margin-bottom:10px; }
.ax-company-score b{
  font-family:'Instrument Sans', sans-serif; font-weight:400; font-size:clamp(40px,5vw,64px);
  line-height:.85; letter-spacing:-.05em; color:var(--ink); font-variant-numeric:tabular-nums;
}

.ax-company-grid{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.72fr);
  gap:clamp(32px,5vw,64px); align-items:center; padding:44px 0 8px;
}
.ax-company-viz{ width:100%; max-width:500px; margin-inline:auto; aspect-ratio:1/1; }
.ax-company-viz svg{ width:100%; height:100%; display:block; overflow:visible; }

.ax-cap-panel{ align-self:start; }
.ax-cap-caption{
  font-family:'Instrument Sans', sans-serif; font-size:10px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--muted); margin:0 0 6px;
}
.ax-cap-list{ list-style:none; margin:0; padding:0; }
.ax-cap-row{
  display:grid; grid-template-columns:1fr auto; align-items:baseline; gap:16px;
  padding:12px 0; border-top:var(--ax-hair);
  font-family:'Instrument Sans', sans-serif;
}
.ax-cap-row:last-child{ border-bottom:var(--ax-hair); }
.ax-cap-name{
  font-size:12.5px; letter-spacing:.02em; text-transform:uppercase; color:var(--ink);
  display:flex; align-items:center; gap:10px;
}
.ax-cap-dot{ width:7px; height:7px; border-radius:50%; flex-shrink:0; }
.ax-cap-val{ font-size:15px; color:var(--ink-soft); font-variant-numeric:tabular-nums; letter-spacing:-.02em; }
.ax-cap-mark{ font-size:9px; margin-right:7px; vertical-align:1px; }
.ax-cap-mark.is-up{ color:#6E8B6A; }
.ax-cap-mark.is-down{ color:#B2745B; }
.ax-cap-mark.is-flat{ color:var(--muted); }

@media (max-width:820px){
  .ax-company-head{ flex-direction:column; gap:20px; align-items:flex-start; }
  .ax-company-score{ text-align:left; }
  .ax-company-grid{ grid-template-columns:1fr; gap:24px; }
  .ax-company-viz{ order:-1; max-width:420px; }
}

/* ---------- slots estruturais (AX-14) ---------- */
.ax-company-slots{ margin-top:64px; }
.ax-slot{ padding:24px 0; border-top:var(--ax-hair); }
.ax-slot h3{
  font-family:'Instrument Sans', sans-serif; font-weight:600; font-size:10.5px;
  letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:12px;
}
.ax-slot p{ font-family:'Instrument Sans', sans-serif; font-size:13px; line-height:1.6; color:var(--ink-soft); margin:0; }
.ax-slot-empty{ color:var(--muted); }
.ax-slot a{ color:var(--gold); text-decoration:none; border-bottom:1px solid var(--line-strong); }
.ax-slot a:hover{ border-color:var(--gold); }

/* placeholder "coming soon" — sem conteúdo analítico, só sinaliza o que vem depois */
.ax-comingsoon{ padding:20px 0 4px; border:1px dashed var(--line-strong); border-radius:8px; text-align:center; }
.ax-comingsoon-badge{
  font-family:'Instrument Sans', sans-serif; font-weight:600; font-size:13px;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); margin:0 0 6px;
}
.ax-comingsoon-note{ font-family:'Instrument Sans', sans-serif; font-size:12px; color:var(--muted); margin:0; }

.ax-slot-meta{ margin:24px 0 0; padding-top:24px; border-top:var(--ax-hair); display:flex; flex-direction:column; gap:7px; }
.ax-meta-row{ display:flex; gap:14px; font-family:'Instrument Sans', sans-serif; }
.ax-meta-row dt{ font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); min-width:150px; padding-top:1px; }
.ax-meta-row dd{ margin:0; font-size:12.5px; color:var(--ink); }

/* ============================================================
   MOTION — contido (instrumento de pesquisa, não landing)
   ============================================================ */
@keyframes axRise{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
.ax-intro .ax-kicker{ animation:axRise .38s var(--ax-ease) both; }
.ax-intro-title{ animation:axRise .44s var(--ax-ease) .04s both; }
.ax-intro-sub{ animation:axRise .4s var(--ax-ease) .1s both; }
.ax-intro-meta{ animation:axRise .4s var(--ax-ease) .14s both; }

@media (prefers-reduced-motion: reduce){
  .ax-intro .ax-kicker, .ax-intro-title, .ax-intro-sub, .ax-intro-meta{ animation:none; }
  .ax-row, .ax-cap-chip, .ax-fpill, .ax-viewtoggle button, .ax-radar-polys polygon, .ax-radar-dot{ transition:none; }
}
