.elementor-6635 .elementor-element.elementor-element-2997ebd button{font-size:14px;}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-654857f *//* ===== Calc Metodología (scoped) ===== */
#calc-metodo .metodo-grid{ display:grid; gap:16px; }
#calc-metodo .rep-cards-grid{ margin-top:8px; }
#calc-metodo .rep-card p{ margin:.3rem 0 .5rem; }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-4a2ab8c */#calc-informe > .container{
display:grid; grid-template-columns: 460px 1fr; gap:20px; align-items:start;
}
/* Columna izquierda: figura centrada y sticky suave (affix) */
#calc-informe .result-banner.result-banner–contained{
grid-column:1; grid-row:1 / span 4;
position:sticky; top:24px;
margin:0 auto; /* centra dentro de su columna */
border:1px solid var(–rep-border); border-radius:16px; box-shadow:var(–rep-shadow-sm);
background:#fff; overflow:visible; isolation:isolate;
max-width:340px; width:100%;
}
/* Imagen: sin recorte lateral (contain) */
#calc-informe .result-banner.result-banner–contained img.result-banner{
display:block; width:100%; height:auto;
object-fit:contain; /* evita cortes */
/* sin aspect-ratio forzado */
}
/* Halo mint sutil que no invade el texto */
#calc-informe .result-banner.result-banner–contained::before{
content:»»; position:absolute; inset:-6% -4% -10% -4%; z-index:-1;
background:radial-gradient(40% 28% at 20% 15%, rgba(146,241,203,.22), transparent 60%),
radial-gradient(28% 22% at 85% 12%, rgba(65,153,159,.16), transparent 60%);
filter:blur(16px); opacity:.9; pointer-events:none;
}
/* Columna derecha: compacidad y ancho legible */
#calc-informe > .container > h2,
#calc-informe > .container > p,
#calc-informe > .container > .metrics-3,
#calc-informe > .container > .rep-text-center{
grid-column:2; max-width:680px; margin-left:auto; margin-right:auto;
}
/* Ajustes de ritmo vertical para que no se vea «separado» */
#calc-informe h2{ margin:0 0 8px; }
#calc-informe > .container > p{ margin:0 0 10px; }
#calc-informe .metrics-3{ margin-top:8px; }
#calc-informe .metric{ align-items:flex-start; }
#calc-informe figcaption{ text-align:center; margin-top:6px; color:var(–rep-text-muted); }
/* Responsive tablet/móvil */
@media (max-width:980px){
#calc-informe > .container{ grid-template-columns:1fr; gap:14px; }
#calc-informe .result-banner.result-banner–contained{
position:relative; top:auto; order:-1;
max-width:520px; width:100%; margin:0 auto;
}
#calc-informe > .container > h2,
#calc-informe > .container > p,
#calc-informe > .container > .metrics-3,
#calc-informe > .container > .rep-text-center{ grid-column:1; max-width:680px; }
}
@media (max-width:600px){
#calc-informe .result-banner.result-banner–contained{ max-width:100%; border-radius:14px; }
#calc-informe .result-banner.result-banner–contained::before{ inset:-10% -6% -12% -6%; filter:blur(14px); opacity:.8; }
#calc-informe .metrics-3{ grid-template-columns:1fr; }
}
/* Seguridad: nada debe empujar de ancho en móvil */
#calc-informe .result-banner.result-banner–contained,
#calc-informe .result-banner.result-banner–contained *{ max-width:100%; box-sizing:border-box; }
.elementor-6635 .elementor-element.elementor-element-4a2ab8c a{font-size:14px}
/* ===== #calc-informe · Métricas con icono arriba ===== */
/* Fuerza layout vertical dentro de cada tarjeta */
#calc-informe .metrics-3 .metric{
display:flex; /* sobreescribe el display:flex horizontal global */
flex-direction:column; /* icono arriba, texto debajo */
align-items:left; /* centra icono y bloque de texto */
text-align:left; /* títulos y copy centrados */
gap:8px; /* respiro entre icono y texto */
}
/* Contenedor del icono sin dimensiones rígidas del global */
#calc-informe .metrics-3 .metric .img{
flex:0 0 auto;
width:65px; height:65px;
padding:0; /* por si el global añade padding */
margin:0 0 4px 0;
border:0; /* quita borde si lo hereda; elimina esta línea si lo quieres */
background:transparent; /* limpia fondo heredado */
display:flex; align-items:center; justify-content:start;
}
/* Icono escalable y controlado */
#calc-informe .metrics-3 .metric .img img{
display:block;
max-height:64px; /* tamaño cómodo */
width:auto; height:auto;
}
/* Texto ocupa ancho completo de la card */
#calc-informe .metrics-3 .metric .txt{
width:100%;
}
/* Opcional: ajusta los headings para compacidad */
#calc-informe .metrics-3 .metric .txt .rep-heading-3{
margin:0 0 4px;
}
/* Responsivo (si quieres forzar 1 columna antes) */
@media (max-width:900px){
#calc-informe .metrics-3{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
#calc-informe .metrics-3{ grid-template-columns:1fr; }
}
/* === Mobile fix === */
@media (max-width: 900px) {
#calc-informe .ctas {
display: flex;
flex-direction: column;
align-items: stretch;
gap: 10px;
margin-top: 14px;
}
#calc-informe .ctas a {
display: block;
width: 100%;
text-align: center;
white-space: normal; /* permite saltos de línea */
line-height: 1.2;
}
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f899fa0 *//* === Mobile fix === */
@media (max-width: 900px) {
.elementor-6635 .elementor-element.elementor-element-f899fa0 .ctas {
display: flex;
flex-direction: column;
align-items: stretch;
gap: 10px;
margin-top: 14px;
}
.elementor-6635 .elementor-element.elementor-element-f899fa0 .ctas a {
display: block;
width: 100%;
text-align: center;
white-space: normal; /* permite saltos de línea */
line-height: 1.2;
}
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-9541b63 *//* ===== Calc FAQ (scoped) ===== */
#calc-faq details summary{ cursor:pointer; list-style:none; position:relative; padding-right:18px; }
#calc-faq details summary::after{ content:»▾»; position:absolute; right:0; top:0; opacity:.6; transition:transform .2s ease; }
#calc-faq details[open] summary::after{ transform:rotate(-180deg); }/* End custom CSS */
Análisis de Sostenibilidad Web
Descubre el impacto ambiental y la salud técnica de tu sitio en cuestión de minutos.
Recopilando datos de rendimiento y huella de carbono…
Calcula la huella digital de tu website
Analiza en segundos el impacto ambiental y el rendimiento de tu sitio web. Nuestra calculadora combina los datos de PageSpeed Insights, CO2.js y Website Carbon para estimar el consumo energético y las emisiones por visita.
- Identifica cuánto CO₂ genera tu web por cada visita.
- Evalúa la eficiencia de tu hosting y de tus recursos digitales.
- Recibe un informe de auditoría ecológica con consejos para optimizarlo.
Cómo calculamos tu huella digital
Usamos el modelo de Web Sostenible (Green Web Foundation) para estimar CO₂/visita y energía por carga, incorporando datos de PageSpeed Insights para rendimiento y de Website Carbon como referencia externa.
CO2.js (modelo SWD)
Estimación de emisiones por página con factores de intensidad eléctrica y tamaño de transferencia.
PageSpeed / Lighthouse
Métricas de rendimiento, accesibilidad y SEO técnico para priorizar acciones con impacto.
Website Carbon (referencia)
Contrastamos resultados con el índice público de Website Carbon para coherencia.
Informe ecológico en un clic
Recibirás un informe con los indicadores clave de sostenibilidad y rendimiento, más recomendaciones priorizadas para reducir emisiones y mejorar Core Web Vitals.
CO₂ por visita
Estimación con CO2.js y contraste Website Carbon. Equivalencias para entender el impacto.
Energía por carga
kWh estimados por página y ahorro potencial tras las optimizaciones sugeridas.
Lighthouse
Performance, Accesibilidad, SEO y Best Practices para priorizar qué arreglar primero.
Plan de mejora: de diagnóstico a resultados
Te proponemos un itinerario claro para reducir la huella digital y mejorar tu posicionamiento orgánico, con entregables y métricas comparables mes a mes.
Optimización WPO
Minimiza transferencias, comprime imágenes y estabiliza el TTFB.
- Mantenimiento WordPress (actualizaciones seguras).
- Hosting WordPress con LiteSpeed + Redis.
Diseño web sostenible
Arquitectura de la información y UI eficientes que cargan menos y convierten más.
- Patrones de baja huella y buenas prácticas.
- Medición continua con Eco Report.
Seguimiento y reporting
Compara emisiones y Core Web Vitals antes/después con informes periódicos.
- Alertas y priorización por impacto.
- Histórico de informes.
