/* ------------------------------
   基本レイアウト
--------------------------------*/
.container {
    max-width: 560px; /* 1 カラム固定幅 */
    margin: 0 auto;
    padding: 12px 24px;
}

/* 見出し */
.title.is-4 {
    text-align: center;
    margin-bottom: 2.5rem;
    font-weight: 700;
}

/* ------------------------------
   Bulma の `.box` をフラットに
--------------------------------*/
.box {
    border: none;
    box-shadow: none;
    padding: 0;
    background: #fff;
}

/* ------------------------------
   フィールド間隔
--------------------------------*/
.field + .field {
    margin-top: 2rem;
}

/* ラベル */
.label {
    font-size: 0.875rem;
    font-weight: 700;
    margin-bottom: 0.25rem;
}

/* ------------------------------
   インプット＆テキストエリア
--------------------------------*/
.input,
.textarea {
    border: none; /* 枠線リセット */
    border-bottom: 1px solid #dcdfe6; /* 下線だけ */
    border-radius: 0;
    padding: 0.75rem 0;
    box-shadow: none;
    font-size: 1rem;
}

.input:focus,
.textarea:focus {
    border-bottom-color: #0d3879; /* フォーカス時に濃いネイビー */
    outline: none;
}

/* プレースホルダーを薄グレーに */
::placeholder {
    color: #9ca3af;
}

/* ------------------------------
   送信ボタン
--------------------------------*/
.button.is-link {
    display: block;
    width: 100%;
    background: #0d3879; /* ネイビー (#0d3879 は例) */
    color: #fff;
    font-weight: 600;
    letter-spacing: 0.05em;
    padding: 1rem 0;
    border-radius: 4px;
    transition: opacity 0.3s;
}

.button.is-link:hover {
    opacity: 0.85;
}


/* === 幅をコンテナいっぱいに広げる ======================= */
.field .control {           /* Bulma の横幅制限を打ち消す */
  max-width: none;          /* ← 20rem を解除 */
  width: 100%;
}

.input,
.textarea {
  width: 100%;              /* 念のため明示 */
}



/* ========= ボタン無効時 ========= */
.button[disabled] {
  opacity: 0.6;           /* 薄くする */
  cursor: not-allowed;
}

/* ========= スピナー ========= */
.spinner {
  display: none;              /* ふだん非表示 */
  width: 1em;
  height: 1em;
  border: 2px solid transparent;
  border-top-color: #fff;
  border-radius: 50%;
  margin-left: 0.5em;
  animation: spin 0.6s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}