/* =============================================
   RESET & VARIÁVEIS GLOBAIS
============================================= */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --primary:      var(--brand-primary, #e99636);
  --primary-dk:   var(--brand-secondary, #ff8000);
  --primary-lt:   #FFF4E6;
  --accent:       var(--brand-dark, #242204);
  --success:      #10B981;
  --bg:           var(--bg-body, #F0F4F8);
  --bg-card:      var(--bg-card, #FFFFFF);
  --text:         var(--text, #1A1A2E);
  --text-muted:   var(--text-muted, #6B7280);
  --border:       var(--border, #E5E7EB);
  --radius:       var(--radius-md, 12px);
  --radius-lg:    var(--radius-xl, 20px);
  --shadow:       var(--shadow, 0 4px 12px rgba(0,0,0,0.10));
  --shadow-hover: var(--shadow-hover, 0 6px 16px rgba(0,0,0,0.12));
  --transition:   0.22s ease;
  --navbar-h:     64px;
}

html { scroll-behavior: smooth; }

body {
  font-family: 'Inter', sans-serif;
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: 100%; }
button { cursor: pointer; font-family: inherit; }
input, select { font-family: inherit; }

/* Utilitários */
.btn-link {
  background: none;
  border: none;
  color: var(--primary);
  font-weight: 600;
  font-size: inherit;
  text-decoration: underline;
  cursor: pointer;
  padding: 0;
}

/* Range input — estilo compartilhado */
input[type="range"] {
  -webkit-appearance: none;
  width: 100%;
  height: 4px;
  background: linear-gradient(
    to right,
    var(--primary) var(--pct, 100%),
    var(--border) var(--pct, 100%)
  );
  border-radius: 2px;
  border: none !important;
  padding: 0 !important;
  cursor: pointer;
  outline: none;
}
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--primary);
  border: 3px solid #fff;
  box-shadow: 0 0 0 2px var(--primary);
}
input[type="range"]::-moz-range-thumb {
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--primary);
  border: 3px solid #fff;
  box-shadow: 0 0 0 2px var(--primary);
}

/* Campos de formulário — estilo compartilhado */
.field-input {
  border: 1.5px solid var(--border);
  border-radius: 8px;
  padding: 9px 12px;
  font-size: 0.9rem;
  color: var(--text);
  background: var(--bg);
  outline: none;
  transition: border-color var(--transition);
  width: 100%;
  -webkit-appearance: none;
}
.field-input:focus { border-color: var(--primary); }

.field-label {
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--text-muted);
  margin-bottom: 6px;
  display: block;
}

.section-label {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: var(--text-muted);
  margin-bottom: 12px;
}

.amenity-tag {
  background: var(--primary-lt);
  color: var(--primary);
  font-size: 0.68rem;
  font-weight: 500;
  padding: 3px 8px;
  border-radius: 20px;
  white-space: nowrap;
}