/* İletişim sayfası (Framer /iletisim): Randevu bilgileri + form + harita + yol tarifi. Token-only.
   Breakpoints mirror custom.breakpoint (sm 810px). Sayfa başlığı (H1) yalnızca ekran okuyucuya görünür. */
.contact-page__title {
	position: absolute;
	inline-size: var(--wp--custom--border--width--hairline);
	block-size: var(--wp--custom--border--width--hairline);
	margin: calc(var(--wp--custom--border--width--hairline) * -1);
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.contact-page {
	padding: calc(var(--wp--preset--spacing--90) * 2) var(--wp--preset--spacing--60);
	overflow: clip;
}
.contact-page > * {
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
}
.contact-page__layout {
	align-items: flex-start;
	margin-block: 0;
}
.contact-page__layout > .wp-block-column {
	min-inline-size: 0;
}
.contact-page :where(h2) {
	margin: 0;
	font-weight: var(--wp--custom--font-weight--medium);
	color: var(--wp--preset--color--navy);
}
/* Staging contact heading role (contact-title: 24 / 28 / clamp up to 36). It must beat the stored "heading-2" preset class and the stored inline tracking, so each !important only matches while that stored default is still on the block: once the editor picks another size / spacing, the editor's choice applies. */
.contact-page h2.wp-block-heading.has-heading-2-font-size {
	font-size: var(--wp--preset--font-size--contact-title) !important;
}
.contact-page h2.wp-block-heading[style*="letter-spacing:var(--wp--custom--letter-spacing--display)"] {
	letter-spacing: var(--wp--custom--letter-spacing--article-heading) !important;
}

/* Randevu satırları: yuvarlak ikon + metin (ikon ::before daire, ::after maske) */
.contact-info {
	display: flex;
	flex-direction: column;
	gap: 0;
}
.contact-info > h2 {
	margin-block-end: var(--wp--preset--spacing--40);
}
.contact-info .contact-row {
	position: relative;
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--40);
	margin: 0;
	padding-block: calc(var(--wp--preset--spacing--30) + var(--wp--preset--spacing--10) / 2);
	line-height: var(--wp--custom--line-height--small);
}
/* Stored size class is "body-small"; !important only while it is unchanged, so the editor's size choice wins. */
.contact-info .contact-row.has-body-small-font-size {
	font-size: var(--wp--preset--font-size--reading) !important;
}
.contact-row::before {
	content: "";
	flex: none;
	inline-size: var(--wp--custom--size--contact-icon);
	block-size: var(--wp--custom--size--contact-icon);
	border-radius: var(--wp--custom--radius--full);
	background-color: var(--wp--custom--color-alpha--teal-12);
}
.contact-row::after {
	content: "";
	position: absolute;
	inset-inline-start: calc((var(--wp--custom--size--contact-icon) - var(--wp--custom--size--icon-lg)) / 2);
	inset-block-start: 50%;
	translate: 0 -50%;
	inline-size: var(--wp--custom--size--icon-lg);
	block-size: var(--wp--custom--size--icon-lg);
	background-color: var(--wp--preset--color--teal);
	-webkit-mask: center / contain no-repeat;
	mask: center / contain no-repeat;
}
.contact-row--phone::after { -webkit-mask-image: url(../../icons/phone.svg); mask-image: url(../../icons/phone.svg); }
.contact-row--mail::after { -webkit-mask-image: url(../../icons/mail.svg); mask-image: url(../../icons/mail.svg); }
.contact-row--map-pin::after { -webkit-mask-image: url(../../icons/map-pin.svg); mask-image: url(../../icons/map-pin.svg); }
.contact-row a {
	color: inherit;
	text-decoration: none;
}
.contact-row a:hover {
	color: var(--wp--preset--color--teal);
}

/* Form kartı */
.contact-form-card {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--40);
}
.contact-form-card > * {
	margin-block: 0;
}

/* Yol tarifi */
.contact-directions {
	margin-block: 0;
	line-height: var(--wp--custom--line-height--pub);
}
.contact-page > .sakyuz-map {
	inline-size: 100%;
}
.contact-page > .contact-directions {
	margin-block-start: var(--wp--preset--spacing--60);
}

@media (max-width: 809.98px) {
	.contact-page {
		padding-block: var(--wp--preset--spacing--90);
	}
}