/* 2026-10-23: move fieldset captions inside their own white cards.
   Controls keep their existing dimensions, selectors and behavior. */
body.experience-ui[data-page="internet"] [data-ui-name="C02"] > .internet-fieldset {
  position: relative !important;
  padding-top: 47px !important;
}
body.experience-ui[data-page="internet"] [data-ui-name="C02"] > .internet-fieldset > legend {
  position: absolute !important;
  inset: 8px auto auto 16px !important;
  display: flex !important;
  align-items: center !important;
  width: max-content;
  max-width: calc(100% - 32px);
  box-sizing: border-box;
  height: 32px;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  line-height: 1.2;
}
body.experience-ui[data-page="internet"] [data-ui-name="C02"] > .internet-fieldset > legend > span {
  flex: 0 0 32px;
}

/* Only desktop uses a 50:50 cost/benefit breakdown inside the wide details panel. */
@media (min-width: 1100px) {
  body.experience-ui[data-page="internet"] [data-ui-name="C03"] .internet-estimate-details .estimate-details-content {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 14px !important;
  }
  body.experience-ui[data-page="internet"] [data-ui-name="C03"] .internet-estimate-details .estimate-details-content > .calc-outline-group {
    min-width: 0;
    margin: 0 !important;
  }
}
@media (max-width: 760px) {
  body.experience-ui[data-page="internet"] [data-ui-name="C02"] > .internet-fieldset {
    padding-top: 45px !important;
  }
  body.experience-ui[data-page="internet"] [data-ui-name="C02"] > .internet-fieldset > legend {
    left: 14px !important;
    max-width: calc(100% - 28px);
  }
}