/* =============================================================
   Peak Body Coach · contact.css
   Contact page styles. Depends on main.css.
   ============================================================= */

/* Hero photo overrides */
.hero-img {
	object-position: 50% 35%;
	filter: brightness(0.85) saturate(0.9);
}
.hero-content .type-h1 { font-size: clamp(56px, 7vw, 120px); }


/* =============================================================
   TWO PATHS — discovery call + enquiry form
   ============================================================= */
.paths-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-11);
	align-items: start;
}
@media (min-width: 900px) {
	.paths-grid { grid-template-columns: 1fr 1fr; gap: var(--space-10); }
}
.path {
	border-top: var(--mark-rule-top) solid rgba(23, 23, 23, 0.2);
	padding-top: var(--space-7);
}
.path .type-mono-label { color: var(--color-red); }
.path .type-h2         { margin-top: var(--rhythm-eyebrow-h1); margin-bottom: var(--space-6); }
.path .type-body       { opacity: 0.82; max-width: 520px; }
.path .type-body + .type-body { margin-top: var(--rhythm-paragraph); }


/* =============================================================
   CALENDAR EMBED
   ============================================================= */
.cal-embed {
	margin-top: var(--space-9);
	min-height: 720px;
}
.cal-embed iframe {
	width: 100%;
	border: none;
	display: block;
}


/* =============================================================
   ENQUIRY FORM — underline inputs, mono labels
   ============================================================= */
.enq-form {
	margin-top: var(--space-9);
	display: flex;
	flex-direction: column;
	gap: var(--space-7);
}
.enq-form .field {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
}
.enq-form .field label {
	color: rgba(23, 23, 23, 0.7);
}
.enq-form .field input {
	font-family: var(--font-body);
	font-weight: var(--weight-regular);
	font-size: 18px;
	line-height: 1.4;
	padding: var(--space-3) 0;
	border: none;
	border-bottom: 1px solid rgba(23, 23, 23, 0.3);
	background: transparent;
	color: var(--color-ink);
	border-radius: 0;
	outline: none;
	transition: border-color 0.15s, border-width 0.15s;
	-webkit-appearance: none;
	width: 100%;
}
.enq-form .field input:focus {
	border-bottom: 2px solid var(--color-red);
	padding-bottom: calc(var(--space-3) - 1px);
}
.enq-form .field input::placeholder { color: rgba(23, 23, 23, 0.35); }
.enq-form .btn   { margin-top: var(--space-4); align-self: flex-start; }
.enq-success {
	margin-top: var(--space-9);
	padding-top: var(--space-6);
	border-top: var(--mark-rule-top) solid var(--color-ink);
}
.enq-feedback {
	font-family: var(--font-mono);
	font-size: 11px;
	font-weight: var(--weight-medium);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	margin-bottom: var(--space-2);
}
.enq-feedback--error { color: var(--color-red); }
.enq-feedback--error a { color: var(--color-red); text-decoration: underline; text-underline-offset: 3px; }
.enq-note {
	margin-top: var(--space-5);
	font-family: var(--font-body);
	font-size: 14px;
	color: rgba(23, 23, 23, 0.5);
	line-height: 1.6;
}


/* =============================================================
   DIRECT CONTACT — 2x2 on slate
   ============================================================= */
.contact-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-9);
}
@media (min-width: 768px) {
	.contact-grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-10); }
}
.contact-item .type-mono-label {
	color: var(--color-teal);
	margin-bottom: var(--space-5);
}
.contact-item p,
.contact-item address {
	font-family: var(--font-body);
	font-style: normal;
	font-weight: var(--weight-regular);
	font-size: clamp(18px, 1.4vw, 22px);
	line-height: 1.55;
	color: rgba(236, 230, 215, 0.85);
}
.contact-item a {
	color: rgba(236, 230, 215, 0.85);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	transition: text-decoration-thickness 0.15s;
}
.contact-item a:hover {
	text-decoration-thickness: 2px;
	color: var(--color-cream);
}