/* ==========================================================================
   Espacio Vital Constructores — Hoja de estilos global (Opción B)
   Estilo institucional tipo banco / cooperativa
   Todas las páginas del sitio usan este archivo.
   ========================================================================== */

/* ---------- 1. Variables de marca ---------- */
:root {
  --verde-900: #0A2219;   /* fondo footer y barra superior */
  --verde-800: #123A2B;   /* color institucional principal */
  --verde-600: #2E5E2C;   /* textos de acento sobre claro */
  --verde-500: #3C7A3A;   /* kicker / etiquetas */
  --lima-500:  #B7D43B;   /* lima de marca (fondos con texto oscuro) */
  --lima-100:  #EEF5D6;   /* fondo suave de etiquetas */
  --ambar-100: #FFF1D6;
  --ambar-700: #7A4B00;

  --texto:     #1B2A23;
  --texto-2:   #4F5E56;   /* texto secundario (contraste AA sobre blanco) */
  --borde:     #DCE4DD;
  --borde-2:   #C9D4CC;
  --fondo:     #FFFFFF;
  --fondo-2:   #F6F8F5;

  --radio:     8px;
  --radio-sm:  6px;
  --sombra:    0 20px 50px rgba(10, 34, 25, .18);

  --fuente:    'Public Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ancho:     1280px;
  --tam-base:  16px;
}

/* Alto contraste (activado desde la barra superior) */
html.alto-contraste {
  --texto: #000000;
  --texto-2: #1F1F1F;
  --borde: #5A5A5A;
  --borde-2: #3A3A3A;
  --verde-800: #002816;
}

/* ---------- 2. Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: var(--tam-base); scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--fuente);
  color: var(--texto);
  background: var(--fondo);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
[hidden] { display: none !important; }
a { color: var(--verde-800); }
a:hover { color: var(--verde-900); }
h1, h2, h3, h4 { color: var(--verde-800); line-height: 1.15; margin: 0; }
p { margin: 0; }
button, input, select, textarea { font: inherit; }
:focus-visible { outline: 3px solid var(--lima-500); outline-offset: 2px; }

.contenedor { max-width: var(--ancho); margin: 0 auto; padding: 0 40px; }
.seccion { padding: 80px 0; }
.seccion--gris { background: var(--fondo-2); }
.seccion--oscura { background: var(--verde-800); color: #FFFFFF; }
.seccion--oscura h2, .seccion--oscura h3 { color: #FFFFFF; }
.saltar { position: absolute; left: -999px; top: 8px; background: var(--lima-500); color: var(--verde-900); padding: 10px 16px; z-index: 100; }
.saltar:focus { left: 8px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* ---------- 3. Tipografía de sección ---------- */
.kicker { font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--verde-500); }
.seccion--oscura .kicker { color: var(--lima-500); }
.titulo { font-size: 36px; font-weight: 800; letter-spacing: -.01em; }
.texto-2 { color: var(--texto-2); }
.seccion--oscura .texto-2 { color: #CFDCD4; }
.encabezado-seccion { display: flex; flex-direction: column; gap: 10px; margin-bottom: 28px; }
.encabezado-seccion--fila { flex-direction: row; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }

/* ---------- 4. Grillas ---------- */
.g2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; }
.g3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.g4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.g6 { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.g8 { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 12px; }
.centrado-v { align-items: center; }
.pila { display: flex; flex-direction: column; gap: 18px; }

/* ---------- 5. Botones y etiquetas ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 46px; padding: 0 22px; border-radius: var(--radio-sm);
  font-weight: 700; font-size: 15px; text-decoration: none; border: 1px solid transparent; cursor: pointer;
  transition: background .15s ease, color .15s ease;
}
.btn--primario { background: var(--verde-800); color: #FFFFFF; }
.btn--primario:hover { background: var(--verde-900); color: #FFFFFF; }
.btn--lima { background: var(--lima-500); color: var(--verde-900); }
.btn--lima:hover { background: #A6C22C; color: var(--verde-900); }
.btn--borde { background: #FFFFFF; color: var(--verde-800); border-color: var(--verde-800); }
.btn--bloque { width: 100%; }

.pill { display: inline-block; padding: 4px 10px; border-radius: 4px; font-size: 12px; font-weight: 700; }
.pill--lima { background: var(--lima-100); color: var(--verde-600); }
.pill--verde { background: var(--verde-800); color: #FFFFFF; }
.pill--ambar { background: var(--ambar-100); color: var(--ambar-700); }

.filtros { display: flex; gap: 8px; flex-wrap: wrap; }
.filtro { min-height: 40px; padding: 0 14px; border-radius: var(--radio-sm); border: 1px solid var(--borde-2); background: #FFFFFF; font-weight: 600; cursor: pointer; }
.filtro[aria-pressed="true"] { background: var(--verde-800); border-color: var(--verde-800); color: #FFFFFF; }

/* ---------- 6. Barra superior ---------- */
.barra-sup { background: var(--verde-900); color: #DDE7E0; font-size: 13px; }
.barra-sup .contenedor { display: flex; justify-content: space-between; align-items: center; min-height: 38px; gap: 16px; flex-wrap: wrap; }
.barra-sup a { color: #DDE7E0; text-decoration: none; }
.barra-sup a:hover { color: #FFFFFF; text-decoration: underline; }
.perfiles { display: flex; }
.perfiles a { padding: 10px 14px; }
.perfiles a[aria-current="page"] { background: var(--lima-500); color: var(--verde-900); font-weight: 700; }
.utilidades { display: flex; gap: 18px; align-items: center; }
.utilidades .destacado { color: var(--lima-500); font-weight: 700; }
.accesibilidad { display: flex; gap: 6px; align-items: center; }
.accesibilidad button { background: transparent; color: #DDE7E0; border: 1px solid #3A5A4B; border-radius: 4px; min-width: 32px; min-height: 28px; padding: 0 8px; cursor: pointer; }
.accesibilidad button:hover { border-color: var(--lima-500); }

/* ---------- 7. Encabezado y menú ---------- */
.encabezado { background: #FFFFFF; border-bottom: 1px solid var(--borde); position: sticky; top: 0; z-index: 50; }
.encabezado .contenedor { display: flex; align-items: center; justify-content: space-between; min-height: 80px; gap: 24px; }
.logo { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--verde-800); }
.logo img { height: 46px; width: auto; }
.logo__texto { display: flex; flex-direction: column; line-height: 1.1; }
.logo__nombre { font-size: 20px; font-weight: 800; }
.logo__lema { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--texto-2); }

.menu { display: flex; gap: 4px; list-style: none; margin: 0; padding: 0; }
.menu > li { position: static; }
.menu__boton {
  display: flex; align-items: center; gap: 6px; padding: 28px 14px; border: 0; background: transparent;
  color: var(--verde-800); font-weight: 600; font-size: 15px; cursor: pointer; border-bottom: 3px solid transparent;
}
.menu__boton:hover, .menu__boton[aria-expanded="true"] { border-bottom-color: var(--lima-500); }
.menu__boton svg { transition: transform .15s ease; }
.menu__boton[aria-expanded="true"] svg { transform: rotate(180deg); }

.mega {
  position: absolute; left: 0; right: 0; top: 100%;
  background: var(--fondo-2); border-top: 1px solid var(--borde); border-bottom: 1px solid var(--borde);
  box-shadow: 0 16px 30px rgba(10, 34, 25, .08); display: none;
}
.mega.abierto { display: block; }
.mega__grilla { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; padding-top: 24px; padding-bottom: 24px; font-size: 14px; }
.mega__col { display: flex; flex-direction: column; gap: 8px; }
.mega__col strong { color: var(--verde-500); font-size: 12px; text-transform: uppercase; letter-spacing: .06em; }
.mega__col a { text-decoration: none; }
.mega__col a:hover { text-decoration: underline; }
.mega__cta { background: var(--verde-800); color: #FFFFFF; border-radius: var(--radio); padding: 18px; display: flex; flex-direction: column; gap: 8px; }
.mega__cta span { font-size: 13px; color: #CFDCD4; }
.mega__cta a { color: var(--lima-500); font-weight: 700; }

.acciones-enc { display: flex; gap: 10px; align-items: center; }
.btn-icono { width: 46px; height: 46px; border-radius: var(--radio-sm); border: 1px solid var(--borde); background: #FFFFFF; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.btn-menu-movil { display: none; }

/* ---------- 8. Hero ---------- */
.hero { position: relative; background: var(--verde-800); }
.hero__foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.hero .contenedor { position: relative; padding-top: 64px; padding-bottom: 64px; }
.hero__tarjeta { background: #FFFFFF; border-radius: 10px; max-width: 540px; padding: 36px; display: flex; flex-direction: column; gap: 18px; box-shadow: var(--sombra); }
.hero__titulo { font-size: 42px; font-weight: 800; }

/* Pestañas */
.pestanas { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; border: 1px solid var(--borde); border-radius: var(--radio); overflow: hidden; font-size: 13px; font-weight: 700; }
.pestanas button { min-height: 44px; border: 0; background: #FFFFFF; color: var(--verde-800); cursor: pointer; }
.pestanas button[aria-selected="true"] { background: var(--verde-800); color: #FFFFFF; }
.pestanas--linea { display: flex; border: 0; border-bottom: 2px solid var(--borde); border-radius: 0; font-size: 14px; overflow-x: auto; }
.pestanas--linea button { padding: 0 16px; background: transparent; color: var(--texto-2); border-bottom: 3px solid transparent; margin-bottom: -2px; white-space: nowrap; }
.pestanas--linea button[aria-selected="true"] { background: transparent; color: var(--verde-800); border-bottom-color: var(--verde-800); }
[role="tabpanel"][hidden] { display: none; }

/* ---------- 9. Formularios ---------- */
.campo { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 600; }
.campo input, .campo select, .campo textarea {
  min-height: 46px; border: 1px solid var(--borde-2); border-radius: var(--radio-sm);
  padding: 0 12px; font-weight: 400; font-size: 16px; background: #FFFFFF; color: var(--texto);
}
.campo textarea { padding: 12px; min-height: 120px; resize: vertical; }
.campos-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.campos-2 .completo { grid-column: 1 / -1; }
.casilla { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; }
.casilla input { width: 20px; height: 20px; margin-top: 2px; }
.panel { background: #FFFFFF; border: 1px solid var(--borde); border-radius: var(--radio); padding: 24px; }

/* ---------- 10. Accesos rápidos ---------- */
.accesos { padding: 36px 0; background: var(--fondo-2); border-bottom: 1px solid var(--borde); }
.acceso { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 18px 8px; border: 1px solid var(--borde); border-radius: var(--radio); text-decoration: none; color: var(--verde-800); font-size: 13px; font-weight: 600; text-align: center; background: #FFFFFF; transition: border-color .15s ease, transform .15s ease; }
.acceso:hover { border-color: var(--lima-500); transform: translateY(-2px); }
.acceso__icono { width: 44px; height: 44px; border-radius: 50%; background: var(--lima-100); display: flex; align-items: center; justify-content: center; }

/* ---------- 11. Tarjetas ---------- */
.tarjeta { border: 1px solid var(--borde); border-radius: var(--radio); overflow: hidden; background: #FFFFFF; display: flex; flex-direction: column; }
.tarjeta__img { width: 100%; height: 180px; object-fit: cover; }
.tarjeta__cuerpo { padding: 20px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.tarjeta__titulo { font-size: 19px; font-weight: 700; }
.tarjeta__meta { font-size: 14px; color: var(--texto-2); }
.tarjeta__enlace { font-weight: 700; font-size: 14px; margin-top: auto; padding-top: 6px; }
.tarjeta .btn { margin-top: auto; }
.tarjeta[hidden] { display: none; }
.foto-pendiente {
  height: 180px; background: repeating-linear-gradient(135deg, #E3EAE4 0 10px, #EEF2EE 10px 20px);
  display: flex; align-items: center; justify-content: center; color: var(--texto-2); font-size: 13px; font-weight: 700; text-align: center; padding: 12px;
}
.enlace-caja { border: 1px solid var(--borde); border-radius: var(--radio); padding: 16px; font-weight: 600; text-decoration: none; }
.enlace-caja:hover { border-color: var(--verde-800); }

/* ---------- 12. Tablas ---------- */
.tabla-envoltura { overflow-x: auto; border: 1px solid var(--borde); border-radius: var(--radio); }
table { border-collapse: collapse; width: 100%; font-size: 14px; }
th { background: var(--verde-800); color: #FFFFFF; text-align: left; padding: 14px 16px; font-weight: 600; white-space: nowrap; }
td { padding: 14px 16px; border-bottom: 1px solid var(--borde); }
tbody tr:nth-child(even) td { background: var(--fondo-2); }
.num { text-align: right; font-variant-numeric: tabular-nums; }
.resultado-destacado { font-weight: 800; color: var(--verde-600); font-size: 18px; }

/* ---------- 13. Bloques especiales ---------- */
.cifra { border: 1px solid #2E5444; border-radius: var(--radio); padding: 18px; }
.cifra strong { font-size: 32px; color: var(--lima-500); display: block; line-height: 1.1; }
.cifra p { font-size: 13px; color: #CFDCD4; }
.aliado { border: 1px dashed #4F7A66; border-radius: var(--radio-sm); padding: 10px 14px; color: #CFDCD4; font-size: 13px; }
.mosaico { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.mosaico img { width: 100%; height: 180px; object-fit: cover; border-radius: var(--radio); }
.mosaico img:first-child { grid-column: 1 / -1; height: 300px; }
.lista-check { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; font-size: 14px; font-weight: 600; }
.lista-check li { padding: 12px; background: var(--fondo-2); border-radius: var(--radio-sm); }
.lista-check li::before { content: "✓ "; color: var(--verde-500); }
.testimonio { border: 1px solid var(--borde); border-radius: var(--radio); padding: 22px; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.testimonio p { font-size: 17px; }
.testimonio footer { font-size: 13px; color: var(--texto-2); }
.comunicado { background: #FFFFFF; border: 1px solid var(--borde); border-radius: var(--radio); padding: 22px; display: flex; flex-direction: column; gap: 8px; }
.comunicado__fecha { font-size: 13px; color: var(--texto-2); }
.comunicado__titulo { font-size: 18px; font-weight: 700; }
.nota-legal { font-size: 12px; color: var(--texto-2); line-height: 1.6; }
.faq details { border-bottom: 1px solid var(--borde); padding: 16px 0; }
.faq summary { font-weight: 700; cursor: pointer; font-size: 16px; color: var(--verde-800); }
.faq details p { margin-top: 10px; color: var(--texto-2); }

/* Franja de gobierno corporativo */
.gobierno { padding: 28px 0; border-top: 1px solid var(--borde); border-bottom: 1px solid var(--borde); font-size: 14px; font-weight: 600; }

/* ---------- 14. Pie de página ---------- */
.pie { background: var(--verde-900); color: #CFDCD4; padding: 56px 0 28px; font-size: 14px; }
.pie a { color: #CFDCD4; text-decoration: none; }
.pie a:hover { color: #FFFFFF; text-decoration: underline; }
.pie__grilla { display: grid; grid-template-columns: 1.4fr repeat(4, minmax(0, 1fr)); gap: 28px; }
.pie__col { display: flex; flex-direction: column; gap: 8px; }
.pie__col strong { color: #FFFFFF; }
.pie__marca { font-size: 18px; }
.pie__correo { color: var(--lima-500) !important; }
.pie__legal { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 12px; padding-top: 20px; margin-top: 36px; border-top: 1px solid #22463A; }
.redes { display: flex; gap: 10px; margin-top: 6px; }
.redes a { width: 40px; height: 40px; border: 1px solid #2E5444; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }

/* Botón flotante de WhatsApp */
.whatsapp-flotante { position: fixed; right: 20px; bottom: 20px; width: 56px; height: 56px; border-radius: 50%; background: #1F8F4E; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 20px rgba(0,0,0,.25); z-index: 60; }

/* ---------- 15. Responsive ---------- */
@media (max-width: 1100px) {
  .menu__boton { padding: 28px 10px; font-size: 14px; }
  .g8 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .contenedor { padding: 0 16px; }
  .seccion { padding: 56px 0; }
  .titulo { font-size: 28px; }
  .hero__titulo { font-size: 32px; }
  .g2, .g3, .g4, .pie__grilla, .mega__grilla { grid-template-columns: repeat(1, minmax(0, 1fr)); }
  .g6, .g8 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .campos-2, .lista-check { grid-template-columns: repeat(1, minmax(0, 1fr)); }
  .ocultar-movil { display: none !important; }
  .btn-menu-movil { display: inline-flex; }
  .navegacion { display: none; position: absolute; left: 0; right: 0; top: 100%; background: #FFFFFF; border-bottom: 1px solid var(--borde); max-height: calc(100vh - 120px); overflow-y: auto; }
  .navegacion.abierta { display: block; }
  .menu { flex-direction: column; }
  .menu__boton { width: 100%; justify-content: space-between; padding: 16px; border-bottom: 1px solid var(--borde); }
  .mega { position: static; box-shadow: none; }
  .hero .contenedor { padding-top: 220px; padding-bottom: 16px; }
  .hero__tarjeta { padding: 24px; }
}

/* Encabezados de fila en tablas (nombre del proyecto) */
tbody th { background: none; color: inherit; font-weight: 700; padding: 14px 16px; text-align: left; border-bottom: 1px solid var(--borde); }
tbody tr:nth-child(even) th { background: var(--fondo-2); }
@media (max-width: 900px) {
  .barra-sup .contenedor { padding: 0; }
  .perfiles { width: 100%; overflow-x: auto; }
  .perfiles a { padding: 10px 12px; white-space: nowrap; }
  .utilidades { width: 100%; padding: 8px 16px; justify-content: space-between; }
}

/* Ajustes de encabezado: evitar saltos de línea en el menú */
.menu__boton { white-space: nowrap; padding-left: 12px; padding-right: 12px; }
.logo__lema { white-space: nowrap; }
@media (max-width: 1280px) { .logo__lema { display: none; } .menu__boton { font-size: 14px; padding-left: 9px; padding-right: 9px; } }
@media (max-width: 1100px) { .acciones-enc .btn { display: none; } }
@media (max-width: 1500px) { .logo__lema { display: none; } .menu__boton { font-size: 14.5px; padding-left: 10px; padding-right: 10px; } }
/* Menú tipo móvil desde 1220 px (Diseño lineal vertical 100% completo, compacto y legible) */
@media (max-width: 1220px) {
  .btn-menu-movil { display: inline-flex; }
  .navegacion {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    background: #FFFFFF;
    border-bottom: 2px solid var(--borde);
    max-height: calc(100vh - 76px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    box-shadow: 0 16px 36px rgba(10, 34, 25, .14);
    z-index: 100;
  }
  .navegacion.abierta { display: block; }
  .menu {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .menu > li {
    width: 100%;
    border-bottom: 1px solid var(--borde);
  }
  .menu__boton {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 18px;
    font-size: 15px;
    font-weight: 700;
    color: var(--verde-900);
    background: #FFFFFF;
    border: 0;
    white-space: normal;
    text-align: left;
    cursor: pointer;
  }
  .menu__boton[aria-expanded="true"] {
    background: var(--fondo-2);
    color: var(--verde-800);
    border-bottom: 1px solid var(--borde);
  }
  .menu__boton svg {
    flex-shrink: 0;
    transition: transform .2s ease;
  }
  .menu__boton[aria-expanded="true"] svg {
    transform: rotate(180deg);
  }
  .mega {
    position: static;
    box-shadow: none;
    background: var(--fondo-2);
    border: 0;
    padding: 0;
    width: 100%;
  }
  /* Forzar diseño lineal vertical completo para que NUNCA quede horizontal */
  .mega__grilla,
  .encabezado .mega .mega__grilla,
  .contenedor.mega__grilla {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 10px !important;
    padding: 12px 14px 18px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    align-items: stretch !important;
  }
  .mega__col {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 2px !important;
    background: #FFFFFF !important;
    border: 1px solid var(--borde) !important;
    border-radius: 8px !important;
    padding: 8px 10px !important;
    box-sizing: border-box !important;
    box-shadow: 0 1px 3px rgba(10, 34, 25, .03) !important;
  }
  .mega__col strong {
    display: block !important;
    color: var(--verde-700) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .06em !important;
    padding: 4px 6px 6px !important;
    margin-bottom: 3px !important;
    border-bottom: 1px solid rgba(18, 58, 43, .08) !important;
  }
  .mega__col a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    font-size: 13.5px !important;
    color: var(--texto-1) !important;
    text-decoration: none !important;
    padding: 7px 8px !important;
    border-radius: 6px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    transition: background .12s ease, color .12s ease, padding-left .12s ease !important;
  }
  .mega__col a:hover,
  .mega__col a:active {
    background: var(--fondo-2) !important;
    color: var(--verde-800) !important;
    font-weight: 600 !important;
    padding-left: 12px !important;
    text-decoration: none !important;
  }
  .mega__cta,
  .encabezado .mega .mega__cta {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    align-self: stretch !important;
    background: linear-gradient(135deg, var(--verde-900), var(--verde-800)) !important;
    color: #FFFFFF !important;
    border-radius: 8px !important;
    padding: 14px 16px !important;
    gap: 6px !important;
    box-sizing: border-box !important;
    margin-top: 4px !important;
  }
  .mega__cta strong {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #FFFFFF !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .mega__cta span {
    font-size: 12.5px !important;
    color: #CFDCD4 !important;
    line-height: 1.35 !important;
  }
  .mega__cta a {
    display: inline-flex !important;
    align-items: center !important;
    align-self: flex-start !important;
    color: var(--lima-500) !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    text-decoration: none !important;
    margin-top: 4px !important;
    padding: 5px 12px !important;
    border: 1px solid rgba(220, 240, 100, .3) !important;
    border-radius: 6px !important;
    background: rgba(255, 255, 255, .08) !important;
  }
}

/* ==========================================================================
   16. Páginas internas (componentes compartidos)
   ========================================================================== */
.migas { font-size: 13px; color: var(--texto-2); padding: 16px 0; }
.migas ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.migas li + li::before { content: "›"; margin-right: 6px; color: var(--borde-2); }
.migas a { color: var(--texto-2); }
.cabecera-pagina { background: var(--verde-800); color: #FFFFFF; padding: 48px 0; }
.cabecera-pagina h1 { color: #FFFFFF; font-size: 42px; font-weight: 800; }
.cabecera-pagina p { color: #CFDCD4; max-width: 720px; font-size: 17px; margin-top: 12px; }
.cabecera-pagina .kicker { color: var(--lima-500); }
.layout-lateral { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 40px; align-items: start; }
.lateral { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 100px; }
.caja-info { background: var(--fondo-2); border: 1px solid var(--borde); border-radius: var(--radio); padding: 22px; display: flex; flex-direction: column; gap: 10px; font-size: 14px; }
.caja-info h2, .caja-info h3 { font-size: 17px; }
.caja-info--lima { background: var(--lima-100); border-color: #DDE9B0; }
.caja-info ul { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 6px; }

/* Pasos numerados */
.pasos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; counter-reset: paso; }
.pasos li { counter-increment: paso; border: 1px solid var(--borde); border-radius: var(--radio); padding: 20px; background: #FFFFFF; display: flex; flex-direction: column; gap: 6px; font-size: 14px; }
.pasos li::before { content: counter(paso, decimal-leading-zero); font-size: 28px; font-weight: 800; color: var(--lima-500); }
.pasos strong { color: var(--verde-800); font-size: 16px; }

/* Formulario por bloques */
.form-bloque { border: 1px solid var(--borde); border-radius: var(--radio); padding: 24px; margin: 0 0 20px; background: #FFFFFF; }
.form-bloque legend { font-weight: 800; color: var(--verde-800); font-size: 18px; padding: 0 8px; margin-left: -8px; }
.form-bloque .ayuda { font-size: 13px; color: var(--texto-2); margin: 4px 0 16px; }
.obligatorio { color: #A12A1E; }
.campo .ayuda-campo { font-weight: 400; color: var(--texto-2); font-size: 12px; }
.campo input[aria-invalid="true"], .campo select[aria-invalid="true"], .campo textarea[aria-invalid="true"] { border-color: #A12A1E; box-shadow: 0 0 0 1px #A12A1E; }
.error-campo { color: #A12A1E; font-size: 12px; font-weight: 600; min-height: 0; }
.opciones-tarjeta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.opcion-tarjeta { position: relative; display: flex; gap: 12px; align-items: flex-start; border: 1.5px solid var(--borde-2); border-radius: var(--radio); padding: 16px; cursor: pointer; background: #FFFFFF; }
.opcion-tarjeta input { margin-top: 4px; width: 18px; height: 18px; accent-color: var(--verde-800); }
.opcion-tarjeta strong { display: block; color: var(--verde-800); }
.opcion-tarjeta span { font-size: 13px; color: var(--texto-2); }
.opcion-tarjeta:has(input:checked) { border-color: var(--verde-800); background: var(--lima-100); }
.zona-archivos { border: 2px dashed var(--borde-2); border-radius: var(--radio); padding: 24px; text-align: center; background: var(--fondo-2); display: flex; flex-direction: column; gap: 8px; align-items: center; }
.zona-archivos.arrastrando { border-color: var(--verde-800); background: var(--lima-100); }
.lista-archivos { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.lista-archivos li { display: flex; justify-content: space-between; align-items: center; gap: 12px; border: 1px solid var(--borde); border-radius: var(--radio-sm); padding: 10px 12px; font-size: 14px; background: #FFFFFF; }
.lista-archivos button { border: 0; background: transparent; color: #A12A1E; font-weight: 700; cursor: pointer; min-height: 32px; }
.alerta { border-radius: var(--radio); padding: 14px 16px; font-size: 14px; }
.alerta--error { background: #FBEAE8; color: #7D1E14; border: 1px solid #F0C4BE; }
.alerta--ok { background: var(--lima-100); color: var(--verde-800); border: 1px solid #DDE9B0; }
.confirmacion { text-align: center; display: flex; flex-direction: column; gap: 16px; align-items: center; padding: 48px 24px; border: 1px solid var(--borde); border-radius: var(--radio); background: #FFFFFF; }
.confirmacion__icono { width: 72px; height: 72px; border-radius: 50%; background: var(--lima-100); display: flex; align-items: center; justify-content: center; }
.radicado { font-size: 32px; font-weight: 800; color: var(--verde-800); letter-spacing: .04em; background: var(--fondo-2); border: 1px dashed var(--borde-2); border-radius: var(--radio); padding: 12px 24px; font-variant-numeric: tabular-nums; }
.tabla-resumen { text-align: left; max-width: 520px; width: 100%; }
.banner-comunicados { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; background: var(--fondo-2); border: 1px solid var(--borde); border-left: 6px solid var(--lima-500); border-radius: var(--radio); padding: 20px 24px; }

@media (max-width: 1000px) {
  .layout-lateral { grid-template-columns: minmax(0, 1fr); }
  .lateral { position: static; }
  .pasos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .cabecera-pagina h1 { font-size: 30px; }
  .opciones-tarjeta, .pasos { grid-template-columns: repeat(1, minmax(0, 1fr)); }
  .radicado { font-size: 22px; }
}
.etiqueta { display: block; }
.etiqueta .ayuda-campo { display: block; margin-top: 2px; }
.confirmacion, #resumen-errores { scroll-margin-top: 110px; }
.logo__nombre { white-space: nowrap; }
@media print { .barra-sup, .encabezado, .lateral, .pie, .gobierno, .whatsapp-flotante, .migas, .cabecera-pagina, .pasos, .banner-comunicados, .faq { display: none !important; } }

/* ---------- 17. Comunicados ---------- */
.barra-filtros { display: flex; flex-direction: column; gap: 14px; }
.buscador input { width: 100%; padding-left: 44px; background: #FFFFFF url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%234F5E56' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20 L16 16'/%3E%3C/svg%3E") no-repeat 14px center; }
.lista-comunicados { display: flex; flex-direction: column; gap: 24px; }
.comunicado-item { border: 1px solid var(--borde); border-radius: var(--radio); background: #FFFFFF; overflow: hidden; scroll-margin-top: 110px; }
.comunicado-item[hidden] { display: none; }
.comunicado-item__cabecera { padding: 28px 28px 8px; display: flex; flex-direction: column; gap: 12px; border-top: 6px solid var(--lima-500); }
.comunicado-item__meta { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 14px; color: var(--texto-2); }
.comunicado-item__titulo { font-size: 28px; font-weight: 800; }
.comunicado-item__resumen { font-size: 17px; color: var(--texto-2); }
.comunicado-item__cuerpo { padding: 8px 28px 8px; display: flex; flex-direction: column; gap: 14px; font-size: 16px; line-height: 1.75; max-width: 760px; }
.comunicado-item__cuerpo[hidden] { display: none; }
.comunicado-item__cuerpo h3 { font-size: 20px; font-weight: 800; margin-top: 12px; }
.comunicado-item__cuerpo ul { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 4px; }
.cita { margin: 8px 0; padding: 18px 22px; border-left: 4px solid var(--lima-500); background: var(--fondo-2); font-size: 19px; font-weight: 600; color: var(--verde-800); border-radius: 0 var(--radio) var(--radio) 0; }
.firma { font-weight: 700; color: var(--verde-800); }
.comunicado-item__pie { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; padding: 18px 28px; border-top: 1px solid var(--borde); background: var(--fondo-2); }
.compartir { display: flex; align-items: center; gap: 8px; }
.aviso-copiado { font-size: 13px; color: var(--verde-600); font-weight: 700; }
@media (max-width: 600px) {
  .comunicado-item__cabecera, .comunicado-item__cuerpo, .comunicado-item__pie { padding-left: 18px; padding-right: 18px; }
  .comunicado-item__titulo { font-size: 22px; }
}
@media print {
  .barra-filtros, #conteo-comunicados, .comunicado-item__pie, .comunicado-item.no-imprimir { display: none !important; }
  .layout-lateral { display: block; }
  .comunicado-item { border: 0; }
}

/* ---------- 18. Nosotros ---------- */
.cabecera-foto { position: relative; background: var(--verde-800); color: #FFFFFF; overflow: hidden; }
.cabecera-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; opacity: .35; }
.cabecera-foto .contenedor { position: relative; padding-top: 88px; padding-bottom: 88px; }
.cabecera-foto h1 { color: #FFFFFF; font-size: 48px; font-weight: 800; max-width: 760px; }
.cabecera-foto p { color: #E3ECE6; font-size: 18px; max-width: 680px; margin-top: 16px; }
.cabecera-foto .kicker { color: var(--lima-500); }
.indice-pagina { background: #FFFFFF; border-bottom: 1px solid var(--borde); position: sticky; top: 80px; z-index: 40; }
.indice-pagina ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; overflow-x: auto; }
.indice-pagina a { display: block; padding: 14px 14px; font-size: 14px; font-weight: 600; text-decoration: none; white-space: nowrap; border-bottom: 3px solid transparent; }
.indice-pagina a:hover, .indice-pagina a[aria-current="true"] { border-bottom-color: var(--lima-500); }
[id].ancla { scroll-margin-top: 150px; }
.cifras-claras { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.cifras-claras div { border: 1px solid var(--borde); border-radius: var(--radio); padding: 20px; }
.cifras-claras strong { display: block; font-size: 34px; font-weight: 800; color: var(--verde-800); line-height: 1.1; }
.cifras-claras span { font-size: 14px; color: var(--texto-2); }
.tarjeta-mv { border-radius: var(--radio); padding: 32px; display: flex; flex-direction: column; gap: 12px; }
.tarjeta-mv--verde { background: var(--verde-800); color: #FFFFFF; }
.tarjeta-mv--verde h3 { color: var(--lima-500); }
.tarjeta-mv--lima { background: var(--lima-100); border: 1px solid #DDE9B0; }
.tarjeta-mv h3 { font-size: 24px; font-weight: 800; }
.tarjeta-mv p { font-size: 17px; line-height: 1.7; }
.valor { border: 1px solid var(--borde); border-radius: var(--radio); padding: 24px; display: flex; flex-direction: column; gap: 10px; background: #FFFFFF; }
.valor__icono { width: 48px; height: 48px; border-radius: 12px; background: var(--lima-100); display: flex; align-items: center; justify-content: center; }
.valor h3 { font-size: 18px; }
.valor p { font-size: 15px; color: var(--texto-2); }
.linea-tiempo { list-style: none; margin: 0; padding: 0; position: relative; display: flex; flex-direction: column; gap: 0; }
.linea-tiempo::before { content: ""; position: absolute; left: 19px; top: 8px; bottom: 8px; width: 2px; background: var(--borde); }
.linea-tiempo li { position: relative; padding: 0 0 32px 64px; }
.linea-tiempo li::before { content: ""; position: absolute; left: 10px; top: 4px; width: 20px; height: 20px; border-radius: 50%; background: #FFFFFF; border: 4px solid var(--verde-800); }
.linea-tiempo li.hito::before { background: var(--lima-500); border-color: var(--verde-800); }
.linea-tiempo .fecha { font-size: 13px; font-weight: 700; color: var(--verde-500); text-transform: uppercase; letter-spacing: .06em; }
.linea-tiempo h3 { font-size: 20px; margin: 4px 0 6px; }
.linea-tiempo p { color: var(--texto-2); }
.pilar { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 24px; padding: 22px 0; border-bottom: 1px solid #2E5444; }
.pilar:last-child { border-bottom: 0; }
.pilar h3 { color: var(--lima-500) !important; font-size: 20px; }
.pilar p { color: #DDE7E0; font-size: 16px; }
@media (max-width: 900px) {
  .cabecera-foto h1 { font-size: 32px; }
  .cifras-claras { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pilar { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .indice-pagina { top: 80px; }
}

/* ---------- 19. Logo oficial ---------- */
.logo__img { height: 54px; width: auto; display: block; }
.pie__logo { width: 200px; height: auto; margin-bottom: 6px; }
@media (max-width: 600px) { .logo__img { height: 44px; } }

/* ---------- 20. Ficha de proyecto ---------- */
.galeria-hero { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 220px 220px; gap: 8px; border-radius: var(--radio); overflow: hidden; position: relative; }
.galeria-hero button { padding: 0; border: 0; cursor: zoom-in; background: var(--fondo-2); overflow: hidden; }
.galeria-hero button:first-child { grid-row: 1 / 3; }
.galeria-hero img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.galeria-hero button:hover img { transform: scale(1.03); }
.galeria-hero__todas { position: absolute; right: 16px; bottom: 16px; }
.ficha-titulo { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; padding: 28px 0; border-bottom: 1px solid var(--borde); }
.ficha-titulo__marca { display: flex; align-items: center; gap: 18px; }
.ficha-titulo__marca img { width: 84px; height: 84px; object-fit: contain; border: 1px solid var(--borde); border-radius: var(--radio); background: #FFFFFF; }
.ficha-titulo h1 { font-size: 40px; font-weight: 800; }
.ficha-titulo__ubicacion { color: var(--texto-2); display: flex; align-items: center; gap: 6px; }
.ficha-precio { text-align: right; }
.ficha-precio span { display: block; font-size: 13px; color: var(--texto-2); }
.ficha-precio strong { font-size: 32px; font-weight: 800; color: var(--verde-800); }
.datos-clave { width: 100%; }
.datos-clave th { background: none; color: var(--texto-2); font-weight: 600; padding: 10px 0; border-bottom: 1px solid var(--borde); }
.datos-clave td { padding: 10px 0; text-align: right; font-weight: 700; }
.datos-clave tr:nth-child(even) td, .datos-clave tr:nth-child(even) th { background: none; }
.caracteristicas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.caracteristica { border: 1px solid var(--borde); border-radius: var(--radio); padding: 16px; display: flex; flex-direction: column; gap: 6px; background: #FFFFFF; }
.caracteristica svg { color: var(--verde-500); }
.caracteristica span { font-size: 13px; color: var(--texto-2); }
.caracteristica strong { font-size: 18px; color: var(--verde-800); }

/* Slide / resumen de características clave (Áreas, distribución, parqueadero) */
.caracteristicas--resumen {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
  margin-bottom: 8px;
}
.caracteristicas--resumen .caracteristica {
  padding: 14px 16px;
  border: 1px solid var(--borde);
  border-radius: var(--radio);
  background: #FFFFFF;
  box-shadow: 0 2px 8px rgba(10, 34, 25, .04);
}
.caracteristicas--resumen .caracteristica span {
  font-size: 12px;
  color: var(--texto-2);
  text-transform: uppercase;
  letter-spacing: .03em;
  font-weight: 600;
}
.caracteristicas--resumen .caracteristica strong {
  font-size: 16.5px;
  color: var(--verde-800);
  font-weight: 700;
  line-height: 1.25;
}

.galeria-grilla { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.galeria-grilla button { padding: 0; border: 0; cursor: zoom-in; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--radio-sm); background: var(--fondo-2); }
.galeria-grilla img { width: 100%; height: 100%; object-fit: cover; }
.plano img { width: 100%; max-width: 720px; height: auto; border: 1px solid var(--borde); border-radius: var(--radio); background: #FFFFFF; }
.mapa, .video { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: var(--radio); overflow: hidden; border: 1px solid var(--borde); background: var(--fondo-2); }
.mapa iframe, .video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video__portada { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; cursor: pointer; background: #000; }
.video__portada img { width: 100%; height: 100%; object-fit: cover; opacity: .8; }
.video__play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 76px; height: 76px; border-radius: 50%; background: var(--lima-500); display: flex; align-items: center; justify-content: center; }

/* Visor de fotos */
.visor { position: fixed; inset: 0; background: rgba(5, 18, 13, .94); z-index: 200; display: none; align-items: center; justify-content: center; padding: 24px; }
.visor.abierto { display: flex; }
.visor img { max-width: min(1400px, 100%); max-height: 82vh; object-fit: contain; border-radius: 4px; }
.visor__pie { position: absolute; bottom: 20px; left: 0; right: 0; text-align: center; color: #DDE7E0; font-size: 14px; }
.visor button { position: absolute; background: rgba(255,255,255,.1); color: #FFFFFF; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; width: 52px; height: 52px; font-size: 22px; cursor: pointer; }
.visor button:hover { background: rgba(255,255,255,.2); }
.visor__cerrar { top: 20px; right: 20px; }
.visor__ant { left: 20px; top: 50%; transform: translateY(-50%); }
.visor__sig { right: 20px; top: 50%; transform: translateY(-50%); }
body.sin-scroll { overflow: hidden; }

@media (max-width: 900px) {
  .galeria-hero { grid-template-columns: 1fr 1fr; grid-template-rows: 240px 120px; }
  .galeria-hero button:first-child { grid-column: 1 / 3; grid-row: auto; }
  .galeria-hero button:nth-child(n+4) { display: none; }
  .caracteristicas:not(.caracteristicas--resumen), .galeria-grilla { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ficha-titulo h1 { font-size: 30px; }
  .ficha-precio { text-align: left; }

  /* Slide de características clave en mobile: texto más pequeño, compacto y deslizamiento horizontal táctil */
  .caracteristicas--resumen {
    display: flex !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    gap: 10px !important;
    padding: 6px 16px 12px !important;
    margin: 14px -16px 8px !important;
  }
  .caracteristicas--resumen::-webkit-scrollbar {
    display: none !important;
  }
  .caracteristicas--resumen .caracteristica {
    flex: 0 0 155px !important;
    min-width: 145px !important;
    max-width: 185px !important;
    scroll-snap-align: start !important;
    padding: 10px 12px !important;
    gap: 4px !important;
    border-radius: 8px !important;
    border: 1px solid var(--borde) !important;
    background: #FFFFFF !important;
    box-shadow: 0 2px 8px rgba(10, 34, 25, .06) !important;
  }
  .caracteristicas--resumen .caracteristica span {
    font-size: 11px !important;
    color: var(--texto-2) !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: block !important;
  }
  .caracteristicas--resumen .caracteristica strong {
    font-size: 13.5px !important;
    color: var(--verde-800) !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    display: block !important;
    white-space: normal !important;
  }

  /* Compactar todas las tarjetas de características en mobile para mejor adaptación */
  .caracteristica {
    padding: 10px 12px;
    gap: 4px;
  }
  .caracteristica span {
    font-size: 11.5px;
  }
  .caracteristica strong {
    font-size: 14px;
  }
}
@media (max-width: 420px) {
  .caracteristicas:not(.caracteristicas--resumen) {
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
  }
}
/* Galería con solo dos imágenes */
.galeria-hero--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: 448px; }
.galeria-hero--2 button:first-child { grid-row: auto; }
@media (max-width: 900px) { .galeria-hero--2 { grid-template-rows: 260px; } .galeria-hero--2 button:first-child { grid-column: auto; } }

/* ---------- 21. Listado de proyectos ---------- */
.panel-filtros { background: #FFFFFF; border: 1px solid var(--borde); border-radius: var(--radio); padding: 20px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; align-items: end; box-shadow: 0 10px 30px rgba(10,34,25,.06); }
.panel-filtros .acciones { display: flex; gap: 8px; }
.barra-resultados { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin: 24px 0 16px; }
.vistas { display: flex; border: 1px solid var(--borde-2); border-radius: var(--radio-sm); overflow: hidden; }
.vistas button { min-height: 40px; padding: 0 14px; border: 0; background: #FFFFFF; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.vistas button[aria-pressed="true"] { background: var(--verde-800); color: #FFFFFF; }
.lista-proyectos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.proyecto-card { border: 1px solid var(--borde); border-radius: var(--radio); overflow: hidden; background: #FFFFFF; display: grid; grid-template-columns: 1fr; transition: box-shadow .2s ease; }
.proyecto-card:hover { box-shadow: 0 16px 36px rgba(10,34,25,.10); }
.proyecto-card[hidden] { display: none; }
.proyecto-card__media { position: relative; display: block; }
.proyecto-card__media > img:first-child { width: 100%; height: 260px; object-fit: cover; display: block; }
.proyecto-card__logo { position: absolute; left: 16px; bottom: -28px; width: 64px; height: 64px; border-radius: var(--radio); border: 3px solid #FFFFFF; background: #FFFFFF; object-fit: contain; box-shadow: 0 4px 12px rgba(0,0,0,.12); }
.proyecto-card__etiquetas { position: absolute; top: 14px; left: 14px; display: flex; gap: 6px; flex-wrap: wrap; }
.proyecto-card__cuerpo { padding: 40px 22px 22px; display: flex; flex-direction: column; gap: 12px; }
.proyecto-card__titulo { font-size: 24px; font-weight: 800; }
.proyecto-card__titulo a { text-decoration: none; }
.proyecto-card__datos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--borde); border-bottom: 1px solid var(--borde); }
.proyecto-card__datos div { padding: 12px 0; display: flex; flex-direction: column; gap: 2px; }
.proyecto-card__datos div + div { padding-left: 14px; border-left: 1px solid var(--borde); }
.proyecto-card__datos span { font-size: 12px; color: var(--texto-2); }
.proyecto-card__datos strong { font-size: 16px; color: var(--verde-800); }
.proyecto-card__amenidades { display: flex; gap: 6px; flex-wrap: wrap; }
.proyecto-card__amenidades li { list-style: none; font-size: 12px; font-weight: 600; background: var(--fondo-2); border: 1px solid var(--borde); border-radius: 999px; padding: 4px 10px; }
.proyecto-card__amenidades { margin: 0; padding: 0; }
.proyecto-card__acciones { display: flex; gap: 10px; flex-wrap: wrap; }
.lista-proyectos--lista { grid-template-columns: 1fr; }
.lista-proyectos--lista .proyecto-card { grid-template-columns: 380px minmax(0, 1fr); }
.lista-proyectos--lista .proyecto-card__media > img:first-child { height: 100%; min-height: 300px; }
.sin-resultados { text-align: center; padding: 48px 24px; border: 1px dashed var(--borde-2); border-radius: var(--radio); }
.entregados { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.entregado { position: relative; border-radius: var(--radio); overflow: hidden; min-height: 260px; display: flex; align-items: flex-end; color: #FFFFFF; text-decoration: none; background: var(--verde-800); }
.entregado img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.entregado:hover img { transform: scale(1.04); }
.entregado::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,34,25,0) 35%, rgba(10,34,25,.85) 100%); }
.entregado div { position: relative; z-index: 1; padding: 18px; }
.entregado strong { display: block; font-size: 20px; }
.entregado span { font-size: 13px; color: #DDE7E0; }
@media (max-width: 1100px) { .panel-filtros { grid-template-columns: repeat(2, minmax(0, 1fr)); } .panel-filtros .acciones { grid-column: 1 / -1; } }
@media (max-width: 900px) {
  .lista-proyectos, .lista-proyectos--lista { grid-template-columns: 1fr; }
  .lista-proyectos--lista .proyecto-card { grid-template-columns: 1fr; }
  .entregados { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) { .panel-filtros { grid-template-columns: 1fr; } .entregados { grid-template-columns: 1fr; } }
.lista-proyectos--lista .proyecto-card__logo { display: none; }
.lista-proyectos--lista .proyecto-card__cuerpo { padding-top: 22px; }

/* ---------- 22. Contacto ---------- */
.canales { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: -48px; position: relative; }
.canal { background: #FFFFFF; border: 1px solid var(--borde); border-radius: var(--radio); padding: 22px; display: flex; flex-direction: column; gap: 8px; text-decoration: none; color: var(--texto); box-shadow: 0 10px 30px rgba(10,34,25,.06); transition: border-color .15s ease, transform .15s ease; }
a.canal:hover { border-color: var(--lima-500); transform: translateY(-2px); }
.canal__icono { width: 46px; height: 46px; border-radius: 12px; background: var(--lima-100); display: flex; align-items: center; justify-content: center; }
.canal strong { color: var(--verde-800); font-size: 17px; }
.canal span { font-size: 14px; color: var(--texto-2); }
.canal .dato { font-size: 16px; font-weight: 700; color: var(--verde-800); word-break: break-word; }
.lista-asesores { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.lista-asesores li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--borde); font-size: 14px; }
.lista-asesores li:last-child { border-bottom: 0; }
.lista-asesores a { font-weight: 700; white-space: nowrap; }
.salas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.sala { border: 1px solid var(--borde); border-radius: var(--radio); padding: 20px; display: flex; flex-direction: column; gap: 6px; background: #FFFFFF; font-size: 14px; }
.sala strong { color: var(--verde-800); font-size: 16px; }
@media (max-width: 1000px) { .canales { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .canales, .salas { grid-template-columns: 1fr; } }

/* ==========================================================================
   23. PÁGINAS DE GUÍA, PROPIETARIOS Y LEGALES
   ========================================================================== */
.pasos--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pasos--vertical { grid-template-columns: minmax(0, 1fr); }
.pasos--vertical li { flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; }
.pasos--vertical li::before { min-width: 44px; }
.pasos--vertical li strong { flex: 1 1 60%; }
.pasos--vertical li > span { flex-basis: 100%; padding-left: 58px; color: var(--texto-2); }
.bloque { display: flex; flex-direction: column; gap: 14px; scroll-margin-top: 110px; }
.bloque h2 { font-size: 26px; color: var(--verde-900); line-height: 1.2; }
.bloque h3 { font-size: 18px; color: var(--verde-800); margin-top: 6px; }
.bloque p, .bloque li { color: var(--texto-2); }
.bloque ul:not(.lista-check), .bloque ol:not(.pasos) { padding-left: 20px; display: flex; flex-direction: column; gap: 6px; margin: 0; }
.fuente { font-size: 12px; color: var(--texto-2); }
.fuente a { color: inherit; }
.comparativo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.comparativo > div { border: 1px solid var(--borde); border-radius: var(--radio); padding: 22px; background: #FFFFFF; display: flex; flex-direction: column; gap: 10px; }
.comparativo h3 { font-size: 19px; color: var(--verde-800); }
.calc-resultado { background: var(--verde-800); color: #FFFFFF; border-radius: var(--radio); padding: 22px; display: flex; flex-direction: column; gap: 6px; }
.calc-resultado span { color: #CFDCD4; font-size: 14px; }
.calc-resultado strong { font-size: 30px; font-weight: 800; color: #FFFFFF; }
.etapas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.etapas li { font-size: 12px; text-align: center; padding-top: 14px; border-top: 5px solid var(--borde); color: var(--texto-2); }
.etapas li.hecho { border-top-color: var(--verde-500); color: var(--verde-800); font-weight: 600; }
.etapas li.actual { border-top-color: var(--lima-500); color: var(--verde-900); font-weight: 800; }
.avance { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 24px; border: 1px solid var(--borde); border-radius: var(--radio); padding: 20px; background: #FFFFFF; align-items: center; scroll-margin-top: 110px; }
.avance img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 6px; }
.avance__datos { display: flex; flex-wrap: wrap; gap: 8px 24px; font-size: 14px; color: var(--texto-2); }
.servicios { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.servicio { border: 1px solid var(--borde); border-radius: var(--radio); padding: 22px; background: #FFFFFF; display: flex; flex-direction: column; gap: 8px; text-decoration: none; color: inherit; }
.servicio:hover { border-color: var(--verde-800); }
.servicio strong { color: var(--verde-800); font-size: 17px; }
.servicio span { font-size: 14px; color: var(--texto-2); }
.servicio .acceso__icono { margin-bottom: 4px; }
.doc-legal { max-width: 860px; }
.doc-legal h2 { font-size: 22px; color: var(--verde-900); margin-top: 18px; scroll-margin-top: 110px; }
.doc-legal p, .doc-legal li { color: var(--texto-2); }
.doc-legal ol, .doc-legal ul { padding-left: 22px; display: flex; flex-direction: column; gap: 6px; }
.buscador-grande { display: flex; gap: 10px; }
.buscador-grande input { flex: 1; font-size: 18px; padding: 14px 16px; border: 1px solid var(--borde); border-radius: var(--radio); }
.resultados-busqueda { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.resultados-busqueda li { border: 1px solid var(--borde); border-radius: var(--radio); padding: 16px 18px; background: #FFFFFF; }
.resultados-busqueda a { font-weight: 700; font-size: 17px; }
.resultados-busqueda small { display: block; color: var(--verde-500); font-weight: 600; margin-bottom: 2px; }
.resultados-busqueda p { margin-top: 4px; color: var(--texto-2); font-size: 14px; }
.cat-faq { display: flex; flex-wrap: wrap; gap: 8px; }
.error-404 { text-align: center; padding: 72px 0; display: flex; flex-direction: column; align-items: center; gap: 16px; }
.error-404 strong { font-size: 96px; line-height: 1; color: var(--lima-500); font-weight: 800; }
@media (max-width: 1080px) {
  .servicios { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .etapas { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: 14px; }
}
@media (max-width: 720px) {
  .pasos--3, .comparativo, .servicios { grid-template-columns: minmax(0, 1fr); }
  .avance { grid-template-columns: minmax(0, 1fr); }
  .etapas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pasos--vertical li > span { padding-left: 0; }
  .buscador-grande { flex-direction: column; }
}
.calc-resultado table tr, .calc-resultado table td { background: transparent !important; color: #FFFFFF; border-color: rgba(255,255,255,.15); }
.pasos--vertical li > span { color: var(--texto-2); }

/* Barra superior con frase de bienvenida */
.barra-sup--frase .contenedor { justify-content: center; }
.frase-sup { margin: 0; padding: 9px 0; font-size: 14px; font-weight: 500; color: #FFFFFF; text-align: center; letter-spacing: .01em; }
.frase-sup strong { color: var(--lima-500); font-weight: 700; }

/* Menú: enlace directo "Proyectos" y filtros rápidos del listado */
.menu__enlace { text-decoration: none; }
.menu__enlace[aria-current="page"] { border-bottom-color: var(--lima-500); }
.filtros-rapidos { margin-top: 24px; flex-wrap: wrap; }
.filtros-rapidos a.filtro { text-decoration: none; color: var(--verde-800); display: inline-flex; align-items: center; }

/* Comercializador autorizado (sin líneas ni franja roja) */
.comercializador { margin-top: 28px; display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 28px; align-items: center; padding: 22px 28px; background: #FFFFFF; border: none !important; border-left: none !important; border-radius: var(--radio); }
.comercializador img { width: 100%; height: auto; }
.comercializador__titulo { font-size: 19px; font-weight: 700; color: var(--verde-900); line-height: 1.3; margin: 0; }
.comercializador .texto-2 { margin: 0; font-size: 15px; }
.comercializador__datos { display: flex; flex-wrap: wrap; gap: 6px 20px; margin: 4px 0 0; font-size: 14px; font-weight: 600; }
@media (max-width: 720px) {
  .comercializador { grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 20px; }
  .comercializador img { width: 140px; }
}

/* Comercializador simplificado en fichas de proyectos (debajo del formulario de asesor) */
.comercializador-simple {
  margin-top: 14px;
  padding: 14px 0 0;
  display: flex;
  align-items: center;
  gap: 14px;
  background: transparent;
  border: none !important;
  border-left: none !important;
}
.comercializador-simple img {
  width: 72px;
  height: auto;
  flex-shrink: 0;
  object-fit: contain;
}
.comercializador-simple__texto {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.comercializador-simple .kicker {
  font-size: 11px;
  font-weight: 700;
  color: var(--verde-700);
  text-transform: uppercase;
  letter-spacing: .04em;
  margin: 0;
  line-height: 1.2;
}
.comercializador-simple__titulo {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--verde-900);
  line-height: 1.35;
  margin: 0;
}

/* Campo de tasa inamovible (readonly) del simulador */
.campo input[readonly],
.campo select:disabled {
  background-color: #F1F5F2;
  color: var(--verde-900);
  font-weight: 700;
  cursor: default;
  border-color: var(--borde-2);
  user-select: none;
}
.campo input[type="number"][readonly]::-webkit-inner-spin-button,
.campo input[type="number"][readonly]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.campo input[type="number"][readonly] {
  -moz-appearance: textfield;
}

/* Logo de cada proyecto en las tarjetas del inicio */
.tarjeta__media { position: relative; }
.tarjeta__logo { position: absolute; left: 16px; bottom: -32px; width: 76px; height: 76px; object-fit: contain; background: #FFFFFF; border: 3px solid #FFFFFF; border-radius: var(--radio); box-shadow: 0 4px 14px rgba(0,0,0,.14); }
.tarjeta__media + .tarjeta__cuerpo { padding-top: 46px; }

/* Columnas del menú desplegable alineadas arriba (solo en escritorio) */
@media (min-width: 1221px) {
  .encabezado .mega .mega__grilla { align-items: start; }
  .encabezado .mega .mega__cta { align-self: center; }
}

/* Pie de fuente sobre fondo oscuro */
.fuente--oscura { color: #CFDCD4; font-size: 13px; margin: 0; }
.fuente--oscura a { color: var(--lima-500); font-weight: 600; }

/* Valores del inicio: una columna, descripción en peso normal */
#panel-valores .lista-check { grid-template-columns: minmax(0, 1fr); }
#panel-valores .lista-check li { font-weight: 400; }
#panel-valores .lista-check strong { font-weight: 700; color: var(--verde-800); }

/* Barra de gobierno corporativo con 5 enlaces */
@media (min-width: 1081px) { .gobierno .g6 { grid-template-columns: repeat(5, minmax(0, 1fr)); } }

/* Video de fondo del hero */
.hero__video { background: var(--verde-800); }

/* ---------- Corredizo de Proyectos (Home) ---------- */
.carrusel-proyectos { position: relative; margin-top: 14px; }
.carrusel-proyectos__pista {
  display: flex; gap: 20px; overflow-x: auto; scroll-behavior: smooth;
  scroll-snap-type: x mandatory; padding: 12px 4px 28px; margin: 0 -4px;
  -webkit-overflow-scrolling: touch; scrollbar-width: none;
}
.carrusel-proyectos__pista::-webkit-scrollbar { display: none; }
.carrusel-proyectos__pista .tarjeta {
  flex: 0 0 calc(33.333% - 14px); min-width: 290px;
  scroll-snap-align: start; transition: transform .25s ease, box-shadow .25s ease;
}
.carrusel-proyectos__pista .tarjeta:hover {
  transform: translateY(-4px); box-shadow: 0 12px 24px rgba(0,0,0,.09);
}
.carrusel-btn {
  position: absolute; top: calc(50% - 22px); transform: translateY(-50%);
  width: 46px; height: 46px; border-radius: 50%; background: #FFFFFF;
  border: 1.5px solid var(--borde-2); color: var(--verde-800);
  box-shadow: 0 4px 16px rgba(0,0,0,.14); display: flex; align-items: center;
  justify-content: center; cursor: pointer; z-index: 10; transition: all .2s ease;
}
.carrusel-btn:hover {
  background: var(--verde-800); color: #FFFFFF; border-color: var(--verde-800);
  transform: translateY(-50%) scale(1.06);
}
.carrusel-btn--prev { left: -22px; }
.carrusel-btn--next { right: -22px; }
.carrusel-controles {
  display: flex; justify-content: center; align-items: center; gap: 10px; margin-top: 6px;
}
.carrusel-indicadores { display: flex; gap: 8px; align-items: center; }
.carrusel-punto {
  width: 10px; height: 10px; border-radius: 5px; background: var(--borde-2);
  border: 0; cursor: pointer; padding: 0; transition: all .25s ease;
}
.carrusel-punto.activo { background: var(--verde-800); width: 26px; }
.carrusel-pausa {
  border: 0; background: transparent; color: var(--texto-2); cursor: pointer;
  display: flex; align-items: center; justify-content: center; padding: 4px;
  border-radius: 4px; margin-left: 8px;
}
.carrusel-pausa:hover { color: var(--verde-800); }

@media (max-width: 1080px) {
  .carrusel-proyectos__pista .tarjeta { flex: 0 0 calc(50% - 10px); }
  .carrusel-btn--prev { left: -12px; }
  .carrusel-btn--next { right: -12px; }
}
@media (max-width: 680px) {
  .carrusel-proyectos__pista .tarjeta { flex: 0 0 calc(88% - 8px); }
  .carrusel-btn { display: none; }
}