.mt-contact-page { --mt-contact-edge: max(var(--mt-gutter),calc((100% - var(--wp--style--global--wide-size,1312px))/2)); color: var(--mt-text); background: var(--mt-bg); }
.mt-contact-hero { display: flex; box-sizing: border-box; height: 193px; flex-direction: column; gap: 12px; padding: 48px var(--mt-contact-edge) 32px; }
.mt-contact-hero > div { display: flex; flex-direction: column; gap: 16px; }
.mt-contact-hero p { margin: 0; }
.mt-contact-hero > div > p { width: max-content; color: var(--mt-link); font-size: 10px; font-weight: 600; line-height: 13px; letter-spacing: 1.2px; }
.mt-contact-hero h1 { margin: 0; font-family: var(--wp--preset--font-family--display); font-size: 48px; font-weight: 600; line-height: 1.02; letter-spacing: -1.5px; }
.mt-contact-hero > p { color: var(--mt-muted); font-size: 15px; line-height: 1.5; }
.mt-contact-layout { display: grid; box-sizing: border-box; height: 676px; grid-template-columns: minmax(0,1fr) 390px; gap: 28px; padding: 0 var(--mt-contact-edge) 64px; }
.mt-contact-form { position: relative; display: flex; box-sizing: border-box; height: 612px; flex-direction: column; gap: 16px; padding: 23px; color: var(--mt-text); background: var(--mt-surface); border: 1px solid var(--mt-border); border-radius: 12px; }
.mt-contact-honeypot { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.mt-contact-form-eyebrow { width: max-content; margin: 0; color: var(--mt-link); font-family: var(--wp--preset--font-family--mono); font-size: 10px; font-weight: 600; line-height: 13px; letter-spacing: 1.2px; }
.mt-contact-form h2 { width: max-content; margin: 0; font-family: var(--wp--preset--font-family--ui); font-size: 24px; font-weight: 600; line-height: 31px; }
.mt-contact-form-intro { margin: 0; color: var(--mt-muted); font-size: 14px; line-height: 21px; }
.mt-contact-notice { position: absolute; z-index: 2; right: 24px; top: 24px; max-width: 390px; padding: 9px 12px; color: var(--mt-text); background: var(--mt-surface-raised); border: 1px solid var(--mt-border); border-radius: 8px; font-size: 12px; line-height: 16px; }
.mt-contact-notice.is-success { color: var(--mt-success-text); background: var(--mt-success-bg); border-color: var(--mt-notice-success-border); }
.mt-contact-notice.is-error { color: var(--mt-error-text); background: var(--mt-error-bg); border-color: var(--mt-error-border); }
.mt-contact-fields { display: flex; height: 387px; flex-direction: column; gap: 16px; }
.mt-contact-row { display: grid; height: 60px; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.mt-contact-row:nth-child(2) { height: 63px; }
.mt-contact-field { position: relative; display: flex; box-sizing: border-box; min-width: 0; flex-direction: column; gap: 5px; padding: 11px 13px; background: var(--mt-surface-raised); border: 1px solid var(--mt-border); border-radius: 8px; transition: border-color var(--mt-transition-fast) ease,box-shadow var(--mt-transition-fast) ease,background-color var(--mt-transition-fast) ease; }
.mt-contact-field > span { color: var(--mt-text-subtle); font-size: 10px; font-weight: 400; line-height: 13px; letter-spacing: .5px; }
.mt-contact-field :is(input,select,textarea) { width: 100%; min-width: 0; margin: 0; padding: 0; color: var(--mt-text); background: transparent; border: 0; border-radius: 0; outline: 0; font: inherit; font-size: 14px; line-height: 18px; }
.mt-contact-field :is(input,textarea)::placeholder { color: var(--mt-text); opacity: 1; }
.mt-contact-select { gap: 8px; }
.mt-contact-select select { color: var(--mt-muted); appearance: none; }
.mt-contact-select > svg { position: absolute; right: 13px; bottom: 10px; width: 18px; height: 18px; fill: var(--mt-text-subtle); pointer-events: none; }
.mt-contact-message { height: 154px; gap: 10px; padding: 12px 13px; }
.mt-contact-message textarea { height: 108px; resize: none; line-height: 1.45; }
.mt-contact-message textarea::placeholder { color: var(--mt-muted); }
.mt-contact-file { position: relative; display: flex; box-sizing: border-box; height: 62px; align-items: center; gap: 12px; padding: 13px 15px; border: 1px solid var(--mt-border); border-radius: 8px; cursor: pointer; transition: border-color var(--mt-transition-fast) ease,background-color var(--mt-transition-fast) ease; }
.mt-contact-file input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.mt-contact-file > svg { width: 20px; height: 20px; flex: 0 0 20px; fill: var(--mt-accent); }
.mt-contact-file > span { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 3px; }
.mt-contact-file strong { width: max-content; max-width: 100%; overflow: hidden; font-size: 13px; font-weight: 600; line-height: 17px; text-overflow: ellipsis; white-space: nowrap; }
.mt-contact-file small { width: max-content; max-width: 100%; color: var(--mt-text-subtle); font-size: 11px; line-height: 14px; }
.mt-contact-file b { width: 66px; flex: 0 0 66px; color: var(--mt-link); font-size: 12px; font-weight: 600; line-height: 16px; text-align: right; }
.mt-contact-actions { display: flex; height: 48px; align-items: center; justify-content: space-between; gap: 24px; }
.mt-contact-actions p { min-width: 0; flex: 1; margin: 0; color: var(--mt-text-subtle); font-size: 12px; line-height: 18px; }
.mt-contact-actions button { display: inline-flex; width: 152px; height: 48px; flex: 0 0 auto; align-items: center; justify-content: center; gap: 10px; padding: 0 20px; color: var(--mt-accent-ink); background: var(--mt-accent); border: 0; border-radius: 8px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; }
.mt-contact-actions button svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.mt-contact-routes { display: flex; width: 390px; height: 293px; align-self: start; flex-direction: column; gap: 12px; }
.mt-contact-routes > h2 { margin: 0; font-family: var(--wp--preset--font-family--ui); font-size: 20px; font-weight: 600; line-height: 26px; }
.mt-contact-route { display: flex; box-sizing: border-box; width: 100%; height: 77px; align-items: center; gap: 12px; padding: 15px; color: var(--mt-text); background: var(--mt-bg); border: 1px solid var(--mt-border); border-radius: 8px; cursor: pointer; font-family: var(--wp--preset--font-family--ui); text-align: left; transition: border-color var(--mt-transition-fast) ease,background-color var(--mt-transition-fast) ease; }
.mt-contact-route > span { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 7px; }
.mt-contact-route strong { width: max-content; max-width: 100%; font: inherit; font-size: 15px; font-weight: 600; line-height: 19px; }
.mt-contact-route small { color: var(--mt-muted); font-size: 13px; line-height: 19px; }
.mt-contact-route svg { width: 18px; height: 18px; flex: 0 0 18px; fill: none; stroke: var(--mt-muted); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.mt-contact-route[aria-pressed="true"] { border-color: var(--mt-selection-border); background: color-mix(in srgb,var(--mt-accent) 7%,var(--mt-bg)); }
.mt-contact-page button:focus-visible { outline: 2px solid var(--mt-focus); outline-offset: 3px; }
.mt-contact-field :is(input,select,textarea):focus-visible { outline: 0; }
.mt-contact-field:focus-within { border-color: var(--mt-interaction-strong, rgba(174,241,114,.72)); background: var(--mt-field-focus, #292c25); box-shadow: 0 0 0 2px var(--mt-interaction-soft, rgba(174,241,114,.07)); }
.mt-contact-file:has(input:focus-visible) { border-color: var(--mt-interaction-strong, rgba(174,241,114,.72)); box-shadow: 0 0 0 2px var(--mt-interaction-soft, rgba(174,241,114,.07)); }
@media (hover:hover) and (pointer:fine) {
	.mt-contact-field:hover { border-color: var(--mt-interaction-border, rgba(174,241,114,.34)); background: var(--mt-field-hover, #282a24); }
	.mt-contact-field:focus-within:hover { border-color: var(--mt-interaction-strong, rgba(174,241,114,.72)); background: var(--mt-field-focus, #292c25); }
	.mt-contact-route:hover,.mt-contact-file:hover { border-color: color-mix(in srgb,var(--mt-accent) 48%,var(--mt-border)); background-color: color-mix(in srgb,var(--mt-accent) 4%,var(--mt-bg)); }
	.mt-contact-actions button:hover { background: color-mix(in srgb,var(--mt-accent) 88%,white); }
}
@media (max-width:980px) {
	.mt-contact-layout { height: auto; grid-template-columns: minmax(0,1fr); }
	.mt-contact-form { min-width: 0; height: auto; }
	.mt-contact-routes { width: 100%; min-width: 0; height: auto; padding-bottom: 64px; }
}
@media (max-width:700px) {
	.mt-contact-hero { height: auto; padding: 36px 20px 28px; }
	.mt-contact-hero h1 { font-size: 40px; }
	.mt-contact-layout { gap: 32px; padding: 0 20px; }
	.mt-contact-form { gap: 16px; padding: 20px; }
	.mt-contact-row { height: auto!important; grid-template-columns: 1fr; }
	.mt-contact-field { min-height: 60px; }
	.mt-contact-fields { height: auto; }
	.mt-contact-message { height: 154px; }
	.mt-contact-file { height: auto; min-height: 70px; }
	.mt-contact-file small { white-space: normal; }
	.mt-contact-actions { height: auto; align-items: stretch; flex-direction: column; }
	.mt-contact-actions button { width: 100%; }
	.mt-contact-routes { padding-bottom: 48px; }
	.mt-contact-notice { position: static; max-width: none; }
}
@media (prefers-reduced-motion:reduce) { .mt-contact-field,.mt-contact-file,.mt-contact-route,.mt-contact-actions button { transition-duration:.01ms!important; } }
