/* O MXO Group — about section */
@import url("_shared.css");
@import url("../components/section-service.css");

.page-subpage--o-mxo-group #section-service {
  margin-top: calc(-1 * var(--page-section-header-inset));
  padding-top: var(--page-section-gap);
  min-height: var(--page-section-min-height);
}

.page-subpage--o-mxo-group .service-intro__title-line {
  font-size: calc(var(--h3-bold-size) * var(--service-coord-scale));
  line-height: calc(var(--h3-bold-line-height) * var(--service-coord-scale));
}

/* ── Grid — facts card bottom aligns with panel card ── */

.page-subpage--o-mxo-group .service-grid__column {
  align-self: stretch;
  min-height: 100%;
}

.page-subpage--o-mxo-group .service-grid__column .service-card--facts {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-self: stretch;
  width: 100%;
  min-height: 0;
}

.page-subpage--o-mxo-group .service-card--facts .service-card__frame {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  height: 100%;
}

.page-subpage--o-mxo-group .service-grid__column .service-card--panel {
  align-self: stretch;
  flex: 1 1 auto;
  width: 100%;
  min-height: 100%;
}

.page-subpage--o-mxo-group .service-grid__column .service-card--panel .service-card__frame {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* ── Data card — label / value rows ── */

.page-subpage--o-mxo-group .service-card--facts .service-card__content {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  justify-content: center;
  padding-block: calc(48px * var(--service-coord-scale));
}

.page-subpage--o-mxo-group .service-facts {
  display: grid;
  grid-template-columns: 55% minmax(0, 1fr);
  margin: 0;
  width: 100%;
  border-bottom: var(--separator-width) solid var(--separator-color);
}

.page-subpage--o-mxo-group .service-facts__row {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: subgrid;
  align-items: baseline;
  padding-block: calc(18px * var(--service-coord-scale));
  border-top: var(--separator-width) solid var(--separator-color);
}

.page-subpage--o-mxo-group .service-facts__label,
.page-subpage--o-mxo-group .service-facts__value {
  margin: 0;
  font-size: var(--service-card-text-size);
  line-height: var(--service-card-text-line-height);
}

.page-subpage--o-mxo-group .service-facts__label {
  font-weight: var(--h1-medium-weight);
  color: var(--color-text);
}

.page-subpage--o-mxo-group .service-facts__value {
  text-align: left;
  font-weight: var(--h1-light-weight);
}

.page-subpage--o-mxo-group .service-facts__link {
  color: inherit;
}

/* ── Panel CTA — outlined ghost button ── */

.page-subpage--o-mxo-group .service-card--panel .service-card__panel-cta {
  display: flex;
  justify-content: center;
  margin-top: 0;
  min-height: 0;
}

.page-subpage--o-mxo-group .service-card--facts .service-card__panel-cta {
  display: flex;
  justify-content: center;
  min-height: 0;
}

.page-subpage--o-mxo-group .mxo-about-cta.btn--outlined-wash {
  width: var(--service-passport-btn-width);
  max-width: 100%;
  height: var(--service-passport-btn-height);
  margin: calc(69px * var(--service-coord-scale)) 0;
  border-radius: var(--service-passport-btn-radius);
  font-size: var(--service-passport-btn-font-size);
}

html:not(.blend-enhanced)
  .page-subpage--o-mxo-group
  .mxo-about-cta.btn--outlined-wash
  .btn--outlined-wash__body {
  background-color: var(--soft-light-wash-fill-fallback);
}

html:not(.blend-enhanced)
  .page-subpage--o-mxo-group
  .mxo-about-cta.btn--outlined-wash:hover
  .btn--outlined-wash__body,
html:not(.blend-enhanced)
  .page-subpage--o-mxo-group
  .mxo-about-cta.btn--outlined-wash:focus-visible
  .btn--outlined-wash__body {
  background-color: var(--soft-light-wash-fill-hover-fallback);
}

html.blend-enhanced
  .page-subpage--o-mxo-group
  .mxo-about-cta.btn--outlined-wash
  .btn--outlined-wash__body {
  background-color: transparent;
  filter: none;
}

.page-subpage--o-mxo-group
  #section-service:has([data-service-btn="about-contact"]:hover)
  .service-btn-wash[data-service-btn="about-contact"],
.page-subpage--o-mxo-group
  #section-service:has([data-service-btn="about-contact"]:focus-visible)
  .service-btn-wash[data-service-btn="about-contact"],
.page-subpage--o-mxo-group
  #section-service:has([data-service-btn="about-mxo-group"]:hover)
  .service-btn-wash[data-service-btn="about-mxo-group"],
.page-subpage--o-mxo-group
  #section-service:has([data-service-btn="about-mxo-group"]:focus-visible)
  .service-btn-wash[data-service-btn="about-mxo-group"] {
  background-color: var(--service-btn-wash-bg-hover);
}

.page-subpage--o-mxo-group .service-btn-wash[data-service-btn="about-contact"],
.page-subpage--o-mxo-group .service-btn-wash[data-service-btn="about-mxo-group"] {
  border-radius: var(--service-passport-btn-radius-rendered);
  background-color: var(--service-btn-wash-bg);
  transition: background-color var(--btn-hero-secondary-hover-duration) var(--motion-ease-out);
}
