/* CloudZory fase 4A: /planos/ e /segmentos/. Só transform e opacity animam. */
.p4 [hidden]{display:none!important}
.p4-hero .hero-g{grid-template-columns:minmax(0,1fr)}
.p4-hero .hero-t{max-width:46rem}
@media (min-width:1024px){.p4-hero .hero-g{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}}
.p4-side{width:100%}
.ck,.pl svg,.inc svg,ul.dlv svg{flex:none;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}

/* degraus do hero */
.lad{max-width:560px}
.ld{display:grid;grid-template-columns:repeat(3,1fr);align-items:end;gap:10px;padding:22px 18px 18px;height:230px;background:var(--cz-nevoa)}
.ls{display:flex;flex-direction:column;justify-content:flex-end;padding:12px;border-radius:12px;color:#fff;transform-origin:bottom;min-width:0}
.ls b{font-size:.9375rem;overflow-wrap:anywhere}.ls small{font-size:.75rem;opacity:1}
.l1{height:42%;background:var(--cz-azul-horizonte)}.l2{height:68%;background:var(--cz-turquesa-profundo)}.l3{height:100%;background:var(--cz-verde-profundo)}
.anim .lad .ls{animation:ladup 7s var(--e) infinite both}
.anim .lad .l2{animation-delay:.25s}.anim .lad .l3{animation-delay:.5s}
@keyframes ladup{0%{transform:scaleY(.2);opacity:0}12%,88%{transform:none;opacity:1}100%{transform:scaleY(.2);opacity:0}}

/* cartões de plano */
.plans{background:var(--cz-nevoa);padding:clamp(56px,8vw,104px) 0}
.pg{display:grid;gap:16px}
@media (min-width:900px){.pg{grid-template-columns:repeat(3,1fr);gap:20px}}
.plan{position:relative;display:flex;flex-direction:column;padding:28px 24px 24px;border-radius:22px;background:#fff;border:1px solid var(--line)}
.plan::after{content:"";position:absolute;inset:-2px;border-radius:24px;border:3px solid var(--cz-verde-aurora);box-shadow:0 18px 48px -16px rgba(6,72,63,.45);opacity:0;pointer-events:none}
.plan.is-rec::after{opacity:1}
.anim .plan::after{transition:opacity 240ms var(--p)}
.pbadge{position:absolute;top:-14px;right:20px;padding:5px 12px;border-radius:999px;background:var(--cz-verde-profundo);color:#fff;font-size:.75rem;font-weight:700;opacity:0}
.plan.is-rec .pbadge{opacity:1}
.anim .pbadge{transition:opacity 240ms var(--p)}
.pno{display:grid;place-items:center;width:36px;height:36px;margin-bottom:14px;border-radius:50%;background:var(--cz-verde-profundo);color:#fff;font-weight:800}
.plan h3{font-size:1.5rem;margin-bottom:6px}
.ptag{color:var(--ink2);margin-bottom:14px}
.pinc,.plan .pinc{font-size:.875rem;font-weight:700;color:var(--cz-turquesa-profundo);margin-bottom:12px}
.pl{list-style:none;margin:0 0 24px;padding:0;display:grid;gap:10px;flex:1}
.pl li{display:flex;gap:10px;align-items:flex-start;color:var(--ink)}
.pl svg{color:var(--cz-turquesa-profundo);margin-top:2px}
.plan .btn{width:100%}

/* créditos */
.cred{background:var(--cz-ceu-da-manha);padding:clamp(56px,8vw,96px) 0}
.cg{display:grid;gap:32px}
@media (min-width:900px){.cg{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:start}}
.cred h2{font-size:clamp(1.625rem,6.4vw,2.5rem);margin-top:10px;color:var(--cz-noite-de-antes)}
.cl{margin-top:16px;font-size:1.0625rem;color:#2C3E50}
.cs3{list-style:none;margin:0;padding:0;display:grid;gap:12px;counter-reset:c}
.cs3 li{counter-increment:c;display:flex;gap:14px;align-items:center;padding:16px 18px;border-radius:16px;background:#fff;border:1px solid rgba(15,42,68,.12)}
.cs3 li::before{content:counter(c);flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--cz-noite-de-antes);color:#fff;font-weight:800}
.cn{margin-top:18px;color:#2C3E50}
.cout{margin-top:14px;padding:16px 18px;border-radius:14px;background:rgba(255,255,255,.6);border-left:5px solid var(--cz-azul-horizonte);color:#2C3E50;font-size:.9375rem}

/* simulador */
.sim{background:var(--cz-nevoa);padding:clamp(56px,8vw,104px) 0}
.sim-static{max-width:42rem;padding:22px;border-radius:18px;background:#fff;border:1px solid var(--line)}
.sim-static p{margin-bottom:16px;color:var(--ink2)}
.sim-app{display:none}
.js .sim-app{display:grid;gap:20px}
.js .sim-static{display:none}
@media (min-width:1024px){.js .sim-app{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:28px;align-items:start}.res{position:sticky;top:92px}}
.sim-in{padding:clamp(20px,3vw,32px);border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:0 20px 50px -30px rgba(10,26,36,.35)}
.blk-h{display:flex;align-items:center;gap:12px;margin:0 0 18px}
.blk-h h3{font-size:1.25rem}
.blk-h:not(:first-child){margin-top:30px;padding-top:26px;border-top:1px solid var(--line)}
.bn{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--cz-verde-profundo);color:#fff;font-weight:800;font-size:.9375rem}
.q{border:0;margin:0 0 22px;padding:0;min-width:0}
.ql{font-weight:700;font-size:1.0625rem;line-height:1.35;padding:0;color:var(--ink)}
.qh{margin:4px 0 10px;font-size:.9375rem;color:var(--ink2)}
.stp{display:flex;align-items:stretch;gap:8px;max-width:420px}
.sb{flex:none;width:52px;min-height:52px;border-radius:14px;border:2px solid var(--cz-verde-profundo);background:#fff;color:var(--cz-verde-profundo);font:700 1.5rem/1 var(--f);cursor:pointer}
.sb:hover{background:rgba(6,72,63,.07)}.sb:active{transform:scale(.96)}
.sb[aria-disabled=true]{opacity:.4;cursor:default}
.sv{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:52px;padding:6px 10px;border-radius:14px;background:var(--cz-areia-clara);border:1px solid var(--line)}
.svt{font-weight:800;font-size:1.125rem}.svt.un{color:var(--cz-grafite-suave);font-weight:600}
.sdots{display:flex;gap:6px}.sdots i{width:22px;height:5px;border-radius:3px;background:var(--cz-bruma)}.sdots i.on{background:var(--cz-turquesa-profundo)}
.vsegs{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
@media (min-width:600px){.vsegs{grid-template-columns:repeat(4,1fr)}}
.vseg{position:relative;display:block}
.vseg input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:pointer}
.vseg span{display:flex;align-items:center;justify-content:center;text-align:center;min-height:52px;padding:8px 10px;border-radius:14px;border:2px solid var(--line);background:#fff;font-weight:700;font-size:.9375rem;line-height:1.25}
.vseg input:checked+span{border-color:var(--cz-verde-profundo);background:var(--cz-verde-profundo);color:#fff}
.vseg input:focus-visible+span{outline:3px solid var(--cz-turquesa-circuito);outline-offset:3px}
.ex{display:flex;flex-wrap:wrap;gap:8px;align-items:center;color:var(--ink2);font-size:.9375rem}
.chip{min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid var(--cz-turquesa-profundo);background:transparent;color:var(--cz-turquesa-profundo);font:700 .875rem/1 var(--f);cursor:pointer}
.chip:hover{background:rgba(10,110,104,.08)}
.sws-g{display:grid;gap:10px}
@media (min-width:700px){.sws-g{grid-template-columns:1fr 1fr}}
.sw{position:relative;display:flex;gap:12px;align-items:flex-start;min-height:64px;padding:14px;border-radius:16px;border:1.5px solid var(--line);background:#fff;cursor:pointer}
.sw input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:pointer}
.swt{flex:none;position:relative;width:48px;height:28px;margin-top:2px;border-radius:14px;background:var(--cz-bruma-funda)}
.swt i{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.sw input:checked~.swt{background:var(--cz-verde-profundo)}
.sw input:checked~.swt i{transform:translateX(20px)}
.sw:has(input:checked){border-color:var(--cz-verde-profundo);background:#F2FAF6}
.sw:has(input:focus-visible){outline:3px solid var(--cz-turquesa-circuito);outline-offset:3px}
.anim .swt i{transition:transform 200ms var(--e)}
.anim .sw input:checked~.swt{transition:none}
.sws b{display:block;font-size:1rem;line-height:1.3}.sws small{display:block;margin-top:3px;font-size:.875rem;color:var(--ink2);line-height:1.4}

/* resultado */
.res{border-radius:24px;background:var(--cz-noite-de-antes);color:#fff;padding:clamp(22px,3vw,32px);box-shadow:0 30px 70px -28px rgba(10,26,36,.6);position:relative;overflow:hidden}
@media (min-width:1024px){.res{position:sticky;top:92px}}
.res::before{content:"";position:absolute;right:-90px;top:-90px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(242,181,68,.45),rgba(251,145,55,0) 70%);pointer-events:none}
.res>*{position:relative}
.res-empty{padding:28px 4px;font-size:1.0625rem;color:#DCEEF8}
.res-k{font-size:.8125rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--cz-turquesa-luz)}
.res-t{margin:8px 0 8px;font-size:clamp(1.375rem,5vw,1.75rem);line-height:1.2;color:#fff}
.res-t b{color:var(--cz-luz-do-sol)}
.res-x{color:#DCEEF8;font-size:1rem}
.trk{list-style:none;margin:16px 0 18px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.trk li{padding:10px 6px;border-radius:12px;text-align:center;font-weight:700;font-size:.8125rem;background:rgba(255,255,255,.08);color:#B4C4CA;border:1.5px solid transparent;position:relative}
.trk li.past{color:#DCEEF8}
.trk li.is-rec{background:var(--cz-verde-aurora);color:var(--cz-madrugada)}
.res h4{margin:18px 0 8px;font-size:1rem;color:#fff}
.res h4 b{color:var(--cz-luz-do-sol)}
.inc{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.inc li{display:flex;gap:10px;align-items:flex-start;font-size:.9375rem;color:#E8F0F4}
.inc svg{color:var(--cz-verde-aurora);margin-top:2px;width:18px;height:18px}
.inc li.on span{color:#fff;font-weight:700}
.inc em{display:inline-block;margin-left:4px;padding:1px 8px;border-radius:999px;background:var(--cz-luz-do-sol);color:var(--cz-noite-de-antes);font-size:.75rem;font-style:normal;font-weight:800}
.res .pinc{margin:10px 0 0;color:var(--cz-turquesa-luz);font-size:.875rem}
.mtr{position:relative;height:14px;border-radius:7px;background:rgba(255,255,255,.14);overflow:hidden;margin:6px 0 8px}
.mf{position:absolute;inset:0;border-radius:7px;background:linear-gradient(90deg,var(--cz-verde-aurora),var(--cz-amarelo-caju) 60%,var(--cz-laranja-alvorada));transform-origin:left;transform:scaleX(.25)}
.anim .mf{transition:transform 360ms var(--e)}
.mt{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,1fr)}
.mt em{border-right:2px solid var(--cz-noite-de-antes)}
.mlb{display:grid;grid-template-columns:repeat(4,1fr);margin:0 0 10px;font-size:.75rem;color:#B4C4CA;text-align:center}
.mlb span.on{color:#fff;font-weight:800}
.res-n{margin-top:8px;font-size:.8125rem;color:#B4C4CA}
.warn{margin-top:12px;padding:12px 14px;border-radius:12px;background:rgba(242,181,68,.16);border-left:4px solid var(--cz-amarelo-caju);color:#FFF3D1;font-size:.9375rem}
.sum{margin:16px 0;padding:14px;border-radius:12px;background:rgba(255,255,255,.07);font-size:.875rem;color:#DCEEF8;line-height:1.5}
.sum b{color:#fff}
.res .btn{width:100%;margin-top:4px}
.redo{margin-top:12px;min-height:44px;padding:0 18px;border-radius:12px;border:1.5px solid rgba(255,255,255,.4);background:transparent;color:#fff;font:700 .9375rem/1 var(--f);cursor:pointer}
.redo:hover{background:rgba(255,255,255,.1)}
.res-f{margin-top:18px;font-size:.8125rem;color:#B4C4CA}
.res .btn:focus-visible,.redo:focus-visible,.res a:focus-visible{outline-color:var(--cz-turquesa-luz)}
.anim .res-fx.fx{animation:fxin 240ms var(--e) both}
@keyframes fxin{from{opacity:.35;transform:translateY(8px)}to{opacity:1;transform:none}}

/* segmentos: abas */
.segs-s{background:var(--cz-nevoa);padding:clamp(40px,6vw,80px) 0}
.tabbar{display:none}
.js .tabbar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.tab{min-height:48px;padding:0 20px;border-radius:999px;border:2px solid var(--line);background:#fff;color:var(--ink);font:700 .9375rem/1.1 var(--f);cursor:pointer}
.tab:hover{border-color:var(--cz-turquesa-circuito)}
.tab[aria-selected=true]{background:var(--cz-verde-profundo);border-color:var(--cz-verde-profundo);color:#fff}
.tab:focus-visible{outline:3px solid var(--cz-turquesa-circuito);outline-offset:3px}
html.js:not([data-t="varejo"]) #varejo,html.js:not([data-t="clinicas"]) #clinicas,html.js:not([data-t="advocacia"]) #advocacia,html.js:not([data-t="sindicatos"]) #sindicatos,html.js:not([data-t="outros"]) #outros{display:none}
html[data-t="varejo"] #tab-varejo,html[data-t="clinicas"] #tab-clinicas,html[data-t="advocacia"] #tab-advocacia,html[data-t="sindicatos"] #tab-sindicatos,html[data-t="outros"] #tab-outros{background:var(--cz-verde-profundo);border-color:var(--cz-verde-profundo);color:#fff}
.tps{display:grid;gap:48px}
.js .tps{display:block}
.tp{scroll-margin-top:200px;min-width:0}
.tp:focus-visible{outline-offset:6px}
.tp.fx{animation:fxin 240ms var(--e) both}
.tpg{display:grid;gap:28px}
@media (min-width:960px){.tpg{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:56px;align-items:start}.tpr{position:sticky;top:92px}}
.tp h2{font-size:clamp(1.5rem,6vw,2.5rem);line-height:1.15;margin-bottom:20px;text-wrap:balance}
.sh{font-size:.8125rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--cz-turquesa-profundo);margin:22px 0 10px}
.tp ul.pains,.tp ul.dlv{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.tp ul.pains li,.tp ul.dlv li{display:flex;gap:10px;align-items:flex-start}
.tp ul.pains li::before{content:"";flex:none;width:8px;height:8px;margin:.6em 6px 0 6px;border-radius:50%;background:var(--cz-laranja-alvorada)}
.tp ul.dlv svg{color:var(--cz-turquesa-profundo);margin-top:3px}
.tp .cta-row{margin-top:28px}
.lead2{font-size:1.125rem;color:var(--ink2);max-width:36rem}
.proof{padding:22px;border-radius:20px;background:#fff;border:1px solid var(--line)}
.proof .sh{margin-top:0}
.pc{margin-top:10px;color:var(--ink)}
.pl2{color:var(--ink2);margin-bottom:12px}
.cap2{margin-top:12px;font-size:.875rem;color:var(--cz-grafite-suave)}
.pst{list-style:none;margin:0 0 12px;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.pst li{padding:12px;border-radius:14px;background:var(--cz-nevoa);border:1px solid var(--line)}
.pst b{display:block;font-size:clamp(1.25rem,5vw,1.625rem);line-height:1.1;color:var(--cz-verde-profundo)}
.pst span{display:block;margin-top:4px;font-size:.8125rem;color:var(--ink2);line-height:1.3}
.tmi{margin-top:18px}
.tmi .win{max-width:none}
.mrows{display:grid;gap:8px;padding:14px;background:var(--cz-nevoa)}
.mr{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:12px;background:#fff;border:1px solid var(--line)}
.mrt b{display:block;font-size:.875rem}.mrt small{display:block;font-size:.75rem;color:var(--ink2)}
.mr .pill{flex:none}
.anim .mi:not(.lad) .mr{animation:mrx 9s var(--e) infinite both}
.anim .mi .a2{animation-delay:0s}
.anim .mi .mr.a1{animation-name:mra}.anim .mi .mr.a2{animation-name:mrb}.anim .mi .mr.a3{animation-name:mrc}.anim .mi .mr.a4{animation-name:mrd}
@keyframes mra{0%,90%{opacity:1;transform:none}100%{opacity:0}}
@keyframes mrb{0%,8%{opacity:0;transform:translateY(8px)}16%,90%{opacity:1;transform:none}100%{opacity:0}}
@keyframes mrc{0%,22%{opacity:0;transform:translateY(8px)}30%,90%{opacity:1;transform:none}100%{opacity:0}}
@keyframes mrd{0%,36%{opacity:0;transform:translateY(8px)}44%,90%{opacity:1;transform:none}100%{opacity:0}}
.tmi .mini{max-width:none}
.tmi ul.seg{gap:12px;margin-top:4px;padding:6px 0}
.tmi ul.seg li{padding:14px 16px;min-height:60px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.tmi .mini,.tmi .net{min-height:190px}
.tmi .mini.ill-lj{min-height:236px}
.p4 .cap{margin-top:28px}
@media (prefers-reduced-motion:reduce){.tp.fx,.res-fx.fx{animation:none}}

.mrows{align-content:start}
/* abas: no celular, uma linha com rolagem e snap */
/* barra do resultado (celular e tablet) */
.rbar{position:fixed;left:0;right:0;bottom:0;z-index:35;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px var(--g) calc(10px + env(safe-area-inset-bottom,0px));background:var(--cz-noite-de-antes);color:#fff;box-shadow:0 -10px 30px -10px rgba(10,26,36,.5);transform:translateY(110%);visibility:hidden}
.rbar.on{transform:none;visibility:visible}
.anim .rbar{transition:transform 300ms var(--e),visibility 0s linear 300ms}
.anim .rbar.on{transition:transform 300ms var(--e),visibility 0s}
.rbt{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 6px;min-width:0;font-size:.9375rem}
.rbt small{color:#B4C4CA;font-size:.75rem}.rbt b{color:var(--cz-luz-do-sol)}
.rbar .btn{flex:none}
.rb-on .fab{visibility:hidden!important;opacity:0!important}
@media (min-width:1024px){.rbar{display:none}}
