/* ============================================================
   Coming-soon holding page
   Deliberately quiet: one card on silk, the seal as the only colour.
   ============================================================ */

.cs-body {
  min-height: 100vh;
  display: flex;
  background:
    radial-gradient(120% 80% at 50% 0%, var(--silk-lt), var(--silk) 55%, var(--silk-dk) 100%);
}

.cs-wrap {
  margin: auto;
  padding: 40px 24px;
  width: 100%;
  max-width: 560px;
  position: relative;
  z-index: 2;
}

.cs-card {
  border: 1px solid var(--line);
  background: rgba(216, 201, 168, .42);
  padding: 48px 40px 36px;
  text-align: center;
  box-shadow: 0 2px 6px rgba(51,40,28,.08), 0 22px 50px rgba(51,40,28,.14);
}

.cs-seal {
  display: inline-flex; align-items: center; justify-content: center;
  width: 46px; height: 46px; margin-bottom: 22px;
  background: var(--seal); color: var(--rice);
  font-family: var(--hei); font-size: 23px; font-weight: 600;
  line-height: 1; border-radius: 3px;
}

.cs-brand {
  font-family: var(--hei); font-size: 17px; font-weight: 600;
  letter-spacing: .16em; color: var(--sumi); margin: 0 0 30px;
}
.cs-brand small {
  display: block; font-family: var(--mono); font-size: 9.5px;
  letter-spacing: .18em; color: var(--earth);
  font-weight: 400; margin-top: 5px;
}

.cs-title {
  font-family: var(--hei); font-size: clamp(22px, 4vw, 30px);
  font-weight: 600; letter-spacing: .12em; color: var(--sumi);
  margin: 0 0 14px; text-wrap: balance;
}

.cs-lede {
  font-size: 13.5px; line-height: 2; color: var(--umber);
  margin: 0 auto 34px; max-width: 34ch; letter-spacing: .02em;
}

/* ---- passphrase ---- */
.cs-form {
  border-top: 1px solid var(--line);
  padding-top: 26px;
  text-align: left;
}
.cs-label {
  display: block;
  font-family: var(--mono); font-size: 10px; letter-spacing: .2em;
  text-transform: uppercase; color: var(--earth); margin-bottom: 10px;
}
.cs-row { display: flex; gap: 10px; flex-wrap: wrap; }

.cs-input {
  flex: 1 1 160px; min-width: 0;
  font-family: var(--sans); font-size: 14px; color: var(--sumi);
  background: rgba(239, 230, 210, .6);
  border: 1px solid var(--line-firm); border-radius: 2px;
  padding: 11px 14px;
  transition: border-color .25s, background .25s;
}
.cs-input::placeholder { color: rgba(92,74,51,.45); }
.cs-input:focus {
  outline: none; border-color: var(--seal);
  background: rgba(239, 230, 210, .85);
}
.cs-btn { flex: 0 0 auto; cursor: pointer; }

.cs-error {
  font-size: 12.5px; color: var(--seal);
  margin: 12px 0 0; letter-spacing: .02em;
}

/* ---- footer ---- */
.cs-foot {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap;
  margin-top: 32px; padding-top: 18px;
  border-top: 1px solid var(--line);
}
.cs-lang {
  font-family: var(--hei); font-size: 12.5px; letter-spacing: .1em;
  color: var(--seal); text-decoration: none;
  border-bottom: 1px solid transparent; transition: border-color .25s;
}
.cs-lang:hover { border-bottom-color: var(--seal); }
.cs-place {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: .16em; color: var(--earth);
}

@media (max-width: 480px) {
  .cs-card { padding: 36px 24px 28px; }
}