ajustes de performance (LCP) e nos menus

Signed-off-by: Rodrigo Bertoldo de Sousa Martins <rodrigo.sousa.577@gmail.com>
This commit is contained in:
rodrigo committed 2026-02-21 18:12:02 -03:00
1 parent 6058620486
commit 21191aa9cf
1 file changed
+37 -9
+37 -9
View File
@@ -3,7 +3,21 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="theme-color" content="#20337b">
<title>Martins & Vieira - Advocacia Especializada</title>
<!-- Resource Hints para domínios externos -->
<link rel="dns-prefetch" href="https://wa.me">
<link rel="dns-prefetch" href="https://www.martinsevieira.adv.br">
<link rel="dns-prefetch" href="https://www.instagram.com">
<link rel="dns-prefetch" href="https://www.facebook.com">
<link rel="preconnect" href="https://advx.martinsevieira.adv.br">
<link rel="preconnect" href="https://cloud.martinsevieira.adv.br">
<link rel="preconnect" href="https://chat.martinsevieira.adv.br">
<!-- Preload da imagem crítica do logo -->
<link rel="preload" as="image" href="fotos/logo.png" fetchpriority="high">
<style>
* {
margin: 0;
@@ -22,6 +36,7 @@
overflow-y: auto;
position: relative;
padding: 20px 0;
contain: layout style;
}
/* Background animado com gradiente */
@@ -37,6 +52,7 @@
animation: gradientAnimation 15s ease infinite;
z-index: -2;
will-change: background-position;
contain: strict;
}
@keyframes gradientAnimation {
@@ -56,21 +72,24 @@
flex-direction: column;
align-items: center;
justify-content: center;
overflow: visible;
}
.logo {
width: 100px;
height: 100px;
margin: 0 auto 15px;
margin: 0 auto 12px;
background: url('fotos/logo.png') center/80% no-repeat rgba(255, 255, 255, 0.95);
border-radius: 50%;
border: 3px solid rgba(255, 255, 255, 0.3);
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
contain: layout style paint;
}
.header {
color: white;
margin-bottom: 20px;
margin-bottom: 15px;
contain: layout style paint;
}
.header h1 {
@@ -106,7 +125,7 @@
.save-contact {
background: linear-gradient(135deg, #20337b, #2d4a9e);
margin-bottom: 25px;
margin-bottom: 18px;
}
.save-contact:hover {
@@ -121,6 +140,7 @@
gap: 15px;
margin-bottom: 20px;
flex-wrap: wrap;
overflow: visible;
}
.icon-item {
@@ -130,10 +150,11 @@
text-decoration: none;
color: white;
transition: transform 0.3s ease;
position: relative;
}
.icon-item:hover {
transform: translateY(-5px);
transform: scale(1.08);
}
.icon-box {
@@ -148,6 +169,8 @@
margin-bottom: 8px;
border: 2px solid rgba(255, 255, 255, 0.2);
transition: all 0.3s ease;
position: relative;
z-index: 1;
}
.icon-item:hover .icon-box {
@@ -179,7 +202,7 @@
.pix-button {
background: linear-gradient(135deg, #32BCAD, #00A86B);
margin-bottom: 20px;
margin-bottom: 15px;
position: relative;
overflow: hidden;
}
@@ -245,11 +268,12 @@
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
transform: translateY(30px) scale(0.9);
opacity: 0;
will-change: transform, opacity;
contain: layout style paint;
}
.modal.active .modal-content {
animation: slideUpScale 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
will-change: transform, opacity;
}
@keyframes slideUpScale {
@@ -363,7 +387,7 @@
transition: all 0.2s ease;
border: 2px solid transparent;
position: relative;
will-change: transform, opacity;
contain: layout style paint;
}
.pix-code-area::before {
@@ -394,6 +418,7 @@
.pix-code-area.active {
display: block;
animation: slideInFade 0.4s ease forwards;
will-change: transform, opacity;
}
@keyframes slideInFade {
@@ -424,8 +449,9 @@
display: flex;
justify-content: center;
gap: 12px;
margin-top: 20px;
margin-top: 15px;
flex-wrap: wrap;
overflow: visible;
}
.small-icon {
@@ -440,11 +466,13 @@
border: 1px solid rgba(255, 255, 255, 0.2);
transition: all 0.3s ease;
text-decoration: none;
position: relative;
z-index: 1;
}
.small-icon:hover {
background: rgba(255, 255, 255, 0.2);
transform: translateY(-3px);
transform: scale(1.15);
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}