/* V133 — remove the outer shell around the workflow/preview block so it can breathe */
.hero-experience .product-grid-with-native-flow .product-card-native-flow{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  border-radius:0!important;
  padding:0!important;
  min-height:0!important;
}
.hero-experience .product-card-native-flow > h3{
  max-width:900px!important;
  margin:0 auto!important;
  padding:0 12px!important;
}
.hero-experience .product-card-native-flow > .native-workflow{
  margin-top:22px!important;
  padding-top:0!important;
  border-top:0!important;
}
.hero-experience .product-card-native-flow > .hero-preview-wrap{
  margin-top:16px!important;
  padding-top:0!important;
  border-top:0!important;
}

@media (max-width: 640px){
  .hero-experience .product-section.beauty-focus > .wrap{
    width:calc(100% - 10px)!important;
    max-width:100%!important;
  }
  .hero-experience .product-grid.product-grid-with-native-flow{
    width:100%!important;
    margin:0!important;
  }
  .hero-experience .product-grid-with-native-flow .product-card-native-flow{
    padding:0!important;
  }
  .hero-experience .product-card-native-flow > h3{
    padding:0 10px!important;
    font-size:clamp(18px,5.7vw,22px)!important;
    line-height:1.45!important;
  }
  .hero-experience .product-card-native-flow > .native-workflow{
    margin-top:16px!important;
  }
  .hero-experience .native-workflow-row{
    padding:10px 10px!important;
    border-radius:16px!important;
  }
  .hero-experience .product-card-native-flow > .hero-preview-wrap{
    margin-top:12px!important;
  }
}
@media (max-width:390px){
  .hero-experience .product-section.beauty-focus > .wrap{
    width:calc(100% - 6px)!important;
  }
  .hero-experience .product-card-native-flow > h3{
    padding:0 8px!important;
  }
  .hero-experience .native-workflow-row{
    padding:9px 8px!important;
  }
}