/*
 * ============================================================
 *  custom.css — Personalizações globais do site DaneLuci
 * ============================================================
 *
 *  Este arquivo é carregado APÓS todos os outros estilos,
 *  então qualquer regra aqui tem prioridade máxima.
 *
 *  Como usar:
 *  - Descomente (retire o /* ... * /) a regra que quiser ativar
 *  - Ou adicione novas regras ao final do arquivo
 *  - O servidor de desenvolvimento aplica as mudanças sem reiniciar
 *
 * ============================================================
 */


/* ============================================================
   1. VARIÁVEIS GLOBAIS (CSS Custom Properties)
   Altere aqui para mudar cores/fontes em todo o site de uma vez
   ============================================================ */

/*
:root {
  --color-primary:   #your-color;
  --color-secondary: #your-color;
  --color-accent:    #your-color;
  --color-bg:        #your-color;
  --color-text:      #your-color;

  --font-body:       'Inter', sans-serif;
  --font-heading:    'Inter', sans-serif;

  --border-radius:   8px;
  --transition:      0.3s ease;
}
*/

html {
    font-family: 'Poppins', sans-serif !important;
}


/* ============================================================
   2. TIPOGRAFIA — Títulos, parágrafos, links
   ============================================================ */

/*
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  color: var(--color-text);
}

p {
  line-height: 1.7;
}

a {
  color: var(--color-primary);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}
*/


/* ============================================================
   3. HEADER / NAVEGAÇÃO
   ============================================================ */

/*
header,
nav {
  background-color: var(--color-bg);
}

nav a {
  color: var(--color-text);
}

nav a:hover {
  color: var(--color-primary);
}
*/

.lg\:border-border-primary {
    border: none;
}

.lg\:text-base:hover {
    color: #4DDBE2;
}

/* ============================================================
   4. FOOTER
   ============================================================ */

/*
footer {
  background-color: var(--color-bg);
  color: var(--color-text);
}

footer a {
  color: var(--color-primary);
}
*/


/* ============================================================
   5. BOTÕES
   ============================================================ */

/*
button,
.btn {
  background-color: var(--color-primary);
  color: #fff;
  border-radius: var(--border-radius);
  transition: background-color var(--transition);
}

button:hover,
.btn:hover {
  background-color: var(--color-secondary);
}
*/

button {
    border-radius: 6px;
}

.bg-background-alternative {
    background-color: #4DDBE2 !important;
}

.ring-offset-white {
    color: #000 !important;
}

.border,
.border-b {
    border: none !important;
}

.border-border-alternative {
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

/* ============================================================
   6. FORMULÁRIOS — inputs, selects, textareas
   ============================================================ */

/*
input,
select,
textarea {
  border: 1px solid #ccc;
  border-radius: var(--border-radius);
  padding: 0.5rem 0.75rem;
  font-family: var(--font-body);
}

input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-primary) 30%, transparent);
}
*/


/* ============================================================
   7. SEÇÕES / PAGES ESPECÍFICAS
   Use classes ou IDs para atingir páginas individuais
   ============================================================ */

/*
.page-home .hero-section {
  background-color: var(--color-bg);
}

.page-imoveis .card {
  border-color: var(--color-primary);
}

.page-veiculos .card {
  border-color: var(--color-secondary);
}
*/


/* ============================================================
   8. IMAGENS & MÍDIA
   ============================================================ */

/*
img {
  border-radius: var(--border-radius);
}
*/


/* ============================================================
   9. RESPONSIVIDADE — Mobile First
   ============================================================ */

/*
@media (max-width: 768px) {
  h1 { font-size: 1.75rem; }
  h2 { font-size: 1.5rem; }
}

@media (min-width: 1024px) {
  .container {
    max-width: 1280px;
    margin-inline: auto;
  }
}
*/


/* ============================================================
   10. UTILITÁRIOS / HELPERS
   ============================================================ */

/*
.text-primary   { color: var(--color-primary); }
.bg-primary     { background-color: var(--color-primary); }
.border-primary { border-color: var(--color-primary); }

.shadow-custom {
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
}
*/


/* ============================================================
   11. ANIMAÇÕES / TRANSIÇÕES
   ============================================================ */

/*
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

.animate-fade-in {
  animation: fadeIn 0.4s ease forwards;
}
*/


/* ============================================================
   12. ESTILOS PERSONALIZADOS LIVRES
   Adicione aqui qualquer outra customização
   ============================================================ */

.card {
    border-radius: 32px !important;
    border: 1px solid #e1e1e1 !important;
    overflow: hidden;
}

.input-field {
    border-radius: 16px !important;
    border: 1px solid #e1e1e1 !important;
}

.scetion-bg-gray {
    background-color: #f5f5f5 !important;
}

.section-bg-dark-gray {
    background-color: #111111 !important;
    color: #ffffff !important;
}

.btn-tertiary {
    border: 1px solid #f5f5f5 !important;
    background-color: #ffffff !important;
    color: #000 !important;
}

/* Border Radius */
.b-radius-32 {
    border-radius: 32px !important;
}

.b-radius-16 {
    border-radius: 16px !important;
}