/* ── Background images ──────────────────────────────── */
.hero-bg-photo {
  background: url('../images/IMG_RITMO_13.png') center center / cover no-repeat;
}
.hero-fade-brown {
  background: linear-gradient(to bottom, transparent 0%, rgba(129,117,95,0.6) 40%, #81755F 88%);
}
.hero-overlay {
  background: linear-gradient(to bottom, rgba(28,22,15,0.28) 0%, rgba(28,22,15,0.15) 45%, rgba(28,22,15,0.45) 100%);
}
.conceito-col-left {
  position: relative;
  width: 55%;
}
.conceito-col-left::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 22%;
  background: linear-gradient(to bottom, #81755F 0%, transparent 100%);
  z-index: 2;
}
.conceito-col-left::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.45) 0%, rgba(0,0,0,0.1) 40%, transparent 65%);
  z-index: 1;
}
.banner-vista-mobile {
  background: url('../images/IMG_RITMO_33.png') center center / cover no-repeat;
}

/* ── Fonte global ───────────────────────────────────── */
html, body, * { font-family: 'Albert Sans', sans-serif; }

/* ── Scrollbar ───────────────────────────────────────── */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-thumb { background: #81755F; }

/* ── Input ──────────────────────────────────────────── */
.field-line {
  background: transparent;
  border: none;
  border-bottom: 0.5px solid #F6F1E8;
  color: #F6F1E8;
  font-size: 11.5px;
  font-weight: 300;
  width: 100%;
  padding: 8px 0;
  outline: none;
}
.field-line::placeholder { color: #F6F1E8; opacity: 0.7; }
select.field-line { background: transparent; color: #F6F1E8; appearance: none; cursor: pointer; }
select.field-line option { background: #2A313B; color: #F6F1E8; }
select.field-line option:disabled { opacity: 0.7; }

/* ── Fade-up keyframe ───────────────────────────────── */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Contact form state transition ─────────────────────────────────────── */
.contato-state {
  transition: opacity 0.5s ease, transform 0.5s ease, visibility 0s;
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
}
.contato-state--hidden {
  opacity: 0;
  transform: translateY(16px);
  pointer-events: none;
  visibility: hidden;
  position: absolute;
  inset: 2.5rem;
  transition: opacity 0.5s ease, transform 0.5s ease, visibility 0s 0.5s;
}