/* Layout "motion" para páginas de conteúdo (CMS). Usa as variáveis do tema do site (claro/escuro). */
.page-content-card:has(.mxm){background:transparent;border:0;padding:0;margin-top:1rem}
.page-content-card:has(.mxm)>.page-title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);margin:0}
.page-content-card:has(.mxm)>hr{display:none}
.page-content-card:has(.mxm) .content-wrapper{line-height:1.6;color:var(--text-primary)}
.mxm{--mxm-a:var(--primary-color);--mxm-b:var(--accent-color);--mxm-ok:#22c55e;--mxm-bad:#ef4444;--mxm-warn:#f59e0b;--mxm-soft:color-mix(in srgb,var(--card-color) 92%,var(--primary-color));position:relative;font-family:var(--font-body)}
.mxm *{box-sizing:border-box}
.mxm h2,.mxm h3,.mxm h4{margin:0;font-family:var(--font-heading);color:var(--text-primary);font-weight:800}
.mxm p{margin:0}
.mxm-sec{margin-top:4.5rem}
.mxm-sec>h3{font-size:clamp(1.5rem,3.4vw,2.1rem);letter-spacing:-.02em;margin-bottom:.4rem}
.mxm-sec>.mxm-lead{color:var(--text-secondary);margin-bottom:1.6rem;max-width:62ch}

/* progresso da leitura */
.mxm-bar{position:fixed;left:0;top:0;height:3px;width:100%;z-index:1040;background:linear-gradient(90deg,var(--mxm-b),var(--mxm-a));transform-origin:0 50%;transform:scaleX(var(--mxm-p,0));pointer-events:none}

/* hero */
.mxm-hero{position:relative;overflow:hidden;border-radius:28px;padding:clamp(2rem,6vw,4.5rem) clamp(1.25rem,5vw,4rem);background:radial-gradient(120% 140% at 0% 0%,color-mix(in srgb,var(--mxm-a) 28%,transparent),transparent 60%),radial-gradient(120% 140% at 100% 100%,color-mix(in srgb,var(--mxm-b) 26%,transparent),transparent 60%),var(--card-color);border:1px solid var(--border-color)}
.mxm-hero:before,.mxm-hero:after{content:"";position:absolute;border-radius:50%;filter:blur(60px);opacity:.55;animation:mxm-drift 14s ease-in-out infinite alternate;pointer-events:none}
.mxm-hero:before{width:280px;height:280px;left:-60px;top:-60px;background:var(--mxm-a)}
.mxm-hero:after{width:240px;height:240px;right:-40px;bottom:-80px;background:var(--mxm-b);animation-duration:18s}
@keyframes mxm-drift{to{transform:translate(40px,30px) scale(1.15)}}
.mxm-hero>*{position:relative;z-index:1}
.mxm-kicker{display:inline-flex;align-items:center;gap:.5rem;font:600 .8rem var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--mxm-a);background:color-mix(in srgb,var(--mxm-a) 14%,transparent);padding:.4rem .9rem;border-radius:999px;margin-bottom:1.2rem}
.mxm-hero h2{font-size:clamp(2.1rem,6.4vw,4rem);line-height:1.05;letter-spacing:-.03em;max-width:16ch}
.mxm-hero h2 em{font-style:normal;background:linear-gradient(90deg,var(--mxm-b),var(--mxm-a));-webkit-background-clip:text;background-clip:text;color:transparent}
.mxm-hero p.mxm-sub{margin-top:1.1rem;color:var(--text-secondary);font-size:clamp(1rem,2.2vw,1.25rem);max-width:52ch}
.mxm-chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.6rem}
.mxm-chip{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem 1rem;border-radius:999px;background:color-mix(in srgb,var(--card-color) 80%,transparent);border:1px solid var(--border-color);font-weight:600;font-size:.9rem;backdrop-filter:blur(6px);animation:mxm-float 5s ease-in-out infinite}
.mxm-chip:nth-child(2){animation-delay:-1.2s}.mxm-chip:nth-child(3){animation-delay:-2.4s}.mxm-chip:nth-child(4){animation-delay:-3.6s}
.mxm-chip i{color:var(--mxm-a)}
@keyframes mxm-float{50%{transform:translateY(-6px)}}
.mxm-mascot{position:absolute!important;right:clamp(.5rem,4vw,3rem);bottom:-10px;width:clamp(110px,22vw,230px);opacity:.92;filter:drop-shadow(0 18px 30px rgba(0,0,0,.35));animation:mxm-float 6s ease-in-out infinite;pointer-events:none}
@media(max-width:640px){.mxm-mascot{display:none}}

/* revelar ao rolar */
.mxm-rv{opacity:0;transform:translateY(26px) scale(.985);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.mxm-rv.in{opacity:1;transform:none}
.mxm-rv.l{transform:translateX(-34px)}.mxm-rv.r{transform:translateX(34px)}.mxm-rv.l.in,.mxm-rv.r.in{transform:none}

/* passos (linha do tempo) */
.mxm-steps{list-style:none;margin:2rem 0 0;padding:0 0 0 0;position:relative;counter-reset:s}
.mxm-steps:before{content:"";position:absolute;left:27px;top:10px;bottom:10px;width:3px;border-radius:3px;background:var(--border-color)}
.mxm-steps:after{content:"";position:absolute;left:27px;top:10px;width:3px;border-radius:3px;height:calc((100% - 20px)*var(--mxm-rail,0));background:linear-gradient(var(--mxm-b),var(--mxm-a));box-shadow:0 0 14px color-mix(in srgb,var(--mxm-a) 60%,transparent)}
.mxm-step{position:relative;display:grid;grid-template-columns:58px 1fr;gap:1.1rem;padding:0 0 1.6rem}
.mxm-step:last-child{padding-bottom:0}
.mxm-n{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font:800 1.35rem var(--font-heading);color:#fff;background:linear-gradient(135deg,var(--mxm-b),var(--mxm-a));box-shadow:0 8px 24px color-mix(in srgb,var(--mxm-a) 40%,transparent);position:relative;z-index:1;transform:scale(.6);transition:transform .6s cubic-bezier(.3,1.6,.4,1)}
.mxm-step.in .mxm-n{transform:scale(1)}
.mxm-sc{background:var(--card-color);border:1px solid var(--border-color);border-radius:20px;padding:1.2rem 1.4rem;transition:transform .25s,border-color .25s,box-shadow .25s}
.mxm-sc:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--mxm-a) 55%,var(--border-color));box-shadow:0 14px 34px rgba(0,0,0,.18)}
.mxm-sc h4{font-size:1.15rem;display:flex;align-items:center;gap:.6rem}
.mxm-sc h4 i{color:var(--mxm-a);font-size:1.05rem}
.mxm-sc p{margin-top:.4rem;color:var(--text-secondary);font-size:.97rem}
.mxm-sc p b{color:var(--text-primary)}
.mxm-tip{margin-top:.8rem;display:flex;gap:.6rem;align-items:flex-start;padding:.7rem .9rem;border-radius:12px;background:color-mix(in srgb,var(--mxm-a) 10%,transparent);font-size:.9rem;color:var(--text-secondary)}
.mxm-tip i{color:var(--mxm-a);margin-top:.2rem}

/* cartões em grade */
.mxm-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.mxm-card{background:var(--card-color);border:1px solid var(--border-color);border-radius:20px;padding:1.4rem;transition:transform .25s,box-shadow .25s,border-color .25s;position:relative;overflow:hidden}
.mxm-card:hover{transform:translateY(-5px);box-shadow:0 16px 38px rgba(0,0,0,.2);border-color:color-mix(in srgb,var(--mxm-a) 50%,var(--border-color))}
.mxm-ic{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:1.2rem;color:#fff;background:linear-gradient(135deg,var(--mxm-b),var(--mxm-a));margin-bottom:.9rem}
.mxm-card h4{font-size:1.05rem;margin-bottom:.3rem}
.mxm-card p{color:var(--text-secondary);font-size:.93rem}
.mxm-card .mxm-big{font:800 2.6rem/1 var(--font-heading);background:linear-gradient(90deg,var(--mxm-b),var(--mxm-a));-webkit-background-clip:text;background-clip:text;color:transparent}

/* fluxo do dinheiro */
.mxm-flow{display:grid;grid-template-columns:repeat(5,1fr);gap:.8rem;position:relative;margin-top:1.6rem}
.mxm-flow:before{content:"";position:absolute;left:10%;right:10%;top:36px;height:3px;background:var(--border-color);border-radius:3px}
.mxm-flow:after{content:"";position:absolute;left:10%;top:36px;height:3px;border-radius:3px;width:calc(80%*var(--mxm-flow,0));background:linear-gradient(90deg,var(--mxm-b),var(--mxm-a));transition:width 2.6s cubic-bezier(.4,0,.2,1)}
.mxm-fn{text-align:center;position:relative;z-index:1}
.mxm-fn .mxm-dot{width:74px;height:74px;margin:0 auto .7rem;border-radius:50%;display:grid;place-items:center;font-size:1.4rem;background:var(--card-color);border:3px solid var(--border-color);color:var(--text-secondary);transition:all .5s}
.mxm-fn.on .mxm-dot{border-color:var(--mxm-a);color:#fff;background:linear-gradient(135deg,var(--mxm-b),var(--mxm-a));box-shadow:0 10px 28px color-mix(in srgb,var(--mxm-a) 45%,transparent);transform:scale(1.06)}
.mxm-fn b{display:block;font-family:var(--font-heading);font-size:.98rem}
.mxm-fn span{display:block;color:var(--text-secondary);font-size:.82rem;margin-top:.15rem}
@media(max-width:760px){
 .mxm-flow{grid-template-columns:1fr;gap:1.1rem;padding-left:0}
 .mxm-flow:before{left:36px;right:auto;top:20px;bottom:20px;width:3px;height:auto}
 .mxm-flow:after{left:36px;top:20px;width:3px;height:calc((100% - 40px)*var(--mxm-flow,0));transition:height 2.6s cubic-bezier(.4,0,.2,1)}
 .mxm-fn{display:grid;grid-template-columns:74px 1fr;gap:1rem;text-align:left;align-items:center}
 .mxm-fn .mxm-dot{margin:0}
}

/* cobre / não cobre */
.mxm-split{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.mxm-box{border-radius:22px;padding:1.4rem 1.5rem;background:var(--card-color);border:1px solid var(--border-color);border-top:4px solid var(--mxm-ok)}
.mxm-box.no{border-top-color:var(--mxm-bad)}
.mxm-box h4{font-size:1.1rem;margin-bottom:.8rem;display:flex;gap:.6rem;align-items:center}
.mxm-box h4 i{color:var(--mxm-ok)}.mxm-box.no h4 i{color:var(--mxm-bad)}
.mxm-box ul{list-style:none;padding:0;margin:0;display:grid;gap:.6rem}
.mxm-box li{display:flex;gap:.7rem;align-items:flex-start;color:var(--text-secondary);font-size:.95rem}
.mxm-box li:before{content:"\2713";flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:.75rem;font-weight:800;color:#fff;background:var(--mxm-ok);margin-top:.1rem}
.mxm-box.no li:before{content:"\2715";background:var(--mxm-bad)}

/* abas */
.mxm-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin:1.2rem 0}
.mxm-tab{border:1px solid var(--border-color);background:var(--card-color);color:var(--text-secondary);padding:.6rem 1.1rem;border-radius:999px;font-weight:600;font-size:.92rem;cursor:pointer;transition:all .2s}
.mxm-tab:hover{color:var(--text-primary)}
.mxm-tab.on{color:#fff;border-color:transparent;background:linear-gradient(135deg,var(--mxm-b),var(--mxm-a))}
.mxm-panel{display:none;animation:mxm-pop .45s cubic-bezier(.2,.7,.2,1)}
.mxm-panel.on{display:block}
@keyframes mxm-pop{from{opacity:0;transform:translateY(12px)}}

/* ranks */
.mxm-ranks{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.mxm-rk{text-align:center;background:var(--card-color);border:1px solid var(--border-color);border-radius:22px;padding:1.4rem 1rem;position:relative;transition:transform .25s,box-shadow .25s}
.mxm-rk:hover{transform:translateY(-6px) rotate(-.6deg);box-shadow:0 18px 40px rgba(0,0,0,.22)}
.mxm-rk img{width:84px;height:84px;object-fit:contain;filter:drop-shadow(0 10px 14px rgba(0,0,0,.35));animation:mxm-float 5s ease-in-out infinite}
.mxm-rk:nth-child(2n) img{animation-delay:-1.5s}.mxm-rk:nth-child(3n) img{animation-delay:-3s}
.mxm-rk h4{margin-top:.6rem;font-size:1.1rem}
.mxm-rk small{display:block;color:var(--text-secondary);margin-top:.15rem}
.mxm-fee{margin-top:.8rem;font:800 1.9rem var(--font-heading);background:linear-gradient(90deg,var(--mxm-b),var(--mxm-a));-webkit-background-clip:text;background-clip:text;color:transparent}
.mxm-fee small{display:inline;font-size:.8rem;-webkit-text-fill-color:var(--text-secondary);font-weight:500;margin-left:.2rem}

/* tabela de métodos */
.mxm-tbl{display:grid;gap:.6rem}
.mxm-tr{display:grid;grid-template-columns:1.4fr .8fr 1fr 1.2fr;gap:.8rem;align-items:center;background:var(--card-color);border:1px solid var(--border-color);border-radius:16px;padding:.9rem 1.1rem}
.mxm-tr.h{background:transparent;border:0;color:var(--text-secondary);font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;padding-bottom:0}
.mxm-tr b{font-family:var(--font-heading)}
.mxm-tr span{color:var(--text-secondary);font-size:.93rem}
@media(max-width:700px){.mxm-tr{grid-template-columns:1fr 1fr}.mxm-tr.h{display:none}.mxm-tr>*:first-child{grid-column:1/-1}.mxm-tr span:before{content:attr(data-l) ": ";font-weight:600;color:var(--text-primary)}}

/* aviso e CTA */
.mxm-note{display:flex;gap:.8rem;align-items:flex-start;padding:1rem 1.2rem;border-radius:16px;background:color-mix(in srgb,var(--mxm-warn) 12%,transparent);border:1px solid color-mix(in srgb,var(--mxm-warn) 35%,transparent);color:var(--text-secondary);font-size:.95rem;margin-top:1.2rem}
.mxm-note i{color:var(--mxm-warn);margin-top:.2rem}
.mxm-cta{margin-top:4.5rem;border-radius:28px;padding:clamp(1.8rem,5vw,3.2rem);text-align:center;color:#fff;background:linear-gradient(135deg,var(--mxm-b),var(--mxm-a));position:relative;overflow:hidden}
.mxm-cta:before{content:"";position:absolute;inset:-40%;background:conic-gradient(from 0deg,transparent,rgba(255,255,255,.18),transparent 30%);animation:mxm-spin 9s linear infinite}
@keyframes mxm-spin{to{transform:rotate(360deg)}}
.mxm-cta>*{position:relative}
.mxm-cta h3{color:#fff;font-size:clamp(1.5rem,4vw,2.3rem)}
.mxm-cta p{margin:.6rem auto 1.4rem;max-width:46ch;opacity:.92}
.mxm-btn{display:inline-flex;align-items:center;gap:.6rem;background:#fff;color:#1b2a52!important;font-weight:700;padding:.9rem 1.7rem;border-radius:999px;text-decoration:none!important;transition:transform .2s,box-shadow .2s}
.mxm-btn:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 14px 30px rgba(0,0,0,.28)}
.mxm-btn.ghost{background:transparent;color:#fff!important;border:2px solid rgba(255,255,255,.7);margin-left:.5rem}
.mxm-foot{margin-top:2rem;color:var(--text-secondary);font-size:.85rem;text-align:center}

@media(prefers-reduced-motion:reduce){.mxm *,.mxm *:before,.mxm *:after{animation:none!important;transition:none!important}.mxm-rv{opacity:1;transform:none}.mxm-n{transform:none}.mxm-bar{display:none}}

/* especificidade para vencer os estilos genéricos de page.ejs (.content-wrapper h*, p, ul) */
.page-content-card .content-wrapper .mxm :is(h2,h3,h4){margin:0}
.page-content-card .content-wrapper .mxm p{margin:0}
.page-content-card .content-wrapper .mxm ul{padding:0;margin:0;list-style:none}
.page-content-card .content-wrapper .mxm .mxm-sec>h3{margin-bottom:.4rem}
.page-content-card .content-wrapper .mxm .mxm-sec>.mxm-lead{margin-bottom:1.6rem}
.page-content-card .content-wrapper .mxm .mxm-sc p{margin-top:.4rem}
.page-content-card .content-wrapper .mxm .mxm-card h4{margin-bottom:.3rem}
.page-content-card .content-wrapper .mxm .mxm-box h4{margin-bottom:.8rem}
.page-content-card .content-wrapper .mxm .mxm-rk h4{margin-top:.6rem}
.page-content-card .content-wrapper .mxm .mxm-hero p.mxm-sub{margin-top:1.1rem}
.page-content-card .content-wrapper .mxm .mxm-cta p{margin:.6rem auto 1.4rem}
.page-content-card .content-wrapper .mxm .mxm-note{margin-top:1.2rem}
.page-content-card .content-wrapper .mxm .mxm-tip{margin-top:.8rem}
.page-content-card .content-wrapper .mxm .mxm-steps{margin-top:2rem}
.page-content-card .content-wrapper .mxm .mxm-foot{margin-top:2rem}
.page-content-card .content-wrapper .mxm .mxm-sec>h3{margin-bottom:1rem}
.page-content-card .content-wrapper .mxm .mxm-sec>h3:has(+.mxm-lead){margin-bottom:.4rem}
.mxm-sec .mxm-grid.five{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
