/* メルマガの登録フォーム。Geek テーマの色があればそれに合わせる。 */
.geek-nl {
	--nl-accent: var(--g-accent, #4f46e5);
	--nl-surface: var(--g-surface, #fff);
	--nl-line: var(--g-line, #e2e6ef);
	--nl-text: var(--g-text, #1f2636);
	--nl-heading: var(--g-heading, #0a1020);
	--nl-muted: var(--g-muted, #5d6679);
	box-sizing: border-box;
	position: relative;
	margin: 2.4em 0;
	padding: 24px;
	border: 1px solid var(--nl-line);
	border-radius: 18px;
	background: var(--g-grad-soft, rgba(99, 102, 241, .08)), var(--nl-surface);
	color: var(--nl-text);
}
.geek-nl *, .geek-nl *::before, .geek-nl *::after { box-sizing: border-box; }
.geek-nl p { margin: 0; }
.geek-nl__title { font-size: 1.15em; font-weight: 700; color: var(--nl-heading); }
.geek-nl__text { margin-top: 6px !important; font-size: .95em; color: var(--nl-muted); }
.geek-nl-form { margin: 14px 0 0; }
.geek-nl__fields { display: flex; flex-wrap: wrap; gap: 8px; }
.geek-nl__fields input {
	flex: 1 1 200px;
	min-width: 0;
	padding: 10px 14px;
	border: 1px solid var(--nl-line);
	border-radius: 999px;
	background: var(--nl-surface);
	color: var(--nl-text);
	font: inherit;
	font-size: 16px; /* iPhone で拡大されないように */
}
.geek-nl__fields input:focus { outline: 2px solid var(--nl-accent); outline-offset: 1px; }
.geek-nl__fields button {
	flex: 0 0 auto;
	padding: 10px 22px;
	border: 0;
	border-radius: 999px;
	background: var(--g-grad, var(--nl-accent));
	color: #fff;
	font: inherit;
	font-weight: 700;
	cursor: pointer;
}
.geek-nl__fields button:disabled { opacity: .6; cursor: wait; }
.geek-nl__note { margin-top: 10px !important; font-size: .78em; color: var(--nl-muted); }
.geek-nl__note a { color: inherit; }
.geek-nl__msg { margin-top: 10px !important; font-size: .9em; font-weight: 600; }
.geek-nl__msg:empty { display: none; }
.geek-nl__msg.is-error { color: #dc2626; }
.geek-nl__sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.geek-nl__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* 画面の下から出るパネル */
.geek-nl--popup {
	position: fixed;
	right: 16px;
	bottom: 16px;
	z-index: 9990;
	width: min(380px, calc(100vw - 32px));
	margin: 0;
	padding: 20px 20px 16px;
	background: var(--nl-surface);
	box-shadow: 0 24px 60px -20px rgba(15, 23, 42, .45);
	transform: translateY(16px);
	opacity: 0;
	transition: transform .3s cubic-bezier(.2, .8, .2, 1), opacity .3s;
}
.geek-nl--popup.is-open { transform: none; opacity: 1; }
.geek-nl--popup .geek-nl__title { padding-right: 28px; font-size: 1.05em; }
.geek-nl__close {
	position: absolute;
	top: 8px;
	right: 10px;
	width: 32px;
	height: 32px;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--nl-muted);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
}
.geek-nl__close:hover { background: var(--g-surface-2, #f0f2f8); }
@media (max-width: 600px) {
	.geek-nl--popup { right: 8px; bottom: 8px; width: calc(100vw - 16px); }
}
@media (prefers-reduced-motion: reduce) {
	.geek-nl--popup { transition: none; }
}
