/* ==========================================================================
   Tokens del manual técnico web (PPO_Manual-tecnico-web.pdf)

   Colores: solo Cielo, Navy, Negro, Café y Crema (+ blanco de fondo).
   Tipografía: solo Barlow ExtraLight 200, Light 300, Regular 400 y Bold 700.

   Las medidas del manual están en el lienzo de 1920 px de los diseños. El
   sitio toma 1440 px como referencia de escritorio, así que cada tamaño se
   aplica al 75 % (valor ÷ 19.2 = vw) y se detiene ahí; en tablet y teléfono
   baja proporcionalmente hasta un mínimo legible.

   Esta hoja se carga después de las de cada sección y manda sobre ellas.
   ========================================================================== */

:root {
	--ppo-cielo: #00A7E2;
	--ppo-navy: #003360;
	--ppo-negro: #000000;
	--ppo-cafe: #D2B48C;
	--ppo-crema: #FFF5E9;

	/* Escala tipográfica (manual a 1920 → sitio a 1440) */
	--ppo-h1: clamp(52px, 9.64vw, 139px);      /* 185 px · ExtraLight */
	--ppo-h2: clamp(44px, 7.81vw, 112.5px);    /* 150 px · ExtraLight */
	--ppo-h3: clamp(40px, 6.2vw, 89px);        /* 119 px · ExtraLight */
	--ppo-h4: clamp(30px, 4.84vw, 70px);       /* 93 px · Light */
	--ppo-desc: clamp(19px, 1.93vw, 28px);     /* 37 px · Regular · descripción de sección */
	--ppo-card-title: clamp(18px, 1.51vw, 22px); /* 29 px · Bold · título de tarjeta */
	/* El párrafo no se reduce al 75 %: a 16,5 px quedaba más chico que en los
	   diseños de cada sección. Llega a los 22 px del manual en 1440. */
	--ppo-p: clamp(16px, 1.53vw, 22px);        /* 22 px · Regular · párrafo */
	--ppo-btn: 13.5px;                         /* 18 px · botón de sección y de tarjeta */
	--ppo-btn-article: clamp(16px, 1.35vw, 19.5px); /* 26 px · botón de artículo */
}

/* ---------- Base: Divi usa Open Sans 500 gris por defecto ---------- */

html body,
html body #page-container,
html body .et_pb_text {
	font-family: 'Barlow', sans-serif;
	font-weight: 400;
	color: var(--ppo-negro);
}

/* ---------- H1 · títulos de sección ---------- */

html body .ppo-section-title,
html body .et_pb_text .ppo-section-title {
	font-weight: 200 !important;
	font-size: var(--ppo-h1) !important;
}
/* "Reconocimiento internacional" es largo: en teléfono se ajusta al ancho */
html body .ppo-section-head .ppo-section-title,
html body .et_pb_text .ppo-section-head .ppo-section-title {
	font-size: clamp(38px, min(11.5vw, 9.64vw + 8px), 139px) !important;
}
@media (min-width: 768px) {
	html body .ppo-section-head .ppo-section-title,
	html body .et_pb_text .ppo-section-head .ppo-section-title {
		font-size: var(--ppo-h1) !important;
	}
}

/* ---------- H2 · "Áreas de práctica", "Sectores" ---------- */

html body .ppo-count-head {
	font-weight: 200;
}
html body .ppo-count-head__label {
	font-size: var(--ppo-h2);
}

/* ---------- H3 · "Nuestra experiencia", "Artículos relacionados" ---------- */

html body .ppo-area-h2 {
	font-weight: 200;
	font-size: var(--ppo-h3);
}

/* ---------- H4 · frases destacadas ("Análisis sobre negocio…") ---------- */

html body .ppo-statement,
html body .et_pb_text .ppo-statement,
html body .ppo-finder-title,
html body .et_pb_text .ppo-finder-title {
	font-weight: 300 !important;
	font-size: var(--ppo-h4) !important;
	line-height: 1.08 !important;
}

/* ---------- Descripción de sección ---------- */

html body .ppo-section-intro,
html body .et_pb_text .ppo-section-intro,
html body .ppo-lead,
html body .et_pb_text .ppo-lead,
html body .ppo-hero__subtitle {
	font-weight: 400 !important;
	font-size: var(--ppo-desc) !important;
	line-height: 1.3 !important;
}

/* ---------- Título de tarjeta ---------- */

html body .ppo-sit-card__title,
html body .et_pb_text .ppo-sit-card__title,
html body .ppo-news-card__title,
html body .et_pb_text .ppo-news-card__title,
html body .ppo-team-card__name,
html body .et_pb_text .ppo-team-card__name,
html body .ppo-pro-card__name,
html body .ppo-area-card__name {
	font-weight: 700 !important;
	font-size: var(--ppo-card-title) !important;
	line-height: 1.2 !important;
}

/* ---------- Párrafo ----------
   La línea de tiempo de Historia no está aquí: usa el tamaño de su diseño
   (ppo-firma.css, hasta 24 px con interlineado 1,2). */

html body .ppo-sit-card__desc,
html body .et_pb_text .ppo-sit-card__desc,
html body .ppo-news-card__excerpt,
html body .et_pb_text .ppo-news-card__excerpt,
html body .ppo-card p,
html body .et_pb_text .ppo-card p,
html body .ppo-area-text p,
html body .ppo-profile-text p,
html body .ppo-profile-text li,
html body .ppo-work-block__text p,
html body .et_pb_text .ppo-work-block__text p,
html body .ppo-culture__body p,
html body .et_pb_text .ppo-culture__body p,
html body .ppo-history__intro p,
html body .et_pb_text .ppo-history__intro p,
html body .ppo-contact__text,
html body .et_pb_text .ppo-contact__text,
html body .ppo-area-services li {
	font-weight: 400 !important;
	font-size: var(--ppo-p) !important;
	line-height: 1.5 !important;
}

/* ---------- Botones ---------- */

/* Botón de sección: "Ver más", "Ver a todas las personas" */
html body .ppo-btn:not(.ppo-btn--plain),
html body .et_pb_text .ppo-btn:not(.ppo-btn--plain),
html body .ppo-meet__actions .ppo-btn:not(.ppo-btn--plain) {
	font-weight: 400 !important;
	font-size: var(--ppo-btn) !important;
}
/* Botón de tarjeta: categoría de Situaciones, "Leer" de Novedades */
html body .ppo-sit-card__cat,
html body .ppo-news-card__more {
	font-weight: 400;
	font-size: var(--ppo-btn) !important;
}
/* Botón de artículo: "Leer más", "Ver las novedades", enlaces del Hero, "Ir" */
html body .ppo-article-list__meta a,
html body .ppo-btn--plain,
html body .et_pb_text .ppo-btn--plain,
html body .ppo-hero__cta,
html body .ppo-area-contact__link {
	font-weight: 400 !important;
	font-size: var(--ppo-btn-article) !important;
}

/* ---------- Pesos fuera del manual (Medium / SemiBold) ---------- */

html body .ppo-profile-h4 {
	font-weight: 400 !important;
}
html body .ppo-footer__langs .is-current {
	font-weight: 700;
}

/* ---------- Íconos (manual a 1920 → sitio a 1440) ---------- */

/* Compartir 39 px: cuadro blanco con borde negro */
html body .ppo-sit-card__share {
	width: 29px;
	height: 29px;
	border-color: var(--ppo-negro);
	color: var(--ppo-negro);
}
html body .ppo-sit-card__share svg {
	width: 17px;
	height: 17px;
}
/* Experto 32 px */
html body .ppo-area-h3--icon svg {
	width: 24px;
	height: 24px;
}
/* Check 31 px */
html body .ppo-area-services svg {
	width: 23px;
}
/* Buscar 29 px */
html body .ppo-finder__search button svg {
	width: 22px;
	height: 22px;
}
/* Ubicación 24 px */
html body .ppo-footer__heading--pin svg {
	width: 18px;
	height: 18px;
	flex-basis: 18px;
}
/* Teléfono 19 px · Mail 26 px */
html body .ppo-footer__contact svg {
	width: 14px;
	height: 14px;
}
html body .ppo-footer__at {
	font-weight: 700;
	font-size: 19.5px;
	color: var(--ppo-navy);
}
/* LinkedIn 39 px: círculo navy con "in" */
html body .ppo-footer__linkedin svg {
	width: 29px;
	height: 29px;
}
html body .ppo-hero__social {
	width: 29px;
	height: 29px;
}