/*
 * Página "Acerca de" (ID 157). Estructura y textos en Elementor (clases gm-about*).
 * Los botones .gm-btn se definen en footer.css, que carga en todo el sitio.
 */
.gm-about {
	--gm-ink: #0a0a0a;
	--gm-muted: #666;
	--gm-line: #e6e6e6;
}
/* Reset del espaciado de Elementor; las reglas de abajo (misma especificidad, después) lo ajustan. */
.gm-about .elementor-widget-wrap > .elementor-widget { margin-bottom: 0; }
.gm-about p:last-child { margin-bottom: 0; }
.gm-eyebrow {
	font-size: 12.5px;
	letter-spacing: .1em;
	text-transform: uppercase;
	font-weight: 500;
	color: var(--gm-ink);
}

/* Elementor solo envuelve columnas a partir del breakpoint tablet (767); hace falta también en 768–991 */
@media (max-width: 991px) {
	.gm-about > .elementor-container { flex-wrap: wrap; }
}

/* Hero */
.gm-about__hero { padding: 36px 0 96px; }
.gm-about__title .elementor-heading-title {
	font-size: 64px;
	line-height: 1.02;
	letter-spacing: -.025em;
	font-weight: 500;
	margin: 18px 0 24px;
	max-width: 13ch;
}
.gm-about .elementor-widget.gm-about__lead { font-size: 19px; line-height: 1.6; max-width: 46ch; margin-bottom: 32px; }
.gm-about__hero-img img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; }

/* Declaración: revendedores, no GRAV Labs */
.gm-about__claim { padding: 96px 0; color: rgba(255, 255, 255, .7); }
.gm-about__claim .gm-eyebrow { color: rgba(255, 255, 255, .5); }
.gm-about__claim-title .elementor-heading-title {
	color: #fff;
	font-size: 40px;
	line-height: 1.12;
	letter-spacing: -.015em;
	font-weight: 500;
	margin: 16px 0 0;
	max-width: 17ch;
}
.gm-about__claim-text { font-size: 17px; line-height: 1.7; max-width: 56ch; }
.gm-about__claim-text p { color: inherit; }
.gm-about__claim-text p + p { margin-top: 18px; }
.gm-about__claim-text strong { color: #fff; font-weight: 500; }

/* Cifras: cada dato con su propia línea y hueco entre columnas */
.gm-about__stats { padding: 72px 0 56px; }
/* .elementor-element-populated sube la especificidad: la regla de padding de Elementor es 0,3,0 */
.gm-about .gm-stat > .elementor-widget-wrap.elementor-element-populated { border-top: 1px solid #d4d4d4; padding: 22px 0 0; }
.gm-about__stats .elementor-column:not(:last-child) > .elementor-widget-wrap { margin-right: 32px; }
.gm-about .elementor-widget.gm-stat__num { margin-bottom: 8px; }
.gm-stat__num .elementor-heading-title { font-size: 44px; line-height: 1; letter-spacing: -.02em; font-weight: 500; margin: 0; }
.gm-stat__label { font-size: 14px; line-height: 1.5; color: var(--gm-muted); max-width: 22ch; }

/* Cómo trabajamos */
.gm-about__how { padding: 96px 0 0; }
.gm-about__steps { padding: 40px 0 96px; }
.gm-section-title .elementor-heading-title {
	font-size: 40px;
	line-height: 1.12;
	letter-spacing: -.015em;
	font-weight: 500;
	margin: 16px 0 0;
	max-width: 22ch;
}
.gm-about .gm-step > .elementor-widget-wrap.elementor-element-populated {
	background: #fff;
	border: 1px solid #e6e6e6;
	padding: 36px 32px 40px;
	height: 100%;
}
.gm-about__steps .elementor-column:not(:last-child) > .elementor-widget-wrap { margin-right: 24px; }
.gm-step__num p {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--gm-ink);
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .06em;
	margin: 0;
}
.gm-about .elementor-widget.gm-step__num { margin-bottom: 26px; }
.gm-step__title .elementor-heading-title { font-size: 22px; line-height: 1.25; font-weight: 500; margin: 0 0 10px; }
.gm-step__text { font-size: 15.5px; line-height: 1.65; color: var(--gm-muted); max-width: 34ch; }

/* La marca */
.gm-about__brand { padding: 96px 0; }
.gm-about .gm-about__brand-copy > .elementor-widget-wrap.elementor-element-populated { padding-left: 56px; }
.gm-about__brand-title .elementor-heading-title {
	font-size: 40px;
	line-height: 1.12;
	letter-spacing: -.015em;
	font-weight: 500;
	margin: 16px 0 20px;
	max-width: 16ch;
}
.gm-about .elementor-widget.gm-about__brand-text { font-size: 17px; line-height: 1.7; max-width: 50ch; }
.gm-about__brand-text p + p { margin-top: 18px; }
.gm-about__brand-img img { width: 100%; height: auto; }

/* CTA final */
.gm-about__cta { padding: 80px 0 120px; border-top: 1px solid var(--gm-line); text-align: center; }
.gm-about__cta-title .elementor-heading-title { font-size: 44px; line-height: 1.1; letter-spacing: -.02em; font-weight: 500; margin: 0 0 14px; }
.gm-about .elementor-widget.gm-about__cta-text { font-size: 17px; line-height: 1.6; max-width: 44ch; margin: 0 auto 30px; }

@media (max-width: 991px) {
	.gm-about__hero { padding: 24px 0 72px; }
	.gm-about__title .elementor-heading-title { font-size: 52px; }
	.gm-about__hero-img { margin-top: 40px; }
	.gm-about__claim { padding: 72px 0; }
	.gm-about__claim-text { margin-top: 28px; }
	.gm-about .gm-about__brand-copy > .elementor-widget-wrap.elementor-element-populated { padding-left: 10px; padding-top: 36px; }
	.gm-step { margin-bottom: 16px; }
	.gm-about__steps .elementor-column:not(:last-child) > .elementor-widget-wrap { margin-right: 0; }
	.gm-stat { margin-bottom: 28px; }
	.gm-about__stats .elementor-column:not(:last-child) > .elementor-widget-wrap { margin-right: 20px; }
}
@media (max-width: 767px) {
	/* Margen lateral en móvil: el tema deja solo 15px al borde */
	.gm-about > .elementor-container { padding-left: 11px; padding-right: 11px; }
	.gm-about .gm-stat > .elementor-widget-wrap.elementor-element-populated { padding-left: 10px; padding-right: 10px; }
	.gm-about__stats .elementor-column:not(:last-child) > .elementor-widget-wrap { margin-right: 0; }
}
@media (max-width: 575px) {
	.gm-about__hero { padding: 16px 0 56px; }
	.gm-about__title .elementor-heading-title { font-size: 38px; max-width: none; }
	.gm-about__lead { font-size: 17px; }
	.gm-about__claim { padding: 56px 0; }
	.gm-about__claim-title .elementor-heading-title,
	.gm-section-title .elementor-heading-title,
	.gm-about__brand-title .elementor-heading-title,
	.gm-about__cta-title .elementor-heading-title { font-size: 30px; }
	.gm-about__stats { padding: 48px 0 24px; }
	.gm-stat { margin-bottom: 24px; }
	.gm-about .gm-stat > .elementor-widget-wrap.elementor-element-populated { padding-top: 16px; }
	.gm-stat__num .elementor-heading-title { font-size: 28px; white-space: nowrap; }
	.gm-about__how { padding: 64px 0 0; }
	.gm-about__steps { padding: 28px 0 64px; }
	.gm-about .gm-step > .elementor-widget-wrap.elementor-element-populated { padding: 28px 24px 30px; }
	.gm-about__brand { padding: 64px 0; }
	.gm-about__cta { padding: 56px 0 80px; }
}
