/*
Theme Name: Funerária Municipal
Theme URI: https://funerariamunicipal.com.br
Author: Funerária Municipal
Author URI: https://funerariamunicipal.com.br
Description: Tema clássico do WordPress, desenvolvido sob medida para a Funerária Municipal. Focado em orientação, acolhimento e atendimento rápido para famílias em momentos de necessidade. Construído em PHP, HTML5, CSS3 e JavaScript puro, sem page builders.
Version: 1.5.1
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: funeraria-municipal
Tags: custom-colors, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

Funerária Municipal WordPress Theme, Copyright funerariamunicipal.com.br
Funerária Municipal is distributed under the terms of the GNU GPL.
*/

/* =========================================================
   0. VARIÁVEIS DE COR E DESIGN TOKENS
   ========================================================= */
:root{
	/* Paleta principal */
	--cor-petroleo:        #6F8FA3;   /* lavanda principal - marca / navbar / detalhes */
	--cor-petroleo-escuro: #405D6D;   /* ameixa suave - profundidade / rodapé */
	--cor-petroleo-claro:  #C9D9E2;   /* lavanda clara - hover / apoio */
	--cor-creme:           #E5EBEF;   /* rosé claro - seções alternadas */
	--cor-offwhite:        #F8FAFB;   /* off-white - fundo principal */
	--cor-cinza-quente:    #71818A;   /* cinza rosado - texto secundário */
	--cor-cinza-linha:     #DDE5EA;   /* linhas e bordas discretas */
	--cor-texto:           #3D464C;   /* texto principal */
	--cor-destaque:        #C9D9E2;   /* lavanda clara - destaque */
	--cor-destaque-escuro: #6F8FA3;   /* lavanda principal em hover/active */
	--cor-branco:          #FFFFFF;

	/* Tipografia */
	--fonte-titulo: 'Fraunces', Georgia, 'Times New Roman', serif;
	--fonte-corpo:  'Public Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;

	/* Escala tipográfica */
	--fs-display: clamp(2.4rem, 4.6vw, 3.8rem);
	--fs-h1:      clamp(2rem, 3.4vw, 2.8rem);
	--fs-h2:      clamp(1.6rem, 2.6vw, 2.2rem);
	--fs-h3:      clamp(1.25rem, 1.8vw, 1.5rem);
	--fs-servico: clamp(1.15rem, 1.6vw, 1.35rem);
	--fs-corpo:   1.05rem;
	--fs-pequeno: 0.9rem;

	/* Espaçamentos */
	--espaco-secao: clamp(3.5rem, 7vw, 6.5rem);
	--container-max: 1180px;
	--raio: 6px;
	--raio-grande: 14px;

	/* Sombra discreta (uso comedido) */
	--sombra-suave: 0 10px 30px -18px rgba(34, 55, 64, 0.35);

	/* Transições */
	--transicao: 0.25s ease;
}

/* =========================================================
   1. RESET BÁSICO
   ========================================================= */
*, *::before, *::after{ box-sizing: border-box; }

html{ scroll-behavior: smooth; }

@media (prefers-reduced-motion: reduce){
	html{ scroll-behavior: auto; }
	*, *::before, *::after{
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

body{
	margin: 0;
	background: var(--cor-offwhite);
	color: var(--cor-texto);
	font-family: var(--fonte-corpo);
	font-size: var(--fs-corpo);
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}

img{ max-width: 100%; height: auto; display: block; }

ul, ol{ margin: 0; padding: 0; list-style: none; }

a{ color: inherit; text-decoration: none; }

button{ font-family: inherit; cursor: pointer; }

input, textarea, select, button{ font-family: inherit; font-size: inherit; }

figure{ margin: 0; }

table{ border-collapse: collapse; width: 100%; }

/* Foco visível para acessibilidade */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible{
	outline: 3px solid var(--cor-destaque);
	outline-offset: 2px;
}

/* =========================================================
   2. TIPOGRAFIA
   ========================================================= */
h1, h2, h3, h4, h5, h6{
	font-family: var(--fonte-titulo);
	color: var(--cor-petroleo);
	line-height: 1.15;
	margin: 0 0 0.5em;
	font-weight: 600;
}

h1{ font-size: var(--fs-h1); }
h2{ font-size: var(--fs-h2); }
h3{ font-size: var(--fs-h3); }

p{ margin: 0 0 1.2em; max-width: 68ch; }

.texto-corpo p:last-child{ margin-bottom: 0; }

.cor-destaque{ color: var(--cor-destaque); }

.subtitulo{
	display: block;
	font-family: var(--fonte-corpo);
	font-weight: 600;
	color: var(--cor-destaque-escuro);
	font-size: 0.95rem;
	letter-spacing: 0.03em;
	margin-bottom: 0.9rem;
}

.texto-secundario{
	color: var(--cor-cinza-quente);
}

/* =========================================================
   3. LAYOUT BASE / CONTAINER
   ========================================================= */
.container{
	width: 100%;
	max-width: var(--container-max);
	margin-inline: auto;
	padding-inline: 1.5rem;
}

.secao{
	padding-block: var(--espaco-secao);
}

.secao--creme{ background: var(--cor-creme); }
.secao--offwhite{ background: var(--cor-offwhite); }

.cabecalho-secao{
	max-width: 640px;
	margin-bottom: 2.75rem;
}

.cabecalho-secao--centro{
	margin-inline: auto;
	text-align: center;
}

/* =========================================================
   4. BOTÕES / CTAs
   ========================================================= */
.btn{
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	padding: 0.85rem 1.7rem;
	border-radius: var(--raio);
	font-weight: 600;
	font-size: 0.98rem;
	border: 1.5px solid transparent;
	transition: transform var(--transicao), background-color var(--transicao), color var(--transicao), border-color var(--transicao);
	white-space: nowrap;
}

.btn svg{ width: 1.15em; height: 1.15em; flex-shrink: 0; }

.btn:hover{ transform: translateY(-2px); }

.btn-primario{
	background: var(--cor-destaque);
	color: var(--cor-petroleo-escuro);
}
.btn-primario:hover{ background: var(--cor-destaque-escuro); color: var(--cor-branco); }

.btn-secundario{
	background: transparent;
	border-color: currentColor;
	color: var(--cor-petroleo);
}
.btn-secundario:hover{ background: var(--cor-petroleo); color: var(--cor-branco); }

.btn-claro{
	background: var(--cor-offwhite);
	color: var(--cor-petroleo-escuro);
}
.btn-claro:hover{ background: var(--cor-destaque); }

.btn-whatsapp{
	background: var(--cor-petroleo);
	color: var(--cor-offwhite);
}
.btn-whatsapp:hover{ background: var(--cor-petroleo-escuro); }

.btn-outline-claro{
	background: transparent;
	border-color: rgba(250,247,241,0.55);
	color: var(--cor-offwhite);
}
.btn-outline-claro:hover{ background: rgba(250,247,241,0.12); border-color: var(--cor-offwhite); }

.grupo-cta{
	display: flex;
	flex-wrap: wrap;
	gap: 0.9rem;
	align-items: center;
}

/* Skip link acessibilidade */
.skip-link{
	position: absolute;
	left: -9999px;
	top: 0;
	background: var(--cor-petroleo);
	color: var(--cor-offwhite);
	padding: 0.9rem 1.4rem;
	z-index: 10000;
	border-radius: 0 0 var(--raio) 0;
}
.skip-link:focus{ left: 0; }

.screen-reader-text{
	position: absolute;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(1px,1px,1px,1px);
	white-space: nowrap;
}