.contact-page { margin: 0 auto; max-width: 1440px; padding: clamp(9rem, 14vw, 13rem) 3.5vw clamp(6rem, 10vw, 10rem); }
.contact-page-intro { margin: 0 auto; max-width: 64rem; text-align: center; }
.contact-page-intro h1 { font-family: var(--serif); font-size: clamp(2.6rem, 3.5vw, 4rem); font-weight: 400; letter-spacing: -.05em; line-height: 1.1; margin: 0 auto; max-width: 16ch; text-wrap: balance; }
.contact-page-intro p { color: var(--muted); font-size: clamp(1.1rem, 1rem + .35vw, 1.35rem); letter-spacing: -.028em; line-height: 1.38; margin: 1.75rem auto 0; max-width: 54ch; text-wrap: pretty; }
.contact-form-section { margin: clamp(5rem, 10vw, 9rem) auto 0; max-width: 58rem; }
.contact-form-section { scroll-margin-top: 7rem; }
.contact-form { background: var(--soft); border-radius: var(--radius-card, 1rem); display: grid; gap: 1.4rem; padding: clamp(1.75rem, 4vw, 4rem); }
.contact-form label { color: var(--muted); display: grid; font-size: .9rem; gap: .6rem; letter-spacing: -.015em; }
.contact-form input:not([type="checkbox"]), .contact-form textarea { background: var(--paper); border: 1px solid oklch(85% 0 0); border-radius: var(--radius-control, .625rem); color: var(--ink); font: inherit; font-size: 1rem; min-height: 3.25rem; padding: .85rem 1rem; transition: border-color 180ms var(--ease-out), box-shadow 180ms var(--ease-out); width: 100%; }
.contact-form textarea { min-height: 9rem; resize: vertical; }
.contact-form input:not([type="checkbox"]):focus-visible, .contact-form textarea:focus-visible { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent); outline: 0; }
.contact-form input:not([type="checkbox"]):user-invalid, .contact-form textarea:user-invalid { border-color: #a53f32; }
.contact-form .button { border: 0; cursor: pointer; justify-self: start; margin-top: .4rem; }
.contact-form .button:disabled { cursor: wait; opacity: .66; }
.form-note { color: var(--muted); font-size: .8rem; line-height: 1.35; margin: 0; }
.form-status { font-size: .92rem; line-height: 1.45; margin: -.35rem 0 0; min-height: 1.35em; }
.form-status:empty { display: none; }
.form-status[data-state="pending"] { color: var(--muted); }
.form-status[data-state="success"] { color: var(--accent); }
.form-status[data-state="error"] { color: #8f3328; }
.form-honeypot { height: 1px; left: -10000px; overflow: hidden; position: absolute; top: auto; width: 1px; }
.privacy-consent { align-items: flex-start; display: grid !important; gap: .8rem !important; grid-template-columns: 1.15rem minmax(0, 1fr); margin-top: .2rem; }
.privacy-consent input { accent-color: var(--accent); height: 1.25rem; margin: .12rem 0 0; width: 1.25rem; }
.privacy-consent span { color: var(--muted); font-size: .88rem; letter-spacing: -.015em; line-height: 1.45; }
.privacy-consent a { color: var(--ink); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }
.privacy-consent a:hover { text-decoration-thickness: 2px; }
.footer-links { align-items: flex-end; display: flex; flex-direction: column; gap: .35rem; }
.service-interest { border: 0; margin: 0 0 .4rem; padding: 0; }
.service-interest legend { color: var(--ink); font-size: 1rem; font-weight: 500; letter-spacing: -.025em; margin-bottom: 1rem; }
.service-interest > div { display: flex; flex-wrap: wrap; gap: .55rem; }
.service-interest label { cursor: pointer; display: block; position: relative; }
.service-interest input { height: 1px; opacity: 0; position: absolute; width: 1px; }
.service-interest span { align-items: center; background: var(--paper); border: 1px solid oklch(84% 0 0); border-radius: var(--radius-pill, 999px); color: var(--ink); display: flex; font-size: .9rem; line-height: 1; min-height: var(--tap-target, 2.75rem); padding: .7rem .9rem; transition: background 180ms var(--ease-out), border-color 180ms var(--ease-out), color 180ms var(--ease-out), transform 140ms var(--ease-out); }
.service-interest label:active span { transform: scale(.96); }
.service-interest input:checked + span { background: var(--accent); border-color: var(--accent); color: var(--paper); }
.service-interest input:focus-visible + span { outline: 2px solid var(--ink); outline-offset: 3px; }
.contact-cards { display: grid; gap: clamp(.75rem, 1.5vw, 1.5rem); grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: clamp(3rem, 6vw, 5rem); }
.contact-cards article { align-items: flex-start; background: var(--soft); border-radius: var(--radius-card, 1rem); display: flex; flex-direction: column; min-height: 14rem; padding: clamp(1.75rem, 3.5vw, 3rem); }
.contact-cards h2 { font-family: var(--serif); font-size: clamp(1.75rem, 2.3vw, 2.5rem); font-weight: 400; letter-spacing: -.05em; line-height: 1; margin: 0 0 1.25rem; }
.contact-cards a, .contact-cards address { color: var(--ink); font-size: clamp(1rem, 1rem + .15vw, 1.15rem); font-style: normal; letter-spacing: -.025em; line-height: 1.45; }
.contact-cards button, .contact-cards .maps-link { background: transparent; border: 0; color: var(--accent); cursor: pointer; font: inherit; font-size: .9rem; font-weight: 500; letter-spacing: -.02em; margin-top: auto; padding: .75rem 0 0; transition: color 180ms var(--ease-out), transform 140ms var(--ease-out); }
.contact-cards button:active, .contact-cards .maps-link:active { transform: scale(.96); }
.contact-cards button:hover, .contact-cards .maps-link:hover { color: var(--ink); }
@media (max-width: 760px) {
  .contact-page { padding-left: 22px; padding-right: 22px; }
  .contact-page-intro h1 { font-size: clamp(2.55rem, 10vw, 3.5rem); }
  .contact-cards { grid-template-columns: 1fr; }
  .contact-cards article { min-height: 12rem; }
  .contact-form .button { width: 100%; }
  .footer-links { align-items: flex-start; }
}
@media (min-width: 761px) and (max-width: 960px) {
  .contact-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contact-cards article:last-child { grid-column: 1 / -1; }
}

/* Unified spacing and heading tracking */
.contact-page { padding-bottom: var(--space-page-bottom); padding-top: var(--space-page-top); }
.contact-page-intro h1 { letter-spacing: var(--tracking-heading); }
.contact-page-intro p { margin-top: var(--space-heading-copy); }
.contact-cards { margin-top: var(--space-heading-content); }
.contact-cards h2 { letter-spacing: var(--tracking-card-heading); margin-bottom: var(--space-heading-copy); }
.contact-form-section { margin-top: var(--space-section-compact); }