/*
 * Ponte entre o theme.json e o Tailwind compilado (utilitarios.css): o CSS do
 * Next lê os tokens do marca.css (--primary, --brand-500, --font-geist-sans…);
 * aqui cada um aponta para o preset do theme.json, que é a fonte.
 */

:root {
	--radius: var(--wp--custom--radius);

	--brand-50: var(--wp--preset--color--brand-50);
	--brand-100: var(--wp--preset--color--brand-100);
	--brand-200: var(--wp--preset--color--brand-200);
	--brand-300: var(--wp--preset--color--brand-300);
	--brand-400: var(--wp--preset--color--brand-400);
	--brand-500: var(--wp--preset--color--brand-500);
	--brand-600: var(--wp--preset--color--brand-600);
	--brand-700: var(--wp--preset--color--brand-700);
	--brand-800: var(--wp--preset--color--brand-800);
	--brand-900: var(--wp--preset--color--brand-900);

	--background: var(--wp--preset--color--background);
	--foreground: var(--wp--preset--color--foreground);
	--card: var(--wp--preset--color--background);
	--card-foreground: var(--wp--preset--color--foreground);
	--popover: var(--wp--preset--color--background);
	--popover-foreground: var(--wp--preset--color--foreground);
	--primary: var(--wp--preset--color--primary);
	--primary-foreground: var(--wp--preset--color--primary-foreground);
	--secondary: var(--wp--preset--color--secondary);
	--secondary-foreground: var(--wp--preset--color--foreground);
	--muted: var(--wp--preset--color--muted);
	--muted-foreground: var(--wp--preset--color--muted-foreground);
	--accent: var(--wp--preset--color--accent);
	--accent-foreground: var(--wp--preset--color--foreground);
	--destructive: #ef4444;
	--destructive-foreground: #991b1b;
	--border: var(--wp--preset--color--border);
	/* O selo do desconto anual no /precos (o --success-bg e o --success-foreground do marca.css). */
	--success-bg: var(--wp--preset--color--success-bg);
	--success-foreground: var(--wp--preset--color--success-foreground);
	--input: var(--wp--preset--color--border);
	--ring: var(--wp--preset--color--primary);

	/* Os nomes que o next/font punha no <html>, agora pelos presets do tema. */
	--font-geist-sans: var(--wp--preset--font-family--geist);
	--font-jakarta: var(--wp--preset--font-family--jakarta);
	--font-bricolage: var(--wp--preset--font-family--bricolage);
}

/*
 * Faces de fallback com as métricas que o next/font calculou: enquanto a fonte
 * real carrega, o texto ocupa o mesmo espaço e a página não pula.
 */
@font-face {
	font-family: "Geist Fallback";
	src: local("Arial");
	ascent-override: 95.94%;
	descent-override: 28.16%;
	line-gap-override: 0%;
	size-adjust: 104.76%;
}

@font-face {
	font-family: "Plus Jakarta Sans Fallback";
	src: local("Arial");
	ascent-override: 98.88%;
	descent-override: 21.15%;
	line-gap-override: 0%;
	size-adjust: 104.98%;
}

@font-face {
	font-family: "Bricolage Grotesque Fallback";
	src: local("Arial");
	ascent-override: 88.21%;
	descent-override: 25.61%;
	line-gap-override: 0%;
	size-adjust: 105.43%;
}

/*
 * Os wrappers do próprio WP (.wp-site-blocks e o <div> das template parts) não
 * podem somar espaço nenhum: o layout é o do Next.
 */
.wp-site-blocks > * {
	margin-block: 0;
}

/*
 * O <body> é flex-col items-start (layout.tsx). No Next, o filho dele é o
 * div.min-h-screen.w-full; aqui é o .wp-site-blocks, que sem largura encolhe
 * para o max-content (os 80rem do .lp-shell) acima de 1280 px. Com 100%, o
 * w-full do div de dentro volta a ser a largura da tela.
 */
.wp-site-blocks {
	width: 100%;
}

/*
 * Revelar ao rolar (D46): o CSS de [data-revelar] do landing.css de produção, sem
 * mudança. Só o revelar.js põe o "pendente" (com movimento reduzido, nunca põe).
 */
[data-revelar] {
	transition: opacity 0.7s ease-out, transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

[data-revelar="pendente"] {
	opacity: 0;
	transform: translateY(24px);
}

/*
 * No iframe do editor, o <body> não tem as classes do layout.tsx (font-sans
 * font-medium), e a pré-visualização herdaria o peso 400. Na front esta regra
 * não casa; no editor, o WP não prefixa o seletor que já tem o wrapper.
 */
.editor-styles-wrapper {
	font-family: var(--font-sans);
	font-weight: var(--font-weight-medium);
}