.pattrix-about-timeline { background: var(--pattrix-color-surface); }
.pattrix-about-timeline-list { --pattrix-timeline-axis: clamp(196px, 28%, 320px); --pattrix-timeline-node-size: 12px; position: relative; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--pattrix-color-border-strong); }
.pattrix-about-timeline-list::before { position: absolute; top: 0; bottom: 0; left: var(--pattrix-timeline-axis); width: 1px; background: var(--pattrix-color-border-strong); content: ""; }
.pattrix-about-timeline-list.pattrix-about-timeline-progress::before { background: var(--pattrix-color-border-strong); }
.pattrix-about-timeline-list li { position: relative; display: grid; grid-template-columns: var(--pattrix-timeline-axis) minmax(0, 1fr); gap: var(--wp--preset--spacing--60); padding: clamp(36px, 4vw, 56px) 0; border-bottom: 1px solid var(--pattrix-color-border); }
.pattrix-about-timeline-list li::before { position: absolute; top: calc(clamp(36px, 4vw, 56px) + 2px); left: calc(var(--pattrix-timeline-axis) - (var(--pattrix-timeline-node-size) / 2)); box-sizing: border-box; width: var(--pattrix-timeline-node-size); height: var(--pattrix-timeline-node-size); background: var(--pattrix-color-surface); border: 1px solid var(--pattrix-color-interaction); border-radius: 50%; box-shadow: 0 0 0 0 color-mix(in srgb, var(--pattrix-color-interaction) 0%, transparent); content: ""; transition: background-color var(--pattrix-duration-base) var(--pattrix-ease-out), box-shadow var(--pattrix-duration-base) var(--pattrix-ease-out), transform var(--pattrix-duration-base) var(--pattrix-ease-out); }
.pattrix-about-timeline-segment { position: absolute; top: calc(clamp(36px, 4vw, 56px) + 12px); left: calc(var(--pattrix-timeline-axis) - 1px); width: 2px; height: 100%; color: var(--pattrix-color-interaction); overflow: visible; pointer-events: none; transition: opacity var(--pattrix-duration-base) var(--pattrix-ease-out); }
.pattrix-about-timeline-segment path { vector-effect: non-scaling-stroke; transition: stroke-dashoffset 420ms var(--pattrix-ease-out); }
.pattrix-about-timeline-list.pattrix-reveal-ready li::before { transform: scale(.82); }
.pattrix-about-timeline-list.pattrix-reveal-ready .pattrix-about-timeline-segment { opacity: 0; }
.pattrix-about-timeline-list.pattrix-reveal-ready li.is-visible::before { background: var(--pattrix-color-interaction); transform: scale(1); }
.pattrix-about-timeline-list.pattrix-reveal-ready li.is-visible .pattrix-about-timeline-segment { opacity: 1; }
.pattrix-about-timeline-list li.is-current::before { box-shadow: 0 0 0 6px color-mix(in srgb, var(--pattrix-color-interaction) 16%, transparent); transform: scale(1.12); }
.pattrix-about-timeline-label { margin: 0; padding-right: var(--wp--preset--spacing--50); color: var(--pattrix-color-text-muted); font-size: var(--wp--preset--font-size--small); font-weight: 600; letter-spacing: .04em; line-height: 1.35; text-transform: uppercase; transition: color var(--pattrix-duration-base) var(--pattrix-ease-out); }
.pattrix-about-timeline-list li.is-current .pattrix-about-timeline-label { color: var(--pattrix-color-interaction); }
.pattrix-about-timeline h3, .pattrix-about-team h3, .pattrix-about-services h3 { margin: 0; color: var(--pattrix-color-text); font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--h4); font-weight: 500; line-height: 1.15; }
.pattrix-about-timeline li p:not(.pattrix-about-timeline-label), .pattrix-about-team p, .pattrix-about-services p { margin: var(--wp--preset--spacing--30) 0 0; color: var(--pattrix-color-text-secondary); line-height: 1.6; }
.pattrix-about-timeline-content { position: relative; min-width: 0; transition: transform var(--pattrix-duration-base) var(--pattrix-ease-out); }
.pattrix-about-timeline-content::before { position: absolute; top: -14px; left: 0; width: 28px; height: 2px; background: var(--pattrix-color-interaction); content: ""; transform: scaleX(0); transform-origin: left; transition: transform var(--pattrix-duration-base) var(--pattrix-ease-out); }
.pattrix-about-timeline-list li.is-current .pattrix-about-timeline-content { transform: translateX(8px); }
.pattrix-about-timeline-list li.is-current .pattrix-about-timeline-content::before { transform: scaleX(1); }
.pattrix-about-timeline-media { max-width: 560px; margin: var(--wp--preset--spacing--40) 0 0; overflow: hidden; background: var(--pattrix-color-surface-strong); }
.pattrix-about-timeline-media img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.pattrix-about-cases { background: var(--pattrix-color-surface); }
.pattrix-about-case-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) repeat(2, minmax(0, 1fr)); gap: var(--wp--preset--spacing--30); }
.pattrix-about-case-grid article { position: relative; min-height: clamp(320px, 34vw, 520px); overflow: hidden; background: var(--pattrix-color-inverse); }
.pattrix-about-case-grid article:nth-child(n + 2) { min-height: clamp(280px, 28vw, 440px); }
.pattrix-about-case-grid img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform var(--pattrix-duration-base) var(--pattrix-ease-standard); }
.pattrix-about-case-overlay { position: absolute; inset: auto 0 0; display: grid; gap: var(--wp--preset--spacing--20); padding: var(--wp--preset--spacing--40); color: var(--pattrix-color-on-inverse); background: linear-gradient(180deg, transparent 0%, rgb(0 0 0 / .76) 100%); }
.pattrix-about-case-overlay p { margin: 0; font-size: var(--wp--preset--font-size--caption); font-weight: 600; letter-spacing: .05em; line-height: 1.3; text-transform: uppercase; }
.pattrix-about-case-overlay h3 { margin: 0; font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--h4); font-weight: 500; line-height: 1.15; }
.pattrix-about-case-overlay span { color: rgb(255 255 255 / .84); line-height: 1.5; }
.pattrix-about-case-grid.pattrix-reveal-ready article { opacity: 0; transform: translateY(12px); transition: opacity var(--pattrix-duration-base) var(--pattrix-ease-standard), transform var(--pattrix-duration-base) var(--pattrix-ease-standard); transition-delay: var(--pattrix-reveal-delay, 0ms); }
.pattrix-about-case-grid.pattrix-reveal-ready article.is-visible { opacity: 1; transform: none; }
.pattrix-about-certificates-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--wp--preset--spacing--30); }
.pattrix-about-certificates figure { margin: 0; border: 1px solid var(--pattrix-color-border); background: var(--pattrix-color-bg); }
.pattrix-about-certificate-media { aspect-ratio: var(--pattrix-media-frame-ratio, 4 / 3); overflow: hidden; background: var(--pattrix-color-surface-strong); border-bottom: 1px solid var(--pattrix-color-border); }
.pattrix-about-certificate-media img { display: block; width: 100%; height: 100%; object-fit: contain; }
.pattrix-about-certificate-trigger { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.pattrix-about-certificate-trigger:focus-visible { outline: 2px solid var(--pattrix-color-focus); outline-offset: -4px; }
.pattrix-about-placeholder { aspect-ratio: 4 / 3; background: var(--pattrix-color-surface-strong); border-bottom: 1px solid var(--pattrix-color-border); }
.pattrix-about-certificates figcaption { display: grid; gap: var(--wp--preset--spacing--20); padding: var(--wp--preset--spacing--40); }
.pattrix-about-certificates figcaption span { color: var(--pattrix-color-text-muted); font-size: var(--wp--preset--font-size--caption); letter-spacing: .04em; text-transform: uppercase; }
.pattrix-about-certificates figcaption strong { color: var(--pattrix-color-text); font-size: var(--wp--preset--font-size--body); font-weight: 600; }
.pattrix-about-certificate-detail { color: var(--pattrix-color-text-muted); font-size: var(--wp--preset--font-size--caption); line-height: 1.4; }
.pattrix-about-certificate-link { color: var(--pattrix-color-text); font-size: var(--wp--preset--font-size--caption); font-weight: 600; text-decoration: underline; text-underline-offset: .2em; }
.pattrix-about-team-grid, .pattrix-about-services-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--pattrix-color-border); border-left: 1px solid var(--pattrix-color-border); }
.pattrix-about-team-grid article, .pattrix-about-services-grid article { padding: var(--wp--preset--spacing--50); border-right: 1px solid var(--pattrix-color-border); border-bottom: 1px solid var(--pattrix-color-border); }
.pattrix-about-team-media { aspect-ratio: 4 / 5; margin: calc(-1 * var(--wp--preset--spacing--50)) calc(-1 * var(--wp--preset--spacing--50)) var(--wp--preset--spacing--50); background: var(--pattrix-color-surface-strong); border-bottom: 1px solid var(--pattrix-color-border); }
.pattrix-about-contact-cta { padding: var(--wp--preset--spacing--90) var(--pattrix-layout-gutter); background: var(--pattrix-color-inverse); color: var(--pattrix-color-on-inverse); }
.pattrix-about-contact-cta > div { width: min(100%, var(--pattrix-layout-content)); margin: 0 auto; }
.pattrix-about-contact-cta h2 { max-width: 720px; margin: 0; font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--section-title); font-weight: 500; line-height: 1.1; }
.pattrix-about-contact-cta p { max-width: 620px; margin: var(--wp--preset--spacing--30) 0 var(--wp--preset--spacing--50); color: var(--pattrix-color-on-inverse); }
.pattrix-contact-location { padding: var(--wp--preset--spacing--90) var(--pattrix-layout-gutter); background: var(--pattrix-color-surface); }
.pattrix-contact-location-inner { display: grid; grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr); gap: var(--wp--preset--spacing--80); align-items: center; width: min(100%, var(--pattrix-layout-wide)); margin: 0 auto; }
.pattrix-contact-location-copy h2 { margin: var(--wp--preset--spacing--20) 0 var(--wp--preset--spacing--40); color: var(--pattrix-color-text); font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--section-title); font-weight: 500; line-height: 1.12; }
.pattrix-contact-location-company { margin: 0 0 var(--wp--preset--spacing--20); color: var(--pattrix-color-text); font-weight: 600; }
.pattrix-contact-location address { max-width: 420px; color: var(--pattrix-color-text-secondary); font-style: normal; line-height: 1.6; }
.pattrix-contact-location-link { display: inline-flex; gap: var(--wp--preset--spacing--20); margin-top: var(--wp--preset--spacing--50); color: var(--pattrix-color-interaction); font-weight: 600; text-decoration: none; transition: color var(--pattrix-duration-fast) var(--pattrix-ease-standard), transform var(--pattrix-duration-fast) var(--pattrix-ease-standard); }
.pattrix-contact-location-link:active { transform: scale(.98); }
.pattrix-contact-location-map { aspect-ratio: 16 / 9; overflow: hidden; background: var(--pattrix-color-surface-strong); }
.pattrix-contact-location-map iframe { display: block; width: 100%; height: 100%; border: 0; }
.pattrix-about-timeline-list.pattrix-reveal-ready li { opacity: 0; transform: translateY(12px); transition: opacity var(--pattrix-duration-base) var(--pattrix-ease-standard), transform var(--pattrix-duration-base) var(--pattrix-ease-standard); transition-delay: var(--pattrix-reveal-delay, 0ms); }
.pattrix-about-timeline-list.pattrix-reveal-ready li.is-visible { opacity: 1; transform: none; }
.pattrix-about-process { background: var(--pattrix-color-bg); }
.pattrix-about-process .pattrix-section-intro { max-width: 720px; }
.pattrix-about-process-gallery { display: flex; gap: 6px; min-height: clamp(360px, 42vw, 580px); overflow: hidden; }
.pattrix-about-process-card { position: relative; isolation: isolate; flex: 1 1 0; min-width: 0; padding: 0; overflow: hidden; color: var(--pattrix-color-on-inverse); background: var(--pattrix-color-inverse); border: 1px solid var(--pattrix-color-border-strong); border-radius: 0; cursor: pointer; transition: flex-grow var(--pattrix-duration-base) var(--pattrix-ease-standard), border-color var(--pattrix-duration-fast) var(--pattrix-ease-standard); }
.pattrix-about-process-card.is-active { flex-grow: 3.8; border-color: var(--pattrix-color-interaction); }
.pattrix-about-process-media, .pattrix-about-process-card picture, .pattrix-about-process-card img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; }
.pattrix-about-process-card img { object-fit: cover; transition: transform var(--pattrix-duration-base) var(--pattrix-ease-standard), filter var(--pattrix-duration-base) var(--pattrix-ease-standard); }
.pattrix-about-process-card::after { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgb(0 0 0 / .06) 16%, rgb(0 0 0 / .82) 100%); content: ""; }
.pattrix-about-process-copy { position: absolute; right: var(--wp--preset--spacing--30); bottom: var(--wp--preset--spacing--30); left: var(--wp--preset--spacing--30); display: grid; gap: var(--wp--preset--spacing--20); text-align: left; }
.pattrix-about-process-title { color: var(--pattrix-color-on-inverse); font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--h4); font-weight: 500; line-height: 1.12; }
.pattrix-about-process-detail { color: rgb(255 255 255 / .84); font-size: var(--wp--preset--font-size--small); line-height: 1.55; opacity: 0; transform: translateY(8px); transition: opacity var(--pattrix-duration-fast) var(--pattrix-ease-standard), transform var(--pattrix-duration-fast) var(--pattrix-ease-standard); }
.pattrix-about-process-card.is-active .pattrix-about-process-detail { opacity: 1; transform: none; }
.pattrix-about-process-card:not(.is-active) .pattrix-about-process-title { writing-mode: vertical-rl; transform: rotate(180deg); }
.pattrix-about-process-card:focus-visible { z-index: 1; outline: 2px solid var(--pattrix-color-interaction); outline-offset: -2px; }
.pattrix-about-process-gallery[data-pattrix-process-input="keyboard"] .pattrix-about-process-card, .pattrix-about-process-gallery[data-pattrix-process-input="keyboard"] .pattrix-about-process-card img, .pattrix-about-process-gallery[data-pattrix-process-input="keyboard"] .pattrix-about-process-detail { transition-duration: 0ms; }
@media (hover: hover) and (pointer: fine) { .pattrix-contact-location-link:hover { color: var(--pattrix-color-text); } .pattrix-about-case-grid article:hover img { transform: scale(1.02); } .pattrix-about-process-card:hover img { transform: scale(1.025); } .pattrix-about-process-card:hover { border-color: var(--pattrix-color-interaction); } }
@media (max-width: 991px) { .pattrix-about-timeline-list { padding-left: 38px; } .pattrix-about-timeline-list::before { left: 6px; } .pattrix-about-timeline-list li { grid-template-columns: 1fr; gap: var(--wp--preset--spacing--30); } .pattrix-about-timeline-list li::before { left: -38px; } .pattrix-about-timeline-segment { left: -33px; } .pattrix-contact-location-inner { grid-template-columns: 1fr; gap: var(--wp--preset--spacing--60); } }
@media (max-width: 767px) { .pattrix-about-certificates-grid { grid-auto-columns: minmax(260px, 82vw); grid-auto-flow: column; grid-template-columns: none; overflow-x: auto; padding-bottom: var(--wp--preset--spacing--20); scroll-snap-type: x mandatory; } .pattrix-about-certificates figure { scroll-snap-align: start; } /* 生产工序是有序信息，不在移动端要求横向滑动才能逐项阅读。 */ .pattrix-about-process-gallery { display: grid; grid-template-columns: 1fr; gap: var(--wp--preset--spacing--20); min-height: 0; overflow: visible; } .pattrix-about-process-card, .pattrix-about-process-card.is-active { min-height: min(110vw, 440px); } .pattrix-about-process-card:not(.is-active) .pattrix-about-process-title { writing-mode: horizontal-tb; transform: none; } .pattrix-about-process-card:not(.is-active) .pattrix-about-process-detail { opacity: 1; transform: none; } .pattrix-about-case-grid, .pattrix-about-team-grid, .pattrix-about-services-grid { grid-template-columns: 1fr; } .pattrix-about-case-grid article, .pattrix-about-case-grid article:nth-child(n + 2) { min-height: min(118vw, 460px); } .pattrix-about-contact-cta, .pattrix-contact-location { padding-top: var(--wp--preset--spacing--70); padding-bottom: var(--wp--preset--spacing--70); } }
@media (prefers-reduced-motion: reduce) { .pattrix-about *, .pattrix-contact-location * { scroll-behavior: auto; transition-duration: .01ms !important; } .pattrix-about-timeline-list.pattrix-reveal-ready li, .pattrix-about-case-grid.pattrix-reveal-ready article { opacity: 1; transform: none; } .pattrix-about-timeline-list.pattrix-reveal-ready li::before { background: var(--pattrix-color-interaction); transform: none; } }

/* Contact v4：Hero 独立，询盘与地点合并为一个工作面板。 */
.pattrix-contact-hero .pattrix-page-hero-banner--contact { min-height: clamp(320px, 31vw, 400px); }
.pattrix-contact-hero .pattrix-page-hero-banner__content { align-items: end; justify-items: stretch; text-align: left; }
.pattrix-contact-hero .pattrix-page-hero-banner__copy { display: flex; flex-direction: column; align-items: flex-start; }
.pattrix-contact-hero .pattrix-page-hero-banner__eyebrow { order: 1; margin-top: 0; }
.pattrix-contact-hero .pattrix-page-hero-banner h1 { order: 2; margin-top: var(--wp--preset--spacing--30); }
.pattrix-contact-hero .pattrix-page-hero-banner__description { order: 3; margin-top: var(--wp--preset--spacing--30); }

.pattrix-contact-form-section { background: var(--pattrix-color-surface); }
.pattrix-contact-workspace { display: grid; grid-template-columns: minmax(0, 58fr) minmax(360px, 42fr); gap: 0; align-items: stretch; overflow: hidden; background: var(--pattrix-color-bg); border: 1px solid var(--pattrix-color-border); }
.pattrix-contact-workspace-main { min-width: 0; padding: clamp(32px, 5vw, 72px); }
.pattrix-contact-overview { display: grid; gap: var(--wp--preset--spacing--60); }
.pattrix-contact-form-panel { min-width: 0; padding-top: var(--wp--preset--spacing--60); border-top: 1px solid var(--pattrix-color-border); }
.pattrix-contact-direct { display: grid; gap: var(--wp--preset--spacing--20); margin-top: var(--wp--preset--spacing--70); padding-top: var(--wp--preset--spacing--50); border-top: 1px solid var(--pattrix-color-border); }
.pattrix-contact-direct-link { display: inline-flex; align-items: center; width: fit-content; gap: var(--wp--preset--spacing--20); color: var(--pattrix-color-text); font-weight: 600; text-decoration: none; }
.pattrix-contact-direct-link:hover { color: var(--pattrix-color-interaction); }
.pattrix-contact-advisors { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--wp--preset--spacing--20); margin-top: var(--wp--preset--spacing--20); }
.pattrix-contact-advisor { position: relative; display: grid; align-content: center; justify-items: start; gap: var(--wp--preset--spacing--20); width: 100%; min-height: 188px; padding: var(--wp--preset--spacing--30); color: var(--pattrix-color-text); background: var(--pattrix-color-bg); border: 1px solid var(--pattrix-color-border-strong); border-radius: var(--pattrix-radius-control); font: inherit; text-align: left; cursor: pointer; transition: background-color var(--pattrix-duration-fast) var(--pattrix-ease-out), border-color var(--pattrix-duration-fast) var(--pattrix-ease-out), transform var(--pattrix-duration-fast) var(--pattrix-ease-out); }
.pattrix-contact-advisor::before { position: absolute; top: 0; left: 0; width: 3px; height: 100%; background: var(--pattrix-color-brand); content: ''; transform: scaleY(0); transform-origin: bottom; transition: transform var(--pattrix-duration-fast) var(--pattrix-ease-out); }
.pattrix-contact-advisor:hover { background: var(--pattrix-color-surface); border-color: var(--pattrix-color-interaction); }
.pattrix-contact-advisor:hover::before, .pattrix-contact-advisor:focus-visible::before { transform: scaleY(1); }
.pattrix-contact-advisor:active { transform: scale(.98); }
.pattrix-contact-advisor:focus-visible { outline: 2px solid var(--pattrix-color-focus, var(--pattrix-color-interaction)); outline-offset: 3px; }
.pattrix-contact-advisor-avatar { display: block; width: 68px; aspect-ratio: 1; overflow: hidden; background: color-mix(in srgb, var(--pattrix-color-bg) 88%, var(--pattrix-color-inverse)); border: 1px solid var(--pattrix-color-border); border-radius: 50%; }
.pattrix-contact-advisor-avatar picture, .pattrix-contact-advisor-avatar img { display: block; width: 100%; height: 100%; }
.pattrix-contact-advisor-avatar img { object-fit: cover; mix-blend-mode: multiply; transform: translateY(-16%) scale(1.38); transform-origin: center; }
.pattrix-contact-advisor-copy { display: grid; gap: 3px; min-width: 0; }
.pattrix-contact-advisor-copy strong { font-size: var(--wp--preset--font-size--small); line-height: 1.2; }
.pattrix-contact-advisor-role { color: var(--pattrix-color-text-muted); font-size: var(--wp--preset--font-size--caption); line-height: 1.4; }
.pattrix-contact-advisor-action { margin-top: 4px; color: var(--pattrix-color-interaction); font-size: var(--wp--preset--font-size--caption); font-weight: 600; letter-spacing: .04em; line-height: 1.4; }
.pattrix-contact-advisor:hover .pattrix-contact-advisor-action { color: var(--pattrix-color-text); }

.pattrix-contact-workspace-map { position: relative; min-height: 680px; background: var(--pattrix-color-surface-strong); }
.pattrix-contact-workspace-map iframe { display: block; width: 100%; height: 100%; min-height: 680px; border: 0; }
.pattrix-contact-workspace-map .pattrix-contact-location-copy { position: absolute; top: var(--wp--preset--spacing--40); left: var(--wp--preset--spacing--40); width: min(320px, calc(100% - var(--wp--preset--spacing--80))); margin: 0; padding: var(--wp--preset--spacing--40); background: var(--pattrix-color-bg); border-left: 3px solid var(--pattrix-color-brand); box-shadow: 0 12px 30px color-mix(in srgb, var(--pattrix-color-inverse) 18%, transparent); }
.pattrix-contact-location-copy h2 { margin: var(--wp--preset--spacing--20) 0 var(--wp--preset--spacing--30); color: var(--pattrix-color-text); font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--h4); font-weight: 500; line-height: 1.15; }
.pattrix-contact-location-company { margin: 0 0 var(--wp--preset--spacing--20); color: var(--pattrix-color-text); font-weight: 600; }
.pattrix-contact-location-copy address { color: var(--pattrix-color-text-secondary); font-style: normal; line-height: 1.6; }
.pattrix-contact-location-link { display: inline-flex; align-items: center; gap: var(--wp--preset--spacing--20); margin-top: var(--wp--preset--spacing--40); color: var(--pattrix-color-interaction); font-weight: 600; text-decoration: none; }
.pattrix-contact-location-link:hover { color: var(--pattrix-color-text); }

.pattrix-contact-advisor-dialog[hidden], .pattrix-contact-success[hidden] { display: none; }
.pattrix-contact-advisor-dialog { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: max(24px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left)); overflow: auto; }
.pattrix-contact-advisor-dialog-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; background: color-mix(in srgb, var(--pattrix-color-inverse) 70%, transparent); border: 0; cursor: default; }
.pattrix-contact-advisor-dialog-panel { position: relative; display: grid; gap: var(--wp--preset--spacing--30); width: min(100%, 460px); max-height: min(720px, calc(100dvh - 48px)); padding: var(--wp--preset--spacing--60); overflow: auto; color: var(--pattrix-color-text); background: var(--pattrix-color-bg); border: 1px solid var(--pattrix-color-border-strong); box-shadow: 0 18px 50px color-mix(in srgb, var(--pattrix-color-inverse) 20%, transparent); }
.pattrix-contact-advisor-dialog-close { display: grid; width: 44px; height: 44px; place-items: center; justify-self: end; padding: 0; color: var(--pattrix-color-text); background: transparent; border: 1px solid var(--pattrix-color-border-strong); border-radius: var(--pattrix-radius-control); cursor: pointer; }
.pattrix-contact-advisor-dialog-close:hover { border-color: var(--pattrix-color-interaction); }
.pattrix-contact-advisor-dialog-close:focus-visible { outline: 2px solid var(--pattrix-color-focus, var(--pattrix-color-interaction)); outline-offset: 3px; }
.pattrix-contact-advisor-dialog-kicker { margin: 0; color: var(--pattrix-color-text-muted); font-size: var(--wp--preset--font-size--caption); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.pattrix-contact-advisor-dialog-panel h2 { margin: 0; font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--h3); font-weight: 500; }
.pattrix-contact-advisor-dialog-panel h2:focus-visible { outline: 2px solid var(--pattrix-color-focus, var(--pattrix-color-interaction)); outline-offset: 4px; }
.pattrix-contact-advisor-dialog-panel img { display: block; width: min(100%, 400px); height: auto; margin: 0 auto; background: var(--pattrix-color-surface); }
.pattrix-contact-success { display: grid; justify-items: center; gap: var(--wp--preset--spacing--30); min-height: 420px; padding: var(--wp--preset--spacing--80) var(--wp--preset--spacing--50); place-content: center; text-align: center; }
.pattrix-contact-success-mark { display: grid; width: 56px; height: 56px; place-items: center; color: var(--pattrix-color-on-inverse); background: var(--pattrix-color-inverse); border-radius: 50%; font-size: 30px; line-height: 1; }
.pattrix-contact-success h2 { margin: 0; color: var(--pattrix-color-text); font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--h3); font-weight: 500; }
.pattrix-contact-success h2:focus-visible { outline: 2px solid var(--pattrix-color-focus, var(--pattrix-color-interaction)); outline-offset: 5px; }
.pattrix-contact-success p { max-width: 38ch; margin: 0; color: var(--pattrix-color-text-secondary); line-height: 1.6; }
.pattrix-contact-success-again { min-height: 44px; padding: 10px 18px; color: var(--pattrix-color-text); background: transparent; border: 1px solid var(--pattrix-color-border-strong); border-radius: var(--pattrix-radius-control); font: inherit; font-weight: 600; cursor: pointer; transition: border-color var(--pattrix-duration-fast) var(--pattrix-ease-out), transform var(--pattrix-duration-fast) var(--pattrix-ease-out); }
.pattrix-contact-success-again:hover { border-color: var(--pattrix-color-interaction); }
.pattrix-contact-success-again:active { transform: scale(.98); }
.pattrix-contact-success-again:focus-visible { outline: 2px solid var(--pattrix-color-focus, var(--pattrix-color-interaction)); outline-offset: 3px; }

@media (max-width: 991px) {
	.pattrix-contact-workspace { grid-template-columns: minmax(0, 1fr); }
	.pattrix-contact-workspace-main { padding: clamp(28px, 6vw, 56px); }
	.pattrix-contact-workspace-map, .pattrix-contact-workspace-map iframe { min-height: 520px; }
}

@media (max-width: 767px) {
	.pattrix-contact-hero .pattrix-page-hero-banner--contact { min-height: clamp(300px, 82vw, 360px); }
	.pattrix-contact-hero .pattrix-page-hero-banner__content { padding: var(--wp--preset--spacing--50) 0; }
	.pattrix-contact-workspace-main { padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30); }
	.pattrix-contact-advisors { grid-template-columns: 1fr; }
	.pattrix-contact-advisor { min-height: 176px; }
	.pattrix-contact-workspace-map, .pattrix-contact-workspace-map iframe { min-height: 420px; }
	.pattrix-contact-workspace-map .pattrix-contact-location-copy { top: var(--wp--preset--spacing--30); left: var(--wp--preset--spacing--30); width: calc(100% - var(--wp--preset--spacing--60)); padding: var(--wp--preset--spacing--30); }
	.pattrix-contact-advisor-dialog-panel { max-height: calc(100dvh - 32px); padding: var(--wp--preset--spacing--40); }
	.pattrix-contact-success { min-height: 340px; padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--30); }
}

@media (prefers-reduced-motion: reduce) {
	.pattrix-contact-advisor, .pattrix-contact-success-again, .pattrix-contact-field-label, .pattrix-contact-field :is(input, textarea), .pattrix-contact-submit { transition-duration: .01ms !important; }
}