/* PRUMIS — estilos das páginas internas de serviço. Complementa prumis.css. */

/* hero compacto das páginas internas */
.hero-sm{background:var(--gr);color:#fff;position:relative;overflow:hidden}
.hero-sm .wrap{padding:56px 28px 60px;position:relative;z-index:2}
.hero-sm .crumb{font-size:13px;color:var(--mutd);margin-bottom:18px}
.hero-sm .crumb a{color:var(--mutd)}
.hero-sm .crumb a:hover{color:#fff}
.hero-sm .crumb span{color:var(--la);margin:0 8px}
.hero-sm .eyebrow{margin-bottom:14px}
.hero-sm h1{font-size:clamp(30px,5vw,48px);line-height:1.05;max-width:20ch}
.hero-sm p{color:var(--mutd);font-size:clamp(16px,2vw,19px);max-width:56ch;margin-top:20px;line-height:1.5}
.hero-sm .fio{position:absolute;top:0;right:16%;width:2px;height:70%;background:rgba(255,255,255,.1)}
.hero-sm .fio::after{content:"";position:absolute;left:50%;bottom:0;transform:translate(-50%,50%) rotate(45deg);
  width:16px;height:16px;background:var(--la)}
/* hero-sm com ilustração à direita (páginas de montagem e escoramento) */
.hero-sm.has-ilu .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center;
  padding:44px 28px 48px}
.hero-sm.has-ilu .hsm-ilu{display:flex;justify-content:center}
.hero-sm.has-ilu .hsm-ilu img{width:100%;max-width:400px;height:auto}
@media(max-width:820px){
  .hero-sm.has-ilu .wrap{grid-template-columns:1fr;gap:6px;padding:36px 28px 40px}
  .hero-sm.has-ilu .hsm-ilu{order:-1;max-height:220px;overflow:hidden;margin-bottom:6px}
  .hero-sm.has-ilu .hsm-ilu img{max-width:280px}
}

/* corpo de texto das páginas de serviço */
.prose{padding:72px 0}
.prose .wrap{max-width:820px}
.prose h2{font-size:clamp(23px,3vw,30px);margin:0 0 16px}
.prose h2:not(:first-child){margin-top:44px}
.prose p{font-size:17px;color:#3a3630;margin-bottom:16px;max-width:none}
.prose p.lead{font-size:20px;color:var(--mut);line-height:1.5;margin-bottom:26px}
.prose strong{font-weight:600;color:var(--gr)}
.prose ul.tick{list-style:none;margin:8px 0 22px}
.prose ul.tick li{font-size:16.5px;line-height:1.5;padding-left:26px;position:relative;margin-bottom:11px;color:#3a3630}
.prose ul.tick li::before{content:"";position:absolute;left:0;top:8px;width:9px;height:9px;background:var(--la);
  transform:rotate(45deg)}
.prose .norma{border-left:3px solid var(--la);background:var(--cl2);border-radius:0 8px 8px 0;
  padding:20px 24px;margin:26px 0}
.prose .norma .t{font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--la);
  margin-bottom:8px}
.prose .norma p{margin:0;font-size:16px;color:var(--mut)}
.prose .norma strong{color:var(--gr)}

/* FAQ — visível, formato citável por IA (pergunta + resposta direta) */
.faq{background:var(--cl2);padding:72px 0}
.faq .wrap{max-width:820px}
.faq h2{font-size:clamp(23px,3vw,30px);margin-bottom:28px}
.faq-item{border-top:1px solid var(--ln);padding:24px 0}
.faq-item:last-child{border-bottom:1px solid var(--ln)}
.faq-item h3{font-size:18.5px;font-weight:600;margin-bottom:10px;letter-spacing:-.01em}
.faq-item p{font-size:16.5px;color:var(--mut);margin:0;max-width:none;line-height:1.55}
.faq-item p+p{margin-top:10px}
.faq-item strong{color:var(--gr);font-weight:600}

/* páginas relacionadas (interlink interno; nunca externo) */
.related{padding:64px 0}
.related h2{font-size:20px;margin-bottom:22px}
.related .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.related a{display:block;border:1px solid var(--ln);border-radius:9px;padding:22px 22px 24px;transition:border-color .15s,transform .15s}
.related a:hover{border-color:var(--la);transform:translateY(-2px)}
.related a .k{font-size:12px;color:var(--la);font-weight:500;letter-spacing:.1em}
.related a h3{font-size:17px;margin:10px 0 6px;letter-spacing:-.01em}
.related a p{font-size:14px;color:var(--mut);margin:0}

@media(max-width:820px){
  .related .grid{grid-template-columns:1fr}
  .hero-sm .fio{right:8%}
  .prose{padding:52px 0}
}
