/* =============================================================================
   DataThemes · CSS base   (v1.1)
   Consume los tokens inyectados en :root desde brand-config.php.
   v1.1: se eliminan colores fijos (#fff, rgba(0,0,0,.06)) en favor de tokens.
   ========================================================================== */

/* --- Reset ligero -------------------------------------------------------- */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
	margin: 0;
	font-family: var(--dt-font-body, sans-serif);
	font-size: var(--dt-base, 17px);
	line-height: 1.6;
	color: var(--dt-ink, #17161A);
	background: var(--dt-paper, #FAFAF8);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

img, picture, svg, video { max-width: 100%; height: auto; display: block; }

a { color: var(--dt-primary, #F54576); text-decoration: none; }
a:hover { text-decoration: underline; }

/* --- Tipografía ---------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--dt-font-heading, serif);
	color: var(--dt-purple, #413C58);
	line-height: 1.15;
	margin: 0 0 .5em;
	font-weight: 700;
}
h1 { font-size: var(--dt-h1, 52px); }
h2 { font-size: var(--dt-h2, 38px); }
h3 { font-size: var(--dt-h3, 27px); }

p { margin: 0 0 1rem; }

/* --- Layout helpers ------------------------------------------------------ */
.dt-container {
	width: 100%;
	max-width: var(--dt-content-width, 1200px);
	margin-inline: auto;
	padding-inline: clamp(16px, 4vw, 32px);
}
.dt-container--narrow { max-width: var(--dt-container-narrow, 760px); }

.dt-site-main { display: block; }

/* Canvas: sin restricciones, Elementor controla todo */
body.dt-canvas { background: var(--dt-white, #fff); }

/* --- Accesibilidad: skip link ------------------------------------------- */
.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0,0,0,0);
	white-space: nowrap; border: 0;
}
.dt-skip-link:focus {
	position: fixed;
	top: 12px; left: 12px;
	z-index: 100000;
	width: auto; height: auto;
	padding: 10px 18px; margin: 0;
	clip: auto; white-space: normal;
	background: var(--dt-purple, #413C58);
	color: var(--dt-on-dark, #fff); border-radius: var(--dt-radius-sm, 10px);
	font-family: var(--dt-font-body, sans-serif);
}

/* --- Logo (imagen o fallback tipográfico "data.trust") ------------------ */
.dt-logo { display: inline-flex; align-items: center; text-decoration: none; }
.dt-logo:hover { text-decoration: none; }
.dt-logo--text {
	font-family: var(--dt-font-heading, serif);
	font-weight: 800;
	font-size: 26px;
	letter-spacing: -.02em;
}
.dt-logo__a { color: var(--dt-purple, #413C58); }
.dt-logo__b { color: var(--dt-primary, #F54576); }

/* --- Fallback header/footer (mínimos) ----------------------------------- */
.dt-header-fallback {
	border-bottom: 1px solid var(--dt-border, rgba(23,22,26,.08));
	background: var(--dt-paper, #FAFAF8);
}
.dt-header-fallback__inner {
	display: flex; align-items: center; justify-content: space-between;
	padding-block: var(--dt-space-sm, 16px);
}
.dt-menu {
	display: flex; gap: var(--dt-space-md, 24px); list-style: none; margin: 0; padding: 0;
}
.dt-menu a { color: var(--dt-purple, #413C58); font-weight: 500; }

.dt-footer-fallback {
	background: var(--dt-ink, #17161A);
	color: var(--dt-lilac, #D4D0E4);
	margin-top: var(--dt-space-xl, 64px);
}
.dt-footer-fallback__inner {
	display: flex; align-items: center; justify-content: space-between;
	padding-block: var(--dt-space-lg, 40px); flex-wrap: wrap; gap: var(--dt-space-sm, 16px);
}
.dt-footer-fallback .dt-logo__a { color: var(--dt-on-dark, #fff); }
.dt-footer-fallback__legal { margin: 0; font-size: 14px; color: var(--dt-lilac, #D4D0E4); }

/* --- Blog fallback (single/loop) ---------------------------------------- */
.dt-single__narrow { max-width: var(--dt-container-narrow, 760px); }
.dt-single__title { margin-bottom: var(--dt-space-md, 24px); }
.dt-single__thumb { margin-bottom: var(--dt-space-md, 24px); border-radius: var(--dt-radius-md, 18px); overflow: hidden; }
.dt-fallback-loop { padding-block: var(--dt-space-lg, 40px); }
.dt-entry { padding-block: var(--dt-space-md, 24px); border-bottom: 1px solid var(--dt-border, rgba(23,22,26,.08)); }

/* --- 404 ---------------------------------------------------------------- */
.dt-404 { padding-block: var(--dt-space-xl, 64px); text-align: center; }
.dt-404__code {
	font-family: var(--dt-font-heading, serif);
	font-size: clamp(72px, 12vw, 140px);
	line-height: 1; color: var(--dt-primary, #F54576); margin: 0;
}
.dt-404__actions { margin-top: var(--dt-space-lg, 40px); }
.dt-btn {
	display: inline-block;
	background: var(--dt-primary, #F54576);
	color: var(--dt-on-dark, #fff);
	padding: 14px 28px;
	border-radius: var(--dt-radius-sm, 10px);
	font-weight: 600;
}
.dt-btn:hover { text-decoration: none; opacity: .92; }

/* --- Responsive fallback header ----------------------------------------- */
@media (max-width: 782px) {
	.dt-header-fallback__nav { display: none; }
	.dt-footer-fallback__inner { flex-direction: column; text-align: center; }
}

/* --- Footer fallback: nav legal + layouts (v1.1 + Theme Settings) -------- */
.dt-footer-fallback__legalnav { display: flex; gap: var(--dt-space-md, 24px); flex-wrap: wrap; }
.dt-footer-fallback__legalnav a { color: var(--dt-lilac, #D4D0E4); font-size: 14px; }
.dt-footer-fallback__legalnav a:hover { color: var(--dt-on-dark, #fff); }
.dt-footer-fallback--center .dt-footer-fallback__inner,
.dt-footer-fallback--center { justify-content: center; text-align: center; }