/* MAGS field selection: a large official image, purposeful state changes, stable reading space. */
.product-grid.field-explorer { display: block; border-top: 1px solid var(--mt-color-border); }
.field-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 1px solid var(--mt-color-border); }
.field-tabs button { position: relative; display: grid; grid-template-columns: auto 1fr; column-gap: 14px; align-items: center; min-height: 113px; padding: 22px 20px; text-align: left; border: 0; border-right: 1px solid color-mix(in srgb, var(--mt-color-border) 35%, transparent); border-radius: 0; background: transparent; color: var(--mt-color-text-muted); cursor: pointer; }
.field-tabs button:last-child { border-right: 0; }
.field-tabs button::after { content: ''; position: absolute; bottom: -1px; left: 0; height: 3px; width: 100%; background: var(--mt-color-accent); transform: scaleX(0); transform-origin: left; transition: transform .35s; }
.field-tabs button[aria-selected="true"] { color: var(--mt-color-text); background: color-mix(in srgb, var(--mt-color-accent) 6%, transparent); }
.field-tabs button[aria-selected="true"]::after { transform: scaleX(1); }
.field-number { grid-row: span 2; font: 500 clamp(24px, 3vw, 40px)/1 var(--mt-font-display); color: var(--mt-color-accent); }
.field-tabs strong { font-size: clamp(16px, 1.5vw, 21px); }
.field-subtitle { font-size: 13px; letter-spacing: .035em; padding-top: 7px; }
.field-tabs button:focus-visible { outline: 2px solid white; outline-offset: -4px; }
.field-explorer .field-panel { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); align-items: center; border: 0; background: transparent; min-height: 440px; gap: clamp(20px, 4vw, 58px); padding: 42px 0; }
.field-explorer .field-panel[hidden] { display: none; }
.field-panel figure { min-width: 0; overflow: hidden; margin: 0; }
.field-panel picture { display: flex; align-items: center; height: 310px; background: #f1f3f5; }
.field-panel picture img { width: 100%; height: 100%; object-fit: contain; }
.field-panel figcaption { color: var(--mt-color-text-muted); font-size: 13px; margin-top: 10px; }
.field-explorer .product-body { padding: 0; text-align: left; }
.field-explorer .product-body h3 { font-size: clamp(26px, 2.8vw, 38px); line-height: 1.25; max-width: 12em; margin: 13px 0 22px; }
.field-explorer .product-body :is(p,.eyebrow,.card-link) { text-align: left; justify-content: flex-start; margin-left: 0; }
.field-explorer .product-body .card-link { display: flex; align-items: center; justify-content: space-between; width: 100%; padding-block: 20px; margin-top: 26px; border-top: 1px solid var(--mt-color-border); }
.service-detail { transition: border-color .4s; }
.service-detail.service-current { border-top-color: var(--mt-color-accent); }
.service-detail-title { transition: opacity .4s; }
.service-current .service-index { color: var(--mt-color-accent); }
@media(max-width:767px) {
  .field-tabs button { min-height: 104px; padding: 16px 10px; gap: 7px; grid-template-columns: 1fr; align-content: start; }
  .field-number { grid-row: auto; font-size: 23px; text-align: left; }
  .field-tabs strong { font-size: 14px; line-height: 1.4; text-align: left; }
  .field-subtitle { display: none; }
  .field-explorer .field-panel { grid-template-columns: 1fr; gap: 24px; min-height: 0; padding-block: 24px; }
  .field-panel picture { height: clamp(160px, 52vw, 250px); }
  .field-explorer .product-body h3 { font-size: 28px; text-align: left; max-width: none; }
}
@media(prefers-reduced-motion:reduce) { .field-tabs button::after,.service-detail { transition: none; } }