/* TKM Pack DRM Custom — Corporativa Navy/Green (decisión CEO).
 * SaaS claro de alta gama: fondos blancos, texto oscuro, verde esmeralda
 * (#00E676) ESTRICTAMENTE en CTAs y estados de éxito. Nada de dark mode. */

.tkm-drm {
	--tkm-drm-primary: #1e3c72;
	--tkm-drm-secondary: #764ba2;
	--tkm-drm-bg: #ffffff;
	--tkm-drm-bg-soft: #f8f9fa;
	--tkm-drm-text: #333333;
	--tkm-drm-muted: #666666;
	--tkm-drm-cta: #00e676;
	--tkm-drm-cta-text: #003918;
	--tkm-drm-ok: #00e676;
	--tkm-drm-warn: #ffc107;
	--tkm-drm-err: #f44336;
	background: var(--tkm-drm-bg);
	color: var(--tkm-drm-text);
	font-family: Inter, system-ui, sans-serif;
}

.tkm-drm h1,
.tkm-drm h2,
.tkm-drm h3 {
	font-family: "Space Grotesk", Inter, system-ui, sans-serif;
	color: var(--tkm-drm-primary);
	letter-spacing: -0.01em;
}

/* CTA de compra/acción: verde esmeralda, SOLO aquí y en éxito. */
.tkm-drm-btn,
.wp-block-button.tkm-drm-btn .wp-block-button__link {
	display: inline-block;
	font-weight: 700;
	padding: 0.9rem 1.8rem;
	border-radius: 0.5rem;
	text-decoration: none;
	background: var(--tkm-drm-cta);
	color: var(--tkm-drm-cta-text);
	border: 0;
}

.tkm-drm-btn-secondary {
	display: inline-block;
	font-weight: 700;
	padding: 0.9rem 1.8rem;
	border-radius: 0.5rem;
	text-decoration: none;
	border: 2px solid var(--tkm-drm-primary);
	color: var(--tkm-drm-primary);
	background: transparent;
}

.tkm-drm-hero {
	max-width: 72rem;
	margin: 0 auto;
	padding: 5rem 1.5rem 4rem;
	text-align: center;
	background: var(--tkm-drm-bg-soft);
	border-bottom: 1px solid #e8edf3;
}

.tkm-drm-hero h1 {
	font-size: clamp(2rem, 5vw, 3.25rem);
	margin: 0 0 1rem;
}

.tkm-drm-hero p {
	color: var(--tkm-drm-muted);
	font-size: 1.125rem;
}

.tkm-drm-kicker {
	display: inline-block;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--tkm-drm-primary);
	margin-bottom: 1rem;
}

.tkm-drm-section {
	max-width: 72rem;
	margin: 0 auto;
	padding: 3rem 1.5rem;
}

.tkm-drm-cards {
	display: grid;
	gap: 1rem;
	grid-template-columns: 1fr;
}

@media (min-width: 768px) {
	.tkm-drm-cards {
		grid-template-columns: repeat(3, 1fr);
	}
}

.tkm-drm-card {
	border: 1px solid #e2e8f0;
	border-radius: 0.75rem;
	padding: 1.5rem;
	background: var(--tkm-drm-bg);
	box-shadow: 0 1px 3px rgba(30, 60, 114, 0.08);
}

.tkm-drm-card h2,
.tkm-drm-card h3 {
	margin-top: 0;
}

.tkm-drm-card p {
	color: var(--tkm-drm-muted);
}