/* お問い合わせ・FAQページ */
.option-page .page-header { margin-top: 62px; }

.option-content {
	max-width: 840px;
	margin: 0 auto;
	padding: 32px 16px 80px;
}

.contact-intro {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 28px;
	align-items: center;
	padding: 28px 30px;
	background: linear-gradient(135deg, #fff8fb, #fde8ef);
	border: 1px solid var(--pink-light);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
}

.option-eyebrow {
	display: block;
	margin-bottom: 8px;
	color: var(--pink-deep);
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.18em;
}

.contact-intro h2,
.section-heading h2,
.still-question h2 {
	color: var(--brown);
	font-family: 'Zen Maru Gothic', sans-serif;
	font-size: clamp(1.2rem, 3vw, 1.55rem);
	margin-bottom: 10px;
}

.contact-intro-copy p,
.section-heading p,
.still-question p {
	color: var(--brown-light);
	font-size: 0.84rem;
	line-height: 1.8;
}

.contact-actions { text-align: center; }
.contact-phone {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: var(--pink-deep);
	text-decoration: none;
	font-weight: 700;
}
.contact-phone-icon { font-size: 1.5rem; }
.contact-phone small,
.contact-phone strong { display: block; }
.contact-phone small { font-size: 0.7rem; color: var(--brown-light); }
.contact-phone strong { font-size: 1.22rem; letter-spacing: 0.04em; }
.contact-note { color: var(--brown-light); font-size: 0.68rem; margin-top: 7px; }

.contact-form-section { padding-top: 58px; }
.contact-form {
	max-width: 680px;
	margin: 0 auto;
	padding: 28px 30px;
	background: white;
	border: 1px solid var(--pink-light);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
}
.form-field { margin-bottom: 18px; }
.form-field label {
	display: block;
	margin-bottom: 7px;
	color: var(--brown);
	font-size: 0.82rem;
	font-weight: 700;
}
.form-field label span { color: var(--pink-deep); margin-left: 3px; }
.form-field input,
.form-field textarea {
	display: block;
	width: 100%;
	border: 1px solid #efd4dc;
	border-radius: 10px;
	background: #fffafb;
	color: var(--text);
	font: inherit;
	font-size: 0.85rem;
	padding: 11px 13px;
	outline: none;
	transition: border-color 0.2s, box-shadow 0.2s;
}
.form-field textarea { min-height: 140px; resize: vertical; }
.form-field input:focus,
.form-field textarea:focus {
	border-color: var(--pink-deep);
	box-shadow: 0 0 0 3px rgba(224,122,151,0.14);
}
.form-honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-submit { display: flex; width: 100%; margin-top: 8px; }
.form-submit:disabled { cursor: wait; opacity: 0.65; transform: none; }
.form-status { min-height: 1.6em; margin-top: 12px; color: var(--brown-light); font-size: 0.78rem; line-height: 1.6; text-align: center; }
.form-status.is-success { color: #5d9560; }
.form-status.is-error { color: #c05a7a; }

.faq-section { padding-top: 54px; }
.section-heading { text-align: center; margin-bottom: 24px; }
.faq-list { display: grid; gap: 12px; }
.faq-item {
	overflow: hidden;
	background: white;
	border: 1px solid var(--pink-light);
	border-radius: var(--radius);
	box-shadow: 0 3px 14px rgba(244,167,185,0.12);
}
.faq-item summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-width: 0;
	padding: 17px 20px;
	color: var(--brown);
	cursor: pointer;
	font-size: 0.88rem;
	font-weight: 700;
	list-style: none;
}
.faq-item summary::first-line { overflow-wrap: anywhere; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
	content: '+';
	flex: 0 0 auto;
	color: var(--pink-deep);
	font-size: 1.35rem;
	font-weight: 400;
	line-height: 1;
}
.faq-item[open] summary { border-bottom: 1px solid var(--pink-light); background: var(--pink-pale); }
.faq-item[open] summary::after { content: '−'; }
.faq-answer { padding: 15px 20px 17px; color: var(--text); font-size: 0.82rem; line-height: 1.9; }

.still-question {
	display: flex;
	align-items: center;
	gap: 18px;
	margin-top: 54px;
	padding: 24px 28px;
	background: white;
	border: 2px dashed var(--pink);
	border-radius: var(--radius);
}
.still-question-icon { font-size: 2.2rem; }
.still-question > div { flex: 1; }
.still-question h2 { font-size: 1.05rem; margin-bottom: 4px; }
.still-question p { font-size: 0.78rem; }
.still-question .btn { flex-shrink: 0; padding: 12px 20px; font-size: 0.8rem; }

@media (max-width: 1024px) {
	.option-page .nav-links { display: none; }
	.option-page .hamburger { display: flex; }
	.option-content { padding-top: 24px; padding-bottom: 96px; }
	.contact-intro { grid-template-columns: 1fr; gap: 20px; padding: 24px 20px; }
	.contact-actions { text-align: left; }
	.contact-phone { display: flex; }
	.contact-form-section { padding-top: 46px; }
	.contact-form { padding: 24px 20px; }
	.still-question { align-items: flex-start; flex-wrap: wrap; gap: 12px; padding: 22px 20px; }
	.still-question > div { min-width: calc(100% - 56px); }
	.still-question .btn { width: 100%; }
}

@media (max-width: 640px) {
	.option-content { width: 100%; padding-right: 12px; padding-left: 12px; }
	.option-page .page-header { padding-right: 14px; padding-left: 14px; }
	.option-page .page-header h1 { line-height: 1.45; }
	.contact-intro { padding-right: 16px; padding-left: 16px; }
	.contact-form { padding-right: 16px; padding-left: 16px; }
	.faq-section { padding-top: 42px; }
	.faq-item summary { gap: 10px; padding: 15px 14px; font-size: 0.82rem; line-height: 1.65; overflow-wrap: anywhere; }
	.faq-answer { padding: 13px 14px 15px; font-size: 0.78rem; }
	.contact-form-section { padding-top: 42px; }
}

@media (min-width: 1025px) {
	.option-page .bottom-nav { display: none; }
}
