/* RENOVAM — Ecotecnologías */
function App() {
  window.useReveal();
  return (
    <>
      <window.SiteNav />
      <window.Crumb items={[{label:'Inicio', href:'index.html'}, {label:'Ecotecnologías'}]} />
      <window.PageHero
        eyebrow="Más allá del solar"
        title={<>Ecotecnologías <em style={{fontStyle:'italic', fontFamily:'Syne, serif', color:'var(--ink-dim)', fontWeight:300}}>integrales.</em></>}
        sub="La visión futura de RENOVAM: un ecosistema que combina solar, geotermia, agua y diseño bioclimático para construir el primer hogar verdaderamente autosustentable mexicano."
      />

      <section className="section-pad">
        <div className="container">
          <div className="section-header reveal">
            <div>
              <div className="eyebrow">Líneas en desarrollo</div>
              <h2 style={{marginTop:18}}>Diseñamos casas que <em>se mantienen solas.</em></h2>
            </div>
            <p>Cada línea ecotecnológica complementa al solar. Combinadas, una vivienda puede operar con 5–10% del consumo eléctrico y de agua de una casa convencional.</p>
          </div>
          <div className="feature-grid reveal-stagger">
            {[
              ['Geotermia','Climatización por intercambio de calor con el subsuelo. 4× más eficiente que aires convencionales.'],
              ['Solar térmica','Calentadores solares de agua de tubo evacuado. Reemplaza calentador de gas para regaderas y cocina.'],
              ['Tratamiento de aguas grises','Filtración de agua de regaderas y lavabos para uso en jardín y WC. Reduce consumo 40%.'],
              ['Captación pluvial','Cisternas con filtros de primer escurrimiento. Aprovecha la temporada de lluvias.'],
              ['Riego automático','Sistemas con sensores de humedad, programación inteligente y agua reciclada.'],
              ['Diseño bioclimático','Orientación, ventilación cruzada, masa térmica. Reduce 60% la necesidad de climatización.'],
              ['Construcción autosustentable','Asesoría integral para proyectos nuevos: bambú, adobe, ferrocemento, paneles SIP.'],
              ['Aislamiento térmico','Reflectivos en techo, doble vidrio, juntas selladas. ROI menor a 3 años.'],
              ['Consultoría LEED','Acompañamos certificación LEED y EDGE para construcciones comerciales.'],
            ].map(([t, d], i) => (
              <div className="feature" key={i}>
                <div className="feature-icon">
                  <svg width="22" height="22" viewBox="0 0 24 24" fill="none"><path d="M12 2C8 6 6 10 6 14a6 6 0 0012 0c0-4-2-8-6-12z" stroke="white" strokeWidth="2" strokeLinejoin="round"/></svg>
                </div>
                <h4>{t}</h4>
                <p>{d}</p>
              </div>
            ))}
          </div>
        </div>
      </section>

      <section className="cta-strip section-pad">
        <div className="container">
          <div className="cta-inner reveal">
            <div>
              <div className="eyebrow" style={{color:'rgba(255,255,255,0.85)'}}>Proyectos integrales</div>
              <h2 style={{marginTop:18}}>¿Construyes? Hablemos antes de los planos.</h2>
            </div>
            <div className="cta-actions">
              <a href="agenda.html" className="btn btn-primary">Agenda consultoría →</a>
              <a href="https://wa.me/527778297622" target="_blank" rel="noopener" className="btn btn-ghost">WhatsApp directo</a>
            </div>
          </div>
        </div>
      </section>

      <window.SiteFooter />
      <window.WaFab />
    </>
  );
}
ReactDOM.createRoot(document.getElementById('root')).render(<App />);