/* ============================================================
   WORKFACILIT — CRM para escritórios de advocacia · proposta em 5 slides
   Camada sobre css/crm.css: mesmo deck, mesmos tokens --wf-* (sem hex).
   Namespace: adv-*  ·  o JS é o mesmo do deck (js/crm.js)
   ============================================================ */

.adv-eyebrow { display: inline-flex; align-items: center; gap: .5rem; margin-bottom: .8rem; font-size: .64rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: var(--wf-text-tertiary); }
.adv-eyebrow i { font-size: 1rem; color: var(--wf-primary); }

/* ═══ Slide 1 — mapa da solução ═══ */
.adv-map { display: grid; justify-items: center; max-width: 560px; margin: 0 auto; }
.adv-client { display: inline-flex; align-items: center; gap: .6rem; padding: .5rem 1.15rem; border-radius: 99px; background: color-mix(in srgb, var(--wf-bg-surface) 88%, transparent); border: 1px solid var(--wf-border-strong); }
.adv-client i { font-size: 1.35rem; color: var(--wf-primary); }
.adv-client b { font-family: var(--wf-display); font-size: .9rem; color: var(--wf-text-primary); }
.adv-client span { font-size: .72rem; color: var(--wf-text-tertiary); }
.adv-link { display: block; width: 2px; height: .9rem; border-radius: 2px; background: linear-gradient(180deg, var(--wf-primary), var(--wf-ai-ceci)); }
.adv-stack { width: 100%; display: grid; gap: .6rem; padding: .85rem; border-radius: 22px; border: 1px solid var(--wf-border-strong); background: color-mix(in srgb, var(--wf-bg-surface) 70%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 40px 90px color-mix(in srgb, var(--wf-primary-darker) 70%, transparent); }
.adv-layer { position: relative; padding: .75rem .8rem .8rem; border-radius: 16px; background: color-mix(in srgb, var(--wf-text-primary) 4%, transparent); border: 1px solid var(--wf-border); }
.adv-layer__t { display: flex; align-items: center; gap: .5rem; margin-bottom: .55rem; font-size: .64rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: var(--wf-text-tertiary); }
.adv-layer__t i { font-size: 1rem; color: var(--wf-primary); }
.adv-n { position: absolute; top: .55rem; right: .65rem; font-family: var(--wf-display); font-size: .64rem; font-weight: 800; letter-spacing: .06em; color: var(--wf-text-tertiary); opacity: .75; }
.adv-mods { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .55rem; }
.adv-mod { position: relative; padding: .7rem .7rem .75rem; border-radius: 12px; background: color-mix(in srgb, var(--wf-primary) 14%, transparent); border: 1px solid color-mix(in srgb, var(--wf-primary) 40%, transparent); }
.adv-mod > i { font-size: 1.25rem; color: var(--wf-primary); }
.adv-mod b { display: block; margin-top: .4rem; font-size: .84rem; line-height: 1.2; color: var(--wf-text-primary); }
.adv-mod small { display: block; margin-top: .25rem; font-size: .7rem; line-height: 1.35; color: var(--wf-text-secondary); }
.adv-layer--brain { background: radial-gradient(80% 140% at 20% 0%, color-mix(in srgb, var(--wf-ai-ceci) 26%, transparent), transparent 70%), var(--wf-primary-darker); border-color: color-mix(in srgb, var(--wf-ai-ceci) 55%, var(--wf-border-strong)); box-shadow: 0 0 34px color-mix(in srgb, var(--wf-ai-ceci) 24%, transparent); }
.adv-layer--brain .adv-layer__t i { color: var(--wf-ai-ceci); }
.adv-brain { font-size: .84rem; line-height: 1.5; color: var(--wf-text-secondary); }
.adv-brain b { color: var(--wf-text-primary); font-weight: 600; }
.adv-layer--legacy { border-style: dashed; border-color: var(--wf-border-strong); }
.adv-chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.adv-chips span { display: inline-flex; align-items: center; gap: .4rem; padding: .28rem .7rem; border-radius: 99px; font-size: .74rem; font-weight: 600; color: var(--wf-text-primary); background: color-mix(in srgb, var(--wf-text-primary) 7%, transparent); border: 1px solid var(--wf-border-strong); }
.adv-chips i { font-size: 1rem; color: var(--wf-primary); }
.crm-slide .adv-client, .crm-slide .adv-link, .crm-slide .adv-layer { opacity: 0; transform: translateY(14px); }
.crm-slide.is-active .adv-client, .crm-slide.is-active .adv-link, .crm-slide.is-active .adv-layer { opacity: 1; transform: none; transition: opacity .6s ease calc(.9s + var(--k) * .35s), transform .8s var(--ease) calc(.9s + var(--k) * .35s); }

/* ═══ Slide 2 — esteira curta + portão da Governança ═══ */
@media (min-width: 1101px) {
  .adv-jr4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .adv-jr4::before, .adv-jr4::after { right: calc(25% - 27px - .75rem); }
}
.crm-slide.is-active .adv-jr4::after { animation-duration: 2.1s; }
.adv-jr4 .crm-st h3 { margin-top: .85rem; }
.adv-gate { display: flex; align-items: center; gap: .9rem; margin: .95rem 0 .85rem; }
.adv-gate::before, .adv-gate::after { content: ""; flex: 1; height: 1px; background: repeating-linear-gradient(90deg, var(--wf-border-strong) 0 6px, transparent 6px 12px); }
.adv-gate__b { display: inline-flex; align-items: center; gap: .55rem; padding: .4rem 1rem; border-radius: 99px; font-size: .78rem; font-weight: 700; text-align: center; color: var(--wf-text-primary); background: color-mix(in srgb, var(--wf-ai-ceci) 22%, transparent); border: 1px solid color-mix(in srgb, var(--wf-ai-ceci) 50%, transparent); }
.adv-gate__b i { flex: none; font-size: 1.15rem; color: var(--wf-ai-ceci); }
.adv-onb li { padding: .75rem .85rem; }
.adv-onb .crm-ag__ic { width: 38px; height: 38px; font-size: 1.15rem; border-radius: 11px; }
.adv-onb small { margin-top: .5rem; }
.adv-onb p { font-size: .78rem; line-height: 1.45; }
.crm-slide.is-active .adv-onb li { transition-delay: calc(2.5s + var(--k) * .22s); }
.adv-active { display: flex; align-items: center; justify-content: center; gap: .6rem; margin-top: .8rem; padding: .55rem 1rem; border-radius: 14px; font-size: .86rem; color: var(--wf-text-secondary); background: linear-gradient(90deg, color-mix(in srgb, var(--wf-success-strong) 16%, transparent), color-mix(in srgb, var(--wf-primary) 14%, transparent)); border: 1px solid color-mix(in srgb, var(--wf-success-strong) 45%, transparent); }
.adv-active i { font-size: 1.25rem; color: var(--wf-success-strong); }
.adv-active b { color: var(--wf-text-primary); }
.crm-slide .adv-active { opacity: 0; transform: translateY(10px); }
.crm-slide.is-active .adv-active { opacity: 1; transform: none; transition: opacity .6s ease 3.6s, transform .7s var(--ease) 3.6s; }

/* ═══ Slide 3 — WhatsApp + portal ═══ */
.adv-cc { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 1.2rem; align-items: stretch; }
.adv-phone { display: flex; flex-direction: column; min-width: 0; border-radius: 24px; overflow: hidden; border: 1px solid var(--wf-border-strong); background: color-mix(in srgb, var(--wf-bg-surface) 82%, transparent); box-shadow: 0 40px 90px color-mix(in srgb, var(--wf-primary-darker) 70%, transparent); }
.adv-phone__bar { display: flex; align-items: center; gap: .65rem; padding: .7rem .9rem; background: color-mix(in srgb, var(--wf-success-strong) 14%, var(--wf-bg-surface)); border-bottom: 1px solid var(--wf-border); }
.adv-phone__av { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; font-size: 1.1rem; color: var(--wf-on-primary); background: var(--wf-primary); }
.adv-phone__bar b { display: block; font-size: .82rem; color: var(--wf-text-primary); }
.adv-phone__bar small { display: block; font-size: .66rem; color: var(--wf-success-strong); }
.adv-phone__bar > i { margin-left: auto; font-size: 1.4rem; color: var(--wf-success-strong); }
.adv-chat { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: .5rem; padding: .85rem .8rem; }
.adv-msg { max-width: 90%; padding: .5rem .7rem; border-radius: 14px; font-size: .76rem; line-height: 1.42; }
.adv-msg b { color: var(--wf-text-primary); font-weight: 700; }
.adv-msg--me { align-self: flex-end; color: var(--wf-text-primary); background: color-mix(in srgb, var(--wf-primary) 26%, transparent); border-bottom-right-radius: 4px; }
.adv-msg--bot { align-self: flex-start; color: var(--wf-text-secondary); background: color-mix(in srgb, var(--wf-text-primary) 8%, transparent); border-bottom-left-radius: 4px; }
.adv-msg small { display: flex; align-items: center; gap: .3rem; margin-top: .35rem; font-size: .64rem; color: var(--wf-text-tertiary); }
.adv-msg small i { font-size: .85rem; color: var(--wf-primary); }
.crm-slide .adv-msg { opacity: 0; transform: translateY(10px) scale(.97); }
.crm-slide.is-active .adv-msg { opacity: 1; transform: none; transition: opacity .5s ease calc(1s + var(--k) * .9s), transform .6s var(--ease) calc(1s + var(--k) * .9s); }
.adv-portal { display: flex; flex-direction: column; min-width: 0; }
.adv-dem { list-style: none; display: grid; padding: .35rem 1.1rem 1rem; }
.adv-dem li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .8rem; padding: .7rem .5rem; border-top: 1px solid var(--wf-border); font-size: .8rem; border-radius: 10px; }
.adv-dem li:first-child { border-top: 0; }
.adv-dem__id { font-family: var(--wf-display); font-size: .74rem; font-weight: 800; color: var(--wf-text-tertiary); }
.adv-dem b { display: block; font-weight: 600; color: var(--wf-text-primary); }
.adv-dem small { display: block; margin-top: .1rem; font-size: .7rem; color: var(--wf-text-tertiary); }
.adv-st { padding: .18rem .65rem; border-radius: 99px; font-size: .66rem; font-weight: 700; letter-spacing: .04em; white-space: nowrap; border: 1px solid transparent; }
.adv-st--an { color: var(--wf-text-primary); background: color-mix(in srgb, var(--wf-primary) 22%, transparent); border-color: color-mix(in srgb, var(--wf-primary) 55%, transparent); }
.adv-st--wait { color: var(--wf-warning-strong); background: color-mix(in srgb, var(--wf-warning-strong) 14%, transparent); border-color: color-mix(in srgb, var(--wf-warning-strong) 50%, transparent); }
.adv-st--ok { color: var(--wf-success-strong); background: color-mix(in srgb, var(--wf-success-strong) 14%, transparent); border-color: color-mix(in srgb, var(--wf-success-strong) 45%, transparent); }
.crm-slide .adv-dem li { opacity: 0; translate: 0 8px; }
.crm-slide.is-active .adv-dem li { opacity: 1; translate: 0 0; transition: opacity .6s ease var(--d), translate .7s var(--ease) var(--d), background .6s ease var(--d); }
.crm-slide.is-active .adv-dem--new { animation: adv-new 2.4s ease var(--d) both; }
@keyframes adv-new { 0% { background: color-mix(in srgb, var(--wf-primary) 26%, transparent); } 100% { background: transparent; } }

/* ═══ Slide 4 — como o bot decide ═══ */
.adv-s4 .crm-title { font-size: clamp(1.6rem, 2.7vw, 2.5rem); line-height: 1.08; }
.adv-dec { display: grid; justify-items: stretch; gap: .7rem; max-width: 600px; margin: 0 auto; }
.adv-node { display: flex; align-items: center; gap: .8rem; padding: .8rem 1.05rem; border-radius: 14px; background: color-mix(in srgb, var(--wf-bg-surface) 88%, transparent); border: 1px solid var(--wf-border-strong); color: var(--wf-text-primary); font-size: .92rem; }
.adv-node > i { flex: none; font-size: 1.35rem; color: var(--wf-primary); }
.adv-node b { font-family: var(--wf-display); font-size: 1rem; letter-spacing: -.01em; }
.adv-node small { display: block; margin-top: .15rem; font-size: .8rem; color: var(--wf-text-tertiary); }
.adv-node--q { justify-self: center; }
.adv-node--core { background: radial-gradient(60% 160% at 50% 0%, color-mix(in srgb, var(--wf-ai-ceci) 34%, transparent), transparent 70%), var(--wf-primary-darker); border-color: color-mix(in srgb, var(--wf-ai-ceci) 55%, var(--wf-border-strong)); box-shadow: 0 0 34px color-mix(in srgb, var(--wf-ai-ceci) 26%, transparent); }
.adv-node__ic { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; font-size: 1.2rem; color: var(--wf-text-primary); background: linear-gradient(135deg, var(--wf-ai-ceci), var(--wf-primary)); }
.adv-arrow { justify-self: center; display: block; width: 2px; height: .8rem; border-radius: 2px; background: linear-gradient(180deg, var(--wf-primary), var(--wf-ai-ceci)); }
.adv-lanes { position: relative; display: grid; gap: .6rem; padding-left: 1.5rem; }
.adv-lanes::before { content: ""; position: absolute; left: .5rem; top: -.55rem; bottom: 1.5rem; width: 2px; border-radius: 2px; background: linear-gradient(180deg, var(--wf-success-strong), var(--wf-primary), var(--wf-warning-strong)); opacity: .7; }
.adv-lane { --lc: var(--wf-primary); position: relative; display: grid; grid-template-columns: 2.4rem minmax(0, 1fr); align-items: center; gap: .8rem; padding: .75rem .95rem; border-radius: 14px; background: color-mix(in srgb, var(--lc) 9%, transparent); border: 1px solid color-mix(in srgb, var(--lc) 45%, transparent); }
.adv-lane::before { content: ""; position: absolute; left: -1rem; top: 50%; width: 1rem; height: 2px; background: var(--lc); opacity: .7; }
.adv-lane--ok { --lc: var(--wf-success-strong); }
.adv-lane--data { --lc: var(--wf-primary); }
.adv-lane--human { --lc: var(--wf-warning-strong); }
.adv-lane__ic { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 12px; font-size: 1.25rem; color: var(--lc); background: color-mix(in srgb, var(--lc) 16%, transparent); }
.adv-lane h3 { font-size: 1rem; letter-spacing: -.01em; color: var(--wf-text-primary); }
.adv-lane p { margin-top: .15rem; font-size: .82rem; line-height: 1.42; color: var(--wf-text-secondary); }
.adv-learn { display: flex; align-items: center; gap: .8rem; padding: .8rem 1.05rem; border-radius: 14px; background: color-mix(in srgb, var(--wf-ai-ceci) 10%, transparent); border: 1px dashed color-mix(in srgb, var(--wf-ai-ceci) 55%, transparent); }
.adv-learn > i { flex: none; font-size: 1.6rem; color: var(--wf-ai-ceci); }
.adv-learn b { display: block; font-size: .95rem; color: var(--wf-text-primary); }
.adv-learn small { display: block; margin-top: .15rem; font-size: .8rem; line-height: 1.42; color: var(--wf-text-secondary); }
.crm-slide.is-active .adv-learn > i { animation: crm-spin 9s linear 2s infinite; }
.crm-slide .adv-node, .crm-slide .adv-arrow, .crm-slide .adv-lane, .crm-slide .adv-learn { opacity: 0; transform: translateY(12px); }
.crm-slide.is-active .adv-node, .crm-slide.is-active .adv-arrow, .crm-slide.is-active .adv-lane, .crm-slide.is-active .adv-learn { opacity: 1; transform: none; transition: opacity .55s ease calc(.8s + var(--k) * .32s), transform .7s var(--ease) calc(.8s + var(--k) * .32s); }

/* ═══ Slide 5 — valor, ondas e contato ═══ */
.adv-val { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .9fr); gap: 1.1rem; align-items: stretch; }
.adv-kpis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.adv-kpi { display: flex; flex-direction: column; gap: .55rem; min-width: 0; padding: .8rem .9rem; border-radius: 16px; background: color-mix(in srgb, var(--wf-bg-surface) 82%, transparent); border: 1px solid var(--wf-border-strong); }
.adv-kpi__h { display: flex; align-items: center; gap: .6rem; }
.adv-kpi__ic { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; font-size: 1.15rem; color: var(--wf-text-primary); background: linear-gradient(135deg, var(--wf-ai-ceci), var(--wf-primary)); box-shadow: 0 0 18px color-mix(in srgb, var(--wf-ai-ceci) 35%, transparent); }
.adv-kpi h3 { font-size: .9rem; line-height: 1.2; letter-spacing: -.02em; color: var(--wf-text-primary); }
.adv-kpi__m { margin-top: auto; padding-top: .5rem; border-top: 1px solid var(--wf-border); }
.adv-kpi__m small { font-size: .58rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--wf-text-tertiary); }
.adv-kpi__m b { display: block; margin-top: .15rem; font-size: .76rem; font-weight: 600; line-height: 1.3; color: var(--wf-text-primary); }
.adv-track { display: flex; align-items: center; gap: .45rem; margin-top: .45rem; font-size: .58rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--wf-text-tertiary); }
.adv-track i { position: relative; flex: 1; height: 2px; border-radius: 2px; overflow: hidden; background: var(--wf-border-strong); }
.adv-track i::after { content: ""; position: absolute; inset: 0; transform-origin: left; transform: scaleX(0); background: linear-gradient(90deg, var(--wf-primary), var(--wf-ai-ceci)); }
.crm-slide.is-active .adv-track i::after { animation: adv-fill 1.5s var(--ease) calc(1.6s + var(--k, 0) * .2s) forwards; }
@keyframes adv-fill { to { transform: scaleX(1); } }
.adv-road { display: grid; gap: .6rem; list-style: none; }
.adv-wave { display: grid; grid-template-columns: 2.3rem minmax(0, 1fr); align-items: center; gap: .8rem; padding: .7rem .9rem; border-radius: 16px; background: color-mix(in srgb, var(--wf-bg-surface) 82%, transparent); border: 1px solid var(--wf-border-strong); }
.adv-wave__n { display: grid; place-items: center; width: 2.3rem; height: 2.3rem; border-radius: 50%; font-family: var(--wf-display); font-size: 1rem; font-weight: 800; color: var(--wf-on-primary); background: var(--wf-primary); box-shadow: 0 0 0 5px color-mix(in srgb, var(--wf-primary) 16%, transparent); }
.adv-wave:nth-child(3) .adv-wave__n { color: var(--wf-bg-surface); background: var(--wf-ai-ceci); box-shadow: 0 0 0 5px color-mix(in srgb, var(--wf-ai-ceci) 20%, transparent); }
.adv-wave small { display: block; font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--wf-text-tertiary); }
.adv-wave p { margin-top: .15rem; font-size: .8rem; line-height: 1.4; color: var(--wf-text-primary); }
.adv-foot { grid-area: bul; align-self: start; display: grid; gap: .8rem; }
.adv-foot .crm-bullets { grid-area: auto; gap: .55rem; }
.adv-foot .crm-bullets li { font-size: clamp(.84rem, 1vw, .94rem); line-height: 1.45; }
.adv-proof { display: flex; align-items: center; gap: .7rem; padding: .55rem .9rem; border-radius: 12px; font-size: .78rem; line-height: 1.4; color: var(--wf-text-secondary); background: color-mix(in srgb, var(--wf-text-primary) 4%, transparent); border: 1px solid var(--wf-border); }
.adv-proof i { flex: none; font-size: 1.25rem; color: var(--wf-ai-ceci); }
.adv-proof b { color: var(--wf-text-primary); }
.crm-slide .adv-kpi, .crm-slide .adv-wave { opacity: 0; transform: translateY(16px); }
.crm-slide.is-active .adv-kpi, .crm-slide.is-active .adv-wave { opacity: 1; transform: none; transition: opacity .6s ease calc(.7s + var(--k) * .16s), transform .8s var(--ease) calc(.7s + var(--k) * .16s); }
.adv-close .crm-final { gap: .7rem; }
.adv-close .crm-final .crm-punch { font-size: clamp(1.15rem, 1.9vw, 1.55rem); }
.adv-close .crm-qr__tile { width: 5.6rem; padding: .7rem; }
.adv-close .crm-me { padding-top: .8rem; gap: 1rem; }
.adv-close .crm-me__role { margin-bottom: .25rem; }

/* ═══ Responsivo ═══ */
@media (max-width: 960px) {
  .crm-slide--full .crm-slide__inner { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "pun" "viz"; align-items: start; }
  .adv-cc, .adv-val { grid-template-columns: minmax(0, 1fr); }
  .adv-gate__b { font-size: .72rem; border-radius: 16px; }
  .adv-gate::before, .adv-gate::after { display: none; }
  .adv-gate { justify-content: center; }
}
@media (max-width: 560px) {
  .adv-mods { grid-template-columns: minmax(0, 1fr); }
  .adv-kpis { grid-template-columns: minmax(0, 1fr); }
  .adv-onb { grid-template-columns: minmax(0, 1fr); }
  .adv-dem li { grid-template-columns: auto minmax(0, 1fr); }
  .adv-dem .adv-st { grid-column: 2; justify-self: start; }
  .adv-close .crm-me { flex-direction: column; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .crm-slide .adv-client, .crm-slide .adv-link, .crm-slide .adv-layer, .crm-slide .adv-active, .crm-slide .adv-msg, .crm-slide .adv-dem li,
  .crm-slide .adv-node, .crm-slide .adv-arrow, .crm-slide .adv-lane, .crm-slide .adv-learn, .crm-slide .adv-kpi, .crm-slide .adv-wave { opacity: 1 !important; transform: none; translate: none; transition: none !important; }
  .adv-dem--new, .adv-learn > i { animation: none !important; }
  .adv-track i::after { animation: none !important; transform: scaleX(1); }
}
