/* ============================================================
   CREATOR ACADEMY — páginas de formação
   Complementa style.css (nav, menu, preloader, cursor, cta, faq…)
   ============================================================ */

/* ---------- Hero com capa ---------- */
#hero.p-hero{
  min-height:100svh;overflow:hidden;isolation:isolate;
  padding-top:calc(var(--gutter)*4.2);
}
#hero .p-cover{
  position:absolute;inset:-12% 0 -12% 0;width:100%;height:124%;object-fit:cover;z-index:-2;
  opacity:.5;filter:saturate(.7) contrast(1.08);will-change:transform;
}
#hero .p-shade{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(to top,var(--ink) 0%,rgba(7,7,8,.55) 32%,rgba(7,7,8,.25) 60%,rgba(7,7,8,.55) 100%),
    radial-gradient(70% 60% at 50% 60%,rgba(7,7,8,.35),transparent 70%);
}
#hero .h-tag{display:flex;align-items:center;gap:1.4em;flex-wrap:wrap;margin-bottom:1.8em;color:var(--paper)}
#hero .h-tag .crumb{color:var(--graphite)}
#hero .h-tag .crumb a:hover{color:var(--ember)}
#hero.p-hero .h-title{font-size:clamp(2.7rem,7.4vw,8.2rem);line-height:.94;letter-spacing:-.045em;font-weight:500;text-wrap:balance;max-width:14ch}
#hero.p-hero .h-title .serif{letter-spacing:0}
#hero.p-hero .h-title .em{color:var(--ember)}
#hero .h-side{max-width:30ch}
#hero .h-badge .big{font-size:20px}
#hero.p-hero .h-logo{
  position:absolute;right:var(--gutter);top:calc(var(--gutter)*4.4);width:min(28vw,340px);
  perspective:1000px;display:grid;place-items:center;z-index:2;
}
#hero.p-hero .h-logo .logo3d{width:100%}
#hero.p-hero .h-logo .logo3d.text .ly{font-size:clamp(1.6rem,3vw,2.8rem)}
@media (max-width:900px){ #hero.p-hero .h-logo{display:none} }
@media (max-width:820px){ #hero.p-hero .h-title{max-width:none} }

/* ---------- Seção genérica: cabeçalho fixo + corpo ---------- */
.sec{padding:clamp(5rem,12vh,10rem) var(--gutter)}
.sec .grid{align-items:start}
.sec .s-head{grid-column:1/5;position:sticky;top:calc(var(--gutter)*3);display:flex;flex-direction:column;gap:1.2em}
.sec .s-head .d3{max-width:16ch}
.sec .s-head .d3 .s,.sec .d2 .s,.sec .d3 .s{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0}
.sec .s-head p{font-size:15px;max-width:30ch}
.sec .s-body{grid-column:6/13}
.sec .s-full{grid-column:1/13}
.sec.dark .s-head p{color:var(--graphite)}
.sec.light .s-head p{color:var(--graphite-2)}
@media (max-width:820px){ .sec .s-head{position:static;grid-column:1/13;margin-bottom:2em} .sec .s-body{grid-column:1/13} }

/* ---------- Statement (about) na página ---------- */
#about.p-about{padding:clamp(5rem,14vh,12rem) var(--gutter) clamp(4rem,10vh,8rem)}
#about.p-about .st{font-size:clamp(1.7rem,3.8vw,4rem)}

/* ---------- Linhas numeradas ---------- */
.rows{display:flex;flex-direction:column}
.rows .r{display:grid;grid-template-columns:3.4em 1fr;gap:1.2em;padding:1.35em 0;border-top:1px solid var(--line-light);align-items:start}
.dark .rows .r{border-color:var(--line-dark)}
.rows .r:last-child{border-bottom:1px solid var(--line-light)}
.dark .rows .r:last-child{border-bottom-color:var(--line-dark)}
.rows .r .n{font-family:var(--serif);font-style:italic;font-size:1.25rem;color:var(--ember);line-height:1.3}
.rows .r .k{font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--graphite-2);display:block;margin-bottom:.35em}
.dark .rows .r .k{color:var(--graphite)}
.rows .r h4{font-size:clamp(1.05rem,1.5vw,1.45rem);letter-spacing:-.02em;font-weight:500;line-height:1.2}
.rows .r p{font-size:14.5px;line-height:1.5;color:var(--graphite-2);max-width:52ch;margin-top:.35em}
.dark .rows .r p{color:var(--graphite)}
.rows .r .tags{display:flex;flex-wrap:wrap;gap:.4em;margin-top:.8em}
.rows .r .tags span{font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:500;border:1px solid var(--line-light);border-radius:999px;padding:.4em .75em}
.dark .rows .r .tags span{border-color:var(--line-dark)}

/* ---------- Cards de mecanismo (D.S.A.D. / A.P.E.) ---------- */
.mech{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--gutter)}
.mech.three{grid-template-columns:repeat(3,1fr)}
@media (max-width:700px){ .mech,.mech.three{grid-template-columns:1fr} .mech .m{min-height:0} }
.mech .m{border:1px solid var(--line-dark);border-radius:6px;padding:1.6em;min-height:240px;display:flex;flex-direction:column;justify-content:space-between;gap:1.6em;
  background:linear-gradient(180deg,rgba(241,239,234,.03),transparent);transition:border-color .4s,transform .6s var(--ease)}
.mech .m:hover{border-color:var(--ember);transform:translateY(-4px)}
.light .mech .m{border-color:var(--line-light);background:rgba(241,239,234,.35)}
.mech .m .big{font-family:var(--serif);font-style:italic;font-size:clamp(3rem,6vw,5.4rem);line-height:.9;color:var(--ember)}
.mech .m h4{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;margin-bottom:.6em}
.mech .m p{font-size:14px;color:var(--graphite);max-width:28ch}
.light .mech .m p{color:var(--graphite-2)}

/* ---------- Estrutura: blocos + módulos ---------- */
.blocks-list{display:flex;flex-direction:column}
.blocks-list details{border-top:1px solid var(--line-light)}
.blocks-list details:last-child{border-bottom:1px solid var(--line-light)}
.dark .blocks-list details,.dark .blocks-list details:last-child{border-color:var(--line-dark)}
.blocks-list summary{list-style:none;display:grid;grid-template-columns:3.4em 1fr auto;gap:1.2em;align-items:center;padding:1.4em 0;cursor:none}
.blocks-list summary::-webkit-details-marker{display:none}
.blocks-list summary .n{font-family:var(--serif);font-style:italic;font-size:1.25rem;color:var(--ember)}
.blocks-list summary h4{font-size:clamp(1.15rem,1.8vw,1.7rem);letter-spacing:-.025em;font-weight:500;line-height:1.15}
.blocks-list summary h4 small{display:block;font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--graphite-2);margin-bottom:.4em}
.dark .blocks-list summary h4 small{color:var(--graphite)}
.blocks-list summary .pm{width:34px;height:34px;border-radius:50%;border:1px solid var(--line-light);display:grid;place-items:center;font-weight:300;font-size:20px;flex-shrink:0;transition:transform .5s var(--ease),background .3s,color .3s}
.dark .blocks-list summary .pm{border-color:var(--line-dark)}
.blocks-list details[open] summary .pm{transform:rotate(45deg);background:var(--ink);color:var(--paper)}
.dark .blocks-list details[open] summary .pm{background:var(--paper);color:var(--ink)}
.blocks-list .mods{padding:0 0 1.6em calc(3.4em + 1.2em);display:flex;flex-direction:column;gap:.2em}
.blocks-list .mods li{display:grid;grid-template-columns:2.6em 1fr;gap:.8em;padding:.7em 0;border-top:1px dashed var(--line-light);font-size:15px;line-height:1.4}
.dark .blocks-list .mods li{border-color:var(--line-dark)}
.blocks-list .mods li .i{font-size:10px;letter-spacing:.12em;font-weight:500;color:var(--graphite-2);padding-top:.35em}
.blocks-list .mods li .les{display:block;font-size:12.5px;color:var(--graphite-2);margin-top:.3em;line-height:1.5}
.dark .blocks-list .mods li .les,.dark .blocks-list .mods li .i{color:var(--graphite)}
.blocks-list .mods li .les b{font-weight:500;color:inherit}
.blocks-list .b-desc{padding:0 0 1.2em calc(3.4em + 1.2em);font-size:15px;color:var(--graphite-2);max-width:56ch;line-height:1.55}
.dark .blocks-list .b-desc{color:var(--graphite)}
@media (max-width:600px){ .blocks-list .mods,.blocks-list .b-desc{padding-left:0} }

/* ---------- Para quem é / não é ---------- */
.who{display:grid;grid-template-columns:1fr 1fr;gap:var(--gutter)}
.who > div{border-top:1px solid var(--line-light);padding-top:1.4em}
.dark .who > div{border-color:var(--line-dark)}
.who h4{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;margin-bottom:1.2em;display:flex;align-items:center;gap:.6em}
.who h4 i{font-style:normal;width:8px;height:8px;border-radius:50%;background:var(--ember);display:inline-block}
.who .no h4 i{background:var(--graphite)}
.who ul li{font-size:15px;line-height:1.45;padding:.7em 0;border-top:1px dashed var(--line-light);color:var(--ink)}
.dark .who ul li{border-color:var(--line-dark);color:var(--paper)}
.who .no ul li{color:var(--graphite-2)}
.dark .who .no ul li{color:var(--graphite)}
@media (max-width:700px){ .who{grid-template-columns:1fr} }

/* ---------- Escada (tiers) ---------- */
.tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:var(--gutter)}
.tier{
  border:1px solid var(--line-light);border-radius:6px;padding:1.8em;display:flex;flex-direction:column;gap:1.2em;min-height:340px;
  background:var(--paper);color:var(--ink);transition:transform .6s var(--ease),border-color .4s;position:relative;overflow:hidden;
}
.tier:hover{transform:translateY(-6px);border-color:var(--ink)}
.tier.rec{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.tier.rec .lvl{color:var(--ember)}
.tier .lvl{font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--graphite-2);display:flex;align-items:flex-start;justify-content:space-between;gap:.8em;line-height:1.45}
.tier .lvl em{flex:0 0 auto;font-style:normal;font-size:9px;letter-spacing:.1em;white-space:nowrap;border:1px solid currentColor;border-radius:999px;padding:.45em .8em;line-height:1;opacity:.8}
.tier h4{font-size:clamp(1.3rem,1.9vw,1.8rem);letter-spacing:-.03em;line-height:1.1;font-weight:500}
.tier h4 small{display:block;font-family:var(--serif);font-style:italic;font-weight:400;font-size:.75em;letter-spacing:0;margin-top:.3em;color:var(--graphite-2)}
.tier.rec h4 small{color:var(--graphite)}
.tier p{font-size:14.5px;line-height:1.5;color:var(--graphite-2);flex:1}
.tier.rec p{color:var(--graphite)}
.tier .alink{align-self:flex-start}

/* ---------- Comparação ---------- */
.cmp{width:100%;border-collapse:collapse;font-size:14.5px}
.cmp th,.cmp td{text-align:left;padding:.9em .8em .9em 0;border-top:1px solid var(--line-light);vertical-align:top}
.dark .cmp th,.dark .cmp td{border-color:var(--line-dark)}
.cmp th{font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--graphite-2);border-top:0;padding-bottom:1.2em}
.cmp td:first-child{font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:500;color:var(--graphite-2);width:9em}
.cmp td.hi{color:var(--ember)}
.cmp-wrap{overflow-x:auto}

/* ---------- Números grandes ---------- */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:var(--gutter);border-top:1px solid var(--line-light);padding-top:1.6em}
.dark .stats{border-color:var(--line-dark)}
.stats div .v{font-size:clamp(2.6rem,6vw,5.4rem);letter-spacing:-.05em;line-height:.9;font-weight:500;display:block}
.stats div .v sup{font-size:.35em;color:var(--ember);vertical-align:top}
.stats div .l{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--graphite-2);display:block;margin-top:.8em}
.dark .stats div .l{color:var(--graphite)}

/* ---------- Bloco de citação ---------- */
.quote{border-left:2px solid var(--ember);padding-left:1.4em;font-size:clamp(1.25rem,2vw,1.9rem);line-height:1.25;letter-spacing:-.02em;font-weight:500;max-width:28ch;text-wrap:balance}
.quote .s{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0}
.quote + .by{font-size:13px;color:var(--graphite);margin-top:1.4em}
.light .quote + .by{color:var(--graphite-2)}

/* ---------- Próximo passo (3 links grandes) ---------- */
.next{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:var(--gutter)}
.next a{border-top:1px solid var(--line-dark);padding:1.6em 0 0;display:flex;flex-direction:column;gap:.8em;transition:color .3s}
.next a:hover{color:var(--ember)}
.next a .k{font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--graphite)}
.next a .t{font-size:clamp(1.2rem,1.8vw,1.7rem);letter-spacing:-.025em;line-height:1.1;font-weight:500}
.next a .arr{font-size:1.4rem;transition:transform .5s var(--ease)}
.next a:hover .arr{transform:translateX(.4em)}

/* ---------- Hub de formações ---------- */
#hub{padding:clamp(3rem,8vh,7rem) var(--gutter) clamp(6rem,12vh,10rem)}
#hub .hub-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:var(--gutter)}
.hub-card{border-top:1px solid var(--line-light);padding-top:var(--gutter);display:flex;flex-direction:column;gap:1.2em}
.hub-card .cover{
  position:relative;aspect-ratio:4/3;border-radius:6px;overflow:hidden;background:var(--ink);color:var(--paper);
  display:grid;place-items:center;isolation:isolate;perspective:1000px;
}
.hub-card .cover img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55;z-index:0;filter:saturate(.7) contrast(1.08);transition:opacity .6s,transform 1.2s var(--ease)}
.hub-card:hover .cover img.bg{opacity:.75;transform:scale(1.04)}
.hub-card .cover::after{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(70% 60% at 50% 55%,rgba(7,7,8,.55),rgba(7,7,8,.05) 70%);pointer-events:none}
.hub-card .cover .logo3d{z-index:2}
.hub-card .cover .tag{position:absolute;top:1em;left:1.1em;font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;opacity:.8;z-index:2}
.hub-card .cover .meta{position:absolute;bottom:1em;right:1.1em;left:1.1em;display:flex;justify-content:space-between;font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;opacity:.8;z-index:2}
.hub-card h3{font-size:clamp(1.35rem,2vw,2rem);letter-spacing:-.03em;line-height:1.05;font-weight:500}
.hub-card h3 small{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--graphite-2);margin-bottom:.6em}
.hub-card p{font-size:14px;color:var(--graphite-2);max-width:34ch}
.hub-card .blocks{display:flex;flex-wrap:wrap;gap:.4em}
.hub-card .blocks span{font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:500;border:1px solid var(--line-light);border-radius:999px;padding:.45em .8em}

/* nav: pill "Entrar" some no mobile junto com o "Falar" */
@media (max-width:520px){ .nav .pill.entrar{display:none} }

/* mecanismo com clareza (RV-UX-040): pergunta · o que faz · com o que sai.
   Letra em brasa: decisão do Kadu em 29/09, desfaz o dourado do RV-UX-040. */
.mech .m .big{color:var(--ember)}
.mech.steps .m{justify-content:flex-start;gap:1.2em}
.mech.steps .m p{max-width:none}
.mech .m h4 .wk{display:block;margin-top:.5em;font-weight:500;letter-spacing:.12em;color:var(--graphite)}
.mech .m .q{font-family:var(--serif);font-style:italic;font-size:clamp(1.2rem,1.7vw,1.5rem);line-height:1.2;color:var(--paper)!important;margin:.1em 0 .8em;max-width:24ch!important}
.light .mech .m .q{color:var(--ink)!important}
.mech .m .out{margin-top:1.1em;padding-top:1em;border-top:1px solid var(--line-dark);font-size:13px!important}
.light .mech .m .out{border-top-color:var(--line-light)}
.mech .m .out b{display:block;font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;margin-bottom:.45em;color:var(--ember)}
.sec .s-head p.note{font-size:13px;line-height:1.55;max-width:36ch}