/* Percurso ilustrado (ideia C). Reutiliza .service-grid/.service/.service-number de style.css e efeitos.css.
   Estado por omissao = tudo visivel e aceso (sem JS ou com movimento reduzido). O JS acrescenta .pc-js. */
.pc{margin-top:10px}
.pc-top{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;font-size:12px;letter-spacing:.14em;color:var(--muted);padding:0 0 14px}
.pc-count b{color:var(--red);font-weight:600;font-family:Consolas,monospace;margin-left:6px}
.pc-words{display:flex;gap:26px}
.pc-words span{opacity:.5;transition:opacity .3s,color .3s}
.pc-words span.on{opacity:1;color:var(--ink)}

/* ---- percurso (ecra grande) ---- */
.pc-route{margin:0}
.pc-svg{display:block;width:100%;height:auto;overflow:visible}
.pc-base{fill:none;stroke:#7a2f2f;stroke-width:2.5;stroke-dasharray:3 9;stroke-linecap:round}
.pc-lit{fill:none;stroke:var(--red);stroke-width:3.5;stroke-linecap:round;stroke-dasharray:1 1;stroke-dashoffset:calc(1 - var(--p,1));filter:drop-shadow(0 0 6px #ff444488)}
.pc-st circle{fill:#111211;stroke:var(--line);stroke-width:2;transition:stroke .4s}
.pc-ico{fill:none;stroke:#c9ccc4;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;transition:opacity .4s,stroke .4s}
.pc-sym .r{stroke:#c92a2a}
.pc-sym .bg{fill:#111211}
.pc-st.on circle{stroke:var(--red)}
.pc-st.on .pc-ico{stroke:#eceae2}
.pc-car{fill:var(--red);filter:drop-shadow(0 0 7px #ff4444);display:none}
.pc-js .pc-car{display:block}
.pc-js .pc-st:not(.on) .pc-ico{opacity:.45}

/* ---- cartoes: os mesmos da seccao "O que fazemos" ---- */
.pc-grid.service-grid.loja-extra{grid-template-columns:repeat(4,1fr);margin-top:-6px}
.pc-grid .service{min-height:0;transition:opacity .4s,box-shadow .4s,background .35s}
.pc-grid .service>p{min-height:0}
.pc-cardico{display:none;width:64px;height:64px;margin:16px 0 0}
.pc-js .pc-grid .pc-step:not(.on){opacity:.7}
.pc-js .pc-grid .pc-step.on{box-shadow:inset 0 2px 0 var(--red),inset 0 1px 0 rgba(255,255,255,.07)}
.pc-rail{display:none}
.pc .loja-nota{margin-top:18px}

/* ---- versao vertical simples (telemovel e tablet) ---- */
@media(max-width:1000px){
  .pc-route{display:none}
  .pc-top{position:sticky;top:84px;z-index:3;background:#111211;padding:12px 0;border-bottom:1px solid var(--line);margin-bottom:22px}
  .pc-words{display:none}
  .pc-body{position:relative;padding-left:40px}
  .pc-rail{display:block;position:absolute;left:13px;top:0;bottom:0;width:2px;background:var(--line)}
  .pc-rail i{display:block;width:100%;height:var(--h,100%);background:var(--red);box-shadow:0 0 8px #ff444488}
  .pc-grid.service-grid.loja-extra{grid-template-columns:1fr;margin-top:0}
  .pc-grid .service{position:relative;border-right:0;border-bottom:1px solid var(--line)}
  .pc-grid .service::before{content:"";position:absolute;left:-34px;top:30px;width:14px;height:14px;border-radius:50%;background:#111211;border:2px solid var(--line);transition:background .3s,border-color .3s}
  .pc-grid .service.on::before{background:var(--red);border-color:var(--red)}
  .pc-cardico{display:block}
}
@media(max-width:760px){.pc-top{top:84px}}
@media(prefers-reduced-motion:reduce){
  .pc-words span,.pc-st circle,.pc-ico,.pc-grid .service{transition:none}
  .pc-car{display:none!important}
}