/* ════════════════════════════════════════════
   MueblesDaj — Página de Contacto
════════════════════════════════════════════ */

.daj-contact {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
  background: #f8f7f4;
  min-height: 100vh;
  padding: 64px 24px;
}

/* ════════════════════════════
   LAYOUT DOS COLUMNAS
════════════════════════════ */
.daj-contact__inner {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 8px 48px rgba(0,0,0,.10), 0 2px 12px rgba(0,0,0,.06);
}

/* ════════════════════════════
   COLUMNA IMAGEN
════════════════════════════ */
.daj-contact__img {
  position: relative;
  min-height: 560px;
  overflow: hidden;
}
.daj-contact__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
/* Overlay degradado sobre la imagen */
.daj-contact__img::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(28,25,23,.55) 0%,
    rgba(180,83,9,.30) 100%
  );
}
/* Texto encima de la imagen */
.daj-contact__img-copy {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 36px 32px;
  z-index: 1;
}
.daj-contact__img-copy h2 {
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  font-weight: 800;
  color: #fff;
  letter-spacing: -.03em;
  line-height: 1.2;
  margin: 0 0 8px;
}
.daj-contact__img-copy p {
  font-size: .9rem;
  color: rgba(255,255,255,.75);
  line-height: 1.6;
  margin: 0;
}

/* ════════════════════════════
   COLUMNA FORMULARIO
════════════════════════════ */
.daj-contact__form-wrap {
  padding: 52px 44px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.daj-contact__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #b45309;
  background: #fef3c7;
  padding: 4px 12px;
  border-radius: 99px;
  margin-bottom: 16px;
  width: fit-content;
}
.daj-contact__title {
  font-size: clamp(1.4rem, 2.5vw, 1.9rem);
  font-weight: 800;
  color: #1c1917;
  letter-spacing: -.04em;
  line-height: 1.2;
  margin: 0 0 6px;
}
.daj-contact__sub {
  font-size: .875rem;
  color: #a8a29e;
  margin: 0 0 32px;
  line-height: 1.6;
}

/* ── Campos ── */
.daj-contact__form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.daj-contact__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.daj-contact__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.daj-contact__label {
  font-size: .78rem;
  font-weight: 600;
  color: #44403c;
  letter-spacing: .01em;
}
.daj-contact__label span {
  color: #b45309;
}

.daj-contact__input,
.daj-contact__textarea {
  width: 100%;
  padding: 11px 14px;
  font-size: .875rem;
  font-family: inherit;
  color: #1c1917;
  background: #fafaf9;
  border: 1.5px solid #e7e5e4;
  border-radius: 8px;
  outline: none;
  transition: border-color 200ms ease, box-shadow 200ms ease, background 200ms ease;
  box-sizing: border-box;
}
.daj-contact__input::placeholder,
.daj-contact__textarea::placeholder {
  color: #c4bfba;
}
.daj-contact__input:focus,
.daj-contact__textarea:focus {
  border-color: #b45309;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(180,83,9,.12);
}

.daj-contact__textarea {
  resize: vertical;
  min-height: 120px;
  line-height: 1.6;
}

/* ── Botón enviar ── */
.daj-contact__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 13px 24px;
  background: #1c1917;
  color: #fff;
  font-size: .9rem;
  font-weight: 600;
  font-family: inherit;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  letter-spacing: .01em;
  transition: background 200ms ease, transform 200ms ease;
  margin-top: 4px;
}
.daj-contact__submit:hover {
  background: #b45309;
  transform: translateY(-1px);
}
.daj-contact__submit:active {
  transform: translateY(0);
}
.daj-contact__submit svg {
  flex-shrink: 0;
  transition: transform 200ms ease;
}
.daj-contact__submit:hover svg {
  transform: translateX(3px);
}

/* ── Mensajes de estado ── */
.daj-contact__alert {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 14px 16px;
  border-radius: 8px;
  font-size: .85rem;
  line-height: 1.5;
  font-weight: 500;
}
.daj-contact__alert--ok {
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  color: #15803d;
}
.daj-contact__alert--err {
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #dc2626;
}

/* ════════════════════════════
   RESPONSIVE
════════════════════════════ */
@media (max-width: 860px) {
  .daj-contact__inner {
    grid-template-columns: 1fr;
  }
  .daj-contact__img {
    min-height: 260px;
  }
  .daj-contact__form-wrap {
    padding: 40px 32px;
  }
}
@media (max-width: 540px) {
  .daj-contact {
    padding: 32px 16px;
  }
  .daj-contact__form-wrap {
    padding: 32px 24px;
  }
  .daj-contact__row {
    grid-template-columns: 1fr;
  }
}