/*
 * Habitação: estilos do tema.
 * Os tokens (cores, tipos, espaçamentos) vivem no theme.json; aqui ficam os componentes.
 */

:root {
	--hab-ink: var(--wp--preset--color--ink);
	--hab-blue: var(--wp--preset--color--azulejo);
	--hab-blue-deep: var(--wp--preset--color--azulejo-deep);
	/* A cor de destaque: laranja #FF6A13 desde a 3.9.9 (antes vermelho #FF3C3C; o slug
	   continua «amarelo»). Os comentários mais antigos ainda lhe chamam «vermelho». */
	--hab-yellow: var(--wp--preset--color--amarelo);
	--hab-paper: var(--wp--preset--color--paper);
	--hab-base: var(--wp--preset--color--base);
	--hab-border: 3px solid var(--hab-ink);
	--hab-shadow: 6px 6px 0 var(--hab-ink);

	/* Azulejo: ../img/azulejo.svg (cor) e ../img/azulejo-motif.svg (máscara, qualquer cor). */
	--hab-tile-band: 48px;
}

/* ---------- Base ---------- */

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

::selection {
	background: var(--hab-yellow);
	color: var(--hab-ink);
}

:where(a, button, summary, input):focus-visible {
	outline: 3px solid var(--hab-yellow);
	outline-offset: 3px;
	box-shadow: 0 0 0 6px var(--hab-ink);
}

/* Secções coladas umas às outras: o ritmo vem do padding, não das margens. */
.wp-site-blocks > *,
.hab-main,
.hab-main > *,
.hab-landing > .alignfull,
.hab-prose > .alignfull {
	margin-block: 0;
}

.hab-section {
	position: relative;
	overflow: clip;
}

.hab-section > * {
	position: relative;
}

/*
 * Secções largas: alinhar à esquerda da coluna de 1280px os elementos com
 * largura própria (texto de abertura, frases), em vez de os centrar.
 */
.hab-section.is-layout-constrained:not(.hab-narrow) > :not(.alignfull) {
	margin-left: max(0px, calc((100% - 1280px) / 2)) !important;
	margin-right: auto !important;
}

.hab-display {
	/* Anton tem maiúsculas altas: abaixo disto, cedilhas e tils tocam na linha seguinte. */
	line-height: 1.15 !important;
	letter-spacing: -0.005em;
	text-wrap: balance;
}

h2,
h3 {
	text-wrap: balance;
}

.hab-kicker {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	margin-bottom: 0;
	font-size: 0.875rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.hab-kicker::before {
	content: "";
	width: 1.75rem;
	height: 0.35rem;
	background: var(--hab-yellow);
	box-shadow: 2px 2px 0 var(--hab-ink);
}

.hab-lead {
	max-width: 62ch;
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.5;
}

.hab-statement {
	margin-top: var(--wp--preset--spacing--50) !important;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--x-large);
	line-height: 1.15;
	text-transform: uppercase;
	max-width: 30ch;
}

.hab-statement::first-line {
	color: var(--hab-blue);
}

.hab-textlink a {
	font-weight: 800;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.25em;
}

/* ---------- Botões ---------- */

.wp-block-button__link {
	transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.wp-block-button__link:hover {
	transform: translate(-2px, -2px);
	box-shadow: 8px 8px 0 var(--hab-ink);
}

.wp-block-button__link:active {
	transform: translate(3px, 3px);
	box-shadow: 1px 1px 0 var(--hab-ink);
}

.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: inherit;
	border: 3px solid currentColor;
	padding: 0.85em 1.4em;
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--hab-ink);
	color: var(--hab-yellow);
	border-color: var(--hab-ink);
}

.wp-block-button.is-style-ink > .wp-block-button__link {
	background: var(--hab-ink);
	color: var(--hab-yellow);
}

.wp-block-button.is-style-ink > .wp-block-button__link:hover {
	background: var(--hab-blue);
	color: var(--hab-base);
}

/* Botões claros sobre fundos escuros. */
.has-azulejo-background-color .wp-block-button.is-style-outline > .wp-block-button__link,
.has-azulejo-deep-background-color .wp-block-button.is-style-outline > .wp-block-button__link,
.has-ink-background-color .wp-block-button.is-style-outline > .wp-block-button__link {
	color: var(--hab-base);
	border-color: var(--hab-base);
	box-shadow: 6px 6px 0 rgba(0, 0, 0, 0.35);
}

.has-azulejo-background-color .wp-block-button.is-style-outline > .wp-block-button__link:hover,
.has-azulejo-deep-background-color .wp-block-button.is-style-outline > .wp-block-button__link:hover,
.has-ink-background-color .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--hab-base);
	color: var(--hab-ink);
}

.hab-section .wp-block-buttons {
	margin-top: var(--wp--preset--spacing--50);
}

/* ---------- Barra superior e cabeçalho ---------- */

.hab-topbar {
	padding-block: 0.4rem;
	font-size: 0.875rem;
}

.hab-topbar p {
	margin: 0;
}

.hab-topbar a {
	color: var(--hab-yellow);
}

/*
 * Cabeçalho fixo, mas só a barra principal: a barra superior (língua, contacto)
 * sobe com a página. --hab-topbar-h é medido em theme.js.
 */
.hab-site-header {
	position: sticky;
	top: calc(-1 * var(--hab-topbar-h, 0px));
	z-index: 50;
}

.admin-bar .hab-site-header {
	top: calc(var(--wp-admin--admin-bar--height, 32px) - var(--hab-topbar-h, 0px));
}

html {
	scroll-padding-top: 6.5rem;
}

/* Ecrãs muito baixos (telemóvel deitado, zoom forte): nada fixo. */
@media (max-height: 500px) {
	.hab-site-header {
		position: relative;
		top: auto !important;
	}

	html {
		scroll-padding-top: 0;
	}
}

@media (max-width: 600px) {
	/* No telemóvel a barra de administração não é fixa. */
	.admin-bar .hab-site-header {
		top: calc(-1 * var(--hab-topbar-h, 0px));
	}
}

/* Barra superior: frase e email só quando cabem numa linha (o email também está no rodapé). */
@media (max-width: 781px) {
	/* O email também está no rodapé: no telemóvel, a barra fica só com a língua. */
	.hab-topbar__text {
		position: absolute !important;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
	}

	.hab-topbar__inner {
		justify-content: flex-end !important;
	}
}

.hab-header {
	padding-block: 0.85rem;
	border-bottom: var(--hab-border);
}

.hab-header__bar,
.hab-header__nav {
	gap: clamp(0.75rem, 2vw, 2rem);
}

.hab-brand {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	margin: 0;
}

.hab-brand::before {
	content: "";
	flex: none;
	width: 2.25rem;
	height: 2.25rem;
	background: #fbf8f1 url(../img/azulejo.svg) center / 100% 100%;
	border: var(--hab-border);
	box-shadow: 3px 3px 0 var(--hab-ink);
}

.hab-brand a {
	color: inherit;
	padding-block: 0.4rem;
	text-decoration: none;
}

.hab-nav .wp-block-navigation-item__content {
	padding-block: 0.35rem;
	text-decoration: none;
	background: linear-gradient(var(--hab-yellow), var(--hab-yellow)) left 100% / 0 0.35em no-repeat;
	transition: background-size 0.2s ease;
}

.hab-nav .wp-block-navigation-item__content:hover,
.hab-nav .current-menu-item > .wp-block-navigation-item__content {
	background-size: 100% 0.35em;
}

.hab-header__cta {
	margin: 0 !important;
}

.hab-header__cta .wp-block-button__link {
	white-space: nowrap;
	padding: 0.6em 1.1em;
	font-size: 0.9rem;
	box-shadow: 4px 4px 0 var(--hab-ink);
}

/*
 * Menu móvel (abaixo de 1100px; 1200px em alemão). Um painel claro, a continuação do
 * cabeçalho: a marca no mesmo sítio (theme.js copia-a para .hab-nav__top) e o botão de
 * fechar no canto, sempre à vista; as secções em letra grande, com um fio fino entre elas
 * e uma seta; no fim, «Participa» e as línguas (.hab-nav__foot), porque o painel tapa o
 * seletor do cabeçalho. O contentor é que faz scroll.
 */
.wp-block-navigation__responsive-container.is-menu-open {
	--hab-nav-line: 1px solid rgb(21 23 24 / 0.12);
	padding: 0 clamp(1rem, 4vw, 2.5rem) !important;
	overscroll-behavior: contain;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
	display: flex;
	flex-direction: column;
	flex: 1 0 auto;
	width: 100%;
}

/*
 * Primeira linha: a marca e o botão de fechar, presos ao topo do painel enquanto se faz
 * scroll (sticky, não fixed: a animação de abertura do core deixa um transform no
 * contentor, e um fixed passava a rolar com o conteúdo). Depois, o conteúdo.
 */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	grid-template-rows: auto 1fr;
	align-content: start;
	padding-top: 0;
}

/* A marca, à altura do cabeçalho (--hab-header-h é medido em theme.js). */
.hab-nav__top,
.hab-nav__acc,
.hab-nav__cta,
.hab-nav__foot {
	display: none;
}

.is-menu-open .hab-nav__top {
	position: sticky;
	top: 0;
	z-index: 2;
	grid-column: 1 / -1;
	grid-row: 1;
	display: flex;
	align-items: center;
	min-height: var(--hab-header-h, 5.25rem);
	padding-right: 3.5rem;
	background: var(--hab-base);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	grid-column: 1 / -1;
	grid-row: 2;
	width: 100%;
	max-width: 40rem;
	padding-top: clamp(0.5rem, 3vh, 2rem) !important;
	padding-bottom: max(2rem, env(safe-area-inset-bottom));
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	position: sticky;
	top: calc((var(--hab-header-h, 5.25rem) - 2.75rem) / 2);
	z-index: 3;
	grid-column: 2;
	grid-row: 1;
	align-self: center;
	display: grid;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	margin: 0;
	color: var(--hab-ink);
	background: var(--hab-base);
	border: var(--hab-border);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close svg {
	width: 1.5rem;
	height: 1.5rem;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	align-items: stretch !important;
	text-align: left;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	gap: 0 !important;
	width: 100%;
	border-top: var(--hab-nav-line);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center !important;
	border-bottom: var(--hab-nav-line);
}

/* Cada secção: a linha inteira é o link. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	padding-block: clamp(0.85rem, 2.2vh, 1.15rem) !important;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.875rem, 1.25rem + 3vw, 2.75rem);
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -0.025em;
	text-decoration: none !important;
	overflow-wrap: anywhere;
}

/* Uma seta discreta no fim da linha; com o rato, o foco ou o dedo, avança e escurece. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:not(.has-child) > .wp-block-navigation-item__content::after {
	content: "";
	flex: none;
	width: 1.5rem;
	height: 1.5rem;
	margin-left: auto;
	background: currentColor;
	-webkit-mask: url(../icons/arrow_right_line.svg) center / contain no-repeat;
	mask: url(../icons/arrow_right_line.svg) center / contain no-repeat;
	opacity: 0.3;
	transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.2s ease;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:is(:hover, :focus-visible, :active)::after {
	opacity: 1;
	transform: translateX(4px);
}

/* Página atual: um quadrado vermelho, como o do logótipo. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content[aria-current]::before,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .current-menu-item > .wp-block-navigation-item__content::before {
	content: "";
	flex: none;
	width: 0.3em;
	height: 0.3em;
	background: var(--hab-yellow);
}

/* Secções com subpáginas: botão de abrir e fechar (theme.js). */
.is-menu-open .hab-nav__acc {
	display: grid;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	color: inherit;
	background: transparent;
	border: 0;
	cursor: pointer;
}

.is-menu-open .hab-nav__acc svg {
	transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.is-menu-open .hab-nav__acc[aria-expanded="true"] svg {
	transform: rotate(180deg);
}

.is-menu-open .hab-nav__acc:focus-visible {
	outline: 3px solid var(--hab-yellow);
	outline-offset: 2px;
}

/* Fim do painel, logo a seguir às secções: «Participa» a toda a largura e as línguas. */
.is-menu-open .hab-nav__foot {
	display: flex;
	flex-direction: column;
	gap: 2rem;
	width: 100%;
	margin-top: 0 !important;
	padding-top: clamp(2.5rem, 6vh, 4rem);
}

.is-menu-open .hab-nav__cta {
	display: flex;
	margin: 0 !important;
}

.is-menu-open .hab-nav__cta .wp-block-button {
	flex: 1;
}

html body .wp-site-blocks .is-menu-open .hab-nav__cta .wp-block-button__link {
	width: 100%;
	min-height: 3.25rem;
	font-size: 1.0625rem !important;
}

/* Línguas: rótulo e uma grelha de seis códigos, alinhada com o botão. */
.hab-nav__langs-label {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0 0 0.75rem;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.9375rem;
	font-weight: 600;
	text-transform: none;
	color: var(--wp--preset--color--muted);
}

.hab-nav__langs .hab-lang__list {
	position: static;
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 0.375rem;
	min-width: 0;
	padding: 0;
	background: none;
	border: 0;
	box-shadow: none;
}

.hab-nav__langs .hab-lang__list a {
	justify-content: center;
	min-height: 2.75rem;
	padding: 0;
	border: 1px solid rgb(21 23 24 / 0.16);
	background: none;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	transition: border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.hab-nav__langs .hab-lang__list a:hover,
.hab-nav__langs .hab-lang__list a:focus-visible {
	background: none;
	border-color: var(--hab-ink);
}

.hab-nav__langs .hab-lang__list a[aria-current] {
	background: var(--hab-ink);
	border-color: var(--hab-ink);
	color: var(--hab-base);
}

.hab-nav__langs .hab-lang__code {
	min-width: 0;
	padding: 0;
	border: 0;
	font-size: inherit;
	font-weight: inherit;
	letter-spacing: inherit;
}

/* O nome da língua fica para os leitores de ecrã; à vista, só o código. */
.hab-nav__langs .hab-lang__name {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

/* Ao abrir: as secções entram uma a uma, de baixo, e o fim do painel logo a seguir. */
@keyframes hab-menu-in {
	from {
		opacity: 0;
		transform: translateY(0.75rem);
	}
}

@media (prefers-reduced-motion: no-preference) {
	.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item,
	.is-menu-open .hab-nav__foot {
		animation: hab-menu-in 0.6s cubic-bezier(0.22, 1, 0.36, 1) both;
	}

	.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(2) { animation-delay: 0.04s; }
	.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(3) { animation-delay: 0.08s; }
	.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(4) { animation-delay: 0.12s; }
	.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(5) { animation-delay: 0.16s; }
	.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(6) { animation-delay: 0.2s; }
	.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(n + 7) { animation-delay: 0.24s; }

	.is-menu-open .hab-nav__foot {
		animation-delay: 0.22s;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content::after,
	.is-menu-open .hab-nav__acc svg,
	.hab-nav__langs .hab-lang__list a {
		transition: none;
	}
}

/* Página atual: sublinhado amarelo fixo. */
.hab-nav .current-menu-item > .wp-block-navigation-item__content,
.hab-nav .wp-block-navigation-item__content[aria-current] {
	background-size: 100% 0.35em;
}

/* Submenus: painel de cartaz. */
.hab-nav .wp-block-navigation__submenu-container {
	min-width: 17rem !important;
	padding: 0.5rem 0 !important;
	background: var(--hab-base) !important;
	color: var(--hab-ink) !important;
	border: var(--hab-border) !important;
	box-shadow: var(--hab-shadow);
	text-transform: none;
	letter-spacing: 0;
}

.hab-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	display: block;
	width: 100%;
	padding: 0.55rem 1.1rem !important;
	font-size: 0.95rem;
	font-weight: 600;
	background: none;
}

.hab-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.hab-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible {
	background: var(--hab-yellow);
}

.hab-nav .wp-block-navigation__submenu-icon {
	width: 0.7em;
	height: 0.7em;
	margin-left: 0.3em;
}

/* No menu móvel, os submenus abrem por baixo da secção (acordeão). */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	grid-column: 1 / -1;
	display: none !important;
	min-width: 0 !important;
	padding: 0 0 1rem !important;
	background: transparent !important;
	color: inherit !important;
	border: 0 !important;
	box-shadow: none;
}

.wp-block-navigation__responsive-container.is-menu-open .is-acc-open > .wp-block-navigation__submenu-container {
	display: flex !important;
}

/* Sem JavaScript, as secções ficam abertas. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:not(:has(> .hab-nav__acc)) > .wp-block-navigation__submenu-container {
	display: flex !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 0.6rem 0 !important;
	font-family: var(--wp--preset--font-family--body);
	font-size: 1.0625rem;
	font-weight: 600;
	color: var(--wp--preset--color--muted);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	background: none;
	color: var(--hab-ink);
}

/*
 * Menu: completo a partir de 1100px; abaixo disso, botão ☰ (o core só o faz abaixo de 600px,
 * o que fazia o menu partir-se em 2-3 linhas em tablets e portáteis pequenos).
 */
@media (min-width: 600px) and (max-width: 1099px) {
	.hab-nav .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.hab-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}

@media (max-width: 1099px) {
	.hab-header__nav {
		flex-direction: row-reverse;
	}

	.wp-block-navigation__responsive-container-open {
		display: grid;
		place-items: center;
		justify-content: center;
		align-items: center;
		padding: 0;
		width: 2.75rem;
		height: 2.75rem;
		border: var(--hab-border);
		background: var(--hab-base);
		box-shadow: 3px 3px 0 var(--hab-ink);
	}

	.wp-block-navigation__responsive-container-open svg {
		width: 1.6rem;
		height: 1.6rem;
	}
}

/* Alemão: as etiquetas do menu são mais longas, por isso o botão ☰ aparece até 1199px. */
@media (min-width: 1100px) and (max-width: 1199px) {
	html[lang^="de"] .hab-nav .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: grid;
		place-items: center;
		padding: 0;
		width: 2.75rem;
		height: 2.75rem;
		border: var(--hab-border);
		background: var(--hab-base);
		box-shadow: 3px 3px 0 var(--hab-ink);
	}

	html[lang^="de"] .hab-nav .wp-block-navigation__responsive-container-open svg {
		width: 1.6rem;
		height: 1.6rem;
	}

	html[lang^="de"] .hab-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}

	html[lang^="de"] .hab-header__nav {
		flex-direction: row-reverse;
	}
}

/* Menu compacto entre 1100 e 1279px, para caber numa linha. */
@media (min-width: 1100px) and (max-width: 1279px) {
	.hab-nav {
		font-size: 0.85rem !important;
	}

	.hab-nav .wp-block-navigation__container {
		gap: 1rem !important;
	}

	.hab-header__bar,
	.hab-header__nav {
		gap: 1rem !important;
	}
}

@media (max-width: 600px) {
	.hab-header {
		padding-block: 0.55rem;
	}

	.hab-brand {
		font-size: 1.35rem;
	}

	.hab-brand::before {
		width: 2rem;
		height: 2rem;
	}

	.hab-header__cta .wp-block-button__link {
		padding: 0.55em 0.8em;
		font-size: 0.875rem;
		box-shadow: 3px 3px 0 var(--hab-ink);
	}
}

@media (max-width: 374px) {
	.hab-brand {
		font-size: 1.15rem;
	}

	.hab-header__bar,
	.hab-header__nav {
		gap: 0.5rem !important;
	}

	.hab-header__cta .wp-block-button__link {
		padding: 0.5em 0.55em;
		font-size: 0.8125rem;
		letter-spacing: 0.02em;
	}
}

/* Ecrãs muito estreitos: o «Participa» do cabeçalho não cabe em todas as línguas; fica no menu. */
@media (max-width: 359px) {
	.hab-header__cta {
		display: none !important;
	}
}

/* Seletor de língua. */
.hab-lang {
	position: relative;
	font-size: 0.875rem;
	font-weight: 800;
	letter-spacing: 0.08em;
}

.hab-lang__menu {
	position: relative;
}

.hab-lang__toggle {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	min-height: 2.25rem;
	padding: 0.2rem 0.65rem;
	border: 2px solid currentColor;
	cursor: pointer;
	list-style: none;
	line-height: 1.3;
	user-select: none;
}

.hab-lang__toggle::-webkit-details-marker {
	display: none;
}

.hab-lang__toggle:hover,
.hab-lang__menu[open] > .hab-lang__toggle {
	background: var(--hab-yellow);
	color: var(--hab-ink);
	border-color: var(--hab-yellow);
}

.hab-lang__chevron {
	transition: transform 0.15s ease;
}

.hab-lang__menu[open] .hab-lang__chevron {
	transform: rotate(180deg);
}

.hab-lang__list {
	position: absolute;
	top: calc(100% + 0.4rem);
	right: 0;
	z-index: 200;
	display: grid;
	min-width: 13rem;
	margin: 0;
	padding: 0.35rem;
	list-style: none;
	background: var(--hab-base);
	color: var(--hab-ink);
	border: var(--hab-border);
	box-shadow: var(--hab-shadow);
	letter-spacing: 0;
}

/* No rodapé, a lista abre para cima. */
.hab-site-footer .hab-lang__list {
	top: auto;
	bottom: calc(100% + 0.4rem);
}

.hab-lang__list a {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	min-height: 44px;
	padding: 0.35rem 0.6rem;
	color: inherit;
	font-weight: 600;
	text-decoration: none;
}

.hab-lang__list a:hover,
.hab-lang__list a:focus-visible {
	background: var(--wp--preset--color--tile);
}

.hab-lang__list a[aria-current] {
	background: var(--hab-yellow);
}

.hab-lang__code {
	display: inline-grid;
	place-items: center;
	min-width: 2.1rem;
	padding: 0.1rem 0.3rem;
	border: 2px solid var(--hab-ink);
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.06em;
}

@media (prefers-reduced-motion: reduce) {
	.hab-lang__chevron {
		transition: none;
	}
}

/* ---------- Herói ---------- */

.hab-hero::before,
.hab-page-hero::before {
	content: "";
	position: absolute;
	inset: 0 0 0 auto;
	width: min(48vw, 640px);
	background: var(--hab-base);
	opacity: 0.14;
	-webkit-mask: url(../img/azulejo-motif.svg) 0 0 / 140px, linear-gradient(to left, #000 30%, transparent);
	-webkit-mask-composite: source-in;
	mask: url(../img/azulejo-motif.svg) 0 0 / 140px, linear-gradient(to left, #000 30%, transparent);
	mask-composite: intersect;
	pointer-events: none;
}

.hab-hero__cols {
	align-items: center !important;
	gap: var(--wp--preset--spacing--60) !important;
}

.hab-hero .hab-display {
	margin-top: var(--wp--preset--spacing--40);
}

.hab-hero .hab-lead {
	font-size: clamp(1.1rem, 1.6vw, 1.35rem);
}

.hab-article65 {
	position: relative;
	padding: clamp(1.5rem, 3vw, 2.5rem);
	padding-top: calc(clamp(1.5rem, 3vw, 2.5rem) + 44px);
	background: var(--hab-base);
	color: var(--hab-ink);
	border: var(--hab-border);
	box-shadow: 12px 12px 0 var(--hab-yellow), 12px 12px 0 3px var(--hab-ink);
}

.hab-article65::before {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: 44px;
	background: url(../img/azulejo.svg) 0 0 / 44px;
	border-bottom: var(--hab-border);
}

.hab-article65__label {
	font-size: 0.875rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--hab-blue);
}

.hab-article65__quote {
	font-size: clamp(1.15rem, 1.7vw, 1.4rem);
	font-weight: 650;
	line-height: 1.4;
}

.hab-article65__note {
	margin-top: 1.25rem !important;
	padding-top: 1rem;
	border-top: 2px dashed var(--hab-ink);
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.35rem;
	line-height: 1.1;
	text-transform: uppercase;
}

/* ---------- Faixa animada ---------- */

.hab-ticker {
	overflow: hidden;
	padding-block: 0.9rem;
	border-block: var(--hab-border);
}

.hab-ticker__track {
	display: inline-block;
	margin: 0;
	padding-left: 100%;
	white-space: nowrap;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.4rem, 2.6vw, 2rem);
	line-height: 1;
	text-transform: uppercase;
}

.hab-ticker.is-ready .hab-ticker__track {
	padding-left: 0;
	animation: hab-marquee var(--hab-ticker-duration, 40s) linear infinite;
}

.hab-ticker__sep {
	display: inline-block;
	margin-inline: 1.1rem;
	color: var(--hab-blue);
}

@keyframes hab-marquee {
	to {
		transform: translateX(-50%);
	}
}

.hab-ticker:hover .hab-ticker__track {
	animation-play-state: paused;
}

/* ---------- Cartões ---------- */

.hab-cards {
	margin-top: var(--wp--preset--spacing--50) !important;
}

.is-style-poster-card {
	padding: clamp(1.25rem, 2.5vw, 2rem);
	background: var(--hab-base);
	color: var(--hab-ink);
	border: var(--hab-border);
	box-shadow: var(--hab-shadow);
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.is-style-poster-card:hover {
	transform: translate(-3px, -3px);
	box-shadow: 9px 9px 0 var(--hab-ink);
}

.is-style-poster-card > :first-child {
	margin-top: 0;
}

.is-style-poster-card h3 {
	margin-top: 0.5rem;
}

.hab-card__tag {
	margin: 0;
	font-size: 0.8125rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--hab-blue);
}

.hab-struggle .hab-card:nth-child(1) {
	border-top-width: 12px;
	border-top-color: var(--hab-blue);
}

.hab-struggle .hab-card:nth-child(2) {
	border-top-width: 12px;
	border-top-color: var(--hab-yellow);
}

.hab-struggle .hab-card:nth-child(3) {
	border-top-width: 12px;
	border-top-color: var(--hab-ink);
}

/* Reivindicações numeradas. */
.hab-demand__num {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(3rem, 5vw, 4.25rem);
	line-height: 0.9;
	color: var(--hab-yellow);
	-webkit-text-stroke: 2px var(--hab-ink);
	paint-order: stroke fill;
	text-shadow: 3px 3px 0 var(--hab-ink);
}

/* ---------- Números ---------- */

.hab-numbers::after {
	content: "";
	position: absolute;
	inset: auto 0 0;
	height: var(--hab-tile-band);
	background: url(../img/azulejo.svg) 0 0 / var(--hab-tile-band);
	border-top: var(--hab-border);
}

.hab-stats {
	gap: 0 !important;
	margin-top: var(--wp--preset--spacing--50) !important;
	border-top: 2px solid rgba(255, 253, 248, 0.25);
	border-left: 2px solid rgba(255, 253, 248, 0.25);
}

.hab-stat {
	padding: clamp(1.25rem, 2.5vw, 2rem);
	border-right: 2px solid rgba(255, 253, 248, 0.25);
	border-bottom: 2px solid rgba(255, 253, 248, 0.25);
}

.hab-stat > * {
	margin: 0;
}

.hab-stat__num {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(2.25rem, 3.4vw, 3.25rem);
	line-height: 1;
	color: var(--hab-yellow);
}

.hab-stat__label {
	margin-top: 0.75rem !important;
	line-height: 1.45;
}

.hab-stat__src {
	margin-top: 1rem !important;
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	opacity: 0.8;
}

.lang-pt .hab-stat__src::before {
	content: "↳ Fonte: ";
	content: "↳ Fonte: " / "Fonte: ";
}

.lang-en .hab-stat__src::before {
	content: "↳ Source: ";
	content: "↳ Source: " / "Source: ";
}

/* ---------- Participar ---------- */

.hab-participate__cols {
	gap: var(--wp--preset--spacing--60) !important;
}

.hab-goal {
	margin-top: var(--wp--preset--spacing--50) !important;
	padding: clamp(1.25rem, 2.5vw, 2rem);
	background: var(--hab-blue);
	color: var(--hab-base);
	border: var(--hab-border);
	box-shadow: var(--hab-shadow);
}

.hab-goal__big {
	margin-top: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.8rem, 3vw, 2.4rem);
	line-height: 1;
	text-transform: uppercase;
	color: var(--hab-yellow);
}

.hab-goal .wp-block-buttons {
	margin-top: 1.25rem !important;
}

.hab-steps {
	counter-reset: step;
}

.hab-step {
	display: grid;
	grid-template-columns: 3.5rem 1fr;
	column-gap: 1.25rem;
	padding-block: 1.5rem;
	border-top: var(--hab-border);
}

.hab-step:last-child {
	border-bottom: var(--hab-border);
}

.hab-step > * {
	grid-column: 2;
	margin: 0 !important;
}

.hab-step > .hab-step__num {
	grid-column: 1;
	grid-row: 1 / span 2;
	display: grid;
	place-items: center;
	width: 3.5rem;
	height: 3.5rem;
	background: var(--hab-yellow);
	border: var(--hab-border);
	box-shadow: 3px 3px 0 var(--hab-ink);
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.75rem;
	line-height: 1;
}

.hab-step h3 {
	margin-bottom: 0.4rem !important;
}

/* ---------- Linha do tempo ---------- */

.hab-timeline {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	gap: var(--wp--preset--spacing--50);
	margin-top: var(--wp--preset--spacing--60) !important;
}

.hab-timeline.is-layout-flow > * {
	margin-block: 0;
}

.hab-timeline__item {
	position: relative;
	padding-top: 1.5rem;
	border-top: 3px solid var(--hab-yellow);
}

.hab-timeline__item::before {
	content: "";
	position: absolute;
	top: -10px;
	left: 0;
	width: 17px;
	height: 17px;
	background: var(--hab-yellow);
	transform: rotate(45deg);
}

.hab-timeline__year {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(2.5rem, 4vw, 3.25rem);
	line-height: 1;
	color: var(--hab-yellow);
}

.hab-timeline__item h3 {
	margin-top: 0.5rem;
}

.hab-law .hab-timeline__item {
	border-top-color: var(--hab-blue);
}

.hab-law .hab-timeline__item::before {
	background: var(--hab-blue);
}

.hab-law .hab-timeline__year {
	color: var(--hab-blue);
}

/* ---------- Direito de manifestação ---------- */

.hab-protest .hab-timeline__item {
	border-top-color: var(--hab-ink);
}

.hab-protest .hab-timeline__item::before {
	background: var(--hab-ink);
}

.hab-protest .hab-timeline__year {
	color: var(--hab-ink);
}

.hab-protest__text {
	max-width: 68ch;
	margin-top: var(--wp--preset--spacing--60) !important;
}

.hab-protest__text h3:not(:first-child) {
	margin-top: var(--wp--preset--spacing--50);
}

.hab-protest__sources {
	font-size: 0.875rem;
}

/* ---------- Dupla filiação ---------- */

.hab-affiliation::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--hab-blue);
	opacity: 0.13;
	-webkit-mask: url(../img/azulejo-motif.svg) 0 0 / 140px;
	mask: url(../img/azulejo-motif.svg) 0 0 / 140px;
	pointer-events: none;
}

/* ---------- Apelo final ---------- */

.hab-cta {
	text-align: left;
}

.hab-cta::before {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: var(--hab-tile-band);
	background: url(../img/azulejo.svg) 0 0 / var(--hab-tile-band);
	border-bottom: var(--hab-border);
}

.hab-cta .hab-display {
	max-width: 21ch;
}

.hab-cta .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	color: var(--hab-yellow);
}

/* ---------- Páginas interiores ---------- */

.hab-page-hero .hab-display {
	margin-top: var(--wp--preset--spacing--40);
	max-width: 20ch;
}

.hab-page-hero .hab-lead {
	margin-top: var(--wp--preset--spacing--40);
}

.hab-programme__item {
	display: grid;
	grid-template-columns: minmax(4.5rem, 8rem) 1fr;
	gap: var(--wp--preset--spacing--40);
	padding-block: var(--wp--preset--spacing--60);
	border-top: var(--hab-border);
}
/* O html já tem scroll-padding-top para o cabeçalho fixo: sem margem a mais, o link
   «ver proposta 4» mostra o início da proposta e não o fim da anterior. */
.hab-programme__item[id] {
	scroll-margin-top: 0;
}

.hab-programme__item:first-child {
	border-top: 0;
	padding-top: 0;
}

.hab-programme__item.is-layout-flow > *,
.hab-programme__body > :first-child {
	margin-top: 0;
}

.hab-programme__body {
	max-width: 70ch;
}

.hab-programme .hab-demand__num {
	font-size: clamp(3.5rem, 8vw, 6.5rem);
}

@media (max-width: 600px) {
	.hab-programme__item {
		grid-template-columns: 1fr;
	}
}

ul.is-style-checks {
	padding-left: 0;
	list-style: none;
}

ul.is-style-checks > li {
	position: relative;
	padding-left: 2rem;
	margin-bottom: 0.65rem;
}

ul.is-style-checks > li::before {
	content: "→";
	position: absolute;
	left: 0;
	font-weight: 900;
	color: var(--hab-blue);
}

.has-ink-background-color ul.is-style-checks > li::before,
.has-azulejo-deep-background-color ul.is-style-checks > li::before {
	color: var(--hab-yellow);
}

/* Perguntas. */
.hab-faq .wp-block-details:last-child {
	border-bottom: var(--hab-border);
}

.wp-block-details summary {
	position: relative;
	padding-right: 2.5rem;
	font-size: 1.15rem;
	font-weight: 800;
	cursor: pointer;
	list-style: none;
}

.wp-block-details summary::-webkit-details-marker {
	display: none;
}

.wp-block-details summary::after {
	content: "+";
	position: absolute;
	top: 50%;
	right: 0;
	display: grid;
	place-items: center;
	width: 1.75rem;
	height: 1.75rem;
	margin-top: -0.875rem;
	background: var(--hab-yellow);
	border: 2px solid var(--hab-ink);
	font-weight: 900;
	line-height: 1;
}

.wp-block-details[open] summary::after {
	content: "−";
	background: var(--hab-ink);
	color: var(--hab-yellow);
}

.wp-block-details[open] summary {
	margin-bottom: 0.75rem;
}

/* Diretório. */
.hab-directory h2 {
	margin-top: var(--wp--preset--spacing--60);
	scroll-margin-top: 7rem;
}

.hab-directory .hab-cards {
	margin-top: var(--wp--preset--spacing--40) !important;
}

.hab-org h3 a {
	text-decoration: none;
}

.hab-org h3 a::after {
	content: " ↗";
	color: var(--hab-blue);
}

.hab-org:hover h3 a {
	text-decoration: underline;
}

.hab-org__url {
	margin-top: auto;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.875rem;
	color: var(--hab-blue);
	word-break: break-all;
}

.hab-note {
	max-width: 70ch;
	padding: 1rem 1.25rem;
	background: var(--hab-paper);
	border-left: 6px solid var(--hab-yellow);
}

/* Fontes. */
.hab-sources {
	border-top: var(--hab-border);
}

.hab-sources li {
	font-size: 0.95rem;
}

/* ---------- Conteúdo corrido (páginas e artigos) ---------- */

.hab-prose {
	padding-block: var(--wp--preset--spacing--60);
}

.hab-prose > p,
.hab-prose > ul,
.hab-prose > ol {
	font-size: 1.125rem;
}

.hab-featured {
	margin-top: var(--wp--preset--spacing--60) !important;
	border: var(--hab-border);
	box-shadow: var(--hab-shadow);
}

.hab-meta {
	gap: 1rem;
}

.hab-meta .wp-block-post-terms a {
	color: inherit;
}

.hab-post-card {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.hab-post-card .wp-block-post-title a {
	text-decoration: none;
}

/* Imagem no topo do cartão, encostada às margens (como nas notícias). */
.hab-post-card__thumb {
	margin: calc(-1 * clamp(1.25rem, 2.5vw, 2rem)) calc(-1 * clamp(1.25rem, 2.5vw, 2rem)) 1rem !important;
	border-bottom: var(--hab-border);
	overflow: hidden;
}

.hab-post-card__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hab-pagination {
	margin-top: var(--wp--preset--spacing--60);
	font-weight: 800;
}

.hab-search {
	max-width: 36rem;
	margin-top: var(--wp--preset--spacing--40);
}

.hab-search .wp-block-search__input {
	border: var(--hab-border);
	padding: 0.75rem 1rem;
}

.hab-404 .hab-display {
	max-width: 14ch;
}

/* ---------- Rodapé ---------- */

.hab-footer {
	position: relative;
}

.hab-footer::before {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: var(--hab-tile-band);
	background: url(../img/azulejo.svg) 0 0 / var(--hab-tile-band);
}

.hab-footer a {
	color: inherit;
}

.hab-footer a:hover {
	color: var(--hab-yellow);
}

.hab-footer__cols {
	gap: var(--wp--preset--spacing--50) !important;
}

.hab-brand--footer {
	font-size: 2.25rem;
}

.hab-footer__blurb {
	max-width: 42ch;
	opacity: 0.85;
}

/* Quem faz o site: logótipo da Cultura no Muro (versão clara, sem fundo). */
.hab-footer__by {
	margin-top: 1.75rem;
}

.hab-footer__by a {
	display: inline-flex;
	align-items: center;
	gap: 1rem;
	max-width: 30ch;
	font-size: 0.9rem;
	line-height: 1.4;
	text-decoration: none;
}

.hab-footer__by img {
	flex: none;
	width: 66px;
	height: auto;
}

.hab-footer__by a:hover span,
.hab-footer__by a:focus-visible span {
	text-decoration: underline;
}

/* Causas que apoiamos (página «A crise» e resumo na página inicial). */
.hab-causes-grid {
	margin-top: var(--wp--preset--spacing--50);
	align-items: stretch;
}

.hab-cause {
	display: flex;
	flex-direction: column;
	padding: clamp(1.25rem, 2.5vw, 2rem);
	background: var(--hab-base);
	color: var(--hab-ink);
	border: var(--hab-border);
	box-shadow: var(--hab-shadow);
	scroll-margin-top: 7rem;
}

.hab-cause > *,
.hab-cause__body > * {
	margin: 0;
}

.hab-cause__body > p + p {
	margin-top: 0.9rem;
}

.hab-cause__meta {
	font-size: 0.8125rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--hab-blue);
}

.hab-cause__title {
	margin: 0.4rem 0 1rem !important;
	font-size: var(--wp--preset--font-size--x-large);
}

.hab-cause__body > .wp-block-buttons {
	margin-top: auto !important;
	padding-top: 1.5rem;
}

.hab-consult {
	margin-top: var(--wp--preset--spacing--50) !important;
	padding: clamp(1.25rem, 2.5vw, 2rem);
	background: var(--hab-yellow);
	color: var(--hab-ink);
	border: var(--hab-border);
	scroll-margin-top: 7rem;
}

.hab-consult > * {
	margin: 0;
	max-width: 70ch;
}

.hab-consult > p {
	margin-top: 0.6rem;
	font-size: 1.125rem;
}

.hab-consult > .wp-block-buttons {
	margin-top: 1.25rem;
}

/* Filmes. */

.hab-films__grid {
	margin-top: var(--wp--preset--spacing--50);
}

.hab-film {
	display: flex;
	flex-direction: column;
	padding: clamp(1.1rem, 2vw, 1.5rem);
	background: var(--hab-base);
	color: var(--hab-ink);
	border: var(--hab-border);
	box-shadow: var(--hab-shadow);
}

.hab-film.is-video {
	border-top-width: 12px;
	padding: 0;
}

.hab-film > * {
	margin: 0;
}

.hab-film__meta {
	font-size: 0.8125rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--hab-blue);
}

.hab-film__title {
	margin: 0.4rem 0 0.6rem !important;
	font-size: var(--wp--preset--font-size--large);
}

.hab-film > .wp-block-buttons {
	margin-top: auto !important;
	padding-top: 1.25rem;
}

.hab-film__play .wp-block-button__link::before {
	content: "▶";
	margin-right: 0.5rem;
}

.hab-films__note {
	margin-top: var(--wp--preset--spacing--40) !important;
	font-size: 0.9375rem;
	color: var(--wp--preset--color--muted);
}

/* Página «Quem somos». */
.hab-about__cols {
	gap: var(--wp--preset--spacing--60) !important;
}

.hab-about__logo img {
	width: min(100%, 280px);
	height: auto;
}

@media (max-width: 781px) {
	.hab-about__logo img {
		width: 160px;
	}
}

.hab-footer__title {
	margin-top: 1.5rem;
	font-size: 1.1rem;
	letter-spacing: 0.04em;
	color: var(--hab-yellow);
}

.hab-footer__links {
	padding: 0;
	list-style: none;
}

.hab-footer__links li {
	margin-bottom: 0.5rem;
}

.hab-footer__links a {
	text-decoration: none;
}

.hab-footer__links a:hover {
	text-decoration: underline;
}

.hab-footer__bottom {
	margin-top: var(--wp--preset--spacing--60) !important;
	padding-top: 1.25rem;
	border-top: 1px solid rgba(255, 253, 248, 0.25);
	font-size: 0.9375rem;
}

.hab-footer__bottom p {
	margin: 0;
	opacity: 0.8;
}

/* ---------- Movimento reduzido ---------- */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition: none !important;
		animation: none !important;
	}

	.hab-ticker__track {
		padding-left: 0;
		white-space: normal;
	}
}

/* Âncoras do menu: não ficar escondido debaixo do cabeçalho fixo. */
:where(.hab-main) [id] {
	scroll-margin-top: 8rem;
}

/* ---------- Utilitários de acessibilidade ---------- */

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Cartão inteiro clicável a partir do link do título (um só link para leitores de ecrã). */
.hab-stretched {
	text-decoration: none;
}

.hab-stretched::after {
	content: "";
	position: absolute;
	inset: 0;
}

.hab-event article,
.hab-news__item article {
	position: relative;
}

.hab-event:hover .hab-stretched,
.hab-news__item:hover .hab-stretched,
.hab-stretched:focus-visible {
	text-decoration: underline;
	text-decoration-thickness: 3px;
	text-underline-offset: 0.15em;
}

/* Faixa animada: botão de pausa (WCAG 2.2.2). */
.hab-ticker {
	position: relative;
}

.hab-ticker__toggle {
	position: absolute;
	top: 50%;
	right: 0.75rem;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	min-height: 2.25rem;
	padding: 0 0.75rem;
	transform: translateY(-50%);
	background: var(--hab-ink);
	color: var(--hab-yellow);
	border: 2px solid var(--hab-ink);
	font: 800 0.8125rem/1 var(--wp--preset--font-family--body);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: pointer;
}

.hab-ticker__toggle:hover {
	background: var(--hab-base);
	color: var(--hab-ink);
}

.hab-ticker.is-paused .hab-ticker__track {
	animation-play-state: paused;
}

/* ---------- Agenda ---------- */

/* Filtro por localidade. */
.hab-agenda-filter {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem 0.75rem;
	margin: var(--wp--preset--spacing--40) 0 0;
}

.hab-agenda-filter__label {
	font-weight: 700;
}

.hab-agenda-filter__select,
.hab-agenda-filter__go {
	min-height: 48px;
	font: inherit;
	color: var(--hab-ink);
	border: var(--hab-border);
	border-radius: 0;
	box-shadow: 4px 4px 0 var(--hab-ink);
}

.hab-agenda-filter__select {
	flex: 0 1 22rem;
	min-width: 0;
	max-width: 100%;
	padding: 0 2.75rem 0 0.9rem;
	background: var(--hab-base) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23121633' stroke-width='2.5'/%3E%3C/svg%3E") no-repeat right 0.9rem center;
	appearance: none;
	cursor: pointer;
}

.hab-agenda-filter__go {
	padding: 0 1.25rem;
	background: var(--hab-yellow);
	font-weight: 700;
	cursor: pointer;
}

.hab-agenda-filter.is-live .hab-agenda-filter__go {
	display: none;
}

.hab-agenda-filter__select:focus-visible,
.hab-agenda-filter__go:focus-visible {
	outline: 3px solid var(--hab-blue);
	outline-offset: 3px;
}

.hab-event[hidden] {
	display: none;
}

@media (max-width: 480px) {
	.hab-agenda-filter__select {
		flex-basis: 100%;
	}
}

/* Dias: «Hoje» e «Amanhã» em amarelo, os outros em azul-tinta. */
.hab-days {
	display: grid;
	gap: var(--wp--preset--spacing--40);
	margin-top: var(--wp--preset--spacing--40);
}

.hab-day[hidden] {
	display: none;
}

.hab-day__title {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.15rem 0.75rem;
	margin: 0 !important;
	padding: 0.6rem 1rem;
	background: var(--hab-ink);
	color: var(--hab-base);
	border: var(--hab-border);
	border-bottom: 0;
	font-family: var(--wp--preset--font-family--body);
	font-size: 1rem;
	line-height: 1.3;
	text-transform: none;
	letter-spacing: 0;
}

.hab-day__rel {
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1.1;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.hab-day__date {
	font-weight: 600;
}

.hab-day__rel::first-letter {
	text-transform: uppercase;
}

.hab-day.is-soon .hab-day__title {
	background: var(--hab-yellow);
	color: var(--hab-ink);
}

/* Lista do dia: uma caixa com linhas separadas, mais fácil de percorrer do que cartões soltos. */
.hab-agenda {
	margin: 0;
	padding: 0;
	list-style: none;
	background: var(--hab-base);
	border: var(--hab-border);
	box-shadow: var(--hab-shadow);
}

.hab-event + .hab-event {
	border-top: 2px solid var(--hab-ink);
}

.hab-event[hidden] {
	display: none;
}

.hab-event article {
	display: grid;
	grid-template-columns: 5.5rem minmax(0, 1fr) auto;
	gap: 1.25rem;
	align-items: start;
	padding: 1.1rem 1.25rem;
	color: var(--hab-ink);
	transition: background-color 0.15s ease;
}

.hab-event article:hover {
	background: var(--hab-paper);
}

.hab-event__time {
	margin: 0;
	line-height: 1.1;
}

.hab-event__time time {
	display: block;
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.9rem;
	color: var(--hab-blue);
}

.hab-event__end,
.hab-event__tbc {
	display: block;
	margin-top: 0.2rem;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--wp--preset--color--muted);
}

.hab-event__tbc {
	margin-top: 0.35rem;
}

.hab-event__body > * {
	margin: 0;
}

.hab-event__title {
	margin: 0 0 0.35rem !important;
	font-family: var(--wp--preset--font-family--body);
	font-size: clamp(1.125rem, 1rem + 0.4vw, 1.3rem);
	font-weight: 800;
	line-height: 1.3;
	text-transform: none;
	letter-spacing: 0;
}

.hab-event__where {
	position: relative;
	padding-left: 1.35rem;
	font-size: 1.0625rem;
}

.hab-event__pin {
	position: absolute;
	top: 0.3em;
	left: 0;
	color: var(--hab-blue);
}

.hab-event__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem 0.75rem;
	align-items: center;
	margin-top: 0.5rem !important;
	font-size: 0.9375rem;
	color: var(--wp--preset--color--muted);
}

.hab-event__type {
	font-size: 0.8125rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--hab-blue);
}

.hab-badge {
	padding: 0.15rem 0.5rem;
	background: var(--hab-ink);
	color: var(--hab-yellow);
	font-size: 0.8125rem;
	font-weight: 800;
	text-transform: uppercase;
}

.hab-event__go {
	align-self: center;
	font-size: 1.5rem;
	font-weight: 800;
	line-height: 1;
	transition: transform 0.15s ease;
}

.hab-event article:hover .hab-event__go {
	transform: translateX(4px);
}

.hab-event.is-cancelado .hab-event__title a,
.hab-event.is-cancelado .hab-event__where {
	text-decoration: line-through;
	text-decoration-thickness: 2px;
}

/* Anteriores: mais discretas. */
.hab-days.is-past .hab-agenda {
	box-shadow: none;
}

.hab-days.is-past .hab-event__time time {
	color: var(--hab-ink);
}

@media (max-width: 600px) {
	.hab-event article {
		grid-template-columns: 4rem minmax(0, 1fr);
		gap: 0.9rem;
		padding: 1rem;
	}

	.hab-event__time time {
		font-size: 1.5rem;
	}

	.hab-event__go {
		display: none;
	}

	.hab-day__rel {
		font-size: 1.35rem;
	}
}

.hab-empty {
	margin-top: var(--wp--preset--spacing--40);
	padding: 1.5rem;
	background: var(--hab-paper);
	border: 3px dashed var(--hab-ink);
}

.hab-empty > * {
	margin: 0;
}

.hab-empty__title {
	font-weight: 800;
	font-size: 1.125rem;
}

.hab-empty p + p {
	margin-top: 0.5rem;
}

/* Detalhes de uma mobilização. */
.hab-event-details {
	margin-bottom: var(--wp--preset--spacing--50);
}

.hab-alert {
	padding: 1rem 1.25rem;
	background: var(--hab-yellow);
	border: var(--hab-border);
	font-size: 1.125rem;
}

.hab-facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
	gap: 0;
	margin: 0;
	border: var(--hab-border);
	box-shadow: var(--hab-shadow);
	background: var(--hab-base);
}

.hab-facts > div {
	padding: 1rem 1.25rem;
	border-bottom: 2px solid var(--hab-ink);
}

.hab-facts dt {
	font-size: 0.8125rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--hab-blue);
}

.hab-facts dd {
	margin: 0.3rem 0 0;
	font-size: 1.125rem;
	font-weight: 600;
}

.hab-event-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	margin-top: var(--wp--preset--spacing--40);
}

.hab-event-content {
	margin-top: var(--wp--preset--spacing--50);
	font-size: 1.125rem;
}

/* ---------- Notícias ---------- */

.hab-news__list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(18rem, 100%), 1fr));
	gap: var(--wp--preset--spacing--40);
	margin: var(--wp--preset--spacing--40) 0 0;
	padding: 0;
	list-style: none;
}

.hab-news__title {
	margin: 0.5rem 0 !important;
}

/* Imagem no topo do cartão, encostada às margens. */
.hab-news__item.has-thumb {
	padding-top: 0;
}

.hab-news__thumb {
	margin: 0 calc(-1 * clamp(1.25rem, 2.5vw, 2rem)) 1rem;
	border-bottom: var(--hab-border);
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--hab-paper, #f4efe6);
}

.hab-news__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Notícias: o filtro é o da agenda (.hab-agenda-filter); páginas mais antigas. */
.hab-news__results[aria-busy="true"] {
	opacity: 0.5;
	transition: opacity 0.15s;
}

.hab-pager {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 1rem;
	margin-top: var(--wp--preset--spacing--50);
}

.hab-pager__next {
	margin-left: auto;
}

.hab-pager__link {
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	padding: 0 1.25rem;
	border: var(--hab-border);
	background: var(--hab-base);
	box-shadow: 4px 4px 0 var(--hab-ink);
	color: var(--hab-ink);
	font-weight: 800;
	text-decoration: none;
}

.hab-pager__link:hover {
	background: var(--hab-yellow);
}

/* Página inicial: as 4 últimas lado a lado nos ecrãs largos. */
.hab-news-home .hab-news__list {
	grid-template-columns: repeat(auto-fill, minmax(min(15rem, 100%), 1fr));
}

@media (min-width: 1100px) {
	.hab-news-home .hab-news__list {
		grid-template-columns: repeat(4, 1fr);
	}
}

/*
 * Imagem da notícia (muitas vezes um cartaz do Instagram, alto), inteira e sem cortes. A
 * moldura tem a proporção da publicação (--hab-ratio, de inc/article.php ou do carrossel) e
 * a largura que a deixa caber no ecrã: nunca mais alta do que a janela, no máximo 34rem.
 * O resto da página da notícia está em «Página de uma notícia», no fim deste ficheiro.
 */
.single-post .hab-featured {
	width: min(100%, 34rem, calc((100svh - 9rem) * var(--hab-ratio, 0.8)));
	max-width: none !important;
	background: var(--hab-paper);
}

.single-post .hab-featured:not(.hab-slider) img {
	display: block;
	width: 100%;
	height: auto;
}

/* Notícia com várias imagens: carrossel como no Instagram (assets/js/theme.js). */
.single-post .hab-featured.hab-slider {
	background: var(--hab-base);
}

.hab-slider__frame {
	position: relative;
}

.hab-slider__track {
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;
	aspect-ratio: var(--hab-ratio, 0.8);
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	background: var(--hab-ink);
}

.hab-slider.is-live .hab-slider__track {
	scrollbar-width: none;
	cursor: grab;
}

.hab-slider.is-live .hab-slider__track::-webkit-scrollbar {
	display: none;
}

.hab-slider .hab-slider__track.is-dragging {
	scroll-snap-type: none;
	cursor: grabbing;
}

.hab-slider__track:focus-visible {
	outline: 3px solid var(--hab-yellow);
	outline-offset: -3px;
}

.hab-slider__slide {
	flex: 0 0 100%;
	margin: 0;
	scroll-snap-align: center;
	scroll-snap-stop: always;
}

.single-post .hab-slider__slide img {
	display: block;
	width: 100%;
	height: 100%;
	max-height: none;
	object-fit: cover;
	-webkit-user-drag: none;
	user-select: none;
}

/* «1/5» no canto, como no Instagram. */
.hab-slider__count {
	position: absolute;
	top: 0.75rem;
	right: 0.75rem;
	padding: 0.2rem 0.6rem;
	border-radius: 1rem;
	background: rgb(0 0 0 / 0.65);
	color: #fff;
	font-size: 0.8125rem;
	font-weight: 700;
	pointer-events: none;
}

.hab-slider__dots {
	display: none;
	justify-content: center;
	gap: 0.15rem;
	padding: 0.35rem;
}

.hab-slider.is-live .hab-slider__dots {
	display: flex;
}

/* Cada ponto é um botão com área de toque confortável; o ponto é o ::before. */
.hab-slider__dot {
	display: grid;
	place-items: center;
	width: 1.5rem;
	height: 1.5rem;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
}

.hab-slider__dot::before {
	content: "";
	width: 0.45rem;
	height: 0.45rem;
	border-radius: 50%;
	background: var(--hab-ink);
	opacity: 0.25;
	transition: opacity 0.15s, transform 0.15s;
}

.hab-slider__dot:hover::before {
	opacity: 0.5;
}

.hab-slider__dot[aria-current="true"]::before {
	background: var(--hab-blue);
	opacity: 1;
	transform: scale(1.2);
}

.hab-slider__dot:focus-visible {
	outline: 3px solid var(--hab-yellow);
	outline-offset: -3px;
	border-radius: 50%;
}

@media (prefers-reduced-motion: reduce) {
	.hab-slider__dot::before {
		transition: none;
	}
}

/* Grupo «Fundo azulejo». */
.is-style-azulejo::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--hab-blue);
	opacity: 0.1;
	-webkit-mask: url(../img/azulejo-motif.svg) 0 0 / 140px;
	mask: url(../img/azulejo-motif.svg) 0 0 / 140px;
	pointer-events: none;
}

.is-style-azulejo {
	position: relative;
}

.is-style-azulejo > * {
	position: relative;
}

/* ---------- Alto contraste (Windows) ---------- */

@media (forced-colors: active) {
	.hab-kicker::before,
	.hab-hero::before,
	.hab-page-hero::before,
	.hab-affiliation::before,
	.is-style-azulejo::before {
		display: none;
	}

	.hab-day__title,
	.hab-badge,
	.hab-lang__list a[aria-current] {
		forced-color-adjust: none;
		background: Canvas;
		color: CanvasText;
		outline: 2px solid CanvasText;
	}

	.hab-nav .current-menu-item > .wp-block-navigation-item__content {
		text-decoration: underline;
	}
}

/* ---------- Impressão (programa, agenda e dados em papel) ---------- */

@media print {
	.hab-topbar,
	.hab-site-header,
	.hab-ticker,
	.hab-cta,
	.hab-agenda-filter,
	.hab-site-footer .hab-footer__cols,
	.wp-block-buttons,
	.hab-hero::before,
	.hab-page-hero::before,
	.hab-numbers::after,
	.hab-footer::before {
		display: none !important;
	}

	body,
	.hab-section {
		background: #fff !important;
		color: #000 !important;
	}

	.hab-section {
		padding-block: 1rem !important;
	}

	.hab-stat__num,
	.hab-timeline__year,
	.hab-demand__num,
	mark {
		color: #000 !important;
		-webkit-text-stroke: 0;
		text-shadow: none;
	}

	.is-style-poster-card,
	.hab-agenda,
	.hab-article65 {
		box-shadow: none !important;
		transform: none !important;
		break-inside: avoid;
	}

	a[href^="http"]::after {
		content: " (" attr(href) ")";
		font-size: 0.8em;
		font-weight: 400;
	}
}


/* =========================================================================
   Responsivo: tipografia, grelhas, toque.
   ========================================================================= */

/* Frases longas em tamanho cartaz (apelo final, 404): escalam com o ecrã para nunca saírem da coluna. */
.hab-cta .hab-display.has-display-font-size,
.hab-404 .hab-display.has-display-font-size {
	font-size: clamp(2.4rem, 10.5vw, 8.5rem) !important;
}

h1,
h2,
h3 {
	overflow-wrap: break-word;
}

/* Três cartões: 1 coluna ou 3, nunca 2+1 (cartão órfão). */
@media (max-width: 899px) {
	.hab-cards:has(> :nth-child(3):last-child) {
		grid-template-columns: 1fr !important;
	}
}

@media (min-width: 900px) {
	.hab-cards:has(> :nth-child(3):last-child) {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}

/* Linha do tempo resumida (4): 1, 2 ou 4 colunas. */
@media (min-width: 600px) and (max-width: 1023px) {
	.hab-timeline {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Efeitos de levantar só com rato (em ecrãs táteis ficavam "presos" depois do toque). */
@media (hover: none) {
	.is-style-poster-card:hover {
		transform: none;
		box-shadow: var(--hab-shadow);
	}

	.wp-block-button__link:hover {
		transform: none;
	}
}

/* Rodapé em tablet: 2 colunas em vez de uma lista comprida. */
@media (min-width: 600px) and (max-width: 781px) {
	.hab-footer__cols {
		display: grid !important;
		grid-template-columns: 1fr 1fr;
	}

	.hab-footer__cols > .wp-block-column:first-child {
		grid-column: 1 / -1;
	}
}

/* Links do rodapé com área de toque confortável. */
.hab-footer__links a {
	display: inline-block;
	padding-block: 0.3rem;
}

.hab-footer__links li {
	margin-bottom: 0.2rem;
}

/* Botões em ecrãs estreitos: largura total, fáceis de acertar. */
@media (max-width: 480px) {
	.hab-section .wp-block-buttons > .wp-block-button,
	.hab-event-actions > .wp-block-button {
		width: 100%;
	}

	.hab-section .wp-block-buttons > .wp-block-button > .wp-block-button__link,
	.hab-event-actions .wp-block-button__link {
		width: 100%;
		text-align: center;
	}

	.hab-goal .wp-block-buttons > .wp-block-button {
		width: 100%;
	}
}

/* Ecrãs grandes: mais ar entre secções e texto ligeiramente maior. */
@media (min-width: 1600px) {
	body {
		font-size: 1.125rem;
	}
}

/* Faixas de azulejo: o espaço da secção soma-se à faixa, para nunca tocar no texto. */
.hab-cta {
	padding-top: calc(var(--hab-tile-band) + var(--wp--preset--spacing--60)) !important;
}

.hab-numbers {
	padding-bottom: calc(var(--hab-tile-band) + var(--wp--preset--spacing--60)) !important;
}

.hab-footer {
	padding-top: calc(var(--hab-tile-band) + var(--wp--preset--spacing--60)) !important;
}

@media (max-width: 600px) {
	.hab-brand--footer {
		font-size: 1.75rem;
	}
}

/* =========================================================================
   Herói "acima da dobra": ocupa exatamente um ecrã (menos o cabeçalho),
   com a faixa de palavras de ordem a fechar o fundo do ecrã.
   --hab-header-h e --hab-ticker-h são medidos em theme.js.
   ========================================================================= */

.hab-hero {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: calc(100svh - var(--hab-header-h, 126px) - var(--hab-ticker-h, 64px));
	padding-block: clamp(1.25rem, 5svh, 4.5rem) !important;
}

.admin-bar .hab-hero {
	min-height: calc(100svh - var(--hab-header-h, 126px) - var(--hab-ticker-h, 64px) - var(--wp-admin--admin-bar--height, 0px));
}

.hab-hero > * {
	width: 100%;
}

.hab-hero .hab-display {
	margin-top: clamp(0.75rem, 2.5svh, 1.75rem);
	margin-bottom: 0;
}

.hab-hero .hab-lead {
	margin-top: clamp(0.75rem, 2.5svh, 1.5rem);
}

.hab-hero .wp-block-buttons {
	margin-top: clamp(1rem, 3.5svh, 2.5rem) !important;
}

/*
 * Título do herói: o tamanho depende da largura E da altura do ecrã.
 * Em portáteis e ecrãs largos, duas linhas («CASAS PARA VIVER. / A PREÇOS ACESSÍVEIS.»).
 * Em computador, theme.js ainda o acerta para cada língua: cada linha numa só linha e a
 * faixa animada à vista no fundo do ecrã.
 */
.hab-hero .hab-display.has-display-font-size {
	font-size: clamp(3rem, min(5.6vw, 11svh), 6.3rem) !important;
}

@media (max-width: 781px) {
	.hab-hero .hab-display.has-display-font-size {
		font-size: clamp(2.6rem, min(15vw, 7.6svh), 4.5rem) !important;
	}

	.hab-hero .hab-lead {
		font-size: 1.0625rem;
	}

	/* No herói, os dois botões lado a lado sempre que cabem. */
	.hab-hero .wp-block-buttons > .wp-block-button {
		width: auto !important;
	}

	.hab-hero .wp-block-buttons {
		gap: 0.75rem;
	}
}

/* Ecrãs de portátil baixos: cartão do artigo 65.º mais compacto. */
@media (min-width: 782px) and (max-height: 900px) {
	.hab-article65__quote {
		font-size: 1.15rem;
	}

	.hab-article65 {
		padding: 1.5rem;
		padding-top: calc(1.5rem + 44px);
	}
}

/* Portáteis de 720–760px de altura: o cartão ainda mais compacto (nas línguas com citação longa). */
@media (min-width: 782px) and (max-height: 760px) {
	.hab-article65__quote {
		font-size: 1.05rem;
	}
}

/* Ecrãs muito baixos (telemóvel deitado): o herói cresce com o conteúdo. */
@media (max-height: 500px) {
	.hab-hero {
		min-height: 0;
	}
}

/* Portáteis baixos (720–820px de altura): tudo um pouco mais compacto para caber num ecrã. */
@media (min-width: 782px) and (max-height: 820px) {
	.hab-hero {
		padding-block: clamp(1rem, 3svh, 2rem) !important;
	}

	.hab-hero .hab-display.has-display-font-size {
		font-size: clamp(3rem, min(5.6vw, 10svh), 6.3rem) !important;
	}

	.hab-hero .hab-lead {
		font-size: 1.125rem;
	}

	.hab-hero .wp-block-buttons {
		margin-top: 1.25rem !important;
	}
}

/* Telemóveis baixos (ex.: iPhone SE): o botão principal tem de aparecer sem deslizar. */
@media (max-width: 781px) and (max-height: 740px) {
	.hab-hero {
		padding-block: clamp(1rem, 3svh, 1.5rem) !important;
	}

	.hab-hero .hab-kicker {
		font-size: 0.8125rem;
		letter-spacing: 0.06em;
	}

	.hab-hero .hab-display.has-display-font-size {
		font-size: clamp(2.4rem, min(15vw, 6.6svh), 4.5rem) !important;
	}

	.hab-hero .hab-lead {
		font-size: 1rem;
		line-height: 1.45;
	}
}

/* Til e acentos das maiúsculas (NÃO, ÇÃO) não tocam na linha de cima. */
.hab-hero .hab-display {
	line-height: 1.1 !important;
}

/* =========================================================================
   Organizações (logótipos) e acampadas.
   ========================================================================= */

.hab-allies {
	gap: var(--wp--preset--spacing--40) !important;
}

.hab-ally {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--hab-base);
	color: var(--hab-ink);
	border: var(--hab-border);
	box-shadow: var(--hab-shadow);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.hab-ally > * {
	margin: 0 !important;
	padding-inline: 1.1rem;
}

.hab-ally:hover {
	transform: translate(-2px, -2px);
	box-shadow: 8px 8px 0 var(--hab-ink);
}

.hab-ally:focus-within {
	outline: 3px solid var(--hab-yellow);
	outline-offset: 3px;
}

/* Área do logótipo: altura fixa, logótipo inteiro e centrado. */
.hab-ally__mark {
	display: grid;
	place-items: center;
	height: 8.5rem;
	padding: 1rem 1.25rem !important;
	background: #fff;
	border-bottom: var(--hab-border);
}

.hab-ally.is-dark .hab-ally__mark {
	background: var(--hab-ink);
}

.hab-ally .hab-ally__logo {
	display: block;
	width: 100%;
	height: 6.5rem;
	margin: 0 !important;
	padding: 0 !important;
}

.hab-ally .hab-ally__logo img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-width: none;
	object-fit: contain;
}

/* Sem logótipo: monograma em azulejo. */
.hab-ally.has-mono .hab-ally__mark {
	background: var(--hab-blue) url(../img/azulejo-motif.svg) center / 4rem;
}

.hab-ally .hab-ally__mono {
	margin: 0 !important;
	padding: 0.2em 0.45em;
	background: var(--hab-ink);
	color: var(--hab-yellow);
	font-family: var(--wp--preset--font-family--display);
	font-size: 2.6rem;
	line-height: 1;
	letter-spacing: 0.04em;
}

.hab-ally h3 {
	margin-top: 1rem !important;
	font-size: 1.125rem;
	line-height: 1.25;
}

.hab-ally h3 a {
	color: inherit;
}

.hab-ally h3 a::before {
	content: "↗ ";
	color: var(--hab-blue);
}

.hab-ally:hover h3 a {
	text-decoration: underline;
}

.hab-ally p {
	margin-top: 0.5rem !important;
	font-size: 0.9375rem;
}

.hab-ally .hab-org__url {
	margin-top: auto !important;
	padding-top: 0.75rem;
	padding-bottom: 1rem;
}

.hab-allies-section .wp-block-buttons {
	margin-top: var(--wp--preset--spacing--60);
}

/* Acampadas: lista de cidades em pastilhas. */
.hab-camps {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	padding: 0 !important;
	list-style: none;
}

.hab-camps li {
	margin: 0;
}

.hab-camps a {
	display: inline-flex;
	gap: 0.4rem;
	min-height: 44px;
	align-items: center;
	padding: 0.5rem 1rem;
	border: var(--hab-border);
	background: var(--hab-base);
	box-shadow: 3px 3px 0 var(--hab-ink);
	color: var(--hab-ink);
	font-weight: 700;
	text-decoration: none;
}

.hab-camps a:hover {
	background: var(--hab-yellow);
}

.hab-muted {
	color: var(--wp--preset--color--muted);
	font-size: 0.875rem;
}

.hab-timeline--law .hab-timeline__item a {
	color: inherit;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.15em;
}

@media (hover: none) {
	.hab-ally:hover {
		transform: none;
		box-shadow: var(--hab-shadow);
	}
}

@media (prefers-reduced-motion: reduce) {
	.hab-ally {
		transition: none;
	}
}

/* Página inicial, em telemóveis: mural compacto em 2 colunas (só logótipo e nome). */
@media (max-width: 599px) {
	.hab-allies-section .hab-allies {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 0.75rem !important;
	}

	.hab-allies-section .hab-ally {
		box-shadow: 4px 4px 0 var(--hab-ink);
	}

	.hab-allies-section .hab-ally__mark {
		height: 5.5rem;
		padding: 0.6rem !important;
	}

	.hab-allies-section .hab-ally .hab-ally__logo {
		height: 4.25rem;
	}

	.hab-allies-section .hab-ally .hab-ally__mono {
		font-size: 1.8rem;
	}

	.hab-allies-section .hab-ally > * {
		padding-inline: 0.7rem;
	}

	.hab-allies-section .hab-ally h3 {
		margin: 0.6rem 0 0.75rem !important;
		font-size: 0.9375rem;
	}

	.hab-allies-section .hab-ally h3 a::before {
		content: none;
	}

	.hab-allies-section .hab-ally > p {
		display: none;
	}
}

/* O que exigimos: os estudos e os dados de cada proposta. */
.hab-evidence {
	padding-left: 1.25rem;
	font-size: 0.9375rem;
	line-height: 1.5;
}

.hab-evidence li + li {
	margin-top: 0.5rem;
}

.hab-evidence a {
	font-weight: 700;
}

/* Notícias que são vídeos do Instagram: botão de play por cima da capa. */
.hab-is-video {
	position: relative;
}

.hab-play {
	position: absolute;
	inset: 0;
	width: 4.5rem;
	height: 4.5rem;
	margin: auto;
	border: 3px solid var(--hab-base);
	border-radius: 50%;
	background: rgb(0 0 0 / 0.6);
	box-shadow: 0 2px 12px rgb(0 0 0 / 0.35);
	pointer-events: none;
	transition: transform 0.15s, background-color 0.15s;
}

.hab-play::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 54%;
	border-style: solid;
	border-width: 0.85rem 0 0.85rem 1.4rem;
	border-color: transparent transparent transparent var(--hab-base);
	transform: translate(-50%, -50%);
}

.hab-news__item:hover .hab-play,
.hab-video-link:hover .hab-play,
.hab-video-link:focus-visible .hab-play {
	background: var(--hab-blue);
	transform: scale(1.08);
}

.hab-video-link {
	position: relative;
	display: block;
}

.hab-video-link:focus-visible {
	outline: 3px solid var(--hab-yellow);
	outline-offset: -3px;
}

.hab-video-caption {
	margin: 0;
	padding: 0.6rem 1rem;
	border-top: var(--hab-border);
	background: var(--hab-paper);
	font-weight: 700;
	text-align: center;
}

@media (prefers-reduced-motion: reduce) {
	.hab-play {
		transition: none;
	}
}

/* O que exigimos: a objeção mais comum a cada proposta, e a resposta. */
.hab-objection {
	margin: var(--wp--preset--spacing--40) 0;
	padding: 1.25rem 1.5rem;
	border: var(--hab-border);
	border-left-width: 8px;
	background: var(--hab-paper);
}

.hab-objection > :first-child {
	margin-top: 0;
}

.hab-objection h3 {
	margin: 0.4rem 0 0.6rem;
	font-size: 1.25rem;
}

.hab-objection p:last-child {
	margin-bottom: 0;
}

/* Várias objeções na mesma caixa: separa cada resposta da pergunta seguinte. */
.hab-objection p:not(.hab-card__tag) + h3 {
	margin-top: 1.25rem;
	padding-top: 1.25rem;
	border-top: 1px solid rgb(0 0 0 / 0.15);
}

/* As objeções abrem e fecham: a etiqueta é o título do menu. */
.hab-objection summary.hab-card__tag {
	font-size: 0.8125rem;
	line-height: 1.75rem;
}

.hab-objection[open] summary.hab-card__tag {
	margin-bottom: 0.25rem;
}

.hab-evidence-box .hab-evidence {
	margin: 0.5rem 0 0;
}

/* ---------- Notícias na imprensa (só texto: título, jornal e data) ---------- */

.hab-press__list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(18rem, 100%), 1fr));
	gap: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	margin: var(--wp--preset--spacing--40) 0 0;
	padding: 0;
	list-style: none;
}

.hab-press__item article {
	position: relative;
	height: 100%;
	padding-top: 0.75rem;
	border-top: 3px solid var(--hab-ink);
}

.hab-press__title {
	margin: 0.4rem 0 0 !important;
	font-size: 1.125rem;
	line-height: 1.35;
}

.hab-press__title a {
	color: inherit;
	text-decoration: none;
}

.hab-press__item:hover .hab-stretched,
.hab-press__title a:focus-visible {
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.15em;
}

.hab-press__out {
	color: var(--hab-blue);
}

.hab-press-section > p:not([class]) {
	max-width: 62ch;
}

/* =========================================================================
   Habitação Cartaz (3.0): o sistema visual inspirado em hetactiefonds.nl.
   Cada secção é um capítulo de uma só cor; os títulos são um par de cartaz
   (uma linha a contorno, outra a cheio); botões de cartaz colado; fotografias
   a preto e branco. Estas regras vêm depois das antigas e substituem-nas.
   ========================================================================= */

:root {
	--hab-shadow-pressed: 2px 2px 0 var(--hab-ink);
	--hab-stroke: 2px;
	--hab-gutter: var(--wp--style--root--padding-left, clamp(1rem, 4vw, 2.5rem));
	--hab-col: max(var(--hab-gutter), calc((100vw - 1280px) / 2));
	--hab-on-blue-soft: var(--wp--preset--color--on-azulejo-soft);
	--hab-h2-size: clamp(2.25rem, 1rem + 3.9vw, 4.25rem);
}

/* ---------- Tipografia: uma só família, Archivo; os papéis de «cartaz» a 900 ---------- */

.has-display-font-family,
.hab-display,
.hab-statement,
.hab-ticker__track,
.hab-demand__num,
.hab-stat__num,
.hab-goal__big,
.hab-step > .hab-step__num,
.hab-timeline__year,
.hab-day__rel,
.hab-event__time time,
.hab-ally .hab-ally__mono {
	font-weight: 900;
}

.hab-display,
.hab-hero .hab-display {
	line-height: 1 !important;
	letter-spacing: -0.015em;
}

h2 {
	font-weight: 900;
}

/* Títulos de cartões e de notícias: frase normal, não cartaz. */
h3,
h4 {
	font-weight: 800;
	letter-spacing: -0.005em;
	text-transform: none;
}

.hab-section h2.has-xx-large-font-size {
	font-size: var(--hab-h2-size) !important;
}

/* Linhas a contorno: o lápis do cartaz antes de ser pintado. A cor do traço é a do texto. */
.hab-kicker,
.hab-wordmark__light,
.hab-display:has(mark),
.hab-timeline__year {
	-webkit-text-fill-color: transparent;
	-webkit-text-stroke: var(--hab-stroke) currentColor;
	paint-order: stroke fill;
}

.hab-display:has(mark) mark {
	-webkit-text-fill-color: currentColor;
	-webkit-text-stroke: 0;
	color: inherit !important;
	background: none !important;
}

@supports not (-webkit-text-stroke: 1px currentColor) {
	.hab-kicker,
	.hab-wordmark__light,
	.hab-display:has(mark),
	.hab-timeline__year {
		-webkit-text-fill-color: currentColor;
	}
}

@media (forced-colors: active) {
	.hab-kicker,
	.hab-wordmark__light,
	.hab-display:has(mark),
	.hab-timeline__year {
		-webkit-text-fill-color: CanvasText;
		-webkit-text-stroke: 0;
	}
}

/* O antigo rótulo pequeno passa a ser a primeira linha do título (a contorno). */
.hab-kicker {
	display: block;
	margin: 0 !important;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--hab-h2-size);
	font-weight: 900;
	line-height: 1;
	letter-spacing: -0.015em;
	text-transform: uppercase;
	text-wrap: balance;
}

.hab-kicker::before {
	content: none;
}

.hab-kicker + :is(h1, h2) {
	margin-top: 0 !important;
}

.hab-statement {
	max-width: 34ch;
	font-family: var(--wp--preset--font-family--body);
	font-size: clamp(1.5rem, 1rem + 1.4vw, 2.25rem);
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: -0.01em;
	text-transform: none;
}

.hab-statement::first-line {
	color: inherit;
}

/* Links: sublinhado em vez de setas. */
:where(.wp-site-blocks) a:where(:not(.wp-element-button)) {
	text-decoration-thickness: 2px;
	text-underline-offset: 0.2em;
}

:where(.wp-site-blocks) a:where(:not(.wp-element-button)):hover {
	text-decoration-thickness: 4px;
}

.hab-textlink a {
	font-weight: 700;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.2em;
}

/* ---------- Botões: o cartaz colado. Premido contra a parede ao passar o rato. ---------- */

.wp-block-button__link {
	transition: transform 0.12s ease-out, box-shadow 0.12s ease-out;
	touch-action: manipulation;
}

.wp-block-button__link:hover {
	transform: translate(4px, 4px);
	box-shadow: var(--hab-shadow-pressed);
}

.wp-block-button__link:active {
	transform: translate(6px, 6px);
	box-shadow: none;
}

.wp-block-button.is-style-ink > .wp-block-button__link,
.wp-block-button.is-style-ink > .wp-block-button__link:hover {
	background: var(--hab-base);
	color: var(--hab-ink);
}

/* O botão secundário é um link sublinhado: um só botão por capítulo. */
.wp-block-button.is-style-outline > .wp-block-button__link,
.has-azulejo-background-color .wp-block-button.is-style-outline > .wp-block-button__link,
.has-azulejo-deep-background-color .wp-block-button.is-style-outline > .wp-block-button__link,
.has-ink-background-color .wp-block-button.is-style-outline > .wp-block-button__link {
	padding: 0.6em 0 !important;
	background: none !important;
	color: inherit !important;
	border: 0 !important;
	box-shadow: none !important;
	transform: none !important;
	font-size: 1.125rem;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: none;
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.2em;
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover,
.has-azulejo-background-color .wp-block-button.is-style-outline > .wp-block-button__link:hover,
.has-azulejo-deep-background-color .wp-block-button.is-style-outline > .wp-block-button__link:hover,
.has-ink-background-color .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: none !important;
	color: inherit !important;
	text-decoration-thickness: 4px;
}

/* Sobre azulejo e tinta: contorno e sombra brancos. Sobre tinta, o botão é amarelo. */
:is(.has-azulejo-background-color, .has-azulejo-deep-background-color, .has-ink-background-color, .hab-cta) .wp-block-button:not(.is-style-outline) > .wp-block-button__link {
	border-color: var(--hab-base);
	box-shadow: 6px 6px 0 var(--hab-base);
}

:is(.has-azulejo-background-color, .has-azulejo-deep-background-color, .has-ink-background-color, .hab-cta) .wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover {
	box-shadow: 2px 2px 0 var(--hab-base);
}

:is(.has-ink-background-color, .hab-cta) .wp-block-button:not(.is-style-outline) > .wp-block-button__link {
	background: var(--hab-yellow);
	color: var(--hab-ink);
}

/* ---------- Cabeçalho: nome em cartaz, links em minúsculas, um botão ---------- */

.hab-header {
	border-bottom: 0;
	padding-block: 1rem;
}

.hab-brand::before {
	content: none;
}

.hab-brand a {
	display: inline-block;
	padding-block: 0.2rem;
}

.hab-wordmark__light,
.hab-wordmark__bold {
	display: block;
}

.hab-header .hab-wordmark__light,
.hab-site-header .hab-wordmark__light {
	-webkit-text-stroke-width: 1.25px;
}

.hab-nav .wp-block-navigation-item__content,
.hab-nav .wp-block-navigation-item__content:hover,
.hab-nav .current-menu-item > .wp-block-navigation-item__content {
	background: none;
	text-decoration: none;
	text-underline-offset: 0.3em;
}

.hab-nav .wp-block-navigation-item__content:hover,
.hab-nav .current-menu-item > .wp-block-navigation-item__content {
	text-decoration: underline;
	text-decoration-thickness: 2px;
}

/* Em alemão os substantivos têm maiúscula: o menu fica como está escrito. */
html[lang^="de"] .hab-nav {
	text-transform: none;
}

/* ---------- Herói: bloco amarelo (a rua) encostado ao bloco azulejo (a lei) ---------- */

.hab-hero::before,
.hab-page-hero::before,
.hab-numbers::after,
.hab-cta::before,
.hab-footer::before,
.hab-affiliation::before,
.is-style-azulejo::before,
.hab-article65::before {
	content: none;
	display: none;
}

.hab-section.hab-hero {
	padding: 0 !important;
	background-color: var(--hab-base) !important;
	color: var(--hab-ink) !important;
}

.hab-section.hab-hero.is-layout-constrained > .hab-hero__cols {
	flex: 1 1 auto;
	max-width: none !important;
	margin: 0 !important;
	gap: 0 !important;
	align-items: stretch !important;
}

.hab-hero__main {
	flex-basis: 58% !important;
	padding: clamp(3rem, 7vw, 6.5rem) clamp(1.5rem, 4vw, 4rem) clamp(3rem, 6vw, 5.5rem) var(--hab-col);
	background: var(--hab-yellow);
	color: var(--hab-ink);
}

.hab-hero__main > .hab-kicker {
	display: none;
}

.hab-hero .hab-hero__main .hab-display.has-display-font-size {
	margin-top: 0 !important;
	font-size: clamp(2.6rem, 0.8rem + 4.7vw, 5.5rem) !important;
	text-wrap: balance;
}

.hab-hero__main .hab-lead {
	max-width: 54ch;
	font-size: clamp(1.1rem, 1rem + 0.35vw, 1.3rem);
}

.hab-hero__aside {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: clamp(3rem, 7vw, 6.5rem) var(--hab-col) clamp(3rem, 6vw, 5.5rem) clamp(1.5rem, 4vw, 4rem);
	background: var(--hab-blue);
	color: var(--hab-base);
}

.hab-article65 {
	padding: 0;
	background: none;
	color: inherit;
	border: 0;
	box-shadow: none;
}

.hab-article65__label {
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: none;
	color: var(--hab-on-blue-soft);
}

.hab-article65__quote {
	font-size: clamp(1.25rem, 0.9rem + 0.75vw, 1.6rem);
	font-weight: 500;
	line-height: 1.25;
}

.hab-article65__note {
	margin-top: 1.5rem !important;
	padding-top: 0;
	border-top: 0;
	font-family: var(--wp--preset--font-family--body);
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.4;
	text-transform: none;
}

@media (max-width: 781px) {
	.hab-hero__main,
	.hab-hero__aside {
		padding-left: var(--hab-gutter);
		padding-right: var(--hab-gutter);
	}
}

/* ---------- Faixa de palavras de ordem: banda de tinta ---------- */

.hab-ticker.has-background {
	background-color: var(--hab-ink) !important;
	color: var(--hab-base) !important;
	border-block: 0;
}

.hab-ticker__track {
	font-size: clamp(1.2rem, 2.1vw, 1.7rem);
	letter-spacing: -0.005em;
}

.hab-ticker__sep {
	margin-inline: 0.9rem;
	font-size: 0;
	color: var(--hab-yellow);
}

.hab-ticker__sep::before {
	content: "/";
	font-size: clamp(1.2rem, 2.1vw, 1.7rem);
}

/* ---------- Capítulos: uma cor por secção, cantos vivos, sem riscas ---------- */

.hab-agenda-section {
	background-color: var(--hab-yellow) !important;
	color: var(--hab-ink) !important;
}

.hab-press-section,
.hab-struggle,
.hab-causes-section {
	background-color: var(--hab-paper) !important;
}

.hab-demands.has-background,
.hab-allies-section,
.hab-films {
	background-color: var(--hab-base) !important;
}

/* Na página inicial os números são o capítulo azulejo; em «A crise» ficam no azulejo escuro, a seguir ao topo azulejo. */
.home .hab-numbers.has-background {
	background-color: var(--hab-blue) !important;
}

.hab-section.hab-cta {
	background-color: var(--hab-ink) !important;
	color: var(--hab-base) !important;
}

.hab-footer.has-background {
	background-color: var(--hab-blue-deep) !important;
}

/* ---------- Cartões: sem caixa, sem sombra; o capítulo é o fundo ---------- */

.is-style-poster-card,
.is-style-poster-card:hover {
	padding: 0;
	background: none;
	color: inherit;
	border: 0 !important;
	box-shadow: none !important;
	transform: none !important;
}

.hab-card__tag {
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: none;
	color: inherit;
}

.hab-cards {
	gap: clamp(2rem, 4vw, 3.5rem) clamp(1.5rem, 3vw, 3rem) !important;
}

/* As propostas não são uma sequência: sem números no resumo. */
.hab-demands .hab-demand__num {
	display: none;
}

.hab-demand__num {
	color: inherit;
	-webkit-text-fill-color: transparent;
	-webkit-text-stroke: var(--hab-stroke) currentColor;
	text-shadow: none;
}

:is(.hab-cause, .hab-film, .hab-ally, .hab-featured, .hab-goal, .hab-facts),
:is(.hab-cause, .hab-film, .hab-ally, .hab-featured):hover {
	border: 0 !important;
	box-shadow: none !important;
	transform: none !important;
	padding: 0;
}

.hab-camps a {
	box-shadow: none;
}

/* ---------- Números: a prova, a amarelo sobre azulejo ---------- */

.hab-stats {
	gap: clamp(2rem, 4vw, 3.5rem) clamp(1.5rem, 3vw, 3rem) !important;
	border: 0;
}

.hab-stat {
	padding: 0;
	border: 0;
}

@media (min-width: 782px) {
	.hab-numbers .hab-stats {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

.hab-stat__num {
	font-size: clamp(2.75rem, 1rem + 3.6vw, 4.75rem);
	line-height: 0.95;
	letter-spacing: -0.03em;
	font-variant-numeric: tabular-nums;
	color: var(--hab-yellow);
}

.hab-stat__src {
	font-size: 0.9375rem;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	opacity: 1;
}

:is(.has-azulejo-background-color, .has-azulejo-deep-background-color) .hab-stat__src {
	color: var(--hab-on-blue-soft);
}

.lang-pt .hab-stat__src::before {
	content: "Fonte: ";
}

.lang-en .hab-stat__src::before {
	content: "Source: ";
}

/* ---------- Participar, linha do tempo ---------- */

.hab-step,
.hab-step:last-child {
	border-top: 0;
	border-bottom: 0;
}

.hab-step > .hab-step__num {
	background: var(--hab-ink);
	color: var(--hab-base);
	border: 0;
	box-shadow: none;
}

.hab-timeline__item {
	padding-top: 0;
	border-top: 0;
}

.hab-timeline__item::before {
	content: none;
}

.hab-timeline__year,
.hab-law .hab-timeline__year,
.hab-protest .hab-timeline__year {
	font-size: clamp(3rem, 1rem + 4vw, 4.5rem);
	line-height: 0.95;
	letter-spacing: -0.02em;
	color: inherit;
}

/* ---------- Apelo final: o capítulo invertido ---------- */

.hab-cta .hab-display.has-display-font-size {
	font-size: clamp(2.5rem, 0.8rem + 5.4vw, 6rem) !important;
}

/* ---------- Rodapé: azulejo escuro, o nome em grande ---------- */

.hab-brand--footer {
	font-size: clamp(2rem, 1rem + 2.6vw, 3.25rem) !important;
	letter-spacing: -0.02em;
}

/* ---------- Agenda: papéis colados no amarelo ---------- */

.hab-agenda-filter__go {
	background: var(--hab-ink);
	color: var(--hab-base);
}

.hab-agenda-filter__select {
	box-shadow: none;
}

.hab-day__title,
.hab-day.is-soon .hab-day__title {
	padding: 0.75rem 1rem;
	background: var(--hab-ink);
	color: var(--hab-base);
	border: 0;
}

.hab-day.is-soon .hab-day__title {
	background: var(--hab-blue);
}

.hab-day__rel {
	font-size: 1.5rem;
	letter-spacing: -0.01em;
}

.hab-agenda {
	display: grid;
	gap: 4px;
	margin-top: 4px;
	background: none;
	border: 0;
	box-shadow: none;
}

.hab-event + .hab-event {
	border-top: 0;
}

.hab-event article {
	background: var(--hab-base);
}

.hab-event article:hover {
	background: var(--hab-paper);
}

.hab-event__time time,
.hab-days.is-past .hab-event__time time {
	font-size: 1.75rem;
	letter-spacing: -0.02em;
	font-variant-numeric: tabular-nums;
	color: var(--hab-ink);
}

.hab-event__pin {
	color: inherit;
}

.hab-event__type {
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: none;
	color: var(--hab-ink);
}

.hab-event__go {
	display: none;
}

/* Contagem decrescente: os dias até à próxima mobilização, em cartões de relógio de palhetas,
   no meio de uma frase de cartaz. Na página inicial é uma faixa branca, centrada, antes do
   capítulo vermelho da agenda (inc/cartaz.php). */
.hab-countdown-band {
	background: var(--hab-base);
	color: var(--hab-ink);
}

.hab-countdown {
	display: flex;
	flex-direction: column;
	align-items: center;
	max-width: 54rem;
	margin: 0 auto clamp(2.5rem, 2rem + 1.6vw, 3.5rem);
	text-align: center;
}

.hab-countdown-band .hab-countdown {
	margin-bottom: 0;
}

.hab-countdown > * {
	margin: 0;
}

.hab-section h2.hab-countdown__lead,
.hab-countdown__lead {
	max-width: 28ch;
	font-size: clamp(1.625rem, 1.1rem + 1.7vw, 2.75rem) !important;
	font-weight: 800;
	line-height: 1.2 !important;
	letter-spacing: -0.015em;
	text-wrap: balance;
}

.hab-countdown__more {
	max-width: 36ch;
	font-size: clamp(1.25rem, 1rem + 0.9vw, 1.875rem);
	font-weight: 400;
	line-height: 1.35;
	text-wrap: balance;
}

.hab-countdown .hab-flip {
	margin-block: clamp(1.75rem, 1.25rem + 1.6vw, 3rem);
}

.hab-countdown .hab-countdown__actions {
	justify-content: center;
	margin-top: clamp(2rem, 1.5rem + 1.6vw, 3rem) !important;
}

html body .wp-site-blocks .hab-countdown__actions .wp-block-button > .wp-block-button__link {
	padding: 1.05em 2.25em !important;
	font-size: clamp(1rem, 0.9rem + 0.45vw, 1.25rem) !important;
}

.hab-flip {
	display: flex;
	gap: 0.16em;
	font-size: clamp(5.5rem, 3rem + 10vw, 13rem);
	perspective: 800px;
}

.hab-flip__digit {
	position: relative;
	display: grid;
	place-items: center;
	width: 0.78em;
	height: 1.1em;
	font-weight: 900;
	line-height: 1;
	font-variant-numeric: tabular-nums;
	background: var(--hab-ink);
	color: var(--hab-base);
	border-radius: 0.05em;
	animation: hab-flip-in 0.64s cubic-bezier(0.2, 0.8, 0.2, 1) both;
	animation-delay: calc(var(--i, 0) * 110ms + 200ms);
}

/* A dobra das palhetas: um corte da cor do fundo a meio de cada cartão. */
.hab-flip__digit::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: calc(50% - 1px);
	height: 2px;
	background: var(--hab-base);
}

@keyframes hab-flip-in {
	from {
		transform: rotateX(-88deg);
	}

	to {
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.hab-flip__digit {
		animation: none;
	}
}

/* ---------- Fotografias das listas a preto e branco (a notícia mostra a imagem original) ---------- */

.hab-news__thumb,
.hab-post-card__thumb {
	border: 0;
}

.hab-news__thumb img,
.hab-post-card__thumb img {
	filter: grayscale(1) contrast(1.05);
}

/* Rótulos pequenos dos filmes e das causas: frase normal, sem maiúsculas espaçadas. */
.hab-film__meta,
.hab-cause__meta {
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: none;
	color: inherit;
}

/* Telemóveis: o título do herói em várias linhas, num tamanho que cabe. */
@media (max-width: 781px) {
	.hab-hero .hab-hero__main .hab-display.has-display-font-size {
		font-size: clamp(2.1rem, 9vw, 3rem) !important;
	}
}

/* Logótipos das organizações: sem linha por baixo. */
.hab-ally__mark {
	border: 0 !important;
}

.hab-footer__bottom {
	border-top: 0 !important;
}

/* O herói está marcado como azulejo na base de dados, mas o botão vive no bloco amarelo. */
.hab-hero__main .wp-block-button:not(.is-style-outline) > .wp-block-button__link {
	background: var(--hab-base);
	color: var(--hab-ink);
	border-color: var(--hab-ink);
	box-shadow: var(--hab-shadow);
}

.hab-hero__main .wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover {
	box-shadow: var(--hab-shadow-pressed);
}

/* =========================================================================
   Paleta hetactiefonds e Satoshi (3.1). Os slugs antigos guardam os valores novos
   (amarelo = vermelho #FF3C3C, hoje laranja #FF6A13; azulejo = preto, azulejo-deep = cinza escuro #5E6568);
   aqui ficam só os acertos que a nova paleta pede.
   ========================================================================= */

/* Barra superior: o cinza #96A0A5 da barra secundária do Actiefonds, texto a preto. */
.hab-topbar.has-background {
	background-color: var(--wp--preset--color--on-azulejo-soft) !important;
	color: var(--hab-ink) !important;
}

.hab-topbar a {
	color: inherit;
}

/* Faixa de palavras de ordem: cinza claro entre o herói e a agenda (os dois vermelhos). */
.hab-ticker.has-background {
	background-color: var(--hab-paper) !important;
	color: var(--hab-ink) !important;
}

/* «Hoje» e «Amanhã»: cinza escuro, para se distinguirem dos outros dias (pretos). */
.hab-day.is-soon .hab-day__title {
	background: var(--hab-blue-deep);
}

/* Sobre o cinza escuro o vermelho não se lê (1,9:1): números, fontes e destaques a branco. */
.has-azulejo-deep-background-color :is(.hab-stat__num, .hab-stat__src, .hab-goal__big, .has-amarelo-color) {
	color: var(--hab-base) !important;
}

/* Rodapé (cinza escuro): títulos a branco, passar o rato engrossa o sublinhado. */
.hab-footer__title {
	color: var(--hab-base);
}

.hab-footer a:hover {
	color: inherit;
	text-decoration: underline;
	text-decoration-thickness: 2px;
}

/* Satoshi: números das estatísticas e da contagem com algarismos de largura fixa. */
.hab-stat__num,
.hab-flip__digit,
.hab-event__time time {
	font-feature-settings: "tnum" 1;
}

/* Página inicial: os números ficam no capítulo preto (não no cinza escuro), por isso voltam ao vermelho. */
.home .hab-numbers .hab-stat__num {
	color: var(--hab-yellow) !important;
}

.home .hab-numbers .hab-stat__src {
	color: var(--hab-on-blue-soft) !important;
}

/* Grego: a Satoshi não tem alfabeto grego (só o Ω, desenhado como símbolo), e misturar letras
   de duas fontes na mesma palavra parte as palavras. As páginas em grego usam a alternativa
   (Archivo para o latim, Noto Sans para o grego). */
html[lang^="el"],
html[lang^="el"] body {
	--wp--preset--font-family--body: Archivo, system-ui, -apple-system, "Segoe UI", sans-serif;
	--wp--preset--font-family--display: Archivo, system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* =========================================================================
   Títulos sem contorno (3.2): todo o texto é cheio. O par de cartaz passa a ser
   uma linha em Satoshi Medium e outra em Black, na mesma cor.
   ========================================================================= */

.hab-kicker,
.hab-wordmark__light,
.hab-display:has(mark),
.hab-timeline__year,
.hab-demand__num {
	-webkit-text-fill-color: currentColor;
	-webkit-text-stroke: 0;
}

.hab-kicker,
.hab-wordmark__light,
.hab-display:has(mark) {
	font-weight: 500;
}

.hab-display:has(mark) mark,
.hab-wordmark__bold {
	font-weight: 900;
}

/* =========================================================================
   3.3: herói como o do Het Actiefonds, cartões e tamanhos pequenos.
   ========================================================================= */

/* Herói: grelha de 12 colunas. O título é um bloco vermelho (colunas 1–8) que tinge a
   fotografia a preto e branco (colunas 7–12) onde se sobrepõem; o texto fica por baixo,
   em fundo branco; o artigo 65.º fecha o herói numa faixa preta. */
.hab-section.hab-hero {
	display: block;
	min-height: 0 !important;
	isolation: isolate;
}

.hab-section.hab-hero.is-layout-constrained > .hab-hero__cols {
	display: grid !important;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	grid-template-rows: auto auto auto auto 1fr auto;
	min-height: clamp(36rem, 82svh, 54rem);
}

.hab-hero__main {
	display: contents;
}

.hab-hero__main > * {
	position: relative;
	z-index: 2;
	margin: 0 !important;
}

.hab-hero .hab-hero__main > h1.hab-display {
	grid-column: 1 / 9;
	grid-row: 1;
	align-self: start;
	padding: clamp(3rem, 6vw, 5.5rem) calc(25% + clamp(1.25rem, 2vw, 2rem)) clamp(2.5rem, 5vw, 4.5rem) var(--hab-col);
	background: var(--hab-yellow);
	color: var(--hab-ink);
	mix-blend-mode: multiply;
}

.hab-hero__photo {
	grid-column: 7 / 13;
	grid-row: 1 / 6;
	position: relative;
	z-index: 1;
	margin: clamp(1.5rem, 2.5vw, 2.25rem) 0 0 !important;
	background: var(--hab-paper);
}

.hab-hero__photo img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 45% 40%;
	filter: grayscale(1) contrast(1.08);
}

.hab-hero__main > .hab-lead,
.hab-hero__main > .wp-block-buttons,
.hab-hero__main > .hab-textlink {
	grid-column: 1 / 7;
	padding-left: var(--hab-col);
	padding-right: clamp(1.5rem, 3vw, 3rem);
}

.hab-hero__main > .hab-lead {
	grid-row: 2;
	padding-top: clamp(2rem, 4vw, 3.25rem);
	max-width: none;
	font-size: clamp(1.125rem, 1rem + 0.3vw, 1.25rem);
	line-height: 1.55;
}

.hab-hero__main > .wp-block-buttons {
	grid-row: 3;
	padding-top: clamp(1.5rem, 3vw, 2.25rem);
	gap: 1.5rem;
	align-items: center;
}

.hab-hero__main > .hab-textlink {
	grid-row: 4;
	padding-top: 1rem;
	padding-bottom: clamp(3rem, 6vw, 5rem);
}

/* Artigo 65.º: a faixa preta (as provas) que fecha o herói. */
.hab-hero .hab-hero__aside {
	grid-column: 1 / -1;
	grid-row: 6;
	display: block;
	padding: clamp(2.75rem, 5vw, 4.5rem) var(--hab-col);
	background: var(--hab-blue);
	color: var(--hab-base);
}

.hab-hero__aside .hab-article65 {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
	gap: 0.75rem clamp(2rem, 5vw, 5rem);
	align-items: start;
}

.hab-hero__aside .hab-article65__label {
	grid-row: 1 / 3;
	margin: 0;
	font-size: clamp(1.5rem, 1rem + 1.6vw, 2.5rem);
	font-weight: 500;
	line-height: 1.05;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: var(--hab-base);
}

.hab-hero__aside .hab-article65__quote {
	margin: 0;
	max-width: 46ch;
	font-size: clamp(1.25rem, 1rem + 0.8vw, 1.75rem);
	line-height: 1.3;
}

.hab-hero__aside .hab-article65__note {
	margin: 0 !important;
	color: var(--hab-on-blue-soft);
	font-weight: 500;
}

@media (max-width: 781px) {
	.hab-section.hab-hero.is-layout-constrained > .hab-hero__cols {
		grid-template-columns: minmax(0, 1fr);
		grid-template-rows: none;
		min-height: 0;
	}

	.hab-hero .hab-hero__main > h1.hab-display,
	.hab-hero__photo,
	.hab-hero__main > .hab-lead,
	.hab-hero__main > .wp-block-buttons,
	.hab-hero__main > .hab-textlink,
	.hab-hero .hab-hero__aside {
		grid-column: 1;
		grid-row: auto;
	}

	.hab-hero .hab-hero__main > h1.hab-display {
		order: 1;
		padding: 2.5rem var(--hab-gutter) 2rem;
		mix-blend-mode: normal;
	}

	.hab-hero__photo {
		order: 2;
		margin: 0 !important;
		aspect-ratio: 4 / 3;
	}

	.hab-hero__main > .hab-lead { order: 3; }
	.hab-hero__main > .wp-block-buttons { order: 4; }
	.hab-hero__main > .hab-textlink { order: 5; }
	.hab-hero .hab-hero__aside { order: 6; padding: 2.5rem var(--hab-gutter); }

	.hab-hero__main > .hab-lead,
	.hab-hero__main > .wp-block-buttons,
	.hab-hero__main > .hab-textlink {
		padding-left: var(--hab-gutter);
		padding-right: var(--hab-gutter);
	}

	.hab-hero__aside .hab-article65 {
		grid-template-columns: minmax(0, 1fr);
	}

	.hab-hero__aside .hab-article65__label {
		grid-row: auto;
	}
}

/* Cartões de notícias e de artigos: a imagem fica dentro do cartão (antes saía pelas
   margens, porque os cartões já não têm moldura nem enchimento). */
.hab-news__thumb,
.hab-post-card__thumb {
	margin: 0 0 1rem !important;
	border-bottom: 0;
}

/* Texto pequeno: com a Satoshi, nada abaixo de 14px (datas, etiquetas, legendas). */
.hab-news__meta,
.hab-press__meta,
.hab-event__meta,
.hab-film__meta,
.hab-cause__meta,
.hab-card__tag,
.hab-stat__src,
.hab-note,
.hab-sources,
.hab-protest__sources,
.hab-films__note,
.hab-video-caption,
.hab-objection summary,
.hab-evidence summary,
.wp-block-details summary,
.hab-badge,
.hab-ticker__toggle {
	font-size: max(0.875rem, 1em * 0.875);
}

/* Títulos dentro de colunas: a Satoshi Black é muito mais larga do que a antiga Anton
   condensada; num terço do ecrã, um título ao tamanho das secções partia palavras a meio
   («ORGANIZARMO / S»). Dentro de colunas, os títulos ficam um passo abaixo. */
.hab-section .wp-block-column h2.wp-block-heading,
.hab-section .wp-block-column h2.wp-block-heading.has-xx-large-font-size {
	font-size: clamp(1.75rem, 0.9rem + 2.3vw, 3rem) !important;
	overflow-wrap: normal;
	hyphens: manual;
}

/* Rótulos que ainda estavam a 12–13px. */
.hab-lang__code {
	font-size: 0.8125rem;
}

summary.hab-card__tag,
.hab-objection summary,
.hab-evidence summary {
	font-size: 0.9375rem !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}

.hab-event-details dt {
	font-size: 0.875rem !important;
	font-weight: 700;
	letter-spacing: 0 !important;
	text-transform: none !important;
}

/* Caixa preta «Ninguém resolve isto sozinho»: o botão leva contorno e sombra brancos. */
.hab-goal .wp-block-button:not(.is-style-outline) > .wp-block-button__link {
	border-color: var(--hab-base);
	box-shadow: 6px 6px 0 var(--hab-base);
}

.hab-goal .wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover {
	box-shadow: 2px 2px 0 var(--hab-base);
}

.hab-lang__code {
	font-size: 0.875rem;
}

/* Seletor de língua: área de toque de 44px. */
.hab-lang__toggle {
	min-height: 44px;
	min-width: 44px;
}

/* Título do herói: no máximo 76px, para o texto de abertura começar dentro do primeiro ecrã. */
.hab-hero .hab-hero__main > h1.hab-display.has-display-font-size {
	font-size: clamp(2.6rem, 0.8rem + 4.2vw, 4.75rem) !important;
}

@media (max-width: 781px) {
	.hab-hero .hab-hero__main > h1.hab-display.has-display-font-size {
		font-size: clamp(2.1rem, 9vw, 3rem) !important;
	}
}

/* Faixa: o separador já é uma barra no HTML (inc/cartaz.php). */
.hab-ticker__sep {
	font-size: inherit;
}

.hab-ticker__sep::before {
	content: none;
}

/* Botão de pausa da faixa: ícones desenhados, área de toque de 44px. */
.hab-ticker__toggle {
	min-height: 44px;
	font-size: 0.875rem;
}

/* Artigo 65.º: o rótulo é um título pequeno, não um cartaz. */
.hab-hero__aside .hab-article65__label {
	font-size: clamp(1.375rem, 1rem + 1vw, 2rem);
}

/* Agenda: a hora em Satoshi Black é mais larga do que em Anton; a coluna da hora cresce
   para «17:00» não encostar ao título. */
.hab-event article {
	grid-template-columns: 6.5rem minmax(0, 1fr) auto;
}

@media (max-width: 600px) {
	.hab-event article {
		grid-template-columns: 4.75rem minmax(0, 1fr);
		gap: 0.75rem;
	}

	.hab-event__time time,
	.hab-days.is-past .hab-event__time time {
		font-size: 1.375rem;
	}
}

/* =========================================================================
   3.4: botões novos, sobrescritos em sobrancelha, hierarquia tipográfica,
   quase-preto e quase-branco, rodapé escuro e cores por página.
   ========================================================================= */

/* ---------- Botões: um só desenho, sem sombras, 2px de contorno ----------
   Principal: cheio. Secundário: só contorno, com a mesma altura, para os dois
   ficarem equilibrados lado a lado. As cores vêm do capítulo onde estão. */
:root {
	--btn-bg: var(--hab-ink);
	--btn-fg: var(--hab-base);
	--btn-line: var(--hab-ink);
	--btn-hover-bg: var(--hab-yellow);
	--btn-hover-fg: var(--hab-ink);
	--btn2-fg: var(--hab-ink);
	--btn2-hover-bg: var(--hab-ink);
	--btn2-hover-fg: var(--hab-base);
}

/* Capítulos escuros. */
.has-azulejo-background-color,
.has-azulejo-deep-background-color,
.has-ink-background-color,
.hab-goal,
.hab-footer {
	--btn-bg: var(--hab-base);
	--btn-fg: var(--hab-ink);
	--btn-line: var(--hab-base);
	--btn-hover-bg: var(--hab-yellow);
	--btn-hover-fg: var(--hab-ink);
	--btn2-fg: var(--hab-base);
	--btn2-hover-bg: var(--hab-base);
	--btn2-hover-fg: var(--hab-ink);
}

/* Capítulos vermelhos. */
.has-amarelo-background-color,
.hab-agenda-section,
.hab-section.hab-cta,
.hab-page--crisis #numeros {
	--btn-bg: var(--hab-ink);
	--btn-fg: var(--hab-base);
	--btn-line: var(--hab-ink);
	--btn-hover-bg: var(--hab-base);
	--btn-hover-fg: var(--hab-ink);
	--btn2-fg: var(--hab-ink);
	--btn2-hover-bg: var(--hab-ink);
	--btn2-hover-fg: var(--hab-base);
}

/* Fundos claros dentro de secções marcadas como escuras na base de dados. */
.hab-hero,
.hab-page--agenda .hab-page-hero,
.hab-page--crisis .hab-page-hero,
.hab-page--demands .hab-page-hero {
	--btn-bg: var(--hab-ink);
	--btn-fg: var(--hab-base);
	--btn-line: var(--hab-ink);
	--btn-hover-bg: var(--hab-yellow);
	--btn-hover-fg: var(--hab-ink);
	--btn2-fg: var(--hab-ink);
	--btn2-hover-bg: var(--hab-ink);
	--btn2-hover-fg: var(--hab-base);
}

html body .wp-site-blocks .wp-block-button > .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0.75rem 1.375rem !important;
	background: var(--btn-bg) !important;
	color: var(--btn-fg) !important;
	border: 2px solid var(--btn-line) !important;
	border-radius: 0;
	box-shadow: none !important;
	transform: none !important;
	font-family: var(--wp--preset--font-family--body);
	font-size: 1rem !important;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0 !important;
	text-transform: none !important;
	text-decoration: none !important;
	transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

html body .wp-site-blocks .wp-block-button > .wp-block-button__link:hover {
	background: var(--btn-hover-bg) !important;
	color: var(--btn-hover-fg) !important;
	border-color: var(--btn-hover-bg) !important;
}

html body .wp-site-blocks .wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent !important;
	color: var(--btn2-fg) !important;
	border-color: var(--btn2-fg) !important;
}

html body .wp-site-blocks .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--btn2-hover-bg) !important;
	color: var(--btn2-hover-fg) !important;
	border-color: var(--btn2-hover-bg) !important;
}

html body .wp-site-blocks .wp-block-buttons {
	gap: 0.75rem;
	align-items: center;
}

html body .wp-site-blocks .hab-header__cta .wp-block-button__link {
	min-height: 44px;
	padding: 0.55rem 1.1rem !important;
	font-size: 0.9375rem !important;
}

/* Outros controlos com ar de botão: sem sombra, contorno de 2px. */
.hab-pager__link,
.hab-agenda-filter__go,
.hab-agenda-filter__select,
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close,
.hab-camps a,
.hab-lang__toggle,
.is-menu-open .hab-nav__cta .wp-block-button__link {
	box-shadow: none !important;
}

.hab-pager__link {
	border-width: 2px !important;
}

/* ---------- Sobrescrito (eyebrow): pequeno, em maiúsculas, com um traço vermelho ---------- */
.hab-kicker {
	display: flex !important;
	align-items: center;
	gap: 0.625rem;
	margin: 0 0 0.875rem !important;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.875rem !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	letter-spacing: 0.08em !important;
	text-transform: uppercase;
	-webkit-text-fill-color: currentColor;
	-webkit-text-stroke: 0;
}

.hab-kicker::before {
	content: "";
	display: block;
	flex: none;
	width: 1.5rem;
	height: 3px;
	background: var(--hab-yellow);
}

:is(.has-amarelo-background-color, .hab-agenda-section, .hab-section.hab-cta, .hab-page--crisis #numeros) .hab-kicker::before {
	background: currentColor;
}

.hab-hero .hab-hero__main > .hab-kicker {
	display: none !important;
}

/* ---------- Hierarquia tipográfica ----------
   Uma escala só (base 18px): sobrescrito 14, botões 16, texto 18, abertura 20–21,
   títulos de cartão 18–24, títulos de secção 32–52, títulos de página 40–68 e o
   herói da página inicial (76). Maiúsculas só no herói da página inicial e na marca:
   títulos compridos em maiúsculas leem-se pior. */
body {
	line-height: 1.6;
}

h1,
h2,
h3,
h4,
.hab-display {
	text-transform: none;
}

.hab-hero .hab-hero__main > h1.hab-display {
	text-transform: uppercase;
}

.hab-display:has(mark):not(.hab-hero__main > h1) {
	font-weight: 800;
}

.hab-display:not(.hab-hero__main > h1) mark {
	font-weight: inherit;
}

.hab-section h2,
.hab-section h2.has-xx-large-font-size {
	font-size: clamp(2rem, 1.1rem + 2.4vw, 3.25rem) !important;
	font-weight: 800;
	line-height: 1.05 !important;
	letter-spacing: -0.02em;
}

.hab-section h2.has-x-large-font-size {
	font-size: clamp(1.625rem, 1.1rem + 1.4vw, 2.25rem) !important;
}

.hab-section .wp-block-column h2.wp-block-heading,
.hab-section .wp-block-column h2.wp-block-heading.has-xx-large-font-size {
	font-size: clamp(1.75rem, 1rem + 1.8vw, 2.625rem) !important;
}

.hab-page-hero h1.hab-display,
.hab-page-hero .hab-display.has-display-font-size {
	max-width: 22ch;
	font-size: clamp(2.5rem, 1.2rem + 3.4vw, 4.25rem) !important;
	font-weight: 800;
	line-height: 1.02 !important;
	letter-spacing: -0.025em;
}

.hab-cta .hab-display.has-display-font-size,
.hab-404 .hab-display.has-display-font-size {
	font-size: clamp(2.25rem, 1rem + 4vw, 4.75rem) !important;
	font-weight: 800;
	line-height: 1.02 !important;
	letter-spacing: -0.025em;
}

.hab-section h3,
.hab-cause h3 {
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.01em;
}

.hab-news__title,
.hab-event__title {
	font-size: 1.125rem !important;
	font-weight: 700;
	line-height: 1.3;
}

.hab-press__title {
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.35;
}

.hab-lead,
.hab-hero .hab-lead {
	max-width: 60ch;
	font-size: clamp(1.125rem, 1rem + 0.35vw, 1.3125rem);
	line-height: 1.5;
}

/* Títulos de coluna do rodapé: como os sobrescritos. */
.hab-footer__title {
	font-size: 0.875rem !important;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Destaques dentro de títulos: a mesma cor do título (sem palavras soltas a vermelho). */
:is(h1, h2, h3) mark {
	color: inherit !important;
}

/* ---------- Cabeçalho: língua no menu principal; sem barra superior ---------- */
.hab-header__nav {
	align-items: center;
}

.hab-header .hab-lang {
	font-size: 0.875rem;
	letter-spacing: 0.04em;
}

.hab-header .hab-lang__toggle {
	min-height: 44px;
	padding: 0 0.7rem;
	border: 2px solid currentColor;
}

/* ---------- Rodapé: o tom mais escuro; a frase da campanha numa faixa fina no fim ---------- */
.hab-footer.has-background {
	background-color: var(--hab-ink) !important;
}

.hab-footer__strip {
	padding-block: 0.625rem;
	font-size: 0.875rem;
	line-height: 1.4;
}

.hab-footer__strip p {
	margin: 0;
}

.hab-footer__strip a {
	color: inherit;
}

/* ---------- Apelo final: vermelho (o rodapé passou a ser o quase-preto) ---------- */
.hab-section.hab-cta {
	background-color: var(--hab-yellow) !important;
	color: var(--hab-ink) !important;
}

/* ---------- Cores por página ---------- */
.hab-page--agenda .hab-page-hero,
.hab-page--crisis .hab-page-hero,
.hab-page--demands .hab-page-hero {
	background-color: var(--hab-base) !important;
	color: var(--hab-ink) !important;
	padding-bottom: clamp(2rem, 4vw, 3.5rem) !important;
}

/* «A crise»: os números num capítulo vermelho, todo o texto em quase-preto. */
.hab-page--crisis #numeros {
	background-color: var(--hab-yellow) !important;
	color: var(--hab-ink) !important;
}

.hab-page--crisis #numeros :is(h2, h3, p, li, a, .hab-stat__num, .hab-stat__label, .hab-stat__src) {
	color: var(--hab-ink) !important;
}

/* ---------- Causas: fotografia de cada lugar, com crédito ---------- */
.hab-cause__photo {
	margin: 0 0 1.25rem;
}

.hab-cause__photo img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	filter: grayscale(1) contrast(1.05);
}

.hab-cause__photo figcaption {
	margin-top: 0.5rem;
	font-size: 0.875rem;
	line-height: 1.4;
	color: var(--wp--preset--color--muted);
}

.hab-cause__photo figcaption a {
	color: inherit;
}

/* Secundário: repõe tudo o que a regra antiga (link sublinhado, sem contorno) tirava. */
html body .wp-site-blocks .wp-block-button.is-style-outline > .wp-block-button__link {
	padding: 0.75rem 1.375rem !important;
	border-width: 2px !important;
	border-style: solid !important;
	font-size: 1rem !important;
	font-weight: 700 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	text-decoration: none !important;
}

/* Telemóveis: com o seletor de língua no cabeçalho não há lugar para o «Participa»;
   continua no fim do menu (theme.js copia-o para lá). */
@media (max-width: 600px) {
	.hab-header__cta {
		display: none !important;
	}

	.hab-header .hab-lang__toggle {
		padding: 0 0.55rem;
	}
}

/* =========================================================================
   3.5: Notícias, Agenda (anteriores), «Não é a primeira vez», números de
   «A crise» e o seletor de língua.
   ========================================================================= */

/* Topos brancos com texto quase-preto também em Notícias e «Não é a primeira vez». */
.hab-page--news .hab-page-hero,
.hab-page--history .hab-page-hero {
	background-color: var(--hab-base) !important;
	color: var(--hab-ink) !important;
	padding-bottom: clamp(2rem, 4vw, 3.5rem) !important;
	--btn-bg: var(--hab-ink);
	--btn-fg: var(--hab-base);
	--btn-line: var(--hab-ink);
	--btn-hover-bg: var(--hab-yellow);
	--btn-hover-fg: var(--hab-ink);
	--btn2-fg: var(--hab-ink);
	--btn2-hover-bg: var(--hab-ink);
	--btn2-hover-fg: var(--hab-base);
}

/* Notícias: a lista é um capítulo vermelho, em três colunas (duas no tablet, uma no telemóvel).
   A imprensa, logo a seguir, fica em cinza claro para os dois capítulos não se fundirem. */
.hab-page--news .hab-news-section:not(.hab-press-section) {
	background-color: var(--hab-yellow) !important;
	color: var(--hab-ink) !important;
	--btn-bg: var(--hab-ink);
	--btn-fg: var(--hab-base);
	--btn-line: var(--hab-ink);
	--btn-hover-bg: var(--hab-base);
	--btn-hover-fg: var(--hab-ink);
	--btn2-fg: var(--hab-ink);
	--btn2-hover-bg: var(--hab-ink);
	--btn2-hover-fg: var(--hab-base);
}

.hab-page--news .hab-news-section:not(.hab-press-section) .hab-kicker::before {
	background: currentColor;
}

.hab-page--news .hab-news-section:not(.hab-press-section) .hab-news__thumb {
	background: rgba(21, 23, 24, 0.12);
}

.hab-page--news .hab-news-section:not(.hab-press-section) .hab-pager__link {
	background: transparent;
	color: var(--hab-ink);
	border-color: var(--hab-ink);
}

.hab-page--news .hab-news-section:not(.hab-press-section) .hab-pager__link:hover {
	background: var(--hab-ink);
	color: var(--hab-base);
}

.hab-page--news .hab-news__list {
	grid-template-columns: minmax(0, 1fr) !important;
	gap: clamp(2rem, 4vw, 3rem) clamp(1.25rem, 2.5vw, 2rem) !important;
}

@media (min-width: 600px) {
	.hab-page--news .hab-news__list {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (min-width: 1024px) {
	.hab-page--news .hab-news__list {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}

/* Agenda: «Mobilizações anteriores» em cinza claro (a próxima agenda continua vermelha). */
.hab-agenda-section.has-paper-background-color {
	background-color: var(--hab-paper) !important;
	color: var(--hab-ink) !important;
	--btn-bg: var(--hab-ink);
	--btn-fg: var(--hab-base);
	--btn-hover-bg: var(--hab-yellow);
	--btn-hover-fg: var(--hab-ink);
	--btn2-fg: var(--hab-ink);
	--btn2-hover-bg: var(--hab-ink);
	--btn2-hover-fg: var(--hab-base);
}

.hab-agenda-section.has-paper-background-color .hab-kicker::before {
	background: var(--hab-yellow);
}

/* «Não é a primeira vez»: linha do tempo em três colunas e anos a vermelho. O vermelho só
   passa o contraste sobre o fundo escuro (5,1:1); sobre o cinza claro da secção seguinte
   (2,8:1) os anos ficam em quase-preto. */
.hab-page--history .hab-timeline {
	grid-template-columns: minmax(0, 1fr) !important;
	gap: clamp(2rem, 4vw, 3rem) clamp(1.5rem, 3vw, 2.5rem) !important;
}

@media (min-width: 600px) {
	.hab-page--history .hab-timeline {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (min-width: 1024px) {
	.hab-page--history .hab-timeline {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}

.hab-page--history :is(.has-ink-background-color, .has-azulejo-background-color, .has-azulejo-deep-background-color) .hab-timeline__year {
	color: var(--hab-yellow) !important;
}

/* «A crise»: os números como na página inicial: fundo quase-preto, texto quase-branco,
   números a vermelho, fontes em cinza. */
.hab-page--crisis #numeros {
	background-color: var(--hab-ink) !important;
	color: var(--hab-base) !important;
	--btn-bg: var(--hab-base);
	--btn-fg: var(--hab-ink);
	--btn-line: var(--hab-base);
	--btn-hover-bg: var(--hab-yellow);
	--btn-hover-fg: var(--hab-ink);
	--btn2-fg: var(--hab-base);
	--btn2-hover-bg: var(--hab-base);
	--btn2-hover-fg: var(--hab-ink);
}

.hab-page--crisis #numeros :is(h2, h3, p, li, a, .hab-stat__label) {
	color: var(--hab-base) !important;
}

.hab-page--crisis #numeros .hab-stat__num {
	color: var(--hab-yellow) !important;
}

.hab-page--crisis #numeros .hab-stat__src {
	color: var(--hab-on-blue-soft) !important;
}

.hab-page--crisis #numeros .hab-kicker::before {
	background: var(--hab-yellow);
}

/* Seletor de língua: o último elemento do cabeçalho, com a altura exata do botão (44px). */
.hab-header .hab-lang__toggle {
	box-sizing: border-box;
	height: 44px;
	min-height: 0;
}

html body .wp-site-blocks .hab-header__cta .wp-block-button__link {
	box-sizing: border-box;
	height: 44px;
	min-height: 0;
}

/* Abaixo de 1100px (1200px em alemão) o cabeçalho está invertido (row-reverse) para o ☰
   ficar à direita; ordem −1 põe a língua no fim, depois do ☰. */
@media (max-width: 1099px) {
	.hab-header__nav > .hab-lang {
		order: -1;
	}
}

@media (max-width: 1199px) {
	html[lang^="de"] .hab-header__nav > .hab-lang {
		order: -1;
	}
}

/* =========================================================================
   3.6: mais ar. Uma escala de espaços (base 8px) aplicada a todo o site:
   a distância entre capítulos é sempre maior do que qualquer espaço dentro
   de um capítulo (secções a ~126px de cada lado no computador, ~250px entre
   conteúdos de capítulos vizinhos), o bloco do título fica a 40–64px do
   conteúdo e o texto corrido não passa dos 68 caracteres por linha.
   ========================================================================= */

:root {
	--hab-section-pad: var(--wp--preset--spacing--70);
	--hab-gap-head: clamp(2.5rem, 1.75rem + 2.2vw, 4rem);
	--hab-gap-actions: clamp(2.5rem, 2rem + 1.6vw, 3.5rem);
	--hab-gap-text: 1.5rem;
}

/* ---------- Capítulos: o mesmo espaço em cima e em baixo em todas as secções ---------- */
.hab-section:not(.hab-hero):not(.hab-page-hero) {
	padding-top: var(--hab-section-pad) !important;
	padding-bottom: var(--hab-section-pad) !important;
}

.hab-section.hab-page-hero {
	padding-top: clamp(4rem, 2.5rem + 5vw, 8rem) !important;
	padding-bottom: clamp(3.5rem, 2.25rem + 3.5vw, 6rem) !important;
}

.hab-footer.has-background {
	padding-top: var(--hab-section-pad) !important;
	padding-bottom: clamp(2.5rem, 2rem + 2vw, 4rem) !important;
}

/* ---------- Dentro de um capítulo ---------- */
/* Sobrescrito → título: 16px. Título → abertura: 24px. */
.hab-kicker {
	margin-bottom: 1rem !important;
}

.hab-section:not(.hab-prose) > :is(h1, h2) + :is(p, .hab-lead) {
	margin-top: var(--hab-gap-text) !important;
}

/* Bloco do título → conteúdo (grelhas, listas, agenda, notícias, colunas): 40–64px. */
.hab-section:not(.hab-prose) > :is(h1, h2, .hab-lead, p) + :not(p):not(.hab-lead):not(h1):not(h2):not(.wp-block-buttons):not(.hab-textlink) {
	margin-top: var(--hab-gap-head) !important;
}

/* Conteúdo → botões e links de fim de capítulo: 40–56px. */
.hab-section:not(.hab-prose) > :is(.wp-block-buttons, .hab-textlink) {
	margin-top: var(--hab-gap-actions) !important;
}

.hab-section:not(.hab-prose) > .hab-statement {
	margin-top: var(--hab-gap-head) !important;
}

/* Texto corrido com uma medida legível. */
/* Só nas secções largas: as estreitas (texto longo) já têm a medida certa. */
.hab-section:not(.hab-hero):not(.hab-narrow):not(.hab-prose) > p:not(.hab-kicker):not(.hab-textlink):not(.hab-statement) {
	max-width: 68ch;
}

/* ---------- Texto longo (privacidade, quem somos, notícias, mobilizações) ---------- */
:is(.hab-prose, .wp-block-post-content, .hab-protest__text, .hab-programme__body) > * + * {
	margin-block-start: 1.25em;
}

:is(.hab-prose, .wp-block-post-content, .hab-protest__text, .hab-programme__body) > :is(h2, h3) {
	margin-block-start: 2.25em !important;
}

:is(.hab-prose, .wp-block-post-content, .hab-protest__text, .hab-programme__body) > :is(h2, h3) + * {
	margin-block-start: 0.75em !important;
}

:is(.hab-prose, .wp-block-post-content, .hab-programme__body) li + li,
.hab-protest__text li + li {
	margin-top: 0;
}

/* ---------- Grelhas ---------- */
.hab-news__list,
.hab-page--news .hab-news__list {
	row-gap: clamp(2.75rem, 2rem + 2vw, 4rem) !important;
	column-gap: clamp(1.5rem, 1rem + 1.4vw, 2.5rem) !important;
}

.hab-press__list {
	gap: clamp(2rem, 1.5rem + 1.4vw, 3rem) clamp(1.5rem, 1rem + 1.4vw, 2.5rem) !important;
}

.hab-cards,
.hab-demands .hab-cards,
.hab-causes-grid,
.hab-films__grid {
	row-gap: clamp(3rem, 2.5rem + 1.6vw, 4.5rem) !important;
	column-gap: clamp(2rem, 1.5rem + 1.6vw, 3rem) !important;
}

.hab-stats {
	row-gap: clamp(3.5rem, 2.5rem + 3vw, 5.5rem) !important;
	column-gap: clamp(2rem, 1.5rem + 2.5vw, 4.5rem) !important;
}

.hab-timeline,
.hab-page--history .hab-timeline {
	row-gap: clamp(3rem, 2.25rem + 2.2vw, 4.5rem) !important;
	column-gap: clamp(2rem, 1.5rem + 1.6vw, 3rem) !important;
}

.hab-allies {
	gap: clamp(1.5rem, 1rem + 1.4vw, 2.5rem) !important;
}

.hab-footer__cols {
	gap: clamp(2.5rem, 2rem + 2.5vw, 4.5rem) !important;
}

/* ---------- Dentro dos cartões ---------- */
.hab-news__thumb,
.hab-post-card__thumb {
	margin-bottom: 1.25rem !important;
}

.hab-news__item .hab-card__tag,
.hab-press__item .hab-card__tag {
	margin: 0 0 0.5rem;
}

.is-style-poster-card > * + *,
.hab-cause__body > * + *,
.hab-film > * + * {
	margin-top: 0.75rem;
}

.is-style-poster-card > .wp-block-buttons,
.hab-cause__body > .wp-block-buttons,
.hab-film > .wp-block-buttons {
	margin-top: 1.5rem !important;
}

.hab-cause {
	padding: clamp(1.75rem, 1.25rem + 1.6vw, 2.75rem) !important;
}

.hab-cause__photo {
	margin-bottom: 1.5rem;
}

.hab-stat > * + * {
	margin-top: 1rem !important;
}

.hab-stat > .hab-stat__src {
	margin-top: 0.75rem !important;
}

.hab-timeline__item > * + * {
	margin-top: 0.75rem !important;
}

/* ---------- Cabeçalho, faixa, herói ---------- */
.hab-header {
	padding-block: 1.25rem;
}

.hab-ticker {
	padding-block: 1.125rem;
}

.hab-hero__main > .hab-lead {
	padding-top: clamp(2.75rem, 2rem + 2.4vw, 4rem) !important;
}

.hab-hero__main > .wp-block-buttons {
	padding-top: clamp(2rem, 1.5rem + 1.4vw, 2.75rem) !important;
}

.hab-hero__main > .hab-textlink {
	padding-top: 1.25rem !important;
	padding-bottom: clamp(4rem, 3rem + 3.5vw, 6.5rem) !important;
}

.hab-hero .hab-hero__aside {
	padding-top: clamp(3.5rem, 2.5rem + 3.5vw, 6rem) !important;
	padding-bottom: clamp(3.5rem, 2.5rem + 3.5vw, 6rem) !important;
}

.hab-page-hero > .hab-kicker + :is(h1, h2) + :is(p, .hab-lead) {
	margin-top: 1.75rem !important;
}

/* ---------- Agenda ---------- */
.hab-agenda-filter {
	margin-top: 0;
}

.hab-days {
	gap: clamp(2rem, 1.5rem + 1.4vw, 3rem);
	margin-top: clamp(2rem, 1.5rem + 1.4vw, 3rem);
}

.hab-event article {
	padding: 1.25rem 1.5rem;
}

.hab-event__body > * + * {
	margin-top: 0.35rem !important;
}

/* ---------- Rodapé ---------- */
.hab-footer__cols .wp-block-column > * + * {
	margin-top: 1rem;
}

.hab-footer__links li + li {
	margin-top: 0.5rem;
}

.hab-footer__bottom {
	margin-top: clamp(3rem, 2.5rem + 2vw, 5rem) !important;
}

.hab-footer__strip {
	padding-block: 0.875rem;
}

@media (max-width: 781px) {
	.hab-event article {
		padding: 1.125rem 1rem;
	}
}

/* Texto longo: subtítulos num passo abaixo dos títulos de secção, com espaços em rem
   (em «em» o espaço crescia com o tamanho do título e ficava enorme). */
.hab-section.hab-prose > h2,
.wp-block-post-content > h2,
.hab-protest__text > h2,
.hab-programme__body > h2 {
	font-size: clamp(1.625rem, 1.25rem + 1.2vw, 2.25rem) !important;
	line-height: 1.1 !important;
}

.hab-section.hab-prose > h3,
.wp-block-post-content > h3,
.hab-protest__text > h3,
.hab-programme__body > h3 {
	font-size: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem) !important;
}

:is(.hab-prose, .wp-block-post-content, .hab-protest__text, .hab-programme__body) > :is(h2, h3) {
	margin-block-start: clamp(2.5rem, 2rem + 1.6vw, 3.5rem) !important;
}

:is(.hab-prose, .wp-block-post-content, .hab-protest__text, .hab-programme__body) > :is(h2, h3):first-child {
	margin-block-start: 0 !important;
}

:is(.hab-prose, .wp-block-post-content, .hab-protest__text, .hab-programme__body) > :is(h2, h3) + * {
	margin-block-start: 0.875rem !important;
}

/* Subsecções dentro de colunas («Quem somos»): espaço de capítulo pequeno antes de cada título. */
.hab-section .wp-block-column > :is(h2, h3):not(:first-child) {
	margin-top: clamp(2.5rem, 2rem + 1.6vw, 3.5rem) !important;
}

.hab-section .wp-block-column > :is(h2, h3) + p {
	margin-top: 0.875rem !important;
}

/* Páginas de leitura (privacidade, notícias, mobilizações): o topo usa a mesma coluna
   centrada de 760px do texto, para título e texto partilharem a mesma margem esquerda
   e a página ter margens iguais dos dois lados. */
:is(.hab-page--privacy, .single) .hab-section.hab-page-hero.is-layout-constrained > :not(.alignfull) {
	width: 100%;
	max-width: var(--wp--style--global--content-size, 760px) !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

/* Filmes: o fotograma de título de cada filme no topo do cartão (16:9, a preto e branco
   como as outras imagens; o símbolo de play nos que abrem no Vimeo). */
.hab-film__poster {
	position: relative;
	margin: 0 0 1.25rem !important;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--hab-paper);
}

.hab-film__poster img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: grayscale(1) contrast(1.05);
}

.hab-film__poster .hab-play {
	width: 3.5rem;
	height: 3.5rem;
	transition: background-color 0.15s ease, transform 0.15s ease;
}

.hab-film:hover .hab-film__poster .hab-play {
	background: var(--hab-yellow);
	transform: scale(1.08);
}

@media (prefers-reduced-motion: reduce) {
	.hab-film__poster .hab-play {
		transition: none;
	}
}

/* O título do filme está escrito no meio do fotograma: o play vai para o canto. */
.hab-film__poster .hab-play {
	inset: auto 0.75rem 0.75rem auto;
	margin: 0;
	width: 2.75rem;
	height: 2.75rem;
	border-width: 2px;
}

.hab-film__poster .hab-play::before {
	border-width: 0.55rem 0 0.55rem 0.9rem;
}

/* ---------- 3.8: grelhas dos filmes e das causas, imagens dos cartões, janela do filme ---------- */

/* Colunas fixas. O WordPress calcula a largura de cada coluna com o espaço «M» (spacing 40),
   mas o tema separa as colunas com mais espaço (ver «Grelhas»): a última coluna não cabia e
   descia para a linha seguinte (filmes em 2 colunas, causas em 1).
   Filmes: 4 colunas em computador, 2 em tablet, 1 no telemóvel. */
.wp-block-group.hab-films__grid {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 1079px) {
	.wp-block-group.hab-films__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 599px) {
	.wp-block-group.hab-films__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Causas: uma por baixo da outra, cada uma a toda a largura da coluna. Cada cartão é
   horizontal: fotografia (com a legenda) à esquerda, texto à direita. No telemóvel a
   fotografia volta a ficar por cima do texto. */
.wp-block-group.hab-causes-grid {
	grid-template-columns: minmax(0, 1fr);
}

.hab-cause__body {
	display: flex;
	flex-direction: column;
}

@media (min-width: 782px) {
	.hab-cause {
		display: grid;
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		column-gap: clamp(2rem, 1rem + 2.5vw, 4rem);
	}

	.hab-cause > .hab-cause__photo,
	.hab-cause > .hab-cause__body {
		margin: 0;
	}

	/* No texto comprido (página «A crise») a fotografia acompanha a leitura. */
	.hab-cause > .hab-cause__photo {
		position: sticky;
		top: 6.5rem;
		align-self: start;
	}

	.hab-cause > .hab-cause__body {
		grid-column: 2;
	}
}

/* Todos os cartões de filme encostam o fotograma às margens, com ou sem play
   (o filme de 2026, que abre no site do coletivo, ficava recolhido). */
.hab-film {
	padding: 0;
}

/* Na mesma linha, os botões ficam todos à mesma altura, no fundo do cartão, por mais
   curto ou comprido que seja o texto de cada um. */
.hab-film > .wp-block-buttons,
.hab-cause__body > .wp-block-buttons {
	margin-top: auto !important;
	padding-top: 1.5rem;
}

/* O fotograma é um link (para o filme): ocupa a moldura toda. */
.hab-film__media {
	display: block;
	height: 100%;
	color: inherit;
}

/* Fotografia da causa: a moldura corta a imagem quando ela se aproxima (a legenda fica fora). */
.hab-cause__img {
	display: block;
	overflow: hidden;
	background: var(--hab-paper);
}

/* Imagens dos cartões: a preto e branco; com o rato em cima do cartão (ou o foco do teclado
   dentro dele) ganham cor e aproximam-se devagar. Em ecrãs de toque ficam a preto e branco. */
:is(.hab-film__poster, .hab-cause__img, .hab-news__thumb, .hab-post-card__thumb) {
	overflow: hidden;
}

:is(.hab-film__poster, .hab-cause__img, .hab-news__thumb, .hab-post-card__thumb) img {
	transform-origin: 50% 50%;
	transition: filter 0.6s ease, transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}

@media (hover: hover) {
	:is(.hab-film, .hab-cause, .hab-news__item, .hab-post-card):hover :is(.hab-film__poster, .hab-cause__img, .hab-news__thumb, .hab-post-card__thumb) img {
		filter: none;
		transform: scale(1.06);
	}
}

:is(.hab-film, .hab-cause, .hab-news__item, .hab-post-card):focus-within :is(.hab-film__poster, .hab-cause__img, .hab-news__thumb, .hab-post-card__thumb) img {
	filter: none;
	transform: scale(1.06);
}

/* Sem animações: a cor muda na mesma, sem aproximação. */
@media (prefers-reduced-motion: reduce) {
	:is(.hab-film__poster, .hab-cause__img, .hab-news__thumb, .hab-post-card__thumb) img {
		transition: filter 0.2s ease;
		transform: none !important;
	}
}

/* Janela do filme: o leitor do Vimeo a 16:9, sobre a página escurecida. O <dialog> ocupa o
   ecrã todo (transparente): carregar fora do vídeo fecha a janela. */
.hab-video {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	height: 100%;
	max-height: none;
	margin: 0;
	padding: clamp(1rem, 3vw, 2.5rem);
	border: 0;
	background: transparent;
	color: var(--hab-base);
}

.hab-video[open] {
	display: grid;
	place-items: center;
	animation: hab-video-in 0.25s ease-out;
}

.hab-video::backdrop {
	background: rgb(21 23 24 / 0.97);
	animation: hab-video-fade 0.25s ease-out;
}

html:has(.hab-video[open]) {
	overflow: hidden;
}

/* Tão largo quanto possível, sem passar a altura do ecrã (a barra do título fica por cima). */
.hab-video__box {
	width: min(100%, 75rem, calc((100dvh - 2 * clamp(1rem, 3vw, 2.5rem) - 4.5rem) * 16 / 9));
}

.hab-video__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 0.75rem;
}

.hab-video__title {
	margin: 0;
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.3;
}

.hab-video__close {
	display: inline-flex;
	flex: none;
	align-items: center;
	gap: 0.5rem;
	min-height: 2.75rem;
	padding: 0.5rem 1rem;
	border: 2px solid var(--hab-base);
	border-radius: 0;
	background: transparent;
	color: var(--hab-base);
	font: inherit;
	font-size: 0.9375rem;
	font-weight: 700;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.hab-video__close:hover {
	background: var(--hab-base);
	color: var(--hab-ink);
}

.hab-video__close:focus-visible {
	box-shadow: none;
}

.hab-video__frame {
	position: relative;
	aspect-ratio: 16 / 9;
	background: #000;
}

.hab-video__frame iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

@keyframes hab-video-in {
	from {
		opacity: 0;
		transform: scale(0.97);
	}
}

@keyframes hab-video-fade {
	from {
		opacity: 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.hab-video[open],
	.hab-video::backdrop {
		animation: none;
	}

	.hab-video__close {
		transition: none;
	}
}

/* Página inicial: as 4 últimas notícias da rua e os 4 filmes em duas colunas (2 × 2);
   uma só coluna no telemóvel. A lista completa dos filmes («A crise») fica em 4 colunas. */
.hab-news-home .hab-news__list,
.hab-page--home .wp-block-group.hab-films__grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 599px) {
	.hab-news-home .hab-news__list,
	.hab-page--home .wp-block-group.hab-films__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ---------- «O que exigimos»: objeções e estudos em acordeão ---------- */
/* Linhas finas (1px) em vez da moldura de 3px com barra de 8px; o botão é tinta sobre o
   cinzento, sem vermelho; a linha toda abre e fecha. A altura anima e só fica uma caixa
   aberta de cada vez (assets/js/theme.js); sem JavaScript, são <details> normais. */
.hab-objection.wp-block-details {
	box-sizing: border-box;
	margin: var(--wp--preset--spacing--40) 0 0;
	padding: 0;
	border: 1px solid rgb(21 23 24 / 0.2);
	background: var(--hab-paper);
}

/* As duas caixas de cada proposta formam um só grupo, separadas por uma linha. */
.hab-objection.wp-block-details + .hab-objection.wp-block-details {
	margin-top: -1px !important;
}

.hab-objection.wp-block-details > summary,
.hab-objection.wp-block-details[open] > summary {
	display: block;
	margin: 0;
	padding: 1.125rem 4.25rem 1.125rem 1.5rem;
	font-size: 1rem !important;
	font-weight: 700;
	line-height: 1.4;
	color: var(--hab-ink);
	transition: background-color 0.2s ease;
}

/* Só com rato: num ecrã de toque, o toque deixava o realce preso. */
@media (hover: hover) {
	.hab-objection.wp-block-details > summary:hover {
		background-color: rgb(21 23 24 / 0.04);
	}

	.hab-objection.wp-block-details > summary:hover::after {
		background-color: var(--hab-ink);
	}

	.hab-objection.wp-block-details > summary:hover::before {
		background-color: var(--hab-base);
	}
}

.hab-objection.wp-block-details > summary:focus-visible {
	outline-offset: -3px;
	box-shadow: none;
}

/* O botão: um quadrado de linha fina (::after) com o «+» da MingCute (os dois traços do
   add_line, ::before) que, ao abrir, perde o traço vertical e fica «−». Ganha tinta com o
   rato ou o foco. */
.hab-objection.wp-block-details > summary::after,
.hab-objection.wp-block-details[open] > summary::after {
	content: "";
	right: 1.5rem;
	width: 1.75rem;
	height: 1.75rem;
	margin-top: -0.875rem;
	border: 1px solid var(--hab-ink);
	background: transparent;
	transition: background-color 0.2s ease;
}

.hab-objection.wp-block-details > summary::before {
	content: "";
	position: absolute;
	top: 50%;
	right: 1.5rem;
	z-index: 1;
	width: 1.75rem;
	height: 1.75rem;
	margin-top: -0.875rem;
	background: var(--hab-ink);
	-webkit-mask: var(--hab-i-bar-h) center / 1rem 1rem no-repeat, var(--hab-i-bar-v) center / 1rem 1rem no-repeat;
	mask: var(--hab-i-bar-h) center / 1rem 1rem no-repeat, var(--hab-i-bar-v) center / 1rem 1rem no-repeat;
	transition: background-color 0.2s ease, -webkit-mask-size 0.4s cubic-bezier(0.22, 1, 0.36, 1), mask-size 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.hab-objection.wp-block-details[open] > summary::before {
	-webkit-mask-size: 1rem 1rem, 1rem 0;
	mask-size: 1rem 1rem, 1rem 0;
}

.hab-objection.wp-block-details > summary:focus-visible::after {
	background-color: var(--hab-ink);
}

.hab-objection.wp-block-details > summary:focus-visible::before {
	background-color: var(--hab-base);
}

/* O conteúdo leva o espaço que antes era da caixa. */
.hab-objection.wp-block-details > :not(summary) {
	margin: 0 !important;
	padding: 0.25rem 1.5rem 1.5rem;
}

.hab-evidence-box.wp-block-details > .hab-evidence {
	padding-left: 2.75rem;
}

.hab-objection.wp-block-details .hab-objection__body > h3:first-child {
	margin-top: 0;
}

@media (prefers-reduced-motion: reduce) {
	.hab-objection.wp-block-details > summary,
	.hab-objection.wp-block-details > summary::after,
	.hab-objection.wp-block-details > summary::before {
		transition: none;
	}
}

/* A fechar (a caixa ainda está aberta enquanto a altura anima): o «−» volta logo a «+». */
.hab-objection.wp-block-details.is-closing[open] > summary::before {
	-webkit-mask-size: 1rem 1rem, 1rem 1rem;
	mask-size: 1rem 1rem, 1rem 1rem;
}

/* ==========================================================================
   Página de uma notícia (templates/single.html, inc/article.php)
   O título no fundo claro, num peso de leitura; por baixo, a linha da notícia (data ·
   organização · vídeo). Nos ecrãs largos, a imagem à esquerda, inteira e presa ao topo
   enquanto se lê, e o texto à direita numa medida de leitura. No telemóvel: título,
   imagem, texto. No fim, «Mais notícias» num capítulo cinza claro.
   ========================================================================== */

.hab-article {
	--hab-hairline: 1px solid rgb(21 23 24 / 0.14);
	padding-top: clamp(1.25rem, 0.75rem + 2vw, 2.75rem);
	padding-bottom: clamp(4rem, 3rem + 4vw, 7rem);
}

.hab-article .hab-article__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	grid-template-areas:
		"back"
		"title"
		"meta"
		"media"
		"body";
	align-items: start;
	max-width: 40rem;
	margin-inline: auto !important;
}

.hab-article .hab-article__grid > * {
	margin: 0 !important;
}

/* Voltar às notícias. */
.hab-article .hab-article__grid > .hab-article__back {
	grid-area: back;
	margin-bottom: clamp(1.25rem, 0.75rem + 1.5vw, 2.25rem) !important;
}

.hab-article__back a,
.hab-article-more__all {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	min-height: 2.75rem;
	font-weight: 600;
	text-decoration: none;
	transition: color 0.2s ease;
}

.hab-article__back a {
	font-size: 0.9375rem;
	color: var(--wp--preset--color--muted);
}

.hab-article__back a:hover {
	color: var(--hab-ink);
}

.hab-article__arrow {
	flex: none;
	transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}

.hab-article__back a:hover .hab-article__arrow {
	transform: translateX(-3px);
}

.hab-article-more__all:hover .hab-article__arrow {
	transform: translateX(3px);
}

/* O título: o mesmo tipo dos outros títulos, mas no peso e no tamanho de uma página de leitura. */
.hab-article .hab-article__grid > .hab-article__title {
	grid-area: title;
	font-size: clamp(1.75rem, 1.25rem + 1.9vw, 2.75rem) !important;
	font-weight: 700 !important;
	line-height: 1.12 !important;
	letter-spacing: -0.02em !important;
	text-wrap: balance;
	overflow-wrap: break-word;
}

/* A linha da notícia. */
.hab-article .hab-article__grid > .hab-article__meta {
	grid-area: meta;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.25rem 0.55rem;
	margin-top: 1rem !important;
	font-size: 0.9375rem;
	line-height: 1.5;
	color: var(--wp--preset--color--muted);
}

.hab-article__meta a {
	color: var(--hab-ink);
	font-weight: 600;
	text-decoration: underline;
	text-decoration-color: transparent;
	text-underline-offset: 0.25em;
	transition: text-decoration-color 0.2s ease;
}

.hab-article__meta a:hover {
	text-decoration-color: currentColor;
}

.hab-article__sep {
	color: var(--wp--preset--color--on-azulejo-soft);
}

/* A imagem, o vídeo ou o carrossel. */
.hab-article .hab-article__grid > .hab-featured {
	grid-area: media;
	margin-top: clamp(1.75rem, 1.25rem + 1.5vw, 2.5rem) !important;
}

.single-post .hab-featured.hab-is-video {
	background: none;
}

.single-post .hab-video-link {
	background: var(--hab-paper);
}

.single-post .hab-video-caption {
	padding: 0.875rem 0 0;
	border: 0;
	background: none;
	text-align: left;
	font-weight: 600;
}

.single-post .hab-video-caption a {
	color: var(--hab-ink);
	text-underline-offset: 0.25em;
}

.single-post .hab-video-link:hover .hab-play,
.single-post .hab-video-link:focus-visible .hab-play {
	background: var(--hab-yellow);
}

/* O texto, numa medida de leitura. */
.hab-article .hab-article__grid > .hab-article__body {
	grid-area: body;
	margin-top: clamp(1.75rem, 1.25rem + 1.5vw, 2.5rem) !important;
	padding-top: clamp(1.75rem, 1.25rem + 1.5vw, 2.5rem);
	border-top: var(--hab-hairline);
}

.hab-article .hab-article__body > * {
	margin-block: 0;
}

.hab-article .hab-article__body > * + * {
	margin-block-start: 1.1em;
}

.hab-article .hab-article__body > p {
	font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem);
	line-height: 1.65;
	color: var(--hab-ink);
}

.hab-article__body a {
	color: var(--hab-ink);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.22em;
	transition: text-decoration-color 0.2s ease;
}

.hab-article__body a:hover {
	text-decoration-color: var(--hab-yellow);
	text-decoration-thickness: 2px;
}

/* «Fonte»: uma linha discreta no fim, separada por um fio. */
.hab-article .hab-article__body > .hab-note {
	max-width: none;
	margin-block-start: clamp(2rem, 1.5rem + 1.5vw, 2.75rem);
	padding: 1.25rem 0 0;
	border: 0;
	border-top: var(--hab-hairline);
	background: none;
	font-size: 0.9375rem;
	line-height: 1.5;
	color: var(--wp--preset--color--muted);
}

.hab-article .hab-article__body > .hab-note a {
	font-weight: 600;
}

/* Telemóvel e tablet: a imagem fica entre a linha da notícia e o texto, sem o fio. */
@media (max-width: 959px) {
	.hab-article .hab-article__grid > .hab-featured + .hab-article__body {
		padding-top: 0;
		border-top: 0;
	}
}

/* Ecrãs largos: imagem à esquerda (na sua proporção), título e texto à direita. */
@media (min-width: 960px) {
	.hab-article .hab-article__grid:has(> .hab-featured) {
		max-width: none;
		grid-template-columns: auto minmax(0, 40rem);
		grid-template-rows: auto auto auto 1fr;
		grid-template-areas:
			"back back"
			"media title"
			"media meta"
			"media body";
		column-gap: clamp(3rem, 0.5rem + 4.5vw, 6rem);
		justify-content: center;
	}

	.hab-article .hab-article__grid:has(> .hab-featured) > .hab-featured {
		position: sticky;
		top: 6.5rem;
		width: min(34rem, calc((100svh - 9rem) * var(--hab-ratio, 0.8)));
		margin-top: 0 !important;
	}
}

/* Mais notícias. */
.hab-article-more {
	padding-top: clamp(3.5rem, 2.5rem + 3vw, 5.5rem);
	padding-bottom: clamp(4rem, 3rem + 3.5vw, 6rem);
}

.hab-article-more__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem 2rem;
}

.hab-article-more .hab-article-more__title {
	margin: 0;
	font-size: clamp(1.625rem, 1.25rem + 1.2vw, 2.25rem) !important;
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -0.02em;
}

.hab-article-more__all {
	color: var(--hab-ink);
}

.hab-article-more .hab-news {
	margin-top: clamp(1.75rem, 1.25rem + 1.5vw, 2.5rem) !important;
}

.hab-article-more .hab-news__list {
	margin-top: 0;
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 700px) {
	.hab-article-more .hab-news__list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (prefers-reduced-motion: reduce) {
	.hab-article__arrow {
		transition: none;
	}

	.hab-article__back a:hover .hab-article__arrow,
	.hab-article-more__all:hover .hab-article__arrow {
		transform: none;
	}
}

/* ==========================================================================
   Ícones: MingCute (https://www.mingcute.com/), versão gratuita, licença Apache 2.0
   (assets/icons/LICENSE-MingCute.txt). Em SVG no HTML (inc/icons.php, assets/js/theme.js)
   ou, onde o ícone é desenhado pelo CSS, como máscara (--hab-i-*), na cor do texto.
   ========================================================================== */
:root {
	--hab-i-arrow-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' fill-rule='nonzero' d='m14.707 5.636 5.657 5.657a1 1 0 0 1 0 1.414l-5.657 5.657a1 1 0 0 1-1.414-1.414l3.95-3.95H4a1 1 0 1 1 0-2h13.243l-3.95-3.95a1 1 0 1 1 1.414-1.414Z'/%3E%3C/svg%3E");
	--hab-i-arrow-up-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' fill-rule='nonzero' d='M18 5a1 1 0 0 1 1 1v8a1 1 0 1 1-2 0V8.414l-9.95 9.95a1 1 0 0 1-1.414-1.414L15.586 7H10a1 1 0 1 1 0-2h8Z'/%3E%3C/svg%3E");
	--hab-i-play: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M5.669 4.76a1.469 1.469 0 0 1 2.04-1.177c1.062.454 3.442 1.533 6.462 3.276 3.021 1.744 5.146 3.267 6.069 3.958.788.591.79 1.763.001 2.356-.914.687-3.013 2.19-6.07 3.956-3.06 1.766-5.412 2.832-6.464 3.28-.906.387-1.92-.2-2.038-1.177-.138-1.142-.396-3.735-.396-7.237 0-3.5.257-6.092.396-7.235'/%3E%3C/svg%3E");
	--hab-i-bar-h: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' fill-rule='nonzero' d='M4 11h16a1 1 0 0 1 0 2H4a1 1 0 0 1 0-2z'/%3E%3C/svg%3E");
	--hab-i-bar-v: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' fill-rule='nonzero' d='M11 4a1 1 0 0 1 2 0v16a1 1 0 0 1-2 0z'/%3E%3C/svg%3E");
}

/* Ícones em SVG: na cor do texto; sem tamanho no HTML, medem o mesmo que a letra. */
.hab-icon {
	display: inline-block;
	flex: none;
}

.hab-icon:not([width]) {
	width: 1.15em;
	height: 1.15em;
	vertical-align: -0.2em;
}

/* A seta ↗ dos links para outros sites: um pouco mais pequena, colada à última palavra. O
   afastamento é uma margem (um espaço ficava sublinhado com o link). */
.hab-icon--arrow-right-up-line:not([width]) {
	width: 0.95em;
	height: 0.95em;
	vertical-align: -0.1em;
}

.hab-icon--after {
	margin-left: 0.2em;
}

/* Nos botões e na paginação, o espaço é o gap do flex. */
:is(.wp-block-button__link, .hab-pager__link) > .hab-icon--after {
	margin-left: 0;
}

.hab-icon--heart:not([width]) {
	width: 1em;
	height: 1em;
	vertical-align: -0.125em;
}

/* Botões com ícone (inc/icons.php): ícone e texto alinhados ao centro. */
.wp-block-button__link:has(> .hab-icon) {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
}

.wp-block-button__link > .hab-icon:not([width]) {
	width: 1.2em;
	height: 1.2em;
	vertical-align: 0;
}

/* Paginação das notícias e da imprensa: seta e texto alinhados. */
.hab-pager__link:has(> .hab-icon) {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
}

/* «Ver o filme»: o ▶ escrito dá lugar ao ícone play. */
.hab-film__play .wp-block-button__link::before {
	content: none;
}

/* Listas com setas: a seta da MingCute em vez do «→». */
ul.is-style-checks > li::before {
	content: "";
	top: 0.22em;
	width: 1.15em;
	height: 1.15em;
	background-color: currentColor;
	-webkit-mask: var(--hab-i-arrow-right) center / contain no-repeat;
	mask: var(--hab-i-arrow-right) center / contain no-repeat;
}

/* Organizações e aliados (links para os sites deles): a seta ↗ da MingCute. */
.hab-org h3 a::after,
.hab-ally h3 a::before {
	content: "";
	display: inline-block;
	width: 0.95em;
	height: 0.95em;
	vertical-align: -0.1em;
	background-color: currentColor;
	-webkit-mask: var(--hab-i-arrow-up-right) center / contain no-repeat;
	mask: var(--hab-i-arrow-up-right) center / contain no-repeat;
}

.hab-org h3 a::after {
	margin-left: 0.25em;
}

.hab-ally h3 a::before {
	margin-right: 0.3em;
}

/* Filtros (agenda, notícias): a seta para baixo da MingCute. */
.hab-agenda-filter__select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23151718' fill-rule='evenodd' d='M12.707 15.707a1 1 0 0 1-1.414 0L5.636 10.05A1 1 0 1 1 7.05 8.636l4.95 4.95 4.95-4.95a1 1 0 0 1 1.414 1.414l-5.657 5.657Z'/%3E%3C/svg%3E");
	background-size: 1.25rem;
}

/* Play sobre as imagens dos vídeos (notícias, filmes): o ícone play em vez do triângulo. */
.hab-play::before {
	content: "";
	top: 50%;
	left: 52%;
	width: 46%;
	height: 46%;
	border: 0;
	background-color: var(--hab-base);
	-webkit-mask: var(--hab-i-play) center / contain no-repeat;
	mask: var(--hab-i-play) center / contain no-repeat;
	transform: translate(-50%, -50%);
}

/* Perguntas que abrem e fecham (Participa, Organiza-te…): o «+»/«−» com os traços da
   MingCute (::before) dentro da mesma caixa (::after). */
.wp-block-details summary::after,
.wp-block-details[open] summary::after {
	content: "";
}

.wp-block-details:not(.hab-objection) summary::before {
	content: "";
	position: absolute;
	top: 50%;
	right: 0;
	z-index: 1;
	width: 1.75rem;
	height: 1.75rem;
	margin-top: -0.875rem;
	background-color: var(--hab-ink);
	-webkit-mask: var(--hab-i-bar-h) center / 0.875rem 0.875rem no-repeat, var(--hab-i-bar-v) center / 0.875rem 0.875rem no-repeat;
	mask: var(--hab-i-bar-h) center / 0.875rem 0.875rem no-repeat, var(--hab-i-bar-v) center / 0.875rem 0.875rem no-repeat;
	transition: -webkit-mask-size 0.3s ease, mask-size 0.3s ease;
}

.wp-block-details:not(.hab-objection)[open] summary::before {
	background-color: var(--hab-yellow);
	-webkit-mask-size: 0.875rem 0.875rem, 0.875rem 0;
	mask-size: 0.875rem 0.875rem, 0.875rem 0;
}

/* Detalhes da mobilização: cada rótulo com o seu ícone. */
.hab-facts dt {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-details summary::before {
		transition: none;
	}
}

/* =========================================================================
   Página «Participa»: um capítulo de cor da paleta por secção. Topo preto → passos no
   claro → «Duas organizações» no vermelho → diretório no cinzento claro, em cartões
   claros → dúvidas no claro, com o acordeão de «O que exigimos» (inc/cartaz.php).
   ========================================================================= */

/* ---------- Passos: o título e a caixa preta ficam presos enquanto os passos passam ---------- */
@media (min-width: 782px) {
	.hab-participate__cols > .wp-block-column:first-child {
		position: sticky;
		top: 7.5rem;
		align-self: flex-start;
	}
}

.hab-goal.hab-goal {
	margin-top: var(--hab-gap-head) !important;
	padding: clamp(1.75rem, 1.25rem + 1.6vw, 2.75rem);
	background: var(--hab-ink);
	color: var(--hab-base);
}

.hab-goal .hab-goal__big {
	margin: 0 !important;
	font-size: clamp(1.875rem, 1.3rem + 1.6vw, 2.75rem);
	line-height: 1.02;
	letter-spacing: -0.025em;
	text-transform: none;
	text-wrap: balance;
	color: var(--hab-yellow);
}

.hab-goal > p:not(.hab-goal__big) {
	max-width: 34ch;
	margin-top: 1.25rem !important;
	font-size: 1.0625rem;
	line-height: 1.55;
}

.hab-goal .wp-block-buttons {
	margin-top: 2rem !important;
}

.hab-steps {
	display: grid;
	gap: clamp(2rem, 1.5rem + 1.4vw, 3rem);
}

.hab-steps > .hab-step {
	column-gap: clamp(1.25rem, 1rem + 0.8vw, 1.75rem);
	margin: 0 !important;
	padding-block: 0;
}

.hab-step h3 {
	font-size: clamp(1.25rem, 1.1rem + 0.45vw, 1.5rem);
	line-height: 1.2;
	letter-spacing: -0.015em;
	text-wrap: balance;
}

.hab-step h3 + p {
	margin-top: 0.5rem !important;
	font-size: 1.0625rem;
	line-height: 1.6;
}

/* ---------- «Duas organizações»: capítulo vermelho (era um azul que não existe no site) ---------- */
.hab-affiliation.has-background {
	background-color: var(--hab-yellow) !important;
	color: var(--hab-ink) !important;
}

.hab-affiliation .hab-kicker::before {
	background: currentColor;
}

.hab-affiliation .hab-cards {
	grid-template-columns: minmax(0, 1fr) !important;
	gap: clamp(1rem, 0.75rem + 1vw, 1.5rem) !important;
}

.hab-affiliation .hab-card {
	padding: clamp(1.75rem, 1.25rem + 1.6vw, 2.75rem);
	background: var(--hab-base);
	color: var(--hab-ink);
}

.hab-affiliation .hab-card h3 {
	margin: 0 !important;
	font-size: clamp(1.5rem, 1.2rem + 0.9vw, 2rem);
	line-height: 1.1;
	letter-spacing: -0.02em;
}

.hab-affiliation .hab-card p {
	max-width: 46ch;
	margin-top: 1rem !important;
	font-size: 1.0625rem;
	line-height: 1.6;
}

@media (min-width: 782px) {
	.hab-affiliation .hab-cards {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

/* ---------- Diretório: cinzento claro, cada organização num cartão claro ---------- */
.hab-section.hab-directory {
	background-color: var(--hab-paper);
}

.hab-directory > .hab-note {
	background: var(--hab-base);
	font-size: 0.9375rem;
}

.hab-directory > p:not(.hab-note) {
	max-width: 62ch;
}

.hab-section.hab-directory > h2 {
	margin-top: clamp(4rem, 3rem + 3vw, 6.5rem) !important;
}

.hab-section.hab-directory > .hab-note + h2 {
	margin-top: clamp(3rem, 2.5rem + 1.5vw, 4rem) !important;
}

/* Colunas explícitas: o cálculo da grelha do WordPress usa um intervalo mais pequeno do que
   o do tema e perdia uma coluna (as duas associações de inquilinos ficavam uma por linha). */
.hab-directory .hab-allies,
.hab-directory .hab-cards {
	grid-template-columns: minmax(0, 1fr) !important;
	gap: clamp(1rem, 0.75rem + 1vw, 1.5rem) !important;
}

@media (min-width: 600px) {
	.hab-directory .hab-allies,
	.hab-directory .hab-cards {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

/* (Os três cartões de «Informação e apoio públicos» seguem a regra geral: 1 ou 3 colunas.) */
@media (min-width: 1024px) {
	.hab-directory #movimentos + .hab-allies {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}

.hab-directory .hab-ally,
.hab-directory .hab-org {
	background: var(--hab-base);
	transition: background-color 0.2s ease;
}

.hab-directory .hab-ally > :not(.hab-ally__mark) {
	padding-inline: clamp(1.25rem, 1rem + 0.6vw, 1.75rem);
}

.hab-directory .hab-ally__mark {
	height: 9.5rem;
	border-bottom: 0;
}

.hab-directory .hab-ally h3 {
	margin-top: 1.25rem !important;
	font-size: 1.1875rem;
}

.hab-directory .hab-ally .hab-org__url {
	padding-bottom: 1.5rem;
}

.hab-directory .hab-org {
	display: flex;
	flex-direction: column;
	padding: clamp(1.25rem, 1rem + 0.6vw, 1.75rem);
}

.hab-directory .hab-org h3 {
	margin: 0 !important;
	font-size: 1.1875rem;
	line-height: 1.25;
}

.hab-directory .hab-org h3 + p {
	margin-top: 0.5rem !important;
	font-size: 0.9375rem;
	line-height: 1.55;
}

/* Endereços no tipo do texto, não em monoespaçado; empurrados para o fundo do cartão. */
.hab-directory .hab-org__url {
	margin-top: auto !important;
	padding-top: 0.75rem;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--hab-blue-deep);
	word-break: normal;
	overflow-wrap: anywhere;
}

@media (hover: hover) {
	.hab-directory .hab-ally:hover,
	.hab-directory .hab-org:hover {
		background: #fff;
	}
}

/* Página inicial, «Quem se mobiliza pela habitação»: os mesmos cartões do diretório da
   Participa. O capítulo anterior («causas») já é cinzento claro, por isso aqui o fundo fica
   claro e os cartões levam o cinzento (o mesmo degrau de tom, ao contrário). No telemóvel
   mantém-se o mural compacto em 2 colunas (regras de max-width: 599px, mais acima). */
.hab-allies-section .hab-ally {
	background: var(--hab-paper);
}

.hab-allies-section .hab-ally__mark {
	border-bottom: 0;
}

@media (min-width: 600px) {
	.hab-allies-section .hab-allies {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: clamp(1rem, 0.75rem + 1vw, 1.5rem) !important;
	}

	.hab-allies-section .hab-ally > :not(.hab-ally__mark) {
		padding-inline: clamp(1.25rem, 1rem + 0.6vw, 1.75rem);
	}

	.hab-allies-section .hab-ally__mark {
		height: 9.5rem;
	}

	.hab-allies-section .hab-ally h3 {
		margin: 1.25rem 0 1.5rem !important;
		font-size: 1.1875rem;
	}
}

@media (min-width: 782px) {
	.hab-allies-section .hab-allies {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}

/* Acampadas: uma grelha de ladrilhos claros, cidade à esquerda, «Instagram» à direita. */
.hab-directory .hab-camps {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.75rem;
}

.hab-directory .hab-camps a {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 0.75rem;
	box-sizing: border-box;
	min-height: 3.5rem;
	padding: 1rem 1.25rem;
	border: 0;
	background: var(--hab-base);
	transition: background-color 0.2s ease, color 0.2s ease;
}

.hab-directory .hab-camps a:hover,
.hab-directory .hab-camps a:focus-visible {
	background: var(--hab-ink);
	color: var(--hab-base);
}

.hab-directory .hab-camps a:is(:hover, :focus-visible) .hab-muted {
	color: var(--wp--preset--color--on-azulejo-soft);
}

@media (min-width: 782px) {
	.hab-directory .hab-camps {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

/* Telemóvel: duas colunas estreitas; «Instagram» passa para baixo do nome da cidade. */
@media (max-width: 599px) {
	.hab-directory .hab-camps a {
		flex-direction: column;
		justify-content: center;
		gap: 0.125rem;
	}
}

/* ---------- Dúvidas: o acordeão de «O que exigimos», pergunta a pergunta ---------- */
.hab-faq .hab-objection.wp-block-details:last-child {
	border-bottom: 1px solid rgb(21 23 24 / 0.2);
}

.hab-faq .hab-objection.wp-block-details > summary,
.hab-faq .hab-objection.wp-block-details[open] > summary {
	padding-block: 1.25rem;
	font-size: clamp(1rem, 0.95rem + 0.25vw, 1.125rem) !important;
	line-height: 1.4;
}

.hab-faq .hab-objection.wp-block-details > p {
	max-width: 62ch;
	font-size: 1.0625rem;
	line-height: 1.6;
}

/* Computador: o título à esquerda, preso, e as perguntas à direita, na coluna de 1280px. */
@media (min-width: 1024px) {
	.hab-section.hab-faq {
		display: grid;
		grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
		column-gap: clamp(3rem, 1rem + 5vw, 7rem);
		align-items: start;
		/* Mesmo alinhamento das outras secções: margem da página + o que sobra além dos 1280px
		   (a percentagem é a largura do conteúdo do pai, que já tirou as margens da página). */
		padding-inline: calc(var(--wp--style--root--padding-left) + max(0px, (100% - 1280px) / 2)) !important;
	}

	.hab-section.hab-faq > * {
		grid-column: 2;
		max-width: none !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.hab-section.hab-faq > h2 {
		position: sticky;
		top: 7.5rem;
		grid-column: 1;
		grid-row: 1 / span 40;
		margin-top: 0 !important;
	}

	/* O id vence a regra geral «título → conteúdo» (que daria 40–64px por cima). */
	.hab-faq #duvidas + .hab-faq__item {
		margin-top: 0 !important;
	}
}

/* ---------- Herói: três botões numa linha ---------- */
/* «A crise em números» era um link de texto por baixo dos botões e passou a ser o terceiro
   botão (contorno, como «O que exigimos»). O espaço até à faixa do artigo 65.º, que era do
   link, passa para os botões. Em computador ficam os três numa linha; quando não cabem
   (até 1279px, conforme a língua; tablet; telemóvel), cada botão estica até encher a sua
   linha, para não ficar um sozinho e curto na linha de baixo. */
.hab-hero__main > .wp-block-buttons {
	gap: 0.75rem;
	padding-bottom: clamp(4rem, 3rem + 3.5vw, 6.5rem) !important;
}

@media (max-width: 1279px) {
	.hab-hero__main > .wp-block-buttons > .wp-block-button {
		flex: 1 1 auto;
	}

	.hab-hero__main > .wp-block-buttons > .wp-block-button > .wp-block-button__link {
		width: 100%;
		justify-content: center;
		text-align: center;
	}
}

/* ---------- 3.9.6: logótipo no cabeçalho e no rodapé (inc/cartaz.php troca o nome pelo SVG) ---------- */

.hab-header .hab-brand a {
	display: block;
	padding-block: 0;
	line-height: 0;
}

.hab-brand__logo {
	display: block;
	width: auto;
	max-width: none;
	height: 3.25rem;
}

@media (max-width: 600px) {
	.hab-brand__logo {
		height: 2.75rem;
	}
}

/* No rodapé, o mesmo logótipo maior (à altura que o nome em texto tinha). */
.hab-brand--footer a {
	display: inline-block;
	padding-block: 0;
	line-height: 0;
}

.hab-brand--footer .hab-brand__logo {
	height: clamp(4.25rem, 2.5rem + 4vw, 6.5rem);
}

/* ---------- Scroll suave (Lenis, assets/js/smooth-scroll.js), como no site da ASA ---------- */
/* Os estilos que o Lenis pede. O deslizar é dele: o do navegador fica desligado enquanto o
   Lenis corre, senão os dois somavam-se. Parado (menu do telemóvel ou filme abertos), a página
   não se mexe, como já fazem has-modal-open e html:has(.hab-video[open]). */
html.lenis,
html.lenis body {
	height: auto;
}

html.lenis {
	scroll-behavior: auto !important;
}

.lenis.lenis-stopped {
	overflow: clip;
}

.lenis [data-lenis-prevent],
.lenis [data-lenis-prevent-wheel],
.lenis [data-lenis-prevent-touch] {
	overscroll-behavior: contain;
}

/* Um iframe debaixo do rato a meio do deslizar não lhe rouba a roda. */
.lenis.lenis-smooth iframe {
	pointer-events: none;
}

/* O alvo de uma âncora recebe o foco (para o Tab seguir dali), mas não é um controlo: sem contorno. */
.hab-scroll-target:focus {
	outline: none;
}
