/* ==========================================================================
   SeedsVision — Contacts page
   ========================================================================== */

.contacts-page {
	padding: 8px 0 90px;
}
.contacts-page__title {
	margin: 24px 0 40px;
	font-size: 34px;
	font-weight: 700;
	letter-spacing: -0.01em;
}

.contacts-grid {
	display: grid;
	grid-template-columns: minmax(0, 600px) minmax(0, 1fr);
	gap: 80px;
	align-items: start;
}

/* --------------------------------- Form ---------------------------------- */
.contacts-form__title {
	margin: 0 0 12px;
	font-size: 20px;
	font-weight: 700;
}
.contacts-form__lead {
	margin: 0 0 28px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--color-fg-muted);
}

.contacts-notice {
	margin: 0 0 22px;
	padding: 14px 16px;
	border-radius: var(--radius-sm);
	font-size: 14px;
}
.contacts-notice--ok {
	background: #eaf5ee;
	color: #1c5236;
}
.contacts-notice--err {
	background: #fdecec;
	color: #a12626;
}

.contact-field {
	margin-bottom: 22px;
}
.contact-field__label {
	display: block;
	margin-bottom: 8px;
	font-size: 14px;
	color: #3a3a3a;
}
.contact-field__req {
	color: #e23a3a;
}
.contact-field__input {
	width: 100%;
	height: 50px;
	padding: 0 16px;
	font-family: inherit;
	font-size: 15px;
	color: var(--color-fg);
	background: #fff;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	transition: border-color var(--transition), box-shadow var(--transition);
}
.contact-field__input:focus {
	outline: none;
	border-color: var(--color-yellow);
	box-shadow: 0 0 0 1px var(--color-yellow);
}
.contact-field__input.has-error {
	border-color: #e23a3a;
}
.contact-field__error {
	margin: 6px 0 0;
	font-size: 13px;
	line-height: 1.4;
	color: #e23a3a;
}
/* Scroll anchor for the success / error notice: keep it clear of the sticky
   header when the page jumps to #contact-status after submit. */
.contacts-status-anchor {
	display: block;
	scroll-margin-top: 96px;
}
.contact-field__input[readonly] {
	background: #f6f6f6;
	color: var(--color-fg-muted);
}
.contact-field__textarea {
	height: auto;
	min-height: 118px;
	padding: 14px 16px;
	line-height: 1.6;
	resize: vertical;
}
.contact-field__select {
	appearance: none;
	-webkit-appearance: none;
	cursor: pointer;
	color: var(--color-fg);
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'><path d='M1 1.5L6 6.5L11 1.5' stroke='%23111111' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>");
	background-repeat: no-repeat;
	background-position: right 16px center;
	background-size: 12px 8px;
	padding-right: 40px;
}
/* Grey only the placeholder line, not the whole control — otherwise the open
   dropdown inherits the muted colour and every topic looks disabled (#21). */
.contact-field__select:invalid {
	color: #6b6b6b;
}
.contact-field__select option {
	color: var(--color-fg);
}
.contact-field__select option[value=""] {
	color: #9a9a9a;
}

/* Honeypot — visually removed but not display:none (bots skip those). */
.contact-form__hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Consent */
.contact-consent {
	margin-bottom: 26px;
}
.contact-consent__label {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--color-fg);
	cursor: pointer;
}
.contact-consent__label input[type="checkbox"] {
	flex-shrink: 0;
	width: 18px;
	height: 18px;
	margin-top: 1px;
	accent-color: var(--color-green);
	cursor: pointer;
}
.contact-consent__label a {
	color: var(--color-green);
	text-decoration: underline;
}
.contact-consent.has-error .contact-consent__label {
	color: #a12626;
}

.contact-form__submit {
	min-width: 160px;
}

/* --------------------------------- Info card ----------------------------- */
.contact-card {
	padding: 28px 32px;
	background: #f7f7f7;
	border-radius: 8px;
}
.contact-card__title {
	margin: 0 0 22px;
	font-size: 20px;
	font-weight: 700;
}
.contact-card__list {
	margin: 0;
}
.contact-card__row {
	display: grid;
	grid-template-columns: minmax(150px, auto) 1fr;
	gap: 16px;
	padding: 10px 0;
}
.contact-card__row dt {
	margin: 0;
	color: var(--color-fg-muted);
	font-size: 15px;
}
.contact-card__row dd {
	margin: 0;
	font-weight: 600;
	font-size: 15px;
}
.contact-card__row dd a {
	color: var(--color-green);
	text-decoration: underline;
}

/* --------------------------------- Responsive ---------------------------- */
@media (max-width: 900px) {
	.contacts-grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}
	.contacts-info-col {
		order: -1;
	}
}
@media (max-width: 600px) {
	.contacts-page__title {
		font-size: 26px;
	}
	.contact-card {
		padding: 22px;
	}
	.contact-card__row {
		grid-template-columns: 1fr;
		gap: 4px;
	}
}