/* ============================================================
   Demppler — sistema de design (compartilhado)
   Escopo .dmx para embutir sem colisão. Usado por index.html e diagnostico.html
   ============================================================ */
.dmx{
  --ink:#0d1426; --navy:#0a1022; --navy2:#111a33;
  --paper:#ffffff; --alt:#f5f6f3; --line:#e7e8ec; --muted:#697089;
  --c1:#4338ca; --c1d:#3329a8; --c1s:#ececff;        /* Decisão  */
  --c2:#e8a51c; --c2d:#a8780d; --c2s:#fbf0d7;        /* Execução (dourado do olho) */
  --c3:#0d9f6e; --c3d:#0a7d57; --c3s:#e4f7ef;        /* Resultado*/
  --blue1:#04204f; --blue2:#0f74c4; --blue3:#22abf3; /* azuis do pássaro: escuro→claro */
  --arc:linear-gradient(100deg,var(--blue1) 0%, var(--blue2) 50%, var(--blue3) 100%);
  --gold:#f5b417;
  font-family:'Inter',system-ui,sans-serif; color:var(--ink); line-height:1.6; -webkit-font-smoothing:antialiased;
}
.dmx *{box-sizing:border-box; margin:0; padding:0}
.dmx img{max-width:100%; display:block}
.dmx a{color:inherit; text-decoration:none}
.dmx .wrap{max-width:1140px; margin:0 auto; padding:0 24px}
.dmx h1,.dmx h2,.dmx h3,.dmx h4{font-family:'Space Grotesk',sans-serif; line-height:1.1; letter-spacing:-.02em; font-weight:700}
.dmx .eyebrow{font-family:'Space Mono',monospace; font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; color:var(--muted)}
.dmx section{padding:clamp(58px,8vw,104px) 0}
.dmx .btn{display:inline-flex; align-items:center; gap:9px; font-weight:600; font-size:.95rem; padding:13px 22px; border-radius:11px; cursor:pointer; border:0; transition:transform .2s, box-shadow .2s, background .2s; font-family:inherit}
.dmx .btn:hover{transform:translateY(-2px)}
.dmx .btn-p{background:var(--arc); color:#fff; box-shadow:0 10px 26px -12px rgba(67,56,202,.7)}
.dmx .btn-g{background:#19c389; color:#04241a; box-shadow:0 10px 26px -12px rgba(13,159,110,.7)}
.dmx .btn-o{border:1.5px solid rgba(255,255,255,.32); color:#fff; background:transparent}
.dmx .btn-o.dark{border-color:var(--line); color:var(--ink)}
.dmx .btn-lg{padding:16px 28px; font-size:1.02rem}

/* ===== HEADER ===== */
.dmx .nav{position:sticky; top:0; z-index:60; background:rgba(255,255,255,.86); backdrop-filter:saturate(160%) blur(10px); border-bottom:1px solid var(--line)}
.dmx .nav .row{display:flex; align-items:center; justify-content:space-between; height:66px}
.dmx .logo{display:flex; align-items:center; gap:10px}
.dmx .logo img{height:30px; width:auto}
.dmx .logo b{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.3rem; letter-spacing:-.015em; color:var(--ink)}
.dmx .nav nav{display:flex; align-items:center; gap:24px}
.dmx .nav nav a.lnk{font-size:.9rem; font-weight:500; color:#34405c}
.dmx .nav nav a.lnk:hover{color:var(--c1d)}
.dmx .nav .navcta{padding:9px 16px; border-radius:9px; background:var(--ink); color:#fff; font-size:.86rem; font-weight:600}
.dmx .nav .navlogin{padding:8px 15px; border-radius:9px; border:1.5px solid var(--line); color:#34405c; font-size:.86rem; font-weight:600; display:inline-flex; align-items:center; gap:7px}
.dmx .nav .navlogin:hover{border-color:var(--blue2); color:var(--blue2)}
.dmx .burger{display:none; background:none; border:0; cursor:pointer; padding:8px}
.dmx .burger span{display:block; width:22px; height:2px; background:var(--ink); margin:4px 0; transition:.2s}
@media (max-width:860px){
  .dmx .nav nav{position:absolute; top:66px; left:0; right:0; flex-direction:column; align-items:stretch; gap:0; background:#fff; border-bottom:1px solid var(--line); padding:8px 0; display:none}
  .dmx .nav nav.open{display:flex}
  .dmx .nav nav a.lnk{padding:12px 24px} .dmx .nav .navcta{margin:8px 24px; text-align:center}
  .dmx .nav .navlogin{margin:8px 24px 0; text-align:center; justify-content:center}
  .dmx .burger{display:block}
}

/* ===== HERO ===== */
.dmx .hero{position:relative; overflow:hidden; color:#fff;
   background:
    radial-gradient(46% 58% at 12% 14%, rgba(15,116,196,.55), transparent 62%),
    radial-gradient(50% 60% at 88% 6%, rgba(34,171,243,.42), transparent 60%),
    radial-gradient(52% 64% at 82% 96%, rgba(16,185,129,.24), transparent 62%),
    radial-gradient(46% 56% at 4% 98%, rgba(232,165,28,.16), transparent 60%),
    linear-gradient(160deg,#06182f 0%, #07142a 58%, #08213f 100%)}
.dmx .hero::before{content:""; position:absolute; inset:-30% -10% auto -10%; height:80%; background:radial-gradient(60% 100% at 50% 0%, rgba(34,171,243,.18), transparent 70%); filter:blur(30px); pointer-events:none; animation:drift 16s ease-in-out infinite}
@keyframes drift{0%,100%{transform:translateX(0)}50%{transform:translateX(6%)}}
.dmx .hero .grid{display:grid; grid-template-columns:1.08fr .92fr; gap:40px; align-items:center; padding:clamp(44px,7vw,82px) 0 clamp(52px,7vw,90px)}
.dmx .hero .eyebrow{color:#9aa3c4}
.dmx .hero h1{font-size:clamp(2.4rem,6vw,4.6rem); margin:16px 0 0; color:#fff}
.dmx .hero h1 .w1{color:#a9a2f7} .dmx .hero h1 .w3{color:#5fd6a8} .dmx .hero h1 .dot{color:var(--c2)}
.dmx .hero .lead{margin-top:20px; font-size:clamp(1.04rem,1.5vw,1.2rem); color:#c8cee2; max-width:48ch}
.dmx .hero .lead b{color:#fff; font-weight:600}
.dmx .hero .ctas{display:flex; gap:13px; flex-wrap:wrap; margin-top:30px}
.dmx .hero .pills{display:flex; gap:22px; margin-top:28px; flex-wrap:wrap}
.dmx .hero .pills span{font-family:'Space Mono',monospace; font-size:.78rem; color:#aab1cf; display:flex; align-items:center; gap:8px}
.dmx .hero .pills i{width:9px; height:9px; border-radius:50%}
/* ===== HERO MOCKUP (painel do produto) ===== */
.dmx .heromock{position:relative; min-height:360px}
.dmx .glass{background:rgba(17,24,46,.74); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border:1px solid rgba(255,255,255,.14); border-radius:18px; box-shadow:0 30px 70px -30px rgba(0,0,0,.8)}
.dmx .mockmain{position:relative; z-index:1; padding:16px}
.dmx .mocktop{display:flex; align-items:center; gap:9px; padding-bottom:12px; border-bottom:1px solid rgba(255,255,255,.10)}
.dmx .mocktop img{height:22px; width:auto}
.dmx .mocktop b{font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:.9rem; color:#fff}
.dmx .mocktop .live{margin-left:auto; display:flex; align-items:center; gap:6px; font-family:'Space Mono',monospace; font-size:.6rem; color:#9aa3c4}
.dmx .mocktop .live i{width:7px; height:7px; border-radius:50%; background:#19c389; animation:pulse 2.2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(25,195,137,.55)}70%{box-shadow:0 0 0 7px rgba(25,195,137,0)}100%{box-shadow:0 0 0 0 rgba(25,195,137,0)}}
.dmx .mockkpis{display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-top:14px}
.dmx .mockkpi{background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); border-radius:12px; padding:10px 11px}
.dmx .mockkpi small{font-family:'Space Mono',monospace; font-size:.55rem; letter-spacing:.06em; color:#9aa3c4}
.dmx .mockkpi b{display:block; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.12rem; color:#fff; margin-top:3px; line-height:1}
.dmx .mockkpi span{font-family:'Space Mono',monospace; font-size:.58rem; color:#5fe0ad}
.dmx .mockchart{margin-top:12px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:12px; padding:11px}
.dmx .mockchart .cl{display:flex; justify-content:space-between; font-family:'Space Mono',monospace; font-size:.58rem; color:#9aa3c4; margin-bottom:3px}
.dmx .mockmetas{margin-top:12px; display:grid; gap:10px}
.dmx .mmrow{display:grid; grid-template-columns:1fr auto; gap:5px 10px; align-items:center}
.dmx .mmrow span{font-size:.74rem; color:#c8cee2}
.dmx .mmrow b{font-family:'Space Mono',monospace; font-size:.7rem; color:#fff}
.dmx .mmbar{grid-column:1/-1; height:7px; border-radius:7px; background:rgba(255,255,255,.10); overflow:hidden}
.dmx .mmbar i{display:block; height:100%; border-radius:7px}
.dmx .mockfloat{position:absolute; z-index:2}
.dmx .mf-trace{top:-24px; left:-32px; padding:13px 15px; max-width:235px; animation:floatA 7s ease-in-out infinite}
.dmx .mf-trace .ttl{font-family:'Space Mono',monospace; font-size:.56rem; letter-spacing:.08em; color:#9aa3c4; margin-bottom:8px}
.dmx .mf-trace .casc{display:flex; align-items:center; gap:5px; flex-wrap:wrap}
.dmx .mf-trace .casc span{font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:.7rem; color:#fff; padding:4px 8px; border-radius:7px; background:rgba(255,255,255,.08)}
.dmx .mf-trace .casc .ar{color:#6b7390; padding:0; background:none}
.dmx .mf-trace .ok{display:flex; align-items:center; gap:6px; margin-top:9px; font-size:.72rem; color:#5fe0ad}
.dmx .mf-gauge{bottom:-20px; right:-24px; padding:13px 15px; display:flex; align-items:center; gap:11px; animation:floatB 8s ease-in-out infinite}
.dmx .mf-gauge .gtext b{display:block; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.05rem; color:#fff; line-height:1}
.dmx .mf-gauge .gtext small{font-family:'Space Mono',monospace; font-size:.56rem; color:#9aa3c4}
@keyframes floatA{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes floatB{0%,100%{transform:translateY(0)}50%{transform:translateY(9px)}}
@keyframes soar{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-12px) rotate(-1.2deg)}}
.dmx .cta .bird img{animation:soar 6s ease-in-out infinite}
@media (max-width:860px){
  .dmx .heromock{margin:8px auto 0; max-width:440px}
  .dmx .mf-trace{left:-8px; top:-16px; max-width:205px; transform:scale(.94)}
  .dmx .mf-gauge{right:-6px; bottom:-14px; transform:scale(.94)}
}
@media (max-width:520px){
  .dmx .mf-trace{display:none}
  .dmx .mf-gauge{right:50%; bottom:-16px; transform:translateX(50%) scale(.9)}
}

/* ===== títulos de seção ===== */
.dmx .head{max-width:66ch}
.dmx .head.center{margin:0 auto; text-align:center}
.dmx .head h2{font-size:clamp(1.7rem,3.6vw,2.7rem); margin:12px 0 0}
.dmx .head p{margin-top:15px; color:var(--muted); font-size:1.06rem}
.dmx .head p b{color:var(--ink)}

/* ===== bandas claras/escuras/alt ===== */
.dmx .s-paper{background:var(--paper)} .dmx .s-alt{background:var(--alt)}
.dmx .s-navy{background:var(--navy); color:#fff} .dmx .s-navy .head h2{color:#fff} .dmx .s-navy .eyebrow{color:#9aa3c4}

/* ===== chart "estratégia ao caixa" (semitransparente) ===== */
.dmx .traccard{display:grid; grid-template-columns:1fr 1.1fr; gap:34px; align-items:center; margin-top:30px}
.dmx .traccard .copy h3{font-size:1.5rem} .dmx .traccard .copy p{margin-top:12px; color:var(--muted)}
.dmx .traccard .copy .chain{margin-top:18px}
.dmx .chartbox{background:linear-gradient(180deg,#0d1530,#0a1022); border:1px solid rgba(255,255,255,.1); border-radius:18px; padding:20px}
.dmx .chartbox .cap{display:flex; justify-content:space-between; font-family:'Space Mono',monospace; font-size:.72rem; color:#9aa3c4; margin-bottom:6px}
.dmx svg .grid-l{stroke:rgba(255,255,255,.08)}
.dmx .chain{display:flex; align-items:center; gap:6px; flex-wrap:wrap}
.dmx .chain .nd{font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:.84rem; padding:7px 11px; border-radius:9px; background:#fff; border:1px solid var(--line); white-space:nowrap}
.dmx .chain .nd.s{border-color:var(--c1); color:var(--c1d)} .dmx .chain .nd.f{border-color:var(--c3); color:var(--c3d)}
.dmx .chain .ar{color:var(--muted)}

/* ===== PROBLEMA ===== */
.dmx .pcards{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:44px}
.dmx .pcard{border:1px solid var(--line); border-radius:16px; padding:22px; background:#fff}
.dmx .pcard .x{width:34px; height:34px; border-radius:9px; background:#fdecec; color:#d4453f; display:flex; align-items:center; justify-content:center; margin-bottom:14px; font-weight:700}
.dmx .pcard h4{font-size:1.02rem} .dmx .pcard p{margin-top:8px; font-size:.9rem; color:#586079}

/* ===== PILARES ===== */
.dmx .flowstrip{display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap; margin:38px 0 6px}
.dmx .fs{font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:.95rem; padding:11px 20px; border-radius:999px; background:#fff; border:1px solid var(--line)}
.dmx .fs.a{color:var(--c1d); border-color:var(--c1)} .dmx .fs.b{color:var(--c2d); border-color:var(--c2)} .dmx .fs.c{color:var(--c3d); border-color:var(--c3)}
.dmx .fsar{color:var(--muted); font-size:1.1rem}
.dmx .recomeca{display:flex; align-items:center; justify-content:center; gap:9px; color:var(--c1d); font-family:'Space Mono',monospace; font-size:.8rem; margin-bottom:6px; text-align:center}
.dmx .pgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:28px}
.dmx .pillar{border:1px solid var(--line); border-radius:20px; padding:28px 24px; background:#fff; position:relative; overflow:hidden; transition:transform .25s, box-shadow .25s}
.dmx .pillar:hover{transform:translateY(-4px); box-shadow:0 18px 40px -22px rgba(13,20,38,.4)}
.dmx .pillar::before{content:""; position:absolute; inset:0 0 auto 0; height:5px}
.dmx .pillar .pnum{font-family:'Space Mono',monospace; font-size:.76rem; letter-spacing:.1em}
.dmx .pillar h3{font-size:1.42rem; margin:9px 0 0}
.dmx .pillar .tag{font-family:'Space Mono',monospace; font-size:.68rem; text-transform:uppercase; letter-spacing:.14em; display:inline-block; margin-top:12px; padding:4px 10px; border-radius:999px}
.dmx .pillar p{margin-top:13px; font-size:.95rem; color:#414a63}
.dmx .pillar .mods{display:flex; flex-wrap:wrap; gap:7px; margin-top:18px}
.dmx .pillar .mods span{font-size:.78rem; font-weight:500; padding:5px 10px; border-radius:8px; background:var(--alt); color:#2c3346}
.dmx .p1::before{background:var(--c1)} .dmx .p1 .pnum,.dmx .p1 h3{color:var(--c1d)} .dmx .p1 .tag{background:var(--c1s); color:var(--c1d)}
.dmx .p2::before{background:var(--c2)} .dmx .p2 .pnum,.dmx .p2 h3{color:var(--c2d)} .dmx .p2 .tag{background:var(--c2s); color:var(--c2d)}
.dmx .p3::before{background:var(--c3)} .dmx .p3 .pnum,.dmx .p3 h3{color:var(--c3d)} .dmx .p3 .tag{background:var(--c3s); color:var(--c3d)}
.dmx .pdca{margin-top:34px; text-align:center; color:var(--muted); font-size:.96rem; max-width:74ch; margin-left:auto; margin-right:auto}
.dmx .pdca b{color:var(--ink)}

/* ===== MÉTODO (rio) ===== */
.dmx .river{max-width:760px; margin:42px auto 0; position:relative}
.dmx .band{position:relative; padding-left:64px}
.dmx .band::before{content:""; position:absolute; left:23px; top:0; bottom:0; width:3px}
.dmx .b1::before{background:linear-gradient(var(--c1),var(--c1) 70%, var(--c2))}
.dmx .b2::before{background:linear-gradient(var(--c2),var(--c2) 80%, var(--c3))}
.dmx .b3::before{background:linear-gradient(var(--c3),var(--c3))}
.dmx .band-head{display:flex; align-items:center; gap:12px; padding:6px 0; position:relative}
.dmx .band-head .lab{font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:.92rem}
.dmx .b1 .band-head .lab{color:var(--c1d)} .dmx .b2 .band-head .lab{color:var(--c2d)} .dmx .b3 .band-head .lab{color:var(--c3d)}
.dmx .band-head .mk{position:absolute; left:-52px; width:18px; height:18px; border-radius:5px; transform:rotate(45deg)}
.dmx .b1 .band-head .mk{background:var(--c1)} .dmx .b2 .band-head .mk{background:var(--c2)} .dmx .b3 .band-head .mk{background:var(--c3)}
.dmx .step{position:relative; background:#fff; border:1px solid var(--line); border-radius:14px; padding:15px 18px; margin:13px 0; display:flex; gap:13px; align-items:flex-start}
.dmx .step .ico{position:absolute; left:-53px; top:13px; width:40px; height:40px; border-radius:50%; background:#fff; border:2px solid var(--line); display:flex; align-items:center; justify-content:center}
.dmx .b1 .step .ico{border-color:var(--c1); color:var(--c1d)} .dmx .b2 .step .ico{border-color:var(--c2); color:var(--c2d)} .dmx .b3 .step .ico{border-color:var(--c3); color:var(--c3d)}
.dmx .step .n{font-family:'Space Mono',monospace; font-size:.72rem; color:var(--muted); width:20px; flex:none; padding-top:2px}
.dmx .step h4{font-size:1.04rem; font-weight:600} .dmx .step p{font-size:.89rem; color:#586079; margin-top:2px}
.dmx .step.fin{border-style:dashed}

/* ===== DIFERENCIAL ===== */
.dmx .notrio{display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-top:24px}
.dmx .notrio span{font-family:'Space Mono',monospace; font-size:.82rem; padding:8px 14px; border-radius:999px; background:#fff; border:1px solid var(--line); color:#586079}
.dmx .bcards{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:38px}
.dmx .bcard{background:#fff; border:1px solid var(--line); border-radius:16px; padding:22px}
.dmx .bcard .i{width:36px; height:36px; border-radius:10px; background:var(--c1s); color:var(--c1d); display:flex; align-items:center; justify-content:center; margin-bottom:13px}
.dmx .bcard h4{font-size:1.02rem} .dmx .bcard p{margin-top:8px; font-size:.9rem; color:#586079}

/* ===== DIAGNÓSTICO (teaser no index) ===== */
.dmx .diagteaser{display:grid; grid-template-columns:1.05fr .95fr; gap:36px; align-items:center}
.dmx .diagteaser .radarbox{background:linear-gradient(180deg,#0d1530,#0a1022); border:1px solid rgba(255,255,255,.12); border-radius:20px; padding:24px; display:flex; justify-content:center}
.dmx .diagteaser ul{list-style:none; margin:18px 0 0; display:grid; gap:10px}
.dmx .diagteaser li{display:flex; gap:10px; align-items:flex-start; color:#dfe3f1; font-size:.98rem}
.dmx .diagteaser li svg{flex:none; margin-top:3px; color:#5fd6a8}

/* ===== PLANOS ===== */
.dmx .plans{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:46px; align-items:stretch}
.dmx .plan{border:1px solid var(--line); border-radius:20px; padding:30px 26px; background:#fff; display:flex; flex-direction:column}
.dmx .plan.feat{border-color:var(--c1); box-shadow:0 24px 50px -28px rgba(67,56,202,.5); position:relative}
.dmx .plan.feat .ribbon{position:absolute; top:-12px; left:26px; background:var(--arc); color:#fff; font-family:'Space Mono',monospace; font-size:.66rem; letter-spacing:.12em; text-transform:uppercase; padding:5px 11px; border-radius:999px}
.dmx .plan h3{font-size:1.36rem} .dmx .plan .for{margin-top:6px; color:var(--muted); font-size:.9rem; min-height:38px}
.dmx .plan .price{margin-top:16px; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.5rem; color:var(--ink)}
.dmx .plan .price small{display:block; font-family:'Space Mono',monospace; font-size:.7rem; color:var(--muted); font-weight:400; letter-spacing:.06em; margin-top:4px}
.dmx .plan ul{list-style:none; margin:18px 0 22px; display:grid; gap:9px; flex:1}
.dmx .plan li{display:flex; gap:9px; font-size:.9rem; color:#414a63}
.dmx .plan li svg{flex:none; margin-top:3px; color:var(--c3d)}
.dmx .plan .btn{width:100%; justify-content:center}

/* ===== SOBRE ===== */
.dmx .about::after{content:""; position:absolute; right:-120px; top:-80px; width:380px; height:380px; border-radius:50%; background:radial-gradient(circle, rgba(67,56,202,.35), transparent 65%)}
.dmx .about{position:relative; overflow:hidden}
.dmx .impulse{margin-top:18px; font-size:clamp(1.1rem,1.8vw,1.45rem); font-family:'Space Grotesk',sans-serif; font-weight:500; color:#dfe3f1; max-width:44ch; line-height:1.32}
.dmx .pmv{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:42px; position:relative; z-index:1}
.dmx .mv{background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.12); border-radius:18px; padding:26px}
.dmx .mv .k{font-family:'Space Mono',monospace; font-size:.72rem; letter-spacing:.16em; text-transform:uppercase}
.dmx .mv.k1 .k{color:#a9a2f7} .dmx .mv.k2 .k{color:#f0a85a} .dmx .mv.k3 .k{color:#5fd6a8}
.dmx .mv h3{font-size:1.18rem; margin:12px 0 0; color:#fff} .dmx .mv p{margin-top:10px; color:#c5cbe0; font-size:.96rem}
.dmx .mv .vis{font-size:1.3rem; font-weight:600; color:#fff; line-height:1.28; font-family:'Space Grotesk',sans-serif}
.dmx .mv .meta{margin-top:10px; font-family:'Space Mono',monospace; font-size:.74rem; color:#5fd6a8}
.dmx .values{display:grid; grid-template-columns:repeat(5,1fr); gap:12px; margin-top:18px; position:relative; z-index:1}
.dmx .val{background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); border-radius:14px; padding:18px}
.dmx .val b{display:block; font-family:'Space Grotesk',sans-serif; font-size:.96rem; color:#fff} .dmx .val span{display:block; margin-top:6px; font-size:.84rem; color:#aeb5d1}

/* ===== FECHO ===== */
.dmx .cta{text-align:center}
.dmx .cta .bird{width:92px; margin:0 auto 18px} .dmx .cta .bird img{animation:soar 6s ease-in-out infinite}
.dmx .cta .slog{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:clamp(1.9rem,4.4vw,3rem); letter-spacing:-.02em}
.dmx .cta .slog .a{color:var(--c1d)} .dmx .cta .slog .b{color:var(--c3d)}
.dmx .cta p{margin-top:16px; color:var(--muted); max-width:54ch; margin-left:auto; margin-right:auto}
.dmx .cta .ctas{display:flex; gap:13px; justify-content:center; flex-wrap:wrap; margin-top:28px}

/* ===== FOOTER ===== */
.dmx .foot{background:var(--ink); color:#aeb5d1; padding:40px 0}
.dmx .foot .row{display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap}
.dmx .foot .logo b{color:#fff} .dmx .foot a:hover{color:#fff}
.dmx .foot .meta{font-family:'Space Mono',monospace; font-size:.78rem; display:flex; gap:18px; flex-wrap:wrap}

/* ===== DIAGNÓSTICO (página) ===== */
.dmx .dg-hero{background:var(--navy); color:#fff; padding:clamp(40px,7vw,70px) 0 0}
.dmx .dg-hero .eyebrow{color:#9aa3c4}
.dmx .dg-hero h1{font-size:clamp(2rem,4.6vw,3.2rem); color:#fff; margin-top:12px}
.dmx .dg-hero p{margin-top:14px; color:#c5cbe0; max-width:60ch}
.dmx .dg-prog{height:6px; background:var(--alt); border-radius:6px; overflow:hidden; margin:0 0 26px}
.dmx .dg-prog i{display:block; height:100%; width:0; background:var(--arc); transition:width .4s}
.dmx .qcard{border:1px solid var(--line); border-radius:16px; padding:22px; margin:14px 0; background:#fff}
.dmx .qcard .qh{display:flex; gap:12px; align-items:baseline}
.dmx .qcard .qn{font-family:'Space Mono',monospace; font-size:.78rem; color:var(--muted)}
.dmx .qcard .qt{font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:1.08rem}
.dmx .qcard .qd{color:var(--muted); font-size:.88rem; margin:4px 0 0 0}
.dmx .opts{display:grid; gap:8px; margin-top:14px}
.dmx .opt{display:flex; gap:11px; align-items:flex-start; border:1px solid var(--line); border-radius:11px; padding:11px 14px; cursor:pointer; transition:border-color .15s, background .15s; font-size:.93rem}
.dmx .opt:hover{border-color:var(--c1)}
.dmx .opt.sel{border-color:var(--c1); background:var(--c1s)}
.dmx .opt .dot{width:18px; height:18px; border-radius:50%; border:2px solid #c7cbd6; flex:none; margin-top:1px; position:relative}
.dmx .opt.sel .dot{border-color:var(--c1)} .dmx .opt.sel .dot::after{content:""; position:absolute; inset:3px; border-radius:50%; background:var(--c1)}
.dmx .opt .lv{font-family:'Space Mono',monospace; font-size:.66rem; color:var(--muted); display:block; margin-bottom:1px}
.dmx .dg-actions{display:flex; gap:12px; align-items:center; margin-top:8px; flex-wrap:wrap}
.dmx .dg-err{color:#d4453f; font-size:.9rem}

/* resultado */
.dmx .result{display:none}
.dmx .result.on{display:block}
.dmx .rscore{display:grid; grid-template-columns:auto 1fr; gap:26px; align-items:center; border:1px solid var(--line); border-radius:20px; padding:26px; background:linear-gradient(180deg,#fff,var(--alt))}
.dmx .gauge{width:150px; height:150px; flex:none}
.dmx .rscore .lvl{font-family:'Space Mono',monospace; font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--c1d)}
.dmx .rscore h3{font-size:1.6rem; margin-top:6px}
.dmx .rscore p{margin-top:8px; color:var(--muted)}
.dmx .rgrid{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:18px}
.dmx .rbox{border:1px solid var(--line); border-radius:16px; padding:22px; background:#fff}
.dmx .rbox h4{font-size:1.05rem; margin-bottom:6px}
.dmx .radarbox2{display:flex; justify-content:center; align-items:center}
.dmx .recs{display:grid; gap:10px; margin-top:8px}
.dmx .rec{display:flex; gap:11px; align-items:flex-start; padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:#fff}
.dmx .rec .b{width:30px; height:30px; border-radius:8px; flex:none; display:flex; align-items:center; justify-content:center; color:#fff; font-family:'Space Mono',monospace; font-size:.7rem}
.dmx .rec h5{font-size:.98rem; font-weight:600; font-family:'Space Grotesk',sans-serif}
.dmx .rec p{font-size:.88rem; color:#586079; margin-top:2px}
.dmx .ai{border:1px solid var(--line); border-radius:16px; padding:22px; background:#fff; margin-top:18px}
.dmx .ai .badge{font-family:'Space Mono',monospace; font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--c1d); display:inline-flex; align-items:center; gap:7px}
.dmx .ai .body{margin-top:12px; white-space:pre-wrap; color:#2c3346; font-size:.97rem; line-height:1.7}
.dmx .leadbox{border:1px solid var(--line); border-radius:18px; padding:26px; background:linear-gradient(180deg,#fff,var(--alt)); margin-top:20px}
.dmx .leadbox h4{font-size:1.2rem} .dmx .leadbox p{color:var(--muted); margin-top:6px; font-size:.95rem}
.dmx .leadbox .frow{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:16px}
.dmx .leadbox input{width:100%; border:1px solid var(--line); border-radius:10px; padding:12px 14px; font-family:inherit; font-size:.95rem}
.dmx .leadbox input:focus{outline:2px solid var(--c1); border-color:var(--c1)}
.dmx .leadbox .full{grid-column:1/-1}

/* reveal */
.dmx .rv{opacity:0; transform:translateY(18px); transition:opacity .7s, transform .7s}
.dmx .rv.in{opacity:1; transform:none}

/* responsivo */
@media (max-width:960px){
  .dmx .pcards,.dmx .bcards{grid-template-columns:repeat(2,1fr)}
  .dmx .values{grid-template-columns:repeat(2,1fr)}
  .dmx .plans{grid-template-columns:1fr; max-width:460px; margin-left:auto; margin-right:auto}
  .dmx .traccard,.dmx .diagteaser{grid-template-columns:1fr; gap:24px}
}
@media (max-width:840px){
  .dmx .hero .grid{grid-template-columns:1fr; gap:24px; padding-top:30px}
  .dmx .hero h1{font-size:clamp(2.05rem,8.5vw,3rem)}
  .dmx .hero .eyebrow{letter-spacing:.13em; font-size:.66rem}
  .dmx .hero .lead{font-size:1rem; margin-top:16px}
  .dmx .pgrid,.dmx .pmv{grid-template-columns:1fr}
  .dmx .rgrid{grid-template-columns:1fr} .dmx .rscore{grid-template-columns:1fr; text-align:center; justify-items:center}
}
@media (max-width:560px){
  .dmx .wrap{padding:0 24px}
  .dmx .heromore{display:none}
  .dmx .hero .grid{padding-left:2px; padding-right:2px}
  .dmx .hero .ctas{margin-top:22px} .dmx .hero .ctas .btn{flex:1 1 100%; justify-content:center}
  .dmx .pcards,.dmx .bcards,.dmx .values{grid-template-columns:1fr}
  .dmx .band{padding-left:56px} .dmx .step .ico{left:-49px}
  .dmx .leadbox .frow{grid-template-columns:1fr}
  .dmx .chain .nd{font-size:.76rem; padding:6px 9px}
}
@media (max-width:380px){ .dmx .wrap{padding:0 20px} .dmx .hero h1{font-size:1.92rem} }
@media (prefers-reduced-motion:reduce){
  .dmx .rv{transition:none; opacity:1; transform:none}
  .dmx .cta .bird img,.dmx .mockfloat,.dmx .hero::before,.dmx .mocktop .live i{animation:none}
}
.dmx .leadbox select{width:100%; border:1px solid var(--line); border-radius:10px; padding:12px 14px; font-family:inherit; font-size:.95rem; background:#fff; color:var(--ink); appearance:none; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23697089' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center}
.dmx .leadbox select:focus{outline:2px solid var(--c1); border-color:var(--c1)}

/* ===== AVISO DE COOKIES (LGPD) ===== */
.dmx .cookie{position:fixed; left:16px; right:16px; bottom:16px; z-index:90; max-width:660px; margin:0 auto; display:flex; gap:14px; align-items:center; background:rgba(13,20,38,.97); color:#dfe3f1; border:1px solid rgba(255,255,255,.14); border-radius:14px; padding:13px 16px; box-shadow:0 22px 54px -22px rgba(0,0,0,.7); animation:cookieup .45s ease both}
@keyframes cookieup{from{opacity:0; transform:translateY(120%)}to{opacity:1; transform:translateY(0)}}
.dmx .cookie p{font-size:.82rem; line-height:1.5; margin:0}
.dmx .cookie a{color:#9fb4ff; text-decoration:underline}
.dmx .cookie .cbtn{flex:none; display:flex; gap:8px}
.dmx .cookie button{font-family:inherit; font-size:.8rem; font-weight:600; border-radius:9px; padding:9px 15px; cursor:pointer; border:0; white-space:nowrap}
.dmx .cookie .ac{background:var(--arc); color:#fff}
.dmx .cookie .rj{background:transparent; color:#aeb5d1; border:1px solid rgba(255,255,255,.20)}
@media (max-width:560px){ .dmx .cookie{flex-direction:column; align-items:stretch} .dmx .cookie .cbtn{justify-content:flex-end} }

/* ===== PÁGINA LEGAL (privacidade) ===== */
.dmx .legal{max-width:760px; margin:0 auto}
.dmx .legal .upd{font-family:'Space Mono',monospace; font-size:.72rem; color:var(--muted); margin-bottom:20px}
.dmx .legal h3{font-family:'Space Grotesk',sans-serif; font-size:1.14rem; margin:28px 0 6px}
.dmx .legal p{color:#3a4258; margin-top:8px}
.dmx .legal ul{margin:10px 0 0 20px; color:#3a4258}
.dmx .legal li{margin:6px 0}
.dmx .legal a{color:var(--blue2); text-decoration:underline}