/* =========================================================
   ZAVYRA — páginas internas
   Camada adicional. Reaproveita os tokens de style.css e o
   header/footer da Home; só descreve o miolo das páginas.
   ========================================================= */

/* ---------- hero da página ---------- */
.pg-hero{
  position:relative;overflow:hidden;
  padding:calc(var(--sec) * .78) 0 calc(var(--sec) * .55);
  border-bottom:1px solid var(--line);
}
.pg-hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(58% 62% at 78% 12%,rgba(124,58,237,.16),transparent 64%),
    radial-gradient(48% 55% at 6% 92%,rgba(0,212,255,.10),transparent 68%);
}
/* o .wrap já centraliza e limita; aqui só estreitamos o texto,
   nunca o container — senão o bloco inteiro desloca para dentro */
.pg-hero__in{position:relative}
.pg-hero h1{max-width:20ch}
.pg-crumb{
  display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;
  font-size:.76rem;color:var(--gray-dim);margin-bottom:1.6rem;
}
.pg-crumb a{color:var(--gray-dim);transition:color .3s}
.pg-crumb a:hover{color:var(--white)}
.pg-crumb span{opacity:.5}
.pg-hero h1{
  font-family:var(--f-head);font-weight:700;letter-spacing:-.035em;line-height:1.04;
  font-size:clamp(2.3rem,5.6vw,4.1rem);max-width:20ch;
}
.pg-hero .pg-lead{
  margin-top:1.4rem;color:var(--gray);font-size:clamp(1rem,1.5vw,1.14rem);line-height:1.7;
  max-width:58ch;
}
.pg-hero__cta{display:flex;gap:.8rem;margin-top:2.2rem;flex-wrap:wrap}

/* ---------- bloco genérico ---------- */
.pg-sec{padding:var(--sec) 0}
.pg-sec--alt{background:var(--bg-2);border-block:1px solid var(--line)}
.pg-head{max-width:56ch;margin-bottom:clamp(2.4rem,5vw,3.6rem)}
.pg-head h2{
  font-family:var(--f-head);font-weight:700;letter-spacing:-.032em;line-height:1.1;
  font-size:clamp(1.75rem,3.6vw,2.75rem);
}
.pg-head p{margin-top:1rem;color:var(--gray);line-height:1.7}

/* ---------- dor → resposta ---------- */
.pg-pains{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;list-style:none}
.pg-pain{
  border:1px solid var(--line);border-radius:var(--r);
  padding:clamp(1.2rem,2.4vw,1.7rem);background:rgba(255,255,255,.018);
  transition:border-color .35s,background .35s,transform .35s var(--ease-out);
}
.pg-pain:hover{border-color:var(--line-2);background:rgba(255,255,255,.03);transform:translateY(-2px)}
.pg-pain q{
  display:block;font-family:var(--f-head);font-weight:500;font-size:1.02rem;
  color:var(--white);line-height:1.45;quotes:"“" "”";
}
.pg-pain p{
  margin-top:.85rem;padding-top:.85rem;border-top:1px solid var(--line);
  color:var(--gray);font-size:.9rem;line-height:1.68;
}

/* ---------- o que entra ---------- */
.pg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;list-style:none}
.pg-item{
  border:1px solid var(--line);border-radius:var(--r);
  padding:clamp(1.2rem,2.4vw,1.6rem);position:relative;overflow:hidden;
}
.pg-item::before{
  content:"";position:absolute;left:0;right:0;top:0;height:2px;
  background:var(--grad);transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--ease-out);
}
.pg-item:hover::before{transform:scaleX(1)}
.pg-item h3{font-family:var(--f-head);font-weight:600;font-size:1.05rem;color:var(--white)}
.pg-item p{margin-top:.6rem;color:var(--gray);font-size:.89rem;line-height:1.68}
.pg-grid--two{grid-template-columns:repeat(2,1fr)}
.pg-item__k{
  display:block;margin-top:.2rem;font-family:var(--f-body);font-weight:400;
  font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gray-dim);
}
.pg-item__go{margin-top:1rem;padding-top:.9rem;border-top:1px solid var(--line)}
.pg-item__go a{
  display:inline-flex;align-items:center;gap:.4rem;
  font-family:var(--f-head);font-size:.86rem;color:var(--cyan);
}
.pg-item__go a span{transition:transform .3s var(--ease)}
.pg-item__go a:hover span{transform:translate(3px,-3px)}

/* ---------- passos ---------- */
.pg-steps{list-style:none;counter-reset:s;border-top:1px solid var(--line)}
.pg-step{
  counter-increment:s;display:grid;grid-template-columns:5rem 1fr 1.15fr;
  gap:clamp(1rem,3vw,2.2rem);align-items:start;
  padding:clamp(1.4rem,3vw,2rem) 0;border-bottom:1px solid var(--line);
}
.pg-step::before{
  content:counter(s,decimal-leading-zero);
  font-family:var(--f-head);font-weight:700;font-size:1rem;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.pg-step h3{font-family:var(--f-head);font-weight:600;font-size:1.2rem;color:var(--white)}
.pg-step p{color:var(--gray);font-size:.92rem;line-height:1.7}

/* ---------- stack / etiquetas ---------- */
.pg-tags{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin-top:1.6rem}
.pg-tags li{
  font-family:var(--f-head);font-size:.76rem;letter-spacing:.04em;color:var(--gray);
  border:1px solid var(--line);border-radius:999px;padding:.4rem .85rem;
}

/* ---------- faixa de chamada ---------- */
.pg-cta{
  border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(2rem,5vw,3.4rem);text-align:center;position:relative;overflow:hidden;
  background:
    radial-gradient(70% 120% at 50% 0%,rgba(124,58,237,.14),transparent 70%),
    rgba(255,255,255,.02);
}
.pg-cta h2{
  font-family:var(--f-head);font-weight:700;letter-spacing:-.03em;line-height:1.12;
  font-size:clamp(1.6rem,3.4vw,2.5rem);
}
.pg-cta p{margin:1rem auto 0;max-width:52ch;color:var(--gray);line-height:1.7}
.pg-cta__btns{display:flex;gap:.8rem;justify-content:center;margin-top:2rem;flex-wrap:wrap}

/* ---------- nota honesta ---------- */
.pg-note{
  margin-top:1.8rem;font-size:.78rem;color:var(--gray-dim);line-height:1.65;max-width:70ch;
}

/* ---------- linha de páginas irmãs ---------- */
.pg-siblings{
  display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;list-style:none;margin-top:2.4rem;
}
.pg-sib{
  display:block;border:1px solid var(--line);border-radius:var(--r-sm);
  padding:1rem 1.1rem;transition:border-color .3s,background .3s;
}
.pg-sib:hover{border-color:var(--line-2);background:rgba(255,255,255,.03)}
.pg-sib b{display:block;font-family:var(--f-head);font-weight:600;font-size:.95rem;color:var(--white)}
.pg-sib span{display:block;margin-top:.2rem;font-size:.78rem;color:var(--gray-dim)}

/* ---------- currículo (/sobre) ---------- */
.pg-cv{list-style:none;border-top:1px solid var(--line)}
.pg-cv li{
  display:grid;grid-template-columns:9rem 1fr;gap:clamp(1rem,3vw,2rem);
  padding:clamp(1.3rem,3vw,1.9rem) 0;border-bottom:1px solid var(--line);
}
.pg-cv__when{font-family:var(--f-head);font-size:.82rem;color:var(--cyan);padding-top:.2rem}
.pg-cv h3{font-family:var(--f-head);font-weight:600;font-size:1.15rem;color:var(--white)}
.pg-cv__role{margin-top:.15rem;font-size:.82rem;color:var(--gray-dim)}
.pg-cv p.pg-cv__txt{margin-top:.7rem;color:var(--gray);font-size:.92rem;line-height:1.7}

/* ---------- responsivo ---------- */
@media (max-width:900px){
  .pg-pains,.pg-grid,.pg-grid--two{grid-template-columns:1fr}
  .pg-step{grid-template-columns:2.6rem 1fr}
  .pg-step p{grid-column:2}
  .pg-siblings{grid-template-columns:1fr 1fr}
  .pg-cv li{grid-template-columns:1fr}
  .pg-cv__when{padding-top:0}
}
@media (max-width:560px){
  .pg-siblings{grid-template-columns:1fr}
  .pg-hero__cta .btn,.pg-cta__btns .btn{width:100%;justify-content:center}
}

@media (prefers-reduced-motion:reduce){
  .pg-pain,.pg-item::before{transition:none}
  .pg-pain:hover{transform:none}
}