/* ============================================================
   WORKFACILIT — CRM · pitch em 5 slides
   Namespace: crm-*  ·  só tokens --wf-* (sem hex, ver theme.css)
   O deck inteiro é uma superfície profunda (.crm-deck em css/theme-deep.css),
   igual nos dois temas: apresentação imersiva, feita para projetar em reunião.
   ============================================================ */

html, body.crm-page { height: 100%; overflow: hidden; background: var(--wf-primary-darker); }
@media (min-width: 961px) { html { font-size: clamp(12.5px, min(1.78vh, 1.12vw), 18px); } }
@media (min-width: 961px) and (max-height: 800px) { .crm-case__c { padding-top: .6rem; padding-bottom: .6rem; } .crm-deck { grid-template-rows: 52px minmax(0, 1fr) 56px !important; } .crm-dots { height: 56px !important; } .crm-hint { bottom: 16px !important; } }
.crm-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.crm-deck { --ease: var(--wf-ease); position: fixed; inset: 0; display: grid; grid-template-rows: 64px minmax(0, 1fr) 68px; color: var(--wf-text-secondary); font-family: var(--wf-sans); background: var(--wf-primary-darker); isolation: isolate; overflow: hidden; }
.crm-deck :focus-visible { outline: 2px solid var(--wf-primary); outline-offset: 3px; border-radius: 8px; }

/* fundo vivo, discreto */
.crm-bg { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden;
  background:
    radial-gradient(60% 55% at 15% 0%, color-mix(in srgb, var(--wf-ai-ceci) 20%, transparent), transparent 70%),
    radial-gradient(60% 60% at 100% 100%, color-mix(in srgb, var(--wf-primary) 18%, transparent), transparent 70%),
    linear-gradient(180deg, var(--wf-primary-darker), var(--wf-bg-page)); }
.crm-bg::before { content: ""; position: absolute; inset: 0; opacity: .5; background-image: linear-gradient(var(--wf-border) 1px, transparent 1px), linear-gradient(90deg, var(--wf-border) 1px, transparent 1px); background-size: 72px 72px; -webkit-mask-image: radial-gradient(70% 70% at 50% 45%, black, transparent 80%); mask-image: radial-gradient(70% 70% at 50% 45%, black, transparent 80%); }
.crm-bg span { position: absolute; width: 46vmax; height: 46vmax; border-radius: 50%; filter: blur(70px); opacity: .32; transition: transform 1.6s var(--ease), background 1.6s; }
.crm-bg span:nth-child(1) { left: -12vmax; top: -14vmax; background: color-mix(in srgb, var(--wf-ai-ceci) 55%, transparent); transform: translate(calc(var(--n, 0) * 6vmax), calc(var(--n, 0) * 3vmax)); }
.crm-bg span:nth-child(2) { right: -16vmax; bottom: -18vmax; background: color-mix(in srgb, var(--wf-primary) 55%, transparent); transform: translate(calc(var(--n, 0) * -5vmax), calc(var(--n, 0) * -2vmax)); }
.crm-bg span:nth-child(3) { display: none; }
.crm-deck[data-i="0"] { --n: 0; } .crm-deck[data-i="1"] { --n: 1; } .crm-deck[data-i="2"] { --n: 2; } .crm-deck[data-i="3"] { --n: 3; } .crm-deck[data-i="4"] { --n: 4; }

.crm-progress { position: absolute; left: 0; right: 0; top: 0; height: 3px; z-index: 5; background: color-mix(in srgb, var(--wf-text-primary) 8%, transparent); }
.crm-progress i { display: block; height: 100%; width: 100%; transform-origin: left; transform: scaleX(.2); background: linear-gradient(90deg, var(--wf-primary), var(--wf-ai-ceci)); transition: transform .8s var(--ease); }

/* barra superior */
.crm-top { position: relative; z-index: 4; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0 clamp(1rem, 3vw, 2.5rem); }
.crm-home { display: inline-flex; align-items: center; gap: .6rem; font-family: var(--wf-display); font-weight: 800; letter-spacing: -.02em; color: var(--wf-text-primary); }
.crm-home img { width: 34px; height: 34px; }
.crm-counter { position: absolute; left: 50%; translate: -50% 0; display: inline-flex; gap: .4rem; font-size: .85rem; color: var(--wf-text-tertiary); font-variant-numeric: tabular-nums; letter-spacing: .06em; }
.crm-counter b { color: var(--wf-text-primary); }
.crm-top__actions { display: flex; align-items: center; gap: .6rem; }
.crm-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; font-size: 1.15rem; color: var(--wf-text-secondary); background: color-mix(in srgb, var(--wf-text-primary) 7%, transparent); border: 1px solid var(--wf-border-strong); transition: background .25s, color .25s; }
.crm-icon:hover { background: color-mix(in srgb, var(--wf-primary) 22%, transparent); color: var(--wf-text-primary); }

/* botões */
.crm-cta { position: relative; overflow: hidden; isolation: isolate; display: inline-flex; align-items: center; justify-content: center; gap: .55rem; padding: .95rem 1.6rem; border-radius: 14px; font-weight: 700; font-size: .98rem; color: var(--wf-on-primary); background: var(--wf-primary); box-shadow: 0 10px 34px color-mix(in srgb, var(--wf-primary) 35%, transparent); transition: transform .3s var(--ease), box-shadow .3s; }
.crm-cta::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(105deg, transparent 30%, color-mix(in srgb, var(--wf-on-primary) 30%, transparent) 50%, transparent 70%); transform: translateX(-120%); transition: transform .7s var(--ease); }
.crm-cta:hover { transform: translateY(-2px); box-shadow: 0 16px 44px color-mix(in srgb, var(--wf-primary) 45%, transparent); }
.crm-cta:hover::after { transform: translateX(120%); }
.crm-cta--sm { padding: .55rem 1.05rem; font-size: .84rem; border-radius: 11px; box-shadow: none; }
.crm-cta--ghost { color: var(--wf-text-primary); background: color-mix(in srgb, var(--wf-text-primary) 7%, transparent); border: 1px solid var(--wf-border-strong); box-shadow: none; }
.crm-cta--ghost:hover { box-shadow: none; background: color-mix(in srgb, var(--wf-text-primary) 12%, transparent); }

/* setas, pontos, dica */
.crm-arrow { position: absolute; top: 50%; translate: 0 -50%; z-index: 4; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; font-size: 1.4rem; color: var(--wf-text-primary); background: color-mix(in srgb, var(--wf-text-primary) 8%, transparent); border: 1px solid var(--wf-border-strong); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); transition: background .25s, transform .25s var(--ease), opacity .25s; }
.crm-arrow--prev { left: clamp(.5rem, 1.6vw, 1.5rem); } .crm-arrow--next { right: clamp(.5rem, 1.6vw, 1.5rem); }
.crm-arrow:hover:not(:disabled) { background: var(--wf-primary); color: var(--wf-on-primary); transform: scale(1.08); }
.crm-arrow:disabled { opacity: .25; cursor: default; }
.crm-dots { position: absolute; left: 50%; bottom: 0; translate: -50% 0; z-index: 4; height: 68px; display: flex; align-items: center; gap: .35rem; padding: 0 1rem; }
.crm-dot { white-space: nowrap; display: inline-flex; align-items: center; gap: .55rem; padding: .5rem .8rem; border-radius: 99px; font-size: .78rem; font-weight: 600; color: var(--wf-text-tertiary); transition: color .25s, background .25s; }
.crm-dot i { width: 8px; height: 8px; border-radius: 50%; background: var(--wf-border-strong); transition: background .25s, box-shadow .25s, width .3s var(--ease); }
.crm-dot:hover { color: var(--wf-text-primary); }
.crm-dot.is-on { color: var(--wf-text-primary); background: color-mix(in srgb, var(--wf-text-primary) 8%, transparent); }
.crm-dot.is-on i { width: 22px; border-radius: 99px; background: linear-gradient(90deg, var(--wf-primary), var(--wf-ai-ceci)); box-shadow: 0 0 14px color-mix(in srgb, var(--wf-primary) 60%, transparent); }
.crm-dot b { font-weight: 600; }
.crm-hint { position: absolute; right: clamp(1rem, 3vw, 2.5rem); bottom: 22px; z-index: 4; font-size: .74rem; color: var(--wf-text-tertiary); transition: opacity .6s; }
.crm-hint kbd { display: inline-block; margin: 0 .15rem; padding: .05rem .4rem; border-radius: 6px; border: 1px solid var(--wf-border-strong); background: color-mix(in srgb, var(--wf-text-primary) 6%, transparent); font: inherit; color: var(--wf-text-secondary); }
@media (max-width: 1599px) { .crm-hint { display: none; } }
.crm-hint.is-off { opacity: 0; pointer-events: none; }

/* ── Slides ── */
.crm-stage { position: relative; z-index: 2; min-height: 0; }
.crm-slide { position: absolute; inset: 0; display: flex; overflow-y: auto; overflow-x: hidden; opacity: 0; visibility: hidden; transform: translateX(5%) scale(.985); filter: blur(8px);
  transition: opacity .55s ease, transform .9s var(--ease), filter .55s ease, visibility 0s linear .9s; scrollbar-width: thin; }
.crm-slide.is-past { transform: translateX(-5%) scale(.985); }
.crm-slide.is-active { opacity: 1; visibility: visible; transform: none; filter: none; transition-delay: 0s; }
.crm-slide__inner { margin: auto; width: 100%; max-width: 1240px; padding: 1rem clamp(4.6rem, 7vw, 6rem); display: grid; column-gap: clamp(2rem, 4vw, 4.5rem); row-gap: 1.5rem; align-items: center;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); grid-template-areas: "head viz" "bul viz" "pun viz"; }
.crm-slide--flip .crm-slide__inner { grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); grid-template-areas: "viz head" "viz bul" "viz pun"; }
.crm-slide--wide .crm-slide__inner { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); grid-template-areas: "head head" "viz viz" "bul pun"; row-gap: clamp(1.25rem, 2.6vh, 2rem); }
.crm-head { grid-area: head; align-self: end; }
.crm-viz { grid-area: viz; min-width: 0; }
.crm-bullets { grid-area: bul; align-self: start; }
.crm-punch, .crm-final { grid-area: pun; align-self: start; }
.crm-slide--wide .crm-head { text-align: left; }
.crm-slide--wide .crm-title { font-size: clamp(1.7rem, 2.9vw, 2.6rem); }
.crm-slide--wide .crm-slide__inner { padding-top: .5rem; padding-bottom: .5rem; }
.crm-slide--wide .crm-bullets { gap: .55rem; }
.crm-slide--wide .crm-bullets li { font-size: clamp(.86rem, 1.05vw, .96rem); line-height: 1.45; }
.crm-slide--wide .crm-bullets, .crm-slide--wide .crm-punch { align-self: center; }

.crm-kicker { display: inline-flex; align-items: center; gap: .7rem; font-size: .76rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: color-mix(in srgb, var(--wf-primary) 90%, var(--wf-text-primary)); }
.crm-kicker b { display: inline-grid; place-items: center; min-width: 32px; height: 22px; padding: 0 .5rem; border-radius: 99px; color: var(--wf-on-primary); background: var(--wf-primary); font-size: .72rem; letter-spacing: .04em; }
.crm-title { margin-top: .9rem; font-size: clamp(1.9rem, 3.5vw, 3.25rem); line-height: 1.05; letter-spacing: -.04em; color: var(--wf-text-primary); text-wrap: balance; }
.crm-bullets { display: grid; gap: .8rem; list-style: none; }
.crm-bullets li { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: .75rem; font-size: clamp(.92rem, 1.15vw, 1.04rem); line-height: 1.55; }
.crm-bullets li i { margin-top: .12rem; font-size: 1.3rem; color: var(--wf-primary); }
.crm-bullets li i.crm-bad { color: var(--wf-warning-strong); }
.crm-bullets b { color: var(--wf-text-primary); font-weight: 600; }
.crm-punch { padding-left: 1.1rem; border-left: 3px solid var(--wf-ai-ceci); font-family: var(--wf-display); font-weight: 800; font-size: clamp(1.2rem, 2.1vw, 1.75rem); line-height: 1.22; letter-spacing: -.03em; color: var(--wf-text-primary); text-wrap: balance; }
.crm-punch em { font-style: normal; background: linear-gradient(100deg, var(--wf-primary), var(--wf-ai-ceci)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.crm-final { display: grid; gap: 1.4rem; }
.crm-final > .crm-punch { grid-area: auto; }
.crm-slide--wide .crm-punch { font-size: clamp(1.4rem, 2.5vw, 2.15rem); }
.crm-final__btns { display: flex; flex-wrap: wrap; gap: .8rem; }

/* entrada escalonada dos elementos do slide ativo */
.crm-in { opacity: 0; transform: translateY(22px); transition: opacity .7s var(--ease), transform .8s var(--ease); }
.crm-slide.is-active .crm-in { opacity: 1; transform: none; transition-delay: calc(var(--i, 0) * 110ms + .3s); }

/* ═══ Slide 1 — peças soltas viram um núcleo ═══ */
.crm-orbit { position: relative; container-type: inline-size; width: min(100%, 540px); aspect-ratio: 1; margin: 0 auto; }
.crm-orbit__lines { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.crm-orbit__lines path { fill: none; stroke: color-mix(in srgb, var(--wf-primary) 55%, transparent); stroke-width: .35; stroke-dasharray: 1 1.6; opacity: 0; }
.crm-orbit__ring { fill: none; stroke: color-mix(in srgb, var(--wf-ai-ceci) 40%, transparent); stroke-width: .25; stroke-dasharray: .6 2; transform-origin: 50px 50px; opacity: 0; }
.crm-slide.is-active .crm-orbit__lines path { animation: crm-fade .8s ease 3s forwards; }
.crm-slide.is-active .crm-orbit__ring { animation: crm-fade .8s ease 3.2s forwards, crm-spin 60s linear 3.2s infinite; }
@keyframes crm-fade { to { opacity: 1; } }
@keyframes crm-spin { to { rotate: 360deg; } }
.crm-chip { position: absolute; left: 50%; top: 50%; display: inline-flex; align-items: center; gap: 1.2cqw; padding: 1.5cqw 2.8cqw; border-radius: 99px; white-space: nowrap; font-size: max(9.5px, 2.7cqw); font-weight: 600; color: var(--wf-text-primary);
  background: color-mix(in srgb, var(--wf-bg-surface) 88%, transparent); border: 1px solid var(--wf-border-strong); box-shadow: 0 1.2cqw 3cqw color-mix(in srgb, var(--wf-primary-darker) 60%, transparent);
  translate: -50% -50%; transform: translate(var(--cx), var(--cy)) rotate(var(--rot)); }
.crm-chip i { font-size: 1.25em; color: var(--wf-primary); }
.crm-slide.is-active .crm-chip { animation: crm-gather 1.5s var(--ease) calc(1.7s + var(--i) * .1s) forwards; }
@keyframes crm-gather { to { transform: translate(var(--ox), var(--oy)) rotate(0deg); } }
.crm-orbit__core { position: absolute; left: 50%; top: 50%; width: 27cqw; aspect-ratio: 1; translate: -50% -50%; display: grid; place-content: center; text-align: center; border-radius: 50%; color: var(--wf-text-primary);
  background: radial-gradient(circle at 35% 28%, var(--wf-ai-ceci), var(--wf-primary-dark) 62%, var(--wf-primary-darker));
  box-shadow: 0 0 0 2.4cqw color-mix(in srgb, var(--wf-primary) 12%, transparent), 0 0 13cqw color-mix(in srgb, var(--wf-ai-ceci) 55%, transparent); scale: .4; opacity: 0; }
.crm-orbit__core b { font-family: var(--wf-display); font-size: 7cqw; font-weight: 800; letter-spacing: -.03em; line-height: 1; }
.crm-orbit__core small { margin-top: .6cqw; font-size: max(8px, 1.95cqw); color: color-mix(in srgb, var(--wf-text-primary) 80%, transparent); }
.crm-slide.is-active .crm-orbit__core { animation: crm-core 1s var(--ease) 3s forwards, crm-breathe 5s ease-in-out 4s infinite; }
@keyframes crm-core { to { scale: 1; opacity: 1; } }
@keyframes crm-breathe { 50% { box-shadow: 0 0 0 3.4cqw color-mix(in srgb, var(--wf-primary) 8%, transparent), 0 0 16cqw color-mix(in srgb, var(--wf-ai-ceci) 65%, transparent); } }
.crm-orbit__cap { position: absolute; left: 0; right: 0; bottom: -1.5cqw; text-align: center; font-size: max(11px, 2.7cqw); font-weight: 600; letter-spacing: .02em; color: var(--wf-text-tertiary); opacity: 0; }
.crm-orbit__cap--b { color: var(--wf-text-primary); }
.crm-slide.is-active .crm-orbit__cap--a { animation: crm-cap 3s ease .6s forwards; }
.crm-slide.is-active .crm-orbit__cap--b { animation: crm-fade .8s ease 3.4s forwards; }
@keyframes crm-cap { 15%, 75% { opacity: 1; } 100% { opacity: 0; } }

/* ═══ Slide 2 — a jornada ═══ */
.crm-jr { position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0 1rem; list-style: none; }
.crm-jr::before, .crm-jr::after { content: ""; position: absolute; top: 27px; left: 27px; right: calc(100% / 6 - 27px); height: 2px; border-radius: 2px; }
.crm-jr::before { background: var(--wf-border-strong); }
.crm-jr::after { background: linear-gradient(90deg, var(--wf-primary), var(--wf-ai-ceci)); transform-origin: left; transform: scaleX(0); box-shadow: 0 0 14px color-mix(in srgb, var(--wf-primary) 70%, transparent); }
.crm-slide.is-active .crm-jr::after { animation: crm-line 3.1s linear .8s forwards; }
@keyframes crm-line { to { transform: scaleX(1); } }
.crm-st { position: relative; }
.crm-st__ic { position: relative; z-index: 1; display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; font-size: 1.5rem; color: var(--wf-text-tertiary); background: var(--wf-primary-darker); border: 1px solid var(--wf-border-strong); }
.crm-slide.is-active .crm-st__ic { animation: crm-lit .7s var(--ease) calc(.8s + var(--k) * .52s) forwards; }
@keyframes crm-lit { to { color: var(--wf-on-primary); background: var(--wf-primary); border-color: transparent; box-shadow: 0 0 0 6px color-mix(in srgb, var(--wf-primary) 18%, transparent), 0 0 26px color-mix(in srgb, var(--wf-primary) 55%, transparent); } }
.crm-st--key .crm-st__ic { --k2: 1; }
.crm-slide.is-active .crm-st--key .crm-st__ic { animation-name: crm-lit-key; }
@keyframes crm-lit-key { to { color: var(--wf-bg-surface); background: var(--wf-ai-ceci); border-color: transparent; box-shadow: 0 0 0 6px color-mix(in srgb, var(--wf-ai-ceci) 22%, transparent), 0 0 30px color-mix(in srgb, var(--wf-ai-ceci) 60%, transparent); } }
.crm-st h3 { margin: 1.05rem 0 .4rem; font-size: 1.02rem; letter-spacing: -.02em; color: var(--wf-text-primary); }
.crm-st p { font-size: .86rem; line-height: 1.5; }
.crm-st b { color: var(--wf-text-primary); }
.crm-st__tag { display: inline-block; margin-top: .6rem; padding: .18rem .6rem; border-radius: 99px; font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--wf-text-primary); background: color-mix(in srgb, var(--wf-ai-ceci) 24%, transparent); border: 1px solid color-mix(in srgb, var(--wf-ai-ceci) 45%, transparent); }
.crm-st h3, .crm-st p, .crm-st__tag { opacity: .45; transition: opacity .6s ease calc(.9s + var(--k) * .52s); }
.crm-slide.is-active .crm-st h3, .crm-slide.is-active .crm-st p, .crm-slide.is-active .crm-st__tag { opacity: 1; }

/* ═══ Slide 3 — cliente 360° ═══ */
.crm-win { border-radius: 20px; overflow: hidden; border: 1px solid var(--wf-border-strong); background: color-mix(in srgb, var(--wf-bg-surface) 82%, 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); }
.crm-win__bar { display: flex; align-items: center; gap: .4rem; padding: .7rem 1rem; border-bottom: 1px solid var(--wf-border); }
.crm-win__bar span { width: 9px; height: 9px; border-radius: 50%; background: var(--wf-border-strong); }
.crm-win__bar em { margin-left: auto; font-style: normal; font-size: .68rem; color: var(--wf-text-tertiary); }
.crm-win__client { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem .9rem; padding: .9rem 1.1rem; border-bottom: 1px solid var(--wf-border); }
.crm-win__client b { display: block; color: var(--wf-text-primary); font-size: .95rem; }
.crm-win__client small { display: block; font-size: .76rem; color: var(--wf-text-tertiary); }
.crm-av { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; font-size: .8rem; font-weight: 800; color: var(--wf-bg-page); background: linear-gradient(135deg, var(--wf-ai-ceci), var(--wf-primary)); }
.crm-av--sm { width: 20px; height: 20px; border-radius: 7px; font-size: .55rem; font-style: normal; }
.crm-pill { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .7rem; border-radius: 99px; font-size: .72rem; font-weight: 600; color: var(--wf-text-secondary); background: color-mix(in srgb, var(--wf-text-primary) 7%, transparent); border: 1px solid var(--wf-border); }
.crm-pill i { color: var(--wf-primary); font-size: .95rem; }
.crm-pill--wa i { color: var(--wf-success-strong); }
.crm-pill--wa { margin-left: auto; }
.crm-kb { --gap: .55rem; position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gap); padding: .9rem 1.1rem; }
.crm-kb__col { min-width: 0; padding: .55rem; border-radius: 12px; background: color-mix(in srgb, var(--wf-text-primary) 4%, transparent); }
.crm-kb__col h4 { margin-bottom: .5rem; font-size: .66rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--wf-text-tertiary); }
.crm-kb__slot { display: block; height: 4.6rem; margin-bottom: .5rem; border-radius: 9px; border: 1px dashed var(--wf-border-strong); }
.crm-kb__ghost { padding: .5rem .55rem; border-radius: 9px; background: color-mix(in srgb, var(--wf-text-primary) 5%, transparent); }
.crm-kb__ghost b, .crm-kb__ghost s { display: block; height: 6px; border-radius: 4px; background: var(--wf-border-strong); text-decoration: none; }
.crm-kb__ghost s { width: 55%; margin-top: 6px; opacity: .6; }
.crm-kb__card { position: absolute; z-index: 2; top: calc(.9rem + 1.62rem + .55rem + .5rem); left: calc(1.1rem + .55rem); width: calc((100% - 2.2rem - 3 * var(--gap)) / 4 - 1.1rem); min-height: 4.6rem; padding: .55rem .6rem; border-radius: 9px; display: grid; gap: .25rem; align-content: center;
  background: var(--wf-bg-surface); border: 1px solid color-mix(in srgb, var(--wf-primary) 55%, transparent); box-shadow: 0 8px 26px color-mix(in srgb, var(--wf-primary) 30%, transparent);
  transform: translateX(calc(var(--s) * (100% + 1.1rem + var(--gap)))); transition: transform .9s var(--ease); }
.crm-kb__card b { font-size: .74rem; color: var(--wf-text-primary); }
.crm-kb__card > span { display: flex; justify-content: space-between; align-items: baseline; font-size: .7rem; }
.crm-kb__card em { font-style: normal; font-weight: 700; color: var(--wf-text-primary); }
.crm-kb__card u { text-decoration: none; color: var(--wf-success-strong); font-weight: 700; }
.crm-kb__card small { display: flex; align-items: center; gap: .35rem; font-size: .62rem; color: var(--wf-text-tertiary); }
.crm-tl { display: grid; gap: .1rem; padding: .4rem 1.1rem 1rem; list-style: none; }
.crm-tl li { display: flex; align-items: center; gap: .7rem; padding: .42rem 0; font-size: .8rem; border-top: 1px solid var(--wf-border); }
.crm-tl li:first-child { border-top: 0; }
.crm-tl i { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 9px; font-size: .95rem; color: var(--wf-primary); background: color-mix(in srgb, var(--wf-primary) 12%, transparent); }
.crm-tl b { color: var(--wf-text-primary); font-weight: 600; }
.crm-slide .crm-tl li { opacity: 0; translate: 0 8px; transition: opacity .5s ease, translate .6s var(--ease); }
.crm-slide.is-active .crm-tl li { opacity: 1; translate: 0 0; }
.crm-slide.is-active .crm-tl li:nth-child(1) { transition-delay: 1.1s; } .crm-slide.is-active .crm-tl li:nth-child(2) { transition-delay: 1.4s; }
.crm-slide.is-active .crm-tl li:nth-child(3) { transition-delay: 1.7s; } .crm-slide.is-active .crm-tl li:nth-child(4) { transition-delay: 2s; }

/* ═══ Slide 4 — aceleradores ═══ */
.crm-ag { display: grid; gap: .8rem; }
.crm-ag__row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; list-style: none; }
.crm-ag__row li { position: relative; padding: .85rem .9rem; border-radius: 18px; background: color-mix(in srgb, var(--wf-bg-surface) 80%, transparent); border: 1px solid var(--wf-border-strong); }
.crm-ag__row li::after { content: ""; position: absolute; top: 2.15rem; right: -1.05rem; width: 1.1rem; height: 2px; background: linear-gradient(90deg, var(--wf-ai-ceci), var(--wf-primary)); }
.crm-ag__row li:last-child::after { display: none; }
.crm-ag__ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; font-size: 1.3rem; color: var(--wf-text-primary); background: linear-gradient(135deg, var(--wf-ai-ceci), var(--wf-primary)); box-shadow: 0 0 22px color-mix(in srgb, var(--wf-ai-ceci) 45%, transparent); }
.crm-ag__row small { display: block; margin-top: .6rem; font-size: .66rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--wf-text-tertiary); }
.crm-ag__row b { display: block; margin: .15rem 0 .35rem; font-family: var(--wf-display); font-size: .98rem; letter-spacing: -.02em; color: var(--wf-text-primary); }
.crm-ag__row p { font-size: .82rem; line-height: 1.5; }
.crm-slide .crm-ag__row li { opacity: 0; transform: translateY(16px); transition: opacity .6s ease, transform .7s var(--ease); }
.crm-slide.is-active .crm-ag__row li { opacity: 1; transform: none; transition-delay: calc(.9s + var(--k) * .22s); }
.crm-ag__bases { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.crm-ag__base--leg { background: color-mix(in srgb, var(--wf-ai-ceci) 10%, transparent); border-color: color-mix(in srgb, var(--wf-ai-ceci) 45%, transparent); }
.crm-ag__base--leg i { color: var(--wf-ai-ceci); }
.crm-ag__base { display: flex; align-items: center; gap: .8rem; padding: .8rem 1.1rem; border-radius: 14px; font-size: .86rem; color: var(--wf-text-secondary); background: color-mix(in srgb, var(--wf-primary) 10%, transparent); border: 1px dashed color-mix(in srgb, var(--wf-primary) 45%, transparent); }
.crm-ag__base i { font-size: 1.4rem; color: var(--wf-primary); }
.crm-ag__base b { color: var(--wf-text-primary); }
.crm-bld { position: relative; padding: .9rem 1.1rem 1.1rem; border-radius: 16px; background: color-mix(in srgb, var(--wf-bg-surface) 70%, transparent); border: 1px solid var(--wf-border); }
.crm-bld__t { display: inline-flex; align-items: center; gap: .5rem; margin-bottom: .8rem; font-size: .7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--wf-text-tertiary); }
.crm-bld__t i { color: var(--wf-primary); font-size: 1rem; }
.crm-bld__row { position: relative; display: flex; align-items: center; gap: .5rem; }
.crm-bld__b { flex: 1 1 0; min-width: 0; padding: .65rem .5rem; border-radius: 10px; text-align: center; font-size: .78rem; font-weight: 600; color: var(--wf-text-primary); background: color-mix(in srgb, var(--wf-primary) 14%, transparent); border: 1px solid color-mix(in srgb, var(--wf-primary) 40%, transparent); opacity: 0; scale: .8; }
.crm-bld__b:nth-of-type(3) { background: color-mix(in srgb, var(--wf-ai-ceci) 18%, transparent); border-color: color-mix(in srgb, var(--wf-ai-ceci) 45%, transparent); }
.crm-bld__a { flex: none; width: 1.1rem; height: 2px; background: var(--wf-border-strong); border-radius: 2px; }
.crm-slide.is-active .crm-bld__b { animation: crm-snap .55s var(--wf-spring) calc(1.9s + var(--k) * .55s) forwards; }
@keyframes crm-snap { to { opacity: 1; scale: 1; } }
.crm-bld__cur { position: absolute; left: 0; top: 30%; font-size: 1.4rem; color: var(--wf-text-primary); filter: drop-shadow(0 4px 8px color-mix(in srgb, var(--wf-primary-darker) 80%, transparent)); opacity: 0; }
.crm-slide.is-active .crm-bld__cur { animation: crm-cursor 2.4s ease-in-out 1.7s forwards; }
@keyframes crm-cursor { 0% { opacity: 0; left: 0; } 10% { opacity: 1; } 90% { opacity: 1; left: 74%; } 100% { opacity: 0; left: 79%; } }

/* ═══ Slide 5 — por que agora ═══ */
.crm-mg { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 1rem; align-items: center; }
.crm-mg__from { display: grid; gap: 1rem; }
.crm-mg__c { padding: 1.1rem 1.2rem; border-radius: 18px; background: color-mix(in srgb, var(--wf-bg-surface) 78%, transparent); border: 1px solid var(--wf-border-strong); }
.crm-mg__c h3 { display: flex; align-items: center; gap: .55rem; font-size: 1rem; letter-spacing: -.02em; color: var(--wf-text-primary); }
.crm-mg__c h3 i { color: var(--wf-warning-strong); font-size: 1.2rem; }
.crm-mg__c--ok h3 i { color: var(--wf-primary); }
.crm-mg__c--ok .crm-mg__chips span { border-style: solid; border-color: color-mix(in srgb, var(--wf-primary) 40%, transparent); color: var(--wf-text-primary); background: color-mix(in srgb, var(--wf-primary) 10%, transparent); }
.crm-mg__c { padding: .95rem 1.1rem; }
.crm-mg__chips { margin: .65rem 0 0; }
.crm-mg__from { gap: .8rem; }
.crm-mg__chips { display: flex; flex-wrap: wrap; gap: .4rem; margin: .8rem 0 .6rem; }
.crm-mg__chips span { padding: .25rem .65rem; border-radius: 99px; font-size: .74rem; color: var(--wf-text-secondary); background: color-mix(in srgb, var(--wf-text-primary) 6%, transparent); border: 1px dashed var(--wf-border-strong); }
.crm-mg__c p { font-size: .82rem; line-height: 1.5; color: var(--wf-text-tertiary); }
.crm-mg__arrow { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; font-size: 1.3rem; color: var(--wf-on-primary); background: var(--wf-primary); box-shadow: 0 0 26px color-mix(in srgb, var(--wf-primary) 55%, transparent); }
.crm-slide.is-active .crm-mg__arrow i { animation: crm-nudge 1.6s ease-in-out infinite; }
@keyframes crm-nudge { 50% { translate: 4px 0; } }
.crm-mg__to { position: relative; overflow: hidden; padding: 1.6rem 1.4rem; border-radius: 22px; background: radial-gradient(90% 80% at 30% 0%, color-mix(in srgb, var(--wf-ai-ceci) 34%, transparent), transparent 70%), linear-gradient(180deg, var(--wf-primary-dark), var(--wf-primary-darker)); border: 1px solid color-mix(in srgb, var(--wf-ai-ceci) 50%, var(--wf-border-strong)); box-shadow: 0 30px 80px color-mix(in srgb, var(--wf-ai-ceci) 28%, transparent); }
.crm-mg__badge { display: inline-flex; align-items: center; gap: .45rem; padding: .25rem .7rem; border-radius: 99px; font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--wf-text-primary); background: color-mix(in srgb, var(--wf-text-primary) 12%, transparent); }
.crm-mg__to h3 { margin: 1rem 0 1.1rem; font-size: 1.45rem; line-height: 1.12; letter-spacing: -.035em; color: var(--wf-text-primary); }
.crm-mg__to ul { display: grid; gap: .55rem; list-style: none; font-size: .88rem; color: var(--wf-text-primary); }
.crm-mg__to li { display: flex; align-items: center; gap: .55rem; }
.crm-mg__to li i { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; font-size: .8rem; color: var(--wf-bg-page); background: var(--wf-success-strong); }

/* ═══ Responsivo ═══ */
@media (max-width: 1100px) {
  .crm-jr { grid-template-columns: 1fr; gap: 0; }
  .crm-jr::before, .crm-jr::after { top: 27px; bottom: 27px; left: 26px; right: auto; width: 2px; height: auto; }
  .crm-jr::after { transform-origin: top; transform: scaleY(0); }
  .crm-slide.is-active .crm-jr::after { animation-name: crm-line-y; }
  @keyframes crm-line-y { to { transform: scaleY(1); } }
  .crm-st { display: grid; grid-template-columns: 54px minmax(0, 1fr); column-gap: 1rem; padding-bottom: 1.1rem; }
  .crm-st__ic { grid-row: 1 / span 3; }
  .crm-st h3 { margin: .1rem 0 .25rem; }
  .crm-st__tag { justify-self: start; margin-top: .3rem; }
}
@media (max-width: 960px) {
  .crm-deck { grid-template-rows: 58px minmax(0, 1fr) 60px; }
  .crm-slide__inner, .crm-slide--flip .crm-slide__inner, .crm-slide--wide .crm-slide__inner { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "viz" "bul" "pun"; padding: 1rem 1.25rem 1.5rem; row-gap: 1.4rem; }
  .crm-head { align-self: start; }
  .crm-arrow { display: none; }
  .crm-hint { display: none; }
  .crm-dots { height: 60px; gap: .1rem; }
  .crm-dot b { display: none; }
  .crm-dot { padding: .55rem .5rem; }
  .crm-mg { grid-template-columns: minmax(0, 1fr); }
  .crm-mg__arrow { justify-self: center; rotate: 90deg; }
  .crm-ag__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .crm-ag__row li::after { display: none; }
  .crm-cta--sm { display: none; }
  .crm-counter { position: static; translate: none; margin-left: auto; }
}
@media (max-width: 560px) {
  .crm-kb { padding: .7rem; --gap: .35rem; }
  .crm-kb__col { padding: .35rem; }
  .crm-kb__col h4 { font-size: .56rem; letter-spacing: .04em; }
  .crm-kb__card { left: calc(.7rem + .35rem); top: calc(.7rem + 1.5rem + .35rem + .5rem); width: calc((100% - 1.4rem - 3 * var(--gap)) / 4 - .7rem); }
  .crm-kb__card > span { flex-direction: column; }
  .crm-pill--wa { margin-left: 0; }
  .crm-bld__row { flex-wrap: wrap; }
  .crm-bld__a { display: none; }
  .crm-bld__b { flex: 1 1 45%; }
  .crm-bld__cur { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .crm-slide, .crm-in, .crm-bg span, .crm-progress i, .crm-kb__card { transition: none !important; }
  .crm-slide { filter: none; }
  .crm-in { opacity: 1; transform: none; }
  .crm-chip { animation: none !important; transform: translate(var(--ox), var(--oy)); }
  .crm-orbit__core, .crm-orbit__lines path, .crm-orbit__ring { animation: none !important; scale: 1; opacity: 1; }
  .crm-orbit__cap--a { display: none; } .crm-orbit__cap--b { opacity: 1; animation: none !important; }
  .crm-jr::after { animation: none !important; transform: none; }
  .crm-st__ic { animation: none !important; color: var(--wf-on-primary); background: var(--wf-primary); }
  .crm-st h3, .crm-st p, .crm-st__tag, .crm-tl li, .crm-ag__row li { opacity: 1 !important; transform: none; translate: none; transition: none !important; }
  .crm-bld__b { animation: none !important; opacity: 1; scale: 1; }
  .crm-bld__cur, .crm-mg__arrow i { display: none; }
}


/* ═══ Slide 6 — cases (3 colunas × 4 camadas alinhadas) ═══ */
.crm-slide--full .crm-slide__inner, .crm-slide--cases .crm-slide__inner { padding-top: .5rem; padding-bottom: .4rem; max-width: 1400px; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); grid-template-areas: "head pun" "viz viz"; row-gap: 1.25rem; align-items: end; }
.crm-slide--full .crm-title, .crm-slide--cases .crm-title { font-size: clamp(1.6rem, 2.7vw, 2.45rem); }
.crm-slide--full .crm-punch, .crm-slide--cases .crm-punch { align-self: end; font-size: clamp(1.05rem, 1.7vw, 1.4rem); }
.crm-cs { display: grid; grid-template-columns: 5.4rem repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(4, auto); column-gap: .9rem; }
.crm-cs__labs { grid-row: 1 / span 4; display: grid; grid-template-rows: subgrid; }
.crm-cs__lab { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: .35rem; padding: 0 .2rem; font-size: .68rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--wf-text-tertiary); border-top: 1px solid var(--wf-border); }
.crm-cs__lab:first-child { border-top: 0; }
.crm-cs__lab i { font-size: 1.35rem; color: var(--wf-primary); }
.crm-case { grid-row: 1 / span 4; display: grid; grid-template-rows: subgrid; min-width: 0; border-radius: 20px; overflow: hidden; background: color-mix(in srgb, var(--wf-bg-surface) 80%, transparent); border: 1px solid var(--wf-border-strong); box-shadow: 0 30px 70px color-mix(in srgb, var(--wf-primary-darker) 60%, transparent); transition: border-color .3s, transform .4s var(--ease); }
.crm-case:hover { border-color: color-mix(in srgb, var(--wf-primary) 55%, var(--wf-border-strong)); transform: translateY(-4px); }
.crm-case__c { min-width: 0; padding: .75rem 1rem; border-top: 1px solid var(--wf-border); font-size: .84rem; line-height: 1.55; }
.crm-case__c:first-child { border-top: 0; }
.crm-case__c p { color: var(--wf-text-secondary); }
.crm-case__c b { color: var(--wf-text-primary); font-weight: 600; }
.crm-case__k { display: none; margin-bottom: .35rem; font-size: .64rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--wf-text-tertiary); }
.crm-case__c--cli { display: flex; flex-direction: column; align-items: flex-start; gap: .55rem; background: linear-gradient(180deg, color-mix(in srgb, var(--wf-primary) 10%, transparent), transparent); }
.crm-logo { display: grid; place-items: center; min-height: 54px; width: 100%; padding: .55rem 1rem; border-radius: 12px; background: var(--wf-text-primary); color: var(--wf-primary-darker); font-family: var(--wf-display); font-weight: 800; font-size: 1.45rem; letter-spacing: -.03em; }
.crm-logo img { max-height: 36px; max-width: 80%; object-fit: contain; }
.crm-tag { display: inline-block; padding: .18rem .65rem; border-radius: 99px; font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; 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) 45%, transparent); }
.crm-case__go { display: inline-flex; align-items: center; gap: .35rem; margin-top: .55rem; font-size: .78rem; font-weight: 600; color: var(--wf-primary); }
.crm-case__go i { transition: transform .25s var(--ease); }
.crm-case__go:hover i { transform: translateX(3px); }
.crm-case__c--res { display: flex; flex-direction: column; align-items: flex-start; background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--wf-ai-ceci) 12%, transparent)); }
.crm-case__big { font-family: var(--wf-display); font-weight: 800; font-size: clamp(2.2rem, 3.6vw, 3.1rem); line-height: 1; letter-spacing: -.05em; background: linear-gradient(100deg, var(--wf-primary), var(--wf-ai-ceci)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.crm-case__cap { margin: .3rem 0 .6rem; font-size: .82rem; font-weight: 600; color: var(--wf-text-primary); }
.crm-case__c--res ul { display: grid; gap: .3rem; list-style: none; font-size: .8rem; color: var(--wf-text-secondary); }
.crm-case__c--res li { display: flex; align-items: center; gap: .45rem; }
.crm-case__c--res li i { color: var(--wf-success-strong); }
.crm-cs__note { margin-top: .5rem; text-align: center; font-size: .7rem; color: var(--wf-text-tertiary); }
.crm-slide .crm-case { opacity: 0; transform: translateY(24px); }
.crm-slide.is-active .crm-case { opacity: 1; transform: none; transition: opacity .7s ease calc(.7s + var(--k) * .22s), transform .8s var(--ease) calc(.7s + var(--k) * .22s), border-color .3s; }
.crm-slide.is-active .crm-case:hover { transition-delay: 0s; transform: translateY(-4px); }

/* ═══ Slide 7 — a arquitetura ═══ */
.crm-ar { position: relative; display: grid; justify-items: center; row-gap: 1.5rem; max-width: 620px; margin: 0 auto; }
.crm-ar__svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; z-index: 0; }
.crm-ar > :not(svg) { position: relative; z-index: 1; }
.crm-edge { fill: none; stroke: color-mix(in srgb, var(--wf-primary) 26%, var(--wf-border-strong)); stroke-width: 1.4; stroke-linecap: round; transition: stroke .3s, stroke-width .3s; }
.crm-edge.is-lit { stroke: var(--wf-primary); stroke-width: 2; stroke-dasharray: 6 8; animation: crm-flow .9s linear infinite; filter: drop-shadow(0 0 5px color-mix(in srgb, var(--wf-primary) 65%, transparent)); }
@keyframes crm-flow { to { stroke-dashoffset: -14; } }
.crm-nd { position: relative; display: flex; align-items: center; gap: .55rem; padding: .55rem .8rem; 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: .8rem; transition: border-color .3s, box-shadow .3s, transform .3s var(--ease); }
.crm-nd i { color: var(--wf-primary); font-size: 1.15rem; flex: none; }
.crm-nd b { font-family: var(--wf-display); font-size: .82rem; letter-spacing: -.01em; line-height: 1.2; }
.crm-nd:hover, .crm-nd:focus-visible, .crm-nd.is-lit { border-color: var(--wf-primary); box-shadow: 0 0 0 4px color-mix(in srgb, var(--wf-primary) 14%, transparent), 0 12px 30px color-mix(in srgb, var(--wf-primary) 26%, transparent); transform: translateY(-2px); }
.crm-nd.is-linked { border-color: color-mix(in srgb, var(--wf-primary) 60%, var(--wf-border-strong)); }
.crm-nd--pill { padding: .45rem 1.1rem; }
.crm-nd--fronts { flex-direction: column; align-items: stretch; gap: .5rem; width: 100%; }
.crm-nd--fronts small { text-align: center; font-size: .62rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--wf-text-tertiary); }
.crm-chips { display: flex; flex-wrap: wrap; gap: .35rem; justify-content: center; }
.crm-chips span { display: inline-flex; align-items: center; gap: .35rem; padding: .22rem .6rem; border-radius: 99px; font-size: .72rem; color: var(--wf-text-secondary); background: color-mix(in srgb, var(--wf-text-primary) 7%, transparent); border: 1px solid var(--wf-border); }
.crm-chips i { font-size: .95rem; }
.crm-chips--sm span { font-size: .68rem; padding: .18rem .55rem; }
.crm-chips__hot { color: var(--wf-text-primary) !important; background: color-mix(in srgb, var(--wf-ai-ceci) 24%, transparent) !important; border-color: color-mix(in srgb, var(--wf-ai-ceci) 55%, transparent) !important; }
.crm-chips__hot i { color: var(--wf-ai-ceci) !important; }
.crm-ar__band { position: relative; width: 100%; padding: 1.35rem .8rem .8rem; border: 1px dashed var(--wf-border-strong); border-radius: 20px; }
.crm-ar__bt { position: absolute; top: -.62rem; left: 50%; translate: -50% 0; padding: 0 .7rem; background: var(--wf-primary-darker); font-size: .6rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--wf-text-tertiary); white-space: nowrap; }
.crm-ar__grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: .9rem; }
.crm-ar__grid .crm-nd { flex-direction: column; justify-content: center; gap: .3rem; text-align: center; padding: .65rem .3rem; min-height: 4.6rem; }
.crm-ar__grid .crm-nd i { font-size: 1.3rem; }
.crm-nd em { font-style: normal; font-size: .58rem; letter-spacing: .04em; color: var(--wf-text-tertiary); line-height: 1.2; }
.crm-nd--crm { background: linear-gradient(180deg, color-mix(in srgb, var(--wf-primary) 26%, transparent), color-mix(in srgb, var(--wf-ai-ceci) 16%, transparent)); border-color: color-mix(in srgb, var(--wf-primary) 70%, transparent); box-shadow: 0 0 26px color-mix(in srgb, var(--wf-primary) 30%, transparent); }
.crm-nd--bus { width: 100%; flex-wrap: wrap; justify-content: center; gap: .4rem .8rem; padding: .7rem 1rem; background: linear-gradient(90deg, color-mix(in srgb, var(--wf-primary) 16%, transparent), color-mix(in srgb, var(--wf-bg-surface) 88%, transparent) 50%, color-mix(in srgb, var(--wf-primary) 16%, transparent)); border-color: color-mix(in srgb, var(--wf-primary) 48%, var(--wf-border-strong)); }
.crm-nd--bus .crm-nd__ic { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; font-size: 1.15rem; color: var(--wf-on-primary); background: var(--wf-primary); }
.crm-nd__t small { display: block; font-size: .66rem; color: var(--wf-text-tertiary); margin-top: .05rem; }
.crm-nd--ceci { 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); }
.crm-nd--ceci .crm-nd__ic { color: var(--wf-text-primary); background: linear-gradient(135deg, var(--wf-ai-ceci), var(--wf-primary)); }
.crm-nd--gov { width: 100%; justify-content: center; flex-wrap: wrap; border-style: dashed; padding: .5rem .9rem; }
.crm-tt { position: absolute; bottom: calc(100% + 10px); left: 50%; translate: -50% 6px; z-index: 30; width: max-content; max-width: min(250px, 72vw); padding: .65rem .8rem; border-radius: 12px; font-size: .74rem; font-weight: 400; line-height: 1.5; text-align: left; letter-spacing: 0; color: var(--wf-text-secondary); background: var(--wf-bg-surface); border: 1px solid var(--wf-border-strong); box-shadow: 0 18px 44px color-mix(in srgb, var(--wf-primary-darker) 70%, transparent); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .2s, translate .25s var(--ease), visibility .2s; }
.crm-nd:hover > .crm-tt, .crm-nd:focus-visible > .crm-tt { opacity: 1; visibility: visible; translate: -50% 0; }
.crm-ar__grid .crm-nd:first-child > .crm-tt { left: 0; translate: 0 6px; } .crm-ar__grid .crm-nd:first-child:hover > .crm-tt, .crm-ar__grid .crm-nd:first-child:focus-visible > .crm-tt { translate: 0 0; }
.crm-ar__grid .crm-nd:last-child > .crm-tt { left: auto; right: 0; translate: 0 6px; } .crm-ar__grid .crm-nd:last-child:hover > .crm-tt, .crm-ar__grid .crm-nd:last-child:focus-visible > .crm-tt { translate: 0 0; }
.crm-slide .crm-ar .crm-nd, .crm-slide .crm-ar__band, .crm-slide .crm-ar__svg { opacity: 0; }
.crm-slide.is-active .crm-ar__svg { opacity: 1; transition: opacity .8s ease 1s; }
.crm-slide.is-active .crm-ar .crm-nd, .crm-slide.is-active .crm-ar__band { opacity: 1; transition: opacity .6s ease calc(.5s + var(--o, 0) * .12s), border-color .3s, box-shadow .3s, transform .3s var(--ease); }

@media (max-width: 960px) {
  .crm-slide--cases .crm-slide__inner { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "pun" "viz"; align-items: start; }
  .crm-cs { grid-template-columns: minmax(0, 1fr); row-gap: 1rem; }
  .crm-cs__labs { display: none; }
  .crm-case { grid-row: auto; display: block; }
  .crm-case__k { display: block; }
  .crm-ag__bases { grid-template-columns: minmax(0, 1fr); }
  .crm-ar__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: .7rem; }
}
@supports not (grid-template-rows: subgrid) {
  .crm-cs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .crm-cs__labs { display: none; }
  .crm-case { grid-row: auto; display: block; }
  .crm-case__k { display: block; }
}
@media (prefers-reduced-motion: reduce) {
  .crm-slide .crm-case, .crm-slide .crm-ar .crm-nd, .crm-slide .crm-ar__band { opacity: 1 !important; transform: none; transition: none !important; }
}


/* ═══ Slide 1 — a ideia (mensagem principal + provocações) ═══ */
.crm-slide--idea .crm-title { font-size: clamp(1.55rem, 2.7vw, 2.4rem); line-height: 1.12; }
.crm-hl { font-style: normal; background: linear-gradient(100deg, var(--wf-primary), var(--wf-ai-ceci)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.crm-asks { gap: .7rem; }
.crm-asks li { font-size: clamp(.9rem, 1.1vw, 1rem); padding: .55rem .85rem; border-radius: 12px; background: color-mix(in srgb, var(--wf-text-primary) 5%, transparent); border: 1px solid var(--wf-border); }
.crm-asks li i { color: var(--wf-ai-ceci); }

/* ═══ Slide 3 — os 5 pilares ═══ */
.crm-pl { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .9rem; list-style: none; }
.crm-pl__c { position: relative; display: flex; flex-direction: column; gap: .65rem; padding: 1.25rem 1.1rem; border-radius: 18px; background: color-mix(in srgb, var(--wf-bg-surface) 82%, transparent); border: 1px solid var(--wf-border-strong); transition: border-color .3s, transform .4s var(--ease); }
.crm-pl__c:hover { border-color: color-mix(in srgb, var(--wf-primary) 55%, var(--wf-border-strong)); transform: translateY(-4px); }
.crm-pl__c::before { content: counter(pl, decimal-leading-zero); counter-increment: pl; position: absolute; top: .85rem; right: 1rem; font-family: var(--wf-display); font-weight: 800; font-size: .8rem; color: var(--wf-text-tertiary); opacity: .6; }
.crm-pl { counter-reset: pl; }
.crm-pl__ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; font-size: 1.35rem; color: var(--wf-text-primary); background: linear-gradient(135deg, var(--wf-ai-ceci), var(--wf-primary)); box-shadow: 0 0 22px color-mix(in srgb, var(--wf-ai-ceci) 40%, transparent); }
.crm-pl__c h3 { font-size: 1.1rem; line-height: 1.2; letter-spacing: -.02em; color: var(--wf-text-primary); }
.crm-pl__c p { font-size: .88rem; line-height: 1.5; }
.crm-pl__v { margin-top: auto; padding-top: .7rem; border-top: 1px solid var(--wf-border); }
.crm-pl__v small { display: block; font-size: .6rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--wf-text-tertiary); }
.crm-pl__v b { display: block; margin: .2rem 0 .55rem; font-size: .92rem; line-height: 1.3; color: var(--wf-text-primary); }
.crm-pl__tags { display: flex; flex-wrap: wrap; gap: .3rem; }
.crm-pl__tags em { font-style: normal; padding: .16rem .55rem; border-radius: 99px; font-size: .66rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--wf-text-primary); background: color-mix(in srgb, var(--wf-primary) 18%, transparent); border: 1px solid color-mix(in srgb, var(--wf-primary) 42%, transparent); }
.crm-slide .crm-pl__c { opacity: 0; transform: translateY(22px); }
.crm-slide.is-active .crm-pl__c { opacity: 1; transform: none; transition: opacity .6s ease calc(.7s + var(--k) * .16s), transform .8s var(--ease) calc(.7s + var(--k) * .16s), border-color .3s; }
.crm-slide.is-active .crm-pl__c:hover { transition-delay: 0s; transform: translateY(-4px); }

/* ═══ Slide 4 — tradicional × inteligente ═══ */
.crm-vs { display: grid; gap: .6rem; max-width: 600px; margin: 0 auto; }
.crm-vs__h, .crm-vs__r { display: grid; grid-template-columns: minmax(0, 1fr) 2.2rem minmax(0, 1.08fr); align-items: center; gap: .5rem; }
.crm-vs__h span { padding: 0 .9rem; font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--wf-text-tertiary); }
.crm-vs__h span:last-child { color: var(--wf-primary); }
.crm-vs__a, .crm-vs__b { padding: .95rem 1rem; border-radius: 14px; font-size: .95rem; }
.crm-vs__a { color: var(--wf-text-tertiary); background: color-mix(in srgb, var(--wf-text-primary) 4%, transparent); border: 1px dashed var(--wf-border-strong); text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--wf-text-tertiary) 60%, transparent); }
.crm-vs__b { font-family: var(--wf-display); font-weight: 700; font-size: 1.02rem; letter-spacing: -.02em; color: var(--wf-text-primary); background: linear-gradient(90deg, color-mix(in srgb, var(--wf-primary) 20%, transparent), color-mix(in srgb, var(--wf-ai-ceci) 18%, transparent)); border: 1px solid color-mix(in srgb, var(--wf-primary) 50%, transparent); box-shadow: 0 0 24px color-mix(in srgb, var(--wf-primary) 20%, transparent); }
.crm-vs__r > i { display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: 50%; font-size: 1.05rem; color: var(--wf-on-primary); background: var(--wf-primary); }
.crm-slide .crm-vs__r { opacity: 0; transform: translateX(-16px); }
.crm-slide.is-active .crm-vs__r { opacity: 1; transform: none; transition: opacity .6s ease calc(.8s + var(--k) * .28s), transform .7s var(--ease) calc(.8s + var(--k) * .28s); }
.crm-slide.is-active .crm-vs__a { animation: crm-strike .5s ease calc(1.3s + var(--k) * .28s) both; }
@keyframes crm-strike { from { opacity: 1; } to { opacity: .55; } }

/* ═══ Slide 5 — módulos da ficha do cliente ═══ */
.crm-mods { display: flex; flex-wrap: wrap; gap: .3rem; padding: .6rem 1.1rem 0; }
.crm-mods span { padding: .16rem .6rem; border-radius: 99px; font-size: .68rem; font-weight: 600; color: var(--wf-text-tertiary); background: color-mix(in srgb, var(--wf-text-primary) 5%, transparent); border: 1px solid var(--wf-border); }
.crm-mods span.is-on { 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); }
.crm-kb__cap { padding: .5rem 1.1rem 0; font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--wf-text-secondary); }
.crm-kb__cap em { font-style: normal; color: var(--wf-text-tertiary); }
.crm-kb { padding-top: .5rem; }
.crm-kb__card { top: calc(.5rem + 1.62rem + .55rem + .5rem); }

/* ═══ Slide 8 — 4 cases ═══ */
.crm-cs { grid-template-columns: 4.4rem repeat(4, minmax(0, 1fr)); column-gap: .8rem; }
.crm-cs .crm-case__c { padding: .65rem .85rem; font-size: .78rem; line-height: 1.5; }
.crm-cs .crm-logo { min-height: 46px; font-size: 1.3rem; padding: .4rem .8rem; }
.crm-cs .crm-tag { font-size: .62rem; }
.crm-cs .crm-case__big { font-size: clamp(2rem, 2.9vw, 2.7rem); }
.crm-cs .crm-case__cap { font-size: .78rem; }
.crm-cs .crm-case__c--res ul { font-size: .76rem; }
.crm-cs__lab { font-size: .6rem; }

/* ═══ Slide 9 — CRM como camada entre front e estúdios ═══ */
.crm-ar__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.crm-nd--crm { width: 100%; justify-content: center; gap: .7rem; padding: .7rem 1rem; }
.crm-nd--crm i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; font-size: 1.15rem; color: var(--wf-on-primary); background: var(--wf-primary); }

@media (max-width: 1199px) {
  .crm-cs { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1rem; }
  .crm-cs__labs { display: none; }
  .crm-case { grid-row: auto; display: block; }
  .crm-case__k { display: block; }
  .crm-pl { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .crm-dot:not(.is-on) b { display: none; }
}
@media (max-width: 960px) {
  .crm-cs { grid-template-columns: minmax(0, 1fr); }
  .crm-pl { grid-template-columns: minmax(0, 1fr); }
  .crm-vs__h, .crm-vs__r { grid-template-columns: minmax(0, 1fr) 1.8rem minmax(0, 1fr); }
  .crm-vs__a, .crm-vs__b { padding: .7rem .7rem; font-size: .84rem; }
  .crm-ar__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .crm-tt { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .crm-slide .crm-pl__c, .crm-slide .crm-vs__r { opacity: 1 !important; transform: none; transition: none !important; }
  .crm-vs__a { animation: none !important; }
}


/* ═══ Último slide — apresentação + QR Code do WhatsApp ═══ */
.crm-me { display: flex; align-items: center; gap: 1.4rem; padding: 1.25rem 0 0; border-top: 1px solid color-mix(in srgb, var(--wf-text-primary) 32%, transparent); background: none; border-radius: 0; box-shadow: none; }
.crm-qr { flex: none; display: grid; justify-items: center; gap: .55rem; transition: transform .35s var(--ease); }
.crm-qr:hover { transform: translateY(-3px) scale(1.02); }
.crm-qr__tile { position: relative; display: block; width: 8.2rem; aspect-ratio: 1; padding: 1rem; border-radius: 16px; background: var(--wf-text-primary); color: var(--wf-primary-darker);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--wf-primary) 38%, transparent), 0 0 44px color-mix(in srgb, var(--wf-ai-ceci) 50%, transparent); animation: crm-qr-glow 3.6s ease-in-out infinite; }
.crm-qr__tile::before, .crm-qr__tile::after { content: ""; position: absolute; width: 1.1rem; height: 1.1rem; border: 3px solid var(--wf-primary); }
.crm-qr__tile::before { top: -.55rem; left: -.55rem; border-right: 0; border-bottom: 0; border-radius: 8px 0 0 0; }
.crm-qr__tile::after { right: -.55rem; bottom: -.55rem; border-left: 0; border-top: 0; border-radius: 0 0 8px 0; }
@keyframes crm-qr-glow { 50% { box-shadow: 0 0 0 7px color-mix(in srgb, var(--wf-primary) 22%, transparent), 0 0 62px color-mix(in srgb, var(--wf-ai-ceci) 68%, transparent); } }
.crm-qr__svg { display: block; width: 100%; height: 100%; }
.crm-qr__cap { display: inline-flex; align-items: center; gap: .4rem; font-size: .74rem; font-weight: 700; letter-spacing: .02em; color: var(--wf-text-primary); }
.crm-qr__cap i { font-size: 1.05rem; color: var(--wf-success-strong); }
.crm-me__id { min-width: 0; display: grid; gap: .3rem; }
.crm-me__name { font-family: var(--wf-display); font-size: clamp(1.25rem, 1.9vw, 1.7rem); font-weight: 800; letter-spacing: -.03em; line-height: 1.1; color: var(--wf-text-primary); }
.crm-me__role { font-size: .88rem; font-weight: 600; color: color-mix(in srgb, var(--wf-primary) 85%, var(--wf-text-primary)); margin-bottom: .45rem; }
.crm-me__l { display: inline-flex; align-items: center; gap: .5rem; font-size: .84rem; color: var(--wf-text-secondary); transition: color .2s; overflow-wrap: anywhere; }
.crm-me__l i { font-size: 1.05rem; color: var(--wf-primary); flex: none; }
.crm-me__l:hover { color: var(--wf-text-primary); }
@media (max-width: 560px) { .crm-me { flex-direction: column; align-items: flex-start; } .crm-qr { align-self: center; } }
@media (prefers-reduced-motion: reduce) { .crm-qr__tile { animation: none; } }


/* ═══ Modo apresentação (controle remoto): tela preta/branca, ir para o slide, cursor ocioso ═══ */
.crm-blank { position: fixed; inset: 0; z-index: 2000; }
.crm-blank[hidden] { display: none; }
.crm-blank[data-mode="black"] { background: black; cursor: none; }
.crm-blank[data-mode="white"] { background: white; cursor: none; }
.crm-jump { position: absolute; left: 50%; bottom: 84px; translate: -50% 0; z-index: 6; padding: .55rem 1.1rem; border-radius: 99px; font-size: .9rem; font-weight: 700; letter-spacing: .02em; white-space: pre; color: var(--wf-on-primary); background: var(--wf-primary); box-shadow: 0 10px 34px color-mix(in srgb, var(--wf-primary) 45%, transparent); opacity: 0; pointer-events: none; transition: opacity .25s; }
.crm-jump.is-on { opacity: 1; }
.crm-deck.is-idle, .crm-deck.is-idle * { cursor: none; }
.crm-deck.is-idle .crm-arrow, .crm-deck.is-idle .crm-hint { opacity: 0; }


/* ═══ Último slide — compacto + faixa "nossos clientes" (3 por vez, em laço) ═══ */
.crm-slide--clients .crm-slide__inner { grid-template-areas: "viz head" "viz bul" "viz pun" "cli cli"; row-gap: .85rem; }
.crm-slide--clients .crm-title { font-size: clamp(1.45rem, 2.3vw, 2.1rem); line-height: 1.08; }
.crm-slide--clients .crm-bullets { gap: .45rem; }
.crm-slide--clients .crm-bullets li { font-size: clamp(.8rem, .95vw, .88rem); line-height: 1.4; }
.crm-slide--clients .crm-final { gap: .85rem; }
.crm-slide--clients .crm-final .crm-punch { font-size: clamp(1.05rem, 1.6vw, 1.35rem); }
.crm-slide--clients .crm-qr__tile { width: 6.6rem; padding: .8rem; }
.crm-slide--clients .crm-me { padding-top: 1rem; gap: 1.1rem; }
.crm-slide--clients .crm-me__role { margin-bottom: .25rem; }
.crm-clients { grid-area: cli; display: flex; align-items: center; gap: 1.6rem; padding-top: .75rem; border-top: 1px solid color-mix(in srgb, var(--wf-text-primary) 32%, transparent); }
.crm-clients__t { flex: none; font-size: .64rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; line-height: 1.5; color: var(--wf-text-tertiary); }
.crm-cl { flex: 1; min-width: 0; min-height: 2.4rem; display: flex; align-items: center; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, black 6%, black 94%, transparent); mask-image: linear-gradient(90deg, transparent, black 6%, black 94%, transparent); }
.crm-cl__track { display: flex; width: 100%; transition: transform .95s var(--ease); will-change: transform; }
.crm-cl__p { flex: 0 0 100%; display: flex; align-items: center; justify-content: center; }
.crm-cl__i { position: relative; flex: 1 1 0; text-align: center; white-space: nowrap; font-family: var(--wf-display); font-weight: 800; font-size: clamp(1.1rem, 1.7vw, 1.55rem); letter-spacing: -.03em; color: var(--wf-text-secondary);
  opacity: 0; transform: translateY(12px); transition: opacity .6s ease calc(var(--n) * .14s + .3s), transform .7s var(--ease) calc(var(--n) * .14s + .3s); }
.crm-cl__i + .crm-cl__i::before { content: ""; position: absolute; left: 0; top: 18%; bottom: 18%; width: 1px; background: var(--wf-border-strong); }
.crm-cl__p.is-cur .crm-cl__i { opacity: 1; transform: none; }
.crm-cl.is-reset .crm-cl__i, .crm-cl.is-reset .crm-cl__track { transition: none; }
@media (max-width: 960px) {
  .crm-slide--clients .crm-slide__inner { grid-template-areas: "head" "viz" "bul" "pun" "cli"; }
  .crm-slide--clients .crm-title { font-size: clamp(1.7rem, 6vw, 2.2rem); }
  .crm-slide--clients .crm-bullets li { font-size: .92rem; }
  .crm-clients { flex-direction: column; align-items: flex-start; gap: .5rem; }
  .crm-clients .crm-cl { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .crm-cl__track { transition: none !important; }
  .crm-cl__i { opacity: 1 !important; transform: none !important; transition: none !important; }
}


/* ═══ Slide 9 — case especial Hyundai (tela dividida: destaque à esquerda, demais cases reduzidos à direita) ═══ */
.crm-slide--split .crm-slide__inner { max-width: 1400px; grid-template-columns: minmax(0, 1.62fr) minmax(0, .86fr); grid-template-areas: "hy side"; align-items: stretch; column-gap: 1.3rem; padding-top: .5rem; padding-bottom: .5rem; }
.crm-hy { grid-area: hy; display: grid; grid-template-columns: 17rem minmax(0, 1fr); min-width: 0; border-radius: 24px; overflow: hidden;
  background: radial-gradient(70% 60% at 100% 0%, color-mix(in srgb, var(--wf-ai-ceci) 22%, transparent), transparent 70%), linear-gradient(180deg, color-mix(in srgb, var(--wf-bg-surface) 88%, transparent), var(--wf-primary-darker));
  border: 1px solid color-mix(in srgb, var(--wf-primary) 55%, var(--wf-border-strong)); box-shadow: 0 40px 90px color-mix(in srgb, var(--wf-primary-darker) 70%, transparent), 0 0 70px color-mix(in srgb, var(--wf-ai-ceci) 22%, transparent); }
.crm-hy__rail { display: flex; flex-direction: column; gap: .9rem; padding: 1.1rem 0 1.1rem 1.1rem; min-width: 0; }
.crm-hy__ph { position: relative; margin: 0; aspect-ratio: 4 / 5; border-radius: 16px; overflow: hidden; border: 1px solid var(--wf-border-strong); }
.crm-hy__ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 58%; transform: scale(1.1); transition: transform 7s var(--ease); }
.crm-slide.is-active .crm-hy__ph img { transform: scale(1); }
.crm-hy__ph::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, color-mix(in srgb, var(--wf-primary-darker) 92%, transparent)); pointer-events: none; }
.crm-hy__ph figcaption { position: absolute; z-index: 1; left: .8rem; right: .8rem; bottom: .7rem; display: grid; gap: .1rem; color: var(--wf-text-primary); }
.crm-hy__ph figcaption b { font-size: .8rem; line-height: 1.25; }
.crm-hy__ph figcaption span { font-size: .66rem; line-height: 1.3; color: var(--wf-text-secondary); }
.crm-hy__chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.crm-hy__chip { display: inline-flex; align-items: center; gap: .4rem; padding: .28rem .7rem; border-radius: 99px; font-size: .72rem; font-weight: 600; color: var(--wf-text-secondary); background: color-mix(in srgb, var(--wf-text-primary) 7%, transparent); border: 1px solid var(--wf-border-strong); }
.crm-hy__chip i { color: var(--wf-primary); font-size: .95rem; }
.crm-hy__chip--hot { color: var(--wf-text-primary); background: color-mix(in srgb, var(--wf-ai-ceci) 24%, transparent); border-color: color-mix(in srgb, var(--wf-ai-ceci) 55%, transparent); }
.crm-hy__chip--hot i { color: var(--wf-ai-ceci); }
.crm-hy__soon { margin-top: auto; display: flex; flex-direction: column; gap: .35rem; padding: .75rem .85rem; border-radius: 14px; font-size: .78rem; line-height: 1.45; color: var(--wf-text-secondary); background: color-mix(in srgb, var(--wf-primary) 10%, transparent); border: 1px dashed color-mix(in srgb, var(--wf-primary) 50%, transparent); }
.crm-hy__soon span { align-self: flex-start; padding: .1rem .55rem; border-radius: 99px; font-size: .62rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--wf-on-primary); background: var(--wf-primary); }
.crm-hy__body { display: flex; flex-direction: column; gap: .7rem; padding: 1.5rem 1.6rem 1.3rem; min-width: 0; }
.crm-hy__title { margin: .1rem 0 .1rem; font-size: clamp(1.5rem, 2.4vw, 2.15rem); line-height: 1.08; letter-spacing: -.04em; color: var(--wf-text-primary); text-wrap: balance; }
.crm-hy__blk { padding-top: .7rem; border-top: 1px solid var(--wf-border); }
.crm-hy__k { display: inline-flex; align-items: center; gap: .45rem; margin-bottom: .3rem; font-size: .66rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: var(--wf-text-tertiary); }
.crm-hy__k i { font-size: 1rem; color: var(--wf-primary); }
.crm-hy__blk p { font-size: .84rem; line-height: 1.55; color: var(--wf-text-secondary); }
.crm-hy__blk p b { color: var(--wf-text-primary); font-weight: 600; }
.crm-hy__blk--res { margin-top: auto; }
.crm-hy__blk--res ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem .9rem; list-style: none; }
.crm-hy__blk--res li { display: flex; align-items: flex-start; gap: .5rem; padding: .55rem .65rem; border-radius: 12px; font-size: .8rem; line-height: 1.4; color: var(--wf-text-primary); background: linear-gradient(90deg, color-mix(in srgb, var(--wf-primary) 16%, transparent), color-mix(in srgb, var(--wf-ai-ceci) 12%, transparent)); border: 1px solid color-mix(in srgb, var(--wf-primary) 38%, transparent); }
.crm-hy__blk--res li i { flex: none; display: grid; place-items: center; width: 18px; height: 18px; margin-top: .05rem; border-radius: 50%; font-size: .7rem; color: var(--wf-bg-page); background: var(--wf-success-strong); }
.crm-slide .crm-hy__blk--res li { opacity: 0; transform: translateY(10px); }
.crm-slide.is-active .crm-hy__blk--res li { opacity: 1; transform: none; transition: opacity .6s ease calc(1s + var(--k) * .2s), transform .7s var(--ease) calc(1s + var(--k) * .2s); }

.crm-side { grid-area: side; display: flex; flex-direction: column; gap: .65rem; min-width: 0; }
.crm-side__t { font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--wf-text-tertiary); padding: 0 .2rem; }
.crm-side__n { font-size: .68rem; text-align: center; color: var(--wf-text-tertiary); }
.crm-mc { flex: 1; display: grid; grid-template-columns: 5.2rem minmax(0, 1fr); gap: .85rem; align-items: center; padding: .7rem .85rem; border-radius: 16px; background: color-mix(in srgb, var(--wf-bg-surface) 78%, transparent); border: 1px solid var(--wf-border-strong); transition: border-color .3s, transform .4s var(--ease); }
.crm-mc:hover { border-color: color-mix(in srgb, var(--wf-primary) 55%, var(--wf-border-strong)); transform: translateX(-3px); }
.crm-logo--sm { min-height: 0; height: 2.5rem; padding: .3rem .4rem; font-size: 1rem; border-radius: 10px; }
.crm-mc .crm-tag { font-size: .58rem; padding: .12rem .5rem; }
.crm-mc p { margin: .3rem 0 .1rem; font-size: .82rem; line-height: 1.3; color: var(--wf-text-primary); }
.crm-mc strong { font-family: var(--wf-display); font-size: 1.3rem; font-weight: 800; letter-spacing: -.04em; margin-right: .15rem; background: linear-gradient(100deg, var(--wf-primary), var(--wf-ai-ceci)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.crm-mc small { display: block; font-size: .7rem; line-height: 1.35; color: var(--wf-text-tertiary); }
.crm-slide .crm-mc { opacity: 0; transform: translateX(18px); }
.crm-slide.is-active .crm-mc { opacity: 1; transform: none; transition: opacity .6s ease calc(1s + var(--k) * .18s), transform .7s var(--ease) calc(1s + var(--k) * .18s), border-color .3s; }
.crm-slide.is-active .crm-mc:hover { transform: translateX(-3px); transition-delay: 0s; }

@media (max-width: 960px) {
  .crm-slide--split .crm-slide__inner { grid-template-columns: minmax(0, 1fr); grid-template-areas: "hy" "side"; align-items: start; }
  .crm-hy { grid-template-columns: minmax(0, 1fr); }
  .crm-hy { display: flex; flex-direction: column; }
  .crm-hy__rail { display: contents; }
  .crm-hy__ph { order: 1; margin: 1rem 1rem 0; aspect-ratio: 4 / 3; }
  .crm-hy__body { order: 2; }
  .crm-hy__chips { order: 3; margin: 0 1.6rem; }
  .crm-hy__soon { order: 4; margin: 1rem 1.6rem 1.4rem; }
  .crm-hy__blk--res ul { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .crm-hy__ph img { transform: none !important; transition: none !important; }
  .crm-slide .crm-hy__blk--res li, .crm-slide .crm-mc { opacity: 1 !important; transform: none; transition: none !important; }
}


/* ═══ Slide 3 — o maior desafio + visão de omnichannel ═══ */
.crm-note { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: 1.6rem; margin-top: 1.1rem; padding-top: 1.1rem; border-top: 1px solid color-mix(in srgb, var(--wf-text-primary) 32%, transparent); }
.crm-note__c { min-width: 0; padding-left: 1rem; border-left: 3px solid var(--wf-warning-strong); }
.crm-note__c--om { border-left-color: var(--wf-ai-ceci); }
.crm-note__k { display: inline-flex; align-items: center; gap: .45rem; font-size: .66rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: var(--wf-warning-strong); }
.crm-note__c--om .crm-note__k { color: color-mix(in srgb, var(--wf-ai-ceci) 55%, var(--wf-text-primary)); }
.crm-note__k i { font-size: 1.05rem; }
.crm-note h3 { margin: .3rem 0 .35rem; font-size: clamp(1.05rem, 1.5vw, 1.3rem); line-height: 1.2; letter-spacing: -.03em; color: var(--wf-text-primary); }
.crm-note p { font-size: .84rem; line-height: 1.55; color: var(--wf-text-secondary); }
.crm-note p b { color: var(--wf-text-primary); font-weight: 600; }
.crm-note__chain { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; margin-top: .65rem; }
.crm-note__chain span { padding: .2rem .65rem; border-radius: 99px; font-size: .7rem; font-weight: 700; color: var(--wf-text-primary); background: color-mix(in srgb, var(--wf-primary) 20%, transparent); border: 1px solid color-mix(in srgb, var(--wf-primary) 50%, transparent); }
.crm-note__chain i { width: .9rem; height: 2px; border-radius: 2px; background: linear-gradient(90deg, var(--wf-primary), var(--wf-ai-ceci)); }
.crm-note__chain em { margin-left: .5rem; font-style: normal; font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: color-mix(in srgb, var(--wf-ai-ceci) 55%, var(--wf-text-primary)); }
.crm-slide .crm-note { opacity: 0; transform: translateY(16px); }
.crm-slide.is-active .crm-note { opacity: 1; transform: none; transition: opacity .7s ease 1.7s, transform .8s var(--ease) 1.7s; }
@media (max-width: 960px) { .crm-note { grid-template-columns: minmax(0, 1fr); gap: 1.1rem; } }
@media (prefers-reduced-motion: reduce) { .crm-slide .crm-note { opacity: 1 !important; transform: none; transition: none !important; } }
