/* ==========================================================================
   LCS · Home. Se carga después de lcs-ref.css (diseño de referencia, de A) solo en la plantilla home.
   La Home usa las clases de la maqueta (.hero, .pillars, .ecosystem, .proof, .about-glance, .technologies,
   .projects, .sustainability, .partners, .contact); aquí van solo los ajustes que exige el marcado del CMS:
   textos del CMS en minúscula que la maqueta muestra en mayúscula, listas semánticas (ol/ul) en lugar de
   div, encabezados h2 en las tarjetas bajo la portada, la imagen de portada como <img> y la franja de
   contacto sin formulario.
   ========================================================================== */

/* --- Mayúsculas de la maqueta (el CMS guarda el texto en minúscula normal) --- */
.lcs-pagina--home .hero h1,
.lcs-pagina--home .hero-top,
.lcs-pagina--home .hero-caption,
.lcs-pagina--home .section-title,
.lcs-pagina--home .ecosystem h2,
.lcs-pagina--home .proof-intro h2,
.lcs-pagina--home .pillar-titulo,
.lcs-pagina--home .flowstep h3,
.lcs-pagina--home .proof-card h3,
.lcs-pagina--home .about-triad b,
.lcs-pagina--home .tech-card h3,
.lcs-pagina--home .text-link,
.lcs-pagina--home .service-header b,
.lcs-pagina--home .service-expand a,
.lcs-pagina--home .project-kicker,
.lcs-pagina--home .project-body h3,
.lcs-pagina--home .project-body a,
.lcs-pagina--home .sustain-item h3,
.lcs-pagina--home main .button { text-transform: uppercase; }

/* En la maqueta los títulos sin color propio heredan el de su sección (blanco en las franjas oscuras).
   :where() deja especificidad 0,0,1: gana a la regla base de lcs.css y pierde ante las clases de lcs-ref.css. */
:where(.lcs-pagina--home main) :is(h2, h3, h4) { color: inherit; font-family: inherit; }

/* Listas semánticas con el aspecto de los div de la maqueta */
.lcs-pagina--home .ecosystem-flow,
.lcs-pagina--home .partners-tags { list-style: none; margin: 0; padding: 0; }

/* --- Portada: imagen del CMS como <img> prioritaria (reemplaza el fondo CSS de .hero:before) --- */
.home-hero--img::before { content: none; }
.home-hero-img {
  position: absolute; top: 0; left: 26%;
  width: 74%; height: 100%; max-width: none;
  object-fit: cover; object-position: right center; opacity: .99;
}
.lcs-pagina--home .hero h1 .gradient-text { display: block; }
.lcs-pagina--home .hero-top { margin: 0 0 17px; }

/* --- Pilares: título h2 (jerarquía) con la medida del h3 de la maqueta --- */
.lcs-pagina--home .pillar-titulo { margin: 0 0 4px; font-size: 15px; font-weight: 950; line-height: 1.18; color: var(--ink); letter-spacing: 0; }
.lcs-pagina--home .pillar { color: var(--ink); }
.lcs-pagina--home .pillar > div { flex: 1; min-width: 0; }

/* --- AURA + NEUROLINK --- */
.lcs-pagina--home .ecosystem .eyebrow { color: #54ebd3; }
.lcs-pagina--home .ecosystem h2 { color: #fff; }
.lcs-pagina--home .flow-media img { position: absolute; inset: 0; }

/* --- Validación --- */
.lcs-pagina--home .proof-intro h2 { color: var(--navy); font-weight: 900; letter-spacing: -.03em; }
.lcs-pagina--home .proof-photo img { position: absolute; inset: 0; }

/* --- Nosotros de un vistazo --- */
.home-about-boton { margin-top: 25px; }
/* El título de Nosotros del CMS es más largo que el de la maqueta: un punto menos de tamaño. */
.lcs-pagina--home .about-glance .section-title { font-size: clamp(30px, 3.3vw, 46px); }

/* --- Encabezados con botón a la derecha (tecnologías, proyectos) --- */
.lcs-pagina--home .section-heading > .button { flex: none; }
.lcs-pagina--home .section-heading .section-lead { margin-bottom: 0; }

/* --- Tarjetas de tecnología: enlace con el color de texto de la maqueta --- */
.lcs-pagina--home .tech-card { display: block; color: var(--ink); }

/* --- Soluciones y servicios --- */
.lcs-pagina--home .services-side .button { margin-top: 6px; }
.lcs-pagina--home .service-item summary { color: var(--ink); }
.lcs-pagina--home .service-plus { transition: transform .2s ease; }

/* --- Proyectos --- */
.home-projects-nota { font-size: 12px; color: #5f7885; margin: 19px 0 0; }

/* --- Sostenibilidad: acento verde claro de la maqueta en las últimas palabras del título --- */
.home-sustain-accent { color: #67e4b3; }

/* --- Alianzas: etiquetas como lista --- */
.lcs-pagina--home .partners-tags { display: flex; flex-wrap: wrap; gap: 9px; }
.lcs-pagina--home .partners-tags li { font-size: 11px; color: #0a7a80; background: #fff; border: 1px solid #d5eaec; padding: 8px 12px; border-radius: 20px; font-weight: 750; }

/* --- Contacto: franja de cierre con botón a /contacto/ (el formulario vive en esa página) --- */
.home-contact .contact-grid { align-items: center; }
.home-contact-panel {
  display: grid; justify-items: start; gap: 20px;
  background: #fff; border: 1px solid #dcebed; border-radius: 20px; padding: 30px; box-shadow: var(--shadow);
}
.home-contact-panel .contact-note { margin: 0; width: 100%; }

@media (max-width: 1300px) {
  .lcs-pagina--home .pillar-titulo { font-size: 13px; }
}

@media (max-width: 700px) {
  .home-hero-img { top: 295px; left: 0; width: 100%; height: calc(100% - 295px); object-position: center; }
  .home-contact-panel { padding: 20px; }
  .lcs-pagina--home .service-expand { padding: 0 20px 20px; }
  .home-contact-panel .button { width: 100%; }
}

@media (max-width: 420px) {
  .home-hero-img { top: 350px; height: calc(100% - 350px); }
}

@media (prefers-reduced-motion: reduce) {
  .lcs-pagina--home .service-plus { transition: none; }
}

/* Orquestador: la imagen lateral de validación trae la frase escrita; se muestra entera (700×420) en vez de recortarla. */
.lcs-body .proof-nature { min-height: 0; aspect-ratio: 5 / 3; align-self: center; }
