/* ==========================================================================
   Delicolect — hoja de estilos principal
   Orden: variables · reset · tipografía · layout · cabecera · componentes ·
          bloques de WordPress · formulario · pie · responsive · impresión
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Variables
   -------------------------------------------------------------------------- */

:root {
	/* Paleta extraída del logotipo de la marca */
	--dc-crema: #faf6ed;
	--dc-crema-hondo: #f2ebda;
	--dc-hueso: #fffdf8;
	--dc-verde-suave: #e8f0dd;
	--dc-verde: #578e31;
	--dc-verde-oscuro: #40742e;
	--dc-verde-hondo: #2c5220;
	--dc-verde-claro: #7dbb4a;
	--dc-magenta: #8a2364;
	--dc-magenta-hondo: #6d1a4e;
	--dc-magenta-suave: #f7e9f1;
	--dc-terracota: #b1682f;
	--dc-tinta: #2a2724;
	--dc-tinta-suave: #5c5751;
	--dc-borde: #e6ddc9;

	/* Tipografía */
	--dc-font-titulos: Fraunces, Georgia, 'Times New Roman', serif;
	--dc-font-texto: 'Nunito Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

	/* Ritmo vertical y anchos */
	--dc-wrap: 1200px;
	--dc-wrap-estrecho: 760px;
	--dc-gutter: clamp(1.25rem, 5vw, 2.5rem);
	--dc-seccion-y: clamp(3.5rem, 8vw, 7rem);

	/* Formas */
	--dc-radio-s: 14px;
	--dc-radio-m: 24px;
	--dc-radio-l: clamp(28px, 5vw, 48px);
	--dc-radio-xl: clamp(36px, 8vw, 80px);
	--dc-pildora: 999px;

	/* Sombras difusas, nunca duras */
	--dc-sombra-s: 0 2px 8px rgba(44, 82, 32, 0.06);
	--dc-sombra-m: 0 10px 30px -12px rgba(44, 82, 32, 0.18);
	--dc-sombra-l: 0 26px 60px -24px rgba(44, 82, 32, 0.26);

	--dc-cabecera-h: 78px;
	--dc-transicion: 220ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* --------------------------------------------------------------------------
   2. Reset y base
   -------------------------------------------------------------------------- */

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

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--dc-cabecera-h) + 1.5rem);
}

body {
	margin: 0;
	background: var(--dc-crema);
	color: var(--dc-tinta);
	font-family: var(--dc-font-texto);
	font-size: 1.0625rem;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

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

/* Las imágenes decorativas recortadas nunca deben capturar el puntero */
img[alt=''] {
	pointer-events: none;
}

/* --------------------------------------------------------------------------
   3. Tipografía
   -------------------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
	font-family: var(--dc-font-titulos);
	font-weight: 600;
	line-height: 1.15;
	color: var(--dc-verde-hondo);
	margin: 0 0 0.6em;
	text-wrap: balance;
	/* Fraunces es variable: fijamos el tamaño óptico para un trazo suave */
	font-variation-settings: 'SOFT' 40, 'WONK' 0, 'opsz' 96;
}

h1 {
	font-size: clamp(2.25rem, 5.2vw, 4rem);
	letter-spacing: -0.022em;
}

h2 {
	font-size: clamp(1.875rem, 3.6vw, 2.875rem);
	letter-spacing: -0.018em;
}

h3 {
	font-size: clamp(1.375rem, 2.2vw, 1.875rem);
	letter-spacing: -0.012em;
}

h4 {
	font-size: clamp(1.125rem, 1.6vw, 1.3125rem);
	font-weight: 700;
}

p {
	margin: 0 0 1.15em;
	text-wrap: pretty;
}

p:last-child {
	margin-bottom: 0;
}

strong,
b {
	font-weight: 700;
	color: var(--dc-verde-hondo);
}

a {
	color: var(--dc-verde-oscuro);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
	transition: color var(--dc-transicion);
}

a:hover,
a:focus {
	color: var(--dc-magenta);
}

:focus-visible {
	outline: 3px solid var(--dc-magenta);
	outline-offset: 3px;
	border-radius: 4px;
}

ul, ol {
	margin: 0 0 1.15em;
	padding-left: 1.35em;
}

li {
	margin-bottom: 0.4em;
}

li::marker {
	color: var(--dc-verde);
}

blockquote {
	margin: 0;
}

hr {
	border: 0;
	height: 1px;
	background: var(--dc-borde);
	margin: var(--dc-seccion-y) 0;
}

table {
	width: 100%;
	border-collapse: collapse;
}

/* --------------------------------------------------------------------------
   4. Layout
   -------------------------------------------------------------------------- */

.dc-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 999;
	padding: 0.85rem 1.4rem;
	background: var(--dc-magenta);
	color: #fff;
	font-weight: 700;
	border-radius: 0 0 var(--dc-radio-s) 0;
	text-decoration: none;
}

.dc-skip-link:focus {
	left: 0;
	color: #fff;
}

.dc-wrap {
	width: 100%;
	max-width: var(--dc-wrap);
	margin-inline: auto;
	padding-inline: var(--dc-gutter);
}

.dc-wrap--estrecho {
	max-width: var(--dc-wrap-estrecho);
}

.dc-main {
	display: block;
}

/* Secciones a ancho completo dentro del contenido de la página */
.dc-main > .alignfull,
.entry-content > .alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

.dc-section {
	position: relative;
	padding-block: var(--dc-seccion-y);
}

.dc-section > .dc-wrap {
	position: relative;
	z-index: 1;
}

.dc-section--crema { background: var(--dc-crema); }
.dc-section--suave { background: var(--dc-verde-suave); }

/* Sección alterna: blanco puro. Contra el crema el salto se percibe, mientras
   que dos cremas contiguos se leían como una sola franja continua. */
.dc-section--hueso { background: #fff; }

/* Las tarjetas invierten el fondo según la sección que las contiene, para que
   nunca queden del mismo color que su soporte. */
.dc-section--hueso .dc-card,
.dc-section--hueso .dc-stats,
.dc-section--hueso .dc-quote,
.dc-section--hueso .dc-pills li {
	background: var(--dc-crema);
}

.dc-section--verde {
	background: var(--dc-verde-hondo);
	color: #fff;
}

.dc-section--verde h2,
.dc-section--verde h3,
.dc-section--verde h4,
.dc-section--verde strong {
	color: #fff;
}

.dc-section--verde a:not(.dc-btn) {
	color: #d7ecc3;
}

/* Curva orgánica que separa secciones sin línea dura */
.dc-section--curva-top {
	border-start-start-radius: var(--dc-radio-xl);
	border-start-end-radius: var(--dc-radio-xl);
	margin-top: calc(-1 * var(--dc-radio-xl));
}

.dc-section--curva-bottom {
	border-end-start-radius: var(--dc-radio-xl);
	border-end-end-radius: var(--dc-radio-xl);
}

/* --------------------------------------------------------------------------
   5. Cabecera
   -------------------------------------------------------------------------- */

.dc-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: rgba(250, 246, 237, 0.86);
	backdrop-filter: saturate(150%) blur(14px);
	-webkit-backdrop-filter: saturate(150%) blur(14px);
	border-bottom: 1px solid transparent;
	transition: border-color var(--dc-transicion), box-shadow var(--dc-transicion), background var(--dc-transicion);
}

.dc-header.is-scrolled {
	border-bottom-color: var(--dc-borde);
	box-shadow: var(--dc-sombra-s);
}

.dc-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	min-height: var(--dc-cabecera-h);
}

.dc-logo {
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
	text-decoration: none;
	line-height: 0;
}

/* El logotipo es un lockup apilado (hortalizas sobre el nombre): necesita más
   altura que un logo horizontal para que «Delicolect» siga siendo legible.
   flex-shrink: 0 es imprescindible: como hijo de un contenedor flex la imagen
   se dejaba comprimir y por debajo de 360 px salía aplastada. */
.dc-logo img {
	height: clamp(46px, 7vw, 62px);
	width: auto;
	flex-shrink: 0;
	object-fit: contain;
}

.dc-logo__texto {
	font-family: var(--dc-font-titulos);
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--dc-verde-hondo);
	line-height: 1;
}

/* Navegación de escritorio */
.dc-nav {
	display: flex;
	align-items: center;
	gap: 0.35rem;
}

.dc-nav ul {
	display: flex;
	align-items: center;
	gap: 0.2rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.dc-nav li {
	margin: 0;
	position: relative;
}

.dc-nav a {
	display: block;
	padding: 0.6rem 1rem;
	border-radius: var(--dc-pildora);
	color: var(--dc-tinta);
	font-weight: 600;
	font-size: 1rem;
	text-decoration: none;
	white-space: nowrap;
	transition: background var(--dc-transicion), color var(--dc-transicion);
}

.dc-nav a:hover,
.dc-nav a:focus-visible {
	background: var(--dc-verde-suave);
	color: var(--dc-verde-hondo);
}

.dc-nav .current-menu-item > a,
.dc-nav .current_page_item > a,
.dc-nav .current-menu-ancestor > a {
	background: var(--dc-verde-suave);
	color: var(--dc-verde-hondo);
}

/* Submenús, por si en el futuro se añade jerarquía */
.dc-nav .sub-menu {
	position: absolute;
	top: calc(100% + 0.5rem);
	left: 0;
	min-width: 15rem;
	flex-direction: column;
	align-items: stretch;
	gap: 0;
	padding: 0.5rem;
	background: var(--dc-hueso);
	border: 1px solid var(--dc-borde);
	border-radius: var(--dc-radio-m);
	box-shadow: var(--dc-sombra-m);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-6px);
	transition: opacity var(--dc-transicion), transform var(--dc-transicion), visibility var(--dc-transicion);
}

.dc-nav li:hover > .sub-menu,
.dc-nav li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.dc-nav .sub-menu a {
	border-radius: var(--dc-radio-s);
	white-space: normal;
}

.dc-header__cta {
	flex-shrink: 0;
}

/* El CTA del panel desplegable solo existe en móvil; en escritorio ya está el
   de la cabecera y se veían los dos a la vez. */
.dc-nav__cta-movil {
	display: none;
}

/* `.dc-nav a` es más específico que `.dc-btn` y le imponía el color del texto
   de navegación: el botón salía con letra oscura sobre el fondo magenta. */
.dc-nav .dc-btn {
	color: #fff;
}

.dc-nav .dc-btn:hover,
.dc-nav .dc-btn:focus-visible {
	background: var(--dc-magenta-hondo);
	color: #fff;
}

/* Botón hamburguesa */
.dc-burger {
	display: none;
	align-items: center;
	gap: 0.55rem;
	padding: 0.6rem 1rem 0.6rem 0.85rem;
	background: var(--dc-verde-suave);
	color: var(--dc-verde-hondo);
	border: 0;
	border-radius: var(--dc-pildora);
	font-family: inherit;
	font-size: 0.9375rem;
	font-weight: 700;
	cursor: pointer;
}

.dc-burger__icono {
	display: block;
	position: relative;
	width: 18px;
	height: 12px;
	flex-shrink: 0;
}

.dc-burger__icono span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	border-radius: 2px;
	background: currentColor;
	transition: transform var(--dc-transicion), opacity var(--dc-transicion);
}

.dc-burger__icono span:nth-child(1) { top: 0; }
.dc-burger__icono span:nth-child(2) { top: 5px; }
.dc-burger__icono span:nth-child(3) { top: 10px; }

.dc-burger[aria-expanded='true'] .dc-burger__icono span:nth-child(1) { transform: translateY(5px) rotate(45deg); }
.dc-burger[aria-expanded='true'] .dc-burger__icono span:nth-child(2) { opacity: 0; }
.dc-burger[aria-expanded='true'] .dc-burger__icono span:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }

/* --------------------------------------------------------------------------
   6. Botones
   -------------------------------------------------------------------------- */

.dc-btn,
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.85rem 1.6rem;
	border: 2px solid transparent;
	border-radius: var(--dc-pildora);
	background: var(--dc-magenta);
	color: #fff;
	font-family: var(--dc-font-texto);
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.3;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background var(--dc-transicion), color var(--dc-transicion),
		border-color var(--dc-transicion), transform var(--dc-transicion), box-shadow var(--dc-transicion);
}

.dc-btn:hover,
.dc-btn:focus-visible,
.wp-block-button__link:hover,
.wp-block-button__link:focus-visible {
	background: var(--dc-magenta-hondo);
	color: #fff;
	transform: translateY(-2px);
	box-shadow: var(--dc-sombra-m);
}

/* Secundario: contorno verde */
.dc-btn--linea,
.is-style-outline .wp-block-button__link {
	background: transparent;
	border-color: var(--dc-verde-oscuro);
	color: var(--dc-verde-hondo);
}

.dc-btn--linea:hover,
.dc-btn--linea:focus-visible,
.is-style-outline .wp-block-button__link:hover,
.is-style-outline .wp-block-button__link:focus-visible {
	background: var(--dc-verde-hondo);
	border-color: var(--dc-verde-hondo);
	color: #fff;
}

/* Sobre fondo verde */
.dc-section--verde .dc-btn--linea,
.dc-section--verde .is-style-outline .wp-block-button__link {
	border-color: rgba(255, 255, 255, 0.6);
	color: #fff;
}

.dc-section--verde .dc-btn--linea:hover,
.dc-section--verde .dc-btn--linea:focus-visible {
	background: #fff;
	border-color: #fff;
	color: var(--dc-verde-hondo);
}

.dc-btn--sm {
	padding: 0.6rem 1.15rem;
	font-size: 0.9375rem;
}

/* --------------------------------------------------------------------------
   7. Componentes
   -------------------------------------------------------------------------- */

/* Antetítulo en píldora */
.dc-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 1.25rem;
	padding: 0.4rem 1rem 0.4rem 0.85rem;
	background: var(--dc-verde-suave);
	border-radius: var(--dc-pildora);
	color: var(--dc-verde-hondo);
	font-family: var(--dc-font-texto);
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.dc-eyebrow::before {
	content: '';
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--dc-verde-claro);
	flex-shrink: 0;
}

.dc-section--verde .dc-eyebrow {
	background: rgba(255, 255, 255, 0.14);
	color: #fff;
}

.dc-eyebrow--magenta {
	background: var(--dc-magenta-suave);
	color: var(--dc-magenta-hondo);
}

.dc-eyebrow--magenta::before {
	background: var(--dc-magenta);
}

/* Párrafo de entrada */
.dc-lead {
	font-size: clamp(1.125rem, 1.6vw, 1.3125rem);
	line-height: 1.6;
	color: var(--dc-tinta-suave);
}

.dc-section--verde .dc-lead {
	color: rgba(255, 255, 255, 0.9);
}

/* Encabezado de sección centrado */
.dc-encabezado {
	max-width: 46rem;
	margin-inline: auto;
	margin-bottom: clamp(2.5rem, 5vw, 4rem);
	text-align: center;
}

.dc-encabezado > :last-child {
	margin-bottom: 0;
}

/* --- Encabezado de página interior --------------------------------------- */

.dc-page-head {
	position: relative;
	overflow: hidden;
	padding-top: clamp(2.5rem, 5vw, 4rem);
	padding-bottom: clamp(2rem, 4.5vw, 3.5rem);
	background: var(--dc-crema);
}

.dc-page-head::before {
	content: '';
	position: absolute;
	top: -40%;
	right: -8%;
	width: min(52vw, 560px);
	aspect-ratio: 1;
	background: radial-gradient(circle at 35% 45%, rgba(232, 240, 221, 0.9), transparent 68%);
	border-radius: 50%;
	pointer-events: none;
}

.dc-page-head .dc-wrap {
	position: relative;
	z-index: 1;
}

.dc-page-head__texto {
	max-width: 44rem;
}

.dc-page-head h1 {
	margin-bottom: 0.75rem;
}

.dc-page-head > .dc-wrap > .dc-page-head__texto > :last-child {
	margin-bottom: 0;
}

/* --- Hero ---------------------------------------------------------------- */

.dc-hero {
	position: relative;
	padding-top: clamp(2.5rem, 6vw, 5rem);
	padding-bottom: clamp(3rem, 7vw, 5.5rem);
	overflow: hidden;
	background: var(--dc-crema);
}

/* Mancha orgánica de fondo */
.dc-hero::before {
	content: '';
	position: absolute;
	top: -18%;
	right: -14%;
	width: min(70vw, 780px);
	aspect-ratio: 1;
	background: radial-gradient(circle at 30% 30%, rgba(232, 240, 221, 0.95), rgba(232, 240, 221, 0.35) 62%, transparent 72%);
	border-radius: 46% 54% 42% 58% / 52% 44% 56% 48%;
	pointer-events: none;
	z-index: 0;
}

.dc-hero__grid {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
	align-items: center;
	gap: clamp(2rem, 5vw, 4.5rem);
}

.dc-hero__texto > :last-child {
	margin-bottom: 0;
}

.dc-hero h1 {
	margin-bottom: 1rem;
}

/* La palabra clave del titular, resaltada con un trazo de rotulador */
.dc-marcado {
	position: relative;
	display: inline;
	color: var(--dc-verde);
	white-space: nowrap;
}

.dc-marcado::after {
	content: '';
	position: absolute;
	left: -0.08em;
	right: -0.08em;
	bottom: 0.06em;
	height: 0.3em;
	background: var(--dc-verde-claro);
	opacity: 0.32;
	border-radius: var(--dc-pildora);
	z-index: -1;
}

.dc-hero__acciones {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.85rem;
	margin-top: 2rem;
}

/* Imagen del hero con forma suave */
.dc-hero__media {
	position: relative;
}

.dc-hero__foto {
	position: relative;
	border-radius: var(--dc-radio-xl) var(--dc-radio-m) var(--dc-radio-xl) var(--dc-radio-m);
	overflow: hidden;
	box-shadow: var(--dc-sombra-l);
	/* Proporción cercana a la de la foto para no recortar a las personas
	   de los extremos de la fila. */
	aspect-ratio: 16 / 10;
}

.dc-hero__foto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	/* Encuadra en las personas, no en el techo de la nave. */
	object-position: center 55%;
}

/* Recorte decorativo que flota sobre la foto */
.dc-hero__recorte {
	position: absolute;
	bottom: -9%;
	left: -15%;
	width: clamp(110px, 21%, 180px);
	filter: drop-shadow(0 14px 26px rgba(44, 82, 32, 0.22));
	z-index: 2;
	animation: dc-flotar 7s ease-in-out infinite;
}

@keyframes dc-flotar {
	0%, 100% { transform: translateY(0) rotate(-3deg); }
	50%      { transform: translateY(-12px) rotate(2deg); }
}

@media (prefers-reduced-motion: reduce) {
	.dc-hero__recorte { animation: none; }
	html { scroll-behavior: auto; }
}

/* Sello flotante (homologación) */
.dc-sello {
	position: absolute;
	top: 6%;
	right: -4%;
	z-index: 2;
	display: grid;
	place-content: center;
	gap: 0.1rem;
	width: clamp(92px, 17vw, 124px);
	aspect-ratio: 1;
	padding: 0.5rem;
	background: var(--dc-magenta);
	color: #fff;
	border-radius: 50%;
	box-shadow: var(--dc-sombra-l);
	text-align: center;
	line-height: 1.15;
}

.dc-sello strong {
	display: block;
	color: #fff;
	font-family: var(--dc-font-titulos);
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: 700;
}

/* El sello dice «años» y no «años de experiencia»: el texto largo obligaba a
   bajar a 11 px dentro del círculo. Con una sola palabra caben 14 px. */
.dc-sello span {
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* --- Cifras -------------------------------------------------------------- */

.dc-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: clamp(1.25rem, 3vw, 2.5rem);
	padding: clamp(1.75rem, 4vw, 2.5rem);
	background: var(--dc-hueso);
	border: 1px solid var(--dc-borde);
	border-radius: var(--dc-radio-l);
	box-shadow: var(--dc-sombra-m);
}

.dc-stat {
	position: relative;
	text-align: center;
}

.dc-stat__cifra {
	display: block;
	font-family: var(--dc-font-titulos);
	font-size: clamp(2rem, 4vw, 2.875rem);
	font-weight: 700;
	line-height: 1;
	color: var(--dc-verde);
	letter-spacing: -0.02em;
}

.dc-stat__cifra small {
	font-size: 0.55em;
	font-weight: 600;
}

.dc-stat__texto {
	display: block;
	margin-top: 0.5rem;
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--dc-tinta-suave);
	line-height: 1.4;
}

/* Separadores verticales entre cifras */
.dc-stat + .dc-stat::before {
	content: '';
	position: absolute;
	left: calc(-1 * clamp(0.625rem, 1.5vw, 1.25rem));
	top: 15%;
	bottom: 15%;
	width: 1px;
	background: var(--dc-borde);
}

/* --- Tarjetas ------------------------------------------------------------ */

.dc-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr));
	gap: clamp(1.25rem, 2.5vw, 2rem);
}

.dc-cards--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); }

/* Cuatro en fila solo cuando hay sitio de sobra; por debajo pasan a 2×2 en
   lugar de estrangular el texto en columnas de 200 px. */
.dc-cards--4 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); }

@media (min-width: 56em) and (max-width: 75em) {
	.dc-cards--4 { grid-template-columns: repeat(2, 1fr); }
}

.dc-card {
	display: flex;
	flex-direction: column;
	padding: clamp(1.5rem, 3vw, 2.25rem);
	background: var(--dc-hueso);
	border: 1px solid var(--dc-borde);
	border-radius: var(--dc-radio-l);
	transition: transform var(--dc-transicion), box-shadow var(--dc-transicion), border-color var(--dc-transicion);
}

.dc-card:hover {
	transform: translateY(-4px);
	border-color: transparent;
	box-shadow: var(--dc-sombra-l);
}

.dc-card > :last-child {
	margin-bottom: 0;
}

.dc-card h3 {
	font-size: clamp(1.1875rem, 1.8vw, 1.4375rem);
	margin-bottom: 0.5rem;
}

.dc-card p {
	color: var(--dc-tinta-suave);
	font-size: 1rem;
}

/* Icono circular de la tarjeta */
.dc-card__icono {
	display: grid;
	place-content: center;
	width: 56px;
	height: 56px;
	margin-bottom: 1.15rem;
	background: var(--dc-verde-suave);
	border-radius: 18px;
	color: var(--dc-verde-hondo);
	flex-shrink: 0;
}

.dc-card__icono svg {
	width: 28px;
	height: 28px;
	stroke: currentColor;
	fill: none;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.dc-card--magenta .dc-card__icono {
	background: var(--dc-magenta-suave);
	color: var(--dc-magenta-hondo);
}

.dc-card--terracota .dc-card__icono {
	background: #f8ece1;
	color: #8d5124;
}

/* Tarjeta destacada, con la marca de fondo */
.dc-card--relleno {
	background: var(--dc-verde-hondo);
	border-color: transparent;
	color: #fff;
}

.dc-card--relleno h3,
.dc-card--relleno strong { color: #fff; }
.dc-card--relleno p { color: rgba(255, 255, 255, 0.86); }

.dc-card--relleno .dc-card__icono {
	background: rgba(255, 255, 255, 0.14);
	color: #fff;
}

/* --- Bloque de imagen + texto alternos ---------------------------------- */

.dc-media {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
	align-items: center;
	gap: clamp(2rem, 5vw, 4.5rem);
}

.dc-media__texto > :last-child {
	margin-bottom: 0;
}

.dc-media__foto {
	position: relative;
	border-radius: var(--dc-radio-xl) var(--dc-radio-m) var(--dc-radio-xl) var(--dc-radio-m);
	overflow: hidden;
	box-shadow: var(--dc-sombra-m);
	aspect-ratio: 4 / 3;
}

.dc-media__foto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Encuadre: en las fotos de cocina interesa la zona media-baja (las personas y
   la mesa), no el techo. */
.dc-media__foto--alto img {
	object-position: center 62%;
}

/* Para originales verticales: se estira el marco en vez de recortar media foto. */
.dc-media__foto--retrato {
	aspect-ratio: 4 / 4.3;
}

/* Soporte para las imágenes recortadas con fondo transparente: no se encuadran,
   se apoyan sobre una mancha de color para que no floten sin sitio. */
.dc-blob {
	position: relative;
	aspect-ratio: 1;
	max-width: 30rem;
	margin-inline: auto;
}

.dc-blob::before {
	content: '';
	position: absolute;
	inset: 8% 4% 4% 4%;
	background: radial-gradient(circle at 50% 45%, var(--dc-verde-suave), rgba(232, 240, 221, 0.55) 70%, transparent 78%);
	border-radius: 50%;
	z-index: 0;
}

/* Posicionado absoluto a propósito: con max-height en porcentaje la imagen
   hacía crecer al contenedor y el 100% se resolvía contra su propia altura,
   así que se desbordaba. Ancladas las cuatro esquinas, contain siempre encaja. */
.dc-blob img {
	position: absolute;
	inset: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: bottom center;
	filter: drop-shadow(0 18px 28px rgba(44, 82, 32, 0.16));
}

.dc-section--verde .dc-blob::before {
	background: radial-gradient(circle at 50% 45%, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.06) 70%, transparent 78%);
}

/* Invierte el orden en pantallas anchas */
@media (min-width: 61.25em) {
	.dc-media--invertido .dc-media__media { order: -1; }
	.dc-media__foto--espejo {
		border-radius: var(--dc-radio-m) var(--dc-radio-xl) var(--dc-radio-m) var(--dc-radio-xl);
	}
}

/* --- Listas con marca -------------------------------------------------- */

.dc-checklist {
	list-style: none;
	margin: 1.75rem 0 1.15em;
	padding: 0;
	display: grid;
	gap: 0.85rem;
}

.dc-checklist li {
	position: relative;
	margin: 0;
	padding-left: 2.25rem;
	line-height: 1.55;
}

.dc-checklist li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0.1em;
	width: 1.5rem;
	height: 1.5rem;
	border-radius: 50%;
	background: var(--dc-verde-suave) no-repeat center / 0.75rem;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%232c5220' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 8.6l3.4 3.4L13.5 4.4'/%3E%3C/svg%3E");
}

.dc-section--verde .dc-checklist li::before {
	background-color: rgba(255, 255, 255, 0.16);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23ffffff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 8.6l3.4 3.4L13.5 4.4'/%3E%3C/svg%3E");
}

.dc-checklist--2 {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr));
	column-gap: 2rem;
}

/* Etiquetas tipo píldora (dietas, servicios) */
.dc-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem;
	list-style: none;
	margin: 1.75rem 0 0;
	padding: 0;
}

.dc-pills li {
	margin: 0;
	padding: 0.45rem 1rem;
	background: var(--dc-hueso);
	border: 1px solid var(--dc-borde);
	border-radius: var(--dc-pildora);
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--dc-verde-hondo);
}

.dc-section--verde .dc-pills li {
	background: rgba(255, 255, 255, 0.12);
	border-color: rgba(255, 255, 255, 0.24);
	color: #fff;
}

/* --- Pasos numerados ---------------------------------------------------- */

.dc-pasos {
	counter-reset: dc-paso;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
	gap: clamp(1.5rem, 3vw, 2.5rem);
	list-style: none;
	margin: 0;
	padding: 0;
}

.dc-paso {
	position: relative;
	margin: 0;
	padding-top: 3.5rem;
}

.dc-paso::before {
	counter-increment: dc-paso;
	content: counter(dc-paso);
	position: absolute;
	top: 0;
	left: 0;
	display: grid;
	place-content: center;
	width: 2.75rem;
	height: 2.75rem;
	background: var(--dc-verde-hondo);
	border-radius: 50%;
	color: #fff;
	font-family: var(--dc-font-titulos);
	font-size: 1.25rem;
	font-weight: 700;
}

.dc-paso h3 {
	font-size: 1.1875rem;
	margin-bottom: 0.4rem;
}

.dc-paso p {
	color: var(--dc-tinta-suave);
	font-size: 1rem;
	margin: 0;
}

.dc-section--verde .dc-paso::before {
	background: #fff;
	color: var(--dc-verde-hondo);
}

.dc-section--verde .dc-paso p {
	color: rgba(255, 255, 255, 0.86);
}

/* --- Cita --------------------------------------------------------------- */

.dc-quote {
	position: relative;
	max-width: 46rem;
	margin-inline: auto;
	padding: clamp(2rem, 4vw, 3rem) clamp(1.5rem, 4vw, 3rem);
	background: var(--dc-hueso);
	border: 1px solid var(--dc-borde);
	border-radius: var(--dc-radio-l);
	text-align: center;
}

.dc-quote p {
	font-family: var(--dc-font-titulos);
	font-size: clamp(1.25rem, 2.4vw, 1.75rem);
	font-weight: 600;
	line-height: 1.4;
	color: var(--dc-verde-hondo);
	font-variation-settings: 'SOFT' 60, 'WONK' 1, 'opsz' 96;
}

.dc-quote cite {
	display: block;
	margin-top: 1.25rem;
	font-family: var(--dc-font-texto);
	font-size: 0.9375rem;
	font-style: normal;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--dc-magenta);
}

/* --- Llamada final ------------------------------------------------------ */

.dc-cta {
	position: relative;
	overflow: hidden;
	padding: clamp(2.5rem, 6vw, 4.5rem);
	background: var(--dc-verde-hondo);
	border-radius: var(--dc-radio-l);
	color: #fff;
	text-align: center;
}

.dc-cta::before {
	content: '';
	position: absolute;
	inset: auto -10% -60% auto;
	left: -12%;
	width: 420px;
	aspect-ratio: 1;
	background: radial-gradient(circle, rgba(125, 187, 74, 0.32), transparent 68%);
	border-radius: 50%;
	pointer-events: none;
}

.dc-cta > * {
	position: relative;
	z-index: 1;
}

.dc-cta h2 {
	color: #fff;
	max-width: 34rem;
	margin-inline: auto;
}

.dc-cta .dc-lead {
	max-width: 40rem;
	margin-inline: auto;
	color: rgba(255, 255, 255, 0.9);
}

.dc-cta__acciones {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.85rem;
	margin-top: 2rem;
}

/* El fondo del bloque es verde oscuro, así que el botón de contorno debe ir en
   blanco: con el verde heredado el texto quedaba invisible sobre el propio verde. */
.dc-cta .dc-btn--linea,
.dc-cta .is-style-outline .wp-block-button__link {
	background: transparent;
	border-color: rgba(255, 255, 255, 0.6);
	color: #fff;
}

.dc-cta .dc-btn--linea:hover,
.dc-cta .dc-btn--linea:focus-visible,
.dc-cta .is-style-outline .wp-block-button__link:hover,
.dc-cta .is-style-outline .wp-block-button__link:focus-visible {
	background: #fff;
	border-color: #fff;
	color: var(--dc-verde-hondo);
}

/* --- Contacto ----------------------------------------------------------- */

.dc-contacto {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
	gap: clamp(2rem, 5vw, 4rem);
	align-items: start;
}

.dc-contacto h2 {
	font-size: clamp(1.5rem, 2.4vw, 2rem);
}

.dc-contacto__datos > :last-child,
.dc-contacto__form > :last-child {
	margin-bottom: 0;
}

/* wpautop deja párrafos vacíos alrededor de los shortcodes que devuelven
   bloques; sin esto aparecerían como huecos verticales sin motivo. */
.entry-content p:empty {
	display: none;
}

.dc-personas {
	display: grid;
	gap: 1rem;
	margin-block: 1.75rem;
}

.dc-persona {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.35rem;
	background: var(--dc-hueso);
	border: 1px solid var(--dc-borde);
	border-radius: var(--dc-radio-m);
}

.dc-persona__avatar {
	display: grid;
	place-content: center;
	width: 48px;
	height: 48px;
	flex-shrink: 0;
	background: var(--dc-verde-suave);
	border-radius: 50%;
	color: var(--dc-verde-hondo);
	font-family: var(--dc-font-titulos);
	font-size: 1.125rem;
	font-weight: 700;
}

.dc-persona__datos {
	min-width: 0;
}

.dc-persona__nombre {
	display: block;
	font-family: var(--dc-font-titulos);
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--dc-verde-hondo);
	line-height: 1.3;
}

.dc-persona__cargo {
	display: block;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--dc-tinta-suave);
	margin-bottom: 0.5rem;
}

.dc-persona a {
	display: block;
	font-size: 0.9375rem;
	font-weight: 600;
	word-break: break-word;
	text-decoration: none;
}

.dc-persona a:hover {
	text-decoration: underline;
}

/* --------------------------------------------------------------------------
   8. Formulario
   -------------------------------------------------------------------------- */

.dc-form {
	padding: clamp(1.5rem, 3.5vw, 2.5rem);
	background: var(--dc-hueso);
	border: 1px solid var(--dc-borde);
	border-radius: var(--dc-radio-l);
	box-shadow: var(--dc-sombra-m);
}

.dc-form__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
	gap: 1.15rem;
}

.dc-campo {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}

.dc-campo--ancho {
	grid-column: 1 / -1;
}

.dc-campo label {
	font-size: 0.9375rem;
	font-weight: 700;
	color: var(--dc-verde-hondo);
}

.dc-campo .dc-req {
	color: var(--dc-magenta);
}

.dc-campo input,
.dc-campo textarea,
.dc-campo select {
	width: 100%;
	padding: 0.8rem 1rem;
	background: #fff;
	border: 1.5px solid var(--dc-borde);
	border-radius: var(--dc-radio-s);
	font-family: inherit;
	font-size: 1rem;
	color: var(--dc-tinta);
	transition: border-color var(--dc-transicion), box-shadow var(--dc-transicion);
}

.dc-campo textarea {
	min-height: 8rem;
	resize: vertical;
}

.dc-campo input:focus,
.dc-campo textarea:focus,
.dc-campo select:focus {
	outline: 0;
	border-color: var(--dc-verde);
	box-shadow: 0 0 0 3px rgba(87, 142, 49, 0.18);
}

.dc-campo input[aria-invalid='true'],
.dc-campo textarea[aria-invalid='true'] {
	border-color: #b3261e;
	box-shadow: 0 0 0 3px rgba(179, 38, 30, 0.14);
}

.dc-campo__error {
	font-size: 0.875rem;
	font-weight: 600;
	color: #b3261e;
}

/* Casilla de consentimiento */
.dc-consent {
	display: flex;
	align-items: flex-start;
	gap: 0.7rem;
	grid-column: 1 / -1;
}

.dc-consent input[type='checkbox'] {
	width: 1.5rem;
	height: 1.5rem;
	margin-top: 0.05rem;
	flex-shrink: 0;
	accent-color: var(--dc-verde);
	cursor: pointer;
}

.dc-consent label {
	font-size: 0.9375rem;
	font-weight: 400;
	color: var(--dc-tinta-suave);
	line-height: 1.5;
}

/* Trampa antispam: invisible pero accesible para lectores */
.dc-honeypot {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.dc-form__pie {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
	margin-top: 1.5rem;
}

.dc-form__nota {
	font-size: 0.875rem;
	color: var(--dc-tinta-suave);
	margin: 0;
}

/* Avisos */
.dc-aviso {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	margin-bottom: 1.5rem;
	padding: 1rem 1.25rem;
	border-radius: var(--dc-radio-m);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.5;
}

.dc-aviso--ok {
	background: var(--dc-verde-suave);
	color: #1f3d16;
}

.dc-aviso--error {
	background: #fdecea;
	color: #8c1d18;
}

.dc-aviso__icono {
	flex-shrink: 0;
	width: 1.35rem;
	height: 1.35rem;
	margin-top: 0.1rem;
}

/* --------------------------------------------------------------------------
   9. Bloques de WordPress
   -------------------------------------------------------------------------- */

.wp-block-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 0.85rem;
}

.wp-block-columns {
	display: flex;
	flex-wrap: wrap;
	gap: clamp(1.5rem, 3vw, 2.5rem);
}

.wp-block-column {
	flex: 1 1 0;
	min-width: 0;
}

.wp-block-image img {
	border-radius: var(--dc-radio-m);
}

.wp-block-image.is-style-rounded img,
.wp-block-image.dc-img-suave img {
	border-radius: var(--dc-radio-l);
}

/* Imágenes decorativas recortadas: sin radio ni sombra */
.wp-block-image.dc-img-recorte img {
	border-radius: 0;
	box-shadow: none;
}

.wp-block-group.has-background {
	border-radius: var(--dc-radio-l);
	padding: clamp(1.75rem, 4vw, 3rem);
}

.wp-block-group.alignfull.has-background {
	border-radius: 0;
}

figcaption,
.wp-element-caption {
	margin-top: 0.65rem;
	font-size: 0.875rem;
	color: var(--dc-tinta-suave);
	text-align: center;
}

.wp-block-separator {
	border: 0;
	height: 1px;
	background: var(--dc-borde);
	max-width: 6rem;
	margin-inline: auto;
}

.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;
}

/* --------------------------------------------------------------------------
   10. Pie de página
   -------------------------------------------------------------------------- */

.dc-footer {
	position: relative;
	padding-top: clamp(3rem, 6vw, 5rem);
	padding-bottom: 1.75rem;
	background: var(--dc-verde-hondo);
	color: rgba(255, 255, 255, 0.82);
	font-size: 1rem;
}

.dc-footer__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) repeat(auto-fit, minmax(min(100%, 180px), 1fr));
	gap: clamp(2rem, 4vw, 3.5rem);
	padding-bottom: clamp(2rem, 4vw, 3rem);
}

/* El logotipo es multicolor: va sobre una tarjeta clara para respetarlo */
.dc-footer__logo {
	display: inline-block;
	padding: 0.85rem 1.15rem;
	margin-bottom: 1.35rem;
	background: var(--dc-hueso);
	border-radius: var(--dc-radio-m);
}

/* object-fit: contain actúa de red: si algún contenedor llegara a estrechar la
   caja, la marca se reduce en vez de aplastarse. */
.dc-footer__logo img {
	height: 64px;
	width: auto;
	max-width: 100%;
	object-fit: contain;
	object-position: left center;
}

/* Cada comercial forma un bloque, para que el correo y el teléfono se lean
   junto a su nombre y no como una lista suelta de datos. */
.dc-footer__col--contacto ul {
	gap: 1.35rem;
}

.dc-footer__persona {
	display: grid;
	gap: 0.2rem;
}

.dc-footer__persona-nombre {
	font-family: var(--dc-font-titulos);
	font-size: 1.0625rem;
	font-weight: 600;
	color: #fff;
	line-height: 1.3;
}

.dc-footer__persona a {
	font-weight: 400;
	font-size: 0.9375rem;
	color: rgba(255, 255, 255, 0.78);
	word-break: break-word;
}

.dc-footer__claim {
	max-width: 26rem;
	color: rgba(255, 255, 255, 0.8);
}

.dc-footer h2 {
	font-family: var(--dc-font-texto);
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #a8d183;
	margin-bottom: 1.15rem;
}

.dc-footer ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.6rem;
}

.dc-footer li {
	margin: 0;
}

/* padding vertical para que la zona táctil llegue a los 24 px que pide
   WCAG 2.5.8; sin él los enlaces del pie medían 22 px de alto. */
.dc-footer a {
	display: inline-block;
	padding-block: 0.15rem;
	color: rgba(255, 255, 255, 0.86);
	text-decoration: none;
	font-weight: 600;
}

.dc-footer a:hover,
.dc-footer a:focus-visible {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.dc-footer__legal {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding-top: 1.75rem;
	border-top: 1px solid rgba(255, 255, 255, 0.16);
	font-size: 0.875rem;
	color: rgba(255, 255, 255, 0.66);
}

.dc-footer__legal ul {
	display: flex;
	flex-wrap: wrap;
	gap: 1.25rem;
}

/* --------------------------------------------------------------------------
   11. Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 61.1875em) {
	:root {
		--dc-cabecera-h: 68px;
	}

	.dc-burger {
		display: inline-flex;
	}

	.dc-header__cta {
		display: none;
	}

	/* Panel de navegación desplegable */
	.dc-nav {
		position: fixed;
		inset: var(--dc-cabecera-h) 0 auto 0;
		display: block;
		max-height: calc(100dvh - var(--dc-cabecera-h));
		overflow-y: auto;
		padding: 1.25rem var(--dc-gutter) 2rem;
		background: var(--dc-crema);
		border-bottom: 1px solid var(--dc-borde);
		box-shadow: var(--dc-sombra-l);
		opacity: 0;
		visibility: hidden;
		transform: translateY(-12px);
		transition: opacity var(--dc-transicion), transform var(--dc-transicion), visibility var(--dc-transicion);
	}

	.dc-nav.is-open {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}

	.dc-nav ul {
		flex-direction: column;
		align-items: stretch;
		gap: 0.25rem;
	}

	.dc-nav a {
		padding: 0.85rem 1rem;
		font-size: 1.0625rem;
		border-radius: var(--dc-radio-s);
	}

	.dc-nav .sub-menu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		border: 0;
		background: transparent;
		padding: 0 0 0 1rem;
		min-width: 0;
	}

	/* CTA dentro del panel móvil */
	.dc-nav__cta-movil {
		display: block;
		margin-top: 1.15rem;
	}

	.dc-nav__cta-movil .dc-btn {
		width: 100%;
	}

	.dc-hero__grid {
		grid-template-columns: 1fr;
	}

	.dc-hero__media {
		order: -1;
		max-width: 30rem;
		margin-inline: auto;
		width: 100%;
	}

	.dc-hero__recorte {
		width: clamp(90px, 20%, 150px);
	}

	.dc-contacto {
		grid-template-columns: 1fr;
	}

	.dc-stat + .dc-stat::before {
		display: none;
	}
}

/* El pie apilado. Con `auto-fit` sus tres columnas seguían repartiéndose el
   ancho en móvil en lugar de romper de línea, y la columna de la marca se
   quedaba en 38 px. */
@media (max-width: 48em) {
	.dc-footer__grid {
		grid-template-columns: 1fr;
		gap: 2.25rem;
	}

	.dc-footer__claim {
		max-width: none;
	}
}

/* Móviles estrechos (iPhone SE y similares): se aprieta el aire lateral para
   que el logotipo y el botón de menú quepan holgados en la misma fila. */
@media (max-width: 26em) {
	:root {
		--dc-gutter: 1.05rem;
	}

	.dc-header__inner {
		gap: 0.75rem;
	}

	.dc-logo img {
		height: 44px;
	}

	.dc-burger {
		padding: 0.55rem 0.85rem 0.55rem 0.7rem;
	}
}

/* Tablet y móvil: rejillas equilibradas.
   Con auto-fit las cuatro cifras caían en 3+1 y las tarjetas de tres en 2+1,
   dejando un elemento huérfano colgando de la última fila. Aquí se fija el
   número de columnas y se estira el impar sobrante para que ocupe la fila. */
@media (max-width: 62em) {
	.dc-stats {
		grid-template-columns: repeat(2, 1fr);
		gap: 1.75rem 1.25rem;
	}
}

@media (min-width: 37.5em) and (max-width: 62em) {
	.dc-cards,
	.dc-cards--4,
	.dc-pasos {
		grid-template-columns: repeat(2, 1fr);
	}

	.dc-cards > :last-child:nth-child(odd),
	.dc-pasos > :last-child:nth-child(odd) {
		grid-column: 1 / -1;
	}
}

@media (max-width: 37.5em) {
	.dc-stats {
		gap: 1.5rem 1rem;
	}

	.dc-sello {
		width: 84px;
		top: auto;
		bottom: -3%;
		right: 2%;
	}

	.dc-hero__acciones .dc-btn,
	.dc-cta__acciones .dc-btn {
		width: 100%;
	}

	.dc-footer__legal {
		justify-content: flex-start;
	}
}

/* Cuando el menú móvil está abierto se bloquea el desplazamiento */
body.dc-nav-abierto {
	overflow: hidden;
}

/* --------------------------------------------------------------------------
   12. Impresión
   -------------------------------------------------------------------------- */

@media print {
	.dc-header,
	.dc-footer,
	.dc-cta,
	.dc-form,
	.dc-skip-link {
		display: none !important;
	}

	body {
		background: #fff;
		color: #000;
		font-size: 11pt;
	}

	.dc-section {
		padding-block: 1rem;
		background: #fff !important;
		color: #000 !important;
	}
}