/* ==========================================================
   METODOLOGIA (#metodologia)
   ========================================================== */
.metodo { margin-top: var(--espaco-6); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--espaco-4); position: relative; }
.metodo-trilho { position: absolute; left: 36px; right: calc(33.333% - 36px); top: 35px; height: 2px; background: var(--linha); }
.metodo-trilho span { display: block; height: 100%; width: calc(var(--p, 0) * 100%); background: var(--acento); transition: width .2s linear; }
.premissa { position: relative; display: flex; flex-direction: column; gap: 12px; padding-right: var(--espaco-3); }
.premissa svg { width: 72px; height: 72px; background: var(--fundo); position: relative; z-index: 1; }
.premissa .pm { fill: none; stroke: var(--texto); stroke-width: 3; transition: fill .6s, stroke .6s; }
.premissa .pm-praca { fill: var(--praca); opacity: 0; transform-box: fill-box; transform-origin: center; transform: scale(.3); transition: opacity .5s .2s, transform .5s .2s; }
.premissa.ativa .pm { fill: var(--simbolo-modulo-escuro); stroke: var(--simbolo-modulo-escuro); }
.premissa.ativa .pm.claro { fill: var(--simbolo-modulo-claro); stroke: var(--simbolo-modulo-claro); }
.premissa.ativa .pm-praca { opacity: 1; transform: none; }
.premissa-numero { font-size: var(--texto-legenda); font-weight: 600; letter-spacing: 0.12em; color: var(--texto-suave); margin-top: var(--espaco-2); }
.premissa h3 { font-size: 23px; }
.premissa p { font-size: 17px; }
.premissa { opacity: .55; transition: opacity .5s; }
.premissa.ativa { opacity: 1; }

@media (max-width: 900px) {
  .metodo { grid-template-columns: minmax(0, 1fr); gap: var(--espaco-5); }
  .metodo-trilho { left: 35px; right: auto; top: 36px; bottom: 36px; width: 2px; height: auto; }
  .metodo-trilho span { width: 100%; height: calc(var(--p, 0) * 100%); }
  .premissa { padding-left: 96px; padding-right: 0; }
  .premissa svg { position: absolute; left: 0; top: 0; }
  .premissa-numero { margin-top: 0; }
}