@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('../fonts/poppins-regular-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('../fonts/poppins-regular-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('../fonts/poppins-semibold-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('../fonts/poppins-semibold-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('../fonts/poppins-bold-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('../fonts/poppins-bold-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url('../fonts/poppins-extrabold-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url('../fonts/poppins-extrabold-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
	--ao-institucional-01: #FF4900;
	--ao-institucional-02: #2F2F2E;
	--ao-institucional-03: #F1ECDF;
	--ao-institucional-04: #00126B;

	--ao-white: #FFFFFF;
	--ao-grey-light: #F5F5F5;
	--ao-grey-10: #E6E6E6;
	--ao-grey-30: #B3B3B3;
	--ao-grey-50: #808080;
	--ao-grey-70: #4D4D4D;

	--ao-ink: #1C1B1B;
	--ao-black: #000000;
	--ao-success: #15803D;
	--ao-success-bg: #DCFCE7;
	--ao-positive: #16A34A;
	--ao-danger: #BA1A1A;

	--ao-primary: var(--ao-institucional-04);
	--ao-accent: var(--ao-institucional-01);
	--ao-surface-dark: var(--ao-institucional-02);
	--ao-on-dark: var(--ao-institucional-03);
	--ao-body: var(--ao-grey-70);
	--ao-muted: var(--ao-grey-50);
	--ao-subtle: var(--ao-grey-30);
	--ao-card-body: var(--ao-grey-10);
	--ao-page: var(--ao-grey-light);

	--ao-vime-hover: #5C13E6;

	--ao-font: 'Poppins', sans-serif;

	--ao-fw-regular: 400;
	--ao-fw-semibold: 600;
	--ao-fw-bold: 700;
	--ao-fw-extrabold: 800;

	--ao-fs-h1: 48px;
	--ao-lh-h1: 50px;
	--ao-fs-h2: 32px;
	--ao-lh-h2: 40px;
	--ao-fs-h3: 20px;
	--ao-lh-h3: 40px;
	--ao-fs-body-1: 16px;
	--ao-lh-body-1: 20px;
	--ao-lh-kpi-delta: 24px;
	--ao-fs-body-2: 14px;
	--ao-lh-body-2: 18px;
	--ao-lh-btn: 150%;
	--ao-fs-legal: 10.5px;
	--ao-ls: 0;

	--ao-space-1: 4px;
	--ao-space-2: 8px;
	--ao-space-3: 10px;
	--ao-space-4: 12px;
	--ao-space-5: 16px;
	--ao-space-6: 19px;
	--ao-space-7: 20px;
	--ao-space-8: 24px;
	--ao-space-9: 30px;
	--ao-space-10: 40px;
	--ao-space-11: 70px;
	--ao-space-12: 122px;

	--ao-radius-badge: 4px;
	--ao-radius-btn: 6px;
	--ao-radius-card: 10px;
	--ao-radius-pill: 30px;

	--ao-artboard: 1440px;
	--ao-content: 1196px;
	--ao-content-ratio: 83.0556%;
	--ao-gutter: 8.4722%;

	--ao-conteudo: min(90vw, var(--ao-content));
	--ao-respiro: clamp(16px, 5.333vw, 32px);
	--ao-shell: calc(var(--ao-conteudo) + var(--ao-respiro) * 2);

	--ao-header-h: 100px;
	--ao-footer-h: 367px;
	--ao-footer-logo-h: 100px;
	--ao-footer-gap-marca: 167px;
	--ao-footer-gap-col: 90px;
	--ao-footer-vime-h: 20px;
	--ao-footer-cols-min: 620px;
	--ao-footer-col-min: min(172px, 100%);
	--ao-logo-w: 220px;
	--ao-logo-h: 64px;

	--ao-banner-h-hero: 625px;
	--ao-banner-h-faixa: 377px;
	--ao-hero-pad-x: 98px;
	--ao-hero-nav-h: 42px;
	--ao-categorias-h: 145px;
	--ao-arrow-size: 22px;

	--ao-card-w: 281px;
	--ao-card-h: 400px;
	--ao-card-img-h: 168px;
	--ao-card-body-h: 232px;
	--ao-card-title-h: 36px;
	--ao-grid-gap: 24px;

	--ao-btn-h: 43px;
	--ao-btn-h-card: 38px;
	--ao-btn-pad-y: 16px;
	--ao-btn-pad-y-card: 12px;
	--ao-btn-pad-x: 40px;
	--ao-btn-gap: 10px;

	--ao-badge-tipo-pad: 6px 10px;
	--ao-badge-status-pad: 5px 12px;
	--ao-badge-status-w: 93px;
	--ao-badge-status-h: 27px;
	--ao-table-row-h: 60px;
	--ao-kpi-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}

html,
body,
button,
input,
select,
textarea,
.ao-root {
	font-family: var(--ao-font);
	letter-spacing: var(--ao-ls);
}

body {
	margin: 0;
	background: var(--ao-page);
	color: var(--ao-body);
	font-size: var(--ao-fs-body-1);
	line-height: var(--ao-lh-body-1);
	font-weight: var(--ao-fw-regular);
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

.ao-container {
	width: var(--ao-shell);
	max-width: 100%;
	margin-inline: auto;
	padding-inline: var(--ao-respiro);
}

.ao-container .ao-container {
	width: 100%;
	padding-inline: 0;
}

.ao-container--flush {
	width: 100%;
	max-width: none;
	padding-inline: calc(var(--ao-space-12) / var(--ao-artboard) * 100%);
}

.ao-h1 {
	font-size: var(--ao-fs-h1);
	line-height: var(--ao-lh-h1);
	font-weight: var(--ao-fw-extrabold);
}

.ao-h2 {
	font-size: var(--ao-fs-h2);
	line-height: var(--ao-lh-h2);
	font-weight: var(--ao-fw-semibold);
}

.ao-h3 {
	font-size: var(--ao-fs-h3);
	line-height: var(--ao-lh-h3);
	font-weight: var(--ao-fw-bold);
	color: var(--ao-body);
}

.ao-body-1 {
	font-size: var(--ao-fs-body-1);
	line-height: var(--ao-lh-body-1);
	font-weight: var(--ao-fw-regular);
	color: var(--ao-muted);
}

.ao-body-1-bold {
	font-size: var(--ao-fs-body-1);
	line-height: var(--ao-lh-body-1);
	font-weight: var(--ao-fw-bold);
	color: var(--ao-body);
}

.ao-body-2 {
	font-size: var(--ao-fs-body-2);
	line-height: var(--ao-lh-body-2);
	font-weight: var(--ao-fw-regular);
	color: var(--ao-subtle);
}

.ao-body-2-muted {
	font-size: var(--ao-fs-body-2);
	line-height: var(--ao-lh-body-2);
	font-weight: var(--ao-fw-regular);
	color: var(--ao-muted);
}

.ao-price {
	font-size: var(--ao-fs-h2);
	line-height: var(--ao-lh-h2);
	font-weight: var(--ao-fw-semibold);
	color: var(--ao-accent);
}

.ao-price--lg {
	font-size: var(--ao-fs-h1);
	line-height: var(--ao-lh-h1);
	font-weight: var(--ao-fw-extrabold);
}

.ao-off {
	font-size: var(--ao-fs-body-2);
	line-height: var(--ao-lh-body-2);
	font-weight: var(--ao-fw-regular);
	color: var(--ao-primary);
}

.ao-section-title {
	font-size: var(--ao-fs-h2);
	line-height: var(--ao-lh-h2);
	font-weight: var(--ao-fw-semibold);
	color: var(--ao-primary);
	margin: 0;
}

.ao-section-subtitle {
	font-size: var(--ao-fs-body-1);
	line-height: var(--ao-lh-body-1);
	font-weight: var(--ao-fw-regular);
	color: var(--ao-subtle);
	margin: 0;
}

/* `left`/`top` nao sao decoracao: sem eles o elemento absoluto fica na posicao
   estatica — dentro de um carrossel, isso e a coluna do cartao la na frente, a
   centenas de pixels da borda. Como absoluto nao rola junto com o `.ao-rail`,
   ele e pintado fora e estica o documento ate o `html`, e a pagina inteira
   desliza na horizontal no celular. Medido na home: 445px de `scrollWidth` num
   viewport de 390px, com o span parado em `left: 444`.
   Ancorar aqui resolve na origem — antes isso era contornado caso a caso com
   `position: relative` no pai (ver `.ao-table th` e `.ao-vouchers__ver` no
   ao-painel.css), o que so protegia os usos ja descobertos. */
.ao-visually-hidden {
	position: absolute;
	left: 0;
	top: 0;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}
