/*
Theme Name: Vigora Longevidade
Theme URI: https://vigora.com.br
Author: Vigora
Description: Tema institucional da Vigora — Economia da Longevidade. Tema de blocos acessível, pensado para leitores longevos: letras grandes, alto contraste, botões amplos e controle de tamanho do texto. Todas as seções da apresentação institucional estão disponíveis como padrões editáveis (Inserir › Padrões › Vigora), e a seção final traz um formulário pronto para o Contact Form 7.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: vigora
Tags: block-theme, full-site-editing, accessibility-ready, one-column, block-patterns, custom-logo, editor-style
*/

/* ==========================================================================
   Estilos complementares. Cores, fontes e tamanhos ficam no theme.json
   (Aparência › Editor › Estilos). Aqui ficam os estilos das seções.
   ========================================================================== */

:root {
	--vg-navy: #061530;
	--vg-navy-2: #0E2653;
	--vg-navy-3: #2A3E66;
	--vg-gold: #C9A45C;
	--vg-gold-text: #7A5C22;
	--vg-cream: #FBF9F4;
	--vg-sand: #F3EFE6;
	--vg-sand-2: #E8E1D2;
	--vg-ink: #232B3E;
	--vg-slate: #4A5468;
	--vg-mist: #D3D8E2;
	--vg-radius: 6px;
	--vg-section-pad: clamp(3.5rem, 8vw, 6.5rem);
}

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

/* Tamanho de texto ajustável (botões A− A A+) */
html.vg-fs-1 { font-size: 112.5%; }
html.vg-fs-2 { font-size: 125%; }
html.vg-fs-3 { font-size: 140%; }

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

/* Foco bem visível para teclado */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--vg-gold);
	outline-offset: 3px;
	border-radius: 2px;
	box-shadow: 0 0 0 6px rgba(6, 21, 48, .35);
}

/* Links legíveis */
a { text-underline-offset: .18em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }

/* Botões: área de toque generosa */
.wp-element-button,
.wp-block-button__link {
	min-height: 56px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease, transform .2s ease;
}
.wp-block-button__link:hover { transform: translateY(-1px); }
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: currentColor;
	border: 2px solid currentColor;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--vg-gold);
	border-color: var(--vg-gold);
	color: var(--vg-navy);
}

/* Seções da página não ganham margem entre si */
.wp-block-post-content > .alignfull,
.entry-content > .alignfull { margin-block: 0; }
main.wp-block-group,
.wp-site-blocks > footer,
.wp-site-blocks > main { margin-block-start: 0; }

/* ==========================================================================
   Estilos de bloco: Seções (Grupo)
   ========================================================================== */
.is-style-secao-clara,
.is-style-secao-areia,
.is-style-secao-escura {
	position: relative;
	overflow: hidden;
	padding-top: var(--vg-section-pad) !important;
	padding-bottom: var(--vg-section-pad) !important;
}
.is-style-secao-clara { background: var(--vg-cream); color: var(--vg-ink); }
.is-style-secao-areia { background: var(--vg-sand); color: var(--vg-ink); }
.is-style-secao-escura {
	background: radial-gradient(ellipse at 18% 30%, #102a5c 0%, #0a1d42 45%, var(--vg-navy) 100%);
	color: #E6E9F0;
}
.is-style-secao-escura :where(h1, h2, h3, h4, h5, h6) { color: var(--vg-cream); }
.is-style-secao-escura a:where(:not(.wp-element-button)) { color: var(--vg-gold); }

/* Anel dourado decorativo (adicione a classe "vg-anel" ao grupo) */
.vg-anel > * { position: relative; z-index: 1; }
.vg-anel::after {
	content: "";
	position: absolute;
	z-index: 0;
	width: clamp(260px, 34vw, 520px);
	aspect-ratio: 1;
	top: clamp(-80px, -4vw, -20px);
	right: clamp(-140px, -6vw, -40px);
	background: url("assets/images/anel-dourado.png") center / contain no-repeat;
	opacity: .14;
	pointer-events: none;
}
.is-style-secao-escura.vg-anel::after { opacity: .22; }

/* Largura de leitura confortável para textos de introdução */
.vg-intro { max-width: 46rem; margin-left: 0 !important; }
.vg-intro.has-text-align-center, .vg-intro.vg-centro { margin-inline: auto !important; }

/* ==========================================================================
   Estilos de bloco: Cartão (Grupo / Coluna)
   ========================================================================== */
.is-style-cartao {
	background: #fff;
	border-top: 3px solid var(--vg-gold);
	border-radius: 0 0 var(--vg-radius) var(--vg-radius);
	padding: clamp(1.5rem, 3vw, 2.25rem) !important;
	box-shadow: 0 1px 2px rgba(6, 21, 48, .06), 0 8px 24px -12px rgba(6, 21, 48, .18);
	height: 100%;
}
.is-style-secao-escura .is-style-cartao {
	background: rgba(14, 38, 83, .85);
	border: 1px solid rgba(201, 164, 92, .35);
	border-top: 3px solid var(--vg-gold);
	box-shadow: none;
	color: #E6E9F0;
}
.is-style-cartao > :first-child { margin-top: 0; }
.is-style-cartao > :last-child { margin-bottom: 0; }
.is-style-cartao :where(h3) { font-size: clamp(1.5rem, 2.4vw, 1.875rem); margin-top: .35rem; }

/* Cartão de destaque: fundo azul mesmo em seção clara */
.is-style-cartao-destaque {
	background: var(--vg-navy);
	color: #E6E9F0;
	border-radius: var(--vg-radius);
	padding: clamp(1.75rem, 3.5vw, 2.75rem) !important;
	height: 100%;
}
.is-style-cartao-destaque :where(h1, h2, h3, h4) { color: var(--vg-cream); }
.is-style-cartao-destaque > :first-child { margin-top: 0; }
.is-style-cartao-destaque .is-style-sobretitulo { color: var(--vg-gold); }

/* ==========================================================================
   Estilos de bloco: Parágrafos
   ========================================================================== */
.is-style-sobretitulo {
	font-size: 1rem !important;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--vg-gold-text);
	margin-bottom: .25rem !important;
}
.is-style-secao-escura .is-style-sobretitulo { color: var(--vg-gold); }

.is-style-numero-destaque {
	font-family: var(--wp--preset--font-family--lora);
	font-size: clamp(2.5rem, 5vw, 3.5rem) !important;
	line-height: 1.05;
	font-weight: 500;
	color: var(--vg-navy);
	margin-bottom: .25rem !important;
}
.is-style-secao-escura .is-style-numero-destaque { color: var(--vg-cream); }

.is-style-citacao {
	font-family: var(--wp--preset--font-family--lora);
	font-style: italic;
	font-size: clamp(1.25rem, 2.2vw, 1.5rem) !important;
	line-height: 1.5;
	color: var(--vg-gold-text);
}
.is-style-secao-escura .is-style-citacao,
.is-style-cartao-destaque .is-style-citacao { color: var(--vg-gold); }

.is-style-numero-etapa {
	display: inline-grid;
	place-items: center;
	width: 3.25rem;
	height: 3.25rem;
	border: 2px solid var(--vg-gold);
	border-radius: 50%;
	font-family: var(--wp--preset--font-family--lora);
	font-size: 1.5rem !important;
	line-height: 1;
	color: var(--vg-gold-text);
	margin: 0 !important;
}
.is-style-secao-escura .is-style-numero-etapa,
.is-style-cartao-destaque .is-style-numero-etapa { color: var(--vg-gold); }

.vg-fonte { font-size: 1rem !important; color: var(--vg-slate); }
.is-style-secao-escura .vg-fonte { color: #B4BCCC; }

/* Linha dourada acima de números/ganhos */
.vg-linha-topo { border-top: 2px solid var(--vg-gold); padding-top: 1.5rem; }

/* ==========================================================================
   Lista com traços
   ========================================================================== */
.is-style-tracos { list-style: none; padding-left: 0 !important; }
.is-style-tracos > li { position: relative; padding-left: 1.75rem; margin-bottom: .6rem; }
.is-style-tracos > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .85em;
	width: 1rem;
	height: 2px;
	background: var(--vg-gold);
}

/* ==========================================================================
   Fotos
   ========================================================================== */
.vg-foto img { width: 100%; height: auto; border-radius: var(--vg-radius); object-fit: cover; }
.vg-foto-retrato img { aspect-ratio: 4 / 5; }
.vg-foto-paisagem img { aspect-ratio: 4 / 3; }
.vg-foto-quadrada img { aspect-ratio: 1; }
.vg-foto-moldura { position: relative; }
.vg-foto-moldura img { box-shadow: 18px 18px 0 -2px var(--vg-gold); }
.wp-block-image figcaption { font-size: 1rem; color: var(--vg-slate); }
.is-style-secao-escura .wp-block-image figcaption { color: #B4BCCC; }

/* ==========================================================================
   Cabeçalho
   ========================================================================== */
.vg-cabecalho {
	background: var(--vg-navy);
	color: var(--vg-cream);
	border-bottom: 1px solid rgba(201, 164, 92, .3);
}
.vg-cabecalho .wp-block-site-logo img { max-height: 64px; width: auto; }
.vg-cabecalho .wp-block-navigation { color: var(--vg-cream); }
.vg-cabecalho .wp-block-navigation a { text-decoration: none; padding-block: .5rem; }
.vg-cabecalho .wp-block-navigation a:hover { color: var(--vg-gold); text-decoration: underline; }
.vg-cabecalho .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--vg-navy) !important;
	color: var(--vg-cream) !important;
	font-size: 1.5rem;
}
.vg-cabecalho .wp-block-navigation__responsive-container-open,
.vg-cabecalho .wp-block-navigation__responsive-container-close {
	min-width: 48px; min-height: 48px; justify-content: center; align-items: center;
}
.vg-cabecalho .wp-block-navigation__responsive-container-open svg,
.vg-cabecalho .wp-block-navigation__responsive-container-close svg { width: 32px; height: 32px; }
.vg-cabecalho .wp-block-button__link { padding: .75rem 1.5rem; min-height: 48px; font-size: 1.0625rem; }

/* Controle de tamanho do texto */
.vg-tamanho-texto {
	display: inline-flex;
	align-items: center;
	gap: .25rem;
	font-size: 1rem;
	color: var(--vg-mist);
}
.vg-tamanho-texto span { margin-right: .35rem; }
.vg-tamanho-texto button {
	font: 600 1.0625rem/1 var(--wp--preset--font-family--poppins);
	min-width: 48px;
	min-height: 48px;
	background: transparent;
	color: var(--vg-cream);
	border: 1px solid rgba(211, 216, 226, .45);
	border-radius: var(--vg-radius);
	cursor: pointer;
}
.vg-tamanho-texto button:hover { border-color: var(--vg-gold); color: var(--vg-gold); }
.vg-tamanho-texto button[aria-pressed="true"] { background: var(--vg-gold); color: var(--vg-navy); border-color: var(--vg-gold); }
@media (max-width: 600px) { .vg-tamanho-texto span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } }

/* ==========================================================================
   Rodapé
   ========================================================================== */
.vg-rodape { background: var(--vg-navy); color: #C9CFDB; }
.vg-rodape :where(h2, h3, h4) { color: var(--vg-cream); }
.vg-rodape a { color: var(--vg-gold); }
.vg-rodape .wp-block-site-logo img { max-height: 80px; width: auto; }
.vg-rodape .vg-rodape-base { border-top: 1px solid rgba(201, 164, 92, .25); padding-top: 1.5rem; font-size: 1rem; }

/* ==========================================================================
   Perguntas frequentes (bloco Detalhes)
   ========================================================================== */
.wp-block-details {
	background: #fff;
	border-left: 3px solid var(--vg-gold);
	border-radius: 0 var(--vg-radius) var(--vg-radius) 0;
	padding: 1.25rem 1.5rem;
	box-shadow: 0 1px 2px rgba(6, 21, 48, .06);
}
.wp-block-details summary {
	cursor: pointer;
	font-family: var(--wp--preset--font-family--lora);
	font-size: 1.375rem;
	color: var(--vg-navy);
	min-height: 48px;
	display: flex;
	align-items: center;
}
.wp-block-details summary::marker { color: var(--vg-gold); }
.wp-block-details[open] summary { margin-bottom: .5rem; }

/* ==========================================================================
   Formulário (fallback do tema e Contact Form 7 com o mesmo visual)
   ========================================================================== */
.vg-form, .wpcf7-form { display: grid; gap: 1.25rem; }
.vg-form p, .wpcf7-form p { margin: 0; }
.wpcf7-form .vg-field br { display: none; }
.vg-form label, .wpcf7-form label {
	display: block;
	font-weight: 500;
	font-size: 1.125rem;
	color: var(--vg-navy);
	margin-bottom: .4rem;
}
.vg-form .vg-opcional, .wpcf7-form .vg-opcional { font-weight: 400; color: var(--vg-slate); font-size: 1rem; }
.vg-form input[type="text"], .vg-form input[type="email"], .vg-form input[type="tel"], .vg-form textarea,
.wpcf7-form input[type="text"], .wpcf7-form input[type="email"], .wpcf7-form input[type="tel"], .wpcf7-form textarea {
	display: block;
	width: 100%;
	box-sizing: border-box;
	min-height: 56px;
	padding: .85rem 1rem;
	font: 400 1.1875rem/1.5 var(--wp--preset--font-family--poppins);
	color: var(--vg-ink);
	background: #fff;
	border: 2px solid #9AA3B5;
	border-radius: var(--vg-radius);
	margin-top: .4rem;
}
.vg-form textarea, .wpcf7-form textarea { min-height: 150px; resize: vertical; }
.vg-form input:focus, .vg-form textarea:focus,
.wpcf7-form input:focus, .wpcf7-form textarea:focus { border-color: var(--vg-navy); outline: 3px solid var(--vg-gold); outline-offset: 1px; }
.vg-form .vg-enviar, .wpcf7-form .wpcf7-submit, .wpcf7-form .vg-enviar {
	width: 100%;
	min-height: 64px;
	padding: 1rem 2rem;
	font: 600 1.25rem/1.3 var(--wp--preset--font-family--poppins);
	color: var(--vg-navy);
	background: var(--vg-gold);
	border: 0;
	border-radius: var(--vg-radius);
	cursor: pointer;
	transition: background-color .2s ease;
}
.vg-form .vg-enviar:hover, .wpcf7-form .wpcf7-submit:hover { background: #DDBE7E; }
.vg-form .vg-nota, .wpcf7-form .vg-nota { font-size: 1rem; color: var(--vg-slate); }
.vg-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.vg-aviso {
	padding: 1rem 1.25rem;
	border-radius: var(--vg-radius);
	font-size: 1.125rem;
	font-weight: 500;
	margin-bottom: 1.25rem;
}
.vg-aviso-ok { background: #E6F2EA; color: #14532D; border-left: 5px solid #1F7A45; }
.vg-aviso-erro { background: #FBEAEA; color: #7F1D1D; border-left: 5px solid #B42318; }
.vg-form-editor-aviso { font-size: 1rem; background: var(--vg-sand); padding: .75rem 1rem; border-radius: var(--vg-radius); color: var(--vg-slate); }

/* Mensagens do Contact Form 7 */
.wpcf7 form .wpcf7-response-output { margin: 0; padding: 1rem 1.25rem; border-radius: var(--vg-radius); font-size: 1.125rem; }
.wpcf7-not-valid-tip { font-size: 1rem; font-weight: 500; margin-top: .35rem; color: #B42318; }
.wpcf7-spinner { display: block; margin: .5rem auto 0; }

/* Formulário dentro de seção escura: cartão claro garante contraste */
.is-style-secao-escura .vg-cartao-form { color: var(--vg-ink); }
.is-style-secao-escura .vg-cartao-form :where(h2, h3) { color: var(--vg-navy); }
.vg-cartao-form {
	background: var(--vg-cream);
	border-top: 4px solid var(--vg-gold);
	border-radius: 0 0 var(--vg-radius) var(--vg-radius);
	padding: clamp(1.5rem, 4vw, 2.75rem) !important;
}

/* ==========================================================================
   Ajustes responsivos
   ========================================================================== */
@media (max-width: 781px) {
	.vg-foto-moldura img { box-shadow: 10px 10px 0 -2px var(--vg-gold); }
	.vg-esconder-mobile { display: none !important; }
}

/* ==========================================================================
   Utilitários usados nos padrões
   ========================================================================== */
.vg-lead { font-size: clamp(1.25rem, 1.8vw, 1.4375rem) !important; line-height: 1.6; }
.vg-dourado { color: var(--vg-gold); }
.is-style-secao-clara .vg-dourado, .is-style-secao-areia .vg-dourado { color: var(--vg-gold-text); }
.vg-espaco-topo { margin-top: clamp(2rem, 4vw, 3rem) !important; }
.vg-colunas-largas { gap: clamp(2rem, 5vw, 4.5rem) !important; }
.vg-citacao-menor { font-size: 1.1875rem !important; }
.is-style-cartao .vg-titulo-cartao-menor,
.vg-titulo-cartao-menor { font-size: clamp(1.3125rem, 2vw, 1.5rem) !important; }
.vg-centro { margin-inline: auto !important; }
.vg-conteudo-pagina { padding-top: clamp(2.5rem, 5vw, 4rem); padding-bottom: clamp(3rem, 6vw, 5rem); }
.vg-faq { display: grid; gap: 1rem; }
.vg-depoimento { border-left: 3px solid var(--vg-gold); padding-left: 1.5rem; margin: 0; }
.vg-depoimento p { font-size: clamp(1.375rem, 2.4vw, 1.75rem); line-height: 1.45; color: var(--vg-navy); }
.vg-depoimento cite { display: block; margin-top: 1rem; font: normal 500 1.0625rem/1.4 var(--wp--preset--font-family--poppins); color: var(--vg-slate); }
.vg-galeria img { border-radius: var(--vg-radius); }
.vg-cabecalho-linha { padding-block: .9rem; gap: 1rem 2rem; }
.vg-cabecalho-acoes { gap: .75rem 1.5rem; }
.vg-rodape-colunas { gap: 2.5rem !important; }
.vg-rodape .is-style-citacao { color: var(--vg-gold); }
.vg-linha-topo > :first-child { margin-top: 0; }
.vg-linha-topo :where(h3) { margin-top: 0; font-size: clamp(1.625rem, 2.6vw, 2rem); }
