/* ADA8 · Diagnóstico de Maturidade em IA. Complementa ferramentas.css e roi-dive.css. */

/* ── Questionário no overlay ───────────────────────── */
.dx-talk { gap: .75rem; bottom: 5vh; }
.dx-step { font-size: .9rem; letter-spacing: .08em; text-transform: uppercase; }
.dx-step[data-dim="dados"] { color: rgba(127,227,210,.9); }
.dx-step[data-dim="processos"] { color: rgba(159,214,176,.95); }
.dx-step[data-dim="pessoas"] { color: rgba(168,196,236,.95); }
.dx-step[data-dim="lideranca"] { color: rgba(231,196,106,.95); }
.dx-talk .dive-q { font-size: clamp(1.15rem, 2.2vw, 1.5rem); min-height: 2.6em; }
.dx-talk .dive-hint:empty { display: none; }

.dx-opts { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: .45rem; text-align: left; }
.dx-opts[hidden] { display: none; }
.dx-opt { font: inherit; font-size: 1rem; line-height: 1.35; color: rgba(233,244,239,.88); background: rgba(3,20,26,.5);
  border: 1px solid rgba(127,227,210,.2); border-radius: 12px; padding: .62rem .8rem; cursor: pointer; display: flex; align-items: center; gap: .65rem;
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); text-align: left;
  opacity: 0; animation: fade-up .55s ease forwards; transition: background .2s, border-color .2s, box-shadow .25s, transform .2s; }
.dx-opt:last-child:nth-child(odd) { grid-column: 1 / -1; }
.dx-opt:hover { background: rgba(127,227,210,.1); border-color: rgba(127,227,210,.5); }
.dx-opt:focus-visible { outline: 2px solid #7FE3D2; outline-offset: 2px; }
.dx-opt[aria-checked="true"] { background: rgba(127,227,210,.16); border-color: #7FE3D2; color: #F1FAF6; box-shadow: 0 0 22px rgba(127,227,210,.22); }
.dx-key { flex: none; width: 1.55rem; height: 1.55rem; border-radius: 50%; display: grid; place-items: center; font-size: .8rem;
  border: 1px solid rgba(127,227,210,.35); color: rgba(127,227,210,.9); transition: background .2s, color .2s; }
.dx-opt[aria-checked="true"] .dx-key { background: #7FE3D2; color: #03141A; border-color: #7FE3D2; }
.dx-opts.is-leaving .dx-opt { animation: dx-out .4s ease forwards; animation-delay: 0s !important; }
@keyframes dx-out { to { opacity: 0; transform: translateY(-6px); } }

.dx-free { width: 100%; }
.dx-free[hidden] { display: none; }
.dx-textarea { width: 100%; resize: none; font: inherit; font-size: 1.05rem; line-height: 1.45; color: #F1FAF6; background: rgba(3,20,26,.55);
  border: 1px solid rgba(127,227,210,.22); border-radius: 14px; padding: .8rem 1rem; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  transition: border-color .3s, box-shadow .3s; }
.dx-textarea::placeholder { color: rgba(233,244,239,.35); }
.dx-textarea:focus { outline: none; border-color: rgba(127,227,210,.55); box-shadow: 0 0 0 4px rgba(127,227,210,.08), 0 0 30px rgba(127,227,210,.12); }

.dx-nav { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: .75rem; }
.dx-next { font: inherit; font-size: 1rem; padding: .62rem 1.25rem; border-radius: 99px; border: 0; cursor: pointer; background: #7FE3D2; color: #03141A;
  transition: background .2s, opacity .2s; }
.dx-next:hover { background: #A9F0E4; }
.dx-next[disabled] { opacity: .3; cursor: default; }
.dx-next:focus-visible { outline: 2px solid #F1FAF6; outline-offset: 2px; }

/* ── Página ────────────────────────────────────────── */
.dx-intro h2 { font-size: clamp(1.35rem, 2.4vw, 1.75rem); font-weight: 500; letter-spacing: -.02em; color: var(--gray-1000); margin: 0 0 .5rem; }
.dx-lead { color: var(--gray-700); max-width: 62ch; margin: 0 0 1.5rem; line-height: 1.6; }
.dx-dims { display: grid; grid-template-columns: repeat(4, 1fr); gap: .9rem; }
.dx-dim { background: #fff; border: 1px solid var(--gray-300); border-radius: var(--radius); padding: 1.1rem 1.1rem 1.2rem; }
.dx-dim h3 { font-size: 1.05rem; font-weight: 500; margin: .6rem 0 .35rem; color: var(--gray-1000); }
.dx-dim p { font-size: 1rem; line-height: 1.5; color: var(--gray-700); margin: 0; }
.dx-dot { display: block; width: 10px; height: 10px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 4px color-mix(in srgb, var(--c) 18%, transparent); }
.dx-dim[data-dim="dados"] { --c: #3f8f80; }
.dx-dim[data-dim="processos"] { --c: #4f624f; }
.dx-dim[data-dim="pessoas"] { --c: #5b7fb0; }
.dx-dim[data-dim="lideranca"] { --c: #b8892c; }
.dx-intro-cta { margin-top: 1.6rem; display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.dx-intro-cta .hint { margin: 0; }

.dx-results { display: flex; flex-direction: column; gap: 1.1rem; }
.dx-results[hidden] { display: none; }
.dx-results h2:focus { outline: none; }
.dx-results .card h3 { font-size: 1.05rem; font-weight: 500; margin: 0 0 .8rem; color: var(--gray-1000); }
.dx-top { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 1.1rem; }
.dx-score { display: flex; gap: 1.3rem; align-items: center; }
.dx-gauge { flex: none; color: var(--gray-1000); }
.dx-level { display: inline-block; font-size: .9rem; letter-spacing: .06em; text-transform: uppercase; color: var(--moss-700);
  background: rgba(148,163,152,.18); padding: .3rem .65rem; border-radius: 99px; margin-bottom: .55rem; }
.dx-level[data-level="avancada"] { color: var(--brass-700); background: rgba(212,168,75,.16); }
.dx-score-txt p { margin: 0 0 .5rem; font-size: 1rem; line-height: 1.55; color: var(--gray-700); }
.dx-score-txt .hint { margin: .3rem 0 0; }
.dx-radar-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; align-items: center; }
.dx-radar-svg { width: 100%; height: auto; max-width: 400px; display: block; overflow: visible; margin: 0 auto; font-family: inherit; }
.dx-bars { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .8rem; }
.dx-bars li { display: grid; grid-template-columns: 6.5rem 1fr 2rem; align-items: center; gap: .6rem; font-size: 1rem; }
.dx-bar-lbl { display: flex; align-items: center; gap: .45rem; color: var(--gray-700); }
.dx-bar-lbl i { width: 8px; height: 8px; border-radius: 50%; }
.dx-bar { height: 8px; border-radius: 99px; background: #ECE7DD; overflow: hidden; }
.dx-bar b { display: block; height: 100%; border-radius: 99px; transition: width .8s cubic-bezier(.2,.7,.2,1); }
.dx-bar-v { text-align: right; font-variant-numeric: tabular-nums; color: var(--gray-1000); font-weight: 500; }
.dx-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; }

.dx-opps { list-style: none; counter-reset: opp; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: .9rem; }
.dx-opps li { counter-increment: opp; position: relative; border: 1px solid var(--gray-300); border-radius: var(--radius); padding: 1rem 1rem 1.05rem; background: #FCFBF8; }
.dx-opps li::before { content: counter(opp); position: absolute; top: .85rem; right: 1rem; font-size: 1.4rem; font-weight: 300; color: var(--gray-300); }
.dx-opps strong { display: block; font-weight: 500; margin: .55rem 0 .35rem; color: var(--gray-1000); padding-right: 1.5rem; }
.dx-opps p { margin: 0; font-size: 1rem; line-height: 1.55; color: var(--gray-700); }
.dx-tag { display: inline-block; font-size: .8rem; letter-spacing: .06em; text-transform: uppercase; color: var(--c); border: 1px solid color-mix(in srgb, var(--c) 40%, transparent);
  padding: .15rem .5rem; border-radius: 99px; }

.dx-usecase { margin-top: .4rem; }
.dx-phases { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: .9rem; }
.dx-phase { border: 1px solid var(--gray-300); border-radius: var(--radius); padding: 1rem; background: #fff; }
.dx-phase-h { display: flex; gap: .65rem; align-items: center; margin-bottom: .6rem; }
.dx-phase-h strong { display: block; font-weight: 500; color: var(--gray-1000); }
.dx-phase-h span:not(.dx-phase-n) { font-size: .9rem; color: var(--gray-500); }
.dx-phase-n { flex: none; width: 1.8rem; height: 1.8rem; border-radius: 50%; display: grid; place-items: center; font-size: .9rem; background: var(--ink-800); color: var(--paper); }
.dx-goal { font-size: 1rem; line-height: 1.5; color: var(--gray-700); margin: 0 0 .6rem; }
.dx-phase ul, .dx-list { margin: 0 0 .6rem; padding-left: 1.1rem; font-size: 1rem; line-height: 1.5; color: var(--gray-1000); }
.dx-phase li + li, .dx-list li + li { margin-top: .3rem; }
.dx-meta { font-size: .9rem; line-height: 1.45; color: var(--gray-500); margin: .35rem 0 0; }
.dx-meta b { font-weight: 500; color: var(--gray-700); }
#btn-plan[hidden] { display: none; }
.btn-sm-out { margin-top: .6rem; font-size: .9rem; padding: .45rem .9rem; }
.dx-invite { margin: 0; }

@media (max-width: 900px) {
  .dx-dims { grid-template-columns: 1fr 1fr; }
  .dx-top, .dx-cols { grid-template-columns: 1fr; }
  .dx-opps, .dx-phases { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .dx-talk { bottom: 2.5vh; gap: .55rem; }
  .dx-talk .dive-q { font-size: 1.12rem; min-height: 0; }
  .dx-opts { grid-template-columns: 1fr; gap: .38rem; }
  .dx-opt { font-size: .9rem; padding: .55rem .7rem; }
  .dx-key { width: 1.35rem; height: 1.35rem; font-size: .8rem; }
  .dx-dims { grid-template-columns: 1fr; }
  .dx-score { flex-direction: column; align-items: flex-start; }
  .dx-radar-wrap { grid-template-columns: 1fr; }
  .dx-bars li { grid-template-columns: 5.5rem 1fr 1.8rem; }
}
@media (max-height: 700px) and (min-width: 641px) { .dx-talk { bottom: 2vh; } .dx-opt { padding: .45rem .7rem; } }
@media (prefers-reduced-motion: reduce) {
  .dx-opt { animation-duration: .01s !important; animation-delay: 0s !important; }
  .dx-bar b { transition: none; }
}
@media print {
  .dx-intro, #btn-plan, #btn-plan-redo, .dx-invite .btn { display: none !important; }
}
.eyebrow-dark { color: var(--brass-700); display: block; margin-bottom: .35rem; }
.dx-results .results-head h2 { font-size: clamp(1.35rem, 2.4vw, 1.75rem); font-weight: 500; letter-spacing: -.02em; margin: 0; }
