/* Contact page composition using the homepage's shared marketing theme. */
.contact-page .section-kicker { font-size: .75rem; line-height: 1.6; }
.contact-hero { padding-block: 2.5rem 5rem; }
.contact-breadcrumbs { display: flex; align-items: center; gap: .65rem; margin-bottom: 3rem; color: var(--muted-foreground); font-size: .75rem; }
.contact-breadcrumbs a { display: inline-flex; align-items: center; min-height: 44px; }
.contact-breadcrumbs a:hover { color: var(--accent-blue); text-decoration: underline; text-underline-offset: 4px; }
.contact-hero__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); align-items: center; gap: 5rem; }
.contact-hero__copy { max-width: 38rem; }
.contact-hero h1 { margin-top: 1.25rem; font-family: var(--font-display); font-size: clamp(2.25rem, 4vw, 3.5rem); font-weight: 600; line-height: 1.25; letter-spacing: -.045em; text-wrap: pretty; }
.contact-hero .marker-accent { --marker-color: #ffe5ab; color: #007cbd; }
.contact-hero__lead { max-width: 35rem; margin-top: 1.75rem; color: var(--muted-foreground); font-size: 1rem; line-height: 1.75; }
.contact-page .contact-demo { gap: .75rem; min-height: 50px; margin-top: 1.75rem; padding-inline: 2rem; border-color: #007cbd; background: #007cbd; color: #fff; font-size: .9rem; }
.contact-page .contact-demo:hover { background: #006ca6; border-color: #006ca6; }
.contact-hero__note { margin-top: .85rem; color: var(--muted-foreground); font-size: .78rem; line-height: 1.6; }
.contact-card { padding: 2.5rem; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); }
.contact-card h2 { margin-top: 1rem; font-family: var(--font-display); font-size: clamp(1.4rem, 2vw, 1.75rem); font-weight: 600; line-height: 1.3; letter-spacing: -.035em; }
.contact-card > p:not(.section-kicker) { margin-top: 1rem; color: var(--muted-foreground); font-size: .95rem; line-height: 1.75; }
.contact-card__email { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem; min-height: 48px; margin-top: 1.5rem; padding-block: .5rem; color: #007cbd; font-size: clamp(1.05rem, 1.8vw, 1.3rem); font-weight: 800; }
.contact-card__email:hover > span:first-child { text-decoration: underline; text-underline-offset: 4px; }
.contact-card small { display: block; margin-top: 1.25rem; padding-top: 1.25rem; border-top: 1px solid var(--border); color: var(--muted-foreground); font-size: .75rem; line-height: 1.7; }
.contact-focus { padding-block: 4rem; border-top: 1px solid var(--border); background: var(--surface); }
.contact-focus__heading h2 { margin: .8rem 0 1rem; font-family: var(--font-display); font-size: clamp(1.6rem, 2.6vw, 2.25rem); font-weight: 600; line-height: 1.3; letter-spacing: -.035em; }
.contact-focus__heading > p:last-child { color: var(--muted-foreground); font-size: 1rem; line-height: 1.7; }
.contact-focus__items { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3rem; margin-top: 2.5rem; }
.contact-focus__items article::before { content: ''; display: block; width: 2.75rem; height: 3px; margin-bottom: 1.25rem; border-radius: 2px; background: var(--domain-accent); }
.contact-focus__items h3 { font-size: 1rem; font-weight: 800; }
.contact-focus__items p { margin-top: .75rem; color: var(--muted-foreground); font-size: .95rem; line-height: 1.75; }

@media (max-width: 980px) {
  .contact-hero__grid { gap: 2.5rem; }
  .contact-card { padding: 1.75rem; }
  .contact-focus__items { gap: 1.75rem; }
}
@media (max-width: 760px) {
  .contact-hero { padding-block: 1.25rem 3rem; }
  .contact-breadcrumbs { margin-bottom: 1.5rem; }
  .contact-hero__grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .contact-hero__copy { max-width: 36rem; }
  .contact-hero h1 { max-width: 32rem; font-size: clamp(2rem, 7.5vw, 2.75rem); }
  .contact-card { max-width: 36rem; }
  .contact-focus { padding-block: 3rem; }
  .contact-focus__items { grid-template-columns: 1fr; gap: 2rem; margin-top: 2rem; }
  .contact-focus__items article::before { margin-bottom: 1rem; }
}
@media (max-width: 380px) {
  .contact-card { padding: 1.5rem; }
}