/* =============================================
   MINTAREX - LAUNCHPAD "COMING SOON" STYLES
   ============================================= */

.coming-soon-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 10vh 0;
    min-height: 50vh;
}

.status-indicator {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    font-size: 0.9rem;
	font-weight: bold;
    color: var(--accent-base);
}

.status-light {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: var(--accent-base);
    box-shadow: 0 0 12px var(--accent-glow);
    animation: pulse-live 2s infinite;
}

@keyframes pulse-live {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(0.85); }
}

.coming-soon-section h2 {
    font-size: clamp(2rem, 6vw, 3rem);
    color: var(--ink);
    margin: 0 0 15px;
}

.coming-soon-section .subtitle {
    font-size: clamp(1rem, 3vw, 1.15rem);
    color: var(--muted);
    max-width: 600px;
    margin: 0 auto 40px;
}

/* --- Launchpad Waitlist Form — desktop + mobile perfect centering --- */
.notify-form{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto; /* input | button */
  column-gap:10px;
  row-gap:0;
  width:100%;
  max-width:500px;
  align-items:start;     /* keep button pinned to top of input */
  justify-items:stretch; /* input fills its column */
}

/* stack input + below-field message */
.notify-form .input-wrap{
  grid-column:1;
  display:flex;
  flex-direction:column;
  min-width:0;            /* avoids overflow with long placeholders */
}

.notify-form input{
  width:100%;
  padding:14px 20px;
  border-radius:999px;
  border:1px solid var(--line);
  background:var(--glass-bg);
  font-family:'Inter',sans-serif;
  font-size:1rem;
  transition:border-color .2s, box-shadow .2s;
}

.notify-form input:focus{
  outline:none;
  border-color:var(--accent-base);
  box-shadow:0 0 0 3px var(--accent-glow);
}

/* button in second column, top-aligned with input */
.notify-form .btn{
  grid-column:2;
  align-self:start;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  height:48px;           /* match input height */
  padding:0 18px;
  white-space:nowrap;
}

/* below-field message */
.mx-form .form-status{
  margin-top:.6rem;
  font-size:.95rem;
  line-height:1.3;
  min-height:1.1em;      /* reserve space so layout doesn’t jump */
  text-align:center;
}
.mx-form .form-status[data-tone="success"]{color:#1f9d55;}
.mx-form .form-status[data-tone="error"]{color:#c53030;}
.mx-form .form-status[data-tone="info"]{color:#4a5568;}
.mx-form button.is-loading{opacity:.7;pointer-events:none;}

/* Turnstile is invisible; keep it from affecting layout */
.cf-turnstile{width:0;height:0;overflow:hidden;}

/* === Mobile (≤576px): stack and CENTER the button beneath the field === */
@media (max-width:576px){
  .notify-form{
    grid-template-columns:1fr;     /* single column */
    row-gap:10px;
    justify-items:center;          /* center children horizontally */
  }
  .notify-form .input-wrap{
    width:100%;                    /* input stays full-width */
  }
  .notify-form .btn{
    grid-column:1;
    justify-self:center;           /* center the button */
    align-self:start;
    width:auto;                    /* intrinsic pill width */
    min-width:160px;               /* optional: steady width */
    padding:0 24px;
    height:48px;
  }
}