.mx-service-page { --mx-service-main: var(--e-global-color-primary,#1d3573); --mx-service-text: #19253b; --mx-service-muted: #59677a; --mx-service-surface: #fff; --mx-service-soft: #f5f7fb; --mx-service-border: #dce3ed; max-width: 1200px; margin: 0 auto; padding: clamp(24px,5vw,72px) 24px; color: var(--mx-service-text); background: var(--mx-service-surface); font-family: var(--e-global-typography-text-font-family,inherit); line-height: 1.75; overflow-wrap: anywhere; }
.mx-service-page * { box-sizing: border-box; }
.mechanicx-service-public .entry-title,.mechanicx-service-public .wp-block-post-title { display: none; }
.mx-service-page h1,.mx-service-page h2,.mx-service-page h3 { color: var(--mx-service-text); font-family: var(--e-global-typography-primary-font-family,inherit); line-height: 1.2; margin: 0 0 20px; font-weight: 600; }
.mx-service-page h1 { font-size: clamp(32px,4vw,56px); letter-spacing: -.035em; }.mx-service-page h2 { font-size: clamp(25px,3vw,36px); letter-spacing: -.02em; }.mx-service-page h3 { font-size: 18px; margin-bottom: 8px; }
.mx-service-page p { margin: 0 0 18px; }.mx-service-page p:last-child { margin-bottom: 0; }
.mx-service-hero { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: clamp(24px,5vw,64px); margin-bottom: clamp(40px,7vw,88px); }.mx-service-hero-text { grid-template-columns: 1fr; max-width: 800px; }
.mx-service-introduction { font-size: 18px; color: var(--mx-service-muted); }
.mx-service-page .mx-service-hero-image,.mx-service-page .mx-service-section-image { display: block; width: 100%; height: auto; max-height: 560px; object-fit: cover; border-radius: 12px; }
.mx-service-section { margin-top: clamp(32px,6vw,72px); }.mx-service-section:has(> .mx-service-section-image) { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px,5vw,64px); align-items: center; }
.mx-service-checklist { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 32px; list-style: none; padding: 0; margin: 24px 0 0; }.mx-service-checklist li { padding: 20px 20px 20px 44px; position: relative; background: var(--mx-service-soft); border-radius: 6px; }.mx-service-checklist li:before { content: '\2713'; position: absolute; left: 18px; top: 16px; font-size: 20px; color: var(--mx-service-main); }
.mx-service-steps { counter-reset: mx-step; list-style: none; padding: 0; margin: 24px 0 0; }.mx-service-steps li { padding: 0 0 24px 56px; position: relative; }.mx-service-steps li:before { counter-increment: mx-step; content: counter(mx-step,decimal-leading-zero); position: absolute; left: 0; top: 0; font-size: 22px; font-weight: 600; color: var(--mx-service-main); }
.mx-service-faq details { border-top: 1px solid var(--mx-service-border); padding: 20px 0; }.mx-service-faq details:last-child { border-bottom: 1px solid var(--mx-service-border); }.mx-service-faq summary { font-weight: 500; cursor: pointer; font-size: 18px; }.mx-service-faq details > div { color: var(--mx-service-muted); padding-top: 16px; }
.mx-service-booking { padding: clamp(24px,5vw,56px); border-radius: 12px; background: var(--mx-service-soft); text-align: center; }.mx-service-booking .mx-service-section-copy { max-width: 760px; margin: auto; }
.mx-service-page .mx-service-booking-button { display: inline-flex; align-items: center; justify-content: center; height: 40px; padding: 0 20px; margin-top: 24px; border-radius: 4px; border: 1px solid var(--mx-service-main); background: var(--mx-service-main); color: #fff; font-size: 12px; font-weight: 500; text-decoration: none; }.mx-service-booking-button:hover { opacity: .88; }
.mx-service-page :focus-visible { outline: 2px solid var(--mx-service-main); outline-offset: 5px; }
.mx-service-booking-embed{max-width:100%;overflow-wrap:anywhere}.mx-service-booking-embed iframe{display:block;max-width:100%;width:100%;border:0;margin:0 auto}.mx-service-booking-embed img{max-width:100%;height:auto}
[data-theme-version="dark"] .mx-service-page,[data-theme="dark"] .mx-service-page { --mx-service-main: #abc3ff; --mx-service-text: #f1f5fb; --mx-service-muted: #bfcbdd; --mx-service-surface: #111a2b; --mx-service-soft: #1c293d; --mx-service-border: #41516b; }
[data-theme-version="dark"] .mx-service-page .mx-service-booking-button,[data-theme="dark"] .mx-service-page .mx-service-booking-button { color: #111a2b; }
@media(prefers-color-scheme:dark) { html:not([data-theme="light"]) body:not([data-theme-version="light"]):not([data-theme="light"]) .mx-service-page { --mx-service-main: #abc3ff; --mx-service-text: #f1f5fb; --mx-service-muted: #bfcbdd; --mx-service-surface: #111a2b; --mx-service-soft: #1c293d; --mx-service-border: #41516b; } html:not([data-theme="light"]) body:not([data-theme-version="light"]):not([data-theme="light"]) .mx-service-booking-button { color: #111a2b; } }
@media(max-width:767px) { .mx-service-hero,.mx-service-section:has(> .mx-service-section-image),.mx-service-checklist { grid-template-columns: 1fr; }.mx-service-page { padding-inline: 20px; }.mx-service-hero-image { max-height: 400px!important; }.mx-service-introduction { font-size: 16px; } }
