/* Upcoming-collection signup pages — minimal black, monospace,
   "this is coming. sign up." */

body.template-upcoming-page {
  background: #000;
  color: #fff;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
  overflow-x: hidden;
}
body.template-upcoming-page .shopify-section-header,
body.template-upcoming-page .header,
body.template-upcoming-page footer,
body.template-upcoming-page .footer,
body.template-upcoming-page .shopify-section-group-footer-group { display: none !important; }

.upcoming {
  min-height: 100svh;
  display: grid;
  grid-template-rows: auto 1fr;
}

.upcoming-mark {
  display: flex; gap: 0.6rem; align-items: center; justify-content: center;
  padding: clamp(1rem, 3vw, 1.5rem) 1rem;
  font-size: 0.7rem; letter-spacing: 0.3em; text-transform: uppercase;
  color: rgba(255,255,255,0.7);
}
.upcoming-mark__divider { opacity: 0.4; }

.upcoming-stage {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center;
  padding: 2rem 1.25rem;
  max-width: 540px;
  margin: 0 auto;
}

.upcoming-eyebrow {
  font-size: 0.75rem; letter-spacing: 0.32em; text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  margin: 0 0 1rem;
}

.upcoming-title {
  font-family: -apple-system, BlinkMacSystemFont, "Inter", "Helvetica Neue", sans-serif;
  font-weight: 900;
  font-size: clamp(3rem, 14vw, 8rem);
  line-height: 0.92;
  letter-spacing: -0.04em;
  margin: 0 0 1.5rem;
  text-transform: uppercase;
  color: #fff;
}

.upcoming-blurb {
  font-size: clamp(0.9rem, 1.6vw, 1rem);
  line-height: 1.6;
  color: rgba(255,255,255,0.7);
  margin: 0 auto 2rem;
  max-width: 32ch;
}

.upcoming-form {
  width: 100%;
  display: flex; flex-direction: column; gap: 0.65rem;
  text-align: left;
}
.upcoming-form[hidden] { display: none; }
.upcoming-form__input {
  width: 100%;
  padding: 1rem 1.1rem;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 4px;
  color: #fff;
  font: inherit;
  -webkit-appearance: none; appearance: none;
}
.upcoming-form__input::placeholder { color: rgba(255,255,255,0.4); }
.upcoming-form__input:focus {
  outline: none;
  border-color: #fff;
  background: rgba(255,255,255,0.12);
}
.upcoming-form__submit {
  position: relative;
  padding: 1.05rem 1.25rem;
  background: #fff; color: #000;
  border: 0; border-radius: 4px;
  font: inherit; font-weight: 700;
  letter-spacing: 0.22em; text-transform: uppercase;
  cursor: pointer;
  transition: opacity 0.15s ease;
}
.upcoming-form__submit:hover { opacity: 0.92; }
.upcoming-form__submit[disabled] { opacity: 0.5; cursor: not-allowed; }
.upcoming-form__submit-spin { display: none; }
.upcoming-form.is-loading .upcoming-form__submit-label { visibility: hidden; }
.upcoming-form.is-loading .upcoming-form__submit-spin {
  display: inline-block; position: absolute; inset: 0; margin: auto;
  width: 14px; height: 14px;
  border: 2px solid currentColor; border-bottom-color: transparent;
  border-radius: 50%; animation: upcoming-spin 0.7s linear infinite;
}
@keyframes upcoming-spin { to { transform: rotate(360deg); } }

.upcoming-form__status {
  min-height: 1rem; margin: 0; text-align: center;
  font-size: 0.7rem; letter-spacing: 0.18em; text-transform: uppercase;
}
.upcoming-form__status.is-error { color: #ff6b6b; }
.upcoming-form__status.is-ok { color: #7bff9d; }

.upcoming-form__fine {
  margin: 0; text-align: center;
  font-size: 0.7rem; letter-spacing: 0.18em; text-transform: uppercase;
  color: rgba(255,255,255,0.45);
}
.upcoming-form__fine a { color: rgba(255,255,255,0.75); text-decoration: underline; }

.upcoming-success {
  animation: upcoming-fadein 0.35s ease;
  padding: 1rem 0;
}
.upcoming-success[hidden] { display: none; }
@keyframes upcoming-fadein { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.upcoming-success__title {
  font-family: -apple-system, BlinkMacSystemFont, "Inter", "Helvetica Neue", sans-serif;
  font-weight: 800;
  font-size: clamp(1.6rem, 4.5vw, 2.4rem);
  letter-spacing: -0.02em;
  margin: 0 0 0.5rem;
  text-transform: uppercase;
}
.upcoming-success__msg {
  font-size: 0.9rem; letter-spacing: 0.2em; text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  margin: 0 0 1.5rem;
}
.upcoming-success__cta {
  display: inline-block;
  padding: 0.85rem 1.5rem;
  border: 1px solid rgba(255,255,255,0.25);
  color: #fff;
  font-size: 0.75rem; letter-spacing: 0.22em; text-transform: uppercase;
  text-decoration: none;
  border-radius: 4px;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.upcoming-success__cta:hover { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.4); }