/* Tipografía del contenido editable (artículos y páginas genéricas).
 *
 * El diseño maqueta el artículo con estilos en línea, pero lo que escribe el
 * editor de WordPress sale sin ellos. Estas reglas le dan el mismo aspecto.
 */

.seomos-articulo-layout {
	display: grid;
	grid-template-columns: 232px minmax(0, 1fr);
	gap: 44px;
	align-items: start;
}

.seomos-toc__sticky {
	position: sticky;
	top: 96px;
}

.seomos-toc__title {
	margin-bottom: 14px;
	color: #667382;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.seomos-toc__backdrop,
.seomos-toc__mobile-head,
.seomos-toc-mobile-toggle {
	display: none;
}

.seomos-toc nav a {
	display: block;
	padding: 7px 0;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
	color: #667382;
	border-left: 2px solid #ECEFF3;
	padding-left: 13px;
}

.seomos-toc nav a:hover,
.seomos-toc nav a.is-active {
	color: #E84B1D;
	border-left-color: #E84B1D;
}

.seomos-toc nav a.is-sub {
	padding-left: 26px;
	font-size: 13.5px;
}

.seomos-contenido {
	min-width: 0;
	font-size: 17px;
	line-height: 1.75;
	color: #33414F;
	overflow-wrap: anywhere;
}

.seomos-contenido code {
	white-space: normal;
}

.single-post .seomos-post h1 {
	overflow-wrap: anywhere;
}

.seomos-contenido .seomos-servicio-cta {
	margin-top: 40px;
	padding: 32px;
	border-radius: 16px;
	background: #0B1118;
	color: #D5DBE2;
}

.seomos-contenido .seomos-servicio-cta h2 {
	max-width: 680px;
	margin: 0;
	color: #FFFFFF;
	font-size: 28px;
	line-height: 1.2;
	letter-spacing: -0.55px;
}

.seomos-contenido .seomos-servicio-cta p {
	max-width: 720px;
	margin: 14px 0 0;
	color: #D5DBE2;
	font-size: 16px;
	line-height: 1.65;
}

.seomos-contenido .seomos-servicio-cta__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 24px;
}

.seomos-contenido .seomos-servicio-cta__actions a {
	display: inline-flex;
	min-height: 48px;
	align-items: center;
	justify-content: center;
	padding: 11px 18px;
	border-radius: 12px;
	font-family: 'Poppins', sans-serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.35;
	text-align: center;
	text-decoration: none;
	transition: background-color 180ms ease, color 180ms ease, transform 180ms ease;
}

.seomos-contenido .seomos-servicio-cta__primary {
	background: #C93E14;
	color: #FFFFFF;
}

.seomos-contenido .seomos-servicio-cta__secondary {
	box-shadow: inset 0 0 0 1px #65717E;
	color: #FFFFFF;
}

.seomos-contenido .seomos-servicio-cta__primary:hover {
	background: #A83210;
	color: #FFFFFF;
	transform: translateY(-1px);
}

.seomos-contenido .seomos-servicio-cta__secondary:hover {
	background: #202A34;
	color: #FFFFFF;
	transform: translateY(-1px);
}

.seomos-contenido .seomos-servicio-cta__actions a:focus-visible {
	outline: 3px solid #FFFFFF;
	outline-offset: 3px;
}

@media (max-width: 600px) {
	.seomos-contenido .seomos-servicio-cta {
		padding: 26px 22px;
	}

	.seomos-contenido .seomos-servicio-cta h2 {
		font-size: 24px;
	}

	.seomos-contenido .seomos-servicio-cta__actions {
		flex-direction: column;
	}

	.seomos-contenido .seomos-servicio-cta__actions a {
		width: 100%;
	}
}

.seomos-contenido > * + * {
	margin-top: 22px;
}

.seomos-contenido h2 {
	font-family: 'Poppins', sans-serif;
	font-size: 27px;
	font-weight: 800;
	letter-spacing: -0.7px;
	line-height: 1.2;
	color: #0B1118;
	margin-top: 44px;
	scroll-margin-top: 96px;
}

.seomos-contenido h3 {
	font-family: 'Poppins', sans-serif;
	font-size: 21px;
	font-weight: 700;
	line-height: 1.3;
	color: #0B1118;
	margin-top: 34px;
	scroll-margin-top: 96px;
}

.seomos-contenido a {
	color: #B83712;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.seomos-contenido ul,
.seomos-contenido ol {
	padding-left: 22px;
}

.seomos-contenido li + li {
	margin-top: 9px;
}

.seomos-contenido ul {
	list-style: disc;
}

.seomos-contenido ol {
	list-style: decimal;
}

.seomos-contenido img {
	max-width: 100%;
	height: auto;
	border-radius: 14px;
	display: block;
}

.seomos-contenido figure {
	margin-left: 0;
	margin-right: 0;
}

.seomos-contenido figcaption {
	margin-top: 10px;
	font-size: 13.5px;
	line-height: 1.5;
	text-align: center;
	color: #667382;
}

.seomos-contenido .seomos-resumen {
	padding: 22px 24px;
	border: 1px solid #F3C9BC;
	border-radius: 14px;
	background: #FFF8F5;
}

.seomos-contenido .seomos-resumen strong {
	color: #0B1118;
}

.seomos-contenido .seomos-faq-lista {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.seomos-contenido details.seomos-faq {
	margin-top: 0;
	border: 1px solid #ECEFF3;
	border-radius: 14px;
}

.seomos-contenido .seomos-faq-q {
	padding: 19px 20px;
	font-family: 'Poppins', sans-serif;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.4;
	color: #0B1118;
}

.seomos-contenido .seomos-faq-a {
	padding: 0 20px 19px;
	font-size: 15.5px;
	line-height: 1.65;
	color: #5A6775;
}

.seomos-contenido .seomos-faq-a p {
	margin: 0;
}

.seomos-contenido blockquote {
	padding: 20px 22px;
	border-radius: 14px;
	background: #F8F1EC;
	color: #41505F;
	font-size: 18px;
}

/* Los recuadros editoriales necesitan su propia superficie oscura. Sin esta
 * capa heredaban texto claro sobre los fondos crema del tema diurno. */
html[data-theme="dark"] .seomos-contenido .seomos-resumen {
	background: #251A17;
	border-color: #7B4738;
	color: #E7ECF2;
}

html[data-theme="dark"] .seomos-contenido .seomos-resumen strong,
html[data-theme="dark"] .seomos-contenido blockquote strong {
	color: #FFFFFF;
}

html[data-theme="dark"] .seomos-contenido .seomos-resumen a,
html[data-theme="dark"] .seomos-contenido blockquote a {
	color: #FF9A78;
}

html[data-theme="dark"] .seomos-contenido blockquote {
	border: 1px solid #405063;
	background: #1B232D;
	color: #D7DEE7;
}

html[data-theme="dark"] .seomos-contenido a {
	color: #FF9A78;
}

html[data-theme="dark"] .seomos-contenido details.seomos-faq {
	background: #151B23;
	border-color: #35404D;
}

html[data-theme="dark"] .seomos-contenido .seomos-faq-q,
html[data-theme="dark"] .seomos-contenido .seomos-faq-q > span:first-child {
	color: #F5F7FA;
}

html[data-theme="dark"] .seomos-contenido .seomos-faq-a,
html[data-theme="dark"] .seomos-contenido .seomos-faq-a p {
	color: #C3CBD5;
}

html[data-theme="dark"] .seomos-contenido .seomos-faq-chev {
	color: #AAB5C2;
}

html[data-theme="dark"] .seomos-contenido figcaption {
	color: #AAB5C2;
}

.seomos-contenido .seomos-table-wrap {
	overflow-x: auto;
	scrollbar-width: thin;
	scrollbar-color: #B8C0C9 #F3F5F7;
}

.seomos-contenido .seomos-table-wrap:focus-visible {
	outline: 3px solid rgba(232, 75, 29, 0.3);
	outline-offset: 3px;
}

.seomos-contenido table {
	width: 100%;
	min-width: 660px;
	border-collapse: collapse;
	font-size: 15.5px;
}

.seomos-contenido th,
.seomos-contenido td {
	border: 1px solid #ECEFF3;
	padding: 11px 14px;
	text-align: left;
}

.seomos-contenido th {
	background: #F8FAFB;
	font-weight: 700;
}

.seomos-page-hero {
	padding: 56px 40px 36px;
	background: linear-gradient(180deg, #FFF6F2 0%, #FFFFFF 100%);
}

.seomos-page-hero__inner,
.seomos-page-content {
	max-width: 820px;
	margin-inline: auto;
}

.seomos-page-hero h1 {
	margin: 0;
	color: #0B1118;
	font-family: 'Poppins', sans-serif;
	font-size: clamp(34px, 5vw, 40px);
	font-weight: 800;
	letter-spacing: -0.028em;
	line-height: 1.12;
}

.seomos-page-content {
	padding: 36px 40px 70px;
}

.seomos-legal-index {
	padding: 22px 24px;
	border: 1px solid #DCE2E8;
	border-radius: 14px;
	background: #F8FAFB;
}

.seomos-legal-index strong {
	display: block;
	margin-bottom: 10px;
	color: #0B1118;
	font-family: 'Poppins', sans-serif;
	font-size: 15px;
}

.seomos-legal-index ol {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 7px 28px;
	margin: 0;
	padding-left: 20px;
}

.seomos-legal-contact {
	margin-top: 48px;
	padding: 26px 28px;
	border-radius: 14px;
	background: #111820;
	color: #D7DEE7;
}

.seomos-legal-contact h2 {
	margin-top: 0;
	color: #FFFFFF;
}

.seomos-legal-contact a {
	color: #FF9A78;
}

html[data-theme="dark"] .seomos-page-hero {
	background: linear-gradient(180deg, #211713 0%, #0D1117 100%);
}

html[data-theme="dark"] .seomos-page-hero h1 {
	color: #F5F7FA;
}

html[data-theme="dark"] .seomos-legal-index {
	border-color: #35404D;
	background: #151B23;
}

html[data-theme="dark"] .seomos-legal-index strong {
	color: #F5F7FA;
}

html[data-theme="dark"] .seomos-legal-contact {
	border: 1px solid #35404D;
	background: #151B23;
}

@media (max-width: 600px) {
	.seomos-page-hero {
		padding: 42px 22px 28px;
	}

	.seomos-page-content {
		padding: 28px 22px 58px;
	}

	.seomos-legal-index ol {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 980px) {
	.seomos-articulo-layout {
		grid-template-columns: 1fr;
		gap: 0;
	}

	.seomos-toc {
		position: fixed;
		z-index: 180;
		inset: 0;
		display: block;
		visibility: hidden;
		pointer-events: none;
	}

	.seomos-toc__backdrop {
		position: absolute;
		inset: 0;
		display: block;
		width: 100%;
		height: 100%;
		padding: 0;
		border: 0;
		background: rgba(11, 17, 24, .64);
		opacity: 0;
		transition: opacity .22s ease;
	}

	.seomos-toc__panel {
		position: absolute;
		z-index: 1;
		left: 0;
		right: 0;
		bottom: 0;
		max-height: min(72dvh, 660px);
		padding-bottom: env(safe-area-inset-bottom);
		overflow: hidden;
		border-radius: 22px 22px 0 0;
		background: #FFFFFF;
		box-shadow: 0 -24px 60px rgba(11, 17, 24, .24);
		transform: translateY(105%);
		transition: transform .28s cubic-bezier(.2, .8, .2, 1);
	}

	.seomos-toc.is-open {
		visibility: visible;
		pointer-events: auto;
	}

	.seomos-toc.is-open .seomos-toc__backdrop {
		opacity: 1;
	}

	.seomos-toc.is-open .seomos-toc__panel {
		transform: translateY(0);
	}

	.seomos-toc__mobile-head {
		display: flex;
		min-height: 62px;
		align-items: center;
		justify-content: space-between;
		padding: 12px 20px;
		border-bottom: 1px solid #E4E9EE;
		background: #FFFFFF;
	}

	.seomos-toc__mobile-head strong {
		color: #0B1118;
		font-family: Poppins, Arial, sans-serif;
		font-size: 17px;
	}

	.seomos-toc__mobile-head button {
		display: grid;
		width: 40px;
		height: 40px;
		padding: 0;
		place-items: center;
		border: 1px solid #DCE2E8;
		border-radius: 50%;
		background: #F7F8FA;
		color: #0B1118;
		font-size: 27px;
		line-height: 1;
	}

	.seomos-toc__sticky {
		position: static;
		max-height: calc(min(72dvh, 660px) - 62px - env(safe-area-inset-bottom));
		padding: 14px 20px 24px;
		overflow-y: auto;
		overscroll-behavior: contain;
		scrollbar-width: thin;
	}

	.seomos-toc__title {
		display: none;
	}

	.seomos-toc nav a {
		min-height: 44px;
		padding-top: 11px;
		padding-bottom: 11px;
		font-size: 15px;
	}

	.seomos-toc nav a.is-sub {
		font-size: 14px;
	}

	.seomos-toc-mobile-toggle {
		position: fixed;
		z-index: 175;
		left: 16px;
		right: 16px;
		bottom: calc(16px + env(safe-area-inset-bottom));
		display: inline-flex;
		width: auto;
		min-width: 0;
		min-height: 50px;
		align-items: center;
		justify-content: center;
		gap: 9px;
		padding: 11px 22px;
		border: 1px solid rgba(255, 255, 255, .32);
		border-radius: 999px;
		background: #C74717;
		box-shadow: 0 14px 34px rgba(91, 31, 9, .34);
		color: #FFFFFF;
		font-family: Poppins, Arial, sans-serif;
		font-size: 15px;
		font-weight: 700;
		line-height: 1;
		transform: none;
		transition: opacity .18s ease, transform .18s ease;
	}

	.seomos-toc-mobile-toggle:hover,
	.seomos-toc-mobile-toggle:focus-visible {
		background: #A93A14;
		color: #FFFFFF;
		transform: translateY(-2px);
	}

	body.seomos-toc-open {
		overflow: hidden;
	}

	body.seomos-toc-open .seomos-toc-mobile-toggle,
	body.seomos-modal-open .seomos-toc-mobile-toggle {
		opacity: 0;
		pointer-events: none;
	}

	.single-post .seomos-contenido h2,
	.single-post .seomos-contenido h3 {
		scroll-margin-top: 92px;
	}

	.single-post .cta-fab {
		bottom: calc(78px + env(safe-area-inset-bottom));
	}
}

@media (prefers-reduced-motion: reduce) {
	.seomos-toc__backdrop,
	.seomos-toc__panel,
	.seomos-toc-mobile-toggle {
		transition: none !important;
	}
}

/* Cierre de accesibilidad: navegación editorial y CTAs conservan contraste
 * AA en ambos temas, incluso frente a los estilos generales de los enlaces. */
.seomos-post-breadcrumb,
.seomos-post-breadcrumb a {
	color: #667382 !important;
}

html[data-theme="dark"] .seomos-post-breadcrumb,
html[data-theme="dark"] .seomos-post-breadcrumb a {
	color: #AAB5C2 !important;
}

.seomos-contenido a.seomos-servicio-cta__primary,
.seomos-contenido a.seomos-servicio-cta__primary:hover {
	color: #FFFFFF !important;
}
