/**
 * Base: elementos e acessibilidade.
 */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	/* Rolagem suave forcada atrapalha quem navega por teclado. Fica so para
	   quem nao pediu movimento reduzido, e apenas em saltos de ancora. */
	scroll-behavior: auto;
}

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

img,
picture,
video,
canvas,
svg {
	display: block;
	max-width: 100%;
	height: auto;
}

/* Titulos e paragrafos longos quebram melhor com estas duas regras. */
h1,
h2,
h3 {
	text-wrap: balance;
}

p,
li {
	text-wrap: pretty;
}

/* Leitura confortavel: nenhuma linha de texto corrido passa disto. */
p {
	max-width: 68ch;
}

/* ---------------------------------------------------------------------------
   Foco visivel
   Criterio 2.4.11 do WCAG 2.2: o indicador nao pode ser escondido nem sutil.
   --------------------------------------------------------------------------- */

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: var(--rt-focus-width) solid var(--rt-focus-color);
	outline-offset: var(--rt-focus-offset);
	border-radius: 2px;
}

/* Sobre superficies escuras o anel troca para a cor de acao. */
.is-style-faixa-escura :where(a, button, input, select, textarea):focus-visible,
.rt-footer :where(a, button, input, select, textarea):focus-visible {
	outline-color: var(--wp--preset--color--action);
}

/* Nunca remova o contorno sem devolver outro indicador. */
:where(a, button):focus:not(:focus-visible) {
	outline: none;
}

/* ---------------------------------------------------------------------------
   Link para pular ao conteudo
   --------------------------------------------------------------------------- */

.skip-link,
.rt-skip-link {
	position: absolute;
	top: 0;
	left: 0;
	z-index: var(--rt-z-skip);
	padding: 0.75rem 1.25rem;
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--inverse);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: var(--rt-weight-medium);
	text-decoration: none;
	transform: translateY(-120%);
}

.skip-link:focus,
.rt-skip-link:focus {
	transform: translateY(0);
}

/* ---------------------------------------------------------------------------
   Alvos de toque
   --------------------------------------------------------------------------- */

:where(.wp-block-navigation a, .rt-footer a, .rt-breadcrumb a) {
	min-height: var(--rt-touch-target);
	display: inline-flex;
	align-items: center;
}

/* ---------------------------------------------------------------------------
   Formularios nativos
   --------------------------------------------------------------------------- */

input,
select,
textarea {
	font: inherit;
	color: inherit;
}

::placeholder {
	color: var(--wp--preset--color--ink-muted);
	opacity: 1;
}

/* ---------------------------------------------------------------------------
   Selecao e destaque de ancora
   --------------------------------------------------------------------------- */

::selection {
	background: var(--wp--preset--color--action-soft);
	color: var(--wp--preset--color--ink);
}

:target {
	scroll-margin-top: calc(var(--rt-header-height) + 1rem);
}

/* ---------------------------------------------------------------------------
   Movimento reduzido
   Regra do plano: prefers-reduced-motion remove transformacao, parallax,
   autoplay e transicao nao essencial. Tudo continua funcional.
   --------------------------------------------------------------------------- */

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

/* ---------------------------------------------------------------------------
   Impressao: uma pagina de solucao precisa sair legivel para uma reuniao.
   --------------------------------------------------------------------------- */

@media print {
	.rt-header,
	.rt-footer,
	.rt-form,
	.wp-block-navigation {
		display: none !important;
	}

	body {
		color: #000;
		background: #fff;
	}

	a[href^="http"]::after {
		content: " (" attr(href) ")";
		font-size: 0.8em;
	}
}