/* ═══════════════════════════════════════════════════════════════════════════
DESIGN SYSTEM CORRIGIDO — NR Arquitetura
═══════════════════════════════════════════════════════════════════════════
Princípios:
– Variáveis CSS centralizadas para fácil manutenção
– Classes reutilizáveis em lugar de inline styles
– WCAG AA contrast compliance (mín 4.5:1 para texto)
– Responsividade mobile-first
– Estados hover/focus/active padronizados
– Escala tipográfica rem-based (1rem = 16px)
– Sistema de spacing consistente (4px base)
═══════════════════════════════════════════════════════════════════════════ */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html {
scroll-behavior: smooth;
font-size: 16px;
}
body {
font-family: ‘Inter’, -apple-system, BlinkMacSystemFont, ‘Segoe UI’, Roboto, ‘Helvetica Neue’, Arial, sans-serif;
line-height: 1.6;
color: var(–nr-text);
background: var(–nr-bg);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
:root {
–nr-primary: #546E8F;
–nr-cta: #D9744D;
–nr-cta-hover: #CC6333;
–nr-cta-active: #B8563F;
–nr-text: #333333;
–nr-text-light: #666666;
–nr-text-lighter: #999999;
–nr-bg: #ffffff;
–nr-bg-alt: #f8f8f8;
–nr-border: #eeeeee;
–nr-border-dark: #dddddd;
–nr-footer-bg: #1a1a1a;
–nr-footer-text: #e0e0e0;
–nr-footer-muted: #999999;
–nr-radius: 0.5rem;
–nr-radius-lg: 1rem;
–nr-radius-full: 50px;
–shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
–shadow-md: 0 4px 6px rgba(0, 0, 0, 0.07);
–shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
–shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.1);
–transition-fast: 150ms ease-out;
–transition-normal: 300ms ease-out;
}
h1, h2, h3, h4, h5, h6 {
font-family: ‘Outfit’, sans-serif;
font-weight: 700;
line-height: 1.2;
margin-bottom: 1rem;
color: var(–nr-primary);
}
h1 { font-size: 2.5rem; font-weight: 900; }
h2 { font-size: 2.5rem; font-weight: 800; margin-bottom: 3rem; }
h3 { font-size: 1.5rem; font-weight: 700; }
h4 { font-size: 1.25rem; font-weight: 700; }
p { margin-bottom: 1.5rem; line-height: 1.9; }
a {
color: var(–nr-cta);
text-decoration: none;
transition: color var(–transition-fast);
}
a:hover { color: var(–nr-cta-hover); text-decoration: underline; }
a:active { color: var(–nr-cta-active); }
.container {
max-width: 1200px;
margin: 0 auto;
padding: 0 1.5rem;
}
section { padding: 6rem 0; }
/* ═══════════════════════════════════════════════════════════════════════════
HEADER & NAV
═══════════════════════════════════════════════════════════════════════════ */
header {
position: sticky;
top: 0;
z-index: 100;
background: white;
border-bottom: 1px solid var(–nr-border);
padding: 1.5rem 0;
box-shadow: var(–shadow-sm);
}
.header-content {
display: flex;
justify-content: space-between;
align-items: center;
}
.logo {
font-size: 1.25rem;
font-weight: 700;
color: var(–nr-primary);
text-decoration: none;
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.logo:hover { text-decoration: none; }
.logo-sub {
font-size: 0.6875rem;
color: var(–nr-text-lighter);
text-transform: uppercase;
letter-spacing: 0.5px;
font-weight: 500;
}
nav { display: flex; align-items: center; gap: 2rem; }
.nav {
display: flex;
gap: 2rem;
list-style: none;
}
.nav a {
color: var(–nr-text-light);
font-weight: 500;
font-size: 0.9375rem;
transition: color var(–transition-fast);
}
.nav a:hover { color: var(–nr-primary); text-decoration: none; }
.nav .cta-button {
background: var(–nr-cta);
color: white;
padding: 0.75rem 1.75rem;
border-radius: var(–nr-radius);
font-weight: 600;
font-size: 0.875rem;
transition: all var(–transition-normal);
border: none;
cursor: pointer;
}
.nav .cta-button:hover {
background: var(–nr-cta-hover);
transform: translateY(-2px);
text-decoration: none;
}
/* ═══════════════════════════════════════════════════════════════════════════
BUTTONS
═══════════════════════════════════════════════════════════════════════════ */
.btn-primary,
.btn-secondary {
display: inline-block;
padding: 1.25rem 2.75rem;
border-radius: var(–nr-radius);
text-decoration: none;
font-weight: 700;
font-size: 1rem;
border: none;
cursor: pointer;
transition: all var(–transition-normal);
font-family: inherit;
letter-spacing: 0.5px;
}
.btn-primary {
background: var(–nr-cta);
color: white;
}
.btn-primary:hover {
background: var(–nr-cta-hover);
transform: translateY(-2px);
box-shadow: 0 8px 20px rgba(217, 116, 77, 0.3);
text-decoration: none;
}
.btn-primary:active {
background: var(–nr-cta-active);
transform: translateY(0);
}
.btn-secondary {
background: transparent;
color: var(–nr-primary);
border: 2px solid var(–nr-primary);
}
.btn-secondary:hover {
background: var(–nr-primary);
color: white;
text-decoration: none;
}
.btn-secondary:active { background: #455a7a; }
/* ═══════════════════════════════════════════════════════════════════════════
FOOTER
═══════════════════════════════════════════════════════════════════════════ */
footer {
background: linear-gradient(135deg, var(–nr-footer-bg) 0%, #0a0a0a 100%);
color: var(–nr-footer-text);
padding: 6rem 0 2rem;
margin-top: 6rem;
position: relative;
}
footer::before {
content: ”;
position: absolute;
top: 0;
left: 0;
right: 0;
height: 3px;
background: linear-gradient(90deg, var(–nr-primary) 0%, var(–nr-cta) 100%);
}
.footer-content {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 2rem;
margin-bottom: 2rem;
}
.footer-column h4 {
margin-bottom: 1.5rem;
font-size: 0.9375rem;
font-weight: 600;
color: white;
}
.footer-column ul { list-style: none; }
.footer-column a {
color: var(–nr-footer-muted);
text-decoration: none;
display: block;
padding: 0.5rem 0;
transition: color var(–transition-fast);
font-size: 0.875rem;
}
.footer-column a:hover {
color: var(–nr-cta);
text-decoration: underline;
}
.footer-contact {
font-size: 0.875rem;
line-height: 1.8;
color: var(–nr-footer-muted);
}
.footer-contact strong { color: var(–nr-footer-text); }
.footer-bottom {
border-top: 1px solid rgba(255, 255, 255, 0.1);
padding-top: 1.5rem;
text-align: center;
color: var(–nr-footer-muted);
font-size: 0.8125rem;
}
/* ═══════════════════════════════════════════════════════════════════════════
GRID & CARDS
═══════════════════════════════════════════════════════════════════════════ */
.grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 3rem;
margin-top: 3rem;
}
.grid.cols-3 { grid-template-columns: repeat(3, 1fr); }
.card {
background: var(–nr-bg);
border: 1px solid var(–nr-border);
padding: 3rem;
border-radius: 1rem;
transition: all var(–transition-normal);
box-shadow: var(–shadow-md);
}
.card:hover {
box-shadow: var(–shadow-xl);
transform: translateY(-8px);
border-color: var(–nr-cta);
}
/* ═══════════════════════════════════════════════════════════════════════════
UTILITY & HELPER CLASSES
═══════════════════════════════════════════════════════════════════════════ */
.text-center { text-align: center; }
.mt-lg { margin-top: 1.5rem; }
.mt-xl { margin-top: 2rem; }
.mt-2xl { margin-top: 3rem; }
.mb-lg { margin-bottom: 1.5rem; }
.hero-subtitle {
font-style: italic;
font-weight: 300;
opacity: 0.95;
letter-spacing: 0.3px;
}
/* ═══════════════════════════════════════════════════════════════════════════
HERO & SPECIAL SECTIONS
═══════════════════════════════════════════════════════════════════════════ */
.hero {
background: linear-gradient(135deg, var(–nr-primary) 0%, #3d4f6d 100%);
color: white;
padding: 8rem 0;
position: relative;
}
.hero h1 {
color: white;
font-size: 3.5rem;
margin-bottom: 2rem;
}
.hero h2 {
color: white;
margin-bottom: 2rem;
}
.hero p {
color: rgba(255, 255, 255, 0.95);
margin-bottom: 1.5rem;
font-size: 1.25rem;
}
.bg-alt { background: var(–nr-bg-alt); }
/* ═══════════════════════════════════════════════════════════════════════════
RESPONSIVE
═══════════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
h1 { font-size: 2rem; }
h2 { font-size: 1.75rem; margin-bottom: 2rem; }
.hero h1 { font-size: 2.5rem; }
.nav { display: none; }
.footer-content { grid-template-columns: repeat(2, 1fr); }
section { padding: 4rem 0; }
.grid.cols-3 { grid-template-columns: 1fr; }
.card { padding: 2rem; }
.grid { gap: 2rem; }
}
@media (max-width: 480px) {
h1 { font-size: 1.5rem; }
h2 { font-size: 1.25rem; }
.hero h1 { font-size: 2rem; }
.footer-content { grid-template-columns: 1fr; }
.container { padding: 0 1rem; }
.btn-primary, .btn-secondary { width: 100%; text-align: center; }
section { padding: 3rem 0; }
.card { padding: 1.5rem; }
footer { margin-top: 4rem; padding: 4rem 0 1.5rem; }
}
Política de Privacidade
Última atualização: Abril de 2026
1. Introdução
A NR Arquitetura (“nós”, “nosso” ou “nos”) respeita a privacidade dos visitantes do nosso site. Esta Política de Privacidade descreve como coletamos, usamos, processamos e protegemos seus dados pessoais.
2. Coleta de Dados
Coletamos dados pessoais quando você:
- Preenche nosso formulário de contato
- Se inscreve em nossa newsletter
- Solicita uma consultoria
- Interage com nosso site (através de cookies e analytics)
3. Dados Coletados
Podemos coletar os seguintes dados:
- Nome completo
- Telefone / WhatsApp
- Endereço (opcional)
- Dados de navegação (cookies, IP, comportamento no site)
4. Uso dos Dados
Utilizamos seus dados para:
- Responder suas dúvidas e solicitações
- Enviar informações sobre nossos serviços
- Melhorar nossa comunicação e experiência no site
- Cumprir com obrigações legais (LGPD)
- Analytics e melhoria de performance do site
5. Compartilhamento de Dados
Seus dados não são vendidos, alugados ou compartilhados com terceiros, exceto quando necessário para:
- Serviços técnicos (hospedagem, email, analytics — Google Analytics)
- Cumprimento com lei ou ordem judicial
6. Segurança de Dados
Implementamos medidas de segurança para proteger seus dados pessoais contra acesso não autorizado, alteração, divulgação ou destruição.
7. Armazenamento de Dados
Os dados são armazenados em servidores seguros pela hospedagem do WordPress e apenas pelo tempo necessário para fornecer nossos serviços ou conforme exigido por lei.
8. Seus Direitos (LGPD)
Você tem o direito de:
- Acessar seus dados pessoais
- Solicitar correção de dados imprecisos
- Solicitar exclusão de dados (direito de ser esquecido)
- Opor-se ao processamento de seus dados
- Solicitar portabilidade de dados
9. Cookies
Utilizamos cookies para melhorar sua experiência no site. Você pode desabilitar cookies em suas configurações de navegador.
10. Contato
Para exercer seus direitos ou fazer perguntas sobre esta política, entre em contato conosco:
NR Arquitetura
R. José Serafim, 691 – Laguinho, Macapá – AP, 68908-150
Telefone: (96) 98102-4338
Email: contato@nrarq.com
