/**
 * Capa temporal del 50é aniversari.
 *
 * Aquest full només es carrega mentre l’opció «Mostra la commemoració del
 * 50é aniversari» està activa. Totes les classes comencen per ccc-anniversary-.
 * Cap regla d’ací modifica la capçalera, el peu o la tipografia permanents.
 *
 * Colors i dibuixos presos del logotip oficial del 50é aniversari
 * (assets/images/aniversari/).
 */

:root {
	--ccc-50-blau: #7e9cc4;
	--ccc-50-blau-clar: #e9eef6;
	--ccc-50-tinta: #2e4f74;
	--ccc-50-sol: #e4d85a;
	--ccc-50-taronja: #b9481a;
}

/* Franja superior ------------------------------------------------------------- */
.ccc-anniversary-franja {
	margin: 0 !important;
	background: var(--ccc-50-tinta);
	color: var(--wp--preset--color--base, #fbf9f8);
	padding: 0.45rem var(--wp--custom--gutter, 1rem);
	position: relative;
	z-index: 21;
}

.ccc-anniversary-franja__interior {
	gap: 0.25rem 1rem;
	align-items: baseline;
	text-align: center;
}

.ccc-anniversary-franja__text {
	margin: 0;
	font-size: var(--wp--preset--font-size--small, 1rem);
	line-height: 1.35;
}

.ccc-anniversary-franja__ma {
	font-family: var(--wp--custom--font--ma, Caveat, cursive);
	font-size: 1.45rem;
	font-weight: 700;
	color: var(--ccc-50-sol);
	margin-right: 0.35rem;
	display: inline-block;
	transform: rotate(-2deg);
}

.ccc-anniversary-franja__enllac {
	margin: 0 !important;
}

.ccc-anniversary-franja a,
.ccc-anniversary-franja a.ccc-enllac-fletxa {
	color: #fff;
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.ccc-anniversary-franja :focus-visible {
	outline-color: #fff;
}

@media (max-width: 599px) {
	.ccc-anniversary-franja__frase {
		display: none;
	}
}

/* Logotip oficial ------------------------------------------------------------------ */
.ccc-anniversary-block--logo {
	margin: 0 !important;
}

.ccc-anniversary-logo {
	display: block;
	width: clamp(15rem, 34vw, 26rem);
	max-width: 100%;
	height: auto;
}

.ccc-anniversary-logo-link {
	display: inline-block;
	border-radius: 8px;
	transition: transform 200ms ease-out;
}

.ccc-anniversary-logo-link:hover {
	transform: rotate(-1.5deg) scale(1.02);
}

/* Xifra «50» encerclada a mà ---------------------------------------------------- */
.ccc-anniversary-block--xifra {
	margin: 0 !important;
}

.ccc-anniversary-xifra {
	position: relative;
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: clamp(12rem, 26vw, 17rem);
	aspect-ratio: 11 / 8;
	color: var(--wp--preset--color--accent-1, #99042e);
}

.ccc-anniversary-xifra__cercle {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	overflow: visible;
}

.ccc-anniversary-xifra__cercle path {
	fill: none;
	stroke: currentColor;
	stroke-width: 3.5;
	stroke-linecap: round;
	stroke-dasharray: 1;
	stroke-dashoffset: 0;
}

@media (prefers-reduced-motion: no-preference) {
	.ccc-anniversary-xifra__cercle path {
		animation: ccc-anniversary-dibuixa 1.6s 0.3s ease-out both;
	}
}

@keyframes ccc-anniversary-dibuixa {
	from {
		stroke-dashoffset: 1;
	}
	to {
		stroke-dashoffset: 0;
	}
}

.ccc-anniversary-xifra__num {
	position: relative;
	font-family: var(--wp--preset--font-family--titular, "EB Garamond", serif);
	font-size: clamp(4.25rem, 9vw, 6.5rem);
	font-weight: 600;
	font-style: italic;
	line-height: 0.85;
	letter-spacing: -0.04em;
	color: var(--wp--preset--color--accent-1, #99042e);
}

/* «anys» dins del cercle, sota la xifra, sense tocar el traç. */
.ccc-anniversary-xifra__anys {
	position: relative;
	margin-top: 0.1em;
	font-family: var(--wp--custom--font--ma, Caveat, cursive);
	font-size: clamp(1.45rem, 2.6vw, 1.9rem);
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.02em;
	color: var(--wp--preset--color--vermell-fosc, #6f0322);
	transform: rotate(-3deg);
}

.ccc-anniversary-xifra__rang {
	position: absolute;
	left: 50%;
	top: -0.4rem;
	translate: -50% 0;
	white-space: nowrap;
	font-family: var(--wp--custom--font--ma, Caveat, cursive);
	font-size: 1.35rem;
	font-weight: 700;
	color: var(--wp--preset--color--tinta, #26406a);
	transform: rotate(-6deg);
}

/* Bloc de portada ---------------------------------------------------------------- */
.ccc-anniversary-feature {
	margin-block-start: var(--wp--preset--spacing--60, 3rem) !important;
	background: var(--ccc-50-blau-clar);
	border-radius: 6px;
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

/* Perfil del Maigmó al peu del bloc. */
.ccc-anniversary-feature::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 0;
	background:
		url("../images/aniversari/dibuixos/dolcaina.webp") no-repeat right 1.5rem top 1.25rem / 7.5rem auto,
		url("../images/aniversari/dibuixos/pilota.webp") no-repeat right 10rem top 0.9rem / 2.6rem auto,
		url("../images/aniversari/dibuixos/tabal.webp") no-repeat right 1.75rem bottom 2.75rem / 5.5rem auto,
		url("../images/aniversari/dibuixos/castanyoles.webp") no-repeat right 8rem bottom 2.25rem / 3.6rem auto;
}

.ccc-anniversary-feature::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: clamp(2.5rem, 7vw, 5rem);
	background: var(--ccc-50-blau);
	opacity: 0.35;
	-webkit-mask: url("../images/silueta-maigmo.svg") no-repeat center bottom / 100% 100%;
	mask: url("../images/silueta-maigmo.svg") no-repeat center bottom / 100% 100%;
	z-index: -1;
	pointer-events: none;
}

.ccc-anniversary-feature__interior {
	display: grid;
	gap: 1.5rem 3.5rem;
	align-items: center;
	padding: clamp(1.75rem, 5vw, 3.5rem) clamp(1.25rem, 5vw, 3.5rem) clamp(3rem, 8vw, 5rem);
	position: relative;
	z-index: 1;
}

@media (min-width: 64em) {
	.ccc-anniversary-feature__interior {
		padding-right: 11rem;
	}
}

@media (max-width: 63.99em) {
	.ccc-anniversary-feature::before {
		background:
			url("../images/aniversari/dibuixos/dolcaina.webp") no-repeat right 1rem top 1rem / 5rem auto,
			url("../images/aniversari/dibuixos/tabal.webp") no-repeat right 1rem bottom 2rem / 3.6rem auto;
		opacity: 0.9;
	}
}

.ccc-anniversary-feature__interior > * {
	margin: 0 !important;
}

.ccc-anniversary-feature__xifra {
	justify-self: center;
}

.ccc-anniversary-feature__text > * {
	margin-block: 0;
}

.ccc-anniversary-feature__text > * + * {
	margin-block-start: 0.9rem;
}

.ccc-anniversary-feature .ccc-avant {
	color: var(--ccc-50-taronja);
}

.ccc-anniversary-feature__titol {
	font-size: var(--wp--preset--font-size--xx-large);
	color: var(--ccc-50-tinta);
	max-width: 22ch;
}

.ccc-anniversary-feature__entradeta {
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.5;
	max-width: 40rem;
}

.ccc-anniversary-feature__accions {
	gap: 0.75rem;
	margin-block-start: 1.5rem !important;
}

.ccc-anniversary-feature__accions .wp-block-button:not(.is-style-ccc-secundari) .wp-block-button__link {
	background: var(--ccc-50-tinta);
}

.ccc-anniversary-feature__accions .wp-block-button:not(.is-style-ccc-secundari) .wp-block-button__link:hover {
	background: #1f3a58;
}

@media (min-width: 48em) {
	.ccc-anniversary-feature__interior {
		grid-template-columns: auto minmax(0, 1fr);
	}
}

/* Marca «50 anys» d’una entrada ----------------------------------------------------- */
.ccc-anniversary-marker {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	margin: 0 !important;
	font-family: var(--wp--custom--font--ma, Caveat, cursive);
	font-size: 1.3rem;
	font-weight: 700;
	line-height: 1;
	color: var(--wp--preset--color--accent-1, #99042e);
	transform: rotate(-3deg);
}

.ccc-anniversary-marker__punt {
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 50%;
	border: 2px solid currentColor;
}

/* Pàgina de l’aniversari ---------------------------------------------------------- */
.ccc-anniversary-pagina__cap {
	display: grid;
	justify-items: center;
	text-align: center;
	gap: 1rem;
	padding-block: var(--wp--preset--spacing--60, 3rem) var(--wp--preset--spacing--50, 2.5rem);
	border-bottom: 1px solid var(--wp--preset--color--accent-6, #e6d2d8);
}

.ccc-anniversary-pagina__cap > * {
	margin: 0 !important;
}

.ccc-anniversary-pagina__cap h1 {
	max-width: 18ch;
	color: var(--ccc-50-tinta);
}

.ccc-anniversary-pagina__cap .ccc-anniversary-logo {
	width: clamp(16rem, 60vw, 36rem);
}

.ccc-anniversary-pagina__cap {
	position: relative;
}

.ccc-anniversary-pagina__cap::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background:
		url("../images/aniversari/dibuixos/barret.webp") no-repeat left 3% top 2.5rem / 6rem auto,
		url("../images/aniversari/dibuixos/llibre.webp") no-repeat left 7% top 10rem / 5.5rem auto,
		url("../images/aniversari/dibuixos/castell.webp") no-repeat right 3% top 2rem / 8rem auto,
		url("../images/aniversari/dibuixos/mascares.webp") no-repeat right 7% top 10rem / 5.5rem auto;
	opacity: 0.95;
}

.ccc-anniversary-pagina__cap > * {
	position: relative;
	z-index: 1;
}

.ccc-anniversary-pagina__cap .is-style-ccc-entradeta {
	max-width: 40rem;
}

@media (max-width: 63.99em) {
	.ccc-anniversary-pagina__cap::before {
		content: none;
	}
}

.ccc-anniversary-pagina__eixos {
	margin-block-start: var(--wp--preset--spacing--50, 2.5rem) !important;
}

.ccc-anniversary-pagina__eixos .wp-block-column {
	border-top: 4px solid var(--ccc-50-tinta);
	padding-top: 1rem;
}

.ccc-peu__aniversari {
	margin: 0 !important;
}

/* Segell clàssic i distintiu petit (opcionals; ja no s’usen a la capçalera ni a la portada). */
.ccc-anniversary-seal {
	display: block;
	overflow: visible;
}

.ccc-anniversary-seal__anell {
	fill: var(--wp--preset--color--base, #fbf9f8);
	stroke: var(--wp--preset--color--accent-1, #99042e);
	stroke-width: 3;
}

.ccc-anniversary-seal__filet {
	fill: none;
	stroke: var(--wp--preset--color--accent-2, #c98a98);
	stroke-width: 1.25;
}

.ccc-anniversary-seal__circular {
	font-family: var(--wp--preset--font-family--newsreader, serif);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 2.4px;
	text-transform: uppercase;
	fill: var(--wp--preset--color--accent-1, #99042e);
}

.ccc-anniversary-seal__xifra {
	font-family: var(--wp--preset--font-family--titular, "EB Garamond", serif);
	font-size: 78px;
	font-weight: 600;
	fill: var(--wp--preset--color--accent-1, #99042e);
}

.ccc-anniversary-seal--petit .ccc-anniversary-seal__xifra {
	font-size: 100px;
}

.ccc-anniversary-seal__anys {
	font-family: var(--wp--custom--font--ma, Caveat, cursive);
	font-size: 26px;
	fill: var(--wp--preset--color--tinta, #26406a);
}

.ccc-anniversary-seal__serra {
	fill: none;
	stroke: var(--wp--preset--color--accent-2, #c98a98);
	stroke-width: 2;
	stroke-linejoin: round;
	stroke-linecap: round;
}

.ccc-anniversary-block--gran .ccc-anniversary-seal {
	width: clamp(8.5rem, 18vw, 12.5rem);
	height: auto;
	aspect-ratio: 1;
}

.ccc-anniversary-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	color: var(--wp--preset--color--accent-1, #99042e);
	text-decoration: none;
	font-family: var(--wp--custom--font--ma, Caveat, cursive);
	font-size: 1.3rem;
	font-weight: 700;
}

.ccc-anniversary-badge .ccc-anniversary-seal {
	width: 30px;
	height: 30px;
}

/* Durant l’aniversari, les targetes de «Explora el Centre» porten un dibuix del logotip. */
.ccc-anniversary-on .ccc-index__seccio.ccc-section .ccc-index__enllac::after {
	-webkit-mask: none;
	mask: none;
	opacity: 1;
	width: 4.6rem;
	height: 3.6rem;
	right: 0.75rem;
	bottom: auto;
	top: 0.9rem;
	background: none no-repeat right top / contain;
	transform: rotate(6deg);
	z-index: 0;
}

.ccc-anniversary-on .ccc-index__seccio.ccc-section .ccc-index__nom,
.ccc-anniversary-on .ccc-index__seccio.ccc-section .ccc-index__desc {
	padding-right: 4.4rem;
	position: relative;
	z-index: 1;
}

.ccc-anniversary-on .ccc-index__seccio.ccc-section--senderisme .ccc-index__enllac::after,
.ccc-anniversary-on .ccc-index__seccio.ccc-section--rutes .ccc-index__enllac::after { background-image: url("../images/aniversari/dibuixos/excursionista.webp"); }
.ccc-anniversary-on .ccc-index__seccio.ccc-section--enric-valor .ccc-index__enllac::after { background-image: url("../images/aniversari/dibuixos/barret.webp"); }
.ccc-anniversary-on .ccc-index__seccio.ccc-section--literari .ccc-index__enllac::after,
.ccc-anniversary-on .ccc-index__seccio.ccc-section--la-finestreta .ccc-index__enllac::after { background-image: url("../images/aniversari/dibuixos/llibre.webp"); }
.ccc-anniversary-on .ccc-index__seccio.ccc-section--cinema .ccc-index__enllac::after { background-image: url("../images/aniversari/dibuixos/claqueta.webp"); }
.ccc-anniversary-on .ccc-index__seccio.ccc-section--teatre .ccc-index__enllac::after { background-image: url("../images/aniversari/dibuixos/mascares.webp"); }
.ccc-anniversary-on .ccc-index__seccio.ccc-section--concerts .ccc-index__enllac::after { background-image: url("../images/aniversari/dibuixos/tabal.webp"); }
.ccc-anniversary-on .ccc-index__seccio.ccc-section--fira-fantasia .ccc-index__enllac::after { background-image: url("../images/aniversari/dibuixos/barret-negre.webp"); }
.ccc-anniversary-on .ccc-index__seccio.ccc-section--conferencies .ccc-index__enllac::after { background-image: url("../images/aniversari/dibuixos/triangle.webp"); }
.ccc-anniversary-on .ccc-index__seccio.ccc-section--albada-valor .ccc-index__enllac::after { background-image: url("../images/aniversari/dibuixos/foc.webp"); }

/* El barret de colors del logotip, damunt del cim del Maigmó. */
.ccc-anniversary-on .ccc-silueta::after {
	background: url("../images/aniversari/dibuixos/barret.webp") no-repeat center bottom / contain;
	-webkit-mask: none;
	mask: none;
	aspect-ratio: 166 / 113;
}

/* A l’editor, el contenidor condicional es veu marcat. */
.editor-styles-wrapper .ccc-anniversary-container {
	outline: 1px dashed var(--wp--preset--color--accent-2, #c98a98);
	outline-offset: 4px;
}