/* ---------- checkout ---------- */
.checkout{
  width:min(560px, calc(100vw - 24px)); max-height:calc(100dvh - 24px);
  padding:0; border:1px solid var(--rule); background:var(--paper); color:var(--ink);
  overflow:auto;
}
.checkout::backdrop{background:rgba(46,76,89,.38); backdrop-filter:blur(3px)}
.checkout form{padding:clamp(1.4rem,4vw,2.2rem)}
.co-head{display:flex; justify-content:space-between; align-items:flex-start; gap:1rem}
.co-head h2{margin:.3rem 0 .4rem}
.co-close{
  border:0; background:transparent; color:var(--ink-soft); cursor:pointer;
  font-size:1.8rem; line-height:1; padding:.2rem .4rem;
}
.co-close:hover{color:var(--ink)}
.co-summary{
  font-family:var(--f-display); font-size:.74rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--sienna); margin:0 0 1.4rem;
}
.checkout fieldset{border:0; padding:0; margin:0 0 .4rem; min-width:0}
.field{display:grid; gap:.35rem; margin-bottom:1rem}
.field > span{
  font-family:var(--f-display); font-size:.64rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--ink-soft);
}
.field em{font-style:normal; letter-spacing:.1em; text-transform:none}
.field input,.field select{
  width:100%; border:1px solid var(--rule); background:#fffdf9; color:var(--ink);
  font-family:var(--f-body); font-size:1.05rem; padding:.7rem .85rem; border-radius:0;
  -webkit-appearance:none; appearance:none;
}
.field select{
  background-image:linear-gradient(45deg,transparent 50%,var(--ink-soft) 50%),linear-gradient(135deg,var(--ink-soft) 50%,transparent 50%);
  background-position:calc(100% - 18px) 55%, calc(100% - 13px) 55%;
  background-size:5px 5px; background-repeat:no-repeat; padding-right:2.2rem;
}
.field input:focus,.field select:focus{border-color:var(--ink); outline:none}
.field input[aria-invalid="true"]{border-color:var(--sienna)}
.field-row{display:grid; grid-template-columns:1fr 1fr; gap:0 .9rem}
.field-row .field--cp{max-width:none}
.hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.co-totals{margin:.6rem 0 1rem; border-top:0; padding-top:0}
.co-error{
  font-family:var(--f-display); font-size:.72rem; letter-spacing:.08em;
  color:var(--sienna); min-height:1.1em; margin:0 0 .8rem;
}
#coSubmit[disabled],#pay[disabled]{opacity:.55; cursor:progress}
@media (max-width:520px){
  .field-row{grid-template-columns:1fr}
  .checkout{width:100vw; max-width:100vw; max-height:100dvh; height:100dvh; border:0}
}

/* ---------- gracias ---------- */
.thanks{min-height:70vh; display:grid; place-items:center; text-align:center; padding:4rem var(--gutter)}
.thanks .folio{font-family:var(--f-display); letter-spacing:.24em; font-size:1rem; margin:1rem 0}
