/*
Theme Name: Lunari Circus
Theme URI: https://lunaricircus.com.br
Author: Lunari Circus
Description: Tema próprio (clássico, em PHP) para a bilheteria online do Lunari Circus — venda de ingressos com WooCommerce. Construído do zero para máxima clareza na compra.
Version: 0.7.1
Requires at least: 6.0
Tested up to: 6.5
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: lunari-circus
*/

/* ============================================================
   1. VARIÁVEIS — Paleta de cores e tipografia
   ============================================================

   Paleta AZUL-MEIA-NOITE / DOURADO, tirada do logo do Lunari Circus:
   lua crescente e lona douradas sobre céu noturno estrelado.

   O tema nasceu como fork do Circo de Roma, cuja paleta era vermelho
   romano + dourado — o dourado ficou (serve aos dois), o vermelho saiu.
   Os nomes de variável ainda dizem "roxo" por herança de uma paleta
   ainda mais antiga; o VALOR é que manda, não o nome.
   ============================================================ */
:root {
	/* --- Marca: azul + dourado do logo ---
	   Tokens do handoff de repaginação (02/09/2026). O tema herdou do
	   Circo de Roma uma camada escura ("Noite de Estreia"); aqui o
	   visual é CLARO, sóbrio e legível. */
	--lun-azul:          #0F1B3D; /* header, footer, títulos, botão primário */
	--lun-azul-2:        #16254F; /* hover do azul */
	--lun-dourado:       #C8981A; /* CTA "Comprar ingressos", supras, badge */
	--lun-dourado-claro: #FFDE8A; /* texto dourado SOBRE azul */

	/* --- Fundos --- */
	--lun-fundo:       #F6F4EE; /* base. NÃO usar #FFF: o cliente achou
	                               branco puro cansativo */
	--lun-fundo-2:     #ECEAE3; /* seções alternadas, cabeçalho interno */
	--lun-aviso-fundo: #FBF1D6; /* caixas de aviso do Infantil */

	/* --- Texto e linhas --- */
	--lun-texto:       #14192B;
	--lun-texto-suave: #5B627A;
	--lun-linha:       rgba(15, 27, 61, .16);
	--lun-sucesso:     #2E7D4F; /* status "pago" */
	--lun-erro:        #B23B3B;
	--lun-branco:      #FFFFFF; /* só inputs, opção selecionada e texto
	                               sobre azul/dourado */

	/* --- Medidas do layout ---
	   O .container da seção 4 consome estas duas. Elas existiam no
	   :root antigo e sumiram quando a paleta foi trocada — sem elas,
	   `max-width: var(--container-max)` e `padding-inline: var(--gap)`
	   viram valores inválidos e TODO o conteúdo cola na borda
	   esquerda da tela. Nenhuma das duas tem fallback no uso, então
	   apagá-las quebra o site inteiro em silêncio. 1140px é a largura
	   que o handoff especifica. */
	--container-max: 1140px;
	--gap:           1.5rem; /* 24px — o padding lateral do handoff */

	/* --- Raio e sombras ---
	   2px em tudo (o badge Premium mantém pill). SEM glow dourado:
	   as três sombras abaixo são as únicas do projeto. */
	--raio:              2px;
	--lun-sombra-btn:    0 10px 24px rgba(15, 27, 61, .25);
	--lun-sombra-cartaz: 0 24px 60px rgba(15, 27, 61, .18);
	--lun-sombra-mapa:   0 18px 44px rgba(15, 27, 61, .15);

	/* --- Tipografia ---
	   EB Garamond nos títulos (peso padrão 500, NUNCA 900) e
	   Source Sans 3 no corpo/interface. Carregadas em functions.php. */
	--fonte-titulo: 'EB Garamond', Georgia, serif;
	--fonte-corpo:  'Source Sans 3', system-ui, -apple-system, sans-serif;

	--trans: .18s ease;

	/* --- COMPATIBILIDADE ---
	   Nomes antigos que ainda aparecem nas seções 2–11 e nos templates.
	   Apontam para os tokens novos para não quebrar nada enquanto a
	   repaginação não reescreve cada regra. */
	--lun-roxo:             var(--lun-azul);
	--lun-roxo-escuro:      var(--lun-azul);
	--lun-roxo-profundo:    var(--lun-azul);
	--lun-dourado-hover:    var(--lun-dourado);
	--lun-creme:            var(--lun-fundo);
	--lun-borda:            var(--lun-linha);
	--lun-fundo-base:       var(--lun-fundo);
	--lun-fundo-secao:      var(--lun-fundo-2);
	--lun-footer-bg:        var(--lun-azul);
	--lun-texto-claro:      var(--lun-branco);
	--lun-texto-suave-esc:  rgba(255, 255, 255, .75);
	--lun-borda-ouro:       var(--lun-linha);
	--lun-borda-ouro-fraca: var(--lun-linha);
	--lun-tinta-escura:     var(--lun-azul);
	--lun-card-grad:        var(--lun-fundo);
	--lun-header-grad:      var(--lun-azul);
	--lun-cta-grad:         var(--lun-dourado);
	--lun-cta-glow:         none;
	--lun-cta-glow-hover:   none;
}

/* ============================================================
   1b. OVERRIDE DAS VARIÁVEIS DO WOOCOMMERCE
   ============================================================
   O WooCommerce define --wc-primary em :root (especificidade 0-1-0).
   Se usarmos :root aqui, o CSS do WooCommerce (que carrega por último)
   ganha o empate de especificidade e o botão volta a ser roxo.
   Solução: declarar em `body` (especificidade 0-0-1). Embora `body` seja
   menos específico que :root, como elemento ele é FILHO do html/:root —
   então qualquer elemento dentro de body herda PRIMEIRO o valor de body
   (vizinho mais próximo), sobrepondo o valor herdado de :root.
   ============================================================ */
body {
	--woocommerce:      var(--lun-dourado);    /* cor de destaque WC → dourado */
	--wc-primary:       var(--lun-dourado);    /* botões primários WC → dourado */
	--wc-primary-text:  var(--lun-roxo-profundo); /* texto sobre botão primário */
	--wc-highlight:     var(--lun-roxo);       /* links e destaques WC → vermelho */
}

/* ============================================================
   2. RESET E BASE
   ============================================================ */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

html {
	height: 100%;
}

body {
	margin: 0;
	font-family: var(--fonte-corpo);
	font-size: 1rem;
	line-height: 1.6;
	color: var(--lun-texto);
	background-color: var(--lun-creme);

	/* Sticky footer: o body ocupa a altura total da janela como coluna flex.
	   O <main class="site-content"> cresce (flex: 1) e empurra o footer
	   para o fundo — mesmo quando o conteúdo é curto. */
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

/* O <main> cresce para preencher o espaço disponível entre header e footer */
.site-content {
	flex: 1;
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: var(--lun-roxo);
	text-decoration: none;
	transition: color var(--trans);
}
a:hover {
	color: var(--lun-roxo-escuro);
}

/* ============================================================
   3. TIPOGRAFIA
   ============================================================

   Hierarquia de fontes:
     h1, h2, h3  → Playfair Display (display/título) — peso visual alto
     h4, h5, h6  → Lato (corpo) — para subtítulos e labels menores
     body, p, li → Lato (herança do body)
   ============================================================ */

/* Títulos principais — Playfair Display */
h1, h2, h3 {
	font-family: var(--fonte-titulo);
	font-weight: 700;
	line-height: 1.25;
	color: var(--lun-roxo-profundo);
	margin-top: 0;
}

/* Subtítulos — Lato (mesmo peso visual do corpo, mas maior) */
h4, h5, h6 {
	font-family: var(--fonte-corpo);
	font-weight: 700;
	line-height: 1.3;
	color: var(--lun-roxo-profundo);
	margin-top: 0;
}

/* ============================================================
   4. CONTAINER / LAYOUT
   ============================================================

   CONCEITO: usamos uma div.container dentro de cada seção para
   limitar a largura do conteúdo ao centro e adicionar padding
   lateral nas telas menores. */
.container {
	width: 100%;
	max-width: var(--container-max);
	margin-inline: auto;
	padding-inline: var(--gap);
}

/* Páginas comuns do tema (ex.: "Sobre", "Contato") renderizadas por page.php.
   O .container já centraliza e dá padding lateral; aqui só damos respiro
   vertical para o conteúdo não colar no header/footer. */
.pagina-conteudo {
	padding-block: 3rem 4rem;
}

/* ============================================================
   5. ACESSIBILIDADE
   ============================================================ */

/* Link "pular para o conteúdo" — invisível até receber foco
   (Tab). Essencial para usuários de teclado e leitores de tela. */
.skip-link {
	position: absolute;
	top: -100%;
	left: 1rem;
	padding: 0.5rem 1rem;
	background: var(--lun-dourado);
	color: var(--lun-roxo-profundo);
	font-weight: 700;
	border-radius: var(--raio);
	z-index: 9999;
}
.skip-link:focus {
	top: 1rem;
}

/* ============================================================
   6. BOTÕES
   ============================================================ */
.btn {
	display: inline-block;
	padding: 0.65rem 1.5rem;
	border-radius: var(--raio);
	font-family: var(--fonte-corpo);
	font-size: 0.95rem;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	border: none;
	text-align: center;
	text-decoration: none;
	transition: background-color var(--trans), color var(--trans), transform var(--trans);
}

/* Botão principal: dourado com texto roxo escuro */
.btn-primario {
	background-color: var(--lun-dourado);
	color: var(--lun-roxo-profundo);
}
.btn-primario:hover {
	background-color: var(--lun-dourado-hover);
	color: var(--lun-roxo-profundo);
	transform: translateY(-1px);
}

/* ============================================================
   7. HEADER
   ============================================================ */
.site-header {
	background-color: var(--lun-roxo-escuro);
	position: sticky; /* fica fixo no topo ao rolar a página */
	top: 0;
	z-index: 100;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.site-header .container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	padding-left: 0;        /* logo rente à borda esquerda */
	position: relative;
}

/* --- Logo --- */
.site-logo {
	display: flex;
	align-items: center;
	text-decoration: none;
	flex-shrink: 0;
}
.site-header .logo-img {
	/* Seletor .site-header .logo-img (especificidade 0-2-0) bate o
	   .woocommerce img do WooCommerce (0-1-1) que forçava width:100%
	   e height:auto, tornando a logo enorme nas páginas de produto. */
	height: 72px;   /* altura fixa; largura escala proporcionalmente */
	width: auto;
	max-width: none; /* cancela o max-width:100% do reset do WC */
	display: block;
}

/* --- Nav desktop --- */
.site-nav {
	display: flex;
	align-items: center;
	gap: 0.25rem;
}

/* O WordPress gera um <ul> para o menu; zeramos o estilo de lista. */
.site-menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 0.1rem;
}
.site-menu a {
	display: block;
	padding: 0.4rem 0.8rem;
	color: rgba(255, 255, 255, 0.85);
	font-size: 0.9rem;
	border-radius: var(--raio);
	transition: color var(--trans), background-color var(--trans);
}
.site-menu a:hover,
.site-menu .current-menu-item > a {
	color: var(--lun-dourado);
	background-color: rgba(255, 255, 255, 0.07);
}

/* --- Grupo direito: ícone carrinho + CTA + hambúrguer --- */
.header-direita {
	display: flex;
	align-items: center;
	gap: 0.25rem;
	flex-shrink: 0;
}

/* --- Botão CTA no header (desktop) --- */
.header-cta {
	flex-shrink: 0;
}

/* --- Ícone de carrinho --- */
.lun-cart-link {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.4rem;
	height: 2.4rem;
	color: rgba(255, 255, 255, 0.85);
	text-decoration: none;
	border-radius: var(--raio);
	flex-shrink: 0;
	transition: color var(--trans), background-color var(--trans);
}
.lun-cart-link:hover {
	color: var(--lun-dourado);
	background-color: rgba(255, 255, 255, 0.08);
}
.lun-cart-link svg {
	width: 1.25rem;
	height: 1.25rem;
	display: block;
	flex-shrink: 0;
}

/* Bolinha com o número de itens */
.lun-cart-count {
	position: absolute;
	top: 0.1rem;
	right: 0.05rem;
	min-width: 1.1rem;
	height: 1.1rem;
	padding: 0 0.22rem;
	border-radius: 999px;
	background-color: var(--lun-dourado);
	color: var(--lun-roxo-profundo);
	font-size: 0.6rem;
	font-weight: 700;
	line-height: 1.1rem;
	text-align: center;
	font-family: var(--fonte-corpo);
	pointer-events: none;
	/* Aparece suave quando o contador muda */
	transition: transform 0.15s ease, opacity 0.15s ease;
}
/* Oculto quando o carrinho está vazio */
.lun-cart-count--zero {
	opacity: 0;
	transform: scale(0.5);
	pointer-events: none;
}

/* --- Botão hambúrguer (mobile) --- */
.menu-toggle {
	display: none; /* escondido no desktop */
	background: none;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: var(--raio);
	padding: 0.35rem 0.65rem;
	cursor: pointer;
	color: white;
	font-size: 1.25rem;
	line-height: 1;
	transition: border-color var(--trans);
}
.menu-toggle:hover {
	border-color: var(--lun-dourado);
	color: var(--lun-dourado);
}

/* --- Mobile: comportamento do menu --- */
@media (max-width: 768px) {
	.menu-toggle {
		display: block;
	}
	.header-cta {
		display: none; /* CTA some da barra; aparece dentro do menu */
	}
	.site-nav {
		/* Menu "dropdown" saindo abaixo do header */
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background-color: var(--lun-roxo-profundo);
		flex-direction: column;
		align-items: stretch;
		padding: 1rem var(--gap);
		gap: 0.25rem;
		display: none; /* JS adiciona .is-aberto para mostrar */
		box-shadow: 0 6px 16px rgba(0, 0, 0, 0.35);
	}
	.site-nav.is-aberto {
		display: flex;
	}
	.site-menu {
		flex-direction: column;
		width: 100%;
	}
	.site-menu a {
		padding: 0.75rem 1rem;
		font-size: 1rem;
	}
	/* CTA visível dentro do menu mobile */
	.nav-cta-mobile {
		display: block;
		margin-top: 0.75rem;
		text-align: center;
	}
}

@media (min-width: 769px) {
	.nav-cta-mobile {
		display: none; /* só aparece no mobile */
	}
}

/* ============================================================
   8. FOOTER
   ============================================================ */
.site-footer {
	background-color: var(--lun-roxo-profundo);
	color: rgba(255, 255, 255, 0.8);
	padding-top: 3rem;
}

/* Grid de 3 colunas no desktop, 1 coluna no mobile */
.footer-grid {
	display: grid;
	grid-template-columns: 1.2fr 1fr 1fr;
	gap: 2rem;
	padding-bottom: 2.5rem;
}
@media (max-width: 768px) {
	.footer-grid {
		grid-template-columns: 1fr;
	}
}

/* Títulos das colunas do footer */
.footer-titulo {
	font-family: var(--fonte-corpo);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--lun-dourado);
	margin: 0 0 0.85rem;
}

/* Coluna 1 — Marca */
.footer-logo-nome {
	font-family: var(--fonte-titulo);
	font-size: 1.4rem;
	color: var(--lun-dourado);
	display: block;
	margin-bottom: 0.5rem;
	text-decoration: none;
}
.footer-descricao {
	font-size: 0.88rem;
	line-height: 1.65;
	color: rgba(255, 255, 255, 0.6);
	margin: 0;
}

/* Coluna 2 — Localização */
.footer-endereco p {
	margin: 0 0 0.2rem;
	font-size: 0.9rem;
}
.footer-maps-link {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	margin-top: 0.85rem;
	color: var(--lun-dourado);
	font-size: 0.88rem;
	font-weight: 700;
	transition: color var(--trans);
}
.footer-maps-link:hover {
	color: var(--lun-dourado-hover);
}

/* Coluna 3 — Redes Sociais */
.footer-social {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
}
.footer-social a {
	color: rgba(255, 255, 255, 0.75);
	font-size: 0.9rem;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	transition: color var(--trans);
	text-decoration: none;
}
.footer-social a:hover {
	color: var(--lun-dourado);
}

/* Linha inferior do footer */
.footer-bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	padding: 1.25rem 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0.75rem;
	font-size: 0.8rem;
	color: rgba(255, 255, 255, 0.4);
}
.footer-bottom p {
	margin: 0;
}
.footer-bottom a {
	color: rgba(255, 255, 255, 0.4);
	transition: color var(--trans);
}
.footer-bottom a:hover {
	color: rgba(255, 255, 255, 0.75);
}

/* ============================================================
   9. HOME PAGE — SEÇÕES
   ============================================================ */

/* --- Hero: imagem (cartaz) --- */
.hero-visual {
	width: 100%;
	height: 65vh;        /* 65% da altura da tela — grande mas não ocupa tudo */
	min-height: 320px;   /* piso mínimo em telas pequenas */
	position: relative;
	overflow: hidden;
	line-height: 0;
}

.hero-img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;          /* preenche sem distorcer — corta bordas se precisar */
	object-position: center 68%; /* enquadra o miolo do cartaz */
}

/* Gradiente no rodapé da imagem para transição suave com a faixa abaixo. */
.hero-visual-fade {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 20%;
	background: linear-gradient( to top, var(--lun-roxo-escuro) 0%, transparent 100% );
}

/* --- Hero: faixa de chamada para ação --- */
.hero-strip {
	background-color: var(--lun-roxo-escuro);
	padding: 2rem 0 2.5rem;
}

.hero-strip-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
}

@media (max-width: 768px) {
	.hero-strip-inner {
		flex-direction: column;
		align-items: flex-start;
	}
}

.hero-strip-texto {
	flex: 1;
}

.hero-supra {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--lun-dourado);
	margin: 0 0 0.5rem;
}

.hero-titulo {
	font-family: var(--fonte-titulo);
	font-size: clamp(1.6rem, 3vw, 2.4rem);
	font-weight: 700;
	color: white;
	margin: 0 0 0.5rem;
	line-height: 1.2;
}

.hero-descricao {
	font-size: 1rem;
	color: rgba(255, 255, 255, 0.75);
	margin: 0;
}

.hero-cta {
	flex-shrink: 0;
}

.btn-grande {
	padding: 0.9rem 2.25rem;
	font-size: 1.05rem;
}

/* --- Layout genérico das seções --- */
.secao-sessoes,
.secao-local {
	padding: 4.5rem 0;
}

.secao-setores {
	padding: 4.5rem 0;
	background-color: var(--lun-roxo-escuro);
}

.secao-titulo {
	font-size: clamp(1.5rem, 3vw, 2rem);
	text-align: center;
	margin-bottom: 0.5rem;
}

.secao-titulo--claro {
	color: white;
}

.secao-subtitulo {
	text-align: center;
	color: var(--lun-texto-suave);
	margin: 0 auto 2.75rem;
	max-width: 520px;
}

.secao-subtitulo--claro {
	color: rgba(255, 255, 255, 0.65);
}

/* --- Cards de sessões --- */
.sessoes-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 1.25rem;
}

/* Card — estilo "bilhete de ingresso" */
.sessao-card {
	background: white;
	border-radius: var(--raio);
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.09);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: transform var(--trans), box-shadow var(--trans);
}
.sessao-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 10px 28px rgba(0, 0, 0, 0.15);
}

/* Cabeçalho do card: data em destaque com fundo vermelho */
.sessao-data-header {
	background-color: var(--lun-roxo-escuro);
	color: white;
	text-align: center;
	padding: 1.1rem 1rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.1rem;
}
.sessao-dia-semana {
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--lun-dourado);
}
.sessao-numero-dia {
	font-family: var(--fonte-titulo);
	font-size: 2.75rem;
	font-weight: 700;
	line-height: 1;
	color: white;
}
.sessao-mes-ano {
	font-size: 0.7rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.7);
}
/* Fallback quando não há meta de data: mostra nome do produto */
.sessao-nome-fallback {
	font-family: var(--fonte-titulo);
	font-size: 1rem;
	color: white;
	line-height: 1.3;
}

/* Corpo do card */
.sessao-card-body {
	padding: 1.1rem 1.25rem 1.25rem;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
	flex: 1;
}
.sessao-horario {
	font-size: 1rem;
	font-weight: 700;
	color: var(--lun-texto);
	margin: 0;
	display: flex;
	align-items: center;
	gap: 0.4rem;
}
.sessao-preco-label {
	font-size: 0.72rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--lun-texto-suave);
	margin: 0;
}
.sessao-preco {
	font-size: 0.95rem;
	margin: 0;
}
/* WooCommerce injeta <span class="price"> */
.sessao-preco .price,
.sessao-preco .amount {
	color: var(--lun-roxo-escuro);
	font-weight: 700;
}
.sessao-card-body .btn {
	margin-top: auto;
	text-align: center;
}

/* Estado vazio */
.sessoes-vazio {
	text-align: center;
	padding: 3rem;
	color: var(--lun-texto-suave);
	background: white;
	border-radius: var(--raio);
	border: 2px dashed var(--lun-borda);
	grid-column: 1 / -1;
}
.admin-hint {
	font-size: 0.83rem;
	color: var(--lun-texto-suave);
	font-style: italic;
	margin-top: 0.5rem;
}

/* --- Cards de setores --- */
.setores-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.5rem;
	max-width: 760px;
	margin-inline: auto;
}

@media (max-width: 580px) {
	.setores-grid {
		grid-template-columns: 1fr;
	}
}

.setor-card {
	position: relative;
	background: rgba(255, 255, 255, 0.07);
	border: 1px solid rgba(255, 255, 255, 0.15);
	border-radius: var(--raio);
	padding: 2.25rem 1.5rem 1.75rem;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.75rem;
	transition: transform var(--trans);
}

.setor-card:hover {
	transform: translateY(-3px);
}

/* Ouro: borda dourada e fundo levemente diferente */
.setor-card--ouro {
	background: rgba(212, 160, 23, 0.1);
	border-color: var(--lun-dourado);
}

/* Badge "Premium" no topo do card Ouro */
.setor-badge {
	position: absolute;
	top: -0.8rem;
	left: 50%;
	transform: translateX(-50%);
	background: var(--lun-dourado);
	color: var(--lun-roxo-profundo);
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	padding: 0.2rem 0.85rem;
	border-radius: 99px;
	white-space: nowrap;
}

.setor-icone {
	font-size: 2.5rem;
	line-height: 1;
}

.setor-nome {
	font-family: var(--fonte-titulo);
	font-size: 1.3rem;
	color: white;
	margin: 0;
}

.setor-descricao {
	font-size: 0.9rem;
	color: rgba(255, 255, 255, 0.7);
	line-height: 1.6;
	margin: 0;
	flex-grow: 1;
}

/* Botão do setor Prata: contorno branco (sem preenchimento) */
.btn-setor-prata {
	display: inline-block;
	padding: 0.65rem 1.5rem;
	border-radius: var(--raio);
	font-size: 0.95rem;
	font-weight: 700;
	border: 2px solid rgba(255, 255, 255, 0.45);
	color: white;
	background: transparent;
	text-decoration: none;
	transition: border-color var(--trans), background-color var(--trans), color var(--trans);
}

.btn-setor-prata:hover {
	border-color: white;
	background: rgba(255, 255, 255, 0.1);
	color: white;
}

/* --- Seção Localização --- */
.secao-local {
	background-color: var(--lun-creme);
}

.secao-local .secao-titulo {
	text-align: left;
}

.local-cidade {
	font-family: var(--fonte-titulo);
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--lun-roxo-profundo);
	margin: 0.5rem 0 0.35rem;
}

.local-endereco {
	color: var(--lun-texto-suave);
	font-size: 1rem;
	margin: 0 0 1.5rem;
}

/* ============================================================
   PÁGINA DE PRODUTO — SESSÃO DO CIRCO
   ============================================================

   Layout geral:
   [Banner vermelho: nome + data + horário]
   [container.sessao-corpo]
     [aside.sessao-info]    [div.sessao-form-compra]
   ============================================================ */

/* ---- Banner da sessão ---- */
.sessao-banner {
	background-color: var(--lun-roxo-escuro);
	padding: 1.25rem 0 1rem;
	border-bottom: 4px solid var(--lun-dourado);
}

.sessao-banner-titulo {
	font-family: var(--fonte-titulo);
	font-size: clamp(1.6rem, 4vw, 2.4rem);
	color: var(--lun-branco);
	margin: 0 0 1rem;
	line-height: 1.2;
}

.sessao-banner-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	align-items: center;
}

/* Chips de data e hora no banner */
.sessao-banner-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.45rem 1rem;
	border-radius: 2rem;
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.08em;
}

.sessao-banner-chip--data {
	background-color: rgba(255,255,255,0.12);
	color: var(--lun-branco);
	border: 1px solid rgba(255,255,255,0.2);
}

.sessao-banner-chip--hora {
	background-color: var(--lun-dourado);
	color: var(--lun-roxo-profundo);
}

/* ---- Corpo: info + formulário ---- */
.sessao-corpo {
	display: grid;
	grid-template-columns: 1fr 1.6fr; /* info | formulário */
	gap: 2.5rem;
	align-items: start;
	padding-top: 2.5rem;
	padding-bottom: 3rem;
}

/* Quando não há dados de info (nenhum campo de meta preenchido), o PHP
   adiciona a classe --full e o formulário ocupa a largura total. */
.sessao-corpo--full {
	grid-template-columns: 1fr;
	max-width: 44rem; /* limita a largura para o formulário não ficar esticado demais */
}

/* No mobile: empilha o formulário acima das informações */
@media (max-width: 700px) {
	.sessao-corpo {
		grid-template-columns: 1fr;
	}
	.sessao-info {
		order: 2;
	}
	.sessao-form-compra {
		order: 1;
	}
}

/* ---- Card de informações da sessão (coluna esquerda) ---- */
.sessao-info-card {
	background-color: var(--lun-branco);
	border: 1px solid var(--lun-borda);
	border-radius: var(--raio);
	padding: 1.5rem;
}

.sessao-info-titulo {
	font-family: var(--fonte-titulo);
	font-size: 1rem;
	font-weight: 700;
	color: var(--lun-roxo-profundo);
	margin: 0 0 1.2rem;
	padding-bottom: 0.75rem;
	border-bottom: 2px solid var(--lun-borda);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.sessao-info-item {
	display: flex;
	gap: 0.9rem;
	align-items: flex-start;
	margin-bottom: 1.1rem;
}

.sessao-info-icone {
	font-size: 1.2rem;
	flex-shrink: 0;
	margin-top: 0.1rem;
}

.sessao-info-rotulo {
	display: block;
	font-size: 1rem;
	font-weight: 700;
	color: var(--lun-texto);
}

.sessao-info-label {
	display: block;
	font-size: 0.85rem;
	color: var(--lun-texto-suave);
	margin-top: 0.15rem;
}

.sessao-maps-link {
	display: inline-block;
	margin-top: 0.4rem;
	font-size: 0.85rem;
	color: var(--lun-roxo);
	font-weight: 700;
	text-decoration: none;
}

.sessao-maps-link:hover {
	text-decoration: underline;
}

/* ---- Formulário de compra (coluna direita) ---- */
.sessao-form-compra {
	background-color: var(--lun-branco);
	border: 1px solid var(--lun-borda);
	border-radius: var(--raio);
	padding: 2rem;
}

/* ---- Grupos de variação (Setor / Tipo) ---- */
.lun-var-grupo {
	margin-bottom: 2rem;
}

/* Rótulo do grupo: "Setor" ou "Tipo de ingresso" */
.lun-var-label {
	font-family: var(--fonte-titulo);
	font-size: 0.8rem;
	font-weight: 700;
	color: var(--lun-roxo-profundo);
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin: 0 0 0.8rem;
}

/* Container dos botões */
.lun-var-opcoes {
	display: flex;
	flex-wrap: wrap;
	gap: 0.7rem;
}

/* ---- Botão de variação (label estilizado) ---- */
.lun-var-btn {
	position: relative;
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-width: 7rem;
	padding: 0.9rem 1.2rem 0.8rem;
	border: 2px solid var(--lun-borda);
	border-radius: var(--raio);
	background-color: var(--lun-branco);
	cursor: pointer;
	transition: border-color var(--trans), background-color var(--trans), box-shadow var(--trans);
	user-select: none;
	text-align: center;
}

.lun-var-btn:hover {
	border-color: var(--lun-roxo);
}

/* Estado ativo (selecionado) */
.lun-var-btn.is-ativo {
	border-color: var(--lun-roxo);
	background-color: #EEF2F9; /* azul muito claro */
	box-shadow: 0 0 0 3px rgba(27, 58, 107, 0.15);
}

/* Variação Ouro: estilo dourado */
.lun-var-btn--ouro {
	border-color: #C8981A;
}

.lun-var-btn--ouro:hover {
	border-color: var(--lun-dourado-hover);
	background-color: #FFFBF0;
}

.lun-var-btn--ouro.is-ativo {
	border-color: var(--lun-dourado);
	background-color: #FFFBF0;
	box-shadow: 0 0 0 3px rgba(212, 160, 23, 0.25);
}

/* Badge "★ Premium" dentro do botão Ouro */
.lun-var-badge {
	display: block;
	font-size: 0.62rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--lun-dourado-hover);
	margin-bottom: 0.25rem;
}

/* Nome da opção dentro do botão */
.lun-var-nome {
	font-size: 1rem;
	font-weight: 700;
	color: var(--lun-texto);
}

/* Esconde o radio button de verdade — só o label é visível */
.lun-var-radio {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
	pointer-events: none;
}

/* Select oculto — usado pelo WooCommerce JS, não pelo usuário */
.lun-select-oculto {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
	pointer-events: none;
}

/* Wrapper .variations obrigatório para a delegação jQuery do WooCommerce.
   O wc-add-to-cart-variation.js escuta: $form.on('change', '.variations select').
   O select precisa ser descendente de .variations para o evento ser capturado.
   Posicionamos absolute para retirar do fluxo sem sumir do DOM. */
.lun-var-grupo .variations {
	position: absolute;
	overflow: hidden;
	pointer-events: none;
	width: 0;
	height: 0;
}

/* Link "Limpar seleção" */
.lun-reset-link {
	display: inline-block;
	margin-top: 0.5rem;
	font-size: 0.8rem;
	color: var(--lun-texto-suave);
	text-decoration: underline;
}

/* ---- Área de preço dinâmico (WooCommerce injeta aqui) ---- */

/* Caixa que aparece com o preço da variação escolhida */
.single_variation_wrap .woocommerce-variation {
	margin: 1.5rem 0 1rem;
}

.single_variation_wrap .woocommerce-variation-price {
	padding: 1rem 1.2rem;
	background-color: var(--lun-creme);
	border-radius: var(--raio);
	margin-bottom: 1rem;
}

.single_variation_wrap .woocommerce-variation-price .price {
	font-family: var(--fonte-corpo); /* Lato — preços usam a fonte de texto */
	font-size: 1.7rem;
	font-weight: 700;
	color: var(--lun-roxo-profundo);
}

.single_variation_wrap .woocommerce-variation-price .price ins {
	text-decoration: none;
}

/* Preços em qualquer contexto WooCommerce → sempre Lato.
   O body já usa Lato por herança, mas sendo explícito aqui garantimos que
   nenhum reset de plugin quebre a tipografia de preço. */
.woocommerce .price,
.woocommerce-page .price,
.woocommerce .woocommerce-Price-amount,
.woocommerce-page .woocommerce-Price-amount {
	font-family: var(--fonte-corpo);
	font-weight: 700;
}

/* Aviso de disponibilidade de estoque */
.single_variation_wrap .woocommerce-variation-availability .stock {
	font-size: 0.85rem;
	font-weight: 700;
	padding: 0.4rem 0.8rem;
	border-radius: var(--raio);
}

.single_variation_wrap .in-stock {
	color: #166534;
	background-color: #DCFCE7;
}

.single_variation_wrap .out-of-stock {
	color: #991B1B;
	background-color: #FEE2E2;
}

/* ---- Linha de quantidade + botão Comprar ---- */
.woocommerce-variation-add-to-cart {
	display: flex;
	gap: 1rem;
	align-items: center;
	flex-wrap: wrap;
}

/* Input de quantidade */
.woocommerce-variation-add-to-cart .quantity {
	display: flex;
	align-items: center;
}

.woocommerce-variation-add-to-cart input.qty {
	width: 4rem;
	height: 3.2rem;
	text-align: center;
	font-size: 1.1rem;
	font-weight: 700;
	border: 2px solid var(--lun-borda);
	border-radius: var(--raio);
	color: var(--lun-texto);
	background: var(--lun-branco);
	-moz-appearance: textfield; /* Firefox: remove setas */
}

.woocommerce-variation-add-to-cart input.qty::-webkit-outer-spin-button,
.woocommerce-variation-add-to-cart input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none; /* Chrome/Safari: remove setas */
}

/* Botão principal "Comprar"
   O WooCommerce usa ".woocommerce button.button.alt" (especificidade 0-3-1).
   Nosso seletor abaixo tem especificidade 0-3-2 (vence por 1 ponto) e ainda
   usa !important nas cores para eliminar qualquer dúvida sobre a cascata. */
body.woocommerce button.single_add_to_cart_button.button,
body.woocommerce-page button.single_add_to_cart_button.button {
	flex: 1;
	min-width: 10rem;
	padding: 0.9rem 1.5rem;
	background-color: var(--lun-dourado) !important;
	color: var(--lun-roxo-profundo) !important;
	border: none;
	border-radius: var(--raio);
	font-family: var(--fonte-corpo);
	font-size: 1.05rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	cursor: pointer;
	transition: background-color var(--trans), transform var(--trans);
	text-align: center;
	display: block;
}

body.woocommerce button.single_add_to_cart_button.button:hover,
body.woocommerce-page button.single_add_to_cart_button.button:hover {
	background-color: var(--lun-dourado-hover) !important;
	color: var(--lun-roxo-profundo) !important;
	transform: translateY(-1px);
}

body.woocommerce button.single_add_to_cart_button.button:active,
body.woocommerce-page button.single_add_to_cart_button.button:active {
	transform: translateY(0);
}

/* Estado desabilitado — quando nenhuma variação foi selecionada ainda */
body.woocommerce button.single_add_to_cart_button.button.disabled,
body.woocommerce button.single_add_to_cart_button.button:disabled,
body.woocommerce-page button.single_add_to_cart_button.button.disabled,
body.woocommerce-page button.single_add_to_cart_button.button:disabled {
	opacity: 0.45;
	cursor: not-allowed;
	transform: none;
}

/* Aviso de produto esgotado */
.lun-esgotado {
	padding: 1rem 1.2rem;
	background-color: #FEE2E2;
	color: #991B1B;
	border-radius: var(--raio);
	font-weight: 700;
}

/* ---- Aba "Informações adicionais" — atributos do produto ----
   O WooCommerce gera uma <table> com os atributos (Setor, Tipo).
   Estilizamos para combinar com a identidade visual do circo. */

/* Wrapper das abas — espaçamento acima */
.woocommerce-tabs {
	margin-top: 3rem;
}

/* Lista de abas (as "orelhas" clicáveis) */
.woocommerce-tabs .tabs {
	display: flex;
	gap: 0;
	list-style: none;
	margin: 0;
	padding: 0;
	border-bottom: 1px solid var(--lun-borda);
}

/* Cada aba */
.woocommerce-tabs .tabs li {
	margin: 0;
}

.woocommerce-tabs .tabs a {
	display: block;
	padding: 0.65rem 1.4rem;
	background-color: transparent;
	border: none;
	color: var(--lun-texto-suave);
	font-family: var(--fonte-corpo);
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-decoration: none;
	transition: color var(--trans);
	position: relative;
}

.woocommerce-tabs .tabs a:hover {
	color: var(--lun-roxo);
}

/* Aba ativa: indicador vermelho embaixo via pseudo-elemento.
   Evita bordas em U que deixam o visual pesado. */
.woocommerce-tabs .tabs li.active a {
	color: var(--lun-roxo);
}

.woocommerce-tabs .tabs li.active a::after {
	content: '';
	position: absolute;
	bottom: -1px; /* sobrepõe a borda do .tabs para ficar contíguo */
	left: 0;
	right: 0;
	height: 2px;
	background-color: var(--lun-roxo);
}

/* Painel de conteúdo de cada aba */
.woocommerce-tabs .panel {
	padding: 1.75rem;
	background-color: var(--lun-branco);
	border: 1px solid var(--lun-borda);
	border-top: none;
	border-radius: 0 0 var(--raio) var(--raio);
}

/* Título dentro do painel (WooCommerce insere um <h2> com o nome da aba) */
.woocommerce-tabs .panel h2 {
	font-size: 1rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--lun-roxo-escuro);
	margin: 0 0 1.25rem;
	padding-bottom: 0.75rem;
	border-bottom: 1px solid var(--lun-borda);
}

/* Tabela de atributos (Setor: Prata | Ouro; Tipo: Inteira | Meia…) */
.woocommerce-product-attributes {
	width: 100%;
	border-collapse: collapse;
}

.woocommerce-product-attributes th,
.woocommerce-product-attributes td {
	padding: 0.7rem 1rem;
	text-align: left;
	border-bottom: 1px solid var(--lun-borda);
	font-size: 0.95rem;
	vertical-align: top;
}

/* Cabeçalho da linha (nome do atributo: Setor, Tipo) */
.woocommerce-product-attributes th {
	font-family: var(--fonte-corpo);
	font-weight: 700;
	color: var(--lun-roxo-profundo);
	width: 35%;
	background-color: var(--lun-creme);
}

/* Valor do atributo (Prata, Ouro | Inteira, Meia, Infantil) */
.woocommerce-product-attributes td p {
	margin: 0;
	color: var(--lun-texto);
}

/* ---- Aba "Detalhes" customizada ---- */
.lun-tab-detalhes {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
}

.lun-tab-detalhes li {
	display: flex;
	align-items: baseline;
	gap: 0.7rem;
	font-size: 0.95rem;
	color: var(--lun-texto);
}

.lun-td-icone {
	font-size: 1.1rem;
	flex-shrink: 0;
}

.lun-td-texto strong {
	color: var(--lun-roxo-profundo);
}

.lun-td-texto a {
	color: var(--lun-roxo);
	margin-left: 0.5rem;
	font-size: 0.85rem;
}

/* ---- Breadcrumb do WooCommerce ---- */
.woocommerce-breadcrumb {
	font-size: 0.85rem;
	color: var(--lun-texto-suave);
	padding: 1rem 0 0;
}

.woocommerce-breadcrumb a {
	color: var(--lun-roxo);
	text-decoration: none;
}

.woocommerce-breadcrumb a:hover {
	text-decoration: underline;
}

/* ============================================================
   PÁGINAS DE LOJA — WooCommerce sem sidebar
   ============================================================

   O wrapper .wc-pagina é gerado por nosso woocommerce.php.
   A sidebar foi removida via remove_action em functions.php.
   ============================================================ */

/* Espaçamento para todas as páginas WooCommerce.
   O padding-inline aqui (não no .container interno) garante que o conteúdo
   nunca toque as bordas da tela, independente de overrides do WooCommerce. */
.wc-pagina {
	padding: 2rem var(--gap) 4rem;
	min-height: 50vh;
}

/* Cancela o padding-inline do .container direto dentro de .wc-pagina
   para evitar espaçamento duplo (o pai já provê o espaçamento lateral). */
.wc-pagina > .container {
	padding-inline: 0;
}

/* ---- Botões do WooCommerce — override global da cor roxa padrão ----
   O WooCommerce define seus botões como roxo/lilás (#7f54b3) via:
     .woocommerce a.button.alt  (especificidade 0-2-0)
     .woocommerce button.button.alt (especificidade 0-2-1)
   Nosso prefixo body.woocommerce eleva nossa especificidade para garantir
   que nossos estilos dourados sempre ganhem, independente da ordem de CSS. */

body.woocommerce a.button,
body.woocommerce button.button,
body.woocommerce a.button.alt,
body.woocommerce button.button.alt,
body.woocommerce #respond input#submit,
body.woocommerce #respond input#submit.alt,
body.woocommerce-page a.button,
body.woocommerce-page button.button,
body.woocommerce-page a.button.alt,
body.woocommerce-page button.button.alt {
	background-color: var(--lun-dourado);
	color: var(--lun-roxo-profundo);
	font-family: var(--fonte-corpo);
	font-weight: 700;
	border-radius: var(--raio);
	border: none;
	padding: 0.65rem 1.4rem;
	cursor: pointer;
	transition: background-color var(--trans), transform var(--trans);
	text-decoration: none;
}

body.woocommerce a.button:hover,
body.woocommerce button.button:hover,
body.woocommerce a.button.alt:hover,
body.woocommerce button.button.alt:hover,
body.woocommerce-page a.button:hover,
body.woocommerce-page button.button:hover,
body.woocommerce-page a.button.alt:hover,
body.woocommerce-page button.button.alt:hover {
	background-color: var(--lun-dourado-hover);
	color: var(--lun-roxo-profundo);
	transform: translateY(-1px);
}

/* ---- Grade de produtos (página da loja) ---- */

/* Título da loja ("Shop" / "Loja") */
.woocommerce-products-header__title.page-title,
.woocommerce-loop-product__title,
h1.woocommerce-page-title {
	font-family: var(--fonte-titulo);
	color: var(--lun-roxo-profundo);
}

/* Contador de resultados e ordenação */
.woocommerce-result-count {
	font-size: 0.85rem;
	color: var(--lun-texto-suave);
	margin: 0.5rem 0 1rem;
}

.woocommerce-ordering select {
	border: 1px solid var(--lun-borda);
	border-radius: var(--raio);
	padding: 0.4rem 0.8rem;
	font-family: var(--fonte-corpo);
	font-size: 0.875rem;
	color: var(--lun-texto);
	background-color: var(--lun-branco);
}

/* ---- Grade de produtos — ul.products e li.product ----

   PROBLEMA: O WooCommerce define seu próprio layout via floats:
     .woocommerce ul.products li.product { float: left; width: 22.05%; }  → especificidade 0-3-2
   O nosso prefixo "body." eleva para 0-3-3 e garante que nosso CSS ganhe
   independente da ordem de carregamento.

   ESTRATÉGIA: Flexbox no ul (derruba os floats do WC) + largura explícita
   no li (derruba o width: 22.05% do WC). */

/* Contentor da grade: flexbox com quebra de linha */
body.woocommerce ul.products,
body.woocommerce-page ul.products {
	display: flex !important;   /* !important como segurança extra contra WC */
	flex-wrap: wrap;
	gap: 1.5rem;
	list-style: none;
	margin: 1.5rem 0 0;
	padding: 0;
	clear: both;
}

/* Remove o pseudo-elemento clearfix que o WC adiciona (desnecessário no flex) */
body.woocommerce ul.products::before,
body.woocommerce ul.products::after,
body.woocommerce-page ul.products::before,
body.woocommerce-page ul.products::after {
	display: none;
}

/* Card individual — 3 colunas no desktop
   calc(33.333% - 1rem): divide a linha em 3 descontando 2/3 do gap (1.5rem × 2 ÷ 3) */
body.woocommerce ul.products li.product,
body.woocommerce-page ul.products li.product {
	float: none !important;           /* cancela o float: left do WooCommerce */
	width: calc(33.333% - 1rem) !important; /* cancela o width: 22.05% do WooCommerce */
	margin: 0 !important;             /* cancela margin-right do WooCommerce */
	box-sizing: border-box;
	background-color: var(--lun-branco);
	border: 1px solid var(--lun-borda);
	border-radius: var(--raio);
	padding: 1.25rem;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	transition: box-shadow var(--trans);
}

body.woocommerce ul.products li.product:hover,
body.woocommerce-page ul.products li.product:hover {
	box-shadow: 0 4px 16px rgba(61, 8, 8, 0.12);
}

/* Tablet: 2 colunas */
@media (max-width: 900px) {
	body.woocommerce ul.products li.product,
	body.woocommerce-page ul.products li.product {
		width: calc(50% - 0.75rem) !important;
	}
}

/* Mobile: 1 coluna */
@media (max-width: 600px) {
	body.woocommerce ul.products li.product,
	body.woocommerce-page ul.products li.product {
		width: 100% !important;
	}
}

/* Imagem do produto no card */
body.woocommerce ul.products li.product img,
body.woocommerce-page ul.products li.product img {
	width: 100%;
	height: auto;
	border-radius: calc(var(--raio) - 2px);
}

/* Nome do produto (sessão) no card */
body.woocommerce ul.products li.product .woocommerce-loop-product__title,
body.woocommerce-page ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--fonte-titulo);
	font-size: 1rem;
	font-weight: 700;
	color: var(--lun-roxo-profundo);
	margin: 0;
	word-break: normal;    /* evita quebrar palavra por palavra */
	overflow-wrap: anywhere;
}

/* Preço no card */
body.woocommerce ul.products li.product .price,
body.woocommerce-page ul.products li.product .price {
	font-size: 0.9rem;
	color: var(--lun-texto-suave);
}

body.woocommerce ul.products li.product .price .amount,
body.woocommerce-page ul.products li.product .price .amount {
	font-weight: 700;
	color: var(--lun-roxo);
}

/* Botão "Ver opções" / "Comprar" no card — empurra para baixo do card */
body.woocommerce ul.products li.product .button,
body.woocommerce-page ul.products li.product .button {
	margin-top: auto;
	display: block;
	text-align: center;
	width: 100%;
}

/* ---- Mensagens de notificação do WooCommerce ---- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	padding: 1rem 1.25rem;
	border-radius: var(--raio);
	margin-bottom: 1.5rem;
	font-size: 0.95rem;
	font-weight: 500;
	list-style: none;
}

/* O WooCommerce insere um ícone via ::before com position: absolute.
   Nosso padding não reserva espaço para ele, então sobrepõe o texto.
   Ocultamos o ::before — a borda colorida à esquerda já indica o tipo. */
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
	display: none !important;
}

.woocommerce-message {
	background-color: #DCFCE7;
	color: #166534;
	border-left: 4px solid #16a34a;
}

.woocommerce-info {
	background-color: #EFF6FF;
	color: #1e40af;
	border-left: 4px solid #3b82f6;
}

.woocommerce-error {
	background-color: #FEE2E2;
	color: #991B1B;
	border-left: 4px solid #dc2626;
}

/* Botão dentro da mensagem (ex: "Ver carrinho" após adicionar ingresso) */
.woocommerce-message .button,
.woocommerce-info .button {
	float: right;
	margin-left: 1rem;
	font-size: 0.85rem;
	padding: 0.4rem 1rem;
}

/* ============================================================
   CARRINHO (Cart)
   ============================================================

   Nosso cart.php remove a coluna de thumbnail e o campo de cupom.
   O layout é uma tabela responsiva: no desktop mostra colunas;
   no mobile empilha cada campo com rótulo (via data-title + ::before).
   ============================================================ */

/* ---- Página do carrinho: padding lateral e topo ----
   Espelha o mesmo tratamento dado ao checkout (abaixo, seção 10c).
   padding-inline garante que o conteúdo nunca toque as bordas. */
.woocommerce-cart .wc-pagina {
	padding-top: 2.5rem;
	padding-inline: clamp(1.5rem, 8vw, 5rem);
}

/* ---- Bloco Gutenberg de Carrinho (WC 8+): impede expansão borda a borda ----
   Enquanto a migração para shortcode clássico não ocorre (requer visita ao
   painel), o bloco usa alignfull com margin negativo que ignora qualquer
   padding do container pai. Anulamos esse efeito aqui. */
.wp-block-woocommerce-cart.alignfull,
.wp-block-woocommerce-cart {
	margin-left: 0 !important;
	margin-right: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
}

/* Título da página carrinho */
.woocommerce-cart h1.page-title,
.woocommerce-cart h1.woocommerce-page-title {
	font-family: var(--fonte-titulo);
	font-size: clamp(1.5rem, 3vw, 2rem);
	color: var(--lun-roxo-profundo);
	margin-bottom: 2rem;
}

/* ---- Tabela do carrinho ---- */
.woocommerce-cart-form .shop_table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 2rem;
}

/* Cabeçalho da tabela */
.woocommerce-cart-form thead th {
	padding: 0.75rem 1rem;
	font-family: var(--fonte-corpo);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--lun-texto-suave);
	border-bottom: 2px solid var(--lun-borda);
	text-align: left;
	background: transparent;
}

.woocommerce-cart-form thead .product-price,
.woocommerce-cart-form thead .product-quantity,
.woocommerce-cart-form thead .product-subtotal {
	text-align: right;
}

/* Células das linhas de produto */
.woocommerce-cart-form tbody td {
	padding: 1.2rem 1rem;
	border-bottom: 1px solid var(--lun-borda);
	vertical-align: middle;
}

/* Botão × de remover */
.woocommerce-cart-form .product-remove a.remove {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	background-color: var(--lun-borda);
	color: var(--lun-texto-suave) !important;
	font-size: 1.1rem;
	line-height: 1;
	text-decoration: none;
	transition: background-color var(--trans), color var(--trans);
}

.woocommerce-cart-form .product-remove a.remove:hover {
	background-color: #FEE2E2;
	color: #991B1B !important;
}

/* Nome do ingresso */
.lun-cart-nome {
	display: block;
	font-family: var(--fonte-titulo);
	font-size: 1rem;
	font-weight: 700;
	color: var(--lun-roxo-profundo);
	text-decoration: none;
	margin-bottom: 0.3rem;
}

.lun-cart-nome:hover {
	color: var(--lun-roxo);
}

/* Variações: Setor / Tipo — geradas por wc_get_formatted_cart_item_data() */
.woocommerce-cart-form .product-name .variation {
	margin: 0.35rem 0 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.3rem 0.8rem;
}

.woocommerce-cart-form .product-name .variation dt {
	font-size: 0.8rem;
	font-weight: 700;
	color: var(--lun-roxo);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin: 0;
}

.woocommerce-cart-form .product-name .variation dd {
	font-size: 0.8rem;
	color: var(--lun-texto);
	margin: 0;
}

/* Colunas de preço e subtotal */
.woocommerce-cart-form .product-price,
.woocommerce-cart-form .product-subtotal {
	text-align: right;
	font-weight: 700;
	color: var(--lun-roxo-profundo);
}

.woocommerce-cart-form .product-subtotal {
	font-size: 1.05rem;
}

/* Input de quantidade */
.woocommerce-cart-form .product-quantity {
	text-align: right;
}

.woocommerce-cart-form .product-quantity .qty {
	width: 4.5rem;
	padding: 0.4rem 0.5rem;
	border: 1px solid var(--lun-borda);
	border-radius: var(--raio);
	font-family: var(--fonte-corpo);
	font-size: 0.95rem;
	font-weight: 700;
	text-align: center;
	color: var(--lun-texto);
	background-color: var(--lun-branco);
}

/* Linha de ações (atualizar carrinho) */
.woocommerce-cart-form td.actions {
	padding: 1rem;
	border-bottom: none;
}

.lun-btn-atualizar {
	background: transparent !important;
	color: var(--lun-texto-suave) !important;
	border: 1px solid var(--lun-borda) !important;
	font-size: 0.85rem !important;
	padding: 0.45rem 1rem !important;
	transition: border-color var(--trans), color var(--trans) !important;
}

.lun-btn-atualizar:hover {
	color: var(--lun-roxo-profundo) !important;
	border-color: var(--lun-roxo-profundo) !important;
	background: transparent !important;
	transform: none !important;
}

/* ---- Totais do carrinho ---- */

/* O WooCommerce coloca os totais dentro de .cart-collaterals.
   Garantimos que o box de totais fique alinhado à direita. */
.cart-collaterals {
	display: flex;
	justify-content: flex-end;
}

.cart_totals {
	width: 100%;
	max-width: 26rem;
	background-color: var(--lun-branco);
	border: 1px solid var(--lun-borda);
	border-radius: var(--raio);
	padding: 1.5rem;
}

.cart_totals h2 {
	font-family: var(--fonte-titulo);
	font-size: 1.2rem;
	color: var(--lun-roxo-profundo);
	margin: 0 0 1rem;
	padding-bottom: 0.75rem;
	border-bottom: 1px solid var(--lun-borda);
}

.cart_totals .shop_table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 1.25rem;
}

.cart_totals .shop_table tr th,
.cart_totals .shop_table tr td {
	padding: 0.6rem 0;
	text-align: left;
	font-size: 0.95rem;
	border: none;
	background: transparent;
}

.cart_totals .shop_table tr td {
	text-align: right;
	font-weight: 700;
}

/* Linha de Total — destaque visual */
.cart_totals .order-total th,
.cart_totals .order-total td {
	padding-top: 0.85rem;
	border-top: 2px solid var(--lun-borda);
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--lun-roxo-profundo);
}

.cart_totals .order-total td .woocommerce-Price-amount {
	font-family: var(--fonte-corpo);
	font-size: 1.4rem;
	color: var(--lun-roxo);
}

/* ---- Botão "Finalizar compra" ---- */
.wc-proceed-to-checkout {
	margin-top: 0.5rem;
}

.wc-proceed-to-checkout a.checkout-button {
	display: block;
	width: 100%;
	padding: 1rem 1.5rem;
	background-color: var(--lun-roxo) !important;
	color: var(--lun-branco) !important;
	font-family: var(--fonte-corpo);
	font-size: 1.05rem;
	font-weight: 700;
	text-align: center;
	text-decoration: none;
	border-radius: var(--raio);
	border: none;
	cursor: pointer;
	transition: background-color var(--trans), transform var(--trans);
	letter-spacing: 0.03em;
}

.wc-proceed-to-checkout a.checkout-button:hover {
	background-color: var(--lun-roxo-escuro) !important;
	color: var(--lun-branco) !important;
	transform: translateY(-1px);
}

/* Nota de segurança opcional abaixo do botão */
.wc-proceed-to-checkout::after {
	content: '🔒 Pagamento 100% seguro';
	display: block;
	text-align: center;
	font-size: 0.78rem;
	color: var(--lun-texto-suave);
	margin-top: 0.6rem;
}

/* ---- Carrinho vazio ---- */
.cart-empty.woocommerce-info {
	text-align: center;
	padding: 2.5rem;
}

.return-to-shop {
	text-align: center;
	margin-top: 1rem;
}

/* ---- Responsivo do carrinho ---- */
@media (max-width: 680px) {
	/* WC transforma a tabela em lista com rótulos via data-title + ::before */
	.woocommerce-cart-form .shop_table thead {
		display: none;
	}

	.woocommerce-cart-form .shop_table tbody td {
		display: block;
		text-align: right;
		padding: 0.6rem 1rem;
		border-bottom: none;
	}

	.woocommerce-cart-form .shop_table tbody td::before {
		content: attr(data-title) ': ';
		float: left;
		font-weight: 700;
		font-size: 0.82rem;
		color: var(--lun-texto-suave);
		text-transform: uppercase;
		letter-spacing: 0.05em;
	}

	.woocommerce-cart-form .shop_table tbody tr {
		display: block;
		border: 1px solid var(--lun-borda);
		border-radius: var(--raio);
		margin-bottom: 1rem;
		padding: 0.5rem 0;
	}

	.woocommerce-cart-form .product-name::before {
		display: none; /* nome já visível, não precisa de rótulo */
	}

	.woocommerce-cart-form .product-name,
	.woocommerce-cart-form .product-remove {
		text-align: left;
	}

	.cart-collaterals {
		justify-content: center;
	}

	.cart_totals {
		max-width: 100%;
	}
}

/* ============================================================
   CHECKOUT
   ============================================================

   Layout de dois colunas:
     Esquerda (mais estreita): "Seus dados" — nome, e-mail, telefone
     Direita (mais larga):     "Resumo do pedido" — itens + pagamento

   A coluna direita é sticky em desktop para que o cliente sempre
   veja o total e o botão "Confirmar" enquanto preenche os dados.
   ============================================================ */

.woocommerce-checkout .wc-pagina {
	padding-top: 2.5rem;
	/* Afasta o conteúdo das bordas da tela. clamp() garante mínimo de 1.5rem
	   em telas pequenas, mas usa 8% da largura em telas grandes. */
	padding-inline: clamp(1.5rem, 8vw, 5rem);
}

/* ---- Bloco Gutenberg de Checkout (WC 8+): impede expansão borda a borda ----
   O bloco usa alignfull que aplica margin negativo para sair do container.
   Anulamos esse comportamento enquanto a migração para shortcode não ocorre. */
.wp-block-woocommerce-checkout.alignfull,
.wp-block-woocommerce-checkout {
	margin-left: 0 !important;
	margin-right: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
}

/* Título da página "Checkout" gerado pelo WP dentro do bloco */
.woocommerce-checkout .entry-title,
.woocommerce-checkout .page-title {
	font-family: var(--fonte-titulo);
	font-size: clamp(1.5rem, 3vw, 2rem);
	color: var(--lun-roxo-profundo);
	margin: 0 0 1.5rem;
	padding-bottom: 0.5rem;
	border-bottom: 3px solid var(--lun-dourado);
}

/* ---- Grid principal ---- */
.lun-checkout-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	align-items: start;
}

/* Título de cada coluna */
.lun-checkout-titulo {
	font-family: var(--fonte-titulo);
	font-size: 1.4rem;
	color: var(--lun-roxo-profundo);
	margin: 0 0 1.5rem;
	padding-bottom: 0.75rem;
	border-bottom: 2px solid var(--lun-dourado);
}

/* Oculta o h3 que form-billing.php insere (temos nosso próprio h2) */
.lun-checkout-esquerda .woocommerce-billing-fields > h3 {
	display: none;
}

/* Sticky na coluna direita (mantém o resumo + botão visível ao rolar) */
.lun-checkout-direita {
	position: sticky;
	top: 1.5rem;
}

/* ---- Formulário de dados do comprador ---- */

/* Cada campo (row) */
.woocommerce-checkout .form-row {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	margin-bottom: 1.1rem;
}

/* Dois campos lado a lado (nome + sobrenome) */
.woocommerce-billing-fields__field-wrapper {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 1rem;
}

/* Nome e sobrenome ficam na mesma linha; e-mail e telefone ocupam linha inteira */
.woocommerce-billing-fields__field-wrapper .form-row-first,
.woocommerce-billing-fields__field-wrapper .form-row-last {
	grid-column: span 1;
}

.woocommerce-billing-fields__field-wrapper .form-row-wide {
	grid-column: 1 / -1;
}

/* Label */
.woocommerce-checkout label {
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--lun-texto-suave);
}

/* Indicador de campo obrigatório (*) */
.woocommerce-checkout .required {
	color: var(--lun-roxo);
	font-weight: 700;
}

/* Inputs de texto */
.woocommerce-checkout .input-text,
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"] {
	width: 100%;
	padding: 0.7rem 0.9rem;
	border: 1.5px solid var(--lun-borda);
	border-radius: var(--raio);
	font-family: var(--fonte-corpo);
	font-size: 1rem;
	color: var(--lun-texto);
	background-color: var(--lun-branco);
	transition: border-color var(--trans);
	box-sizing: border-box;
}

.woocommerce-checkout .input-text:focus,
.woocommerce-checkout input[type="text"]:focus,
.woocommerce-checkout input[type="email"]:focus,
.woocommerce-checkout input[type="tel"]:focus {
	outline: none;
	border-color: var(--lun-roxo);
	box-shadow: 0 0 0 3px rgba(27, 58, 107, 0.1);
}

/* Campo com erro */
.woocommerce-checkout .woocommerce-invalid .input-text {
	border-color: #dc2626;
}

.woocommerce-checkout .woocommerce-validated .input-text {
	border-color: #16a34a;
}

/* Mensagem de erro abaixo do campo */
.woocommerce-checkout .woocommerce-error {
	font-size: 0.82rem;
	padding: 0.5rem 0.75rem;
}

/* ---- Resumo do pedido (coluna direita) ---- */

.woocommerce-checkout-review-order-table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 1.25rem;
	background-color: var(--lun-branco);
	border: 1px solid var(--lun-borda);
	border-radius: var(--raio);
	overflow: hidden;
}

.woocommerce-checkout-review-order-table thead th {
	padding: 0.75rem 1rem;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--lun-texto-suave);
	background-color: var(--lun-creme);
	border-bottom: 1px solid var(--lun-borda);
	text-align: left;
}

.woocommerce-checkout-review-order-table thead .product-total {
	text-align: right;
}

.woocommerce-checkout-review-order-table tbody td {
	padding: 1rem;
	border-bottom: 1px solid var(--lun-borda);
	font-size: 0.95rem;
	vertical-align: top;
}

.woocommerce-checkout-review-order-table tbody .product-name {
	color: var(--lun-roxo-profundo);
	font-weight: 600;
}

/* Variações: Setor / Tipo no resumo */
.woocommerce-checkout-review-order-table .variation {
	margin: 0.3rem 0 0;
}

.woocommerce-checkout-review-order-table .variation dt,
.woocommerce-checkout-review-order-table .variation dd {
	font-size: 0.8rem;
	display: inline;
}

.woocommerce-checkout-review-order-table .variation dt {
	font-weight: 700;
	color: var(--lun-roxo);
}

.woocommerce-checkout-review-order-table .variation dd::after {
	content: ' ';
}

/* Quantidade (×2) */
.woocommerce-checkout-review-order-table .product-quantity {
	color: var(--lun-roxo);
	font-size: 0.85rem;
}

.woocommerce-checkout-review-order-table .product-total {
	text-align: right;
	font-weight: 700;
	color: var(--lun-roxo-profundo);
}

/* tfoot: subtotal + total */
.woocommerce-checkout-review-order-table tfoot tr th,
.woocommerce-checkout-review-order-table tfoot tr td {
	padding: 0.6rem 1rem;
	font-size: 0.9rem;
	border-bottom: 1px solid var(--lun-borda);
	background: transparent;
}

.woocommerce-checkout-review-order-table tfoot tr td {
	text-align: right;
	font-weight: 700;
}

/* Linha de total: destaque */
.woocommerce-checkout-review-order-table tfoot .order-total th,
.woocommerce-checkout-review-order-table tfoot .order-total td {
	font-size: 1.05rem;
	color: var(--lun-roxo-profundo);
	border-bottom: none;
	padding-top: 0.85rem;
}

.woocommerce-checkout-review-order-table tfoot .order-total td .woocommerce-Price-amount {
	font-size: 1.25rem;
	color: var(--lun-roxo);
}

/* ---- Seção de pagamento ---- */

#payment {
	background-color: var(--lun-branco);
	border: 1px solid var(--lun-borda);
	border-radius: var(--raio);
	overflow: hidden;
}

/* Lista de métodos de pagamento */
#payment ul.payment_methods {
	list-style: none;
	margin: 0;
	padding: 0;
	border-bottom: 1px solid var(--lun-borda);
}

#payment ul.payment_methods li {
	padding: 0.9rem 1.25rem;
	border-bottom: 1px solid var(--lun-borda);
	display: flex;
	align-items: center;
	gap: 0.6rem;
	font-size: 0.95rem;
	cursor: pointer;
}

#payment ul.payment_methods li:last-child {
	border-bottom: none;
}

#payment ul.payment_methods li label {
	font-weight: 600;
	color: var(--lun-texto);
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	text-transform: none;
	letter-spacing: 0;
	font-size: 0.95rem;
}

#payment ul.payment_methods li input[type="radio"] {
	accent-color: var(--lun-roxo);
}

/* Descrição/formulário do método de pagamento */
.payment_box {
	padding: 1rem 1.25rem;
	background-color: var(--lun-creme);
	font-size: 0.9rem;
	color: var(--lun-texto-suave);
	border-bottom: 1px solid var(--lun-borda);
}

/* Termos e condições */
.woocommerce-terms-and-conditions-wrapper {
	padding: 0.9rem 1.25rem;
	font-size: 0.85rem;
	color: var(--lun-texto-suave);
}

/* Área do botão "Confirmar pedido" */
#payment .place-order {
	padding: 1.25rem;
}

/* Botão de confirmar — mais importante da jornada */
#place_order {
	display: block !important;
	width: 100% !important;
	padding: 1rem 1.5rem !important;
	background-color: var(--lun-roxo) !important;
	color: var(--lun-branco) !important;
	font-family: var(--fonte-corpo) !important;
	font-size: 1.1rem !important;
	font-weight: 700 !important;
	text-align: center !important;
	border: none !important;
	border-radius: var(--raio) !important;
	cursor: pointer !important;
	letter-spacing: 0.03em !important;
	transition: background-color var(--trans), transform var(--trans) !important;
}

#place_order:hover {
	background-color: var(--lun-roxo-escuro) !important;
	transform: translateY(-1px) !important;
}

/* Spinner de carregamento durante envio do pedido */
.blockOverlay {
	background: rgba(255, 255, 255, 0.8) !important;
}

/* ---- Página de confirmação (Thank You) ---- */

.woocommerce-order-received .entry-title,
.woocommerce-order-received h1.page-title {
	font-family: var(--fonte-titulo);
	color: var(--lun-roxo-profundo);
}

.woocommerce-thankyou-order-received {
	padding: 1.25rem;
	background-color: #DCFCE7;
	color: #166534;
	border-left: 4px solid #16a34a;
	border-radius: var(--raio);
	font-weight: 700;
	margin-bottom: 2rem;
}

.woocommerce-order-details table.woocommerce-table,
.woocommerce-customer-details .addresses .woocommerce-column__title {
	font-family: var(--fonte-titulo);
	color: var(--lun-roxo-profundo);
}

/* ---- Responsivo do checkout ---- */

@media (max-width: 860px) {
	.lun-checkout-grid {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	/* Em mobile: dados do comprador primeiro, resumo abaixo */
	.lun-checkout-esquerda { order: 1; }
	.lun-checkout-direita  { order: 2; position: static; }

	.woocommerce-billing-fields__field-wrapper {
		grid-template-columns: 1fr;
	}

	.woocommerce-billing-fields__field-wrapper .form-row-first,
	.woocommerce-billing-fields__field-wrapper .form-row-last {
		grid-column: 1 / -1;
	}
}

/* ============================================================
   10. REFINAMENTO VISUAL
   ============================================================

   Melhorias de design aplicadas como overrides no final do
   arquivo para não afetar a estrutura já existente.
   Objetivos:
     – Hero com mais impacto e dramaticidade
     – Títulos de seção com ornamento dourado
     – Cards com mais personalidade e caráter
     – Setor Ouro com brilho premium
     – Detalhes de acabamento (footer, separadores, espaço)
   ============================================================ */

/* ---- Hero: imagem mais alta e fade mais dramático ---- */
.hero-visual {
	height: 78vh;
}

.hero-visual-fade {
	height: 55%;
	background: linear-gradient(
		to top,
		var(--lun-roxo-escuro) 0%,
		rgba(107, 16, 16, 0.55) 50%,
		transparent 100%
	);
}

/* ---- Hero strip: gradiente rico com brilhos laterais ---- */
.hero-strip {
	background: linear-gradient(150deg, var(--lun-roxo-profundo) 0%, var(--lun-roxo-escuro) 70%);
	padding: 3rem 0 4.5rem;
	position: relative;
	overflow: hidden;
}

/* Brilhos dourados sutis nos cantos do strip */
.hero-strip::before {
	content: '';
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 60% 80% at 5% 80%, rgba(212, 160, 23, 0.10) 0%, transparent 60%),
		radial-gradient(ellipse 40% 60% at 95% 20%, rgba(212, 160, 23, 0.07) 0%, transparent 60%);
	pointer-events: none;
}

/* "Temporada 2026" com linhas decorativas flanqueando o texto */
.hero-supra {
	display: flex;
	align-items: center;
	gap: 0.8rem;
	font-size: 0.73rem;
	letter-spacing: 0.28em;
	margin-bottom: 0.75rem;
}

.hero-supra::before,
.hero-supra::after {
	content: '';
	display: block;
	flex-shrink: 0;
	width: 1.5rem;
	height: 1px;
	background: var(--lun-dourado);
	opacity: 0.65;
}

/* Título maior e com mais presença */
.hero-titulo {
	font-size: clamp(2rem, 4vw, 3rem);
	letter-spacing: -0.02em;
	margin-bottom: 0.75rem;
}

/* Botão CTA: pill shape — mais luxuoso que o retangular padrão */
.btn-grande {
	border-radius: 99px;
	letter-spacing: 0.06em;
	padding: 1rem 2.5rem;
	box-shadow: 0 4px 20px rgba(212, 160, 23, 0.30);
}

.btn-grande:hover {
	box-shadow: 0 6px 28px rgba(212, 160, 23, 0.45);
	transform: translateY(-2px);
}

/* ---- Títulos de seção: ornamento dourado embaixo ---- */
.secao-titulo {
	letter-spacing: -0.01em;
}

.secao-titulo::after {
	content: '';
	display: block;
	width: 2.5rem;
	height: 3px;
	background: var(--lun-dourado);
	margin: 0.9rem auto 0;
	border-radius: 2px;
}

/* Na seção "Onde estamos" (título à esquerda), ornamento alinhado à esquerda */
.secao-local .secao-titulo::after {
	margin-left: 0;
}

/* ---- Seção sessões: mais respiro ---- */
.secao-sessoes {
	padding: 5.5rem 0;
}

/* ---- Cards de sessão: borda dourada e sombra mais rica ---- */
.sessao-card {
	border-top: 4px solid var(--lun-dourado);
	box-shadow: 0 4px 24px rgba(61, 8, 8, 0.08);
}

.sessao-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 18px 44px rgba(61, 8, 8, 0.18);
}

/* Header do card: gradiente em vez de cor sólida */
.sessao-data-header {
	background: linear-gradient(145deg, var(--lun-roxo-profundo) 0%, var(--lun-roxo-escuro) 100%);
	padding: 1.5rem 1rem 1.3rem;
	position: relative;
	overflow: hidden;
}

/* Círculo dourado decorativo no canto superior direito do header */
.sessao-data-header::after {
	content: '';
	position: absolute;
	top: -20px;
	right: -20px;
	width: 90px;
	height: 90px;
	border-radius: 50%;
	background: rgba(212, 160, 23, 0.07);
	pointer-events: none;
}

/* Número do dia: maior, mais impactante */
.sessao-numero-dia {
	font-size: 3.5rem;
	letter-spacing: -0.03em;
}

/* ---- Seção setores: gradiente e brilhos ambiente ---- */
.secao-setores {
	background: linear-gradient(
		155deg,
		var(--lun-roxo-profundo) 0%,
		var(--lun-roxo-escuro) 50%,
		var(--lun-roxo-profundo) 100%
	);
	position: relative;
	overflow: hidden;
}

/* Brilhos dourados nos cantos opostos da seção */
.secao-setores::before {
	content: '';
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 70% 80% at -10% 110%, rgba(212, 160, 23, 0.09) 0%, transparent 60%),
		radial-gradient(ellipse 50% 60% at 110% -10%, rgba(212, 160, 23, 0.07) 0%, transparent 60%);
	pointer-events: none;
}

/* Card Prata: fundo um pouco mais visível */
.setor-card {
	background: rgba(255, 255, 255, 0.06);
	border-color: rgba(255, 255, 255, 0.13);
	transition: transform var(--trans), box-shadow var(--trans), background-color var(--trans);
}

.setor-card:hover {
	transform: translateY(-5px);
	background: rgba(255, 255, 255, 0.09);
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.30);
}

/* Card Ouro: brilho premium com múltiplas camadas de sombra */
.setor-card--ouro {
	background: rgba(212, 160, 23, 0.13);
	border-color: rgba(212, 160, 23, 0.55);
	box-shadow:
		0 0 0 1px rgba(212, 160, 23, 0.12),
		0 8px 32px rgba(0, 0, 0, 0.20),
		inset 0 1px 0 rgba(212, 160, 23, 0.18);
}

.setor-card--ouro:hover {
	background: rgba(212, 160, 23, 0.18);
	box-shadow:
		0 0 0 1px rgba(212, 160, 23, 0.22),
		0 20px 50px rgba(212, 160, 23, 0.18),
		inset 0 1px 0 rgba(212, 160, 23, 0.30);
}

.setor-nome {
	font-size: 1.5rem;
	letter-spacing: -0.01em;
}

.setor-icone {
	font-size: 2.75rem;
}

/* ---- Seção localização: linha dourada no topo ---- */
.secao-local {
	position: relative;
}

.secao-local::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--lun-dourado), transparent);
	opacity: 0.35;
}

.local-cidade {
	font-size: 1.9rem;
	letter-spacing: -0.02em;
}

/* ---- Footer: borda dourada sutil no topo ---- */
.site-footer {
	border-top: 3px solid rgba(212, 160, 23, 0.35);
}

/* ============================================================
   10b. PÁGINA PÓS-COMPRA (thankyou / order-received)
   ============================================================ */

/* ---- Container e espaçamento lateral (igual ao checkout) ---- */
.woocommerce-order-received .wc-pagina {
	padding-top: 2.5rem;
	padding-inline: clamp(1.5rem, 8vw, 5rem);
}

/* ---- Wrapper geral ---- */
.lun-order-received {
	display: flex;
	flex-direction: column;
	gap: 2.5rem;
}

/* ---- 1. Banner de confirmação ---- */
.lun-thankyou-banner {
	background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
	border: 1.5px solid #86efac;
	border-radius: var(--raio);
	padding: 2rem 2rem 1.5rem;
}

/* Mensagem "Pedido confirmado!" */
.lun-thankyou-banner .woocommerce-thankyou-order-received {
	font-family: var(--fonte-titulo);
	font-size: clamp(1.3rem, 3vw, 1.8rem);
	color: #166534;
	font-weight: 700;
	margin: 0 0 1.5rem;
	padding: 0;
	background: none;
	border: none;
}

/* Lista de metadados do pedido (número, data, e-mail, total) */
.lun-thankyou-overview {
	display: flex;
	flex-wrap: wrap;
	gap: 0 2rem;
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: 1px solid #bbf7d0;
	padding-top: 1rem;
}

.lun-thankyou-overview li {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	font-size: 0.88rem;
	color: #166534;
	padding: 0.4rem 0;
	border: none;
	background: none;
}

.lun-thankyou-overview .lun-ov-label {
	font-size: 0.72rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	opacity: 0.75;
}

.lun-thankyou-overview li strong {
	font-size: 0.95rem;
	font-weight: 700;
	color: #14532d;
}

/* ---- Títulos de seção (Pague com Pix / Detalhes do pedido) ---- */
.lun-thankyou-section-title {
	font-family: var(--fonte-titulo);
	font-size: 1.3rem;
	color: var(--lun-roxo-profundo);
	margin: 0 0 1.25rem;
	padding-bottom: 0.5rem;
	border-bottom: 3px solid var(--lun-dourado);
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

/* ---- 2. Bloco Pix do Mercado Pago ---- */
.lun-thankyou-pix {
	background: var(--lun-creme);
	border: 1.5px solid rgba(212, 160, 23, 0.3);
	border-radius: var(--raio);
	padding: 1.75rem 2rem;
}

/* Botão "Copiar código" — substitui o azul padrão do Mercado Pago */
.mp-details-pix-button,
.lun-thankyou-pix button,
.lun-thankyou-pix [class*="mp-"][class*="button"],
.lun-thankyou-pix [class*="mp-"][class*="btn"] {
	background-color: var(--lun-roxo) !important;
	color: var(--lun-branco) !important;
	border: none !important;
	border-radius: var(--raio) !important;
	padding: 0.75rem 1.5rem !important;
	font-family: var(--fonte-corpo) !important;
	font-size: 0.95rem !important;
	font-weight: 700 !important;
	cursor: pointer !important;
	transition: background-color var(--trans) !important;
	display: inline-block !important;
}

.mp-details-pix-button:hover,
.lun-thankyou-pix button:hover,
.lun-thankyou-pix [class*="mp-"][class*="button"]:hover {
	background-color: var(--lun-roxo-escuro) !important;
}

/* QR code: centraliza a imagem */
.mp-details-pix-container {
	text-align: center;
}

.mp-details-pix-container img {
	max-width: 200px;
	border-radius: 4px;
}

/* Campo de texto com o código Pix */
.mp-qr-input,
.mp-details-pix-qr-value {
	word-break: break-all;
	font-size: 0.78rem;
	background: #fff;
	border: 1px solid var(--lun-borda);
	border-radius: var(--raio);
	padding: 0.5rem 0.75rem;
	color: var(--lun-texto);
}

/* ---- 3. Tabela de detalhes do pedido ---- */
.lun-thankyou-detalhes {
	background: #fff;
	border: 1.5px solid var(--lun-borda);
	border-radius: var(--raio);
	padding: 1.75rem 2rem;
}

/* Esconde o h2 "Order details" que o WooCommerce injeta dentro
   de woocommerce_order_details_table — nosso template já tem o título */
.lun-thankyou-detalhes .woocommerce-order-details__title {
	display: none;
}

/* Tabela de itens */
.lun-thankyou-detalhes .woocommerce-table--order-details {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.92rem;
}

.lun-thankyou-detalhes .woocommerce-table--order-details th,
.lun-thankyou-detalhes .woocommerce-table--order-details td {
	padding: 0.65rem 0.5rem;
	border-bottom: 1px solid var(--lun-borda);
	text-align: left;
	vertical-align: middle;
}

.lun-thankyou-detalhes .woocommerce-table--order-details thead th {
	font-family: var(--fonte-titulo);
	font-size: 0.78rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--lun-roxo-profundo);
	border-bottom: 2px solid var(--lun-dourado);
}

.lun-thankyou-detalhes .woocommerce-table--order-details tfoot td,
.lun-thankyou-detalhes .woocommerce-table--order-details tfoot th {
	font-weight: 700;
	color: var(--lun-roxo-profundo);
}

.lun-thankyou-detalhes .woocommerce-table--order-details tfoot .order-total td,
.lun-thankyou-detalhes .woocommerce-table--order-details tfoot .order-total th {
	font-size: 1.05rem;
	color: var(--lun-roxo);
}

/* Variações (Setor: Prata | Tipo: Infantil) */
.lun-thankyou-detalhes .wc-item-meta {
	list-style: none;
	padding: 0;
	margin: 0.25rem 0 0;
	font-size: 0.8rem;
	color: var(--lun-texto-suave);
}

/* Oculta dados de endereço (billing address) — são desnecessários
   para ingresso digital e podem ser vazios após nosso filtro */
.lun-thankyou-detalhes .woocommerce-customer-details {
	display: none;
}

/* ---- Responsivo ---- */
@media (max-width: 640px) {
	.lun-thankyou-pix,
	.lun-thankyou-detalhes {
		padding: 1.25rem 1rem;
	}

	.lun-thankyou-overview {
		gap: 0 1rem;
	}
}

/* ============================================================
   11. CHECKOUT — OVERRIDES E CORREÇÕES VISUAIS
   ============================================================ */

/* ---- Suprimir seções extras geradas pelo WooCommerce ---- */

/* Headings h3 que o WC insere dentro da área de billing
   (ex.: "Endereço de cobrança", "Billing details").
   Nosso h2 "Seus dados" já cobre esse papel. */
.woocommerce-checkout .woocommerce-billing-fields > h3,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > h3,
.woocommerce-checkout #customer_details > .col-1 > h3,
.woocommerce-checkout #customer_details > .col-2 > h3 {
	display: none;
}

/* "Informações de contato" — bloco de e-mail adicionado pelo WC 8+ antes
   do formulário de billing no checkout clássico. Como temos o campo
   billing_email dentro do nosso form-billing.php, este bloco é redundante. */
.woocommerce-checkout .woocommerce-account-fields,
.woocommerce-checkout .woocommerce-form-login-toggle,
.woocommerce-checkout .woocommerce-form-coupon-toggle {
	display: none;
}

/* ---- Título da página de checkout ---- */
.woocommerce-checkout h1.page-title,
.woocommerce-checkout h1.entry-title,
.woocommerce-checkout .entry-title {
	font-family: var(--fonte-titulo);
	font-size: clamp(1.5rem, 3vw, 2rem);
	color: var(--lun-roxo-profundo);
	margin: 0 0 2rem;
	padding-bottom: 0.75rem;
	border-bottom: 3px solid var(--lun-dourado);
}

/* ---- Colunas do checkout: proporção esquerda menor que direita ---- */
.lun-checkout-grid {
	grid-template-columns: 1fr 1.1fr;
}

/* ---- Títulos das colunas ---- */
.lun-checkout-titulo {
	font-size: 1.2rem;
	display: flex;
	align-items: center;
	gap: 0.6rem;
}

.lun-checkout-titulo::before {
	content: '';
	display: block;
	width: 3px;
	height: 1.2em;
	background: var(--lun-dourado);
	border-radius: 2px;
	flex-shrink: 0;
}

/* ---- Campo de e-mail: dica visual de que é onde chega o ingresso ---- */
.woocommerce-checkout #billing_email_field label::after {
	content: ' — o ingresso será enviado aqui';
	font-size: 0.78rem;
	font-weight: 400;
	color: var(--lun-texto-suave);
	letter-spacing: 0;
	text-transform: none;
}

/* ---- Botão "Finalizar pedido" / "Place order" ---- */

/* WooCommerce clássico: id="place_order" */
#place_order,
#place_order.button,
.woocommerce-checkout #place_order {
	display: block !important;
	width: 100% !important;
	padding: 1.1rem 1.5rem !important;
	background-color: var(--lun-roxo) !important;
	color: var(--lun-branco) !important;
	font-family: var(--fonte-corpo) !important;
	font-size: 1.05rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.04em !important;
	text-align: center !important;
	border: none !important;
	border-radius: var(--raio) !important;
	cursor: pointer !important;
	transition: background-color var(--trans), transform var(--trans) !important;
}

#place_order:hover,
.woocommerce-checkout #place_order:hover {
	background-color: var(--lun-roxo-escuro) !important;
	transform: translateY(-1px) !important;
}

/* WooCommerce Blocks / wp-element-button (WC 8+) */
.wp-element-button.wc-block-components-checkout-place-order-button,
.wc-block-checkout__place-order .wc-block-components-checkout-place-order-button {
	background-color: var(--lun-roxo) !important;
	color: var(--lun-branco) !important;
	font-family: var(--fonte-corpo) !important;
	font-weight: 700 !important;
	border: none !important;
	border-radius: var(--raio) !important;
	padding: 1rem 1.5rem !important;
	width: 100% !important;
	font-size: 1.05rem !important;
}

/* ---- Resumo do pedido (coluna direita): visual mais limpo ---- */
.woocommerce-checkout-review-order-table {
	font-size: 0.9rem;
}

/* Linha do produto: imagem pequena + nome + variações */
.woocommerce-checkout-review-order-table .product-name {
	font-size: 0.92rem;
}

/* "Adicionar cupons" — accordion do WC; deixa mais discreto */
.woocommerce-checkout .checkout_coupon {
	margin-bottom: 1rem;
}

/* ---- Nota de segurança abaixo do botão (::after no .place-order) ---- */
#payment .place-order::after {
	content: '🔒 Pagamento 100% seguro · Ingresso por e-mail em minutos';
	display: block;
	text-align: center;
	font-size: 0.75rem;
	color: var(--lun-texto-suave);
	margin-top: 0.6rem;
	line-height: 1.5;
}

/* ---- Responsivo ---- */


/* ============================================================
   12. REPAGINAÇÃO LUNARI (handoff de 02/09/2026)
   ============================================================

   Esta camada substitui o antigo "Noite de Estreia" — 2818 linhas
   de override ESCURO que o tema herdou do Circo de Roma (fundo
   #150404, Playfair 900, lâmpadas de letreiro, glow dourado).

   O visual do Lunari é CLARO, sóbrio e legível, com a identidade
   azul + dourado do logo. Regras do handoff que valem em tudo:

     · fundo off-white #F6F4EE — nunca branco puro (o cliente achou
       branco puro cansativo)
     · border-radius 2px em tudo (só o badge Premium é pill)
     · SEM gradiente e SEM glow: cores chapadas; as três únicas
       sombras do projeto estão nos tokens
     · títulos em EB Garamond peso 500 (nunca 900)
     · supras/labels .72–.8rem, 700, letter-spacing .12em, uppercase

   Vem depois das seções 2–11 de propósito: elas são o desenho
   original do tema e esta camada as reescreve por cima, do mesmo
   jeito que a camada antiga fazia.
   ============================================================ */

/* ---------- 12.1 BASE ---------- */

body {
	background: var(--lun-fundo);
	color: var(--lun-texto);
	font-family: var(--fonte-corpo);
	font-size: 16px;
	line-height: 1.6;
}

h1, h2, h3, h4,
.hero-titulo,
.secao-titulo,
.setor-nome,
.footer-logo-nome {
	font-family: var(--fonte-titulo);
	font-weight: 500;
	color: var(--lun-azul);
	letter-spacing: 0;
	text-transform: none;
}

a { color: var(--lun-azul); text-decoration: none; }
a:hover { color: var(--lun-dourado); }

/* Nenhum canto arredondado além de 2px, e nenhum brilho. */
.btn, .btn-primario, .btn-estreia, .btn-setor-prata,
.setor-card, .lun-agenda-dia, .lun-chip-horario,
input, select, textarea, .lun-card {
	border-radius: var(--raio);
	box-shadow: none;
}

/* ---------- 12.2 SUPRAS E LABELS ---------- */

.hero-supra,
.secao-supra,
.lun-embreve-supra,
.lun-label {
	font-family: var(--fonte-corpo);
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--lun-dourado);
	margin: 0 0 .75rem;
}

.secao-subtitulo,
.hero-descricao {
	color: var(--lun-texto-suave);
	font-size: 1.1rem;
}

/* Fora os filetes dourados que o desenho antigo desenhava em volta
   das supras e sob os títulos — o handoff pede supra limpa. */
.hero-supra::before,
.hero-supra::after,
.secao-supra::before,
.secao-supra::after,
.secao-titulo::after,
.secao-local .secao-titulo::after,
.sessao-data-header::after {
	content: none;
	display: none;
}

.hero-supra,
.secao-supra { display: block; }


/* ---------- 12.3 BOTÕES ---------- */

.btn-estreia,
.btn-primario,
.header-cta {
	display: inline-block;
	background: var(--lun-dourado);
	border: 1px solid var(--lun-dourado);
	color: var(--lun-branco);
	font-family: var(--fonte-corpo);
	font-size: .875rem;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: 10.4px 24px;
	border-radius: var(--raio);
	box-shadow: none;
	transition: background var(--trans), border-color var(--trans);
}

.btn-estreia:hover,
.btn-primario:hover,
.header-cta:hover {
	background: #B0850F;
	border-color: #B0850F;
	color: var(--lun-branco);
}

/* CTA principal do hero: AZUL e maior (o dourado fica no header). */
.btn-estreia--grande {
	background: var(--lun-azul);
	border-color: var(--lun-azul);
	font-size: 1rem;
	padding: 17.6px 40px;
	box-shadow: var(--lun-sombra-btn);
}

.btn-estreia--grande:hover {
	background: var(--lun-azul-2);
	border-color: var(--lun-azul-2);
}

/* CTA duplicado no cabeçalho.
   .nav-cta-mobile também carrega .btn-primario, então as regras de
   botão acima reativavam o botão que só deve existir dentro do menu
   mobile — e o desktop ficava com dois "Comprar ingressos".
   Media query NÃO soma especificidade: o seletor precisa ser mais
   específico que .btn-primario, não só vir depois. */
@media (min-width: 769px) {
	.site-nav .nav-cta-mobile { display: none; }
}

/* Outline azul — "Ver ingressos" do Prata. */
.btn-setor-prata {
	display: inline-block;
	background: transparent;
	border: 2px solid var(--lun-azul);
	color: var(--lun-azul);
	font-weight: 700;
	font-size: .875rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: 12px 26px;
	border-radius: var(--raio);
	box-shadow: none;
	transition: background var(--trans), color var(--trans);
}

.btn-setor-prata:hover {
	background: var(--lun-azul);
	color: var(--lun-branco);
}

/* ---------- 12.4 HEADER ---------- */

.site-header {
	background: var(--lun-azul);
	border-bottom: 0;
	box-shadow: none;
	position: sticky;
	top: 0;
	z-index: 100;
}

.site-header::before,
.site-header::after { content: none; }

.site-header .container {
	max-width: 1140px;
	padding: 14px 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

/* Logo: recorte quadrado, sem borda e sem círculo. */
.site-logo {
	display: flex;
	align-items: center;
	gap: 12px;
	white-space: nowrap;
	border: 0;
	background: none;
	padding: 0;
}

.logo-img {
	width: 52px;
	height: 52px;
	object-fit: cover;
	object-position: center 42%;
	display: block;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	filter: none;
}

/* Fallback textual (só quando não há imagem de marca). */
.logo-texto {
	font-family: var(--fonte-titulo);
	font-weight: 500;
	font-size: 1.35rem;
	letter-spacing: 0;
	text-transform: none;
	color: var(--lun-branco);
}

.site-nav a,
.header-direita a,
.lun-header-selo {
	color: var(--lun-branco);
}

.site-nav a:hover { color: var(--lun-dourado-claro); }

.header-direita {
	display: flex;
	align-items: center;
	gap: 4px;
}

/* ---------- 12.5 HERO ---------- */

.hero-estreia {
	background: var(--lun-fundo);
	padding: 64px 0 72px;
	border: 0;
}

/* Fora o holofote radial do desenho antigo. */
.hero-estreia::before,
.hero-estreia::after,
.secao-setores::before,
.secao-setores::after { content: none; background: none; }

.hero-estreia-grid {
	display: grid;
	grid-template-columns: 1.05fr 1fr;
	gap: 56px;
	align-items: center;
	max-width: 1140px;
}

.hero-titulo {
	font-size: clamp(2.5rem, 4.8vw, 4rem);
	font-weight: 500;
	line-height: 1.05;
	color: var(--lun-azul);
	margin: 0 0 1rem;
	text-shadow: none;
}

.hero-descricao { margin: 0 0 1.5rem; }

/* O bloco de resumo: quatro perguntas respondidas antes do clique. */
.hero-resumo {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 8px 24px;
	margin: 0 0 1.75rem;
	padding: 20px 0;
	border-top: 1px solid var(--lun-linha);
	border-bottom: 1px solid var(--lun-linha);
}

.hero-resumo dt {
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .06em;
	color: var(--lun-texto-suave);
	white-space: nowrap;
}

.hero-resumo dd {
	margin: 0;
	color: var(--lun-texto);
	font-size: .95rem;
	line-height: 1.5;
}

.hero-resumo dd strong { font-weight: 700; color: var(--lun-azul); }
.hero-resumo .woocommerce-Price-amount { font-weight: inherit; }

.hero-acao {
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
}

.hero-nota-pagamento {
	color: var(--lun-texto-suave);
	font-size: .9rem;
}

/* Cartaz: moldura simples, sem gradiente dourado. */
.hero-moldura {
	padding: 10px;
	background: var(--lun-fundo);
	border: 1px solid var(--lun-linha);
	border-radius: var(--raio);
	box-shadow: var(--lun-sombra-cartaz);
	max-width: 420px;
	margin-left: auto;
	justify-self: end;
}

.hero-moldura::before,
.hero-moldura::after { content: none; }

.hero-img {
	display: block;
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	object-position: center 35%;
	border-radius: 0;
}

/* ---------- 12.6 SEÇÕES DA HOME ---------- */

.secao-sessoes {
	background: var(--lun-fundo-2);
	border-top: 1px solid var(--lun-linha);
	padding: 64px 0;
}

.secao-setores {
	background: var(--lun-fundo);
	padding: 64px 0;
}

.secao-local {
	background: var(--lun-fundo-2);
	border-top: 1px solid var(--lun-linha);
	padding: 64px 0;
}

.secao-titulo {
	font-size: clamp(1.75rem, 3.2vw, 2.5rem);
	font-weight: 600;
	color: var(--lun-azul);
	margin: 0 0 1rem;
}

.secao-sessoes .container { max-width: 736px; }

/* ---------- 12.7 AGENDA ---------- */

.lun-agenda-mes {
	font-family: var(--fonte-corpo);
	font-size: .7rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--lun-texto-suave);
	border-bottom: 1px solid var(--lun-linha);
	padding-bottom: .5rem;
	margin: 1.5rem 0 1rem;
}

.lun-agenda-dia {
	display: grid;
	grid-template-columns: 88px 1fr auto;
	align-items: center;
	gap: 20px;
	background: var(--lun-fundo);
	border: 1px solid var(--lun-linha);
	border-left: 1px solid var(--lun-linha); /* fora o filete dourado */
	border-radius: var(--raio);
	padding: 16px 20px;
	margin-bottom: 8px;
	box-shadow: none;
}

.lun-agenda-semana {
	display: block;
	font-size: .65rem;
	font-weight: 700;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--lun-dourado);
}

.lun-agenda-numero {
	display: block;
	font-family: var(--fonte-titulo);
	font-size: 1.75rem;
	font-weight: 600;
	color: var(--lun-azul);
	line-height: 1.1;
}

.lun-agenda-mes-curto {
	display: block;
	font-size: .7rem;
	color: var(--lun-texto-suave);
}

.lun-agenda-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

/* Horário é a escolha real do cliente: vira botão. */
.lun-chip-horario {
	display: inline-block;
	background: var(--lun-azul);
	border: 1px solid var(--lun-azul);
	color: var(--lun-branco);
	font-family: var(--fonte-titulo);
	font-size: 1.25rem;
	font-weight: 500;
	padding: 6.4px 14.4px;
	min-width: 76px;
	text-align: center;
	border-radius: var(--raio);
	box-shadow: none;
	transition: background var(--trans), border-color var(--trans);
}

.lun-chip-horario:hover {
	background: var(--lun-dourado);
	border-color: var(--lun-dourado);
	color: var(--lun-branco);
}

.lun-agenda-preco {
	text-align: right;
	line-height: 1.35;
}

.lun-agenda-preco .lun-preco-prata {
	display: block;
	font-size: .75rem;
	color: var(--lun-texto-suave);
}

.lun-agenda-preco .lun-preco-ouro {
	display: block;
	font-size: .9rem;
	font-weight: 700;
	color: var(--lun-azul);
}

.lun-agenda-selo-grupo {
	display: inline-block;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--lun-dourado);
	border: 0;
}

/* ---------- 12.8 SETORES ---------- */

.setores-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
	max-width: 860px;
	margin: 0 auto;
}

.setor-card {
	position: relative;
	padding: 36px 32px;
	border-radius: var(--raio);
	box-shadow: none;
	/* Alinhado à esquerda: o divisor de 60px sob o nome só faz
	   sentido ancorado numa margem, e o olho lê preço e botão na
	   mesma coluna do nome. O desenho antigo centralizava tudo. */
	text-align: left;
}

.setor-card .setor-nome,
.setor-card .setor-descricao,
.setor-card .setor-preco { text-align: left; }

/* O card é um flex column vindo da base antiga, com align-items:center.
   text-align sozinho NÃO desfaz isso: quem centraliza as caixas (o
   divisor, o botão, o badge) é o align-items, não o alinhamento de
   texto. */
.setor-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: .5rem;
}

/* HOVER — legibilidade.
   A base antiga (seções 9 e 10) clareava o fundo no hover:
   .setor-card:hover pintava rgba(255,255,255,.09) e
   .setor-card--ouro:hover pintava rgba(212,160,23,.18). No desenho
   ESCURO isso era um realce sutil; no card Ouro AZUL da repaginação
   virava um fundo bege claro com o texto dourado-claro e branco por
   cima — ilegível. Como :hover é mais específico que a classe, as
   regras antigas venciam mesmo com a camada nova depois.
   Aqui o hover não mexe no fundo do Ouro: escurece de leve, mantendo
   o contraste do texto claro. */
.setor-card:hover {
	transform: none;
	box-shadow: none;
}

.setor-card--prata:hover {
	background: var(--lun-fundo);
	border-color: var(--lun-dourado);
}

.setor-card--ouro:hover {
	background: var(--lun-azul-2);
	border-color: var(--lun-azul-2);
	box-shadow: none;
}

.setor-card--prata {
	background: var(--lun-fundo);
	border: 1px solid var(--lun-linha);
}

.setor-card--ouro {
	background: var(--lun-azul);
	border: 1px solid var(--lun-azul);
}

.setor-nome {
	font-family: var(--fonte-titulo);
	font-size: 1.625rem;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--lun-azul);
	margin: 0 0 .75rem;
}

.setor-nome--ouro { color: var(--lun-dourado-claro); }

.setor-divisor {
	width: 60px;
	height: 2px;
	background: #9AA3B2;
	border: 0;
	margin: 0 0 1rem;
}

.setor-divisor--ouro { background: var(--lun-dourado); }

.setor-descricao { color: var(--lun-texto-suave); margin: 0 0 1rem; }
.setor-card--ouro .setor-descricao { color: rgba(255, 255, 255, .75); }

.setor-preco {
	font-size: 1.375rem;
	font-weight: 700;
	color: var(--lun-azul);
	margin: 0 0 1.25rem;
}

.setor-preco--ouro { color: var(--lun-dourado-claro); }

.setor-card--ouro .btn-estreia {
	background: var(--lun-dourado);
	border-color: var(--lun-dourado);
}

/* Badge Premium: única pílula do projeto, e sem estrela. */
.setor-badge {
	display: inline-block;
	background: var(--lun-dourado);
	color: var(--lun-branco);
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	padding: 4px 12px;
	border-radius: 99px;
	margin-bottom: .75rem;
	box-shadow: none;
	/* A base antiga posicionava o badge como pílula flutuante:
	   position:absolute; left:50%; transform:translateX(-50%).
	   Zerar só o position deixava o TRANSFORM em pé, e o badge saía
	   meia-largura para fora da borda esquerda do card. */
	position: static;
	transform: none;
	top: auto;
	left: auto;
}

/* ---------- 12.9 ONDE ESTAMOS ---------- */

.local-grid {
	display: grid;
	grid-template-columns: 1fr 1.15fr;
	gap: 48px;
	align-items: center;
}

.local-cidade {
	font-family: var(--fonte-titulo);
	font-size: 1.9rem;
	font-weight: 500;
	color: var(--lun-texto);
	margin: 0 0 .5rem;
}

.local-endereco { color: var(--lun-texto-suave); margin: 0 0 1.5rem; }

.local-mapa {
	padding: 8px;
	background: var(--lun-fundo);
	border: 1px solid var(--lun-linha);
	border-radius: var(--raio);
	box-shadow: var(--lun-sombra-mapa);
	background-image: none;
}

.local-mapa::before, .local-mapa::after { content: none; }
.local-mapa iframe { display: block; border: 0; width: 100%; }

.secao-local .btn-estreia {
	background: var(--lun-azul);
	border-color: var(--lun-azul);
}

.secao-local .btn-estreia:hover {
	background: var(--lun-azul-2);
	border-color: var(--lun-azul-2);
}

/* ---------- 12.10 AVISO DO INFANTIL ---------- */
/* Prioridade do cliente: tem de ficar impossível de não ver. */

.lun-aviso-panfleto {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	padding: 20px 22px;
	background: var(--lun-aviso-fundo);
	border: 2px solid var(--lun-dourado);
	border-left: 8px solid var(--lun-dourado);
	border-radius: var(--raio);
	margin: 0 0 24px;
	color: var(--lun-texto);
	box-shadow: none;
	font-size: 1rem;
	line-height: 1.5;
}

/* Ícone "info" (Feather, 26px, traço 2.2) desenhado por máscara CSS:
   SVG inline não passa pelo wp_kses_post que os templates aplicam ao
   HTML do aviso, então o desenho mora aqui e a cor vem do background. */
.lun-aviso-panfleto::before {
	content: '';
	flex: none;
	width: 26px;
	height: 26px;
	margin-top: 2px;
	background: var(--lun-dourado);
	-webkit-mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' y1='16' x2='12' y2='12'/%3E%3Cline x1='12' y1='8' x2='12.01' y2='8'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' y1='16' x2='12' y2='12'/%3E%3Cline x1='12' y1='8' x2='12.01' y2='8'/%3E%3C/svg%3E") center / contain no-repeat;
}

.lun-aviso-corpo { flex: 1; min-width: 0; }
.lun-aviso-corpo p { margin: 0; }

.lun-aviso-panfleto > strong,
.lun-aviso-titulo {
	display: block;
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--lun-azul);
	margin-bottom: .25rem;
}

/* A frase-chave dentro do corpo é negrito INLINE, não bloco. */
.lun-aviso-panfleto p strong,
.lun-aviso-panfleto .lun-aviso-frase strong {
	display: inline;
	font-size: inherit;
	color: inherit;
	margin: 0;
}

/* ---------- 12.10b TELA "EM BREVE" ---------- */

.lun-embreve { padding: 56px 0 72px; }

.lun-embreve-titulo {
	font-family: var(--fonte-titulo);
	font-size: clamp(2.2rem, 4vw, 3.2rem);
	font-weight: 500;
	color: var(--lun-azul);
	margin: 0 0 1rem;
}

.lun-embreve-texto,
.lun-embreve-local {
	color: var(--lun-texto-suave);
	max-width: 64ch;
	margin: 0 0 1rem;
}

/* Os botões vinham em bloco, cada um ocupando a linha inteira. */
.lun-embreve-redes {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 1.5rem;
}

.lun-embreve-redes .btn-estreia,
.lun-embreve-redes .btn-setor-prata { margin: 0; }

/* ---------- 12.11 FOOTER ---------- */

.site-footer {
	background: var(--lun-azul);
	border-top: 4px solid var(--lun-dourado);
	color: rgba(255, 255, 255, .85);
	padding: 48px 0 28px;
}

.site-footer::before, .site-footer::after { content: none; }

.footer-grid {
	display: grid;
	grid-template-columns: 1.2fr 1fr 1fr;
	gap: 40px;
}

.footer-logo-nome {
	font-family: var(--fonte-titulo);
	font-size: 1.4rem;
	font-weight: 500;
	color: var(--lun-branco);
	text-transform: none;
	letter-spacing: 0;
}

.footer-descricao,
.footer-endereco { color: rgba(255, 255, 255, .85); }

.footer-titulo {
	font-family: var(--fonte-corpo);
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--lun-dourado-claro);
	margin: 0 0 1rem;
}

.site-footer a { color: rgba(255, 255, 255, .85); }
.site-footer a:hover { color: var(--lun-dourado-claro); }

.footer-social { list-style: none; margin: 0; padding: 0; }
.footer-social li { margin-bottom: .5rem; }

.footer-bottom {
	border-top: 1px solid rgba(255, 255, 255, .15);
	margin-top: 36px;
	padding-top: 20px;
	color: rgba(255, 255, 255, .6);
	font-size: .875rem;
}

.footer-bottom a { color: rgba(255, 255, 255, .6); }
.footer-bottom a:hover { color: var(--lun-dourado-claro); }

/* ---------- 12.12 PÁGINAS INTERNAS ---------- */

.lun-pagina-cabecalho {
	background: var(--lun-fundo-2);
	border-bottom: 1px solid var(--lun-linha);
	padding: 40px 0 36px;
}

.lun-breadcrumb {
	font-size: .85rem;
	color: var(--lun-texto-suave);
	margin-bottom: .75rem;
}

.lun-breadcrumb a { color: var(--lun-texto-suave); }
.lun-breadcrumb a:hover { color: var(--lun-dourado); }

.lun-pagina-titulo {
	font-family: var(--fonte-titulo);
	font-size: clamp(2.2rem, 4vw, 3.2rem);
	font-weight: 500;
	line-height: 1.1;
	color: var(--lun-azul);
	margin: 0 0 .5rem;
}

.lun-pagina-sub {
	font-size: 1.05rem;
	color: var(--lun-texto-suave);
	max-width: 64ch;
	margin: 0;
}

/* O banner escuro da sessão saiu do template; estas regras da base
   antiga ficariam órfãs e podem voltar a pintar bloco escuro se
   algum template ainda emitir a classe. */
.sessao-banner,
.sessao-banner-chip,
.sessao-banner-supra { display: none; }

.lun-card {
	background: var(--lun-fundo);
	border: 1px solid var(--lun-linha);
	border-radius: var(--raio);
	padding: 28px;
}

.woocommerce-breadcrumb {
	font-size: .85rem;
	color: var(--lun-texto-suave);
}

/* Inputs: brancos, cantos de 2px, sem sombra. */
input[type="text"], input[type="email"], input[type="tel"],
input[type="password"], input[type="number"], select, textarea,
.input-text {
	background: var(--lun-branco);
	border: 1px solid var(--lun-linha);
	border-radius: var(--raio);
	padding: 13px 14px;
	font-family: var(--fonte-corpo);
	color: var(--lun-texto);
	box-shadow: none;
}

input:focus, select:focus, textarea:focus, .input-text:focus {
	outline: none;
	border-color: var(--lun-azul);
	box-shadow: 0 0 0 3px rgba(15, 27, 61, .1);
}

label { font-size: .85rem; font-weight: 600; color: var(--lun-texto); }

/* Painéis laterais das internas (o header sticky tem ~80px). */
.lun-painel-lateral { position: sticky; top: 96px; }

/* ---------- 12.14 CARRINHO ---------- */

.lun-carrinho-grid {
	display: grid;
	grid-template-columns: 1fr 360px;
	gap: 48px;
	align-items: start;
}

.lun-carrinho-grid .cart-collaterals {
	display: block;
	position: sticky;
	top: 96px;
}

/* Tabela: cabeçalho pequeno com linha azul, linhas com respiro. */
.woocommerce-cart-form table.shop_table {
	width: 100%;
	border-collapse: collapse;
	border: 0;
	background: none;
}

.woocommerce-cart-form table.shop_table thead th {
	font-family: var(--fonte-corpo);
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--lun-texto-suave);
	text-align: left;
	padding: 0 8px 10px;
	border: 0;
	border-bottom: 2px solid var(--lun-azul);
	background: none;
}

.woocommerce-cart-form table.shop_table td {
	padding: 18px 8px;
	border: 0;
	border-bottom: 1px solid var(--lun-linha);
	vertical-align: top;
	background: none;
}

.woocommerce-cart-form .product-remove { width: 32px; padding-left: 0; }

.woocommerce-cart-form .product-remove .remove {
	display: inline-block;
	width: auto;
	height: auto;
	line-height: 1;
	font-size: 1.4rem;
	color: var(--lun-texto-suave);
	background: none;
	border: 0;
	border-radius: 0;
}

.woocommerce-cart-form .product-remove .remove:hover { color: var(--lun-erro); background: none; }

.lun-cart-nome {
	font-weight: 600;
	color: var(--lun-azul);
	text-decoration: none;
}

/* Meta da variação (Setor, Tipo, Horário, Validação) — uma linha discreta. */
.woocommerce-cart-form dl.variation,
.woocommerce-checkout-review-order-table dl.variation {
	font-size: .85rem;
	color: var(--lun-texto-suave);
	margin: 6px 0 0;
	line-height: 1.5;
}

.woocommerce-cart-form dl.variation dt,
.woocommerce-cart-form dl.variation dd,
.woocommerce-checkout-review-order-table dl.variation dt,
.woocommerce-checkout-review-order-table dl.variation dd {
	display: inline;
	margin: 0;
	padding: 0;
	font-weight: 400;
}

.woocommerce-cart-form dl.variation dd,
.woocommerce-checkout-review-order-table dl.variation dd { margin-right: 10px; }

.woocommerce-cart-form dl.variation dd p,
.woocommerce-checkout-review-order-table dl.variation dd p { display: inline; margin: 0; }

/* Linha do Infantil: a "Validação" (o convite) em dourado. */
.lun-item-infantil dl.variation dd:last-of-type,
.lun-item-infantil dl.variation dt:last-of-type {
	color: var(--lun-dourado);
	font-weight: 700;
}

.woocommerce-cart-form .product-price,
.woocommerce-cart-form .product-subtotal { white-space: nowrap; }

.woocommerce-cart-form .product-subtotal { font-weight: 700; text-align: right; }

.woocommerce-cart-form .product-quantity .quantity { display: inline-block; }

.woocommerce-cart-form .product-quantity input.qty {
	width: 56px;
	padding: 10px 6px;
	text-align: center;
}

.lun-carrinho-acoes {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
	margin-top: 20px;
}

.lun-continuar { color: var(--lun-texto-suave); font-size: .95rem; }
.lun-continuar:hover { color: var(--lun-dourado); }

.lun-btn-atualizar,
.woocommerce-cart-form button.lun-btn-atualizar {
	background: transparent;
	border: 2px solid var(--lun-azul);
	color: var(--lun-azul);
	font-family: var(--fonte-corpo);
	font-weight: 700;
	font-size: .875rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: 12px 26px;
	border-radius: var(--raio);
	box-shadow: none;
	cursor: pointer;
}

.lun-btn-atualizar:hover,
.woocommerce-cart-form button.lun-btn-atualizar:hover {
	background: var(--lun-azul);
	color: var(--lun-branco);
}

/* Resumo (card sticky).
   O woocommerce-layout.css do plugin manda `.woocommerce .cart-collaterals
   .cart_totals { float:right; width:48% }` (0,3,0) — o card nascia com
   metade da coluna. O seletor abaixo tem 0,4,0 de propósito. */
.woocommerce .lun-carrinho-grid .cart-collaterals .cart_totals,
.cart_totals.lun-resumo {
	float: none;
	width: auto;
	max-width: none;
	background: var(--lun-fundo);
	border: 1px solid var(--lun-linha);
	border-radius: var(--raio);
	padding: 28px;
	box-shadow: none;
}

.lun-resumo-titulo,
.lun-checkout-titulo,
.lun-thankyou-section-title {
	font-family: var(--fonte-titulo);
	font-size: 1.6rem;
	font-weight: 500;
	color: var(--lun-azul);
	margin: 0 0 1rem;
	display: block;
}

.lun-checkout-titulo::before { content: none; }

.lun-resumo-tabela {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 20px;
}

.lun-resumo-tabela th,
.lun-resumo-tabela td {
	padding: 10px 0;
	border: 0;
	border-bottom: 1px solid var(--lun-linha);
	font-weight: 400;
	font-size: .95rem;
	color: var(--lun-texto);
	background: none;
}

.lun-resumo-tabela th { text-align: left; color: var(--lun-texto-suave); padding-right: 12px; }
.lun-resumo-tabela td { text-align: right; white-space: nowrap; }

.lun-resumo-tabela .order-total th,
.lun-resumo-tabela .order-total td {
	border: 0;
	padding-top: 16px;
	color: var(--lun-azul);
}

.lun-resumo-tabela .order-total th { font-weight: 700; }

.lun-resumo-tabela .order-total td {
	font-family: var(--fonte-titulo);
	font-size: 2rem;
	font-weight: 500;
}

.lun-btn-cheio,
.wc-proceed-to-checkout .checkout-button {
	display: block;
	width: 100%;
	text-align: center;
	background: var(--lun-dourado);
	border: 1px solid var(--lun-dourado);
	color: var(--lun-branco);
	font-size: 1rem;
	padding: 16px 24px;
	margin: 0;
}

.wc-proceed-to-checkout::after { content: none; }

.lun-resumo-nota {
	font-size: .85rem;
	color: var(--lun-texto-suave);
	text-align: center;
	margin: 12px 0 0;
}

/* Carrinho vazio. */
.cart-empty.woocommerce-info { background: none; border: 0; padding: 0; font-size: 1.1rem; color: var(--lun-texto-suave); }
.return-to-shop .lun-btn-primario { display: inline-block; }

/* ---------- 12.15 FINALIZAR COMPRA ---------- */

.woocommerce-checkout .lun-checkout-grid {
	display: grid;
	grid-template-columns: 1fr 400px;
	gap: 48px;
	align-items: start;
}

.woocommerce-checkout .lun-checkout-grid > .lun-checkout-esquerda { grid-column: 1; }

/* Resumo + pagamento: coluna direita inteira, sticky, um card sobre o outro. */
.woocommerce-checkout .lun-checkout-grid > #order_review {
	grid-column: 2;
	grid-row: 1 / span 4;
	display: block;
	position: sticky;
	top: 96px;
	background: none;
	border: 0;
	padding: 0;
}

.woocommerce-checkout .lun-checkout-review > .woocommerce-checkout-review-order-table,
.woocommerce-checkout .lun-checkout-review > #payment {
	grid-column: auto;
	grid-row: auto;
	position: static;
}

.lun-checkout-card { margin-bottom: 24px; }
.lun-checkout-card > :last-child { margin-bottom: 0; }

.woocommerce-checkout-review-order-table {
	width: 100%;
	border-collapse: collapse;
	border: 0;
	background: none;
	margin: 0;
}

.woocommerce-checkout-review-order-table thead { display: none; }

.woocommerce-checkout-review-order-table td,
.woocommerce-checkout-review-order-table th {
	padding: 10px 0;
	border: 0;
	border-bottom: 1px solid var(--lun-linha);
	background: none;
	font-weight: 400;
	font-size: .95rem;
	vertical-align: top;
}

.woocommerce-checkout-review-order-table tbody .product-name { font-weight: 600; color: var(--lun-azul); }
.woocommerce-checkout-review-order-table .product-quantity { font-weight: 600; color: var(--lun-texto-suave); }
.woocommerce-checkout-review-order-table .product-total,
.woocommerce-checkout-review-order-table tfoot td { text-align: right; white-space: nowrap; }
.woocommerce-checkout-review-order-table tfoot th { text-align: left; color: var(--lun-texto-suave); }

.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order-table .order-total td {
	border: 0;
	padding-top: 14px;
	color: var(--lun-azul);
}

.woocommerce-checkout-review-order-table .order-total td {
	font-family: var(--fonte-titulo);
	font-size: 1.8rem;
	font-weight: 500;
}

.woocommerce-checkout-review-order-table .order-total th { font-weight: 700; color: var(--lun-azul); }

/* Pagamento: métodos como radio-cards. */
.woocommerce-checkout #payment,
.woocommerce-checkout .lun-checkout-review > #payment {
	background: none;
	border: 0;
	border-radius: 0;
	padding: 0;
	box-shadow: none;
}

.woocommerce-checkout #payment ul.payment_methods {
	list-style: none;
	margin: 0 0 16px;
	padding: 0;
	border: 0;
}

.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method {
	border: 2px solid var(--lun-linha);
	border-radius: var(--raio);
	background: var(--lun-fundo);
	padding: 14px 16px;
	margin: 0 0 10px;
	line-height: 1.4;
}

.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method:has(input:checked) {
	border-color: var(--lun-azul);
	background: var(--lun-branco);
}

.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method > label {
	display: flex;
	align-items: center;
	gap: 10px;
	font-weight: 600;
	font-size: 1rem;
	margin: 0;
	cursor: pointer;
}

.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method input[type="radio"] {
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: var(--lun-azul);
	flex: none;
}

.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method img { max-height: 24px; }

.woocommerce-checkout #payment div.payment_box {
	background: none;
	border: 0;
	padding: 8px 0 0 28px;
	margin: 0;
	font-size: .9rem;
	color: var(--lun-texto-suave);
}

.woocommerce-checkout #payment div.payment_box::before { content: none; }

.woocommerce-checkout #payment .place-order { padding: 0; margin: 0; }

.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper { font-size: .9rem; margin: 12px 0; }

.woocommerce-checkout #payment #place_order {
	display: block;
	width: 100%;
	background: var(--lun-dourado);
	border: 1px solid var(--lun-dourado);
	color: var(--lun-branco);
	font-family: var(--fonte-corpo);
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: 16px 24px;
	border-radius: var(--raio);
	box-shadow: none;
	margin-top: 8px;
}

.woocommerce-checkout #payment #place_order:hover { background: #B0850F; border-color: #B0850F; }
.woocommerce-checkout #payment .place-order::after { content: none; }

.woocommerce-checkout .lun-checkout-review .lun-aviso-panfleto { margin-bottom: 16px; padding: 14px 16px; }

/* Campos. */
.woocommerce-checkout .form-row label {
	display: block;
	font-size: .85rem;
	font-weight: 600;
	color: var(--lun-texto);
	margin-bottom: 6px;
}

.woocommerce-checkout .form-row .required { color: var(--lun-dourado); text-decoration: none; }

.woocommerce-checkout .woocommerce-billing-fields h3 { display: none; }

/* ---------- 12.16 PEDIDO RECEBIDO ---------- */

.lun-container--estreito { max-width: 820px; }

.lun-order-received .lun-thankyou-banner,
.lun-order-received .lun-obrigado-topo {
	background: none;
	border: 0;
	padding: 0;
	margin: 0 0 32px;
	box-shadow: none;
}

.lun-order-received .lun-pagina-titulo { margin-bottom: .5rem; }
.lun-order-received .lun-pagina-sub { margin-bottom: 0; }

.lun-thankyou-overview {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 12px 36px;
	margin: 24px 0 0;
	padding: 20px 0 0;
	border-top: 1px solid var(--lun-linha);
}

.lun-thankyou-overview li { font-size: .95rem; margin: 0; padding: 0; border: 0; }

.lun-ov-label {
	display: block;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--lun-texto-suave);
	margin-bottom: 2px;
}

.lun-thankyou-pix,
.lun-thankyou-detalhes {
	background: var(--lun-fundo);
	border: 1px solid var(--lun-linha);
	border-radius: var(--raio);
	padding: 28px;
	margin: 0 0 24px;
	box-shadow: none;
}

.lun-order-received .lun-aviso-panfleto { margin-bottom: 24px; }

/* Tabela de itens do pedido. */
.woocommerce-order-details table.shop_table,
.woocommerce-table--order-details {
	width: 100%;
	border-collapse: collapse;
	border: 0;
	background: none;
}

.woocommerce-order-details table.shop_table th,
.woocommerce-order-details table.shop_table td {
	padding: 12px 0;
	border: 0;
	border-bottom: 1px solid var(--lun-linha);
	background: none;
	text-align: left;
	font-weight: 400;
}

.woocommerce-order-details table.shop_table thead th {
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--lun-texto-suave);
	border-bottom: 2px solid var(--lun-azul);
	padding-top: 0;
}

.woocommerce-order-details table.shop_table td.woocommerce-table__product-total,
.woocommerce-order-details table.shop_table tfoot td { text-align: right; }

.woocommerce-order-details table.shop_table tfoot tr:last-child th,
.woocommerce-order-details table.shop_table tfoot tr:last-child td {
	border: 0;
	color: var(--lun-azul);
	font-weight: 700;
}

.woocommerce-order-details__title { display: none; }

.lun-obrigado-acoes {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 20px;
}

/* ---------- 12.13 RESPONSIVO ---------- */

@media (max-width: 900px) {

	.hero-estreia-grid,
	.setores-grid,
	.local-grid,
	.footer-grid {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.hero-moldura { margin: 0 auto; justify-self: center; }

	.lun-agenda-dia {
		grid-template-columns: 1fr;
		gap: 12px;
	}

	.lun-agenda-preco { text-align: left; }

	.lun-painel-lateral { position: static; }

	.lun-carrinho-grid,
	.woocommerce-checkout .lun-checkout-grid { grid-template-columns: 1fr; gap: 32px; }

	.lun-carrinho-grid .cart-collaterals,
	.woocommerce-checkout .lun-checkout-grid > #order_review {
		position: static;
		grid-column: auto;
		grid-row: auto;
	}
}

@media (max-width: 560px) {
	.hero-estreia { padding: 40px 0 48px; }
	.hero-resumo { grid-template-columns: 1fr; gap: 4px 0; }
	.hero-resumo dd { margin-bottom: .75rem; }
	.setor-card { padding: 28px 22px; }
}

/* ============================================================
   13. LOGO TIPOGRÁFICO (enquanto não há arquivo de marca)
   ============================================================
   O cabeçalho cai para o nome do site quando images/logo.png não
   existe (ver header.php). Isto é o que o visitante vê até a marca
   do circo entrar no tema — precisa parecer intencional, não falta.
   ============================================================ */
.site-logo--texto {
	text-decoration: none;
}

.logo-texto {
	font-family: var(--fonte-titulo, Georgia, serif);
	font-weight: 900;
	font-size: clamp(1.15rem, 1rem + 1vw, 1.6rem);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	line-height: 1;
	color: var(--lun-dourado-claro, #FFDE8A);
	white-space: nowrap;
}

.site-logo--texto:hover .logo-texto,
.site-logo--texto:focus-visible .logo-texto {
	color: var(--lun-branco, #FFFFFF);
}
