/**
 * 家紋生成フォームページ（プラグイン .kamon-wrap / #kamon-generator-form をラップ）
 */

.kamon-page--form {
	background: var(--ka-bg);
}

.kamon-form-intro {
	padding: clamp(2.5rem, 8vw, 4.5rem) 0 clamp(1.5rem, 4vw, 2rem);
	border-bottom: var(--ka-border-width, 1px) solid var(--ka-line);
	background: linear-gradient(180deg, var(--ka-bg-hero) 0%, var(--ka-bg) 100%);
}

.kamon-form-intro__eyebrow {
	margin: 0 0 0.75rem;
	font-size: var(--ka-text-eyebrow, 0.6875rem);
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--ka-muted);
}

.kamon-form-intro__title {
	margin: 0 0 1rem;
	font-size: clamp(1.5rem, 3.5vw, 2rem);
	font-weight: 500;
	letter-spacing: 0.06em;
	color: var(--ka-ink);
}

.kamon-form-intro__lead {
	margin: 0;
	max-width: var(--ka-prose, 40rem);
	font-size: var(--ka-text-body, 0.9375rem);
	line-height: var(--ka-leading-loose, 2.05);
	color: var(--ka-muted);
}

.kamon-form-intro__tier-hint {
	margin: 1.15rem 0 0;
	max-width: var(--ka-prose, 40rem);
	font-size: var(--ka-text-caption, 0.75rem);
	line-height: var(--ka-leading-relaxed, 1.95);
	color: var(--ka-muted);
	letter-spacing: 0.02em;
}

.kamon-page-form__shell {
	padding-top: clamp(2rem, 6vw, 3.5rem);
	padding-bottom: clamp(3rem, 10vw, 5rem);
}

.kamon-page-form__legal {
	margin-top: clamp(1.5rem, 4vw, 2rem);
	padding-top: clamp(1rem, 3vw, 1.5rem);
	border-top: var(--ka-border-width, 1px) solid var(--ka-line);
	max-width: var(--ka-prose, 40rem);
	margin-left: auto;
	margin-right: auto;
}

.kamon-form-legal-strip {
	margin: 0;
	font-size: var(--ka-text-caption, 0.75rem);
	line-height: var(--ka-leading-relaxed, 1.95);
	color: var(--ka-muted);
	text-align: center;
	letter-spacing: 0.02em;
}

.kamon-form-legal-strip a {
	color: var(--ka-muted);
	text-decoration: underline;
	text-underline-offset: 0.2em;
	text-decoration-thickness: var(--ka-border-width, 1px);
	transition: color 0.2s ease, border-color 0.2s ease;
}

.kamon-form-legal-strip a:hover,
.kamon-form-legal-strip a:focus-visible {
	color: var(--ka-ink);
}

.kamon-page-form {
	position: relative;
	max-width: var(--ka-prose, 40rem);
	margin-left: auto;
	margin-right: auto;
}

.kamon-page-form.is-sending {
	pointer-events: none;
}

.kamon-page-form.is-sending::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(248, 247, 243, 0.72);
	z-index: 2;
}

.kamon-page-form.is-sending::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 2rem;
	height: 2rem;
	margin: -1rem 0 0 -1rem;
	border: 2px solid var(--ka-line-strong);
	border-top-color: var(--ka-ink);
	border-radius: 50%;
	animation: kamon-form-spin 0.75s linear infinite;
	z-index: 3;
}

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

/* プラグイン出力の上書き */
.kamon-page-form .kamon-wrap {
	max-width: none;
	margin: 0;
	padding: 0;
}

.kamon-page-form .kamon-card {
	margin: 0;
	padding: clamp(1.75rem, 5vw, 2.5rem);
	border: var(--ka-border-width, 1px) solid var(--ka-line);
	border-radius: var(--ka-radius-0, 0);
	background: var(--ka-color-surface, #fdfcfa);
	box-shadow: var(--ka-shadow-none, none);
}

.kamon-page-form .kamon-heading {
	font-size: var(--ka-text-md, 1rem);
	font-weight: 500;
	letter-spacing: var(--ka-tracking-wide, 0.12em);
	margin: 0 0 0.5rem;
	color: var(--ka-ink);
}

.kamon-page-form .kamon-lead {
	font-size: var(--ka-text-sm, 0.8125rem);
	line-height: var(--ka-leading-relaxed, 1.95);
	margin: 0 0 2rem;
	color: var(--ka-muted);
}

.kamon-page-form .kamon-field {
	margin-bottom: 1.35rem;
}

.kamon-page-form .kamon-field label {
	font-size: var(--ka-text-sm, 0.8125rem);
	letter-spacing: var(--ka-tracking-label, 0.06em);
	color: var(--ka-ink-soft);
	margin-bottom: 0.45rem;
}

.kamon-page-form .kamon-field input,
.kamon-page-form .kamon-field textarea {
	border-color: var(--ka-line-strong);
	border-radius: var(--ka-radius-sm, 1px);
	padding: 0.75rem 0.85rem;
	font-size: var(--ka-text-md, 1rem);
	line-height: var(--ka-leading-snug, 1.5);
	transition:
		border-color var(--ka-duration, 0.2s) var(--ka-ease, cubic-bezier(0.25, 1, 0.5, 1)),
		box-shadow var(--ka-duration, 0.2s) var(--ka-ease, cubic-bezier(0.25, 1, 0.5, 1));
}

.kamon-page-form .kamon-field input:focus,
.kamon-page-form .kamon-field textarea:focus {
	border-color: var(--ka-color-muted);
	box-shadow: 0 0 0 1px rgba(19, 19, 18, 0.06);
	outline: none;
}

.kamon-page-form .kamon-field textarea {
	min-height: 9rem;
	resize: vertical;
}

.kamon-page-form .kamon-actions {
	margin-top: 1.75rem;
}

.kamon-page-form .kamon-btn {
	min-height: 52px;
	padding-left: 2rem;
	padding-right: 2rem;
	font-size: var(--ka-text-sm, 0.8125rem);
	letter-spacing: var(--ka-tracking-wide, 0.12em);
	border-radius: var(--ka-radius-sm, 1px);
	background: var(--ka-ink);
	color: var(--ka-color-surface);
	border-color: var(--ka-ink);
}

.kamon-page-form .kamon-btn:hover,
.kamon-page-form .kamon-btn:focus-visible {
	background: #1c1c1a;
	border-color: #1c1c1a;
	color: var(--ka-color-surface);
}

.kamon-page-form .kamon-btn:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.kamon-page-form .kamon-help {
	font-size: var(--ka-text-caption, 0.75rem);
	line-height: var(--ka-leading-relaxed, 1.95);
	color: var(--ka-color-note);
	margin-top: 1.25rem;
}

.kamon-page-form .kamon-message {
	margin-top: 1.25rem;
	padding: 0.85rem 1rem;
	font-size: var(--ka-text-sm, 0.8125rem);
	line-height: var(--ka-leading-snug, 1.5);
	border-radius: var(--ka-radius-sm, 1px);
}

.kamon-page-form .kamon-message.is-error {
	background: var(--ka-color-msg-error-bg);
	border: var(--ka-border-width, 1px) solid var(--ka-color-msg-error-border);
	color: var(--ka-color-msg-error-text);
}

.kamon-page-form .kamon-message.is-success {
	background: var(--ka-color-msg-success-bg);
	border: var(--ka-border-width, 1px) solid var(--ka-color-msg-success-border);
	color: var(--ka-color-msg-success-text);
}

@media (prefers-reduced-motion: reduce) {
	.kamon-page-form.is-sending::before {
		animation: none;
		border-top-color: transparent;
		border-color: var(--ka-ink);
		opacity: 0.4;
	}
}