/* RS TECH — paleta extraída do logo: preto, rosa/magenta neon, branco */
:root {
  --rs-black: #0a0a0a;
  --rs-black-soft: #141414;
  --rs-pink: #ec1e7e;
  --rs-pink-dark: #b8115f;
  --rs-white: #ffffff;
  --rs-gray: #b3b3b3;
  --rs-radius: 10px;
  --rs-max-width: 1100px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: 'Segoe UI', Arial, Helvetica, sans-serif;
  background: var(--rs-black);
  color: var(--rs-white);
  line-height: 1.5;
}

img { max-width: 100%; display: block; }

.container {
  max-width: var(--rs-max-width);
  margin: 0 auto;
  padding: 0 20px;
}

h1, h2, h3 { line-height: 1.2; margin: 0 0 12px; }
h2 { font-size: 2rem; text-align: center; }
p { margin: 0 0 16px; color: var(--rs-gray); }

.btn {
  display: inline-block;
  padding: 14px 28px;
  border-radius: var(--rs-radius);
  text-decoration: none;
  font-weight: 700;
  transition: transform .15s ease, background .15s ease;
}
.btn:hover { transform: translateY(-2px); }

.btn-whatsapp {
  background: var(--rs-pink);
  color: var(--rs-white);
}
.btn-whatsapp:hover { background: var(--rs-pink-dark); }

.btn-outline {
  background: transparent;
  color: var(--rs-white);
  border: 2px solid var(--rs-pink);
}
.btn-outline:hover { background: rgba(236,30,126,0.12); }

.btn-lg { font-size: 1.1rem; padding: 18px 36px; }
.btn-header { padding: 10px 18px; font-size: .9rem; }

.hero-ctas {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

/* HEADER */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(10,10,10,0.92);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid #222;
}
.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 10px;
  padding-bottom: 10px;
  gap: 16px;
}
.logo-img { height: 48px; width: 48px; border-radius: 50%; object-fit: cover; }
.main-nav { display: flex; gap: 24px; flex: 1; justify-content: center; }
.main-nav a {
  color: var(--rs-white);
  text-decoration: none;
  font-weight: 600;
  font-size: .95rem;
}
.main-nav a:hover { color: var(--rs-pink); }

/* HERO */
.hero {
  padding: 80px 0 70px;
  background:
    radial-gradient(circle at 20% 20%, rgba(236,30,126,0.18), transparent 45%),
    radial-gradient(circle at 80% 60%, rgba(236,30,126,0.12), transparent 45%),
    var(--rs-black);
  text-align: center;
}
.hero-text h1 { font-size: 2.4rem; max-width: 780px; margin: 0 auto 16px; }
.hero-sub { max-width: 640px; margin: 0 auto 28px; font-size: 1.1rem; }
.hero-microcopy { margin-top: 14px; font-size: .85rem; color: #888; }

/* SERVIÇOS */
.servicos { padding: 70px 0; background: var(--rs-black-soft); }
.section-lead { text-align: center; max-width: 620px; margin: -4px auto 40px; }
.servicos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
}
.servico-card {
  background: var(--rs-black);
  border: 1px solid #262626;
  border-radius: var(--rs-radius);
  padding: 24px;
  transition: border-color .15s ease;
}
.servico-card:hover { border-color: var(--rs-pink); }
.servico-card h3 { color: var(--rs-pink); font-size: 1.15rem; }
.servico-card p { margin: 0; font-size: .95rem; }
.servicos-cta {
  text-align: center;
  margin-top: 40px;
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
}

/* DIFERENCIAIS */
.diferenciais { padding: 70px 0; background: var(--rs-black); }
.diferenciais-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 20px;
  margin-bottom: 40px;
}
.diferencial-item { text-align: center; }
.diferencial-icone {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 2px solid var(--rs-pink);
  font-size: 1.5rem;
  margin-bottom: 12px;
}
.diferencial-item h3 { font-size: 1rem; color: var(--rs-white); }
.diferencial-item p { font-size: .9rem; }

.prova-social-placeholder {
  text-align: center;
  border: 1px dashed #444;
  border-radius: var(--rs-radius);
  padding: 20px;
  max-width: 480px;
  margin: 0 auto;
  color: #888;
  font-size: .95rem;
}

/* DEPOIMENTOS */
.depoimentos { padding: 70px 0; background: var(--rs-black); }
.depoimentos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 20px;
}
.depoimento-card {
  background: var(--rs-black-soft);
  border: 1px solid #262626;
  border-radius: var(--rs-radius);
  padding: 24px;
}
.depoimento-card p { color: var(--rs-white); font-style: italic; margin-bottom: 10px; }
.depoimento-card span { font-size: .85rem; color: var(--rs-pink); font-weight: 600; }
.depoimento-placeholder { opacity: .55; border-style: dashed; }

/* BOTÃO FLUTUANTE WHATSAPP */
.whatsapp-float {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 999;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: var(--rs-pink);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 18px rgba(0,0,0,0.4);
  transition: transform .15s ease, background .15s ease;
}
.whatsapp-float:hover { background: var(--rs-pink-dark); transform: scale(1.06); }

/* LOCALIZAÇÃO */
.localizacao { padding: 70px 0; background: var(--rs-black-soft); }
.localizacao-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center;
}
.localizacao-info h2 { text-align: left; }

/* CTA FINAL */
.cta-final {
  padding: 80px 0;
  text-align: center;
  background: linear-gradient(135deg, var(--rs-pink-dark), var(--rs-black));
}
.cta-final h2 { color: var(--rs-white); }

/* FOOTER */
.site-footer {
  padding: 36px 0;
  background: var(--rs-black);
  border-top: 1px solid #222;
}
.footer-inner {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}
.footer-logo { height: 56px; width: 56px; border-radius: 50%; object-fit: cover; }
.footer-info p { margin: 0 0 4px; font-size: .85rem; color: #888; }

/* ===== PÁGINAS INTERNAS (landings por equipamento) ===== */
.page-hero {
  padding: 64px 0 56px;
  background:
    radial-gradient(circle at 20% 20%, rgba(236,30,126,0.18), transparent 45%),
    radial-gradient(circle at 80% 60%, rgba(236,30,126,0.12), transparent 45%),
    var(--rs-black);
  text-align: center;
}
.page-hero h1 { font-size: 2.1rem; max-width: 760px; margin: 0 auto 14px; }

.badges-row {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
  margin: 22px 0 0;
}
.badge-item {
  border: 1px solid var(--rs-pink);
  border-radius: 999px;
  padding: 7px 16px;
  font-size: .85rem;
  color: var(--rs-white);
  background: rgba(236,30,126,0.10);
}

/* Como funciona (3 passos) */
.passos { padding: 70px 0; background: var(--rs-black); }
.passos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
}
.passo-item {
  background: var(--rs-black-soft);
  border: 1px solid #262626;
  border-radius: var(--rs-radius);
  padding: 24px;
  text-align: center;
}
.passo-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--rs-pink);
  color: var(--rs-white);
  font-weight: 700;
  font-size: 1.1rem;
  margin-bottom: 12px;
}
.passo-item h3 { font-size: 1.05rem; color: var(--rs-white); }
.passo-item p { margin: 0; font-size: .92rem; }

/* Horário / presencialidade */
.horario-box {
  background: var(--rs-black-soft);
  border: 1px solid #262626;
  border-radius: var(--rs-radius);
  padding: 20px 24px;
  margin-top: 18px;
  font-size: .95rem;
}
.horario-box p { margin: 0 0 6px; }
.horario-box strong { color: var(--rs-white); }

/* Declaração de compliance (rodapé) */
.compliance-note {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #222;
  font-size: .8rem;
  color: #777;
  max-width: 720px;
}

/* Grid de categorias na home */
.categorias { padding: 70px 0; background: var(--rs-black-soft); }
.categoria-card {
  background: var(--rs-black);
  border: 1px solid #262626;
  border-radius: var(--rs-radius);
  padding: 24px;
  text-decoration: none;
  display: block;
  transition: border-color .15s ease, transform .15s ease;
}
.categoria-card:hover { border-color: var(--rs-pink); transform: translateY(-3px); }
.categoria-card h3 { color: var(--rs-pink); font-size: 1.12rem; }
.categoria-card p { margin: 0 0 10px; font-size: .93rem; }
.categoria-card span { color: var(--rs-white); font-size: .88rem; font-weight: 600; }

/* Card de servico: icone em caixa + tags + link (padrao FastGo) */
.categoria-card .card-icone {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 12px;
  background: rgba(236,30,126,0.12);
  border: 1px solid rgba(236,30,126,0.35);
  font-size: 1.35rem;
  margin-bottom: 14px;
}
.categoria-card .card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 14px;
}
.categoria-card .card-tags em {
  font-style: normal;
  font-weight: 500;
  font-size: .74rem;
  color: #bdbdbd;
  background: #1a1a1a;
  border: 1px solid #2e2e2e;
  border-radius: 999px;
  padding: 3px 10px;
}
.categoria-card .card-link {
  display: block;
  color: var(--rs-pink);
  font-size: .88rem;
  font-weight: 600;
  text-decoration: none;
}
.categoria-card .card-link:hover { text-decoration: underline; }
.categoria-card h3 a {
  color: var(--rs-pink);
  text-decoration: none;
}
.categoria-card h3 a:hover { text-decoration: underline; }

/* FAQ simples */
.faq { padding: 70px 0; background: var(--rs-black-soft); }
.faq-item {
  border-bottom: 1px solid #262626;
  padding: 18px 0;
  max-width: 760px;
  margin: 0 auto;
}
.faq-item h3 { font-size: 1.02rem; color: var(--rs-white); margin-bottom: 8px; }
.faq-item p { margin: 0; font-size: .93rem; }

/* Breadcrumb discreto */
.breadcrumb {
  font-size: .82rem;
  color: #777;
  margin-bottom: 14px;
}
.breadcrumb a { color: #999; text-decoration: none; }
.breadcrumb a:hover { color: var(--rs-pink); }

/* RESPONSIVO */
@media (max-width: 720px) {
  .main-nav { display: none; }
  .hero-text h1 { font-size: 1.8rem; }
  .page-hero h1 { font-size: 1.6rem; }
  .localizacao-inner { grid-template-columns: 1fr; }
  h2 { font-size: 1.6rem; }
}
