/* ==========================================================================
   RM Tech · Complemento do site (home, cidades e institucionais)
   Depende de /assets/servico.css (tokens e componentes .svc).
   Só entra aqui o que estas páginas têm e as de serviço não têm:
   seção escura, cartões de avaliação, cartões de blog, formulário e checklist.
   Tudo escopado em .svc — não afeta blog, cidades nem landings.
   ========================================================================== */

/* --- Seção escura (cobertura e contato) ------------------------------- */
.svc .home-dark{
  position:relative;background:var(--ink);color:var(--tx-inv);
  overflow:hidden;isolation:isolate
}
.svc .home-dark::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background-image:
    linear-gradient(rgba(75,147,247,.10) 1px,transparent 1px),
    linear-gradient(90deg,rgba(75,147,247,.10) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:radial-gradient(90% 80% at 20% 0%,#000,transparent 78%);
  -webkit-mask-image:radial-gradient(90% 80% at 20% 0%,#000,transparent 78%)
}
.svc .home-dark h2,.svc .home-dark h3{color:#fff}
.svc .home-dark p{color:var(--tx-inv-2)}
.svc .home-dark a:not(.svc-btn){color:#cfe0f7}

/* o cartão de cidade é um link: precisa vencer o `.svc a` */
.svc a.svc-hot{color:var(--tx-inv-2);text-decoration:none}
.svc a.svc-hot:hover,.svc a.svc-hot:focus-visible{color:#fff}

/* --- Corpo do cartão de case ------------------------------------------ */
.svc .home-report-body{padding:28px 24px 26px}
.svc .home-report-body h3{font-size:1.35rem;font-family:var(--display);margin:0 0 10px}
.svc .home-report-body .svc-kpis{margin:22px 0 24px}
@media(min-width:768px){.svc .home-report-body{padding:34px 32px 30px}}

/* --- Avaliações -------------------------------------------------------- */
.svc .home-revs{
  display:grid;gap:var(--sp-2);
  grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))
}
.svc .home-revs>*{min-width:0}
.svc .home-rev{
  position:relative;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:26px 24px 22px;display:flex;flex-direction:column;
  transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease
}
.svc .home-rev:hover{border-color:var(--blue);transform:translateY(-3px);box-shadow:0 18px 34px -24px rgba(0,86,179,.5)}
.svc .home-rev::after{
  content:"”";position:absolute;right:18px;top:6px;font-family:var(--display);font-size:4.4rem;
  line-height:1;color:var(--paper-3);pointer-events:none
}
.svc .home-stars{color:var(--amber);font-size:1rem;letter-spacing:3px;margin-bottom:12px}
.svc .home-rev p{font-size:.95rem;color:var(--tx-2);line-height:1.75;flex:1;margin:0 0 20px;max-width:none}
.svc .home-revfoot{display:flex;align-items:center;gap:12px}
.svc .home-avatar{
  width:40px;height:40px;border-radius:50%;flex:none;display:grid;place-items:center;
  color:#fff;font-weight:700;font-size:.95rem;font-family:var(--display)
}
.svc .home-who{display:flex;flex-direction:column;line-height:1.35}
.svc .home-who b{font-size:.92rem;color:var(--tx);font-weight:600}
.svc .home-who small{
  font-family:var(--mono);font-size:.64rem;letter-spacing:.09em;text-transform:uppercase;color:var(--tx-2)
}

/* --- Blog -------------------------------------------------------------- */
.svc .home-posts{
  display:grid;gap:var(--sp-2);
  grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr))
}
.svc .home-posts>*{min-width:0}
.svc .home-post{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  display:flex;flex-direction:column;transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease
}
.svc .home-post:hover{border-color:var(--blue);transform:translateY(-4px);box-shadow:0 20px 38px -26px rgba(0,86,179,.55)}
.svc .home-thumb{
  display:grid;place-items:center;height:132px;color:#fff;text-decoration:none;
  position:relative;isolation:isolate
}
.svc .home-thumb::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background-image:linear-gradient(rgba(255,255,255,.14) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.14) 1px,transparent 1px);
  background-size:22px 22px;
  mask-image:radial-gradient(70% 100% at 50% 0%,#000,transparent 76%);
  -webkit-mask-image:radial-gradient(70% 100% at 50% 0%,#000,transparent 76%)
}
.svc .home-thumb--cyber{background:linear-gradient(135deg,#0056b3,#003d80)}
.svc .home-thumb--backup{background:linear-gradient(135deg,#00897b,#00564e)}
.svc .home-thumb--cloud{background:linear-gradient(135deg,#6a1b9a,#4a0d6e)}
.svc .home-post-body{padding:22px 22px 24px;display:flex;flex-direction:column;flex:1}
.svc .home-tag{
  align-self:flex-start;font-family:var(--mono);font-size:.62rem;font-weight:700;letter-spacing:.13em;
  text-transform:uppercase;color:var(--blue);background:#e8f1fe;border-radius:999px;padding:5px 11px;margin-bottom:14px
}
.svc .home-post h3{font-size:1.02rem;line-height:1.4;margin:0 0 10px}
.svc .home-post h3 a{color:var(--tx);text-decoration:none}
.svc .home-post h3 a:hover{color:var(--blue)}
.svc .home-post p{font-size:.9rem;color:var(--tx-2);flex:1;margin:0 0 16px;max-width:none}
.svc .home-more{
  font-family:var(--mono);font-size:.74rem;font-weight:700;letter-spacing:.06em;
  color:var(--blue);text-decoration:none;align-self:flex-start;
  display:inline-flex;align-items:center;min-height:44px
}
.svc .home-more:hover{text-decoration:underline}

/* --- Bloco de contato -------------------------------------------------- */
.svc .home-contatos{list-style:none;margin:0 0 var(--sp-3);padding:0;display:grid;gap:14px}
.svc .home-contatos li{display:flex;align-items:center;gap:12px;color:#cfe0f7;font-size:1rem}
.svc .home-contatos svg{color:var(--amber);flex:none}
.svc .home-contatos a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.22);
  padding:11px 0;display:inline-flex;align-items:center;min-height:44px}
.svc .home-contatos a:hover{border-bottom-color:var(--amber)}

.svc .home-social{display:flex;gap:10px;margin-bottom:var(--sp-3)}
.svc .home-social a{
  width:48px;height:48px;border-radius:50%;display:grid;place-items:center;
  border:1px solid rgba(168,189,216,.4);color:#e8f0fb;
  transition:border-color .2s ease,background-color .2s ease,color .2s ease
}
.svc .home-social a:hover{border-color:var(--amber);color:var(--amber);background:rgba(255,193,7,.08)}

.svc .home-orfast{
  font-family:var(--mono);font-size:.78rem;letter-spacing:.04em;color:#7f9dc4;margin:0
}
.svc .home-orfast a{color:var(--amber);text-decoration:none;border-bottom:1px solid rgba(255,193,7,.4);
  display:inline-flex;align-items:center;min-height:44px;padding:10px 0}
.svc .home-orfast a:hover{border-bottom-color:var(--amber)}

/* --- Formulário no painel escuro --------------------------------------- */
.svc .home-form{display:grid;gap:16px}
.svc .home-field{display:grid;gap:7px}
.svc .home-field label{
  font-family:var(--mono);font-size:.64rem;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:#7f9dc4
}
.svc .home-field input,
.svc .home-field textarea{
  width:100%;background:rgba(5,10,18,.55);border:1px solid #24384f;border-radius:8px;
  color:#fff;font-family:Poppins,system-ui,sans-serif;font-size:1rem;padding:13px 14px;
  transition:border-color .2s ease,box-shadow .2s ease
}
.svc .home-field input{min-height:50px}
.svc .home-field textarea{resize:vertical;min-height:112px;line-height:1.6}
.svc .home-field input::placeholder,
.svc .home-field textarea::placeholder{color:#5f7794}
.svc .home-field input:hover,
.svc .home-field textarea:hover{border-color:#33506f}
.svc .home-field input:focus,
.svc .home-field textarea:focus{
  outline:none;border-color:var(--amber);box-shadow:0 0 0 3px rgba(255,193,7,.22)
}
.svc .home-submit{width:100%;justify-content:center;margin-top:2px}
.svc .home-formnote{
  font-family:var(--mono);font-size:.66rem;letter-spacing:.05em;color:#6b83a3;margin:0;text-align:center
}

/* o cabeçalho é fixo (70px): sem isto a âncora para embaixo dele */
.svc [id]{scroll-margin-top:86px}

/* botão de contorno para fundo claro (o --ghost do svc é para fundo escuro) */
.svc .home-btn--outline{border-color:var(--line-strong);color:var(--blue);background:transparent}
.svc .home-btn--outline:hover{border-color:var(--blue);background:#eef4fd}

/* --- Lista de verificação (páginas de cidade) --------------------------- */
.svc .home-checks{list-style:none;margin:0;padding:0;display:grid;gap:12px;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}
.svc .home-checks>*{min-width:0}
.svc .home-checks li{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;
  font-size:.95rem;color:var(--tx);line-height:1.55;
  transition:border-color .2s ease,transform .2s ease}
.svc .home-checks li:hover{border-color:var(--blue);transform:translateY(-2px)}
.svc .home-checks svg{color:var(--green);flex:none;margin-top:2px}

/* --- Prosa das páginas de cidade --------------------------------------- */
.svc .home-prosa p{color:var(--tx-2);font-size:1rem}
.svc .home-prosa strong{color:var(--tx)}

/* --- Mapa da região (arte do herói das cidades) ------------------------- */
.svc .home-mapa{width:100%;height:auto;display:block;max-width:500px;margin-inline:auto;
  filter:drop-shadow(0 30px 60px rgba(0,0,0,.55))}

/* --- Utilitário -------------------------------------------------------- */
.svc .home-center{text-align:center;margin-top:var(--sp-4)}

@media(max-width:640px){
  .svc .home-report-body{padding:22px 18px}
  .svc .home-rev{padding:22px 20px 20px}
  .svc .home-post-body{padding:20px 18px 22px}
  .svc .home-center .svc-btn{width:auto}
}