/* Ícones flutuantes: cápsula translúcida com o WhatsApp e, logo ao lado, o Instagram.
   Visíveis por padrão; a animação de entrada é só acabamento. */
.tw-flutuantes {
	position: fixed !important; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); top: auto !important; z-index: 2147483000;
	display: flex !important; align-items: center; gap: 6px; padding: 6px !important; margin: 0 !important;
	border-radius: 999px; background: rgba(255, 255, 255, .9); border: 1px solid rgba(255, 255, 255, .7);
	-webkit-backdrop-filter: blur(16px) saturate(170%); backdrop-filter: blur(16px) saturate(170%);
	box-shadow: 0 12px 32px rgba(15, 23, 42, .14), 0 2px 6px rgba(15, 23, 42, .08);
	animation: tw-dock .8s cubic-bezier(.22, 1, .36, 1) .3s both;
	visibility: visible !important; opacity: 1;
}
.tw-flutuantes.tw-lado-direita { right: calc(18px + env(safe-area-inset-right, 0px)); left: auto !important; }
.tw-flutuantes.tw-lado-esquerda { left: calc(18px + env(safe-area-inset-left, 0px)); right: auto !important; }
.tw-flutuantes .tw-flt-defs { position: absolute; width: 0; height: 0; overflow: hidden; }

.tw-flutuantes .tw-flt {
	position: relative; display: grid !important; place-items: center; flex: none;
	width: 50px !important; height: 50px !important; min-width: 0 !important; padding: 0 !important; margin: 0 !important;
	border: 0 !important; border-radius: 50% !important; text-decoration: none !important; line-height: 1 !important;
	visibility: visible !important; transform: none; float: none !important;
	transition: transform .35s cubic-bezier(.22, 1, .36, 1), box-shadow .35s ease;
	animation: tw-icone .7s cubic-bezier(.22, 1, .36, 1) both;
}
.tw-flutuantes .tw-flt svg { display: block !important; position: static !important; }
.tw-flutuantes .tw-flt-wa { background: #25d366 !important; color: #fff !important; box-shadow: 0 6px 16px rgba(37, 211, 102, .35) !important; animation-delay: .5s; }
.tw-flutuantes .tw-flt-wa svg { width: 27px !important; height: 27px !important; }
.tw-flutuantes .tw-flt-ig { background: #fff !important; color: #d62976 !important; box-shadow: inset 0 0 0 1px rgba(15, 23, 42, .07) !important; animation-delay: .75s; }
.tw-flutuantes .tw-flt-ig svg { width: 25px !important; height: 25px !important; }
.tw-flutuantes .tw-flt:hover { transform: translateY(-2px); }
.tw-flutuantes .tw-flt-wa:hover { box-shadow: 0 10px 22px rgba(37, 211, 102, .45) !important; }
.tw-flutuantes .tw-flt:active { transform: scale(.94); }
.tw-flutuantes .tw-flt:focus { outline: none; }
.tw-flutuantes .tw-flt:focus-visible { outline: 2px solid #1d1d1f !important; outline-offset: 2px; }

/* Etiqueta discreta acima do ícone (no mouse ou foco). */
.tw-flutuantes .tw-flt-rotulo {
	position: absolute; bottom: calc(100% + 14px); right: -6px; left: auto;
	background: #1d1d1f !important; color: #fff !important; font: 500 13px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
	letter-spacing: .01em; padding: 9px 12px; border-radius: 10px; white-space: nowrap;
	box-shadow: 0 8px 20px rgba(15, 23, 42, .18); pointer-events: none;
	opacity: 0; transform: translateY(4px); transition: opacity .3s ease, transform .3s cubic-bezier(.22, 1, .36, 1);
}
.tw-lado-esquerda .tw-flt-rotulo { left: -6px; right: auto; }
.tw-flutuantes .tw-flt:hover .tw-flt-rotulo, .tw-flutuantes .tw-flt:focus-visible .tw-flt-rotulo { opacity: 1; transform: none; }
/* O convite do WhatsApp aparece sozinho por alguns segundos ao abrir a página. */
.tw-flutuantes .tw-flt-wa .tw-flt-rotulo { animation: tw-convite 4.5s ease 1.6s 1; }

@keyframes tw-dock { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes tw-icone { from { opacity: 0; transform: scale(.7); } to { opacity: 1; transform: none; } }
@keyframes tw-convite { 0% { opacity: 0; transform: translateY(4px); } 10%, 85% { opacity: 1; transform: none; } 100% { opacity: 0; } }

@media (max-width: 600px) {
	.tw-flutuantes { gap: 5px; padding: 5px !important; }
	.tw-flutuantes .tw-flt { width: 46px !important; height: 46px !important; }
}
html.tw-travado .tw-flutuantes { display: none !important; }
.tw-flutuantes .tw-flt[hidden] { display: none !important; }
@media (prefers-reduced-motion: reduce) {
	.tw-flutuantes, .tw-flutuantes .tw-flt, .tw-flutuantes .tw-flt-wa .tw-flt-rotulo { animation: none; }
}