html { scroll-behavior: smooth; }

.field { position: relative; }
.field input {
  width: 100%; height: 3.5rem; border: 1px solid #e3e3df; border-radius: 9999px;
  padding-inline: 1.5rem; font-family: inherit; font-size: 1rem; color: #0e0e0e; background: #fff;
  outline: none; transition: border-color .15s, box-shadow .15s;
}
.field.has-eye input { padding-inline-end: 3.5rem; }
.field input:hover { border-color: #0e0e0e; }
.field input:focus { border-color: #0e0e0e; box-shadow: 0 0 0 3px rgba(184,137,90,.35); }
.field label {
  position: absolute; inset-inline-start: 1.25rem; top: 50%; transform: translateY(-50%);
  padding: 0 .35rem; font-size: 1rem; color: #6b6b66; background: transparent; pointer-events: none; transition: all .16s;
}
.field input:focus + label, .field input:not(:placeholder-shown) + label {
  top: 0; font-size: .75rem; color: #0e0e0e; background: #fff; font-weight: 700;
}
.field .eye { position: absolute; inset-inline-end: .75rem; top: 50%; transform: translateY(-50%); }

.font-playfair { font-family: 'Playfair Display', Georgia, serif; }
html[lang="ar"] .font-playfair, [dir="rtl"] .font-playfair { font-family: 'Cairo', sans-serif; }

fieldset {
  border: 1px solid #262626;
  border-radius: 8px;
  padding: 0 16px 8px 16px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
fieldset:focus-within {
  border-color: #000000;
  box-shadow: 0 0 0 1px #000000;
}
legend {
  padding: 0 6px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.05em;
  color: #525252;
  text-transform: uppercase;
}

.js .rise { opacity: 0; transform: translateY(18px); animation: rise .8s ease forwards; }
.js .rise.d1 { animation-delay: .1s; } .js .rise.d2 { animation-delay: .22s; } .js .rise.d3 { animation-delay: .34s; }
@keyframes rise { to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .js .rise { opacity: 1; transform: none; animation: none; } }
