.el-hero {
  position:relative;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-content:center;
  margin:-72px 0 0 0;
  padding:100px 10px 80px;
  min-height:85vh;
  background-color:#000;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  background-image:var(--iw-hero-start-bg, none);
}
.el-hero::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(255,255,255,.82));
}
.el-hero .inner {
  position:relative;
  z-index:1;
  max-width:1200px;
  width:100%;
  display:flex;
  justify-content:center;
}
.el-hero .col {
  flex:0 1 100%;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.el-hero .html-copy {
  max-width:1100px;
  margin:0 auto;
  padding:0 10px;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.el-hero .html-copy * {text-align:center}
.el-hero .h2-custom{font-size:clamp(36px,8vw,120px);line-height:1.05;margin:0;font-weight:900;letter-spacing:-.02em}
.el-hero .fx-grad{background:linear-gradient(90deg,#000 0%, #D50069 25%, #39C7CE 50%, #000 75%, #000 100%);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:hero-sheen 8s linear infinite}
@keyframes hero-sheen{0%{background-position:0% 50%}100%{background-position:300% 50%}}
.el-hero .h1-custom{font-size:clamp(16px,3.5vw,42px);line-height:1.25;color:#313131;margin:0;font-weight:600;text-wrap:balance}
.el-hero .p-custom{font-size:clamp(14px,2.2vw,24px);line-height:1.6;color:#555;margin:0 auto;max-width:65ch}
.el-hero .hero-ctas{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:18px}
@media (max-width:1024px){
  .el-hero{background-image:none!important;background-color:#f9f9f9;padding:48px 14px 56px;min-height:0;margin-top:0}
  .el-hero::before{background:none}
  .el-hero .h2-custom{font-size:clamp(28px,7.2vw,44px)}
  .el-hero .h1-custom{font-size:clamp(16px,3.6vw,26px);line-height:1.35;color:#1f2937}
  .el-hero .p-custom{font-size:clamp(14px,2.8vw,18px)}
}
@media (max-width:767px){
  .el-hero{padding:36px 12px 44px;padding-top:calc(36px + env(safe-area-inset-top, 0px))}
  .el-hero .h2-custom{font-size:clamp(24px,9.5vw,36px)}
  .el-hero .h1-custom{font-size:clamp(15px,4.2vw,22px)}
}