/*
Theme Name: Titan
Theme URI: https://example.com/
Author: Luís Peixoto
Description: Tema de blocos leve para o site da Praia do Titan (Matosinhos). Cores, tipos de letra e botões definidos em theme.json.
Version: 0.18.5
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: titan
*/

/* Ficheiro único de CSS. Só o que o theme.json não consegue fazer. */

/* Acessibilidade: foco visível e alvos de toque de 44 px */
:where(a, button, .wp-element-button, .wp-block-navigation-item__content):focus-visible {
	outline: 2px solid var(--wp--preset--color--marinho);
	outline-offset: 3px;
}

.wp-element-button,
.wp-block-navigation-item__content,
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
	min-height: 44px;
	display: inline-flex;
	align-items: center;
}

.wp-element-button {
	justify-content: center;
	min-height: 48px;
}

/* Cabeçalho */
/* Margens laterais: os blocos ficam a toda a largura, as secções levam o seu espaço */
.titan-pad {
	padding-inline: var(--wp--preset--spacing--40);
}

/* Cabeçalho sempre visível. Variáveis por estado (no topo / depois de deslizar) para o X do menu ficar sobre o hambúrguer */
.titan-header {
	--titan-pt: var(--wp--preset--spacing--40);
	--titan-logo-w: var(--titan-logo-cabecalho);
	background: var(--wp--preset--color--creme);
	border-bottom: 1px solid var(--wp--preset--color--linha);
	padding-block: var(--titan-pt) var(--wp--preset--spacing--30);
	padding-inline: var(--wp--preset--spacing--40);
	transition: background-color 0.25s ease;
}

.titan-header.is-scrolled {
	--titan-pt: 0.75rem;
	--titan-logo-w: var(--titan-logo-compacto);
	padding-block-end: 0.75rem;
}

.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 50;
}

.admin-bar .wp-site-blocks > header.wp-block-template-part {
	top: 32px;
}

@media (max-width: 782px) {
	.admin-bar .wp-site-blocks > header.wp-block-template-part {
		top: 46px;
	}
}

/* Rodapé */
.titan-footer {
	background-color: var(--wp--preset--color--marinho-profundo);
	color: var(--wp--preset--color--creme);
	padding-block: var(--wp--preset--spacing--50) calc(var(--wp--preset--spacing--50) + 3rem);
	padding-inline: var(--wp--preset--spacing--40);
	text-align: center;
}

.titan-footer a {
	color: var(--wp--preset--color--creme);
}

.titan-footer .titan-secundario {
	color: var(--wp--preset--color--claro-secundario);
	font-size: var(--wp--preset--font-size--pequeno);
}

.titan-footer .wp-block-button__link {
	background: transparent;
	border: 1px solid var(--wp--preset--color--creme);
	color: var(--wp--preset--color--creme);
}

/* Linhas finas entre itens (destaques da Home) */
.titan-linhas > * + * {
	border-top: 1px solid var(--wp--preset--color--linha);
	padding-top: var(--wp--preset--spacing--30);
}

/* Etiqueta pequena por cima dos títulos de secção */
.titan-kicker {
	color: var(--wp--preset--color--texto-secundario);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.18em;
	margin-bottom: 0;
	text-transform: uppercase;
}

.titan-secundario-texto {
	color: var(--wp--preset--color--texto-secundario);
}

/* Secções da Home */
.titan-secao {
	margin-inline: auto;
	max-width: 64rem;
	padding-block: var(--wp--preset--spacing--50);
	padding-inline: var(--wp--preset--spacing--40);
}

/* Hero: ecrã inteiro, imagem de fundo, lema e dois botões */
.wp-block-cover.titan-hero {
	min-height: 100vh;
	min-height: 100svh;
	padding-block: var(--wp--preset--spacing--50);
	padding-block-end: calc(5rem + env(safe-area-inset-bottom, 0px));
	padding-inline: var(--wp--preset--spacing--40);
}

.titan-hero .wp-block-cover__inner-container {
	max-width: 40rem;
	position: relative;
	width: 100%;
	z-index: 2; /* texto e botões sempre acima da película e do degradê (que só atuam sobre a imagem) */
}

/* Degradê por cima da imagem: legibilidade do logótipo (topo) e dos botões (base), seja qual for a foto */
.wp-block-cover.titan-hero::after {
	background: linear-gradient(to bottom, rgba(11, 34, 51, 0.55) 0%, rgba(11, 34, 51, 0) 24%, rgba(11, 34, 51, 0) 45%, rgba(11, 34, 51, 0.88) 100%);
	content: "";
	display: block;
	font-size: 0;
	inset: 0;
	min-height: 0;
	pointer-events: none;
	position: absolute;
	z-index: 0;
}

.titan-hero,
.titan-hero p {
	color: var(--wp--preset--color--creme);
}

.titan-hero .titan-lema {
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	margin: 0 0 var(--wp--preset--spacing--40);
	text-transform: uppercase;
}

.titan-hero .titan-lema::before {
	background: currentColor;
	content: "";
	display: block;
	height: 1px;
	margin-bottom: var(--wp--preset--spacing--30);
	opacity: 0.7;
	width: 2.5rem;
}

.titan-hero .titan-hero-acoes {
	flex-wrap: nowrap;
	gap: 1rem;
	margin: 0;
}

.titan-hero .titan-hero-acoes .wp-block-button {
	flex: 1 1 0;
}

.titan-hero .titan-hero-acoes .wp-block-button__link {
	border-radius: 0.5rem;
	font-size: 0.8125rem;
	letter-spacing: 0.1em;
	min-height: 3.5rem;
	padding-inline: 0.75rem;
	text-align: center;
	white-space: nowrap;
	width: 100%;
}

.titan-hero .wp-block-button__link {
	background: var(--wp--preset--color--marinho);
	border-color: var(--wp--preset--color--marinho);
	color: var(--wp--preset--color--creme);
}

.titan-hero .is-style-outline .wp-block-button__link {
	background: transparent;
	border-color: rgba(245, 240, 230, 0.7);
	color: var(--wp--preset--color--creme);
}

.titan-hero a:focus-visible {
	outline-color: var(--wp--preset--color--creme);
}

/* Home: o cabeçalho passa por cima do hero (logótipo e menu sobre a imagem) */
.titan-topo-wrap {
	position: relative;
}

.titan-header.titan-header--hero {
	--titan-logo-w: var(--titan-logo-hero);
	align-items: center;
	background: transparent;
	border-bottom: 0;
	color: var(--wp--preset--color--creme);
	display: flex;
	flex-wrap: nowrap;
	inset-block-start: 0;
	inset-inline: 0;
	justify-content: space-between;
	padding-block-end: 0;
	position: fixed;
	z-index: 50;
}

.titan-header.titan-header--hero.is-scrolled {
	--titan-logo-w: var(--titan-logo-compacto);
	background: var(--wp--preset--color--marinho-profundo);
	padding-block-end: 0.75rem;
}

.admin-bar .titan-header.titan-header--hero {
	inset-block-start: 32px;
}

@media (max-width: 782px) {
	.admin-bar .titan-header.titan-header--hero {
		inset-block-start: 46px;
	}
}

.titan-header--hero a:focus-visible,
.titan-header--hero button:focus-visible {
	outline-color: var(--wp--preset--color--creme);
}

/* Logótipo: tamanhos num só sítio, para ajustar depois de ver no telemóvel */
:root {
	--titan-logo-cabecalho: 8rem;
	--titan-logo-hero: 9.5rem;
	--titan-logo-menu: 11rem;
	--titan-logo-compacto: 6.5rem;
}

/* Altura da barra fixa (logo compacto + espaços) */
body {
	--titan-barra-h: calc(1.5rem + var(--titan-logo-compacto) * 0.6463);
}

.titan-logo {
	margin: 0;
}

.titan-logo img {
	display: block;
	height: auto;
	width: var(--titan-logo-hero);
}

.titan-header .titan-logo img {
	transition: width 0.25s ease;
	width: var(--titan-logo-w);
}

/* Texto só para leitores de ecrã (o h1 do hero é o logótipo, em imagem) */
.titan-sr {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	white-space: nowrap;
	width: 1px;
}

/* Espaço reservado para fotos (a substituir no Editor) */
.titan-foto {
	background:
		repeating-linear-gradient(135deg, rgba(245, 240, 230, 0.06) 0 12px, transparent 12px 24px),
		var(--wp--preset--color--marinho);
	min-height: 88px;
}

.titan-foto-rotulo {
	color: var(--wp--preset--color--claro-secundario);
	font-size: 0.6875rem;
	letter-spacing: 0.14em;
	margin: 0;
	padding: var(--wp--preset--spacing--30);
	text-transform: uppercase;
}

/* Destaques da ementa: foto de 88 px, texto e preço */
.titan-prato {
	align-items: flex-start;
	gap: var(--wp--preset--spacing--30);
	margin-block: 0;
}

.titan-prato .titan-foto {
	height: 88px;
	width: 88px;
}

.titan-prato h3 {
	margin: 0;
}

.titan-prato p {
	margin: 0.25rem 0 0;
}

.titan-prato .titan-preco {
	font-family: var(--wp--preset--font-family--forum);
	font-size: var(--wp--preset--font-size--medio);
	font-weight: 400;
	margin-top: 0.5rem;
}

.titan-destaques .titan-prato + .titan-prato {
	border-top: 1px solid var(--wp--preset--color--linha);
	margin-top: var(--wp--preset--spacing--30);
	padding-top: var(--wp--preset--spacing--30);
}

/* O Espaço: grelha de 2 colunas, primeira foto mais alta */
.titan-galeria {
	display: grid;
	gap: 0.5rem;
	grid-template-columns: 1fr 1fr;
}

.titan-galeria .titan-foto {
	min-height: 160px;
}

.titan-galeria .titan-foto:first-child {
	grid-row: span 2;
	min-height: 328px;
}

.titan-galeria .titan-foto:last-child {
	grid-column: 1 / -1;
	min-height: 200px;
}

/* Fotos reais na galeria: preenchem a caixa e cortam pelo centro */
.titan-galeria .titan-foto figure,
.titan-galeria .titan-foto .wp-block-image {
	height: 100%;
	margin: 0;
}

.titan-galeria .titan-foto img {
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

/* Computador: 4 colunas. A primeira foto ocupa 2 por 2 (quadrada), as duas seguintes ficam ao lado e a última por baixo delas (2 por 1) */
@media (min-width: 768px) {
	.titan-galeria {
		gap: 0.75rem;
		grid-template-columns: repeat(4, 1fr);
	}

	.titan-galeria .titan-foto {
		min-height: 0;
	}

	.titan-galeria .titan-foto:nth-child(1) {
		grid-column: 1 / 3;
		grid-row: 1 / 3;
		min-height: 0;
	}

	.titan-galeria .titan-foto:nth-child(2) {
		aspect-ratio: 1 / 1;
		grid-column: 3;
		grid-row: 1;
	}

	.titan-galeria .titan-foto:nth-child(3) {
		aspect-ratio: 1 / 1;
		grid-column: 4;
		grid-row: 1;
	}

	.titan-galeria .titan-foto:last-child {
		aspect-ratio: 2 / 1;
		grid-column: 3 / 5;
		grid-row: 2;
		min-height: 0;
	}
}

/* Normas de funcionamento (shortcode do plugin) */
.titan-normas ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.titan-normas li {
	border-top: 1px solid var(--wp--preset--color--linha);
	padding-block: var(--wp--preset--spacing--30);
}

.titan-normas summary {
	cursor: pointer;
	font-weight: 500;
	min-height: 44px;
	padding-block: 0.75rem;
}

.titan-normas__iva {
	color: var(--wp--preset--color--texto-secundario);
	font-size: var(--wp--preset--font-size--pequeno);
	margin: var(--wp--preset--spacing--30) 0 0;
}

/* Como chegar */
.titan-mapa {
	min-height: 200px;
}

.titan-mapa-embed {
	background:
		repeating-linear-gradient(135deg, rgba(245, 240, 230, 0.06) 0 12px, transparent 12px 24px),
		var(--wp--preset--color--marinho);
	min-height: 18.75rem;
}

.titan-mapa-embed--img {
	background-position: center bottom; /* mantém sempre visível o logótipo do Google em baixo */
	background-size: cover;
}

/* Botão e nota no topo da capa: o pino fica ao centro e a marca do Google em baixo, sem ficarem tapados */
.titan-mapa-embed--img .titan-mapa-embed__capa {
	background: linear-gradient(rgba(11, 34, 51, 0.55), rgba(11, 34, 51, 0) 65%);
	justify-content: flex-start;
}

.titan-mapa-embed--img .titan-mapa-embed__capa p {
	background: rgba(11, 34, 51, 0.88);
	border-radius: 0.25rem;
	padding: 0.5rem 0.75rem;
}

.titan-mapa-embed iframe {
	border: 0;
	display: block;
	height: 18.75rem;
	width: 100%;
}

.titan-mapa-embed__capa {
	align-items: center;
	color: var(--wp--preset--color--creme);
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--30);
	justify-content: center;
	min-height: 18.75rem;
	padding: var(--wp--preset--spacing--40);
	text-align: center;
}

.titan-mapa-embed__capa p {
	font-size: var(--wp--preset--font-size--pequeno);
	margin: 0;
}

.titan-mapa-embed__capa a {
	color: var(--wp--preset--color--creme);
}

.titan-mapa-embed__capa .wp-element-button {
	background: var(--wp--preset--color--creme);
	border-color: var(--wp--preset--color--creme);
	border-radius: 0.5rem;
	color: var(--wp--preset--color--marinho);
	font-size: 0.8125rem;
	letter-spacing: 0.1em;
	min-height: 3.5rem;
	padding-inline: 2rem;
	text-decoration: none;
	text-transform: uppercase;
}

/* Menu hambúrguer: logótipo no topo, itens grandes ao centro, Instagram em baixo */
body .wp-block-navigation__responsive-container.is-menu-open {
	padding: var(--titan-pt, var(--wp--preset--spacing--40)) var(--wp--preset--spacing--40) var(--wp--preset--spacing--40);
}

/* O X fica exatamente sobre o hambúrguer: o site.js mede o botão ao abrir e grava a posição nestas variáveis */
body .has-modal-open .wp-block-navigation__responsive-close {
	margin: 0;
	max-width: none;
}

body .is-menu-open .wp-block-navigation__responsive-container-close {
	align-items: center;
	display: flex;
	height: var(--titan-x-h, 44px);
	justify-content: center;
	min-height: 0;
	min-width: 0;
	padding: 0;
	position: fixed;
	right: var(--titan-x-right, var(--wp--preset--spacing--40));
	top: var(--titan-x-top, var(--titan-pt, 1.5rem));
	width: var(--titan-x-w, 44px);
	z-index: 2;
}

/* Fecha com suavidade, como abre */
body .wp-block-navigation__responsive-container.is-menu-open.is-closing {
	animation: titan-menu-sair 0.2s ease-in forwards;
}

@keyframes titan-menu-sair {
	from {
		opacity: 1;
	}

	to {
		opacity: 0;
	}
}

/* Logótipo: fixo no ecrã, centrado, no topo */
body .is-menu-open .wp-block-navigation__responsive-dialog::before {
	aspect-ratio: 526 / 340;
	background: url("assets/img/titan-logo-escuro.svg") no-repeat center / contain;
	content: "";
	left: 50%;
	position: fixed;
	top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--wp--preset--spacing--40));
	transform: translateX(-50%);
	width: var(--titan-logo-menu);
	z-index: 1;
}

/* Itens: centrados no ecrã, entre o logótipo e o Instagram (posição fixa, independente da estrutura do WordPress) */
html body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	align-items: center !important;
	box-sizing: border-box;
	display: flex !important;
	flex-direction: column !important;
	inset: 0 !important;
	justify-content: center !important;
	overflow-y: auto;
	padding: calc(var(--titan-logo-menu) * 0.6463 + 4rem) var(--wp--preset--spacing--40) 9rem !important;
	position: fixed !important;
}

html body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	align-items: center !important;
	flex: none;
	gap: var(--wp--preset--spacing--40);
	margin: 0;
	padding: 0;
	text-align: center;
	width: auto;
}

html body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .titan-nav-instagram {
	align-items: center;
	bottom: calc(2rem + env(safe-area-inset-bottom, 0px));
	justify-content: center;
	left: 0;
	margin: 0;
	position: fixed;
	right: 0;
}

/* Seletor de língua: PT EN FR ES, em letras, por cima do Instagram (posição fixa) */
html body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .titan-nav-lingua {
	align-items: center;
	bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px));
	justify-content: center;
	margin: 0;
	position: fixed;
	width: 3.25rem;
}

html body .is-menu-open .titan-nav-lingua--pt {
	left: calc(50% - 6.5rem);
}

html body .is-menu-open .titan-nav-lingua--en {
	left: calc(50% - 3.25rem);
}

html body .is-menu-open .titan-nav-lingua--fr {
	left: 50%;
}

html body .is-menu-open .titan-nav-lingua--es {
	left: calc(50% + 3.25rem);
}

body .is-menu-open .titan-nav-lingua .wp-block-navigation-item__content {
	color: var(--wp--preset--color--claro-secundario);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.5rem;
	font-size: 0.8125rem;
	letter-spacing: 0.18em;
	min-height: 2.75rem;
	padding-block: 0;
	padding-inline: 0 0;
	width: 100%;
}

/* Língua atual: a da ementa em que estamos (PT na Home e nas restantes páginas) */
body:not(.titan-vista-en):not(.titan-vista-fr):not(.titan-vista-es) .is-menu-open .titan-nav-lingua--pt .wp-block-navigation-item__content,
body.titan-vista-en .is-menu-open .titan-nav-lingua--en .wp-block-navigation-item__content,
body.titan-vista-fr .is-menu-open .titan-nav-lingua--fr .wp-block-navigation-item__content,
body.titan-vista-es .is-menu-open .titan-nav-lingua--es .wp-block-navigation-item__content {
	color: var(--wp--preset--color--creme);
	text-decoration: underline;
}

body .is-menu-open .wp-block-navigation-item__content {
	align-items: center;
	display: inline-flex;
	font-family: var(--wp--preset--font-family--jost);
	font-size: 0.875rem;
	font-weight: 500;
	justify-content: center;
	letter-spacing: 0.2em;
	line-height: 1.2;
	padding-block: 0.5rem;
	text-decoration: none;
	text-transform: uppercase;
}

body .is-menu-open .titan-nav-instagram .wp-block-navigation-item__content {
	align-items: center;
	display: inline-flex;
	font-family: var(--wp--preset--font-family--jost);
	font-size: 0.8125rem;
	font-weight: 500;
	gap: 0.75rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.is-menu-open .titan-nav-instagram .wp-block-navigation-item__content::before {
	background: currentColor;
	content: "";
	flex: none;
	height: 1.5rem;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.2' cy='6.8' r='.9' fill='black' stroke='none'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.2' cy='6.8' r='.9' fill='black' stroke='none'/%3E%3C/svg%3E") center / contain no-repeat;
	width: 1.5rem;
}

.is-menu-open a:focus-visible,
.is-menu-open button:focus-visible {
	outline-color: var(--wp--preset--color--creme);
}

/* Títulos de secção dentro das páginas (por exemplo, páginas legais) */
.wp-block-post-content h2 {
	font-size: var(--wp--preset--font-size--medio);
	margin-top: var(--wp--preset--spacing--50);
}


.titan-acoes {
	gap: 0.5rem;
}

.titan-acoes .wp-block-button {
	flex: 1 1 calc(50% - 0.5rem);
}

.titan-acoes .wp-block-button:last-child {
	flex-basis: 100%;
}

.titan-acoes .wp-block-button__link {
	letter-spacing: 0.1em;
	width: 100%;
}

.titan-horario {
	border-top: 1px solid var(--wp--preset--color--linha);
	gap: 0.25rem 1rem;
	margin-block: 0;
	padding-block: var(--wp--preset--spacing--30);
}

.titan-horario p {
	margin: 0;
}

/* Horários (shortcode do plugin): lista de definição com linhas finas */
.titan-horarios dl {
	margin: 0;
}

.titan-horarios .titan-horario {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.titan-horarios dt,
.titan-horarios dd {
	margin: 0;
}

.titan-horarios dd {
	text-align: end;
}

.titan-horarios a {
	align-items: center;
	display: inline-flex;
	min-height: 44px;
}

.titan-horarios__epoca {
	font-weight: 500;
	margin: var(--wp--preset--spacing--30) 0 0;
}

.titan-horarios__nota {
	color: var(--wp--preset--color--texto-secundario);
	font-size: var(--wp--preset--font-size--pequeno);
	margin: 0.5rem 0 0;
}

/* 404 */
.titan-404 {
	padding-block: var(--wp--preset--spacing--60);
	padding-inline: var(--wp--preset--spacing--40);
	text-align: center;
}

/* Impressão: sem cabeçalho nem rodapé (a ementa traz a sua própria folha de estilos na Fase 3) */
@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

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

/* Botão para voltar ao topo */
.titan-topo-btn {
	align-items: center;
	background: var(--wp--preset--color--marinho);
	border: 1px solid var(--wp--preset--color--creme);
	border-radius: 0.5rem;
	bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
	color: var(--wp--preset--color--creme);
	display: flex;
	height: 3rem;
	justify-content: center;
	opacity: 0;
	position: fixed;
	right: 1rem;
	transition: opacity 0.25s ease, visibility 0.25s;
	visibility: hidden;
	width: 3rem;
	z-index: 40;
}

.titan-topo-btn.is-visible {
	opacity: 1;
	visibility: visible;
}

.titan-topo-btn svg {
	fill: none;
	height: 1.5rem;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.6;
	width: 1.5rem;
}

@media print {
	.titan-topo-btn,
	.titan-header,
	.titan-footer {
		display: none;
	}
}

/* Aviso do dia: faixa no topo absoluto da página, acima do logo. Sai com o scroll. */
.titan-aviso {
	background: var(--wp--preset--color--aviso);
	border-bottom: 1px solid var(--wp--preset--color--linha);
	box-sizing: border-box;
	color: var(--wp--preset--color--texto-secundario);
	font-size: 0.6875rem;
	letter-spacing: 0.06em;
	line-height: 1.4;
	padding: 0.375rem var(--wp--preset--spacing--40);
	position: relative;
	text-align: center;
	z-index: 60;
}

.titan-aviso p {
	margin: 0;
}

.titan-aviso--encerrado {
	background: var(--wp--preset--color--marinho);
	color: var(--wp--preset--color--creme);
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

/* A barra transparente da Home e da ementa é fixa: desce o que a faixa ainda ocupa no ecrã (o site.js atualiza) */
.titan-header.titan-header--hero {
	inset-block-start: var(--titan-aviso-vis, 0px);
}

.admin-bar .titan-header.titan-header--hero {
	inset-block-start: calc(32px + var(--titan-aviso-vis, 0px));
}

@media (max-width: 782px) {
	.admin-bar .titan-header.titan-header--hero {
		inset-block-start: calc(46px + var(--titan-aviso-vis, 0px));
	}
}

/* Avaliações (Tripadvisor e Google): bloco próprio, com linha por cima e dois botões */
.titan-avaliacoes {
	border-top: 1px solid var(--wp--preset--color--linha);
	margin-top: var(--wp--preset--spacing--50);
	padding-top: var(--wp--preset--spacing--40);
}

.titan-avaliacoes h3 {
	margin-top: 0;
}

/* Os dois botões das avaliações ficam lado a lado (o último dos outros blocos ocupa a linha toda) */
.titan-avaliacoes .titan-acoes .wp-block-button:last-child {
	flex-basis: calc(50% - 0.5rem);
}

/* Cinco sentidos: mosaico. Telemóvel: blocos empilhados; desktop: 1 bloco grande e 4 pequenos */
.titan-sentidos {
	display: grid;
	gap: 0.75rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.titan-sentido {
	background-color: var(--wp--preset--color--marinho);
	background-position: center;
	background-size: cover;
	border-radius: 2px;
	color: var(--wp--preset--color--creme);
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	justify-content: flex-end;
	min-height: 9.5rem;
	overflow: hidden;
	padding: 1.25rem;
	position: relative;
}

/* Degradê para garantir a leitura do texto sobre qualquer foto */
/* Ordem das camadas: foto (0), degradê (1), texto (2) */
.titan-sentido-img {
	height: 100%;
	inset: 0;
	margin: 0;
	max-width: none;
	object-fit: cover;
	object-position: center;
	position: absolute;
	width: 100%;
	z-index: 0;
}

/* Enquadramento de cada foto (o corte é sempre ao centro; aqui puxa-se para o motivo) */
.titan-sentido--ver .titan-sentido-img {
	object-position: 22% 45%; /* o sol, à esquerda */
}

.titan-sentido--cheirar .titan-sentido-img {
	object-position: 35% 50%; /* o prato */
}

.titan-sentido--foto::before {
	background: linear-gradient(to top, rgba(11, 34, 51, 0.82), rgba(11, 34, 51, 0.1) 70%);
	content: "";
	inset: 0;
	position: absolute;
	z-index: 1;
}

.titan-sentido > span {
	position: relative;
	z-index: 2;
}

.titan-sentido-nome {
	color: var(--wp--preset--color--claro-secundario);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.titan-sentido-texto {
	font-family: var(--wp--preset--font-family--forum);
	font-size: 1.3rem;
	line-height: 1.25;
}

@media (min-width: 48em) {
	.titan-sentidos {
		grid-template-columns: repeat(4, 1fr);
		grid-template-rows: repeat(2, 14rem);
	}

	.titan-sentido--ver {
		grid-column: span 2;
		grid-row: span 2;
	}

	.titan-sentido--ver .titan-sentido-texto {
		font-size: 1.75rem;
	}
}

/* Hero: o <picture> do hero rotativo não cria caixa própria (a imagem continua a preencher a capa) */
.titan-hero picture {
	display: contents;
}
