/* Plataforma AXIS, frente 41: portal do cliente (tela Início, menu do cliente e barra inferior no celular).
   Tudo escopado em .p41 / body.p41. Usa os tokens do app-glow.css (e os da F32, que têm os mesmos nomes). */

.p41{--p41-ok:var(--ok,#15805A);--p41-at:#D08A12;--p41-cr:var(--cr,#C0392B);--p41-ne:var(--mudo,#75728F);
  display:flex;flex-direction:column;gap:22px;max-width:1180px;margin:0 auto;font-variant-numeric:tabular-nums}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .p41{--p41-at:#F0B65A}}
:root[data-theme="dark"] .p41{--p41-at:#F0B65A}
.p41 h1,.p41 h2{margin:0;letter-spacing:-.02em}
.p41 p{margin:0}
.p41-ic{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ---------- boas-vindas ---------- */
.p41-hero{position:relative;overflow:hidden;display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;
  padding:30px 32px;border-radius:20px;color:#fff;
  background:radial-gradient(700px 320px at 92% -30%,rgba(132,54,254,.55),transparent 62%),radial-gradient(500px 260px at -5% 120%,rgba(132,54,254,.22),transparent 60%),linear-gradient(150deg,#16173F 0%,#0F1030 70%);
  box-shadow:0 18px 44px rgba(15,16,48,.22),inset 0 0 0 1px rgba(255,255,255,.06)}
.p41-hero::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1px);background-size:18px 18px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 70%);mask-image:linear-gradient(90deg,transparent,#000 70%)}
.p41-hero::after{content:"";position:absolute;left:32px;right:40%;bottom:0;height:1px;background:linear-gradient(90deg,transparent,rgba(167,119,255,.9),transparent);box-shadow:0 0 14px rgba(167,119,255,.8)}
.p41-hero-tx{position:relative;display:flex;flex-direction:column;gap:10px;max-width:640px}
.p41-selo{align-self:flex-start;font:600 10px/1 var(--m);letter-spacing:.22em;text-transform:uppercase;padding:7px 11px;border-radius:999px;color:#D9C7FF;background:rgba(167,119,255,.14);box-shadow:inset 0 0 0 1px rgba(167,119,255,.32)}
.p41-hero h1{font-size:clamp(26px,3.4vw,36px);font-weight:700;line-height:1.1;color:#fff}
.p41-hero p{font-size:15px;line-height:1.55;color:#C9C6E8}
.p41-hero p b{color:#fff;font-weight:600}
.p41-hero-ac{position:relative;display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.p41-mes{display:flex;flex-direction:column;gap:6px}
.p41-mes span{font:500 9.5px var(--m);letter-spacing:.2em;text-transform:uppercase;color:#9C98CC}
.p41-mes input{height:44px;border-radius:12px;border:0;padding:0 12px;background:rgba(255,255,255,.07);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);font:inherit;color-scheme:dark}
.p41-btn-ia{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 18px 0 8px;border-radius:999px;text-decoration:none;color:#fff;font-weight:600;font-size:14px;
  background:linear-gradient(135deg,#9A5BFF,#6E25E0);box-shadow:0 8px 24px rgba(132,54,254,.45),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .18s,box-shadow .18s}
.p41-btn-ia:hover{transform:translateY(-1px);box-shadow:0 12px 30px rgba(132,54,254,.55),inset 0 1px 0 rgba(255,255,255,.25)}
.p41-ia-bola{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.16);flex:none}
.p41-ia-bola svg{width:16px;height:16px;fill:currentColor}

/* ---------- saúde do mês ---------- */
.p41-sec{display:flex;flex-direction:column;gap:14px}
.p41-res{display:flex;gap:14px;align-items:center;padding:4px 2px}
.p41-res h2{font-size:20px;font-weight:700}
.p41-res p{font-size:14px;color:var(--fg-2);margin-top:3px}
.p41-luz{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none;background:var(--p41-ne);box-shadow:0 0 0 3px color-mix(in srgb,var(--p41-ne) 18%,transparent)}
.p41-luz.ok{background:var(--p41-ok);box-shadow:0 0 0 3px color-mix(in srgb,var(--p41-ok) 20%,transparent),0 0 10px color-mix(in srgb,var(--p41-ok) 55%,transparent)}
.p41-luz.at{background:var(--p41-at);box-shadow:0 0 0 3px color-mix(in srgb,var(--p41-at) 22%,transparent),0 0 10px color-mix(in srgb,var(--p41-at) 55%,transparent)}
.p41-luz.cr{background:var(--p41-cr);box-shadow:0 0 0 3px color-mix(in srgb,var(--p41-cr) 20%,transparent),0 0 10px color-mix(in srgb,var(--p41-cr) 55%,transparent)}
.p41-luz.grande{width:16px;height:16px}
.p41-inds{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.p41-ind{position:relative;display:flex;flex-direction:column;gap:8px;padding:18px 18px 16px;border-radius:16px;background:var(--card);color:var(--fg);text-decoration:none;
  box-shadow:var(--anel),var(--sombra);transition:transform .18s,box-shadow .18s;overflow:hidden}
.p41-ind::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--p41-ne);opacity:.55}
.p41-ind.ok::before{background:var(--p41-ok);opacity:1}.p41-ind.at::before{background:var(--p41-at);opacity:1}.p41-ind.cr::before{background:var(--p41-cr);opacity:1}
.p41-ind:hover{transform:translateY(-2px);box-shadow:0 0 0 1px var(--roxo-m),var(--sombra-2)}
.p41-ind:focus-visible,.p41-passo:focus-visible,.p41-arq:focus-visible,.p41-b:focus-visible{outline:2px solid var(--roxo);outline-offset:2px}
.p41-ind-top{display:flex;align-items:center;gap:9px}
.p41-ind-top small{font:500 10px var(--m);letter-spacing:.14em;text-transform:uppercase;color:var(--mudo)}
.p41-ind-v{font-size:24px;font-weight:700;letter-spacing:-.02em;line-height:1.15}
.p41-ind.cr .p41-ind-v{color:var(--p41-cr)}
.p41-ind-f{font-size:13px;line-height:1.45;color:var(--fg-2)}
.p41-leg{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:12px;color:var(--mudo)}
.p41-leg span{display:inline-flex;align-items:center;gap:7px}
.p41-leg .p41-luz{width:8px;height:8px;box-shadow:none}

/* ---------- caixas ---------- */
.p41-duas{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:18px;align-items:start}
.p41-duas:empty{display:none}
.p41-duas>.p41-box:only-child{grid-column:1/-1}
.p41-box{background:var(--card);border-radius:18px;padding:20px 22px;box-shadow:var(--anel),var(--sombra)}
.p41-box-cab{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.p41-box-cab h2{font-size:16.5px;font-weight:650}
.p41-box-cab p{font-size:13px;color:var(--mudo);margin-top:3px}
.p41-ver{flex:none;font-size:13px;font-weight:600;color:var(--roxo);text-decoration:none;padding:6px 10px;border-radius:9px;transition:background .15s}
.p41-ver:hover{background:var(--roxo-s)}
.p41-vazio{font-size:13.5px;color:var(--mudo);padding:16px;border-radius:12px;background:var(--bg);line-height:1.5}
.p41-vazio a{color:var(--roxo);font-weight:600}

.p41-passos,.p41-arqs{display:flex;flex-direction:column;gap:4px}
.p41-passo,.p41-arq{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:0;background:transparent;color:var(--fg);font:inherit;cursor:pointer;
  padding:11px 10px;border-radius:12px;text-decoration:none;transition:background .15s}
.p41-passo:hover,.p41-arq:hover{background:var(--bg)}
.p41-passo>.p41-ic{color:var(--mudo)}
.p41-passo-m{width:12px;height:12px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 2px var(--roxo)}
.p41-passo.precisa .p41-passo-m{background:var(--p41-at);box-shadow:0 0 0 4px color-mix(in srgb,var(--p41-at) 20%,transparent)}
.p41-passo-t,.p41-arq-t{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.p41-passo-t b,.p41-arq-t b{font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.p41-passo-t small,.p41-arq-t small{font-size:12px;color:var(--mudo)}
.p41-passo.precisa .p41-passo-t small{color:var(--at);font-weight:600}
.p41-arq-ic{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;flex:none;background:var(--bg-2);color:var(--fg-2)}
.p41-arq-ic.rel{background:var(--roxo-s);color:var(--roxo)}

/* consultor e Áxia */
.p41-consultor{gap:16px}
.p41-cons-top{display:flex;gap:14px;align-items:flex-start}
.p41-cons-av{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;flex:none;color:#fff;font-weight:700;font-size:15px;background:linear-gradient(140deg,#9A5BFF,#6E25E0);box-shadow:0 6px 18px rgba(132,54,254,.35)}
.p41-cons-av svg{width:22px;height:22px;fill:#fff}
.p41-cons-top small{font:500 10px var(--m);letter-spacing:.16em;text-transform:uppercase;color:var(--mudo)}
.p41-cons-top h2{font-size:18px;font-weight:700;margin:2px 0 4px}
.p41-cons-top p{font-size:13px;color:var(--fg-2);line-height:1.45}
.p41-wa-btn{display:flex;align-items:center;justify-content:center;gap:10px;min-height:48px;border-radius:999px;text-decoration:none;font-weight:650;font-size:14.5px;color:#fff;
  background:linear-gradient(135deg,#25B862,#128C4A);box-shadow:0 8px 22px rgba(18,140,74,.3),inset 0 1px 0 rgba(255,255,255,.22);transition:transform .18s,box-shadow .18s}
.p41-wa-btn:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(18,140,74,.38),inset 0 1px 0 rgba(255,255,255,.22)}
.p41-ia-card{display:flex;flex-direction:column;gap:10px;padding:14px;border-radius:14px;background:var(--roxo-s);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--roxo) 18%,transparent)}
.p41-ia-cab{display:flex;gap:10px;align-items:center}
.p41-ia-cab .p41-ia-bola{background:linear-gradient(135deg,#9A5BFF,#6E25E0);color:#fff}
.p41-ia-cab span:last-child{display:flex;flex-direction:column;gap:1px}
.p41-ia-cab b{font-size:14px}.p41-ia-cab small{font-size:12px;color:var(--fg-2)}
.p41-sug{display:flex;flex-direction:column;gap:6px}
.p41-sug a{font-size:13px;color:var(--fg);text-decoration:none;padding:9px 12px;border-radius:10px;background:var(--card);box-shadow:var(--anel);transition:box-shadow .15s,color .15s}
.p41-sug a:hover{color:var(--roxo);box-shadow:0 0 0 1px var(--roxo-m)}

/* medalhas */
.p41-nivel{height:8px;border-radius:99px;background:var(--bg-2);overflow:hidden}
.p41-nivel i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#8436FE,#B48BFF)}
.p41-meds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.p41-medi{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:12px 6px;border-radius:14px;text-decoration:none;color:var(--fg);transition:background .15s,transform .18s}
.p41-medi:hover{background:var(--bg);transform:translateY(-2px)}
.p41-medi svg{width:76px;height:76px}
.p41-medi b{font-size:13px;line-height:1.25}
.p41-medi small{font-size:11.5px;color:var(--mudo)}

/* rodapé com as redes */
.p41-pe{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;padding:8px 2px 4px;color:var(--mudo)}
.p41-pe-marca{display:flex;align-items:center;gap:10px}
.p41-pe-marca .logo-axis{height:16px;width:auto;color:var(--fg)}
.p41-pe-marca .logo-axis .lg-s{color:var(--roxo)}
.p41-pe-marca small{font:500 9.5px var(--m);letter-spacing:.2em;text-transform:uppercase}
.p41-redes{display:flex;gap:8px}
.p41-redes a{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;color:var(--fg-2);background:var(--card);box-shadow:var(--anel),var(--sombra);transition:color .15s,transform .18s,box-shadow .15s}
.p41-redes a:hover{color:var(--roxo);transform:translateY(-2px);box-shadow:0 0 0 1px var(--roxo-m),var(--sombra)}
.p41-redes svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* ---------- trilho do cliente (desktop) ---------- */
body.p41 nav.rail .p41-grupo a .p41-ic{opacity:.75}
body.p41 nav.rail .p41-grupo a:hover .p41-ic,body.p41 nav.rail .p41-grupo a[aria-current="page"] .p41-ic{opacity:1}
.p41-rail-wa{display:flex;align-items:center;gap:10px;margin-top:auto;padding:11px 12px;border-radius:12px;text-decoration:none;color:#fff;
  background:linear-gradient(135deg,rgba(37,184,98,.22),rgba(18,140,74,.12));box-shadow:inset 0 0 0 1px rgba(37,184,98,.35);transition:background .15s}
.p41-rail-wa:hover{background:linear-gradient(135deg,rgba(37,184,98,.32),rgba(18,140,74,.2))}
.p41-rail-wa .p41-ic{color:#5BE39A}
.p41-rail-wa span{display:flex;flex-direction:column;gap:1px}
.p41-rail-wa b{font-size:13px}.p41-rail-wa small{font-size:11px;color:var(--rail-fg,#C9C6E8)}
body.p41 nav.rail .pe{margin-top:0}

/* ---------- barra inferior e folha "Mais" (celular) ---------- */
.p41-barra,.p41-folha{display:none}
@media (max-width:980px){
  body.p41 .topo .menu-btn,body.p41 .topo #sair{display:none}
  body.p41 .app>main{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  body.p41 .toast{bottom:calc(88px + env(safe-area-inset-bottom,0px))}
  body.p41 .p41-barra{display:grid;grid-template-columns:repeat(var(--p41-n,5),minmax(0,1fr));position:fixed;z-index:40;left:0;right:0;bottom:0;
    padding:6px max(8px,env(safe-area-inset-right,0px)) calc(6px + env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px));
    background:color-mix(in srgb,var(--card) 88%,transparent);backdrop-filter:saturate(170%) blur(16px);-webkit-backdrop-filter:saturate(170%) blur(16px);
    box-shadow:0 -1px 0 var(--linha),0 -8px 30px rgba(22,22,46,.08)}
  .p41-b{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:54px;padding:4px 2px;border:0;background:transparent;
    color:var(--mudo);font:600 11px var(--f);text-decoration:none;border-radius:12px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:color .15s}
  .p41-b .p41-ic{transition:transform .18s}
  .p41-b[aria-current="page"]{color:var(--roxo)}
  .p41-b[aria-current="page"] .p41-ic{transform:translateY(-1px)}
  .p41-b[aria-current="page"]::before{content:"";position:absolute;top:-6px;left:30%;right:30%;height:3px;border-radius:0 0 3px 3px;background:var(--roxo);box-shadow:0 0 10px var(--roxo)}
  .p41-b:active .p41-ic{transform:scale(.92)}
  .p41-b-ia .p41-ia-bola{width:46px;height:46px;margin-top:-22px;color:#fff;background:linear-gradient(135deg,#9A5BFF,#6E25E0);
    box-shadow:0 8px 20px rgba(132,54,254,.45),0 0 0 4px var(--card),inset 0 1px 0 rgba(255,255,255,.25)}
  .p41-b-ia .p41-ia-bola svg{width:20px;height:20px}
  .p41-b-ia[aria-current="page"]::before{display:none}
  .p41-b .p41-n{position:absolute;top:4px;left:calc(50% + 6px);min-width:17px;height:17px;padding:0 5px;border-radius:9px;background:var(--p41-cr-b,#C0392B);color:#fff;font:700 10px/17px var(--m);font-style:normal;box-shadow:0 0 0 2px var(--card)}
  body.p41 .p41-folha:not([hidden]){display:flex;position:fixed;inset:0;z-index:45;align-items:flex-end;background:rgba(9,10,26,.45);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);animation:p41-fade .18s ease}
  .p41-folha-c{width:100%;max-height:86vh;overflow:auto;display:flex;flex-direction:column;gap:14px;background:var(--card);color:var(--fg);border-radius:22px 22px 0 0;
    padding:10px max(18px,env(safe-area-inset-right,0px)) calc(18px + env(safe-area-inset-bottom,0px)) max(18px,env(safe-area-inset-left,0px));box-shadow:0 -20px 50px rgba(0,0,0,.25);animation:p41-sobe .22s cubic-bezier(.2,.8,.2,1)}
  .p41-alca{align-self:center;width:40px;height:4px;border-radius:4px;background:var(--linha-2)}
  .p41-folha-emp{display:flex;gap:12px;align-items:center}
  .p41-folha-emp span:last-child{display:flex;flex-direction:column}
  .p41-folha-emp b{font-size:16px}.p41-folha-emp small{font-size:12.5px;color:var(--mudo)}
  .p41-emp-lg{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;color:#fff;font-weight:700}
  .p41-folha-sel{display:flex;flex-direction:column;gap:6px;font:500 10px var(--m);letter-spacing:.16em;text-transform:uppercase;color:var(--mudo)}
  .p41-folha-sel select{height:46px;border-radius:12px;font:inherit;font-size:14px;letter-spacing:0;text-transform:none;color:var(--fg)}
  .p41-folha-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .p41-folha-g a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:80px;padding:10px 6px;border-radius:14px;text-align:center;
    background:var(--bg);color:var(--fg);text-decoration:none;font-size:12.5px;font-weight:550;line-height:1.25}
  .p41-folha-g a svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;color:var(--roxo)}
  .p41-folha-g a[aria-current="page"]{background:var(--roxo-s);box-shadow:inset 0 0 0 1px var(--roxo-m)}
  .p41-sair{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;border:0;border-radius:999px;background:transparent;color:var(--mudo);font:600 14px var(--f);box-shadow:inset 0 0 0 1px var(--linha-2);cursor:pointer}
  body.p41-mais-aberto{overflow:hidden}

  .p41-hero{padding:24px 20px 22px;border-radius:18px}
  .p41-hero::after{left:20px;right:20%}
  .p41-hero-ac{width:100%}
  .p41-mes{flex:1}
  .p41-mes input{width:100%}
  .p41-duas{grid-template-columns:minmax(0,1fr)}
  .p41-inds{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){
  .p41{gap:18px}
  .p41-hero h1{font-size:26px}
  .p41-hero p{font-size:14px}
  .p41-btn-ia{flex:1;justify-content:center}
  .p41-inds{grid-template-columns:minmax(0,1fr);gap:10px}
  .p41-ind{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"top v" "f f";align-items:center;gap:6px 10px;padding:15px 16px}
  .p41-ind-top{grid-area:top}.p41-ind-v{grid-area:v;font-size:19px;text-align:right}.p41-ind-f{grid-area:f}
  .p41-box{padding:18px 16px;border-radius:16px}
  .p41-res h2{font-size:18px}
  .p41-meds{gap:4px}
  .p41-medi svg{width:62px;height:62px}
  .p41-pe{justify-content:center}
  .p41-passo-t b,.p41-arq-t b{white-space:normal;line-height:1.3}
}
@keyframes p41-fade{from{opacity:0}}
@keyframes p41-sobe{from{transform:translateY(40px);opacity:.4}}
@media (prefers-reduced-motion:reduce){.p41 *,.p41-folha *{animation:none!important;transition:none!important}}

/* grade dos indicadores: 5 viram 3 + 2 no desktop, sem cartão sozinho na segunda linha */
@media (min-width:981px){
  .p41-inds.n5{grid-template-columns:repeat(6,minmax(0,1fr))}
  .p41-inds.n5>.p41-ind{grid-column:span 2}
  .p41-inds.n5>.p41-ind:nth-child(n+4){grid-column:span 3}
  .p41-inds.n4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .p41-inds.n3{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:980px) and (min-width:561px){.p41-inds.n5>.p41-ind:last-child,.p41-inds.n3>.p41-ind:last-child{grid-column:1/-1}}
/* celular: o trilho só aparece durante o tour de primeiro acesso (ele aponta para os itens do menu) */
@media (max-width:980px){body.p41.menu-aberto:not(:has(.tour-card)) nav.rail{transform:translateX(-102%)}}
