/* Feature tabs: let the active banner carry the section copy on desktop. */
@media (min-width: 761px) {
  #page-app .app-feature-showcase {
    --app-feature-rail: 220px;
  }

  #page-app .app-feature-panel__visual::after {
    position: absolute;
    z-index: 1;
    right: 0;
    bottom: 0;
    left: 0;
    height: 58%;
    content: "";
    pointer-events: none;
    background: linear-gradient(0deg, rgba(224, 98, 25, .82) 0%, rgba(244, 139, 68, .42) 45%, rgba(255, 205, 155, 0) 100%);
  }

  #page-app .app-feature-panel__intro .app-section-icon {
    background: rgba(255, 255, 255, .2) !important;
    color: #fff !important;
  }

  #page-app .app-feature-kicker,
  #page-app .app-feature-panel__intro h3,
  #page-app .app-feature-panel__intro > p:not(.app-feature-kicker) {
    color: #fff !important;
    text-shadow: 0 2px 14px rgba(104, 48, 14, .34);
  }

  #page-app .app-feature-panel__action {
    color: #f15a24 !important;
    background: rgba(255, 255, 255, .94) !important;
    box-shadow: 0 10px 22px rgba(114, 49, 10, .16) !important;
  }
}

#page-app .app-feature-panel__note,
#page-app #appFeaturePanelPlayground .app-feature-panel__note {
  color: #f15a24 !important;
  background: #fff1e8 !important;
  box-shadow: none !important;
}

@media (min-width: 761px) and (max-width: 1040px) {
  #page-app .app-feature-showcase {
    --app-feature-rail: 204px;
  }
}