/* comunes a todas las páginas */
:root {
	--telon: #5c1a24;
	--telon-oscuro: #3a0f17;
	--crema: #f6ead7;
	--papel: #fff7ea;
	--luz: #f2c14e;
	--gris: #b9a99a;
	--serif: 'DM Serif Display', Georgia, serif;
	--sans: 'Work Sans', Arial, sans-serif;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }

body {
	margin: 0;
	background: var(--telon-oscuro);
	color: var(--crema);
	font-family: var(--sans);
	font-size: 1.05rem;
	line-height: 1.6;
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--luz); }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; line-height: 1.08; margin: 0 0 16px; }
h2 { font-size: 2.6rem; }
em { font-style: italic; color: var(--luz); }

.cont { max-width: 1080px; margin: 0 auto; padding: 0 20px; }

.boton {
	display: inline-block;
	padding: 14px 26px;
	border: 0;
	border-radius: 2px;
	background: var(--luz);
	color: var(--telon-oscuro);
	font: 600 1rem var(--sans);
	text-decoration: none;
	cursor: pointer;
	transition: transform .2s ease, background-color .2s;
}
.boton:hover { transform: translateY(-2px); background: #ffd36b; }
.boton-claro { background: transparent; color: var(--crema); box-shadow: inset 0 0 0 2px var(--crema); }
.boton-claro:hover { background: var(--crema); color: var(--telon-oscuro); }
.boton-chico { padding: 9px 16px; font-size: .9rem; }

.headbar { position: sticky; top: 0; z-index: 20; background: var(--telon-oscuro); border-bottom: 1px solid rgba(246, 234, 215, .15); }
.headbar-row { display: flex; align-items: center; justify-content: space-between; min-height: 76px; }
.headbar-nav { display: flex; gap: 26px; align-items: center; }
.headbar-nav a { color: var(--crema); text-decoration: none; font-weight: 500; }
.headbar-nav a:hover { color: var(--luz); }
.headbar-cta { padding: 8px 14px; border: 1px solid var(--luz); color: var(--luz) !important; }
.headbar-toggle { display: none; width: 40px; height: 40px; border: 0; background: none; cursor: pointer; }
.headbar-toggle span { display: block; height: 2px; margin: 7px 6px; background: var(--crema); transition: transform .3s; }
.headbar-toggle[aria-expanded='true'] span:first-child { transform: translateY(4.5px) rotate(45deg); }
.headbar-toggle[aria-expanded='true'] span:last-child { transform: translateY(-4.5px) rotate(-45deg); }

.tailblock { padding: 40px 0; background: #2a0b11; font-size: .92rem; color: var(--gris); }
.tailblock-row { display: grid; gap: 14px; }
.tailblock nav { display: flex; flex-wrap: wrap; gap: 6px 22px; }
.tailblock a { color: var(--crema); }
.tailblock p { margin: 0; }
.como-link { padding: 0; border: 0; background: none; color: var(--crema); font: inherit; text-decoration: underline; cursor: pointer; }

.aviso-cookies {
	position: fixed;
	left: 16px;
	bottom: 16px;
	z-index: 50;
	max-width: 380px;
	padding: 18px;
	background: var(--papel);
	color: var(--telon-oscuro);
	font-size: .92rem;
	box-shadow: 0 12px 40px rgba(0, 0, 0, .45);
}
.aviso-cookies a { color: var(--telon); }
.aviso-opcion { display: block; margin: 8px 0; }
.aviso-botones { display: flex; flex-wrap: wrap; gap: 8px; }
.aviso-cookies .boton-claro { color: var(--telon-oscuro); box-shadow: inset 0 0 0 2px var(--telon-oscuro); }

@media (max-width: 820px) {
	h2 { font-size: 2rem; }
	.headbar-toggle { display: block; }
	.headbar-nav { position: absolute; left: 0; right: 0; top: 100%; display: none; flex-direction: column; align-items: flex-start; gap: 16px; padding: 20px; background: var(--telon-oscuro); border-bottom: 1px solid rgba(246, 234, 215, .15); }
	.headbar-nav.abierto { display: flex; }
}