1687 lines
63 KiB
HTML
1687 lines
63 KiB
HTML
<!doctype html><html lang='pt-BR'><head><meta charset='utf-8'><meta name='viewport' content='width=device-width,initial-scale=1'>
|
||
<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css'>
|
||
<style>*{box-sizing:border-box;}body{padding:1rem;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;}/* ═══════════════════════════════════════════════
|
||
VARIÁVEIS E RESET
|
||
═══════════════════════════════════════════════ */
|
||
:root {
|
||
--navy: #0D1B2A;
|
||
--navy-mid: #152336;
|
||
--navy-light: #1E3248;
|
||
--amber: #F5A623;
|
||
--amber-dark: #C88410;
|
||
--amber-glow: rgba(245, 166, 35, 0.35);
|
||
--white: #FFFFFF;
|
||
--cream: #F7F3EC;
|
||
--cream-dark: #EDE8DF;
|
||
--muted: #7A8FA6;
|
||
--green: #22C55E;
|
||
|
||
--ff-display: 'Fraunces', Georgia, serif;
|
||
--ff-body: 'Sora', -apple-system, sans-serif;
|
||
|
||
--max-w: 1160px;
|
||
--radius: 6px;
|
||
}
|
||
|
||
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
|
||
|
||
html { scroll-behavior: smooth; font-size: 16px; }
|
||
|
||
body {
|
||
font-family: var(--ff-body);
|
||
background: var(--white);
|
||
color: var(--navy);
|
||
overflow-x: hidden;
|
||
-webkit-font-smoothing: antialiased;
|
||
}
|
||
|
||
img { max-width: 100%; display: block; }
|
||
a { text-decoration: none; }
|
||
|
||
/* ═══════════════════════════════════════════════
|
||
UTILITÁRIOS
|
||
═══════════════════════════════════════════════ */
|
||
.wrap {
|
||
max-width: var(--max-w);
|
||
margin: 0 auto;
|
||
padding: 0 28px;
|
||
}
|
||
|
||
/* Botões */
|
||
.btn {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 10px;
|
||
padding: 18px 38px;
|
||
border-radius: var(--radius);
|
||
font-family: var(--ff-body);
|
||
font-weight: 700;
|
||
font-size: 15px;
|
||
letter-spacing: 0.09em;
|
||
text-transform: uppercase;
|
||
cursor: pointer;
|
||
border: none;
|
||
transition: all .22s ease;
|
||
white-space: nowrap; /* sobrescrito para mobile via media query */
|
||
}
|
||
|
||
.btn-amber {
|
||
background: var(--amber);
|
||
color: var(--navy);
|
||
}
|
||
.btn-amber:hover {
|
||
background: var(--amber-dark);
|
||
transform: translateY(-2px);
|
||
box-shadow: 0 10px 32px var(--amber-glow);
|
||
}
|
||
.btn-amber:active { transform: translateY(0); }
|
||
|
||
.btn-outline-amber {
|
||
background: transparent;
|
||
color: var(--amber);
|
||
border: 2px solid var(--amber);
|
||
}
|
||
.btn-outline-amber:hover {
|
||
background: var(--amber);
|
||
color: var(--navy);
|
||
}
|
||
|
||
.btn-lg {
|
||
padding: 22px 52px;
|
||
font-size: 16px;
|
||
}
|
||
|
||
/* Labels de seção */
|
||
.sec-label {
|
||
display: inline-block;
|
||
font-size: 10.5px;
|
||
font-weight: 700;
|
||
letter-spacing: .22em;
|
||
text-transform: uppercase;
|
||
color: var(--amber-dark);
|
||
margin-bottom: 14px;
|
||
}
|
||
.sec-label--light { color: var(--amber); }
|
||
|
||
/* Títulos de seção */
|
||
.sec-title {
|
||
font-family: var(--ff-display);
|
||
font-size: clamp(30px, 4.8vw, 56px);
|
||
font-weight: 900;
|
||
line-height: 1.08;
|
||
letter-spacing: -.025em;
|
||
color: var(--navy);
|
||
margin-bottom: 48px;
|
||
}
|
||
.sec-title--light { color: var(--white); }
|
||
.sec-title--center { text-align: center; max-width: 760px; margin-left: auto; margin-right: auto; }
|
||
|
||
/* ═══════════════════════════════════════════════
|
||
ANIMAÇÕES DE SCROLL
|
||
═══════════════════════════════════════════════ */
|
||
.reveal {
|
||
opacity: 0;
|
||
transform: translateY(36px);
|
||
transition: opacity .65s cubic-bezier(.25,.8,.25,1),
|
||
transform .65s cubic-bezier(.25,.8,.25,1);
|
||
}
|
||
.reveal.visible {
|
||
opacity: 1;
|
||
transform: translateY(0);
|
||
}
|
||
.d1 { transition-delay: .08s; }
|
||
.d2 { transition-delay: .18s; }
|
||
.d3 { transition-delay: .28s; }
|
||
.d4 { transition-delay: .38s; }
|
||
.d5 { transition-delay: .48s; }
|
||
|
||
/* ═══════════════════════════════════════════════
|
||
NAVBAR
|
||
═══════════════════════════════════════════════ */
|
||
#navbar {
|
||
position: fixed;
|
||
top: 0; left: 0; right: 0;
|
||
z-index: 900;
|
||
padding: 22px 28px;
|
||
transition: padding .3s ease, background .3s ease, box-shadow .3s ease;
|
||
}
|
||
#navbar.scrolled {
|
||
padding: 14px 28px;
|
||
background: rgba(13, 27, 42, .94);
|
||
backdrop-filter: blur(18px);
|
||
-webkit-backdrop-filter: blur(18px);
|
||
box-shadow: 0 1px 0 rgba(245,166,35,.18);
|
||
}
|
||
.nav-inner {
|
||
max-width: var(--max-w);
|
||
margin: 0 auto;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
.nav-logo {
|
||
font-family: var(--ff-display);
|
||
font-size: 21px;
|
||
font-weight: 700;
|
||
letter-spacing: -.02em;
|
||
color: var(--white);
|
||
}
|
||
.nav-logo em { color: var(--amber); font-style: normal; }
|
||
.nav-cta {
|
||
padding: 11px 22px;
|
||
font-size: 12px;
|
||
letter-spacing: .11em;
|
||
}
|
||
|
||
/* ═══════════════════════════════════════════════
|
||
HERO
|
||
═══════════════════════════════════════════════ */
|
||
#hero {
|
||
position: relative;
|
||
min-height: 100vh;
|
||
background: var(--navy);
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 130px 28px 90px;
|
||
overflow: hidden;
|
||
}
|
||
|
||
/* Fundo decorativo */
|
||
.hero-bg-glow {
|
||
position: absolute;
|
||
pointer-events: none;
|
||
}
|
||
.hero-bg-glow--1 {
|
||
top: -15%;
|
||
right: -8%;
|
||
width: 680px;
|
||
height: 680px;
|
||
background: radial-gradient(circle, rgba(245,166,35,.09) 0%, transparent 68%);
|
||
border-radius: 50%;
|
||
}
|
||
.hero-bg-glow--2 {
|
||
bottom: -20%;
|
||
left: -5%;
|
||
width: 480px;
|
||
height: 480px;
|
||
background: radial-gradient(circle, rgba(245,166,35,.05) 0%, transparent 68%);
|
||
border-radius: 50%;
|
||
}
|
||
.hero-scale-icon {
|
||
position: absolute;
|
||
right: 4%;
|
||
top: 50%;
|
||
transform: translateY(-50%);
|
||
font-size: min(38vw, 420px);
|
||
color: var(--amber);
|
||
opacity: .028;
|
||
pointer-events: none;
|
||
line-height: 1;
|
||
}
|
||
.hero-sep {
|
||
position: absolute;
|
||
bottom: 0;
|
||
left: 0; right: 0;
|
||
height: 1px;
|
||
background: linear-gradient(90deg, transparent 0%, var(--amber) 50%, transparent 100%);
|
||
opacity: .22;
|
||
}
|
||
|
||
/* Conteúdo do hero */
|
||
.hero-content {
|
||
position: relative;
|
||
z-index: 1;
|
||
max-width: var(--max-w);
|
||
margin: 0 auto;
|
||
width: 100%;
|
||
}
|
||
.hero-eyebrow {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 10px;
|
||
font-size: 11px;
|
||
font-weight: 700;
|
||
letter-spacing: .22em;
|
||
text-transform: uppercase;
|
||
color: var(--amber);
|
||
margin-bottom: 28px;
|
||
}
|
||
.hero-eyebrow::before {
|
||
content: '';
|
||
display: block;
|
||
width: 30px;
|
||
height: 1px;
|
||
background: var(--amber);
|
||
}
|
||
.hero-h1 {
|
||
font-family: var(--ff-display);
|
||
font-size: clamp(40px, 7vw, 88px);
|
||
font-weight: 900;
|
||
line-height: 1.01;
|
||
letter-spacing: -.03em;
|
||
color: var(--white);
|
||
max-width: 820px;
|
||
margin-bottom: 30px;
|
||
}
|
||
.hero-h1 .acc { color: var(--amber); font-style: italic; }
|
||
.hero-sub {
|
||
font-size: clamp(16px, 2vw, 19px);
|
||
color: rgba(255,255,255,.68);
|
||
line-height: 1.75;
|
||
max-width: 540px;
|
||
font-weight: 300;
|
||
margin-bottom: 44px;
|
||
}
|
||
.hero-badges {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 18px;
|
||
margin-top: 22px;
|
||
}
|
||
.hero-badge {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 7px;
|
||
font-size: 13px;
|
||
color: rgba(255,255,255,.55);
|
||
font-weight: 500;
|
||
}
|
||
.hero-badge i { color: var(--green); font-size: 14px; }
|
||
|
||
/* ═══════════════════════════════════════════════
|
||
SEÇÃO: DOR / IDENTIFICAÇÃO
|
||
═══════════════════════════════════════════════ */
|
||
#pain {
|
||
background: var(--cream);
|
||
padding: 96px 28px;
|
||
}
|
||
.pain-grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
|
||
gap: 14px;
|
||
margin-bottom: 52px;
|
||
}
|
||
.pain-card {
|
||
background: var(--white);
|
||
border-radius: var(--radius);
|
||
padding: 22px 26px;
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 16px;
|
||
border-left: 3px solid var(--amber);
|
||
box-shadow: 0 2px 14px rgba(0,0,0,.06);
|
||
transition: transform .2s ease, box-shadow .2s ease;
|
||
}
|
||
.pain-card:hover {
|
||
transform: translateY(-3px);
|
||
box-shadow: 0 10px 28px rgba(0,0,0,.1);
|
||
}
|
||
.pain-icon {
|
||
width: 46px;
|
||
height: 46px;
|
||
min-width: 46px;
|
||
background: rgba(245,166,35,.1);
|
||
border-radius: 8px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: var(--amber-dark);
|
||
font-size: 19px;
|
||
}
|
||
.pain-text {
|
||
font-size: 15px;
|
||
font-weight: 500;
|
||
line-height: 1.45;
|
||
color: var(--navy);
|
||
padding-top: 10px;
|
||
}
|
||
.pain-punch {
|
||
background: var(--navy);
|
||
border-radius: var(--radius);
|
||
padding: 42px 36px;
|
||
text-align: center;
|
||
margin-bottom: 48px;
|
||
}
|
||
.pain-punch p {
|
||
font-family: var(--ff-display);
|
||
font-size: clamp(21px, 3.2vw, 36px);
|
||
font-weight: 300;
|
||
font-style: italic;
|
||
color: var(--white);
|
||
line-height: 1.3;
|
||
}
|
||
.pain-punch strong {
|
||
color: var(--amber);
|
||
font-weight: 700;
|
||
font-style: normal;
|
||
}
|
||
|
||
/* ═══════════════════════════════════════════════
|
||
SEÇÃO: BENEFÍCIOS
|
||
═══════════════════════════════════════════════ */
|
||
#benefits {
|
||
background: var(--navy);
|
||
padding: 96px 28px;
|
||
position: relative;
|
||
overflow: hidden;
|
||
}
|
||
#benefits::after {
|
||
content: '';
|
||
position: absolute;
|
||
inset: 0;
|
||
background:
|
||
radial-gradient(circle at 75% 25%, rgba(245,166,35,.06) 0%, transparent 55%),
|
||
radial-gradient(circle at 25% 75%, rgba(245,166,35,.04) 0%, transparent 50%);
|
||
pointer-events: none;
|
||
}
|
||
.benefits-grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
|
||
gap: 18px;
|
||
position: relative;
|
||
z-index: 1;
|
||
}
|
||
.benefit-card {
|
||
border: 1px solid rgba(245,166,35,.18);
|
||
border-radius: var(--radius);
|
||
padding: 34px 24px 28px;
|
||
text-align: center;
|
||
transition: all .28s ease;
|
||
position: relative;
|
||
overflow: hidden;
|
||
}
|
||
.benefit-card::after {
|
||
content: '';
|
||
position: absolute;
|
||
top: 0; left: 0; right: 0;
|
||
height: 2px;
|
||
background: var(--amber);
|
||
transform: scaleX(0);
|
||
transform-origin: left;
|
||
transition: transform .3s ease;
|
||
}
|
||
.benefit-card:hover {
|
||
background: rgba(245,166,35,.07);
|
||
border-color: rgba(245,166,35,.5);
|
||
transform: translateY(-5px);
|
||
box-shadow: 0 12px 36px rgba(0,0,0,.3);
|
||
}
|
||
.benefit-card:hover::after { transform: scaleX(1); }
|
||
.benefit-icon {
|
||
font-size: 30px;
|
||
color: var(--amber);
|
||
margin-bottom: 16px;
|
||
}
|
||
.benefit-label {
|
||
font-family: var(--ff-display);
|
||
font-size: 17px;
|
||
font-weight: 700;
|
||
color: var(--white);
|
||
line-height: 1.3;
|
||
}
|
||
|
||
/* ═══════════════════════════════════════════════
|
||
SEÇÃO: QUEBRA DE OBJEÇÃO / SEGURANÇA
|
||
═══════════════════════════════════════════════ */
|
||
#security {
|
||
background: var(--white);
|
||
padding: 96px 28px;
|
||
}
|
||
.security-grid {
|
||
display: grid;
|
||
grid-template-columns: 1fr 1fr;
|
||
gap: 80px;
|
||
align-items: center;
|
||
}
|
||
.checklist {
|
||
list-style: none;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 18px;
|
||
margin-bottom: 40px;
|
||
}
|
||
.checklist li {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 14px;
|
||
font-size: 17px;
|
||
font-weight: 500;
|
||
color: var(--navy);
|
||
}
|
||
.check-dot {
|
||
width: 28px;
|
||
height: 28px;
|
||
min-width: 28px;
|
||
background: var(--green);
|
||
border-radius: 50%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: var(--white);
|
||
font-size: 12px;
|
||
margin-top: 1px;
|
||
}
|
||
.security-quote {
|
||
font-family: var(--ff-display);
|
||
font-size: clamp(22px, 2.8vw, 36px);
|
||
font-weight: 700;
|
||
font-style: italic;
|
||
color: var(--navy);
|
||
line-height: 1.22;
|
||
padding: 38px 36px 38px 40px;
|
||
background: var(--cream);
|
||
border-radius: var(--radius);
|
||
border-left: 4px solid var(--amber);
|
||
position: relative;
|
||
}
|
||
.security-quote::before {
|
||
content: '\201C';
|
||
position: absolute;
|
||
top: -16px;
|
||
left: 22px;
|
||
font-size: 110px;
|
||
color: rgba(245,166,35,.13);
|
||
font-family: var(--ff-display);
|
||
line-height: 1;
|
||
pointer-events: none;
|
||
}
|
||
|
||
/* ═══════════════════════════════════════════════
|
||
SEÇÃO: COMO FUNCIONA
|
||
═══════════════════════════════════════════════ */
|
||
#how {
|
||
background: var(--cream);
|
||
padding: 96px 28px;
|
||
}
|
||
.steps-row {
|
||
display: grid;
|
||
grid-template-columns: repeat(4, 1fr);
|
||
gap: 8px;
|
||
position: relative;
|
||
margin-top: 16px;
|
||
}
|
||
.steps-row::before {
|
||
content: '';
|
||
position: absolute;
|
||
top: 43px;
|
||
left: calc(12.5% + 4px);
|
||
right: calc(12.5% + 4px);
|
||
height: 1px;
|
||
background: linear-gradient(90deg, var(--amber) 0%, var(--amber) 100%);
|
||
opacity: .2;
|
||
}
|
||
.step {
|
||
text-align: center;
|
||
padding: 0 16px;
|
||
}
|
||
.step-num {
|
||
width: 86px;
|
||
height: 86px;
|
||
border-radius: 50%;
|
||
background: var(--navy);
|
||
color: var(--amber);
|
||
font-family: var(--ff-display);
|
||
font-size: 30px;
|
||
font-weight: 900;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin: 0 auto 26px;
|
||
position: relative;
|
||
z-index: 1;
|
||
border: 2px solid rgba(245,166,35,.25);
|
||
transition: transform .2s ease, box-shadow .2s ease;
|
||
}
|
||
.step:hover .step-num {
|
||
transform: scale(1.06);
|
||
box-shadow: 0 8px 24px rgba(245,166,35,.2);
|
||
}
|
||
.step-badge {
|
||
position: absolute;
|
||
bottom: -3px;
|
||
right: -3px;
|
||
width: 26px;
|
||
height: 26px;
|
||
background: var(--amber);
|
||
border-radius: 50%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 10px;
|
||
color: var(--navy);
|
||
}
|
||
.step-title {
|
||
font-family: var(--ff-display);
|
||
font-size: 17px;
|
||
font-weight: 700;
|
||
color: var(--navy);
|
||
margin-bottom: 10px;
|
||
line-height: 1.25;
|
||
}
|
||
.step-desc {
|
||
font-size: 13.5px;
|
||
color: #5A6A7A;
|
||
line-height: 1.65;
|
||
}
|
||
|
||
/* ═══════════════════════════════════════════════
|
||
SEÇÃO: AUTORIDADE
|
||
═══════════════════════════════════════════════ */
|
||
#authority {
|
||
background: var(--navy);
|
||
padding: 96px 28px;
|
||
position: relative;
|
||
overflow: hidden;
|
||
}
|
||
.authority-grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
|
||
gap: 20px;
|
||
}
|
||
.authority-card {
|
||
background: rgba(255,255,255,.03);
|
||
border: 1px solid rgba(255,255,255,.08);
|
||
border-radius: var(--radius);
|
||
padding: 38px 28px;
|
||
transition: all .28s ease;
|
||
}
|
||
.authority-card:hover {
|
||
background: rgba(245,166,35,.06);
|
||
border-color: rgba(245,166,35,.3);
|
||
transform: translateY(-5px);
|
||
}
|
||
.authority-icon {
|
||
font-size: 30px;
|
||
color: var(--amber);
|
||
margin-bottom: 20px;
|
||
}
|
||
.authority-title {
|
||
font-family: var(--ff-display);
|
||
font-size: 19px;
|
||
font-weight: 700;
|
||
color: var(--white);
|
||
margin-bottom: 10px;
|
||
line-height: 1.2;
|
||
}
|
||
.authority-desc {
|
||
font-size: 13.5px;
|
||
color: rgba(255,255,255,.45);
|
||
line-height: 1.7;
|
||
}
|
||
|
||
/* ═══════════════════════════════════════════════
|
||
SEÇÃO: URGÊNCIA + CTA FINAL
|
||
═══════════════════════════════════════════════ */
|
||
#urgency {
|
||
background: var(--white);
|
||
padding: 96px 28px;
|
||
}
|
||
.urgency-alert {
|
||
display: flex;
|
||
gap: 20px;
|
||
align-items: flex-start;
|
||
background: linear-gradient(135deg, #FFFBF0 0%, #FFF4D4 100%);
|
||
border: 1px solid rgba(245,166,35,.4);
|
||
border-left: 5px solid var(--amber);
|
||
border-radius: var(--radius);
|
||
padding: 30px 34px;
|
||
margin-bottom: 64px;
|
||
}
|
||
.urgency-alert-icon {
|
||
font-size: 26px;
|
||
color: var(--amber-dark);
|
||
flex-shrink: 0;
|
||
margin-top: 3px;
|
||
}
|
||
.urgency-alert-body {
|
||
font-size: 16px;
|
||
line-height: 1.72;
|
||
color: var(--navy);
|
||
}
|
||
.urgency-alert-body strong { color: var(--amber-dark); }
|
||
|
||
.cta-final-box {
|
||
background: var(--navy);
|
||
border-radius: 10px;
|
||
padding: 80px 40px;
|
||
text-align: center;
|
||
position: relative;
|
||
overflow: hidden;
|
||
}
|
||
.cta-final-box::before {
|
||
content: '';
|
||
position: absolute;
|
||
top: -40%;
|
||
left: -20%;
|
||
width: 140%;
|
||
height: 140%;
|
||
background: radial-gradient(circle at 50% 50%, rgba(245,166,35,.09) 0%, transparent 60%);
|
||
pointer-events: none;
|
||
}
|
||
.cta-final-h2 {
|
||
font-family: var(--ff-display);
|
||
font-size: clamp(30px, 5vw, 60px);
|
||
font-weight: 900;
|
||
color: var(--white);
|
||
line-height: 1.04;
|
||
letter-spacing: -.025em;
|
||
margin-bottom: 14px;
|
||
position: relative;
|
||
}
|
||
.cta-final-h2 .acc { color: var(--amber); }
|
||
.cta-final-sub {
|
||
font-size: 18px;
|
||
color: rgba(255,255,255,.58);
|
||
max-width: 480px;
|
||
margin: 0 auto 44px;
|
||
line-height: 1.65;
|
||
}
|
||
|
||
/* ═══════════════════════════════════════════════
|
||
FOOTER
|
||
═══════════════════════════════════════════════ */
|
||
footer {
|
||
background: #070E17;
|
||
padding: 60px 28px 40px;
|
||
}
|
||
.footer-inner {
|
||
max-width: var(--max-w);
|
||
margin: 0 auto;
|
||
}
|
||
.footer-logo {
|
||
font-family: var(--ff-display);
|
||
font-size: 24px;
|
||
font-weight: 700;
|
||
color: var(--white);
|
||
letter-spacing: -.02em;
|
||
margin-bottom: 6px;
|
||
}
|
||
.footer-logo em { color: var(--amber); font-style: normal; }
|
||
.footer-tag {
|
||
font-size: 12.5px;
|
||
color: rgba(255,255,255,.35);
|
||
margin-bottom: 28px;
|
||
}
|
||
.footer-contact a {
|
||
color: var(--amber);
|
||
font-weight: 700;
|
||
font-size: 18px;
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 8px;
|
||
transition: opacity .2s;
|
||
}
|
||
.footer-contact a:hover { opacity: .8; }
|
||
.footer-contact p {
|
||
font-size: 13px;
|
||
color: rgba(255,255,255,.35);
|
||
margin-top: 5px;
|
||
}
|
||
.footer-hr {
|
||
border: none;
|
||
border-top: 1px solid rgba(255,255,255,.07);
|
||
margin: 32px 0;
|
||
}
|
||
.footer-bottom {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: space-between;
|
||
align-items: flex-start;
|
||
gap: 24px;
|
||
}
|
||
.footer-disclaimer {
|
||
font-size: 11.5px;
|
||
color: rgba(255,255,255,.22);
|
||
max-width: 580px;
|
||
line-height: 1.65;
|
||
}
|
||
.footer-links {
|
||
display: flex;
|
||
gap: 22px;
|
||
flex-wrap: wrap;
|
||
}
|
||
.footer-links a {
|
||
font-size: 13px;
|
||
font-weight: 600;
|
||
color: rgba(255,255,255,.5);
|
||
border-bottom: 1px solid rgba(255,255,255,.2);
|
||
padding-bottom: 2px;
|
||
transition: color .2s, border-color .2s;
|
||
cursor: pointer;
|
||
}
|
||
.footer-links a:hover {
|
||
color: var(--amber);
|
||
border-color: var(--amber);
|
||
}
|
||
.footer-copy {
|
||
text-align: center;
|
||
font-size: 11px;
|
||
color: rgba(255,255,255,.12);
|
||
margin-top: 36px;
|
||
}
|
||
|
||
/* ═══════════════════════════════════════════════
|
||
BOTÃO FLUTUANTE WHATSAPP
|
||
═══════════════════════════════════════════════ */
|
||
.wa-float {
|
||
position: fixed;
|
||
bottom: 26px;
|
||
right: 26px;
|
||
z-index: 800;
|
||
width: 62px;
|
||
height: 62px;
|
||
border-radius: 50%;
|
||
background: #25D366;
|
||
color: var(--white);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 30px;
|
||
box-shadow: 0 4px 22px rgba(37,211,102,.5);
|
||
animation: wa-pulse 2.6s ease-in-out infinite;
|
||
transition: transform .2s ease, animation .2s;
|
||
}
|
||
.wa-float:hover {
|
||
transform: scale(1.12);
|
||
box-shadow: 0 6px 30px rgba(37,211,102,.65);
|
||
animation: none;
|
||
}
|
||
@keyframes wa-pulse {
|
||
0%, 100% {
|
||
box-shadow: 0 4px 22px rgba(37,211,102,.45),
|
||
0 0 0 0 rgba(37,211,102,.35);
|
||
}
|
||
55% {
|
||
box-shadow: 0 4px 22px rgba(37,211,102,.45),
|
||
0 0 0 16px rgba(37,211,102,0);
|
||
}
|
||
}
|
||
|
||
/* ═══════════════════════════════════════════════
|
||
MODAIS
|
||
═══════════════════════════════════════════════ */
|
||
.modal-overlay {
|
||
display: none;
|
||
position: fixed;
|
||
inset: 0;
|
||
background: rgba(5,12,22,.78);
|
||
z-index: 1100;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 20px;
|
||
backdrop-filter: blur(6px);
|
||
-webkit-backdrop-filter: blur(6px);
|
||
}
|
||
.modal-overlay.open { display: flex; }
|
||
|
||
.modal {
|
||
background: var(--white);
|
||
border-radius: 10px;
|
||
width: 100%;
|
||
max-width: 680px;
|
||
max-height: 88vh;
|
||
display: flex;
|
||
flex-direction: column;
|
||
overflow: hidden;
|
||
box-shadow: 0 32px 100px rgba(0,0,0,.5);
|
||
}
|
||
.modal-head {
|
||
padding: 22px 30px;
|
||
background: var(--navy);
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
flex-shrink: 0;
|
||
}
|
||
.modal-head h2 {
|
||
font-family: var(--ff-display);
|
||
font-size: 19px;
|
||
font-weight: 700;
|
||
color: var(--white);
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 10px;
|
||
}
|
||
.modal-head h2 i { color: var(--amber); }
|
||
.modal-close-btn {
|
||
width: 36px;
|
||
height: 36px;
|
||
border-radius: 50%;
|
||
background: rgba(255,255,255,.1);
|
||
border: none;
|
||
cursor: pointer;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: var(--white);
|
||
font-size: 15px;
|
||
transition: background .2s;
|
||
}
|
||
.modal-close-btn:hover { background: rgba(245,166,35,.3); }
|
||
|
||
.modal-body {
|
||
padding: 32px 30px;
|
||
overflow-y: auto;
|
||
flex: 1;
|
||
}
|
||
.modal-body h3 {
|
||
font-family: var(--ff-display);
|
||
font-size: 16.5px;
|
||
font-weight: 700;
|
||
color: var(--navy);
|
||
margin: 28px 0 10px;
|
||
}
|
||
.modal-body h3:first-child { margin-top: 0; }
|
||
.modal-body p {
|
||
font-size: 14px;
|
||
color: #4B5563;
|
||
line-height: 1.78;
|
||
margin-bottom: 12px;
|
||
}
|
||
.modal-body ul {
|
||
list-style: none;
|
||
margin-bottom: 14px;
|
||
}
|
||
.modal-body ul li {
|
||
font-size: 14px;
|
||
color: #4B5563;
|
||
line-height: 1.7;
|
||
padding-left: 20px;
|
||
position: relative;
|
||
margin-bottom: 6px;
|
||
}
|
||
.modal-body ul li::before {
|
||
content: '—';
|
||
position: absolute;
|
||
left: 0;
|
||
color: var(--amber-dark);
|
||
font-weight: 700;
|
||
}
|
||
.modal-body .modal-date {
|
||
font-size: 11.5px;
|
||
color: #9CA3AF;
|
||
margin-top: 28px;
|
||
}
|
||
|
||
.modal-foot {
|
||
padding: 18px 30px;
|
||
border-top: 1px solid #E5E7EB;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
flex-shrink: 0;
|
||
}
|
||
.modal-foot button {
|
||
padding: 12px 30px;
|
||
background: var(--navy);
|
||
color: var(--white);
|
||
border: none;
|
||
border-radius: var(--radius);
|
||
font-family: var(--ff-body);
|
||
font-weight: 600;
|
||
font-size: 14px;
|
||
cursor: pointer;
|
||
transition: background .2s, color .2s;
|
||
}
|
||
.modal-foot button:hover {
|
||
background: var(--amber);
|
||
color: var(--navy);
|
||
}
|
||
|
||
/* ═══════════════════════════════════════════════
|
||
RESPONSIVO — SISTEMA COMPLETO
|
||
Breakpoints: ≤1024px · ≤768px · ≤480px · ≤360px
|
||
═══════════════════════════════════════════════ */
|
||
|
||
/* ── Desktop médio (≤ 1024px) ────────────────── */
|
||
@media (max-width: 1024px) {
|
||
.steps-row { gap: 6px; }
|
||
.security-grid { gap: 52px; }
|
||
#hero { padding: 120px 28px 80px; }
|
||
}
|
||
|
||
/* ── Tablet largo (≤ 900px) ──────────────────── */
|
||
@media (max-width: 900px) {
|
||
#hero { padding: 108px 24px 68px; }
|
||
#pain, #benefits, #security,
|
||
#how, #authority, #urgency { padding: 72px 24px; }
|
||
|
||
.security-grid {
|
||
grid-template-columns: 1fr;
|
||
gap: 44px;
|
||
}
|
||
.steps-row {
|
||
grid-template-columns: 1fr 1fr;
|
||
gap: 40px 20px;
|
||
}
|
||
.steps-row::before { display: none; }
|
||
}
|
||
|
||
/* ── Tablet (≤ 768px) ────────────────────────── */
|
||
@media (max-width: 768px) {
|
||
.wrap { padding: 0 20px; }
|
||
|
||
/* Navbar */
|
||
#navbar { padding: 16px 20px; }
|
||
#navbar.scrolled{ padding: 12px 20px; }
|
||
.nav-logo { font-size: 18px; }
|
||
|
||
/* Hero */
|
||
#hero { padding: 96px 20px 60px; }
|
||
.hero-h1 { font-size: clamp(30px, 8.5vw, 54px); }
|
||
.hero-sub { font-size: 15.5px; margin-bottom: 36px; }
|
||
.hero-eyebrow{ font-size: 10px; }
|
||
|
||
/* DOR */
|
||
.pain-grid {
|
||
grid-template-columns: 1fr;
|
||
gap: 12px;
|
||
}
|
||
.pain-punch { padding: 30px 24px; }
|
||
|
||
/* Benefícios — 2 colunas em tablet */
|
||
.benefits-grid {
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 14px;
|
||
}
|
||
|
||
/* Segurança */
|
||
.security-grid { grid-template-columns: 1fr; gap: 40px; }
|
||
.checklist li { font-size: 15px; }
|
||
.security-quote { padding: 28px 24px 28px 28px; }
|
||
|
||
/* Como Funciona */
|
||
.steps-row {
|
||
grid-template-columns: 1fr 1fr;
|
||
gap: 36px 16px;
|
||
}
|
||
.step-num { width: 72px; height: 72px; font-size: 26px; }
|
||
|
||
/* Autoridade — 2 colunas */
|
||
.authority-grid {
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 16px;
|
||
}
|
||
.authority-card { padding: 28px 20px; }
|
||
|
||
/* Urgência */
|
||
.urgency-alert {
|
||
flex-direction: column;
|
||
gap: 12px;
|
||
padding: 22px 20px;
|
||
}
|
||
.cta-final-box { padding: 60px 24px; }
|
||
.cta-final-sub { font-size: 16px; }
|
||
|
||
/* Botões */
|
||
.btn-lg { padding: 18px 28px; font-size: 14px; }
|
||
|
||
/* Footer */
|
||
.footer-bottom { flex-direction: column; gap: 20px; }
|
||
|
||
/* Modal */
|
||
.modal-body { padding: 24px 18px; }
|
||
.modal-head, .modal-foot { padding: 18px; }
|
||
.modal-head h2 { font-size: 16px; }
|
||
}
|
||
|
||
/* ── Mobile (≤ 480px) ────────────────────────── */
|
||
@media (max-width: 480px) {
|
||
.wrap { padding: 0 16px; }
|
||
|
||
/* Navbar */
|
||
#navbar { padding: 14px 16px; }
|
||
#navbar.scrolled{ padding: 10px 16px; }
|
||
.nav-logo { font-size: 17px; }
|
||
|
||
/* Hero */
|
||
#hero { padding: 88px 16px 52px; }
|
||
.hero-h1 { font-size: clamp(28px, 9vw, 46px); }
|
||
.hero-sub { font-size: 15px; margin-bottom: 28px; }
|
||
.hero-badges { flex-direction: column; gap: 10px; }
|
||
|
||
/* Seções — padding reduzido */
|
||
#pain, #benefits, #security,
|
||
#how, #authority, #urgency { padding: 60px 16px; }
|
||
.sec-title { margin-bottom: 32px; }
|
||
|
||
/* DOR */
|
||
.pain-card { padding: 18px 18px; }
|
||
.pain-punch { padding: 26px 18px; }
|
||
|
||
/* Benefícios — mantém 2 cols até ser 1 */
|
||
.benefits-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
|
||
.benefit-card { padding: 24px 14px 20px; }
|
||
.benefit-icon { font-size: 24px; margin-bottom: 10px; }
|
||
.benefit-label { font-size: 14px; }
|
||
|
||
/* Segurança */
|
||
.security-quote { font-size: clamp(19px, 5vw, 28px); }
|
||
|
||
/* Como Funciona — 1 coluna */
|
||
.steps-row { grid-template-columns: 1fr; gap: 32px; }
|
||
.step { padding: 0 8px; }
|
||
|
||
/* Autoridade — 1 coluna */
|
||
.authority-grid { grid-template-columns: 1fr; gap: 14px; }
|
||
.authority-card { padding: 24px 18px; }
|
||
|
||
/* CTA Final */
|
||
.cta-final-box { padding: 48px 16px; border-radius: 8px; }
|
||
.cta-final-sub { font-size: 15px; margin-bottom: 30px; }
|
||
|
||
/* Botões — full-width, permite quebra de linha */
|
||
.btn-lg {
|
||
width: 100%;
|
||
padding: 18px 16px;
|
||
font-size: 14px;
|
||
white-space: normal;
|
||
line-height: 1.3;
|
||
}
|
||
|
||
/* Footer */
|
||
footer { padding: 48px 16px 30px; }
|
||
.footer-bottom { flex-direction: column; gap: 18px; }
|
||
.footer-links { gap: 16px; }
|
||
|
||
/* WA float — levemente menor */
|
||
.wa-float {
|
||
width: 54px;
|
||
height: 54px;
|
||
font-size: 26px;
|
||
bottom: 18px;
|
||
right: 18px;
|
||
}
|
||
|
||
/* Modal */
|
||
.modal-overlay { padding: 12px; }
|
||
.modal { max-height: 92vh; border-radius: 8px; }
|
||
}
|
||
|
||
/* ── Mobile muito pequeno (≤ 360px / 320px) ─── */
|
||
@media (max-width: 360px) {
|
||
.wrap { padding: 0 12px; }
|
||
|
||
/* Navbar — esconde CTA, mantém logo */
|
||
.nav-cta { display: none; }
|
||
#navbar { padding: 14px 12px; }
|
||
|
||
/* Hero */
|
||
#hero { padding: 80px 12px 44px; }
|
||
.hero-h1 { font-size: 26px; letter-spacing: -.02em; }
|
||
.hero-sub{ font-size: 14px; }
|
||
|
||
/* Seções */
|
||
#pain, #benefits, #security,
|
||
#how, #authority, #urgency { padding: 48px 12px; }
|
||
|
||
/* Benefícios — força 1 coluna */
|
||
.benefits-grid { grid-template-columns: 1fr; }
|
||
|
||
/* Botões */
|
||
.btn-lg { font-size: 13px; padding: 16px 12px; }
|
||
|
||
/* Frase impacto */
|
||
.pain-punch p { font-size: 18px; }
|
||
|
||
/* Urgência */
|
||
.cta-final-box { padding: 40px 12px; }
|
||
.urgency-alert { padding: 18px 14px; }
|
||
|
||
/* WA float */
|
||
.wa-float { width: 50px; height: 50px; font-size: 23px; bottom: 14px; right: 14px; }
|
||
|
||
/* Footer */
|
||
footer { padding: 40px 12px 28px; }
|
||
}</style></head><body><!-- Google tag (gtag.js) -->
|
||
<script async="" src="https://www.googletagmanager.com/gtag/js?id=AW-17742537221"></script>
|
||
<script>
|
||
window.dataLayer = window.dataLayer || [];
|
||
function gtag(){dataLayer.push(arguments);}
|
||
gtag('js', new Date());
|
||
|
||
gtag('config', 'AW-17742537221');
|
||
</script>
|
||
<meta charset="UTF-8" class="">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0" class="">
|
||
<title class="">Seu Advogado Já | Advocacia Trabalhista Online em São Paulo</title>
|
||
<meta name="description" content="Não recebeu seus direitos trabalhistas? Fale agora com um advogado trabalhista online em São Paulo. Análise gratuita, sem compromisso. Você só paga se ganhar." class="">
|
||
<meta name="robots" content="index, follow" class="">
|
||
<meta property="og:title" content="Seu Advogado Já | Advocacia Trabalhista Online – São Paulo" class="">
|
||
<meta property="og:description" content="Descubra se você tem valores a receber. Consulta gratuita com advogado trabalhista online em São Paulo. Sem compromisso, só resultado." class="">
|
||
<meta property="og:type" content="website" class="">
|
||
<meta property="og:url" content="https://seuadvogadoja.com.br" class="">
|
||
<meta property="og:image" content="https://seuadvogadoja.com.br/og-image.jpg" class="">
|
||
|
||
<!-- Google Fonts: Fraunces (display) + Sora (corpo) -->
|
||
<link rel="preconnect" href="https://fonts.googleapis.com" class="">
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="" class="">
|
||
<link href="https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,500;0,9..144,700;0,9..144,900;1,9..144,300;1,9..144,700;1,9..144,900&family=Sora:wght@300;400;500;600;700&display=swap" rel="stylesheet" class="">
|
||
|
||
<!-- Font Awesome 6 -->
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css" crossorigin="anonymous" class="">
|
||
|
||
|
||
|
||
|
||
|
||
<!-- ══════════════════════════════════════════
|
||
NAVBAR FIXA
|
||
══════════════════════════════════════════ -->
|
||
<nav id="navbar" class="scrolled">
|
||
<div class="nav-inner">
|
||
<a href="#hero" class="nav-logo">Seu Advogado <em class="">Já</em></a>
|
||
<a href="https://wa.me/551151991450" target="_blank" rel="noopener noreferrer" class="btn btn-amber nav-cta">
|
||
<i class="fab fa-whatsapp"></i> FALAR COM ADVOGADO
|
||
</a>
|
||
</div>
|
||
</nav>
|
||
|
||
<!-- ══════════════════════════════════════════
|
||
BOTÃO WHATSAPP FLUTUANTE
|
||
══════════════════════════════════════════ -->
|
||
<a href="https://wa.me/551151991450" target="_blank" rel="noopener noreferrer" class="wa-float" aria-label="Falar pelo WhatsApp">
|
||
<i class="fab fa-whatsapp"></i>
|
||
</a>
|
||
|
||
<!-- ══════════════════════════════════════════
|
||
1. HERO
|
||
══════════════════════════════════════════ -->
|
||
<section id="hero" class="">
|
||
<div class="hero-bg-glow hero-bg-glow--1"></div>
|
||
<div class="hero-bg-glow hero-bg-glow--2"></div>
|
||
<div class="hero-scale-icon"><i class="fas fa-scale-balanced"></i></div>
|
||
<div class="hero-sep"></div>
|
||
|
||
<div class="hero-content">
|
||
<p class="hero-eyebrow reveal visible">Advocacia Trabalhista Especializada</p>
|
||
|
||
<h1 class="hero-h1 reveal d1 visible">
|
||
Não recebeu seus<br class="">
|
||
direitos trabalhistas?<br class="">
|
||
Está com Dúvidas? <span class="acc">esclareça já</span><br class="">
|
||
Consulte-nos agora mesmo!!!
|
||
</h1>
|
||
|
||
<p class="hero-sub reveal d2 visible">
|
||
Fale agora com um advogado trabalhista online e descubra se você tem valores a receber, sem compromisso.
|
||
</p>
|
||
|
||
<div class="reveal d3 visible">
|
||
<a href="https://wa.me/551151991450" target="_blank" rel="noopener noreferrer" class="btn btn-amber btn-lg">
|
||
<i class="fab fa-whatsapp"></i> FALAR COM ADVOGADO AGORA
|
||
</a>
|
||
<div class="hero-badges">
|
||
<span class="hero-badge"><i class="fas fa-circle-check"></i> Análise imediata</span>
|
||
<span class="hero-badge"><i class="fas fa-circle-check"></i> 100% online</span>
|
||
<span class="hero-badge"><i class="fas fa-circle-check"></i> Sem compromisso</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ══════════════════════════════════════════
|
||
2. BLOCO DE DOR — IDENTIFICAÇÃO
|
||
══════════════════════════════════════════ -->
|
||
<section id="pain" class="">
|
||
<div class="wrap">
|
||
<p class="sec-label reveal visible">Você se identifica?</p>
|
||
<h2 class="sec-title reveal d1 visible">Você está passando por<br class="">alguma dessas situações?</h2>
|
||
|
||
<div class="pain-grid">
|
||
<div class="pain-card reveal d1 visible">
|
||
<div class="pain-icon"><i class="fas fa-file-invoice-dollar"></i></div>
|
||
<p class="pain-text">Foi demitido e acha que não recebeu corretamente</p>
|
||
</div>
|
||
<div class="pain-card reveal d2 visible">
|
||
<div class="pain-icon"><i class="fas fa-piggy-bank"></i></div>
|
||
<p class="pain-text">A empresa não deposita seu FGTS</p>
|
||
</div>
|
||
<div class="pain-card reveal d3 visible">
|
||
<div class="pain-icon"><i class="fas fa-clock"></i></div>
|
||
<p class="pain-text">Trabalhou horas extras sem receber</p>
|
||
</div>
|
||
<div class="pain-card reveal d4 visible">
|
||
<div class="pain-icon"><i class="fas fa-triangle-exclamation"></i></div>
|
||
<p class="pain-text">Está sendo pressionado a pedir demissão</p>
|
||
</div>
|
||
<div class="pain-card reveal d5 visible">
|
||
<div class="pain-icon"><i class="fas fa-ban"></i></div>
|
||
<p class="pain-text">Sofre assédio moral no trabalho</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="pain-punch reveal visible">
|
||
<p class="">Você pode estar <strong class="">perdendo </strong> — e nem sabe disso.</p>
|
||
</div>
|
||
|
||
<div style="text-align:center;" class="reveal d1 visible">
|
||
<a href="https://wa.me/551151991450" target="_blank" rel="noopener noreferrer" class="btn btn-amber btn-lg">
|
||
<i class="fab fa-whatsapp"></i> QUERO SABER SE TENHO DIREITO
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ══════════════════════════════════════════
|
||
3. BENEFÍCIOS — O QUE VOCÊ PODE RECEBER
|
||
══════════════════════════════════════════ -->
|
||
<section id="benefits" class="">
|
||
<div class="wrap" style="position:relative;z-index:1;">
|
||
<p class="sec-label sec-label--light reveal visible">O que você pode ter direito</p>
|
||
<h2 class="sec-title sec-title--light reveal d1 visible">Exemplo veja o que você<br class="">pode ter direito a receber:</h2>
|
||
|
||
<div class="benefits-grid">
|
||
<div class="benefit-card reveal d1 visible">
|
||
<div class="benefit-icon"><i class="fas fa-coins"></i></div>
|
||
<p class="benefit-label">FGTS + multa de 40%</p>
|
||
</div>
|
||
<div class="benefit-card reveal d2 visible">
|
||
<div class="benefit-icon"><i class="fas fa-hourglass-half"></i></div>
|
||
<p class="benefit-label">Horas extras não pagas</p>
|
||
</div>
|
||
<div class="benefit-card reveal d3 visible">
|
||
<div class="benefit-icon"><i class="fas fa-file-contract"></i></div>
|
||
<p class="benefit-label">Verbas rescisórias corrigidas</p>
|
||
</div>
|
||
<div class="benefit-card reveal d4 visible">
|
||
<div class="benefit-icon"><i class="fas fa-gavel"></i></div>
|
||
<p class="benefit-label">Indenizações trabalhistas</p>
|
||
</div>
|
||
<div class="benefit-card reveal d5 visible">
|
||
<div class="benefit-icon"><i class="fas fa-id-card"></i></div>
|
||
<p class="benefit-label">Reconhecimento de vínculo PJ → CLT</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ══════════════════════════════════════════
|
||
4. QUEBRA DE OBJEÇÃO — SEGURANÇA
|
||
══════════════════════════════════════════ -->
|
||
<section id="security" class="">
|
||
<div class="wrap">
|
||
<div class="security-grid">
|
||
<!-- Esquerda -->
|
||
<div class="">
|
||
<p class="sec-label reveal visible">Sem risco para você</p>
|
||
<h2 class="sec-title reveal d1 visible">Atendimento simples,<br class="">rápido e sem risco</h2>
|
||
|
||
<ul class="checklist">
|
||
<li class="reveal d1 visible">
|
||
<span class="check-dot"><i class="fas fa-check"></i></span>
|
||
Atendimento 100% online
|
||
</li>
|
||
<li class="reveal d2 visible">
|
||
<span class="check-dot"><i class="fas fa-check"></i></span>
|
||
Fale direto com um advogado
|
||
</li>
|
||
<li class="reveal d3 visible">
|
||
<span class="check-dot"><i class="fas fa-check"></i></span>
|
||
Análise imediata do seu caso
|
||
</li>
|
||
<li class="reveal d4 visible">
|
||
<span class="check-dot"><i class="fas fa-check"></i></span>
|
||
Você só paga se ganhar
|
||
</li>
|
||
</ul>
|
||
|
||
<a href="https://wa.me/551151991450" target="_blank" rel="noopener noreferrer" class="btn btn-amber reveal d5 visible">
|
||
<i class="fab fa-whatsapp"></i> FALAR COM ADVOGADO AGORA
|
||
</a>
|
||
</div>
|
||
|
||
<!-- Direita -->
|
||
<div class="reveal d2 visible">
|
||
<blockquote class="security-quote">
|
||
Sem risco.<br class="">Sem compromisso.<br class="">Só satisfação.
|
||
</blockquote>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ══════════════════════════════════════════
|
||
5. COMO FUNCIONA — 4 PASSOS
|
||
══════════════════════════════════════════ -->
|
||
<section id="how" class="">
|
||
<div class="wrap">
|
||
<p class="sec-label reveal visible" style="text-align:center; display:block;">Processo simplificado</p>
|
||
<h2 class="sec-title sec-title--center reveal d1 visible">
|
||
Veja como funciona:<br class="">É mais simples do que você imagina
|
||
</h2>
|
||
|
||
<div class="steps-row">
|
||
<div class="step reveal d1 visible">
|
||
<div class="step-num">
|
||
1
|
||
<span class="step-badge"><i class="fab fa-whatsapp"></i></span>
|
||
</div>
|
||
<h3 class="step-title">Você entra em contato pelo WhatsApp</h3>
|
||
<p class="step-desc">Simples e rápido. Fale com um advogado diretamente, sem intermediários.</p>
|
||
</div>
|
||
|
||
<div class="step reveal d2 visible">
|
||
<div class="step-num">
|
||
2
|
||
<span class="step-badge"><i class="fas fa-magnifying-glass"></i></span>
|
||
</div>
|
||
<h3 class="step-title">Um advogado analisa seu caso</h3>
|
||
<p class="step-desc">Avaliação completa e gratuita da sua situação trabalhista.</p>
|
||
</div>
|
||
|
||
<div class="step reveal d3 visible">
|
||
<div class="step-num">
|
||
3
|
||
<span class="step-badge"><i class="fas fa-lightbulb"></i></span>
|
||
</div>
|
||
<h3 class="step-title">Você recebe orientação clara e objetiva</h3>
|
||
<p class="step-desc">Saberá exatamente o que pode receber e quais são seus direitos.</p>
|
||
</div>
|
||
|
||
<div class="step reveal d4 visible">
|
||
<div class="step-num">
|
||
4
|
||
<span class="step-badge"><i class="fas fa-gavel"></i></span>
|
||
</div>
|
||
<h3 class="step-title">Iniciamos sua ação (se fizer sentido)</h3>
|
||
<p class="step-desc">Sem pressão. A decisão é sempre sua, com total transparência.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ══════════════════════════════════════════
|
||
6. AUTORIDADE — POR QUE NOS ESCOLHER
|
||
══════════════════════════════════════════ -->
|
||
<section id="authority" class="">
|
||
<div class="wrap">
|
||
<p class="sec-label sec-label--light reveal visible">Nosso diferencial</p>
|
||
<h2 class="sec-title sec-title--light reveal d1 visible">Por que escolher<br class="">nosso escritório?</h2>
|
||
|
||
<div class="authority-grid">
|
||
<div class="authority-card reveal d1 visible">
|
||
<div class="authority-icon"><i class="fas fa-scale-balanced"></i></div>
|
||
<h3 class="authority-title">Especialistas em Direito do Trabalho</h3>
|
||
<p class="authority-desc">Foco exclusivo em direito trabalhista. Conhecemos cada detalhe da legislação que protege você.</p>
|
||
</div>
|
||
<div class="authority-card reveal d2 visible">
|
||
<div class="authority-icon"><i class="fas fa-heart"></i></div>
|
||
<h3 class="authority-title">Atendimento humanizado e ágil</h3>
|
||
<p class="authority-desc">Você não é apenas mais um número. Cada caso recebe atenção individualizada e dedicada.</p>
|
||
</div>
|
||
<div class="authority-card reveal d3 visible">
|
||
<div class="authority-icon"><i class="fas fa-trophy"></i></div>
|
||
<h3 class="authority-title">Experiência em ações trabalhistas</h3>
|
||
<p class="authority-desc">Ampla experiência em recuperar direitos de trabalhadores em todas as instâncias.</p>
|
||
</div>
|
||
<div class="authority-card reveal d4 visible">
|
||
<div class="authority-icon"><i class="fas fa-lock"></i></div>
|
||
<h3 class="authority-title">Sigilo absoluto das informações</h3>
|
||
<p class="authority-desc">Tudo o que você compartilha é protegido pelo sigilo profissional e pela LGPD.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ══════════════════════════════════════════
|
||
7. URGÊNCIA + CTA FINAL
|
||
══════════════════════════════════════════ -->
|
||
<section id="urgency" class="">
|
||
<div class="wrap">
|
||
<div class="urgency-alert reveal visible">
|
||
<span class="urgency-alert-icon"><i class="fas fa-triangle-exclamation"></i></span>
|
||
<div class="urgency-alert-body">
|
||
<strong class="">Atenção: você tem até 2 anos</strong> após sair da empresa para entrar com ação trabalhista.<br class="">
|
||
Quanto antes agir, maiores suas chances de receber todos os seus direitos.
|
||
</div>
|
||
</div>
|
||
|
||
<div class="cta-final-box reveal d1 visible">
|
||
<h2 class="cta-final-h2">
|
||
Não fique com dúvidas<br class="">
|
||
<span class="acc">consulte Agora!!!</span>
|
||
</h2>
|
||
<p class="cta-final-sub">
|
||
Descubra agora se você tem valores a receber.<br class="">Análise gratuita, sem compromisso.
|
||
</p>
|
||
<a href="https://wa.me/551151991450" target="_blank" rel="noopener noreferrer" class="btn btn-amber btn-lg">
|
||
<i class="fab fa-whatsapp"></i> FALAR COM ADVOGADO AGORA
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ══════════════════════════════════════════
|
||
FOOTER
|
||
══════════════════════════════════════════ -->
|
||
<footer class="">
|
||
<div class="footer-inner">
|
||
<p class="footer-logo">Seu Advogado <em class="">Já</em></p>
|
||
<p class="footer-tag">Advocacia Trabalhista · São Paulo – SP · 100% Online</p>
|
||
|
||
<div class="footer-contact">
|
||
<a href="https://wa.me/551151991450" target="_blank" rel="noopener noreferrer" class="">
|
||
<i class="fab fa-whatsapp"></i> (11) 5199-1450
|
||
</a>
|
||
<p class="">Atendimento exclusivamente online · São Paulo – SP</p>
|
||
</div>
|
||
|
||
<hr class="footer-hr">
|
||
|
||
<div class="footer-bottom">
|
||
<p class="footer-disclaimer">
|
||
Este site não constitui consultoria jurídica. As informações disponibilizadas têm caráter geral e informativo. A contratação efetiva dos serviços jurídicos ocorre mediante contrato escrito assinado pelas partes.
|
||
</p>
|
||
<div class="footer-links">
|
||
<a onclick="openModal('privacy')" role="button" tabindex="0" onkeydown="if(event.key==='Enter')openModal('privacy')" class="">
|
||
Política de Privacidade
|
||
</a>
|
||
<a onclick="openModal('terms')" role="button" tabindex="0" onkeydown="if(event.key==='Enter')openModal('terms')" class="">
|
||
Termos de Serviço
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<p class="footer-copy">© 2024 Seu Advogado Já. Todos os direitos reservados.</p>
|
||
</div>
|
||
</footer>
|
||
|
||
<!-- ══════════════════════════════════════════
|
||
MODAL: POLÍTICA DE PRIVACIDADE
|
||
══════════════════════════════════════════ -->
|
||
<div class="modal-overlay" id="modal-privacy" role="dialog" aria-modal="true" aria-labelledby="privacy-title">
|
||
<div class="modal">
|
||
<div class="modal-head">
|
||
<h2 id="privacy-title" class="">
|
||
<i class="fas fa-shield-halved"></i> Política de Privacidade
|
||
</h2>
|
||
<button class="modal-close-btn" onclick="closeModal('privacy')" aria-label="Fechar">
|
||
<i class="fas fa-xmark"></i>
|
||
</button>
|
||
</div>
|
||
|
||
<div class="modal-body">
|
||
<p class="">Esta Política de Privacidade descreve como o escritório <strong class="">Seu Advogado Já</strong> coleta, utiliza, armazena e protege os dados pessoais dos usuários que entram em contato por meio deste site, em conformidade com a <strong class="">Lei Geral de Proteção de Dados (LGPD) – Lei nº 13.709/2018</strong>.</p>
|
||
|
||
<h3 class="">1. Dados Coletados</h3>
|
||
<p class="">Ao entrar em contato conosco por meio do WhatsApp ou outros canais disponibilizados neste site, podemos coletar os seguintes dados pessoais:</p>
|
||
<ul class="">
|
||
<li class="">Nome completo</li>
|
||
<li class="">Número de telefone (WhatsApp)</li>
|
||
<li class="">Conteúdo das mensagens enviadas (descrição do caso)</li>
|
||
<li class="">Documentos ou informações adicionais compartilhados voluntariamente pelo usuário</li>
|
||
</ul>
|
||
|
||
<h3 class="">2. Finalidade do Uso dos Dados</h3>
|
||
<p class="">Os dados coletados são utilizados exclusivamente para as seguintes finalidades:</p>
|
||
<ul class="">
|
||
<li class="">Realizar o contato jurídico inicial e a triagem do caso</li>
|
||
<li class="">Analisar a situação trabalhista descrita pelo usuário</li>
|
||
<li class="">Prestar orientação jurídica personalizada</li>
|
||
<li class="">Formalizar eventual relação contratual para prestação de serviços advocatícios</li>
|
||
</ul>
|
||
|
||
<h3 class="">3. Compartilhamento de Dados</h3>
|
||
<p class="">Seus dados pessoais são tratados com absoluto sigilo. <strong class="">Não vendemos, cedemos nem repassamos seus dados a terceiros.</strong> As informações são acessadas exclusivamente pelos advogados do escritório, estritamente para fins de prestação dos serviços jurídicos solicitados.</p>
|
||
<p class="">O compartilhamento de dados somente ocorrerá quando expressamente exigido por lei ou por determinação judicial.</p>
|
||
|
||
<h3 class="">4. Proteção dos Dados</h3>
|
||
<p class="">Adotamos medidas técnicas e organizacionais adequadas para proteger seus dados pessoais contra acesso não autorizado, alteração, divulgação ou destruição, incluindo:</p>
|
||
<ul class="">
|
||
<li class="">Observância do sigilo profissional previsto no Estatuto da OAB (Lei nº 8.906/1994)</li>
|
||
<li class="">Cumprimento integral da LGPD – Lei nº 13.709/2018</li>
|
||
<li class="">Controle restrito de acesso às informações dos clientes</li>
|
||
</ul>
|
||
|
||
<h3 class="">5. Direitos do Titular dos Dados</h3>
|
||
<p class="">Nos termos da LGPD, você tem os seguintes direitos em relação aos seus dados pessoais:</p>
|
||
<ul class="">
|
||
<li class=""><strong class="">Acesso:</strong> solicitar a confirmação da existência de tratamento e o acesso aos seus dados</li>
|
||
<li class=""><strong class="">Correção:</strong> solicitar a correção de dados incompletos, inexatos ou desatualizados</li>
|
||
<li class=""><strong class="">Exclusão:</strong> solicitar a eliminação dos seus dados pessoais, ressalvadas as hipóteses legais de retenção obrigatória</li>
|
||
<li class=""><strong class="">Portabilidade:</strong> solicitar a portabilidade dos dados a outro fornecedor de serviço</li>
|
||
<li class=""><strong class="">Revogação do consentimento:</strong> retirar o consentimento previamente concedido a qualquer momento, sem prejuízo à licitude do tratamento realizado anteriormente</li>
|
||
</ul>
|
||
|
||
<h3 class="">6. Contato para Solicitações</h3>
|
||
<p class="">Para exercer seus direitos ou esclarecer dúvidas sobre o tratamento de seus dados pessoais, entre em contato diretamente com o responsável pelo tratamento de dados (DPO) do escritório:</p>
|
||
<ul class="">
|
||
<li class="">Telefone / WhatsApp: <strong class="">(11) 5199-1450</strong></li>
|
||
</ul>
|
||
|
||
<h3 class="">7. Atualizações desta Política</h3>
|
||
<p class="">Esta Política de Privacidade pode ser atualizada periodicamente para refletir mudanças legais ou operacionais. Recomendamos a consulta regular deste documento para se manter informado sobre como protegemos seus dados.</p>
|
||
|
||
<p class="modal-date">Última atualização: abril de 2024.</p>
|
||
</div>
|
||
|
||
<div class="modal-foot">
|
||
<button onclick="closeModal('privacy')" class="">Fechar</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ══════════════════════════════════════════
|
||
MODAL: TERMOS DE SERVIÇO
|
||
══════════════════════════════════════════ -->
|
||
<div class="modal-overlay" id="modal-terms" role="dialog" aria-modal="true" aria-labelledby="terms-title">
|
||
<div class="modal">
|
||
<div class="modal-head">
|
||
<h2 id="terms-title" class="">
|
||
<i class="fas fa-file-contract"></i> Termos de Serviço
|
||
</h2>
|
||
<button class="modal-close-btn" onclick="closeModal('terms')" aria-label="Fechar">
|
||
<i class="fas fa-xmark"></i>
|
||
</button>
|
||
</div>
|
||
|
||
<div class="modal-body">
|
||
<p class="">Ao acessar este site e entrar em contato com o escritório <strong class="">Seu Advogado Já</strong>, você declara ter lido e concordar com os presentes Termos de Serviço. Leia atentamente antes de prosseguir.</p>
|
||
|
||
<h3 class="">1. Caráter Informativo do Site</h3>
|
||
<p class="">Este site tem <strong class="">caráter estritamente informativo</strong> e destina-se à divulgação dos serviços de advocacia trabalhista prestados pelo escritório. As informações disponibilizadas <strong class="">não configuram consultoria jurídica formal</strong>, tampouco estabelecem relação advocatícia entre o usuário e o escritório.</p>
|
||
<p class="">Para orientação jurídica específica ao seu caso, é necessário estabelecer contato formal com um de nossos advogados e firmar o respectivo instrumento contratual.</p>
|
||
|
||
<h3 class="">2. Contato Inicial via WhatsApp — Triagem</h3>
|
||
<p class="">O contato realizado por meio do WhatsApp disponibilizado neste site <strong class="">constitui o início de uma triagem</strong> para avaliação da viabilidade do atendimento jurídico. Esse contato inicial <strong class="">não estabelece relação contratual</strong> entre o usuário e o escritório, nem gera obrigações de qualquer natureza para as partes.</p>
|
||
|
||
<h3 class="">3. Formalização da Contratação</h3>
|
||
<p class="">A contratação efetiva dos serviços jurídicos do escritório <strong class="">Seu Advogado Já</strong> somente se perfaz mediante a assinatura de <strong class="">contrato escrito</strong>, celebrado entre o cliente e o advogado responsável, com expressa concordância de ambas as partes quanto ao objeto, condições e honorários.</p>
|
||
<p class="">Nenhuma comunicação informal — seja por WhatsApp, telefone ou qualquer outro canal — substitui o instrumento contratual formal.</p>
|
||
|
||
<h3 class="">4. Honorários Advocatícios</h3>
|
||
<p class="">Os serviços jurídicos prestados pelo escritório adotam, preferencialmente, a modalidade de <strong class="">honorários de êxito</strong>: o cliente somente paga pelos serviços caso obtenha resultado favorável na demanda judicial ou extrajudicial.</p>
|
||
<ul class="">
|
||
<li class="">O percentual e as condições específicas dos honorários são definidos individualmente, conforme a complexidade e as particularidades de cada caso</li>
|
||
<li class="">Todas as condições são formalizadas no contrato escrito antes do início dos trabalhos</li>
|
||
<li class="">Custas processuais e despesas específicas poderão ser objeto de acordo distinto, conforme o caso concreto</li>
|
||
</ul>
|
||
|
||
<h3 class="">5. Limitação de Responsabilidade</h3>
|
||
<p class="">O escritório <strong class="">Seu Advogado Já</strong> não se responsabiliza por decisões tomadas pelo usuário com base exclusivamente nas informações gerais disponibilizadas neste site, sem a devida consulta jurídica formal com um advogado habilitado.</p>
|
||
|
||
<h3 class="">6. Legislação Aplicável e Foro</h3>
|
||
<p class="">Os presentes Termos de Serviço são regidos pela <strong class="">legislação brasileira</strong>, especialmente pelo Código Civil, pelo Estatuto da OAB (Lei nº 8.906/1994), pelas resoluções do Conselho Federal da OAB e pela LGPD (Lei nº 13.709/2018).</p>
|
||
<p class="">Fica eleito o <strong class="">foro da Comarca de São Paulo – SP</strong> como competente para dirimir quaisquer controvérsias oriundas destes Termos de Serviço ou da prestação dos serviços jurídicos, com renúncia a qualquer outro, por mais privilegiado que seja.</p>
|
||
|
||
<h3 class="">7. Atualizações dos Termos</h3>
|
||
<p class="">Estes Termos de Serviço podem ser atualizados a qualquer momento, sem aviso prévio. O acesso continuado ao site implica a aceitação integral das versões atualizadas.</p>
|
||
|
||
<p class="modal-date">Última atualização: abril de 2024.</p>
|
||
</div>
|
||
|
||
<div class="modal-foot">
|
||
<button onclick="closeModal('terms')" class="">Fechar</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ══════════════════════════════════════════
|
||
JAVASCRIPT
|
||
══════════════════════════════════════════ -->
|
||
<script>
|
||
// ── Navbar scroll ────────────────────────
|
||
const navbar = document.getElementById('navbar');
|
||
window.addEventListener('scroll', () => {
|
||
navbar.classList.toggle('scrolled', window.scrollY > 48);
|
||
}, { passive: true });
|
||
|
||
// ── Scroll reveals (Intersection Observer) ─
|
||
const reveals = document.querySelectorAll('.reveal');
|
||
const revealObs = new IntersectionObserver((entries) => {
|
||
entries.forEach(e => {
|
||
if (e.isIntersecting) {
|
||
e.target.classList.add('visible');
|
||
revealObs.unobserve(e.target);
|
||
}
|
||
});
|
||
}, { threshold: 0.1, rootMargin: '0px 0px -56px 0px' });
|
||
|
||
reveals.forEach(el => revealObs.observe(el));
|
||
|
||
// Hero elements fire immediately after load
|
||
window.addEventListener('DOMContentLoaded', () => {
|
||
document.querySelectorAll('#hero .reveal').forEach((el, i) => {
|
||
setTimeout(() => el.classList.add('visible'), 80 + i * 100);
|
||
});
|
||
});
|
||
|
||
// ── Modal helpers ─────────────────────────
|
||
function openModal(id) {
|
||
const el = document.getElementById('modal-' + id);
|
||
if (!el) return;
|
||
el.classList.add('open');
|
||
document.body.style.overflow = 'hidden';
|
||
// Move focus to the modal box
|
||
const firstBtn = el.querySelector('button, [tabindex]');
|
||
if (firstBtn) setTimeout(() => firstBtn.focus(), 60);
|
||
}
|
||
|
||
function closeModal(id) {
|
||
const el = document.getElementById('modal-' + id);
|
||
if (!el) return;
|
||
el.classList.remove('open');
|
||
document.body.style.overflow = '';
|
||
}
|
||
|
||
// Close on backdrop click
|
||
document.querySelectorAll('.modal-overlay').forEach(overlay => {
|
||
overlay.addEventListener('click', e => {
|
||
if (e.target === overlay) {
|
||
overlay.classList.remove('open');
|
||
document.body.style.overflow = '';
|
||
}
|
||
});
|
||
});
|
||
|
||
// Close on Escape key
|
||
document.addEventListener('keydown', e => {
|
||
if (e.key === 'Escape') {
|
||
document.querySelectorAll('.modal-overlay.open').forEach(m => {
|
||
m.classList.remove('open');
|
||
document.body.style.overflow = '';
|
||
});
|
||
}
|
||
});
|
||
</script><script type="text/javascript" async="" src="https://googleads.g.doubleclick.net/pagead/viewthroughconversion/17742537221/?random=1775873136547&cv=11&fst=1775873136547&bg=ffffff&guid=ON&async=1&en=gtag.config&gtm=45be6481v9235867401za200zd9235867401xec&gcd=13l3l3l3l1l1&dma=0&tag_exp=0~115938466~115938469&u_w=1920&u_h=1080&url=https%3A%2F%2Fescolaninjawp.com.br%2Feditor-html-online-gratis.html&rcb=0&frm=1&tiba=Seu%20Advogado%20J%C3%A1%20%7C%20Advocacia%20Trabalhista%20Online%20em%20S%C3%A3o%20Paulo&hn=www.googleadservices.com&npa=0&pscdl=noapi&auid=1725651277.1775873137&uaa=x86&uab=64&uafvl=Google%2520Chrome%3B147.0.7727.56%7CNot.A%252FBrand%3B8.0.0.0%7CChromium%3B147.0.7727.56&uamb=0&uam=&uap=Windows&uapv=10.0.0&uaw=0&data=event%3Dgtag.config&rfmt=3&fmt=4"></script></body></html> |