/**
 * Variables de marca de Display en Casa.
 * Cambia aquí los colores/fuentes reales del cliente y se propagan a todos los bloques.
 */
:root {
	--dc-bg: #0c0b0a;
	--dc-bg-alt: #100e0d;
	--dc-card: #161412;
	--dc-text: #f5f1ec;
	--dc-text-muted: #a89f97;
	--dc-text-dim: #75706a;
	--dc-border: rgba(255, 255, 255, 0.08);
	--dc-border-strong: rgba(255, 255, 255, 0.16);
	--dc-accent: #ff5230;
	--dc-accent-soft: rgba(255, 82, 48, 0.14);
	--dc-accent-light: #ff8a63;
	--dc-font-heading: 'Space Grotesk', sans-serif;
	--dc-font-body: 'Manrope', sans-serif;
	--dc-radius-lg: 22px;
	--dc-radius-md: 16px;
	--dc-radius-sm: 10px;
}

.dc-section {
	padding: clamp(64px, 9vw, 110px) clamp(20px, 6vw, 64px);
}

.dc-eyebrow {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--dc-accent);
	margin-bottom: 12px;
}

.dc-heading {
	font-family: var(--dc-font-heading);
	font-weight: 700;
	letter-spacing: -0.01em;
	margin: 0;
	color: var(--dc-text);
}

.dc-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-weight: 700;
	font-size: 15px;
	padding: 14px 26px;
	border-radius: 999px;
	text-decoration: none;
	transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease, color 0.15s ease;
	cursor: pointer;
	border: 1px solid transparent;
}

.dc-btn--primary {
	background: var(--dc-accent);
	color: var(--dc-bg);
}

.dc-btn--primary:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 28px rgba(255, 82, 48, 0.4);
	color: var(--dc-bg);
}

.dc-btn--ghost {
	background: transparent;
	color: var(--dc-text);
	border-color: var(--dc-border-strong);
}

.dc-btn--ghost:hover {
	border-color: var(--dc-accent);
	color: var(--dc-accent-light);
}