/* contacto.css — Modal de "Solicitar acceso" */

.modal-backdrop{
  position:fixed;inset:0;z-index:100;display:none;
  background:rgba(22,19,15,.55);backdrop-filter:blur(3px);
  align-items:flex-start;justify-content:center;padding:40px 20px;overflow-y:auto;
}
.modal-backdrop.open{display:flex}

.modal{
  width:560px;max-width:100%;
  background-color:#F2EEE5;background-image:linear-gradient(#F2EEE5,#F2EEE5);
  border:1px solid var(--line);border-radius:8px;
  box-shadow:0 40px 80px -30px rgba(22,19,15,.5);
  animation:modal-in .25s cubic-bezier(.2,.8,.2,1);
}
@keyframes modal-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:26px 28px 0}
.modal-head .k{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--sello);margin-bottom:8px}
.modal-head h2{font-family:var(--serif);font-weight:500;font-size:28px;letter-spacing:-.02em;line-height:1}
.modal-head p{font-family:var(--mono);font-size:12.5px;color:var(--ash);margin-top:8px;line-height:1.5}
.modal-close{font-family:var(--mono);font-size:20px;line-height:1;color:var(--ink-soft);background:none;border:1px solid var(--line);border-radius:50%;width:34px;height:34px;flex:none;cursor:pointer;transition:all .2s}
.modal-close:hover{color:var(--sello);border-color:var(--sello)}

.modal-body{padding:22px 28px 28px}
.mfield{margin-bottom:15px}
.mfield label{display:block;font-family:var(--mono);font-size:12px;color:var(--ink-soft);margin-bottom:6px;letter-spacing:.02em}
.mfield label .req{color:var(--sello)}
.mfield input,.mfield select,.mfield textarea{
  width:100%;font-family:var(--sans);font-size:14.5px;color:var(--ink);
  background:#fff;border:1px solid var(--line);border-radius:4px;padding:11px 13px;outline:none;transition:border-color .2s;
}
.mfield input:focus,.mfield select:focus,.mfield textarea:focus{border-color:var(--sello)}
.mfield textarea{min-height:90px;resize:vertical;line-height:1.5}
.mrow{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:520px){.mrow{grid-template-columns:1fr}}
.mhp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden} /* honeypot */

.msubmit{
  width:100%;font-family:var(--mono);font-size:14px;font-weight:500;cursor:pointer;margin-top:6px;
  background:var(--sello);color:#fff;border:1px solid var(--sello);padding:14px;border-radius:3px;transition:all .2s;
}
.msubmit:hover{background:var(--sello-deep);border-color:var(--sello-deep)}
.msubmit:disabled{opacity:.6;cursor:default}

.mstatus{font-family:var(--mono);font-size:13px;margin-top:14px;padding:12px 14px;border-radius:4px;display:none;line-height:1.5}
.mstatus.show{display:block}
.mstatus.ok{color:#2e7d4f;background:rgba(46,125,79,.06);border:1px solid rgba(46,125,79,.3)}
.mstatus.bad{color:var(--sello);background:rgba(214,59,38,.06);border:1px solid rgba(214,59,38,.3)}

.mfield .err{font-family:var(--mono);font-size:11px;color:var(--sello);margin-top:5px;display:none}
.mfield.invalid input,.mfield.invalid select{border-color:var(--sello)}
.mfield.invalid .err{display:block}

.modal-success{display:none;text-align:center;padding:50px 28px}
.modal-success.show{display:block}
.modal-success .seal{width:54px;height:54px;margin-bottom:18px}
.modal-success h2{font-family:var(--serif);font-weight:500;font-size:30px;margin-bottom:10px}
.modal-success p{font-family:var(--mono);font-size:13px;color:var(--ash);line-height:1.6}