/* variables.css */
:root {
--color-primary: #EF8619;
--color-dark: #13171A;
--color-white: #FFFFFF;
--color-text-light: #D5D7DA;
--color-text-hero: #F5F5F5;
--color-text-dark: #3D3F43;
--color-bg-light: #FAFAFA;
--font-body: 'Inter', sans-serif;
--font-heading: 'Raleway', sans-serif;
--font-text: 'Helvetica Neue', 'Helvetica', Arial, sans-serif;
--container-width: 1360px;
--container-padding: clamp(19.2px, 5.8vw, 112px);
--hero-overlay:
linear-gradient(22.58deg, rgba(19, 23, 26, 0) 53.13%, rgba(19, 23, 26, 0.3) 80.81%, rgba(234, 221, 30, 0.6) 119.31%),
linear-gradient(284.45deg, rgba(22, 90, 170, 0) 34.22%, rgba(19, 23, 26, 0.6) 85.04%),
linear-gradient(247.26deg, rgba(19, 23, 26, 0) 17.62%, rgba(19, 23, 26, 0.4) 51.76%, rgba(0, 45, 98, 0.8) 106.93%);
--nav-pill-bg: rgba(0, 0, 0, 0.08);
--nav-pill-border: 1px solid rgba(255, 255, 255, 0.08);
--nav-pill-blur: blur(5px);
--nav-dropdown-bg: rgba(19, 23, 26, 0.55);
--nav-dropdown-border: 1px solid rgba(255, 255, 255, 0.12);
--nav-dropdown-blur: blur(20px) saturate(160%);
--scroll-btn-bg: rgba(255, 255, 255, 0.2);
--scroll-btn-border: 1px solid rgba(255, 255, 255, 0.2);
--scroll-btn-blur: blur(3px);
--transition-fast: 0.2s ease;
--transition-base: 0.3s ease;
--fs-body: clamp(12px, 0.9vw, 16px);
--fs-body-sm: clamp(10.4px, 0.78vw, 14px);
--fs-body-small: clamp(8.32px, 0.78vw, 14px);
--fs-card-title: clamp(12.8px, 1vw, 18px);
--fs-step-number: clamp(14.4px, 1.04vw, 20px);
--cta-font-small: clamp(10.24px, 0.8vw, 14.4px);
--cta-font: clamp(12.8px, 1vw, 18px);
--cta-pad-y: clamp(12.8px, 1.04vw, 20px);
--cta-pad-x: clamp(19.2px, 1.67vw, 32px);
--cta-height: clamp(41.6px, 3.33vw, 64px);
--cta-icon: clamp(16px, 1.25vw, 24px);
--btn-size: clamp(28.8px, 2.3vw, 44px);
--btn-size-smartphone: clamp(37.44px, 2.99vw, 57.2px);
--scroll-btn: clamp(25.6px, 2.08vw, 40px);
--scroll-btn-smartphone: clamp(33.28px, 2.704vw, 52px);
--line-width: clamp(38.4px, 3.7vw, 71px);
--gap-card: clamp(12.8px, 1.25vw, 24px);
--gap-content: clamp(9.6px, 0.83vw, 16px);
--nav-logo-w: clamp(112.9px, 9.27vw, 177.4px);
--nav-logo-h: clamp(42.74px, 3.53vw, 67.54px);
--section-pad-xl: clamp(44.8px, 2.92vw, 56px);
--section-pad-lg: clamp(38.4px, 2.625vw, 50.4px);
--section-pad-md: clamp(32px, 2.31vw, 44.8px);
--gap-xl: clamp(38.4px, 3.78vw, 72.8px);
--gap-lg: clamp(32px, 2.94vw, 56px);
--gap-md: clamp(19.2px, 1.75vw, 33.6px);
--gap-sm: clamp(16px, 1.19vw, 22.4px);
--fs-hero-title: clamp(24px, 2.2vw, 40px);
--fs-section-xl: clamp(22.4px, 2.3vw, 44px);
--fs-section-lg: clamp(19.2px, 1.8vw, 32px);
--fs-cta-title: clamp(17.6px, 1.5vw, 28px);
--fs-label: clamp(12.8px, 1vw, 18px);
--fs-step: clamp(14.4px, 1.25vw, 22px);
--fs-display: clamp(22.4px, 2.5vw, 48px);
--fs-heading-2xl: clamp(20.8px, 2.19vw, 42px);
--fs-heading-xl: clamp(19.2px, 1.98vw, 38px);
--fs-heading-lg: clamp(17.6px, 1.77vw, 34px);
--fs-heading-md: clamp(14.4px, 1.35vw, 26px);
--fs-heading-sm: clamp(12.8px, 1.25vw, 24px);
--fs-body-lg: clamp(12px, 1.04vw, 20px);
--fs-body-md: clamp(12px, 0.94vw, 18px);
--fs-caption: clamp(9.6px, 0.68vw, 13px);
--fs-caption-sm: clamp(8px, 0.57vw, 11px);
--fs-article-h2: clamp(17.6px, 1.46vw, 28px);
--fs-article-h3: clamp(14.4px, 1.15vw, 22px);
--hero-height: clamp(320px, 31.5vw, 597px);
--hero-height-sm: clamp(352px, 28.13vw, 540px);
--hero-pad-top: clamp(96px, 9.38vw, 180px);
--hero-pad-bottom: clamp(44.8px, 5vw, 96px);
--hero-clip-h: clamp(48px, 6.25vw, 120px);
--hero-clip-v: clamp(40px, 5.05vw, 97px);
--color-bg-navy: #0f2a47;
--card-services-w: clamp(160px, 16.5vw, 280px);
--card-portfolio-w: clamp(201.6px, 11.025vw, 211.4px);
--card-portfolio-h: clamp(266.4px, 14.49vw, 278.6px);
--cert-icon: clamp(80px, 7.82vw, 150.7px);
--cert-logo: clamp(64px, 6.28vw, 119.78px);
--diferenciais-card-overflow: 113px;
}

/* global.css */
@font-face {
font-family: 'Helvetica Neue';
src: url('../fonts/HelveticaNeue-Regular-latin.woff2') format('woff2');
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Inter';
src: url('../fonts/Inter-Regular-latin.woff2') format('woff2');
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Inter';
src: url('../fonts/Inter-Medium-latin.woff2') format('woff2');
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('../fonts/Raleway-SemiBold-latin.woff2') format('woff2');
font-weight: 600;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Barlow Condensed';
src: url('../fonts/BarlowCondensed-SemiBold-latin.woff2') format('woff2');
font-weight: 600;
font-style: normal;
font-display: swap;
}
*,
*::before,
*::after {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html {
scroll-behavior: smooth;
-webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color: transparent;
background-color: var(--color-dark);
}
body {
font-family: var(--font-body);
font-size: var(--fs-body);
line-height: 1.5;
color: var(--color-text-dark);
background-color: var(--color-bg-light);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
a,
button,
[role="button"] {
-webkit-tap-highlight-color: transparent;
}
img {
max-width: 100%;
height: auto;
display: block;
-webkit-user-drag: none;
user-select: none;
-webkit-user-select: none;
}
a {
color: inherit;
text-decoration: none;
}
ul, ol {
list-style: none;
}
button {
font: inherit;
cursor: pointer;
border: none;
background: none;
}
.container {
width: 100%;
max-width: var(--container-width);
margin: 0 auto;
padding-left: var(--container-padding);
padding-right: var(--container-padding);
}
.hero__scroll {
position: absolute;
bottom: var(--gap-card);
left: 50%;
transform: translateX(-50%);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 1px;
width: var(--scroll-btn);
height: var(--scroll-btn);
padding: clamp(6px, 0.42vw, 8px);
background: var(--scroll-btn-bg);
border: var(--scroll-btn-border);
backdrop-filter: var(--scroll-btn-blur);
-webkit-backdrop-filter: var(--scroll-btn-blur);
border-radius: 100px;
color: var(--color-white);
flex-shrink: 0;
transition: background var(--transition-fast);
z-index: 3;
text-decoration: none;
}
.hero__scroll:hover {
background: rgba(255, 255, 255, 0.35);
}
.hero__scroll-arrow {
animation: scrollPulse 2s ease-in-out infinite;
}
.hero__scroll-arrow--bottom {
animation-delay: 0.3s;
}
@keyframes scrollPulse {
0%, 100% { opacity: 1; }
50% { opacity: 0.15; }
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
.whatsapp-float {
position: fixed;
right: clamp(16px, 1.6vw, 28px);
bottom: clamp(16px, 1.6vw, 28px);
z-index: 900;
display: flex;
align-items: center;
justify-content: center;
width: clamp(52px, 4vw, 60px);
height: clamp(52px, 4vw, 60px);
border-radius: 50%;
background: #25D366;            
color: #FFFFFF;                
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
transition: background var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast);
}
.whatsapp-float:hover {
background: #1EBE5B;            
transform: translateY(-2px);
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.3);
}
.whatsapp-float svg {
width: clamp(30px, 2.4vw, 36px);
height: clamp(30px, 2.4vw, 36px);
}
@media (prefers-reduced-motion: reduce) {
.whatsapp-float { transition: background var(--transition-fast); }
.whatsapp-float:hover { transform: none; }
}

/* header.css */
.top-bar {
background-color: var(--color-dark);
font-family: var(--font-body);
font-size: var(--fs-body-sm);
line-height: 1.21;
letter-spacing: -0.01em;
color: var(--color-text-light);
}
.top-bar__inner {
display: flex;
justify-content: space-between;
align-items: center;
padding-top: clamp(5px, 0.94vw, 18px);
padding-bottom: clamp(5px, 0.94vw, 18px);
}
.top-bar__inner * {
font-size: var(--fs-body-small);
}
@media(min-width: 768px){
.top-bar__inner svg {
height: clamp(10.4px, 0.78vw, 14px);
width: clamp(10.4px, 0.78vw, 14px);
}
}
.top-bar__contact {
display: flex;
align-items: center;
gap: clamp(6px, 0.42vw, 8px);
}
.top-bar__separator {
color: var(--color-text-light);
font-size: var(--fs-body-sm);
line-height: 1;
}
.top-bar__item {
display: inline-flex;
align-items: center;
gap: clamp(6px, 0.42vw, 8px);
color: var(--color-text-light);
transition: color var(--transition-fast);
}
a.top-bar__item:hover {
color: var(--color-white);
}
.top-bar__item svg {
flex-shrink: 0;
}
.top-bar__social {
display: flex;
align-items: center;
gap: clamp(6px, 0.42vw, 8px);
}
.top-bar__social-label {
line-height: 1.21;
letter-spacing: -0.01em;
color: var(--color-text-light);
}
.top-bar__social-label * {
font-size: var(--fs-body-small);
}
@media(min-width: 768px){
.top-bar__social-icons img {
height: clamp(10.4px, 0.78vw, 14px);
width: clamp(10.4px, 0.78vw, 14px);
}
}
.top-bar__social-icons {
display: flex;
align-items: center;
gap: clamp(6px, 0.42vw, 8px);
}
.top-bar__social-icons a {
color: var(--color-text-light);
display: inline-flex;
align-items: center;
transition: color var(--transition-fast);
}
.top-bar__social-icons a:hover {
color: var(--color-primary);
}
.site-header {
position: absolute;
top: clamp(44px, 2.81vw, 54px);
left: 0;
right: 0;
z-index: 100;
}
.nav {
display: flex;
justify-content: space-between;
align-items: center;
padding-top: var(--gap-content);
padding-bottom: var(--gap-content);
gap: clamp(35.84px, 2.576vw, 49.28px);
}
.nav__logo img {
width: var(--nav-logo-w);
height: var(--nav-logo-h);
object-fit: contain;
}
.nav__menu {
display: flex;
align-items: center;
gap: clamp(6.72px, 0.4704vw, 8.96px);
background: var(--nav-pill-bg);
border: var(--nav-pill-border);
backdrop-filter: var(--nav-pill-blur);
-webkit-backdrop-filter: var(--nav-pill-blur);
border-radius: 100px;
padding: clamp(4.48px, 0.3472vw, 6.72px);
}
.nav__link {
display: inline-flex;
align-items: center;
gap: 4px;
font-family: var(--font-body);
font-weight: 400;
font-size: clamp(14.1px, 0.84vw, 16.1px);
line-height: 1.19;
letter-spacing: -0.01em;
color: var(--color-white);
padding: clamp(4.48px, 0.3472vw, 6.72px) clamp(11.2px, 0.7056vw, 13.44px);
border-radius: 100px;
transition: all var(--transition-fast);
white-space: nowrap;
}
.nav__link:hover {
opacity: 0.8;
}
.nav__link--active {
background: var(--color-white);
color: var(--color-dark);
font-weight: 500;
padding: clamp(4.48px, 0.3472vw, 6.72px) clamp(11.2px, 0.7056vw, 13.44px);
border-radius: 1000px;
}
.nav__link--active:hover {
opacity: 1;
}
.nav__dot {
display: inline-block;
width: 4px;
height: 4px;
background: var(--color-primary);
border-radius: 50%;
}
@keyframes nav-highlight-pulse {
0%, 100% { box-shadow: 0 0 0 0 rgba(239, 134, 25, 0); }
30%      { box-shadow: 0 0 0 3px rgba(239, 134, 25, 0.6); }
}
.nav__link--highlight {
animation: nav-highlight-pulse 1s ease-out 4;
}
@media (prefers-reduced-motion: reduce) {
.nav__link--highlight {
animation: none;
box-shadow: 0 0 0 3px rgba(239, 134, 25, 0.6);
}
}
.nav__link--soon {
opacity: 0.55;
cursor: not-allowed;
}
.nav__link--soon:hover {
opacity: 0.55;
}
.nav__item--dropdown {
position: relative;
display: inline-flex;
align-items: center;
}
.nav__link--has-dropdown {
background: none;
border: none;
cursor: pointer;
}
.nav__link--has-dropdown.nav__link--active {
background: var(--color-white);
color: var(--color-dark);
}
.nav__item--dropdown .nav__link--soon {
cursor: pointer;
opacity: 1;
}
.nav__chevron {
transition: transform var(--transition-fast);
flex-shrink: 0;
}
.nav__item--dropdown[data-open="true"] .nav__chevron {
transform: rotate(180deg);
}
.nav__dropdown {
position: absolute;
top: calc(100% + clamp(6px, 0.42vw, 8px));
left: 50%;
transform: translateX(-50%);
width: clamp(200px, 12.24vw, 235px);
background: var(--nav-dropdown-bg);
border: 1px solid rgba(255, 255, 255, 0.18);
backdrop-filter: var(--nav-dropdown-blur);
-webkit-backdrop-filter: var(--nav-dropdown-blur);
border-radius: 24px;
padding: clamp(6px, 0.42vw, 8px);
display: flex;
flex-direction: column;
gap: 2px;
opacity: 0;
visibility: hidden;
pointer-events: none;
transform: translateX(-50%) translateY(-8px);
transition: opacity var(--transition-fast), transform var(--transition-fast), visibility var(--transition-fast);
z-index: 200;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}
.nav__item--dropdown[data-open="true"] .nav__dropdown {
opacity: 1;
visibility: visible;
pointer-events: auto;
transform: translateX(-50%) translateY(0);
}
.nav__dropdown::before {
content: "";
position: absolute;
bottom: 100%;
left: 0;
right: 0;
height: clamp(8px, 0.52vw, 12px);
}
.nav__dropdown-link {
display: flex;
align-items: center;
gap: 8px;
min-height: var(--btn-size);
padding: clamp(4px, 0.31vw, 6px) clamp(10px, 0.63vw, 12px);
border-radius: 16px;
font-family: var(--font-body);
font-size: var(--fs-body);
line-height: 1.6;
letter-spacing: -0.01em;
color: var(--color-gray-50, #fafafa);
white-space: normal;
transition: background-color var(--transition-fast);
}
.nav__dropdown-link:hover {
background-color: #fff;
color: #252b37;
}
.nav__dropdown-link--active {
background-color: #fff;
color: #252b37;
font-weight: 500;
}
.nav__contact,
.nav__social {
display: none;
}
.nav__toggle {
display: none;
flex-direction: column;
justify-content: center;
align-items: stretch;
gap: 4px;
width: 44px;
height: 44px;
padding: 12px;
z-index: 110;
background: rgba(0, 0, 0, 0.08);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 100px;
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
overflow: visible;
}
.nav__toggle-bar {
display: block;
box-sizing: border-box;
width: 100%;
height: 1px;
flex-shrink: 0;
background: var(--color-white);
border: 1px solid var(--color-white);
border-radius: 2px;
transition: transform var(--transition-base), opacity var(--transition-base), width var(--transition-base);
}
.nav__toggle-bar:nth-child(3) {
width: 75%;
align-self: flex-end;
}
.nav__toggle--open .nav__toggle-bar:nth-child(1) {
transform: translateY(5.6px) rotate(45deg);
}
.nav__toggle--open .nav__toggle-bar:nth-child(2) {
opacity: 0;
}
.nav__toggle--open .nav__toggle-bar:nth-child(3) {
width: 100%;
align-self: stretch;
transform: translateY(-5.6px) rotate(-45deg);
}
.nav__social-label {
display: none;
}
@media (min-width: 901px) and (max-width: 1100px) {
.nav {
gap: 22.4px;
}
.nav__logo img {
width: 129.92px;
height: 49.28px;
}
.nav__menu {
gap: 4.48px;
padding: 4.48px;
}
.nav__link,
.nav__link--active {
font-size: 10.08px;
padding: 4.48px 8.96px;
}
.nav__dropdown-link {
font-size: 10.08px;
}
}
@media (max-width: 900px) {
.top-bar__social {
display: none;
}
.nav__toggle {
display: flex;
}
.nav__menu {
position: fixed;
top: 0;
right: -100%;
width: min(393px, 100vw);
height: 100vh;
flex-direction: column;
align-items: stretch;
background: var(--color-dark);
border: none;
border-radius: 0;
backdrop-filter: none;
padding: 88px 20px 24px;
gap: 20px;
transition: right var(--transition-base);
z-index: 105;
overflow-y: auto;
scrollbar-width: none;
-ms-overflow-style: none;
}
.nav__menu::-webkit-scrollbar {
display: none;
}
.nav__menu--open {
right: 0;
}
.nav__link {
display: flex;
align-items: center;
gap: 10px;
width: 100%;
box-sizing: border-box;
background: rgba(255, 255, 255, 0.08);
color: var(--color-white);
padding: 16px 20px;
border-radius: 120px;
min-height: 51px;
font-family: var(--font-body);
font-size: 16px;
font-weight: 400;
line-height: 1;
letter-spacing: -0.01em;
transition: background-color var(--transition-fast);
}
.nav__link:hover {
opacity: 1;
background: rgba(255, 255, 255, 0.14);
color: var(--color-white);
}
.nav__link--active {
background: var(--color-white);
color: var(--color-dark);
font-weight: 500;
padding: 16px 20px;
border-radius: 120px;
}
.nav__link--active:hover {
background: var(--color-white);
color: var(--color-dark);
}
.nav__link--active .nav__dot {
width: 8px;
height: 8px;
}
.nav__item--dropdown {
display: block;
}
.nav__link--has-dropdown {
width: 100%;
text-align: left;
justify-content: flex-start;
border-radius: 64px;
}
.nav__link--has-dropdown .nav__chevron {
margin-left: auto;
width: 16px;
height: 16px;
}
.nav__dropdown {
position: static;
top: auto;
left: auto;
width: auto;
transform: none;
opacity: 1;
visibility: visible;
pointer-events: auto;
background: transparent;
border: none;
border-radius: 0;
padding: 0;
margin-top: 0;
box-shadow: none;
backdrop-filter: none;
-webkit-backdrop-filter: none;
display: flex;
flex-direction: column;
gap: 20px;
max-height: 0;
overflow: hidden;
transition: max-height var(--transition-base), margin-top var(--transition-base);
}
.nav__item--dropdown[data-open="true"] .nav__dropdown {
max-height: 1200px;
margin-top: 16px;
transform: none;
}
.nav__dropdown {
position: relative;
width: auto;
gap: 12px;
padding-left: 28px;
margin-left: 12px;
}
.nav__dropdown > li {
position: relative;
}
.nav__dropdown > li::before {
content: "";
position: absolute;
left: -28px;
top: -63px;
bottom: 50%;
width: 20px;
border-left: 2px solid #2B2E31;
border-bottom: 2px solid #2B2E31;
border-bottom-left-radius: 12px;
}
.nav__dropdown > li:first-child::before {
top: -16px;
}
.nav__dropdown-link {
display: flex;
align-items: center;
gap: 10px;
width: 100%;
box-sizing: border-box;
background: rgba(255, 255, 255, 0.08);
color: var(--color-white);
padding: 14px 18px;
border-radius: 120px;
min-height: 51px;
font-family: var(--font-body);
font-size: 14.5px;
font-weight: 400;
line-height: 1.3;
letter-spacing: -0.01em;
white-space: normal;
transition: background-color var(--transition-fast);
}
.nav__dropdown-link:hover,
.nav__dropdown-link:active {
background: rgba(255, 255, 255, 0.14);
color: var(--color-white);
}
.nav__dropdown-link--active,
.nav__dropdown-link--active:hover {
background: var(--color-white);
color: var(--color-dark);
font-weight: 500;
}
.nav__dropdown-link--active .nav__dot {
width: 8px;
height: 8px;
}
.nav__contact {
display: none;
}
.nav__social {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
margin-top: auto;
padding: 24px 4px 0;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.nav__social-label {
display: block;
color: #a4a7ae;
font-family: var(--font-body);
font-size: 14px;
line-height: 1;
letter-spacing: -0.01em;
}
.nav__social-icons {
display: flex;
align-items: center;
gap: 12px;
}
.nav__social-icons a {
display: inline-flex;
opacity: 0.9;
transition: opacity var(--transition-fast);
}
.nav__social-icons a:hover {
opacity: 1;
}
}
@media (max-width: 600px) {
.nav__menu {
width: 100vw;
}
.top-bar__inner {
justify-content: center;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 12px;
padding-right: 12px;
}
.top-bar__contact {
width: 100%;
gap: 4px;
font-family: var(--font-body);
line-height: 1.2;
letter-spacing: -0.02em;
text-align: center;
justify-content: center;
white-space: nowrap;
}
.top-bar__contact,
.top-bar__contact * {
font-size: clamp(7px, 2.2vw, 11px);
}
.top-bar__item svg {
display: none;
}
.top-bar__social {
display: none;
}
}
.mobile-sticky-nav {
display: none;
}
.mobile-sticky-nav__topbar {
display: none;
}
@media (max-width: 900px) {
.mobile-sticky-nav {
display: block;
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 150;
background: var(--color-dark);
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
transform: translateY(-100%);
opacity: 0;
visibility: hidden;
transition: transform var(--transition-base), opacity var(--transition-base), visibility var(--transition-base);
}
.mobile-sticky-nav--visible,
body.menu-open .mobile-sticky-nav {
transform: translateY(0);
opacity: 1;
visibility: visible;
}
.mobile-sticky-nav__inner {
display: flex;
align-items: center;
justify-content: space-between;
padding-top: 10px;
padding-bottom: 10px;
}
.mobile-sticky-nav__logo {
display: inline-flex;
align-items: center;
}
.mobile-sticky-nav__logo img {
width: 120px;
height: auto;
display: block;
}
.mobile-sticky-nav__toggle {
display: flex;
}
body.menu-open .site-header .nav__toggle {
display: none;
}
body.menu-open .mobile-sticky-nav__topbar {
display: flex;
flex-wrap: nowrap;
align-items: center;
justify-content: center;
gap: 4px;
padding: 10px 12px;
font-family: var(--font-body);
font-size: clamp(7px, 2.2vw, 11px);
line-height: 1.2;
letter-spacing: -0.02em;
white-space: nowrap;
color: var(--color-text-light);
}
.mobile-sticky-nav__contact {
color: var(--color-text-light);
font-size: inherit;
white-space: nowrap;
transition: color var(--transition-fast);
}
a.mobile-sticky-nav__contact:hover,
a.mobile-sticky-nav__contact:active {
color: var(--color-white);
}
.mobile-sticky-nav__sep {
color: var(--color-text-light);
font-size: inherit;
line-height: 1;
}
body.menu-open .nav__menu {
padding-top: 128px;
}
}

/* footer.css */
.site-footer {
background-color: var(--color-dark);
color: var(--color-white);
padding: var(--section-pad-md) 0 var(--gap-md);
}
.site-footer__inner {
display: flex;
flex-direction: column;
gap: var(--gap-sm);
}
.site-footer__divider {
border: none;
border-top: 1px solid rgba(255, 255, 255, 0.1);
margin: 0;
}
.site-footer__header {
display: flex;
justify-content: space-between;
align-items: center;
}
.site-footer__logo img {
display: block;
width: var(--nav-logo-w);
height: auto;
}
.site-footer__tagline {
text-align: right;
}
.site-footer__tagline p {
font-family: var(--font-body);
font-size: var(--fs-body-sm);
line-height: 1.43;
color: var(--color-white);
margin: 0;
}
.site-footer__tagline p:last-child {
color: #E9EAEB;
margin-top: 6px;
}
.site-footer__tagline strong {
font-weight: 500;
}
.site-footer__content {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: clamp(32px, 2.08vw, 40px);
}
.site-footer__address {
flex-shrink: 0;
width: clamp(200px, 16.5vw, 316px);
}
.site-footer__address-label {
display: flex;
align-items: center;
gap: 6px;
font-family: var(--font-body);
font-size: var(--fs-body-sm);
line-height: 1.43;
color: #E9EAEB;
margin-bottom: clamp(6px, 0.42vw, 8px);
}
.site-footer__address-label svg {
flex-shrink: 0;
color: #E9EAEB;
}
.site-footer__address-text {
font-family: var(--font-body);
font-size: var(--fs-body-sm);
line-height: 1.43;
color: #F5F5F5;
margin: 0;
padding-left: clamp(20px, 1.35vw, 26px);
}
.site-footer__columns {
display: flex;
gap: clamp(40px, 3.96vw, 76px);
}
.site-footer__col-title {
font-family: var(--font-text);
font-size: var(--fs-body);
font-weight: 500;
color: var(--color-primary);
letter-spacing: -0.16px;
margin: 0 0 clamp(16px, 1.04vw, 20px);
}
.site-footer__col-list {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: clamp(16px, 1.04vw, 20px);
}
.site-footer__col-list a {
font-family: var(--font-body);
font-size: var(--fs-body);
line-height: 1.5;
color: var(--color-white);
text-decoration: none;
transition: color var(--transition-fast);
}
.site-footer__col-list a:hover {
color: var(--color-primary);
}
.site-footer__contact-list a {
display: flex;
align-items: center;
gap: clamp(6px, 0.42vw, 8px);
}
.site-footer__icon-badge {
flex-shrink: 0;
width: var(--cta-icon);
height: var(--cta-icon);
border-radius: 50%;
background: var(--color-white);
display: inline-flex;
align-items: center;
justify-content: center;
color: var(--color-dark);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.12);
transition: transform var(--transition-fast);
}
.site-footer__icon-badge svg {
width: auto;
height: 46%;
}
.site-footer__contact-list a:hover .site-footer__icon-badge {
transform: scale(1.05);
}
.site-footer__bottom {
display: flex;
justify-content: space-between;
align-items: center;
}
.site-footer__copy {
font-family: var(--font-body);
font-size: var(--fs-body-small);
line-height: 1.5;
color: #D5D7DA;
margin: 0;
}
.site-footer__credit {
color: inherit;
text-decoration: none;
transition: color var(--transition-fast);
}
.site-footer__credit:hover {
color: var(--color-primary);
}
.site-footer__social {
display: flex;
align-items: center;
gap: clamp(10px, 0.63vw, 12px);
}
.site-footer__social a {
display: inline-flex;
align-items: center;
justify-content: center;
width: var(--cta-icon);
height: var(--cta-icon);
color: #D5D7DA;
transition: color var(--transition-fast), transform var(--transition-fast);
}
.site-footer__social a:hover {
color: var(--color-primary);
transform: translateY(-2px);
}
.site-footer__social svg {
display: block;
height: clamp(10.4px, 0.78vw, 14px);
width: clamp(10.4px, 0.78vw, 14px);
}
@media (max-width: 768px) {
.site-footer__header {
flex-direction: column;
align-items: flex-start;
gap: 24px;
}
.site-footer__tagline {
text-align: left;
}
.site-footer__content {
flex-direction: column;
gap: 40px;
}
.site-footer__address {
width: 100%;
}
.site-footer__columns {
flex-direction: row;
flex-wrap: wrap;
gap: 32px 24px; 
}
.site-footer__col:nth-child(1), 
.site-footer__col:nth-child(3) { 
flex: 1 1 calc(50% - 12px);
min-width: 0;
}
.site-footer__col:nth-child(1) { order: 1; } 
.site-footer__col:nth-child(3) { order: 2; } 
.site-footer__col:nth-child(2) { 
order: 3;
flex-basis: 100%;
}
.site-footer__bottom {
flex-direction: column;
gap: 24px;
text-align: center;
}
.site-footer__social {
justify-content: center;
}
}

/* lp-header.css */
@media (max-width: 900px) {
.lp-page {
--fs-body: 14px;
--fs-body-md: 14px;
--fs-body-lg: 15px;
--fs-body-sm: 13px;
--fs-body-small: 12px;
--fs-label: 16px;
--fs-card-title: 17px;
--fs-caption: 12.5px;
--fs-caption-sm: 11px;
--fs-display: 30px;
--fs-hero-title: 30px;
--fs-section-xl: 28px;
--fs-section-lg: 26px;
--fs-cta-title: 22px;
--fs-heading-2xl: 26px;
--fs-heading-xl: 24px;
--fs-heading-lg: 22px;
--fs-heading-md: 19px;
--fs-heading-sm: 17px;
--fs-step: 18px;
--fs-step-number: 18px;
--cta-font: 15px;
--cta-icon: 20px;
--btn-size: 44px;
--gap-content: 12px;
--gap-card: 20px;
--line-width: 48px;
}
}
.lp-header {
position: absolute;
top: clamp(44px, 2.81vw, 54px);
left: 0;
right: 0;
z-index: 100;
}
.lp-nav {
display: flex;
justify-content: space-between;
align-items: center;
gap: clamp(35.84px, 2.576vw, 49.28px);
padding-top: var(--gap-content);
padding-bottom: var(--gap-content);
}
.lp-nav__logo {
display: inline-flex;
align-items: center;
flex-shrink: 0;
}
.lp-nav__logo img {
width: var(--nav-logo-w);
height: var(--nav-logo-h);
object-fit: contain;
display: block;
}
.lp-nav__menu {
display: flex;
align-items: center;
gap: clamp(6.72px, 0.4704vw, 8.96px);
list-style: none;
margin: 0;
padding: clamp(4.48px, 0.3472vw, 6.72px);
background: var(--nav-pill-bg);
border: var(--nav-pill-border);
backdrop-filter: var(--nav-pill-blur);
-webkit-backdrop-filter: var(--nav-pill-blur);
border-radius: 100px;
}
.lp-nav__item {
display: flex;
align-items: center;
}
.lp-nav__link {
display: inline-flex;
align-items: center;
gap: 4px;
font-family: var(--font-body);
font-weight: 400;
font-size: clamp(14.1px, 0.84vw, 16.1px);
line-height: 1.19;
letter-spacing: -0.01em;
color: var(--color-white);
padding: clamp(4.48px, 0.3472vw, 6.72px) clamp(11.2px, 0.7056vw, 13.44px);
border-radius: 100px;
transition: all var(--transition-fast);
white-space: nowrap;
}
.lp-nav__link:hover {
opacity: 0.8;
}
.lp-nav__link--active {
background: var(--color-white);
color: var(--color-dark);
font-weight: 500;
}
.lp-nav__link--active:hover {
opacity: 1;
}
.lp-nav__dot {
display: inline-block;
width: 4px;
height: 4px;
background: var(--color-primary);
border-radius: 50%;
flex-shrink: 0;
}
.lp-nav__cta {
flex-shrink: 0;
display: inline-flex;
align-items: center;
gap: clamp(6px, 0.42vw, 8px);
padding: clamp(8.96px, 0.6944vw, 13.44px) clamp(14px, 1vw, 20px);
background: rgba(255, 255, 255, 0.92);
border: 1px solid rgba(255, 255, 255, 0.6);
backdrop-filter: var(--nav-pill-blur);
-webkit-backdrop-filter: var(--nav-pill-blur);
border-radius: 100px;
font-family: var(--font-heading);
font-weight: 600;
font-size: clamp(14.1px, 0.84vw, 16.1px);
line-height: 1.19;
letter-spacing: -0.01em;
color: var(--color-dark);
white-space: nowrap;
transition: background var(--transition-fast), color var(--transition-fast);
}
.lp-nav__cta:hover {
background: var(--color-white);
color: var(--color-dark);
}
.lp-nav__cta-icon {
width: clamp(15px, 0.94vw, 18px);
height: clamp(15px, 0.94vw, 18px);
flex-shrink: 0;
}
.lp-nav__cta:focus-visible,
.lp-nav__link:focus-visible,
.lp-nav__toggle:focus-visible {
outline: 2px solid var(--color-primary);
outline-offset: 3px;
}
.lp-nav__toggle {
display: none;
flex-direction: column;
justify-content: center;
align-items: stretch;
gap: 4px;
width: 44px;
height: 44px;
padding: 12px;
z-index: 110;
background: var(--nav-pill-bg);
border: var(--nav-pill-border);
border-radius: 100px;
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
cursor: pointer;
overflow: visible;
}
.lp-nav__toggle-bar {
display: block;
box-sizing: border-box;
width: 100%;
height: 1px;
flex-shrink: 0;
background: var(--color-white);
border: 1px solid var(--color-white);
border-radius: 2px;
transition: transform var(--transition-base), opacity var(--transition-base), width var(--transition-base);
}
.lp-nav__toggle-bar:nth-child(3) {
width: 75%;
align-self: flex-end;
}
.lp-nav__toggle[aria-expanded="true"] .lp-nav__toggle-bar:nth-child(1) {
transform: translateY(5.6px) rotate(45deg);
}
.lp-nav__toggle[aria-expanded="true"] .lp-nav__toggle-bar:nth-child(2) {
opacity: 0;
}
.lp-nav__toggle[aria-expanded="true"] .lp-nav__toggle-bar:nth-child(3) {
width: 100%;
align-self: stretch;
transform: translateY(-5.6px) rotate(-45deg);
}
@media (min-width: 901px) and (max-width: 1100px) {
.lp-nav {
gap: 22.4px;
}
.lp-nav__logo img {
width: 129.92px;
height: 49.28px;
}
.lp-nav__menu {
gap: 4.48px;
padding: 4.48px;
}
.lp-nav__link {
font-size: 10.08px;
padding: 4.48px 8.96px;
}
.lp-nav__cta {
font-size: 10.08px;
padding: 8.96px 14px;
}
}
@media (max-width: 900px) {
.top-bar__inner,
.top-bar__inner * {
font-size: clamp(10.5px, 3.2vw, 12px);
}
.lp-nav__logo img {
width: clamp(126px, 35.5vw, 155px);
height: auto;
}
.lp-nav__toggle {
display: flex;
order: 3;
background: none;
border: none;
border-radius: 0;
backdrop-filter: none;
-webkit-backdrop-filter: none;
width: 40px;
height: 40px;
padding: 8px 6px;
gap: 6px;
}
.lp-nav__toggle-bar {
height: 2px;
border: none;
border-radius: 2px;
}
.lp-nav__toggle-bar:nth-child(3) {
width: 100%;
align-self: stretch;
}
.lp-nav__toggle[aria-expanded="true"] .lp-nav__toggle-bar:nth-child(1) {
transform: translateY(8px) rotate(45deg);
}
.lp-nav__toggle[aria-expanded="true"] .lp-nav__toggle-bar:nth-child(3) {
transform: translateY(-8px) rotate(-45deg);
}
.lp-nav__cta {
display: none;
}
.lp-nav__menu {
position: fixed;
top: 0;
right: -100%;
width: min(393px, 100vw);
height: 100vh;
flex-direction: column;
align-items: stretch;
gap: 20px;
padding: 88px 20px 24px;
background: var(--color-dark);
border: none;
border-radius: 0;
backdrop-filter: none;
-webkit-backdrop-filter: none;
transition: right var(--transition-base);
z-index: 105;
overflow-y: auto;
scrollbar-width: none;
-ms-overflow-style: none;
}
.lp-nav__menu::-webkit-scrollbar {
display: none;
}
.lp-nav__menu--open {
right: 0;
}
.lp-nav__item {
display: block;
}
.lp-nav__link {
display: flex;
align-items: center;
gap: 10px;
width: 100%;
box-sizing: border-box;
min-height: 51px;
padding: 16px 20px;
background: rgba(255, 255, 255, 0.08);
color: var(--color-white);
border-radius: 120px;
font-size: 16px;
line-height: 1;
}
.lp-nav__link:hover {
opacity: 1;
background: rgba(255, 255, 255, 0.14);
}
.lp-nav__link--active,
.lp-nav__link--active:hover {
background: var(--color-white);
color: var(--color-dark);
font-weight: 500;
}
.lp-nav__link--active .lp-nav__dot {
width: 8px;
height: 8px;
}
}

/* servico-cta.css */
.srv-cta {
padding: 0 0 96px;
background-color: var(--color-white);
}
.srv-cta .container {
max-width: 1216px;
}
.srv-cta__inner {
padding-left: 8px;
padding-right: 8px;
}
.srv-cta__card {
display: grid;
grid-template-columns: 1fr auto;
align-items: center;
gap: 48px;
padding: 56px 64px;
min-height: 260px;
isolation: isolate;
background:
linear-gradient(269.99deg, rgba(2, 23, 49, 0) 28.79%, rgba(2, 23, 49, 0.6) 63.68%, rgba(2, 23, 49, 0.75) 75.45%),
linear-gradient(313.43deg, rgba(19, 23, 26, 0) 41.04%, rgba(19, 23, 26, 0.4) 55.49%, rgba(22, 90, 170, 0.8) 106.76%),
url('../images/cta-avaliacao.webp') center / cover no-repeat;
border-radius: 24px;
overflow: hidden;
}
.srv-cta__content {
display: flex;
flex-direction: column;
gap: 12px;
max-width: 720px;
z-index: 1;
}
.srv-cta__label {
display: flex;
align-items: center;
gap: 12px;
font-family: var(--font-text-alt);
font-weight: 400;
font-size: var(--fs-label);
line-height: 1.7;
letter-spacing: -0.01em;
color: var(--color-white);
margin: 0;
}
.srv-cta__line {
display: inline-block;
width: 71px;
height: 0;
border-top: 1px solid var(--color-primary);
flex-shrink: 0;
}
.srv-cta__title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-cta-title);
line-height: 1.2;
color: var(--color-white);
margin: 0;
}
.srv-cta__description {
font-family: var(--font-text-alt);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.7;
letter-spacing: -0.01em;
color: var(--color-white);
margin: 4px 0 0;
max-width: 680px;
}
.srv-cta__action {
position: relative;
padding: 8px;
border-radius: 16px;
z-index: 2;
}
.srv-cta__action::before {
content: '';
position: absolute;
inset: 0;
border-radius: 16px;
padding: 1px;
background: rgba(255, 255, 255, 0.39); 
-webkit-mask:
linear-gradient(#fff 0 0) content-box,
linear-gradient(#fff 0 0);
-webkit-mask-composite: xor;
mask:
linear-gradient(#fff 0 0) content-box,
linear-gradient(#fff 0 0);
mask-composite: exclude;
pointer-events: none;
}
.srv-cta__btn {
display: inline-flex;
align-items: center;
gap: clamp(10px, 0.63vw, 12px);
padding: var(--cta-pad-y) var(--cta-pad-x);
background: #1F3A5F;
color: var(--color-white);
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--cta-font);
line-height: 1.33;
border-radius: 12px;
text-decoration: none;
white-space: nowrap;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.30);
transition: background var(--transition-fast), box-shadow var(--transition-fast);
}
.srv-cta__btn:hover {
background: #2a4f7a;
box-shadow: 0 8px 22px rgba(0, 0, 0, 0.40);
}
.srv-cta__btn svg { width: var(--cta-icon); height: var(--cta-icon); }
@media (max-width: 1024px) {
.srv-cta { padding: 72px 0; }
.srv-cta__card { padding: 48px; gap: 32px; }
}
@media (max-width: 768px) {
.srv-cta { padding: 0 0 56px; }
.srv-cta__inner { padding-left: 24px; padding-right: 24px; }
.srv-cta__card {
grid-template-columns: 1fr;
padding: 40px 32px;
gap: 24px;
background:
linear-gradient(269.99deg, rgba(2, 23, 49, 0.3) 0%, rgba(2, 23, 49, 0.75) 45%, rgba(2, 23, 49, 0.9) 70%),
linear-gradient(313.43deg, rgba(19, 23, 26, 0.2) 20%, rgba(19, 23, 26, 0.6) 45%, rgba(22, 90, 170, 0.8) 106.76%),
url('../images/cta-avaliacao.webp') center / cover no-repeat;
}
.srv-cta__action { align-self: center; }
}
@media (max-width: 480px) {
.srv-cta__card { padding: 32px 24px; }
.srv-cta__btn {
padding: 16px 24px;
white-space: normal;
text-align: center;
}
}
.predial-cta {
margin-top: clamp(28px, 2.5vw, 40px);
}
.predial-cta--center {
display: flex;
justify-content: center;
}
@media (max-width: 480px) {
.predial-cta__btn {
width: 100%;
justify-content: center;
}
}

/* lp-hero.css */
.lp-hero {
position: relative;
min-height: clamp(320px, 80vh, 800px);
display: flex;
align-items: center;
background-color: var(--color-bg-navy);
overflow: hidden;
padding-top: var(--hero-pad-top);
padding-bottom: calc(var(--hero-clip-v) + var(--gap-lg));
border-bottom: 1px solid var(--color-bg-light);
clip-path: polygon(
0 0,
100% 0,
100% calc(100% - var(--hero-clip-v)),
calc(100% - var(--hero-clip-h)) 100%,
0 100%
);
}
.lp-hero__bg {
position: absolute;
inset: 0;
z-index: 0;
display: block;
}
.lp-hero__bg img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: 78% center;
}
.lp-hero__overlay {
--lp-hero-navy-rgb: 15, 42, 71;
position: absolute;
inset: 0;
z-index: 1;
background:
linear-gradient(90deg,
rgba(var(--lp-hero-navy-rgb), 0.94) 0%,
rgba(var(--lp-hero-navy-rgb), 0.86) 32%,
rgba(var(--lp-hero-navy-rgb), 0.42) 56%,
rgba(var(--lp-hero-navy-rgb), 0) 76%),
var(--hero-overlay);
pointer-events: none;
}
.lp-hero__content {
position: relative;
z-index: 2;
width: 100%;
}
.lp-hero__text {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: var(--gap-content);
max-width: clamp(440px, 34vw, 660px);
}
.lp-hero__title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-display);
line-height: 1.15;
color: var(--color-white);
text-wrap: balance;
}
.lp-hero__title span {
color: var(--color-primary);
}
.lp-hero__description {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body-lg);
line-height: 1.6;
letter-spacing: -0.01em;
color: var(--color-text-hero);
}
.lp-hero__area {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.6;
letter-spacing: -0.01em;
color: var(--color-text-light);
}
.lp-hero__cta-frame {
display: inline-flex;
margin-top: clamp(6px, 0.52vw, 10px);
}
.lp-hero__cta-icon {
display: none;
}
.lp-hero__meta {
display: flex;
align-items: center;
gap: clamp(10px, 0.83vw, 14px);
margin-top: clamp(6px, 0.52vw, 10px);
max-width: clamp(300px, 25vw, 460px);
}
.lp-hero__meta-avatar {
display: inline-flex;
align-items: center;
justify-content: center;
width: clamp(34px, 2.6vw, 44px);
height: clamp(34px, 2.6vw, 44px);
border-radius: 50%;
flex-shrink: 0;
border: 1px solid rgba(255, 255, 255, 0.39);
background: rgba(255, 255, 255, 0.08);
}
.lp-hero__meta-avatar img {
display: block;
width: clamp(18px, 1.35vw, 22px);
height: clamp(18px, 1.35vw, 22px);
}
.lp-hero__meta-text {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-caption);
line-height: 1.5;
color: var(--color-text-light);
}
.lp-hero__scroll {
left: auto;
right: var(--container-padding);
bottom: calc(var(--hero-clip-v) + clamp(6px, 0.52vw, 10px));
transform: none;
}
.lp-stats {
position: relative;
background: var(--color-white);
padding: var(--section-pad-lg) 0;
overflow: hidden;
}
.lp-stats__watermark {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: clamp(200px, 22vw, 380px);
aspect-ratio: 1162 / 481;
height: auto;
background: url('../images/lp/watermark-sketch-edificio.webp') no-repeat left center / contain;
pointer-events: none;
user-select: none;
z-index: 0;
}
.lp-stats__inner {
position: relative;
z-index: 1;
}
.lp-stats__grid {
list-style: none;
margin: 0;
padding: 0;
display: grid;
grid-template-columns: repeat(4, 1fr);
}
.lp-stats__item {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: clamp(6px, 0.42vw, 8px);
padding: 0 var(--gap-sm);
}
.lp-stats__item + .lp-stats__item {
border-left: 1px solid rgba(19, 23, 26, 0.08);
}
.lp-stats__icon {
display: inline-flex;
align-items: center;
justify-content: center;
color: var(--color-primary);
margin-bottom: clamp(2px, 0.21vw, 4px);
}
.lp-stats__icon img {
display: block;
width: clamp(26px, 2.1vw, 32px);
height: clamp(26px, 2.1vw, 32px);
}
.lp-stats__number {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-heading-sm);
line-height: 1.2;
letter-spacing: 0.02em;
color: var(--color-dark);
}
.lp-stats__label {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-caption);
line-height: 1.5;
letter-spacing: 0.02em;
color: #555;
max-width: 180px;
}
@media (max-width: 900px) {
.lp-hero {
min-height: 0;
--hero-clip-h: clamp(120px, 35vw, 150px);
--hero-clip-v: clamp(44px, 12vw, 56px);
padding-top: clamp(128px, 35vw, 168px);
padding-bottom: calc(var(--hero-clip-v) + clamp(80px, 22vw, 104px));
}
.lp-hero__bg img {
object-position: 70% center;
}
.lp-hero__overlay {
background:
linear-gradient(90deg,
rgba(var(--lp-hero-navy-rgb), 0.96) 0%,
rgba(var(--lp-hero-navy-rgb), 0.9) 42%,
rgba(var(--lp-hero-navy-rgb), 0.55) 70%,
rgba(var(--lp-hero-navy-rgb), 0.16) 100%),
var(--hero-overlay);
}
.lp-hero__text {
max-width: 100%;
}
.lp-hero__title {
font-size: clamp(26px, 7.2vw, 32px);
line-height: 1.3;
}
.lp-hero__title span {
color: inherit;
}
.lp-hero__description,
.lp-hero__area {
font-size: clamp(13px, 3.75vw, 16px);
line-height: 1.7;
}
.lp-hero__cta-frame,
.lp-hero__cta-frame .srv-cta__btn {
width: 100%;
}
.lp-hero__cta-frame .srv-cta__btn {
justify-content: flex-start;
text-align: left;
white-space: nowrap;
gap: clamp(8px, 2.4vw, 12px);
font-size: clamp(12.8px, 3.42vw, 14px);
letter-spacing: -0.01em;
padding: clamp(15px, 4.3vw, 18px) clamp(12px, 3.2vw, 16px);
}
.lp-hero__cta-frame .lp-hero__cta-icon {
display: inline-flex;
width: clamp(18px, 5.3vw, 22px);
height: clamp(18px, 5.3vw, 22px);
flex-shrink: 0;
}
.lp-hero__cta-frame .srv-cta__btn svg:last-child {
margin-left: auto;
flex-shrink: 0;
}
.lp-hero__meta {
max-width: 100%;
gap: clamp(12px, 3.7vw, 14px);
}
.lp-hero__meta-avatar {
width: 46px;
height: 46px;
}
.lp-hero__meta-avatar img {
width: 22px;
height: 22px;
}
.lp-hero__meta-text {
font-size: clamp(11px, 3vw, 12.5px);
}
.lp-hero__scroll {
left: 50%;
right: auto;
transform: translateX(-50%);
width: clamp(42px, 11.5vw, 48px);
height: clamp(42px, 11.5vw, 48px);
bottom: calc(var(--hero-clip-v) + clamp(8px, 2.2vw, 12px));
}
.lp-hero__scroll .hero__scroll-arrow {
width: 14px;
height: 8px;
}
@media (max-width: 360px) {
.lp-hero__cta-frame .srv-cta__btn {
white-space: normal;
}
}
.lp-stats {
padding-top: clamp(104px, 31vw, 132px);
padding-bottom: clamp(16px, 5vw, 28px);
}
.lp-stats__watermark {
top: 0;
left: 0;
transform: none;
width: clamp(200px, 58vw, 260px);
height: auto;
aspect-ratio: 210 / 142;
background: url('../images/lp/watermark-galpao-suave.webp') no-repeat left top / contain;
}
.lp-stats__grid {
grid-template-columns: 1fr;
row-gap: 0;
}
.lp-stats__item {
display: grid;
grid-template-columns: clamp(44px, 12.3vw, 48px) 1fr;
grid-template-rows: auto auto;
column-gap: clamp(18px, 5.6vw, 24px);
align-items: center;
text-align: left;
border-top: 1px solid rgba(239, 134, 25, 0.12);
padding: clamp(24px, 7vw, 30px) 0;
}
.lp-stats__item + .lp-stats__item {
border-left: none;
}
.lp-stats__item:first-child {
border-top: none;
}
.lp-stats__icon {
grid-row: 1 / 3;
margin-bottom: 0;
}
.lp-stats__icon img {
width: clamp(40px, 11.7vw, 46px);
height: clamp(40px, 11.7vw, 46px);
}
.lp-stats__number {
font-size: clamp(16px, 4.8vw, 19px);
}
.lp-stats__label {
font-size: clamp(11px, 3.2vw, 13px);
color: #444;
max-width: none;
}
}

/* lp-intro.css */
.lp-intro {
position: relative;
overflow: hidden;
background: var(--color-white);
padding: var(--section-pad-xl) 0;
}
.lp-intro__watermark {
position: absolute;
right: 0;
bottom: 0;
width: clamp(172px, 16.5vw, 286px);
aspect-ratio: 389 / 400;
background: url('../images/lp/intro-blueprint.webp') no-repeat bottom right / contain;
pointer-events: none;
user-select: none;
z-index: 0;
}
.lp-intro__inner {
position: relative;
z-index: 1;
}
.lp-intro__grid {
display: grid;
grid-template-columns: minmax(0, 58fr) minmax(0, 35fr);
gap: clamp(32px, 3.1vw, 60px);
align-items: start;
}
.lp-intro__content {
max-width: min(100%, clamp(360px, 56vw, 790px));
}
.lp-intro__label {
display: flex;
align-items: center;
gap: clamp(10px, 0.63vw, 12px);
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.7;
color: #212121;
margin-bottom: clamp(6px, 0.42vw, 8px);
}
.lp-intro__line {
width: var(--line-width);
height: 0;
border-top: 1px solid var(--color-primary);
flex-shrink: 0;
}
.lp-intro__title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-section-lg);
line-height: 1.2;
color: #212121;
margin-bottom: clamp(16px, 1.25vw, 24px);
text-wrap: balance;
}
.lp-intro__description {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.7;
color: #454545;
margin-bottom: clamp(12px, 0.9vw, 16px);
}
.lp-intro__description:last-of-type {
margin-bottom: 0;
}
.lp-intro__items {
list-style: none;
margin: clamp(24px, 1.8vw, 34px) 0 0;
padding: 0;
display: flex;
flex-direction: column;
gap: var(--gap-card);
}
.lp-intro__item {
position: relative;
display: grid;
grid-template-columns: var(--btn-size) 1fr;
gap: var(--gap-content);
padding-left: 0;
}
.lp-intro__item-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: var(--btn-size);
height: var(--btn-size);
border-radius: clamp(8px, 0.52vw, 10px);
background: #EEF3FF;
border: 1px solid rgba(21, 94, 239, 0.22);
flex-shrink: 0;
}
.lp-intro__item-icon img {
display: block;
width: 24px;
height: 24px;
}
.lp-intro__item-text {
min-width: 0;
}
.lp-intro__item-title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-label);
line-height: 1.3;
color: #212121;
margin-bottom: clamp(4px, 0.31vw, 6px);
}
.lp-intro__item-desc {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body-sm);
line-height: 1.7;
color: #555;
}
.lp-intro__media {
--intro-chamfer: clamp(38px, 4.4vw, 62px);
position: relative;
isolation: isolate;
width: 100%;
max-width: clamp(300px, 34vw, 470px);
margin: 0 auto;
padding:
clamp(16px, 1.8vw, 26px)
0
clamp(22px, 2.4vw, 36px)
clamp(14px, 1.5vw, 22px);
}
.lp-intro__media::before {
content: '';
position: absolute;
inset: 0;
border: 1px solid rgba(187, 211, 238, 0.9);
border-radius: clamp(14px, 1.4vw, 20px);
clip-path: polygon(
0 0,
100% 0,
100% 100%,
var(--intro-chamfer) 100%,
0 calc(100% - var(--intro-chamfer))
);
pointer-events: none;
z-index: 0;
}
.lp-intro__media::after {
content: '';
position: absolute;
left: 0;
bottom: var(--intro-chamfer);
width: calc(var(--intro-chamfer) * 1.41422);
height: 0;
border-top: 1px solid rgba(187, 211, 238, 0.9);
transform: rotate(45deg);
transform-origin: 0 100%;
pointer-events: none;
z-index: 0;
}
.lp-intro__media img {
display: block;
position: relative;
width: 100%;
height: auto;
z-index: 1;
}
.lp-intro__footer {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
margin-top: clamp(32px, 2.6vw, 48px);
}
.lp-intro__note {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body-sm);
line-height: 1.7;
color: #454545;
max-width: 620px;
margin: 0 0 clamp(20px, 1.6vw, 28px);
text-wrap: pretty;
}
.lp-intro__note strong {
font-weight: 600;
color: #212121;
}
.lp-intro__cta {
align-self: center;
}
@media (max-width: 900px) {
.lp-intro {
padding: var(--section-pad-lg) 0;
}
.lp-intro__grid {
grid-template-columns: 1fr;
gap: clamp(28px, 2.5vw, 40px);
}
.lp-intro__content {
max-width: 100%;
}
.lp-intro__media {
display: none;
}
.lp-intro__watermark {
width: clamp(157px, 43vw, 215px);
}
}
@media (max-width: 480px) {
.lp-intro__cta {
width: 100%;
justify-content: center;
white-space: normal;
text-align: center;
}
}

/* lp-recomendam.css */
.lp-recomendam {
--lp-phone-w: clamp(231px, 20.1vw, 319px);
position: relative;
isolation: isolate;
overflow: hidden;
background: var(--color-white);
padding: var(--section-pad-xl) 0;
}
.lp-recomendam__watermark {
position: absolute;
top: 50%;
right: clamp(-80px, -3vw, -20px);
transform: translateY(-50%);
width: clamp(260px, 32vw, 520px);
height: auto;
pointer-events: none;
user-select: none;
z-index: 0;
}
.lp-recomendam__inner {
position: relative;
z-index: 1;
display: grid;
grid-template-columns: minmax(280px, 45%) minmax(0, 1fr);
gap: clamp(32px, 4vw, 72px);
align-items: center;
}
.lp-recomendam__media {
position: relative;
width: 100%;
}
.lp-recomendam__media::before {
content: '';
position: absolute;
left: -100vw;
right: 0;
top: clamp(64px, 6vw, 112px);
bottom: calc(-1 * clamp(8px, 0.85vw, 16px));
background: #0F1A2C;
border-radius: 0 0 clamp(10px, 0.9vw, 16px) 0;
clip-path: polygon(
0 0,
calc(100% - clamp(52px, 5.4vw, 100px)) 0,
100% clamp(52px, 5.4vw, 100px),
100% 100%,
0 100%
);
pointer-events: none;
z-index: -2;
}
.lp-recomendam__media::after {
content: '';
position: absolute;
right: 0;
width: 50vw;
top: clamp(64px, 6vw, 112px);
bottom: calc(-1 * clamp(8px, 0.85vw, 16px));
background: url('../images/lp/recomendam-fachada.webp') center / cover no-repeat;
border-radius: 0 0 clamp(10px, 0.9vw, 16px) 0;
clip-path: polygon(
0 0,
calc(100% - clamp(52px, 5.4vw, 100px)) 0,
100% clamp(52px, 5.4vw, 100px),
100% 100%,
0 100%
);
pointer-events: none;
z-index: -1;
}
.lp-recomendam__glass {
--glass-chamfer: clamp(30px, 2.4vw, 46px);
position: relative;
width: fit-content;
margin-inline: auto;
padding:
clamp(24px, 2.2vw, 42px)
clamp(64px, 6.2vw, 118px)
clamp(36px, 3.5vw, 66px)
clamp(26px, 2.4vw, 46px);
}
.lp-recomendam__glass-frame {
position: absolute;
inset: 0;
background:
linear-gradient(180deg,
rgba(255, 255, 255, 0.20) 0%,
rgba(255, 255, 255, 0.05) 12%,
transparent 24%),
linear-gradient(0deg, rgba(140, 175, 220, 0.10), rgba(140, 175, 220, 0.10));
border: 1px solid rgba(187, 211, 238, 0.9);
border-radius: 0 clamp(22px, 2vw, 32px) clamp(22px, 2vw, 32px) clamp(22px, 2vw, 32px);
clip-path: polygon(
0 var(--glass-chamfer),
var(--glass-chamfer) 0,
100% 0,
100% 100%,
0 100%
);
mask-image: linear-gradient(90deg,
#000 0%,
#000 22%,
rgba(0, 0, 0, 0.45) 55%,
transparent 85%);
-webkit-mask-image: linear-gradient(90deg,
#000 0%,
#000 22%,
rgba(0, 0, 0, 0.45) 55%,
transparent 85%);
pointer-events: none;
}
.lp-recomendam__glass-frame::before {
content: '';
position: absolute;
top: var(--glass-chamfer);
left: 0;
width: calc(var(--glass-chamfer) * 1.41422);
height: 0;
border-top: 1px solid rgba(187, 211, 238, 0.9);
transform: rotate(-45deg);
transform-origin: 0 0;
pointer-events: none;
}
.lp-recomendam__phone {
position: relative;
isolation: isolate;
width: var(--lp-phone-w);
max-width: 100%;
aspect-ratio: 9 / 19.5;
margin-inline: auto;
overflow: hidden;
border: clamp(4.8px, 0.44vw, 8px) solid #1F3A5F;
border-radius: clamp(28px, 2.6vw, 40px);
background: var(--color-dark);
box-shadow:
0 0 0 clamp(4.8px, 0.44vw, 8px) #3D5F8A,
0 clamp(18px, 1.8vw, 32px) clamp(32px, 3.2vw, 56px) rgba(0, 0, 0, 0.45);
}
.lp-recomendam__phone-video {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
border: 0;
display: block;
}
.lp-recomendam__phone img {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
z-index: 0;
}
.lp-recomendam__phone-shade {
position: absolute;
inset: 0;
background: linear-gradient(
180deg,
rgba(19, 23, 26, 0.34) 0%,
rgba(19, 23, 26, 0.12) 34%,
rgba(19, 23, 26, 0) 55%,
rgba(19, 23, 26, 0.22) 100%
);
pointer-events: none;
z-index: 1;
}
.lp-recomendam__phone-caption {
position: absolute;
bottom: 22%;
left: clamp(16px, 1.25vw, 24px);
right: clamp(16px, 1.25vw, 24px);
z-index: 2;
display: flex;
flex-direction: column;
font-family: var(--font-text);
font-weight: 400;
font-size: clamp(14px, 1.05vw, 19px);
line-height: 1.35;
letter-spacing: -0.01em;
text-align: center;
color: var(--color-white);
text-shadow:
0 2px 3px rgba(10, 15, 21, 0.65),
0 6px 16px rgba(10, 15, 21, 0.40);
}
.lp-recomendam__phone-caption-line {
display: block;
}
.lp-recomendam__content {
max-width: min(100%, clamp(360px, 52vw, 700px));
}
.lp-recomendam__label {
display: flex;
align-items: center;
gap: clamp(10px, 0.63vw, 12px);
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.7;
color: #212121;
margin-bottom: clamp(6px, 0.42vw, 8px);
}
.lp-recomendam__line {
width: var(--line-width);
height: 0;
border-top: 1px solid var(--color-primary);
flex-shrink: 0;
}
.lp-recomendam__title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-section-lg);
line-height: 1.2;
color: #212121;
margin-bottom: clamp(20px, 1.5vw, 28px);
}
.lp-recomendam__title span {
color: var(--color-primary);
}
.lp-recomendam__items {
list-style: none;
margin: 0 0 clamp(24px, 1.8vw, 32px);
padding: 0;
display: flex;
flex-direction: column;
gap: var(--gap-card);
}
.lp-recomendam__item {
display: grid;
grid-template-columns: var(--btn-size) 1fr;
gap: var(--gap-content);
}
.lp-recomendam__item-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: var(--btn-size);
height: var(--btn-size);
background: transparent;
border: none;
color: #155EEF;
flex-shrink: 0;
}
.lp-recomendam__item-icon svg {
width: clamp(20px, 1.25vw, 24px);
height: clamp(20px, 1.25vw, 24px);
}
.lp-recomendam__item-body {
min-width: 0;
}
.lp-recomendam__item-title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-label);
line-height: 1.3;
color: #212121;
margin-bottom: clamp(4px, 0.31vw, 6px);
}
.lp-recomendam__item-desc {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body-sm);
line-height: 1.7;
color: #555;
}
.lp-recomendam__quote {
--quote-chamfer: clamp(24px, 2vw, 36px);
position: relative;
margin: 0 0 clamp(24px, 1.8vw, 32px);
padding: clamp(20px, 1.7vw, 32px);
background: var(--color-white);
border: 1px solid #E5E7EB;
border-radius: clamp(16px, 1.4vw, 24px) clamp(16px, 1.4vw, 24px) 0 clamp(16px, 1.4vw, 24px);
clip-path: polygon(
0 0,
100% 0,
100% calc(100% - var(--quote-chamfer)),
calc(100% - var(--quote-chamfer)) 100%,
0 100%
);
}
.lp-recomendam__quote::after {
content: '';
position: absolute;
left: 100%;
top: calc(100% - var(--quote-chamfer));
width: calc(var(--quote-chamfer) * 1.41422);
height: 0;
border-top: 1px solid #E5E7EB;
transform: rotate(135deg);
transform-origin: 0 0;
pointer-events: none;
}
.lp-recomendam__quote-mark {
position: absolute;
top: clamp(10px, 0.9vw, 16px);
left: clamp(12px, 1.1vw, 20px);
width: clamp(52px, 4.8vw, 76px);
height: auto;
color: #EFF2F6;
z-index: 0;
pointer-events: none;
}
.lp-recomendam__quote-text {
position: relative;
z-index: 1;
margin: 0;
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.7;
color: #454545;
}
.lp-recomendam__quote-footer {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: var(--gap-content);
margin-top: clamp(14px, 1.15vw, 20px);
}
.lp-recomendam__quote-author {
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
gap: clamp(2px, 0.21vw, 4px);
}
.lp-recomendam__quote-name {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-body);
line-height: 1.3;
color: var(--color-primary);
}
.lp-recomendam__quote-role {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-caption);
line-height: 1.4;
color: #666;
}
.lp-recomendam__dots {
display: inline-flex;
align-items: center;
gap: 6px;
flex-shrink: 0;
padding-bottom: 2px;
}
.lp-recomendam__dot {
display: block;
width: 6px;
height: 6px;
border-radius: 50%;
background: #E4E7EC;
}
.lp-recomendam__dot--active {
width: 26px;
height: 7px;
border-radius: 4px;
background: var(--color-bg-navy);
}
.lp-recomendam__cta {
display: flex;
}
.lp-recomendam__cta-frame {
display: inline-flex;
}
.lp-recomendam__cta-frame::before {
background: linear-gradient(45deg, transparent 38%, #BBD3EE 100%);
}
@media (max-width: 900px) {
.lp-recomendam {
padding: var(--section-pad-lg) 0;
}
.lp-recomendam__item-icon svg {
width: 24px;
height: 24px;
}
.lp-recomendam__quote {
filter: drop-shadow(0 10px 20px rgba(19, 23, 26, 0.10));
}
.lp-recomendam__quote-mark {
opacity: 0.55;
}
.lp-recomendam__media::before {
display: none;
}
.lp-recomendam__media::after {
left: calc(-1 * var(--container-padding));
right: calc(-1 * var(--container-padding));
width: auto;
top: clamp(70px, 24vw, 100px);
bottom: 0;
background: url('../images/lp/recomendam-painel-mobile.webp') top center / 100% 100% no-repeat;
border-radius: 0;
clip-path: none;
}
.lp-recomendam__glass {
--glass-chamfer: clamp(22px, 6vw, 32px);
padding: clamp(26px, 9vw, 36px) clamp(16px, 5vw, 26px) clamp(22px, 6vw, 30px) clamp(24px, 8vw, 34px);
}
.lp-recomendam__watermark {
width: 300px;
right: -90px;
}
.lp-recomendam__inner {
grid-template-columns: 1fr;
gap: var(--gap-lg);
}
.lp-recomendam__media {
order: 2;
padding-bottom: clamp(24px, 7vw, 34px);
}
.lp-recomendam__phone {
width: min(265px, 70vw);
}
.lp-recomendam__phone-caption {
top: auto;
bottom: 22%;
transform: none;
font-family: var(--font-text);
font-weight: 400;
font-size: clamp(13px, 3.8vw, 16px);
line-height: 1.3;
text-transform: none;
color: #FFF;
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55), 0 0 10px rgba(0, 0, 0, 0.35);
}
.lp-recomendam__content {
max-width: 100%;
}
.lp-recomendam__quote {
max-width: 100%;
}
.lp-recomendam__cta-frame,
.lp-recomendam__cta-frame .srv-cta__btn {
width: 100%;
}
.lp-recomendam__cta-frame .srv-cta__btn {
justify-content: center;
white-space: normal;
text-align: center;
}
}

/* lp-solucoes.css */
.lp-solucoes {
background: #F8F9FC;
padding: var(--section-pad-xl) 0;
position: relative;
overflow: hidden;
}
.lp-solucoes__header {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: var(--gap-lg);
margin-bottom: var(--gap-md);
}
.lp-solucoes__text {
max-width: 780px;
}
.lp-solucoes__label {
display: flex;
align-items: center;
gap: clamp(10px, 0.63vw, 12px);
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.7;
color: #212121;
margin-bottom: clamp(6px, 0.42vw, 8px);
}
.lp-solucoes__line {
display: inline-block;
width: var(--line-width);
height: 0;
border-top: 1px solid var(--color-primary);
flex-shrink: 0;
}
.lp-solucoes__title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-section-lg);
line-height: 1.25;
color: #212121;
margin-bottom: clamp(10px, 0.83vw, 16px);
text-wrap: balance;
}
.lp-solucoes__title span {
color: var(--color-primary);
}
.lp-solucoes__desc {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body-sm);
line-height: 1.7;
color: #555;
text-wrap: pretty;
}
.lp-solucoes__nav {
display: flex;
gap: var(--gap-content);
flex-shrink: 0;
}
.lp-solucoes__nav-btn {
display: flex;
align-items: center;
justify-content: center;
width: var(--btn-size);
height: var(--btn-size);
border: 1px solid var(--color-bg-navy);
border-radius: 50%;
background: var(--color-bg-navy);
color: var(--color-white);
cursor: pointer;
transition: background var(--transition-fast), color var(--transition-fast),
border-color var(--transition-fast), transform 120ms ease-out;
}
.lp-solucoes__nav-btn svg {
width: clamp(14px, 1.04vw, 20px);
height: clamp(14px, 1.04vw, 20px);
}
.lp-solucoes__nav-btn:not(.is-disabled):hover {
background: #2a4f7a;
border-color: #2a4f7a;
color: var(--color-white);
}
.lp-solucoes__nav-btn:active {
transform: scale(0.9);
}
.lp-solucoes__nav-btn.is-disabled {
background: var(--color-white);
border-color: #E4E7EC;
color: var(--color-bg-navy);
cursor: default;
}
.lp-solucoes__carousel {
position: relative;
}
.lp-solucoes__track {
display: flex;
gap: var(--gap-card);
overflow-x: auto;
scroll-snap-type: x proximity;
-webkit-overflow-scrolling: touch;
padding-left: max(var(--container-padding), calc((100% - var(--container-width)) / 2 + var(--container-padding)));
scroll-padding-left: max(var(--container-padding), calc((100% - var(--container-width)) / 2 + var(--container-padding)));
padding-right: var(--gap-card);
padding-top: clamp(4px, 0.42vw, 8px);
padding-bottom: clamp(10px, 0.83vw, 16px);
scrollbar-width: none;
-ms-overflow-style: none;
}
.lp-solucoes__track::-webkit-scrollbar {
display: none;
}
.lp-solucoes__card {
--card-chanfro-x: clamp(64px, 5.9vw, 88px);
--card-chanfro-y: clamp(51px, 4.7vw, 70px);
clip-path: polygon(
0 0,
calc(100% - var(--card-chanfro-x)) 0,
100% var(--card-chanfro-y),
100% 100%,
0 100%
);
flex: 0 0 clamp(260px, 24vw, 360px);
scroll-snap-align: start;
scroll-snap-stop: always;
display: flex;
flex-direction: column;
background: var(--color-white);
border: 1px solid #E2E8F0;
border-radius: 12px;
overflow: hidden;
filter: drop-shadow(0 1px 2px rgba(16, 24, 40, 0.05)) drop-shadow(0 4px 8px rgba(16, 24, 40, 0.05));
transition: transform var(--transition-fast), filter var(--transition-fast);
}
.lp-solucoes__card:hover {
transform: translateY(-4px);
filter: drop-shadow(0 2px 4px rgba(16, 24, 40, 0.07)) drop-shadow(0 10px 18px rgba(16, 24, 40, 0.10));
}
.lp-solucoes__card:focus-visible {
outline: 2px solid var(--color-bg-navy);
outline-offset: 3px;
}
.lp-solucoes__card-image {
width: 100%;
aspect-ratio: 4 / 3;
--step: clamp(34px, 5vw, 60px);
clip-path: polygon(
0 0,
100% 0,
100% 100%,
calc(100% - var(--step)) calc(100% - var(--step)),
0 calc(100% - var(--step))
);
background-color: transparent;
overflow: hidden;
}
.lp-solucoes__card-image img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center top;
display: block;
}
.lp-solucoes__card-body {
flex: 1;
display: flex;
flex-direction: column;
align-items: flex-start;
padding: clamp(14px, 1.04vw, 20px);
}
.lp-solucoes__card-title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-card-title);
line-height: 1.25;
color: #212121;
margin-bottom: clamp(6px, 0.42vw, 8px);
}
.lp-solucoes__card-lead {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body-sm);
line-height: 1.5;
color: #212121;
margin-bottom: clamp(8px, 0.6vw, 12px);
}
.lp-solucoes__card-desc {
flex: 1 1 auto;
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-caption);
line-height: 1.55;
color: #666;
margin-bottom: clamp(12px, 1vw, 18px);
}
.lp-solucoes__card-arrow {
display: inline-flex;
align-items: center;
justify-content: center;
width: clamp(26px, 1.67vw, 32px);
height: clamp(26px, 1.67vw, 32px);
border-radius: 8px;
background: var(--color-bg-navy);
color: var(--color-white);
flex-shrink: 0;
transition: background var(--transition-fast);
}
.lp-solucoes__card-arrow svg {
width: clamp(13px, 0.83vw, 16px);
height: clamp(13px, 0.83vw, 16px);
}
.lp-solucoes__card:hover .lp-solucoes__card-arrow {
background: #2a4f7a;
}
.lp-solucoes__nav-bottom {
display: none;
}
.lp-solucoes__dots {
display: inline-flex;
align-items: center;
gap: 8px;
}
.lp-solucoes__dot {
width: 8px;
height: 8px;
border-radius: 50%;
background: #D5D9E2;
transition: background var(--transition-fast);
}
.lp-solucoes__dot--active {
background: var(--color-bg-navy);
}
@media (max-width: 900px) {
.lp-solucoes__header {
flex-direction: column;
align-items: flex-start;
gap: var(--gap-sm);
}
.lp-solucoes__nav {
display: none;
}
.lp-solucoes__nav-btn svg {
width: 20px;
height: 20px;
}
.lp-solucoes__card-arrow {
width: clamp(32px, 9.5vw, 38px);
height: clamp(32px, 9.5vw, 38px);
border-radius: 6px;
}
.lp-solucoes__card-arrow svg {
width: 18px;
height: 18px;
}
.lp-solucoes__card-image {
--step: clamp(38px, 13vw, 56px);
aspect-ratio: auto;
height: clamp(200px, 60vw, 240px);
}
.lp-solucoes__card-body {
padding: clamp(20px, 6.4vw, 26px);
}
.lp-solucoes__card-lead {
font-size: 14px;
}
.lp-solucoes__nav-bottom {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: clamp(16px, 4.5vw, 24px);
}
.lp-solucoes__track {
padding-left: var(--container-padding);
scroll-padding-left: var(--container-padding);
}
.lp-solucoes__card {
flex-basis: min(78vw, 300px);
}
.lp-solucoes__card {
--card-chanfro-x: clamp(61px, 19vw, 73px);
--card-chanfro-y: clamp(49px, 15.2vw, 59px);
}
}

/* lp-casos.css */
.lp-casos {
background: var(--color-white);
padding: var(--section-pad-xl) 0;
}
.lp-casos__header {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: clamp(32px, 4.4vw, 80px);
margin-bottom: clamp(24px, 2.2vw, 40px);
}
.lp-casos__header-left {
flex: 1 1 auto;
min-width: 0;
}
.lp-casos__header-right {
flex: 0 1 auto;
}
.lp-casos__label {
display: flex;
align-items: center;
gap: clamp(10px, 0.63vw, 12px);
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.7;
color: #212121;
margin-bottom: clamp(6px, 0.42vw, 8px);
}
.lp-casos__line {
width: var(--line-width);
height: 0;
border-top: 1px solid var(--color-primary);
flex-shrink: 0;
}
.lp-casos__title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-section-lg);
line-height: 1.19;
color: #212121;
max-width: clamp(320px, 47vw, 640px);
text-wrap: balance;
}
.lp-casos__title span {
color: var(--color-primary);
}
.lp-casos__desc {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body-sm);
line-height: 1.7;
color: #555;
max-width: clamp(260px, 26.5vw, 360px);
text-wrap: pretty;
}
.lp-casos__grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: var(--gap-card);
}
.lp-casos__card {
position: relative;
isolation: isolate;
margin: 0;
width: 100%;
aspect-ratio: 340 / 400;
border-radius: clamp(10px, 0.63vw, 12px);
overflow: hidden;
background: #E8E8E8;
box-shadow: 0 4px 18px rgba(19, 23, 26, 0.10);
cursor: ew-resize;
user-select: none;
-webkit-user-select: none;
touch-action: pan-y;
}
.lp-casos__layer {
position: absolute;
inset: 0;
}
.lp-casos__layer--depois {
z-index: 1;
}
.lp-casos__layer--antes {
z-index: 2;
clip-path: inset(0 50% 0 0);
}
.lp-casos__layer img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
pointer-events: none;
}
.lp-casos__tag {
position: absolute;
top: clamp(10px, 0.83vw, 12px);
z-index: 4;
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-caption-sm);
line-height: 1.4;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--color-white);
padding: clamp(3px, 0.28vw, 4px) clamp(8px, 0.7vw, 10px);
border-radius: 6px;
pointer-events: none;
}
.lp-casos__tag--antes {
left: clamp(10px, 0.83vw, 12px);
background: rgba(19, 23, 26, 0.65);
}
.lp-casos__tag--depois {
right: clamp(10px, 0.83vw, 12px);
background: var(--color-primary);
}
.lp-casos__handle {
position: absolute;
top: 50%;
left: 50%;
z-index: 3;
width: clamp(28px, 2vw, 32px);
height: clamp(28px, 2vw, 32px);
transform: translate(-50%, -50%);
display: flex;
align-items: center;
justify-content: center;
background: var(--color-white);
color: var(--color-primary);
border-radius: 50%;
box-shadow: 0 2px 10px rgba(19, 23, 26, 0.35);
pointer-events: none;
}
.lp-casos__handle::before {
content: '';
position: absolute;
top: -1000px;
bottom: -1000px;
left: 50%;
width: 2px;
transform: translateX(-50%);
background: var(--color-white);
z-index: -1;
}
.lp-casos__handle svg {
width: clamp(12px, 0.9vw, 14px);
height: clamp(12px, 0.9vw, 14px);
}
.lp-casos__caption {
position: absolute;
z-index: 4;
left: clamp(10px, 0.83vw, 12px);
right: clamp(10px, 0.83vw, 12px);
bottom: clamp(10px, 0.83vw, 12px);
display: flex;
flex-direction: column;
gap: clamp(1px, 0.14vw, 2px);
padding: clamp(8px, 0.63vw, 12px) clamp(10px, 0.83vw, 14px);
background: rgba(19, 23, 26, 0.55);
backdrop-filter: blur(6px);
-webkit-backdrop-filter: blur(6px);
border-radius: 8px;
pointer-events: none;
}
.lp-casos__caption-name {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-label);
line-height: 1.3;
color: var(--color-white);
}
.lp-casos__caption-city {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-caption);
line-height: 1.5;
color: var(--color-text-light);
}
.lp-casos__cta {
display: flex;
justify-content: center;
margin-top: clamp(28px, 2.5vw, 48px);
}
.lp-casos__cta-frame::before {
background: linear-gradient(45deg, transparent 38%, #BBD3EE 100%);
}
@media (max-width: 900px) {
.lp-casos__header {
flex-direction: column;
align-items: flex-start;
gap: clamp(16px, 3vw, 24px);
}
.lp-casos__title,
.lp-casos__desc {
max-width: 100%;
}
.lp-casos__grid {
grid-template-columns: 1fr;
max-width: 420px;
margin: 0 auto;
}
.lp-casos__card {
aspect-ratio: 9 / 14;
}
.lp-casos__cta-frame,
.lp-casos__cta .srv-cta__btn {
width: 100%;
}
.lp-casos__cta .srv-cta__btn {
justify-content: center;
white-space: normal;
text-align: center;
}
}

/* lp-metodo-trabalho.css */
.lp-metodo {
background: linear-gradient(180deg,
var(--color-white) 0%,
var(--color-white) 46%,
#EEF2FB 46%,
#EEF2FB 100%);
padding: var(--section-pad-xl) 0;
}
.lp-metodo__header {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(280px, clamp(380px, 39vw, 560px));
gap: clamp(24px, 3vw, 64px);
align-items: start;
margin-bottom: clamp(32px, 3vw, 56px);
}
.lp-metodo__label {
display: flex;
align-items: center;
gap: clamp(10px, 0.63vw, 12px);
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.7;
color: #212121;
margin-bottom: clamp(6px, 0.42vw, 8px);
}
.lp-metodo__line {
display: inline-block;
width: var(--line-width);
height: 0;
border-top: 1px solid var(--color-primary);
flex-shrink: 0;
}
.lp-metodo__title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-section-lg);
line-height: 1.2;
color: #212121;
}
.lp-metodo__desc {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.7;
color: #454545;
margin-top: clamp(2px, 0.2vw, 4px);
}
.lp-metodo__card {
position: relative;
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: clamp(20px, 2.2vw, 40px);
background: var(--color-white);
padding: clamp(28px, 2.9vw, 56px) clamp(24px, 2.7vw, 52px);
clip-path: url(#lp-metodo-clip);
filter: drop-shadow(0 12px 28px rgba(16, 24, 40, 0.08));
}
.lp-metodo__icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: clamp(42px, 3.4vw, 52px);
height: clamp(42px, 3.4vw, 52px);
border-radius: clamp(10px, 0.8vw, 13px);
background: #EEF3FF;
border: 1px solid rgba(21, 94, 239, 0.22);
color: #155EEF;
margin-bottom: clamp(14px, 1.25vw, 22px);
}
.lp-metodo__icon img {
display: block;
width: clamp(20px, 1.45vw, 26px);
height: clamp(20px, 1.45vw, 26px);
}
.lp-metodo__item-title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-card-title);
line-height: 1.3;
color: #212121;
margin-bottom: clamp(8px, 0.63vw, 12px);
}
.lp-metodo__item-desc {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body-sm);
line-height: 1.7;
color: #555;
}
.lp-page .method {
background: #EEF2FB;
}
.lp-page .method__step-number {
color: #8A93A3;
}
.lp-page .method__cta-border {
background:
linear-gradient(#EEF2FB, #EEF2FB) padding-box,
linear-gradient(302.1deg, rgba(21, 94, 239, 0.39) 24.57%, rgba(21, 94, 239, 0) 70.33%) border-box;
}
@media (max-width: 1024px) {
.lp-metodo__card {
grid-template-columns: repeat(3, 1fr);
row-gap: clamp(28px, 3.5vw, 40px);
}
}
@media (max-width: 900px) {
.lp-metodo__header {
grid-template-columns: 1fr;
gap: var(--gap-sm);
}
.lp-metodo__card {
grid-template-columns: 1fr;
gap: clamp(26px, 8vw, 40px);
padding: clamp(28px, 8.5vw, 40px) clamp(22px, 6.5vw, 34px);
border: 1px solid #E2E8F0;
clip-path: polygon(
0 0,
100% 0,
100% calc(100% - clamp(34px, 11vw, 52px)),
calc(100% - clamp(34px, 11vw, 52px)) 100%,
0 100%
);
border-radius: clamp(12px, 3.5vw, 16px);
}
.lp-metodo__icon {
width: clamp(44px, 13vw, 52px);
height: clamp(44px, 13vw, 52px);
margin-bottom: clamp(14px, 4vw, 20px);
}
.lp-metodo__icon img {
width: clamp(24px, 7vw, 28px);
height: clamp(24px, 7vw, 28px);
}
}
@media (max-width: 560px) {
.lp-metodo__card {
grid-template-columns: 1fr;
}
}

/* method.css */
.method {
position: relative;
background: #EFF4FF;
overflow: hidden;
padding-top: var(--section-pad-lg);
clip-path: polygon(
0 0,
100% 0,
100% calc(100% - var(--hero-clip-v)),
calc(100% - var(--hero-clip-h)) 100%,
var(--hero-clip-h) 100%,
0 calc(100% - var(--hero-clip-v))
);
}
.method__header {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: clamp(6px, 0.42vw, 8px);
position: relative;
z-index: 2;
margin-bottom: var(--gap-md);
}
.method__label {
display: flex;
align-items: center;
gap: clamp(10px, 0.63vw, 12px);
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-label);
line-height: 1.7;
letter-spacing: -0.01em;
color: #212121;
}
.method__line {
display: inline-block;
width: var(--line-width);
height: 0;
border-top: 1px solid var(--color-primary);
flex-shrink: 0;
}
.method__title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-section-lg);
line-height: 1.19;
color: #212121;
max-width: clamp(320px, 56vw, 760px);
text-wrap: balance;
}
.method__intro {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.7;
color: #51525C;
max-width: min(100%, clamp(300px, 75vw, 960px));
margin-top: clamp(16px, 1.04vw, 20px);
text-wrap: pretty;
}
.method__content {
display: grid;
grid-template-columns: 1fr 1fr;
align-items: start;
gap: clamp(8px, 1vw, 14px);
position: relative;
z-index: 2;
padding-bottom: var(--section-pad-md);
}
.method__steps {
width: 100%;
max-width: none;
display: flex;
flex-direction: column;
gap: var(--gap-card);
}
.method__step {
display: grid;
grid-template-columns: auto 1fr;
column-gap: var(--gap-content);
row-gap: clamp(2px, 0.21vw, 4px);
}
.method__step-header {
display: contents;
}
.method__step-number {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-step-number);
line-height: 1.4;
color: #212121;
flex-shrink: 0;
}
.method__step-title {
font-family: var(--font-heading);
font-weight: 500;
font-size: var(--fs-step);
line-height: 1.27;
color: #212121;
}
.method__step-description {
grid-column: 2;
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.7;
letter-spacing: -0.01em;
color: #212121;
}
.method__illustration {
display: flex;
align-items: center;
justify-content: flex-end;
width: 100%;
min-width: 0;
}
.method__illustration img {
display: block;
width: auto;
max-width: min(100%, clamp(480px, 39vw, 777.6px));
height: auto;
margin-left: auto;
}
.method__cta-wrapper {
display: flex;
justify-content: center;
position: relative;
z-index: 2;
padding-bottom: var(--section-pad-md);
}
.method__cta-border {
padding: clamp(6px, 0.42vw, 8px);
border-radius: clamp(12px, 0.83vw, 16px);
border: 1px solid transparent;
background:
linear-gradient(#EFF4FF, #EFF4FF) padding-box,
linear-gradient(302.1deg, rgba(21, 94, 239, 0.39) 24.57%, rgba(21, 94, 239, 0) 70.33%) border-box;
}
.method__cta {
display: inline-flex;
align-items: center;
justify-content: center;
gap: clamp(10px, 0.63vw, 12px);
padding: var(--cta-pad-y) var(--cta-pad-x);
background: #1F3A5F;
color: var(--color-white);
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--cta-font);
line-height: 1.33;
border-radius: clamp(10px, 0.63vw, 12px);
transition: background var(--transition-fast);
white-space: nowrap;
}
.method__cta:hover {
background: #2a4f7a;
}
.method__cta svg {
width: var(--cta-icon);
height: var(--cta-icon);
}
@media (max-width: 768px) {
.method {
clip-path: none;
}
.method__header {
align-items: center;
text-align: center;
}
.method__intro {
width: min(100%, clamp(300px, 92vw, 520px));
max-width: none;
}
.method__content {
grid-template-columns: 1fr;
gap: clamp(24px, 2.08vw, 32px);
}
.method__steps {
max-width: none;
}
.method__illustration {
justify-content: center;
margin-left: clamp(-12px, -0.83vw, -16px);
margin-right: clamp(-12px, -0.83vw, -16px);
width: calc(100% + clamp(24px, 1.67vw, 32px));
}
.method__illustration img {
max-width: 100%;
width: 100%;
margin-left: 0;
}
.method__cta {
padding: var(--cta-pad-y) clamp(20px, 1.46vw, 28px);
white-space: normal;
text-align: center;
width: 100%;
}
.method__cta-border {
width: 100%;
}
}

/* lp-depoimento.css */
.lp-depoimento {
position: relative;
overflow: hidden;
isolation: isolate;
background: var(--color-bg-light);
padding: var(--section-pad-xl) 0;
}
.lp-depoimento__watermark {
position: absolute;
bottom: 0;
left: 0;
width: clamp(420px, 52vw, 820px);
aspect-ratio: 1162 / 481;
background: url('../images/lp/watermark-sketch-edificio.webp') no-repeat left bottom / contain;
pointer-events: none;
user-select: none;
z-index: 0;
}
.lp-depoimento__inner {
position: relative;
z-index: 1;
display: grid;
grid-template-columns: minmax(0, 1fr) clamp(340px, 38vw, 540px);
gap: clamp(32px, 4vw, 80px);
align-items: center;
}
.lp-depoimento__content {
max-width: min(100%, clamp(360px, 46vw, 620px));
}
.lp-depoimento__label {
display: flex;
align-items: center;
gap: clamp(10px, 0.63vw, 12px);
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.7;
color: #212121;
margin-bottom: clamp(6px, 0.42vw, 8px);
}
.lp-depoimento__line {
width: var(--line-width);
height: 0;
border-top: 1px solid var(--color-primary);
flex-shrink: 0;
}
.lp-depoimento__title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-section-lg);
line-height: 1.22;
color: #212121;
max-width: 560px;
margin-bottom: clamp(12px, 1.04vw, 20px);
text-wrap: balance;
}
.lp-depoimento__title span {
color: var(--color-primary);
}
.lp-depoimento__desc {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.7;
color: #555;
max-width: 540px;
margin-bottom: 0;
text-wrap: pretty;
}
.lp-depoimento__cta-frame {
display: inline-flex;
margin-top: clamp(24px, 2.08vw, 40px);
}
.lp-depoimento__cta-frame::before {
background: linear-gradient(45deg, transparent 38%, #BBD3EE 100%);
}
.lp-depoimento__media {
--dep-chamfer: clamp(130px, 17vw, 245px);
position: relative;
width: 100%;
padding:
clamp(36px, 3.6vw, 60px)
clamp(28px, 3vw, 56px)
clamp(32px, 3.2vw, 60px)
clamp(18px, 2vw, 36px);
}
.lp-depoimento__media::before {
content: '';
position: absolute;
inset: 0;
border: 1px solid rgba(187, 211, 238, 0.9);
border-radius: 0 clamp(18px, 1.8vw, 26px) clamp(18px, 1.8vw, 26px) clamp(18px, 1.8vw, 26px);
clip-path: polygon(
0 var(--dep-chamfer),
var(--dep-chamfer) 0,
100% 0,
100% 100%,
0 100%
);
pointer-events: none;
z-index: 0;
}
.lp-depoimento__media::after {
content: '';
position: absolute;
top: var(--dep-chamfer);
left: 0;
width: calc(var(--dep-chamfer) * 1.41422);
height: 0;
border-top: 1px solid rgba(187, 211, 238, 0.9);
transform: rotate(-45deg);
transform-origin: 0 0;
pointer-events: none;
z-index: 0;
}
.lp-depoimento__phone {
position: relative;
isolation: isolate;
width: 100%;
max-width: clamp(230px, 17.6vw, 290px);
aspect-ratio: 9 / 18.5;
margin: 0 auto 0 clamp(12px, 2.4vw, 44px);
overflow: hidden;
border: clamp(4.8px, 0.44vw, 8px) solid #1F3A5F;
border-radius: clamp(28px, 2.6vw, 40px);
background: var(--color-dark);
box-shadow:
0 0 0 clamp(4.8px, 0.44vw, 8px) #3D5F8A,
0 24px 56px rgba(19, 23, 26, 0.20);
z-index: 1;
}
.lp-depoimento__phone-video {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
border: 0;
display: block;
z-index: 1;
}
.lp-depoimento__phone-img {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
.lp-depoimento__phone-shade {
position: absolute;
inset: auto 0 0 0;
height: 30%;
background: linear-gradient(180deg, rgba(19, 23, 26, 0) 0%, rgba(19, 23, 26, 0.28) 70%, rgba(19, 23, 26, 0.45) 100%);
pointer-events: none;
z-index: 1;
}
.lp-depoimento__phone-caption {
position: absolute;
left: clamp(16px, 1.25vw, 22px);
right: clamp(16px, 1.25vw, 22px);
bottom: 27%;
z-index: 2;
margin: 0;
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.4;
text-align: center;
color: var(--color-white);
text-shadow: 0 1px 3px rgba(10, 15, 21, 0.65), 0 3px 10px rgba(10, 15, 21, 0.35);
}
.lp-depoimento__quote {
position: absolute;
right: 0;
bottom: clamp(16px, 1.8vw, 32px);
z-index: 3;
width: max-content;
max-width: min(300px, 78%);
margin: 0;
padding: clamp(16px, 1.35vw, 24px);
background: var(--color-white);
border-radius: clamp(12px, 1vw, 16px);
box-shadow: 0 18px 40px rgba(19, 23, 26, 0.14);
}
.lp-depoimento__quote-mark {
position: absolute;
top: clamp(8px, 0.7vw, 12px);
left: clamp(10px, 0.9vw, 16px);
width: clamp(38px, 3.2vw, 52px);
height: auto;
color: #EFF2F6;
z-index: 0;
pointer-events: none;
}
.lp-depoimento__quote-text {
position: relative;
z-index: 1;
margin: 0 0 clamp(10px, 0.83vw, 14px);
}
.lp-depoimento__quote-text p {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-caption);
line-height: 1.6;
color: #454545;
margin: 0;
}
.lp-depoimento__quote-foot {
position: relative;
z-index: 1;
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: clamp(10px, 0.83vw, 16px);
}
.lp-depoimento__quote-author {
display: flex;
flex-direction: column;
gap: 2px;
min-width: 0;
}
.lp-depoimento__quote-name {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-caption);
line-height: 1.3;
color: var(--color-primary);
}
.lp-depoimento__quote-role {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-caption-sm);
line-height: 1.3;
color: #888;
}
.lp-depoimento__quote-dots {
display: flex;
align-items: center;
gap: clamp(4px, 0.31vw, 6px);
flex-shrink: 0;
padding-bottom: 2px;
}
.lp-depoimento__dot {
width: clamp(5px, 0.42vw, 6px);
height: clamp(5px, 0.42vw, 6px);
border-radius: 999px;
background: var(--color-text-light);
}
.lp-depoimento__dot--active {
width: clamp(14px, 1.15vw, 18px);
background: #1F3A5F;
}
.lp-investimento {
background: var(--color-white);
padding: var(--section-pad-xl) 0;
}
.lp-investimento__inner {
display: grid;
grid-template-columns: minmax(0, 40fr) minmax(0, 60fr);
gap: clamp(32px, 4vw, 72px);
align-items: center;
}
.lp-investimento__gallery {
display: grid;
grid-template-columns: 36fr 64fr;
grid-template-rows: 25fr 28fr auto;
gap: clamp(8px, 0.83vw, 12px);
}
.lp-investimento__cell {
position: relative;
min-width: 0;
min-height: 0;
overflow: hidden;
border-radius: clamp(10px, 0.83vw, 12px);
background: #E8E8E8;
}
.lp-investimento__cell img {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
.lp-investimento__cell--a {
grid-column: 1 / 2;
grid-row: 1 / 3;
aspect-ratio: 53 / 100;
}
.lp-investimento__cell--a::after {
content: '';
position: absolute;
right: calc(-1 * clamp(4px, 1.2vw, 7px));
bottom: 6%;
width: clamp(4px, 1.2vw, 7px);
height: 42%;
background: var(--color-primary);
pointer-events: none;
}
.lp-investimento__cell--b {
grid-column: 2 / 3;
grid-row: 1 / 2;
}
.lp-investimento__cell--b {
background: transparent;
}
.lp-investimento__cell--b img {
object-position: center top;
}
.lp-investimento__cell--c {
grid-column: 2 / 3;
grid-row: 2 / 3;
}
.lp-investimento__cell--c::after {
content: '';
position: absolute;
left: 49%;
width: 39%;
bottom: 0;
height: clamp(4px, 0.42vw, 7px);
background: #155EEF;
pointer-events: none;
}
.lp-investimento__cell--d {
grid-column: 1 / 3;
grid-row: 3 / 4;
aspect-ratio: 484 / 246;
}
.lp-investimento__content {
max-width: min(100%, clamp(360px, 56vw, 760px));
}
.lp-investimento__label {
display: flex;
align-items: center;
gap: clamp(10px, 0.63vw, 12px);
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.7;
color: #212121;
margin-bottom: clamp(6px, 0.42vw, 8px);
}
.lp-investimento__line {
width: var(--line-width);
height: 0;
border-top: 1px solid var(--color-primary);
flex-shrink: 0;
}
.lp-investimento__title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-section-lg);
line-height: 1.22;
color: #212121;
max-width: 620px;
margin-bottom: clamp(16px, 1.25vw, 24px);
text-wrap: balance;
}
.lp-investimento__text {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body-sm);
line-height: 1.7;
color: #454545;
margin-bottom: clamp(10px, 0.83vw, 14px);
text-wrap: pretty;
}
.lp-investimento__text:last-of-type {
margin-bottom: 0;
}
.lp-investimento__text strong {
font-weight: 600;
color: var(--color-primary);
}
.lp-investimento__cta {
display: inline-flex;
margin-top: clamp(20px, 1.67vw, 32px);
}
.lp-investimento__cta::before {
background: linear-gradient(45deg, transparent 38%, #BBD3EE 100%);
}
.lp-investimento__cta-mobile {
display: none;
}
@media (max-width: 900px) {
.lp-depoimento,
.lp-investimento {
padding: var(--section-pad-lg) 0;
}
.lp-depoimento__watermark {
width: 300px;
}
.lp-depoimento__media {
--dep-chamfer: clamp(78px, 24vw, 110px);
padding:
clamp(20px, 6vw, 30px)
clamp(14px, 4vw, 22px)
clamp(24px, 7vw, 34px)
clamp(12px, 3.5vw, 20px);
}
.lp-depoimento__inner,
.lp-investimento__inner {
grid-template-columns: 1fr;
gap: var(--gap-lg);
}
.lp-depoimento__content,
.lp-investimento__content {
max-width: 100%;
}
.lp-depoimento__media {
max-width: min(340px, 92vw);
margin-inline: auto;
}
.lp-depoimento__cta-frame,
.lp-depoimento__cta-frame .srv-cta__btn {
width: 100%;
}
.lp-depoimento__cta-frame .srv-cta__btn {
justify-content: center;
white-space: normal;
text-align: center;
}
.lp-investimento__gallery {
order: 2;
}
.lp-investimento__cta {
display: none;
}
.lp-investimento__cta-mobile {
display: inline-flex;
order: 3;
width: 100%;
margin-top: clamp(4px, 1vw, 8px);
}
.lp-investimento__cta-mobile::before {
background: linear-gradient(45deg, transparent 38%, #BBD3EE 100%);
}
.lp-investimento__cta-mobile .srv-cta__btn {
width: 100%;
justify-content: center;
white-space: normal;
text-align: center;
}
.lp-depoimento__phone {
margin: 0 auto;
}
.lp-depoimento__quote {
position: relative;
max-width: 100%;
margin-top: -28px;
margin-left: auto;
margin-right: auto;
width: auto;
}
}

/* lp-faq.css */
.lp-faq {
padding: var(--section-pad-xl) 0;
background: #F8F9FC;
}
.lp-faq__inner {
display: flex;
align-items: flex-start;
gap: clamp(40px, 5.2vw, 80px);
}
.lp-faq__intro {
flex: 0 0 40%;
max-width: 500px;
}
.lp-faq__label {
display: flex;
align-items: center;
gap: clamp(10px, 0.63vw, 12px);
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.7;
color: #212121;
margin-bottom: clamp(6px, 0.42vw, 8px);
}
.lp-faq__line {
width: var(--line-width);
height: 0;
border-top: 1px solid var(--color-primary);
flex-shrink: 0;
}
.lp-faq__title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-section-lg);
line-height: 1.22;
color: #212121;
margin: 0;
text-wrap: pretty;
}
.lp-faq__title-em {
color: var(--color-primary);
}
.lp-faq__text {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body-sm);
line-height: 1.7;
color: #555;
margin: clamp(12px, 1.04vw, 20px) 0 0;
}
.lp-faq__help {
display: flex;
align-items: flex-start;
gap: var(--gap-content);
margin-top: clamp(24px, 2.2vw, 40px);
}
.lp-faq__help-icon {
display: inline-flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
width: var(--btn-size);
height: var(--btn-size);
border-radius: clamp(8px, 0.52vw, 10px);
background: #1F3A5F;
color: var(--color-white);
}
.lp-faq__help-icon svg {
width: clamp(18px, 1.15vw, 22px);
height: clamp(18px, 1.15vw, 22px);
}
.lp-faq__help-text {
min-width: 0;
}
.lp-faq__help-title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-body);
line-height: 1.3;
color: #212121;
margin: 0 0 clamp(4px, 0.31vw, 6px);
}
.lp-faq__help-desc {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-caption);
line-height: 1.6;
color: #666;
margin: 0;
}
.lp-faq__action {
margin-top: clamp(16px, 1.35vw, 24px);
}
.lp-faq__btn {
text-decoration: none;
}
.lp-faq__accordion {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
gap: clamp(10px, 0.83vw, 12px);
}
.lp-faq__item {
background: var(--color-white);
border: 1px solid #E4E7EC;
border-left: 4px solid var(--color-primary);
border-radius: 10px;
padding: clamp(14px, 1.15vw, 22px) clamp(16px, 1.35vw, 26px);
box-shadow: 0 1px 3px rgba(19, 23, 26, 0.05);
transition: border-color var(--transition-base), box-shadow var(--transition-base);
interpolate-size: allow-keywords;
}
.lp-faq__item[open] {
border-color: #E4E7EC;
border-left-color: var(--color-primary);
box-shadow: 0 4px 14px rgba(19, 23, 26, 0.07);
}
.lp-faq__item::details-content {
block-size: 0;
overflow: clip;
opacity: 0;
transition:
block-size 0.3s ease,
opacity 0.2s ease,
content-visibility 0.3s ease allow-discrete;
}
.lp-faq__item[open]::details-content {
block-size: auto;
opacity: 1;
}
.lp-faq__question {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: var(--gap-content);
cursor: pointer;
list-style: none;
}
.lp-faq__question::-webkit-details-marker {
display: none;
}
.lp-faq__question::marker {
content: '';
}
.lp-faq__question-text {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-body);
line-height: 1.45;
color: #212121;
}
.lp-faq__icon {
flex-shrink: 0;
width: clamp(16px, 1.15vw, 20px);
height: clamp(16px, 1.15vw, 20px);
margin-top: 2px;
color: var(--color-primary);
transition: transform var(--transition-base);
}
.lp-faq__item[open] > .lp-faq__question .lp-faq__icon {
transform: rotate(180deg);
}
.lp-faq__answer {
padding-top: clamp(8px, 0.63vw, 12px);
}
.lp-faq__answer p {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body-sm);
line-height: 1.7;
color: #555;
margin: 0;
}
@media (max-width: 900px) {
.lp-faq__inner {
flex-direction: column;
gap: clamp(28px, 5vw, 40px);
}
.lp-faq__intro {
flex: none;
max-width: 100%;
}
.lp-faq__accordion {
width: 100%;
}
.lp-faq__action,
.lp-faq__btn {
width: 100%;
}
.lp-faq__btn {
justify-content: center;
white-space: normal;
text-align: center;
}
}
@media (prefers-reduced-motion: reduce) {
.lp-faq__icon,
.lp-faq__item,
.lp-faq__item::details-content {
transition: none;
}
}

/* lp-cta-final.css */
.lp-cta-final {
padding: var(--section-pad-xl) 0;
background: var(--color-bg-light);
}
.lp-cta-final__inner {
max-width: 1216px;
}
.lp-cta-final__card {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: clamp(20px, 1.75vw, 32px);
padding: clamp(32px, 3.4vw, 56px) clamp(28px, 3.9vw, 64px);
isolation: isolate;
background:
linear-gradient(269.99deg, rgba(2, 23, 49, 0) 28.79%, rgba(2, 23, 49, 0.6) 63.68%, rgba(2, 23, 49, 0.75) 75.45%),
linear-gradient(313.43deg, rgba(19, 23, 26, 0) 41.04%, rgba(19, 23, 26, 0.4) 55.49%, rgba(22, 90, 170, 0.8) 106.76%),
url('../images/cta-avaliacao.webp') center / cover no-repeat;
border-radius: 16px;
overflow: hidden;
}
.lp-cta-final__content {
display: flex;
flex-direction: column;
gap: clamp(8px, 0.63vw, 12px);
max-width: 640px;
position: relative;
z-index: 1;
}
.lp-cta-final__label {
display: flex;
align-items: center;
gap: clamp(10px, 0.63vw, 12px);
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-label);
line-height: 1.7;
letter-spacing: -0.01em;
color: var(--color-white);
margin: 0;
}
.lp-cta-final__line {
display: inline-block;
width: var(--line-width);
height: 0;
border-top: 1px solid var(--color-primary);
flex-shrink: 0;
}
.lp-cta-final__title {
font-family: var(--font-heading);
font-weight: 600;
font-size: var(--fs-cta-title);
line-height: 1.2;
color: var(--color-white);
margin: 0;
text-wrap: balance;
}
.lp-cta-final__desc {
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-body);
line-height: 1.7;
letter-spacing: -0.01em;
color: var(--color-white);
margin: clamp(2px, 0.21vw, 4px) 0 0;
max-width: 600px;
text-wrap: pretty;
}
.lp-cta-final__action {
position: relative;
z-index: 2;
}
.lp-cta-final__btn {
text-decoration: none;
}
.lp-cta-final__btn-icon,
.lp-cta-final__btn-arrow {
width: var(--cta-icon);
height: var(--cta-icon);
flex-shrink: 0;
}
.lp-cta-final__btn-label {
display: inline-block;
}
@media (max-width: 900px) {
.lp-cta-final__inner {
padding-left: 24px;
padding-right: 24px;
}
.lp-cta-final__card {
padding: 40px 28px;
background:
linear-gradient(269.99deg, rgba(2, 23, 49, 0.3) 0%, rgba(2, 23, 49, 0.75) 45%, rgba(2, 23, 49, 0.9) 70%),
linear-gradient(313.43deg, rgba(19, 23, 26, 0.2) 20%, rgba(19, 23, 26, 0.6) 45%, rgba(22, 90, 170, 0.8) 106.76%),
url('../images/cta-avaliacao.webp') center / cover no-repeat;
}
.lp-cta-final__content {
max-width: 100%;
}
.lp-cta-final__btn-label {
white-space: normal;
}
.lp-cta-final__action,
.lp-cta-final__action .lp-cta-final__btn {
width: 100%;
}
.lp-cta-final__action .lp-cta-final__btn {
justify-content: center;
text-align: center;
}
}

/* lp-footer.css */
.lp-footer {
background: var(--color-dark);
padding: var(--gap-md) 0;
}
.lp-footer__inner {
display: grid;
grid-template-columns: 1fr auto 1fr;
align-items: center;
gap: clamp(16px, 1.75vw, 32px);
}
.lp-footer__social {
display: flex;
align-items: center;
gap: clamp(16px, 1.5vw, 24px);
list-style: none;
margin: 0;
padding: 0;
justify-self: start;
}
.lp-footer__social-link {
display: inline-flex;
align-items: center;
justify-content: center;
color: var(--color-white);
transition: color var(--transition-fast);
}
.lp-footer__social-link:hover,
.lp-footer__social-link:focus-visible {
color: var(--color-primary);
}
.lp-footer__social-link svg {
display: block;
height: clamp(15px, 1.15vw, 20px);
width: auto;
}
.lp-footer__logo {
display: inline-flex;
justify-self: center;
}
.lp-footer__logo img {
display: block;
width: clamp(110px, 9.5vw, 150px);
height: auto;
}
.lp-footer__copy {
justify-self: end;
margin: 0;
font-family: var(--font-text);
font-weight: 400;
font-size: var(--fs-caption-sm);
line-height: 1.6;
color: var(--color-text-light);
text-align: right;
}
@media (max-width: 900px) {
.lp-footer__inner {
grid-template-columns: 1fr;
justify-items: center;
gap: clamp(14px, 3vw, 20px);
}
.lp-footer__social,
.lp-footer__logo,
.lp-footer__copy {
justify-self: center;
}
.lp-footer__logo {
order: -1;
}
.lp-footer__copy {
text-align: center;
}
.lp-footer__social-link {
min-width: 44px;
min-height: 44px;
}
.lp-footer__social {
gap: clamp(4px, 1.5vw, 12px);
}
}