/* Caldrenwick: components */

/* buttons: ghost, outlined, never filled */
.cw-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: 48px;
	padding: 0.65rem 1.4rem;

	font-family: var(--cw-letra-titulo);
	font-size: 0.95rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--color-texto);

	background: transparent;
	border: 2px solid currentColor;
	cursor: pointer;
}

.cw-btn:hover {
	color: var(--color-texto);

	box-shadow: inset 0 0 0 2px currentColor;
}

.cw-btn-senal,
.cw-btn-senal:hover {
	color: var(--color-senal);
}

.cw-btn[disabled] {
	color: var(--color-gris);

	cursor: wait;
}

.cw-btn-chico {
	min-height: 44px;
	padding: 0.45rem 1rem;

	font-size: 0.85rem;
}

.cw-btn-icono {
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0;

	font-size: 1.5rem;
	line-height: 1;

	background: transparent;
	border: 1px solid var(--color-borde);
	cursor: pointer;
}

/* tiles and cards */
.cw-placa {
	padding: clamp(1.25rem, 2.4vw, 2rem);

	background: var(--color-blanco);
	border: 1px solid var(--color-borde);
	box-shadow: var(--cw-sombra);
}

.cw-placa > :last-child {
	margin-bottom: 0;
}

.cw-placa-tinte {
	background: var(--color-niebla);
	box-shadow: none;
}

.cw-placa-oscura {
	color: var(--color-niebla);

	background: var(--color-texto);
	border-color: var(--color-texto);
}

.cw-placa-oscura a {
	color: var(--color-blanco);
}

.cw-placa-borde {
	border-top: 4px solid var(--color-acento);
}

.cw-dato {
	display: block;
	margin-bottom: 0.4rem;

	font-family: var(--cw-letra-titulo);
	font-size: clamp(1.8rem, 3vw, 2.6rem);
	font-weight: 300;
	line-height: 1.1;
	color: var(--color-acento);
}

.cw-placa-oscura .cw-dato {
	color: var(--color-blanco);
}

.cw-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;

	list-style: none;
}

.cw-chips li {
	padding: 0.35rem 0.8rem;

	font-family: var(--cw-letra-titulo);
	font-size: 0.9rem;
	font-weight: 500;

	background: var(--color-blanco);
	border: 1px solid var(--color-borde);
}

/* hero with giant watermark */
.cw-hero {
	position: relative;
	overflow: hidden;
}

.cw-hero-marca {
	position: absolute;
	bottom: -0.2em;
	left: -0.04em;
	z-index: 0;

	font-family: var(--cw-letra-titulo);
	font-size: clamp(8rem, 21vw, 19rem);
	font-weight: 300;
	line-height: 1;
	letter-spacing: -0.05em;
	white-space: nowrap;
	color: var(--color-marca-agua);

	pointer-events: none;
	user-select: none;
}

.cw-hero-rejilla {
	position: relative;
	z-index: 1;

	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--space-large);
	align-items: center;
}

.cw-hero h1 {
	max-width: 12.5em;
	margin-bottom: var(--space-medium);
}

.cw-hero-texto .cw-entrada {
	max-width: 36rem;

	font-size: 1.15rem;
}

.cw-accion {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1.5rem;
	margin: var(--space-medium) 0;
}

.cw-tel {
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	min-height: 48px;

	font-family: var(--cw-letra-titulo);
	font-size: 1.2rem;
	font-weight: 500;
	color: var(--color-texto);
	text-decoration: none;
}

.cw-tel small {
	font-family: var(--cw-letra-texto);
	font-size: 0.85rem;
	font-weight: 400;
	color: var(--color-gris);
}

.cw-hero-bento {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: var(--space-small);
}

.cw-hero-bento > :first-child {
	grid-column: span 2;
}

@media (min-width: 960px) {
	.cw-hero-rejilla {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		gap: var(--space-huge);
	}
}

/* passe-partout frame: light field inside a rectangular frame */
.cw-paspartu {
	margin: 0;
	padding: clamp(0.75rem, 1.6vw, 1.25rem);

	background: var(--color-blanco);
	border: 1px solid var(--color-borde);
	box-shadow: var(--cw-sombra);
}

.cw-paspartu img,
.cw-paspartu .cw-tela {
	width: 100%;

	outline: 1px solid var(--color-borde);
}

.cw-paspartu figcaption {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 0.25rem 1rem;
	padding-top: 0.75rem;

	font-size: 0.95rem;
}

/* fabric card for garments without photo */
.cw-tela {
	position: relative;

	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: flex-start;
	gap: 0.35rem;
	aspect-ratio: 3 / 2;
	padding: 1rem;

	background-color: var(--tela, #E2E9EF);
	background-image:
		repeating-linear-gradient(0deg, #FFFFFF1A 0 1px, #FFFFFF00 1px 3px),
		repeating-linear-gradient(90deg, #0F1A2614 0 1px, #0F1A2600 1px 4px),
		repeating-linear-gradient(90deg, #FFFFFF0F 0 2px, #FFFFFF00 2px 7px);
}

.cw-tela-rayas {
	background-image:
		repeating-linear-gradient(0deg, #FFFFFF1A 0 1px, #FFFFFF00 1px 3px),
		repeating-linear-gradient(90deg, #FFFFFF 0 7px, #3D5C9E 7px 10px);
}

.cw-tela-etiqueta {
	padding: 0.3rem 0.6rem;

	font-family: var(--cw-letra-titulo);
	font-size: 0.85rem;
	font-weight: 500;
	color: var(--color-texto);

	background: var(--color-blanco);
}

.cw-tela-grande {
	font-size: 1rem;
}

/* product card */
.cw-tarjeta {
	display: flex;
	flex-direction: column;

	background: var(--color-blanco);
	border: 1px solid var(--color-borde);
}

.cw-tarjeta[hidden] {
	display: none;
}

.cw-tarjeta .cw-paspartu {
	border: 0;
	border-bottom: 1px solid var(--color-borde);
	box-shadow: none;
}

.cw-tarjeta-cuerpo {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 0.3rem;
	padding: 1rem 1.25rem 1.25rem;
}

.cw-tarjeta h3 {
	margin: 0;

	font-size: 1.2rem;
}

.cw-tarjeta h3 a {
	color: var(--color-texto);
	text-decoration: none;
}

.cw-tarjeta h3 a:hover {
	text-decoration: underline;
	text-decoration-color: var(--color-acento);
	text-decoration-thickness: 3px;
}

.cw-tarjeta-pie {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.5rem;
	margin-top: auto;
	padding-top: 0.5rem;
}

.cw-precio {
	font-family: var(--cw-letra-titulo);
	font-size: 1.15rem;
	font-weight: 600;
}

.cw-color {
	margin: 0;

	font-size: 0.95rem;
	color: var(--color-gris);
}

.cw-rejilla-prendas {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 15.5rem), 1fr));
	gap: var(--space-medium);
}

/* sticky-sidebar: linen guide */
.cw-guia {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--space-large);
	align-items: start;
}

.cw-guia-indice {
	padding: 1.25rem 1.5rem;

	background: var(--color-texto);
	color: var(--color-niebla);
}

.cw-guia-indice p {
	margin-bottom: 0.5rem;

	font-family: var(--cw-letra-titulo);
	font-size: 0.85rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.cw-guia-indice ol {
	display: flex;
	flex-wrap: wrap;
	gap: 0 1.25rem;

	list-style: none;
	counter-reset: guia;
}

.cw-guia-indice li {
	counter-increment: guia;
}

.cw-guia-indice a {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	min-height: 44px;

	font-family: var(--cw-letra-titulo);
	font-size: 1.05rem;
	color: var(--color-blanco);
	text-decoration: none;
}

.cw-guia-indice a::before {
	content: "0" counter(guia);

	font-size: 0.8rem;
	color: var(--color-borde);
}

.cw-guia-indice a:hover {
	text-decoration: underline;
	text-decoration-thickness: 3px;
}

.cw-guia-cuerpo {
	display: grid;
	gap: var(--space-medium);
}

/* keep the guide figure from stretching the section past the fold */
.cw-guia-cuerpo .cw-paspartu img {
	max-height: 300px;

	object-fit: cover;
}

.cw-guia-bloque {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 0 var(--space-large);
}

.cw-guia-bloque h3 {
	font-size: 1.35rem;
}

@media (min-width: 960px) {
	.cw-guia {
		grid-template-columns: 15rem minmax(0, 1fr);
		gap: var(--space-huge);
	}

	.cw-guia-indice {
		position: sticky;
		top: calc(var(--cw-altura-cabecera) + 1.5rem);
	}

	.cw-guia-indice ol {
		flex-direction: column;
	}

	.cw-guia-bloque {
		grid-template-columns: minmax(0, 1fr) 12rem;
	}
}

.cw-guia-nota {
	align-self: start;
	padding: 0.9rem 1rem;

	font-size: 0.95rem;

	background: var(--color-niebla);
	border-left: 4px solid var(--color-acento);
}

.cw-guia-nota strong {
	display: block;

	font-size: 1.3rem;
	font-weight: 400;
	color: var(--color-acento);
}

/* catalogue filter bar */
.cw-filtro {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: var(--space-small);
}

.cw-filtro .cw-etiqueta {
	margin-right: 0.3rem;
	margin-bottom: 0;
}

.cw-pestana[aria-pressed="true"] {
	color: var(--color-blanco);

	background: var(--color-texto);
}

/* deck-tabs */
.cw-pestanas {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: var(--space-medium);
}

.cw-pestana {
	min-height: 48px;
	padding: 0.5rem 1.1rem;

	font-family: var(--cw-letra-titulo);
	font-size: 0.95rem;
	font-weight: 500;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--color-texto);

	background: transparent;
	border: 1px solid var(--color-texto);
	cursor: pointer;
}

.cw-pestana[aria-selected="true"] {
	text-decoration: underline;
	text-decoration-color: var(--color-acento);
	text-decoration-thickness: 4px;
	text-underline-offset: 0.45em;

	border-width: 2px;
}

/* the open panel sits on a deck of two offset sheets */
.cw-mazo {
	position: relative;
	isolation: isolate;

	margin-right: 14px;
	margin-bottom: calc(14px + var(--space-small));
	padding: clamp(1rem, 2.4vw, 1.75rem);

	background: var(--color-blanco);
	border: 1px solid var(--color-borde);
	box-shadow: var(--cw-sombra-corta);
}

.cw-mazo::before,
.cw-mazo::after {
	content: "";
	position: absolute;
	z-index: -1;

	border: 1px solid var(--color-borde);
}

.cw-mazo::before {
	inset: 7px -7px -7px 7px;

	background: var(--color-niebla);
}

.cw-mazo::after {
	inset: 14px -14px -14px 14px;
	z-index: -2;

	background: var(--color-escarcha);
}

.cw-mazo + .cw-mazo {
	margin-top: var(--space-large);
}

.cw-mazo h3.cw-mazo-titulo {
	font-size: 1.1rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-acento);
}

.js .cw-mazo-titulo {
	display: none;
}

.js .cw-mazo + .cw-mazo {
	margin-top: 0;
}

/* stepped-grid */
.cw-escalera {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--space-medium);
	align-items: start;

	list-style: none;
	counter-reset: peldano;
}

.cw-peldano {
	position: relative;

	padding: 1.5rem 1.5rem 1.75rem;

	background: var(--color-blanco);
	border: 1px solid var(--color-borde);
	box-shadow: var(--cw-sombra);

	counter-increment: peldano;
}

.cw-peldano::before {
	content: counter(peldano);

	display: block;
	margin-bottom: 0.5rem;

	font-family: var(--cw-letra-titulo);
	font-size: 3.6rem;
	font-weight: 300;
	line-height: 1;
	color: var(--color-acento);
}

.cw-peldano h3 {
	font-size: 1.3rem;
}

.cw-peldano-dato {
	margin: 0.75rem 0 0;
	padding-top: 0.75rem;

	font-family: var(--cw-letra-titulo);
	font-size: 0.95rem;
	font-weight: 500;

	border-top: 1px solid var(--color-borde);
}

.cw-peldano-dato a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}

@media (max-width: 719px) {
	.cw-peldano:nth-child(2) {
		margin-left: 0.75rem;
	}

	.cw-peldano:nth-child(3) {
		margin-left: 1.5rem;
	}

	.cw-peldano:nth-child(4) {
		margin-left: 2.25rem;
	}
}

@media (min-width: 720px) {
	.cw-escalera {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.cw-peldano:nth-child(even) {
		margin-top: 2.5rem;
	}
}

@media (min-width: 1080px) {
	.cw-escalera {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.cw-peldano:nth-child(2) {
		margin-top: 2.5rem;
	}

	.cw-peldano:nth-child(3) {
		margin-top: 5rem;
	}

	.cw-peldano:nth-child(4) {
		margin-top: 7.5rem;
	}
}

/* horizontal-rail */
.cw-carril-cabeza {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--space-small);
}

.cw-carril-botones {
	display: flex;
	gap: 0.5rem;
	margin-bottom: var(--space-large);
}

.cw-carril {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--space-small);

	list-style: none;
}

.cw-carril .cw-tarjeta-cuerpo {
	padding: 0.75rem 0.9rem 1rem;
}

.cw-carril .cw-tarjeta h3 {
	font-size: 1.05rem;
}

@media (max-width: 639px) {
	.cw-carril-botones {
		display: none;
	}
}

@media (min-width: 640px) {
	.cw-carril {
		grid-template-columns: none;
		grid-auto-columns: minmax(15rem, 23%);
		grid-auto-flow: column;
		gap: var(--space-medium);
		overflow-x: auto;
		padding-bottom: 1.25rem;

		scroll-snap-type: x mandatory;
		scrollbar-color: var(--color-acento) var(--color-escarcha);
		scrollbar-width: thin;
	}

	.cw-carril > li {
		scroll-snap-align: start;
	}
}

/* team and cases */
.cw-caso {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.cw-caso dl {
	margin: 0;
}

.cw-caso dt {
	margin-top: 0.6rem;

	font-family: var(--cw-letra-titulo);
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-acento);
}

.cw-caso dd {
	margin: 0;
}

.cw-caso-plazo {
	margin-top: auto;
	padding-top: 0.75rem;

	border-top: 1px solid var(--color-borde);
}

/* call band */
.cw-llamada {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--space-medium);
	align-items: center;
}

.cw-llamada h2 {
	font-size: clamp(1.9rem, 3.6vw, 3rem);
}

@media (min-width: 960px) {
	.cw-llamada {
		grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
	}
}

/* tables */
.cw-tabla {
	font-size: 1rem;
}

.cw-tabla caption {
	padding-bottom: 0.6rem;

	font-family: var(--cw-letra-titulo);
	font-size: 1.05rem;
	font-weight: 500;
	text-align: left;
}

.cw-tabla th,
.cw-tabla td {
	padding: 0.65rem 0.75rem;

	text-align: left;
	vertical-align: top;

	border-bottom: 1px solid var(--color-borde);
}

.cw-tabla thead th {
	font-family: var(--cw-letra-titulo);
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;

	background: var(--color-niebla);
}

.cw-tabla tbody th {
	font-weight: 600;
}

.cw-tabla-envoltura {
	max-width: 100%;
	overflow-x: auto;
}

.cw-tabla-datos th {
	width: 34%;
}

.cw-tabla-datos td {
	overflow-wrap: anywhere;
}

@media (max-width: 559px) {
	.cw-tabla {
		font-size: 0.95rem;
	}

	.cw-tabla th,
	.cw-tabla td {
		padding: 0.55rem 0.4rem;
	}
}

/* product page */
.cw-ficha {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--space-large);
	align-items: start;
}

@media (min-width: 900px) {
	.cw-ficha {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		grid-template-areas: "foto compra";
	}

	.cw-ficha-compra {
		grid-area: compra;
	}

	.cw-ficha-foto {
		grid-area: foto;
	}
}

.cw-ficha-compra h1 {
	font-size: clamp(2rem, 3.4vw, 3rem);
}

.cw-ficha-precio {
	margin-bottom: 0.25rem;

	font-family: var(--cw-letra-titulo);
	font-size: 1.8rem;
	font-weight: 500;
}

.cw-ficha-precio small {
	font-size: 0.95rem;
	font-weight: 400;
	color: var(--color-gris);
}

.cw-ficha-foto img {
	max-height: 62vh;

	object-fit: cover;
}

.cw-tallas {
	margin: var(--space-medium) 0 var(--space-small);
	padding: 0;

	border: 0;
}

.cw-tallas legend,
.cw-etiqueta {
	display: block;
	margin-bottom: 0.4rem;
	padding: 0;

	font-family: var(--cw-letra-titulo);
	font-size: 0.95rem;
	font-weight: 600;
}

.cw-tallas-lista {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.cw-talla {
	position: relative;
}

/* radio stays in the box under its label so it keeps native focus and form behaviour */
.cw-talla input {
	position: absolute;
	inset: 0;

	width: 100%;
	height: 100%;
	margin: 0;

	appearance: none;
	cursor: pointer;
}

.cw-talla span {
	display: inline-grid;
	place-items: center;
	min-width: 3.25rem;
	min-height: 48px;
	padding: 0.25rem 0.75rem;

	font-family: var(--cw-letra-titulo);
	font-weight: 500;

	border: 1px solid var(--color-texto);
}

.cw-talla input:checked + span {
	color: var(--color-blanco);

	background: var(--color-texto);
}

.cw-talla input:focus-visible + span {
	outline: 3px solid var(--color-senal);
	outline-offset: 2px;
}

.cw-talla.out span {
	color: var(--color-gris);

	border-style: dashed;
	border-color: var(--color-gris);
	text-decoration: line-through;
}

.cw-talla.out input {
	cursor: not-allowed;
}

.cw-compra-fila {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 0.75rem;
	margin-top: var(--space-small);
}

.cw-compra-fila select {
	min-width: 5rem;
}

.cw-aviso-linea {
	min-height: 1.6em;
	margin-top: 0.75rem;

	font-weight: 600;
}

.cw-ficha-enlaces {
	display: flex;
	flex-wrap: wrap;
	gap: 0 1.25rem;
	margin-top: var(--space-small);

	list-style: none;
}

.cw-ficha-enlaces a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}

/* forms */
.cw-form {
	display: grid;
	gap: 1.1rem;
}

.cw-form-dos {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 1.1rem;
}

@media (min-width: 640px) {
	.cw-form-dos {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}
}

.cw-campo input,
.cw-campo textarea,
.cw-campo select,
.cw-compra-fila select {
	display: block;
	width: 100%;
	min-height: 48px;
	padding: 0.6rem 0.8rem;

	background: var(--color-blanco);
	border: 1px solid var(--color-gris);
	border-radius: 0;
}

.cw-campo textarea {
	min-height: 9rem;

	resize: vertical;
}

.cw-campo input[aria-invalid="true"],
.cw-campo textarea[aria-invalid="true"] {
	border: 2px solid var(--color-texto);
}

.cw-ayuda {
	margin: 0.3rem 0 0;

	font-size: 0.9rem;
	color: var(--color-gris);
}

.cw-error {
	margin: 0.35rem 0 0;
	padding-left: 0.6rem;

	font-size: 0.95rem;
	font-weight: 600;

	border-left: 3px solid var(--color-texto);
}

.cw-casilla {
	display: flex;
	align-items: flex-start;
	gap: 0.7rem;
	min-height: 44px;
}

.cw-casilla input {
	flex: none;
	width: 1.3rem;
	height: 1.3rem;
	margin-top: 0.2rem;

	accent-color: var(--color-acento);
}

.cw-form-estado {
	min-height: 1.6em;
	margin: 0;

	font-weight: 600;
}

.cw-pago {
	margin: 0;
	padding: 1rem 1.25rem;

	background: var(--color-niebla);
	border: 1px solid var(--color-borde);
}

.cw-pago legend {
	padding: 0 0.4rem;

	font-family: var(--cw-letra-titulo);
	font-weight: 600;
}

/* bag, summary, drawer */
.cw-lineas {
	display: grid;
	gap: 0.75rem;

	list-style: none;
}

.cw-linea {
	display: grid;
	grid-template-columns: 4.5rem minmax(0, 1fr) auto;
	gap: 0.4rem 1rem;
	align-items: center;
	padding: 0.75rem;

	background: var(--color-blanco);
	border: 1px solid var(--color-borde);
}

.cw-linea-muestra {
	grid-row: span 2;
	aspect-ratio: 1;

	background-color: var(--tela, #E2E9EF);
	background-position: center;
	background-size: cover;
	border: 1px solid var(--color-borde);
}

.cw-linea-nombre {
	margin: 0;

	font-family: var(--cw-letra-titulo);
	font-weight: 500;
}

.cw-linea-nombre a {
	color: var(--color-texto);
}

.cw-linea-meta {
	margin: 0;

	font-size: 0.95rem;
	color: var(--color-gris);
}

.cw-linea-controles {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
}

.cw-linea-controles select {
	min-height: 44px;
	padding: 0.3rem 0.5rem;

	background: var(--color-blanco);
	border: 1px solid var(--color-gris);
}

.cw-linea-importe {
	font-family: var(--cw-letra-titulo);
	font-weight: 600;
	text-align: right;
}

.cw-quitar {
	min-height: 44px;
	padding: 0 0.5rem;

	font-size: 0.95rem;
	color: var(--color-acento);
	text-decoration: underline;

	background: transparent;
	border: 0;
	cursor: pointer;
}

.cw-resumen dl {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 0.4rem 1rem;
	margin: 0 0 var(--space-small);
}

.cw-resumen dt,
.cw-resumen dd {
	margin: 0;
}

.cw-resumen dd {
	font-family: var(--cw-letra-titulo);
	font-weight: 500;
	text-align: right;
}

.cw-resumen .cw-total {
	padding-top: 0.6rem;

	font-family: var(--cw-letra-titulo);
	font-size: 1.3rem;
	font-weight: 600;

	border-top: 2px solid var(--color-texto);
}

.cw-vacio {
	padding: 2rem;

	text-align: center;

	background: var(--color-niebla);
	border: 1px dashed var(--color-gris);
}

.cw-cajon {
	position: fixed;
	inset: 0;
	z-index: 55;

	visibility: hidden;
}

.cw-cajon.here {
	visibility: visible;
}

.cw-cajon-velo {
	position: absolute;
	inset: 0;

	background: #0F1A2666;
}

.cw-cajon-panel {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;

	display: flex;
	flex-direction: column;
	gap: 1rem;
	width: min(27rem, 100%);
	padding: 1.25rem;
	overflow-y: auto;

	background: var(--color-blanco);
	border-left: 1px solid var(--color-texto);
	box-shadow: var(--cw-sombra);
}

.cw-cajon-cabeza {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.cw-cajon-titulo {
	margin: 0;

	font-family: var(--cw-letra-titulo);
	font-size: 1.4rem;
	font-weight: 300;
	text-transform: uppercase;
}

.cw-cajon-acciones {
	display: grid;
	gap: 0.6rem;
	margin-top: auto;
}

/* cookie notice: top-right card on desktop, bottom strip below 960px */
.privacy-notice {
	position: fixed;
	top: calc(var(--cw-altura-cabecera) + 0.75rem);
	right: 1rem;
	z-index: 40;

	width: min(21rem, calc(100vw - 2rem));
	padding: 1rem 1.1rem;

	font-size: 0.95rem;
	line-height: 1.45;

	background: var(--color-blanco);
	border: 1px solid var(--color-texto);
	box-shadow: var(--cw-sombra);
}

.cw-aviso-texto {
	margin-bottom: 0.75rem;
}

.cw-aviso-botones {
	display: flex;
	gap: 0.6rem;
}

.cw-aviso-botones .cw-btn {
	flex: 1;
}

@media (max-width: 959px) {
	.privacy-notice {
		top: auto;
		right: 0;
		bottom: 0;
		left: 0;

		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 0.5rem 1rem;
		width: auto;
		padding: 0.6rem var(--cw-margen);

		border-width: 1px 0 0;
	}

	.privacy-notice[hidden] {
		display: none;
	}

	.cw-aviso-texto {
		flex: 1 1 20rem;
		margin: 0;
	}

	.cw-aviso-botones {
		flex: 1 1 14rem;
	}
}

/* status and order */
.cw-estados {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--space-small);

	list-style: none;
}

@media (min-width: 720px) {
	.cw-estados {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

.cw-estado {
	padding: 1rem 1.1rem;

	background: var(--color-blanco);
	border: 1px solid var(--color-borde);
	border-top: 4px solid var(--color-borde);
}

.cw-estado.here {
	border-top-color: var(--color-acento);
	box-shadow: var(--cw-sombra);
}

.cw-estado strong {
	display: block;
	margin-bottom: 0.3rem;

	font-weight: 500;
}

.cw-numero-pedido {
	display: inline-block;
	padding: 0.4rem 0.9rem;

	font-family: var(--cw-letra-titulo);
	font-size: clamp(1.3rem, 3vw, 1.9rem);
	font-weight: 500;
	letter-spacing: 0.08em;

	border: 2px solid var(--color-texto);
}

/* legal pages */
.cw-indice-legal ol {
	display: grid;
	gap: 0.15rem;
	padding-left: 1.25rem;
}

.cw-indice-legal a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}

.cw-legal h2 {
	margin-top: var(--space-large);

	font-size: clamp(1.3rem, 2vw, 1.7rem);
}

.cw-legal h2:first-child {
	margin-top: 0;
}

.cw-formulario-modelo {
	padding: 1.5rem;

	font-family: var(--cw-letra-texto);

	background: var(--color-niebla);
	border: 1px dashed var(--color-texto);
}

.cw-formulario-modelo p {
	margin-bottom: 0.6rem;
}

/* hidden attribute must win over component display (grid/flex) */
[hidden] {
	display: none;
}