/* TMT-Media production stylesheet — Stage 28.0 */

/* Source owner: tmt-clean-service-detail.css */
/* Stage 15: clean shared service-detail owner. */
.tmt-clean-service-detail-page .tmt-service-detail,
.tmt-clean-service-detail-page .tmt-service-next-step,
.tmt-clean-service-detail-page .tmt-service-player { padding: clamp(44px, 6vw, 82px) 0; }
.tmt-clean-service-detail-page .tmt-service-detail__title {
  margin: 0 0 var(--tmt-heading-content-gap);
  border: 0;
  background: none;
  text-align: left;
  text-decoration: none;
}
.tmt-clean-service-detail-page .tmt-service-detail__intro-card,
.tmt-clean-service-detail-page .tmt-service-next-step__card,
.tmt-clean-service-detail-page .tmt-service-player .card {
  background: linear-gradient(145deg, var(--tmt-panel-a), var(--tmt-panel-b));
  border: 1px solid var(--tmt-border);
  border-radius: var(--tmt-radius-card, 14px);
  box-shadow: var(--tmt-shadow-card);
}
.tmt-clean-service-detail-page .tmt-service-detail__intro-card { display:grid; grid-template-columns:minmax(220px,.72fr) minmax(0,1.28fr); gap:clamp(28px,5vw,64px); align-items:center; padding:clamp(28px,5vw,56px); }
.tmt-clean-service-detail-page .tmt-service-detail__media { margin:0; text-align:center; }
.tmt-clean-service-detail-page .tmt-service-detail__icon { display:block; width:min(100%,240px); aspect-ratio:1; object-fit:contain; margin:0 auto 16px; }
.tmt-clean-service-detail-page .tmt-service-detail__media figcaption { font-weight:700; }
.tmt-clean-service-detail-page .tmt-service-detail__lead { margin:0 0 28px; font-size:clamp(1.2rem,1.7vw,1.55rem); line-height:1.55; }
.tmt-clean-service-detail-page .tmt-service-detail__subheading,
.tmt-clean-service-detail-page .tmt-service-next-step h2 { margin: 0 0 var(--tmt-subheading-content-gap); }
.tmt-clean-service-detail-page .tmt-service-detail__content ul { margin:0; padding-left:1.25em; }
.tmt-clean-service-detail-page .tmt-service-detail__content li + li { margin-top:.55em; }
.tmt-clean-service-detail-page .tmt-service-detail__note { margin:28px 0 0; }
.tmt-clean-service-detail-page .tmt-service-next-step { padding-top:0; }
.tmt-clean-service-detail-page .tmt-service-next-step__card { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(240px,.6fr); gap:clamp(28px,5vw,64px); padding:clamp(28px,5vw,48px); }
.tmt-clean-service-detail-page .tmt-service-next-step__main p { margin:0 0 24px; }
.tmt-clean-service-detail-page .tmt-service-next-step__cta { min-height:56px; display:inline-flex; align-items:center; justify-content:center; padding:0 24px; text-decoration:none !important; }
.tmt-clean-service-detail-page .tmt-service-next-step__related h3 { margin:0 0 var(--tmt-subheading-content-gap); }
.tmt-clean-service-detail-page .tmt-service-next-step__related ul { margin:0; padding-left:1.1em; }
.tmt-clean-service-detail-page .tmt-service-next-step__related li + li { margin-top:.65em; }
.tmt-clean-service-detail-page .tmt-service-player { padding-top:0; }
.tmt-clean-service-detail-page .tmt-service-player .card { padding:35px; }
.tmt-visually-hidden { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
@media (max-width: 760px) {
 .tmt-clean-service-detail-page .tmt-service-detail__intro-card,
 .tmt-clean-service-detail-page .tmt-service-next-step__card { grid-template-columns:1fr; }
 .tmt-clean-service-detail-page .tmt-service-detail__icon { width:min(62vw,220px); }
 .tmt-clean-service-detail-page .tmt-service-player .card { padding:24px; }
}

/* Stage 15.1: approved service-detail refinements. */
.tmt-clean-service-detail-page {
  --tmt-service-section-space: clamp(44px, 6vw, 82px);
}

/* Keep equal space between the intro, estimate and player sections. */
.tmt-clean-service-detail-page .tmt-service-detail,
.tmt-clean-service-detail-page .tmt-service-next-step,
.tmt-clean-service-detail-page .tmt-service-player {
  padding: 0;
}

.tmt-clean-service-detail-page .tmt-service-detail {
  padding-top: var(--tmt-service-section-space);
}

.tmt-clean-service-detail-page .tmt-service-next-step,
.tmt-clean-service-detail-page .tmt-service-player {
  margin-top: var(--tmt-service-section-space);
}

.tmt-clean-service-detail-page .tmt-service-player {
  padding-bottom: var(--tmt-service-section-space);
}

/* Keep the service label visually connected to its icon. */
.tmt-clean-service-detail-page .tmt-service-detail__icon {
  margin-bottom: 8px;
}

/* Service icons become white artwork on the dark panel. */
html[data-tmt-theme="dark"] .tmt-clean-service-detail-page .tmt-service-detail__icon {
  filter: brightness(0) invert(1);
}

/* Match the established button radius, lift, shadow and focus behavior. */
.tmt-clean-service-detail-page .tmt-service-next-step__cta {
  border-radius: var(--tmt-radius, 12px);
  font-weight: 700;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}

.tmt-clean-service-detail-page .tmt-service-next-step__cta:hover,
.tmt-clean-service-detail-page .tmt-service-next-step__cta:focus-visible {
  transform: translateY(-2px);
  box-shadow: var(--tmt-shadow-hover);
}

/* Center the A/B control against the square image, not image plus caption. */
.tmt-clean-service-detail-page #tmt-dual-player .tmt-cover {
  display: grid;
  grid-template-rows: auto auto;
}

.tmt-clean-service-detail-page #tmt-dual-player .tmt-cover img {
  grid-column: 1;
  grid-row: 1;
}

.tmt-clean-service-detail-page #tmt-dual-player .tmt-ab-toggle,
html[data-tmt-theme="dark"] .tmt-clean-service-detail-page #tmt-dual-player .tmt-ab-toggle {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  grid-column: 1;
  grid-row: 1;
  place-self: center;
  transform: none !important;
}

.tmt-clean-service-detail-page #tmt-dual-player .tmt-cover-caption {
  grid-column: 1;
  grid-row: 2;
}

/* Stage 15.2: final spacing and icon-caption refinement. */
.tmt-clean-service-detail-page .tmt-service-player,
.tmt-clean-service-detail-page #tmt-dual-player {
  padding-top: 0 !important;
  padding-bottom: var(--tmt-service-section-space) !important;
}

.tmt-clean-service-detail-page .tmt-service-detail__icon {
  margin-bottom: 4px;
}
/* Stage 16.1: explicit media alignment and no-player footer clearance. */
.tmt-clean-service-detail-page .tmt-service-detail__media {
  display: grid;
  justify-items: center;
}

.tmt-clean-service-detail-page .tmt-service-detail__media figcaption {
  width: 100%;
  text-align: center;
}

.tmt-clean-service-detail-page.tmt-service-detail-no-player .tmt-service-next-step {
  margin-bottom: var(--tmt-service-section-space);
}

/* Stage 28.10.0: localized tech-rider download section on live-production pages. */
.tmt-clean-service-detail-page .tmt-service-resource {
  margin-top: var(--tmt-service-section-space);
}

.tmt-clean-service-detail-page .tmt-service-resource__card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, auto);
  gap: clamp(28px, 5vw, 64px);
  align-items: center;
  padding: clamp(28px, 5vw, 48px);
  background: linear-gradient(145deg, var(--tmt-panel-a), var(--tmt-panel-b));
  border: 1px solid var(--tmt-border);
  border-radius: var(--tmt-radius-card, 14px);
  box-shadow: var(--tmt-shadow-card);
}

.tmt-clean-service-detail-page .tmt-service-resource__copy h2 {
  margin: 0 0 var(--tmt-subheading-content-gap);
}

.tmt-clean-service-detail-page .tmt-service-resource__copy p {
  max-width: 760px;
  margin: 0;
}

.tmt-clean-service-detail-page .tmt-service-resource__action {
  display: grid;
  justify-items: stretch;
  gap: 10px;
  min-width: 0;
}

.tmt-clean-service-detail-page .tmt-service-resource__cta {
  min-height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 24px;
  border-radius: var(--tmt-radius, 12px);
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
  text-decoration: none !important;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}

.tmt-clean-service-detail-page .tmt-service-resource__cta:hover,
.tmt-clean-service-detail-page .tmt-service-resource__cta:focus-visible {
  transform: translateY(-2px);
  box-shadow: var(--tmt-shadow-hover);
}


@media (max-width: 760px) {
  .tmt-clean-service-detail-page .tmt-service-resource__card {
    grid-template-columns: 1fr;
  }

  .tmt-clean-service-detail-page .tmt-service-resource__action {
    justify-items: stretch;
  }

  .tmt-clean-service-detail-page .tmt-service-resource__cta {
    width: 100%;
  }
}

/* Stage 28.14.0: exact 35 px edge spacing for bottom-positioned content CTAs. */
.tmt-clean-service-detail-page .tmt-service-next-step__card,
.tmt-clean-service-detail-page .tmt-service-resource__card {
  padding: 35px;
}

.tmt-clean-service-detail-page .tmt-service-next-step__card {
  align-items: stretch;
}

.tmt-clean-service-detail-page .tmt-service-next-step__main {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
}

.tmt-clean-service-detail-page .tmt-service-next-step__cta {
  margin-top: auto;
}

.tmt-clean-service-detail-page .tmt-service-resource__card {
  align-items: stretch;
}

.tmt-clean-service-detail-page .tmt-service-resource__action {
  align-self: end;
}

@media (max-width: 760px) {
  .tmt-clean-service-detail-page .tmt-service-next-step__main {
    align-items: stretch;
  }
}