/**
 * Vita Supply — rodapé de conversão
 *
 * Mobile-first. Nenhuma imagem, nenhuma fonte externa, nenhuma requisição
 * extra: numa origem com TTFB de segundos, cada requisição no rodapé de
 * todas as páginas pesa.
 */

.vsf {
	--vsf-verde: #2f7d16;
	--vsf-verde-claro: #7ed321;
	--vsf-escuro: #14260c;
	--vsf-escuro-2: #1b3311;
	--vsf-tx: #e8efe3;
	--vsf-tx2: #a8bb9c;
	--vsf-linha: rgba(255, 255, 255, .1);

	background: var(--vsf-escuro);
	color: var(--vsf-tx);
	font-size: 15px;
	line-height: 1.6;
	margin-top: 48px;
}

.vsf * { box-sizing: border-box; }

.vsf-in {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
}

.vsf a {
	color: var(--vsf-tx);
	text-decoration: none;
	transition: color .15s;
}

.vsf a:hover,
.vsf a:focus-visible {
	color: var(--vsf-verde-claro);
	text-decoration: underline;
}

.vsf a:focus-visible {
	outline: 2px solid var(--vsf-verde-claro);
	outline-offset: 2px;
	border-radius: 3px;
}

/* ---------------------------------------------------------------
 * Faixa de garantias
 * ------------------------------------------------------------ */

.vsf-garantias {
	background: var(--vsf-verde);
	padding: 20px 0;
}

.vsf-garantias .vsf-in {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
}

.vsf-g {
	display: flex;
	align-items: center;
	gap: 12px;
}

.vsf-g-ico {
	flex: 0 0 auto;
	width: 30px;
	height: 30px;
	color: #fff;
	opacity: .95;
}

.vsf-g-ico svg { width: 100%; height: 100%; display: block; }

.vsf-g > span:last-child { display: block; line-height: 1.35; }

.vsf-g strong {
	display: block;
	font-size: 14.5px;
	font-weight: 700;
	color: #fff;
}

.vsf-g em {
	display: block;
	font-style: normal;
	font-size: 12.5px;
	color: rgba(255, 255, 255, .82);
}

/* ---------------------------------------------------------------
 * Captura de e-mail
 * ------------------------------------------------------------ */

.vsf-lead {
	background: var(--vsf-escuro-2);
	border-bottom: 1px solid var(--vsf-linha);
	padding: 26px 0;
}

.vsf-lead-in {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
	align-items: center;
}

.vsf-lead-txt strong {
	display: block;
	font-size: 19px;
	line-height: 1.25;
	color: #fff;
	letter-spacing: -.01em;
}

.vsf-lead-txt span {
	display: block;
	font-size: 13.5px;
	color: var(--vsf-tx2);
	margin-top: 4px;
	max-width: 46ch;
}

.vsf-lead-form {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.vsf-lead-form input[type="email"] {
	flex: 1 1 200px;
	min-width: 0;
	/* 16px evita o zoom automático do Safari no iOS ao focar o campo */
	font-size: 16px;
	padding: 13px 15px;
	border: 1px solid rgba(255, 255, 255, .18);
	border-radius: 8px;
	background: rgba(255, 255, 255, .06);
	color: #fff;
}

.vsf-lead-form input[type="email"]::placeholder { color: #7d8f73; }

.vsf-lead-form input[type="email"]:focus {
	outline: none;
	border-color: var(--vsf-verde-claro);
	background: rgba(255, 255, 255, .1);
}

.vsf-lead-form button {
	flex: 0 0 auto;
	min-height: 48px;
	padding: 0 22px;
	border: 0;
	border-radius: 8px;
	background: var(--vsf-verde-claro);
	color: #14260c;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	transition: background .15s;
}

.vsf-lead-form button:hover { background: #8fe62c; }

/* ---------------------------------------------------------------
 * Colunas
 * ------------------------------------------------------------ */

.vsf-main { padding: 34px 0 28px; }

.vsf-cols {
	display: grid;
	grid-template-columns: 1fr;
	gap: 28px;
}

.vsf-col h3 {
	margin: 0 0 12px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--vsf-verde-claro);
}

.vsf-h3-2 { margin-top: 22px !important; }

.vsf-col ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.vsf-col li { margin-bottom: 8px; }

.vsf-col li a {
	font-size: 14.5px;
	color: var(--vsf-tx2);
	/* alvo de toque decente no celular */
	display: inline-block;
	padding: 2px 0;
}

.vsf-col li a:hover { color: var(--vsf-verde-claro); }

.vsf-logo { max-width: 170px; height: auto; margin-bottom: 14px; }

.vsf-logo-txt {
	display: block;
	font-size: 21px;
	font-weight: 800;
	color: #fff;
	margin-bottom: 12px;
	letter-spacing: -.02em;
}

.vsf-pitch {
	margin: 0 0 18px;
	font-size: 14px;
	color: var(--vsf-tx2);
	max-width: 42ch;
}

.vsf-pitch strong { color: var(--vsf-tx); }

.vsf-whats {
	display: inline-flex;
	align-items: center;
	gap: 11px;
	padding: 11px 16px;
	border: 1px solid rgba(126, 211, 33, .4);
	border-radius: 10px;
	background: rgba(126, 211, 33, .09);
	min-height: 48px;
}

.vsf-whats svg { width: 24px; height: 24px; color: var(--vsf-verde-claro); flex: 0 0 auto; }
.vsf-whats strong { display: block; font-size: 14px; color: #fff; }
.vsf-whats em { display: block; font-style: normal; font-size: 12px; color: var(--vsf-tx2); }
.vsf-whats:hover { background: rgba(126, 211, 33, .16); text-decoration: none; }

.vsf-contato li { font-size: 14px; color: var(--vsf-tx2); }
.vsf-horario { font-size: 13px !important; opacity: .8; }

/* ---------------------------------------------------------------
 * Pagamento e segurança
 * ------------------------------------------------------------ */

.vsf-pag {
	border-top: 1px solid var(--vsf-linha);
	border-bottom: 1px solid var(--vsf-linha);
	padding: 24px 0;
}

.vsf-pag-in {
	display: grid;
	grid-template-columns: 1fr;
	gap: 24px;
}

.vsf-pag h4 {
	margin: 0 0 12px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--vsf-tx2);
}

.vsf-bandeiras {
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
	margin-bottom: 10px;
}

.vsf-band {
	display: block;
	width: 46px;
	height: 31px;
	border-radius: 4px;
	overflow: hidden;
}

.vsf-band svg { width: 100%; height: 100%; display: block; }

.vsf-pag-txt {
	margin: 0;
	font-size: 13px;
	color: var(--vsf-tx2);
}

.vsf-seg {
	display: flex;
	flex-direction: column;
	gap: 9px;
	margin-bottom: 10px;
}

.vsf-seg-item {
	display: flex;
	align-items: center;
	gap: 9px;
	font-size: 13.5px;
	color: var(--vsf-tx);
}

.vsf-seg-item svg {
	width: 18px;
	height: 18px;
	flex: 0 0 auto;
	color: var(--vsf-verde-claro);
}

/* ---------------------------------------------------------------
 * Assinatura legal
 * ------------------------------------------------------------ */

.vsf-legal { padding: 22px 0 30px; }

.vsf-empresa {
	margin: 0 0 14px;
	font-size: 13.5px;
	color: var(--vsf-tx);
	font-weight: 600;
}

.vsf-alerta {
	background: rgba(255, 193, 7, .12);
	border: 1px solid rgba(255, 193, 7, .35);
	border-radius: 8px;
	padding: 12px 15px;
	font-weight: 400;
	color: #ffe08a;
}

.vsf-alerta em { opacity: .7; font-size: 12px; }

.vsf-anvisa {
	margin: 0 0 14px;
	font-size: 11.5px;
	line-height: 1.65;
	color: var(--vsf-tx2);
	opacity: .75;
	max-width: 92ch;
}

.vsf-copy {
	margin: 0;
	font-size: 12.5px;
	color: var(--vsf-tx2);
}

/* ---------------------------------------------------------------
 * Toast
 * ------------------------------------------------------------ */

.vsf-toast {
	position: fixed;
	left: 50%;
	bottom: 24px;
	transform: translateX(-50%);
	z-index: 99999;
	background: #14260c;
	color: #fff;
	border: 1px solid var(--vsf-verde-claro, #7ed321);
	border-radius: 10px;
	padding: 13px 20px;
	font-size: 14.5px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .3);
	animation: vsf-up .3s ease;
}

@keyframes vsf-up {
	from { opacity: 0; transform: translate(-50%, 12px); }
	to   { opacity: 1; transform: translate(-50%, 0); }
}

/* ---------------------------------------------------------------
 * Tablet
 * ------------------------------------------------------------ */

@media (min-width: 640px) {

	.vsf-garantias .vsf-in { grid-template-columns: 1fr 1fr; gap: 18px 24px; }
	.vsf-cols { grid-template-columns: 1fr 1fr; gap: 32px; }
	.vsf-pag-in { grid-template-columns: 1.2fr 1fr; gap: 32px; }
	.vsf-lead-txt strong { font-size: 21px; }
}

/* ---------------------------------------------------------------
 * Desktop
 * ------------------------------------------------------------ */

@media (min-width: 992px) {

	.vsf-garantias .vsf-in { grid-template-columns: repeat(4, 1fr); }

	.vsf-lead-in {
		grid-template-columns: 1fr auto;
		gap: 32px;
	}

	.vsf-lead-form { min-width: 420px; }

	.vsf-cols {
		grid-template-columns: 1.6fr 1fr 1fr 1.15fr;
		gap: 40px;
	}

	.vsf-main { padding: 44px 0 36px; }
}

/* ---------------------------------------------------------------
 * Não sobrepor a barra de ação do mobile (módulo 11)
 * ------------------------------------------------------------ */

@media (max-width: 991px) {
	.vsf-legal { padding-bottom: calc(30px + env(safe-area-inset-bottom, 0px)); }
}

/* ---------------------------------------------------------------
 * Acessibilidade
 * ------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
	.vsf-toast { animation: none; }
	.vsf a, .vsf-lead-form button { transition: none; }
}

.vsf .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

@media print {
	.vsf-garantias, .vsf-lead, .vsf-whats, .vsf-toast { display: none; }
	.vsf { background: none; color: #000; }
}