/* ============================================================
   AULA · FUNIL MENTORIA EMPRESARIOS · Luz da Serra
   ------------------------------------------------------------
   Porta a experiencia de AULA do funil-avalanche.denderson.ai
   pro tema dark do radar/conteudo. TUDO escopado em
   [data-sec="funil-empresarios"] pra NAO colidir com o aula.css
   do funil de terapeutas (outro Paulo). Copy v1, refinar.
   Tokens herdados do index (oklch dark). Acordeao por fase:
   explicacao "como foi construida" + infografico + principio.
   ============================================================ */

/* ---- container raiz da aula: 1080 centralizado, IGUAL ao funil de terapeutas.
   O terapeutas usa .aula{max-width:1350px;margin:0 auto} num wrapper <div class="aula">.
   A minha aula nao tem wrapper, entao centralizo a propria <section> (mesmo efeito
   visual, sem precisar editar o index.html). ---- */
[data-sec="funil-empresarios"] { max-width: 1350px; margin: 0 auto; }

/* ---- callout de DESTAQUE forte (vantagem do funil), topo da Fundacao ---- */
[data-sec="funil-empresarios"] .aula-highlight { position:relative; border:1px solid var(--coral); border-radius:16px; background:linear-gradient(180deg, oklch(0.70 0.16 32 / 0.13), oklch(0.70 0.16 32 / 0.04)); padding:22px 24px 22px 28px; margin:14px 0 22px; overflow:hidden; box-shadow:0 0 0 1px oklch(0.70 0.16 32 / 0.10), 0 26px 54px -34px oklch(0.70 0.16 32 / 0.45); }
[data-sec="funil-empresarios"] .aula-highlight::before { content:""; position:absolute; left:0; top:0; bottom:0; width:5px; background:var(--coral); }
[data-sec="funil-empresarios"] .aula-highlight .hl-k { display:inline-flex; align-items:center; gap:9px; font-family:var(--font-display); font-weight:800; font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--coral); margin-bottom:11px; }
[data-sec="funil-empresarios"] .aula-highlight p { color:var(--ink); font-size:16px; line-height:1.62; margin:0; max-width:74ch; }
[data-sec="funil-empresarios"] .aula-highlight p b { color:var(--coral); font-weight:800; }

/* ---- infografico: frame visual da aula ---- */
[data-sec="funil-empresarios"] .figframe { margin:6px 0 26px; border:1px solid var(--line); border-radius:16px; padding:10px; background:linear-gradient(180deg,var(--surface),var(--surface-2)); box-shadow:0 30px 60px -38px rgba(0,0,0,.6); position:relative; }
[data-sec="funil-empresarios"] .figframe .ftag { position:absolute; top:-10px; left:22px; font-family:var(--font-mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-faint); background:var(--bg); padding:3px 11px; border:1px solid var(--line); border-radius:999px; z-index:2; }
[data-sec="funil-empresarios"] .figframe img { width:100%; height:auto; aspect-ratio:1536/1024; display:block; border-radius:10px; border:1px solid var(--line-soft); object-fit:cover; }
/* frame visual: mesma proporcao 3:2 da imagem real */
[data-sec="funil-empresarios"] .figph { aspect-ratio:1536/1024; width:100%; border-radius:10px; border:1px dashed var(--line); display:grid; place-items:center; text-align:center; padding:24px; position:relative; overflow:hidden;
  background:
    radial-gradient(120% 90% at 50% 0%, oklch(0.70 0.16 32 / 0.06), transparent 60%),
    repeating-linear-gradient(0deg, transparent 0 23px, oklch(0.30 0.012 265 / .35) 23px 24px),
    repeating-linear-gradient(90deg, transparent 0 23px, oklch(0.30 0.012 265 / .35) 23px 24px),
    var(--surface-2);
}
[data-sec="funil-empresarios"] .figph .ph-mark { width:46px; height:46px; border-radius:12px; border:1.5px solid var(--coral); display:grid; place-items:center; margin:0 auto 14px; color:var(--coral); background:oklch(0.70 0.16 32 / 0.10); }
[data-sec="funil-empresarios"] .figph .ph-mark svg { width:22px; height:22px; display:block; }
[data-sec="funil-empresarios"] .figph .ph-h { font-family:var(--font-display); font-weight:700; font-size:14px; letter-spacing:.02em; color:var(--ink); }
[data-sec="funil-empresarios"] .figph .ph-s { font-family:var(--font-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-faint); margin-top:8px; }
[data-sec="funil-empresarios"] .figcap { margin:-16px 0 30px; font-family:var(--font-mono); font-size:11px; letter-spacing:.03em; color:var(--ink-faint); text-align:center; }

/* ---- prosa da aula: O que e / Como funciona / Por que existe ---- */
[data-sec="funil-empresarios"] .lesson { margin-top:4px; }
[data-sec="funil-empresarios"] .lesson .lblock { margin-top:22px; }
[data-sec="funil-empresarios"] .lesson .lblock:first-child { margin-top:0; }
[data-sec="funil-empresarios"] .lesson .lh { font-family:var(--font-display); font-weight:700; font-size:13px; letter-spacing:.04em; text-transform:uppercase; color:var(--ink); display:inline-flex; align-items:center; gap:10px; margin-bottom:11px; }
[data-sec="funil-empresarios"] .lesson .lh::before { content:""; width:18px; height:2px; background:var(--coral); border-radius:2px; flex:0 0 auto; }
[data-sec="funil-empresarios"] .lesson p { color:var(--ink-soft); font-size:15.5px; line-height:1.66; margin-bottom:12px; max-width:68ch; }
[data-sec="funil-empresarios"] .lesson p:last-child { margin-bottom:0; }
[data-sec="funil-empresarios"] .lesson p b { color:var(--ink); font-weight:700; }
[data-sec="funil-empresarios"] .lesson .ankor { color:var(--coral); font-style:italic; font-weight:600; }
[data-sec="funil-empresarios"] .lesson .qa { margin-top:14px; }
[data-sec="funil-empresarios"] .lesson .qa>p:first-child { font-family:var(--font-display); font-weight:700; color:var(--ink); font-size:15.5px; letter-spacing:-.005em; }
[data-sec="funil-empresarios"] .lesson ul.dense { list-style:none; padding:0; margin:6px 0 12px; display:grid; gap:9px; }
[data-sec="funil-empresarios"] .lesson ul.dense li { position:relative; padding-left:18px; font-size:15px; line-height:1.55; color:var(--ink-soft); max-width:68ch; overflow-wrap:anywhere; }
[data-sec="funil-empresarios"] .lesson ul.dense li::before { content:""; position:absolute; left:0; top:8px; width:6px; height:6px; border-radius:50%; background:var(--coral); }
[data-sec="funil-empresarios"] .lesson ul.dense li b { color:var(--ink); font-weight:700; }

/* ---- callout "Principio pra modelar": a licao que o time leva ---- */
[data-sec="funil-empresarios"] .principle { margin-top:24px; border:1px solid var(--coral); border-radius:16px; background:oklch(0.70 0.16 32 / 0.08); padding:22px 24px 22px 26px; position:relative; overflow:hidden; }
[data-sec="funil-empresarios"] .principle::before { content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--coral); }
[data-sec="funil-empresarios"] .principle .pk { display:inline-flex; align-items:center; gap:9px; font-family:var(--font-display); font-weight:700; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--coral); margin-bottom:10px; }
[data-sec="funil-empresarios"] .principle p { color:var(--ink-soft); font-size:15.5px; line-height:1.6; margin:0; max-width:70ch; }
[data-sec="funil-empresarios"] .principle p strong { color:var(--ink); font-weight:800; }

/* ---- basecard (fundacao): cartao com glow ---- */
[data-sec="funil-empresarios"] .basecard { background:var(--surface-2); border:1px solid var(--line); border-radius:18px; padding:clamp(22px,3vw,32px); position:relative; overflow:hidden; box-shadow:0 0 0 1px oklch(0.70 0.16 32 / 0.06), 0 40px 80px -50px rgba(0,0,0,.7); }
[data-sec="funil-empresarios"] .basecard::after { content:""; position:absolute; inset:0; background:radial-gradient(80% 120% at 100% 0%, oklch(0.70 0.16 32 / 0.10), transparent 55%); pointer-events:none; }
[data-sec="funil-empresarios"] .basecard .blabel { font-family:var(--font-display); font-weight:600; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--coral); margin-bottom:10px; display:flex; align-items:center; gap:10px; }
[data-sec="funil-empresarios"] .basecard .blabel::before { content:""; width:18px; height:1px; background:var(--coral); }
[data-sec="funil-empresarios"] .basecard h2 { font-family:var(--font-display); font-weight:800; font-size:clamp(22px,3vw,32px); letter-spacing:-.02em; line-height:1.12; color:var(--ink); margin-bottom:14px; }
[data-sec="funil-empresarios"] .basecard h2 em { font-style:italic; color:var(--coral); }
[data-sec="funil-empresarios"] .basecard .bp { color:var(--ink-soft); font-size:15.5px; line-height:1.66; max-width:72ch; }

/* ---- flowline: pilulas do caminho do funil ---- */
[data-sec="funil-empresarios"] .flowline { display:flex; flex-wrap:wrap; align-items:center; gap:9px; margin-top:22px; }
[data-sec="funil-empresarios"] .flowline .fstep { font-family:var(--font-body); font-size:13px; font-weight:600; color:var(--ink); background:var(--surface); border:1px solid var(--line); border-radius:999px; padding:8px 14px; }
[data-sec="funil-empresarios"] .flowline .fstep b { color:var(--coral); }
[data-sec="funil-empresarios"] .flowline .far { color:var(--ink-faint); font-family:var(--font-mono); }

/* ---- levers (duas alavancas da fundacao) ---- */
[data-sec="funil-empresarios"] .levers { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:22px; }
@media(max-width:640px){ [data-sec="funil-empresarios"] .levers { grid-template-columns:1fr; } }
[data-sec="funil-empresarios"] .lever { background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:18px; }
[data-sec="funil-empresarios"] .lever .lh { font-family:var(--font-display); font-weight:700; font-size:13px; letter-spacing:.04em; text-transform:uppercase; color:var(--esmeralda); margin-bottom:8px; }
[data-sec="funil-empresarios"] .lever p { color:var(--ink-soft); font-size:14px; line-height:1.55; margin:0; }

/* ============================================================
   ACCORDION (caixa colapsavel por fase): <details>/<summary>
   nativo, 1 clique, abre sem JS, todas fechadas por padrao.
   ============================================================ */
[data-sec="funil-empresarios"] .acc { margin:0 0 12px; }
[data-sec="funil-empresarios"] .acc>summary {
  list-style:none; cursor:pointer; display:block; position:relative;
  background:var(--surface); border:1px solid var(--line); border-radius:18px;
  padding:clamp(18px,2.4vw,26px) clamp(54px,7vw,64px) clamp(18px,2.4vw,26px) clamp(20px,2.6vw,30px);
  transition:transform .18s var(--ease), box-shadow .18s var(--ease), border-color .18s var(--ease), background .18s var(--ease);
  -webkit-tap-highlight-color:transparent;
}
[data-sec="funil-empresarios"] .acc>summary::-webkit-details-marker { display:none; }
[data-sec="funil-empresarios"] .acc>summary::marker { content:""; }
[data-sec="funil-empresarios"] .acc>summary:hover { transform:translateY(-2px); border-color:var(--coral); background:var(--surface-2); }
[data-sec="funil-empresarios"] .acc>summary:focus-visible { outline:2px solid var(--coral); outline-offset:3px; }
[data-sec="funil-empresarios"] .acc[open]>summary { border-bottom-left-radius:0; border-bottom-right-radius:0; border-bottom-color:transparent; transform:none; }
[data-sec="funil-empresarios"] .acc[open]>summary:hover { transform:none; background:var(--surface); }

[data-sec="funil-empresarios"] .acc .achead { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; }
[data-sec="funil-empresarios"] .acc .achead .stag { font-family:var(--font-display); font-weight:600; font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:6px; }
[data-sec="funil-empresarios"] .acc .achead h3 { font-family:var(--font-display); font-weight:800; font-size:clamp(19px,2.2vw,26px); letter-spacing:-.02em; line-height:1.14; color:var(--ink); }

/* base (fundacao): label coral + titulo em coral */
[data-sec="funil-empresarios"] .acc.accbase>summary { background:var(--surface-2); }
[data-sec="funil-empresarios"] .acc.accbase .achead .blabel { font-family:var(--font-display); font-weight:600; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--coral); margin-bottom:8px; display:flex; align-items:center; gap:10px; }
[data-sec="funil-empresarios"] .acc.accbase .achead .blabel::before { content:""; width:18px; height:1px; background:var(--coral); }
[data-sec="funil-empresarios"] .acc.accbase .achead h3 { font-size:clamp(21px,2.8vw,31px); }
[data-sec="funil-empresarios"] .acc.accbase .achead h3 em { font-style:italic; color:var(--coral); }

/* teaser: 1 frase, some com a caixa aberta */
[data-sec="funil-empresarios"] .acc .acteaser { margin-top:10px; color:var(--ink-faint); font-size:14.5px; line-height:1.55; max-width:72ch; }
[data-sec="funil-empresarios"] .acc[open] .acteaser { display:none; }

/* chevron gira ao abrir */
[data-sec="funil-empresarios"] .acc>summary .acchev { position:absolute; top:clamp(20px,2.6vw,28px); right:clamp(18px,2.4vw,26px); width:30px; height:30px; border-radius:50%; border:1.5px solid var(--line); display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; color:var(--coral); background:var(--bg); transition:transform .25s var(--ease), border-color .18s var(--ease), background .18s var(--ease), color .18s var(--ease); }
[data-sec="funil-empresarios"] .acc>summary:hover .acchev { border-color:var(--coral); }
[data-sec="funil-empresarios"] .acc[open]>summary .acchev { transform:rotate(180deg); background:var(--coral); border-color:var(--coral); color:var(--coral-ink); }
[data-sec="funil-empresarios"] .acc>summary .acchev svg { width:14px; height:14px; display:block; }

/* status badge no header */
[data-sec="funil-empresarios"] .acc .achead .status { display:inline-flex; align-items:center; gap:7px; font-family:var(--font-mono); font-size:11px; font-weight:500; letter-spacing:.04em; padding:7px 12px; border-radius:999px; white-space:nowrap; }
[data-sec="funil-empresarios"] .status.ok { color:var(--esmeralda); background:oklch(0.78 0.17 158 / 0.12); border:1px solid oklch(0.78 0.17 158 / 0.4); }
[data-sec="funil-empresarios"] .status.wip { color:var(--ink-faint); background:transparent; border:1px dashed var(--line); }

/* corpo da caixa */
[data-sec="funil-empresarios"] .acc .acbody { border:1px solid var(--line); border-top:0; border-radius:0 0 18px 18px; background:var(--surface); padding:clamp(4px,1vw,10px) clamp(22px,2.6vw,32px) clamp(22px,2.6vw,32px); }
[data-sec="funil-empresarios"] .acc.accbase .acbody { background:var(--surface-2); }
[data-sec="funil-empresarios"] .acc .acbody>.figframe:first-child { margin-top:14px; }
[data-sec="funil-empresarios"] .acc .acbody .what { color:var(--ink-soft); font-size:15.5px; line-height:1.66; margin:14px 0 4px; max-width:72ch; }
[data-sec="funil-empresarios"] .acc .acbody .what b { color:var(--ink); }

/* ---- keep-rule + links pras paginas reais ---- */
[data-sec="funil-empresarios"] .keep-rule { margin-top:24px; border-top:1px dashed var(--line); padding-top:18px; }
[data-sec="funil-empresarios"] .keep-rule .krh { font-family:var(--font-display); font-weight:600; font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:12px; }
[data-sec="funil-empresarios"] .links { display:flex; flex-wrap:wrap; gap:9px; }
[data-sec="funil-empresarios"] .plink { display:inline-flex; align-items:center; gap:8px; font-family:var(--font-body); font-weight:600; font-size:13px; color:var(--ink); background:var(--surface-2); border:1px solid var(--line); border-radius:999px; padding:9px 15px; text-decoration:none; transition:transform .16s var(--ease), border-color .16s var(--ease), background .16s var(--ease); }
[data-sec="funil-empresarios"] .plink:hover { transform:translateY(-1px); border-color:var(--coral); }
[data-sec="funil-empresarios"] .plink.solid { background:var(--coral); color:var(--coral-ink); border-color:transparent; }
[data-sec="funil-empresarios"] .plink.solid:hover { background:var(--coral-press); }
[data-sec="funil-empresarios"] .plink .pa { color:var(--coral); font-family:var(--font-mono); }
[data-sec="funil-empresarios"] .plink.solid .pa { color:var(--coral-ink); }
[data-sec="funil-empresarios"] .knote { margin-top:12px; font-size:13.5px; line-height:1.55; color:var(--ink-faint); }
[data-sec="funil-empresarios"] .knote b { color:var(--ink-soft); }

/* ---- resumo final: as fases numa frase cada ---- */
[data-sec="funil-empresarios"] .recap { display:grid; gap:12px; margin-top:8px; }
[data-sec="funil-empresarios"] .recap .rline { display:grid; grid-template-columns:auto 1fr; gap:18px; align-items:baseline; border:1px solid var(--line); border-radius:14px; background:var(--surface); padding:18px 22px; transition:transform .16s var(--ease), border-color .16s var(--ease); }
[data-sec="funil-empresarios"] .recap .rline:hover { transform:translateY(-2px); border-color:var(--coral); }
[data-sec="funil-empresarios"] .recap .rline .rtag { font-family:var(--font-display); font-weight:800; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--coral); white-space:nowrap; }
[data-sec="funil-empresarios"] .recap .rline p { color:var(--ink-soft); font-size:15px; line-height:1.55; margin:0; }
[data-sec="funil-empresarios"] .recap .rline p b { color:var(--ink); font-weight:700; }
@media(max-width:560px){ [data-sec="funil-empresarios"] .recap .rline { grid-template-columns:1fr; gap:6px; } }

/* ---- regua de secao interna ---- */
[data-sec="funil-empresarios"] .sec-rule { display:flex; align-items:center; gap:16px; margin:40px 0 22px; }
[data-sec="funil-empresarios"] .sec-rule .rom { font-family:var(--font-display); font-style:italic; font-weight:700; font-size:15px; color:var(--coral); white-space:nowrap; }
[data-sec="funil-empresarios"] .sec-rule .mid { flex:1; height:1px; background:var(--line); }
[data-sec="funil-empresarios"] .sec-rule>span:last-child { font-family:var(--font-mono); font-size:11px; letter-spacing:.14em; color:var(--ink-faint); }

/* ---- nomes do produto (submenu pro Bruno escolher) ---- */
[data-sec="funil-empresarios"] .names { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
@media(max-width:760px){ [data-sec="funil-empresarios"] .names { grid-template-columns:1fr; } }
[data-sec="funil-empresarios"] .namecard { background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:22px; position:relative; transition:transform .18s var(--ease), border-color .18s var(--ease); }
[data-sec="funil-empresarios"] .namecard:hover { transform:translateY(-2px); border-color:var(--ink-faint); }
[data-sec="funil-empresarios"] .namecard.rec { border-color:oklch(0.70 0.16 32 / 0.55); box-shadow:0 0 0 1px oklch(0.70 0.16 32 / 0.22); }
[data-sec="funil-empresarios"] .namecard .nmeta { font-family:var(--font-mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:10px; }
[data-sec="funil-empresarios"] .namecard .nm { font-family:var(--font-display); font-weight:800; font-size:1.9rem; letter-spacing:-.03em; line-height:1; color:var(--ink); }
[data-sec="funil-empresarios"] .namecard .nm .ia { color:var(--coral); }
[data-sec="funil-empresarios"] .namecard .njust { color:var(--ink-soft); font-size:.92rem; line-height:1.55; margin-top:12px; }
[data-sec="funil-empresarios"] .namecard .nbadge { position:absolute; top:14px; right:14px; font-family:var(--font-mono); font-size:.56rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--coral-ink); background:var(--coral); border-radius:999px; padding:4px 10px; }

/* ---- nota informativa / copy v1 ---- */
[data-sec="funil-empresarios"] .infonote { display:flex; gap:10px; align-items:flex-start; background:var(--surface); border:1px solid var(--line); border-left:3px solid var(--coral); border-radius:10px; padding:14px 16px; color:var(--ink-soft); font-size:.88rem; line-height:1.55; margin-top:22px; }
[data-sec="funil-empresarios"] .infonote b { color:var(--ink); }
[data-sec="funil-empresarios"] .infonote.pend { border-left-color:var(--dourado); }

@media(max-width:680px){
  [data-sec="funil-empresarios"] .acc>summary { padding-right:52px; }
  [data-sec="funil-empresarios"] .acc>summary .acchev { width:26px; height:26px; right:14px; top:18px; }
}
@media(max-width:560px){
  [data-sec="funil-empresarios"] .acc>summary { border-radius:16px; }
  [data-sec="funil-empresarios"] .acc[open]>summary { border-bottom-left-radius:0; border-bottom-right-radius:0; }
  [data-sec="funil-empresarios"] .acc .acbody { border-radius:0 0 16px 16px; }
  [data-sec="funil-empresarios"] .lesson p, [data-sec="funil-empresarios"] .lesson ul.dense li { font-size:15px; }
}