.vlc-inmh-page{
  --primary:#001142;
  --primary-container:#00236f;
  --secondary:#0060ab;
  --surface:#f8f9ff;
  --surface-low:#eff4ff;
  --surface-container:#e6eeff;
  --surface-high:#dce9ff;
  --text:#0d1c2e;
  --muted:#444651;

  font-family:inherit;
  color:var(--text);
  background:var(--surface);
  width:100%;
  overflow:hidden;
}

.vlc-inmh-page *{box-sizing:border-box}

.vlc-inmh-wrap{
  max-width:1280px;
  margin:0 auto;
  padding:0 32px;
}

/* :not(:where(.vlc-inmo *)) es clave acá: [vlc_inmobiliario] va embebido adentro de esta página
   (.vlc-inmh-dynamic > .vlc-inmo) y trae sus propios h1/h2/h3/p con su propia paleta clara.
   Sin esta exclusión, estas reglas por etiqueta (necesarias para pisar los estilos que Divi/
   el theme les pone a h1-h3/p) también le pegarían a esos títulos internos — el bug real que
   hacía ver el "Proyectos inmobiliarios..." en blanco sobre el fondo claro del bloque de
   métricas: no era un problema del bloque interno, era este selector demasiado amplio. */
.vlc-inmh-page h1:not(:where(.vlc-inmo *)),.vlc-inmh-page h2:not(:where(.vlc-inmo *)),.vlc-inmh-page h3:not(:where(.vlc-inmo *)),.vlc-inmh-page p:not(:where(.vlc-inmo *)){font-family:inherit}

.vlc-inmh-page h1:not(:where(.vlc-inmo *)){margin:0;padding:0;color:#fff;font-size:48px;line-height:56px;font-weight:800;letter-spacing:-.02em;max-width:830px}
.vlc-inmh-page h2:not(:where(.vlc-inmo *)){margin:0;padding:0;color:var(--primary);font-size:32px;line-height:40px;font-weight:700;letter-spacing:-.01em}
.vlc-inmh-page h3:not(:where(.vlc-inmo *)){margin:0;padding:0;color:var(--primary);font-size:20px;line-height:28px;font-weight:600}
.vlc-inmh-page p:not(:where(.vlc-inmo *)){margin:0;color:var(--muted);font-size:16px;line-height:24px}

/* Hero editorial (distinto del hero compacto de métricas que trae [vlc_inmobiliario]: por
   eso usa su propio namespace vlc-inmh- y no puede colisionar con .vlc-inmo-hero). */
.vlc-inmh-hero{
  position:relative;
  overflow:hidden;
  padding:76px 0 64px;
  color:#fff;
  background:linear-gradient(90deg,rgba(0,17,66,1) 0%,rgba(0,17,66,.94) 55%,rgba(0,35,111,.82) 100%);
}
.vlc-inmh-hero:after{
  content:"";
  position:absolute;
  right:-160px;
  top:-180px;
  width:520px;
  height:520px;
  border-radius:50%;
  background:rgba(100,168,254,.12);
}
.vlc-inmh-hero-inner{position:relative;z-index:2;max-width:850px}

.vlc-inmh-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:14px;
  padding:7px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.10);
  color:#dce9ff;
  font-size:12px;
  line-height:16px;
  font-weight:600;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.vlc-inmh-kicker:before{content:"";width:8px;height:8px;border-radius:50%;background:#64a8fe}

.vlc-inmh-hero p{margin-top:18px;max-width:760px;color:#dce9ff;font-size:18px;line-height:28px}

.vlc-inmh-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}

.vlc-inmh-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 20px;
  min-height:46px;
  border-radius:8px;
  text-decoration:none;
  font-size:14px;
  line-height:20px;
  font-weight:600;
  transition:background-color .2s ease;
}
.vlc-inmh-btn-primary{background:var(--secondary);color:#fff}
.vlc-inmh-btn-primary:hover{background:#004f91;color:#fff}
.vlc-inmh-btn-ghost{background:rgba(255,255,255,.10);color:#fff;border:1px solid rgba(255,255,255,.12)}
.vlc-inmh-btn-ghost:hover{background:rgba(255,255,255,.18);color:#fff}

.vlc-inmh-section{padding:64px 0}
.vlc-inmh-section.vlc-inmh-alt{background:var(--surface-low)}

/* El bloque dinámico ([vlc_inmobiliario]) no necesita el padding-top completo de una
   sección editorial: ya trae su propio hero de métricas con margen propio. */
#vlc-inmh-proyectos.vlc-inmh-section{padding-top:44px;padding-bottom:64px}

.vlc-inmh-eyebrow{margin-bottom:6px;color:var(--secondary);font-size:12px;line-height:16px;font-weight:600;letter-spacing:.07em;text-transform:uppercase}
.vlc-inmh-eyebrow-claro{color:#64a8fe}

.vlc-inmh-section-intro{max-width:760px;margin-top:10px}

.vlc-inmh-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:30px}
.vlc-inmh-feature{padding:26px;border-radius:14px;background:#fff;box-shadow:0 3px 16px rgba(13,28,46,.05)}
.vlc-inmh-feature-icon{width:44px;height:44px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;border-radius:12px;background:var(--surface-container);color:var(--secondary);font-weight:700;font-size:13px}
.vlc-inmh-feature h3{margin-bottom:8px}
.vlc-inmh-feature p{font-size:14px;line-height:21px}

.vlc-inmh-guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:28px}
.vlc-inmh-guide{display:block;padding:24px;border-radius:14px;background:#fff;text-decoration:none;box-shadow:0 3px 16px rgba(13,28,46,.05);transition:transform .2s ease,box-shadow .2s ease}
.vlc-inmh-guide:hover{transform:translateY(-3px);box-shadow:0 9px 25px rgba(13,28,46,.09)}
.vlc-inmh-guide-label{display:block;margin-bottom:8px;color:var(--secondary);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.vlc-inmh-guide h3{margin-bottom:7px}
.vlc-inmh-guide p{font-size:14px;line-height:21px}

.vlc-inmh-costense{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.vlc-inmh-chat{padding:26px;border-radius:16px;background:#fff;box-shadow:0 12px 35px rgba(13,28,46,.09)}
.vlc-inmh-chat-user{width:86%;margin-left:auto;margin-bottom:12px;padding:14px 16px;border-radius:16px 16px 4px 16px;background:var(--surface-container);font-size:14px;line-height:20px;color:var(--text)}
.vlc-inmh-chat-ai{width:92%;padding:15px 17px;border-radius:16px 16px 16px 4px;background:var(--primary);color:#fff;font-size:14px;line-height:20px}

.vlc-inmh-dev{display:flex;align-items:center;justify-content:space-between;gap:36px;padding:48px;border-radius:16px;background:var(--primary);color:#fff}
.vlc-inmh-dev h2{color:#fff;max-width:650px}
.vlc-inmh-dev p{max-width:700px;margin-top:9px;color:#dce9ff}

.vlc-inmh-dynamic{width:100%}

/* ------------------------------------------------------------------------
   Bloque dinámico embebido: [vlc_inmobiliario] ya trae su propio CSS
   scopeado bajo .vlc-inmo (assets/css/inmobiliario-landing.css). Acá solo
   se le da el ancho correcto sin encerrarlo dos veces, usando SIEMPRE las
   clases reales que imprime VLC_Inmobiliario_Landing (no ".vlc-card"/
   ".vlc-grid" que no existen — con eso las reglas nunca aplicaban).
------------------------------------------------------------------------ */
.vlc-inmh-dynamic > .vlc-inmo{max-width:none;margin:0;padding:0}
.vlc-inmh-dynamic .vlc-inmo-hero{margin-top:0}

/* Ajustes de Divi: el módulo Código de Divi 5 agrega su propio padding
   arriba/abajo de fila y columna; lo sacamos solo alrededor de esta
   página puntual (scopeado con :has, no afecta al resto del sitio). */
body .et_pb_section:has(.vlc-inmh-page){padding-top:0;padding-bottom:0}
body .et_pb_row:has(.vlc-inmh-page){width:100%;max-width:none;padding:0;margin:0}
body .et_pb_column:has(.vlc-inmh-page){padding:0}
body .et_pb_code:has(.vlc-inmh-page),body .et_pb_code_inner:has(.vlc-inmh-page){margin:0;padding:0}

@media(max-width:980px){
  .vlc-inmh-wrap{padding:0 24px}
  .vlc-inmh-page h1:not(:where(.vlc-inmo *)){font-size:38px;line-height:44px}
  .vlc-inmh-hero{padding-top:64px;padding-bottom:54px}
  .vlc-inmh-feature-grid,.vlc-inmh-guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vlc-inmh-costense{grid-template-columns:1fr;gap:32px}
  .vlc-inmh-dev{flex-direction:column;align-items:flex-start}
  .vlc-inmh-section{padding:56px 0}
}

@media(max-width:600px){
  .vlc-inmh-wrap{padding:0 18px}
  .vlc-inmh-hero{padding:48px 0 44px}
  .vlc-inmh-page h1:not(:where(.vlc-inmo *)){font-size:32px;line-height:38px}
  .vlc-inmh-page h2:not(:where(.vlc-inmo *)){font-size:25px;line-height:32px}
  .vlc-inmh-hero p{margin-top:14px;font-size:16px;line-height:24px}
  .vlc-inmh-actions{flex-direction:column;margin-top:22px}
  .vlc-inmh-btn{width:100%}
  #vlc-inmh-proyectos.vlc-inmh-section{padding-top:36px;padding-bottom:48px}
  .vlc-inmh-section{padding:44px 0}
  .vlc-inmh-feature-grid,.vlc-inmh-guide-grid{grid-template-columns:1fr;gap:16px}
  .vlc-inmh-feature,.vlc-inmh-guide{padding:20px}
  .vlc-inmh-costense{gap:24px}
  .vlc-inmh-chat{padding:18px}
  .vlc-inmh-dev{padding:28px 22px;gap:24px}
}
