/* Viva o Vinho – Reviews.
   As cores estão nas variáveis abaixo, para acertar com o tema novo.
   Alguns !important protegem do CSS do tema, que estiliza com força os títulos e parágrafos do conteúdo. */

.vov-review {
	--vov-acento: #7b1e2b;
	--vov-acento-claro: #f6eced;
	--vov-trilho: #eddfe1;
	--vov-borda: #eadfe0;
	--vov-texto: #2b2224;
	--vov-texto-suave: #75686b;
	--vov-foto: 360px;
	/* O cartão adapta-se à largura que tem (o tema pode estreitar a coluna do texto). */
	container-type: inline-size;
	container-name: vov-review;
}

/* Modo escuro do Zeen (classe mode--alt--b na página) */
.mode--alt--b .vov-review {
	--vov-acento: #e07a8b;
	--vov-acento-claro: rgba(224, 122, 139, 0.16);
	--vov-trilho: #3b3337;
	--vov-borda: #3a3a3a;
	--vov-texto: #ececec;
	--vov-texto-suave: #a9a2a4;
}

.mode--alt--b .vov-review .vov-cartao {
	background: #1f1f1f;
}

.mode--alt--b .vov-review .vov-cartao__mais a {
	background: #b8475a;
}

/* ---------- Cartão da nota ---------- */

.vov-review .vov-cartao {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	align-items: center;
	gap: 32px;
	margin: 0 0 36px;
	padding: 28px;
	border: 1px solid var(--vov-borda);
	border-radius: 16px;
	background: linear-gradient(135deg, #fff 0%, #fbf6f6 100%);
}

.vov-review .vov-cartao--foto {
	grid-template-columns: var(--vov-foto) minmax(0, 1fr);
}

/* Foto: largura fixa, altura automática. Horizontal vira quadrada. */
.vov-review .vov-cartao__foto {
	align-self: center;
	margin: 0 !important;
	padding: 0;
	overflow: hidden;
	border-radius: 6px;
	background: var(--vov-acento-claro);
}

.vov-review .vov-cartao__foto img {
	display: block;
	width: 100% !important;
	max-width: none !important;
	height: auto !important;
	margin: 0 !important;
}

.vov-review .vov-cartao__foto--quadrada {
	aspect-ratio: 1 / 1;
}

/* Lightbox do WordPress: a foto inteira abre ao clicar. */
.vov-review .vov-cartao__foto img {
	cursor: zoom-in;
}

.vov-review .vov-cartao__foto--quadrada.wp-lightbox-container img {
	height: 100% !important;
}

.vov-review .vov-cartao__foto--quadrada img {
	height: 100% !important;
	object-fit: cover;
}

.vov-review .vov-cartao__dados {
	min-width: 0;
}

.vov-review .vov-cartao__topo {
	display: flex;
	align-items: center;
	gap: 22px;
	margin: 0 0 24px;
}

/* Anel da nota */
.vov-review .vov-score {
	position: relative;
	flex: 0 0 120px;
	width: 120px;
	height: 120px;
}

.vov-review .vov-score svg {
	display: block;
	width: 100%;
	height: 100%;
	transform: rotate(-90deg);
}

.vov-review .vov-score circle {
	fill: none;
	stroke-width: 10;
}

.vov-review .vov-score__trilho { stroke: var(--vov-trilho); }

.vov-review .vov-score__valor {
	stroke: var(--vov-acento);
	stroke-linecap: round;
}

.vov-review .vov-score__num {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

.vov-review .vov-score__num strong {
	font-size: 42px;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--vov-acento);
}

.vov-review .vov-score__num span {
	margin-top: 6px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--vov-texto-suave);
}

.vov-review .vov-cartao__resumo {
	min-width: 0;
}

.vov-review .vov-cartao__kicker {
	margin: 0 0 6px !important;
	padding: 0 !important;
	font-size: 11px !important;
	font-weight: 600;
	line-height: 1.4 !important;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--vov-texto-suave);
}

.vov-review .vov-cartao__nome {
	margin: 0 0 4px !important;
	padding: 0 !important;
	font-size: 20px !important;
	font-weight: 700;
	line-height: 1.25 !important;
}

.vov-review .vov-cartao__nome a {
	color: var(--vov-texto);
	text-decoration: none;
}

.vov-review .vov-cartao__nome a:hover {
	color: var(--vov-acento);
}

.vov-review .vov-cartao__linha {
	margin: 0 !important;
	padding: 0 !important;
	font-size: 16px !important;
	font-weight: 600;
	line-height: 1.35 !important;
	color: var(--vov-texto);
}

.vov-review--embutida .vov-cartao__linha {
	font-size: 15px !important;
	font-weight: 500;
	color: var(--vov-texto-suave);
}

/* Veredito: a palavra que acompanha a nota ("Excelente") */
.vov-review .vov-cartao__veredito {
	margin: 0 0 6px !important;
	padding: 0 !important;
	font-size: 22px !important;
	font-weight: 700;
	line-height: 1.15 !important;
	color: var(--vov-acento);
}

.vov-review--embutida .vov-cartao__veredito {
	margin-top: 4px !important;
	font-size: 18px !important;
}

/* Critérios: nome e nota numa linha, barra por baixo */
.vov-review .vov-criterios {
	display: grid;
	gap: 14px;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.vov-review .vov-criterios li {
	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-areas: "nome valor" "barra barra";
	align-items: center;
	gap: 6px 12px;
	margin: 0 !important;
	padding: 0 !important;
	font-size: 14px;
	line-height: 1.3;
	color: var(--vov-texto);
	list-style: none !important;
}

.vov-review .vov-criterios li::before { content: none !important; }
.vov-review .vov-criterios__nome { grid-area: nome; }

.vov-review .vov-criterios__valor {
	grid-area: valor;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.vov-review .vov-criterios__barra {
	grid-area: barra;
	display: block;
	height: 10px;
	overflow: hidden;
	border-radius: 5px;
	background: var(--vov-trilho);
}

.vov-review .vov-criterios__barra span {
	display: block;
	height: 100%;
	border-radius: 5px;
	background: var(--vov-acento);
}

/* Cartão sem foto (shortcode num artigo): critérios em duas colunas */
.vov-review--embutida {
	margin: 40px 0;
}

.vov-review--embutida .vov-cartao {
	margin: 0;
}

.vov-review--embutida .vov-criterios {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px 28px;
}

.vov-review .vov-cartao__mais {
	margin: 24px 0 0 !important;
	padding: 0 !important;
	line-height: 1 !important;
}

.vov-review .vov-cartao__mais a {
	display: inline-block;
	padding: 12px 20px;
	border-radius: 999px;
	background: var(--vov-acento);
	color: #fff !important;
	font-size: 14px !important;
	font-weight: 600;
	line-height: 1.2 !important;
	text-decoration: none !important;
}

.vov-review .vov-cartao__mais a::after {
	content: " →";
}

.vov-review .vov-cartao__mais a:hover,
.vov-review .vov-cartao__mais a:focus-visible {
	background: #5e1520;
}

/* Animação (só com JavaScript e sem "reduzir movimento"): o anel enche, as barras crescem */
@keyframes vov-anel {
	from { stroke-dasharray: 0 100; }
}

@keyframes vov-barra {
	from { width: 0; }
}

.vov-review .vov-cartao.vov-anima:not(.vov-visivel) .vov-score__valor {
	stroke-dasharray: 0 100;
	stroke-opacity: 0;
}

.vov-review .vov-cartao.vov-anima:not(.vov-visivel) .vov-criterios__barra span {
	width: 0 !important;
}

.vov-review .vov-cartao.vov-anima.vov-visivel .vov-score__valor {
	animation: vov-anel 1.2s cubic-bezier(0.22, 0.61, 0.36, 1) both;
}

.vov-review .vov-cartao.vov-anima.vov-visivel .vov-criterios__barra span {
	animation: vov-barra 1.2s cubic-bezier(0.22, 0.61, 0.36, 1) both;
}

.vov-review .vov-cartao.vov-anima.vov-visivel .vov-criterios li:nth-child(2) .vov-criterios__barra span { animation-delay: 0.08s; }
.vov-review .vov-cartao.vov-anima.vov-visivel .vov-criterios li:nth-child(3) .vov-criterios__barra span { animation-delay: 0.16s; }
.vov-review .vov-cartao.vov-anima.vov-visivel .vov-criterios li:nth-child(4) .vov-criterios__barra span { animation-delay: 0.24s; }

@media (prefers-reduced-motion: reduce) {
	.vov-review .vov-cartao .vov-score__valor,
	.vov-review .vov-cartao .vov-criterios__barra span {
		animation: none !important;
	}
}

/* Link para o artigo, no fim do texto da página do vinho */
.vov-review .vov-review__artigo {
	margin-top: 24px;
	font-style: italic;
	color: var(--vov-texto-suave);
}

.vov-review .vov-review__artigo a {
	color: var(--vov-acento);
}

/* ---------- Listas (bloco, shortcode e widget) ---------- */

.vov-review.vov-lista-wrap {
	margin: 24px 0;
	container-type: inline-size;
}

.vov-review .vov-lista__titulo {
	margin: 0 0 10px !important;
	padding: 0 !important;
	font-size: 13px !important;
	font-weight: 700;
	line-height: 1.2 !important;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--vov-texto-suave);
}

.vov-review .vov-lista {
	display: grid;
	gap: 2px;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.vov-review .vov-lista__item {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	list-style: none !important;
}

.vov-review .vov-lista__item::before {
	content: none !important;
}

.vov-review .vov-lista__link {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 8px;
	border-radius: 10px;
	color: var(--vov-texto) !important;
	text-decoration: none !important;
	transition: background-color 0.15s ease;
}

.vov-review .vov-lista__link:hover,
.vov-review .vov-lista__link:focus-visible {
	background: var(--vov-acento-claro);
}

.vov-review .vov-lista__pos {
	flex: 0 0 22px;
	font-size: 18px;
	font-weight: 700;
	text-align: center;
	color: var(--vov-acento);
	font-variant-numeric: tabular-nums;
}

.vov-review .vov-lista__foto {
	flex: 0 0 56px;
	width: 56px !important;
	height: 56px !important;
	margin: 0 !important;
	border-radius: 6px;
	object-fit: cover;
}

.vov-review .vov-lista__texto {
	display: flex;
	flex: 1;
	flex-direction: column;
	min-width: 0;
}

.vov-review .vov-lista__nome {
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
}

.vov-review .vov-lista__resumo {
	margin-top: 2px;
	font-size: 12.5px;
	line-height: 1.3;
	color: var(--vov-texto-suave);
}

.vov-review .vov-lista__nota {
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	align-items: center;
	min-width: 64px;
	line-height: 1;
}

.vov-review .vov-lista__nota strong {
	font-size: 22px;
	font-weight: 700;
	color: var(--vov-acento);
}

.vov-review .vov-lista__nota small {
	margin-top: 4px;
	font-size: 10.5px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--vov-texto-suave);
}

/* Lista em espaço estreito (celular ou barra lateral): tudo mais compacto */
@container (max-width: 440px) {
	.vov-review .vov-lista__link {
		gap: 10px;
		padding: 9px 4px;
	}

	.vov-review .vov-lista__pos {
		flex-basis: 16px;
		font-size: 16px;
	}

	.vov-review .vov-lista__foto {
		flex-basis: 44px;
		width: 44px !important;
		height: 44px !important;
	}

	.vov-review .vov-lista__nome {
		font-size: 14px;
	}

	.vov-review .vov-lista__resumo {
		font-size: 12px;
	}

	.vov-review .vov-lista__nota {
		min-width: 0;
	}

	.vov-review .vov-lista__nota strong {
		font-size: 19px;
	}

	.vov-review .vov-lista__nota small {
		font-size: 9px;
		letter-spacing: 0.02em;
	}
}

/* ---------- Ficha técnica ---------- */

.vov-review .vov-ficha {
	margin: 40px 0 0;
	padding: 28px 0 0;
	border-top: 1px solid var(--vov-borda);
}

.vov-review .vov-ficha__titulo {
	margin: 0 0 22px !important;
	padding: 0 !important;
	font-family: inherit !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	letter-spacing: 0.14em !important;
	text-transform: uppercase !important;
	color: var(--vov-texto-suave) !important;
}

.vov-review .vov-ficha__grade {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 26px 20px;
	margin: 0;
	padding: 0;
}

.vov-review .vov-ficha__item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	min-width: 0;
}

.vov-review .vov-ficha__icone {
	display: flex;
	flex: 0 0 46px;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: var(--vov-acento-claro);
	color: var(--vov-acento);
}

.vov-review .vov-ficha__icone svg {
	width: 24px;
	height: 24px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.vov-review .vov-ficha dt {
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1.1 !important;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--vov-texto);
}

.vov-review .vov-ficha dd {
	margin: 6px 0 0;
	font-size: 15px;
	line-height: 1.35;
	color: var(--vov-acento);
	overflow-wrap: anywhere;
}

/* Campo da ficha sem informação (ex.: estágio não encontrado) */
.vov-review .vov-ficha dd.vov-ficha__vazio {
	color: var(--vov-texto-suave);
	font-style: italic;
}

/* ---------- Cartão em coluna estreita (layouts do tema com texto mais estreito) ---------- */

@container vov-review (max-width: 720px) {
	.vov-review .vov-cartao--foto {
		grid-template-columns: 220px minmax(0, 1fr);
		gap: 24px;
		padding: 22px;
	}

	.vov-review .vov-cartao__topo {
		gap: 14px;
		margin-bottom: 18px;
	}

	.vov-review .vov-score {
		flex-basis: 96px;
		width: 96px;
		height: 96px;
	}

	.vov-review .vov-score__num strong {
		font-size: 34px;
	}
}

@container vov-review (max-width: 520px) {
	.vov-review .vov-cartao,
	.vov-review .vov-cartao--foto {
		grid-template-columns: minmax(0, 1fr);
		gap: 22px;
		padding: 18px;
	}

	.vov-review--embutida .vov-criterios {
		grid-template-columns: minmax(0, 1fr);
	}

	.vov-review .vov-ficha__grade {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* ---------- Celular ---------- */

@media (max-width: 640px) {
	.vov-review .vov-cartao,
	.vov-review .vov-cartao--foto {
		grid-template-columns: minmax(0, 1fr);
		gap: 22px;
		padding: 18px;
	}

	.vov-review .vov-cartao__topo {
		gap: 16px;
		margin-bottom: 20px;
	}

	.vov-review .vov-score {
		flex-basis: 96px;
		width: 96px;
		height: 96px;
	}

	.vov-review .vov-score__num strong {
		font-size: 34px;
	}

	.vov-review--embutida .vov-criterios {
		grid-template-columns: minmax(0, 1fr);
	}

	.vov-review .vov-cartao__mais a {
		display: block;
		text-align: center;
	}

	.vov-review .vov-ficha__grade {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 22px 14px;
	}
}
