/* Shared hero frame and typography for About, Blog, and Contact. */
.page-hero{
  box-sizing:border-box !important;
  height:354px !important;
  min-height:354px !important;
  padding:calc(60px + 3rem) clamp(1.5rem,4vw,3rem) 3rem !important;
  background:#fff !important;
  border-bottom:1px solid #e5e7eb !important;
  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;
}
.page-hero::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:-1 !important;
  background-image:url("image/product-hero-kitchen.webp") !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:72% center !important;
  opacity:.35 !important;
}
.page-hero > .wrap{
  box-sizing:border-box !important;
  width:100% !important;
  max-width:1240px !important;
  padding:0 !important;
  margin:0 auto !important;
  position:relative !important;
  z-index:1 !important;
}
.page-hero .slbl{
  margin-bottom:.8rem !important;
  font-family:'Inter',system-ui,-apple-system,sans-serif !important;
  font-size:9px !important;
  line-height:1.2 !important;
  font-weight:600 !important;
  letter-spacing:.1em !important;
}
.page-hero .sh2{
  margin:0 !important;
  font-family:'Inter',system-ui,-apple-system,sans-serif !important;
  font-size:clamp(2.6rem,4.5vw,3.8rem) !important;
  line-height:1 !important;
  font-weight:700 !important;
  letter-spacing:-.04em !important;
  white-space:nowrap;
}
.page-hero .wrap > p,
.page-hero .hero-sub{
  max-width:620px !important;
  margin:.85rem 0 0 !important;
  font-family:'Inter',system-ui,-apple-system,sans-serif !important;
  font-size:14px !important;
  line-height:1.75 !important;
  font-weight:400 !important;
}

@media(min-width:701px){
  .page-hero{
    display:flex !important;
    align-items:center !important;
    padding:0 clamp(1.5rem,4vw,3rem) !important;
  }
  .page-hero > .wrap{
    transform:translateY(40px);
  }
}

@media(max-width:700px){
  .page-hero{
    height:310px !important;
    min-height:310px !important;
    padding:104px 1.5rem 2rem !important;
  }
  .page-hero::before{
    background-position:68% center !important;
  }
  .page-hero .sh2{
    font-size:clamp(2.2rem,9vw,3rem) !important;
    white-space:normal;
  }
  .page-hero .wrap > p,
  .page-hero .hero-sub{
    max-width:34rem !important;
    font-size:13px !important;
  }
}