.s9-hero3{
  position: relative;
  width: 100%;
  height: calc(100vh - var(--nav-h));  
  min-height: 520px;
  overflow: hidden;
  display: grid;
  place-items: center;                  
  color: #fff;
}

.s9-bg3{
  position: absolute;
  inset: 0;
  z-index: -2;
}

.s9-hero3::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
}

.s9-inner3{
  width: min(1100px, 92vw);
  margin-left: clamp(18px, 6vw, 72px);
  align-self: center;
}

.s9-title3{
  font-size: clamp(22px, 3.2vw, 34px);
  font-weight: 800;
  margin: 0 0 14px 0;
  text-shadow: 0 2px 10px rgba(0,0,0,.25);
}

.s9-copy3{
  max-width: 560px;
  font-size: clamp(14px, 2vw, 18px);
  line-height: 1.65;
  margin: 0;
  text-shadow: 0 2px 10px rgba(0,0,0,.2);
}

@media (max-width: 680px){
  .s9-hero3{ 
    height: auto; 
    min-height: 520px; 
    padding: 42px 0; 
  }
  .s9-inner3{
    margin: 0 auto;
    width: 88vw;
    text-align: center;
  }
}

/* ========================= FIX para altura completa real ========================= */

/* base para alturas completas */
html, body { height: 100%; }

/* Si el navbar es FIXED/superpuesto, no restes su altura */
:root { --nav-h: 0px; }

/* Fallback para Safari/iOS antiguos */
@supports not (height: 100dvh) {
  html { height: -webkit-fill-available; }
  body { min-height: -webkit-fill-available; }
  .s9-hero3 { height: -webkit-fill-available !important; }
}

/* Navegadores modernos */
@supports (height: 100dvh) {
  .s9-hero3 { height: 100dvh !important; }
}

/* Móvil: ocupar exactamente lo visible */
@media (max-width: 680px) {
  .s9-hero3 {
    height: 100svh !important;
    min-height: 520px;
    padding: 42px 0;
  }
  @supports (height: 100dvh) {
    .s9-hero3 { height: 100dvh !important; }
  }
}