/* Hallmark · genre: modern-minimal · macrostructure: Long Document · design-system: design.md · designed-as-app
 * pre-emit critique: P4 H4 E4 S4 R5 V4 */
/* =========================================================================
 * Páginas legales · Rediseño 2026 (plantilla legal-2026.php).
 * Documento tipográfico sobre el sistema th-*: cabecera cálida a sangre,
 * medida de lectura cómoda y el contenido tal cual sale del editor.
 * ========================================================================= */

/* 1 · CABECERA ------------------------------------------------------------ */
.tl-doc-hero{
	margin-top:calc(-1 * var(--th-header-flow, 72px));
	padding:calc(var(--th-sp-2xl) + var(--th-header-flow, 72px)) 0 var(--th-sp-xl);
	background:linear-gradient(180deg,oklch(97.5% 0.015 75) 0%,var(--th-paper) 100%);
	border-bottom:var(--th-rule);
}
.tlc-legal .th-eyebrow{display:inline-flex;align-items:center;gap:var(--th-sp-2xs)}
.tlc-legal .tl-doc-hero__title{
	font-size:var(--th-section);
	font-weight:700;line-height:1.1;letter-spacing:-.025em;
	color:var(--th-ink);
	margin:var(--th-sp-2xs) 0 var(--th-sp-sm);
	overflow-wrap:anywhere;
}
.tl-doc-hero__meta{
	margin:0;
	font-family:var(--th-mono);font-size:var(--th-text-xs);
	letter-spacing:.05em;color:var(--th-muted);
}

/* 2 · DOCUMENTO ----------------------------------------------------------- */
.tl-doc{
	max-width:76ch;
	padding:var(--th-sp-2xl) 0 var(--th-sp-xl);
	color:var(--th-text);
	font-size:var(--th-text-base);line-height:1.75;
}
/* El contenido trae su propio título y su línea de "Última actualización":
 * la cabecera de la plantilla ya los pinta, fuera el duplicado. */
.tlc-legal .tl-doc > :is(h1,h2):first-child{display:none}
.tlc-legal .tl-doc > :is(h1,h2):first-child + p:has(> strong:first-child){display:none}
.tlc-legal .tl-doc h2{
	font-size:var(--th-text-xl);font-weight:600;line-height:1.25;letter-spacing:-.02em;
	color:var(--th-ink);
	margin:var(--th-sp-xl) 0 var(--th-sp-sm);
	padding-top:var(--th-sp-lg);
	border-top:var(--th-rule);
}
.tlc-legal .tl-doc h2:first-child{margin-top:0;padding-top:0;border-top:0}
.tlc-legal .tl-doc h3{
	font-size:var(--th-text-md);font-weight:600;letter-spacing:-.01em;
	color:var(--th-ink);
	margin:var(--th-sp-lg) 0 var(--th-sp-xs);
}
.tlc-legal .tl-doc h4{
	font-size:var(--th-text-base);font-weight:600;color:var(--th-ink);
	margin:var(--th-sp-lg) 0 var(--th-sp-xs);
}
.tl-doc p{margin:0 0 var(--th-sp-md)}
.tl-doc ul,
.tl-doc ol{margin:0 0 var(--th-sp-md);padding-left:1.4em}
.tl-doc li{margin-bottom:var(--th-sp-2xs)}
.tl-doc li::marker{color:var(--th-accent-deep)}
.tlc-legal .tl-doc a,
.tlc-legal .tl-doc a:link,
.tlc-legal .tl-doc a:visited{
	color:var(--th-accent-deep);
	text-decoration:underline;text-underline-offset:2px;
}
.tlc-legal .tl-doc a:hover{color:var(--th-ink)}
.tlc-legal .tl-doc a:focus-visible{outline:2px solid var(--th-focus);outline-offset:2px}
.tl-doc strong{color:var(--th-ink);font-weight:600}

/* Tablas (p. ej. la de cookies de Complianz) */
.tl-doc table{
	width:100%;border-collapse:collapse;
	margin:0 0 var(--th-sp-lg);
	font-size:var(--th-text-sm);
}
.tl-doc th,
.tl-doc td{
	padding:var(--th-sp-xs) var(--th-sp-sm);
	border:var(--th-rule);
	text-align:left;vertical-align:top;
}
.tl-doc th{background:var(--th-paper-2);color:var(--th-ink);font-weight:600}
/* Tablas anchas: scroll propio, nunca de página. */
.tl-doc{overflow-x:clip}
.tl-doc table{display:block;overflow-x:auto}

/* 3 · NAVEGACIÓN LEGAL ---------------------------------------------------- */
.tl-doc-nav{
	max-width:76ch;
	margin-bottom:var(--th-sp-2xl);
	padding-top:var(--th-sp-lg);
	border-top:var(--th-rule);
}
.tl-doc-nav__label{
	margin:0 0 var(--th-sp-sm);
	font-family:var(--th-mono);font-size:var(--th-text-xs);font-weight:500;
	letter-spacing:.12em;text-transform:uppercase;
	color:var(--th-muted);
}
.tl-doc-nav__links{display:flex;flex-wrap:wrap;gap:var(--th-sp-xs)}
.tlc-legal .tl-doc-nav__chip,
.tlc-legal a.tl-doc-nav__chip:link,
.tlc-legal a.tl-doc-nav__chip:visited{
	display:inline-flex;align-items:center;
	padding:var(--th-sp-xs) var(--th-sp-md);
	background:var(--th-paper);
	border:var(--th-rule);
	border-radius:var(--th-pill);
	font-size:var(--th-text-sm);font-weight:500;
	color:var(--th-ink-soft);text-decoration:none;
	transition:border-color var(--th-dur) var(--th-ease),color var(--th-dur) var(--th-ease);
}
.tlc-legal a.tl-doc-nav__chip:hover{border-color:var(--th-ink);color:var(--th-ink);background:var(--th-paper)}
.tlc-legal a.tl-doc-nav__chip:focus-visible{outline:2px solid var(--th-focus);outline-offset:2px}

@media (max-width:767px){
	.tl-doc{padding-top:var(--th-sp-xl)}
}
