/* ============================================================
   RS-MATRIZ · CAMADA VISUAL DO SITE · v1.1 · 09/10/2026
   Carregada depois do CSS da página. Só troca aparência:
   títulos, assinatura, grade de papel e canto assinatura.
   Nenhum texto, script ou estrutura muda aqui.
   Para voltar ao visual v4.1: remover o <link> deste arquivo
   e apontar os tokens de volta para rs-tokens-v4.1.css.
   ============================================================ */

:root{
  --disp:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --serif:'Instrument Serif',Georgia,serif;
}

/* ---------- papel com grade (temas claros) ---------- */
body:not([data-tema]), body[data-tema="claro"]{
  background-image:
    linear-gradient(rgba(14,14,14,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(14,14,14,.055) 1px, transparent 1px);
  background-size:28px 28px;
}

/* ---------- títulos: Inter 900 + ênfase em serifa itálica ---------- */
.hero-title, .section-title, .diag-title, .cta-title, .servico-title{
  font-family:var(--disp); font-weight:900; text-transform:none;
  letter-spacing:-.035em; line-height:.98;
}
.hero-title{font-size:clamp(46px,8vw,112px)}
.hero-title .line2{font-weight:500; letter-spacing:-.02em; font-size:.42em; margin-top:18px}
.section-title{font-size:clamp(34px,4.6vw,60px)}
.diag-title{font-size:clamp(32px,4.4vw,56px)}
.cta-title{font-size:clamp(42px,6.6vw,92px)}
.servico-title{font-size:clamp(22px,2.2vw,28px); line-height:1.02; letter-spacing:-.03em}

.hero-title em, .section-title em, .diag-title em, .cta-title em, .servico-title em{
  font-family:var(--serif); font-style:italic; font-weight:400;
  letter-spacing:-.01em; padding-right:.04em;
}
/* a serifa já marca a ênfase: o sublinhado varrendo sai dos títulos */
.hero-title em::after, .section-title em::after, .diag-title em::after, .cta-title em::after{display:none}

/* números grandes: mesma voz do título */
.hero-years-num, .cstat b, .capitulo .cap-num{font-family:var(--disp); font-weight:900; letter-spacing:-.04em}

/* ---------- assinatura: Renato em serifa itálica + Sandes em Inter 700 ---------- */
.nav-brand, .footer-brand, .topo-brand{
  font-family:var(--sans); font-weight:700; font-size:16px;
  text-transform:none; letter-spacing:-.01em;
}
.nav-brand em, .footer-brand em, .topo-brand em{
  font-family:var(--serif); font-style:italic; font-weight:400; font-size:1.14em;
  color:inherit; letter-spacing:0;
}

/* ---------- canto assinatura: o canto quase reto passa para o inferior direito ---------- */
.servico-card, .passo, .metodo, .sobre-photo{
  border-radius:var(--r); border-bottom-left-radius:var(--r); border-bottom-right-radius:var(--r-cut);
}
.sobre-photo img{border-radius:calc(var(--r) - 10px); border-bottom-left-radius:calc(var(--r) - 10px); border-bottom-right-radius:4px}
/* no hover o canto troca de lugar na diagonal, como no v4.1, agora espelhado */
.servico-card:hover, .servico-card.is-open, .passo:hover{
  border-bottom-left-radius:var(--r); border-top-right-radius:var(--r);
  border-bottom-right-radius:var(--r); border-top-left-radius:var(--r-cut);
}

/* páginas legais (privacidade, termos): mesmo título */
h1{font-family:var(--disp); font-weight:900; text-transform:none; letter-spacing:-.035em; line-height:.98}

/* celular: as pílulas cabem numa linha só */
@media (max-width:440px){
  .hero .badge{letter-spacing:.08em; font-size:9px; gap:6px; padding:6px 11px}
  .consult-eyebrow{letter-spacing:.1em; font-size:9px; padding:7px 12px}
}