.hero{
  min-height:100svh;display:flex;align-items:center;position:relative;overflow:hidden;
  background:radial-gradient(120% 90% at 80% 18%,#1c2b27 0%,#141F1C 44%,#0c1311 100%);
  padding-top:clamp(120px,16vh,180px);padding-bottom:clamp(96px,12vw,140px);
}
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;pointer-events:none}
.hero__scrim{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(12,19,17,.92) 0%,rgba(12,19,17,.7) 38%,rgba(12,19,17,.25) 70%,rgba(12,19,17,.45) 100%),
    linear-gradient(0deg,rgba(12,19,17,.85) 0%,rgba(12,19,17,0) 30%);
}
.hero--lp{min-height:100svh;height:auto;display:flex;align-items:center;overflow:visible;
  padding:clamp(120px,16vh,168px) 0 clamp(56px,7vw,90px)}
.hero--lp > .e-con-inner{width:100%}
/* garante que o container do Elementor não imponha altura fixa que corte o form */
body.kairum-site .hero--lp.e-con{min-height:100svh;height:auto !important;overflow:visible !important}
body.kairum-site .hero--lp .e-con-inner{align-items:center}
/* Impede overflow horizontal das colunas flex do hero */
.hero--lp .hero__grid > *{min-width:0}
.hero--lp .lead{min-width:0;max-width:100%}
/* O vídeo do hero: o Elementor envolve em .elementor-widget-video.
   Posicionamos o wrapper no canto inferior esquerdo, com máscara. */
body.kairum-site .hero--lp .elementor-widget-video.hero__video,
body.kairum-site .hero--lp .hero__video{
  position:absolute;
  inset:auto auto 0 0;z-index:0;pointer-events:none;margin:0;
  width:min(70vw,1000px);height:min(92%,820px);
  -webkit-mask-image:linear-gradient(to top,#000 38%,transparent 96%),linear-gradient(to right,#000 70%,transparent 99%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to top,#000 38%,transparent 96%),linear-gradient(to right,#000 70%,transparent 99%);
  mask-composite:intersect;
}
body.kairum-site .hero--lp .hero__video .elementor-widget-container,
body.kairum-site .hero--lp .hero__video .elementor-video,
body.kairum-site .hero--lp .hero__video video,
body.kairum-site .hero--lp .hero__video iframe{
  width:100% !important;height:100% !important;object-fit:cover;border:0}
.hero--lp .hero__scrim{background:linear-gradient(90deg,rgba(12,19,17,.86) 0%,rgba(12,19,17,.5) 42%,rgba(12,19,17,.9) 100%)}
@media(max-width:980px){
  .hero--lp .hero__video{
    inset:0 0 auto 0;width:100%;height:36vh;
    -webkit-mask-image:linear-gradient(to bottom,#000 48%,transparent 96%);
    -webkit-mask-composite:source-over;
    mask-image:linear-gradient(to bottom,#000 48%,transparent 96%);
    mask-composite:add;
  }
  .hero--lp .hero__scrim{background:linear-gradient(to bottom,rgba(12,19,17,.45) 0%,rgba(12,19,17,.85) 55%,var(--green) 100%)}
}
/* O layout de colunas do hero é controlado pelo flex nativo do Elementor
   (configurado no template). Aqui só garantimos largura total e o recuo. */
.hero--lp .hero__grid{position:relative;z-index:2;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad);width:100%}
.hero--lp .eyebrow{color:var(--gray)}
.hero--lp h1{font-size:clamp(2.6rem,6vw,4.6rem);margin-top:1.2rem;line-height:.98}
.hero--lp h1 b{font-weight:700;background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.hero__value{margin-top:1.6rem;color:var(--gray);max-width:46ch;font-size:clamp(1rem,1.3vw,1.12rem)}
.hero__actions{margin-top:2.4rem;display:flex;gap:1rem;flex-wrap:wrap}
.hero--lp .hero__actions{margin-top:2rem}
.hero__trust{display:flex;align-items:center;gap:1.4rem;margin-top:2.2rem;flex-wrap:wrap}
.hero__trust .gi{display:inline-flex;align-items:center;gap:.6em;color:var(--gray);font-size:.85rem}
.hero__trust .stars{color:#FFC265;letter-spacing:.06em}
.hero__trust img{height:18px;width:auto}
@media(max-width:980px){
  .hero--lp .hero__grid{flex-direction:column !important;align-items:stretch !important}
  .hero--lp .hero__grid > *{width:100% !important}
}